*,*:before,*:after{box-sizing:border-box}*{margin:0}html{interpolate-size:allow-keywords}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p{overflow-wrap:break-word;text-wrap:pretty}h1,h2,h3,h4,h5,h6{overflow-wrap:break-word;text-wrap:balance}#root,#app{isolation:isolate}:root{--font-ui: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;--font-serif: Georgia, "Iowan Old Style", "Times New Roman", serif;--font-mono: ui-monospace, "SF Mono", "Cascadia Code", Menlo, Consolas, monospace;--color-cream: #f2ddb8;--color-cream-panel: #faf2e0;--color-tan: #dd9f52;--color-tan-strong: #c78538;--color-teal: #3d6d64;--color-teal-strong: #2e544d;--color-burgundy: #7c3220;--color-burgundy-strong: #5e2417;--color-ink: #2a2119;--color-ink-soft: #6b5c48;--color-border: rgba(42, 33, 25, .22);--shadow-panel: 0 1px 0 rgba(255, 255, 255, .5) inset, 0 6px 14px rgba(42, 33, 25, .12);--shadow-well: inset 0 2px 5px rgba(42, 33, 25, .28);--radius-lg: 22px;--radius-md: 14px;--radius-pill: 999px;font-family:var(--font-ui);color-scheme:light dark}@media(prefers-color-scheme:dark){:root{--color-cream: #1c1712;--color-cream-panel: #241d16;--color-tan: #e2a75f;--color-tan-strong: #eab876;--color-teal: #5b9086;--color-teal-strong: #74a89e;--color-burgundy: #c0623f;--color-burgundy-strong: #d97a52;--color-ink: #f2e3c8;--color-ink-soft: #c2b096;--color-border: rgba(242, 227, 200, .18);--shadow-panel: 0 1px 0 rgba(255, 255, 255, .04) inset, 0 6px 16px rgba(0, 0, 0, .4);--shadow-well: inset 0 2px 6px rgba(0, 0, 0, .45)}}body{min-height:100dvh;background:var(--color-cream);color:var(--color-ink)}.page{max-width:80ch;margin-inline:auto;padding:2rem}button:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--color-burgundy);outline-offset:2px}.device{display:grid;grid-template-areas:"plate" "stage" "controls";grid-template-rows:auto auto auto;gap:.85rem;min-height:100dvh;padding:.85rem;background:var(--color-cream)}@media(min-width:860px){.device{grid-template-areas:"plate plate" "stage controls";grid-template-columns:minmax(320px,420px) 1fr;grid-template-rows:auto 1fr;padding:1.25rem;gap:1rem}}.device__plate{grid-area:plate;display:flex;flex-direction:column;gap:.2rem;padding:.9rem 1.1rem;background:var(--color-cream-panel);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-panel)}.device__brand{display:flex;align-items:baseline;justify-content:space-between;gap:.75rem;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--color-ink-soft)}.device__model{color:var(--color-burgundy);font-weight:700}.device__title{font-family:var(--font-serif);font-size:clamp(1.5rem,2.4vw + 1rem,2.1rem);font-style:italic;color:var(--color-ink)}.device__subtitle{max-width:62ch;color:var(--color-ink-soft);font-size:.92rem}.panel{background:var(--color-cream-panel);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-panel);padding:.85rem 1rem 1rem}.panel__label{font-family:var(--font-mono);font-size:.68rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--color-ink-soft);margin-block-end:.65rem}.device__controls{grid-area:controls;display:flex;flex-direction:column;gap:.85rem;min-height:0}@media(min-width:860px){.device__controls{overflow-y:auto}}.pill-button{appearance:none;border:1px solid var(--color-border);border-radius:var(--radius-pill);background:var(--color-cream);color:var(--color-ink);padding:.55rem 1.1rem;font-size:.9rem;font-weight:600;cursor:pointer;transition:background-color .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease}.pill-button:hover{background:color-mix(in srgb,var(--color-tan) 25%,var(--color-cream))}.pill-button:active{transform:scale(.97)}.pill-button--primary{background:var(--color-burgundy);border-color:var(--color-burgundy-strong);color:var(--color-cream-panel)}.pill-button--primary:hover{background:var(--color-burgundy-strong)}.technique-selector__list{display:flex;flex-wrap:wrap;gap:.5rem}.technique-selector__item{display:flex;flex-direction:column;align-items:flex-start;gap:.1rem;padding:.5rem .95rem}.technique-selector__item[aria-pressed=true]{background:var(--color-teal);border-color:var(--color-teal-strong);color:var(--color-cream-panel)}.technique-selector__name{font-size:.85rem;font-weight:700}.technique-selector__tagline{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.04em;opacity:.8}.tempo-panel{display:flex;justify-content:center}.knob{display:flex;flex-direction:column;align-items:center;gap:.35rem}.knob__dial{position:relative;width:84px;height:84px;border-radius:50%;background:radial-gradient(circle at 32% 28%,var(--color-cream) 0%,var(--color-tan) 70%,var(--color-tan-strong) 100%);border:1px solid var(--color-border);box-shadow:var(--shadow-panel);cursor:grab;touch-action:none}.knob__dial:active{cursor:grabbing}.knob__indicator{position:absolute;top:8px;left:50%;width:4px;height:30px;margin-left:-2px;border-radius:var(--radius-pill);background:var(--color-burgundy);transform-origin:50% 34px}.knob__label{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--color-ink-soft)}.knob__value{font-family:var(--font-mono);font-size:.95rem;font-weight:700;color:var(--color-burgundy)}.phase-tuner__grid{display:grid;gap:.5rem}.phase-tuner__row{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.35rem .6rem;background:var(--color-cream);border:1px solid var(--color-border);border-radius:var(--radius-md)}.phase-tuner__name{font-size:.82rem;font-weight:600}.phase-tuner__stepper{display:flex;align-items:center;gap:.5rem}.phase-tuner__value{font-family:var(--font-mono);font-size:.82rem;min-width:3ch;text-align:center}.stepper-button{appearance:none;width:26px;height:26px;border-radius:50%;border:1px solid var(--color-border);background:var(--color-cream-panel);color:var(--color-ink);font-size:1rem;line-height:1;cursor:pointer;transition:background-color .18s ease,transform .18s ease}.stepper-button:hover:not(:disabled){background:color-mix(in srgb,var(--color-tan) 30%,var(--color-cream-panel))}.stepper-button:active:not(:disabled){transform:scale(.92)}.stepper-button:disabled{opacity:.35;cursor:not-allowed}.device__stage{grid-area:stage;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.25rem;padding:1.5rem 1rem;background:var(--color-cream-panel);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-panel)}.breath-guide{display:flex;flex-direction:column;align-items:center;gap:.85rem}.breath-guide__ring{position:relative;width:min(46vw,260px);height:min(46vw,260px);border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px dashed var(--color-border)}.breath-guide__orb{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 34% 30%,var(--color-teal-strong) 0%,var(--color-teal) 70%);box-shadow:var(--shadow-well),0 8px 22px #2a211933;transition:transform .16s linear}.breath-guide__readout{position:relative;display:flex;flex-direction:column;align-items:center;gap:.15rem;color:var(--color-cream-panel)}.breath-guide__phase{font-family:var(--font-mono);font-size:.85rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.breath-guide__seconds{font-family:var(--font-serif);font-size:2.6rem;font-style:italic;line-height:1}.breath-guide__cycle{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--color-ink-soft)}.transport{display:flex;gap:.6rem}
