.glyph-workspace{background:var(--color-bg);min-width:0;min-height:100%;color:var(--color-blue);grid-template-columns:minmax(0,1fr) 340px;display:grid}.glyph-canvas-panel{min-width:0;min-height:calc(100dvh - var(--playroom-nav-height));background:radial-gradient(circle at 50% 48%, color-mix(in srgb, var(--color-bg) 98%, var(--color-indigo)) 0, var(--color-bg) 70%);place-items:center;padding:76px 7vw 70px;display:grid;position:relative;overflow:hidden}.glyph-canvas-panel:before{content:"";opacity:.32;pointer-events:none;background-image:linear-gradient(color-mix(in srgb, var(--color-blue) 5%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--color-blue) 5%, transparent) 1px, transparent 1px);background-size:52px 52px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(#000,#0000 76%);mask-image:radial-gradient(#000,#0000 76%)}.glyph-topline,.glyph-canvas-footer{z-index:2;color:color-mix(in srgb, var(--color-blue) 55%, transparent);text-transform:uppercase;letter-spacing:.08em;justify-content:space-between;gap:18px;font-size:10px;display:flex;position:absolute;left:28px;right:28px}.glyph-topline{top:24px}.glyph-canvas-footer{bottom:23px}.glyph-board{z-index:1;aspect-ratio:1;border:1px solid color-mix(in srgb, var(--color-blue) 18%, transparent);background:color-mix(in srgb, var(--color-blue) 5%, transparent);width:min(67vw,670px);max-width:100%;box-shadow:0 24px 80px color-mix(in srgb, var(--color-blue) 10%, transparent), inset 0 0 0 1px color-mix(in srgb, var(--color-bg) 80%, transparent);touch-action:none;-webkit-user-select:none;user-select:none;gap:2px;padding:10px;display:grid;position:relative}.glyph-reference{z-index:0;object-fit:contain;opacity:.24;filter:grayscale()contrast(1.15);mix-blend-mode:multiply;pointer-events:none;width:calc(100% - 20px);height:calc(100% - 20px);position:absolute;inset:10px}.glyph-cell{z-index:1;background:color-mix(in srgb, var(--color-blue) 6%, transparent);min-width:0;min-height:0;transition:background-color .1s,border-radius .18s;position:relative}.glyph-cell:hover{background:color-mix(in srgb, var(--color-indigo) 24%, transparent)}.glyph-cell.is-filled{box-shadow:inset 0 0 0 1px #ffffff14}.glyph-board.is-liquified .glyph-cell.is-filled{opacity:0;box-shadow:none}.glyph-liquid{z-index:2;pointer-events:none;width:calc(100% - 20px);height:calc(100% - 20px);position:absolute;inset:10px;overflow:visible}.glyph-controls{min-width:0;min-height:0;max-height:calc(100dvh - var(--playroom-nav-height));box-sizing:border-box;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:color-mix(in srgb, var(--color-blue) 28%, transparent) transparent;border-left:1px solid color-mix(in srgb, var(--color-blue) 13%, transparent);background:color-mix(in srgb, var(--color-bg) 88%, var(--color-surface));flex-direction:column;gap:22px;padding:28px 30px 22px;display:flex;overflow-y:auto}.glyph-eyebrow{color:var(--color-gold);letter-spacing:.1em;text-transform:uppercase;margin:0 0 16px;font-size:10px}.glyph-controls h1{font-family:var(--font-display), sans-serif;letter-spacing:-.075em;color:var(--color-blue);margin:0;font-size:clamp(48px,6vw,72px);line-height:.84}.glyph-intro{max-width:250px;color:var(--color-muted);margin:0;font-size:13px;line-height:1.65}.glyph-section{gap:10px;display:grid}.glyph-label{color:var(--color-blue);letter-spacing:.07em;text-transform:uppercase;justify-content:space-between;font-size:10px;display:flex}.glyph-label span:last-child{color:var(--color-muted)}.glyph-dimensions{align-items:center;gap:10px;display:flex}.glyph-dimensions label{color:var(--color-muted);gap:5px;font-size:9px;display:grid}.glyph-dimensions input{border:1px solid color-mix(in srgb, var(--color-blue) 18%, transparent);width:102px;color:var(--color-blue);font:14px var(--font-body);background:0 0;border-radius:3px;padding:10px 11px}.glyph-swatches,.glyph-mirror{gap:9px;display:flex}.glyph-swatches button{border:2px solid #0000;border-radius:50%;width:34px;height:34px;box-shadow:inset 2px 2px 5px #ffffff47,2px 4px 8px #0000001a}.glyph-swatches button.is-active{outline:1px solid var(--color-blue);outline-offset:3px}.glyph-mirror button{border:1px solid color-mix(in srgb, var(--color-blue) 18%, transparent);min-height:37px;color:var(--color-blue);font:13px var(--font-body);background:0 0;flex:1}.glyph-mirror button.is-active{background:var(--color-blue);color:var(--color-bg)}.glyph-appearance{gap:12px}.glyph-range{color:var(--color-blue);letter-spacing:.04em;text-transform:uppercase;gap:7px;font-size:10px;display:grid}.glyph-range span{justify-content:space-between;display:flex}.glyph-range output{color:var(--color-muted);font:inherit}.glyph-range input{width:100%;accent-color:var(--color-blue);margin:0}.glyph-range input:disabled{opacity:.38}.glyph-random{border:1px solid color-mix(in srgb, var(--color-gold) 70%, transparent);background:color-mix(in srgb, var(--color-gold) 10%, transparent);min-height:40px;color:var(--color-blue);font:11px var(--font-body);justify-content:center;align-items:center;gap:10px;display:flex}.glyph-random span{color:var(--color-gold);font-size:16px}.glyph-random:hover{background:color-mix(in srgb, var(--color-gold) 18%, transparent)}.glyph-reference-actions,.glyph-reference-mode{gap:9px;display:flex}.glyph-reference-upload,.glyph-reference-remove,.glyph-reference-mode button{border:1px solid color-mix(in srgb, var(--color-blue) 18%, transparent);min-height:37px;color:var(--color-blue);font:11px var(--font-body);text-align:center;background:0 0;flex:1}.glyph-reference-upload{cursor:pointer;place-items:center;display:grid}.glyph-reference-upload input{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.glyph-reference-remove{color:var(--color-muted);flex:none;padding-inline:12px}.glyph-reference-mode button.is-active{background:var(--color-blue);color:var(--color-bg)}.glyph-actions{gap:10px;margin-top:auto;display:flex}.glyph-primary,.glyph-secondary{min-height:44px;font:11px var(--font-body);border-radius:999px}.glyph-primary{background:var(--color-blue);color:var(--color-bg);border:0;flex:1}.glyph-primary span{padding-left:10px;font-size:16px}.glyph-secondary{border:1px solid color-mix(in srgb, var(--color-blue) 20%, transparent);color:var(--color-blue);background:0 0;padding:0 16px}.glyph-note{color:color-mix(in srgb, var(--color-muted) 70%, transparent);margin:0;font-size:10px}@media (max-width:1100px) and (min-width:821px){.glyph-workspace{grid-template-columns:minmax(0,1fr) 300px}.glyph-canvas-panel{padding-inline:28px}.glyph-controls{padding-inline:22px}}@media (max-width:820px){.glyph-workspace{grid-template-columns:1fr;overflow:auto}.glyph-canvas-panel{min-height:66dvh;padding:72px 18px 62px}.glyph-board{width:min(88vw,620px)}.glyph-controls{border-top:1px solid color-mix(in srgb, var(--color-blue) 13%, transparent);border-left:0;gap:22px;max-height:none;padding:30px 22px 28px;overflow:visible}.glyph-controls h1{font-size:60px}}