/* Confluence site, Variant A: book pages inside Ochre Moon. One stylesheet for the whole site.
   Fonts are Source Serif 4 and Source Sans 3 (SIL Open Font License), served from ../assets/fonts. */
@font-face{font-family:"Source Serif 4";src:url("../assets/fonts/source-serif-4-regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url("../assets/fonts/source-serif-4-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url("../assets/fonts/source-serif-4-semibold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Source Serif 4 Display";src:url("../assets/fonts/source-serif-4-display-light.woff2") format("woff2");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"Source Serif 4 Display";src:url("../assets/fonts/source-serif-4-display-regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Source Serif 4 Subhead";src:url("../assets/fonts/source-serif-4-subhead-semibold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url("../assets/fonts/source-sans-3-regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url("../assets/fonts/source-sans-3-semibold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
:root{--paper:#ffffff;--ink:#16130f;--ink-soft:#4d463e;--accent:#a6462c;--link:#16130f;--link-hover:#8a3a24;--focus:#8a3a24;--tint:#f3e2da;--land:#f5f3ef;--rule:#cfc8c0;--chip:#f1ede8;--track:#ebe6df;--tick:#c7bfb5;--btn-bg:#16130f;--btn-fg:#ffffff;--btn-hover:#a6462c;--ph-bg:#efedea;--ph-border:#857e75;--fig-bg:#ffffff;--scrim:rgb(12 10 8 / .62);--imprint-bg:#0c0a08;--imprint-fg:#f0e6d3;--imprint-rule:#0c0a08;--imprint-hover:#e9a35a;--foot-bg:#0c0a08;--foot-fg:#f0e6d3;--foot-muted:#c9baa2;--foot-link:#f0e6d3;--foot-accent:#c8762a;color-scheme:light}

:root{
/* Layout: one reading column of about 66 characters; the home page pairs the book's cover with the download panel. */
--serif:"Source Serif 4",Georgia,"Times New Roman",serif;
--display:"Source Serif 4 Display","Source Serif 4",Georgia,serif;
--subhead:"Source Serif 4 Subhead","Source Serif 4",Georgia,serif;
--sans:"Source Sans 3","Segoe UI","Helvetica Neue",Arial,sans-serif;
--text-s:1.125rem;--text-m:1.25rem;--text-l:1.5rem;--text-xl:1.75rem;
--text-h1:clamp(2.5rem,1.8rem + 3vw,3.75rem);
--text-cover:clamp(4rem,2.4rem + 7vw,7.5rem);
--s1:.5rem;--s2:1rem;--s3:1.5rem;--s4:2.5rem;--s5:4rem;--s6:6rem;
--measure:61ch;--wide:75rem;--radius:6px;
--gutter-l:max(clamp(16px,4vw,48px),env(safe-area-inset-left,0px));
--gutter-r:max(clamp(16px,4vw,48px),env(safe-area-inset-right,0px));
--ease:cubic-bezier(.2,.7,.2,1);
}
@media (max-width:30em){:root{--text-m:1.1875rem;--text-l:1.375rem}}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);font-size:var(--text-m);line-height:1.65;font-kerning:normal;overflow-wrap:break-word}
img{max-width:100%;height:auto;display:block}
.wrap{max-width:var(--wide);margin-inline:auto;padding-left:var(--gutter-l);padding-right:var(--gutter-r)}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0}
.skip:focus{left:var(--gutter-l);top:.5rem;z-index:100;background:var(--paper);color:var(--ink);padding:.75rem 1rem;font:600 1.125rem var(--sans)}
a{color:var(--link);text-decoration-line:underline;text-decoration-thickness:2px;text-underline-offset:.2em;text-decoration-color:var(--accent)}
a:hover{color:var(--link-hover);text-decoration-thickness:3px}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:3px}
p{margin:0 0 1em}
strong{font-weight:600}
/* Book titles in running text are italic; inside italic text they turn upright. */
cite{font-style:italic}
.lede cite{font-style:normal}
.foot-title cite{font-family:var(--serif)}

.mockup-note{margin:0;background:#fdf0d5;color:#4a3410;font:600 1rem/1.4 var(--sans);text-align:center;padding:.5rem var(--gutter-r) .5rem var(--gutter-l)}
.tbd{border-bottom:2px dashed var(--accent);font-style:italic}
.not-live{display:inline-block;align-self:flex-start;margin-top:.45rem;font:600 .9375rem/1.2 var(--sans);letter-spacing:.03em;padding:.15rem .5rem;border:1.5px dashed currentColor;border-radius:4px}

.imprint{background:var(--imprint-bg);color:var(--imprint-fg);border-bottom:1px solid var(--imprint-rule)}
.imprint-inner{display:flex;align-items:center;min-height:48px}
.imprint a{color:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:.6rem;min-height:44px;font:600 1rem/1.2 var(--sans);letter-spacing:.08em;text-transform:uppercase}
.imprint a:hover{color:var(--imprint-hover)}
.moon{display:inline-block;width:1.15em;height:1.15em;border-radius:50%;flex:none;background:radial-gradient(circle at 34% 32%,#f1b56d 0,#c8762a 52%,#8a4a14 100%)}

.site-head{border-bottom:1px solid var(--rule);background:var(--paper)}
.head-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem 2rem;padding-block:1rem}
.head-inner.no-title{justify-content:flex-end}
.site-title{display:flex;flex-direction:column;justify-content:center;min-height:44px;color:var(--ink);text-decoration:none}
.site-name{font:400 2.125rem/1 var(--display)}
.site-sub{font:600 1rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-top:.4rem}
.nav{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.25rem}
.nav a{display:inline-flex;align-items:center;min-height:44px;padding:.4rem .75rem;font:600 1.125rem/1.2 var(--sans);color:var(--ink);text-decoration:none;border-radius:var(--radius)}
.nav a:hover{background:var(--tint);color:var(--ink)}
.nav a[aria-current="page"]{box-shadow:inset 0 -3px 0 var(--accent);border-radius:var(--radius) var(--radius) 0 0}
@media (max-width:40em){.head-inner.no-title{justify-content:flex-start}.nav a{background:var(--chip)}}

main{display:block;padding-bottom:var(--s6)}
.page-head{padding-block:var(--s4) var(--s3)}
.eyebrow{font:600 1rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin:0 0 .75rem}
h1{font:300 var(--text-h1)/1.08 var(--display);margin:0;text-wrap:balance;letter-spacing:-.005em}
.lede{font:italic 400 var(--text-l)/1.5 var(--serif);color:var(--ink-soft);max-width:var(--measure);margin:var(--s3) 0 0}
h2{font:600 var(--text-xl)/1.2 var(--subhead);margin:var(--s5) 0 var(--s2);text-wrap:balance}
h2::before{content:"";display:block;width:22px;height:3px;background:var(--accent);margin-bottom:.8rem}
h3{font:600 var(--text-l)/1.25 var(--sans);margin:var(--s4) 0 var(--s1)}
.prose{max-width:var(--measure)}
.prose ul,.prose ol{padding-left:1.3em;margin:0 0 1em}
.prose li+li{margin-top:.45em}
.steps li{padding-left:.2em}
.steps li+li{margin-top:.6em}
.note-small{font:400 var(--text-s)/1.5 var(--sans);color:var(--ink-soft);margin-top:var(--s4)}

.actions{list-style:none;margin:0;padding:0;display:grid;gap:.75rem}
.btn{display:flex;flex-direction:column;gap:.2rem;justify-content:center;min-height:64px;padding:.9rem 1.25rem;border-radius:var(--radius);background:var(--btn-bg);color:var(--btn-fg);border:2px solid var(--btn-bg);text-decoration:none;transition:background-color .15s var(--ease),border-color .15s var(--ease)}
.btn:hover{background:var(--btn-hover);border-color:var(--btn-hover);color:var(--btn-fg)}
.btn:active{transform:translateY(1px)}
.btn-label{font:600 1.25rem/1.25 var(--sans)}
.btn-detail{font:400 1.125rem/1.4 var(--sans)}
.btn-quiet{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn-quiet:hover{background:var(--tint);color:var(--ink);border-color:var(--ink)}

.home-hero{display:grid;gap:var(--s4);padding-block:var(--s3) var(--s5)}
.cover{text-align:center;container-type:inline-size}
.cover-title{font:400 var(--text-cover)/1 var(--display);font-size:clamp(3rem,12vw,7rem);font-size:clamp(3rem,18cqi,8rem);letter-spacing:-.01em;margin:var(--s2) 0 0;white-space:nowrap}
.cover-sub{font:600 clamp(1rem,.85rem + .6vw,1.3rem)/1.35 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin:1.1rem 0 2rem}
.cover-band{margin:0}
.cover-band figcaption{font:400 1.125rem/1.45 var(--sans);color:var(--ink-soft);margin-top:.6rem;text-align:left}
.cover-author{font:600 clamp(1rem,.9rem + .4vw,1.2rem)/1.3 var(--sans);letter-spacing:.24em;text-transform:uppercase;margin:1.75rem 0 0}
@media (max-width:30em){.cover-sub{letter-spacing:.12em;font-size:.95rem}}
@media (max-width:59.99em){.cover-band img{width:calc(100% + var(--gutter-l) + var(--gutter-r));max-width:none;margin-left:calc(-1 * var(--gutter-l))}}
@media (min-width:60em){.home-hero{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:var(--s5);align-items:start}.get{padding-top:var(--s4)}}
.get{display:grid;gap:var(--s3);align-content:start}
.get p{margin:0}
.get-lede{font:400 var(--text-l)/1.5 var(--serif)}
.get-free{font:600 var(--text-m)/1.5 var(--serif)}
.before{border:1px solid var(--rule);background:var(--land);border-radius:var(--radius);padding:1rem 1.25rem;font:400 var(--text-s)/1.5 var(--sans)}
.before.wide{max-width:var(--measure);margin-bottom:var(--s4)}
.before p{margin:0}
.before-label{font:600 1rem/1.3 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin:0 0 .35rem!important}
.help,.edition{font:400 var(--text-s)/1.5 var(--sans)}

.band-section{padding-block:var(--s2)}
.split{display:grid;gap:var(--s3) var(--s5);align-items:end}
@media (min-width:60em){.split{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}}
.ribbon-wrap{margin:var(--s3) 0 var(--s4)}
.ribbon{list-style:none;margin:0;padding:0;display:grid;gap:.85rem}
.span a{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:0 1rem;min-height:44px;font:600 1.125rem/1.3 var(--sans);color:var(--ink);text-decoration:none}
.span a:hover .span-name{text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px}
.span-years{font-weight:400;color:var(--ink-soft);font-variant-numeric:tabular-nums}
.track{display:block;position:relative;height:12px;margin-top:.3rem;border-radius:6px;background:linear-gradient(90deg,transparent 4.85%,var(--tick) 4.85% 5.15%,transparent 5.15% 29.85%,var(--tick) 29.85% 30.15%,transparent 30.15% 54.85%,var(--tick) 54.85% 55.15%,transparent 55.15% 79.85%,var(--tick) 79.85% 80.15%,transparent 80.15%),var(--track)}
.bar{position:absolute;top:0;bottom:0;left:calc((var(--from) - 1630) / 400 * 100%);width:max(8px,calc((var(--to) - var(--from)) / 400 * 100%));background:var(--accent);border-radius:6px}
.ribbon-axis{position:relative;height:2rem;margin-top:.6rem;font:400 1rem/1 var(--sans);color:var(--ink-soft);font-variant-numeric:tabular-nums}
.ribbon-axis span{position:absolute;top:.3rem;left:calc((var(--at) - 1630) / 400 * 100%);transform:translateX(-50%)}
.ribbon-wrap.compact .ribbon{gap:.55rem}
.ribbon-wrap.compact .span a{min-height:44px}

.link-cards{list-style:none;margin:var(--s3) 0 0;padding:0;display:grid;gap:var(--s3);grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr))}
.link-cards a{display:flex;flex-direction:column;gap:.4rem;height:100%;padding:1.1rem 0 1rem;border-top:3px solid var(--ink);color:var(--ink);text-decoration:none}
.link-cards a:hover .card-title{text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px}
.card-title{font:600 var(--text-l)/1.25 var(--subhead)}
.card-text{font:400 var(--text-s)/1.5 var(--sans);color:var(--ink-soft)}

.formats{display:grid;gap:var(--s4);grid-template-columns:repeat(auto-fit,minmax(min(100%,24rem),1fr));align-items:start}
.format h2{margin-top:var(--s2)}
.format>p{max-width:var(--measure)}
.format.recommended{position:relative}
.pick{display:inline-block;font:600 1rem/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--paper);background:var(--accent);padding:.3rem .6rem;border-radius:4px;margin:0}
.facts{display:flex;flex-wrap:wrap;gap:.5rem 2rem;margin:0 0 var(--s3);font:400 var(--text-s)/1.4 var(--sans)}
.facts div{display:flex;flex-direction:column}
.facts dt{font:600 1rem/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
.facts dd{margin:0;overflow-wrap:anywhere}
.facts.stacked{flex-direction:column;gap:.9rem}

.device-section{margin-top:var(--s2)}
.devices{list-style:none;margin:var(--s3) 0 0;padding:0;display:grid;gap:.75rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,17rem),1fr))}
.devices a{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:64px;padding:.9rem 1.25rem;border:2px solid var(--ink);border-radius:var(--radius);font:600 1.25rem/1.25 var(--sans);color:var(--ink);text-decoration:none}
.devices a:hover{background:var(--tint)}
.device-more{font:400 1.125rem/1.2 var(--sans);color:var(--ink-soft);white-space:nowrap}
.device-help{display:none}
.device-help:target{display:grid;place-items:center;position:fixed;inset:0;z-index:60;padding:max(1rem,env(safe-area-inset-top,0px)) var(--gutter-r) max(1rem,env(safe-area-inset-bottom,0px)) var(--gutter-l);background:var(--scrim)}
body:has(.device-help:target){overflow:hidden}
.backdrop{position:absolute;inset:0}
.help-card{position:relative;width:min(100%,42rem);max-height:100%;overflow:auto;background:var(--paper);color:var(--ink);border-radius:10px;padding:var(--s3) var(--s3) var(--s4);box-shadow:0 24px 64px rgb(0 0 0 / .35)}
.help-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}
.help-head h2{margin:0}
.close{display:inline-flex;align-items:center;flex:none;min-height:44px;padding:.4rem 1rem;border:2px solid var(--ink);border-radius:var(--radius);font:600 1.125rem/1.2 var(--sans);color:var(--ink);text-decoration:none}
.close:hover{background:var(--tint);color:var(--ink)}
.help-card h3{margin-top:var(--s3)}
.help-card ol{padding-left:1.4em}

.split-about{display:grid;gap:var(--s4)}
@media (min-width:60em){.split-about{grid-template-columns:minmax(0,1fr) minmax(16rem,22rem);gap:var(--s5)}}
.glance{align-self:start}
@media (min-width:60em){.glance{position:sticky;top:1.5rem}}

.pull{margin:var(--s3) 0;padding:0}
.pull p{font:italic 400 var(--text-xl)/1.4 var(--serif);margin:0 0 .5rem}
.pull footer{font:400 1.125rem/1.4 var(--sans);color:var(--ink-soft)}
.legend p{display:flex;gap:.75rem;align-items:flex-start;font:400 var(--text-s)/1.5 var(--sans);color:var(--ink-soft)}
.legend .line-names{display:none}
.chapter{grid-template-columns:minmax(0,1fr)}
.opening h2{margin-top:var(--s2)}
.part{margin-top:var(--s5);max-width:var(--measure);scroll-margin-top:1rem}
.part h2{margin-top:0}
.part .eyebrow{margin-bottom:.5rem}
.part-intro{font:italic 400 var(--text-m)/1.6 var(--serif);color:var(--ink-soft)}
.chapters{list-style:none;margin:var(--s3) 0 0;padding:0;border-top:1px solid var(--rule)}
.chapter{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.15rem 1rem;padding:.9rem 0;border-bottom:1px solid var(--rule)}
.ch-tag{grid-column:1/-1;font:600 1rem/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.ch-title{font:600 var(--text-m)/1.35 var(--serif)}
.ch-meta{grid-column:1;font:400 1.125rem/1.45 var(--sans);color:var(--ink-soft)}
.chapter .line-mark{grid-column:1;margin-top:.3rem}
.line-mark{display:inline-flex;align-items:center;gap:.55rem;font:400 1.125rem/1.3 var(--sans);color:var(--ink-soft)}
.line-mark svg{flex:none;overflow:visible}
.lm-quiet path{fill:none;stroke:var(--tick);stroke-width:1.6;stroke-linecap:round}
.lm-lit path{fill:none;stroke:var(--accent);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}

.figure{margin:0}
.figure img{background:var(--fig-bg);border:1px solid var(--rule)}
.figure figcaption{font:400 var(--text-s)/1.5 var(--sans);color:var(--ink-soft);margin-top:.75rem;max-width:var(--measure)}
.fig-link{display:block}
.fig-grid{display:grid;gap:var(--s5) var(--s4);grid-template-columns:repeat(auto-fit,minmax(min(100%,26rem),1fr));align-items:start}

.extra-grid{list-style:none;margin:var(--s4) 0;padding:0;display:grid;gap:var(--s4) var(--s3);grid-template-columns:repeat(auto-fill,minmax(min(100%,19rem),1fr))}
.extra{display:flex;flex-direction:column;gap:.6rem}
.placeholder{aspect-ratio:4/3;max-width:100%;display:grid;place-items:center;text-align:center;padding:1rem;border:2px dashed var(--ph-border);background:var(--ph-bg);border-radius:var(--radius);font:600 1rem/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
.extra-caption{font:400 var(--text-s)/1.5 var(--sans);margin:0}
.status{align-self:flex-start;font:600 1rem/1.2 var(--sans);padding:.3rem .65rem;border-radius:999px;background:var(--chip);color:var(--ink);margin:0}
.extra-pic{display:block;background:var(--fig-bg);border:1px solid var(--rule);border-radius:var(--radius);overflow:hidden}
.extra-pic img{width:100%;aspect-ratio:4/3;object-fit:contain;background:var(--fig-bg)}
.credit{display:block;color:var(--ink-soft);margin-top:.25rem}
.send-box{border:2px solid var(--ink);border-radius:var(--radius);padding:1rem 1.25rem;margin:var(--s3) 0}
.send-box p{margin:0 0 .4rem}
.send-address{font:600 var(--text-l)/1.3 var(--sans);overflow-wrap:anywhere}
.placeholder-box{border:2px dashed var(--ph-border);background:var(--ph-bg);border-radius:var(--radius);padding:1rem 1.25rem;margin:var(--s3) 0}
.placeholder-box p{margin:0}

.table-wrap{overflow-x:auto;margin:var(--s2) 0 var(--s3)}
table{border-collapse:collapse;width:100%;min-width:36rem;font:400 var(--text-s)/1.45 var(--sans)}
th,td{text-align:left;vertical-align:top;padding:.75rem .9rem .75rem 0;border-bottom:1px solid var(--rule)}
thead th{font:600 1rem/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);border-bottom:2px solid var(--ink)}
tr.example td{color:var(--ink-soft)}
.example-tag{font-weight:600}
.empty{font:italic 400 var(--text-m)/1.5 var(--serif);color:var(--ink-soft)}
.columns{columns:2 18rem;column-gap:2.5rem}
.columns li{break-inside:avoid}

.site-foot{background:var(--foot-bg);color:var(--foot-fg);padding-block:var(--s5) var(--s4)}
.site-foot a{color:var(--foot-link);text-decoration-color:var(--foot-accent)}
.foot-inner{display:grid;gap:var(--s3)}
@media (min-width:50em){.foot-inner{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr)}}
.foot-book{font:400 var(--text-s)/1.5 var(--sans)}
.foot-title{font:400 1.625rem/1.2 var(--display);margin:0 0 .5rem}
.foot-links{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(13rem,1fr));gap:0 1.5rem}
.foot-links a{display:inline-flex;align-items:center;min-height:44px;font:600 1.125rem/1.3 var(--sans)}
.foot-imprint{grid-column:1/-1;display:flex;align-items:center;gap:.6rem;margin:0;font:600 1rem/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase}
.foot-imprint a{text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.foot-small{grid-column:1/-1;margin:0;font:400 1.125rem/1.5 var(--sans);color:var(--foot-muted)}

@media (prefers-reduced-motion:reduce){*{transition:none!important}}
@media print{
.mockup-note,.imprint,.nav,.skip,.devices,.site-foot nav,.not-live,.backdrop,.close{display:none!important}
body{background:#fff;color:#000;font-size:12pt}
.btn{background:none!important;color:#000!important;border:1px solid #000}
a[href^="http"]::after{content:" (" attr(href) ")";font:9pt var(--sans);word-break:break-all}
.device-help{display:block!important;position:static!important;background:none!important;padding:0!important}
.help-card{box-shadow:none;max-height:none;padding:0;width:auto}
.site-foot{background:none;color:#000}
.home-hero{display:block}
.cover-band img{width:60%;margin:0 auto}
}
