/* ==========================================================================
   DEVELOPER MODE — deliberately its own light, utilitarian look so it never
   reads as part of the game. Not themed; not shown to players.
   ========================================================================== */
.devtoggle{position:fixed;left:8px;bottom:8px;z-index:200;height:28px;padding:0 10px;border-radius:7px;border:1px solid oklch(40% .02 255);background:oklch(12% .01 255 / .8);color:oklch(92% 0 0);font:700 11px/1 ui-monospace,Consolas,monospace;letter-spacing:.08em;opacity:.45}
.devtoggle:hover,.devtoggle:focus-visible,.devtoggle[aria-pressed=true]{opacity:1}
.devtoggle[hidden]{display:none}
.devpanel{width:360px;flex:none;height:100%;overflow:auto;background:oklch(97% .004 255);color:oklch(26% .02 255);font:13px/1.45 ui-sans-serif,system-ui,'Segoe UI',sans-serif;border-left:1px solid oklch(85% .01 255);padding:16px 18px 60px}
.devpanel[hidden]{display:none}
.devpanel :focus-visible{outline:2px solid oklch(50% .15 250);outline-offset:1px}
.devpanel h2{font-size:15px;font-weight:700;line-height:1.2;margin:0}
.devpanel .sub{color:oklch(45% .02 255);margin:4px 0 0}
.devpanel h3{font-size:11px;font-weight:700;line-height:1;letter-spacing:.1em;text-transform:uppercase;color:oklch(42% .02 255);margin:22px 0 8px}
.devpanel h3 .muted{color:oklch(55% .02 255);text-transform:none;letter-spacing:0;font-weight:500}
.devpanel label{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:6px 0}
.devpanel select,.devpanel input[type=number]{min-height:32px;border:1px solid oklch(80% .01 255);border-radius:7px;background:#fff;color:oklch(26% .02 255);padding:0 8px;max-width:200px;width:200px}
.devpanel input[type=checkbox]{width:16px;height:16px;accent-color:oklch(45% .1 250)}
.devseg{display:flex;gap:4px;flex-wrap:wrap}
.devseg button,.devbtn{flex:1 1 auto;min-height:32px;padding:0 8px;border:1px solid oklch(80% .01 255);border-radius:7px;background:#fff;color:oklch(26% .02 255);font-weight:600}
.devseg button[aria-pressed=true]{background:oklch(28% .03 255);border-color:oklch(28% .03 255);color:#fff}
.devseg button:hover:not(:disabled),.devbtn:hover{border-color:oklch(50% .03 255);background:oklch(95% .006 255)}
.devseg button[aria-pressed=true]:hover{background:oklch(35% .03 255);color:#fff}
.devseg button:disabled{opacity:.45;cursor:not-allowed}
.devbtn{width:100%;margin-top:8px}
.devbtn.danger{color:oklch(48% .17 25);border-color:oklch(80% .06 25)}
.devstatus{margin:0 0 6px;color:oklch(40% .02 255)}
.devstatus code,.devspec code{color:oklch(40% .12 250);font-size:12px}
.devspec p{margin:0 0 6px;color:oklch(38% .02 255)}
.devhead{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.devhead .x{width:32px;height:32px;border:1px solid oklch(80% .01 255);border-radius:7px;background:#fff;display:grid;place-items:center;padding:0;flex:none;color:oklch(26% .02 255)}
.devhead .x svg.i{width:16px;height:16px;stroke-width:2}
.devlog{margin-top:8px;max-height:260px;overflow:auto;font:11px/1.55 ui-monospace,Consolas,monospace;background:oklch(22% .02 255);color:oklch(88% .02 230);border-radius:8px;padding:8px 10px}
.devlog div{border-bottom:1px solid oklch(32% .02 255);padding:2px 0;overflow-wrap:anywhere}.devlog span{color:oklch(68% .02 255)}.devlog code{color:oklch(85% .1 200)}
@media (max-width:900px){.devpanel{position:fixed;right:0;top:0;bottom:0;z-index:150;width:min(360px,92vw);box-shadow:-20px 0 60px #0007}}
