:root{font-family:Manrope,sans-serif;color:#f0ecdf;background:#10110d;font-synthesis:none;--ink: #f0ecdf;--muted: #aaa99d;--gold: #e6b969;--gold-soft: #f0d59c;--surface: rgba(28, 29, 23, .74);--line: rgba(240, 236, 223, .14)}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden;overscroll-behavior:none;touch-action:manipulation}body{background:#10110d;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}button,a{color:inherit;font:inherit}button{border:0;cursor:pointer}#app{position:relative;isolation:isolate;background:radial-gradient(circle at 50% 52%,rgba(93,79,46,.13),transparent 38%),#10110d}#visualizer{position:absolute;inset:0;width:100%;height:100%;z-index:-2}.grain{position:absolute;inset:0;pointer-events:none;z-index:-1;opacity:.17;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.16'/%3E%3C/svg%3E");mix-blend-mode:soft-light}.chrome{transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1)}.performance-mode .chrome{opacity:0;pointer-events:none}.performance-mode .topbar{transform:translateY(-16px)}.performance-mode .controls{transform:translate(-50%,20px)}.topbar{position:absolute;z-index:4;top:0;left:0;width:100%;display:flex;align-items:center;justify-content:space-between;padding:calc(20px + env(safe-area-inset-top)) calc(24px + env(safe-area-inset-right)) 16px calc(24px + env(safe-area-inset-left))}.brand{display:flex;gap:11px;align-items:center;color:#e8e4d8;text-decoration:none;font-size:14px;letter-spacing:.03em;font-weight:600}.brand-mark{position:relative;width:25px;height:25px;display:grid;place-items:center}.brand-mark i{position:absolute;width:23px;height:10px;border:1px solid var(--gold);border-radius:50%}.brand-mark i:nth-child(2){transform:rotate(60deg)}.brand-mark i:nth-child(3){transform:rotate(120deg)}.top-actions{display:flex;align-items:center;gap:10px}.listening-pill{height:42px;display:flex;align-items:center;gap:9px;padding:0 16px;border:1px solid var(--line);border-radius:99px;background:#10110d8f;color:var(--muted);font-size:12px;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.live-dot{width:6px;height:6px;border-radius:50%;background:#6f7168;box-shadow:0 0 0 4px #6f71681a;transition:background .4s,box-shadow .4s}.is-listening .live-dot{background:var(--gold);box-shadow:0 0 0 4px #e6b9691f;animation:pulse 2.4s ease-in-out infinite}@keyframes pulse{50%{box-shadow:0 0 0 8px #e6b96900}}.icon-button,.pause-button{display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:#10110d8f;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.icon-button{width:42px;height:42px}.icon-button svg,.pause-button svg,.listen-button svg,.privacy svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.icon-button svg{width:18px}main{height:100%}.welcome{position:absolute;z-index:3;left:clamp(28px,7vw,96px);top:50%;width:min(490px,calc(100vw - 56px));transform:translateY(-48%);transition:opacity .85s cubic-bezier(.16,1,.3,1),transform .85s cubic-bezier(.16,1,.3,1),visibility .85s}.started .welcome{opacity:0;visibility:hidden;transform:translateY(-44%);pointer-events:none}.eyebrow{margin:0 0 18px;color:var(--gold);font-size:11px;font-weight:600;letter-spacing:.19em;text-transform:uppercase}h1{margin:0;font-family:"Instrument Serif",Iowan Old Style,Georgia,serif;font-size:clamp(57px,7.1vw,102px);font-weight:400;line-height:.88;letter-spacing:-.035em}h1 em{color:var(--gold-soft);font-weight:400}.intro{max-width:450px;margin:28px 0 30px;color:var(--muted);font-size:clamp(14px,1.4vw,17px);line-height:1.7}.welcome-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.listen-button{height:54px;display:flex;align-items:center;gap:18px;padding:0 21px 0 24px;border-radius:99px;background:#e7b969;color:#181710;font-weight:600;font-size:13px;transition:transform .2s ease,background .2s ease}.listen-button:hover{transform:translateY(-2px);background:#f0c779}.listen-button:active{transform:scale(.98)}.listen-button:disabled{cursor:wait;opacity:.72;transform:none}.listen-button svg{width:20px}.demo-button{padding:8px 0;background:transparent;color:#bbb9ad;font-size:12px;border-bottom:1px solid rgba(187,185,173,.36)}.privacy{display:flex;align-items:center;gap:7px;margin:18px 0 0 4px;color:#6f7068;font-size:10px;letter-spacing:.02em}.privacy svg{width:13px}.error-message{min-height:18px;color:#d99374;font-size:12px}.now-playing{position:absolute;z-index:2;right:calc(28px + env(safe-area-inset-right));top:50%;display:flex;align-items:flex-end;gap:30px;opacity:0;transform:translateY(-50%);pointer-events:none}.started .now-playing{opacity:.8}.performance-mode .now-playing{opacity:0}.note-readout{display:flex;flex-direction:column;align-items:flex-end}.note-label,.energy-readout>span{color:#77786f;font-size:9px;letter-spacing:.16em;text-transform:uppercase}.note-value{min-width:82px;color:#d9d5c7;font-family:"Instrument Serif",serif;font-size:48px;line-height:.9;text-align:right}.energy-readout{display:flex;flex-direction:column;gap:10px;padding-bottom:4px}.energy-track{width:74px;height:2px;overflow:hidden;background:#ffffff1f}.energy-track i{display:block;width:0;height:100%;background:var(--gold);transition:width 80ms linear}.controls{position:absolute;z-index:5;left:50%;bottom:calc(22px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:12px;transform:translate(-50%);opacity:0;pointer-events:none}.started .controls{opacity:1;pointer-events:auto}#app.performance-mode .controls{opacity:0;pointer-events:none}.mode-switcher{display:flex;padding:5px;border:1px solid var(--line);border-radius:99px;background:var(--surface);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.mode-button{height:42px;min-width:96px;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 16px;border-radius:99px;background:transparent;color:#8f9087;font-size:11px;transition:color .25s,background .25s}.mode-button.active{background:#f0ecdf1a;color:#f0ecdf}.mode-glyph{width:14px;height:14px;border:1px solid currentColor;border-radius:50%}.bloom-glyph{border-radius:50% 25%;transform:rotate(45deg)}.halo-glyph{box-shadow:inset 0 0 0 3px #1e1e19,inset 0 0 0 4px currentColor}.orbit-glyph{width:15px;height:8px;transform:rotate(-18deg)}.pause-button{width:54px;height:54px;color:#d9d5c7}.pause-button svg{width:21px}.pause-button .play-icon{display:none;fill:none}.paused .pause-button .pause-icon{display:none}.paused .pause-button .play-icon{display:block}.tap-hint{position:absolute;z-index:3;left:50%;bottom:calc(25px + env(safe-area-inset-bottom));transform:translate(-50%);color:#f0ecdf6b;font-size:10px;letter-spacing:.08em;opacity:0;pointer-events:none}.performance-mode .tap-hint{opacity:1}@media(max-width:760px){.topbar{padding-inline:18px}.welcome{left:28px;top:47%}.intro{max-width:370px}.mode-button{min-width:0;padding-inline:12px}.mode-button .mode-glyph{display:none}.now-playing{top:auto;bottom:100px;right:22px}}@media(max-width:520px){.listening-pill{display:none}h1{font-size:clamp(53px,16vw,75px)}.welcome-actions{align-items:flex-start;flex-direction:column;gap:10px}.controls{bottom:calc(16px + env(safe-area-inset-bottom))}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}