/* ─────────────────────────────────────────
   common.css — Umbral Accord shared styles
   Included on every page
───────────────────────────────────────── */

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

/* CSS VARIABLES */
:root{
  --bg:#07080f;--surface:#0a0c16;--card:#0f1220;--card2:#131625;
  --border:#1e2a3a;--border-hi:#2e3e54;--border-purple:#3a2a5a;
  --text:#d4e4f4;--text-dim:#a0b8cc;--muted:#6a7e92;--subtle:#1e2438;
  --accent:#4a9eca;--accent-hi:#9ad4f0;
  --purple:#8860d0;--purple-lo:#2a1060;--purple-mid:#5030a0;--purple-hi:#c0a0f8;
  --gold:#e8a020;--gold-hi:#f0c060;
  --teal:#3db88a;--red:#d94040;--silver-hi:#d8e4f4;
}

/* BASE */
html{scroll-behavior:smooth}
body{font-family:'Share Tech Mono',monospace;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden}
body::before{content:'';pointer-events:none;position:fixed;inset:0;z-index:200;
  background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.035) 2px,rgba(0,0,0,.035) 4px)}


/* ─────────────────────────────────────────
   GLOBAL SCROLLBAR — Umbral Accord Theme
───────────────────────────────────────── */

/* Firefox */
html{
  scrollbar-width: thin;
  scrollbar-color: var(--purple-mid) var(--bg);
}

/* Chrome / Edge / Safari */
::-webkit-scrollbar{
  width:12px;
  height:12px;
}

::-webkit-scrollbar-track{
  background:var(--bg);
}

::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,var(--purple-mid),var(--purple));
  border-radius:10px;
  border:2px solid var(--bg);
  box-shadow:0 0 6px rgba(136,96,208,.4);
}

::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg,var(--purple-hi),var(--purple-mid));
}

::-webkit-scrollbar-corner{
  background:var(--bg);
}



/* NAV */
.site-nav{position:fixed;top:0;left:0;right:0;z-index:150;background:rgba(7,8,15,.92);border-bottom:1px solid var(--border);backdrop-filter:blur(12px)}
.site-nav::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--purple-mid),transparent);opacity:.5}
.nav-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:0 24px;height:54px}
.nav-logo{display:flex;align-items:center;gap:12px;text-decoration:none;flex-shrink:0}
.nav-logo-img{width:30px;height:30px;filter:drop-shadow(0 0 8px rgba(136,96,208,.6));transition:filter .3s}
.nav-logo:hover .nav-logo-img{filter:drop-shadow(0 0 12px rgba(136,96,208,.9))}
.nav-logo-text{font-family:'Rajdhani',sans-serif;font-size:.85em;font-weight:700;letter-spacing:4px;text-transform:uppercase;color:var(--silver-hi)}
.nav-links{display:flex;align-items:center;gap:2px;list-style:none}
.nav-links a{font-family:'Rajdhani',sans-serif;font-size:.72em;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;color:var(--muted);text-decoration:none;padding:6px 14px;border-radius:3px;border:1px solid transparent;transition:all .25s;white-space:nowrap}
.nav-links a:hover{color:var(--accent-hi);border-color:rgba(74,158,202,.3);background:rgba(74,158,202,.06);text-shadow:0 0 12px rgba(154,212,240,.25)}
.nav-links a.active{color:var(--purple-hi);border-color:var(--border-purple);background:rgba(136,96,208,.1);text-shadow:0 0 14px rgba(192,160,248,.35);box-shadow:inset 0 0 12px rgba(136,96,208,.06)}
.nav-links .nav-ooc a{color:#7a8fa8;font-size:.68em;letter-spacing:2px}
.nav-links .nav-ooc a:hover{color:var(--text-dim);border-color:rgba(74,158,202,.2);background:rgba(74,158,202,.04);text-shadow:none}
.nav-links .nav-ooc a.active{color:var(--accent);border-color:rgba(74,158,202,.35);background:rgba(74,158,202,.07);text-shadow:0 0 10px rgba(74,158,202,.3)}
.nav-links .nav-cta a{color:var(--gold);border-color:rgba(232,160,32,.3);background:rgba(232,160,32,.06)}
.nav-links .nav-cta a:hover{background:rgba(232,160,32,.12);border-color:rgba(232,160,32,.5);text-shadow:0 0 10px rgba(232,160,32,.3)}
.nav-mobile-btn{display:none;background:none;border:1px solid var(--border);color:var(--muted);padding:6px 10px;border-radius:3px;cursor:pointer;font-family:'Share Tech Mono',monospace;font-size:.7em;letter-spacing:1px}
@media(max-width:768px){
  .nav-links{display:none;position:absolute;top:54px;left:0;right:0;background:rgba(7,8,15,.98);border-bottom:1px solid var(--border);flex-direction:column;padding:12px;gap:4px;align-items:stretch}
  .nav-links.open{display:flex}
  .nav-links a{padding:10px 14px}
  .nav-mobile-btn{display:block}
}

/* BACK TO TOP */
.back-to-top{position:fixed;bottom:28px;right:28px;z-index:140;width:40px;height:40px;background:var(--card);border:1px solid var(--border-purple);border-radius:4px;display:flex;align-items:center;justify-content:center;color:var(--purple-hi);font-size:.8em;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s,border-color .2s;transform:translateY(8px)}
.back-to-top.visible{opacity:1;pointer-events:all;transform:translateY(0)}
.back-to-top:hover{border-color:var(--purple);background:rgba(136,96,208,.1)}

/* FADE IN */
.fade-in{opacity:0;transform:translateY(20px);transition:opacity .5s ease,transform .5s ease}
.fade-in.visible{opacity:1;transform:translateY(0)}

/* FOOTER */
.site-footer{background:var(--surface);border-top:1px solid var(--border);padding:28px 24px}
.footer-inner{max-width:1100px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
.footer-seal{width:26px;height:26px;opacity:.1;filter:grayscale(1)}


/* Shared footer layout */
.footer-top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;margin-bottom:32px;padding-bottom:28px;border-bottom:1px solid var(--border)}
.footer-brand{display:flex;flex-direction:column;gap:12px}
.footer-logo{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:var(--text);font-family:'Rajdhani',sans-serif;font-weight:700;letter-spacing:2px;text-transform:uppercase}
.footer-logo img{width:42px;height:42px;object-fit:contain;display:block;flex:0 0 42px}
.footer-tagline{font-size:.7em;color:var(--muted);line-height:1.8;max-width:260px}
.footer-col h4{font-family:'Rajdhani',sans-serif;font-size:.62em;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--purple-hi);margin-bottom:12px}
.footer-col ul{list-style:none}
.footer-col ul li{margin-bottom:7px}
.footer-col ul a{font-size:.7em;color:var(--muted);text-decoration:none;transition:color .15s;letter-spacing:.5px}
.footer-col ul a:hover{color:var(--text)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px}
.footer-bottom span{font-size:.58em;color:var(--muted);letter-spacing:1px}
@media(max-width:768px){.footer-top{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}}
@media(max-width:480px){.footer-top{grid-template-columns:1fr}}


/* =========================
   Footer layout fix
   ========================= */

.footer {
  margin-top: 40px;
  padding: 20px 0;
  border-top: 1px solid #2a2a2a;
  background: #0f0f0f;
}

.footer-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 20px;

  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.footer-brand {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* Fix giant logo */
.footer-logo {
  width: 42px !important;
  height: 42px !important;
  object-fit: contain;
}

/* Small seal icon */
.footer-seal {
  width: 26px !important;
  height: 26px !important;
  object-fit: contain;
}

.footer-columns {
  display: flex;
  gap: 30px;
  flex-wrap: wrap;
}

.footer-column h4 {
  margin-bottom: 6px;
  font-size: 14px;
  color: #aaa;
}

.footer-column a {
  display: block;
  color: #ccc;
  font-size: 13px;
  text-decoration: none;
}

.footer-column a:hover {
  color: #fff;
}

.footer-bottom {
  text-align: center;
  font-size: 12px;
  margin-top: 14px;
  color: #777;
}


/* =========================================
   UMBRAL ACCORD RP PANEL SYSTEM
   Shared styling for RP utility pages
   ========================================= */
.ua-rp-shell{max-width:1100px;margin:0 auto}
.ua-rp-card,
.ua-rp-hero,
.ua-rp-kpi,
.ua-rp-notice,
.ua-rp-editor,
.ua-rp-staff{
  background:linear-gradient(180deg,rgba(15,18,32,.96),rgba(10,12,22,.94));
  border:1px solid rgba(120,160,255,.12);
  box-shadow:0 10px 30px rgba(0,0,0,.32), inset 0 0 0 1px rgba(255,255,255,.02);
}
.ua-rp-hero{position:relative;overflow:hidden}
.ua-rp-hero::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at top right, rgba(136,96,208,.12), transparent 40%),
             radial-gradient(circle at bottom left, rgba(74,158,202,.06), transparent 38%);
}
.ua-rp-kpi{border-radius:8px}
.ua-rp-notice{border-color:rgba(232,160,32,.18)}
.ua-rp-staff{border-color:rgba(136,96,208,.28)}
.ua-rp-btn,
.ua-rp-input,
.ua-rp-select,
.ua-rp-textarea{
  font-family:'Share Tech Mono',monospace;
}
.ua-rp-btn{
  appearance:none;
  border:1px solid rgba(120,160,255,.28);
  background:linear-gradient(135deg,rgba(74,158,202,.22),rgba(136,96,208,.18));
  color:var(--silver-hi);
  border-radius:4px;
  cursor:pointer;
  transition:transform .16s ease, border-color .16s ease, opacity .16s ease, box-shadow .16s ease;
}
.ua-rp-btn:hover{transform:translateY(-1px);opacity:.96;border-color:rgba(154,212,240,.45);box-shadow:0 0 0 1px rgba(154,212,240,.08) inset}
.ua-rp-btn.ua-rp-btn-secondary,
.ua-rp-btn-secondary{
  background:rgba(255,255,255,.04);
  border-color:rgba(120,160,255,.16);
  color:var(--text-dim);
}
.ua-rp-btn.ua-rp-btn-danger,
.ua-rp-btn-danger{
  background:rgba(217,64,64,.08);
  border-color:rgba(217,64,64,.28);
  color:#ffb0b0;
}
.ua-rp-input,
.ua-rp-select,
.ua-rp-textarea{
  width:100%;
  background:rgba(0,0,0,.42);
  border:1px solid rgba(120,160,255,.14);
  color:var(--text);
  border-radius:4px;
  padding:10px 12px;
  outline:none;
}
.ua-rp-input:focus,
.ua-rp-select:focus,
.ua-rp-textarea:focus{
  border-color:var(--purple);
  box-shadow:0 0 0 2px rgba(136,96,208,.12);
}
.ua-rp-pill{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 11px;border-radius:999px;
  border:1px solid rgba(120,160,255,.2);
  background:rgba(8,12,22,.7);
  font-size:.66em;letter-spacing:2px;text-transform:uppercase;
}
.ua-rp-admin-drawer{
  background:rgba(8,10,18,.985);
  box-shadow:-18px 0 40px rgba(0,0,0,.46);
}
.ua-rp-scroll,
.ua-rp-admin-drawer,
.ua-rp-admin-body,
.ua-rp-textarea,
.ua-rp-table-wrap{
  scrollbar-width:thin;
  scrollbar-color:#4a9eca #07080f;
}
.ua-rp-scroll::-webkit-scrollbar,
.ua-rp-admin-drawer::-webkit-scrollbar,
.ua-rp-admin-body::-webkit-scrollbar,
.ua-rp-textarea::-webkit-scrollbar,
.ua-rp-table-wrap::-webkit-scrollbar{width:10px;height:10px}
.ua-rp-scroll::-webkit-scrollbar-track,
.ua-rp-admin-drawer::-webkit-scrollbar-track,
.ua-rp-admin-body::-webkit-scrollbar-track,
.ua-rp-textarea::-webkit-scrollbar-track,
.ua-rp-table-wrap::-webkit-scrollbar-track{background:#07080f}
.ua-rp-scroll::-webkit-scrollbar-thumb,
.ua-rp-admin-drawer::-webkit-scrollbar-thumb,
.ua-rp-admin-body::-webkit-scrollbar-thumb,
.ua-rp-textarea::-webkit-scrollbar-thumb,
.ua-rp-table-wrap::-webkit-scrollbar-thumb{background:#4a9eca;border-radius:999px;border:2px solid #07080f}
.ua-rp-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.ua-rp-grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
@media(max-width:960px){.ua-rp-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.ua-rp-grid-2{grid-template-columns:1fr}}
@media(max-width:640px){.ua-rp-grid-4,.ua-rp-grid-2{grid-template-columns:1fr}}