/* Canberra Energy Policy Lab: site styles. Tokens on :root, with dark values for the system setting and for an explicit data-theme. */
:root{
 color-scheme:light;
 --bg:#f9f9f7;--surface:#fcfcfb;--raised:#ffffff;--ink:#0b0b0b;--ink2:#52514e;--muted:#6f6e69;--line:#e1e0d9;--line-strong:#c3c2b7;
 --accent:#1c5cab;--accent-soft:#e8f0fb;--accent-ink:#ffffff;--note:#fff8e6;--note-line:#c98500;--code:#f1f0ec;
 --radius:10px;--shadow:0 1px 2px rgba(11,11,11,.06),0 4px 16px rgba(11,11,11,.04);
 --font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
@media (prefers-color-scheme:dark){
 :root:not([data-theme="light"]){
  color-scheme:dark;
  --bg:#0d0d0d;--surface:#1a1a19;--raised:#21211f;--ink:#f0efec;--ink2:#c3c2b7;--muted:#9a9890;--line:#2c2c2a;--line-strong:#383835;
  --accent:#86b6ef;--accent-soft:#16263b;--accent-ink:#0b0b0b;--note:#2a2410;--note-line:#c98500;--code:#242422;
  --shadow:0 1px 2px rgba(0,0,0,.4);
 }
}
:root[data-theme="dark"]{
 color-scheme:dark;
 --bg:#0d0d0d;--surface:#1a1a19;--raised:#21211f;--ink:#f0efec;--ink2:#c3c2b7;--muted:#9a9890;--line:#2c2c2a;--line-strong:#383835;
 --accent:#86b6ef;--accent-soft:#16263b;--accent-ink:#0b0b0b;--note:#2a2410;--note-line:#c98500;--code:#242422;
 --shadow:0 1px 2px rgba(0,0,0,.4);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.65 var(--font);-webkit-text-size-adjust:100%}
a{color:var(--accent)}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:4px}
.skip{position:absolute;left:-999px;top:0;background:var(--raised);padding:8px 12px;z-index:20}
.skip:focus{left:12px;top:12px}
.wrap{max-width:1080px;margin:0 auto;padding:0 16px}
/* Header */
.top{position:sticky;top:0;z-index:10;background:var(--bg);background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;gap:16px;min-height:60px;flex-wrap:wrap}
.brand{font-weight:650;color:var(--ink);text-decoration:none;letter-spacing:-.01em;margin-right:auto}
.brand small{display:block;font-weight:400;color:var(--muted);font-size:12px;letter-spacing:0}
.nav{display:flex;gap:4px 14px;flex-wrap:wrap;font-size:14px}
.nav a{color:var(--ink2);text-decoration:none;padding:4px 2px}
.nav a:hover,.nav a[aria-current="page"]{color:var(--ink);text-decoration:underline}
.btn{display:inline-block;background:var(--accent);color:var(--accent-ink);text-decoration:none;font-weight:600;padding:10px 16px;border-radius:8px;font-size:15px;border:1px solid var(--accent)}
.btn:hover{filter:brightness(1.08)}
.btn.ghost{background:transparent;color:var(--accent)}
.btn.small{padding:6px 12px;font-size:14px}
/* Hero */
.hero{padding:56px 0 32px}
.eyebrow{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 8px}
.hero h1{font-size:clamp(30px,5vw,46px);line-height:1.12;letter-spacing:-.02em;margin:0 0 14px;max-width:20ch}
.lede{font-size:clamp(17px,2.2vw,20px);color:var(--ink2);max-width:62ch;margin:0 0 22px}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 22px}
.meta{font-size:13px;color:var(--muted)}
.callout{background:var(--note);border-left:4px solid var(--note-line);border-radius:6px;padding:12px 16px;margin:18px 0;max-width:76ch}
.callout p{margin:0}
/* Sections */
section{padding:36px 0;border-top:1px solid var(--line)}
section h2{font-size:clamp(23px,3vw,30px);letter-spacing:-.015em;line-height:1.2;margin:0 0 6px}
section h3{font-size:19px;margin:28px 0 6px}
.section-lede{color:var(--ink2);max-width:70ch;margin:0 0 18px}
.prose{max-width:74ch}
.prose p{margin:0 0 14px}
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px;box-shadow:var(--shadow)}
.card h3{margin-top:0;font-size:17px}
.card p,.card li{font-size:15px}
.card ol,.card ul{padding-left:20px;margin:0}
.aims{counter-reset:aim;list-style:none;padding:0;margin:0;display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.aims li{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px 14px 48px;position:relative;font-size:15px}
.aims li::before{counter-increment:aim;content:counter(aim);position:absolute;left:16px;top:13px;width:22px;height:22px;border-radius:50%;background:var(--accent-soft);color:var(--accent);font-weight:700;font-size:13px;display:grid;place-items:center}
/* Diagrams and figures */
.diagram,.figure{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;margin:18px 0;box-shadow:var(--shadow)}
.diagram figcaption,.figure figcaption{font-size:14px;color:var(--ink2);margin-top:10px}
.diagram figcaption b,.figure figcaption b{color:var(--ink)}
/* Centred with auto margins, not flex, so a diagram wider than its box can still be scrolled to its left edge. */
.diagram .mermaid{overflow-x:auto}
.diagram .mermaid svg,.doc .mermaid svg{display:block;margin:0 auto;max-width:100%;height:auto}
pre.mermaid{font-family:var(--mono);font-size:12px;white-space:pre;color:var(--muted);background:none;margin:0}
.figure .chart{overflow-x:auto}
.figure .chart svg,.figure .chart img{display:block;width:100%;height:auto;max-width:760px;margin:0 auto}
.figure details{margin-top:10px;font-size:14px}
.figure summary{cursor:pointer;color:var(--accent);font-weight:600}
.reading{margin:10px 0 0;font-size:15px;max-width:72ch}
/* Tables */
.table-wrap{overflow-x:auto;margin:10px 0}
table{border-collapse:collapse;width:100%;font-size:14px;font-variant-numeric:tabular-nums}
th,td{text-align:left;padding:7px 10px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-weight:600;color:var(--ink);background:var(--code)}
td:not(:first-child),th:not(:first-child){text-align:right}
tbody th{background:none;font-weight:500}
.doc-table td:not(:first-child),.doc-table th:not(:first-child){text-align:left}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* Code */
code{font-family:var(--mono);font-size:.9em;background:var(--code);padding:1px 5px;border-radius:4px}
pre{background:var(--code);border-radius:8px;padding:12px 14px;overflow-x:auto;font-size:13.5px;line-height:1.5}
pre code{background:none;padding:0}
.equation{font-family:var(--mono);font-size:14px;background:var(--code);border-radius:8px;padding:12px 14px;overflow-x:auto;white-space:pre-wrap}
/* References */
.refs{padding-left:0;list-style:none;font-size:14.5px}
.refs li{margin:0 0 10px;padding-left:28px;text-indent:-28px;overflow-wrap:anywhere}
/* Footer */
footer{border-top:1px solid var(--line);padding:28px 0 48px;color:var(--muted);font-size:13.5px}
footer p{margin:0 0 8px;max-width:90ch}
/* Documentation viewer */
.docs-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:32px;padding:28px 0 48px}
.docs-nav{position:sticky;top:76px;align-self:start;max-height:calc(100vh - 96px);overflow:auto;font-size:14px}
.docs-nav h2{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:16px 0 6px}
.docs-nav ul{list-style:none;padding:0;margin:0}
.docs-nav a{display:block;padding:5px 8px;border-radius:6px;color:var(--ink2);text-decoration:none;line-height:1.35}
.docs-nav a:hover{background:var(--accent-soft);color:var(--ink)}
.docs-nav a[aria-current="page"]{background:var(--accent-soft);color:var(--accent);font-weight:600}
.doc{min-width:0}
.doc h1{font-size:clamp(26px,3.6vw,34px);line-height:1.2;letter-spacing:-.015em}
.doc h2{font-size:23px;margin-top:36px;padding-top:12px;border-top:1px solid var(--line)}
.doc h3{font-size:18px;margin-top:26px}
.doc img{max-width:100%;height:auto;border-radius:8px;border:1px solid var(--line);background:var(--surface)}
.doc blockquote{margin:12px 0;padding:8px 16px;border-left:4px solid var(--line-strong);color:var(--ink2);background:var(--surface);border-radius:0 6px 6px 0}
.doc .mermaid{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px;margin:16px 0;overflow-x:auto}
.doc table{display:block;overflow-x:auto}
.doc td,.doc th{text-align:left}
.doc-status{color:var(--muted);font-size:14px}
.doc>p,.doc>ul,.doc>ol,.doc>blockquote{max-width:78ch}
.doc pre{max-width:100%}
.repo-ref{font-family:var(--mono);font-size:.9em;color:var(--ink2);border-bottom:1px dotted var(--line-strong)}
.repo-ref code{background:none;padding:0}
[data-failed]{display:block;text-align:left}
.diagram-note{margin:6px 0 0}
@media (max-width:820px){
 .docs-layout{grid-template-columns:1fr;gap:12px}
 .docs-nav{position:static;max-height:none;border:1px solid var(--line);border-radius:var(--radius);padding:8px 12px}
 html{scroll-padding-top:8px}
 .top{position:static}
 .top .wrap{gap:6px 12px;padding-top:10px;padding-bottom:6px;min-height:0}
 .brand small{display:none}
 .nav{order:3;width:100%;flex-wrap:nowrap;overflow-x:auto;gap:18px;padding-bottom:4px;scrollbar-width:none}
 .nav a{white-space:nowrap}
 .hero{padding:28px 0 20px}
 .figure .chart svg{min-width:560px}
}
@media print{.top,.docs-nav,.actions,footer .no-print{display:none}body{background:#fff;color:#000}}