:root { color-scheme: light; --ink:#10223b; --muted:#465b77; --paper:#f5f7fb; --blue:#245ac5; --line:#dce6f4; --teal:#08756a; }
* { box-sizing:border-box; } body { margin:0; background:var(--paper); color:var(--ink); font:16px/1.55 system-ui,sans-serif; }
.mast { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; padding:16px clamp(20px,5vw,68px); background:#10223b; color:#fff; }
.brand { font-weight:750; color:#fff; text-decoration:none; letter-spacing:-.035em; font-size:1.35rem; } .brand span { color:#77e7d3; font-size:.9rem; letter-spacing:.06em; margin-left:.25rem; }
.shell { max-width:1200px; margin:auto; padding:clamp(20px,4vw,48px); } .reading { max-width:850px; } h1,h2,h3 { line-height:1.18; letter-spacing:-.025em; } h1 { font-size:clamp(2.2rem,5vw,3.55rem); margin:.24em 0 .4em; }
h2 { margin-top:1.2em; } p { color:var(--muted); } a { color:var(--blue); } .eyebrow { text-transform:uppercase; color:var(--teal); font-weight:750; letter-spacing:.11em; font-size:.78rem; }
.hero { padding:clamp(22px,5vw,52px); border-radius:24px; background:linear-gradient(135deg,#10223b,#294e9a); color:white; margin-bottom:24px; } .hero p { color:#e2ecff; } .hero .eyebrow { color:#89eddb; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr)); gap:14px; margin:16px 0 24px; }
.card, #login { background:white; border:1px solid var(--line); border-radius:18px; padding:20px; } .card h2,.card h3 { margin-top:0; } #login { max-width:490px; margin:20px auto; }
nav,.controls,footer { display:flex; flex-wrap:wrap; gap:9px; align-items:center; } nav { margin-bottom:24px; } footer { border-top:1px solid var(--line); padding-top:18px; margin-top:36px; }
button,input,select,textarea { font:inherit; } button { min-height:44px; padding:8px 13px; background:#eef3ff; color:#194598; border:1px solid var(--line); border-radius:10px; font-weight:650; cursor:pointer; }
button.primary,button[aria-current="page"] { background:var(--blue); color:white; border-color:var(--blue); } button:disabled { opacity:.65; cursor:wait; } :focus-visible { outline:3px solid #0d826e; outline-offset:2px; }
input,textarea,select { display:block; width:100%; padding:10px; border:1px solid #a9b9cf; border-radius:9px; background:white; color:var(--ink); }
label { display:block; margin:10px 0 14px; font-weight:600; } label input,label textarea,label select { margin-top:4px; font-weight:400; } textarea { min-height:120px; }
.scroll { overflow:auto; background:white; border:1px solid var(--line); border-radius:14px; margin:14px 0; }
table { width:100%; border-collapse:collapse; text-align:start; } th,td { text-align:start; padding:10px 13px; border-bottom:1px solid var(--line); vertical-align:top; overflow-wrap:anywhere; min-width:100px; }
th { background:#eef4ff; color:var(--ink); } td > button { margin:0 5px 5px 0; } .metric { font-size:1.9rem; font-weight:750; display:block; }
dialog { border:1px solid var(--line); border-radius:18px; width:min(660px,calc(100% - 28px)); max-height:88vh; padding:22px; color:var(--ink); }
dialog::backdrop { background:#10223ba0; } dialog h2 { margin-top:0; } [hidden] { display:none!important; }
#status,#edit-error { min-height:1.6em; } #edit-error { color:#9b2941; }