/* DeskMain stage and layer layout (game/ui/scenes/DeskMain.tscn). */
#viewport { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; }
#stage { position: absolute; left: 0; top: 0; width: 1920px; height: 1080px; transform-origin: 0 0; overflow: hidden; }

/* Narrow windows keep body text at a normal size. The map scales inside its own box. */
html.layout-compact #viewport { display: block; overflow: auto; }
html.layout-compact #stage {
  position: relative; width: 100%; max-width: 880px; height: auto; min-height: 100vh;
  margin: 0 auto; transform: none !important; left: 0 !important; top: 0 !important; overflow: visible;
  display: flex; flex-direction: column;
}
html.layout-compact .canvas-layer { position: relative; inset: auto; width: 100%; height: auto; display: flex; flex-direction: column; }
html.layout-compact #HUDLayer { order: 0; }
html.layout-compact #ModalLayer { order: 1; }
html.layout-compact #DrawerLayer { order: 2; }
html.layout-compact #MapDeskLayer { order: 3; }
html.layout-compact .ctl { position: relative !important; left: auto !important; top: auto !important; width: auto !important; height: auto !important; max-width: 100%; }
html.layout-compact #TopBar { position: sticky; top: 0; z-index: 5; width: 100% !important; }
html.layout-compact .topbar-main-row, html.layout-compact .topbar-kpis-row { flex-wrap: wrap; height: auto; }
html.layout-compact .topbar-slot, html.layout-compact .event-modal-body, html.layout-compact button.btn { font-size: 15px; }
html.layout-compact #EventModal, html.layout-compact .event-modal, html.layout-compact .event-modal-panel { width: auto !important; max-width: 100%; }
html.layout-compact #DrawerContainer { width: 100% !important; }
html.layout-compact .drawer-tabs {
  position: relative; left: auto; top: auto; flex-wrap: wrap; width: 100%;
  background: var(--paper, #F4EFE6); z-index: 2;
}
html.layout-compact .drawer-tab { font-size: 14px; }
html.layout-compact .drawer-panel { max-height: none; width: 100% !important; }
html.layout-compact .drawer-content { max-height: 70vh; }
html.layout-compact .week-agenda { z-index: 1; }
html.layout-compact .map-canvas { width: 100% !important; height: 420px !important; overflow: hidden; }
html.layout-compact .map-canvas .map-svg { width: 100%; height: 100%; }
html.layout-compact #AlertOutliner { width: 100% !important; }
html.layout-compact .week-agenda { position: relative; width: auto; margin: 8px; }

.week-agenda {
  position: absolute; left: 240px; top: 64px; width: 640px; z-index: 25;
  background: var(--paper, #F4EFE6); color: #1E1C1A; border: 1px solid rgba(30,28,26,.35);
  padding: 12px 14px; box-shadow: 0 8px 24px rgba(30,28,26,.25); max-height: 70vh; overflow: auto;
}
.week-head, .week-issues { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.week-issue, .week-advisor, .week-note, .week-mem p { font-size: 14px; line-height: 1.45; text-align: left; }
.week-issue { display: flex; flex-direction: column; gap: 4px; flex: 1 1 180px; padding: 8px; background: transparent; border: 1px solid rgba(30,28,26,.3); cursor: pointer; }
.event-settlement { font-size: 14px; padding: 6px 0; }
.canvas-layer { position: absolute; inset: 0; pointer-events: none; z-index: 1; }
.canvas-layer > * { pointer-events: auto; }
#MapDeskLayer { z-index: 10; }
#HUDLayer { z-index: 20; }
#DrawerLayer { z-index: 30; }
#LedgerCodexLayer { z-index: 40; }
#ModalLayer { z-index: 50; }
#TooltipTutorialLayer { z-index: 60; }

.boot-splash { position: absolute; inset: 0; z-index: 100; display: flex; align-items: center; justify-content: center;
  background: rgba(232, 223, 209, 0.92); transition: opacity 0.3s; }
.boot-splash.hidden { opacity: 0; pointer-events: none; }
.boot-card { width: 720px; padding: 28px 32px; }
.boot-title { font-family: var(--font-title); font-size: 40px; font-weight: 700; letter-spacing: 4px; }
.boot-sub { margin-top: 6px; color: var(--muted); }
#boot-log { margin: 18px 0 0; font: 13px/1.6 var(--font-mono); white-space: pre-wrap; min-height: 120px; }