:root{
  --bg:#081317;--card:#13242b;--card2:#18313a;--text:#ecfeff;--muted:#9fb7bd;
  --line:#28464f;--green:#22c55e;--green2:#16a34a;--cyan:#22d3ee;--yellow:#facc15;
  --red:#fb7185;--blue:#60a5fa
}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(circle at 15% -10%,#115144 0,#081317 35%,#061014 100%);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
a{color:#bbf7d0}
.wrap{max-width:1220px;margin:auto;padding:24px}
.hero{position:relative;overflow:hidden;background:linear-gradient(135deg,rgba(17,81,68,.55),rgba(10,23,28,.96));border:1px solid rgba(64,128,114,.45);border-radius:28px;padding:22px 24px;box-shadow:0 20px 60px rgba(0,0,0,.28);margin-bottom:16px}
.hero:before{content:"";position:absolute;inset:auto -80px -80px auto;width:220px;height:220px;background:radial-gradient(circle,rgba(34,197,94,.22),transparent 70%)}
.heroTop{display:flex;gap:18px;align-items:flex-start;justify-content:space-between;position:relative;z-index:1}
.brandWrap{display:flex;gap:16px;align-items:flex-start}
.logoMark{width:84px;height:84px;border-radius:22px;background:rgba(255,255,255,.03);border:1px solid rgba(120,255,197,.18);display:flex;align-items:center;justify-content:center;padding:6px;box-shadow:0 14px 32px rgba(0,0,0,.24)}
.logoMark img{width:100%;height:100%;object-fit:contain;border-radius:18px}
.brand .eyebrow{display:inline-flex;border:1px solid rgba(34,211,238,.25);background:rgba(34,211,238,.08);color:#bff7ff;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:800;margin-bottom:10px}
.brand .siteName{font-size:15px;letter-spacing:.12em;text-transform:uppercase;color:#b8d7dd;font-weight:800}
.brand h1{font-size:40px;margin:2px 0 0;letter-spacing:-.05em;line-height:1.02}
.brand .sub{margin:10px 0 0;color:var(--muted);max-width:760px;line-height:1.5}
.softwareBadge{margin-top:12px;display:inline-flex;padding:10px 12px;border-radius:14px;background:rgba(250,204,21,.09);border:1px solid rgba(250,204,21,.25);color:#fef3c7;font-size:13px;font-weight:700}
.heroRight{display:flex;flex-direction:column;gap:10px;min-width:250px;align-items:flex-end}
.siteLink,.logoutLink{display:inline-flex;align-items:center;gap:8px;padding:10px 12px;border-radius:14px;text-decoration:none;background:#071116;border:1px solid rgba(34,197,94,.28);color:#d7ffe6;font-weight:800}
.userBadge{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(34,211,238,.24);background:rgba(34,211,238,.08);color:#bff7ff;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:800}
.tag{display:inline-flex;align-items:center;border:1px solid rgba(34,197,94,.35);background:rgba(34,197,94,.12);color:#bbf7d0;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:800;margin:8px 6px 0 0}
.grid{display:grid;grid-template-columns:380px 1fr;gap:16px}
.card{background:linear-gradient(180deg,rgba(19,36,43,.96),rgba(13,27,32,.96));border:1px solid var(--line);border-radius:22px;padding:18px;box-shadow:0 18px 50px rgba(0,0,0,.26)}
h2{margin:0 0 12px;font-size:22px;letter-spacing:-.02em}
h3{margin:0 0 8px;font-size:18px}
label{display:block;margin:13px 0 6px;color:#c7dbe0;font-size:13px;font-weight:800}
input,select,textarea{width:100%;background:#071116;color:var(--text);border:1px solid #31525c;border-radius:13px;padding:11px 12px;font-size:14px;outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(34,197,94,.12)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
.btn{border:0;background:var(--green);color:#04110b;padding:12px 14px;border-radius:14px;font-weight:900;cursor:pointer;width:auto}
.btn.full{width:100%}
.btn.alt{background:#0b151a;color:var(--text);border:1px solid var(--line)}
.btn.cyan{background:var(--cyan);color:#04242b}
.btn:hover{filter:brightness(1.05)}
.muted{color:var(--muted)}
.hint{font-size:12px;color:#9db4bb;line-height:1.4}
.hr{height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent);margin:14px 0}
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.tab{padding:10px 12px;border-radius:12px;background:#081317;border:1px solid var(--line);cursor:pointer;font-weight:800;color:#c9e4e7}
.tab.active{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.45);color:#d7ffe6}
.panel{display:none}.panel.active{display:block}
.pill{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:800}
.pill.green{background:rgba(34,197,94,.14);color:#d7ffe6;border:1px solid rgba(34,197,94,.35)}
.pill.yellow{background:rgba(250,204,21,.12);color:#fef08a;border:1px solid rgba(250,204,21,.3)}
.note{padding:12px;border-radius:14px;background:rgba(96,165,250,.1);border:1px solid rgba(96,165,250,.25);color:#dbeafe;font-size:13px;line-height:1.45}
.warn{padding:12px;border-radius:14px;background:rgba(251,113,133,.08);border:1px solid rgba(251,113,133,.22);color:#ffe4e6;font-size:13px;line-height:1.45}
.success{padding:12px;border-radius:14px;background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.22);color:#dcfce7;font-size:13px;line-height:1.45}
.resultGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.resultCard{background:linear-gradient(180deg,rgba(24,49,58,.95),rgba(15,29,35,.95));border:1px solid #2e4f59;border-radius:18px;padding:15px}
.resultCard h3{display:flex;align-items:center;justify-content:space-between}
.big{font-size:26px;font-weight:900;letter-spacing:-.04em}
.small{font-size:12px;color:var(--muted)}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:10px 8px;border-bottom:1px solid #21414a;text-align:left;font-size:14px}
.table th{color:#bfe2e9;font-size:12px;text-transform:uppercase;letter-spacing:.04em}
.copybox{white-space:pre-wrap;background:#071116;border:1px dashed #36606b;border-radius:14px;padding:12px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px;line-height:1.45}
.microToggle{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.choice{border:1px solid var(--line);border-radius:14px;padding:12px;cursor:pointer;background:#081317}
.choice.active{border-color:rgba(34,197,94,.5);background:rgba(34,197,94,.1)}
.choice b{display:block;margin-bottom:4px}
.authShell{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:22px}
.authCard{width:100%;max-width:530px;background:linear-gradient(180deg,rgba(19,36,43,.98),rgba(13,27,32,.98));border:1px solid var(--line);border-radius:26px;padding:24px;box-shadow:0 20px 70px rgba(0,0,0,.35)}
.authLogo{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.authLogo img{width:72px;height:72px;object-fit:contain;border-radius:18px}
.authLogo h1{font-size:30px;margin:0;letter-spacing:-.04em;line-height:1.05}
.authLogo p{margin:5px 0 0;color:var(--muted);font-size:13px}
.message{padding:12px;border-radius:14px;margin:12px 0;font-size:14px;line-height:1.45}
.message.error{background:rgba(251,113,133,.09);border:1px solid rgba(251,113,133,.28);color:#ffe4e6}
.message.ok{background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.28);color:#dcfce7}
.message.info{background:rgba(96,165,250,.1);border:1px solid rgba(96,165,250,.26);color:#dbeafe}
.hidden{display:none!important}
.footer{margin-top:18px;color:#90a9b0;font-size:12px;text-align:center}
@media(max-width:980px){.grid{grid-template-columns:1fr}.resultGrid{grid-template-columns:1fr}.heroTop{flex-direction:column}.brandWrap{align-items:flex-start}.heroRight{align-items:flex-start;min-width:0}.brand h1{font-size:32px}}
@media(max-width:640px){.wrap{padding:14px}.hero{padding:18px}.brandWrap{gap:12px}.logoMark{width:68px;height:68px;border-radius:18px}.brand h1{font-size:28px}.row,.row3,.microToggle{grid-template-columns:1fr}.authLogo{align-items:flex-start}}