
@font-face { font-family:"Pirata One"; src:url(/fonts/pirata-one-latin-400-normal.woff2) format("woff2"); font-display:swap; }
@font-face { font-family:"Open Sans Condensed"; font-weight:700; src:url(/fonts/open-sans-condensed-latin-700-normal.woff2) format("woff2"); font-display:swap; }
@font-face { font-family:"Old Standard TT"; src:url(/fonts/old-standard-tt-latin-400-normal.woff2) format("woff2"); font-display:swap; }
@font-face { font-family:"Old Standard TT"; font-style:italic; src:url(/fonts/old-standard-tt-latin-400-italic.woff2) format("woff2"); font-display:swap; }
@font-face { font-family:"Old Standard TT"; font-weight:700; src:url(/fonts/old-standard-tt-latin-700-normal.woff2) format("woff2"); font-display:swap; }

/* Black is the default surface. Bone surfaces and black slips reset the same names,
   so text, rules, links, and buttons follow whichever surface they sit on. */
:root { --k:#0b0908; --b:#e6dcc6; --r:#b3170f; --r-lit:#e0352a; --white:#fffdf8;
  --serif:"Old Standard TT",Georgia,serif; --display:"Pirata One",Georgia,serif; --cond:"Open Sans Condensed","Arial Narrow",sans-serif;
  --pad:clamp(1rem,4.5cqw,3.75rem); }
:root, .ink { --fg:var(--b); --bg:var(--k); --muted:#b5ab98; --alarm:#ef7d6f; --line:rgb(230 220 198 / .38); --under:rgb(212 176 106 / .5); --link:#d4b06a; --link-hi:#f0d491; }
.bone, .top, .admin .sheet { color-scheme:light; --fg:var(--k); --bg:var(--b); --muted:#4d4237; --alarm:var(--r); --line:rgb(11 9 8 / .32); --under:rgb(90 63 18 / .45); --link:#5a3f12; --link-hi:#2b1d06; }
.slip, .sum, .admin .receipt { color-scheme:dark; --fg:var(--b); --bg:var(--k); --muted:#b5ab98; --alarm:#ef7d6f; --line:rgb(230 220 198 / .38); --under:rgb(212 176 106 / .5); --link:#d4b06a; --link-hi:#f0d491; }

* { box-sizing:border-box; }
html { color-scheme:dark; overflow-x:clip; -webkit-text-size-adjust:100%; }
body { margin:0; background:#a08468 url(/theme/wood.jpg) center top/1500px auto; background-blend-mode:multiply; color:var(--b); font:19px/1.5 var(--serif); overflow-x:clip; }
img { max-width:100%; height:auto; display:block; }
a { color:inherit; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:.24em; text-decoration-color:var(--under); }
main :is(p,li,dd,td,th,small) a:not([class]):not(nav a) { color:var(--link); }
p { margin:0 0 .85rem; }
h1, h2, h3 { font-weight:400; margin:0; }
figure { margin:0; }
:focus-visible { outline:3px solid currentColor; outline-offset:2px; }
::selection { background:var(--r); color:var(--b); }
.skip { position:absolute; left:-999px; z-index:9; }
.skip:focus { left:1rem; top:1rem; display:inline-flex; align-items:center; min-height:44px; background:var(--b); color:var(--k); padding:.5rem .75rem; }
.vh { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
[hidden] { display:none !important; }

/* The sheet on the table, with a margin of wood that opens as the screen widens. */
.broad { container:broad / inline-size; display:flex; flex-direction:column; min-height:100vh; max-width:1560px; margin:0 auto; padding:0 max(0px,calc(2.4vw - 10px)); }
main { flex:1; width:100%; background:var(--k); }

/* Top bar */
.top { position:relative; z-index:3; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:0 1.5rem; padding:.25rem var(--pad); background:var(--b); color:var(--k); }
.mark { display:inline-flex; align-items:center; min-height:44px; font:400 1.9rem/1 var(--display); text-decoration:none; color:var(--k); }
.links { display:flex; flex-wrap:wrap; gap:0 2.25rem; }
.links a { display:inline-flex; align-items:center; min-height:44px; color:var(--k); font:700 1.1rem var(--cond); text-transform:uppercase; letter-spacing:.06em; text-decoration:none; }

/* Footer */
.foot { padding:1.25rem var(--pad) 1.75rem; background:var(--k); border-top:6px solid var(--b); font-size:1rem; }
.foot div { display:flex; flex-wrap:wrap; align-items:center; gap:0 2rem; }
.foot span { margin-right:auto; color:var(--muted); }
.foot .pride { display:block; width:27px; height:18px; outline:1px solid rgb(230 220 198 / .35); }
.foot a { display:inline-flex; align-items:center; min-height:44px; font:700 1rem var(--cond); text-transform:uppercase; letter-spacing:.06em; text-decoration:none; }

/* Gouged woodcut edges between black and bone. */
.cut { height:84px; background:center/1200px 84px repeat-x; }
.cut.k2b { background-image:url(/ink/k2b.svg); }
.cut.b2k { background-image:url(/ink/b2k.svg); }

/* Mastheads. The name runs the full width of the sheet with the ink worn through. */
.mast, .page-head { position:relative; padding:0 var(--pad) 1.75rem; background:var(--k); overflow:hidden; }
.mast::before, .mast::after, .page-head::before, .page-head::after, .slip::before, .sum::before, .admin .receipt::before { background:url(/ink/pin.svg) center/contain no-repeat; }
.mast::before, .mast::after, .page-head::before, .page-head::after { content:""; position:absolute; z-index:2; top:.35rem; width:30px; height:30px; }
.mast::before, .page-head::before { left:.5rem; }
.mast::after, .page-head::after { right:.5rem; }
.worn { position:relative; }
.worn::after { content:""; position:absolute; inset:0; background:url(/ink/grain-black.png) center/900px; pointer-events:none; }
.mast h1 { margin:0 calc(var(--pad) * -.45); padding:.08em 0 .1em; font:400 var(--mast-size,16.2cqw)/.82 var(--display); color:var(--b); letter-spacing:-.012em; white-space:pre-line; }
.mast h1.long { --mast-size:9.4cqw; line-height:.9; }
.home-mast h1 { --mast-size:14.8cqw; white-space:nowrap; }
.home-mast h1 span { display:inline-block; }
.dateline { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.1rem 2rem; margin:.4rem 0 1.75rem; padding:.35rem 0 .3rem; border-top:6px solid var(--b); border-bottom:2px solid var(--b); font:700 clamp(1.15rem,2.4cqw,1.5rem)/1.2 var(--cond); text-transform:uppercase; letter-spacing:.04em; }
.mast-lead { display:grid; grid-template-columns:minmax(0,6fr) minmax(0,5fr); gap:1.5rem 3rem; align-items:start; }
.rule-top { border-top:6px solid var(--b); padding-top:1.5rem; margin-top:.4rem; }
.mast-intro { margin:0 0 1.5rem; font:400 clamp(1.55rem,3.6cqw,2.9rem)/1.14 var(--serif); }
.mast-note { margin:0 0 .6rem; font-size:1.2rem; line-height:1.4; }
.mast > .mast-intro { max-width:52rem; }
.mast > .dateline:last-child { margin-bottom:0; }
.mast .cutout { justify-self:end; width:min(100%,34rem); }
.mast-top { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,22rem); gap:1.5rem 2.5rem; align-items:end; padding-top:1.25rem; }
.mast-top h1 { margin-right:0; }
.mast-top .cutout { width:100%; margin-bottom:.4rem; }
.page-head { padding-top:2.25rem; }
.page-head h1 { position:relative; font:400 clamp(3rem,9.5cqw,7.5rem)/.9 var(--display); color:var(--b); margin:0 0 0 -.03em; }
.page-head .steps { margin:0 0 .9rem; }

/* Photographs sit whole in a hand-cut black frame. */
.cutout { position:relative; padding:.6rem; background:var(--k); outline:4px solid currentColor; outline-offset:-2px; }
.bone .cutout { color:var(--k); }
.cutout img { width:100%; }

/* Bands of the sheet */
.band { padding:.5rem var(--pad) 2.5rem; background:var(--k); }
.band.bone { background:var(--b); color:var(--k); }
.band-h { font:400 clamp(3.4rem,12.8cqw,10.5rem)/.9 var(--display); margin:0 0 1.5rem -.03em; }
.news { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:2rem 3rem; align-items:start; }
.prose p:first-child { font:700 1.45rem/1.25 var(--serif); }
.lede { font:400 clamp(1.4rem,3cqw,2.3rem)/1.22 var(--serif); max-width:48rem; }
.sketch { margin-top:1.5rem; }
.door { display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:1.5rem 3rem; align-items:center; padding:2.25rem var(--pad); background:var(--k); }
.door h2 { font:400 clamp(3rem,7.6cqw,6.5rem)/.92 var(--display); margin:0 0 .8rem; }
.door p { font-size:1.2rem; line-height:1.4; }
.door p:last-child { margin:0; }
.wall { background:var(--k); padding:5px 0; }
.bricks { --row:18.7cqw; display:flex; flex-wrap:wrap; gap:5px; }
.bricks img { width:0; min-width:0; height:auto; }
.bricks .land { flex:1.5 1 calc(var(--row) * 1.5); }
.bricks .port { flex:.6667 1 calc(var(--row) * .6667); }
.bricks .even { flex:1 1 var(--row); }
.bricks.grid-wall { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }
.bricks.grid-wall img { width:100%; }
.tail { display:flex; justify-content:center; padding-top:3rem; padding-bottom:3.5rem; }

/* Pinned black slips */
.slip { position:relative; padding:1.6rem 1.5rem 1.5rem; background:var(--k); color:var(--b); box-shadow:3px 4px 0 rgb(0 0 0 / .45); }
.slip::before, .sum::before, .admin .receipt::before { content:""; position:absolute; left:calc(50% - 15px); top:-13px; width:30px; height:30px; }
.tail .slip { width:min(100%,42rem); transform:rotate(.8deg); }
.tail .slip p { font:400 clamp(1.35rem,2.6cqw,1.9rem)/1.25 var(--serif); }

/* Buttons and links that act as buttons */
button, .btn { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:.55rem 1.2rem; border:2px solid var(--r); border-radius:0; background:var(--r); color:var(--b);
  font:700 1.15rem/1.1 var(--cond); text-transform:uppercase; letter-spacing:.05em; text-decoration:none; cursor:pointer; touch-action:manipulation; }
button.secondary, .btn { background:transparent; color:var(--fg); border-color:var(--fg); }
.btn.go { background:var(--r); border-color:var(--r); color:var(--b); }
.btn.stop { color:var(--alarm); border-color:var(--alarm); }
button:disabled { opacity:.55; cursor:not-allowed; }
.home-acts { display:flex; flex-wrap:wrap; gap:.75rem; }
.home-acts .btn { min-width:11rem; }
@media (hover:hover) {
  a:hover { color:var(--alarm); }
  main :is(p,li,dd,td,th,small) a:not([class]):not(nav a):hover { color:var(--link-hi); text-decoration-color:currentColor; }
  .mark:hover, .links a:hover { color:var(--r); }
  button:not(.secondary):not(.btn):not(:disabled):hover, .btn.go:hover { background:#8f120c; border-color:#8f120c; color:var(--b); }
  button.secondary:hover, .btn:not(.go):not(.stop):hover { background:var(--fg); color:var(--bg); }
  .btn.stop:hover { background:var(--alarm); color:var(--bg); }
}

/* Form fields: plain, white, and straight, with text large enough that phones do not zoom. */
:where(input:not([type=checkbox],[type=radio],[type=hidden],[type=file]), select, textarea) {
  display:block; width:100%; min-height:44px; margin-top:.3rem; padding:.5rem .65rem; border:2px solid var(--k); border-radius:0;
  background:var(--white); color:var(--k); font:400 17px/1.3 var(--serif); }
:where(input[type=file]) { display:block; min-height:44px; margin-top:.3rem; font:400 17px/1.3 var(--serif); color:inherit; max-width:100%; }
::file-selector-button { min-height:44px; margin-right:.75rem; padding:.4rem .9rem; border:2px solid currentColor; border-radius:0; background:transparent; color:inherit; font:700 1rem var(--cond); text-transform:uppercase; letter-spacing:.05em; cursor:pointer; }
textarea { resize:vertical; }
input:focus, select:focus, textarea:focus { outline:3px solid var(--r); outline-offset:1px; }
:where(input[type=checkbox], input[type=radio]) { width:22px; height:22px; flex:none; margin:.15rem 0 0; accent-color:var(--r); }
.wide { display:block; width:100%; font-weight:700; }
.wide .fine { display:block; margin-top:.3rem; font-weight:400; }
.check, .agree { display:flex; gap:.65rem; align-items:flex-start; min-height:44px; padding-top:.35rem; }
.fine { font-size:1rem; color:var(--muted); margin:.6rem 0 0; }
.fine a { color:var(--fg); }
.dim { color:var(--muted); }
.lead { font-size:1.15rem; margin:.4rem 0 1.25rem; }

/* Messages: calm boxes with a heavy rule, never texture. */
.errors { margin:1rem 0; padding:.8rem 1rem; background:#fff7f2; color:var(--k); border-left:6px solid var(--r); font-weight:700; }
.errors ul { margin:.3rem 0 0; padding-left:1.25rem; font-weight:400; }
.errors p { margin:0 0 .3rem; }
.errors p:last-child { margin:0; }

/* Tables of tickets and money */
table { width:100%; border-collapse:collapse; font-variant-numeric:tabular-nums; }
th, td { text-align:left; padding:.6rem .8rem .6rem 0; border-bottom:1px solid var(--line); vertical-align:top; }
th { font:700 1.02rem/1.25 var(--cond); text-transform:uppercase; letter-spacing:.04em; }
thead th { border-bottom:2px solid currentColor; }
th:last-child, td:last-child { padding-right:0; }
.num { text-align:right; font-variant-numeric:tabular-nums; }

/* Order steps */
.steps { list-style:none; display:flex; flex-wrap:wrap; gap:.25rem 1.75rem; margin:0 0 1.25rem; padding:0; counter-reset:step; font:700 1.05rem/1.3 var(--cond); text-transform:uppercase; letter-spacing:.05em; }
.steps li { counter-increment:step; color:var(--muted); }
.steps li::before { content:counter(step) ". "; }
.steps li[aria-current] { color:var(--fg); text-decoration:underline; text-decoration-color:var(--under); text-decoration-thickness:3px; text-underline-offset:.3em; }

/* Event list */
.wrap { max-width:80rem; }
.event-card { display:block; padding:1rem 0 1.4rem; border-top:6px solid var(--fg); }
.event-card + .event-card { margin-top:.75rem; }
.event-card h2 { font:400 clamp(2.4rem,5cqw,3.6rem)/1 var(--display); margin:0 0 .3rem; }
.event-card h2 a { text-decoration:none; }
.event-card .dim { font:700 1.1rem/1.3 var(--cond); text-transform:uppercase; letter-spacing:.04em; }
.event-card p { margin:.35rem 0 0; }
.event-card .countdown { font-weight:700; }

/* Tickets on the event page */
.buy { display:grid; grid-template-columns:minmax(0,1fr) 21rem; gap:2.5rem; align-items:start; }
.grp { display:block; font:400 clamp(2.4rem,4.6cqw,3.4rem)/1 var(--display); margin:1.5rem 0 .4rem; }
.panel > section:first-child .grp { margin-top:0; }
.note { font-style:italic; color:var(--muted); margin:0 0 .6rem; }
.t { position:relative; display:grid; grid-template-columns:minmax(0,1fr) 6rem 9.5rem; gap:.6rem 1rem; align-items:start; padding:.9rem 0; border-top:2px solid var(--fg); }
.t h3 { font:700 1.35rem/1.15 var(--cond); text-transform:uppercase; letter-spacing:.02em; }
.t p { margin:.25rem 0 0; font-size:1.02rem; line-height:1.45; max-width:62ch; }
.policy { margin-top:.3rem; font-size:1rem; }
.policy summary { display:inline-flex; align-items:center; min-height:44px; cursor:pointer; text-decoration:underline; text-decoration-color:var(--under); text-decoration-thickness:2px; text-underline-offset:.16em; }
.stock { display:block; margin-top:.25rem; color:var(--alarm); font:700 1.02rem var(--cond); text-transform:uppercase; letter-spacing:.03em; }
.price { text-align:right; font:700 1.35rem/1.2 var(--cond); font-variant-numeric:tabular-nums; }
.qty { display:flex; justify-content:flex-end; }
.qty input { width:3.4rem; min-height:44px; margin:0; padding:.3rem; text-align:center; font-weight:700; appearance:textfield; -moz-appearance:textfield; }
.qty input::-webkit-inner-spin-button, .qty input::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
.stepper { display:inline-flex; align-items:center; gap:.25rem; }
.stepper button { flex:none; width:44px; height:44px; padding:0; background:transparent; color:var(--fg); border:2px solid var(--fg); font:400 1.4rem/1 system-ui,sans-serif; }
.agree { grid-column:1/-1; font-size:1rem; }
.t.soldout h3, .t.soldout p, .t.soldout .price { color:var(--muted); }
.stamp { position:absolute; right:0; top:50%; z-index:2; padding:.05rem .7rem .1rem; white-space:nowrap; pointer-events:none; color:var(--r);
  font:700 1.8rem/1.05 var(--cond); letter-spacing:.06em; text-transform:uppercase; border:4px solid currentColor; transform:translateY(-50%) rotate(-7deg); }

/* The order summary is a black slip pinned beside the tickets. It stays straight. */
.sum { position:sticky; top:1.5rem; padding:1.5rem 1.25rem 1.25rem; background:var(--k); color:var(--b); box-shadow:3px 4px 0 rgb(0 0 0 / .45); }
.sum h2 { font:400 2.3rem/1 var(--display); margin:0 0 .6rem; }
.sum dl { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.3rem .75rem; margin:0; font-size:1rem; }
.sum dd { margin:0; font-variant-numeric:tabular-nums; }
.tot { display:flex; justify-content:space-between; align-items:baseline; gap:1rem; margin:.7rem 0; padding-top:.45rem; border-top:3px solid currentColor;
  font:700 1.35rem var(--cond); text-transform:uppercase; font-variant-numeric:tabular-nums; }
.sum button { width:100%; }
.sum .cf-turnstile { margin-bottom:.75rem; }
.codeform { display:flex; flex-wrap:wrap; gap:.75rem; align-items:end; margin-top:2rem; padding-top:1rem; border-top:2px solid var(--fg); max-width:40rem; }
.codeform label { flex:1 1 14rem; font-weight:700; }

/* Checkout and order pages */
.doc { max-width:46rem; padding-top:1rem; }
.doc table { margin:.5rem 0 1rem; }
.seats { display:grid; gap:1.1rem; margin-top:1rem; }
.seat { min-width:0; margin:0; padding:.9rem 1rem 1rem; border:2px solid var(--fg); display:grid; gap:.6rem; }
.seat legend { padding:0 .4rem; font:700 1.2rem var(--cond); text-transform:uppercase; letter-spacing:.03em; }
.seat-other { display:none; gap:.8rem; padding-top:.25rem; }
.seat:has(input[value="other"]:checked) .seat-other { display:grid; }
.seats button { width:100%; }
.payment { margin-top:2rem; display:grid; gap:1rem; }
.payment h2 { font:400 2.6rem/1 var(--display); margin:0; }
.payment .lead, .payment .fine, .payment .errors { margin:0; }
.payment button { width:100%; }
.acts { display:flex; gap:1rem; align-items:end; flex-wrap:wrap; margin-top:1.5rem; }

/* Releases: the full text set like a printed document, then a plain, calm form. */
.waiver-text { margin:1.25rem 0 1.5rem; padding:1.25rem clamp(1rem,3cqw,2rem) 1rem; background:var(--white); color:var(--k); border:2px solid var(--k); }
.waiver-text h2 { font:700 clamp(1.35rem,3cqw,1.75rem)/1.2 var(--serif); margin:0 0 .9rem; }
.waiver-body h2, .waiver-body h3, .waiver-body h4 { font:700 1.15rem/1.3 var(--serif); margin:1.5rem 0 .45rem; }
.waiver-body p, .waiver-body li { font-size:1.05rem; line-height:1.55; }
.waiver-body ul, .waiver-body ol { margin:0 0 .85rem; padding-left:1.4rem; }
.waiver-body li { margin-bottom:.3rem; }
.waiver-body hr { border:0; border-top:2px solid var(--k); margin:1rem 0; }
.waiver-notice { margin:0 0 1.75rem; padding:.85rem 1rem; background:#f3ecdc; border-left:6px solid var(--k); }
.waiver-notice h3 { margin:0 0 .3rem; font:700 1.15rem var(--cond); text-transform:uppercase; letter-spacing:.04em; }
.waiver-notice p { margin:0; }
.form-h { font:400 clamp(2.2rem,5cqw,2.9rem)/1 var(--display); margin:0 0 .75rem; padding-top:.35rem; border-top:6px solid var(--k); }
.waiver-form { display:grid; gap:1.15rem; }
.waiver-form .seat .fine { margin:0; }
.waiver-form .check { font-weight:700; }
.note { padding:.75rem 1rem; background:#fff7f2; border-left:6px solid var(--r); font-weight:700; }
.review { display:grid; grid-template-columns:minmax(0,13rem) minmax(0,1fr); gap:.5rem 1.25rem; margin:1rem 0 1.5rem; padding:1rem 0; border-top:6px solid var(--k); border-bottom:2px solid var(--k); }
.review dt { font:700 1.05rem var(--cond); text-transform:uppercase; letter-spacing:.04em; }
.review dd { margin:0; overflow-wrap:anywhere; }
.review .typed { font-style:italic; font-size:1.3rem; }
.sig-pad { display:grid; gap:.6rem; justify-items:start; }
.sig-pad p { margin:0; font-weight:700; }
.sig-pad canvas { display:block; width:100%; max-width:40rem; height:auto; aspect-ratio:3/1; background:var(--white); border:2px solid var(--k); touch-action:none; cursor:crosshair; }
@container broad (max-width:640px) {
  .review { grid-template-columns:minmax(0,1fr); gap:.1rem; }
  .review dd { margin-bottom:.6rem; }
  .acts button, .acts .btn { width:100%; }
}

/* Blog. Posts are listed newest first, and a post is set in one column narrow enough
   to read. A label is a small red stamp whose link still has a 44px tap area. */
.blog-filter { margin:.9rem 0 0; font-size:1.15rem; }
.blog-filter a { color:var(--link); }
.post-meta { display:flex; flex-wrap:wrap; align-items:center; gap:0 1.1rem; margin:0; font:700 1.05rem/1.3 var(--cond); text-transform:uppercase; letter-spacing:.05em; }
.post-meta .label { position:relative; display:inline-flex; align-items:center; min-height:44px; padding:0 .55rem; color:var(--r); text-decoration:none; }
.post-meta .label::before { content:""; position:absolute; inset:9px 0; border:2px solid currentColor; transform:rotate(-1.5deg); pointer-events:none; }
.page-head .post-meta .label { color:var(--r-lit); }
@media (hover:hover) { .post-meta .label:hover { color:var(--fg); } }
.post-list { list-style:none; margin:0; padding:0; max-width:80rem; }
.post-item { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:1rem 2.5rem; align-items:start; padding:.6rem 0 1.6rem; border-top:6px solid var(--fg); }
.post-item + .post-item { margin-top:.75rem; }
.post-item h2 { font:400 clamp(2.1rem,4.4cqw,3.3rem)/1 var(--display); margin:.1rem 0 .5rem; }
.post-list .post-item h2 a { color:var(--fg); text-decoration:none; }
.post-item p:not(.post-meta) { margin:0; max-width:44rem; font-size:1.1rem; line-height:1.45; }
.post-thumb { margin-top:.8rem; width:fit-content; justify-self:end; }
.post-thumb img { width:auto; max-width:16rem; max-height:13rem; }
.post-head h1 { font-size:clamp(2.6rem,7.2cqw,6rem); line-height:.95; max-width:22ch; margin-top:.35rem; }
.post { max-width:40rem; padding-top:1rem; font-size:1.1rem; line-height:1.6; overflow-wrap:break-word; }
.post p { margin:0 0 1.1rem; }
.post > :first-child { margin-top:0; }
.post h2 { font:400 clamp(2.3rem,5cqw,3.2rem)/1 var(--display); margin:2.4rem 0 .7rem; }
.post h3 { font:700 1.45rem/1.2 var(--cond); text-transform:uppercase; letter-spacing:.03em; margin:2rem 0 .5rem; }
.post h4 { font:700 1.15rem/1.25 var(--cond); text-transform:uppercase; letter-spacing:.04em; margin:1.6rem 0 .35rem; }
.post :is(h2,h3,h4) + :is(h3,h4) { margin-top:.6rem; }
.post :is(ul,ol) { margin:0 0 1.1rem; padding-left:1.4rem; }
.post li { margin:0 0 .5rem; padding-left:.2rem; }
.post hr { width:40%; margin:2.2rem 0; border:0; border-top:2px solid var(--line); }
.post-photo { margin:1.75rem 0; }
.post-photo.port { max-width:24rem; }
.post-photo.even { max-width:30rem; }
.post-photos { margin:1.75rem 0; padding:5px; background:var(--k); }
.post-table { margin:1.2rem 0 1.75rem; font-size:1rem; line-height:1.4; }
.post .credit { margin:2.25rem 0 0; }
.post-acts { margin-top:2.25rem; }
@container broad (max-width:760px) {
  .post-item { grid-template-columns:minmax(0,1fr); }
  .post-thumb { justify-self:start; margin-top:.2rem; }
  .post-thumb img { max-height:11rem; }
  .post-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
  .post-table, .post-table tbody, .post-table tr, .post-table td { display:block; }
  .post-table tr { padding:.6rem 0; border-top:2px solid var(--line); }
  .post-table td { padding:.15rem 0; border:0; }
  .post-table td::before { content:attr(data-label) ": "; font:700 .98rem var(--cond); text-transform:uppercase; letter-spacing:.04em; }
}

/* Admin, staff, and account pages: the working sheet. Every rule here is scoped. */
.admin { background:var(--k); font-size:17px; }
.admin .crumbs { display:flex; flex-wrap:wrap; align-items:center; gap:0 .6rem; padding:.5rem var(--pad) 0; font:700 1rem var(--cond); text-transform:uppercase; letter-spacing:.05em; }
.admin .crumbs a { display:inline-flex; align-items:center; min-height:44px; text-decoration:none; }
.admin .crumbs .sep { color:var(--muted); }
.admin .crumbs .who { margin-left:auto; color:var(--muted); text-transform:none; letter-spacing:0; font:400 1rem var(--serif); }
.admin-head { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:1rem 2rem; padding:1.25rem var(--pad) .75rem; }
.admin-head h1 { font:400 clamp(3rem,8cqw,6.5rem)/.9 var(--display); margin:0 0 0 -.03em; }
.admin-head .sub { display:flex; flex-wrap:wrap; align-items:center; gap:.4rem .9rem; margin:.7rem 0 0; font-size:1.1rem; }
.admin .head-acts { display:flex; flex-wrap:wrap; gap:.6rem; }
.admin .sheet { position:relative; padding:0 var(--pad); background:var(--b); color:var(--k); }
.admin .sheet::before, .admin .sheet::after { content:""; display:block; height:84px; margin:0 calc(var(--pad) * -1); background:center/1200px 84px repeat-x; }
.admin .sheet::before { margin-bottom:.75rem; background-image:url(/ink/k2b.svg); }
.admin .sheet::after { margin-top:2.5rem; background-image:url(/ink/b2k.svg); }
.admin .sheet section { margin-top:2.5rem; }
.admin .sheet section:first-child { margin-top:0; }
.admin .bar { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:.5rem 1rem; margin-bottom:.5rem; padding-top:.35rem; border-top:6px solid var(--k); }
.admin .grp { font-size:clamp(2.2rem,4cqw,2.9rem); margin:0; }
.admin th { font-size:.98rem; }
.admin tbody th { font-size:1.05rem; border-bottom:0; }
.admin tbody tr.rule th, .admin tbody tr.rule td { border-top:2px solid var(--k); border-bottom:0; }
.admin td { vertical-align:middle; }
.admin .sub-line { display:block; color:var(--muted); font-size:1rem; line-height:1.3; }
.admin .scroll { overflow-x:auto; }
@media (hover:hover) { .admin .sheet tbody tr:not(.rule):hover td { background:rgb(11 9 8 / .05); } }
.admin .btn.small { min-height:44px; padding:.2rem .7rem; font-size:1rem; }
.admin .wide-btn { width:100%; }
.admin .tag { display:inline-block; padding:.05rem .5rem .1rem; border:2px solid currentColor; font:700 1rem/1.3 var(--cond); letter-spacing:.06em; text-transform:uppercase; white-space:nowrap; }
.admin .tag.good { color:var(--fg); }
.admin .tag.quiet { color:var(--muted); border-style:dashed; }
.admin .tag.bad { color:var(--alarm); }
.admin .tally { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); margin:0; padding:.6rem 0 .8rem; border-top:6px solid var(--k); border-bottom:2px solid var(--k); }
.admin .tally div { padding:0 1rem; border-left:2px solid var(--line); }
.admin .tally div:first-child { padding-left:0; border-left:0; }
.admin .tally dt { font:700 .98rem var(--cond); text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }
.admin .tally dd { margin:.1rem 0 0; font:700 1.9rem/1.1 var(--cond); font-variant-numeric:tabular-nums; }
.admin .tally .net dd { color:var(--r); }
.admin .after-tally { margin:.4rem 0 0; }
.admin progress { display:block; width:100%; height:6px; margin-top:.3rem; border:0; background:rgb(11 9 8 / .15); appearance:none; }
.admin progress::-webkit-progress-bar { background:rgb(11 9 8 / .15); }
.admin progress::-webkit-progress-value { background:var(--r); }
.admin progress::-moz-progress-bar { background:var(--r); }
.admin .form { display:grid; gap:1.25rem; }
.admin .group { min-width:0; margin:0; padding:1rem 0 0; border:0; border-top:2px solid var(--k); }
.admin .group:first-of-type { border-top:0; padding-top:0; }
.admin .group legend ~ * { clear:both; }
.admin .group legend { float:left; width:100%; margin-bottom:.6rem; padding:0; font:700 1.25rem var(--cond); text-transform:uppercase; letter-spacing:.04em; }
.admin .grid { clear:both; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem 1.5rem; }
.admin .grid .wide { grid-column:1/-1; }
.admin .grid .half { grid-column:auto; }
.admin .return-qty { display:inline-block; width:4.5rem; margin:0; text-align:right; }
.admin .check { font-size:1rem; }
.admin .savebar { display:flex; flex-wrap:wrap; gap:.75rem; align-items:center; }
.admin .searchbar { display:flex; flex-wrap:wrap; gap:.75rem; align-items:flex-end; margin-bottom:1.25rem; }
.admin .searchbar .wide { flex:1 1 16rem; width:auto; }
.admin .split { display:grid; grid-template-columns:minmax(0,1fr) 21rem; gap:2.5rem; align-items:start; }
.admin .receipt { position:relative; padding:1.6rem 1.25rem 1.4rem; background:var(--k); color:var(--b); box-shadow:3px 4px 0 rgb(0 0 0 / .35); }
.admin .receipt h2 { font:400 2.3rem/1 var(--display); margin:0 0 .6rem; }
.admin .receipt dl { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.2rem .75rem; margin:0; }
.admin .receipt dd { margin:0; font-variant-numeric:tabular-nums; }
.admin .receipt .tot { margin-bottom:1rem; }
.admin .receipt .form { gap:.8rem; margin-top:1rem; }
.admin .receipt button { width:100%; }
.admin .receipt form + form { margin-top:.6rem; }
.admin .note-box { margin:0 0 1.25rem; padding:.75rem 1rem; background:#f3ecdc; border-left:6px solid var(--k); }
.admin .warn { margin:0 0 1.25rem; padding:.75rem 1rem; background:#fff7f2; border-left:6px solid var(--r); }
.admin .warn p { margin:0 0 .6rem; }
.admin .warn p:last-child { margin:0; }
.admin .return-box { display:grid; gap:.9rem; margin-top:1rem; padding:1rem 1.1rem; border:2px solid var(--k); }
.admin .return-box h3, .admin .close-out h3 { margin:0; font:700 1.25rem var(--cond); text-transform:uppercase; letter-spacing:.04em; }
.admin .empty { padding:1.25rem 0; color:var(--muted); font-style:italic; }
.admin .log { list-style:none; margin:0; padding:0; font-size:1rem; }
.admin .log li { padding:.5rem 0; border-bottom:1px solid var(--line); }
.admin .log time { display:block; color:var(--muted); font-size:1rem; }
.admin .close-out { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:1rem 2rem; padding:1rem 0; border-top:2px solid var(--line); }
.admin .close-out p { margin:.15rem 0 0; color:var(--muted); }
.admin .close-out form { display:flex; flex-wrap:wrap; gap:.75rem; align-items:flex-end; }
.admin .photo-row { display:flex; flex-wrap:wrap; gap:1rem 1.5rem; align-items:flex-start; }
.admin .photo-row .form { flex:1 1 16rem; }
.admin .avatar { width:7rem; height:7rem; object-fit:cover; border:2px solid var(--k); }
.admin .role-line { display:flex; flex-wrap:wrap; align-items:center; gap:.3rem .75rem; padding:.15rem 0; }
.admin .or { text-align:center; color:var(--muted); margin:.6rem 0; }
.admin .spaced { margin-top:1.5rem; }
.admin .holder { padding:.9rem 0; border-bottom:1px solid var(--line); display:grid; gap:.6rem; justify-items:start; }
.admin .holder .grid { width:100%; }
.admin a.sub-line { display:flex; align-items:center; min-height:44px; color:var(--link); }
.admin .facts { display:grid; grid-template-columns:minmax(0,14rem) minmax(0,1fr); gap:.45rem 1.25rem; margin:0 0 1.5rem; padding:.6rem 0 .9rem; border-top:6px solid var(--k); border-bottom:2px solid var(--k); }
.admin .facts dt { font:700 1rem var(--cond); text-transform:uppercase; letter-spacing:.04em; color:var(--muted); }
.admin .facts dd { margin:0; overflow-wrap:anywhere; }
.admin .mono { font-family:ui-monospace,Menlo,Consolas,monospace; font-size:.92rem; }
.admin .drawn { width:100%; max-width:28rem; height:auto; background:var(--white); border:2px solid var(--k); }
.admin .shown { margin:0 0 1.5rem; }
.admin .shown summary { display:flex; align-items:center; min-height:44px; font:700 1.05rem var(--cond); text-transform:uppercase; letter-spacing:.04em; cursor:pointer; }
.admin .shown pre { margin:0; padding:1rem; overflow-x:auto; background:var(--white); border:2px solid var(--k); font:400 .9rem/1.45 ui-monospace,Menlo,Consolas,monospace; white-space:pre-wrap; overflow-wrap:anywhere; }
.admin .waiver-editor { min-height:18rem; font:400 17px/1.5 ui-monospace,Menlo,Consolas,monospace; }
.admin .preview-h { margin:2rem 0 .2rem; font:700 1.25rem var(--cond); text-transform:uppercase; letter-spacing:.04em; }
.admin .waiver-text { max-width:46rem; }
.admin .release-event { padding:.9rem 0 1rem; border-bottom:2px solid var(--line); }
.admin .release-event h3 { margin:0 0 .5rem; font:700 1.25rem/1.25 var(--cond); text-transform:uppercase; letter-spacing:.04em; }
.admin .release-event h3 .sub-line { font:400 1rem var(--serif); text-transform:none; letter-spacing:0; }
.admin .release-row { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:.75rem 1.5rem; margin:0 0 .5rem; }
.admin .release-others { list-style:none; margin:.25rem 0 0; padding:0; }
.admin .release-others li { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:.25rem 1rem; padding:.4rem 0; border-top:1px solid var(--line); overflow-wrap:anywhere; }
.admin .release-copies-h { margin:1.25rem 0 .25rem; font:700 1.15rem var(--cond); text-transform:uppercase; letter-spacing:.04em; }
.admin .log li .btn { margin-top:.35rem; }
.admin.narrow .crumbs, .admin.narrow .admin-head, .admin.narrow .sheet { padding-left:max(var(--pad), calc((100% - 34rem) / 2)); padding-right:max(var(--pad), calc((100% - 34rem) / 2)); }
.admin.narrow .sheet::before, .admin.narrow .sheet::after { margin-left:calc(max(var(--pad), calc((100cqw - 34rem) / 2)) * -1); margin-right:calc(max(var(--pad), calc((100cqw - 34rem) / 2)) * -1); }

/* Sheet-width layouts */
@container broad (max-width:1000px) {
  .buy, .admin .split { grid-template-columns:minmax(0,1fr) 18.5rem; gap:1.75rem; }
}
@container broad (max-width:900px) {
  .news, .door, .mast-lead { grid-template-columns:minmax(0,1fr); }
  .mast-top { grid-template-columns:minmax(0,1fr) minmax(0,15rem); }
  .mast .cutout { justify-self:start; width:min(100%,36rem); }
  .admin .split { grid-template-columns:minmax(0,1fr); }
  .admin .receipt { order:-1; margin-top:.75rem; }
  .admin .tally { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem 0; }
  .admin .tally div:nth-child(odd) { padding-left:0; border-left:0; }
}
@container broad (max-width:760px) {
  .buy { grid-template-columns:minmax(0,1fr); gap:1.5rem; }
  .t { grid-template-columns:minmax(0,1fr) auto; }
  .t > div:first-child { grid-column:1/-1; }
  .price { text-align:left; align-self:center; }
  .stamp { top:auto; bottom:1rem; transform:rotate(-7deg); }
  .sum { position:sticky; top:auto; bottom:0; z-index:5; margin:0 calc(var(--pad) * -1); padding:.6rem var(--pad); display:grid; grid-template-columns:auto minmax(0,1fr); gap:1rem; align-items:center; box-shadow:0 -3px 0 rgb(0 0 0 / .35); }
  .sum::before, .sum h2, .sum dl, .sum .fine { display:none; }
  .sum .tot { display:block; margin:0; padding:0; border:0; }
  .sum .tot span { display:block; font-size:1rem; }
  .sum .cf-turnstile { grid-column:1/-1; margin:0; }
}
@container broad (max-width:640px) {
  .cut, .admin .sheet::before, .admin .sheet::after { height:52px; background-size:800px 52px; }
  .mast h1 { margin:0 -.4rem; }
  .home-mast h1 { --mast-size:26.4cqw; white-space:normal; }
  .home-mast h1 span { display:block; }
  .dateline { flex-direction:column; }
  .mast-top { grid-template-columns:minmax(0,1fr); }
  .mast-top .cutout { width:min(100%,22rem); }
  .bricks { --row:30cqw; gap:4px; }
  .bricks.grid-wall { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .door { padding-top:1.5rem; padding-bottom:1.75rem; }
  .door p { font-size:1.1rem; }
  .admin .grid { grid-template-columns:minmax(0,1fr); }
  .admin .facts { grid-template-columns:minmax(0,1fr); gap:.1rem; }
  .admin .facts dd { margin-bottom:.55rem; }
  .admin .opt { display:none; }
  .admin .sheet td a { overflow-wrap:anywhere; }
  .admin .tag { white-space:normal; }
  .admin .head-acts { width:100%; }
  .admin .head-acts .btn { flex:1 1 auto; }
  .admin .release-row .btn { width:100%; }
}

/* Phones */
@media (max-width:640px) {
  body { font-size:18px; background-size:900px auto; }
  .links { gap:0 1rem; }
  .mast::before, .mast::after, .page-head::before, .page-head::after { width:22px; height:22px; }
  .admin { font-size:17px; }
}

@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { transition:none !important; animation:none !important; scroll-behavior:auto !important; }
}
