.logo{height:2em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}.card{padding:2em}.read-the-docs{color:#888}.navbar{position:sticky;top:0;background-color:var(--background-primary);border-bottom:1px solid var(--border-color);padding:var(--theme-padding-default);z-index:100}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;--text-primary: #213547;--text-secondary: rgba(33, 53, 71, .7);--background-primary: #ffffff;--background-secondary: #f9f9f9;--background-elevated: rgba(0, 0, 0, .05);--border-color: rgba(0, 0, 0, .1);--accent-color: #646cff;--accent-color-hover: #747bff;--button-background: #f9f9f9;--button-background-hover: #e9e9e9;--theme-color-green: #28a745;--theme-color-yellow: #ffc107;--theme-color-red: #dc3545;--theme-color-gray: #888;--theme-color-dark: #212529;--theme-color-success: var(--theme-color-green);--theme-color-warning: var(--theme-color-yellow);--theme-color-danger: var(--theme-color-red);--theme-color-warning-text: var(--theme-color-dark);--theme-color-muted: var(--theme-color-gray);--theme-padding-default: 1rem;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--small-width: 576px;--grid-min-width: 4in;--border-radius-default: 8px;color:var(--text-primary);background-color:var(--background-primary);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}@media (prefers-color-scheme: dark){:root{--text-primary: rgba(255, 255, 255, .87);--text-secondary: rgba(255, 255, 255, .6);--background-primary: #242424;--background-secondary: #1a1a1a;--background-elevated: rgba(255, 255, 255, .05);--border-color: rgba(255, 255, 255, .1);--accent-color: #646cff;--accent-color-hover: #535bf2;--button-background: #1a1a1a;--button-background-hover: #2a2a2a;--theme-color-green: #38a169;--theme-color-yellow: #d69e2e;--theme-color-red: #e53e3e;--theme-color-gray: #a0aec0;--theme-color-dark: #1a202c;--theme-color-success: var(--theme-color-green);--theme-color-warning: var(--theme-color-yellow);--theme-color-danger: var(--theme-color-red);--theme-color-warning-text: var(--theme-color-dark);--theme-color-muted: var(--theme-color-gray)}}a{font-weight:500;color:var(--accent-color);text-decoration:inherit}a:hover{color:var(--accent-color-hover)}body{margin:0;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1;margin:0}button{border-radius:var(--border-radius-default);border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:var(--button-background);cursor:pointer;transition:border-color .25s}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}details>summary{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md);cursor:pointer;list-style:none;border-radius:var(--border-radius-default);transition:background-color .2s ease;margin:0;font-size:1.1rem;color:var(--text-secondary);font-weight:600}details>summary:hover{background:var(--background-elevated)}details>summary::-webkit-details-marker{display:none}details>summary::marker{content:""}details>summary:after{content:"▼";color:var(--text-secondary);font-size:.9rem;transition:transform .2s ease}details:not([open])>summary:after{transform:rotate(-90deg)}.main{overflow-y:auto;min-height:0}.drawer{background-color:var(--background-elevated);border-top:1px solid var(--border-color);padding:var(--spacing-md)}.layout{width:100dvw;height:100dvh;display:grid;grid-template-rows:auto 1fr auto;grid-template-areas:"navbar" "main" "drawer"}.responsive-grid{display:flex;flex-direction:column;gap:var(--spacing-md);width:100%;grid-template-columns:1fr}@media (min-width: 576px){.responsive-grid{display:grid;flex-direction:unset;grid-template-columns:repeat(auto-fill,minmax(var(--grid-min-width),1fr));grid-auto-rows:var(--responsive-grid-row-height, 4.5in);justify-content:center}.gridcell{height:100%}}.gridcell{display:flex;flex-direction:column;width:100%;height:var(--responsive-grid-row-height, 100%);border:none;overflow:auto}.config{background:var(--background-secondary);border:1px solid var(--border-color);border-radius:var(--border-radius-default);padding:0}.config__form{display:flex;flex-direction:column;gap:var(--spacing-md);padding:0 var(--spacing-md) var(--spacing-md)}.config__label{display:flex;flex-direction:column;gap:var(--spacing-xs);font-weight:500;color:var(--text-primary)}.config__label-text{font-size:.9rem;color:var(--text-secondary)}.config__input,.config__select{padding:var(--spacing-sm);border:1px solid var(--border-color);border-radius:var(--border-radius-default);background:var(--background-primary);color:var(--text-primary);font-family:inherit;font-size:.9rem;transition:border-color .2s ease}.config__input:focus,.config__select:focus{outline:none;border-color:var(--accent-color);box-shadow:0 0 0 2px #646cff1a}.config__input--number{max-width:120px}.config__select{cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right var(--spacing-sm) center;background-size:1em;padding-right:calc(var(--spacing-sm) + 1.5em)}@container (max-width: 3.9in){.config__form{gap:var(--spacing-sm)}.config__input--number{max-width:100%}}.timer{box-shadow:0 4px 6px #0000001a;display:flex;flex-direction:column;gap:var(--spacing-lg);container-type:inline-size}.timer__name input{width:100%;padding:.75rem;font-size:1.1rem;border:2px solid var(--border-color);border-radius:var(--border-radius-default);background:var(--background-secondary);transition:border-color .2s ease;box-sizing:border-box;color:var(--text-primary)}.timer__name input:focus{outline:none;border-color:var(--accent-color);box-shadow:0 0 0 3px #007bff1a}.timer__display{text-align:center;padding:var(--spacing-sm);background:var(--background-secondary);border-radius:var(--border-radius-default);box-shadow:inset 0 2px 4px #0000000f;font-size:2.5rem;font-weight:700;color:var(--text-primary);font-family:Courier New,monospace;letter-spacing:.05em}.timer__previous{font-size:.6em;color:var(--theme-color-muted);display:flex;align-items:center;justify-content:center;height:1em}.timer__previous--flash{animation:flash 1s ease-in-out infinite}@keyframes flash{0%,to{opacity:.5}50%{opacity:1}}.timer__controls{display:flex;gap:.75rem;justify-content:center}.timer__controls button{padding:.75rem 1.5rem;font-weight:600;border:none;transition:all .2s ease;min-width:80px}.timer__start{background:var(--theme-color-success);color:#fff}.timer__pause{background:var(--theme-color-warning);color:var(--theme-color-warning-text)}.timer__stop{background:var(--theme-color-danger);color:#fff}.timer__controls button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 8px #00000026}.timer__controls button:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.timer__history{background:var(--background-secondary);border-radius:var(--border-radius-default);border:1px solid var(--border-color)}.timer__history ul{list-style:none;padding:0;margin:0;overflow-y:auto}.timer__history li{padding:var(--spacing-xs);margin-bottom:var(--spacing-sm);background:var(--background-elevated);border-radius:var(--border-radius-default);border-left:4px solid var(--accent-color);font-size:.9rem;color:var(--text-secondary)}.timer__history li:last-child{margin-bottom:0}@container (max-width: 3.9in){.timer{padding:var(--spacing-lg)}.timer__display{font-size:2rem;padding:var(--spacing-md)}.timer__controls{flex-direction:column;gap:var(--spacing-sm)}.timer__controls button{width:100%}}