@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap";
:root{--red:#e50914;--red2:#ff3340;--ink:#070709;--panel:#111114;--line:#28282e;--muted:#9b9ba6;--white:#f7f7f8}*{box-sizing:border-box}html{background:var(--ink);color:var(--white)}body{background:radial-gradient(circle at 82% 4%,#e5091421,transparent 30%),var(--ink);min-height:100vh;margin:0;font-family:DM Sans,sans-serif}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}.dashboardShell{min-height:100vh}.topbar{border-bottom:1px solid #ffffff17;justify-content:space-between;align-items:center;max-width:1260px;height:82px;margin:auto;padding:0 28px;display:flex}.brand{color:#fff;letter-spacing:2px;align-items:center;gap:12px;font-family:Manrope;font-size:15px;font-weight:800;text-decoration:none;display:flex}.brandMark{color:var(--red);text-shadow:3px 0 #e509144d;font-size:32px;font-style:italic;font-weight:800;line-height:1}.topActions{align-items:center;gap:16px;display:flex}.statusPill{border:1px solid var(--line);color:#b7b7c1;border-radius:999px;padding:9px 14px;font-size:12px}.statusPill span{background:#43d17d;border-radius:50%;width:7px;height:7px;margin-right:7px;display:inline-block;box-shadow:0 0 10px #43d17d}.avatar{color:#fff;background:linear-gradient(145deg,var(--red),#7c0710);border:0;border-radius:8px;place-items:center;width:38px;height:38px;font-size:12px;font-weight:700;display:grid}.hero{justify-content:space-between;align-items:flex-end;gap:40px;max-width:1260px;margin:auto;padding:78px 28px 70px;display:flex}.eyebrow{color:var(--red2);letter-spacing:3px;margin-bottom:20px;font-size:11px;font-weight:700}.hero h1{letter-spacing:-4px;max-width:790px;margin:0;font-family:Manrope;font-size:clamp(44px,6vw,78px);line-height:.98}.hero h1 em{color:#87878f;font-style:normal;font-weight:500}.hero>div>p{color:var(--muted);max-width:590px;margin:28px 0 0;font-size:16px;line-height:1.7}.heroStat{border-left:1px solid var(--line);flex-direction:column;min-width:170px;padding-left:28px;display:flex}.heroStat span,.heroStat small{color:#777780;letter-spacing:2px;font-size:10px}.heroStat strong{margin:10px 0;font:800 64px/1 Manrope}.inboxSection{max-width:1260px;margin:auto;padding:0 28px 70px}.sectionHeader{border-bottom:1px solid var(--line);justify-content:space-between;align-items:end;gap:24px;margin-bottom:26px;padding-bottom:22px;display:flex}.sectionHeader h2{margin:0 0 6px;font:700 24px Manrope}.sectionHeader p{color:#777780;margin:0;font-size:13px}.filters{background:#0d0d10;border:1px solid #202025;border-radius:8px;gap:5px;padding:4px;display:flex}.filters button{color:#777780;cursor:pointer;background:0 0;border:0;border-radius:5px;padding:8px 13px;font-size:12px}.filters button.active{color:#fff;background:#2a2a30}.messageGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:grid}.messageCard{cursor:pointer;background:linear-gradient(135deg,#141417,#101012);border:1px solid #26262b;min-height:285px;padding:24px;transition:all .25s;position:relative;overflow:hidden}.messageCard:hover{background:#17171b;border-color:#53535e;transform:translateY(-3px)}.messageIndex{color:#ffffff06;font:800 92px Manrope;position:absolute;bottom:-20px;right:18px}.cardTop,.cardFooter{z-index:1;justify-content:space-between;align-items:center;display:flex;position:relative}.cardTop time{color:#66666f;font-size:11px}.category{letter-spacing:1.2px;text-transform:uppercase;border:1px solid #444;border-radius:3px;padding:5px 8px;font-size:9px;font-weight:700}.categorySecurity{color:#ff6973;background:#251114;border-color:#652c32}.categoryAccount{color:#d7b6ff;background:#1e1429;border-color:#48315f}.categoryBilling{color:#ffc268;background:#261d10;border-color:#654b23}.categoryUpdate{color:#71d7ff;background:#102029;border-color:#285066}.messageCard h3{z-index:1;max-width:80%;margin:26px 0 11px;font:700 21px/1.3 Manrope;position:relative}.messageCard>p{color:#85858f;z-index:1;max-width:88%;min-height:42px;margin:0 0 24px;font-size:13px;line-height:1.55;position:relative}.codeButton{z-index:2;color:#fff;cursor:pointer;background:#0a0a0c;border:1px dashed #4f4f58;justify-content:space-between;align-items:center;width:100%;margin-bottom:19px;padding:13px 15px;display:flex;position:relative}.codeButton span{letter-spacing:5px;font:700 20px Manrope}.codeButton b{color:var(--red2);font-size:11px}.cardFooter{color:#696972;border-top:1px solid #25252a;padding-top:15px;font-size:11px}.cardFooter b{color:#b5b5be}.notice,.emptyState{border:1px solid var(--line);color:var(--muted);background:#111114;padding:28px}.notice.error{color:#ff8c94;border-color:#5a2428;margin-bottom:20px}.emptyState{text-align:center;padding:70px 24px}.emptyIcon{color:var(--red);font-size:34px}.emptyState h3{color:#fff;margin:12px 0;font:700 24px Manrope}.emptyState p{max-width:530px;margin:auto;line-height:1.6}footer{border-top:1px solid var(--line);color:#5e5e66;letter-spacing:1px;justify-content:space-between;max-width:1204px;margin:auto;padding:28px 0 45px;font-size:11px;display:flex}footer p{margin:0}.modalBackdrop{z-index:20;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#000000d1;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.messageModal{background:#151518;border:1px solid #3a3a42;width:min(700px,100%);max-height:88vh;padding:38px;position:relative;overflow:auto;box-shadow:0 30px 100px #0009}.closeButton{color:#999;cursor:pointer;background:0 0;border:0;font-size:28px;position:absolute;top:14px;right:18px}.messageModal h2{margin:22px 0 9px;font:700 30px/1.2 Manrope}.modalMeta{color:#777;border-bottom:1px solid var(--line);padding-bottom:25px;font-size:12px}.largeCode{color:#fff;cursor:pointer;background:#09090b;border:1px dashed #555;justify-content:space-between;align-items:center;width:100%;margin:24px 0 5px;padding:18px;display:flex}.largeCode small{color:#777;letter-spacing:1px}.largeCode strong{letter-spacing:5px;color:#ff5360;font:800 28px Manrope}.messageBody{color:#c2c2ca;white-space:pre-wrap;padding-top:25px;font-size:14px;line-height:1.75}.loginShell{background:linear-gradient(115deg,#08080a 0% 55%,#16080a 100%);place-items:center;min-height:100vh;padding:100px 20px 40px;display:grid;position:relative;overflow:hidden}.loginBrand{z-index:2;position:absolute;top:28px;left:42px}.ambient{filter:blur(90px);opacity:.16;border-radius:50%;position:absolute}.ambientOne{background:var(--red);width:520px;height:520px;top:-140px;right:-160px}.ambientTwo{background:#7a0010;width:400px;height:400px;bottom:-200px;left:-200px}.loginCard{z-index:1;background:#121215e6;border:1px solid #2d2d33;width:min(440px,100%);padding:44px;position:relative;box-shadow:0 40px 100px #000}.loginCard h1{letter-spacing:-1.5px;margin:0 0 12px;font:800 34px/1.15 Manrope}.loginCard>p{color:#888892;margin:0 0 28px;font-size:14px;line-height:1.6}.loginCard form{flex-direction:column;gap:18px;display:flex}.loginCard label{color:#babac2;flex-direction:column;gap:8px;font-size:12px;font-weight:600;display:flex}.loginCard input{color:#fff;background:#09090b;border:1px solid #36363d;outline:0;width:100%;padding:14px}.loginCard input:focus{border-color:#777781}.primaryButton{color:#fff;background:var(--red);cursor:pointer;border:0;margin-top:4px;padding:15px;font-weight:700}.primaryButton:hover{background:#f01621}.primaryButton:disabled{opacity:.55}.formError{color:#ff7d86;font-size:12px}.secureNote{color:#62626b;text-align:center;margin-top:25px;font-size:10px}.secureNote span{color:#4dda84;margin-right:6px}@media (max-width:800px){.hero{padding-top:52px;display:block}.heroStat{border-left:0;border-top:1px solid var(--line);margin-top:40px;padding:22px 0 0}.sectionHeader{flex-direction:column;align-items:start}.filters{width:100%;overflow:auto}.messageGrid{grid-template-columns:1fr}footer{margin:0 28px}}@media (max-width:500px){.topbar{padding:0 18px}.brand{font-size:12px}.statusPill{display:none}.hero,.inboxSection{padding-left:18px;padding-right:18px}.hero h1{letter-spacing:-2.7px;font-size:43px}.messageCard h3{max-width:100%}.messageModal{padding:28px 22px}.largeCode{flex-direction:column;align-items:flex-start;gap:10px}.loginCard{padding:30px 24px}.loginBrand{left:22px}}
