/* Conclave Keeper standalone chrome. The simulation's isometric canvas stays
 * procedural; this layer gives its panels a charcoal/bone/oxblood/brass/cyan
 * material language and owns the desktop-only gate. */
:root {
  --tc-surface: #151c22;
  --tc-surface-raised: #1e2930;
  --tc-surface-deep: #080b10;
  --tc-panel-top: #1a252c;
  --tc-accent: #7ce4e5;
  --tc-accent-soft: #eee7d6;
  --tc-border: #4bc5cc;
  --tc-border-strong: #7ce4e5;
  --tc-text: #e8e0d1;
  --tc-text-strong: #fff8e9;
  --tc-text-secondary: #c8c0b1;
  --tc-text-muted: #8c9da0;
  --tc-positive: #68e2e0;
  --tc-positive-text: #f3ead8;
  --tc-danger: #b44852;
  --tc-danger-text: #ffe5db;
  --tc-accent-text: #f2dfb0;
  --tc-shadow-edge: #090a0f;
  --tc-title-backdrop-start: rgba(16, 18, 24, .28);
  --tc-title-backdrop-end: rgba(8, 9, 13, .96);
  --tc-control-top: #26353b;
  --tc-control-bottom: #0d1319;
  --tc-font-ui: Georgia, 'Times New Roman', serif;
  --tc-font-data: ui-monospace, SFMono-Regular, Consolas, monospace;
}

html, body, #app {
  background: #0c0e13;
  cursor: url('/images/cursors/pointer.cur') 6 0, url('/images/cursors/pointer.png') 6 0, default;
}
body {
  color: var(--tc-text);
  cursor: url('/images/cursors/pointer.cur') 6 0, url('/images/cursors/pointer.png') 6 0, default;
}

button, a, input, select, textarea, summary, .card, .vopt, .theme-swatch,
[role='button'], [tabindex]:not([tabindex='-1']) {
  cursor: url('/images/cursors/hover.cur') 11 0, url('/images/cursors/hover.png') 11 0, pointer !important;
}
#game { cursor: url('/images/cursors/pointer.cur') 6 0, url('/images/cursors/pointer.png') 6 0, default !important; }
#btn-mute, #btn-music { display: none !important; }

[hidden], .hidden { display: none !important; }

/* The shared widget replaces the whole play surface on an unsupported device. */
.mobile-support-gate {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
  place-items: center;
  padding: 28px;
  background: radial-gradient(circle at 50% 38%, #293039 0%, #0b0d12 68%);
  color: var(--tc-text);
  text-align: center;
}
.mobile-support-gate > div { max-width: 34rem; }
.mobile-support-gate span { display: block; margin-bottom: 12px; color: var(--tc-positive); font-size: 42px; }
.mobile-support-gate strong { display: block; color: var(--tc-accent-soft); font: 700 1.35rem/1.2 Georgia, serif; letter-spacing: .04em; }
.mobile-support-gate p { margin: 12px 0 0; color: #bbc1c2; line-height: 1.6; }
@media (max-width: 919px), (pointer: coarse) {
  body.mobile-unsupported > .mobile-support-gate { display: grid; }
  body.mobile-unsupported > #app { display: none !important; }
}

#title-screen { background: radial-gradient(ellipse at center, #161c22aa, #07090df2 76%); }
#title-card {
  border: 1px solid #4bc5cc88;
  background: linear-gradient(150deg, #171b22f2, #090b10f5 70%);
  box-shadow: 0 18px 70px #000c, inset 0 0 0 1px #4bc5cc33;
}
#title-logo.ck-wordmark {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(5px, .8vw, 11px);
  width: min(560px, 84vw);
  max-width: 100%;
  min-height: clamp(132px, 18vh, 210px);
  height: auto;
  margin: 0 auto;
  color: var(--tc-accent-soft);
  font: 700 clamp(2.35rem, 6.2vw, 5.25rem)/.84 Georgia, serif;
  letter-spacing: .13em;
  text-align: center;
  text-shadow: 0 2px 0 #0b0d12, 0 0 22px #4bc5cc4d;
  white-space: nowrap;
}
#title-logo.ck-wordmark span {
  display: block;
  line-height: .84;
  white-space: nowrap;
}
#title-buttons { gap: 9px; }
#title-buttons .keeper-name-label {
  color: var(--tc-accent-soft);
  font: 700 11px/1.2 var(--tc-font-data);
  letter-spacing: .15em;
}
#playerName {
  width: 100%;
  min-height: 42px;
  padding: 9px 12px;
  border: 1px solid #4bc5cc99;
  border-radius: 4px;
  background: #080a0fd9;
  color: var(--tc-text-strong);
  font: 600 16px/1.2 var(--tc-font-ui);
  text-align: center;
}
#playerName::placeholder { color: #899395; }
#playerName:focus { border-color: var(--tc-positive); outline: 2px solid #4bc5cc55; outline-offset: 2px; }
#title-buttons button {
  border-color: #4bc5cc;
  background: linear-gradient(#202b32, #10151c);
  color: var(--tc-text-strong);
  letter-spacing: .09em;
}
#title-buttons button:hover { border-color: var(--tc-positive); box-shadow: 0 0 15px #4bc5cc33; }
#title-buttons button.secondary { background: #0e141add; border-color: #4bc5cc88; }
#title-footer { color: #899395; }
#title-footer a, #title-footer button { color: var(--tc-positive); }
#footer-right { color: #c8bfae; letter-spacing: .11em; }

/* The escape link stays anchored to the title overlay; the footer carries
 * only the shared Keeper identity link and local-archive note. */
#title-return {
  position: absolute;
  top: clamp(92px, 11vh, 118px);
  right: clamp(18px, 3vw, 42px);
  left: auto;
  z-index: 2;
  padding: 8px 11px;
  border: 1px solid #4bc5cc88;
  border-radius: 4px;
  background: #090d13cc;
  color: var(--tc-positive);
  font: 700 11px/1.2 var(--tc-font-data);
  letter-spacing: .08em;
  text-decoration: none;
}
#title-return:hover, #title-return:focus-visible {
  border-color: var(--tc-positive);
  background: #13232acc;
  box-shadow: 0 0 16px #4bc5cc33;
}

#members-box {
  background: linear-gradient(#e8e0d0, #bdb5a7);
  border-color: #756b5b;
  color: #191a20;
}
#members-box span { color: #7e2430; }
#sat-line, #rep-line { color: #4c5960; }
#sat-line span.sat-up { color: #148f93; }
#sat-line span.sat-down { color: #8f2837; }
#rep-line span { color: #6e4927; }

#bottom-bar { background: linear-gradient(#171d24f5, #080a0ff5); border-top-color: #4bc5cc; }
#bottom-brand { background: #10131a; border-color: #4bc5cc66; }
.ck-bottom-wordmark { display: block; max-width: 88px; color: var(--tc-accent-soft); font: 700 12px/1.05 Georgia, serif; letter-spacing: .12em; text-align: center; }
#money-box, #date-box { color: var(--tc-text); }
#money-value { color: var(--tc-accent-soft); }
#money-label { color: var(--tc-positive); }
#tool-buttons .tool-btn { border-color: #4bc5cc88; background: linear-gradient(#202b32, #10151c); color: #eee7d6; }
#tool-buttons .tool-btn:hover, #tool-buttons .tool-btn:focus-visible { border-color: var(--tc-accent); box-shadow: 0 0 12px #4bc5cc2e; }
.group-pop { background: #0b1017f5; border-color: #4bc5cc; box-shadow: 0 12px 34px #000b; }

/* Active/selected states inherit warm reference colors in the vendored CSS;
 * keep those states cyan-lit against obsidian with oxblood reserved for risk. */
.tool-btn.active, .tool-btn.report-notify {
  background: linear-gradient(#7b2e3d, #4d1b28);
  border-color: var(--tc-accent);
  border-bottom-color: #2a1119;
  border-right-color: #2a1119;
  color: var(--tc-text-strong);
  text-shadow: none;
}
.card.active, .vopt.selected {
  background: #12323a;
  border-color: var(--tc-accent);
  color: var(--tc-text-strong);
  box-shadow: 0 0 12px #4bc5cc2e;
}
.guide-nav button.active {
  background: #4bc5cc24;
  color: var(--tc-accent);
}
.theme-swatch.active {
  border-color: var(--tc-accent);
  box-shadow: 0 0 8px #4bc5cc66;
}

/* Shared bug/achievement triggers are mounted outside #app. Keep them above
 * the simulation navigation without covering the canvas or the title card. */
.cc-bug-bar.is-floating {
  right: 18px;
  bottom: calc(var(--tc-nav-height, 86px) + 14px);
  z-index: 70;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin: 0;
  pointer-events: auto;
}
.cc-minigame-tools {
  position: fixed;
  right: 18px;
  bottom: calc(var(--tc-nav-height, 86px) + 14px);
  z-index: 70;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  pointer-events: auto;
}
.cc-minigame-tools button,
.cc-minigame-tools a {
  pointer-events: auto;
  white-space: nowrap;
  cursor: url('/images/cursors/hover.cur') 11 0, url('/images/cursors/hover.png') 11 0, pointer;
}
.cc-minigame-tools button,
.cc-minigame-tools a {
  background: #090f15ef;
  border-color: #4bc5cc;
  color: var(--tc-text);
  box-shadow: 0 5px 18px #0009;
}
.cc-minigame-tools button:hover,
.cc-minigame-tools button:focus-visible,
.cc-minigame-tools a:hover,
.cc-minigame-tools a:focus-visible {
  border-color: var(--tc-accent);
  color: var(--tc-accent);
  box-shadow: 0 0 14px #4bc5cc66, 0 5px 18px #0009;
}
.cc-bug-bar.is-floating .cc-bug-trigger,
.cc-bug-bar.is-floating .cc-ach-trigger {
  pointer-events: auto;
  white-space: nowrap;
  background: #090f15eF;
  border-color: #4bc5cc;
  color: var(--tc-text);
  box-shadow: 0 5px 18px #0009;
}
.cc-bug-bar.is-floating .cc-bug-trigger:hover,
.cc-bug-bar.is-floating .cc-ach-trigger:hover,
.cc-bug-bar.is-floating .cc-bug-trigger:focus-visible,
.cc-bug-bar.is-floating .cc-ach-trigger:focus-visible {
  border-color: var(--tc-accent);
  color: var(--tc-accent);
  box-shadow: 0 0 14px #4bc5cc66, 0 5px 18px #0009;
}

/* Ensure inherited menu/panel controls read as obsidian, bone, cyan and a
 * restrained oxblood warning instead of the reference's gold office chrome. */
#modal-card, #build-panel, #log-panel, #inspect-box, #tutorial-box {
  background: linear-gradient(150deg, #171d24f5, #080b10f5 78%);
  border-color: #4bc5cc;
  color: var(--tc-text);
}
#modal-title, #inspect-content .i-name, .guide-content h3, .log-row.log-achievement .log-text { color: var(--tc-accent); }
#modal-buttons button, #build-panel button, #log-panel button, #tutorial-box button {
  cursor: url('/images/cursors/hover.cur') 11 0, url('/images/cursors/hover.png') 11 0, pointer;
}
#modal-buttons button:not(.secondary) { background: linear-gradient(#8d2e3d, #5e1e2b); border-color: #8de5e2; color: #f7eee1; }
#modal-buttons button.secondary { border-color: #4bc5cc; background: #10171d; color: var(--tc-text-strong); }
#quest-ack { border-color: #8de5e2; background: #7b2e3d33; color: var(--tc-accent-soft); }
#quest-ack:hover, #quest-ack:focus-visible { border-color: var(--tc-accent); background: #7b2e3d66; }

/* Hide upstream service surfaces while retaining local archives/help. */
