.board-container{width:100%;aspect-ratio:1;max-width:min(500px,calc(100vh - 280px));max-height:calc(100vh - 280px);margin:0 auto;flex-shrink:0}.board-canvas{display:block;cursor:pointer;border-radius:4px}.problem-card{padding:16px;background:var(--color-card);border-radius:12px;border:1px solid var(--color-border);margin-top:12px}.problem-header{display:flex;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap}.difficulty-badge{color:#fff;font-size:12px;font-weight:600;padding:2px 10px;border-radius:12px}.problem-source{font-size:12px;color:var(--color-text-secondary)}.solved-badge{font-size:11px;color:var(--color-primary);background:#f5ede0;padding:2px 8px;border-radius:10px}.problem-comment{font-size:14px;color:var(--color-text);margin:4px 0 12px}.result-banner{padding:10px 14px;border-radius:8px;font-weight:600;font-size:14px;margin-bottom:12px;animation:slideIn .3s ease}@keyframes slideIn{0%{transform:translateY(-10px);opacity:0}to{transform:translateY(0);opacity:1}}.result-banner.correct{background:#dcfce7;color:#166534}.result-banner.wrong{background:#fef2f2;color:#991b1b}.result-comment{font-weight:400;margin-top:4px;font-size:13px}.problem-actions{display:flex;gap:8px;flex-wrap:wrap}.btn{padding:8px 16px;border:none;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:opacity .15s}.btn:disabled{opacity:.5;cursor:not-allowed}.btn:active:not(:disabled){opacity:.7}.btn-hint{background:#fef3c7;color:#92400e}.btn-solution{background:#f5ede0;color:var(--color-primary)}.btn-next{background:var(--color-primary);color:#fff;margin-left:auto}.btn-back{margin:8px;background:var(--color-bg);color:var(--color-text)}.btn-retry{background:var(--color-primary);color:#fff}.daily-challenge{padding:16px}.daily-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.daily-header h2{font-size:20px;font-weight:700;color:var(--color-text);margin:0}.daily-date{font-size:13px;color:var(--color-text-secondary)}.daily-progress{display:flex;align-items:center;gap:10px;margin-bottom:20px}.progress-bar{flex:1;height:8px;background:var(--color-border);border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--color-accent),var(--color-primary));border-radius:4px;transition:width .3s ease}.progress-text{font-size:14px;font-weight:600;color:var(--color-text);min-width:36px}.difficulty-section{margin-bottom:16px}.difficulty-section h3{font-size:14px;font-weight:600;margin:0 0 8px}.problem-grid{display:flex;gap:10px}.daily-problem-btn{width:56px;height:56px;border:none;border-radius:50%;background:linear-gradient(145deg,#f5f0e8,#e8dfd2);box-shadow:2px 2px 6px #6b422626,-1px -1px 4px #ffffffb3;font-size:15px;font-weight:600;color:var(--color-text);cursor:pointer;transition:all .15s}.daily-problem-btn:active{transform:scale(.95);box-shadow:1px 1px 3px #6b422626}.daily-problem-btn.solved{border:2px solid #16a34a;color:#16a34a}.daily-loading,.daily-empty{padding:40px 16px;text-align:center;color:var(--color-text-secondary)}.leaderboard{padding:16px}.leaderboard h2{font-size:20px;font-weight:700;color:var(--color-text);margin:0 0 12px}.period-tabs{display:flex;gap:4px;background:var(--color-border);border-radius:10px;padding:3px;margin-bottom:16px}.period-tab{flex:1;padding:8px;border:none;border-radius:8px;font-size:13px;font-weight:500;background:transparent;color:var(--color-text-secondary);cursor:pointer;transition:all .15s}.period-tab.active{background:var(--color-card);color:var(--color-text);box-shadow:0 1px 3px #00000014}.my-rank{text-align:center;font-size:14px;color:var(--color-text-secondary);margin-bottom:12px}.leaderboard-list{display:flex;flex-direction:column;gap:4px}.leaderboard-row{display:flex;align-items:center;padding:10px 12px;background:var(--color-card);border-radius:8px;border:1px solid var(--color-border);gap:10px}.leaderboard-row.me{background:#fdf8f0;border:1px solid var(--color-accent)}.lb-rank{font-weight:700;font-size:14px;color:var(--color-text);width:36px}.lb-name{flex:1;font-size:14px;color:var(--color-text);font-weight:500}.lb-solved{font-size:13px;color:var(--color-primary);font-weight:600}.lb-streak{font-size:11px;color:#92400e;background:#fef3c7;padding:2px 6px;border-radius:8px}.leaderboard-loading,.leaderboard-empty{text-align:center;padding:40px 16px;color:var(--color-text-secondary)}.stats{padding:16px}.stats h2{font-size:22px;font-weight:700;color:var(--color-text);margin:0 0 4px}.stats h3{font-size:16px;font-weight:600;color:var(--color-text);margin:20px 0 10px}.stats-username{font-size:14px;color:var(--color-text-secondary);margin:0 0 16px}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.stat-box{background:var(--color-card);border-radius:10px;padding:12px;text-align:center;border:1px solid var(--color-border)}.stat-value{font-size:22px;font-weight:700;color:var(--color-text)}.stat-label{font-size:11px;color:var(--color-text-secondary);margin-top:2px}.difficulty-stats{display:flex;flex-direction:column;gap:6px}.diff-row{display:flex;align-items:center;gap:8px}.diff-label{font-size:13px;color:var(--color-text-secondary);width:60px}.diff-bar-container{flex:1;height:8px;background:var(--color-border);border-radius:4px;overflow:hidden}.diff-bar{height:100%;background:var(--color-accent);border-radius:4px;min-width:2px}.diff-count{font-size:13px;font-weight:600;color:var(--color-text);min-width:28px;text-align:right}.stats-loading,.stats-empty{text-align:center;padding:40px 16px;color:var(--color-text-secondary)}:root{--color-bg: #F5EDE0;--color-primary: #6B4226;--color-accent: #8B6914;--color-card: #ffffff;--color-border: #EDE2D1;--color-text: #3B2F2F;--color-text-secondary: #7A6B5D}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;overscroll-behavior:none}.app{display:flex;flex-direction:column;min-height:100vh;max-width:500px;margin:0 auto}.app-content{flex:1;padding-bottom:64px;overflow-y:auto;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.app-loading,.app-error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;gap:12px;color:var(--color-text-secondary)}.app-error p:first-child{font-size:18px;font-weight:600;color:#dc2626}.error-detail{font-size:13px;color:var(--color-text-secondary)}.page-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 16px;color:var(--color-text-secondary)}.spinner{width:32px;height:32px;border:3px solid var(--color-border);border-top-color:var(--color-accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.tab-bar{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:500px;display:flex;background:#fdf8f0;border-top:1px solid var(--color-border);padding:4px 0;padding-bottom:max(4px,env(safe-area-inset-bottom));z-index:100}.tab-btn{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 0;border:none;background:none;cursor:pointer;color:#b0a090;transition:color .15s}.tab-btn.active{color:var(--color-primary)}.tab-icon{width:22px;height:22px;display:flex;align-items:center;justify-content:center}.tab-icon svg{width:22px;height:22px;fill:currentColor}.tab-label{font-size:10px;font-weight:500}.problem-page{display:flex;flex-direction:column;height:calc(100vh - 64px - env(safe-area-inset-bottom,0px));padding:8px;overflow-y:auto}
