/* Zhu·Ge Command — dashboard shell. Brand system copied from website/ (Inter 300/400,
   Luxury-Midnight palette, clamp() responsive, quiet luxury). Data-free; carries no secrets. */

/* The [hidden]-attribute display guard: the auth toggle sets the native `hidden`
   attribute, whose UA-origin display:none LOSES to any author-origin display rule
   (.signin-wrap sets flex) — without this guard the sign-in card never hides after
   auth. This is the gate-3 cycle-89 fix, landed in REPO sources this time (it
   previously lived only in the retired serving layer; resurfaced by the Vercel
   re-host — cycle 137). */
[hidden] { display: none !important; }

:root {
  --deep-navy: #0A0F1F;
  --gold: #D4AF37;
  --gold-light: #E8D48B;
  --gold-muted: #C9B97A;
  --ice: #CADCFC;
  --white: #FFFFFF;
  --warm-gray: #9CA3AF;
  --error: #E87461;
  --panel: rgba(10, 15, 31, 0.6);
  --panel-border: rgba(201, 185, 122, 0.18);
  --restricted: #C99A6A;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: 'Inter', 'Segoe UI', sans-serif;
  font-weight: 300;
  color: var(--white);
  background:
    radial-gradient(120% 90% at 100% 0%, rgba(212, 175, 55, 0.16) 0%, rgba(212, 175, 55, 0.04) 28%, transparent 55%),
    var(--deep-navy);
  background-attachment: fixed;
  min-height: 100vh;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

/* ── Header ── */
.app-header {
  display: flex; align-items: baseline; justify-content: space-between;
  padding: clamp(16px, 3vw, 32px) clamp(20px, 4vw, 56px);
  border-bottom: 1px solid var(--panel-border);
}
.wordmark {
  font-size: clamp(16px, 1.8vw, 26px); font-weight: 300; color: var(--gold-muted);
  letter-spacing: clamp(6px, 1vw, 14px); text-transform: uppercase;
}
.org-name { font-size: clamp(11px, 0.9vw, 14px); color: var(--warm-gray); letter-spacing: 2px; }
.sign-out { background: none; border: none; color: var(--warm-gray); cursor: pointer;
  font-family: inherit; font-size: clamp(11px, 0.9vw, 13px); letter-spacing: 1px; }
.sign-out:hover { color: var(--gold-muted); }

/* ── Sign-in ── */
.signin-wrap { display: flex; align-items: center; justify-content: center; min-height: 90vh; padding: 24px; }
.signin-card {
  background: var(--panel); border: 1px solid var(--panel-border); border-radius: 4px;
  padding: clamp(28px, 4vw, 48px); max-width: 420px; width: 100%; text-align: center;
  backdrop-filter: blur(8px);
}
.signin-card h1 { font-size: clamp(18px, 2vw, 28px); font-weight: 300; color: var(--gold-muted);
  letter-spacing: clamp(8px, 1.2vw, 16px); text-transform: uppercase; margin-bottom: 10px; }
.signin-card p { color: var(--warm-gray); font-size: clamp(13px, 1vw, 15px); margin-bottom: 28px; }
.signin-card input {
  width: 100%; padding: 13px 16px; background: rgba(255,255,255,0.04); color: var(--white);
  border: 1px solid var(--panel-border); border-radius: 3px; font-family: inherit;
  font-size: 15px; margin-bottom: 16px;
}
.signin-card input:focus { outline: none; border-color: var(--gold-muted); }
.btn {
  width: 100%; padding: 13px; background: var(--gold); color: var(--deep-navy);
  border: none; border-radius: 3px; font-family: inherit; font-weight: 500; font-size: 14px;
  letter-spacing: 1px; cursor: pointer; transition: background 0.2s;
}
.btn:hover { background: var(--gold-light); }
.btn:disabled { opacity: 0.5; cursor: default; }
.msg { margin-top: 16px; font-size: 13px; color: var(--ice); min-height: 18px; }
.msg.error { color: var(--error); }

/* ── App / panels ── */
.panels {
  display: grid; gap: clamp(16px, 2vw, 24px); padding: clamp(20px, 3vw, 40px) clamp(20px, 4vw, 56px);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr));
}
.panel { background: var(--panel); border: 1px solid var(--panel-border); border-radius: 4px;
  padding: clamp(18px, 2vw, 26px); backdrop-filter: blur(8px); }
.panel.wide { grid-column: 1 / -1; }
.panel h2 {
  font-size: clamp(13px, 1.1vw, 16px); font-weight: 400; color: var(--gold-muted);
  letter-spacing: 3px; text-transform: uppercase; margin-bottom: 16px;
  padding-bottom: 10px; border-bottom: 1px solid var(--panel-border);
}
.panel .empty { color: var(--warm-gray); font-size: 13px; font-style: normal; }

/* ── Cards / rows ── */
.card { padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,0.06); }
.card:last-child { border-bottom: none; }
.card-title { font-size: clamp(13px, 1vw, 15px); color: var(--white); font-weight: 400; }
.card-meta { font-size: 12px; color: var(--warm-gray); margin-top: 4px; display: flex; gap: 12px; flex-wrap: wrap; }
.card-body { font-size: 13px; color: var(--ice); margin-top: 8px; white-space: pre-wrap; }

.badge { display: inline-block; font-size: 10px; letter-spacing: 1.5px; text-transform: uppercase;
  padding: 2px 7px; border-radius: 2px; border: 1px solid currentColor; }
.badge.tier-restricted { color: var(--restricted); }
.badge.tier-executive_only { color: var(--gold-muted); }
.badge.health-red { color: var(--error); }
.badge.health-yellow { color: var(--gold-light); }

/* Briefing content (markdown-ish, rendered as preformatted) */
.briefing-content { font-size: 13px; color: var(--ice); white-space: pre-wrap;
  max-height: 320px; overflow-y: auto; padding-right: 8px; }

/* ── Reveal ── */
.reveal-btn { margin-top: 8px; padding: 5px 12px; background: transparent; color: var(--restricted);
  border: 1px solid var(--restricted); border-radius: 2px; font-family: inherit; font-size: 11px;
  letter-spacing: 1px; cursor: pointer; }
.reveal-btn:hover { background: rgba(201,154,106,0.12); }
.revealed-note { margin-top: 6px; font-size: 11px; color: var(--gold-muted); letter-spacing: 0.5px; }
.revealed-body { margin-top: 8px; font-size: 13px; color: var(--white); white-space: pre-wrap;
  border-left: 2px solid var(--restricted); padding-left: 10px; }

/* ── Review queue (destination + clear-path) ── */
.review-count { font-size: 15px; color: var(--ice); margin-bottom: 12px; letter-spacing: 0.3px; }
.review-count strong { color: var(--gold-light); font-weight: 500; }
.review-count.review-clear { color: var(--gold-muted); }
.mark-btn { margin-top: 8px; padding: 5px 12px; background: transparent; color: var(--gold-light);
  border: 1px solid var(--gold-light); border-radius: 2px; font-family: inherit; font-size: 11px;
  letter-spacing: 1px; cursor: pointer; }
.mark-btn:hover { background: rgba(212,175,55,0.12); }
.mark-btn:disabled { opacity: 0.5; cursor: default; }
.card-cleared { opacity: 0.5; transition: opacity 0.3s ease; }

.loading { text-align: center; color: var(--warm-gray); padding: 60px; letter-spacing: 2px; }

/* ── B2-d mark + bead loader ── */
.brand-mark { width: clamp(40px, 6vw, 56px); height: auto; display: block; margin: 0 auto 18px;
  filter: drop-shadow(0 2px 12px rgba(212, 175, 55, 0.22)); }
.brand-lockup { display: inline-flex; align-items: center; gap: 0.6em; }
.app-mark { width: clamp(22px, 2.4vw, 30px); height: auto; display: block; flex: none; }
.bead-loader { width: clamp(120px, 18vw, 168px); height: auto; display: block; margin: 0 auto 14px; }
.loading-text { font-size: 13px; letter-spacing: 2px; }