.app-shell{--amber:var(--color-performance-editorial-brand,#fcaa2d);--line:var(--color-performance-border-default,rgba(255,255,255,.1));display:grid;grid-template-rows:64px minmax(0,1fr) 30px;height:100dvh;background:var(--color-performance-bg-pure,#000);color:var(--color-performance-fg-primary,#fff);font-family:var(--font-performance-sans,Arial,sans-serif)}*{box-sizing:border-box}html,body{margin:0;overflow:hidden;background:#000}button,input,textarea{font:inherit}button:focus-visible,input:focus-visible,textarea:focus-visible,svg:focus-visible{outline:2px solid var(--amber);outline-offset:2px}.topbar{display:grid;grid-template-columns:1fr minmax(220px,520px) 1fr;align-items:center;gap:18px;padding:0 18px;border-bottom:1px solid var(--line);background:var(--color-performance-shell-surface,#0d0d0d);z-index:4}.identity{display:flex;align-items:center;gap:10px;min-width:0}.identity img{display:block;width:142px;height:auto;max-height:28px}.identity span{padding-left:10px;border-left:1px solid var(--line);color:var(--color-performance-fg-muted,rgba(255,255,255,.46));font:10px var(--font-performance-mono,monospace);white-space:nowrap}.title{height:38px;border:1px solid transparent;border-radius:3px;background:transparent;color:#fff;text-align:center;font-weight:650}.title:hover,.title:focus{border-color:var(--line);background:#111}.file-actions{display:flex;justify-content:flex-end;gap:4px}button{min-height:36px;border:1px solid var(--line);border-radius:3px;padding:0 10px;background:#111;color:#fff;cursor:pointer;font-size:12px}button:hover:not(:disabled){border-color:#ffffff40;background:#1a1a1a}button:disabled{opacity:.35;cursor:not-allowed}.workbench{display:grid;grid-template-columns:144px minmax(0,1fr);min-height:0}.workbench.tool-sidebar-collapsed{grid-template-columns:64px minmax(0,1fr)}.toolbar{display:flex;flex-direction:column;gap:3px;padding:10px;border-right:1px solid var(--line);background:#0a0a0a;overflow-y:auto}.toolbar button{display:grid;grid-template-columns:24px 1fr;align-items:center;gap:6px;min-height:40px;padding:0 7px;border-color:transparent;background:transparent;text-align:left}.toolbar button.active{border-color:color-mix(in srgb,var(--amber) 45%,transparent);background:color-mix(in srgb,var(--amber) 10%,transparent)}.sidebar-toggle{margin-bottom:5px;color:var(--color-performance-fg-muted,rgba(255,255,255,.55))}.sidebar-toggle i{display:grid;place-items:center;width:22px;font:18px var(--font-performance-mono,monospace)}.sidebar-toggle span{font:10px var(--font-performance-mono,monospace);text-transform:uppercase}.tool-sidebar-collapsed .toolbar{padding-inline:7px}.tool-sidebar-collapsed .toolbar button{grid-template-columns:1fr;justify-items:center;padding-inline:3px}.tool-sidebar-collapsed .toolbar .tool-label,.tool-sidebar-collapsed .sidebar-toggle span{display:none}kbd{display:grid;place-items:center;width:22px;height:22px;border:1px solid var(--line);border-radius:2px;color:var(--amber);font:10px var(--font-performance-mono,monospace)}.canvas-frame{position:relative;min-width:0;min-height:0;overflow:hidden}svg{display:block;width:100%;height:100%;touch-action:none;-webkit-user-select:none;user-select:none}svg.crosshair{cursor:crosshair}svg .selected{filter:url(#selected)}svg path,svg rect,svg ellipse,svg line,svg g[role=button]{pointer-events:visiblePainted}.group-label,.provenance{fill:var(--amber);font:700 11px var(--font-performance-mono,monospace)}.provenance{fill:#ffffff73;font-size:9px}textarea{width:100%;height:100%;resize:none;border:0;outline:0;padding:0;background:transparent;color:#fff;font:500 16px/1.35 var(--font-performance-sans,Arial,sans-serif)}.history,.selection,.palette{position:absolute;display:flex;align-items:center;gap:4px;padding:5px;border:1px solid var(--line);border-radius:4px;background:#0a0a0af5;box-shadow:0 10px 30px #00000073}.history{right:14px;bottom:14px}.history span,.selection>span,.palette>span{padding:0 8px;color:#ffffff80;font:11px var(--font-performance-mono,monospace);white-space:nowrap}.selection{top:14px;left:50%;transform:translate(-50%)}.palette{left:14px;bottom:14px}.palette>div{display:flex;gap:2px}.palette button{display:grid;grid-template-columns:14px auto;align-items:center;gap:5px;min-height:40px;padding:0 7px;border-color:transparent;background:transparent}.palette button:hover,.palette button.active{border-color:color-mix(in srgb,var(--swatch) 70%,white 15%);background:color-mix(in srgb,var(--swatch) 16%,#111)}.palette button i{width:12px;height:12px;border:1px solid color-mix(in srgb,var(--swatch) 72%,white);border-radius:50%;background:var(--swatch)}.palette button small{color:#ffffffb8;font:10px var(--font-performance-mono,monospace)}.palette button.active small{color:#fff}.convert{border-color:var(--amber);background:var(--amber);color:#181312;font-weight:750}.conversion-menu{position:absolute;top:calc(100% + 7px);right:0;width:250px;padding:5px;border:1px solid var(--line);border-radius:4px;background:#111;box-shadow:0 20px 50px #0000008c}.conversion-menu button{display:flex;flex-direction:column;align-items:flex-start;width:100%;height:auto;padding:10px;border-color:transparent;text-align:left;font-weight:700}.conversion-menu small{margin-top:3px;color:#ffffff80;font-weight:400}.statusbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:0 12px;border-top:1px solid var(--line);background:#0d0d0d;color:#ffffff75;font:10px var(--font-performance-mono,monospace)}.statusbar span{display:flex;align-items:center;gap:7px;white-space:nowrap}.statusbar i{width:6px;height:6px;border-radius:50%;background:var(--color-performance-ready,#007a4d)}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}@media(max-width:820px){.app-shell{grid-template-rows:100px minmax(0,1fr) 28px}.topbar{grid-template-columns:auto 1fr;grid-template-rows:52px 40px;gap:0 8px;padding:4px 9px}.identity img{width:112px;max-height:24px}.identity span{display:none}.file-actions{grid-column:1/-1;justify-content:flex-start;overflow-x:auto;padding-bottom:4px}.file-actions button{flex:0 0 auto;min-height:34px}.workbench,.workbench.tool-sidebar-collapsed{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) 58px}.toolbar,.tool-sidebar-collapsed .toolbar{grid-row:2;flex-direction:row;gap:2px;padding:7px;border-top:1px solid var(--line);border-right:0;overflow-x:auto}.toolbar button,.tool-sidebar-collapsed .toolbar button{display:grid;flex:0 0 46px;grid-template-columns:1fr;justify-items:center;min-height:42px;padding:3px}.toolbar button span{display:none}.sidebar-toggle{display:none!important}.canvas-frame{grid-row:1}.history{right:8px;top:8px;bottom:auto}.history button:last-child{display:none}.selection{top:58px;max-width:calc(100% - 16px)}.palette{left:8px;right:8px;bottom:8px;display:block;overflow-x:auto}.palette>span{display:block;padding:2px 7px 5px}.palette>div{min-width:max-content}.palette button{min-width:56px;min-height:44px;grid-template-columns:1fr;justify-items:center;gap:2px;padding:3px 6px}.statusbar span:last-child{display:none}}@media(prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}