/* KVMDR Client Portal */
:root{
  --bg:#0a0c0f; --panel:#0d0f12; --panel2:#12151a;
  --line:#1d222b; --line2:#262c37;
  --ink:#ecebe8; --muted:#9aa3b2; --faint:#6b7280;
  --accent:#EB622C; --accent-soft:rgba(235,98,44,.12);
  --ok:#3ecf8e; --ok-soft:rgba(62,207,142,.12);
  --display:"Bricolage Grotesque",sans-serif;
  --body:"Hanken Grotesk",sans-serif;
  --mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--bg); color:var(--ink); font-family:var(--body); line-height:1.55;
  -webkit-font-smoothing:antialiased; min-height:100vh;
  background-image:
    radial-gradient(900px 500px at 85% -5%, rgba(235,98,44,.10), transparent 60%),
    radial-gradient(700px 500px at 0% 100%, rgba(235,98,44,.05), transparent 55%);
  background-attachment:fixed;
}
a{color:inherit;text-decoration:none}
.brand{display:inline-flex;align-items:center;gap:0;font-family:var(--display);font-weight:800;letter-spacing:-.01em;font-size:20px;color:var(--ink)}
.brand .slash{color:var(--accent);margin:0 2px}

/* ---------- Login ---------- */
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.auth-card{width:100%;max-width:400px;background:linear-gradient(180deg,var(--panel),var(--panel2));
  border:1px solid var(--line);border-radius:18px;padding:34px 30px}
.auth-card .brand{font-size:24px}
.auth-eyebrow{display:block;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-top:16px}
.auth-card h1{font-family:var(--display);font-weight:800;font-size:24px;letter-spacing:-.01em;margin:4px 0 6px}
.auth-card .lede{color:var(--muted);font-size:14px;margin-bottom:22px}
.field{margin-bottom:14px}
.field label{display:block;font-size:12.5px;font-weight:600;color:var(--muted);margin-bottom:6px}
.field input{width:100%;background:#0b0e12;border:1px solid var(--line2);border-radius:10px;
  color:var(--ink);font-family:var(--body);font-size:15px;padding:12px 14px;transition:border-color .15s}
.field input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.btn{display:inline-block;width:100%;background:var(--accent);color:#fff;border:none;cursor:pointer;
  font-family:var(--body);font-weight:700;font-size:15px;padding:13px 18px;border-radius:10px;transition:filter .15s,transform .15s}
.btn:hover{filter:brightness(1.08)}
.btn:active{transform:translateY(1px)}
.alert{background:rgba(235,98,44,.1);border:1px solid rgba(235,98,44,.4);color:#f6b59c;
  font-size:13.5px;padding:11px 14px;border-radius:10px;margin-bottom:18px}
.auth-foot{margin-top:20px;font-size:12.5px;color:var(--faint);text-align:center}
.auth-foot a{color:var(--muted)}
.auth-foot a:hover{color:var(--ink)}

/* ---------- Portal chrome ---------- */
.topbar{position:sticky;top:0;z-index:10;background:rgba(10,12,15,.82);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line)}
.topbar .row{max-width:1080px;margin:0 auto;padding:16px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.who{display:flex;align-items:center;gap:14px;font-size:13.5px;color:var(--muted)}
.who b{color:var(--ink);font-weight:600}
.signout{border:1px solid var(--line2);border-radius:9px;padding:8px 14px;font-size:13px;font-weight:600;color:var(--muted);transition:border-color .15s,color .15s}
.signout:hover{border-color:var(--accent);color:var(--ink)}

.wrap{max-width:1080px;margin:0 auto;padding:0 22px}
.head{padding:38px 0 26px}
.head .eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);border:1px solid rgba(235,98,44,.32);background:var(--accent-soft);padding:6px 14px;border-radius:100px}
.head .eyebrow .dot{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(235,98,44,.18)}
.head h1{font-family:var(--display);font-weight:800;font-size:clamp(28px,4vw,40px);line-height:1.08;letter-spacing:-.02em;margin:16px 0 8px}
.head p{color:var(--muted);font-size:15px;max-width:62ch}

section.block{margin-bottom:34px}
.block h2{font-family:var(--display);font-weight:800;font-size:20px;letter-spacing:-.01em;margin-bottom:4px;
  display:flex;align-items:baseline;gap:12px}
.block h2 .count{font-family:var(--mono);font-size:12px;font-weight:400;color:var(--faint);letter-spacing:0}
.block .sub{color:var(--faint);font-size:13px;margin-bottom:16px}

.rows{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:linear-gradient(180deg,var(--panel),var(--panel2))}
.res{display:flex;align-items:center;gap:18px;padding:16px 20px;border-bottom:1px solid var(--line)}
.res:last-child{border-bottom:none}
.res .meta{flex:1;min-width:0}
.res .t{font-family:var(--display);font-weight:700;font-size:15.5px;color:var(--ink);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ver{font-family:var(--mono);font-size:11.5px;color:var(--accent);background:var(--accent-soft);border:1px solid rgba(235,98,44,.28);padding:2px 8px;border-radius:6px}
.res .n{color:var(--muted);font-size:13px;margin-top:3px}
.res .date{font-family:var(--mono);font-size:12px;color:var(--faint);white-space:nowrap}
.dl{display:inline-flex;align-items:center;gap:7px;background:var(--accent);color:#fff;font-weight:700;font-size:13.5px;padding:9px 16px;border-radius:9px;white-space:nowrap;transition:filter .15s,transform .15s}
.dl:hover{filter:brightness(1.08);transform:translateY(-1px)}
.soon{font-family:var(--mono);font-size:12px;color:var(--faint);border:1px dashed var(--line2);padding:8px 14px;border-radius:9px;white-space:nowrap}

/* compatibility matrix */
table.matrix{width:100%;border-collapse:collapse;border:1px solid var(--line);border-radius:14px;overflow:hidden}
table.matrix thead th{background:#101319;text-align:left;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:13px 18px;border-bottom:1px solid var(--line)}
table.matrix td{padding:13px 18px;border-bottom:1px solid var(--line);font-size:14px;color:var(--ink)}
table.matrix tr:last-child td{border-bottom:none}
table.matrix td:first-child{font-weight:600}
.pill-ok{display:inline-block;font-family:var(--mono);font-size:11.5px;color:var(--ok);background:var(--ok-soft);border:1px solid rgba(62,207,142,.3);padding:2px 9px;border-radius:6px}

footer.portal{border-top:1px solid var(--line);margin-top:18px;padding:22px 0 50px;color:var(--faint);font-size:13px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
footer.portal a{color:var(--muted)}
footer.portal a:hover{color:var(--ink)}

@media(max-width:620px){
  .res{flex-wrap:wrap;gap:10px}
  .res .date{order:3}
  .dl,.soon{width:100%;justify-content:center;text-align:center}
}
@media(prefers-reduced-motion:reduce){.dl:hover,.btn:active{transform:none}}