/* ============================================================
   Square Wars portal — one stylesheet for landing, hangar,
   and the account pages. Palette/type from the prototype.
   Fonts (Orbitron + Share Tech Mono) are linked per-page.
   ============================================================ */
:root{
  --bg:#060a0e; --panel:#0b1520; --border:#1a3028;
  --green:#2dff7f; --gdim:#1a8844; --amber:#ffaa00; --blue:#4dc8ff;
  --red:#ff4455; --yellow:#ffe14d; --text:#8ab898; --tdim:#4a6a54;
}
*,*::before,*::after{ box-sizing:border-box; }
html,body{ margin:0; min-height:100%; }
body{ background:var(--bg); color:var(--text); font-family:'Share Tech Mono',monospace; font-size:14px; }
a{ color:var(--green); text-decoration:none; }
a:hover{ text-decoration:underline; }

/* ---- backdrop: diagonal gradient + scattered Rubik tiles ---- */
.sw-backdrop{
  position:fixed; inset:0; overflow:hidden; z-index:0;
  background:
          radial-gradient(110% 80% at 10% 6%,  rgba(26,136,68,.18), transparent 46%),
          radial-gradient(110% 80% at 92% 94%, rgba(77,200,255,.14), transparent 48%),
          linear-gradient(135deg,#04110b 0%, #060a0e 46%, #07121b 100%);
}
.sw-backdrop::after{
  content:""; position:absolute; inset:0;
  background:radial-gradient(120% 80% at 50% 42%, transparent 38%, rgba(6,10,14,.82) 100%);
}
.tile{ position:absolute; border-radius:4px; transform:rotate(var(--r,0deg)); }
.tile.sq{ border:1.5px solid currentColor; background:rgba(255,255,255,.02); box-shadow:0 0 20px -6px currentColor; }
.tile.face{
  border:1px solid currentColor; opacity:.5; background-color:rgba(255,255,255,.015);
  background-image:
          linear-gradient(currentColor 1px, transparent 1px),
          linear-gradient(90deg, currentColor 1px, transparent 1px);
  background-size:33.33% 33.33%;
}
.tile.float{ animation:swfloat 7s ease-in-out infinite; }
@keyframes swfloat{ 0%,100%{ transform:translateY(0) rotate(var(--r,0deg)); } 50%{ transform:translateY(-10px) rotate(var(--r,0deg)); } }

/* ---- page shell over the backdrop ---- */
.sw-page{ position:relative; z-index:1; min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:32px 16px; }

/* ---- hero wordmark + cycling square marks ---- */
.sw-wordmark{ display:flex; align-items:center; justify-content:center; gap:16px; white-space:nowrap; }
.sw-wordmark h1{
  font-family:'Orbitron',monospace; font-weight:900; letter-spacing:9px; color:var(--green);
  font-size:clamp(30px,8.5vw,48px); margin:0; text-shadow:0 0 26px rgba(45,255,127,.4);
}
.mark{
  width:26px; height:26px; border-radius:5px; flex-shrink:0;
  border:2.5px solid var(--green); background:rgba(45,255,127,.1);
  box-shadow:0 0 8px rgba(45,255,127,.4);
  animation:swcycle 6.6s steps(1,end) infinite;
}
.mark.b{ animation-delay:-2.2s; }
@keyframes swcycle{
  0%   { border-color:var(--red);    box-shadow:0 0 8px var(--red);    background:rgba(255,68,85,.10); }
  16.6%{ border-color:var(--amber);  box-shadow:0 0 8px var(--amber);  background:rgba(255,170,0,.10); }
  33.3%{ border-color:var(--yellow); box-shadow:0 0 8px var(--yellow); background:rgba(255,225,77,.10); }
  50%  { border-color:var(--green);  box-shadow:0 0 8px var(--green);  background:rgba(45,255,127,.10); }
  66.6%{ border-color:var(--blue);   box-shadow:0 0 8px var(--blue);   background:rgba(77,200,255,.10); }
  83.3%{ border-color:#fff;          box-shadow:0 0 8px #fff;          background:rgba(255,255,255,.10); }
}
@media (prefers-reduced-motion:reduce){ .tile.float{ animation:none; } .mark{ animation:none; } }

/* ---- cards + buttons ---- */
.sw-hero{ text-align:center; margin-bottom:28px; }
.sw-card{ width:100%; max-width:380px; background:var(--panel); border:1px solid var(--border); border-radius:6px; padding:24px; box-shadow:0 0 28px -10px rgba(45,255,127,.25); }
.sw-card-title{ text-align:center; font-family:'Orbitron',monospace; color:var(--text); font-size:13px; letter-spacing:3px; margin-bottom:16px; }
.sw-btn{ display:block; width:100%; text-align:center; padding:12px 16px; border-radius:4px; border:none; cursor:pointer; font-family:'Share Tech Mono',monospace; font-weight:700; font-size:13px; letter-spacing:2px; background:linear-gradient(90deg,var(--gdim),var(--green)); color:#04140b; }
.sw-btn:hover{ filter:brightness(1.08); text-decoration:none; }
.sw-btn.ghost{ background:transparent; border:1px solid var(--gdim); color:var(--green); font-weight:400; }
.sw-btn + .sw-btn{ margin-top:10px; }

/* ---- hangar ---- */
.hangar{ position:relative; z-index:1; max-width:720px; margin:0 auto; padding:24px 16px; }
.hangar-bar{ display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; gap:12px; flex-wrap:wrap; }
.hangar-bar .who{ font-size:11px; color:var(--tdim); }
.hangar-kicker{ color:var(--tdim); font-size:11px; letter-spacing:2px; margin-bottom:18px; }
.section-title{ display:flex; align-items:center; gap:10px; margin:22px 0 12px; }
.section-title span{ font-family:'Orbitron',monospace; color:var(--text); font-size:12px; letter-spacing:3px; }
.section-title .rule{ flex:1; height:1px; background:var(--border); }
.empty{ border:1px dashed var(--border); border-radius:4px; padding:18px 14px; color:var(--tdim); font-size:12px; text-align:center; letter-spacing:1px; }
.server-row{ display:flex; justify-content:space-between; align-items:center; gap:12px; border:1px solid var(--border); border-radius:4px; padding:12px 14px; margin-bottom:8px; background:var(--bg); }
.server-row .name{ font-family:'Orbitron',monospace; color:var(--green); font-size:15px; letter-spacing:2px; }
.server-row .meta{ font-size:11px; color:var(--tdim); margin-top:3px; }
.row-btn{ width:auto; padding:7px 14px; }

/* ---- account pages (existing auth-* markup) ---- */
.auth-shell{ position:relative; z-index:1; min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px; }
.auth-card{ width:100%; max-width:380px; background:var(--panel); border:1px solid var(--border); border-radius:6px; padding:28px; box-shadow:0 0 28px -10px rgba(45,255,127,.25); }
.auth-brand{ font-family:'Orbitron',monospace; font-weight:900; letter-spacing:4px; color:var(--green); font-size:22px; text-align:center; text-shadow:0 0 16px rgba(45,255,127,.45); }
.auth-tagline{ text-align:center; color:var(--tdim); font-size:12px; margin:8px 0 18px; }
.auth-step{ text-align:center; color:var(--tdim); font-size:11px; letter-spacing:2px; margin-bottom:20px; }
.auth-label{ display:block; font-size:11px; letter-spacing:2px; color:var(--tdim); margin:14px 0 6px; font-weight:700; }
.auth-input{ width:100%; background:#081016; border:1px solid var(--border); color:var(--green); padding:11px 12px; font-size:14px; letter-spacing:1px; border-radius:4px; font-family:'Share Tech Mono',monospace; }
.auth-input:focus{ outline:none; border-color:var(--gdim); box-shadow:0 0 0 2px rgba(45,255,127,.25); }
.auth-error{ color:var(--red); font-size:12px; min-height:16px; margin-top:10px; }
.auth-btn{ display:block; width:100%; margin-top:18px; padding:12px 16px; border:none; border-radius:4px; cursor:pointer; background:linear-gradient(90deg,var(--gdim),var(--green)); color:#04140b; font-family:'Share Tech Mono',monospace; font-weight:700; font-size:13px; letter-spacing:2px; }
.auth-btn:hover{ filter:brightness(1.08); }
.auth-foot{ text-align:center; color:var(--tdim); font-size:11px; margin-top:18px; }

/* ---- admin dashboard ---- */
.admin-wrap{ position:relative; z-index:1; max-width:1040px; margin:0 auto; padding:24px 16px; }
.admin-title{ font-family:'Orbitron',monospace; color:var(--green); font-size:18px; letter-spacing:3px; margin:0 0 4px; }
.admin-sub{ color:var(--tdim); font-size:11px; letter-spacing:2px; margin-bottom:20px; }
.admin-table{ width:100%; border-collapse:collapse; font-size:12px; }
.admin-table th{ text-align:left; color:var(--tdim); font-weight:400; letter-spacing:1px; border-bottom:1px solid var(--border); padding:8px 10px; }
.admin-table td{ border-bottom:1px solid var(--border); padding:8px 10px; color:var(--text); vertical-align:middle; }
.admin-table tr:hover td{ background:#0d1a26; }
.dot{ display:inline-block; width:8px; height:8px; border-radius:50%; }
.dot.on{ background:var(--green); box-shadow:0 0 6px var(--green); }
.dot.off{ background:var(--tdim); }
.tag{ font-size:10px; letter-spacing:1px; padding:2px 6px; border-radius:2px; border:1px solid; margin-right:4px; }
.tag.admin{ color:var(--amber); border-color:var(--amber); }
.tag.banned{ color:var(--red); border-color:var(--red); }
.tag.active{ color:var(--green); border-color:var(--green); }
.abtn{ font-family:'Share Tech Mono',monospace; font-size:11px; letter-spacing:1px; padding:5px 9px; border-radius:3px; cursor:pointer; background:transparent; border:1px solid var(--gdim); color:var(--green); text-decoration:none; }
.abtn:hover{ filter:brightness(1.15); text-decoration:none; }
.abtn.danger{ border-color:var(--red); color:var(--red); }
.admin-panel{ background:var(--panel); border:1px solid var(--border); border-radius:6px; padding:16px; margin-top:24px; }
.admin-input{ background:#081016; border:1px solid var(--border); color:var(--green); padding:8px 10px; border-radius:3px; font-family:'Share Tech Mono',monospace; font-size:12px; }

.auth-static{ text-align:center; color:var(--green); font-size:13px; letter-spacing:1px; margin:-6px 0 8px; }
.auth-verified-mark{ text-align:center; color:var(--green); font-family:'Orbitron',monospace; letter-spacing:2px; font-size:14px; margin:12px 0 6px; text-shadow:0 0 12px rgba(45,255,127,.4); }

.code{ font-weight:700; }
.code.ok{ color:var(--green); }
.code.redir{ color:var(--blue); }
.code.warn{ color:var(--amber); }
.code.err{ color:var(--red); }

.auth-hint{ color:var(--tdim); font-size:11px; letter-spacing:.5px; margin:2px 0 10px; }
.auth-check{ display:flex; align-items:flex-start; gap:8px; color:var(--tdim); font-size:12px; margin:6px 0 4px; cursor:pointer; line-height:1.4; }
.auth-check input{ margin-top:2px; accent-color:var(--green); }

.verify-banner{ background:rgba(255,170,0,.08); border:1px solid var(--amber); color:var(--amber); padding:12px 16px; border-radius:6px; margin:16px 0; font-size:13px; letter-spacing:.5px; }
.verify-banner a{ color:var(--amber); text-decoration:underline; }
.sw-btn.disabled{ opacity:.4; cursor:not-allowed; pointer-events:none; }

.notfound{ position:relative; z-index:1; min-height:70vh; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; text-align:center; }
.nf-code{ font-family:'Orbitron',monospace; font-weight:900; font-size:72px; letter-spacing:6px; color:var(--green); text-shadow:0 0 24px rgba(45,255,127,.35); }
.nf-msg{ color:var(--tdim); letter-spacing:2px; font-size:14px; margin-bottom:6px; }