:root{
  --bg:#0A0C10;
  --panel:#12151C;
  --panel-2:#171B24;
  --line:#232838;
  --text:#E9ECF2;
  --muted:#838B9E;
  --accent:#FFB454;
  --accent-dim:#8A6A38;
  --data:#4FA8E0;
  --good:#46E397;
  --bad:#FF6B6B;
  --radius:2px;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:'Inter',sans-serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit; text-decoration:none;}
.mono{font-family:'JetBrains Mono',monospace;}
::selection{background:var(--accent); color:#0A0C10;}

/* Custom scrollbar — reinforces the "custom system" feel */
::-webkit-scrollbar{width:10px; height:10px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--line); border-radius:5px; border:2px solid var(--bg);}
::-webkit-scrollbar-thumb:hover{background:var(--accent-dim);}
html{scrollbar-color:var(--line) var(--bg); scrollbar-width:thin;}

/* Nav progress bar — brief fill on internal navigation, perceived-speed cue */
.nav-progress{position:fixed; top:0; left:0; height:2px; width:0; background:var(--accent); z-index:200; box-shadow:0 0 8px var(--accent); transition:width .4s ease, opacity .3s ease .2s; opacity:0;}
.nav-progress.active{width:70%; opacity:1; transition:width .4s ease, opacity 0s;}

/* Reveal-on-scroll: elements start slightly displaced + faded, settle into
   place once visible. JS toggles .is-visible; CSS does the motion. Falls
   back to fully visible with no observer when JS is off or motion is reduced. */
[data-reveal]{opacity:0; transform:translateY(22px); filter:blur(2px); transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1), filter .7s ease;}
[data-reveal].is-visible{opacity:1; transform:translateY(0); filter:blur(0);}
[data-reveal="stagger"] > *{opacity:0; transform:translateY(18px);}
[data-reveal="stagger"].is-visible > *{opacity:1; transform:translateY(0); transition:opacity .6s cubic-bezier(.16,1,.3,1), transform .6s cubic-bezier(.16,1,.3,1);}
[data-reveal="stagger"].is-visible > *:nth-child(1){transition-delay:.05s;}
[data-reveal="stagger"].is-visible > *:nth-child(2){transition-delay:.12s;}
[data-reveal="stagger"].is-visible > *:nth-child(3){transition-delay:.19s;}
[data-reveal="stagger"].is-visible > *:nth-child(4){transition-delay:.26s;}
[data-reveal="stagger"].is-visible > *:nth-child(5){transition-delay:.33s;}
[data-reveal="stagger"].is-visible > *:nth-child(6){transition-delay:.4s;}
.no-js [data-reveal],
.no-js [data-reveal="stagger"] > *{opacity:1; transform:none; filter:none;}

.grid-bg{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size:48px 48px;
  mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, black 40%, transparent 100%);
}

/* Cursor-reactive glow, contained to the hero. Position driven by JS via
   --spot-x/--spot-y custom properties (mousemove, rAF-throttled). Purely
   decorative — never intercepts pointer events. */
.hero-glow{
  position:absolute; inset:0; z-index:0; pointer-events:none; opacity:0;
  transition:opacity .5s ease;
  background:radial-gradient(480px circle at var(--spot-x,50%) var(--spot-y,30%), rgba(255,180,84,0.08), transparent 70%);
}
.hero-glow.is-active{opacity:1;}

@keyframes pulse-ring{
  0%{box-shadow:0 0 0 0 rgba(70,227,151,0.55);}
  100%{box-shadow:0 0 0 9px rgba(70,227,151,0);}
}
.logo .dot{position:relative;}
.logo .dot::after{
  content:''; position:absolute; inset:0; border-radius:50%;
  animation:pulse-ring 2.2s cubic-bezier(.4,0,.6,1) infinite;
}

/* ---------- NAV ---------- */
header{position:sticky; top:0; z-index:50; background:rgba(10,12,16,0.85); backdrop-filter:blur(10px); border-bottom:1px solid var(--line);}
nav{max-width:1180px; margin:0 auto; padding:18px 28px; display:flex; align-items:center; justify-content:space-between; position:relative;}
.logo{font-family:'JetBrains Mono',monospace; font-weight:700; font-size:15px; letter-spacing:0.02em; display:flex; align-items:center; gap:8px;}
.logo .dot{width:7px; height:7px; border-radius:50%; background:var(--good); box-shadow:0 0 8px var(--good); display:inline-block;}
.navlinks{display:flex; gap:26px; font-size:13.5px; color:var(--muted);}
.navlinks a{transition:color .15s; padding-bottom:2px; border-bottom:1px solid transparent;}
.navlinks a:hover{color:var(--text);}
.navlinks a.active{color:var(--accent); border-color:var(--accent);}
.navcta{display:flex; gap:10px; align-items:center;}
.navtoggle{display:none; flex-direction:column; gap:4px; background:none; border:none; cursor:pointer;}
.navtoggle span{width:22px; height:2px; background:var(--text);}
.btn{font-family:'JetBrains Mono',monospace; font-size:12.5px; font-weight:600; padding:9px 16px; border-radius:var(--radius); border:1px solid var(--line); letter-spacing:0.02em; transition:transform .15s cubic-bezier(.16,1,.3,1), box-shadow .15s ease, background-color .15s ease, border-color .15s ease; cursor:pointer; display:inline-block;}
.btn:active{transform:translateY(1px) scale(0.98);}
.btn-primary{background:var(--accent); color:#0A0C10; border-color:var(--accent);}
.btn-primary:hover{background:#ffc478; transform:translateY(-2px); box-shadow:0 8px 20px -6px rgba(255,180,84,0.45);}
.btn-primary:active{transform:translateY(0) scale(0.98); box-shadow:0 2px 8px -2px rgba(255,180,84,0.4);}
.btn-ghost{color:var(--text); border-color:var(--line);}
.btn-ghost:hover{border-color:var(--accent-dim); transform:translateY(-2px); box-shadow:0 8px 16px -8px rgba(0,0,0,0.5);}
.btn-danger{color:var(--bad); border-color:rgba(255,107,107,0.35); background:rgba(255,107,107,0.06);}
.btn-danger:hover{border-color:var(--bad);}
.btn-small{padding:6px 11px; font-size:11.5px;}
@media(max-width:820px){
  .navlinks{display:none; position:absolute; top:100%; left:0; right:0; flex-direction:column; gap:0; background:var(--panel); border-bottom:1px solid var(--line);}
  .navlinks.open{display:flex;}
  .navlinks a{padding:14px 28px; border-bottom:1px solid var(--line);}
  .navtoggle{display:flex;}
}

section{position:relative; z-index:1;}
.wrap{max-width:1180px; margin:0 auto; padding:0 28px;}
.page-wrap{max-width:1180px; margin:0 auto; padding:72px 28px 100px; position:relative; z-index:1;}

/* ---------- FLASH ---------- */
.flash-bar{padding-top:18px;}
.flash{font-family:'JetBrains Mono',monospace; font-size:13px; padding:12px 16px; border-radius:4px; margin-bottom:10px; border:1px solid;}
.flash-success{color:var(--good); border-color:rgba(70,227,151,0.3); background:rgba(70,227,151,0.06);}
.flash-error{color:var(--bad); border-color:rgba(255,107,107,0.3); background:rgba(255,107,107,0.06);}

/* ---------- HERO ---------- */
.hero{padding:96px 0 72px; position:relative; overflow:hidden;}
.hero-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:64px; align-items:center; position:relative; z-index:1;}
@media(max-width:900px){ .hero-grid{grid-template-columns:1fr;} }
.eyebrow{font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--accent); letter-spacing:0.12em; text-transform:uppercase; margin-bottom:18px; display:flex; align-items:center; gap:10px;}
.eyebrow::before{content:''; width:16px; height:1px; background:var(--accent);}
h1{font-family:'JetBrains Mono',monospace; font-weight:700; font-size:44px; line-height:1.15; letter-spacing:-0.01em; margin-bottom:22px;}
h1 .hl{color:var(--accent);}
@media(max-width:600px){ h1{font-size:32px;} }
.lead{color:var(--muted); font-size:16px; max-width:480px; margin-bottom:32px;}
.hero-ctas{display:flex; gap:12px; flex-wrap:wrap;}

.terminal{background:var(--panel); border:1px solid var(--line); border-radius:6px; overflow:hidden; box-shadow:0 20px 60px -20px rgba(0,0,0,0.6); transition:transform .3s cubic-bezier(.16,1,.3,1), box-shadow .3s ease; transform-style:preserve-3d; will-change:transform;}
.term-bar{display:flex; align-items:center; gap:7px; padding:11px 14px; background:var(--panel-2); border-bottom:1px solid var(--line);}
.term-bar span{width:10px; height:10px; border-radius:50%; background:#3A4050;}
.term-title{margin-left:8px; font-family:'JetBrains Mono',monospace; font-size:11.5px; color:var(--muted);}
.term-body{padding:20px 18px; font-family:'JetBrains Mono',monospace; font-size:13px; min-height:220px;}
.term-line{margin-bottom:9px; opacity:0; animation:fadeIn .4s forwards;}
.term-line .prompt{color:var(--accent);}
.term-line .ok{color:var(--good);}
.term-line .path{color:var(--data);}
.cursor{display:inline-block; width:7px; height:14px; background:var(--accent); vertical-align:middle; animation:blink 1s steps(1) infinite;}
@keyframes fadeIn{to{opacity:1;}}
@keyframes blink{50%{opacity:0;}}

.statusbar{border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--panel);}
.status-row{display:grid; grid-template-columns:repeat(4,1fr);}
@media(max-width:700px){ .status-row{grid-template-columns:repeat(2,1fr);} }
.status-cell{padding:26px 28px; border-right:1px solid var(--line);}
.status-cell:last-child{border-right:none;}
.status-num{font-family:'JetBrains Mono',monospace; font-weight:700; font-size:26px; color:var(--accent);}
.status-label{font-size:12px; color:var(--muted); margin-top:4px; text-transform:uppercase; letter-spacing:0.06em;}

.sec-head{margin-bottom:44px; max-width:600px;}
.sec-tag{font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--data); letter-spacing:0.1em; text-transform:uppercase; margin-bottom:12px;}
h2{font-family:'JetBrains Mono',monospace; font-size:28px; font-weight:700; margin-bottom:12px;}
.sec-desc{color:var(--muted); font-size:15px;}
.page-head{margin-bottom:56px;}
.page-head h1{font-size:34px; margin-bottom:14px;}
.page-head p{color:var(--muted); max-width:560px;}

.services{padding:88px 0;}
.svc-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
@media(max-width:700px){ .svc-grid{grid-template-columns:1fr;} }
.svc-card{background:var(--bg); padding:32px; transition:background .2s ease, transform .3s cubic-bezier(.16,1,.3,1), box-shadow .3s ease; transform-style:preserve-3d; will-change:transform; position:relative;}
.svc-card:hover{background:var(--panel); box-shadow:0 16px 40px -20px rgba(0,0,0,0.7), inset 0 0 0 1px rgba(255,180,84,0.15);}
.svc-top{display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:18px;}
.svc-index{font-family:'JetBrains Mono',monospace; color:var(--line); font-size:34px; font-weight:800;}
.svc-status{font-family:'JetBrains Mono',monospace; font-size:10.5px; padding:3px 9px; border-radius:20px; border:1px solid; letter-spacing:0.05em; text-transform:uppercase; white-space:nowrap;}
.st-live{color:var(--good); border-color:rgba(70,227,151,0.3); background:rgba(70,227,151,0.06); box-shadow:0 0 12px -4px rgba(70,227,151,0.5);}
.svc-title{font-family:'JetBrains Mono',monospace; font-weight:600; font-size:17px; margin-bottom:10px;}
.svc-desc{color:var(--muted); font-size:14px;}

.about{padding:88px 0; border-top:1px solid var(--line);}
.about-grid{display:grid; grid-template-columns:1fr 1fr; gap:64px;}
@media(max-width:850px){ .about-grid{grid-template-columns:1fr;} }
.about p{color:var(--muted); font-size:15px; margin-bottom:16px;}
.about p strong{color:var(--text); font-weight:600;}
.values{display:flex; flex-direction:column; gap:0;}
.value-row{display:flex; gap:18px; padding:20px 0; border-top:1px solid var(--line);}
.value-row:last-child{border-bottom:1px solid var(--line);}
.value-tag{font-family:'JetBrains Mono',monospace; color:var(--accent); font-size:13px; font-weight:700; min-width:90px;}
.value-text{color:var(--muted); font-size:14px;}
.value-text strong{color:var(--text);}

.shop-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
@media(max-width:850px){ .shop-grid{grid-template-columns:1fr 1fr;} }
@media(max-width:560px){ .shop-grid{grid-template-columns:1fr;} }
.shop-card{border:1px solid var(--line); border-radius:6px; padding:24px 22px; text-align:left; transition:border-color .2s ease, transform .3s cubic-bezier(.16,1,.3,1), box-shadow .3s ease; background:var(--panel); transform-style:preserve-3d; will-change:transform; overflow:hidden;}
.shop-card:hover{border-color:var(--accent-dim); box-shadow:0 16px 40px -18px rgba(0,0,0,0.7);}
.shop-card img{transition:transform .4s cubic-bezier(.16,1,.3,1);}
.shop-card:hover img{transform:scale(1.04);}
.shop-icon{font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--data); margin-bottom:14px;}
.shop-cat{font-family:'JetBrains Mono',monospace; font-weight:600; font-size:15px; margin-bottom:6px;}
.shop-price{font-family:'JetBrains Mono',monospace; color:var(--accent); font-size:14px; margin-bottom:10px;}
.shop-soon{font-size:12px; color:var(--muted);}
.shop-desc{font-size:13px; color:var(--muted);}

.empty-state{border:1px dashed var(--line); border-radius:6px; padding:60px 30px; text-align:center;}
.empty-state .tag{font-family:'JetBrains Mono',monospace; color:var(--muted); font-size:13px; margin-bottom:8px; display:block;}
.empty-state h3{font-family:'JetBrains Mono',monospace; font-size:18px; margin-bottom:10px;}
.empty-state p{color:var(--muted); font-size:14px; max-width:420px; margin:0 auto;}

.split-grid{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:6px; overflow:hidden;}
@media(max-width:850px){ .split-grid{grid-template-columns:1fr;} }
.split-cell{background:var(--panel); padding:36px; transition:background .2s ease;}
.split-cell:hover{background:var(--panel-2);}
.split-cell h3{font-family:'JetBrains Mono',monospace; font-size:16px; margin-bottom:10px;}
.split-cell p{color:var(--muted); font-size:14px; margin-bottom:20px;}
.partner-badge{display:inline-flex; align-items:center; gap:8px; font-family:'JetBrains Mono',monospace; font-size:12.5px; color:var(--text); background:var(--panel-2); border:1px solid var(--line); padding:8px 12px; border-radius:20px; margin-bottom:18px;}
.partner-badge .dot{width:6px; height:6px; border-radius:50%; background:var(--good);}

.final-cta{padding:100px 0; text-align:center; border-top:1px solid var(--line);}
.final-cta h2{font-size:32px; margin-bottom:14px;}
.final-cta p{color:var(--muted); max-width:460px; margin:0 auto 32px;}
.final-ctas{display:flex; gap:12px; justify-content:center; flex-wrap:wrap;}

footer{border-top:1px solid var(--line); padding:32px 0; position:relative; z-index:1;}
.foot-row{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;}
.foot-links{display:flex; gap:24px; font-size:13px; color:var(--muted);}
.foot-copy{font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--muted);}

.staff-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
@media(max-width:850px){ .staff-grid{grid-template-columns:1fr 1fr;} }
@media(max-width:560px){ .staff-grid{grid-template-columns:1fr;} }
.staff-card{background:var(--panel); border:1px solid var(--line); border-radius:6px; padding:26px; transition:transform .3s cubic-bezier(.16,1,.3,1), box-shadow .3s ease, border-color .2s ease; transform-style:preserve-3d; will-change:transform;}
.staff-card:hover{border-color:var(--accent-dim); box-shadow:0 16px 40px -18px rgba(0,0,0,0.7);}
.staff-avatar{width:48px; height:48px; border-radius:50%; background:var(--panel-2); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; font-family:'JetBrains Mono',monospace; color:var(--accent); font-weight:700; margin-bottom:16px;}
.staff-name{font-family:'JetBrains Mono',monospace; font-weight:600; font-size:15px; margin-bottom:4px;}
.staff-role{font-size:12.5px; color:var(--data); margin-bottom:12px;}
.staff-bio{font-size:13.5px; color:var(--muted);}

.link-list{display:flex; flex-direction:column; gap:12px; max-width:520px;}
.link-item{display:flex; justify-content:space-between; align-items:center; background:var(--panel); border:1px solid var(--line); border-radius:6px; padding:18px 20px; transition:border-color .15s;}
.link-item:hover{border-color:var(--accent-dim);}
.link-label{font-family:'JetBrains Mono',monospace; font-size:14px;}
.link-arrow{color:var(--accent); font-family:'JetBrains Mono',monospace;}

/* ---------- FORMS (auth + panel) ---------- */
.auth-wrap{max-width:400px; margin:0 auto;}
.auth-card{background:var(--panel); border:1px solid var(--line); border-radius:6px; padding:36px;}
.auth-card h1{font-size:24px; margin-bottom:8px;}
.auth-card .sub{color:var(--muted); font-size:14px; margin-bottom:28px;}
.field{margin-bottom:18px;}
.field label{display:block; font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--muted); margin-bottom:8px; text-transform:uppercase; letter-spacing:0.05em;}
.field input, .field textarea, .field select{
  width:100%; background:var(--panel-2); border:1px solid var(--line); border-radius:4px;
  padding:11px 14px; color:var(--text); font-family:'Inter',sans-serif; font-size:14px;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.field textarea{resize:vertical; min-height:100px;}
.field input:focus, .field textarea:focus, .field select:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(255,180,84,0.12);}
.field-check{display:flex; align-items:center; gap:10px; margin-bottom:18px;}
.field-check input{accent-color:var(--accent); width:16px; height:16px;}
.field-check label{font-family:'JetBrains Mono',monospace; font-size:12.5px; color:var(--text); text-transform:none; margin-bottom:0;}
.auth-submit{width:100%; text-align:center; margin-top:6px;}
.auth-alt{margin-top:22px; text-align:center; font-size:13.5px; color:var(--muted);}
.auth-alt a{color:var(--accent);}
.form-errors{background:rgba(255,107,107,0.06); border:1px solid rgba(255,107,107,0.3); border-radius:4px; padding:14px 16px; margin-bottom:22px;}
.form-errors div{color:var(--bad); font-size:13px; font-family:'JetBrains Mono',monospace; margin-bottom:4px;}
.form-errors div:last-child{margin-bottom:0;}
.form-actions{display:flex; gap:10px; margin-top:8px;}

/* ---------- PANEL SHELL ---------- */
.panel-shell{display:grid; grid-template-columns:220px 1fr; gap:48px; align-items:start;}
@media(max-width:800px){ .panel-shell{grid-template-columns:1fr;} }
.panel-nav{display:flex; flex-direction:column; gap:2px; position:sticky; top:90px;}
.panel-nav-title{font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--muted); letter-spacing:0.08em; padding:0 14px; margin:18px 0 6px;}
.panel-nav-title:first-child{margin-top:0;}
.panel-nav a{padding:10px 14px; border-radius:4px; font-size:13.5px; color:var(--muted); font-family:'JetBrains Mono',monospace;}
.panel-nav a:hover{color:var(--text); background:var(--panel);}
.panel-nav a.active{color:var(--accent); background:var(--panel);}
.panel-header{display:flex; justify-content:space-between; align-items:center; margin-bottom:26px; gap:16px; flex-wrap:wrap;}
.panel-header h1{font-size:22px;}
.panel-card{background:var(--panel); border:1px solid var(--line); border-radius:6px; padding:28px;}
.panel-table{width:100%; border-collapse:collapse;}
.panel-table th, .panel-table td{padding:12px 14px; border-bottom:1px solid var(--line); text-align:left; font-size:13.5px; vertical-align:middle;}
.panel-table th{color:var(--muted); font-family:'JetBrains Mono',monospace; font-size:10.5px; text-transform:uppercase; letter-spacing:0.05em;}
.panel-table tr:last-child td{border-bottom:none;}
.badge{font-family:'JetBrains Mono',monospace; font-size:10.5px; padding:3px 9px; border-radius:20px; border:1px solid var(--line); color:var(--muted); white-space:nowrap; display:inline-block;}
.badge-on{color:var(--good); border-color:rgba(70,227,151,0.3); background:rgba(70,227,151,0.06);}
.badge-off{color:var(--bad); border-color:rgba(255,107,107,0.3); background:rgba(255,107,107,0.06);}
.badge-owner{color:var(--accent); border-color:rgba(255,180,84,0.3); background:rgba(255,180,84,0.06);}
.row-actions{display:flex; gap:8px; align-items:center; flex-wrap:wrap;}
.row-actions form{display:inline;}
.perm-section{margin-bottom:32px;}
.perm-section:last-child{margin-bottom:0;}
.perm-section h3{font-family:'JetBrains Mono',monospace; font-size:14px; margin-bottom:4px;}
.perm-section .perm-sub{color:var(--muted); font-size:12.5px; margin-bottom:16px;}
.perm-row{display:flex; justify-content:space-between; align-items:center; padding:12px 0; border-bottom:1px solid var(--line);}
.perm-row:last-child{border-bottom:none;}
.perm-row label{font-size:13.5px;}
.perm-row input{accent-color:var(--accent); width:16px; height:16px;}
.dash-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:16px;}
@media(max-width:700px){ .dash-grid{grid-template-columns:1fr;} }
.dash-card{background:var(--panel); border:1px solid var(--line); border-radius:6px; padding:22px;}
.dash-card h3{font-family:'JetBrains Mono',monospace; font-size:14px; margin-bottom:8px;}
.dash-card p{color:var(--muted); font-size:13.5px; margin-bottom:14px;}
.empty-cell{color:var(--muted); font-size:13px; padding:20px 0;}

/* ---------- ERROR PAGE ---------- */
.error-wrap{max-width:480px; margin:120px auto; text-align:center; padding:0 28px;}
.error-code{font-family:'JetBrains Mono',monospace; font-size:64px; font-weight:800; color:var(--accent);}
.error-msg{color:var(--muted); margin:14px 0 28px; font-size:15px;}

@media(prefers-reduced-motion: reduce){
  *{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important;}
}
:focus-visible{outline:2px solid var(--accent); outline-offset:2px;}