.simulator{--header-height:72px;--footer-height:96px;background:var(--studio);width:100vw;height:100svh;min-height:620px;transition:background .6s var(--ease),color .4s var(--ease);position:relative;overflow:hidden}.simulator:after{content:"";z-index:2;height:calc(var(--footer-height) + env(safe-area-inset-bottom));background:var(--studio);border-top:1px solid color-mix(in srgb,var(--graphite) 9%,transparent);pointer-events:none;position:absolute;bottom:0;left:0;right:0}.simulator.is-dim{--studio:#232520;--studio-light:#30332d;--graphite:#f4f5ef;--graphite-soft:#e4e6df;--muted:#b8bcb1;color:#f4f5ef}.scene{z-index:1;inset:calc(var(--header-height) + env(safe-area-inset-top)) 0 calc(var(--footer-height) + env(safe-area-inset-bottom));cursor:grab;touch-action:none;position:absolute}.scene:active{cursor:grabbing}.scene canvas{outline:none;width:100%;height:100%;display:block}.scene-loading{color:var(--muted);letter-spacing:.02em;place-items:center;font-size:13px;display:grid;position:absolute;inset:0}.topbar{z-index:5;height:calc(var(--header-height) + env(safe-area-inset-top));padding:env(safe-area-inset-top) max(22px,env(safe-area-inset-right)) 0 max(22px,env(safe-area-inset-left));background:var(--studio);border-bottom:1px solid color-mix(in srgb,var(--graphite) 9%,transparent);pointer-events:none;justify-content:space-between;align-items:center;display:flex;position:absolute;top:0;left:0;right:0}.wordmark,.state-chip,.top-actions{pointer-events:auto}.wordmark{color:inherit;align-items:center;gap:10px;text-decoration:none;display:flex}.wordmark>span{background:var(--graphite);width:36px;height:36px;color:var(--studio-light);letter-spacing:-.04em;border-radius:9px;place-items:center;font-size:20px;font-weight:650;display:grid}.wordmark b{letter-spacing:-.025em;font-size:17px;font-weight:650}.state-chip{background:var(--studio-light);border:1px solid color-mix(in srgb,var(--graphite) 9%,transparent);border-radius:999px;align-items:center;gap:10px;min-width:210px;max-width:min(420px,35vw);padding:10px 14px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.state-chip>i{background:var(--muted);border-radius:50%;flex:none;width:9px;height:9px}.state-chip.is-live>i{background:var(--signal);box-shadow:0 0 0 4px color-mix(in srgb,var(--signal) 26%,transparent);animation:2.4s ease-out infinite pulse}.state-chip span{text-transform:capitalize;min-width:0;font-size:12px;font-weight:650}.state-chip small{max-width:310px;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;text-transform:none;margin-top:1px;font-size:10px;font-weight:500;display:block;overflow:hidden}.top-actions{gap:8px;display:flex}.icon-button,.service-button,.listen-toggle{transition:transform .3s var(--ease),background .2s,color .2s,opacity .2s;border:0}.icon-button:hover,.service-button:hover,.listen-toggle:hover:not(:disabled){transform:translateY(-2px)}.icon-button:focus-visible,.service-button:focus-visible,.listen-toggle:focus-visible,.drawer-tabs button:focus-visible,.drawer-primary:focus-visible,.drawer-secondary:focus-visible,.field select:focus-visible,.field input:focus-visible{outline:3px solid var(--signal);outline-offset:3px}.icon-button{background:var(--studio-light);width:44px;height:44px;color:var(--graphite);border-radius:10px;place-items:center;padding:0;display:grid}.icon-button svg,.service-button svg,.listen-toggle svg,.drawer-tabs svg{fill:none;stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px}.service-button{background:var(--graphite);height:44px;color:var(--studio-light);border-radius:10px;align-items:center;gap:8px;padding:0 15px;font-size:12px;font-weight:650;display:flex}.album-caption{z-index:3;left:max(24px,env(safe-area-inset-left));bottom:calc(14px + env(safe-area-inset-bottom));pointer-events:none;width:min(520px,44vw);min-width:0;position:absolute}.album-caption span{color:var(--muted);letter-spacing:.04em;text-transform:uppercase;margin-bottom:3px;font-size:9px;font-weight:650;display:block}.album-caption h1{-webkit-line-clamp:2;overflow-wrap:anywhere;letter-spacing:-.035em;text-wrap:balance;-webkit-box-orient:vertical;margin:0;font-size:clamp(18px,2vw,26px);font-weight:560;line-height:1.03;display:-webkit-box;overflow:hidden}.album-caption p{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;margin:4px 0 0;font-size:11px;line-height:1.3;overflow:hidden}.scene-hint{z-index:3;left:50%;bottom:calc(36px + env(safe-area-inset-bottom));color:var(--muted);pointer-events:none;align-items:center;gap:7px;font-size:10px;display:flex;position:absolute;transform:translate(-50%)}.scene-hint span{color:var(--graphite);font-weight:650}.scene-hint i{background:color-mix(in srgb,var(--muted) 55%,transparent);width:16px;height:1px;display:block}.listen-toggle{z-index:4;right:max(22px,env(safe-area-inset-right));bottom:calc(24px + env(safe-area-inset-bottom));background:var(--signal);color:#111310;border-radius:10px;align-items:center;gap:9px;min-height:48px;padding:0 17px;font-size:12px;font-weight:680;display:flex;position:absolute}.listen-toggle.is-stop{background:var(--studio-light);color:var(--graphite)}.listen-toggle:disabled{opacity:.45}.drawer-scrim{z-index:8;opacity:0;pointer-events:none;transition:opacity .35s var(--ease);cursor:default;background:#11131024;border:0;position:absolute;inset:0}.drawer-scrim.is-open{opacity:1;pointer-events:auto}.service-drawer{z-index:9;background:var(--studio-light);width:min(420px,100vw - 24px);color:var(--graphite);border:1px solid color-mix(in srgb,var(--graphite) 9%,transparent);visibility:hidden;transition:transform .5s var(--ease),visibility 0s linear .5s;border-radius:20px;flex-direction:column;display:flex;position:absolute;top:12px;bottom:12px;right:12px;transform:translate(calc(100% + 36px));box-shadow:-18px 24px 64px #1113102e}.service-drawer.is-open{visibility:visible;transition:transform .5s var(--ease),visibility 0s;transform:translate(0)}.drawer-head{justify-content:space-between;align-items:center;padding:21px 20px 14px;display:flex}.drawer-head span{color:var(--muted);letter-spacing:.04em;text-transform:uppercase;font-size:10px;font-weight:650}.drawer-head h2{letter-spacing:-.03em;margin:2px 0 0;font-size:23px;font-weight:600}.drawer-head .icon-button{background:color-mix(in srgb,var(--graphite) 7%,transparent);box-shadow:none}.drawer-tabs{background:color-mix(in srgb,var(--graphite) 6%,transparent);border-radius:12px;grid-template-columns:1fr 1fr;gap:5px;margin:0 20px 12px;padding:4px;display:grid}.drawer-tabs button{color:var(--muted);background:0 0;border:0;border-radius:9px;justify-content:center;align-items:center;gap:8px;padding:10px;font-size:12px;font-weight:650;transition:background .25s,color .2s,box-shadow .25s;display:flex}.drawer-tabs button[aria-selected=true]{background:var(--studio-light);color:var(--graphite);box-shadow:0 5px 16px #11131017}.drawer-message{background:color-mix(in srgb,var(--signal) 26%,var(--studio-light));border-radius:10px;justify-content:space-between;align-items:flex-start;gap:12px;margin:0 20px 12px;padding:10px 12px;font-size:11px;line-height:1.4;display:flex}.drawer-message.is-error{background:color-mix(in srgb,var(--alert) 12%,var(--studio-light));color:var(--alert)}.drawer-message a{color:inherit;text-underline-offset:2px;flex:none;font-weight:680}.drawer-body{overscroll-behavior:contain;flex:1;padding:6px 20px 22px;overflow:auto}.settings-section{flex-direction:column;gap:17px;display:flex}.section-intro{padding:8px 0 2px}.section-intro h3{letter-spacing:-.02em;margin:0 0 5px;font-size:17px}.section-intro p{color:var(--muted);max-width:42ch;margin:0;font-size:12px;line-height:1.5}.live-meter{background:color-mix(in srgb,var(--graphite) 10%,transparent);border-radius:5px;height:8px;position:relative;overflow:hidden}.live-meter span{background:var(--signal);min-width:2px;height:100%;display:block}.live-meter i{background:var(--graphite);width:2px;height:12px;position:absolute;top:-2px}.meter-labels{color:var(--muted);font-variant-numeric:tabular-nums;justify-content:space-between;margin-top:-12px;font-size:10px;display:flex}.field{color:var(--muted);flex-direction:column;gap:7px;font-size:11px;font-weight:620;display:flex}.field>span{justify-content:space-between;display:flex}.field b{color:var(--graphite);font-variant-numeric:tabular-nums;font-weight:650}.field select{border:1px solid color-mix(in srgb,var(--graphite) 14%,transparent);background:color-mix(in srgb,var(--graphite) 4%,var(--studio-light));width:100%;height:42px;color:var(--graphite);border-radius:10px;padding:0 12px;font-size:12px}.field input[type=range]{width:100%;height:6px;accent-color:var(--graphite)}.field-row{grid-template-columns:1fr 1fr;gap:10px;display:grid}.drawer-primary,.drawer-secondary{min-height:44px;transition:transform .25s var(--ease),opacity .2s;border:0;border-radius:10px;padding:0 15px;font-size:12px;font-weight:680}.drawer-primary{background:var(--graphite);color:var(--studio-light)}.drawer-secondary{background:color-mix(in srgb,var(--graphite) 7%,transparent);color:var(--graphite)}.drawer-primary:hover:not(:disabled),.drawer-secondary:hover{transform:translateY(-1px)}.drawer-primary:disabled{opacity:.45}.drawer-actions{gap:8px;display:grid}.refresh-description{color:var(--muted);margin:-8px 0 0;font-size:10px;line-height:1.5}.privacy-note{color:var(--muted);text-wrap:pretty;margin:0;font-size:10px;line-height:1.55}.error-note{background:color-mix(in srgb,var(--alert) 11%,var(--studio-light));color:var(--alert);border-radius:10px;flex-direction:column;gap:3px;padding:12px;font-size:11px;line-height:1.45;display:flex}.error-note b{font-size:12px}.display-note{color:var(--muted);text-align:center;margin:0;padding-top:2px;font-size:10px;line-height:1.5}@keyframes pulse{0%,55%{box-shadow:0 0 0 4px color-mix(in srgb,var(--signal) 25%,transparent)}to{box-shadow:0 0 0 10px #0000}}@media (max-width:760px){.simulator{--header-height:64px;--footer-height:132px;min-height:520px}.topbar{padding:env(safe-area-inset-top) max(14px,env(safe-area-inset-right)) 0 max(14px,env(safe-area-inset-left))}.wordmark b{display:none}.state-chip{min-width:0;max-width:55vw;padding:9px 12px}.state-chip small{display:none}.top-actions{gap:6px}.service-button{justify-content:center;width:44px;padding:0;font-size:0}.album-caption{left:max(16px,env(safe-area-inset-left));right:max(16px,env(safe-area-inset-right));bottom:calc(70px + env(safe-area-inset-bottom));width:auto}.album-caption h1{font-size:18px}.album-caption p{font-size:10px}.scene-hint{display:none}.listen-toggle{left:max(16px,env(safe-area-inset-left));right:auto;bottom:calc(12px + env(safe-area-inset-bottom));min-height:48px}.service-drawer{top:auto;left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right));bottom:max(8px,env(safe-area-inset-bottom));border-radius:20px;width:auto;max-height:min(84svh,720px);transform:translateY(calc(100% + 24px))}.service-drawer.is-open{transform:translateY(0)}.drawer-body{padding-bottom:max(28px,env(safe-area-inset-bottom))}}@media (max-width:430px){.state-chip{max-width:none;left:64px;right:112px;transform:none}.state-chip span{font-size:11px}.album-caption h1{font-size:18px}.album-caption p{font-size:12px}.field-row{grid-template-columns:1fr}.drawer-message{flex-direction:column;align-items:stretch}.drawer-message a{align-self:flex-start}}@media (max-width:760px) and (orientation:landscape){.simulator{--footer-height:88px}.album-caption{right:auto;bottom:calc(12px + env(safe-area-inset-bottom));width:min(52vw,430px)}.album-caption h1{font-size:17px}.album-caption p{font-size:10px}.listen-toggle{left:auto;right:max(14px,env(safe-area-inset-right));bottom:calc(20px + env(safe-area-inset-bottom))}}@media (pointer:coarse){.drawer-tabs button,.drawer-primary,.drawer-secondary,.field select{min-height:48px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}