/* Shared by the admin and portal pages: color tokens and page basics. Taken from design/. */
:root { --page:#fcfaf8; --band:#f0eae4; --card:#fff; --border:#e3dbd2; --ink:#1a1613; --muted:#575049; --muted2:#6b625a; --blue:#0f4c81; --blue-deep:#0a3459; --blue-press:#0d4271; --red:#9a2b1e; --green:#2f7d4f; --amber:#a86a12; --mono:'JetBrains Mono',ui-monospace,monospace; }
* { box-sizing:border-box; }
body { margin:0; background:var(--page); color:var(--ink); font-family:'DM Sans',system-ui,sans-serif; font-size:17px; line-height:1.55; -webkit-font-smoothing:antialiased; display:flex; flex-direction:column; min-height:100vh; }
h1,h2,h3 { margin:0; letter-spacing:-0.03em; text-wrap:balance; }
p { margin:0; text-wrap:pretty; }
a { color:var(--blue); text-decoration:none; }
a:hover { color:var(--blue-press); text-decoration:underline; }
.wrap { width:100%; max-width:1100px; margin:0 auto; padding:0 24px; }
.nav { display:flex; align-items:center; justify-content:space-between; gap:16px; height:66px; }
.brand:hover { text-decoration:none; color:var(--ink); }
.mark { width:26px; height:19px; display:block; }
.navlinks a { color:var(--muted2); font-size:15px; }
.navlinks a:hover { color:var(--ink); text-decoration:none; }
.navlinks a.on { color:var(--ink); font-weight:700; }
.user { position:relative; }
.menu a { display:block; padding:9px 10px; border-radius:8px; color:var(--ink); font-size:14px; }
.menu a:hover { background:var(--band); text-decoration:none; }
main { flex:1; padding:40px 0 72px; }
.head { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:28px; }
.head h1 { font-size:clamp(28px,3.6vw,40px); line-height:1.1; margin-top:10px; }
.card { background:var(--card); border:1px solid var(--border); border-radius:14px; }
.card-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:18px 22px; border-bottom:1px solid var(--border); }
.card-head h2 { font-size:19px; }
.muted { color:var(--muted2); font-size:14px; }
footer.wrap { border-top:1px solid var(--border); padding:24px; display:flex; flex-wrap:wrap; gap:14px; justify-content:space-between; align-items:center; color:var(--muted2); font-size:14px; }
@media (prefers-reduced-motion:reduce) {
  * { transition:none!important; animation:none!important; }
}

/* Dark mode: generated from the rules above. */
@media (prefers-color-scheme: dark) {
  :root { color-scheme:dark; --page:#16130f; --band:#2a2520; --card:#1e1a16; --border:#38312a; --ink:#f2ede7; --muted:#c9bfb5; --muted2:#a99e93; --blue:#7fb0e0; --blue-deep:#a9c9ea; --blue-press:#a3c6ec; --red:#ec8a78; --green:#74c795; --amber:#e3a94f; }
  .mark polygon:nth-child(2) { fill:#7fb0e0; stroke:#7fb0e0; }
  .mark polygon:nth-child(3) { fill:#16130f; }
}
