/* Owner's reference layout: black stage, centered white viewport, right palette. */
body[data-admin="0"]{--bg:#000;background:#000}
body[data-admin="0"] .topbar{height:80px;padding:14px 18px;background:transparent;border:0;gap:14px;pointer-events:none}
body[data-admin="0"] .topbar>*{pointer-events:auto}
body[data-admin="0"] .brand{padding:14px 18px;gap:12px;border:1px solid #ffffff0d;border-radius:16px;background:linear-gradient(145deg,#303030e8,#191919ef);box-shadow:inset 0 1px 0 #ffffff0d,0 8px 24px #0008;font:700 20px ui-monospace,monospace;letter-spacing:.3px}
body[data-admin="0"] .brand strong{font-size:20px}
body[data-admin="0"] #menu-toggle{width:50px;height:50px;border-radius:15px;background:linear-gradient(145deg,#292929,#1b1b1b);border:1px solid #ffffff08;font-size:22px}
body[data-admin="0"] .header-status{color:#aaa;font-size:10px}
body[data-admin="0"] #game{inset:0;display:block;pointer-events:none}
body[data-admin="0"] .workspace{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:55vw;height:64vh;min-height:0;border-radius:12px;border:1px solid #ffffff20;background:#101010;box-shadow:0 0 40px #ffffff0c,0 10px 36px #0009;overflow:visible;pointer-events:auto}
body[data-admin="0"] #board{border-radius:11px;background:#101010}
body[data-admin="0"] .tools{position:absolute;right:18px;top:49%;transform:translateY(-50%);width:206px;padding:18px 17px 15px;border:1px solid #ffffff0b;border-radius:15px;background:linear-gradient(135deg,#292929ed,#1c1c1cf5);box-shadow:inset 0 1px 0 #ffffff0a,0 12px 32px #0009;backdrop-filter:blur(18px);pointer-events:auto}
body[data-admin="0"] .palette-header{margin-bottom:16px;gap:0}
body[data-admin="0"] #color-swatch,body[data-admin="0"] #color-hex,body[data-admin="0"] .palette-label{display:none}
body[data-admin="0"] #color-name{font-size:12px;line-height:16px}
body[data-admin="0"] #palette{gap:6px;margin-bottom:14px}
body[data-admin="0"] #palette button{border-radius:7px;border:1px solid #ffffff0a}
body[data-admin="0"] #palette button[aria-pressed=true]{outline:2px solid #fff;outline-offset:2px;box-shadow:inset 0 0 0 1px #0004}
body[data-admin="0"] #place{background:linear-gradient(#a84b4b,#823232);border:1px solid #c16b6b44;min-height:40px;padding:10px 5px;font-size:12px;border-radius:10px;box-shadow:inset 0 1px 0 #ffffff08}
body[data-admin="0"] #place:hover:not(:disabled){background:linear-gradient(#b85757,#963d3d)}
body[data-admin="0"] #place:disabled{opacity:.58}
body[data-admin="0"] #action-status{font-size:10px;min-height:15px;margin-top:10px;color:#aaa}
body[data-admin="0"] #action-status.success{color:#b9d3c0}
body[data-admin="0"] #action-status.error{color:#ffb7ab}
body[data-admin="0"] #cooldown-track i{background:#e5a3a3}
body[data-admin="0"] .canvas-bottom{bottom:-44px;left:0;right:0;opacity:.7}
body[data-admin="0"] .coordinate-pill,body[data-admin="0"] .zoom{background:#181818;border-color:#ffffff09}
body[data-admin="0"] #mod-island{top:88px;left:18px;transform:none;align-items:flex-start;pointer-events:auto}
body[data-admin="0"] .tool-buttons{background:#1d1d1de8;border-color:#ffffff0c}
body[data-admin="0"] .tool-buttons button.active{background:#3c3c3c}
body[data-admin="0"] #brush-options{background:#222;box-shadow:0 6px 20px #0005}
body[data-admin="0"] #tool-hint{top:-36px;background:#1c1c1c;color:#bbb;border-color:#ffffff0c}
body[data-admin="0"] #game-menu{right:18px;top:75px;background:#202020f5;backdrop-filter:blur(20px)}
@media(max-width:1100px) and (min-width:701px){body[data-admin="0"] .workspace{left:40%;width:61vw;height:62vh}body[data-admin="0"] .tools{right:14px;width:184px;padding:16px 14px}body[data-admin="0"] #palette{gap:5px}body[data-admin="0"] #mod-island{top:84px}}
@media(max-width:700px){
 body[data-admin="0"] .topbar{height:66px;padding:10px 12px;gap:8px}
 body[data-admin="0"] .brand{padding:11px 13px;gap:9px;border-radius:12px;font-size:14px}
 body[data-admin="0"] .brand strong{font-size:14px}
 body[data-admin="0"] #menu-toggle{width:40px;height:40px;border-radius:12px;font-size:19px}
 body[data-admin="0"] .header-status{font-size:0;gap:5px}
 body[data-admin="0"] #game{inset:82px 14px 14px;display:flex;flex-direction:column;gap:54px;align-items:stretch}
 body[data-admin="0"].owner-mode #game{top:140px}
 body[data-admin="0"] .workspace{position:relative;inset:auto;transform:none;width:100%;height:auto;flex:1;min-height:110px;border-radius:11px}
 body[data-admin="0"] .tools{position:relative;inset:auto;transform:none;width:100%;padding:13px 14px 11px;border-radius:14px;flex-shrink:0}
 body[data-admin="0"] .palette-header{margin-bottom:12px}
 body[data-admin="0"] #palette{grid-template-columns:repeat(10,minmax(0,1fr));gap:6px;margin-bottom:12px;max-width:none}
 body[data-admin="0"] #palette button{max-height:30px;border-radius:6px}
 body[data-admin="0"] #place{min-height:38px}
 body[data-admin="0"] #action-status{margin-top:8px;font-size:10px}
 body[data-admin="0"] #mod-island{top:73px;left:50%;transform:translateX(-50%);align-items:center}
 body[data-admin="0"] #brush-options{padding:5px 9px;gap:6px}
 body[data-admin="0"] #tool-hint{display:none}
 body[data-admin="0"] .canvas-bottom{bottom:-38px}
 body[data-admin="0"] #game-menu{top:60px;right:12px}
}
@media(max-height:620px) and (min-width:701px){body[data-admin="0"] .workspace{top:54%;height:60vh}body[data-admin="0"] .tools{top:55%;width:178px;padding:12px}body[data-admin="0"] .palette-header{margin-bottom:10px}body[data-admin="0"] #palette{gap:5px;margin-bottom:10px}body[data-admin="0"] #action-status{margin-top:7px}}
/* The camera occupies the screen; controls float over the world. */
body[data-admin="0"] .workspace{position:absolute;inset:0;transform:none;width:100%;height:100%;border:0;border-radius:0;box-shadow:none;background:#000;overflow:hidden}
body[data-admin="0"] #board{border-radius:0;background:#000}
body[data-admin="0"] .canvas-bottom{position:fixed;bottom:16px;left:18px;right:18px;z-index:3}
body[data-admin="0"] .tools{z-index:5}
#palette-close{display:none}
@media(max-width:700px){
 body[data-admin="0"] #game,body[data-admin="0"].owner-mode #game{inset:0;display:block}
 body[data-admin="0"] .workspace{position:absolute;inset:0;width:100%;height:100%;min-height:0}
 body[data-admin="0"] .tools{position:fixed;top:auto;left:10px;right:10px;bottom:10px;width:auto;transform:translateY(calc(100% + 24px));transition:transform .2s ease;pointer-events:none;max-height:70dvh;overflow:auto;padding:16px}
 body[data-admin="0"].palette-open .tools{transform:translateY(0);pointer-events:auto}
 body[data-admin="0"] #palette-close{display:block;position:absolute;top:6px;right:8px;background:transparent;border:0;padding:4px 8px;font-size:20px}
 body[data-admin="0"] .palette-header{padding-right:28px}
 body[data-admin="0"] .canvas-bottom{bottom:14px}
}

/* Refreshed controls; the canvas and mobile sheet retain their layout. */
body[data-admin="0"] #place{background:linear-gradient(#238bff,#0874ed);border-color:#65afff66;color:#fff}
body[data-admin="0"] #place:hover:not(:disabled){background:#2993ff}
body[data-admin="0"] #cooldown-track i{background:#74b6ff}
body[data-admin="0"] .tools{max-height:calc(100dvh - 110px);overflow:auto;border-color:#ffffff20}
body[data-admin="0"] #palette button{transition:transform .12s;min-height:22px}
body[data-admin="0"] #palette button:hover{transform:scale(1.12)}
button:focus-visible,a:focus-visible{outline:2px solid #88beff;outline-offset:3px}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

body[data-admin] .tools,body[data-admin] .brand,body[data-admin] #menu-toggle,body[data-admin] .tool-buttons,body[data-admin] #brush-options,body[data-admin] #game-menu,body[data-admin] .card,body[data-admin] dialog,body[data-admin] #pixel-inspector{background:#000!important;border-color:#262626!important}body{background:#000!important}.auth-cover{position:fixed;inset:0;z-index:1000;display:grid;place-content:center;background:#000;color:#fff;font:600 24px system-ui}.auth-cover strong{animation:auth-pulse 1s ease-in-out infinite alternate}@keyframes auth-pulse{to{opacity:.35}}@media(prefers-reduced-motion:reduce){.auth-cover strong{animation:none}}

.back-markuiz{display:grid;place-items:center;width:40px;height:40px;flex-shrink:0;border:1px solid #262626;border-radius:12px;background:#000;color:#fff;font:24px system-ui;text-decoration:none}
