:root{--navy:#071f49;--blue:#1489e8;--cyan:#25c4ff;--bg:#f3f7fc;--card:#fff;--muted:#63728a;--line:#dce6f2;--good:#159947;--bad:#d82f2f;--shadow:0 18px 50px rgba(7,31,73,.10);font-family:Helvetica,Arial,sans-serif;color:var(--navy)}
*{box-sizing:border-box}body{margin:0;background:linear-gradient(135deg,#f8fbff,#edf5ff);min-height:100vh}button,input,select{font:inherit}a{color:inherit;text-decoration:none}
.client-page{min-height:100vh;display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;max-width:1180px;margin:auto;padding:48px 28px}.hero .logo{width:180px;max-width:55%;margin-bottom:26px}.eyebrow{text-transform:uppercase;letter-spacing:.16em;color:var(--blue);font-size:.78rem;font-weight:800;margin:0 0 8px}.hero h1{font-size:clamp(2.8rem,6vw,5rem);line-height:.98;margin:0 0 22px}.hero p{font-size:1.1rem;color:var(--muted);max-width:560px;line-height:1.55}.pill{display:inline-flex;gap:14px;align-items:center;background:#e8f4ff;color:#003b88;border-radius:14px;padding:14px 18px;margin-top:22px}.pill strong{font-size:1.25rem}.pill span{font-size:.95rem}
.card{background:var(--card);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);padding:24px}.login-card{max-width:430px}.card h2,.card h3{margin:0 0 14px}.muted{color:var(--muted);line-height:1.45}.error{color:var(--bad);min-height:20px}.notice{background:#fff7df;border:1px solid #ffd77b;color:#8a4a00;border-radius:12px;padding:12px}
label{font-weight:800;font-size:.92rem;display:grid;gap:8px;margin:12px 0}input,select{width:100%;border:1px solid #cdd9e8;border-radius:12px;padding:12px 14px;background:#fff;color:var(--navy)}input:focus,select:focus{outline:3px solid rgba(20,137,232,.18);border-color:var(--blue)}
.btn{border:0;border-radius:12px;padding:12px 16px;background:#e7ecf3;color:var(--navy);font-weight:800;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn.primary{background:var(--navy);color:white}.btn.danger{background:var(--bad);color:white}.btn.full{width:100%}.btn:hover{filter:brightness(.98)}
.dashboard .topline,.admin-header,.section-head{display:flex;justify-content:space-between;gap:18px;align-items:center}.score{background:linear-gradient(135deg,var(--navy),#0e57ad);color:#fff;border-radius:20px;padding:24px;margin:22px 0}.score span,.score small{display:block;opacity:.85}.score strong{font-size:3.2rem;display:block}.grid{display:grid;gap:14px}.grid.two{grid-template-columns:1fr 1fr}.grid.three{grid-template-columns:repeat(3,1fr)}.grid.four{grid-template-columns:repeat(4,1fr)}
.stat{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 8px 22px rgba(7,31,73,.06)}.stat span{color:var(--muted);display:block}.stat strong{font-size:1.7rem}.ink-card{background:#f7fbff;border:1px solid var(--line);border-radius:16px;padding:16px}.ink-card strong{display:block;font-size:1.4rem;margin-top:6px}
.admin-page{max-width:1240px;margin:auto;padding:24px}.admin-header{margin-bottom:20px}.brand{display:flex;gap:16px;align-items:center}.brand img{width:94px}.actions{display:flex;gap:10px;flex-wrap:wrap}.search{margin:12px 0 18px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:760px}th,td{padding:12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}th{font-size:.82rem;text-transform:uppercase;letter-spacing:.06em;color:#49607e;background:#f7faff}td strong{display:block}
dialog{border:0;border-radius:22px;padding:0;box-shadow:var(--shadow);width:min(720px,94vw)}dialog::backdrop{background:rgba(7,31,73,.38)}.modal{padding:24px}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.toast{position:fixed;right:22px;bottom:22px;background:var(--navy);color:#fff;border-radius:14px;padding:14px 18px;box-shadow:var(--shadow)}
@media(max-width:850px){.client-page{grid-template-columns:1fr;padding:28px 16px}.grid.three,.grid.four,.grid.two{grid-template-columns:1fr}.admin-header,.section-head,.dashboard .topline{align-items:flex-start;flex-direction:column}.actions{width:100%}.actions .btn{flex:1}.pill{display:grid}.hero .logo{width:140px}}
