:root{--bg: #07080a;--ink: #f4f5f7;--muted: rgba(244, 245, 247, .62);--dim: rgba(244, 245, 247, .38);--line: rgba(255, 255, 255, .14);--panel: rgba(8, 10, 12, .62);--font: "Barlow", system-ui, sans-serif;--cond: "Barlow Condensed", "Barlow", system-ui, sans-serif;--power: #b07cff;--handling: #5ad0ff;--range: #7dffb3;--capability: #ffd36a}html[data-studio=white]{--bg: #e8eaee;--ink: #14161a;--muted: rgba(20, 22, 26, .62);--dim: rgba(20, 22, 26, .4);--line: rgba(20, 22, 26, .14);--panel: rgba(255, 255, 255, .72)}*{box-sizing:border-box;margin:0;padding:0}html,body,#app{width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--ink);font-family:var(--font)}#stage{position:absolute;inset:0;display:block;width:100%;height:100%}#loader{position:absolute;inset:0;z-index:40;display:grid;place-items:center;background:#050607;transition:opacity .8s ease,visibility .8s ease}#loader.is-done{opacity:0;visibility:hidden;pointer-events:none}.loader-frame{position:relative;width:min(520px,88vw);aspect-ratio:16 / 9;overflow:hidden}.loader-still{width:100%;height:100%;object-fit:cover}.loader-veil{position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,#050607 100%)}.loader-copy{position:absolute;left:0;right:0;bottom:22px;text-align:center;padding:0 20px}.eyebrow{font-family:var(--cond);letter-spacing:.28em;text-transform:uppercase;font-size:11px;color:var(--muted)}.loader-copy h1,.brand-name{font-family:var(--cond);font-weight:500;letter-spacing:.42em;font-size:clamp(26px,5vw,40px);margin:6px 0}.loader-sub,.loader-status{font-weight:300;font-size:13px;color:var(--muted)}.loader-bar{width:140px;height:1px;margin:14px auto 8px;background:#ffffff24}.loader-bar span{display:block;height:100%;width:0;background:#fff;transition:width .25s linear}#topbar,#spec,#panel-wrap{position:absolute;z-index:8;pointer-events:none}#topbar button,#spec,#spec *,#panel-toggle,#panel{pointer-events:auto}#topbar{top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;padding:22px 28px;pointer-events:none}#topbar .top-actions{pointer-events:auto}.brand{display:flex;flex-direction:column;gap:2px;pointer-events:none}.brand-name{font-size:22px;letter-spacing:.36em;line-height:1;text-transform:uppercase}.top-actions{display:flex;gap:8px;align-items:center}.studio-pair{display:flex;gap:4px}.ghost,.choice,.play-btn{font-family:var(--cond);letter-spacing:.16em;text-transform:uppercase;border:1px solid var(--line);background:var(--panel);color:var(--ink);cursor:pointer;backdrop-filter:blur(12px)}.ghost{padding:8px 14px;font-size:12px}.info-btn{width:36px;padding:8px 0;font-family:Times New Roman,Times,serif;font-style:italic;font-size:16px;letter-spacing:0;text-transform:none}.ghost.is-on,.choice.is-on{background:var(--ink);color:var(--bg);border-color:var(--ink)}#spec{left:28px;top:110px;display:flex;align-items:flex-end;gap:12px}#panel-wrap{right:0;top:88px;bottom:24px;display:flex;flex-direction:row;align-items:flex-start}#panel-toggle{flex:0 0 auto;margin:12px 8px 0 0;min-width:52px}#panel{width:min(320px,34vw);height:100%;overflow:auto;padding:8px 20px 8px 8px;display:flex;flex-direction:column;gap:16px;transition:width .28s ease,opacity .2s ease,padding .28s ease}#app.is-panel-collapsed #panel{width:0;padding:0;opacity:0;overflow:hidden;pointer-events:none}#panel section{padding:14px;background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(16px)}#panel h3{font-family:var(--cond);font-size:12px;letter-spacing:.22em;text-transform:uppercase;font-weight:500;margin-bottom:10px}.swatch-row,.choice-row{display:flex;flex-wrap:wrap;gap:8px}.choice-row.stack{flex-direction:column}.swatch{width:28px;height:28px;border-radius:50%;border:1px solid var(--line);background:var(--swatch);cursor:pointer}.swatch.is-on{outline:2px solid var(--ink);outline-offset:2px}.choice{padding:8px 10px;font-size:11px;text-align:left}.choice.wide{width:100%}.hex-field{display:flex;flex-direction:column;gap:6px;margin-top:12px}.hex-row{display:flex;align-items:center;gap:8px}#paint-color{width:36px;height:36px;padding:0;border:1px solid var(--line);background:transparent;cursor:pointer}#paint-hex{flex:1;min-width:0;font-family:var(--cond);font-size:16px;letter-spacing:.12em;text-transform:uppercase;background:transparent;color:var(--ink);border:1px solid var(--line);padding:8px 10px}.hex-field.is-on #paint-hex{outline:2px solid var(--ink);outline-offset:2px}.tag-field{display:flex;flex-direction:column;gap:4px}#tag-input{width:196px;font-family:var(--cond);font-size:22px;letter-spacing:.12em;text-transform:uppercase;background:var(--panel);color:var(--ink);border:1px solid var(--line);padding:6px 10px;backdrop-filter:blur(12px)}.play-btn{padding:14px 22px;font-size:13px}#toast{position:absolute;bottom:28px;left:50%;transform:translate(-50%);z-index:20;background:var(--ink);color:var(--bg);padding:8px 14px;font-family:var(--cond);letter-spacing:.14em;text-transform:uppercase;font-size:12px}#about,#info{position:absolute;inset:0;z-index:30;background:#0000008c;display:grid;place-items:center;padding:24px}#about[hidden],#info[hidden]{display:none}.about-sheet{width:min(480px,100%);background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(20px);padding:28px}.about-sheet h2{font-family:var(--cond);letter-spacing:.12em;text-transform:uppercase;margin:8px 0 14px}.about-sheet p{font-weight:300;line-height:1.5;color:var(--muted);margin-bottom:12px}.about-links{display:flex;flex-direction:column;gap:6px}.about-links a{color:var(--ink)}#about-close,#info-close{margin-top:8px}#share-card{position:absolute;left:-9999px}@media(max-width:900px){.brand-name{font-size:18px;letter-spacing:.28em}#spec{left:16px;top:96px;flex-wrap:wrap}#panel-wrap{inset:auto 0 0;flex-direction:column-reverse;align-items:flex-end;height:auto}#panel-toggle{margin:8px 12px}#panel{width:100%;height:38vh;padding:8px 8px 16px;flex-direction:row;overflow-x:auto;overflow-y:hidden}#panel section{min-width:220px;height:fit-content}#app.is-panel-collapsed #panel{width:100%;height:0;padding:0}}@media(max-width:600px){#topbar{padding:16px 14px}.brand-name{font-size:14px;letter-spacing:.16em}}
