@font-face{font-family:Vollkorn;src:url(fonts/Vollkorn.woff2) format("woff2");font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:Vollkorn;src:url(fonts/Vollkorn-Italic.woff2) format("woff2");font-weight:400 900;font-style:italic;font-display:swap}

:root{
  --night:#191428;
  --night-2:#231c38;
  --violet:#4a3b72;
  --plum:#6b4a72;
  --ember:#e2774a;
  --ember-hi:#f2945f;
  --gold:#e8c46f;
  --wheat:#b48a3c;
  --wool:#f5ecd9;
  --wool-dim:#cfc3ab;
  --soil:#21180f;
  --grass:#5b6a3a;
  --ink:#2a2018;
  --s1:4px;--s2:8px;--s3:16px;--s4:24px;--s5:40px;--s6:64px;--s7:104px;
  --t-xs:.875rem;--t-sm:1rem;--t-md:1.1875rem;--t-lg:1.625rem;--t-xl:2.5rem;--t-2xl:clamp(2.6rem,5.6vw,4.4rem);--t-hero:clamp(3.6rem,11.5vw,9.25rem);--t-cap:1.0625rem;
  --wrap:1120px;
  --px:4px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--night);color:var(--wool);font-family:Vollkorn,"Iowan Old Style","Palatino Linotype",Georgia,serif;font-size:var(--t-md);line-height:1.6;font-variant-numeric:oldstyle-nums proportional-nums;font-kerning:normal;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:var(--gold);text-underline-offset:3px;text-decoration-thickness:2px}
a:hover{color:var(--ember-hi)}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
h1,h2,h3{font-weight:800;line-height:1.02;margin:0;text-wrap:balance;letter-spacing:-.012em;font-variant-numeric:lining-nums}
em{font-style:italic}
h1 em,h2 em{font-weight:500;letter-spacing:-.02em}
p{margin:0 0 var(--s3);text-wrap:pretty}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--s4)}
.caps{font-variant-caps:all-small-caps;letter-spacing:.06em}
.pixel{image-rendering:pixelated;image-rendering:crisp-edges}

/* Top bar */
.bar{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .3s,box-shadow .3s}
.bar.solid{background:rgba(25,20,40,.92);backdrop-filter:blur(6px);box-shadow:0 2px 0 rgba(0,0,0,.35)}
.bar .wrap{display:flex;align-items:center;gap:var(--s4);height:60px}
.brand{display:flex;align-items:center;gap:var(--s2);color:var(--wool);text-decoration:none;font-weight:800;font-size:var(--t-md);letter-spacing:-.005em;white-space:nowrap}
.brand img{width:32px;height:32px}
.nav{display:flex;gap:var(--s4);margin-left:auto;overflow-x:auto;scrollbar-width:none;font-size:var(--t-cap);font-variant-caps:all-small-caps;letter-spacing:.08em;font-weight:600}
.nav::-webkit-scrollbar{display:none}
.nav a{color:var(--wool-dim);text-decoration:none;white-space:nowrap;padding:var(--s2) 0;border-bottom:2px solid transparent}
.nav a:hover,.nav a.on{color:var(--wool);border-color:var(--ember)}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:var(--s2);font-variant-caps:all-small-caps;font-weight:700;letter-spacing:.07em;font-size:1.25rem;line-height:1;text-decoration:none;padding:16px 24px 17px;border:0;cursor:pointer;color:var(--ink);background:var(--gold);
  box-shadow:0 var(--px) 0 #9c7a2c,0 calc(var(--px)*2) 0 rgba(0,0,0,.35);transform:translateY(0);transition:transform .12s,box-shadow .12s,background .2s;
  clip-path:polygon(var(--px) 0,calc(100% - var(--px)) 0,calc(100% - var(--px)) var(--px),100% var(--px),100% calc(100% - var(--px)),calc(100% - var(--px)) calc(100% - var(--px)),calc(100% - var(--px)) 100%,var(--px) 100%,var(--px) calc(100% - var(--px)),0 calc(100% - var(--px)),0 var(--px),var(--px) var(--px))}
.btn:hover{background:#f3d488;color:var(--ink);transform:translateY(-2px)}
.btn:active{transform:translateY(2px)}
.btn.ember{background:var(--ember);color:var(--wool);box-shadow:0 var(--px) 0 #9f4826,0 calc(var(--px)*2) 0 rgba(0,0,0,.35)}
.btn.ember:hover{background:var(--ember-hi);color:var(--wool)}
.btn.discord{background:#5865f2;color:#fff;box-shadow:0 var(--px) 0 #3c45b0,0 calc(var(--px)*2) 0 rgba(0,0,0,.35)}
.btn.discord:hover{background:#6c78ff;color:#fff}
.btn svg{width:22px;height:22px;flex:none}

/* Hero */
.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:center;overflow:hidden;
  background:#4f3f78 url(assets/dusk.jpg) center bottom/cover no-repeat;image-rendering:pixelated}
.hero::after{content:"";position:absolute;inset:auto 0 0 0;height:22%;background:linear-gradient(to bottom,transparent,rgba(25,20,40,.0) 30%,var(--night));pointer-events:none}
.hero .wrap{position:relative;z-index:2;width:100%;padding-top:96px;padding-bottom:28vh}
.kicker{font-size:1.125rem;color:var(--gold);font-style:italic;font-weight:500;margin-bottom:var(--s3);text-shadow:0 2px 0 rgba(0,0,0,.45)}
.hero h1{font-size:var(--t-hero);font-weight:900;line-height:.9;letter-spacing:-.03em;color:var(--wool);
  text-shadow:var(--px) var(--px) 0 #2d2350,calc(var(--px)*2) calc(var(--px)*2) 0 rgba(20,14,34,.55)}
.hero .tag{font-size:clamp(1.25rem,2.4vw,1.7rem);line-height:1.4;font-weight:500;max-width:30ch;margin:var(--s4) 0 var(--s5);text-shadow:0 2px 0 rgba(30,20,50,.7)}
.ctas{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center}

.reveal{opacity:0;transform:translateY(18px);animation:rise .9s cubic-bezier(.2,.7,.2,1) forwards}
.r1{animation-delay:.1s}.r2{animation-delay:.25s}.r3{animation-delay:.4s}.r4{animation-delay:.55s}
@keyframes rise{to{opacity:1;transform:none}}

/* Procession across the hero field */
.field{position:absolute;left:0;right:0;bottom:9vh;height:calc(68px*var(--z));z-index:1;pointer-events:none;--z:2}
.walker{position:absolute;bottom:0;left:0;animation:cross var(--dur,34s) linear infinite;animation-delay:var(--d,0s)}
.sprite{width:68px;height:68px;background-repeat:no-repeat;image-rendering:pixelated;transform:scale(var(--z));transform-origin:bottom left;animation:frames var(--fd,.7s) steps(var(--n)) infinite}
@keyframes frames{from{background-position:0 0}to{background-position:calc(-68px*var(--n)) 0}}
@keyframes cross{from{transform:translateX(-160px)}to{transform:translateX(calc(100vw + 40px))}}
.s-sheep{background-image:url(assets/sprites/sheep_walk.png);--n:6}
.s-eat{background-image:url(assets/sprites/sheep_eat.png);--n:7;--fd:1.2s}
.s-david{background-image:url(assets/sprites/david_walk.png);--n:6}
.s-sling{background-image:url(assets/sprites/david_sling.png);--n:9;--fd:1.1s}
.s-shout{background-image:url(assets/sprites/david_shout.png);--n:7;--fd:1s}
.s-staff{background-image:url(assets/sprites/david_staff.png);--n:3;--fd:.6s}
.s-wolf{background-image:url(assets/sprites/wolf_walk.png);--n:6;--fd:.55s}

/* Hero vignette: a grazing sheep, a wolf, and David */
.vignette{position:absolute;left:0;right:0;bottom:9vh;height:calc(68px*var(--z));z-index:3;pointer-events:none;--z:2}
.actor{position:absolute;left:0;bottom:0;width:calc(68px*var(--z));height:calc(68px*var(--z));transform:translateX(-400px);will-change:transform;background:none;border:0;padding:0;margin:0}
.actor .sprite{position:absolute;left:0;bottom:0;filter:sepia(.42) saturate(1.2) brightness(.86) hue-rotate(-10deg)}
.grazer{pointer-events:auto;cursor:pointer}
.grazer:focus-visible{outline:3px solid var(--gold);outline-offset:4px}
.alarm{position:absolute;left:62%;top:-22px;font-weight:900;font-size:2.6rem;color:var(--wool);text-shadow:3px 3px 0 #2d2350;opacity:0;transform:translateY(8px) scale(.6);transition:opacity .15s,transform .25s cubic-bezier(.3,1.8,.5,1)}
.grazer.alarmed .alarm{opacity:1;transform:none}

/* Bands */
section{position:relative}
.band{padding:var(--s7) 0}
.eyebrow{font-variant-caps:all-small-caps;font-weight:700;letter-spacing:.16em;font-size:1.125rem;color:var(--ember-hi);margin-bottom:var(--s3);display:flex;align-items:center;gap:var(--s3)}
.eyebrow::before{content:"";width:28px;height:var(--px);background:currentColor;box-shadow:calc(var(--px)*-2) 0 0 currentColor}
h2{font-size:var(--t-2xl);margin-bottom:var(--s4);max-width:18ch}
.lede{font-size:clamp(1.2rem,1.7vw,1.375rem);line-height:1.55;max-width:54ch;color:var(--wool-dim)}
.lede b{font-weight:700}
.lede b{color:var(--wool);font-weight:700}

/* Psalm */
.psalm{padding:var(--s6) 0 var(--s7);text-align:center;background:var(--night)}
.stars{position:absolute;inset:0;pointer-events:none;opacity:.7;
  background-image:radial-gradient(2px 2px at 12% 30%,#fff8 50%,transparent 51%),radial-gradient(2px 2px at 28% 70%,#fff6 50%,transparent 51%),radial-gradient(2px 2px at 47% 22%,#fff9 50%,transparent 51%),radial-gradient(2px 2px at 63% 58%,#fff5 50%,transparent 51%),radial-gradient(2px 2px at 78% 26%,#fff8 50%,transparent 51%),radial-gradient(2px 2px at 91% 64%,#fff6 50%,transparent 51%),radial-gradient(2px 2px at 6% 82%,#fff5 50%,transparent 51%),radial-gradient(2px 2px at 54% 88%,#fff4 50%,transparent 51%)}
.psalm blockquote{position:relative;margin:0 auto;max-width:22ch;text-wrap:balance;font-size:clamp(2.3rem,5.2vw,4.1rem);font-style:italic;font-weight:500;line-height:1.08;letter-spacing:-.015em}
.psalm blockquote::before{content:"\201C";display:block;font-size:2.4em;line-height:.6;height:.42em;color:var(--ember);font-style:normal;font-weight:900}
.psalm cite{position:relative;display:block;margin-top:var(--s4);font-style:normal;color:var(--gold);font-size:var(--t-cap);font-variant-caps:all-small-caps;letter-spacing:.14em;font-weight:600}

/* Facts */
.about{background:linear-gradient(var(--night),var(--night-2))}
.about .grid{display:grid;grid-template-columns:1.15fr 1fr;gap:var(--s6);align-items:center}
.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s3)}
.fact{background:rgba(245,236,217,.05);border:2px solid rgba(245,236,217,.1);padding:var(--s4)}
.fact b{display:block;font-size:3rem;font-weight:900;color:var(--gold);line-height:1;letter-spacing:-.02em;font-variant-numeric:lining-nums;margin-bottom:6px}
.fact span{font-size:var(--t-sm);line-height:1.4;color:var(--wool-dim)}
.fact.wide{grid-column:1/-1;display:flex;align-items:center;gap:var(--s3)}
.fact.wide b{font-size:var(--t-lg)}

/* Flock */
.flock{background:var(--night-2)}
.flock .head{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);align-items:end;gap:var(--s5);margin-bottom:var(--s5)}
.flock .head h2{margin-bottom:0}
.flock .head .lede{max-width:44ch;margin:0}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--s4)}
.card{position:relative;background:var(--wool);color:var(--ink);padding:var(--s4) var(--s4) var(--s4);display:flex;flex-direction:column;
  box-shadow:0 var(--px) 0 var(--wool-dim),0 calc(var(--px)*3) 0 rgba(0,0,0,.3);transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.card::before{content:"";position:absolute;left:0;right:0;top:0;height:10px;background:var(--wool-c,#ccc)}
.card:hover{transform:translateY(-6px) rotate(-.6deg)}
.card .face{width:148px;height:148px;margin:var(--s3) auto var(--s3);transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.card:hover .face{transform:scale(1.07) rotate(3deg)}
.card .n{font-size:var(--t-sm);font-style:italic;color:#8c7a5a}
.card h3{font-size:1.75rem;font-weight:800;margin:0 0 var(--s2)}
.card p{font-size:1.0625rem;line-height:1.5;color:#4a3d2e;margin-bottom:var(--s3)}
.card .prob{margin-top:auto;font-size:1.0625rem;font-weight:600;font-style:italic;line-height:1.3;color:#9b4f2c;border-top:2px dashed #d8cbb0;padding-top:var(--s2)}
.card.hidden{background:#2b2342;color:var(--wool);box-shadow:0 var(--px) 0 #1b152b,0 calc(var(--px)*3) 0 rgba(0,0,0,.3)}
.card.hidden::before{background:repeating-linear-gradient(90deg,#d61fb0 0 12px,#3be0a4 12px 24px)}
.card.hidden .face{filter:brightness(0) drop-shadow(0 0 14px rgba(214,31,176,.55));opacity:.92}
.card.hidden .n{color:#a998c9}.card.hidden p{color:var(--wool-dim)}
.card.hidden .prob{color:#f07fd8;border-color:#463a63}

/* Tools */
.tools{background:linear-gradient(var(--night-2),#2a2140)}
.toolgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);margin-top:var(--s5)}
.tool{background:rgba(0,0,0,.18);border:2px solid rgba(245,236,217,.1);padding:var(--s4);display:flex;flex-direction:column}
.stage{height:150px;display:flex;align-items:end;justify-content:center;margin-bottom:var(--s3);background:linear-gradient(transparent 88%,rgba(91,106,58,.5) 88%);border-bottom:var(--px) solid var(--grass);overflow:hidden}
.stage .sprite{--z:2;transform-origin:bottom center;margin-bottom:-2px}
.tool h3{font-size:1.75rem;margin-bottom:var(--s2)}
.tool p{font-size:var(--t-sm);color:var(--wool-dim)}
.tool q{display:block;margin-top:auto;padding-top:var(--s2);color:var(--gold);font-style:italic;font-weight:500;font-size:var(--t-md);quotes:"\201C" "\201D"}

/* Reckoning */
.reckon{background:#2a2140}
.reckon .grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s6);align-items:start}
.ledger{background:var(--wool);color:var(--ink);padding:var(--s5) var(--s5) var(--s4);position:relative;transform:rotate(-1deg);box-shadow:0 calc(var(--px)*3) 0 rgba(0,0,0,.35)}
.ledger h3{font-size:var(--t-xl);font-weight:900;text-align:center;margin-bottom:var(--s4);letter-spacing:-.02em}
.ledger ol{list-style:none;margin:0;padding:0}
.ledger li{display:flex;align-items:baseline;gap:var(--s2);padding:6px 0;font-size:var(--t-md)}
.ledger li::after{content:"";order:1;flex:1;border-bottom:2px dotted #b9a888;transform:translateY(-4px)}
.ledger li b{order:2;font-variant-numeric:lining-nums tabular-nums;font-weight:700;color:#9b4f2c}
.ledger .total{border-top:3px solid var(--ink);margin-top:var(--s3);padding-top:var(--s3);font-weight:800;font-size:var(--t-lg)}
.ledger .stamp{position:absolute;right:-14px;top:-18px;transform:rotate(9deg);background:var(--ember);color:var(--wool);font-variant-caps:all-small-caps;font-weight:700;letter-spacing:.08em;padding:8px 14px 9px;font-size:var(--t-cap);line-height:1;box-shadow:0 var(--px) 0 #9f4826}
.ranks{list-style:none;margin:var(--s4) 0 0;padding:0;display:flex;flex-direction:column-reverse;gap:6px}
.ranks li{display:grid;grid-template-columns:11.5em 1fr;align-items:center;gap:var(--s3);font-size:var(--t-md);color:var(--wool-dim)}
.ranks li i{order:2;display:block;height:12px;background:linear-gradient(90deg,var(--wheat),var(--gold));width:calc(var(--w) * 1%);min-width:12px}
.ranks li:first-child{color:var(--wool)}
.ranks li:last-child{color:var(--gold);font-weight:700}
.shelf{margin-top:var(--s6);display:flex;gap:var(--s2);flex-wrap:wrap;justify-content:center;padding:var(--s4) var(--s3) 0;border-bottom:calc(var(--px)*3) solid #6b4a2c;box-shadow:0 calc(var(--px)*2) 0 #3e2a18}
.shelf img{width:72px;height:72px;transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.shelf img:hover{transform:translateY(-8px) scale(1.12)}
.shelf-cap{text-align:center;color:var(--wool-dim);font-size:var(--t-md);font-style:italic;margin-top:var(--s3)}

/* Jukebox */
.jukebox{background:radial-gradient(ellipse at 70% 40%,#5a3e6e,#2a2140 65%)}
.jukebox .grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s6);align-items:center}
.box{position:relative;justify-self:center;width:min(360px,100%);aspect-ratio:3/4;background:linear-gradient(#8a4f2a,#5a2f17);border-radius:180px 180px 12px 12px;padding:28px;box-shadow:inset 0 0 0 8px #c78d3c,inset 0 0 0 14px #5a2f17,0 18px 0 rgba(0,0,0,.35)}
.box .glass{height:100%;border-radius:150px 150px 6px 6px;background:linear-gradient(180deg,#1a1330,#2c2050);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s3);overflow:hidden;position:relative}
.eq{display:flex;gap:7px;align-items:end;height:120px}
.eq i{width:16px;background:linear-gradient(var(--ember-hi),var(--gold));animation:eq 1.1s ease-in-out infinite alternate;animation-delay:var(--d);height:30%}
@keyframes eq{0%{height:12%}35%{height:85%}70%{height:40%}100%{height:68%}}
.now{font-variant-caps:all-small-caps;font-size:1.25rem;font-weight:600;line-height:1.3;letter-spacing:.1em;color:var(--gold);text-align:center;padding:0 var(--s3);min-height:3em;transition:opacity .4s}
.genres{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s4)}
.genres span{font-size:var(--t-sm);font-style:italic;padding:4px 10px;border:2px solid rgba(232,196,111,.35);color:var(--gold)}

/* Memorial */
.memorial{background:linear-gradient(#2a2140,#120e1d);padding-bottom:0;text-align:center;overflow:hidden}
.memorial .lede{margin:0 auto var(--s5)}
.yard{position:relative;height:340px;max-width:900px;margin:0 auto;display:flex;align-items:end;justify-content:center;gap:var(--s6)}
.yard::after{content:"";position:absolute;left:-50vw;right:-50vw;bottom:0;height:70px;background:#2f3a22;box-shadow:inset 0 var(--px) 0 #46552f}
.stone{position:relative;z-index:1;width:250px;height:280px;background:#8d8a98;border-radius:125px 125px 0 0;margin-bottom:40px;padding:58px 26px 0;color:#2b2735;box-shadow:inset -14px 0 0 #77748a,inset 0 8px 0 #a9a6b6}
.stone small{display:block;font-variant-caps:all-small-caps;letter-spacing:.14em;font-size:var(--t-cap);font-weight:600;color:#4a4658}
.stone .rip{font-size:1.375rem;line-height:1.15;font-weight:800;letter-spacing:-.01em;margin:var(--s2) 0}
.stone .ep{font-style:italic;font-size:var(--t-md);line-height:1.3;min-height:4em;transition:opacity .5s}
.stone.small{width:120px;height:150px;padding-top:36px;opacity:.75;box-shadow:inset -8px 0 0 #6c6a7c}
.stone.small .rip{font-size:var(--t-md)}
.stone.small small{font-size:.875rem;letter-spacing:.08em}
.flower{position:absolute;bottom:40px;z-index:2;width:20px;height:28px;left:calc(50% + 120px)}
.flower::before{content:"";position:absolute;left:8px;bottom:0;width:4px;height:18px;background:#4f7a35}
.flower::after{content:"";position:absolute;left:3px;top:0;width:14px;height:14px;background:var(--wool);box-shadow:0 0 0 4px #e8c46f inset}

/* Community */
.come{position:relative;background:#c9b98e url(assets/meadow.jpg) center/cover no-repeat;color:var(--ink);padding:var(--s7) 0;overflow:hidden}
.come::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(245,236,217,.92),rgba(245,236,217,.72) 55%,rgba(245,236,217,.15))}
.come .wrap{position:relative}
.come h2{color:var(--ink)}
.come .eyebrow{color:#a2502a}
.come .lede{color:#3f3325}
.come .lede b{color:var(--ink)}
.come .ctas{margin-top:var(--s4)}
.come .field{bottom:0;--z:1.5}
.support{margin-top:var(--s6);display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);max-width:900px}
.support div{background:rgba(255,255,255,.55);padding:var(--s4);border-left:var(--px) solid var(--ember)}
.support h3{font-size:1.375rem;margin-bottom:var(--s2)}
.support p{font-size:var(--t-sm);margin:0;color:#3f3325}
.support a{color:#9b4f2c}

/* Footer */
footer{background:var(--soil);color:var(--wool-dim);padding:var(--s6) 0 var(--s5);font-size:var(--t-sm)}
footer .wrap{display:grid;grid-template-columns:2fr 1fr 1fr;gap:var(--s5)}
footer h4{font-variant-caps:all-small-caps;letter-spacing:.14em;font-size:var(--t-cap);font-weight:700;color:var(--gold);margin:0 0 var(--s3)}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:var(--s2)}
footer a{color:var(--wool);text-decoration:none}
footer a:hover{color:var(--gold)}
footer .glory{grid-column:1/-1;border-top:2px solid rgba(245,236,217,.1);padding-top:var(--s4);display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--s3)}
footer .glory em{color:var(--gold)}

/* Scroll reveal */
.obs{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--sd,0s)}
.obs.in{opacity:1;transform:none}

/* Legal page */
.doc{background:var(--wool);color:var(--ink);padding:140px 0 var(--s7)}
.doc .wrap{max-width:780px}
.doc h1{font-size:var(--t-2xl);margin-bottom:var(--s2)}
.doc .eff{color:#8c7a5a;margin-bottom:var(--s5)}
.doc .short{background:#fff;border-left:calc(var(--px)*2) solid var(--ember);padding:var(--s4);font-size:var(--t-lg);font-style:italic;font-weight:500;line-height:1.35;margin-bottom:var(--s5)}
.doc h2{max-width:none;font-size:1.75rem;margin:var(--s5) 0 var(--s3);font-variant-caps:all-small-caps;letter-spacing:.06em;color:#7a3c20}
.doc p,.doc li{color:#3f3325}
.doc ul{padding-left:1.2em}
.doc li{margin-bottom:var(--s3)}
.doc code{font-family:ui-monospace,Consolas,monospace;font-size:.85em;background:#ece1c8;padding:2px 6px;word-break:break-all}
.doc a{color:#9b4f2c}
.bar.light .brand{color:var(--ink)}
.bar.light .nav a{color:#5a4a36}
.bar.light .nav a:hover{color:var(--ink)}
.bar.light.solid{background:rgba(245,236,217,.94)}

@media (max-width:900px){
  .flock .head{grid-template-columns:1fr;gap:var(--s3)}
  .about .grid,.reckon .grid,.jukebox .grid{grid-template-columns:1fr;gap:var(--s5)}
  .support{grid-template-columns:1fr}
  footer .wrap{grid-template-columns:1fr 1fr}
  footer .wrap>div:first-child{grid-column:1/-1}
  .ledger{transform:none}
}
@media (max-width:560px){
  :root{--s7:72px}
  .nav{gap:var(--s3);-webkit-mask-image:linear-gradient(90deg,#000 80%,transparent);mask-image:linear-gradient(90deg,#000 80%,transparent);padding-right:var(--s5)}
  .brand span{display:none}
  .toolgrid{grid-template-columns:1fr}
  .facts{grid-template-columns:1fr 1fr}
  .stone.small{display:none}
  .field,.vignette{--z:1.4}
  .hero .wrap{padding-bottom:24vh}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .reveal,.obs{opacity:1;transform:none}
  html{scroll-behavior:auto}
}
