/* Extracted from vr/index.html — architecture-400 R1. Do not hand-duplicate; edit here. */
  /* Climate panel */
  .clim-strip {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px;
    margin: 0 0 10px;
  }
  .clim-chip {
    background: rgba(0,0,0,.28); border: 1px solid var(--line); border-radius: 8px;
    padding: 6px 7px; min-width: 0;
  }
  .clim-chip span {
    display: block; font-size: 8.5px; letter-spacing: .08em; text-transform: uppercase;
    color: var(--dim); margin-bottom: 2px;
  }
  .clim-chip b {
    font-family: Syne, sans-serif; font-weight: 700; font-size: 12px; color: #d8e6ff;
    letter-spacing: .02em; word-break: break-word;
  }
  .clim-chart { margin-top: 2px; }
  .clim-chart svg { width: 100%; height: auto; border-radius: 8px; display: block; }
  .clim-overlays { margin-top: 4px; }
  .clim-overlays button { font-size: 10.5px; padding: 5px 7px; }
  .clim-explain {
    margin-top: 10px; padding: 8px 9px; border-radius: 8px;
    background: rgba(0,0,0,.22); border: 1px solid var(--line);
  }
  .clim-fact {
    font-size: 10.5px; color: #9aacc4; line-height: 1.45; margin: 0 0 5px;
  }
  .clim-fact:last-child { margin-bottom: 0; }
  .clim-fact b { color: #d4e4ff; font-weight: 500; }
  #pane-climate { padding-bottom: 6px; }

  .clim-desks, .suite-desks {
    display: flex; gap: 3px; flex-wrap: wrap; margin: 0 0 10px;
    padding: 3px; border-radius: 9px;
    background: rgba(0,0,0,.22); border: 1px solid var(--line);
  }
  .clim-desk-tab, .suite-desk-tab {
    flex: 1 1 auto; min-width: 56px;
    display: inline-flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 3px;
    font-size: 9.5px; padding: 6px 4px; border-radius: 6px;
    background: transparent; border: 0; color: #9aacc4; cursor: pointer;
    letter-spacing: .03em; text-transform: uppercase;
  }
  .clim-desk-tab:hover, .suite-desk-tab:hover { color: #d4e4ff; background: rgba(110,160,255,.08); }
  .clim-desk-tab[aria-pressed="true"], .suite-desk-tab[aria-pressed="true"] {
    color: #e8f0ff; background: rgba(110,160,255,.18);
  }
  .clim-desk-tab .ico, .suite-desk-tab .ico { width: 13px; height: 13px; opacity: 0.85; }
  .clim-desk-tab[aria-pressed="true"] .ico, .suite-desk-tab[aria-pressed="true"] .ico { opacity: 1; }
  .clim-desk, .suite-desk { display: none; }
  .clim-desk.on, .suite-desk.on { display: block; animation: paneIn .35s var(--ease); }

  .sec-h, #pane-god .god-h, .lab-card h3 {
    display: flex; align-items: center; gap: 6px;
  }
  .sec-h .ico, #pane-god .god-h .ico, .lab-card h3 .ico {
    flex: 0 0 auto; opacity: 0.9;
  }
  .sec-h {
    font-family: Syne, sans-serif; font-size: 10px; font-weight: 700;
    letter-spacing: .16em; text-transform: uppercase; color: #9fc0ff; margin: 0 0 8px;
  }
  .lab-card[hidden], .suite-desk[hidden] { display: none !important; }
  .clim-desk[data-desk-panel="system"],
  .clim-desk[data-desk-panel="fantasy"] {
    max-height: min(56vh, 480px);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 2px;
  }
  .clim-list .clim-row { touch-action: manipulation; }
  .clim-row {
    display: flex; flex-direction: column; gap: 2px; text-align: left;
    padding: 7px 8px; border-radius: 7px;
    background: rgba(0,0,0,.24); border: 1px solid var(--line);
    color: #c5d4ec; cursor: pointer; font: inherit;
  }
  .clim-row.static { cursor: default; }
  .clim-row:hover:not(.static) { border-color: rgba(110,160,255,.35); }
  .clim-row[aria-pressed="true"] {
    border-color: rgba(110,160,255,.55); background: rgba(110,160,255,.12);
  }
  .clim-row-name {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 12px; color: #e8f0ff; font-weight: 500;
  }
  .clim-row-meta { font-size: 10px; color: #8fa0bd; }
  .clim-empty {
    font-size: 11px; color: #8fa0bd; padding: 8px; border-radius: 7px;
    background: rgba(0,0,0,.18); border: 1px dashed var(--line);
  }
  .clim-actions { margin-top: 4px; }
  .guides-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
  }
  .guides-actions button {
    width: 100%;
    justify-content: center;
  }
  .guides-actions #viewThoughtMind {
    grid-column: 1 / -1;
  }
  .mind-hint {
    max-height: 4.2em;
    overflow: hidden;
  }
  .mind-hint.is-error {
    color: #e8a090;
    max-height: 5.6em;
  }
  .clim-callout {
    margin-top: 8px; padding: 8px 9px; border-radius: 8px;
    font-size: 11px; line-height: 1.45; color: #b8c8e0;
    background: linear-gradient(135deg, rgba(40,70,120,.35), rgba(20,30,50,.4));
    border: 1px solid rgba(110,160,255,.22);
  }
  .clim-callout b { color: #e8f0ff; font-weight: 600; }
  .clim-meter { margin-top: 2px; }
  .clim-meter-bar {
    height: 6px; border-radius: 999px; background: rgba(0,0,0,.35);
    overflow: hidden; border: 1px solid var(--line);
  }
  .clim-meter-bar i {
    display: block; height: 100%; border-radius: inherit;
    background: linear-gradient(90deg, #5a8fd4, #e0a060 70%, #e07060);
  }
  .clim-meter-lab { font-size: 11px; color: #c5d4ec; margin: 6px 0 4px; line-height: 1.4; }
  .clim-compare {
    display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 8px;
  }
  .clim-compare-pane {
    padding: 6px; border-radius: 8px;
    background: rgba(0,0,0,.24); border: 1px solid var(--line);
    min-width: 0;
  }
  .clim-compare-h {
    font-size: 9.5px; letter-spacing: .04em; color: #9fc0ff;
    margin-bottom: 4px; line-height: 1.35;
  }
  .clim-compare-chart svg { width: 100%; height: auto; display: block; border-radius: 4px; }
  @media (max-width: 420px) {
    .clim-compare { grid-template-columns: 1fr; }
  }

  .dock-body { overflow:auto; flex:1; min-height:0; scrollbar-width:thin; }
  .dock-pane { display:none; animation: paneIn .4s var(--ease); }
  .dock-pane.on { display:block; }
  @keyframes paneIn { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:none; } }
  .tools { display:flex; gap:4px; flex-wrap:wrap; }
  #toolsLand, #toolsLife, #toolsStrike, #toolsClimate, #toolsEvil {
    display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:4px;
  }
  #toolsLand button, #toolsLife button, #toolsStrike button, #toolsClimate button, #toolsEvil button {
    width:100%; justify-content:flex-start; min-width:0; min-height:30px;
  }
  .tools button, .dock-foot button, .god-actions button, .god-primary {
    display: inline-flex; align-items: center; gap: 5px;
  }
  .tools button { font-size:11px; padding:5px 8px; }
  button .ico {
    flex: 0 0 auto; opacity: 0.85; display: block;
  }
  button[aria-pressed="true"] .ico { opacity: 1; }
  .tools button.vandal-suggest {
    box-shadow: 0 0 0 1px rgba(255, 196, 90, .55), 0 0 12px rgba(255, 180, 60, .18);
  }
  button .btn-label { line-height: 1; }
  .tools-more { display:none; margin-top:6px; padding-top:6px; border-top:1px solid var(--line); }
  .tools-more.open { display:flex; gap:4px; flex-wrap:wrap; }
  .rules { display:flex; gap:4px; flex-wrap:wrap; margin-bottom:6px; }
  .rules button { font-size:11px; padding:5px 8px; }
  .layer-list { display:flex; flex-direction:column; gap:3px; margin:6px 0 8px; }
  .layer-row {
    display:flex; align-items:center; gap:6px;
    padding:4px 6px; border-radius:7px;
    border:1px solid var(--line); background:rgba(0,0,0,.22);
    cursor:pointer; text-align:left; width:100%;
  }
  .layer-row:hover { border-color:rgba(110,160,255,.35); }
  .layer-row[aria-pressed="true"] {
    border-color:rgba(110,160,255,.55); background:rgba(110,160,255,.12);
  }
  .layer-row.locked { cursor:default; }
  .layer-row .layer-eye {
    width:24px; height:24px; padding:0; flex:0 0 auto; border-radius:6px;
    font-size:11px; line-height:1;
  }
  .layer-row .layer-name {
    flex:1; min-width:0; background:transparent; border:0; color:inherit;
    font:inherit; font-size:11px; padding:2px 0;
  }
  .layer-row .layer-name:focus { outline:1px solid rgba(110,160,255,.35); border-radius:4px; }
  .layer-row .layer-blend {
    font-size:9px; letter-spacing:.04em; text-transform:uppercase; color:var(--dim); flex:0 0 auto;
  }
  .view-row { display:flex; align-items:center; gap:8px; margin:6px 0; font-size:11px; color:#9aacc4; }
  .view-row label { min-width:52px; letter-spacing:.06em; text-transform:uppercase; font-size:9.5px; color:var(--dim); }
  .view-row input[type="range"] {
    flex:1; min-width:0; height:14px; margin:0; background:transparent;
    -webkit-appearance:none; appearance:none; accent-color:var(--accent);
  }
  .view-row input[type="range"]::-webkit-slider-runnable-track {
    height:3px; border-radius:99px; background:rgba(120,160,220,.22);
  }
  .view-row input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance:none; appearance:none;
    width:12px; height:12px; margin-top:-4.5px;
    border-radius:50%; background:var(--accent); border:0;
    box-shadow: 0 0 0 2px rgba(3,5,10,.55);
  }
  .view-row input[type="range"]::-moz-range-track {
    height:3px; border-radius:99px; background:rgba(120,160,220,.22); border:0;
  }
  .view-row input[type="range"]::-moz-range-thumb {
    width:12px; height:12px; border-radius:50%; background:var(--accent); border:0;
  }
  .view-row input[type="checkbox"] { accent-color:var(--accent); width:13px; height:13px; }
  .view-row .val { min-width:40px; text-align:right; font-size:11px; color:#cfe0ff; }
  .stats {
    margin-top:6px; padding-top:8px; border-top:1px solid var(--line);
    font-size:11px; line-height:1.55; color:#8fa0bd;
  }
  .stats b { color:#d4e4ff; font-weight:500; }
  .stats .era-name {
    font-family: Syne, sans-serif; font-weight:700; font-size:13px; color:#f0f4ff;
    letter-spacing:.02em; display:block; margin-bottom:2px;
  }
  /* Dark ledger chip — sits just above the time ribbon, never on the pause row. */
  #darkhud.darkhud-chip-host {
    display:block; position:fixed; z-index:40;
    left:calc(var(--gutter) + var(--safe-l));
    bottom:calc(var(--gutter) + var(--safe-b) + var(--dark-chip-lift, 240px));
    top:auto; right:auto; max-width:min(320px, calc(100vw - 24px));
    padding:0;
    background:transparent; border:none; pointer-events:auto;
  }
  #darkhud:not(.darkhud-chip-host) { display:none !important; }
  .dark-chip {
    appearance:none; cursor:pointer;
    padding:5px 11px; border-radius:999px;
    background:rgba(6,10,18,.88); border:1px solid rgba(255,140,90,.32);
    backdrop-filter:blur(8px);
    font:500 11px/1.3 "IBM Plex Mono", ui-monospace, Menlo, monospace;
    color:#c8d0e0; letter-spacing:.02em;
    box-shadow:0 4px 18px rgba(0,0,0,.4);
    max-width:100%;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  }
  .dark-chip:hover { border-color:rgba(255,160,100,.5); color:#f0f4ff; }
  .dark-chip-toll { color:#ff9a7a; font-weight:700; }
  .dark-chip-in { color:#7ee8ff; font-weight:700; }
  .dark-chip-threat { color:#ff6a4a; font-weight:800; letter-spacing:.04em; animation:dark-pulse .7s ease-in-out infinite; }
  .dark-chip-us { color:#ffd090; }
  .dark-chip-alert { border-color:rgba(255,90,60,.65); box-shadow:0 0 18px rgba(255,60,40,.25); }
  .dark-chip-flash { color:#ffd080; animation:dark-pulse 1.1s ease-in-out infinite; }
  .dark-chip-doom { color:#9aa8c0; }
  .dark-chip-winter { color:#9ec8ff; }
  @keyframes dark-pulse { 0%,100%{ opacity:1 } 50%{ opacity:.55 } }
  #darkhud-dock .dark-h { margin-top:6px; font-size:9px; letter-spacing:.14em; text-transform:uppercase; color:#7a90b0; }
  #darkhud-dock .dark-toll { color:#e8a090; }
  #darkhud-dock .dark-toll b, #darkhud-dock .dark-doom b { color:#f0d8d0; font-weight:600; }
  #darkhud-dock .dark-muted { color:#6a7a94; font-size:11px; }
  #darkhud-dock .dark-in { color:#a8e0f0; }
  #darkhud-dock .dark-in-threat { color:#ff8a6a; font-weight:600; }
  #darkhud-dock .dark-in-us { color:#ffd090; }
  #darkhud-dock .dark-ix { color:#c8d0ff; }
  #darkhud-dock .dark-rel.bad { color:#e08070; }
  #darkhud-dock .dark-rel.good { color:#7dff9a; }
  #darkhud-dock .dark-rel.mid { color:#b0c0d8; }
  body.letitrun #darkhud { opacity:0; pointer-events:none; }
  #inspect { display:none; margin-top:8px; padding:8px; border-radius:8px;
    background:rgba(0,0,0,.28); border:1px solid var(--line);
    font-size:11px; line-height:1.5; color:#b8c8e0; }
  .dock-foot { display:flex; gap:4px; flex-wrap:wrap; }
  .dock-foot button { font-size:11px; padding:5px 8px; }
  .hint-mini { font-size:10px; color:var(--dim); margin:6px 0 0; line-height:1.4; }
  .modes-pair {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin: 8px 0 4px;
  }
  .mode-card {
    border: 1px solid rgba(140, 170, 210, 0.18);
    background: rgba(8, 16, 28, 0.45);
    border-radius: 6px;
    padding: 8px 8px 7px;
    min-width: 0;
  }
  .mode-kicker {
    font-size: 9px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--dim);
    margin: 0 0 6px;
  }
  .mode-card .dock-foot { margin: 0; }
  .mode-card .dock-foot button { width: 100%; justify-content: center; }
  .mode-blurb {
    font-size: 10px;
    color: var(--dim);
    margin: 6px 0 0;
    line-height: 1.35;
  }
  .field-label {
    display:flex; align-items:center; gap:6px; margin:0;
    font-size:10px; color:var(--dim); line-height:1.4;
  }
  .field-label select { flex:0 1 auto; }

