/* A fixed game frame with a single scrolling workspace for the reading tabs. */
.shell.live-shell #workspace.document-workspace {
  display:block;
  min-width:0;
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}
.document-overview {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
}
.document-stores { display:flex; align-items:center; gap:5px; }
.document-stores > span {
  display:flex;
  position:relative;
  align-items:center;
  gap:5px;
  min-width:0;
  padding:5px 7px;
  border:1px solid var(--line);
  border-radius:5px;
  background:var(--panel);
  color:var(--muted);
  font-size:10px;
  white-space:nowrap;
}
.document-stores .ui-icon { color:var(--gold); flex:none; }
.document-stores strong { color:var(--text); font-size:13px; font-variant-numeric:tabular-nums; }
.document-workspace .campaign-ribbon { margin:6px 0 12px; padding-block:8px; }
.document-workspace .document-main {
  grid-template-columns:minmax(0,1fr) minmax(265px,31%);
  gap:16px;
  padding:0 0 16px;
}
.document-main .decision-panel { min-width:0; }
@media(max-width:850px) {
  .document-workspace .document-main { display:flex; flex-direction:column; gap:13px; }
  .document-main .theatre, .document-main .decision-panel { width:100%; }
  .document-workspace .mobile-jump { display:flex; margin:0 0 10px; }
}
@media(max-width:650px) {
  .document-overview { grid-template-columns:minmax(0,1fr); gap:4px; }
  .document-stores > span { flex:1; justify-content:center; }
  .document-stores .ui-icon { width:13px; height:13px; }
  .document-stores strong { font-size:12px; }
}

/* The same relationship palette used on the conflict cards. */
.atlas-background .route-group.relation-tone > .supply-road {
  stroke:color-mix(in srgb,var(--rel-mark) 62%,var(--road));
}
.atlas-background .route-group.relation-tone > .supply-stitches {
  stroke:var(--rel-ink);
  opacity:.66;
}
.atlas-background .route-group[data-relation-tone=embargo] > .supply-road,
.atlas-background .route-group[data-relation-tone=boycott] > .supply-road {
  stroke:var(--rel-mark);
  stroke-dasharray:5 4;
}
.atlas-background .route-group[data-relation-tone=embargo] > .supply-stitches,
.atlas-background .route-group[data-relation-tone=boycott] > .supply-stitches {
  stroke-dasharray:5 4;
}
.atlas-background .route-group.relation-tone { cursor:pointer; }
.atlas-moods { position:absolute; inset:0; width:100%; height:100%; z-index:4; pointer-events:none; }
.atlas-route-mood > circle { pointer-events:visiblePainted; cursor:pointer; }
.atlas-route-mood > g { pointer-events:none; }
.atlas-route-mood > g { fill:var(--rel-ink); }
.atlas-route-mood > g path { fill:none; stroke:var(--rel-ink); stroke-width:1.8; stroke-linecap:round; }
.atlas-mood-stem { stroke:var(--rel-ink); stroke-width:1.2; opacity:.75; pointer-events:none; }
.atlas-route-mood > circle {
  fill:var(--rel-paper);
  stroke:var(--rel-ink);
  stroke-width:1.7;
}
.atlas-route-mood:hover > circle {
  stroke-width:2.6;
}

/* Official papers and the coordinator's day-by-day chronicle. */
.archive-view { --document-radius:11px; }
.archive-cover {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px 20px;
  padding:18px 20px;
  border:1px solid var(--line);
  border-radius:var(--document-radius);
}
.archive-cover::after {
  content:"";
  position:absolute;
  z-index:-1;
  inset:-60% -18% -60% 32%;
  transform:rotate(-17deg);
  background:repeating-radial-gradient(ellipse at 60% 50%,transparent 0 20px,var(--archive-line) 21px 22px);
  pointer-events:none;
}
.archive-cover h2 {
  margin:5px 0 6px;
  color:inherit;
  font:400 clamp(29px,3.6vw,43px)/1.08 var(--display);
}
.archive-cover p { margin:0; font-size:12px; line-height:1.45; }
.decree-view {
  --decree-ink:#85503a;
  --decree-edge:#d5bea0;
  --decree-surface:#eee4d1;
  --decree-stamp:#8b4a34;
  --decree-seal:#e8d4b7;
}
[data-theme=dark] .decree-view {
  --decree-ink:#e8c59b;
  --decree-edge:#806854;
  --decree-surface:#473c34;
  --decree-stamp:#f1c1a6;
  --decree-seal:#5b463b;
}
.decree-cover {
  --archive-line:#9b745428;
  color:var(--text);
  border-color:var(--decree-edge);
  background:linear-gradient(112deg,var(--decree-surface),var(--panel2));
}
.decree-cover .eyebrow { color:var(--decree-ink); }
.decree-cover p { color:var(--muted); }
.decree-seal {
  display:grid;
  flex:none;
  place-content:center;
  justify-items:center;
  gap:2px;
  width:72px;
  height:72px;
  border:3px double var(--decree-stamp);
  border-radius:50%;
  outline:1px dashed var(--decree-stamp);
  outline-offset:3px;
  background:var(--decree-seal);
  color:var(--decree-stamp);
  transform:rotate(-9deg);
}
.decree-seal strong { font:400 31px/.9 var(--display); }
.decree-seal span { font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; }
.decree-regime {
  padding:13px 0 15px;
  margin:6px 0 10px;
  border-bottom:1px solid var(--line);
}
.decree-regime-heading { display:flex; align-items:baseline; flex-wrap:wrap; gap:3px 12px; justify-content:space-between; }
.decree-regime-heading h3 { font:400 22px/1.15 var(--display); margin:0; }
.decree-regime-heading > span, .decree-axes small { font-size:10px; color:var(--muted); }
.decree-axes { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 16px; margin-top:9px; }
.decree-axes small { display:block; margin-top:4px; }
.decree-expenses {
  display:flex;
  align-items:flex-start;
  gap:7px;
  margin:0 0 13px;
  color:var(--muted);
  font-size:11px;
  line-height:1.5;
}
.decree-expenses .ui-icon { color:var(--gold); flex:none; }
.decree-stack { display:grid; gap:10px; }
.decree-paper {
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  gap:11px;
  border:1px solid var(--line);
  border-inline-start:3px solid var(--decree-edge);
  border-radius:var(--document-radius);
  background:var(--panel);
  padding:13px;
}
.decree-mark {
  display:grid;
  place-items:center;
  align-self:start;
  min-height:39px;
  border:1px solid var(--decree-edge);
  border-radius:6px;
  color:var(--decree-ink);
  background:var(--decree-surface);
}
.decree-meta { display:flex; gap:6px; align-items:center; color:var(--muted); font-size:10px; }
.decree-active {
  color:var(--green);
  background:color-mix(in srgb,var(--green) 12%,var(--panel));
  border-radius:99px;
  padding:2px 6px;
  font-weight:650;
}
.decree-copy h3 { font:400 23px/1.16 var(--display); margin:4px 0; }
.decree-copy p { margin:0; font-size:12px; line-height:1.6; color:var(--muted); overflow-wrap:anywhere; }
.decree-vote { display:inline-block; margin-top:8px; color:var(--decree-ink); font-weight:650; font-size:11px; }
.archive-empty {
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 14px;
  border:1px dashed var(--decree-edge);
  border-radius:var(--document-radius);
  color:var(--muted);
  font-size:12px;
}
.archive-empty span { font:400 30px var(--display); color:var(--decree-ink); }
.archive-empty p { margin:0; }

.chronicle-cover {
  --archive-line:#a9c0cd28;
  color:#f1eee4;
  border-color:#49606c;
  background:radial-gradient(ellipse at 90% 40%,#466070,transparent 70%),#283d48;
}
.chronicle-cover .eyebrow { color:#dfc695; }
.chronicle-cover p { color:#d1dce0; }
.chronicle-download {
  display:inline-flex;
  align-items:center;
  gap:6px;
  flex:none;
  min-height:36px;
  padding:6px 9px;
  border:1px solid #b7ccd27a;
  border-radius:5px;
  background:#243740;
  color:#f3e4c5;
  font-size:11px;
  font-weight:700;
}
.chronicle-download:hover { border-color:#f3e4c5; }
.chronicle-timeline { display:grid; gap:14px; margin-top:15px; }
.chronicle-day {
  display:grid;
  position:relative;
  grid-template-columns:49px minmax(0,1fr);
  gap:12px;
}
.chronicle-day::before {
  content:"";
  position:absolute;
  left:24px;
  top:40px;
  bottom:-15px;
  border-left:1px solid var(--line);
}
.chronicle-day:last-child::before { bottom:12px; }
.chronicle-date {
  display:grid;
  align-self:start;
  justify-items:center;
  position:relative;
  padding:6px 0;
  border:1px solid var(--line);
  border-radius:6px;
  color:var(--gold);
  background:var(--panel2);
}
.chronicle-date span { font-size:9px; letter-spacing:.08em; text-transform:uppercase; }
.chronicle-date strong { font:400 26px/1 var(--display); }
.chronicle-entries { display:grid; gap:5px; }
.chronicle-entry {
  --entry-ink:var(--muted);
  --entry-tint:var(--panel2);
  display:grid;
  grid-template-columns:27px minmax(0,1fr);
  gap:9px;
  padding:8px 9px;
  border-radius:7px;
}
.chronicle-entry[data-entry-kind=decision] {
  --entry-ink:var(--green);
  --entry-tint:color-mix(in srgb,var(--green) 13%,var(--panel));
  background:var(--entry-tint);
}
.chronicle-entry[data-entry-kind=consequence], .chronicle-entry[data-entry-kind=promise] {
  --entry-ink:var(--gold);
  --entry-tint:color-mix(in srgb,var(--gold) 16%,var(--panel));
}
.chronicle-entry[data-entry-kind=report] {
  border-top:1px solid var(--line);
  border-radius:0;
}
.chronicle-icon {
  display:grid;
  place-items:center;
  height:27px;
  border-radius:5px;
  color:var(--entry-ink);
  background:var(--entry-tint);
}
.chronicle-kind { display:block; color:var(--entry-ink); font-size:9px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.chronicle-entry h3 { margin:2px 0; font-size:13px; line-height:1.35; }
.chronicle-entry p { margin:0; font-size:12px; color:var(--muted); line-height:1.55; overflow-wrap:anywhere; }
@media(max-width:650px) {
  .content-view.archive-view { padding:12px; }
  .archive-cover { padding:12px 13px; }
  .decree-seal { width:51px; height:51px; outline-offset:2px; }
  .decree-seal strong { font-size:24px; }
  .decree-seal span { font-size:8px; }
  .decree-axes { grid-template-columns:minmax(0,1fr); gap:7px; }
  .chronicle-cover { flex-wrap:wrap; }
  .chronicle-download { min-height:32px; }
  .chronicle-day { grid-template-columns:35px minmax(0,1fr); gap:5px; }
  .chronicle-day::before { left:17px; }
  .chronicle-date strong { font-size:23px; }
  .chronicle-entry { padding:7px 6px; gap:6px; grid-template-columns:23px minmax(0,1fr); }
  .chronicle-icon { height:23px; }
  .chronicle-icon .ui-icon { width:14px; height:14px; }
}