*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,Segoe UI,Arial,sans-serif;color:#10203a}body{background:#f7fbfa}.login-shell{min-height:100vh;display:grid;grid-template-columns:minmax(520px,1.55fr) minmax(440px,1fr)}.hero{position:relative;overflow:hidden;background:radial-gradient(circle at 72% 18%,#134b6b 0,#0b314b 28%,#081f34 63%,#071a2b 100%);color:#fff;padding:58px 56px}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 40%,#0bb17418);pointer-events:none}.hero-brand{display:flex;align-items:center;gap:16px;position:relative;z-index:2}.hero-brand .wave{font-size:76px;line-height:.6;color:#21c17d;font-weight:900;transform:rotate(-7deg)}.hero-brand strong{display:block;font-size:34px;letter-spacing:2px}.hero-brand b{display:block;color:#18c47a;font-size:20px;letter-spacing:2px}.hero-copy{position:relative;z-index:2;margin-top:55px;max-width:430px}.hero-copy>i{display:block;width:52px;height:3px;background:#15c888;margin-bottom:22px}.hero-copy h1{font-size:29px;line-height:1.25;font-weight:500;margin:0 0 36px}.feature{display:flex;gap:18px;margin:22px 0}.feature>span{width:52px;height:52px;border:1px solid #15c88888;border-radius:50%;display:grid;place-items:center;color:#22d292;background:#0d513b55;font-size:22px}.feature b,.feature small{display:block}.feature b{font-size:16px}.feature small{opacity:.72;margin-top:5px;line-height:1.4}.tv{position:absolute;right:-35px;top:180px;width:55%;aspect-ratio:16/10;background:linear-gradient(#7ab4d4 0 57%,#537969 57%);border:11px solid #111d29;border-radius:12px;box-shadow:0 25px 70px #0008;transform:perspective(900px) rotateY(-5deg);overflow:hidden;color:#10203a}.tv:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,#ffffff22,transparent 35%)}.tv-top{position:absolute;top:8%;left:5%;right:5%;display:flex;align-items:center;gap:8px}.tv-top b{background:#fff;padding:8px 11px;border-radius:5px}.tv-top em{font-style:normal;background:#07965c;color:#fff;padding:8px}.tv-top span{margin-left:auto;background:#102b46e8;color:#fff;padding:9px;border-radius:6px}.score{position:absolute;right:5%;top:28%;width:37%;background:#fff;border-radius:7px;overflow:hidden;box-shadow:0 8px 25px #0003}.score strong{display:block;background:#07965c;color:#fff;padding:8px}.score p{margin:0;padding:7px 10px;border-bottom:1px solid #e2e8f0;font-size:12px}.lower{position:absolute;left:5%;bottom:12%;width:56%;background:#fff;padding:10px 12px;border-left:7px solid #07965c}.lower small{display:block;color:#07965c;font-weight:800}.lower b,.lower span{display:block}.lower span{font-size:11px;margin-top:3px}.ticker{position:absolute;left:0;right:0;bottom:0;background:#0b2e28;color:#fff;padding:9px 14px;font-size:11px}.hero-foot{position:absolute;left:56px;bottom:42px;opacity:.75;font-style:italic;font-size:20px}.login-side{position:relative;display:flex;align-items:center;justify-content:center;padding:50px;background:linear-gradient(#fff,#f8fcfb);overflow:hidden}.system{position:absolute;right:42px;top:34px;background:#fff;border:1px solid #e1ebe7;border-radius:12px;padding:12px 18px 12px 42px;box-shadow:0 3px 18px #0f172a0c}.system>span{position:absolute;width:12px;height:12px;border-radius:50%;background:#27c66f;left:18px;top:20px;box-shadow:0 0 0 4px #dff7e9}.system b,.system small{display:block}.system small{color:#64748b;margin-top:2px}.login-card{position:relative;z-index:2;width:min(100%,470px);background:#fff;border:1px solid #dce8e4;border-radius:18px;padding:40px;box-shadow:0 18px 60px #0f172a12}.mini-brand{display:flex;align-items:center;gap:10px;margin-bottom:24px}.mini-brand span{font-size:42px;color:#07854f;font-weight:900;transform:rotate(-7deg)}.mini-brand b{font-size:20px}.login-card h2{font-size:28px;margin:0 0 6px}.login-card>p{color:#718096;margin:0 0 25px}.login-card label{display:block;font-size:13px;font-weight:700;margin:18px 0}.login-card input{width:100%;height:48px;border:1px solid #cfdcd8;border-radius:9px;padding:0 14px;font-size:15px;outline:none}.login-card input:focus{border-color:#07965c;box-shadow:0 0 0 3px #07965c18}.pw{position:relative}.pw button{position:absolute;right:8px;top:8px;width:34px;height:32px;border:0;background:transparent;color:#527080;cursor:pointer}.pw input{padding-right:46px}.login-btn{width:100%;height:50px;border:0;border-radius:9px;background:linear-gradient(135deg,#069653,#08b875);color:#fff;font-size:16px;font-weight:800;cursor:pointer;margin-top:8px}.secure{border-top:1px solid #e5eeeb;margin-top:28px;padding-top:22px;display:flex;gap:13px;color:#456}.secure>b{}.secure span b,.secure span small{display:block}.secure span small{color:#82918c;margin-top:3px}.curves{position:absolute;left:-10%;right:-10%;bottom:-70px;height:210px;border-radius:50%;background:#dff7ef;opacity:.7;transform:rotate(5deg)}@media(max-width:1050px){.login-shell{grid-template-columns:1fr}.hero{display:none}.login-side{min-height:100vh}.system{top:22px;right:22px}}
/* v1.2 login polish */
.login-card{box-shadow:0 22px 70px #0f172a18;border-color:#d9e7e2}.login-card:before{content:"";position:absolute;left:0;top:0;right:0;height:4px;border-radius:18px 18px 0 0;background:linear-gradient(90deg,#07965c,#16c784)}
.login-message{border-radius:10px;padding:11px 13px;margin:-4px 0 18px;font-size:13px;font-weight:700}.login-message.error{background:#fff1f0;border:1px solid #ffd4cf;color:#a1281e}.login-message.ok{background:#e9f8f1;border:1px solid #cdeedc;color:#08724a}.login-btn:hover{filter:brightness(.97);transform:translateY(-1px)}.login-btn{transition:.15s}.mini-brand span{filter:drop-shadow(0 4px 10px #07854f22)}
/* v1.2 Exact Mockup login polish */
body{font-family:Inter,"Segoe UI",Arial,sans-serif}.hero{background:radial-gradient(circle at 75% 25%,#1c4669 0,#0e2a43 32%,#081d31 70%,#061726 100%)}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 0 45%,#0e395d88 45% 50%,transparent 50% 100%);pointer-events:none}.hero-brand{position:relative;z-index:2}.hero-copy,.tv,.hero-foot{position:relative;z-index:2}.login-side{background:linear-gradient(180deg,#f8fbfc,#eef7f4)}.login-card{border-radius:18px;box-shadow:0 22px 60px #0c21351a;border:1px solid #dce8e6}.login-btn{background:linear-gradient(180deg,#0fbd75,#07975d);box-shadow:0 8px 20px #07965c35;border-radius:9px}.system{border:1px solid #d6ebe2;background:#f0fbf6;border-radius:11px}.tv{box-shadow:0 30px 70px #0007;border:1px solid #ffffff1f}.tv-top em,.lower small{background:linear-gradient(180deg,#11be76,#078f58)}