*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,"Segoe UI",Arial,sans-serif;color:#0b172a;background:#f5f8fc}a{text-decoration:none;color:inherit}button,input,select,textarea{font:inherit}.top{height:58px;background:#06214a;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 22px;position:sticky;top:0;z-index:50;border-bottom:1px solid #153a6d}.brand{font-weight:800;font-size:16px;display:flex;gap:8px;align-items:center}.user{display:flex;align-items:center;gap:12px;font-size:13px}.user button{border:0;background:transparent;color:#fff;cursor:pointer}.shell{display:grid;grid-template-columns:205px 1fr;min-height:calc(100vh - 58px)}aside{background:#071d3d;padding:12px 9px;color:#cfe1ff}aside .nav-title{font-size:10px;color:#6f8db6;padding:10px 11px 5px;text-transform:uppercase;letter-spacing:.12em}aside a{display:flex;gap:9px;align-items:center;color:#dce9fa;padding:10px 11px;border-radius:6px;margin:2px 0;font-size:12px}aside a:hover,aside a.active{background:#1677ff;color:#fff;box-shadow:0 4px 12px #0069ff45}main{padding:20px;min-width:0}.guest-shell{min-height:calc(100vh - 58px);padding:0}.page-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.page-head h1{font-size:23px;margin:2px 0}.page-head small{color:#6c7b91}.hero{background:linear-gradient(100deg,#062b59,#074c83);color:#fff;border-radius:8px;padding:22px 24px;position:relative;overflow:hidden}.hero:after{content:'</>';position:absolute;right:35px;top:2px;font-size:100px;color:#ffffff0d;font-weight:900}.hero h1{font-size:24px;margin:5px 0}.hero p{margin:4px 0;color:#cde4ff}.verified,.badge{display:inline-block;background:#e6f8ee;color:#15935b;border-radius:4px;padding:5px 9px;font-size:11px;font-weight:700}.live{margin:14px 0;background:#fff;border:1px solid #dce5ef;border-radius:7px;padding:17px;display:flex;justify-content:space-between;align-items:center}.live h2{font-size:18px;margin:8px 0}.join,.primary,.btn{display:inline-block;background:#1677ff;color:#fff;border:0;border-radius:5px;padding:10px 18px;font-weight:700;cursor:pointer}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:14px 0}.tile{background:#fff;border:1px solid #dce5ef;border-radius:7px;padding:16px;display:flex;gap:12px;align-items:center;min-height:82px}.tile-icon{width:38px;height:38px;border-radius:7px;display:grid;place-items:center;background:#eef5ff;font-size:20px}.tile b{display:block;font-size:14px}.tile span{font-size:11px;color:#75839a}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.cards article,.notice,.stats>div{background:#fff;border:1px solid #dce5ef;border-radius:7px;padding:15px}.cards article p,.notice p{color:#68768a;font-size:12px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:14px 0}.stats>div{display:flex;align-items:center;gap:12px}.stats b{font-size:22px}.stats span{font-size:12px;color:#64748b}.stat-icon{width:38px;height:38px;border-radius:7px;background:#eaf3ff;display:grid;place-items:center}.table{overflow:auto;background:#fff;border:1px solid #dce5ef;border-radius:7px}table{border-collapse:collapse;width:100%;font-size:12px}th{background:#f5f8fc;color:#43536a}th,td{padding:11px;border-bottom:1px solid #e7edf4;text-align:left}.form{max-width:760px;background:#fff;padding:22px;border:1px solid #dce5ef;border-radius:8px}.form label{display:block;margin:12px 0 5px;font-weight:650;font-size:12px}input,select,textarea{width:100%;padding:10px 11px;border:1px solid #cfd9e6;border-radius:5px;background:#fff}textarea{min-height:120px}.check{display:flex!important;gap:8px;align-items:center}.check input{width:auto}.alert,.error{padding:10px 12px;border-radius:5px;margin:10px 0;font-size:12px}.alert{background:#e9fbf1;color:#147347}.error{background:#fff0f0;color:#a41313}.search{display:flex;gap:8px}.login-page{min-height:calc(100vh - 58px);display:grid;place-items:center;padding:35px;background:#f7f9fc}.login-wrap{width:min(900px,94vw);min-height:510px;background:#fff;display:grid;grid-template-columns:1fr 1fr;border:1px solid #dbe3ed;border-radius:8px;overflow:hidden;box-shadow:0 16px 45px #0a254014}.login-form{padding:48px 48px 38px}.login-form h1{font-size:28px;margin:0 0 5px}.login-form>p{font-size:13px;color:#59687b;margin:0 0 25px}.login-form label{display:block;font-size:12px;font-weight:700;margin:13px 0 6px}.login-form .primary{width:100%;margin-top:16px}.login-meta{display:flex;justify-content:space-between;align-items:center;margin-top:12px;font-size:11px}.login-meta label{margin:0;display:flex;align-items:center;gap:6px;font-weight:500}.login-meta input{width:auto}.login-note{background:#fff8e7;border:1px solid #f5e1ae;color:#745a15;padding:10px;border-radius:5px;font-size:11px;margin-top:18px}.login-art{background:radial-gradient(circle at 70% 20%,#0b5aa0 0,#06345f 32%,#031c38 75%);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;position:relative;overflow:hidden}.login-art:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 49%,#29a7ff12 50%,transparent 51%),linear-gradient(0deg,transparent 49%,#29a7ff10 50%,transparent 51%);background-size:45px 45px;transform:perspective(500px) rotateX(55deg) scale(1.6);opacity:.7}.cyber-shield{width:94px;height:108px;clip-path:polygon(50% 0,92% 17%,84% 70%,50% 100%,16% 70%,8% 17%);background:linear-gradient(#2d91ff,#004ea8);padding:4px;position:relative;z-index:1;margin-bottom:18px}.cyber-shield:after{content:'⌾';display:grid;place-items:center;width:100%;height:100%;clip-path:inherit;background:#061c39;font-size:48px;color:#65baff}.login-art h2{z-index:1;font-size:25px;margin:0}.login-art p{z-index:1;letter-spacing:.16em;line-height:1.5}.landing{min-height:calc(100vh - 58px);background:linear-gradient(100deg,#020d1b 0,#041a32 55%,#052d50 100%);color:#fff;position:relative;overflow:hidden;padding:80px 7%}.landing:after{content:'SECURITY\A AWARENESS\A BUILDS\A SAFER\A TOMORROW';white-space:pre;position:absolute;right:8%;top:22%;font-size:30px;line-height:1.35;font-weight:800;color:#178cff;text-shadow:0 0 24px #007bff80}.landing h1{font-size:48px;line-height:1.08;max-width:600px;margin:0 0 16px}.landing h1 span{color:#2b98ff}.landing .lead{max-width:610px;color:#c8d9eb;line-height:1.7}.landing .tag{color:#28a2ff;font-weight:700;margin:18px 0}.landing .btn{margin-top:16px}.landing-stats{position:absolute;left:0;right:0;bottom:0;background:#041326cc;display:grid;grid-template-columns:repeat(4,1fr);padding:18px 7%;border-top:1px solid #123b64}.landing-stats div{text-align:center;color:#bcd0e5}.landing-stats b{display:block;color:#fff;font-size:18px}.section-title{font-size:17px;margin:20px 0 10px}.empty{padding:30px;text-align:center;color:#718096;background:#fff;border:1px dashed #cad5e2;border-radius:7px}.mobile-menu{display:none}.pagination{margin-top:15px}.profile-card{display:grid;grid-template-columns:210px 1fr;gap:14px}.profile-side,.profile-info{background:#fff;border:1px solid #dce5ef;border-radius:7px;padding:20px}.avatar{width:82px;height:82px;border-radius:50%;background:linear-gradient(#bcd7ff,#6ca6ef);display:grid;place-items:center;font-size:38px;margin:auto}.profile-side{text-align:center}.profile-info dl{display:grid;grid-template-columns:160px 1fr;margin:0}.profile-info dt,.profile-info dd{padding:10px;border-bottom:1px solid #edf1f5;margin:0;font-size:12px}.profile-info dt{font-weight:700;color:#526177}
@media(max-width:800px){.shell{grid-template-columns:1fr}.top{height:54px}.mobile-menu{display:block}aside{display:flex;overflow:auto;padding:7px;position:sticky;top:54px;z-index:40}aside .nav-title{display:none}aside a{white-space:nowrap;font-size:11px}.grid,.cards,.stats{grid-template-columns:1fr 1fr}main{padding:13px}.login-page{padding:18px}.login-wrap{grid-template-columns:1fr}.login-art{display:none}.login-form{padding:30px 24px}.landing{padding:55px 24px 130px}.landing h1{font-size:38px}.landing:after{display:none}.landing-stats{grid-template-columns:1fr 1fr;gap:12px}.profile-card{grid-template-columns:1fr}.profile-info dl{grid-template-columns:120px 1fr}}@media(max-width:480px){.grid,.cards,.stats{grid-template-columns:1fr}.brand{font-size:14px}.user span{display:none}.hero{padding:17px}.login-form h1{font-size:24px}.page-head{align-items:flex-start;gap:8px;flex-direction:column}.landing h1{font-size:34px}}
/* === Reference-match patch 2026-09-23 === */
.guest-top{height:64px;padding:0 max(36px,calc((100vw - 1440px)/2));background:#03182d;border-bottom:1px solid #123a61;position:relative}
.guest-top .brand{font-size:15px;min-width:220px}.brand-shield{width:22px;height:24px;display:inline-grid;place-items:center;border:2px solid #3a94ff;border-radius:8px 8px 10px 10px;color:#65b5ff;font-size:14px}.guest-nav{position:absolute;left:50%;transform:translateX(-50%);display:flex;gap:34px;font-size:12px;color:#dce9f7}.guest-nav a:hover{color:#35a2ff}.top-login{padding:9px 26px;border-radius:7px;font-size:12px;box-shadow:0 6px 18px #0879ff2e}
.landing{height:calc(100vh - 64px);min-height:610px;padding:0 max(36px,calc((100vw - 1440px)/2));display:grid;grid-template-columns:minmax(480px,650px) 1fr;align-items:center;background:linear-gradient(90deg,#010b16 0%,#021323 46%,#042b4b 100%);isolation:isolate}
.landing:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 71% 42%,#0c5e9d38 0,transparent 34%),linear-gradient(90deg,transparent 0 55%,#061a2b33);z-index:-2}.landing:after{display:none!important}
.landing-copy{align-self:start;margin-top:14vh;position:relative;z-index:3}.landing h1{font-size:clamp(42px,3.25vw,58px);line-height:1.05;letter-spacing:-1.7px;max-width:650px;margin:0 0 22px;font-weight:800}.landing h1 span{color:#2898ff}.landing .tag{font-size:15px;color:#2aa2ff;font-weight:700;margin:0 0 22px}.landing .lead{font-size:15px;max-width:640px;line-height:1.75;color:#d0dceb;margin:0}.landing-login{margin-top:28px;padding:14px 27px;border-radius:7px;font-size:14px}.landing-login span{padding-left:12px}
.landing-art{position:absolute;right:max(0px,calc((100vw - 1536px)/2));top:64px;width:min(54vw,830px);height:calc(100% - 64px);background-image:linear-gradient(90deg,#031425 0%,transparent 28%,transparent 82%,#052d50 100%),url('../images/landing-cyber-hero.jpg');background-repeat:no-repeat;background-position:center right;background-size:cover;opacity:.98;z-index:-1;mask-image:linear-gradient(90deg,transparent 0,#000 20%,#000 100%)}
.landing-stats{height:92px;padding:0 max(36px,calc((100vw - 1440px)/2));display:grid;grid-template-columns:repeat(4,1fr);align-items:center;background:#031426e8;border-top:1px solid #12385d}.landing-stats div{display:flex;align-items:center;justify-content:center;gap:13px;text-align:left;color:#bcd0e5}.landing-stats p{margin:0}.landing-stats b{font-size:17px;line-height:1.1}.landing-stats small{display:block;font-size:11px;margin-top:2px}.stat-glyph{width:36px;height:36px;display:grid;place-items:center;border-radius:7px;background:#06294d;color:#258eff;font-size:19px}
@media(max-width:900px){.guest-nav{display:none}.guest-top{padding:0 18px}.landing{height:auto;min-height:calc(100vh - 64px);grid-template-columns:1fr;padding:58px 24px 150px}.landing-copy{margin-top:0}.landing-art{right:0;top:64px;width:100%;height:calc(100% - 64px);opacity:.22;mask-image:none}.landing h1{font-size:42px}.landing-stats{height:auto;min-height:120px;padding:18px 20px;grid-template-columns:1fr 1fr;gap:15px}.landing-stats div{justify-content:flex-start}}