.timer-setup{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6);margin-bottom:var(--space-6)}.timer-setup h3{font-size:var(--text-lg);font-weight:var(--weight-semibold);margin:0 0 var(--space-4);color:var(--color-text)}.sections-list{display:flex;flex-direction:column;gap:var(--space-3);margin-bottom:var(--space-4)}.section-item{display:flex;align-items:center;gap:var(--space-3);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4)}.section-item input[type=text]{flex:1;min-width:0;padding:var(--space-2) var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--text-sm);background-color:var(--color-surface);color:var(--color-text);transition:border-color var(--duration-normal) var(--ease-default)}.section-item input[type=text]:focus{outline:none;border-color:var(--color-border-focus)}.section-item input[type=number]{width:64px;padding:var(--space-2) var(--space-2);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--text-sm);text-align:center;background-color:var(--color-surface);color:var(--color-text);transition:border-color var(--duration-normal) var(--ease-default)}.section-item input[type=number]:focus{outline:none;border-color:var(--color-border-focus)}.section-item .unit-label{font-size:var(--text-sm);color:var(--color-text-secondary);white-space:nowrap}.section-item .delete-section-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;min-width:32px;border:none;border-radius:var(--radius-sm);background-color:transparent;color:var(--color-text-tertiary);cursor:pointer;transition:all var(--duration-normal) var(--ease-default)}.section-item .delete-section-btn:hover{background-color:var(--color-error-light);color:var(--color-error)}.add-section-btn{display:flex;align-items:center;justify-content:center;gap:var(--space-2);width:100%;padding:var(--space-3);border:1px dashed var(--color-border);border-radius:var(--radius-md);background-color:transparent;color:var(--color-text-secondary);font-size:var(--text-sm);font-weight:var(--weight-medium);cursor:pointer;transition:all var(--duration-normal) var(--ease-default)}.add-section-btn:hover{border-color:var(--color-border-hover);background-color:var(--color-bg-secondary);color:var(--color-text)}.total-time-display{text-align:right;font-size:var(--text-sm);color:var(--color-text-secondary);margin-top:var(--space-2)}.timer-display{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:240px;padding:var(--space-8) var(--space-6);margin-bottom:var(--space-4);border-radius:var(--radius-xl);background-color:var(--color-surface);border:1px solid var(--color-border);transition:background-color .5s ease,border-color .5s ease}.timer-display.green{background-color:#27ae60;border-color:#219a52}.timer-display.yellow{background-color:#f39c12;border-color:#d68910}.timer-display.red{background-color:#e74c3c;border-color:#c0392b}.timer-display.overtime{background-color:#e74c3c;border-color:#c0392b;animation:overtime-flash 1s ease-in-out infinite}@keyframes overtime-flash{0%,to{opacity:1}50%{opacity:.6}}.timer-display.green,.timer-display.yellow,.timer-display.red,.timer-display.overtime,.timer-display.green .countdown-text,.timer-display.yellow .countdown-text,.timer-display.red .countdown-text,.timer-display.overtime .countdown-text,.timer-display.green .section-indicator,.timer-display.yellow .section-indicator,.timer-display.red .section-indicator,.timer-display.overtime .section-indicator,.timer-display.green .overtime-label,.timer-display.yellow .overtime-label,.timer-display.red .overtime-label,.timer-display.overtime .overtime-label{color:#fff}.countdown-text{font-size:5rem;font-weight:var(--weight-bold);color:var(--color-text);line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.02em}.section-indicator{font-size:var(--text-xl);font-weight:var(--weight-semibold);color:var(--color-text-secondary);margin-top:var(--space-3)}.overtime-label{font-size:var(--text-lg);font-weight:var(--weight-bold);color:var(--color-error);margin-top:var(--space-2)}.progress-bar{width:100%;height:6px;background-color:var(--color-border);border-radius:var(--radius-full);margin-bottom:var(--space-4);overflow:hidden}.progress-bar-fill{height:100%;background-color:var(--color-accent);border-radius:var(--radius-full);width:0;transition:width 1s linear}.timer-controls{display:flex;justify-content:center;gap:var(--space-3);margin-bottom:var(--space-6);flex-wrap:wrap}.timer-controls button{display:flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-surface);color:var(--color-text);font-size:var(--text-sm);font-weight:var(--weight-medium);cursor:pointer;transition:all var(--duration-normal) var(--ease-default);box-shadow:var(--shadow-xs)}.timer-controls button:hover:not(:disabled){background-color:var(--color-surface-hover);border-color:var(--color-border-hover);box-shadow:var(--shadow-sm);transform:translateY(-1px)}.timer-controls button:disabled{opacity:.5;cursor:not-allowed}.timer-controls button svg{width:16px;height:16px}.timer-controls .start-btn{background-color:var(--color-accent);color:var(--color-accent-text);border-color:var(--color-accent)}.timer-controls .start-btn:hover:not(:disabled){background-color:var(--color-accent-hover);border-color:var(--color-accent-hover)}.fullscreen-btn{display:flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-surface);color:var(--color-text-secondary);font-size:var(--text-sm);cursor:pointer;transition:all var(--duration-normal) var(--ease-default);margin-bottom:var(--space-6)}.fullscreen-btn:hover{background-color:var(--color-surface-hover);border-color:var(--color-border-hover);color:var(--color-text)}.fullscreen-btn svg{width:16px;height:16px}.practice-log{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6);margin-bottom:var(--space-6)}.practice-log h3{font-size:var(--text-lg);font-weight:var(--weight-semibold);margin:0 0 var(--space-4);color:var(--color-text)}.log-empty{font-size:var(--text-sm);color:var(--color-text-tertiary);text-align:center;padding:var(--space-4)}.log-list{display:flex;flex-direction:column;gap:var(--space-2)}.log-item{display:flex;justify-content:space-between;align-items:center;padding:var(--space-3) var(--space-4);background-color:var(--color-bg-secondary);border-radius:var(--radius-md);font-size:var(--text-sm)}.log-item .log-date{color:var(--color-text-secondary)}.log-item .log-time{font-weight:var(--weight-semibold);color:var(--color-text)}.log-item .log-sections{color:var(--color-text-tertiary);font-size:var(--text-xs)}.log-clear-btn{display:block;margin-top:var(--space-3);margin-left:auto;padding:var(--space-2) var(--space-3);border:none;border-radius:var(--radius-sm);background-color:transparent;color:var(--color-text-tertiary);font-size:var(--text-xs);cursor:pointer;transition:color var(--duration-normal) var(--ease-default)}.log-clear-btn:hover{color:var(--color-error)}@media(max-width:480px){.countdown-text{font-size:3.5rem}.section-indicator{font-size:var(--text-lg)}.timer-display{min-height:200px;padding:var(--space-6) var(--space-4)}.timer-setup{padding:var(--space-4)}.section-item{flex-wrap:wrap;gap:var(--space-2)}.section-item input[type=text]{flex:1 1 100%}.timer-controls{gap:var(--space-2)}.timer-controls button{padding:var(--space-3) var(--space-4);font-size:var(--text-xs)}.practice-log{padding:var(--space-4)}}