/* Good Dirt and the brand page. Same tokens as site.css: paper, ink, mustard,
   teal; DM Sans set tight, Shrikhand for the one emphasis, JetBrains Mono labels.
   Square corners, 1px ink rules, mustard offsets. */
@font-face{font-family:'DM Sans';src:url(/fonts/v2/dmsans.woff2) format('woff2');font-weight:100 1000;font-display:swap}
@font-face{font-family:'Shrikhand';src:url(/fonts/v2/shrikhand.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url(/fonts/v2/jbmono.woff2) format('woff2');font-weight:100 800;font-display:swap}
:root{
  --paper:#fcfaf3;--pale:#f4f0e2;--ink:#141210;--ink2:#4a4339;--mustard:#f5b700;--teal:#0f4c47;--rule:1px solid var(--ink);
  --sans:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;--disp:'Shrikhand',Georgia,serif;--mono:'JetBrains Mono',ui-monospace,Menlo,Consolas,monospace;
  --gut:clamp(16px,4vw,56px);color-scheme:light only;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-variation-settings:'opsz' 14;font-size:1.0625rem;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:clip}
img,svg{max-width:100%;height:auto;display:block}
a{color:inherit}
em{font-family:var(--disp);font-style:normal;font-weight:400;letter-spacing:-.01em}
h1,h2,h3{font-weight:700;letter-spacing:-.045em;line-height:1.02;margin:0;text-wrap:balance}
h1 em,h2 em,h3 em{background:linear-gradient(var(--mustard),var(--mustard)) 0 86%/100% .2em no-repeat;padding:0 .04em}
p{margin:0}
:focus-visible{outline:2px solid var(--teal);outline-offset:3px}
.label{font-family:var(--mono);font-size:.72rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}
.skip{position:absolute;left:-999px;top:8px;z-index:200;background:var(--mustard);padding:10px 14px;border:var(--rule)}
.skip:focus{left:8px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:52px;padding:0 22px;background:var(--mustard);color:var(--ink);border:var(--rule);border-radius:3px;font:700 1rem/1 var(--sans);letter-spacing:-.01em;text-decoration:none;box-shadow:4px 4px 0 var(--ink);cursor:pointer;transition:transform .18s,box-shadow .18s}
.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.btn:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink)}
.btn-ghost{background:var(--paper)}
.btn-sm{min-height:40px;padding:0 14px;font-size:.92rem;box-shadow:3px 3px 0 var(--ink)}

/* bar */
.bar{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:24px;padding:12px var(--gut);background:rgba(252,250,243,.97);border-bottom:var(--rule)}
.brand{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:1.15rem;letter-spacing:-.03em;text-decoration:none;white-space:nowrap}
.brand svg{width:34px;height:34px;flex:none}
.bar nav{display:flex;gap:22px;margin-left:auto;font-family:var(--mono);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase}
.bar nav a{text-decoration:none;padding:6px 0;border-bottom:2px solid transparent}
.bar nav a:hover,.bar nav a[aria-current]{border-color:var(--mustard)}
@media (max-width:640px){.bar nav a:not(.keep){display:none}}

/* sign-up */
.join{display:grid;gap:10px}
.join-row{display:flex;gap:10px;flex-wrap:wrap}
.join input[type=email],.join input[type=text]{flex:1 1 220px;min-height:52px;padding:0 16px;border:var(--rule);border-radius:3px;background:#fff;font:inherit;color:var(--ink)}
.join input::placeholder{color:#857c6e}
.join .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.join-note{font-family:var(--mono);font-size:.74rem;letter-spacing:.02em;color:var(--ink2)}
.join-msg{font-weight:700}.join-msg:empty{margin-top:-10px}
.join-msg[data-state=ok]{color:var(--teal)}
.join-msg[data-state=err]{color:#9b2c1c}
.join[data-done] .join-row{display:none}

/* the sign-up page */
.gd-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(28px,5vw,72px);align-items:center;padding:clamp(48px,8vw,110px) var(--gut) clamp(40px,6vw,80px);max-width:1320px;margin:0 auto}
.gd-hero h1{font-size:clamp(3.2rem,8vw,7.4rem);line-height:.92;margin:18px 0 22px}
.gd-hero .dek{font-size:clamp(1.08rem,1.5vw,1.3rem);color:var(--ink2);max-width:560px;margin-bottom:28px}
.gd-art{position:relative}
.gd-art img{width:100%}
.gd-card{border:var(--rule);background:var(--paper);box-shadow:10px 10px 0 var(--mustard);padding:clamp(22px,3vw,34px);margin-top:-12%;position:relative;max-width:440px;margin-left:auto}
.gd-card .label{display:block;margin-bottom:10px}
.gd-card p{color:var(--ink2);font-size:.98rem}
.gd-card a.go{display:inline-block;margin-top:14px;font-weight:700;text-decoration:none;border-bottom:2px solid var(--mustard)}
@media (max-width:900px){.gd-hero{grid-template-columns:1fr}.gd-card{margin:-8% 0 0 auto}}
.rooms{max-width:1320px;margin:0 auto;padding:clamp(48px,7vw,96px) var(--gut);border-top:var(--rule)}
.rooms-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:end;margin-bottom:36px}
.rooms-head h2{font-size:clamp(2rem,4vw,3.4rem)}
.rooms-head p{color:var(--ink2);max-width:520px}
.rooms ol{list-style:none;margin:0;padding:0;border-top:var(--rule)}
.rooms li{display:grid;grid-template-columns:70px minmax(0,1fr) minmax(0,2fr);gap:20px;padding:22px 0;border-bottom:var(--rule);align-items:baseline}
.rooms li span{font-family:var(--mono);font-size:.8rem;color:var(--teal)}
.rooms li b{font-size:1.35rem;letter-spacing:-.03em}
.rooms li p{color:var(--ink2)}
@media (max-width:760px){.rooms-head{grid-template-columns:1fr}.rooms li{grid-template-columns:44px 1fr}.rooms li p{grid-column:2}}
.archive{max-width:1320px;margin:0 auto;padding:0 var(--gut) clamp(64px,8vw,120px)}
.archive h2{font-size:clamp(1.6rem,3vw,2.4rem);margin-bottom:20px}
.archive ol{list-style:none;margin:0;padding:0;border-top:var(--rule)}
.archive a{display:grid;grid-template-columns:170px minmax(0,1fr) auto;gap:20px;align-items:baseline;padding:22px 0;border-bottom:var(--rule);text-decoration:none}
.archive a:hover b{background:linear-gradient(var(--mustard),var(--mustard)) 0 92%/100% .22em no-repeat}
.archive time{font-family:var(--mono);font-size:.78rem;letter-spacing:.06em;color:var(--teal);text-transform:uppercase}
.archive b{font-size:clamp(1.15rem,2vw,1.5rem);letter-spacing:-.03em;line-height:1.2}
.archive small{display:block;color:var(--ink2);font-size:.95rem;font-weight:400;margin-top:4px}
@media (max-width:640px){.archive a{grid-template-columns:1fr auto}.archive time{grid-column:1/-1}}

/* an issue */
.issue{max-width:720px;margin:0 auto;padding:clamp(40px,7vw,96px) var(--gut) 40px}
.issue-head{border-bottom:var(--rule);padding-bottom:32px;margin-bottom:8px;position:relative}
.issue-head .label{display:flex;gap:14px;flex-wrap:wrap}
.issue-head h1{font-size:clamp(2.3rem,5.4vw,3.9rem);margin:18px 0 16px}
.issue-head .dek{font-size:1.18rem;color:var(--ink2)}
.issue-spray{display:block;width:min(440px,84%);margin:0 auto 18px}
.room{padding:38px 0;border-bottom:var(--rule)}
.room>.label{display:block;margin-bottom:14px}
.room h2{font-size:clamp(1.7rem,3.6vw,2.4rem);margin-bottom:18px}
.room p+p{margin-top:1em}
.room .first::first-letter{font-family:var(--disp);float:left;font-size:4.2em;line-height:.82;padding:.08em .1em 0 0;color:var(--teal)}
.steps{list-style:none;counter-reset:s;margin:24px 0 0;padding:22px 24px;background:var(--pale);border:var(--rule)}
.steps li{counter-increment:s;display:grid;grid-template-columns:34px 1fr;gap:10px;padding:8px 0}
.steps li::before{content:counter(s,decimal-leading-zero);font-family:var(--mono);font-size:.8rem;color:var(--teal);padding-top:.2em}
.seeds{list-style:none;margin:0;padding:0;display:grid;gap:18px}
.seed{border:var(--rule);background:#fff;padding:22px 24px;box-shadow:6px 6px 0 var(--mustard)}
.seed b{display:block;font-size:1.25rem;letter-spacing:-.03em;margin-bottom:6px}
.seed p{color:var(--ink2)}
.prompt{position:relative;margin-top:14px;padding:16px 18px 16px;background:var(--ink);color:#f4f0e2;font-family:var(--mono);font-size:.86rem;line-height:1.6;border-radius:3px}
.prompt::before{content:'Paste this';display:block;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mustard);margin-bottom:6px}
.copy{position:absolute;top:10px;right:10px;font:500 .68rem var(--mono);letter-spacing:.1em;text-transform:uppercase;background:transparent;color:#f4f0e2;border:1px solid #6b645a;border-radius:3px;padding:6px 9px;cursor:pointer}
.copy:hover{border-color:var(--mustard);color:var(--mustard)}
.broke{list-style:none;margin:0;padding:0}
.broke li{padding:18px 0 18px 44px;position:relative;border-top:1px dashed #b8ae9c}
.broke li:first-child{border-top:0;padding-top:4px}
.broke li::before{content:'';position:absolute;left:4px;top:24px;width:22px;height:22px;border:var(--rule);border-radius:50%;background:var(--mustard)}
.broke li:first-child::before{top:10px}
.broke b{display:block;font-size:1.15rem;letter-spacing:-.02em}
.broke p{color:var(--ink2);margin-top:4px}
.broke .law{margin-top:10px;font-size:.95rem;color:var(--ink)}
.broke .law span{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);margin-right:8px}
.room-good{background:var(--teal);color:var(--paper);border:0;padding:38px clamp(22px,4vw,40px);margin:38px 0 0}
.room-good .label{color:var(--mustard)}
.room-good h2 em{color:var(--paper)}
.sign{padding:36px 0 10px}
.sign .ps{margin-top:22px;padding:18px 20px;border-left:4px solid var(--mustard);background:var(--pale)}
.sign .ps b{font-family:var(--mono);font-size:.74rem;letter-spacing:.14em;color:var(--teal);margin-right:6px}
.signoff{font-family:var(--disp);font-size:2.2rem;line-height:1;margin-top:18px}
.next{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:36px;padding-top:22px;border-top:var(--rule);font-family:var(--mono);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase}
.next a{text-decoration:none;border-bottom:2px solid var(--mustard)}
.join-band{max-width:720px;margin:0 auto 90px;padding:0 var(--gut)}
.join-box{border:var(--rule);background:var(--paper);box-shadow:10px 10px 0 var(--ink);padding:clamp(22px,4vw,38px)}
.join-box h2{font-size:clamp(1.7rem,3.6vw,2.4rem);margin:10px 0 10px}
.join-box>p{color:var(--ink2);margin-bottom:20px}

/* brand page */
.bp{max-width:1320px;margin:0 auto;padding:clamp(48px,7vw,96px) var(--gut)}
.bp-head{max-width:760px;margin-bottom:48px}
.bp-head h1{font-size:clamp(2.6rem,6vw,5rem);margin:16px 0 18px}
.bp-head p{color:var(--ink2);font-size:1.12rem}
.bp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,380px),1fr));gap:22px}
.bp-tile{margin:0;border:var(--rule);background:#fff;display:flex;flex-direction:column}
.bp-tile.dark{background:var(--teal)}
.bp-art{flex:1;display:grid;place-items:center;padding:clamp(24px,4vw,44px);min-height:260px}
.bp-art img{max-height:220px;width:auto}
.bp-meta{border-top:var(--rule);background:var(--paper);padding:14px 16px;display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}
.bp-meta b{font-size:1rem;letter-spacing:-.02em}
.bp-meta span{display:flex;gap:12px;font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}
.bp-meta a{text-decoration:none;border-bottom:2px solid var(--mustard)}
.bp-sec{margin-top:72px;padding-top:28px;border-top:var(--rule)}
.bp-sec h2{font-size:clamp(1.7rem,3vw,2.4rem);margin-bottom:22px}
.swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));gap:14px;list-style:none;margin:0;padding:0}
.swatches li{border:var(--rule)}
.swatches i{display:block;height:110px;border-bottom:var(--rule)}
.swatches b,.swatches code{display:block;padding:0 14px}
.swatches b{padding-top:12px}
.swatches code{font-family:var(--mono);font-size:.78rem;color:var(--ink2);padding-bottom:12px}
.type{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:22px}
.type div{border:var(--rule);padding:24px;background:#fff}
.type .s1{font-weight:700;font-size:2.4rem;letter-spacing:-.045em;line-height:1}
.type .s2{font-family:var(--disp);font-size:2.4rem;line-height:1}
.type .s3{font-family:var(--mono);font-size:.9rem;letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}
.type p{color:var(--ink2);margin-top:12px;font-size:.95rem}
.rules{columns:2 320px;gap:40px;padding:0;margin:0;list-style:none}
.rules li{break-inside:avoid;padding:12px 0;border-bottom:1px dashed #b8ae9c}
.rules b{display:block}
.rules span{color:var(--ink2);font-size:.96rem}
.sig-wrap{border:var(--rule);background:#fff;padding:26px;overflow-x:auto}

/* foot */
.foot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:22px var(--gut);background:var(--ink);color:#cfc6b4;font-family:var(--mono);font-size:.74rem;letter-spacing:.06em}
.foot a{color:var(--mustard)}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}