:root{--brand:#124559;--ink:#0f172a;--muted:#64748b;--bg:#f8fafc;--card:#ffffff;--line:#e5e7eb;}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);font-family:system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,Cantarell,"Helvetica Neue",Arial,sans-serif;color:var(--ink);}
.container{max-width:840px;margin:48px auto;padding:0 20px;}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 10px 25px rgba(2,6,23,.06);padding:28px;}
.header{display:flex;align-items:center;gap:14px;margin-bottom:10px;}
.logo{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,#1f6f8b,#99d8d0);display:grid;place-items:center;box-shadow:0 6px 16px rgba(0,0,0,.12);}
.logo img{width:26px;height:26px;display:block}
.title{font-weight:800;font-size:22px;letter-spacing:.2px;color:var(--brand);}
.sub{color:var(--muted);font-size:14px;margin:4px 0 0 2px;}
.form{margin-top:18px}
label{font-size:14px;color:var(--ink)}
a.link{color:var(--brand);text-decoration:none}
a.link:hover{text-decoration:underline}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
.btn{appearance:none;border:0;border-radius:10px;padding:10px 14px;font-weight:600;cursor:pointer;transition:.2s}
.btn-primary{background:var(--brand);color:#fff}
.btn-secondary{background:#0b3a53;color:#fff}
.btn-outline{background:#fff;border:1px solid var(--line);color:var(--ink)}
.small{color:var(--muted);font-size:12px}
.modal{position:fixed;inset:0;background:rgba(2,6,23,.5);display:none;align-items:flex-start;justify-content:center;z-index:50;padding:24px;overflow:auto}
.modal.open{display:flex}
.modal-card{background:#fff;border-radius:14px;box-shadow:0 20px 50px rgba(0,0,0,.25);border:1px solid var(--line);max-width:760px;width:100%;margin-top:6vh}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--line)}
.modal-head h3{margin:0;font-size:18px;color:var(--brand)}
.modal-body{padding:16px 16px 6px 16px;color:var(--ink);line-height:1.5}
.modal-foot{padding:12px 16px 16px 16px;display:flex;justify-content:flex-end;gap:10px}
.close-x{background:transparent;border:0;font-size:22px;cursor:pointer;color:#334155}
.checkline{display:flex;gap:8px;align-items:flex-start}
.checkline input{margin-top:2px}
@media (max-width:520px){.actions{flex-direction:column}}