@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap";:root{--bg-page:#fafafa;--bg-card:#fff;--bg-subtle:#f5f5f4;--bg-hover:#f0efee;--bg-active:#eaeae8;--text-primary:#1c1c1c;--text-body:#3c3c3c;--text-secondary:#787878;--text-tertiary:#a0a0a0;--accent:#2563eb;--accent-hover:#1d4ed8;--accent-bg:#eff6ff;--success:#34c759;--success-bg:#f0fbf4;--warning:#ff9500;--warning-bg:#fffbf0;--error:#ff3b30;--error-bg:#fff5f5;--border:#e8e8e8;--border-hover:#d4d4d4;--border-focus:var(--accent);--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--radius:12px;--radius-sm:8px;--radius-xs:4px;--shadow-sm:0 1px 2px #0000000a;--shadow-md:0 2px 8px #0000000f;--shadow-lg:0 8px 24px #00000014;--font:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif}@media (prefers-color-scheme:dark){:root{--bg-page:#141414;--bg-card:#1c1c1e;--bg-subtle:#252528;--bg-hover:#2c2c2f;--bg-active:#3a3a3d;--text-primary:#f5f5f5;--text-body:#d4d4d4;--text-secondary:#9a9a9a;--text-tertiary:#6b6b6b;--accent:#5b9bff;--accent-hover:#4a8aee;--accent-bg:#1a2744;--success:#30d158;--success-bg:#0d2818;--warning:#ffb340;--warning-bg:#2a1f0a;--error:#ff6961;--error-bg:#2a0e0e;--border:#333336;--border-hover:#48484a;--shadow-sm:0 1px 2px #0003;--shadow-md:0 2px 8px #0000004d;--shadow-lg:0 8px 24px #0006}}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{font-family:var(--font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;font-size:16px}body{background:var(--bg-page);color:var(--text-body);min-height:100dvh;line-height:1.5}h1{color:var(--text-primary);letter-spacing:-.02em;font-size:1.5rem;font-weight:600}h2{color:var(--text-primary);letter-spacing:-.01em;font-size:1.25rem;font-weight:500}h3{color:var(--text-primary);font-size:1rem;font-weight:500}.app-layout{flex-direction:column;min-height:100dvh;display:flex}.app-header{z-index:50;background:var(--bg-card);border-bottom:1px solid var(--border);padding:var(--space-sm) var(--space-md);justify-content:space-between;align-items:center;height:56px;display:flex;position:sticky;top:0}.app-header h1{font-size:1.125rem}.app-main{padding:var(--space-md);width:100%;max-width:640px;padding-bottom:calc(56px + var(--space-md) + env(safe-area-inset-bottom,0px));flex:1;margin:0 auto}.app-nav{z-index:50;background:var(--bg-card);border-top:1px solid var(--border);padding:var(--space-xs) 0 env(safe-area-inset-bottom,var(--space-xs));justify-content:space-around;display:flex;position:fixed;bottom:0;left:0;right:0}.nav-item{padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);color:var(--text-tertiary);letter-spacing:.02em;flex-direction:column;align-items:center;gap:2px;font-size:.625rem;font-weight:500;text-decoration:none;transition:color .15s,background .15s;display:flex}.nav-item svg{width:22px;height:22px}.nav-item:hover{color:var(--text-secondary)}.nav-item.active{color:var(--accent);background:var(--accent-bg)}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:var(--space-md);margin-bottom:var(--space-md);transition:box-shadow .2s}.card.active{box-shadow:var(--shadow-md);border-color:var(--border-hover)}.card.done{opacity:.6}.btn{justify-content:center;align-items:center;gap:var(--space-sm);padding:10px var(--space-md);border-radius:var(--radius-sm);cursor:pointer;width:100%;font-size:.875rem;font-weight:500;font-family:var(--font);border:none;text-decoration:none;transition:background .15s,opacity .15s;display:inline-flex}.btn:disabled{opacity:.45;cursor:not-allowed}.btn:hover:not(:disabled){opacity:.9}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover:not(:disabled){background:var(--accent-hover)}.btn-secondary{background:var(--bg-subtle);color:var(--text-body)}.btn-secondary:hover:not(:disabled){background:var(--bg-hover)}.btn-ghost{color:var(--text-secondary);background:0 0}.btn-ghost:hover:not(:disabled){background:var(--bg-subtle)}.input,.textarea{border:1px solid var(--border);border-radius:var(--radius-sm);width:100%;font-size:.875rem;font-family:var(--font);background:var(--bg-card);color:var(--text-body);padding:10px 12px;transition:border-color .15s}.input:focus,.textarea:focus{border-color:var(--border-focus);box-shadow:0 0 0 3px var(--accent-bg);outline:none}.textarea{resize:vertical;min-height:80px}.label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-tertiary);margin-bottom:var(--space-xs);font-size:.6875rem;font-weight:500;display:block}.stats-grid{gap:var(--space-sm);margin-bottom:var(--space-lg);grid-template-columns:repeat(2,1fr);display:grid}.stat-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:var(--space-md);text-align:center}.stat-value{color:var(--text-primary);font-size:1.75rem;font-weight:300;line-height:1.2}.stat-label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-tertiary);margin-top:var(--space-xs);font-size:.6875rem;font-weight:500}.progress-bar{background:var(--bg-subtle);border-radius:2px;height:4px;overflow:hidden}.progress-fill{background:var(--accent);border-radius:2px;height:100%;transition:width .3s}.progress-text{color:var(--text-tertiary);text-align:center;margin-top:var(--space-xs);font-size:.75rem}.diff-row{gap:var(--space-sm);margin:var(--space-sm) 0;display:flex}.diff-btn{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-card);color:var(--text-secondary);cursor:pointer;font-size:.8125rem;font-weight:500;font-family:var(--font);flex:1;padding:8px;transition:all .15s}.diff-btn:hover{border-color:var(--border-hover)}.diff-btn.selected{border-width:2px}.diff-btn.sel-easy{border-color:var(--success);color:var(--success);background:var(--success-bg)}.diff-btn.sel-normal{border-color:var(--accent);color:var(--accent);background:var(--accent-bg)}.diff-btn.sel-hard{border-color:var(--error);color:var(--error);background:var(--error-bg)}.timer-display{font-variant-numeric:tabular-nums;text-align:center;color:var(--text-primary);font-size:2.5rem;font-weight:300}.timer-display.warn{color:var(--warning)}.timer-display.end{color:var(--error)}.tag{text-transform:uppercase;letter-spacing:.06em;color:var(--text-tertiary);margin-bottom:var(--space-xs);font-size:.6875rem;font-weight:500;display:inline-block}.check-item{align-items:flex-start;gap:var(--space-sm);padding:var(--space-sm) 0;border-bottom:1px solid var(--border);display:flex}.check-item:last-child{border-bottom:none}.check-item input[type=checkbox]{accent-color:var(--accent);margin-top:3px}.check-item.checked .ci-text{color:var(--text-tertiary);text-decoration:line-through}.ci-text{color:var(--text-body);font-size:.875rem}.ci-desc{color:var(--text-tertiary);margin-top:2px;font-size:.75rem;display:block}.streak{text-align:center;padding:var(--space-sm);color:var(--text-secondary);font-size:.875rem}.toast{top:var(--space-md);right:var(--space-md);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:var(--space-sm) var(--space-md);box-shadow:var(--shadow-lg);z-index:100;font-size:.875rem;animation:.2s slideIn;position:fixed}@keyframes slideIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.landing{min-height:100dvh;padding:var(--space-xl);text-align:center;flex-direction:column;justify-content:center;align-items:center;display:flex}.landing h1{margin-bottom:var(--space-sm);font-size:2rem;font-weight:600}.landing p{color:var(--text-secondary);max-width:480px;margin-bottom:var(--space-xl)}.lab-badge{background:var(--accent-bg,#0d96681a);color:var(--accent,#0d9668);border:1px solid var(--accent,#0d9668);letter-spacing:.02em;margin-bottom:var(--space-md);text-transform:uppercase;border-radius:999px;align-items:center;padding:4px 12px;font-size:.75rem;font-weight:600;display:inline-flex}.features-grid{gap:var(--space-md);width:100%;max-width:640px;margin-bottom:var(--space-xl);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));display:grid}.feature-card{text-align:left;padding:var(--space-md);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius)}.feature-card h3{margin-bottom:var(--space-xs);font-size:.875rem;font-weight:500}.feature-card p{color:var(--text-secondary);margin:0;font-size:.8125rem}.empty-state{text-align:center;padding:var(--space-2xl) var(--space-md);color:var(--text-secondary)}.empty-state p{margin-bottom:var(--space-md)}.lang-switcher{background:var(--bg-subtle);border-radius:var(--radius-sm);gap:2px;padding:2px;display:flex}.lang-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:4px 8px;font-size:.75rem;font-weight:500;transition:all .15s}.lang-btn.active{background:var(--bg-card);color:var(--text-primary);box-shadow:var(--shadow-sm)}.skeleton{background:linear-gradient(90deg, var(--bg-subtle) 25%, var(--bg-hover) 50%, var(--bg-subtle) 75%);border-radius:var(--radius-xs);background-size:200% 100%;animation:1.5s infinite shimmer}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:.875rem}th{text-align:left;color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.04em;padding:var(--space-sm);border-bottom:1px solid var(--border);font-size:.75rem;font-weight:500}td{padding:var(--space-sm);border-bottom:1px solid var(--border);color:var(--text-body)}tr:last-child td{border-bottom:none}@media (width>=768px){.stats-grid{grid-template-columns:repeat(3,1fr)}}
