/*
Theme Name: Oracle Prime
Theme URI: https://oracle-prime.com
Author: Oracle Prime
Description: Internal team review hub for the Empire. Dark-native, light as an opt-in peer. Palette ported from dashboard/proving-ground/lib/tokens.css so the hub speaks the same visual language as the local dashboards. No square corners, no perimeter boxes, high density.
Version: 0.1.0
Requires at least: 6.7
Requires PHP: 8.1
License: Proprietary
Text Domain: oracle-prime
*/

/* ─────────────────────────────────────────────────────────────
   TOKENS — ported from dashboard/proving-ground/lib/tokens.css.
   Dark is the default. Light is a peer, reached by data-theme.
   ───────────────────────────────────────────────────────────── */

:root {
  --p-black-warm: #0e0d0c;
  --p-char-1: #161512;
  --p-char-2: #1a1714;
  --p-char-3: #221f1a;
  --p-gold: #b8975a;
  --p-gold-light: #d4b876;
  --p-gold-bright: #e8c55a;
  --p-ember: #cf5f2c;
  --p-parchment-0: #ebe1ca;
  --p-parchment-1: #f2ead8;
  --p-parchment-2: #f8f2e4;
  --p-ink-dark: #2e2514;

  --font-display: 'Cinzel', Georgia, serif;
  --font-body: 'Nunito Sans', 'Segoe UI', system-ui, sans-serif;
  --font-mono: Consolas, 'Cascadia Mono', monospace;

  --sp-1: 6px; --sp-2: 10px; --sp-3: 14px; --sp-4: 20px; --sp-5: 30px; --sp-6: 44px;
  --chamfer: 12px;
  --radius-lg: 18px;
  --max-width: 1480px;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
}

/* dark — the default, no attribute required */
:root,
:root[data-theme="dark"] {
  --bg-0: var(--p-black-warm);
  --bg-1: var(--p-char-1);
  --surface: var(--p-char-2);
  --surface-hover: var(--p-char-3);
  --ink-hi: #e0ceae;
  --ink: #ddd4c6;
  --ink-muted: #b6afa5;
  --ink-dim: #9c9181;
  --brand: var(--p-gold);
  --brand-light: var(--p-gold-light);
  --brand-bright: var(--p-gold-bright);
  --accent: var(--p-ember);
  --hairline: rgba(184, 151, 90, .16);
  --hairline-soft: rgba(184, 151, 90, .08);
  --wash: rgba(184, 151, 90, .04);
  --splash-veil: radial-gradient(ellipse at 50% 58%, rgba(14,13,12,.30) 0%, rgba(14,13,12,.78) 55%, rgba(14,13,12,.96) 100%);
  color-scheme: dark;
}

/* light — a peer, not an afterthought */
:root[data-theme="light"] {
  --bg-0: var(--p-parchment-1);
  --bg-1: var(--p-parchment-2);
  --surface: #fffdf7;
  --surface-hover: var(--p-parchment-0);
  --ink-hi: #1c1508;
  --ink: var(--p-ink-dark);
  --ink-muted: #5d5340;
  --ink-dim: #7d7159;
  --brand: #8a6d33;
  --brand-light: #a2833f;
  --brand-bright: #7a5f28;
  --accent: #b0491d;
  --hairline: rgba(46, 37, 20, .18);
  --hairline-soft: rgba(46, 37, 20, .09);
  --wash: rgba(46, 37, 20, .04);
  /* Light gets its own quiet wash, not the dark plate seen through parchment.
     Veiling a dark-room photograph with a light overlay produces a grey smear,
     which is what "light is a peer, not an afterthought" is meant to prevent. */
  --splash-veil: radial-gradient(ellipse at 50% 58%, rgba(255,253,247,.55) 0%, var(--p-parchment-1) 62%, var(--p-parchment-0) 100%);
  color-scheme: light;
}

/* ── base ── */
*, *::before, *::after { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--bg-0);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--brand-light); text-decoration-color: var(--hairline); }
a:hover { color: var(--brand-bright); }

h1, h2, h3 { font-family: var(--font-display); color: var(--ink-hi); font-weight: 500; letter-spacing: .01em; }

/* ─────────────────────────────────────────────────────────────
   LANDING — one job: prove you are in the right place, then let
   the right people in. There is no public surface yet, so there
   is nothing else to say here.
   ───────────────────────────────────────────────────────────── */

.orp-gate {
  min-height: 100svh;
  display: grid;
  place-items: center;
  position: relative;
  isolation: isolate;
  padding: var(--sp-5);
  overflow: hidden;
}

.orp-gate__plate {
  position: absolute;
  inset: 0;
  z-index: -2;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* The veil keeps the plate atmospheric rather than loud, and guarantees
   text contrast no matter what the generated image does in the middle. */
.orp-gate__veil {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--splash-veil);
}

/* The plate is a photograph of a dark room. It belongs to dark mode and has no
   light-mode equivalent, so light hides it rather than washing it out. */
:root[data-theme="light"] .orp-gate__plate { display: none; }

.orp-gate__inner {
  width: min(420px, 100%);
  text-align: center;
  animation: orp-rise .9s var(--ease-out) both;
}

@keyframes orp-rise {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .orp-gate__inner { animation: none; }
}

.orp-gate__mark {
  font-family: var(--font-display);
  font-size: clamp(30px, 6vw, 46px);
  line-height: 1.05;
  margin: 0 0 var(--sp-2);
  color: var(--ink-hi);
}
.orp-gate__mark span { color: var(--brand); display: block; }

.orp-gate__rule {
  width: 54px;
  height: 1px;
  margin: var(--sp-4) auto;
  background: linear-gradient(90deg, transparent, var(--brand), transparent);
  opacity: .8;
}

.orp-gate__sub {
  margin: 0 0 var(--sp-5);
  color: var(--ink-muted);
  font-size: 14px;
  letter-spacing: .04em;
}

.orp-gate__enter {
  display: inline-block;
  padding: 13px 40px;
  border-radius: 999px;
  border: 1px solid var(--hairline);
  background: var(--wash);
  backdrop-filter: blur(8px);
  color: var(--ink-hi);
  font-family: var(--font-body);
  font-size: 14px;
  letter-spacing: .1em;
  text-transform: uppercase;
  text-decoration: none;
  transition: border-color .3s var(--ease-out), background .3s var(--ease-out), transform .3s var(--ease-out);
}
.orp-gate__enter:hover,
.orp-gate__enter:focus-visible {
  border-color: var(--brand);
  background: rgba(184, 151, 90, .10);
  color: var(--brand-bright);
  transform: translateY(-1px);
}
.orp-gate__enter:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }

.orp-gate__foot {
  position: absolute;
  bottom: var(--sp-4);
  left: 0; right: 0;
  text-align: center;
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-dim);
}

/* ── theme toggle ── */
.orp-theme {
  position: absolute;
  top: var(--sp-4);
  right: var(--sp-4);
  width: 34px; height: 34px;
  display: grid; place-items: center;
  border-radius: 50%;
  border: 1px solid var(--hairline-soft);
  background: transparent;
  color: var(--ink-dim);
  cursor: pointer;
  transition: color .3s var(--ease-out), border-color .3s var(--ease-out);
}
.orp-theme:hover { color: var(--brand); border-color: var(--hairline); }
.orp-theme:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.orp-theme svg { width: 15px; height: 15px; fill: currentColor; }
:root[data-theme="light"] .orp-theme .orp-moon { display: none; }
:root:not([data-theme="light"]) .orp-theme .orp-sun { display: none; }

/* ── interior pages (wiki / SOT), deliberately plain until the plugin lands ── */
.orp-page {
  max-width: 760px;
  margin: 0 auto;
  padding: var(--sp-6) var(--sp-4);
}
.orp-page img { max-width: 100%; height: auto; border-radius: var(--chamfer); }
.orp-page table { width: 100%; border-collapse: collapse; }
.orp-page th, .orp-page td { padding: var(--sp-2); border-bottom: 1px solid var(--hairline-soft); text-align: left; }
.orp-page pre { background: var(--surface); padding: var(--sp-3); border-radius: var(--chamfer); overflow-x: auto; }
.orp-page code { font-family: var(--font-mono); font-size: .92em; }