:root{--ink:#1f2a37;--muted:#5b6675;--accent:#7a4e2d;--gold:#c99a3d;--bg:#fbf8f3;--card:#fff;--line:#e8e1d6}
*{box-sizing:border-box}body{margin:0;font:17px/1.6 Georgia,"Times New Roman",serif;color:var(--ink);background:var(--bg)}
a{color:var(--accent)}a:focus,button:focus,input:focus{outline:3px solid var(--gold);outline-offset:2px}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-999px}.skip:focus{left:10px;top:10px;background:#fff;padding:8px}
header.top{background:#fff;border-bottom:1px solid var(--line)}
header.top .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding-top:14px;padding-bottom:14px}
.brand{font-size:1.4rem;font-weight:bold;text-decoration:none;color:var(--ink)}.tagline{display:block;font:0.85rem/1.3 system-ui,sans-serif;color:var(--muted)}
nav a{font:0.95rem system-ui,sans-serif;margin-left:16px;text-decoration:none;color:var(--ink)}nav a:hover{color:var(--accent)}
.hero{background:linear-gradient(135deg,#3b2a1e,#7a4e2d);color:#fff;padding:72px 0 64px}
.hero h1{font-size:clamp(2.2rem,6vw,3.4rem);margin:0 0 8px}.hero p{max-width:640px;font-size:1.15rem}
.verse{border-left:4px solid var(--gold);padding-left:14px;font-style:italic;max-width:640px;margin-top:24px}
.verse cite{display:block;font-style:normal;font-size:0.85rem;opacity:.85;margin-top:4px}
.btn{display:inline-block;background:var(--gold);color:#1f1300;padding:10px 18px;border-radius:6px;text-decoration:none;font:600 0.95rem system-ui,sans-serif;border:0}
section{padding:56px 0}section h2{font-size:1.8rem;margin:0 0 6px}.lead{color:var(--muted);margin-top:0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-top:22px}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:20px}
.card h3{margin:6px 0 8px;font-size:1.2rem}.badge{display:inline-block;font:600 0.72rem system-ui,sans-serif;letter-spacing:.05em;text-transform:uppercase;background:#f1e6d3;color:#6b4a1f;padding:3px 8px;border-radius:4px}
.alt{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
form.signup{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}form.signup input{flex:1 1 240px;padding:10px;border:1px solid var(--line);border-radius:6px;font-size:1rem}
form.signup button[disabled]{opacity:.6;cursor:not-allowed}.note{font:0.85rem system-ui,sans-serif;color:var(--muted)}
footer{background:#2a2019;color:#e9dfd2;padding:28px 0;font:0.9rem system-ui,sans-serif}footer a{color:#f3d9a4}
@media (max-width:600px){nav a{margin:0 14px 0 0}.hero{padding:48px 0}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
.layout{display:grid;grid-template-columns:220px minmax(0,1fr);max-width:1320px;margin:0 auto}
.rail{position:sticky;top:0;align-self:start;display:flex;flex-direction:column;gap:2px;padding:24px 12px;font:0.95rem system-ui,sans-serif}
.rail a{padding:8px 12px;border-radius:6px;text-decoration:none;color:var(--ink)}.rail a:hover{background:#f1e6d3;color:var(--accent)}
.content{min-width:0}
@media (max-width:800px){.layout{grid-template-columns:minmax(0,1fr)}.rail{position:static;flex-direction:row;flex-wrap:wrap;padding:10px 12px;border-bottom:1px solid var(--line);background:#fff}.rail a{padding:6px 10px}}
.intro,.working{max-width:640px;margin:18px 0}.intro h2,.working h2{font-size:1.2rem;margin:0 0 4px;color:#f3d9a4}
.intro p{margin:0}.working ul{margin:0;padding-left:20px}.working li{margin:2px 0}
.rail a.current{background:#f1e6d3;color:var(--accent);font-weight:600}
.price{font:600 1.05rem system-ui,sans-serif;margin:8px 0}
.credit{font-size:.75rem;opacity:.8;margin:8px 0 0}
.pimg{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:6px;background:#fbf8f3;margin-bottom:10px}
.previewnote{background:#fff4dc;border:1px solid var(--gold);padding:8px 12px;font:0.9rem system-ui,sans-serif}
.tablewrap{overflow-x:auto}.carttable{width:100%;border-collapse:collapse;font:0.95rem system-ui,sans-serif;margin:16px 0}
.carttable th,.carttable td{border-bottom:1px solid var(--line);padding:8px;text-align:left;vertical-align:middle}
.qty{width:56px;padding:6px;border:1px solid var(--line);border-radius:0;text-align:center;font-size:1rem}
.qbtn{width:32px;height:32px;border:1px solid var(--accent);background:#fff;color:var(--accent);font-size:1.1rem;cursor:pointer;margin:0 2px;border-radius:0}
.link{background:none;border:0;color:var(--accent);text-decoration:underline;cursor:pointer;font:inherit;padding:4px}
.subtotal{font:1.1rem system-ui,sans-serif}
.steps{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:12px 0 20px;font:0.85rem system-ui,sans-serif}
.steps li{padding:6px 10px;border:1px solid var(--line);background:#fff}.steps li.on{background:var(--accent);color:#fff;border-color:var(--accent)}.steps li.done{background:#f1e6d3}
.form label,.paybox label{display:block;font:0.9rem system-ui,sans-serif;margin:10px 0;max-width:420px}
.form input,.paybox input{display:block;width:100%;padding:10px;margin-top:4px;border:1px solid #a0522d;border-radius:0;font-size:1rem}
.form input:focus{box-shadow:0 0 0 4px rgba(160,82,45,.25);outline:none}
.paybox{max-width:460px;border:1px solid var(--line);background:#fff;padding:16px}.paybox input[disabled]{background:#f3efe8;color:#6b6b6b}
.payrow{display:flex;gap:12px}.payrow label{flex:1}
.paybanner{background:#7a4e2d;color:#fff;padding:10px 12px;font:600 0.9rem system-ui,sans-serif;margin:0 0 8px}
.error{color:#a3261f;font:0.9rem system-ui,sans-serif;min-height:1.2em}
/* v1.0.4 welcome hero: full-bleed photo (edge to edge, no container), field report card overlaid lower left */
@font-face{font-family:"Special Elite";src:url(/fonts/specialelite.woff2) format("woff2");font-display:swap}
.herophoto{position:relative;width:100%;margin:0;overflow:hidden;background:#1a120c;padding:56px 0 300px;min-height:min(92vh,900px)}
.herobg{position:absolute;inset:0;z-index:0;margin:0;padding:0}
.herobg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%;display:block;max-width:none}
.herophoto::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(26,18,12,.9) 0%,rgba(42,30,20,.72) 38%,rgba(59,42,30,.25) 70%,rgba(26,18,12,.35) 100%),linear-gradient(0deg,rgba(26,18,12,.55),rgba(26,18,12,0) 40%)}
.herogrid{position:relative;z-index:2}.herotext{max-width:620px;text-shadow:0 1px 3px rgba(0,0,0,.7)}
.fieldreport dl{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:2px 10px}.fieldreport dl div{display:flex;gap:6px;flex-wrap:wrap}
.fieldreport dl div:nth-child(-n+3){grid-column:1/-1}.fieldreport dt{color:#f3c27a}.fieldreport dd{margin:0}
/* 1.0.5 reveal: the photo stays at opacity 0 until hero.js adds .heroready after the FINAL image loads (4s failsafe) */
.herobg img{opacity:0;transition:opacity 1s ease-out}.heroready .herobg img{opacity:1}
.fieldreport{opacity:0;translate:0 10px;transition:opacity .9s ease-out .35s,translate .9s ease-out .35s}.heroready .fieldreport{opacity:1;translate:0 0}
.fieldreport .untyped{visibility:hidden}
@media (prefers-reduced-motion:reduce){.herobg img,.fieldreport{transition:none;translate:none}}
.soundtoggle{position:absolute;top:12px;right:12px;z-index:4;width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(243,217,164,.45);border-radius:50%;background:rgba(26,18,12,.5);color:#f3d9a4;cursor:pointer;opacity:.75;padding:0}
.soundtoggle:hover,.soundtoggle:focus-visible{opacity:1}.soundtoggle .cross{display:none}.soundtoggle.muted .cross{display:inline}.soundtoggle.muted .waves{display:none}
.fieldreport dd.redacted{background:#0d0907;color:#fff3d6;padding:0 6px;letter-spacing:.12em}
/* Field report typed directly on the photo, lower right; no backing, box, stamp or tape; glow for legibility */
.fieldreport{position:absolute;z-index:3;right:max(24px,calc((100% - 1080px)/4));bottom:40px;width:300px;font-family:"Special Elite","Courier New",monospace;font-size:17px;line-height:1.4;color:#fff3d6;background:none;border:0;box-shadow:none;padding:0;text-shadow:0 0 2px #000,0 0 6px rgba(0,0,0,.95),0 0 12px rgba(0,0,0,.8),0 0 18px rgba(255,170,60,.55)}
.fieldreport::before{content:none}
.frhead{margin:0 0 6px;font-size:1.25rem;letter-spacing:.14em;color:#ffd9a0}
.frstatus{margin:8px 0 0;letter-spacing:.04em;color:#ffd9a0}.frlabel{color:#ffd9a0}
.herophoto::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse 45% 40% at 88% 85%,rgba(10,7,5,.55),rgba(10,7,5,0) 70%)}
@media (max-width:900px){
.herophoto{display:flex;flex-direction:column;padding:0;min-height:0}
.herophoto .wrap.herogrid{order:1;padding-top:40px;padding-bottom:32px}
.herobg{order:2;position:relative;inset:auto;width:100%;aspect-ratio:3/4}
.herophoto::after{background:linear-gradient(180deg,rgba(26,18,12,.95) 0%,rgba(26,18,12,.92) 45%,rgba(26,18,12,.25) 60%,rgba(26,18,12,.35) 100%)}
.fieldreport{right:1.5%;bottom:calc(100vw * 4 / 3 * .15);width:32%;font-size:13px;line-height:1.3}
.frhead{font-size:13px;letter-spacing:.08em}.fieldreport dl{grid-template-columns:1fr}.fieldreport dl div{grid-column:1/-1}
.herophoto::before{background:radial-gradient(ellipse 45% 22% at 82% 75%,rgba(10,7,5,.6),rgba(10,7,5,0) 70%)}
}
@media (min-width:601px) and (max-width:900px){.fieldreport{font-size:16px;width:31%}.frhead{font-size:17px}}
/* 1.0.5 pages, forms, footer links, catalog sections */
.footlinks a{color:inherit;margin-right:14px}.pagebody{white-space:pre-line;max-width:760px}
.formgrid{display:grid;gap:10px;max-width:520px}.formgrid input,.formgrid textarea{font:inherit;padding:10px;border:1px solid #c9b8a6;border-radius:8px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}.formmsg{min-height:1.4em}
.catgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;margin-top:16px}.catgrid img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px}
/* 1.0.5 desktop hero (901px+): the hero fits the first screen (1440x900: field report fully above the fold) and the
   photo sits in the right 55% so the hero text on the left never covers the runner; field report types to the right of her */
@media (min-width:901px){
.herophoto{min-height:0;height:calc(100vh - 82px);max-height:900px;padding:32px 0 0}
.herobg{left:45%}
.herobg img{object-position:50% 45%}
.herophoto::after{background:linear-gradient(90deg,#1a120c 0%,#1a120c 45%,rgba(26,18,12,.55) 52%,rgba(26,18,12,0) 62%),linear-gradient(0deg,rgba(26,18,12,.45),rgba(26,18,12,0) 35%)}
.herotext{max-width:min(520px,calc(45vw - 60px))}.herotext h1{font-size:clamp(2.2rem,4vw,3rem)}.herotext p{font-size:1.02rem}.hero .verse{font-size:.98rem}
.fieldreport{right:16px;bottom:28px;width:clamp(200px,calc(55vw * .34 - 24px),280px);font-size:15px}
.herophoto::before{background:radial-gradient(ellipse 22% 30% at 92% 85%,rgba(10,7,5,.6),rgba(10,7,5,0) 70%)}
}
/* 1.0.5 Donate: rail accent button and donate page */
.rail a.raildonate{margin-top:10px;background:var(--gold);color:#2a1d12;font-weight:700;text-align:center;border-radius:999px;box-shadow:0 2px 0 rgba(59,42,30,.25)}
.rail a.raildonate:hover,.rail a.raildonate.current{background:#b5862d;color:#fff}
@media (max-width:800px){.rail a.raildonate{margin-top:0}}
.donatewrap{max-width:640px}.donateform{display:grid;gap:14px}.donateform fieldset{border:0;padding:0;margin:0}.donateform legend{font-weight:700;margin-bottom:8px}
.amounts{display:flex;flex-wrap:wrap;gap:10px}.amounts label{position:relative}.amounts input{position:absolute;opacity:0}
.amounts span{display:inline-block;padding:10px 18px;border:2px solid var(--accent);border-radius:999px;font-weight:700;cursor:pointer;background:#fff}
.amounts input:checked+span{background:var(--accent);color:#fff}.amounts input:focus-visible+span{outline:3px solid var(--gold);outline-offset:2px}
.donateform label{display:grid;gap:4px}.donateform input:not([type=radio]),.donateform textarea{font:inherit;padding:10px;border:1px solid #c9b8a6;border-radius:8px}
.donateform .custom{margin-top:10px}.donatesoon{background:#fff6e5;border:1px solid var(--gold);border-radius:10px;padding:12px 16px;margin:12px 0}
.donatesoon h2{margin:0 0 4px}.donateform:disabled,.donateform [disabled]{opacity:.6;cursor:not-allowed}
/* 1.0.5 field report: the card stays hidden until the printout starts (hero.js adds .started), then the lines type. */
.fieldreport{text-transform:uppercase;visibility:hidden}.fieldreport.started{visibility:visible}
.fieldreport dl{grid-template-columns:1fr}.fieldreport dl div{grid-column:1/-1}
.started .fieldreport .frsector{padding:5px 0;letter-spacing:.09em}.fieldreport .frsector dd .frpart{display:block;white-space:nowrap}
.frunit{color:inherit}
@media (max-width:600px){.fieldreport .frsector{padding:3px 0 3px 1.1em;text-indent:-1.1em;letter-spacing:.05em}.fieldreport .frsector dt,.fieldreport .frsector dd{display:inline}.fieldreport .frsector dd .frpart{display:inline;white-space:normal}}
@media (min-width:601px){.fieldreport .frsector{display:block}.fieldreport .frsector dt{display:block}.fieldreport .frsector dd{display:block}}
/* field report, final: FIELD REPORT (larger), STATUS: DECLASSIFIED (white), then the lines in the warm typewriter glow.
   Desktop: photo in the right 64%, the text column ends before the runner, and the report is wide enough that SECTOR and
   STATUS each stay on one line; it sits above her legs in the lower right. */
.frreport{margin:0 0 4px;letter-spacing:.06em;color:#ffd9a0}
@media (min-width:901px){
.herobg{left:36%}
.herotext{max-width:min(500px,calc(47.5vw - 20px - max(20px,(100vw - 1040px) / 2)))}
.fieldreport{right:12px;width:calc(24.96vw - 12px);font-size:clamp(10px,calc(.9vw),13px);line-height:1.45;bottom:max(24px,calc(.55 * min(100vh - 82px,900px) - 23vw + 24px))}
.fieldreport .frsector{display:block;letter-spacing:.06em;padding:5px 0}.fieldreport .frsector dt,.fieldreport .frsector dd{display:inline}.fieldreport .frsector dd .frpart{display:inline;white-space:nowrap}
.frstatus{white-space:nowrap}
.herophoto::after{background:linear-gradient(90deg,#1a120c 0%,#1a120c 36%,rgba(26,18,12,.55) 43%,rgba(26,18,12,0) 53%),linear-gradient(0deg,rgba(26,18,12,.45),rgba(26,18,12,0) 35%)}
.herophoto::before{background:radial-gradient(ellipse 26% 30% at 88% 72%,rgba(10,7,5,.6),rgba(10,7,5,0) 70%)}
}
@media (min-width:1300px){.fieldreport .frsector,.fieldreport .frsector dd .frpart{white-space:nowrap}}
/* all six report lines (labels and values) share the typewriter font and one warm glow color */
.fieldreport dl dt,.fieldreport dl dd,.fieldreport .frunit,.frstatus,.frstatus .frlabel,#frstatus,.frreport{font-family:"Special Elite","Courier New",monospace;color:#ffd9a0;letter-spacing:.04em}
.fieldreport .frsector,.fieldreport .frsector dt,.fieldreport .frsector dd{letter-spacing:.09em}
.fieldreport p{max-width:none;font-size:1em}
/* final field report: larger FIELD REPORT header, the report STATUS line in white, warm glowing body lines */
.fieldreport .frhead{font-size:1.4em;letter-spacing:.14em;margin:0 0 2px;color:#ffd9a0}
.fieldreport .frreport{margin:0 0 4px}.fieldreport .frreport .frlabel{color:#ffd9a0}.fieldreport #frreport_status{color:#fff}
/* no extra gaps between report lines; SECTOR keeps only its wider letter spacing */
.fieldreport .frhead,.fieldreport .frreport,.fieldreport .frstatus,.fieldreport dl{margin:0}.fieldreport dl{gap:0}
.fieldreport .frsector,.fieldreport .frsector dt,.fieldreport .frsector dd{padding:0;text-indent:0}
@media (max-width:600px){.fieldreport .frsector{padding-left:1.1em;text-indent:-1.1em}}
.fieldreport p.frhead{font-size:1.4em}
.fieldreport [hidden]{display:none!important} /* an empty field report line is hidden even where the lines are display:block */
/* 1.0.5 eleven-line field report: size and spot per width, clear of the runner (above her legs, right of her head) */
@media (max-width:600px){.fieldreport{right:6px;width:calc(35% - 6px);bottom:calc(100vw * 4 / 3 * .355);font-size:13px;line-height:1.15}.fieldreport p.frhead{font-size:1.1em;letter-spacing:.04em}.fieldreport dl dt,.fieldreport dl dd,.fieldreport .frunit,.frstatus,.frstatus .frlabel,#frstatus,.frreport,.fieldreport .frsector,.fieldreport .frsector dt,.fieldreport .frsector dd{letter-spacing:0}.fieldreport .frsector{padding-left:0;text-indent:0}.fieldreport dl div{gap:0 .5em}}
@media (min-width:601px) and (max-width:900px){.fieldreport{right:12px;width:calc(35% - 12px);bottom:calc(100vw * 4 / 3 * .28);font-size:14px;line-height:1.35}.fieldreport .frsector dt,.fieldreport .frsector dd,.fieldreport .frsector dd .frpart{display:inline}}
@media (min-width:901px){.fieldreport{font-size:clamp(13px,calc(.9vw + 1px),15px);width:calc(23vw - 14px)}.frstatus{white-space:normal}}
@media (min-width:1300px){.frstatus{white-space:nowrap}}
/* 1.0.5 labels white (Art's spec): FIELD REPORT header and every "LABEL:" (both STATUS labels); dark legibility shadow only, no orange glow. Values keep the warm glow. */
.fieldreport{--frlabel:#ffffff}
.fieldreport .frhead,.fieldreport p.frhead,.fieldreport dl dt,.fieldreport .frlabel,.fieldreport .frreport .frlabel,.fieldreport .frstatus .frlabel,.fieldreport .frsector dt{color:var(--frlabel);text-shadow:0 0 2px #000,0 0 6px rgba(0,0,0,.95)}
/* 1.0.5 static vs typed split (Art's spec): static words white (--frlabel), typed values one warm amber (--frtyped); dark legibility shadow only */
.fieldreport{--frlabel:#ffffff;--frtyped:#ffc46b;text-shadow:0 0 2px #000,0 0 6px rgba(0,0,0,.95)}
.fieldreport dl dd,.fieldreport #frstatus,.fieldreport #frfrom,.fieldreport #frlocation,.fieldreport #frlocation .frpart,.fieldreport #frcourse,.fieldreport #frterrain,.fieldreport #frmile,.fieldreport #frpace,.fieldreport #frtime,.fieldreport #frdate{color:var(--frtyped);text-shadow:0 0 2px #000,0 0 5px rgba(0,0,0,.9),0 0 6px rgba(255,180,80,.35)} /* subtle amber glow on typed values only */
.fieldreport .frhead,.fieldreport p.frhead,.fieldreport dl dt,.fieldreport .frlabel,.fieldreport .frunit,.fieldreport #frreport_status{color:var(--frlabel);text-shadow:0 0 2px #000,0 0 6px rgba(0,0,0,.95)}
/* 1.0.5 final colors: static words white (--frlabel), typed values amber (--frtyped) with a subtle amber glow; strong dark halo on all report text; no box or backing */
.fieldreport{--frlabel:#ffffff;--frtyped:#ffc46b;text-shadow:0 0 2px #000,0 0 6px rgba(0,0,0,.95),0 0 12px rgba(0,0,0,.85)}
.fieldreport .frhead,.fieldreport p.frhead,.fieldreport dl dt,.fieldreport .frlabel,.fieldreport .frunit,.fieldreport #frreport_status,.fieldreport .frreport .frlabel,.fieldreport .frstatus .frlabel,.fieldreport .frsector dt{color:var(--frlabel);text-shadow:0 0 2px #000,0 0 6px rgba(0,0,0,.95),0 0 12px rgba(0,0,0,.85)}
.fieldreport dl dd,.fieldreport #frstatus,.fieldreport #frfrom,.fieldreport #frlocation,.fieldreport #frlocation .frpart,.fieldreport #frcourse,.fieldreport #frterrain,.fieldreport #frmile,.fieldreport #frpace,.fieldreport #frtime,.fieldreport #frdate{color:var(--frtyped);text-shadow:0 0 2px #000,0 0 6px rgba(0,0,0,.95),0 0 12px rgba(0,0,0,.85),0 0 6px rgba(255,180,80,.35)}
.fieldreport dl dd .frunit{color:var(--frlabel);text-shadow:0 0 2px #000,0 0 6px rgba(0,0,0,.95),0 0 12px rgba(0,0,0,.85)}
/* 1.0.5 desktop (901px+): field report lower and 12px closer to the right edge, out of the runner's path; it ends just above her legs */
@media (min-width:901px){.fieldreport{right:0;bottom:max(24px,calc(.55 * min(100vh - 82px,900px) - 24.75vw + 8px))}}
/* 1.0.5 final placement (Art): less prominent so the runner stays the focus; about 82% type, static labels at 80% white,
   softer amber glow on the values. 1200px+: anchored in the lower right corner of the photo, hugging its text, clear of her. */
.fieldreport{--frlabel:rgba(255,255,255,.8)}
.fieldreport dl dd,.fieldreport #frstatus,.fieldreport #frfrom,.fieldreport #frlocation,.fieldreport #frlocation .frpart,.fieldreport #frcourse,.fieldreport #frterrain,.fieldreport #frmile,.fieldreport #frpace,.fieldreport #frtime,.fieldreport #frdate{text-shadow:0 0 2px #000,0 0 6px rgba(0,0,0,.95),0 0 12px rgba(0,0,0,.85),0 0 5px rgba(255,180,80,.22)}
@media (max-width:600px){.fieldreport{font-size:11.5px}}
@media (min-width:601px) and (max-width:900px){.fieldreport{font-size:12px}}
@media (min-width:901px){.fieldreport{font-size:clamp(10.5px,calc(.74vw + .8px),12.5px)}}
@media (min-width:1200px){.fieldreport{right:14px;bottom:16px;width:max-content;max-width:calc(16.6vw - 14px)}}
/* 1.0.5 placement (Art): the field report sits BEHIND the runner, in the open road on her left, low in the photo, between
   the hero text column and her; the photo moves right so the gap fits the report at 901px+. Up to 900px (stacked hero)
   the report drops below the photo, on the dark hero background, never over her. */
@media (min-width:901px){
.herobg{left:46%}
.herophoto::after{background:linear-gradient(90deg,#1a120c 0%,#1a120c 46%,rgba(26,18,12,.55) 52%,rgba(26,18,12,0) 60%),linear-gradient(0deg,rgba(26,18,12,.45),rgba(26,18,12,0) 35%)}
.herophoto::before{background:radial-gradient(ellipse 14% 26% at 56% 86%,rgba(10,7,5,.6),rgba(10,7,5,0) 70%)}
.fieldreport{right:auto;left:calc(min(max(20px,(100vw - 1040px) / 2) + 500px,47.5vw - 20px) + 10px);bottom:14px;width:max-content;max-width:none}
}
@media (min-width:1200px){
.herobg{left:40%}
.herophoto::after{background:linear-gradient(90deg,#1a120c 0%,#1a120c 40%,rgba(26,18,12,.55) 47%,rgba(26,18,12,0) 57%),linear-gradient(0deg,rgba(26,18,12,.45),rgba(26,18,12,0) 35%)}
.herophoto::before{background:radial-gradient(ellipse 14% 26% at 54% 86%,rgba(10,7,5,.6),rgba(10,7,5,0) 70%)}
}
@media (max-width:900px){
.fieldreport{order:3;position:static;width:auto;max-width:none;margin:0;padding:18px max(20px,4vw) 26px;font-size:13px;line-height:1.4}
.fieldreport p.frhead{font-size:1.2em}
}

/* 1.0.5 store: square category tiles (like the admin hub); a category page lists its items in a responsive grid */
.storetiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:16px;margin-top:16px}
.storetile{position:relative;display:flex;flex-direction:column;justify-content:flex-end;aspect-ratio:1/1;border-radius:12px;overflow:hidden;background:#3b2a1e;color:#fff;text-decoration:none;padding:14px;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.storetile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55}
.storetile::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(26,18,12,.85),rgba(26,18,12,0) 60%)}
.storetile .tilename,.storetile .tilecount{position:relative;z-index:1}.storetile .tilename{font-size:1.2rem;font-weight:700}.storetile .tilecount{font-size:.9rem;opacity:.85}
.storetile:hover,.storetile:focus-visible{outline:3px solid #c99a3d;outline-offset:2px}
.productgrid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}.storeback{margin:4px 0 12px}.btnoff{opacity:.6;cursor:not-allowed}
/* placement fine-tune: a little more room between the report and her legs and foreground arm */
@media (min-width:901px) and (max-width:1199px){.fieldreport{bottom:60px}}
@media (min-width:1200px){.herobg{left:42%}.herophoto::after{background:linear-gradient(90deg,#1a120c 0%,#1a120c 42%,rgba(26,18,12,.55) 49%,rgba(26,18,12,0) 59%),linear-gradient(0deg,rgba(26,18,12,.45),rgba(26,18,12,0) 35%)}}

/* 1.0.5 menus: one top menu (Blog, Store, About, Cart); the rail keeps Blog, Store, About and the Donate button on wide
   screens and is hidden at 900px and under so phones show a single compact menu. Store tiles 2 per row on phones,
   3 on tablets; category items 2 per row on phones. Tile pictures are cropped so the sample tag stays on products only. */
@media (max-width:900px){.rail{display:none}.layout{grid-template-columns:minmax(0,1fr)}header.top nav a{margin:0 14px 0 0}}
@media (max-width:600px){header.top .wrap{padding-top:10px;padding-bottom:10px;gap:6px}header.top nav{display:flex;flex-wrap:wrap;gap:4px 0}}
.storetile img{top:-16%;height:116%}
@media (max-width:900px){.storetiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}}
@media (max-width:600px){.storetiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.storetile{padding:10px;border-radius:10px}.storetile .tilename{font-size:1rem}.storetile .tilecount{font-size:.8rem}
.productgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}.productgrid .card{padding:10px}.productgrid .card h3{font-size:.95rem;margin:6px 0 4px;line-height:1.25}
.productgrid .card p{font-size:.82rem;line-height:1.35;margin:0 0 6px}.productgrid .card .price{font-size:.95rem}.productgrid .badge{font-size:.7rem}.productgrid .btn{font-size:.8rem;padding:8px 6px;width:100%;white-space:normal;line-height:1.2}}
@media (max-width:600px){.content > section:first-child:not(.hero){padding-top:24px}}
#postgrid .blogempty{grid-column:1/-1;font-size:1.05rem}
/* 1.0.5 feedback pill: small, bottom left, clear of the field report (which sits mid page in the hero), the sound toggle (top
   right) and the cart (header); shown at 1280px+ (where the left margin is free), else the footer link is enough */
.feedbackpill{position:fixed;left:14px;bottom:14px;z-index:20;padding:6px 14px;border-radius:999px;background:rgba(59,42,30,.88);color:#fff;font:600 .85rem system-ui,sans-serif;text-decoration:none;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.feedbackpill:hover,.feedbackpill:focus-visible{background:#7a4e2d;color:#fff}
@media (max-width:1279px){.feedbackpill{display:none}}
.formgrid label{display:grid;gap:4px}.formgrid label input,.formgrid label textarea{width:100%;box-sizing:border-box}

/* 1.0.6 blog: All / Writing / Video filter (a Both post shows under both) and inline video */
.postfilter{display:flex;gap:8px;margin:14px 0 4px;flex-wrap:wrap}.postfilter button{font:600 .9rem system-ui,sans-serif;padding:7px 16px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer}
.postfilter button[aria-pressed="true"]{background:#3b2a1e;color:#fff;border-color:#3b2a1e}
.card.post .postbody{white-space:pre-line}.postvideo{display:block;width:100%;max-height:520px;aspect-ratio:3/4;object-fit:cover;border:0;border-radius:8px;background:#1a120c;margin:8px 0}
iframe.postvideo{aspect-ratio:16/9;max-height:none}
#postgrid article[hidden]{display:none}
/* 1.0.7 field report: inside the solid dark brown left panel, under the verse, left edge on the welcome text column,
   never over the photo (photo back at its 1.0.6 position and size). An outer softly glowing amber border holds the
   FIELD REPORT header and two even columns of five boxed rows: left STATUS (declassified), OPERATIVE, SECTOR, COURSE,
   TERRAIN; right CHECKPOINT, PACE, TIME OF REPORT, DATE, STATUS. The hero text is tightened so it all fits; the hero
   grows rather than overflowing when the screen is short. Up to 900px it stays below the photo (one column on phones). */
.fieldreport.fieldreport{display:grid;grid-template-columns:max-content;column-gap:8px;row-gap:5px;align-items:stretch;text-align:left}
.fieldreport.fieldreport dl{display:contents}
.fieldreport.fieldreport .frhead{grid-column:1/-1;margin:0 0 1px;text-align:left}
.fieldreport.fieldreport .frreport,.fieldreport.fieldreport dl > div,.fieldreport.fieldreport .frstatus{display:flex;flex-wrap:nowrap;align-items:center;gap:0 .45em;margin:0;padding:3px 7px;white-space:nowrap;text-indent:0;border:1px solid rgba(255,196,107,.32);border-radius:3px;background:rgba(14,10,7,.42);box-shadow:0 0 6px rgba(255,180,80,.22),inset 0 0 5px rgba(255,180,80,.07)}
.fieldreport.fieldreport dl > div dt,.fieldreport.fieldreport dl > div dd,.fieldreport.fieldreport .frsector dd .frpart{display:inline;white-space:nowrap;padding:0}
@media (min-width:601px){
.fieldreport.fieldreport{grid-template-columns:max-content max-content}
.fieldreport.fieldreport .frreport{grid-column:1;grid-row:2}
.fieldreport.fieldreport dl > div:nth-child(1){grid-column:1;grid-row:3}.fieldreport.fieldreport dl > div:nth-child(2){grid-column:1;grid-row:4}
.fieldreport.fieldreport dl > div:nth-child(3){grid-column:1;grid-row:5}.fieldreport.fieldreport dl > div:nth-child(4){grid-column:1;grid-row:6}
.fieldreport.fieldreport dl > div:nth-child(5){grid-column:2;grid-row:2}.fieldreport.fieldreport dl > div:nth-child(6){grid-column:2;grid-row:3}
.fieldreport.fieldreport dl > div:nth-child(7){grid-column:2;grid-row:4}.fieldreport.fieldreport dl > div:nth-child(8){grid-column:2;grid-row:5}
.fieldreport.fieldreport .frstatus{grid-column:2;grid-row:6}
}
@media (min-width:901px){
.herophoto{height:auto;min-height:calc(100vh - 82px);max-height:none;padding:18px 0 22px}
.herotext h1{margin:0 0 4px;line-height:1.1}.herotext p{margin:0 0 8px}.herotext h2{margin:8px 0 2px;font-size:1.15rem}
.herotext ul{margin:0 0 10px}.herotext .btn{margin:2px 0 4px}.hero .verse{margin-top:12px;margin-bottom:0}
.fieldreport.fieldreport{position:relative;z-index:3;left:auto;right:auto;bottom:auto;width:max-content;max-width:none;margin:16px 0 0 max(20px,calc((100% - 1040px) / 2));padding:10px 12px 12px;border:1px solid rgba(255,196,107,.38);border-radius:5px;background:rgba(14,10,7,.35);box-shadow:0 0 10px rgba(255,180,80,.25),0 0 22px rgba(255,170,60,.12),inset 0 0 8px rgba(255,180,80,.06);font-size:clamp(10px,calc(.62vw + 1.6px),11px);line-height:1.3}
.fieldreport.fieldreport dl dt,.fieldreport.fieldreport dl dd,.fieldreport.fieldreport .frunit,.fieldreport.fieldreport .frstatus,.fieldreport.fieldreport .frreport,.fieldreport.fieldreport .frsector,.fieldreport.fieldreport .frsector dt,.fieldreport.fieldreport .frsector dd{letter-spacing:.02em}
.herophoto::before{background:none}
}
@media (max-width:900px){.fieldreport.fieldreport{justify-content:start}}
/* 1.0.7 footer and contact page: SUPPORT THE MISSION: DONATE TO TORI as a small classified-style pill */
.footdonate,.contactdonate{display:inline-flex;flex-wrap:wrap;align-items:center;gap:2px .45em;padding:3px 9px;margin:2px 14px 2px 0;border:1px solid rgba(255,196,107,.4);border-radius:4px;background:rgba(14,10,7,.35);box-shadow:0 0 6px rgba(255,180,80,.25);font-family:"Special Elite","Courier New",monospace;font-size:.82rem;letter-spacing:.03em;line-height:1.35;vertical-align:middle}
.footdonate .dlabel,.contactdonate .dlabel{color:#fff}
.footlinks .footdonate a,.footdonate a,.contactdonate a{color:#ffc46b;margin:0;text-decoration:none;border-bottom:1px solid rgba(255,196,107,.5)}
.footdonate a:hover,.contactdonate a:hover{border-bottom-color:#ffc46b}
.footdonate a:focus-visible,.contactdonate a:focus-visible{outline:2px solid #ffc46b;outline-offset:2px;border-radius:2px}
.contactdonate{background:#2a2019;margin:4px 0 14px}
@media (min-width:901px){.herophoto{padding:12px 0 16px}.hero .verse{margin-top:8px;margin-bottom:0}.herotext h2{margin:6px 0 2px}.fieldreport.fieldreport{margin-top:12px;font-size:clamp(10px,calc(.62vw + 1.6px),10.5px)}}
@media (min-width:901px){.fieldreport.fieldreport dl dt,.fieldreport.fieldreport dl dd,.fieldreport.fieldreport .frunit,.fieldreport.fieldreport .frstatus,.fieldreport.fieldreport .frreport,.fieldreport.fieldreport .frsector,.fieldreport.fieldreport .frsector dt,.fieldreport.fieldreport .frsector dd,.fieldreport.fieldreport .frlabel{letter-spacing:0}.fieldreport.fieldreport .frreport,.fieldreport.fieldreport dl > div,.fieldreport.fieldreport .frstatus{padding:3px 6px}}
/* combined DATE / TIME OF REPORT box: col2, 4th row (two lines), COURSE stretched to match; one amber box drawn by ::after */
.fieldreport.fieldreport dl > div:nth-child(8){grid-column:2;grid-row:5;--to:7;position:relative;z-index:1;border-color:transparent;background:none;box-shadow:none;padding-bottom:0}
.fieldreport.fieldreport dl > div:nth-child(7){grid-column:2;grid-row:6;--to:8;position:relative;z-index:1;border-color:transparent;background:none;box-shadow:none;padding-top:0;margin-top:-4px}
@media (max-width:600px){.frband .frframe{padding:5px;border-width:3px}}
/* 1.0.8 header brand: on the home page the header brand and tagline are hidden (the big hero title names the site);
   the space is kept on desktop so the header height does not change, the menu stays right aligned. On every other
   page the brand is a clear Back to home link: pointer, subtle amber underline and a small left arrow on hover and
   keyboard focus, with a visible focus ring. */
body.home header.top .brand{visibility:hidden}
@media (max-width:900px){body.home header.top .brand{display:none}body.home header.top .wrap{justify-content:flex-end}}
header.top .brand{position:relative;cursor:pointer;border-radius:3px}
header.top .brand::before{content:"\2190";position:absolute;left:-1.1em;top:.05em;font-size:.8em;color:#c98a2b;opacity:0;transition:opacity .15s}
header.top .brand:hover,header.top .brand:focus-visible{text-decoration:underline;text-decoration-color:#e0a03c;text-decoration-thickness:2px;text-underline-offset:4px}
header.top .brand:hover::before,header.top .brand:focus-visible::before{opacity:1}
header.top .brand:focus-visible{outline:2px solid #e0a03c;outline-offset:4px}
@media (prefers-reduced-motion:reduce){header.top .brand::before{transition:none}}
/* 1.0.9 fixed dark top bar: the left rail is gone (content uses the full width); the header is a slim bar fixed to the
   top of every page with Blog, Store, About, Contact, Cart and the gold Donate pill. Page content is offset by the bar
   height (--bar, measured by content.js; 60px fallback) and anchor jumps leave room for it (scroll-padding-top).
   Three looks: barA Gradient (in use on every page), barB Glass and barC Tactical are kept so Tori can switch later by changing
   the header class barA to barB or barC in the page markup (one line per page, via the build). */
:root{--bar:60px}
html{scroll-padding-top:calc(var(--bar) + 10px)}
body{padding-top:var(--bar)}
.layout,.layout.layout{display:block;max-width:none;margin:0}
header.top{position:fixed;top:0;left:0;right:0;z-index:60;min-height:60px;background:#0d0906;border-bottom:0}
header.top .wrap,header.top .wrap.wrap{max-width:1180px;min-height:60px;display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:12px;padding-top:0;padding-bottom:0}
header.top .brand{font-size:1.15rem;line-height:1.2;color:#fff3d6;white-space:nowrap}
header.top .tagline{display:none}
header.top nav,header.top nav.nav{display:flex;flex-wrap:nowrap;align-items:center;gap:2px}
header.top nav a{margin:0;padding:7px 11px;border-radius:4px;color:#ffc46b;text-decoration:none;font:600 .92rem/1.2 system-ui,sans-serif;white-space:nowrap;transition:color .15s,background-color .15s}
header.top nav a:hover,header.top nav a:focus-visible{color:#ffe2ad;text-decoration:underline;text-decoration-color:#ffb347;text-decoration-thickness:2px;text-underline-offset:5px}
header.top nav a.current{color:#ffe2ad;text-decoration:underline;text-decoration-color:#ffb347;text-decoration-thickness:2px;text-underline-offset:5px}
header.top nav a:focus-visible{outline:2px solid #ffb347;outline-offset:2px}
header.top nav a.navdonate{margin-left:8px;padding:7px 18px;border-radius:999px;background:var(--gold);color:#22170e;font-weight:700;text-decoration:none;box-shadow:0 0 10px rgba(255,180,80,.25)}
header.top nav a.navdonate:hover,header.top nav a.navdonate:focus-visible,header.top nav a.navdonate.current{background:#f0bd55;color:#140d08;text-decoration:none}
header.top .brand:hover,header.top .brand:focus-visible{color:#fff}
@media (max-width:900px){header.top nav a{margin:0;padding:6px 8px;font-size:.88rem}header.top nav a.navdonate{margin-left:4px;padding:6px 12px}}
@media (max-width:600px){header.top .wrap,header.top .wrap.wrap{flex-wrap:wrap;justify-content:center;gap:2px 8px;padding:6px 8px;min-height:0}
header.top nav,header.top nav.nav{flex-wrap:wrap;justify-content:center;gap:2px 0}header.top nav a{padding:5px 7px;font-size:.84rem}header.top nav a.navdonate{padding:5px 12px}
header.top .brand{font-size:1rem}body.home header.top .wrap{justify-content:center}}
.feedbackpill{z-index:20}
/* Option A, Gradient: near black to deep brown, thin amber line along the bottom with a soft glow under it */
header.top.barA{background:linear-gradient(90deg,#0a0705 0%,#140e09 45%,#3a2616 100%);border-bottom:2px solid #e0a03c;box-shadow:0 2px 16px rgba(255,170,60,.28)}
/* Option B, Glass: see-through black with blur, hairline amber bottom border, light text with an amber hover underline */
header.top.barB{background:rgba(8,6,4,.76);-webkit-backdrop-filter:blur(10px) saturate(1.2);backdrop-filter:blur(10px) saturate(1.2);border-bottom:1px solid rgba(255,196,107,.6)}
header.top.barB nav a:not(.navdonate){color:#f4ece0}
header.top.barB nav a:not(.navdonate):hover,header.top.barB nav a:not(.navdonate).current{color:#fff;text-decoration-color:#ffc46b}
/* Option C, Tactical: solid near black, deep brown inner border, thin amber top line, typewriter small caps, amber pill,
   a tiny amber dot under the current page */
header.top.barC{background:#0b0806;border-top:2px solid #ffb347;box-shadow:inset 0 -3px 0 #4a311d,inset 0 0 0 1px #3a2616,0 3px 10px rgba(0,0,0,.5)}
header.top.barC nav a:not(.navdonate){position:relative;font-family:"Special Elite","Courier New",monospace;font-weight:400;font-variant-caps:all-small-caps;font-size:1.02rem;letter-spacing:.16em;color:#ffc46b;text-decoration:none}
header.top.barC nav a:not(.navdonate):hover,header.top.barC nav a:not(.navdonate):focus-visible{color:#ffe2ad;text-decoration:none;text-shadow:0 0 8px rgba(255,180,80,.45)}
header.top.barC nav a:not(.navdonate).current{text-decoration:none;color:#ffe2ad}
header.top.barC nav a:not(.navdonate).current::after{content:"";position:absolute;left:50%;bottom:1px;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:#ffb347;box-shadow:0 0 6px #ffb347}
header.top.barC nav a.navdonate{background:#ffb347;color:#120c07;font-family:"Special Elite","Courier New",monospace;font-weight:400;letter-spacing:.12em;font-variant-caps:all-small-caps;font-size:1.02rem;border-radius:999px}
header.top.barC .brand{font-family:"Special Elite","Courier New",monospace;font-weight:400;letter-spacing:.06em}
/* 1.0.11 compact field report row (replaces the 1.0.10 block): one slim amber accented bar directly under the photo
   (the hero keeps its framing). Readable on laptops: 13.5px typewriter text, FIELD REPORT a bit bigger and letter
   spaced. Two balanced centred rows at 1100px and up (label plus STATUS, OPERATIVE, SECTOR, COURSE, TERRAIN, then
   CHECKPOINT, PACE, DATE and the boxed run STATUS); the rows wrap naturally on narrower screens and become a two
   column list on phones. Every item is the same height, thin amber dividers are centred vertically, values glow
   softly amber, labels are a lighter muted tone. No ticker, no sideways scroll; the text space is reserved. */
.herophoto,.herophoto.herophoto{min-height:calc(100vh - var(--hdr,82px));min-height:calc(100svh - var(--hdr,82px))}
.frband{position:relative;margin:0;padding:0;background:linear-gradient(90deg,#0a0705 0%,#140e09 50%,#2a1b10 100%);border-top:1px solid #e0a03c;border-bottom:1px solid #e0a03c;box-shadow:0 0 12px rgba(255,170,60,.25),inset 0 0 10px rgba(255,170,60,.06);color:#fff3d6}
.frband .wrap{display:flex;align-items:center;justify-content:center;max-width:none;min-height:56px;margin:0;padding:8px 20px;background:none}
.frband .frframe{display:block;width:auto;max-width:100%;padding:0;border:0;border-radius:0;background:none;box-shadow:none;visibility:hidden;opacity:0;transition:opacity .4s ease-out}
.frband .frframe.frshown{visibility:visible;opacity:1}
.frband .fieldreport.fieldreport{position:static;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 0;width:auto;max-width:100%;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;opacity:1;translate:none;transition:none;font-family:"Special Elite","Courier New",monospace;font-size:13.5px;line-height:1.2;letter-spacing:0;text-transform:uppercase;text-align:left}
.frband .fieldreport.fieldreport dl{display:contents;margin:0}
.frband .fieldreport.fieldreport .frhead{display:flex;align-items:center;height:1.9em;margin:0 .5em 0 0;padding:0;font-size:1.12em;letter-spacing:.2em;white-space:nowrap;color:#fff;text-shadow:0 0 6px rgba(255,190,100,.25)}
.frband .fieldreport.fieldreport .frreport,.frband .fieldreport.fieldreport dl > div,.frband .fieldreport.fieldreport .frstatus{position:relative;box-sizing:border-box;display:flex;flex-wrap:nowrap;align-items:center;gap:0 .45em;height:1.9em;min-height:0;margin:0;padding:0 .85em;white-space:nowrap;border:0;border-radius:0;background:none;box-shadow:none;text-indent:0;letter-spacing:0}
.frband .fieldreport.fieldreport .frreport::before,.frband .fieldreport.fieldreport dl > div::before{content:"";position:absolute;left:0;top:50%;width:1px;height:1.1em;translate:0 -50%;background:rgba(255,196,107,.55)}
.frband .fieldreport.fieldreport dl > div:nth-child(5)::before{display:none}
.frband .fieldreport.fieldreport dt,.frband .fieldreport.fieldreport .frlabel,.frband .fieldreport.fieldreport .frunit{color:#d8c7a6;text-shadow:none}
.frband .fieldreport.fieldreport dd,.frband .fieldreport.fieldreport #frreport_status,.frband .fieldreport.fieldreport #frstatus{color:#ffc46b;text-shadow:0 0 5px rgba(255,170,60,.45)}
.frband .fieldreport.fieldreport dd .frunit{color:#d8c7a6;text-shadow:none}
.frband .fieldreport.fieldreport dl > div dt,.frband .fieldreport.fieldreport dl > div dd,.frband .fieldreport.fieldreport .frsector dd .frpart{display:inline;margin:0;padding:0;white-space:nowrap;letter-spacing:0}
.frband .fieldreport.fieldreport dl > div:nth-child(7){display:none}
.frband .fieldreport .frtime12{display:inline}.frband .fieldreport .frtime12[hidden]{display:none}
.frband .fieldreport.fieldreport .frstatus{margin-left:.5em;padding:0 .9em;border:1px solid #ffb347;border-radius:3px;background:rgba(255,179,71,.12);box-shadow:0 0 12px rgba(255,180,80,.5),inset 0 0 6px rgba(255,180,80,.15)}
.frband .fieldreport.fieldreport .frstatus #frstatus{color:#ffd28a;text-shadow:0 0 7px rgba(255,170,60,.65)}
/* two balanced rows: a full width break (::after) between TERRAIN and CHECKPOINT */
.frband .fieldreport.fieldreport::after{content:"";display:block;flex-basis:100%;height:0;order:1}
.frband .fieldreport.fieldreport dl > div:nth-child(n+5),.frband .fieldreport.fieldreport .frstatus{order:2}
/* typing cursor: zero width, so it never moves the text; blinks briefly at the end, then fades */
.frcursor{position:relative;display:inline-block;width:0;height:1em;vertical-align:-.12em}
.frcursor::before{content:"";position:absolute;left:2px;top:0;width:.5em;height:1em;background:#ffb347;box-shadow:0 0 6px rgba(255,170,60,.7);animation:frblink .55s steps(1) infinite}
.frcursor.frcfade{opacity:0;transition:opacity .5s ease-out}
@keyframes frblink{50%{opacity:0}}
@media (max-width:1099px){.frband .fieldreport.fieldreport{font-size:13px}.frband .fieldreport.fieldreport::after{display:none}.frband .wrap{padding:8px 14px}}
@media (max-width:600px){
.frband .wrap{padding:10px 12px;display:block}
.frband .fieldreport.fieldreport{display:grid;grid-template-columns:1fr 1fr;gap:4px 10px;font-size:12px;justify-content:stretch}
.frband .fieldreport.fieldreport .frhead{grid-column:1/-1;height:auto;margin:0 0 4px;font-size:1.1em}
.frband .fieldreport.fieldreport .frreport,.frband .fieldreport.fieldreport dl > div,.frband .fieldreport.fieldreport .frstatus{grid-column:auto;grid-row:auto;flex-wrap:wrap;white-space:normal;height:auto;min-height:1.7em;padding:2px 0 2px 8px}
.frband .fieldreport.fieldreport dl > div:nth-child(5)::before{display:block}
.frband .fieldreport.fieldreport dl > div dt,.frband .fieldreport.fieldreport dl > div dd{white-space:normal}
.frband .fieldreport.fieldreport .frdate,.frband .fieldreport.fieldreport .frstatus{grid-column:1/-1}
.frband .fieldreport.fieldreport .frstatus{margin:4px 0 0;padding:3px 8px}}
@media (prefers-reduced-motion:reduce){.frband .frframe{transition:none}.frcursor{display:none}}
/* 1.0.11 floating Feedback pill: hidden while the field report row is on screen (the footer Feedback link stays) */
.feedbackpill{transition:opacity .2s ease-out,visibility .2s}
.frinview .feedbackpill{opacity:0;visibility:hidden;pointer-events:none}
/* 1.0.12 blog post pages (/blog/<slug>/) and linked card titles */
.card.post h3 a{color:inherit;text-decoration:none}.card.post h3 a:hover,.card.post h3 a:focus-visible{text-decoration:underline;text-decoration-color:#e0a03c}
.postpage{max-width:760px}.postpage h1{margin:6px 0 12px}.postpage .postmeta{margin:0;color:#6b5848}.postpage .postmeta time{margin-left:8px}
.postpage .postbody p{margin:0 0 1em;line-height:1.7}.postpage .postback{margin:10px 0}.postpage .postvideo{margin:6px 0 16px}
