:root{color-scheme:dark;--bg:#08080c;--panel:#101014;--line:#ffffff13;--text:#f5f5f7;--muted:#aaa4b4;--accent:#cbafff;--pink:#ff38d1;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}button,input,select{font:inherit}a{color:inherit;text-decoration:none}button{border:1px solid #ffffff22;border-radius:7px;background:#ffffff05;color:var(--text);cursor:pointer;min-height:42px;padding:9px 13px;font-size:12px;font-weight:550;transition:background .15s,border-color .15s}button:hover{background:#ffffff0d;border-color:#ffffff50}button:disabled{opacity:.35;cursor:default}button[aria-pressed=true]{background:#9a62ff20;border-color:#9a62ff70;color:#e1d1ff}:focus-visible{outline:2px solid var(--accent);outline-offset:4px}[hidden]{display:none!important}.site-header{height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 30px;border-bottom:1px solid var(--line);font-size:12px;letter-spacing:.02em;background:#08080c;position:relative;z-index:10}.brand{font-weight:800;letter-spacing:.08em}.brand span{font-weight:400;color:var(--muted);letter-spacing:.03em;margin-left:10px}.site-header>a:last-child{color:#c5bdce}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 366px;height:calc(100svh - 62px);min-height:610px}.preview{position:relative;overflow:hidden;background:radial-gradient(ellipse at 48% 58%,#261b34 0%,#100d17 42%,#08080c 76%)}.preview-heading{position:absolute;z-index:2;top:38px;left:40px;pointer-events:none}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:9px;font-weight:650;color:#aaa0b7;margin:0 0 12px}.preview-heading h1{font-size:clamp(30px,3.7vw,58px);font-weight:550;letter-spacing:-.055em;line-height:1;margin:0}.preview-heading h1 span{color:var(--pink)}.preview-heading>p:last-child{font-size:12px;color:var(--muted);margin:15px 0 0}#viewport{position:absolute;inset:0;touch-action:none;outline-offset:-4px}#viewport canvas{display:block;width:100%;height:100%}.preview-meta{position:absolute;bottom:108px;left:40px;display:flex;gap:12px;align-items:center;pointer-events:none}#previewName{font-size:14px;letter-spacing:.02em}#previewRole{font-size:9px;text-transform:uppercase;letter-spacing:.13em;color:var(--muted);border-left:1px solid #ffffff30;padding-left:12px}.view-tools{position:absolute;bottom:49px;left:50%;transform:translateX(-50%);display:flex;gap:4px;align-items:center;padding:5px;border:1px solid #ffffff18;background:#121016dc;border-radius:10px;white-space:nowrap}.view-tools button{border-color:transparent;min-height:36px;padding:7px 11px;font-size:11px}.view-tools button[aria-pressed=true]{border-color:#9a62ff50}.tool-divider{height:18px;background:#ffffff1c;width:1px;margin:0 4px}.orbit-hint{position:absolute;bottom:15px;left:0;right:0;text-align:center;color:#8d8599;font-size:10px;pointer-events:none;margin:0}.orbit-hint span{margin:0 9px;color:#655b76}.loading,.preview-error{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:13px;color:#cbc0d6;text-align:center;max-width:340px;width:80%}.preview-error{padding:24px;background:#15111eea;border:1px solid #a986bd55;border-radius:10px;z-index:4}.inspector{border-left:1px solid var(--line);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#4a3a60 transparent;background:var(--panel);padding-bottom:12px}.inspector-intro{padding:29px 23px 23px;border-bottom:1px solid var(--line)}.name-row{display:flex;gap:6px;align-items:center;margin-bottom:19px}.name-row input{width:0;flex:1;background:none;border:0;border-bottom:1px solid transparent;color:var(--text);font-size:25px;letter-spacing:-.035em;padding:4px 0;min-width:0}.name-row input:hover,.name-row input:focus{border-bottom-color:#ffffff35}.name-row button{width:34px;min-height:36px;padding:4px;border:0;font-size:21px;color:#a89cb9}.role-switch{display:flex;gap:5px}.role-switch button{flex:1;font-size:11px;min-height:36px}.section{border-bottom:1px solid var(--line)}summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:19px 23px;font-size:12px;font-weight:550;min-height:54px}summary::-webkit-details-marker{display:none}summary>span{color:#83748f;font-size:10px;letter-spacing:.08em}summary::before{content:'+';color:#b699d3;margin-right:10px;font-size:15px;font-weight:400}summary>span{margin-left:auto}.section[open]>summary::before{content:'−'}.section-content{padding:0 23px 22px}.preset-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:0 23px 22px}.preset{padding:12px;text-align:left;min-height:71px;background:#ffffff02}.preset strong{display:block;font-size:12px;font-weight:550;color:#e0d3ed;margin-bottom:6px}.preset small{display:block;font-size:10px;color:#97899f}.control{margin:0 0 17px}.control:last-child{margin-bottom:0}.control label{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#bcb5c8;margin-bottom:7px;gap:12px}.control output{font-size:10px;font-variant-numeric:tabular-nums;color:#d7bee9}.control input[type=range]{display:block;width:100%;height:24px;margin:0;accent-color:#b98de8;cursor:pointer}.control.color,.control.toggle{display:flex;justify-content:space-between;align-items:center;min-height:38px;margin-bottom:5px}.control.color label,.control.toggle label{margin:0;flex:1}.control input[type=color]{padding:0;border:1px solid #ffffff20;background:transparent;width:45px;height:29px;border-radius:5px;cursor:pointer}.control input[type=checkbox]{width:19px;height:19px;accent-color:#ba8eee}.button-row{display:flex;gap:8px;margin-top:10px}.button-row>button{flex:1}.primary{background:#d6b5f0;color:#211627;border-color:#d6b5f0;font-weight:650}.primary:hover{background:#e6cafb;color:#211627;border-color:#e6cafb}.muted{color:var(--muted);font-size:11px;line-height:1.7;margin:0 0 15px}.muted:last-child{margin:14px 0 0}.field-label{font-size:10px;color:#bcb5c8;display:block;margin-bottom:8px}select{width:100%;background:#17121f;border:1px solid #ffffff25;padding:12px 9px;border-radius:6px;color:var(--text);font-size:12px}.action-bar{position:sticky;bottom:-12px;padding:12px 23px max(12px,env(safe-area-inset-bottom));background:#101014f5;border-top:1px solid #ffffff15;z-index:3;backdrop-filter:blur(12px)}.action-bar .button-row{margin:0}#status{font-size:10px;line-height:1.55;color:#a69bae;min-height:30px;margin:10px 0 0}#status[data-error=true]{color:#ffa7d6}.no-script{position:fixed;bottom:0;padding:20px;background:#332037;z-index:99;width:100%}@media(min-width:1600px){.workspace{grid-template-columns:minmax(0,1fr) 400px}}@media(max-width:800px){.site-header{height:54px;padding:0 17px;font-size:11px}.brand span{display:none}.workspace{grid-template-columns:1fr;height:auto;min-height:0}.preview{height:46svh;min-height:330px;max-height:520px;position:sticky;top:0;z-index:5;border-bottom:1px solid var(--line)}.preview-heading{top:18px;left:19px}.preview-heading h1{font-size:29px}.preview-heading .eyebrow{font-size:8px;margin-bottom:7px}.preview-heading>p:last-child{display:none}.preview-meta{bottom:84px;left:20px}#previewName{font-size:11px}#previewRole{font-size:8px}.view-tools{bottom:31px;gap:2px;padding:4px}.view-tools button{padding:7px 9px;min-height:36px;font-size:10px}.orbit-hint{bottom:11px;font-size:9px}.inspector{overflow:visible;border-left:0}.inspector-intro{padding-top:22px}.action-bar{position:sticky;bottom:0;z-index:6;box-shadow:0 -8px 25px #08080c99}.control input[type=range]{height:32px}.control{margin-bottom:18px}.name-row input{font-size:24px}.preset-grid{grid-template-columns:repeat(4,1fr)}.preset{padding:10px 8px}.preset small{line-height:1.45;font-size:9px}.role-switch button{min-height:42px}}@media(max-width:400px){.preset-grid{grid-template-columns:1fr 1fr}.view-tools button{padding:7px 8px}.preview{min-height:310px}.preview-heading h1{font-size:26px}}@media(max-height:500px) and (orientation:landscape){.workspace{grid-template-columns:minmax(0,1fr) 310px;height:calc(100svh - 54px);min-height:0}.preview{position:relative;height:100%;min-height:0}.inspector{overflow:auto}.preview-heading{top:12px;left:16px}.preview-heading h1{font-size:24px}.preview-meta{display:none}.preset-grid{grid-template-columns:1fr 1fr}.view-tools{bottom:12px}.orbit-hint{display:none}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}