:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#16181d;--bg-panel:#1e2128;--bg-inset:#14161b;--border:#2c313b;--text:#d7dae1;--text-dim:#8b91a0;--accent:#4d8dff;--accent-soft:#2a3a58;--ok:#43c07a;--warn:#e0a53c;--err:#e05c5c;font-family:Segoe UI,system-ui,sans-serif;font-size:13px}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text)}button{background:var(--bg-panel);color:var(--text);border:1px solid var(--border);cursor:pointer;font:inherit;border-radius:4px;padding:4px 10px}button:hover{border-color:var(--accent)}button.primary{background:var(--accent);border-color:var(--accent);color:#fff}button.primary:disabled{background:var(--accent-soft);border-color:var(--accent-soft);color:var(--text-dim);cursor:not-allowed}button.danger:hover{border-color:var(--err);color:var(--err)}button.small{padding:1px 7px;font-size:12px}input,select,textarea{background:var(--bg-inset);color:var(--text);border:1px solid var(--border);font:inherit;border-radius:4px;padding:3px 6px}input:focus,select:focus,textarea:focus{outline:1px solid var(--accent)}input.invalid{border-color:var(--err)}input.num{width:72px}textarea.json{width:100%;min-height:320px;font-family:Consolas,monospace;font-size:12px}.app{flex-direction:column;height:100%;display:flex}.topbar{border-bottom:1px solid var(--border);background:var(--bg-panel);align-items:center;gap:16px;padding:8px 14px;display:flex}.topbar .brand{letter-spacing:.4px;font-weight:600}.topbar .brand span{color:var(--accent)}.topbar nav{gap:4px;display:flex}.topbar nav button{color:var(--text-dim);background:0 0;border:none;border-radius:4px;padding:5px 10px}.topbar nav button.active{background:var(--accent-soft);color:var(--text)}.topbar .spacer{flex:1}.topbar .error{color:var(--err);text-overflow:ellipsis;white-space:nowrap;max-width:480px;overflow:hidden}.main{flex:1;min-height:0;display:flex}.list-pane{border-right:1px solid var(--border);background:var(--bg-panel);flex-direction:column;width:230px;display:flex}.list-pane .list-head{color:var(--text-dim);justify-content:space-between;align-items:center;padding:8px 10px;display:flex}.list-pane ul{flex:1;margin:0;padding:0;list-style:none;overflow-y:auto}.list-pane li{cursor:pointer;border-bottom:1px solid var(--bg-inset);justify-content:space-between;align-items:center;gap:6px;padding:7px 12px;display:flex}.list-pane li:hover{background:var(--bg-inset)}.list-pane li.selected{background:var(--accent-soft)}.list-pane li .sub{color:var(--text-dim);font-size:11px}.editor-pane{flex:1;min-width:0;padding:14px 18px;overflow-y:auto}.editor-pane h2{margin:0 0 2px;font-size:16px}.editor-pane h3{color:var(--text-dim);text-transform:uppercase;letter-spacing:.6px;margin:18px 0 6px;font-size:13px}.editor-pane .subtitle{color:var(--text-dim);margin-bottom:10px}.preview-pane{border-left:1px solid var(--border);background:var(--bg-inset);flex-direction:column;width:42%;min-width:380px;display:flex}.preview-pane .canvas-wrap{flex:1;min-height:0}.preview-pane .scrub{border-top:1px solid var(--border);flex-direction:column;gap:8px;padding:10px 14px;display:flex}.scrub .row{align-items:center;gap:10px;display:flex}.scrub .row label{width:100px;color:var(--text-dim)}.scrub .row input[type=range]{flex:1}.scrub .row .val{text-align:right;font-variant-numeric:tabular-nums;width:70px}table.grid{border-collapse:collapse;width:100%}table.grid th{text-align:left;color:var(--text-dim);padding:3px 8px 3px 0;font-size:12px;font-weight:500}table.grid td{vertical-align:middle;padding:2px 8px 2px 0}.badge{border:1px solid var(--border);color:var(--text-dim);border-radius:8px;padding:1px 8px;font-size:11px}.badge.public{border-color:var(--ok);color:var(--ok)}.badge.internal{border-color:var(--border)}.badge.deprecated{border-color:var(--err);color:var(--err)}.badge.draft{border-color:var(--warn);color:var(--warn)}.issues{flex-direction:column;gap:4px;margin-top:6px;display:flex}.issue{background:var(--bg-panel);border-radius:4px;align-items:baseline;gap:8px;padding:5px 8px;display:flex}.issue.error{border-left:3px solid var(--err)}.issue.warning{border-left:3px solid var(--warn)}.issue button{flex-shrink:0}.issue .msg{flex:1}.ok-note{color:var(--ok)}.part-card{border:1px solid var(--border);background:var(--bg-panel);border-radius:6px;margin-bottom:8px}.part-card .part-head{cursor:pointer;align-items:center;gap:8px;padding:6px 10px;display:flex}.part-card .part-head .grow{flex:1}.part-card .part-body{border-top:1px solid var(--border);flex-direction:column;gap:8px;padding:4px 10px 10px;display:flex}.axis-row{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.axis-row .axis-label{width:14px;color:var(--text-dim);font-weight:600}.axis-row input.expr{width:130px;font-family:Consolas,monospace;font-size:12px}.axis-row select{font-size:12px}.kv-row{align-items:center;gap:6px;margin-bottom:4px;display:flex}.kv-row input.key{width:150px}.kv-row input.value{flex:1}.kv-row .consumers{color:var(--text-dim);font-size:11px}.section-card{border:1px solid var(--border);background:var(--bg-panel);border-radius:6px;margin-bottom:12px;padding:10px 12px}.row-gap{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.hint{color:var(--text-dim);font-size:12px}.mt{margin-top:10px}.std-group{margin-bottom:16px}.std-row{align-items:center;gap:10px;padding:3px 0;display:flex}.std-row label{flex:1}.std-row .default{width:110px;color:var(--text-dim);font-size:12px}.std-row.overridden label{color:var(--accent)}.empty{color:var(--text-dim);text-align:center;padding:30px}.home{flex-direction:column;height:100%;display:flex}.home-body{max-width:860px;padding:24px}.design-cards{flex-wrap:wrap;gap:12px;margin-top:8px;display:flex}.design-card{border:1px solid var(--border);background:var(--bg-panel);cursor:pointer;border-radius:8px;flex-direction:column;align-items:flex-start;gap:6px;width:240px;padding:12px 14px;display:flex}.design-card:hover{border-color:var(--accent)}.wizard{border:1px solid var(--border);background:var(--bg-panel);border-radius:8px;flex-direction:column;gap:4px;max-width:460px;padding:16px 20px;display:flex}.wizard h2{margin:0 0 8px}.wizard .std-row label{flex:none;width:160px}.canvas-cell{flex-direction:column;flex:1;min-width:0;display:flex;position:relative}.canvas-cell>div:first-child{flex:1;min-height:0}.statusbar{border-top:1px solid var(--border);background:var(--bg-panel);align-items:center;gap:12px;padding:5px 12px;font-size:12px;display:flex}.statusbar .spacer{flex:1}.inspector{border-left:1px solid var(--border);background:var(--bg-panel);width:300px;padding:12px 14px;overflow-y:auto}.inspector h2{margin:0 0 2px;font-size:15px}.inspector h3{color:var(--text-dim);text-transform:uppercase;letter-spacing:.6px;margin:14px 0 6px;font-size:12px}.inspector .std-row label{width:90px;color:var(--text-dim);flex:none}.inspector input,.inspector select{max-width:150px}.list-pane .group-head{text-transform:uppercase;letter-spacing:.6px;color:var(--text-dim);cursor:default;border-bottom:none;padding:6px 12px 2px;font-size:11px}.list-pane .group-head:hover{background:0 0}.arm-hint{color:var(--ok);border-top:1px solid var(--border);padding:8px 12px;font-size:12px}.design-name{background:0 0;border-color:#0000;width:220px;font-size:14px;font-weight:600}.design-name:hover,.design-name:focus{border-color:var(--border);background:var(--bg-inset)}.snapshot-menu{position:relative}.snapshot-menu .dropdown{z-index:20;background:var(--bg-panel);border:1px solid var(--border);border-radius:6px;flex-direction:column;gap:6px;min-width:220px;padding:8px;display:flex;position:absolute;top:28px;left:0}.dropdown-row{justify-content:space-between;align-items:center;gap:8px;display:flex}.topbar a{color:var(--accent);text-decoration:none}.topbar a:hover{text-decoration:underline}.swatches{flex-wrap:wrap;align-items:center;gap:4px;display:flex}.swatch{border:1px solid var(--border);cursor:pointer;border-radius:4px;flex-shrink:0;width:22px;height:22px;padding:0}.swatch:hover{border-color:var(--text-dim)}.swatch.active{outline:2px solid var(--accent);outline-offset:1px}.swatch.clear{background:var(--bg-inset);color:var(--text-dim);font-size:12px;line-height:1}.swatch-name{color:var(--text-dim);margin-left:2px;font-size:11px}.attr-row{align-items:flex-start}.attr-row label{padding-top:4px}.issues-chip{position:relative}.issues-chip .chip-ok{color:var(--ok)}.issues-chip .chip-warn{color:var(--warn);border-color:var(--warn)}.issues-chip .chip-error{color:var(--err);border-color:var(--err)}.issues-dropdown{z-index:30;background:var(--bg-panel);border:1px solid var(--border);border-radius:6px;flex-direction:column;gap:4px;min-width:380px;max-width:520px;max-height:320px;padding:8px;display:flex;position:absolute;bottom:30px;right:0;overflow-y:auto}.issue-row{border-radius:4px;align-items:center;gap:8px;padding:3px 6px;display:flex}.issue-row .icon{flex-shrink:0}.issue-row.error .icon{color:var(--err)}.issue-row.warning .icon{color:var(--warn)}.issue-row .msg{text-align:left;color:var(--text);background:0 0;border:none;flex:1;padding:2px 0}.issue-row .msg:hover{color:var(--accent)}.issue-row.dismissed{opacity:.45}.dim-toggles{color:var(--text-dim);align-items:center;gap:8px;margin-left:14px;display:flex}.dim-toggles label{cursor:pointer;align-items:center;gap:3px;display:flex}.crumbs{align-items:center;gap:4px;display:flex}.crumb{color:var(--text-dim);background:0 0;border:none;border-radius:4px;padding:4px 6px}.crumb:hover{color:var(--accent);border:none}.crumb-sep{color:var(--text-dim)}.viewbar{z-index:10;align-items:center;gap:8px;display:flex;position:absolute;top:10px;left:50%;transform:translate(-50%)}.segmented{border:1px solid var(--border);background:color-mix(in srgb, var(--bg-panel) 88%, transparent);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:6px;align-items:center;display:flex;overflow:hidden}.segmented button{color:var(--text-dim);background:0 0;border:none;border-radius:0;padding:5px 12px}.segmented button+button{border-left:1px solid var(--border)}.segmented button:hover{color:var(--text)}.segmented button.active{background:var(--accent-soft);color:var(--text)}.viewbar-wall{color:var(--text-dim);white-space:nowrap;border-left:1px solid var(--border);border-right:1px solid var(--border);align-self:stretch;align-items:center;padding:0 8px;font-size:12px;display:flex}.viewbar-back{background:color-mix(in srgb, var(--bg-panel) 88%, transparent);color:var(--text-dim);border-radius:6px;font-size:12px}.viewbar-back:hover{color:var(--text)}.viewbar-styles button{padding:5px 9px;font-size:12px}.photoreal{z-index:60;color:#dde;background:#14161c;flex-direction:column;display:flex;position:fixed;inset:0}.photoreal-bar{flex-wrap:wrap;align-items:center;gap:10px;padding:8px 12px;display:flex}.photoreal-bar button{color:#e8eaf0;cursor:pointer;background:#39415a;border:none;border-radius:4px;padding:5px 9px}.photoreal-stats{color:#9fb0d0;font-size:12px}.photoreal canvas{object-fit:contain;border:1px solid #333;max-width:calc(100% - 24px);max-height:calc(100% - 60px);margin:0 auto}