:root{--text-strong:#1a1726;--text-soft:#1a1726b8;--text-faint:#1a17268c;--glass-bg:#ffffff73;--glass-bg-strong:#ffffffa6;--glass-border:#ffffff8c;--glass-shadow:0 20px 60px -15px #140f2840, 0 8px 24px -10px #140f282e;--btn-primary-bg:#1a1726eb;--btn-primary-text:#fff;--btn-ghost-bg:#ffffff59;--btn-ghost-text:var(--text-strong);--btn-ghost-border:#1a17262e;--accent-work:#ff6b6b;--accent-short:#4ecdc4;--accent-long:#8e7dff;--sans:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--serif:Georgia, "Times New Roman", "Iowan Old Style", serif;font:17px/1.5 var(--sans);color:var(--text-strong);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body[data-bg=dark]{--text-strong:#f6f4ff;--text-soft:#f6f4ffc7;--text-faint:#f6f4ff94;--glass-bg:#0f0c1c59;--glass-bg-strong:#0f0c1c8c;--glass-border:#ffffff2e;--glass-shadow:0 20px 60px -15px #00000073, 0 8px 24px -10px #00000059;--btn-primary-bg:#ffffffeb;--btn-primary-text:#1a1726;--btn-ghost-bg:#ffffff1f;--btn-ghost-text:var(--text-strong);--btn-ghost-border:#ffffff4d}*{box-sizing:border-box}body{min-height:100svh;margin:0;overflow-x:hidden}#root{min-height:100svh}h1,h2{font-family:var(--sans);color:var(--text-strong);margin:0;font-weight:600}p{margin:0}button{font:inherit;color:inherit}@media (width<=600px){:root{font-size:16px}}.app{background-position:50%;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;flex-direction:column;align-items:stretch;width:100%;min-height:100svh;transition:background-image .6s;display:flex}.app-topbar{justify-content:space-between;align-items:center;gap:12px;padding:20px 24px;display:flex}.app-content{flex-direction:column;flex:auto;justify-content:center;align-items:center;gap:28px;padding:24px 24px 60px;display:flex}.glass{background:var(--glass-bg);-webkit-backdrop-filter:blur(24px)saturate(140%);backdrop-filter:blur(24px)saturate(140%);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);border-radius:20px}.btn{cursor:pointer;letter-spacing:.01em;border:1px solid #0000;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:10px 18px;font-weight:500;transition:transform .15s,background .2s,border-color .2s,opacity .2s;display:inline-flex}.btn:focus-visible{outline:2px solid var(--text-strong);outline-offset:2px}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:var(--btn-primary-bg);color:var(--btn-primary-text)}.btn-primary:hover:not(:disabled){filter:brightness(1.08)}.btn-ghost{background:var(--btn-ghost-bg);color:var(--btn-ghost-text);border-color:var(--btn-ghost-border)}.btn-ghost:hover:not(:disabled){background:var(--glass-bg-strong)}.btn-icon{border-radius:50%;width:40px;height:40px;padding:0;font-size:18px}.settings-trigger{font-size:20px}.bg-picker{background:var(--glass-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:999px;align-items:center;gap:10px;padding:6px 10px;display:flex}.bg-chip{cursor:pointer;border:2px solid #ffffffd9;border-radius:50%;width:22px;height:22px;padding:0;transition:transform .15s,box-shadow .15s;box-shadow:0 2px 6px #0000002e}.bg-chip:hover{transform:scale(1.1)}.bg-chip.is-active{box-shadow:0 0 0 2px var(--text-strong), 0 2px 6px #00000040;transform:scale(1.08)}.bg-chip:focus-visible{outline:2px solid var(--text-strong);outline-offset:3px}.quote-card{text-align:center;width:min(720px,100%);padding:36px 36px 28px}.quote-text{font-family:var(--serif);color:var(--text-strong);letter-spacing:-.005em;margin:0 0 12px;font-size:clamp(22px,3.4vw,32px);font-weight:500;line-height:1.35;transition:opacity .18s,transform .18s}.quote-text.is-fading,.quote-author.is-fading{opacity:0;transform:translateY(4px)}.quote-author{color:var(--text-soft);margin:0 0 24px;font-size:15px;font-style:italic;transition:opacity .18s,transform .18s}.quote-actions{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.quote-error{color:var(--text-soft);margin-top:14px;font-size:13px}.timer{text-align:center;width:min(380px,100%);padding:28px 28px 24px}.timer-phase{letter-spacing:.12em;text-transform:uppercase;color:var(--text-soft);justify-content:center;align-items:center;gap:8px;margin:0 0 12px;font-size:13px;font-weight:600;display:inline-flex}.timer-phase-dot{border-radius:50%;width:8px;height:8px;display:inline-block}.phase-work{background:var(--accent-work)}.phase-short{background:var(--accent-short)}.phase-long{background:var(--accent-long)}.timer-cycle{color:var(--text-faint);font-weight:500}.timer-display{letter-spacing:-.02em;color:var(--text-strong);font-variant-numeric:tabular-nums;font-feature-settings:"tnum";margin:0 0 20px;font-size:clamp(64px,14vw,96px);font-weight:300;line-height:1}.timer-actions{justify-content:center;gap:10px;display:flex}.settings-backdrop{z-index:50;background:#0a081473;justify-content:center;align-items:center;padding:20px;animation:.18s fade-in;display:flex;position:fixed;inset:0}.settings-panel{background:var(--glass-bg-strong);width:min(440px,100%);padding:24px;animation:.22s pop-in}.settings-header{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.settings-header h2{font-size:18px;font-weight:600}.settings-grid{grid-template-columns:1fr 1fr;gap:14px;margin-bottom:22px;display:grid}.settings-field{color:var(--text-soft);flex-direction:column;gap:6px;font-size:13px;font-weight:500;display:flex}.settings-field input{font:inherit;border:1px solid var(--btn-ghost-border);background:var(--btn-ghost-bg);color:var(--text-strong);border-radius:10px;width:100%;padding:9px 12px;font-size:15px}.settings-field input:focus-visible{outline:2px solid var(--text-strong);outline-offset:1px;border-color:#0000}.settings-footer{justify-content:space-between;gap:10px;display:flex}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes pop-in{0%{opacity:0;transform:translateY(8px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}.app{transition:none}}@media (width<=600px){.app-topbar{padding:14px 16px}.app-content{gap:22px;padding:16px 16px 40px}.quote-card{padding:26px 22px 22px}.bg-chip{width:20px;height:20px}.settings-grid{grid-template-columns:1fr}}
