:root{color-scheme:dark;--bg:#0B0E11;--panel:#171D23;--line:#2A333B;--line2:#3A4650;--txt:#E6EAEE;--mut:#8C98A4;--teal:#3DD6C8;--mag:#C98BD6;
  --steel:linear-gradient(180deg,#F4F7FB 0%,#C9D3E2 45%,#7F8EA6 52%,#E6ECF5 100%)}
*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%}
body{background:var(--bg);color:var(--txt);font:16px/1.5 'Inter',-apple-system,BlinkMacSystemFont,sans-serif;display:flex;align-items:center;justify-content:center;padding:28px 16px;
  background-image:radial-gradient(90% 60% at 50% 0%,#1E262E 0%,var(--bg) 60%),repeating-linear-gradient(45deg,rgba(255,255,255,.025) 0 2px,transparent 2px 4px),repeating-linear-gradient(-45deg,rgba(255,255,255,.02) 0 2px,transparent 2px 4px);background-attachment:fixed}
.hex{position:fixed;inset:0;pointer-events:none;background-size:112px 194px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='112' height='194' viewBox='0 0 112 194'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-opacity='.14' stroke-width='1.6'%3E%3Cpath d='M56 2 110 33v62L56 128 2 95V33z'/%3E%3Cpath d='M56 128v64'/%3E%3Cpath d='M-54 97 0 128v64M166 97l-54 31v64'/%3E%3C/g%3E%3C/svg%3E");
  -webkit-mask-image:radial-gradient(80% 70% at 50% 40%,#000 30%,transparent 100%);mask-image:radial-gradient(80% 70% at 50% 40%,#000 30%,transparent 100%)}
.card{position:relative;width:100%;max-width:440px;background:linear-gradient(180deg,rgba(28,35,41,.9),rgba(20,26,31,.92));border:1px solid var(--line);border-radius:22px;padding:30px 28px 26px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 30px 80px rgba(0,0,0,.6);backdrop-filter:blur(8px)}
.logo{display:flex;flex-direction:column;align-items:center;margin-bottom:18px}
.logo svg{width:min(78%,300px);height:auto;filter:drop-shadow(0 0 22px rgba(201,139,214,.22))}
.brand{font-family:'Unbounded',sans-serif;font-weight:900;font-size:22px;letter-spacing:.34em;padding-left:.34em;margin-top:2px;background:var(--steel);-webkit-background-clip:text;background-clip:text;color:transparent}
h1{font-family:'Unbounded',sans-serif;font-weight:700;font-size:20px;color:#fff;text-align:center;margin:6px 0 14px}
h2{font-family:'Unbounded',sans-serif;font-weight:700;font-size:14px;color:#fff;margin:22px 0 10px}
p{color:var(--mut);font-size:14px}
label{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mut);margin:14px 0 6px}
input{display:block;width:100%;margin-top:6px;padding:13px 14px;font:16px 'Inter',sans-serif;color:var(--txt);background:#0F1418;border:1px solid var(--line2);border-radius:12px;outline:none;letter-spacing:0;text-transform:none}
input:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(61,214,200,.18)}
button{display:block;width:100%;margin-top:18px;padding:14px;border:0;border-radius:999px;cursor:pointer;font:700 14px/1 'Unbounded',sans-serif;letter-spacing:.08em;color:#0B0E11;
  background:linear-gradient(180deg,#F4F7FB,#C9D3E2 48%,#9AA8BB 52%,#E6ECF5);box-shadow:0 10px 30px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.35) inset,0 0 40px rgba(61,214,200,.15);transition:transform .15s,box-shadow .15s}
button:hover{transform:translateY(-1px);box-shadow:0 14px 36px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.5) inset,0 0 50px rgba(201,139,214,.3)}
button.ghost{width:auto;margin:0;padding:6px 12px;font:600 12px 'Inter',sans-serif;letter-spacing:0;color:#FF9D9D;background:transparent;border:1px solid #5C2E2E;box-shadow:none}
button.ghost:hover{background:#2A1515;transform:none}
.msg{padding:10px 12px;border-radius:10px;font-size:13px;margin:8px 0 2px}
.msg.bad{background:#2A1515;color:#FF9D9D;border:1px solid #5C2E2E}
.msg.ok{background:#0E2A27;color:#7FE8DC;border:1px solid #1E5C55}
.small{font-size:12px;text-align:center;margin-top:16px}
.small a,p a{color:var(--teal);text-decoration:none}.small a:hover{text-decoration:underline}
.checks{list-style:none;margin:12px 0 4px;font-size:13px}
.checks li{padding:6px 0 6px 26px;position:relative;color:#C9D3E2;border-bottom:1px solid var(--line)}
.checks li::before{content:"✓";position:absolute;left:4px;color:var(--teal);font-weight:700}
.checks li.bad{color:#FF9D9D}.checks li.bad::before{content:"✕";color:#FF9D9D}
.users{list-style:none;margin:6px 0}
.users li{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line);font-size:14px;color:#fff}
.users .tag{font-size:10px;letter-spacing:.14em;color:var(--mag);border:1px solid #4C3658;padding:2px 7px;border-radius:999px;margin-left:8px;vertical-align:middle}
.inline{display:inline}