.gb-page{padding-top:96px}.gb-page h1{margin:0 0 8px;font:500 40px/1.15 var(--font-sans);letter-spacing:-.025em}.gb-editor{display:grid;grid-template-columns:auto minmax(0,1fr);gap:40px 56px;align-items:start;margin-top:48px}.gb-board{width:384px;max-width:100%}#gb-grid{display:block;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;cursor:crosshair}#gb-grid:focus{outline:none}#gb-grid:focus-visible{outline:1px dashed var(--faint);outline-offset:8px}.gb-editor.is-locked #gb-grid{cursor:default}.gb-side{display:grid;gap:16px;justify-items:start;max-width:360px}.gb-palette{display:flex;flex-wrap:wrap;gap:8px}.gb-palette button{width:32px;height:32px;padding:0;border:0;border-radius:2px;background:var(--sw);cursor:pointer}.gb-palette button[data-code="0"]{background:linear-gradient(to top right,transparent calc(50% - .75px),var(--faint) calc(50% - .75px),var(--faint) calc(50% + .75px),transparent calc(50% + .75px)),var(--bg);box-shadow:inset 0 0 0 1px var(--empty)}.gb-palette button[aria-pressed=true]{outline:2px solid var(--ink);outline-offset:3px}.gb-palette .gb-add{background:none;box-shadow:inset 0 0 0 1px var(--empty);color:var(--muted);font:400 18px/1 var(--font-mono)}.gb-palette .gb-add:hover:not(:disabled){color:var(--ink)}.gb-palette .gb-add:disabled{color:var(--faint);opacity:.5;cursor:default}.gb-wheel{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px 20px;align-items:start;width:100%;padding:16px;background:var(--box);border:1px solid var(--hair);border-radius:4px}.gb-wheel[hidden]{display:none}#gb-wheel-cv{display:block;touch-action:none;cursor:crosshair}#gb-wheel-cv:focus{outline:none}#gb-wheel-cv:focus-visible{outline:1px dashed var(--faint);outline-offset:4px}.gb-wheel-side{display:grid;gap:10px;justify-items:start}.gb-wheel-now{width:48px;height:48px;border-radius:2px;box-shadow:0 0 0 1px var(--hair)}#gb-hex{width:11ch;box-sizing:border-box;padding:7px 8px;background:var(--bg);border:1px solid var(--hair);border-radius:4px;color:var(--ink);font:400 13px/1 var(--font-mono)}#gb-hex:focus{outline:none;border-color:var(--faint)}#gb-val{grid-column:1 / -1;width:100%;height:14px;margin:0;-webkit-appearance:none;appearance:none;background:var(--track, var(--box2));border-radius:0;cursor:pointer}#gb-val:focus{outline:none}#gb-val:focus-visible{outline:1px dashed var(--faint);outline-offset:4px}#gb-val::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:8px;height:22px;background:var(--ink);border:2px solid var(--bg);border-radius:0}#gb-val::-moz-range-thumb{width:6px;height:20px;background:var(--ink);border:2px solid var(--bg);border-radius:0}#gb-val::-moz-range-track{background:transparent}.gb-wheel .gb-row{grid-column:1 / -1}.gb-palette button:focus-visible{outline:2px dashed var(--ink);outline-offset:3px}.gb-palette button[aria-pressed=true]:focus-visible{outline-style:solid}.gb-row{display:flex;flex-wrap:wrap;gap:8px}.gb-row button{padding:8px 12px;border:1px solid var(--hair);border-radius:4px;background:none;cursor:pointer;font:400 13px/1 var(--font-mono);color:var(--muted);transition:color .15s,border-color .15s,background-color .15s}.gb-row button:hover:not(:disabled){color:var(--ink)}.gb-row button[aria-pressed=true]{color:var(--ink);border-color:var(--faint);background:var(--box2)}.gb-row button:disabled{color:var(--faint);cursor:default}.gb-editor.is-locked .gb-palette,.gb-editor.is-locked .gb-row{opacity:.4;pointer-events:none}#gb-wheel .gb-row button:not(#gb-wheel-close){color:var(--ink);border-color:var(--faint)}.gb-preview{display:flex;align-items:end;gap:16px;margin-top:8px}.gb-preview canvas{display:block;image-rendering:pixelated;background:var(--bg);box-shadow:0 0 0 1px var(--hair)}#gb-prev1{width:16px;height:16px}#gb-prev3{width:64px;height:64px}.gb-ts:empty{display:none}.gb-send-row{display:flex;gap:8px;margin-top:8px}.gb-send{padding:12px 20px;border:0;border-radius:4px;background:var(--ink);color:var(--bg);cursor:pointer;font:500 15px/1 var(--font-sans);transition:background-color .15s,color .15s}.gb-send:hover:not(:disabled){background:#fff}.gb-send:disabled{background:var(--box2);color:var(--faint);cursor:default}.gb-status{min-height:1.4em;max-width:36ch}.gb-status[data-kind=ok]{color:var(--ink)}.gb-status[data-kind=error]{color:var(--c-essay)}.gb-wall-sec{margin-top:96px}.gb-wall-sec h2{margin-bottom:24px}.gb-wall{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:24px}@media(max-width:760px){.gb-page{padding-top:56px}.gb-editor{grid-template-columns:minmax(0,1fr);margin-top:32px}.gb-board{width:100%}.gb-wall{gap:16px}}