:root{--accent: #ff5ec4;--accent-soft: rgba(255, 94, 196, .16);--danger: #ff5b6f;--surface: rgba(9, 6, 16, .78);--surface-solid: #0b0711;--line: rgba(255, 255, 255, .13);--line-strong: rgba(255, 255, 255, .23);--text: #f7f4fa;--muted: #aaa2b4;color-scheme:dark}*{box-sizing:border-box}html,body,#root{margin:0;width:100%;height:100%;overflow:hidden;background:#05020a}body{color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased}button,input{font:inherit}button,.filebtn{-webkit-tap-highlight-color:transparent}input[type=file]{display:none}canvas#viz{position:fixed;top:0;right:0;bottom:0;left:0;display:block;width:100vw;height:100vh}.intro{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px;text-align:center;background:radial-gradient(ellipse at 50% 48%,#08041075,#05020abd 70%);transition:opacity .55s ease,visibility .55s;pointer-events:auto}.intro.hidden{opacity:0;visibility:hidden;pointer-events:none}.intro button,.intro .filebtn,.intro a{pointer-events:auto;position:relative;z-index:2}.intro button:disabled,.intro .filebtn.is-busy{opacity:.55;cursor:wait}.engine-status{margin:0 0 14px;color:var(--accent);font-size:13px;font-weight:650}.busy-notice{position:fixed;left:50%;top:max(18px,env(safe-area-inset-top));transform:translate(-50%);z-index:90;padding:10px 16px;border-radius:999px;background:#100818e6;border:1px solid rgba(255,122,224,.4);color:#f3e8ff;font-size:13px;pointer-events:none}.intro-eyebrow,.eyebrow{color:var(--accent);font:700 10px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.2em;text-transform:uppercase}.intro h1{margin:12px 0 4px;font-size:clamp(54px,8vw,104px);line-height:.9;letter-spacing:-.065em;font-weight:850;color:#fff}.intro-lede{margin:22px 0 30px;color:#d7d0dd;font-size:clamp(17px,2vw,21px);letter-spacing:-.015em}.intro-primary{min-width:220px;padding:15px 24px;font-size:15px}.live-sources{display:flex;align-items:center;gap:8px;margin-top:16px}.live-sources>span{margin-right:5px;color:var(--muted);font-size:12px}.privacy-note{margin:26px 0 0;color:var(--muted);font-size:12px}.back-link{position:fixed;left:24px;top:24px;color:var(--muted);font-size:12px;text-decoration:none;transition:color .2s}.back-link:hover{color:#fff}button,.filebtn{border:1px solid var(--line);border-radius:999px;padding:10px 15px;color:var(--text);cursor:pointer;-webkit-user-select:none;user-select:none;background:#ffffff0e;text-align:center;font-size:12.5px;font-weight:650;transition:background .18s ease,border-color .18s ease,transform .12s ease,color .18s ease}button:hover,.filebtn:hover{border-color:var(--line-strong);background:#ffffff1a}button:active,.filebtn:active{transform:scale(.97)}button:focus-visible,.filebtn:focus-within,input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}button.primary,.filebtn.primary{border-color:transparent;background:var(--text);color:#100815;font-weight:780}button.primary:hover,.filebtn.primary:hover{background:#fff}.app-chrome{position:fixed;top:0;right:0;bottom:0;left:0;z-index:14;pointer-events:none;transition:opacity .3s ease}.app-chrome.hidden{opacity:0;pointer-events:none}.app-chrome button,.app-chrome input{pointer-events:auto}.app-chrome.hidden button,.app-chrome.hidden input{pointer-events:none}.topbar{position:absolute;top:18px;left:18px;right:18px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center}.wordmark{justify-self:start;display:flex;align-items:center;gap:9px;font-size:11px;line-height:1;font-weight:800;letter-spacing:.19em}.status-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 16px #ff5ec4d9}.topbar-actions{justify-self:end;display:flex;align-items:center;gap:7px;pointer-events:auto}.help-button{width:36px;height:36px;padding:0;color:var(--muted);background:#08050e94;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.tune-button{min-width:72px;background:#08050e94;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.tune-button.attention{border-color:#ff5ec49e;animation:tune-cue 1.8s ease-in-out 2}@keyframes tune-cue{0%,to{box-shadow:0 0 #ff5ec400}50%{box-shadow:0 0 0 5px #ff5ec41f,0 0 28px #ff5ec438}}.scene-switcher{justify-self:center;display:grid;grid-template-columns:38px minmax(150px,auto) 38px;align-items:stretch;border:1px solid var(--line);border-radius:999px;overflow:hidden;background:#08050e94;-webkit-backdrop-filter:blur(18px) saturate(1.25);backdrop-filter:blur(18px) saturate(1.25);box-shadow:0 14px 38px #0000003d}.scene-switcher>button{border:0;border-radius:0;padding:8px 11px;background:transparent}.scene-switcher>button:first-child{border-right:1px solid var(--line)}.scene-switcher>button:last-child{border-left:1px solid var(--line)}.scene-current{display:flex;flex-direction:column;align-items:center;min-width:180px}.scene-current span{margin-bottom:2px;color:var(--muted);font-size:8px;line-height:1;letter-spacing:.16em;text-transform:uppercase}.transport{position:absolute;left:50%;bottom:18px;transform:translate(-50%);width:min(760px,calc(100vw - 36px));display:flex;align-items:center;gap:13px;padding:11px 12px;border:1px solid var(--line);border-radius:18px;background:var(--surface);-webkit-backdrop-filter:blur(24px) saturate(1.25);backdrop-filter:blur(24px) saturate(1.25);box-shadow:0 22px 64px #00000070}.transport .play{flex:0 0 auto;width:44px;height:44px;padding:0;display:grid;place-items:center;border:0;background:#fff;color:#100815;font-size:14px}.track-area{min-width:0;flex:1}.track-meta{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px}.track-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12.5px;font-weight:720}.time,.live-badge{flex:0 0 auto;color:var(--muted);font:600 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace}.live-badge{color:#78efbd}.seek{display:block;width:100%}.volume-control{flex:0 0 82px}.volume-control>span{display:block;margin-bottom:7px;color:var(--muted);font-size:9px;text-align:center}.record-button{flex:0 0 auto;display:flex;align-items:center;gap:7px;padding-inline:16px}.record-dot{width:8px;height:8px;border-radius:50%;background:var(--danger);box-shadow:0 0 10px #ff5b6fb3}.record-button.recording{border-color:#ff5b6fa6;background:#ff5b6f24}.controls-guide{position:absolute;z-index:2;top:68px;right:18px;width:min(370px,calc(100vw - 36px));padding:18px;border:1px solid var(--line-strong);border-radius:18px;color:var(--text);background:#0a060ff0;box-shadow:0 24px 70px #0000007a;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);pointer-events:auto;animation:guide-in .28s cubic-bezier(.22,1,.36,1) both}.controls-guide:before{content:"";position:absolute;top:-6px;right:39px;width:11px;height:11px;transform:rotate(45deg);border-left:1px solid var(--line-strong);border-top:1px solid var(--line-strong);background:#0d0813}.controls-guide strong{display:block;margin-top:7px;font-size:15px;letter-spacing:-.015em}.controls-guide p{margin:8px 0 14px;color:var(--muted);font-size:12px;line-height:1.5}.shortcut-row{display:grid;grid-template-columns:auto 1fr auto 1fr;align-items:center;gap:7px 8px;color:#c9c1cf;font-size:10px;line-height:1.5}kbd{display:inline-grid;min-width:22px;height:22px;place-items:center;padding:0 6px;border:1px solid var(--line-strong);border-radius:6px;color:#fff;background:#ffffff12;font:700 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;box-shadow:inset 0 -1px #ffffff0f}.controls-guide>button{margin-top:15px;padding:9px 14px;background:#fff;color:#100815}.ui-restore{position:fixed;z-index:18;top:16px;right:16px;display:flex;align-items:center;gap:8px;padding:8px 12px;background:#08050ec2;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);animation:guide-in .22s ease both}@keyframes guide-in{0%{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:none}}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:3px;border-radius:2px;background:#ffffff2e;outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border:2px solid #140a18;border-radius:50%;background:var(--text);box-shadow:0 0 0 1px #ffffff2e;cursor:pointer}input[type=range]::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:50%;background:var(--text);cursor:pointer}.drawer-scrim{position:fixed;top:0;right:0;bottom:0;left:0;z-index:29;width:100%;padding:0;border:0;border-radius:0;background:#03010780;opacity:0;visibility:hidden;pointer-events:none;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity .28s ease,visibility .28s}.drawer-scrim.visible{opacity:1;visibility:visible;pointer-events:auto}.customizer{position:fixed;z-index:30;top:0;right:0;width:min(400px,92vw);height:100%;padding:0 24px 32px;overflow-y:auto;color:var(--text);background:#0a060ff5;border-left:1px solid var(--line);box-shadow:-30px 0 90px #00000085;transform:translate(102%);transition:transform .34s cubic-bezier(.22,1,.36,1);overscroll-behavior:contain}.customizer.open{transform:translate(0)}.customizer-head{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;min-height:88px;background:linear-gradient(var(--surface-solid) 72%,transparent);padding-bottom:14px}.customizer h2{margin:6px 0 0;font-size:24px;line-height:1;letter-spacing:-.035em}.head-actions{display:flex;align-items:center;gap:5px}.text-button{border:0;padding:9px;color:var(--muted);background:transparent}.close-button{width:38px;height:38px;padding:0;border:0;background:#ffffff12;font-size:24px;line-height:1}.custom-section{display:block;padding:24px 0;border-top:1px solid var(--line)}.section-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:16px}.section-heading p{margin:6px 0 0;color:var(--muted);font-size:12px;line-height:1.45}.auto-toggle{display:flex;align-items:center;gap:7px;flex:0 0 auto;padding:8px 11px;color:var(--muted)}.toggle-dot{width:7px;height:7px;border-radius:50%;background:#736b7d}.auto-toggle.on{border-color:#ff5ec466;color:#fff;background:var(--accent-soft)}.auto-toggle.on .toggle-dot{background:var(--accent);box-shadow:0 0 10px #ff5ec4bf}.scene-list{display:grid;grid-template-columns:1fr 1fr;gap:6px}.scene-list button{display:flex;gap:10px;align-items:center;min-width:0;padding:10px 11px;border-radius:10px;text-align:left;color:#cbc4d0;background:transparent}.scene-list button>span{color:#6f6878;font:600 9px ui-monospace,SFMono-Regular,Menlo,monospace}.scene-list button.selected{border-color:#ff5ec480;color:#fff;background:var(--accent-soft)}.scene-list button.selected>span{color:var(--accent)}.palette-list{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-bottom:14px}.palette-list button{display:flex;flex-direction:column;align-items:center;gap:7px;min-width:0;padding:8px 3px;border:0;border-radius:10px;color:var(--muted);background:transparent;font-size:10px}.palette-list button.selected{color:#fff;background:#ffffff14}.swatch{width:26px;height:26px;border:2px solid rgba(255,255,255,.15);border-radius:50%}.palette-list button.selected .swatch{box-shadow:0 0 0 2px var(--surface-solid),0 0 0 3px var(--text)}.segmented{display:grid;grid-template-columns:repeat(3,1fr);padding:3px;border-radius:12px;background:#ffffff0f}.segmented button{border:0;border-radius:9px;padding:9px 7px;color:var(--muted);background:transparent;font-size:11px}.segmented button.selected{color:#fff;background:#ffffff1f;box-shadow:0 1px 6px #00000040}.fine-tune{padding:0}.fine-tune summary{display:flex;justify-content:space-between;align-items:center;padding:23px 0;cursor:pointer;list-style:none}.fine-tune summary::-webkit-details-marker{display:none}.fine-tune summary>span:first-child{display:flex;flex-direction:column;gap:6px}.fine-tune summary b{font-size:13px}.summary-mark{color:var(--muted);font-size:22px;transition:transform .2s ease}.fine-tune[open] .summary-mark{transform:rotate(45deg)}.advanced-controls{padding:0 0 24px}.slider{margin:0 0 17px}.slider label{display:flex;justify-content:space-between;gap:16px;margin-bottom:9px;color:#c7c0cc;font-size:11px}.slider label b{color:var(--muted);font:600 10px ui-monospace,SFMono-Regular,Menlo,monospace}.quality-row>label{display:block;margin-bottom:9px;color:#c7c0cc;font-size:11px}.quality-options{grid-template-columns:1fr 1fr;gap:3px}.audio-section .slider{margin-bottom:20px}.audio-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.audio-actions .filebtn{grid-column:1 / -1}.debug{position:fixed;z-index:25;left:18px;bottom:18px;width:220px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--surface);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);font:600 10.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace}.debug .bar{display:grid;grid-template-columns:62px 1fr 34px;gap:7px;align-items:center;margin:5px 0;color:var(--muted)}.debug .bar .track{height:6px;overflow:hidden;border-radius:3px;background:#ffffff1a}.debug .bar .fill{height:100%;border-radius:3px}.debug .flash{display:flex;gap:8px;margin-top:8px}.debug .lamp{flex:1;padding:5px 0;border-radius:7px;color:var(--muted);background:#ffffff0f;text-align:center}@media (max-width: 680px){.intro{justify-content:center;padding:28px 22px}.intro h1{margin-top:10px;font-size:clamp(54px,19vw,74px)}.intro-lede{margin:18px 0 28px;font-size:17px}.intro-primary{width:min(100%,310px);padding:16px 22px}.live-sources{display:grid;grid-template-columns:1fr 1fr;width:min(100%,310px)}.live-sources>span{grid-column:1 / -1;margin:0 0 2px}.live-sources button{padding:12px 10px}.privacy-note{max-width:260px;line-height:1.5}.back-link{top:18px;left:18px}.topbar{top:max(12px,env(safe-area-inset-top));left:12px;right:12px;display:flex;justify-content:space-between}.wordmark{font-size:10px}.topbar-actions{gap:5px}.help-button{width:34px;height:34px}.tune-button{min-width:64px;padding:9px 12px}.scene-switcher{position:fixed;top:calc(max(12px,env(safe-area-inset-top)) + 48px);left:50%;transform:translate(-50%);grid-template-columns:38px minmax(160px,auto) 38px}.scene-current{min-width:170px}.controls-guide{position:fixed;top:calc(max(12px,env(safe-area-inset-top)) + 99px);left:12px;right:12px;width:auto}.controls-guide:before{right:42px}.ui-restore{top:max(12px,env(safe-area-inset-top));right:12px}.transport{left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));width:auto;transform:none;display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;padding:10px;border-radius:17px}.track-meta{margin-bottom:7px}.track-name{font-size:11.5px}.time{font-size:9px}.volume-control{display:none}.record-button{min-width:48px;justify-content:center;padding:12px;font-size:0}.record-button .record-dot{width:10px;height:10px}.record-button.recording:after{content:"■";color:var(--danger);font-size:12px}.record-button.recording .record-dot{display:none}.customizer{top:auto;bottom:0;width:100%;height:auto;max-height:min(86svh,760px);padding:0 18px calc(24px + env(safe-area-inset-bottom));border-top:1px solid var(--line);border-left:0;border-radius:22px 22px 0 0;transform:translateY(102%);box-shadow:0 -28px 80px #0009}.customizer.open{transform:translateY(0)}.customizer-head{min-height:78px}.customizer-head:before{content:"";position:absolute;top:7px;left:50%;width:38px;height:3px;transform:translate(-50%);border-radius:2px;background:#fff3}.customizer h2{font-size:22px}.custom-section{padding-block:21px}.scene-list{grid-template-columns:1fr}.palette-list{gap:2px}.palette-list button{font-size:9px}.quality-options{grid-template-columns:1fr 1fr}body.gx-customizer-open .app-chrome{opacity:0;pointer-events:none}.debug{left:10px;right:10px;bottom:90px;width:auto}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}.perf-notice{position:fixed;left:50%;bottom:86px;transform:translate(-50%);max-width:min(92vw,560px);padding:10px 16px;border-radius:999px;background:#100818d1;border:1px solid rgba(255,122,224,.35);color:#f3e8ff;font-size:12.5px;line-height:1.45;text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:none;z-index:60;animation:perfNoticeIn .35s ease}@keyframes perfNoticeIn{0%{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%)}}@media (prefers-reduced-motion: reduce){.perf-notice{animation:none}}canvas#viz-overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:block;pointer-events:none;z-index:2}.blackout-veil{position:fixed;top:0;right:0;bottom:0;left:0;z-index:12;background:#000;pointer-events:none}.rec-badge{position:fixed;top:max(14px,env(safe-area-inset-top));left:50%;transform:translate(-50%);z-index:40;display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:#28080ee0;border:1px solid rgba(255,91,111,.55);color:#ffe4e8;font:700 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);pointer-events:none}.rec-pulse{width:9px;height:9px;border-radius:50%;background:var(--danger);box-shadow:0 0 12px #ff5b6fe6;animation:recPulse 1s ease-in-out infinite}@keyframes recPulse{0%,to{opacity:1}50%{opacity:.35}}.safe-banner{width:min(420px,92vw);margin:18px 0 0;padding:14px 16px;border-radius:16px;border:1px solid var(--line);background:#0a0610e0;text-align:left}.safe-banner p{margin:0 0 10px;color:var(--muted);font-size:12px;line-height:1.45}.safe-actions{display:flex;gap:8px;flex-wrap:wrap}.safe-actions .primary{background:#fff;color:#100815;border-color:transparent;font-weight:750}.demo-btn{margin-top:12px;min-width:220px;padding:12px 20px;background:#ff5ec41f;border-color:#ff5ec459}.fps-pill,.remote-pill{margin-left:8px;padding:3px 7px;border-radius:999px;font:600 9px/1 ui-monospace,Menlo,monospace;letter-spacing:.04em;color:var(--muted);background:#ffffff0f;border:1px solid var(--line);text-transform:none}.remote-pill{color:#78efbd;border-color:#78efbd4d}.chip-row{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}.chip{padding:8px 11px;border-radius:999px;font-size:11px;color:#d8d0e0;background:#ffffff0d;border:1px solid var(--line)}.chip:hover{border-color:var(--line-strong)}.preset-save-row{display:grid;grid-template-columns:1fr auto auto;gap:6px;margin-bottom:10px}.preset-save-row input,.text-field input,.text-field textarea{width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:#ffffff0d;color:var(--text);outline:none}.preset-save-row input:focus,.text-field input:focus,.text-field textarea:focus{border-color:#ff5ec473}.preset-list{display:flex;flex-direction:column;gap:4px}.preset-row{display:grid;grid-template-columns:1fr auto auto;gap:4px;align-items:center}.preset-load{text-align:left;padding:9px 11px;border-radius:10px;background:transparent;color:#cbc4d0}.preset-load:hover{background:#ffffff0f}.icon-btn{width:34px;height:34px;padding:0;border-radius:10px;color:var(--muted)}.scene-list-thumbs{grid-template-columns:1fr 1fr}.scene-list-thumbs button{display:grid;grid-template-columns:36px 1fr;gap:8px;align-items:center;min-height:48px;padding:8px 10px}.scene-thumb{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;font-size:14px;color:#fff;box-shadow:inset 0 0 0 1px #ffffff1f}.scene-meta{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;font-size:12px}.scene-num{color:#6f6878;font:600 9px ui-monospace,Menlo,monospace}.palette-list-wide{grid-template-columns:repeat(auto-fill,minmax(52px,1fr))}.color-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:0 0 14px}.color-cell{display:flex;flex-direction:column;align-items:center;gap:5px;font-size:9px;color:var(--muted)}.color-cell input[type=color]{width:36px;height:36px;padding:0;border:1px solid var(--line);border-radius:10px;background:transparent;cursor:pointer}.text-field{display:block;margin:0 0 10px}.text-field>span{display:block;margin-bottom:6px;color:#c7c0cc;font-size:11px}.text-field textarea{resize:vertical;min-height:64px;font:inherit}.toggle-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:8px 0 12px}.primary-action{grid-column:1 / -1;background:#fff;color:#100815;border-color:transparent;font-weight:780}.primary-action.recording{background:#ff5b6f33;color:#ffd0d6;border-color:#ff5b6f80}.selected-action{border-color:#ff5ec480;background:var(--accent-soft)}.hint{margin:10px 0 0;color:var(--muted);font-size:11px;line-height:1.45}.playlist{display:flex;flex-direction:column;gap:4px;margin-top:12px;max-height:160px;overflow:auto}.playlist button{text-align:left;padding:9px 11px;border-radius:10px;background:transparent;color:#cbc4d0;font-size:12px}.playlist button.selected{border-color:#ff5ec473;background:var(--accent-soft);color:#fff}.remote-box{margin-top:12px;padding:12px;border-radius:12px;border:1px solid var(--line);background:#ffffff0a;font-size:11px;color:var(--muted);line-height:1.5;word-break:break-all}.remote-box a{color:#7ee8ff}.remote-box button{margin-top:8px}.legal-links{display:flex;gap:14px;margin-top:10px}.legal-links a{color:var(--muted);font-size:12px;text-decoration:none}.legal-links a:hover{color:#fff}.webgl-fail{min-height:100vh;display:grid;place-content:center;gap:10px;padding:32px;text-align:center;background:#05020a;color:#f3e9ff}.webgl-fail h1{margin:0;font-size:28px;letter-spacing:-.03em}.webgl-fail p{margin:0;color:var(--muted);max-width:420px;line-height:1.5}.webgl-fail a{color:var(--accent)}@media (max-width: 680px){.scene-list-thumbs,.preset-save-row{grid-template-columns:1fr}.color-grid{grid-template-columns:repeat(3,1fr)}.rec-badge{top:calc(max(12px,env(safe-area-inset-top)) + 96px)}}