/* Layout: a single narrow reading column, like a field notebook — index of entries with track + tag filters; services on one compact page */
:root{
  --bg:#F5F7F6; --surface:#FFFFFF; --ink:#14201D; --muted:#5A6965; --line:#D9E0DD;
  --accent:#0E6B58; --accent-soft:#E2EFEB; --danger:#B4232C;
  --t-reading:#8A5A1F; --t-coaching:#8A3F6E; --t-others:#3C5A99;
  --code-bg:#F0F3F2; --code-kw:#0E6B58; --code-str:#8A5A1F; --code-com:#7D8B87; --code-num:#3C5A99; --code-fn:#8A3F6E;
  --f-display:"Schibsted Grotesk","Noto Sans SC","PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  --f-body:"Source Serif 4","Noto Sans SC","PingFang SC","Microsoft YaHei",Georgia,"Times New Roman",serif;
  --f-mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#0F1614; --surface:#151E1B; --ink:#E4ECE9; --muted:#97A7A2; --line:#26332F;
  --accent:#5CC4A8; --accent-soft:#183029; --danger:#F07178;
  --t-reading:#D9A766; --t-coaching:#D99AC4; --t-others:#8EA9E6;
  --code-bg:#121A18; --code-kw:#5CC4A8; --code-str:#D9A766; --code-com:#6F807B; --code-num:#8EA9E6; --code-fn:#D99AC4;
  color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0F1614; --surface:#151E1B; --ink:#E4ECE9; --muted:#97A7A2; --line:#26332F;
  --accent:#5CC4A8; --accent-soft:#183029; --danger:#F07178;
  --t-reading:#D9A766; --t-coaching:#D99AC4; --t-others:#8EA9E6;
  --code-bg:#121A18; --code-kw:#5CC4A8; --code-str:#D9A766; --code-com:#6F807B; --code-num:#8EA9E6; --code-fn:#D99AC4;
  color-scheme:dark}

/* ===== Colour themes. Pick one in config.js (theme: "indigo" | "green" | "ember"). ===== */
:root[data-accent="indigo"]{
  --bg:#F6F6FA; --surface:#FFFFFF; --ink:#16172A; --muted:#5D6078; --line:#DCDDE9;
  --accent:#4F46E5; --accent-soft:#ECEBFD; --t-others:#0E7C86; --code-bg:#F1F1F7; --code-kw:#4F46E5; --code-num:#0E7C86}
@media (prefers-color-scheme: dark){:root[data-accent="indigo"]:not([data-theme="light"]){
  --bg:#0F1020; --surface:#171830; --ink:#E6E7F3; --muted:#9EA1BE; --line:#2A2C48;
  --accent:#A5B4FC; --accent-soft:#25264A; --t-others:#5CC4C8; --code-bg:#121328; --code-kw:#A5B4FC; --code-num:#5CC4C8}}
:root[data-accent="indigo"][data-theme="dark"]{
  --bg:#0F1020; --surface:#171830; --ink:#E6E7F3; --muted:#9EA1BE; --line:#2A2C48;
  --accent:#A5B4FC; --accent-soft:#25264A; --t-others:#5CC4C8; --code-bg:#121328; --code-kw:#A5B4FC; --code-num:#5CC4C8}
:root[data-accent="ember"]{
  --bg:#F8F6F4; --surface:#FFFFFF; --ink:#221A16; --muted:#6B605A; --line:#E6DED8;
  --accent:#C2410C; --accent-soft:#FCEDE4; --danger:#A61B2B; --t-reading:#6B5BA8; --code-bg:#F4F0EC; --code-kw:#C2410C; --code-str:#6B5BA8}
@media (prefers-color-scheme: dark){:root[data-accent="ember"]:not([data-theme="light"]){
  --bg:#16110E; --surface:#1F1814; --ink:#EFE8E3; --muted:#ACA19A; --line:#3A302A;
  --accent:#FB923C; --accent-soft:#3A2216; --danger:#F87171; --t-reading:#B4A5E8; --code-bg:#1A1411; --code-kw:#FB923C; --code-str:#B4A5E8}}
:root[data-accent="ember"][data-theme="dark"]{
  --bg:#16110E; --surface:#1F1814; --ink:#EFE8E3; --muted:#ACA19A; --line:#3A302A;
  --accent:#FB923C; --accent-soft:#3A2216; --danger:#F87171; --t-reading:#B4A5E8; --code-bg:#1A1411; --code-kw:#FB923C; --code-str:#B4A5E8}

*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--f-display);font-size:16px;line-height:1.5}
.wrap{max-width:46rem;margin:0 auto;padding-inline:20px;padding-block:0 4rem}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:3px}
.mono{font-family:var(--f-mono);font-size:.78rem;letter-spacing:.02em}

header.site{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.75rem 1.5rem;padding-block:2rem 1.25rem;border-bottom:1px solid var(--line)}
.brand{text-decoration:none;display:flex;flex-direction:column}
.brand b{font-size:1.25rem;font-weight:700;letter-spacing:-.01em}
.logo{font-family:var(--f-mono);font-size:1.3rem!important;font-weight:500!important;letter-spacing:-.02em!important}
.logo .k{color:var(--accent);font-weight:700}
.logo .tld{color:var(--muted)}
.brand-row{display:flex;align-items:center;gap:.5rem}
.beta-tag{font-size:.62rem;line-height:1;padding:.2rem .35rem;border:1px solid var(--accent);border-radius:4px;color:var(--accent);text-transform:uppercase;letter-spacing:.08em}
.brand span{color:var(--muted)}
nav.main{display:flex;gap:1.25rem}
nav.main a{text-decoration:none;color:var(--muted);font-weight:500;padding-block:.25rem;border-bottom:2px solid transparent}
nav.main a[aria-current="page"]{color:var(--ink);border-color:var(--accent)}
nav.main a:hover{color:var(--ink)}

.intro{padding-block:2.25rem 1.5rem}
.intro h1{font-size:clamp(1.6rem,4.5vw,2.15rem);line-height:1.15;letter-spacing:-.02em;margin:0 0 .75rem;text-wrap:balance;font-weight:700}
.intro h1 em{font-style:normal;color:var(--accent)}
.intro p{font-family:var(--f-body);font-size:1.08rem;color:var(--muted);margin:0;max-width:38rem}

.filters{display:grid;gap:.9rem;padding-block:1rem;border-block:1px solid var(--line)}
.row{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.row .label{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:.7rem;font-family:var(--f-mono);min-width:3.5rem}
.chip{font:inherit;font-size:.88rem;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:.3rem .7rem;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;gap:.4rem}
.chip:hover{border-color:var(--muted)}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.chip .n{font-family:var(--f-mono);font-size:.7rem;opacity:.65}
.tag{font-family:var(--f-mono);font-size:.75rem;border:0;background:none;color:var(--muted);padding:.15rem .1rem;cursor:pointer}
.tag:hover,.tag[aria-pressed="true"]{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.dot{width:.5rem;height:.5rem;border-radius:50%;background:var(--accent);flex:none}
.dot.reading{background:var(--t-reading)}.dot.coaching{background:var(--t-coaching)}.dot.others{background:var(--t-others)}
.search{flex:1 1 12rem;min-width:0;font:inherit;font-size:.9rem;padding:.4rem .7rem;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--ink)}
.active-filter{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;color:var(--muted);font-size:.88rem;padding-top:1rem}
.active-filter button{font:inherit;font-size:.82rem;background:none;border:0;color:var(--accent);cursor:pointer;text-decoration:underline}

ol.posts{list-style:none;margin:0;padding:0}
ol.posts li{border-bottom:1px solid var(--line)}
.entry{display:grid;grid-template-columns:6.5rem 1fr;gap:.25rem 1.25rem;padding-block:1.25rem;text-decoration:none}
.entry time{color:var(--muted);padding-top:.2rem;font-variant-numeric:tabular-nums}
.entry .body{min-width:0}
.entry h2{font-size:1.15rem;line-height:1.3;margin:0 0 .3rem;font-weight:600;text-wrap:balance}
.entry:hover h2{color:var(--accent)}
.entry p{font-family:var(--f-body);color:var(--muted);margin:0 0 .5rem;font-size:.98rem}
.meta{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem .8rem;color:var(--muted)}
.meta .track{display:inline-flex;align-items:center;gap:.4rem;color:var(--ink)}
.has{display:inline-flex;gap:.35rem}
.has span{font-family:var(--f-mono);font-size:.68rem;border:1px solid var(--line);border-radius:4px;padding:0 .35rem}
.empty{padding-block:3rem;color:var(--muted);font-family:var(--f-body)}
@media (max-width:540px){.entry{grid-template-columns:1fr}.entry time{padding:0}}

/* article */
.back{display:inline-block;margin-block:1.75rem 1rem;color:var(--muted);text-decoration:none}
.back:hover{color:var(--accent)}
article h1{font-size:clamp(1.6rem,4.5vw,2.2rem);line-height:1.15;letter-spacing:-.02em;margin:0 0 .9rem;text-wrap:balance}
article>.meta{padding-bottom:1.25rem;border-bottom:1px solid var(--line);margin-bottom:1.5rem}
.prose{font-family:var(--f-body);font-size:1.1rem;line-height:1.7;min-width:0}
.prose>p,.prose>ul,.prose>ol,.prose>blockquote{max-width:38rem}
.prose h2,.prose h3{font-family:var(--f-display);line-height:1.25;text-wrap:balance}
.prose h2{font-size:1.35rem;margin:2.25rem 0 .5rem}
.prose h3{font-size:1.1rem;margin:1.75rem 0 .4rem}
.prose :not(pre)>code{font-family:var(--f-mono);font-size:.85em;background:var(--accent-soft);padding:.1em .35em;border-radius:4px}
.prose blockquote{margin:1.5rem 0;padding-left:1rem;border-left:2px solid var(--line);color:var(--muted)}
.prose blockquote.callout{border:1px solid var(--line);border-left:3px solid var(--accent);background:var(--surface);color:var(--ink);padding:.75rem 1rem;border-radius:0 6px 6px 0;font-size:1rem}
.prose blockquote.callout.warning{border-left-color:var(--danger)}
.prose blockquote.callout p{margin:0}
.prose blockquote.callout strong:first-child{font-family:var(--f-display);text-transform:uppercase;letter-spacing:.08em;font-size:.72rem;display:block;margin-bottom:.2rem}
.prose ul,.prose ol{padding-left:1.2rem}
.prose img{border-radius:6px}
.tbl{overflow-x:auto;margin-block:1.25rem}
.prose table{border-collapse:collapse;font-family:var(--f-display);font-size:.9rem;min-width:100%}
.prose th,.prose td{text-align:left;padding:.45rem .7rem;border-bottom:1px solid var(--line);vertical-align:top}
.prose th{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:500}

/* code + shells */
.code{margin-block:1.25rem;border:1px solid var(--line);border-radius:8px;background:var(--code-bg);overflow:hidden}
.code-bar{display:flex;justify-content:space-between;align-items:center;padding:.35rem .5rem .35rem .85rem;border-bottom:1px solid var(--line);color:var(--muted)}
.code-bar .dots{display:inline-flex;gap:.3rem;margin-right:.6rem}
.code-bar .dots i{width:.5rem;height:.5rem;border-radius:50%;background:var(--line);display:block}
.code pre{margin:0;padding:.9rem 1rem;overflow-x:auto;font-family:var(--f-mono);font-size:.82rem;line-height:1.6}
.code pre code{font-family:inherit}
.copy{font:inherit;font-family:var(--f-mono);font-size:.72rem;background:none;border:1px solid var(--line);color:var(--muted);border-radius:4px;padding:.15rem .5rem;cursor:pointer}
.copy:hover{color:var(--ink);border-color:var(--muted)}
.shell .prompt{color:var(--accent);user-select:none}
.shell .out{color:var(--muted)}
.shell .err{color:var(--danger)}
.hljs-keyword,.hljs-literal,.hljs-built_in,.hljs-meta{color:var(--code-kw)}
.hljs-string,.hljs-regexp{color:var(--code-str)}
.hljs-comment{color:var(--code-com);font-style:italic}
.hljs-number,.hljs-variable,.hljs-attr{color:var(--code-num)}
.hljs-title,.hljs-function .hljs-title,.hljs-title.function_{color:var(--code-fn)}

/* media blocks */
.video{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;margin-block:1.25rem;padding:1rem;border:1px solid var(--line);border-radius:8px;background:var(--surface);text-decoration:none;font-family:var(--f-display)}
.video:hover{border-color:var(--accent)}
.video .play{width:3rem;height:3rem;border-radius:50%;background:var(--accent);display:grid;place-items:center}
.video .play svg{fill:var(--bg);width:1rem;height:1rem;margin-left:.15rem}
.video b{display:block;font-size:1rem;line-height:1.3}
.video .sub{color:var(--muted)}
.video .go{color:var(--accent)}
.video>span{min-width:0}
@media (max-width:540px){.video{grid-template-columns:auto 1fr}.video .go{grid-column:2}}

.deck{margin-block:1.25rem;border:1px solid var(--line);border-radius:8px;background:var(--surface);overflow:hidden;font-family:var(--f-display)}
.slide{aspect-ratio:16/9;max-width:100%;padding:clamp(1rem,5vw,2.75rem);display:flex;flex-direction:column;justify-content:center;gap:.4rem;font-size:clamp(.95rem,2.4vw,1.15rem)}
.slide h1,.slide h2{margin:0;font-size:clamp(1.3rem,4vw,2rem);line-height:1.15;letter-spacing:-.02em;text-wrap:balance}
.slide h3{margin:0;color:var(--accent);font-family:var(--f-mono);font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;font-weight:500}
.slide p,.slide ul{margin:0}.slide ul{padding-left:1.1rem}
.slide li+li{margin-top:.25rem}
.deck-bar{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.45rem .6rem;border-top:1px solid var(--line);color:var(--muted)}
.deck-bar button{font:inherit;font-size:.85rem;background:none;border:1px solid var(--line);color:var(--ink);border-radius:4px;padding:.2rem .65rem;cursor:pointer}
.deck-bar button:disabled{opacity:.35;cursor:default}
.deck-bar .ctr{font-variant-numeric:tabular-nums}

.talk{margin-block:1.25rem;padding:1.1rem 1.2rem;border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:8px;background:var(--surface);font-family:var(--f-display);display:grid;gap:.5rem}
.talk .eyebrow{color:var(--accent);text-transform:uppercase;letter-spacing:.1em}
.talk h4{margin:0;font-size:1.15rem;line-height:1.3}
.talk p{margin:0;font-family:var(--f-body);color:var(--muted);font-size:1rem}
.talk .links{display:flex;flex-wrap:wrap;gap:.5rem 1rem}
.talk .links a{color:var(--accent);font-weight:500;font-size:.9rem}

.diagram{margin:1.5rem 0}
.diagram .scroll{overflow-x:auto;border:1px solid var(--line);border-radius:8px;background:var(--surface);padding:.75rem}
.diagram svg{display:block;width:100%;min-width:520px;height:auto;font-family:var(--f-display)}
.diagram figcaption{font-family:var(--f-display);font-size:.88rem;color:var(--muted);margin-top:.6rem}
.d-box{fill:var(--bg);stroke:var(--ink);stroke-width:1.25}
.d-ext{fill:var(--surface);stroke:var(--muted);stroke-width:1.25}
.d-store{fill:var(--bg);stroke:var(--danger);stroke-width:1.25}
.d-bound{fill:none;stroke:var(--accent);stroke-width:1.25;stroke-dasharray:6 4}
.d-txt{fill:var(--ink);font-size:13px;font-weight:600}
.d-sub{fill:var(--muted);font-size:11px;font-family:var(--f-mono)}
.d-blabel{fill:var(--accent);font-size:11px;font-family:var(--f-mono)}
.d-edge{stroke:var(--ink);stroke-width:1.5;fill:none}
.d-bad{stroke:var(--danger);stroke-width:1.5;fill:none;stroke-dasharray:4 3}
.d-head{fill:var(--ink)}.d-head-bad{fill:var(--danger)}
.d-num{fill:var(--surface);stroke:var(--ink);stroke-width:1.25}
.d-num-bad{fill:var(--surface);stroke:var(--danger);stroke-width:1.25}
.d-numt{fill:var(--ink);font-size:10px;font-weight:700;font-family:var(--f-mono)}

.refs{margin-top:2rem;padding:1rem;border:1px solid var(--line);border-radius:6px;background:var(--surface)}
.refs h4{margin:0 0 .5rem;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-family:var(--f-mono);font-weight:500}
.refs ul{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:.5rem}
.refs li{font-family:var(--f-mono);font-size:.78rem;padding:.2rem .5rem;border:1px solid var(--line);border-radius:4px}
.tags-row{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.5rem}

/* services */
.svc-group{padding-block:1.5rem;border-bottom:1px solid var(--line);display:grid;grid-template-columns:9rem 1fr;gap:1rem 1.5rem}
.svc-group h2{align-self:start;font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;margin:.3rem 0 0;font-family:var(--f-mono);font-weight:500;display:flex;align-items:center;gap:.45rem}
.svc{display:grid;gap:1.1rem;min-width:0}
.svc h3{margin:0;font-size:1.05rem;font-weight:600}
.svc p{margin:.15rem 0 0;font-family:var(--f-body);color:var(--muted)}
.svc .fmt{color:var(--accent)}
@media (max-width:540px){.svc-group{grid-template-columns:1fr}}
.contact{margin-top:2rem;padding:1.25rem;border-radius:8px;background:var(--accent-soft);display:flex;flex-wrap:wrap;gap:.75rem 1.25rem;align-items:center;justify-content:space-between}
.contact p{margin:0;font-family:var(--f-body);max-width:28rem}
.email{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.email code{font-family:var(--f-mono);font-size:.9rem;user-select:all}
.btn{font:inherit;font-size:.85rem;font-weight:600;border:0;background:var(--accent);color:var(--bg);padding:.45rem .9rem;border-radius:6px;cursor:pointer}

.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:1rem;margin-top:2rem}
.facts div{border-top:2px solid var(--ink);padding-top:.6rem}
.facts dt{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:.7rem;font-family:var(--f-mono)}
.facts dd{margin:.25rem 0 0}


/* language */
.tools{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.5rem}
.lang-switch{display:inline-flex;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.lang-switch button{font:inherit;font-size:.8rem;background:var(--surface);color:var(--muted);border:0;padding:.25rem .6rem;cursor:pointer}
.lang-switch button+button{border-left:1px solid var(--line)}
.lang-switch button[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.langs{display:inline-flex;gap:.25rem}
.langs span{font-size:.66rem;padding:0 .3rem;border-radius:3px;color:var(--muted);border:1px dashed var(--line)}
.langs span.on{border-style:solid;color:var(--ink)}
.check{display:inline-flex;align-items:center;gap:.45rem;font-size:.88rem;color:var(--muted);cursor:pointer}
.check input{accent-color:var(--accent)}
.notice{font-size:.9rem;color:var(--muted);background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:.6rem .85rem;margin-bottom:1.25rem;display:flex;flex-wrap:wrap;gap:.35rem .9rem;align-items:center}
.notice a{color:var(--accent);font-weight:500}
:lang(zh) .intro h1,:lang(zh) article h1{letter-spacing:0;line-height:1.3}
:lang(zh) .prose{line-height:1.85}

/* images, audio, embeds, apps, discussion */
.eyebrow{color:var(--accent);text-transform:uppercase;letter-spacing:.1em;font-size:.72rem}
figure.image{margin:1.5rem 0}
figure.image img{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:8px;background:var(--surface)}
figure.image figcaption{font-family:var(--f-display);font-size:.88rem;color:var(--muted);margin-top:.5rem}
figure.audio{margin:1.25rem 0;padding:1rem;border:1px solid var(--line);border-radius:8px;background:var(--surface);display:grid;gap:.6rem;font-family:var(--f-display)}
figure.audio figcaption{display:grid;gap:.1rem}
figure.audio b{font-size:1rem;line-height:1.3}
figure.audio .sub{color:var(--muted)}
figure.audio audio{width:100%}
.chapters{list-style:none;margin:.2rem 0 0;padding:0;display:grid;gap:.15rem;font-size:.92rem}
.chapters li{display:flex;gap:.7rem;align-items:baseline}
.chapters button{font-size:.78rem;background:none;border:0;padding:.1rem 0;color:var(--accent);cursor:pointer;font-variant-numeric:tabular-nums;min-width:3.2rem;text-align:left}
.chapters button:hover{text-decoration:underline}
.pod-links{display:flex;flex-wrap:wrap;gap:.4rem .9rem;align-items:center;font-size:.85rem;color:var(--muted);padding-top:.5rem;border-top:1px solid var(--line)}
.pod-links a{color:var(--accent);font-weight:600;text-decoration:none}
.prose details{margin:1.25rem 0;border:1px solid var(--line);border-radius:8px;background:var(--surface);padding:.6rem 1rem;font-size:1rem}
.prose details summary{cursor:pointer;font-family:var(--f-display);font-weight:600}
.prose details[open] summary{margin-bottom:.5rem}
.embed{margin-top:1.25rem;aspect-ratio:16/9;max-width:100%;border-radius:8px;overflow:hidden;border:1px solid var(--line);background:var(--surface)}
.embed iframe{width:100%;height:100%;border:0;display:block}
.embed+.video{margin-top:.5rem}
.appbox{margin:1.25rem 0;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--surface)}
.appbox .code-bar a{color:var(--accent);text-decoration:none;font-size:.75rem}
.appbox iframe{display:block;width:100%;border:0;background:var(--surface)}
.discuss{margin-top:1.25rem;padding:1rem;border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:0 6px 6px 0;background:var(--surface)}
.discuss h4{margin:0 0 .25rem;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-family:var(--f-mono);font-weight:500}
.discuss p{margin:0 0 .6rem;font-family:var(--f-body);font-size:.98rem}
.discuss .links{display:flex;flex-wrap:wrap;gap:.5rem}
.discuss .links a{font-size:.88rem;font-weight:600;text-decoration:none;color:var(--accent);border:1px solid var(--line);border-radius:999px;padding:.25rem .8rem;background:var(--bg)}
.discuss .links a:hover{border-color:var(--accent)}
footer nav{display:flex;flex-wrap:wrap;gap:.9rem}
footer nav a{color:var(--muted);text-decoration:none}
footer nav a:hover{color:var(--accent)}
/* repo + file cards, table of contents */
.card-link{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.9rem;align-items:center;margin-block:.75rem;padding:.9rem 1rem;border:1px solid var(--line);border-radius:8px;background:var(--surface);text-decoration:none;font-family:var(--f-display)}
.card-link:hover{border-color:var(--accent)}
.card-link .txt{display:grid;gap:.15rem;min-width:0}
.card-link b{font-size:.98rem;line-height:1.3;overflow-wrap:anywhere}
.card-link .desc{font-family:var(--f-body);color:var(--muted);font-size:.95rem}
.card-link .sub{color:var(--muted)}
.card-link .go{color:var(--accent);white-space:nowrap}
.card-link .ico{width:2.6rem;height:2.6rem;border-radius:8px;background:var(--accent-soft);display:grid;place-items:center}
.card-link .ico svg{width:1.3rem;height:1.3rem;fill:none;stroke:var(--accent);stroke-width:1.8;stroke-linecap:round}
.card-link .ext{width:2.6rem;height:3.1rem;border-radius:4px 12px 4px 4px;border:1.5px solid var(--muted);display:grid;place-items:end center;padding-bottom:.35rem;font-size:.62rem;font-weight:500;color:var(--ink)}
.card-link .ext[data-ext="pdf"]{border-color:var(--danger);color:var(--danger)}
@media (max-width:540px){.card-link{grid-template-columns:auto minmax(0,1fr)}.card-link .go{grid-column:2}}
.toc{margin:0 0 1.75rem;padding:.8rem 1rem;border:1px solid var(--line);border-radius:8px;background:var(--surface);font-family:var(--f-display)}
.toc summary{cursor:pointer;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:.72rem}
.toc ol{list-style:none;margin:.6rem 0 0;padding:0;display:grid;gap:.3rem;counter-reset:toc}
.toc li.h2{counter-increment:toc}
.toc li.h2 a::before{content:counter(toc) ". ";color:var(--muted);font-family:var(--f-mono);font-size:.8em}
.toc li.h3{padding-left:1.4rem;font-size:.92rem}
.toc a{text-decoration:none;color:var(--ink)}
.toc a:hover{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.prose h2,.prose h3{scroll-margin-top:1rem}
.prose h2:focus,.prose h3:focus{outline:none}
/* photo slideshow */
.gallery{margin:1.25rem 0;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--surface);font-family:var(--f-display)}
.gallery:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.g-slide{margin:0}
.g-img{aspect-ratio:3/2;max-width:100%;background:var(--code-bg);display:grid;place-items:center;overflow:hidden}
.g-img img{width:100%;height:100%;object-fit:contain;display:block;cursor:pointer;border-radius:0}
.g-slide figcaption{padding:.6rem .9rem 0;font-size:.9rem;color:var(--muted)}
.g-bar{display:flex;align-items:center;gap:.6rem;padding:.6rem .7rem}
.g-btn{font:inherit;font-size:.9rem;background:var(--bg);border:1px solid var(--line);color:var(--ink);border-radius:4px;padding:.15rem .65rem;cursor:pointer}
.g-btn:hover{border-color:var(--muted)}
.g-dots{display:flex;gap:.35rem;flex:1;justify-content:center;flex-wrap:wrap}
.g-dots button{width:.55rem;height:.55rem;padding:0;border-radius:50%;border:1px solid var(--muted);background:transparent;cursor:pointer}
.g-dots button[aria-current="true"]{background:var(--accent);border-color:var(--accent)}
.g-bar .ctr{color:var(--muted);font-variant-numeric:tabular-nums;min-width:3.2rem;text-align:right}
.page-gallery{margin-top:.5rem;margin-bottom:1.5rem}
.page-gallery h2{margin:0;font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-family:var(--f-mono);font-weight:500}
/* boundaries on the talks page */
.boundaries{margin-top:2rem;padding:1.1rem 1.25rem;border:1px solid var(--line);border-radius:8px;background:var(--surface)}
.boundaries h2{margin:0 0 .5rem;font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-family:var(--f-mono);font-weight:500}
.boundaries ul{margin:0;padding-left:1.1rem;display:grid;gap:.4rem;font-family:var(--f-body);font-size:.98rem}
/* sample marker + newsletter */
.sample-badge{display:inline-block;vertical-align:.2em;margin-right:.5rem;padding:.05rem .4rem;border:1px dashed var(--danger);border-radius:4px;color:var(--danger);font-size:.66rem;font-weight:500;text-transform:uppercase;letter-spacing:.08em}
.work-badge{display:inline-block;vertical-align:.2em;margin-right:.5rem;padding:.05rem .4rem;border:1px solid var(--accent);border-radius:4px;color:var(--accent);font-size:.66rem;font-weight:500;text-transform:uppercase;letter-spacing:.08em}
.notice.work{border-color:var(--accent)}
.notice.work .work-badge{vertical-align:0}
.notice.sample{border-style:dashed;border-color:var(--danger)}
.notice.sample .sample-badge{vertical-align:0}
.newsletter{margin-top:3rem;padding:1.25rem;border:1px solid var(--line);border-radius:8px;background:var(--surface);display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:center;justify-content:space-between}
.newsletter .nl-text{flex:1 1 20rem;min-width:0}
.newsletter h2{margin:0 0 .2rem;font-size:1.05rem}
.newsletter p{margin:0;font-family:var(--f-body);color:var(--muted)}
.newsletter .nl-hint{margin-top:.5rem;font-family:var(--f-display);font-size:.82rem}
.newsletter code{font-family:var(--f-mono);font-size:.9em;color:var(--ink);user-select:all;overflow-wrap:anywhere}
.newsletter .nl-privacy{margin-top:.5rem;font-family:var(--f-display);font-size:.78rem;line-height:1.5}
.nl-actions{display:flex;align-items:center;gap:1rem}
.nl-actions .btn{text-decoration:none;display:inline-block}
.nl-unsub{color:var(--muted);font-size:.85rem}
.nl-unsub:hover{color:var(--ink)}
footer{margin-top:1.5rem;padding-top:1.25rem;border-top:1px solid var(--line);color:var(--muted);display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem}
@media (prefers-reduced-motion:no-preference){.view{animation:in .25s ease-out}@keyframes in{from{transform:translateY(4px)}to{transform:none}}}