*{box-sizing:border-box}:root{color:#f2f2f2;font-synthesis:none;background:#141414;font-family:Inter,ui-sans-serif,system-ui,sans-serif}body{overscroll-behavior:none;-webkit-user-select:none;user-select:none;min-width:320px;height:100dvh;margin:0;overflow:hidden}html,#app{overscroll-behavior:none;height:100%;overflow:hidden}button,input,select{font:inherit}button{color:inherit;cursor:pointer;background:#292929;border:1px solid #4d4d4d;border-radius:5px}button:hover{background:#333;border-color:#8a8a8a}main{padding:18px}.debug-page{overscroll-behavior:contain;height:100%;overflow:auto}.not-found{text-align:center;place-content:center;height:100%;display:grid}.not-found p{margin:0;font-size:72px;font-weight:800}.not-found a,.fuzzer-link{color:#aaa}.lobby-page{background:radial-gradient(circle at 75% 20%,#da773629,#0000 34%),linear-gradient(135deg,#171717 0 52%,#111 52%);place-items:center;width:100%;height:100%;padding:24px;display:grid}.lobby-card{background:#1b1b1aeb;border:1px solid #3b3935;width:min(100%,460px);padding:44px;position:relative;box-shadow:0 30px 90px #00000073}.lobby-card.compact{width:min(100%,420px)}.lobby-mark{border:2px solid #dc783d;border-radius:50%;width:64px;height:64px;position:absolute;top:-32px;right:34px}.lobby-mark span{border:2px solid #dc783d;position:absolute;inset:14px 8px;transform:rotate(-24deg)}.lobby-card h1{letter-spacing:-.05em;max-width:340px;margin:8px 0 14px;font-family:Georgia,serif;font-size:clamp(38px,8vw,58px);font-weight:400;line-height:.95}.lobby-copy{color:#a8a5a0;margin:0 0 32px;line-height:1.55}.lobby-card form,.lobby-card label{display:grid}.lobby-card form{gap:10px}.lobby-card label{color:#aaa7a1;letter-spacing:.12em;text-transform:uppercase;font-size:11px;font-weight:700}.lobby-card input{color:#f1eee9;background:#121212;border:1px solid #4a4741;border-radius:0;outline:0;width:100%;height:48px;padding:0 14px}.lobby-card input:focus{border-color:#dc783d}.primary-button{color:#18130f;background:#dc783d;border:0;border-radius:0;height:48px;font-weight:800}.primary-button:hover{background:#ed8a4e;border:0}.primary-button:disabled{cursor:wait;opacity:.6}.form-error,.room-error{color:#ff9e90;font-size:13px}.fuzzer-link{margin-top:28px;font-size:12px;display:inline-block}.room-error{z-index:10;background:#481d18;padding:10px 14px;position:fixed;bottom:18px;left:50%;transform:translate(-50%)}.app-board{--bar-height:42px;--slider-width:30px;--rail-width:52px;--sidebar-width:282px;grid-template:var(--bar-height) minmax(0, 1fr) / minmax(0, 1fr) var(--slider-width) var(--rail-width) var(--sidebar-width);background:#22211f;width:100%;max-width:none;height:100%;margin:0;display:grid}.app-board.sidebar-left{grid-template-columns:var(--sidebar-width) var(--rail-width) var(--slider-width) minmax(0, 1fr)}.app-bar{background:#171716;border-bottom:1px solid #343331;grid-area:1/1/2/-1;align-items:center;gap:20px;padding:0 14px;display:flex}.wordmark{color:#e8e4de;letter-spacing:.18em;font-family:Georgia,serif;font-size:15px;text-decoration:none}.connection-state{color:#817f7b;letter-spacing:.1em;text-transform:uppercase;align-items:center;gap:6px;font-size:10px;display:flex}.connection-state i{background:#d99446;border-radius:50%;width:6px;height:6px}.connection-state.online i{background:#6fbe83}.save-button{margin-left:auto}.save-button,.settings-button{text-transform:uppercase;letter-spacing:.08em;border-radius:0;padding:5px 12px;font-size:11px}.settings-dialog{color:#e5e1da;background:#1b1b1a;border:1px solid #4a4741;border-radius:0;width:min(360px,100vw - 32px);padding:0;box-shadow:0 24px 80px #0000008c}.settings-dialog::backdrop{background:#0000008c}.settings-dialog form{padding:18px}.settings-dialog header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.settings-dialog h2{margin:0;font-family:Georgia,serif;font-size:18px;font-weight:400}.settings-dialog header button{width:28px;height:28px}.settings-dialog label{color:#aaa69f;gap:8px;font-size:12px;display:grid}.settings-dialog select{border-radius:0;width:100%;height:36px;padding:0 9px}.notification-settings{border:1px solid #393733;gap:10px;margin:20px 0 0;padding:14px;display:grid}.notification-settings legend{color:#d8d3cc;padding:0 6px;font-family:Georgia,serif;font-size:13px}.notification-settings>button{border-radius:0;min-height:34px}.settings-dialog .settings-check{grid-template-columns:none;align-items:center;gap:8px;display:flex}.settings-check input{accent-color:#dc783d}.settings-dialog .debug-setting{margin-top:16px}.panel-toggle{padding:5px 8px;font-size:10px;display:none}.canvas-stage{background-color:#242320;background-image:radial-gradient(#3a3935 .8px,#0000 .8px);background-size:16px 16px;grid-area:2/1;place-items:center;min-width:0;min-height:0;padding:0;display:grid;position:relative;overflow:hidden}.sidebar-left .canvas-stage{grid-column:4}.app-board .canvas-shell{transform-origin:50%;will-change:transform;background:#fff;border:0;flex:none;width:1920px;max-width:none;height:1080px;position:absolute;box-shadow:0 20px 50px #00000052}.app-board .canvas-shell.hand-tool{cursor:grab}.app-board .canvas-shell.panning{cursor:grabbing}.app-board .canvas-shell.cursor-rendering{cursor:none}.cursor-layer{z-index:2;pointer-events:none;position:absolute;inset:0;overflow:visible}.user-cursor{color:#6e6e6e9e;width:0;height:0;position:absolute}.user-cursor i{width:8px;height:8px;box-shadow:0 0 0 calc(1px * var(--cursor-inverse-scale)) currentColor;background:0 0;border:0;border-radius:50%;position:absolute;transform:translate(-50%,-50%)}.user-cursor.brush-cursor i{width:max(1px, var(--cursor-size));height:max(1px, var(--cursor-size));background:0 0}.user-cursor span{top:0;left:var(--cursor-label-offset);color:#646464ad;white-space:nowrap;transform:translateY(-50%) scale(var(--cursor-inverse-scale));transform-origin:0;background:0 0;padding:0;font-family:ui-sans-serif,system-ui,sans-serif;font-size:12px;line-height:1;position:absolute}.tool-rail{background:#1d1c1b;border-left:1px solid #373633;flex-direction:column;grid-area:2/3;gap:0;padding:0;display:flex;overflow-y:auto}.sidebar-left .tool-rail{border-left:0;border-right:1px solid #373633;grid-column:2}.vertical-slider-bar{z-index:2;-webkit-user-select:none;user-select:none;touch-action:none;background:#1e1e1eeb;border-left:1px solid #ffffff14;border-right:1px solid #ffffff14;flex-direction:column;grid-area:2/2;justify-content:center;align-self:center;align-items:center;gap:20px;height:min(50vh,100% - 20px);min-height:0;padding:10px 0;display:flex}.sidebar-left .vertical-slider-bar{grid-column:3}.vertical-slider-wrap{flex-direction:column;flex:1 1 0;align-items:center;min-height:0;display:flex}.vertical-slider-value,.vertical-slider-label{color:#ccc;text-align:center;flex-shrink:0;font-family:-apple-system,BlinkMacSystemFont,sans-serif;font-size:10px;line-height:1}.vertical-slider-value{margin-bottom:4px}.vertical-slider-label{color:#999;margin-top:4px}.vertical-slider-track{cursor:pointer;touch-action:none;background:#ffffff14;border-radius:4px;flex:1;width:24px;min-height:0;position:relative}.vertical-slider-thumb{z-index:2;cursor:grab;background:#fff;border-radius:4px;height:18px;position:absolute;left:2px;right:2px;box-shadow:0 1px 3px #0006}.vertical-slider-thumb.dragging{cursor:grabbing}.tool-rail button{color:#85827d;text-transform:capitalize;background:0 0;border:1px solid #0000;border-radius:0;place-items:center;min-height:42px;padding:5px 2px;font-size:9px;display:grid}.tool-rail button span{color:#bbb7b0;text-transform:uppercase;font-family:Georgia,serif;font-size:17px}.tool-rail button:hover,.tool-rail button.active{color:#dd7b41;background:#292723;border-color:#4c4842}.tool-rail button.active span{color:#ed8b50}.control-sidebar{scrollbar-color:#484641 transparent;scrollbar-width:thin;background:#191918;border-left:1px solid #373633;grid-area:2/4;min-height:0;overflow-y:auto}.sidebar-left .control-sidebar{border-left:0;border-right:1px solid #373633;grid-column:1}.sidebar-section{border-bottom:1px solid #343330;padding:17px 18px 20px}.sidebar-section h2{color:#dfdbd4;justify-content:space-between;align-items:baseline;margin:0 0 16px;font-family:Georgia,serif;font-size:15px;font-weight:400;display:flex}.sidebar-section h2 span{color:#6f6c67;text-transform:uppercase;font-family:ui-monospace,monospace;font-size:9px}.user-list{gap:10px;display:grid}.user-row{color:#b7b3ac;grid-template-columns:8px 1fr auto;align-items:center;gap:9px;font-size:12px;display:grid}.user-row i{border-radius:50%;width:8px;height:8px}.user-row small,.empty-state{color:#686662;text-transform:uppercase;font-size:9px}.empty-state{margin:0}.stack-control,.select-control{gap:8px;margin-top:16px;display:grid}.stack-control>span,.select-control>span{color:#918e88;justify-content:space-between;font-size:11px;display:flex}.stack-control output{color:#d5d1ca;font-family:ui-monospace,monospace}.stack-control input[type=range]{accent-color:#dc783d;width:100%;height:12px;margin:0}.check-control{color:#aaa69f;align-items:center;gap:8px;margin-top:14px;font-size:11px;display:flex}.check-control input{accent-color:#dc783d}.select-control select{background:#22211f;border-radius:0;width:100%;min-height:32px;padding:0 8px}.hsv-picker{aspect-ratio:1;cursor:pointer;touch-action:none;background:conic-gradient(red,#ff0,#0f0,#0ff,#00f,#f0f,red);border-radius:50%;place-items:center;width:min(100%,230px);margin:0 auto;display:grid;position:relative}.hsv-picker:before{content:"";background:#191918;border-radius:50%;position:absolute;inset:8%}.hue-cursor{transform-origin:50%;pointer-events:none;position:absolute;inset:0 calc(50% - 5px)}.hue-cursor:before{content:"";border:2px solid #fff;border-radius:50%;width:10px;height:10px;margin-top:3%;display:block;box-shadow:0 0 0 1px #111}.sv-square{z-index:1;aspect-ratio:1;background:linear-gradient(to top, #000, transparent), linear-gradient(to right, #fff, transparent), var(--hue-color);cursor:crosshair;width:57%;position:relative;overflow:hidden;box-shadow:0 0 0 1px #ffffff3d}.sv-cursor{pointer-events:none;border:2px solid #fff;border-radius:50%;width:13px;height:13px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #111}.layers-section h2 button{width:24px;height:24px}.layer-actions{grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px;display:grid}.layer-actions>button,.merge-layer-menu summary,.merge-layer-menu div button{color:#aaa69f;text-align:center;text-transform:uppercase;background:#22211f;border:1px solid #3d3b37;border-radius:0;min-height:30px;padding:5px 9px;font-size:10px}.merge-layer-menu{position:relative}.merge-layer-menu summary{cursor:pointer;place-items:center;list-style:none;display:grid}.merge-layer-menu summary::-webkit-details-marker{display:none}.merge-layer-menu summary.disabled{opacity:.45;pointer-events:none}.merge-layer-menu div{z-index:5;background:#191918;border:1px solid #4a4741;width:max(140px,100%);max-height:180px;display:grid;position:absolute;right:0;overflow-y:auto;box-shadow:0 10px 30px #00000073}.merge-layer-menu div button{text-align:left;text-transform:none;border-width:0 0 1px}.merge-layer-menu div button:hover{color:#eee9e1;background:#2c2925}.app-board .layer-row{background:#20201e;border-color:#302f2c;min-height:34px;margin-top:5px}.app-board .layer-entry.active .layer-row{background:#2c241f;border-color:#805235}.layer-entry.merged-layer .layer-row{opacity:.68}.layer-debug-stats{overflow-wrap:anywhere;color:#8d8982;background:#151514;border:1px solid #302f2c;border-top:0;gap:4px;margin:4px 0 10px;padding:8px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:9px;line-height:1.35;display:grid}.layer-debug-stats div{grid-template-columns:72px minmax(0,1fr);gap:6px;display:grid}.layer-debug-stats dt{color:#66635e;text-transform:uppercase}.layer-debug-stats dd{color:#bbb6ae;min-width:0;margin:0}.selection-actions{z-index:3;background:#171716;padding:7px;position:absolute;transform:translate(12px,12px);box-shadow:0 8px 24px #00000061}.viewport-controls{z-index:4;background:#171716;border:1px solid #403e39;align-items:stretch;display:flex;position:absolute;bottom:12px;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #00000059}.viewport-controls button{color:#aaa69f;background:0 0;border:0;border-right:1px solid #34322f;border-radius:0;min-width:34px;height:32px;padding:0 10px;font-size:11px}.viewport-controls button:last-child{border-right:0}.viewport-controls button:hover{color:#eee9e1;background:#292723}.viewport-controls .zoom-level{color:#dfdbd4;min-width:62px;font-family:ui-monospace,monospace}.page-header{justify-content:space-between;align-items:end;gap:32px;margin:0 0 20px;display:flex}.page-header h1,.page-header p,.board-heading h2{margin:0}.page-header h1{letter-spacing:-.04em;font-size:clamp(22px,3vw,38px)}.page-header>p{color:#aaa;max-width:590px;font-size:14px;line-height:1.5}.eyebrow{color:#efad24;letter-spacing:.14em;text-transform:uppercase;font-size:11px;font-weight:700;margin-bottom:5px!important}.board-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;display:grid}.board-panel{background:#1a1a1a;border:1px solid #353535;border-radius:8px;min-width:0;padding:10px}.board-heading{justify-content:space-between;align-items:center;gap:12px;min-height:42px;margin-bottom:8px;display:flex}.board-heading h2{letter-spacing:.02em;font-size:15px}.board-panel .toolbar{flex-wrap:wrap}.debug-controls,.apply-control,.stream-control,.network-control{align-items:center;display:flex}.debug-controls{flex-wrap:wrap;justify-content:flex-end;gap:6px}.debug-controls button{padding:5px 9px;font-size:12px}.debug-controls button:disabled{cursor:default;opacity:.45}.stream-control{gap:4px;padding:0 4px;font-size:12px}.apply-control{gap:4px}.apply-control input{width:58px;color:inherit;background:#111;border:1px solid #4d4d4d;border-radius:5px;padding:4px 6px}.network-control{color:#aaa;gap:4px;font-size:11px}.network-control input{color:#f2f2f2;background:#111;border:1px solid #4d4d4d;border-radius:5px;width:58px;padding:4px 6px}.queue-state{color:#999;font-variant-numeric:tabular-nums;text-align:right;min-width:100px;font-size:11px}.fuzzer-page .drawing-board{width:min(100%,1480px);margin:0 auto}.toolbar{background:#202020;border:1px solid #3e3e3e;border-bottom:0;flex-wrap:wrap;align-items:center;gap:8px 12px;min-height:52px;padding:8px;display:flex}.tool-group,.colors,.workspace-row,.layers-title,.layer-row,.toolbar label,.selection-actions{align-items:center;gap:6px;display:flex}.tool-group button{text-transform:capitalize;padding:6px 9px}.tool-group button.active{color:#171717;background:#e8e8e8;border-color:#e8e8e8}.colors button{border:2px solid #202020;border-radius:50%;outline:1px solid #666;width:27px;height:27px;padding:0}.color-input{background:0 0;border:0;width:30px;height:30px;padding:0}select,.number-input{min-height:28px;color:inherit;background:#111;border:1px solid #4d4d4d;border-radius:4px}.number-input{width:48px;padding:3px}.colors button.selected{outline:3px solid #f2f2f2}.size-control{align-items:center;gap:7px;font-size:13px;display:flex}.size-control input{width:110px}.size-control span{font-variant-numeric:tabular-nums;width:38px}.sync-state{color:#9d9d9d;margin-left:auto;font-size:12px}.board-footer{align-items:center;gap:12px;min-height:26px;margin-top:8px;display:flex}.canvas-shell{aspect-ratio:16/9;cursor:crosshair;touch-action:none;-webkit-user-select:none;user-select:none;background:#fff;border:1px solid #3e3e3e;width:100%;position:relative;overflow:hidden;box-shadow:0 14px 38px #00000059}.workspace-row{align-items:stretch;gap:0}.workspace-row .canvas-shell{flex:1;min-width:0}.layers-panel{background:#202020;border:1px solid #3e3e3e;border-left:0;width:150px;padding:8px}.layers-title{text-transform:uppercase;letter-spacing:.08em;justify-content:space-between;margin-bottom:8px;font-size:12px}.layers-title button{width:26px;height:26px}.layer-row{border:1px solid #0000;padding:4px}.layer-row.active{background:#29251b;border-color:#efad24}.layer-row button{text-align:left;text-overflow:ellipsis;background:0 0;border:0;flex:1;padding:5px;overflow:hidden}.selection-actions{margin-left:auto}.canvas-shell canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.active-layer{z-index:1}.hint{color:#999;min-height:18px;margin:0 2px;font-size:12px}@media (width<=700px){main{padding:8px}.toolbar{flex-wrap:wrap;gap:10px}.workspace-row{display:block}.layers-panel{border-left:1px solid #3e3e3e;width:100%;display:flex;overflow-x:auto}.layers-title,.layer-row{flex:none}.size-control{width:100%}.page-header{display:block}.page-header>p{margin-top:10px}.board-grid{grid-template-columns:1fr}.board-heading{display:block}.board-heading h2{margin-bottom:8px}.debug-controls{justify-content:flex-start}.lobby-page{padding:14px}.lobby-card{padding:34px 24px}.app-board,.app-board.sidebar-left{--bar-height:40px;--rail-width:48px;--sidebar-width:min(74vw, 260px);grid-template-columns:minmax(0, 1fr) var(--slider-width) var(--rail-width)}.app-board.sidebar-left{grid-template-columns:var(--rail-width) var(--slider-width) minmax(0, 1fr)}.canvas-stage,.sidebar-left .canvas-stage{grid-column:1;padding:6px}.sidebar-left .canvas-stage,.tool-rail{grid-column:3}.sidebar-left .tool-rail{grid-column:1}.vertical-slider-bar{grid-column:2}.tool-rail button{min-height:38px}.control-sidebar,.sidebar-left .control-sidebar{top:var(--bar-height);z-index:5;width:var(--sidebar-width);display:none;position:fixed;bottom:0;right:0}.sidebar-open .control-sidebar{display:block}.sidebar-left .control-sidebar{left:0;right:auto}.panel-toggle{display:block}.app-bar{gap:9px}}@media (width>=701px) and (width<=1250px){.board-grid{grid-template-columns:1fr}}.fuzzer-controls.svelte-cf6l9z,label.svelte-cf6l9z{align-items:center;display:flex}.fuzzer-controls.svelte-cf6l9z{background:#171717;border:1px dashed #3e3e3e;border-radius:5px;gap:10px;min-height:34px;margin-bottom:8px;padding:5px 8px;font-size:11px}strong.svelte-cf6l9z{color:#efad24;letter-spacing:.1em;text-transform:uppercase;font-size:10px}label.svelte-cf6l9z{color:#aaa;gap:4px}.rate-input.svelte-cf6l9z{color:#f2f2f2;background:#111;border:1px solid #4d4d4d;border-radius:4px;width:62px;padding:3px 5px}
