:root{--color-bg:#0f0f1a;--color-surface:#1a1a2e;--color-surface-raised:#252540;--color-primary:#e94560;--color-primary-hover:#ff6b81;--color-secondary:#3a3a5c;--color-secondary-hover:#4a4a6c;--color-danger:#c0392b;--color-danger-hover:#e74c3c;--color-text:#eaeaea;--color-text-muted:#8888aa;--color-border:#2a2a44;--color-success:#2ecc71;--color-countdown:#e94560;--font-main:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,sans-serif;--font-mono:'SF Mono','Fira Code','Cascadia Code',Consolas,monospace;--radius:8px;--radius-lg:12px;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:32px;--tap-target:48px}*,::after,::before{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%}body{font-family:var(--font-main);background:var(--color-bg);color:var(--color-text);min-height:100dvh;overflow-x:hidden;-webkit-tap-highlight-color:transparent}button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}.screen{display:none;min-height:100dvh;padding-bottom:var(--spacing-xl)}.screen.active{display:flex;flex-direction:column}.app-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-md);background:var(--color-surface);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:10}.app-header h1,.app-header h2{font-size:1.2rem;font-weight:600;flex:1;text-align:center}.app-header h1{text-align:left}.header-actions{display:flex;gap:var(--spacing-sm)}.btn{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:var(--radius);cursor:pointer;font-weight:600;min-height:var(--tap-target);min-width:var(--tap-target);padding:var(--spacing-sm) var(--spacing-md);transition:background .15s,opacity .15s;touch-action:manipulation}.btn:active{opacity:.8}.btn:disabled{opacity:.4;cursor:default}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover)}.btn-secondary{background:var(--color-secondary);color:var(--color-text)}.btn-secondary:hover:not(:disabled){background:var(--color-secondary-hover)}.btn-danger{background:var(--color-danger);color:#fff}.btn-danger:hover:not(:disabled){background:var(--color-danger-hover)}.btn-sm{min-height:36px;min-width:36px;padding:var(--spacing-xs) var(--spacing-sm);font-size:.85rem}.btn-lg{min-height:56px;padding:var(--spacing-md) var(--spacing-lg);font-size:1.1rem}.btn-full{width:100%}.history-stats{display:flex;justify-content:space-around;padding:var(--spacing-md);background:var(--color-surface);border-bottom:1px solid var(--color-border);color:var(--color-text-muted);font-size:.9rem}.session-list{flex:1;padding:var(--spacing-md);display:flex;flex-direction:column;gap:var(--spacing-sm)}.session-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-md);display:flex;align-items:center;gap:var(--spacing-md)}.session-card-info{flex:1;min-width:0}.session-card-name{font-size:1rem;font-weight:600;margin-bottom:var(--spacing-xs);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.session-card-meta{font-size:.8rem;color:var(--color-text-muted)}.session-card-actions{display:flex;gap:var(--spacing-xs);flex-shrink:0}.btn-play{min-width:52px;font-size:1.2rem}.list-footer{padding:var(--spacing-md)}.empty-state{text-align:center;color:var(--color-text-muted);padding:var(--spacing-xl);font-size:.95rem}.editor-body{flex:1;padding:var(--spacing-md);display:flex;flex-direction:column;gap:var(--spacing-md)}.form-group{display:flex;flex-direction:column;gap:var(--spacing-xs)}.form-group label{font-size:.85rem;font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}#editor-session-name,.form-group input[type=text]{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--spacing-sm) var(--spacing-md);min-height:var(--tap-target);font-size:1rem;color:var(--color-text)}.duration-input:focus,.form-group input:focus,.timer-name-input:focus{outline:2px solid var(--color-primary);outline-offset:-1px}.editor-timer-list{display:flex;flex-direction:column;gap:var(--spacing-sm)}.timer-row{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-md)}.timer-row-header{display:flex;gap:var(--spacing-sm);margin-bottom:var(--spacing-sm)}.timer-name-input{flex:1;background:var(--color-surface-raised);border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--spacing-sm) var(--spacing-md);min-height:var(--tap-target);font-size:1rem;color:var(--color-text)}.timer-duration-control{display:flex;align-items:center;justify-content:center;gap:var(--spacing-xs);flex-wrap:nowrap}.duration-input{width:64px;text-align:center;background:var(--color-surface-raised);border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--spacing-sm);min-height:var(--tap-target);font-size:1rem;color:var(--color-text);-moz-appearance:textfield;appearance:textfield}.duration-input::-webkit-inner-spin-button,.duration-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.duration-display{font-family:var(--font-mono);font-size:.9rem;color:var(--color-text-muted);min-width:48px;text-align:center}.timer-presets{display:flex;flex-wrap:wrap;gap:var(--spacing-xs);margin-bottom:var(--spacing-sm);justify-content:center}.timer-presets .btn{flex:1;min-width:48px;font-size:.8rem;padding:var(--spacing-xs);min-height:32px}.timer-row.minimized{padding:var(--spacing-sm) var(--spacing-md);display:flex;align-items:center;gap:var(--spacing-sm)}.timer-row.minimized .timer-info{flex:1;display:flex;flex-direction:column;min-width:0}.timer-row.minimized .timer-name{font-size:1rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.timer-row.minimized .timer-duration{font-size:.85rem;color:var(--color-text-muted)}.drag-handle{cursor:grab;padding:var(--spacing-xs);color:var(--color-text-muted);font-size:1.2rem;display:flex;align-items:center;justify-content:center;touch-action:none}.drag-handle:active{cursor:grabbing}.timer-row.dragging{opacity:.5;background:var(--color-surface-raised)}.timer-row.drag-over{border-top:2px dashed var(--color-primary)}.timer-row-reorder{display:flex;justify-content:flex-end;gap:var(--spacing-xs);margin-top:var(--spacing-sm)}.training-header{justify-content:center}.training-body{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-lg);gap:var(--spacing-md)}.training-exercise{font-size:1.4rem;font-weight:600;text-align:center}.training-progress-text{font-size:.9rem;color:var(--color-text-muted)}.training-countdown{font-family:var(--font-mono);font-size:clamp(4rem, 18vw, 8rem);font-weight:700;color:var(--color-countdown);letter-spacing:.05em;line-height:1;text-align:center;padding:var(--spacing-lg) 0}.training-complete{font-size:1.4rem;font-weight:600;color:var(--color-success);text-align:center;padding:var(--spacing-xl) 0}.training-progress-bar-container{width:100%;max-width:400px;height:6px;background:var(--color-surface);border-radius:3px;overflow:hidden}.training-progress-bar{height:100%;background:var(--color-primary);width:0%;transition:width .3s linear;border-radius:3px}.training-controls{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--spacing-sm);margin-top:var(--spacing-lg);width:100%;max-width:400px}.training-controls .btn{flex:1;min-width:100px}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.6);z-index:100;display:flex;justify-content:center;align-items:flex-end;padding:var(--spacing-sm)}.modal-content{background:var(--color-bg);width:100%;max-width:560px;border-radius:var(--radius-lg);display:flex;flex-direction:column;max-height:90vh;animation:.2s ease-out slideUp;overflow:hidden}.modal-small{max-width:400px}@keyframes slideUp{from{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}.modal-content .app-header{border-top-left-radius:var(--radius-lg);border-top-right-radius:var(--radius-lg);position:relative}.modal-body{padding:var(--spacing-md);flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:var(--spacing-md)}.search-input{width:100%;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--spacing-sm) var(--spacing-md);min-height:var(--tap-target);font-size:1rem;color:var(--color-text)}.search-input:focus{outline:2px solid var(--color-primary);outline-offset:-1px}.timer-names-list{display:flex;flex-direction:column;gap:var(--spacing-xs)}.timer-name-item{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--spacing-sm) var(--spacing-md);display:flex;align-items:center;gap:var(--spacing-sm);cursor:pointer;touch-action:pan-y}.timer-name-item:hover{background:var(--color-surface-raised)}.timer-name-item-text{flex:1;font-size:1rem;font-weight:600;pointer-events:none}.timer-name-item.dragging{opacity:.5;background:var(--color-surface-raised)}.timer-name-item.drag-over{border-top:2px dashed var(--color-primary)}@media (min-width:600px){.editor-body,.list-footer,.session-list,.training-body{max-width:560px;margin:0 auto;width:100%}}