/* Layout: full-bleed 3D stage. Default: dice on a tilted ring, gear at the bottom. Edit mode: active dice in a jiggling line with remove badges, removed dice piled below, close button at the bottom. Single dark look. */
:root{
  --bg:#0b0b0c;
  --bg-lift:#161617;
  --ink:#f3f1ec;
  --icon:#6f6d6a;
  --icon-hi:#a3a09b;
  --badge:#c4c2be;
  --badge-ink:#1a1918;
  color-scheme:dark;
}
html,body{height:100%}
body{
  margin:0;overflow:hidden;overscroll-behavior:none;
  background-color:var(--bg);
  background-image:radial-gradient(120% 70% at 50% 42%, var(--bg-lift), var(--bg) 72%);
  color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",sans-serif;
  -webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;
}
#stage{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab;z-index:1;-webkit-touch-callout:none}
#stage.grabbing{cursor:grabbing}
body.editing #stage{cursor:default}
#modeBtn{
  position:fixed;z-index:3;left:50%;transform:translateX(-50%);
  bottom:calc(28px + env(safe-area-inset-bottom, 0px));
  width:56px;height:56px;border:0;border-radius:50%;padding:0;
  background:transparent;color:var(--icon);cursor:pointer;
  display:grid;place-items:center;transition:color .2s;
}
#modeBtn:hover{color:var(--icon-hi)}
#modeBtn:focus-visible{outline:2px solid var(--icon-hi);outline-offset:2px}
#modeBtn svg{width:30px;height:30px;display:block}
#icMorph{transform-origin:12px 12px}
.del{
  position:fixed;z-index:2;left:0;top:0;
  width:26px;height:26px;margin:-13px 0 0 -13px;border:0;border-radius:50%;padding:0;
  background:var(--badge);color:var(--badge-ink);cursor:pointer;
  display:grid;place-items:center;opacity:0;pointer-events:none;
  box-shadow:0 1px 4px rgba(0,0,0,.45);
}
.del svg{width:12px;height:12px;display:block}
.del:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
#fail{position:fixed;inset:0;display:grid;place-items:center;padding:24px;text-align:center;color:var(--icon-hi);z-index:4}
