/* Skin for the existing game/tool panels inside the new workspace shell.
   Readable sizes, neutral surfaces, the page's own colour (--hue) for accents. */
body.ws { font-family: var(--font-text); }
body.ws #ws-play { max-width: var(--maxw); padding-left: var(--gutter); padding-right: var(--gutter); }
body.ws .ws-panel { background: var(--ws-surface); border: 1px solid var(--ws-line); border-radius: 20px; box-shadow: 0 30px 60px -40px rgba(0,0,0,.9); }
body.ws .ws-label { font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: .12em; color: var(--ws-faint); }
body.ws .ws-btn, body.ws .ws-btn-ghost { min-height: 44px; border-radius: 12px; font-family: var(--font-text); font-size: 13px; font-weight: 700; letter-spacing: .06em; padding: .7rem 1.2rem; transition: transform .15s, filter .15s, background .2s, border-color .2s, color .2s; }
body.ws .ws-btn { background: var(--hue); color: #0a0b0d; }
body.ws .ws-btn:hover { filter: brightness(1.08); opacity: 1; transform: translateY(-1px); }
body.ws .ws-btn:active, body.ws .ws-btn-ghost:active { transform: translateY(1px) scale(.98); }
body.ws .ws-btn-ghost { color: var(--ws-text); border-color: var(--ws-line-2); background: rgba(255,255,255,.03); }
body.ws .ws-btn-ghost:hover { border-color: rgba(220,230,255,.35); background: rgba(255,255,255,.06); }
body.ws .ws-chip { font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: .08em; color: var(--ws-muted); }
body.ws .ws-input { background: var(--ws-bg); border-color: var(--ws-line-2); font-size: 15px; border-radius: 12px; }
body.ws .ws-input:focus { border-color: var(--hue); box-shadow: 0 0 0 4px color-mix(in srgb, var(--hue) 20%, transparent); }
body.ws .ws-out { font-family: var(--font-mono); font-size: 13.5px; }
body.ws canvas { border-radius: 14px; }
body.ws .text-\[9px\], body.ws .text-\[10px\] { font-size: 12px !important; letter-spacing: .06em !important; }
body.ws .text-\[8px\] { font-size: 11px !important; }
body.ws .text-white\/30 { color: var(--ws-faint) !important; }
body.ws .font-black { font-weight: 700; }
body.ws .ocurp-status { position: absolute !important; margin: 0 !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; }
@media (max-width: 599px) { body.ws .ws-panel { padding: 12px !important; } body.ws #ws-play { padding-left: 12px; padding-right: 12px; } }
