@font-face { font-family: "Atkinson Hyperlegible"; src: url("/alice/fonts/atkinson-hyperlegible-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Atkinson Hyperlegible"; src: url("/alice/fonts/atkinson-hyperlegible-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Noto Sans Arabic"; src: url("/fonts/noto-sans-arabic-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Noto Sans"; src: url("/fonts/noto-sans-cyrillic-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Noto Sans Ethiopic"; src: url("/fonts/noto-sans-ethiopic-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
html, body { margin: 0; height: 100%; background: #06122b; color: #f8fafc; font-family: "Atkinson Hyperlegible", "Noto Sans Arabic", "Noto Sans Ethiopic", "Noto Sans", sans-serif; overflow: hidden; }
#stage { position: fixed; inset: 0; top: 0; }
html[data-kb-bar]:not(.kb-framed) #stage { top: 48px; }
#game-menu, .fs-btn, .plate { position: fixed; z-index: 30; min-width: 48px; min-height: 48px; }
#game-menu, .fs-btn { display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; border: 2px solid #67e8f9; background: rgba(6,18,43,.45); color: #f8fafc; font-weight: 700; }
#game-menu { top: 8px; left: 8px; width: 48px; height: 48px; font-size: 22px; }
html[data-kb-bar]:not(.kb-framed) #game-menu { top: 56px; }
html[dir="rtl"] #game-menu { left: 8px; right: auto; }
.fs-btn { top: 56px; left: 8px; width: 48px; height: 48px; right: auto; }
html[data-kb-bar]:not(.kb-framed) .fs-btn { top: 56px; }
body.in-round .fs-btn { right: auto; }
html[dir="rtl"] body.in-round .fs-btn { right: auto; left: 8px; }
.plate { top: auto; bottom: 8px; left: 8px; width: auto; min-width: 96px; height: 48px; border: 0; background: transparent; color: #e2e8f0; font-size: 14px; font-weight: 700; }
html[dir="rtl"] .plate { left: auto; right: 8px; }
#ap-scrim {
  position: fixed; z-index: 26; pointer-events: auto; background: rgba(6, 18, 43, .62);
}
#ap-scrim[hidden] { display: none !important; }
#ap-card {
  position: fixed; z-index: 27; pointer-events: auto; box-sizing: border-box;
  background: #0b1f3a; border: 4px solid #fde68a; border-radius: 16px;
}
#ap-card[hidden] { display: none !important; }
body.ap-card .ap-hit.ap-scene { display: none !important; }
.ap-hit.ap-cardrow { z-index: 32; }

.ap-hit {
  position: fixed; z-index: 28; pointer-events: auto; box-sizing: border-box; overflow: hidden;
  display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  min-width: 48px; min-height: 48px; padding: 2px 4px;
  border-radius: 12px; border: 3px solid #fde68a; background: #0b1f3a; color: #f8fafc;
  font-weight: 700; font-size: 15px; line-height: 1.1; text-align: center;
  transform-origin: center center;
}
.ap-hit[hidden] { display: none !important; }
.ap-hit .ap-lab, .ap-hit .ap-ico { pointer-events: none; max-width: 100%; }
.ap-hit .ap-lab { white-space: pre-line; }
.ap-hit .ap-ico { display: block; flex: 0 0 auto; }
.ap-hit.ap-seed { flex-direction: row; gap: 8px; font-size: 16px; line-height: 1; padding: 0 10px; }
html[dir="rtl"] .ap-hit.ap-seed { flex-direction: row-reverse; }
.ap-hit.ap-seed .ap-lab { white-space: nowrap; font-size: 16px; }
.live { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.hint { position: fixed; z-index: 40; left: 50%; top: 40%; transform: translate(-50%, -50%); width: min(360px, calc(100% - 32px)); background: #0b1f3a; border: 2px solid #22d3ee; border-radius: 14px; padding: 12px; display: flex; gap: 8px; }
.hint[hidden] { display: none; }
.hint button { min-width: 48px; min-height: 48px; }
:focus-visible { outline: 3px solid #22d3ee; outline-offset: 2px; }
html[data-ap-theme="teal"], html[data-ap-theme="teal"] body { background: #06122b; }
html[data-ap-theme="dawn"], html[data-ap-theme="dawn"] body { background: #2a1218; }
html[data-ap-theme="dusk"], html[data-ap-theme="dusk"] body { background: #140c28; }
html[data-ap-theme="night"], html[data-ap-theme="night"] body { background: #05070d; }
html[data-ap-theme="gold"], html[data-ap-theme="gold"] body { background: #241608; }
html[data-ap-theme="snow"], html[data-ap-theme="snow"] body { background: #162430; }