*{margin:0;padding:0}:root{color-scheme:light dark;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{min-width:320px;min-height:100vh}#root{min-height:100vh}button{font-family:inherit}:root{--bg: #faf6ee;--text: #241c10;--muted: #8a7660;--accent: #9a6f2c;--accent-dim: rgba(154, 111, 44, .14);--accent-hover: #7a5520;--track: #dfd5c0;--divider: #e8dfc8;--danger: #b03a22;--danger-dim: rgba(176, 58, 34, .1);--radius-pill: 100px;--radius-btn: 8px}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg: #16120c;--text: #ede0c4;--muted: #9a8468;--accent: #c8963a;--accent-dim: rgba(200, 150, 58, .14);--accent-hover: #daa848;--track: #2e2518;--divider: #2a2014;--danger: #c84830;--danger-dim: rgba(200, 72, 48, .12)}}:root[data-theme=dark]{--bg: #16120c;--text: #ede0c4;--muted: #9a8468;--accent: #c8963a;--accent-dim: rgba(200, 150, 58, .14);--accent-hover: #daa848;--track: #2e2518;--divider: #2a2014;--danger: #c84830;--danger-dim: rgba(200, 72, 48, .12)}html.palette-0{--accent:#a05228;--accent-dim:rgba(160,82,40,.14);--accent-hover:#7a3a18}@media(prefers-color-scheme:dark){html.palette-0:not([data-theme=light]){--accent:#c87848;--accent-dim:rgba(200,120,72,.14);--accent-hover:#e09464}}html[data-theme=dark].palette-0{--accent:#c87848;--accent-dim:rgba(200,120,72,.14);--accent-hover:#e09464}html.palette-1{--accent:#2e7d6e;--accent-dim:rgba(46,125,110,.14);--accent-hover:#1e5d4e}@media(prefers-color-scheme:dark){html.palette-1:not([data-theme=light]){--accent:#45b09c;--accent-dim:rgba(69,176,156,.14);--accent-hover:#65d0bc}}html[data-theme=dark].palette-1{--accent:#45b09c;--accent-dim:rgba(69,176,156,.14);--accent-hover:#65d0bc}html.palette-2{--accent:#8b4f6b;--accent-dim:rgba(139,79,107,.14);--accent-hover:#6b3050}@media(prefers-color-scheme:dark){html.palette-2:not([data-theme=light]){--accent:#c078a0;--accent-dim:rgba(192,120,160,.14);--accent-hover:#e098c0}}html[data-theme=dark].palette-2{--accent:#c078a0;--accent-dim:rgba(192,120,160,.14);--accent-hover:#e098c0}html.palette-3{--accent:#3d618b;--accent-dim:rgba(61,97,139,.14);--accent-hover:#2a4468}@media(prefers-color-scheme:dark){html.palette-3:not([data-theme=light]){--accent:#6090c8;--accent-dim:rgba(96,144,200,.14);--accent-hover:#80b0e8}}html[data-theme=dark].palette-3{--accent:#6090c8;--accent-dim:rgba(96,144,200,.14);--accent-hover:#80b0e8}html.palette-5{--accent:#4a7a52;--accent-dim:rgba(74,122,82,.14);--accent-hover:#2e5a36}@media(prefers-color-scheme:dark){html.palette-5:not([data-theme=light]){--accent:#68aa70;--accent-dim:rgba(104,170,112,.14);--accent-hover:#88ca90}}html[data-theme=dark].palette-5{--accent:#68aa70;--accent-dim:rgba(104,170,112,.14);--accent-hover:#88ca90}html.palette-6{--accent:#5c4a8a;--accent-dim:rgba(92,74,138,.14);--accent-hover:#3c2a6a}@media(prefers-color-scheme:dark){html.palette-6:not([data-theme=light]){--accent:#8468c0;--accent-dim:rgba(132,104,192,.14);--accent-hover:#a488e0}}html[data-theme=dark].palette-6{--accent:#8468c0;--accent-dim:rgba(132,104,192,.14);--accent-hover:#a488e0}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}.app{max-width:440px;margin:0 auto;padding:1.5rem 1.25rem 2rem;min-height:100vh;display:flex;flex-direction:column}header{text-align:center;padding-bottom:1.75rem}header h1{font-family:Lora,Georgia,serif;font-size:1.6rem;font-weight:400;letter-spacing:.01em;color:var(--text);margin:0 0 .35rem}.subtitle{font-size:.8rem;color:var(--muted);margin:0}.subtitle .separator{margin:0 .35rem;opacity:.5}.subtitle .source-link{color:var(--muted);text-decoration:none}.subtitle .source-link:hover{color:var(--accent)}.setup{flex:1;display:flex;flex-direction:column}.option-row{padding:1.1rem 0;border-bottom:1px solid var(--divider)}.option-row:last-of-type{border-bottom:none}.option-label{font-size:.68rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);display:block;margin-bottom:.65rem}.pill-group{display:flex;flex-wrap:wrap;gap:.4rem}.pill{padding:.45rem 1rem;border-radius:var(--radius-pill);border:1.5px solid var(--track);background:transparent;color:var(--muted);font-family:inherit;font-size:.85rem;cursor:pointer;transition:border-color .15s,background .15s,color .15s;white-space:nowrap}.pill:hover:not(:disabled){border-color:var(--accent);color:var(--accent);background:var(--accent-dim)}.pill.selected{border-color:var(--accent);background:var(--accent);color:#fff}.pill:disabled{opacity:.3;cursor:not-allowed}.pill--num{padding-left:.7rem;padding-right:.7rem;min-width:unset}.pill-group--nowrap{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.pill-group--nowrap::-webkit-scrollbar{display:none}.custom-duration-input{display:flex;align-items:center;gap:.5rem;margin-top:.65rem;animation:fadeUp .15s ease-out}@keyframes fadeUp{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.custom-duration-input input{width:72px;padding:.45rem .6rem;border-radius:var(--radius-btn);border:1.5px solid var(--accent);background:var(--bg);color:var(--text);font-family:inherit;font-size:.95rem;text-align:center}.custom-duration-input input:focus{outline:none;box-shadow:0 0 0 3px var(--accent-dim)}.custom-duration-input .suffix{font-size:.9rem;color:var(--muted)}.custom-duration-hint{font-size:.72rem;color:var(--muted);margin-top:.3rem;opacity:.6}.total-time{text-align:center;font-size:.8rem;color:var(--muted);margin:1.5rem 0 0;letter-spacing:.04em}.start-button{display:block;width:100%;margin-top:2rem;padding:1rem;border-radius:var(--radius-pill);border:none;background:var(--accent);color:#fff;font-family:inherit;font-size:1rem;font-weight:500;letter-spacing:.04em;cursor:pointer;transition:background .2s,transform .15s,box-shadow .2s}.start-button:hover:not(:disabled){background:var(--accent-hover);transform:translateY(-1px);box-shadow:0 6px 20px #9a6f2c4d}.start-button:disabled{opacity:.45;cursor:not-allowed}.session{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.5rem}.phase-label{font-family:Lora,Georgia,serif;font-style:italic;font-size:1.05rem;color:var(--muted);text-align:center;letter-spacing:.01em;margin:0}.ring-wrap{position:relative;width:min(260px,65vw);height:min(260px,65vw)}.ring-svg{width:100%;height:100%;transition:opacity .3s}.ring-svg.paused{opacity:.5}.ring-track{fill:none;stroke:var(--track);stroke-width:3}.ring-fill{fill:none;stroke:var(--accent);stroke-width:3;stroke-linecap:round;transition:stroke-dashoffset 1s linear,stroke .3s}.ring-time{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:clamp(2.5rem,10vw,3.75rem);font-weight:200;font-variant-numeric:tabular-nums;letter-spacing:-.03em;color:var(--text);pointer-events:none}.session-controls{display:flex;gap:.6rem;align-items:center}.ctrl{border-radius:var(--radius-pill);border:1.5px solid var(--track);background:transparent;color:var(--muted);font-family:inherit;font-size:.88rem;cursor:pointer;transition:all .15s ease}.ctrl-pause{width:46px;height:46px;font-size:1rem;padding:0;display:flex;align-items:center;justify-content:center}.ctrl-pause:hover{border-color:var(--text);color:var(--text)}.ctrl-skip{padding:.55rem 1.25rem;border-color:var(--accent);color:var(--accent)}.ctrl-skip:hover{background:var(--accent);color:#fff}.ctrl-stop{padding:.55rem 1.25rem;border-color:var(--danger);color:var(--danger)}.ctrl-stop:hover{background:var(--danger);color:#fff}.screen-hint{font-size:.72rem;color:var(--muted);opacity:.5;margin:0}.complete{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.5rem;text-align:center}.complete-message{display:flex;flex-direction:column;gap:.5rem}.complete-icon{font-size:3rem}.complete-message h2{font-family:Lora,Georgia,serif;font-size:1.7rem;font-weight:400;color:var(--text);margin:0}.complete-message p{font-size:1rem;color:var(--muted);font-style:italic;margin:0}.complete-message .translation{font-size:.85rem;font-style:normal;opacity:.7}.app-footer{padding:1rem 0 0;text-align:center}.app-footer a{font-size:.7rem;color:var(--track);text-decoration:none}.app-footer a:hover{color:var(--accent)}@media(max-width:380px){.pill{padding:.4rem .75rem;font-size:.8rem}}
