:root{color-scheme:dark;--canvas: #08080b;--surface: #18181d;--raised: #222229;--hovered: #2c2c35;--edge: #30303a;--sunken: #101014;--text: #e2e3e9;--muted: #8a8c98;--accent: #78beff;--page-accent: var(--accent);--t-heading: 15px;--t-body: 13px;--t-small: 11px;--radius: 6px;--gap: 6px;--touch: 40px;--column: 248px;--narrow: 620px;--sheet: 62vh}*{box-sizing:border-box}html,body,#root{height:100%;overflow:hidden}body{margin:0;background:var(--canvas);color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;font-size:var(--t-body);touch-action:none;overscroll-behavior:none}:where(button,input,select,a):focus-visible{outline:2px solid var(--accent);outline-offset:1px}.shell{display:grid;grid-template-columns:1fr var(--column);grid-template-rows:minmax(0,1fr);height:100%}.stage{position:relative;min-width:0;background:var(--canvas)}.stage canvas{display:block;width:100%;height:100%;image-rendering:auto}.stage canvas.pixelated{image-rendering:pixelated}.stage canvas.positioned{position:absolute;top:0;left:0;width:auto;height:auto;transform-origin:0 0}.stage{overflow:hidden;touch-action:none;cursor:crosshair}.tabs{display:flex;flex-wrap:wrap;gap:3px;margin-bottom:8px}.tabs button{padding:3px 7px;border-radius:4px;font-size:var(--t-small)}.elements{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px;max-height:300px;overflow-y:auto;scrollbar-gutter:stable}button.element{display:flex;align-items:center;gap:6px;padding:4px 6px;text-align:left;overflow:hidden}.element-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.button-like{display:inline-flex;align-items:center;padding:5px 9px;border:1px solid var(--edge);border-radius:var(--radius);background:var(--raised);cursor:pointer}.button-like:hover{background:var(--hovered)}.button-like input[type=file]{display:none}.home{position:absolute;top:8px;left:10px;z-index:2;padding:4px 8px;border-radius:var(--radius);background:#08080b99;color:var(--muted);font-size:var(--t-small);line-height:1;text-decoration:none}.home:hover,.home:focus-visible{color:var(--text)}.panel{display:flex;flex-direction:column;min-height:0;background:var(--surface);border-left:1px solid var(--edge)}.panel-bar{display:flex;flex-wrap:wrap;gap:var(--gap);padding:10px;border-bottom:1px solid var(--edge)}.panel-body{flex:1;min-height:0;padding:10px;overflow-y:scroll;scrollbar-gutter:stable}@media(max-width:620px){.shell{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}.panel{border-left:none;border-top:1px solid var(--edge);max-height:var(--sheet)}.panel[data-open=false] .panel-body{display:none}.panel-bar button{min-height:var(--touch)}}.brush-overlay{pointer-events:none}@media(pointer:coarse){button,.segmented>button,.swatch-button,.button-like{min-height:var(--touch)}.toggle{min-height:var(--touch)}.toggle input{width:20px;height:20px}input[type=range]{height:var(--touch)}input[type=number],input[type=text]{min-height:32px}.swatches{grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:4px}.section>summary{min-height:32px;align-items:center}}button{padding:5px 9px;border:1px solid var(--edge);border-radius:var(--radius);background:var(--raised);color:var(--text);font:inherit;line-height:1.2;cursor:pointer}button:hover{background:var(--hovered);border-color:color-mix(in srgb,var(--accent) 50%,transparent)}button[aria-pressed=true]{background:color-mix(in srgb,var(--accent) 22%,var(--raised));border-color:var(--accent)}.row{display:flex;align-items:center;gap:var(--gap)}.wrap{display:flex;flex-wrap:wrap;gap:var(--gap);align-items:center}.segmented{display:flex;flex-wrap:wrap;gap:0;margin-bottom:var(--gap)}.segmented[data-fill=true]{display:grid;grid-auto-flow:column;grid-auto-columns:1fr}.segmented>button{border-radius:0;margin-left:-1px;flex:0 1 auto;min-height:28px}.segmented>button:first-child{border-radius:var(--radius) 0 0 var(--radius);margin-left:0}.segmented>button:last-child{border-radius:0 var(--radius) var(--radius) 0}.segmented>button:only-child{border-radius:var(--radius)}.segmented>button[aria-pressed=true]{position:relative;z-index:1}.block{margin-bottom:var(--gap)}.block-label,.segmented-label{display:block;margin-bottom:2px;color:var(--muted);font-size:var(--t-small)}button:disabled,.swatch-button:disabled{opacity:.4;cursor:not-allowed}.legend{display:grid;gap:1px;margin:0 0 var(--gap)}.legend>div{display:flex;align-items:center;justify-content:space-between;gap:var(--gap);min-height:20px}.legend dt{display:flex;align-items:center;gap:6px;font-size:var(--t-small)}.legend dd{margin:0;color:var(--muted);font-size:var(--t-small);font-variant-numeric:tabular-nums;text-align:right}.toggle{display:flex;align-items:center;gap:8px;min-height:26px;margin-bottom:2px}.toggle input{flex:none;width:15px;height:15px;margin:0;accent-color:var(--accent);cursor:pointer}.toggle label{flex:1;color:var(--text);font-size:var(--t-body);cursor:pointer;user-select:none}.swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:2px;margin-bottom:var(--gap)}.swatch-button{display:flex;align-items:center;gap:5px;padding:3px 5px;min-height:24px;overflow:hidden;text-align:left}.swatch-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--t-small)}.swatch{flex:none;width:11px;height:11px;border-radius:2px;box-shadow:inset 0 0 0 1px #00000073}.readout{display:grid;gap:1px;margin:0 0 var(--gap);padding-top:8px;border-top:1px solid var(--edge)}.readout>div{display:flex;align-items:baseline;justify-content:space-between;gap:var(--gap);min-height:18px}.readout dt{color:var(--muted);font-size:var(--t-small)}.readout dd{margin:0;font-size:var(--t-small);font-variant-numeric:tabular-nums;text-align:right}.section>summary{display:flex;align-items:center;gap:6px;margin:8px 0 6px;color:var(--muted);font-size:var(--t-small);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;list-style:none;user-select:none}.section>summary::-webkit-details-marker{display:none}.section>summary:before{content:"";width:0;height:0;border-left:4px solid currentColor;border-top:3.5px solid transparent;border-bottom:3.5px solid transparent;transition:transform .12s}.section[open]>summary:before{transform:rotate(90deg)}.section>summary:hover{color:var(--text)}.field{display:grid;grid-template-columns:1fr 62px;align-items:center;gap:var(--gap);margin-bottom:var(--gap)}.field>label{grid-column:1 / -1;color:var(--muted);font-size:var(--t-small)}input[type=range]{width:100%;height:18px;margin:0;background:transparent;accent-color:var(--accent);cursor:pointer}input[type=number],input[type=text]{width:100%;padding:3px 5px;border:1px solid var(--edge);border-radius:4px;background:var(--sunken);color:var(--text);font:inherit;font-variant-numeric:tabular-nums}input[type=number]{appearance:textfield;-moz-appearance:textfield}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{appearance:none;margin:0}input[type=color]{width:26px;height:22px;padding:0;border:1px solid var(--edge);border-radius:4px;background:none;cursor:pointer}.hint{margin:6px 0 0;color:var(--muted);font-size:var(--t-small);line-height:1.5}.error-text{margin:6px 0 0;color:#e66;font-size:var(--t-small);line-height:1.4}textarea{width:100%;min-height:90px;padding:5px;border:1px solid var(--edge);border-radius:4px;background:var(--sunken);color:var(--text);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:var(--t-small);line-height:1.45;resize:vertical}button:disabled{opacity:.4;cursor:default}button:disabled:hover{background:var(--raised);border-color:var(--edge)}p.readout{margin-top:10px;padding-top:10px;border-top:1px solid var(--edge);color:var(--muted);font-size:var(--t-small);font-variant-numeric:tabular-nums}.matrix{display:grid;gap:2px;margin-top:6px}.matrix-cell{aspect-ratio:1;min-width:16px;border:1px solid transparent;border-radius:3px;cursor:ns-resize;touch-action:none}.matrix-cell[data-selected=true]{border-color:var(--accent)}.swatch{width:10px;height:10px;border-radius:50%;flex:none}@media(prefers-reduced-motion:reduce){*{transition-duration:.01ms!important}}.loading{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:1.25rem;background:var(--canvas);text-align:center}.loading p{margin:0;color:var(--muted);letter-spacing:.02em}.loading .error{color:#ff8b8b}.spinner{width:2.25rem;height:2.25rem;border:2px solid #2a2a33;border-top-color:var(--page-accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.spinner{animation-duration:3s}}.words{margin:4px 0 10px;padding:8px 10px;max-height:190px;overflow:auto;font-size:12px;line-height:1.5;white-space:pre;tab-size:14;color:var(--muted);background:var(--sunken);border:1px solid var(--edge);border-radius:var(--radius)}.labels{position:absolute;inset:0;pointer-events:none}.labels span{position:absolute;transform:translate(-50%,-50%);color:#f5f0e6e0;font-variant:small-caps;letter-spacing:.14em;white-space:nowrap;text-shadow:0 1px 3px rgb(0 0 0 / .95),0 0 10px rgb(0 0 0 / .75)}canvas.sky{display:block;width:100%;height:auto;image-rendering:pixelated;border:1px solid var(--edge);border-radius:var(--radius)}canvas.arms{width:64px;height:78px;image-rendering:pixelated;flex:none}canvas.plan{display:block;width:100%;height:auto;image-rendering:pixelated;border:1px solid var(--edge);border-radius:var(--radius)}