/* Written by scripts/board.sh from templates/_day.html.j2. Do not edit. */
:root {
  --bg:#F0EDE6; --ink:#1A1A1A; --orange:#D4622B; --blue:#1B2D4F; --red:#C4391D;
  --cream:#F5F0E1; --grey:#8A8578;
}
* { box-sizing:border-box; }
html,body { margin:0; background:var(--bg); color:var(--ink);
  font-family: Inter, -apple-system, "Helvetica Neue", Helvetica, Arial, sans-serif; }
body { overflow-x:hidden; }
/* paper grain: a 6% noise pass over everything, dropped in print */
body::after { content:""; position:fixed; inset:0; pointer-events:none; opacity:.06; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); }
.mono { font-family:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace; text-transform:uppercase; letter-spacing:.14em; font-size:11px; }
.sheet { max-width:1240px; margin:0 auto; padding:40px 32px 64px; position:relative; page:pinup; }
/* colour washes: flat fields that do not respect the margin */
.wash { position:absolute; width:46%; height:180px; top:-30px; right:-9%; background:var(--orange); opacity:.045; mix-blend-mode:multiply; transform:rotate(-2.2deg); pointer-events:none; }
.wash.blue { width:34%; height:240px; top:auto; bottom:-60px; right:auto; left:-11%; background:var(--blue); opacity:.04; transform:rotate(1.6deg); }
header { display:grid; grid-template-columns:1.15fr .85fr; gap:24px; align-items:end; margin-bottom:28px; }
h1 { font-family:"Space Grotesk", "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight:700; font-size:56px; line-height:.92; letter-spacing:-.03em; margin:0; position:relative; }
/* the misregistered pass: one plate did not align */
.ghost { position:absolute; left:4px; top:3px; color:var(--orange); opacity:.09; pointer-events:none; }
/* rubber stamps: not pressed level, with the pad's offset shadow behind */
.stamp { display:inline-block; position:relative; border:1px solid var(--ink); padding:4px 8px; transform:rotate(-.8deg); margin-bottom:12px; background:var(--bg); }
.stamp::after { content:""; position:absolute; left:3px; top:3px; right:-3px; bottom:-3px; border:1px solid var(--blue); opacity:.18; z-index:-1; pointer-events:none; }
.meta { text-align:right; color:var(--grey); line-height:1.7; transform:rotate(.4deg); transform-origin:100% 100%; }
.meta b { color:var(--ink); font-weight:500; }
/* the broken divider: a stroke that ran out of ink twice */
.divider { height:1px; margin:22px 0; background:linear-gradient(90deg, var(--ink) 0 38%, transparent 38% 41%, var(--ink) 41% 77%, transparent 77% 80%, var(--ink) 80%); opacity:.55; }
.grid { position:relative; }
.ruler { position:relative; height:26px; margin-left:170px; border-bottom:1px solid var(--ink); }
.ruler .h { position:absolute; bottom:4px; transform:translateX(-50%); color:var(--grey); }
.ruler .h::after { content:""; position:absolute; left:50%; bottom:-5px; width:1px; height:4px; background:var(--ink); }
.lane { background:linear-gradient(90deg, transparent var(--pl), rgba(27,45,79,.06) var(--pl), rgba(27,45,79,.06) var(--pr), transparent var(--pr)); }
.ruler .prime-label { position:absolute; top:-2px; color:var(--blue); opacity:.75; transform:none; }
.row { display:grid; grid-template-columns:170px 1fr; min-height:74px; border-bottom:1px dashed rgba(26,26,26,.25); }
.row .name { padding:14px 12px 10px 0; }
.row .name .n { font-family:"Space Grotesk", Helvetica, Arial, sans-serif; font-weight:700; font-size:18px; letter-spacing:-.02em; line-height:1; }
.row .name .cap { color:var(--grey); margin-top:6px; }
.lane { position:relative; }
.block { position:absolute; top:12px; height:50px; display:flex; }
.block > div { flex:none; }
.block .clean.over { border-left:1px dashed var(--ink); }
.block .pre { background:repeating-linear-gradient(135deg, transparent 0 3px, rgba(26,26,26,.28) 3px 4px); border:1px solid var(--ink); border-right:0; }
/* the feature is a print; its second, orange pass is off by 5px */
.block .feat { position:relative; z-index:0; background:var(--cream); border:1px solid var(--ink); padding:5px 7px; white-space:nowrap; }
.block .feat > div { overflow:hidden; }
.block.prime .feat { background:#fff; }
.block .feat::after { content:""; position:absolute; left:5px; top:4px; right:-5px; bottom:-4px; border:1px solid var(--orange); opacity:.35; z-index:-1; pointer-events:none; }
.block .feat .t { font-family:"Space Grotesk", Helvetica, Arial, sans-serif; font-weight:700; font-size:13px; letter-spacing:-.02em; line-height:1.05; }
.block .feat .tm { color:var(--grey); margin-top:5px; }
.block .clean { background:repeating-linear-gradient(45deg, transparent 0 2px, rgba(212,98,43,.55) 2px 3px); border:1px solid var(--ink); border-left:0; }
.block:hover { transform:translateY(-1px); }
.legend { display:flex; flex-wrap:wrap; gap:14px 22px; margin-top:16px; color:var(--grey); align-items:center; transform:rotate(-.3deg); transform-origin:0 50%; }
.legend i { display:inline-block; width:22px; height:12px; border:1px solid var(--ink); vertical-align:middle; margin-right:6px; }
.legend i.pre { background:repeating-linear-gradient(135deg, transparent 0 3px, rgba(26,26,26,.28) 3px 4px); }
.legend i.feat { background:var(--cream); }
.legend i.forced-i { position:relative; } .legend i.forced-i::after, .legend i.wanted-i::after { content:""; position:absolute; right:0; bottom:0; border-style:solid; border-width:0 0 7px 7px; border-color:transparent transparent var(--blue) transparent; }
.legend i.wanted-i { position:relative; } .legend i.wanted-i::after { border-color:transparent transparent rgba(26,26,26,.45) transparent; }
.legend i.clean { background:repeating-linear-gradient(45deg, transparent 0 2px, rgba(212,98,43,.55) 2px 3px); }
/* below the fold: two panels, pinned a little off true; hover straightens one */
.cols { display:grid; grid-template-columns:1.15fr .85fr; gap:40px; margin-top:44px; position:relative; }
.cols > .panel { position:relative; min-width:0; }
.cols > .panel:first-of-type { transform:rotate(-.3deg); transform-origin:0 0; }
.cols > .panel:last-of-type { transform:rotate(.35deg); transform-origin:100% 0; }
.cols > .panel:hover { transform:none; }
.scroll { overflow-x:auto; }
table { border-collapse:collapse; width:100%; font-size:13px; }
th { text-align:left; font-weight:400; color:var(--grey); border-bottom:1px solid var(--ink); padding:6px 6px 8px; }
td { padding:8px 6px; border-bottom:1px dashed rgba(26,26,26,.2); vertical-align:top; }
td.starts { font-family:"JetBrains Mono", ui-monospace, Menlo, monospace; font-size:12px; letter-spacing:.02em; line-height:1.7; }
td.num { font-family:"JetBrains Mono", ui-monospace, Menlo, monospace; font-size:12px; text-align:right; white-space:nowrap; }
th.num { text-align:right; }
td.away { color:var(--red); }
tfoot td { border-bottom:0; border-top:1px solid var(--ink); font-weight:500; }
.ok { color:var(--blue); } .fail { color:var(--red); font-weight:600; }
.relaxed { display:inline-block; color:var(--red); border:1px solid var(--red); padding:1px 5px; margin-right:4px; transform:rotate(-1.2deg); font-size:10px; }
.given-up { color:var(--red); }
.proof td:first-child { white-space:nowrap; }
.proof td.forced-col { font-family:"JetBrains Mono", ui-monospace, Menlo, monospace; font-size:11px; color:var(--blue); line-height:1.6; }
.proof td.forced-col span { display:block; white-space:nowrap; }
td.title b { white-space:nowrap; }
.probed { color:var(--grey); margin:10px 0 0; }
td.starts .st { display:inline-block; margin-right:10px; white-space:nowrap; }
td.starts .st i { font-style:normal; color:var(--grey); }
td.starts .st i.short { color:var(--red); }
td.starts .st b.fx { font-weight:500; color:var(--blue); border:1px solid var(--blue); padding:0 4px; font-size:10px; letter-spacing:.1em; text-transform:uppercase; }
td.starts .st b.fo { font-weight:500; color:var(--blue); font-size:11px; }
/* a session the terms force gets a navy corner; one the objective forces, an ink one. The orange
   stays on the turnaround (DESIGN.md), so the objective's mark is the ink at less than half strength */
.block .feat.forced::before, .block .feat.wanted::before { content:""; position:absolute; right:0; bottom:0; width:0; height:0; border-style:solid; border-width:0 0 9px 9px; border-color:transparent transparent var(--blue) transparent; }
.block .feat.wanted::before { border-color:transparent transparent rgba(26,26,26,.45) transparent; }
/* the re-plan (Day 11): a moved session leaves a ghost where it was — an outline on the ink
   hatch, nothing filled — an added one carries a stamp, a removed one is struck through in the
   by-title table. The stamp is orange: the one orange on the grid besides the turnaround, and
   only on a re-plan sheet (DESIGN.md) */
.block.was-here { display:block; border:1px dashed var(--ink); background:repeating-linear-gradient(135deg, transparent 0 3px, rgba(26,26,26,.16) 3px 4px); color:var(--grey); padding:5px 6px; overflow:hidden; white-space:nowrap; letter-spacing:.08em; z-index:0; }
.block.was-here:hover { transform:none; }
.block .feat { z-index:1; }
.new { display:inline-block; font-family:"JetBrains Mono", ui-monospace, Menlo, monospace; text-transform:uppercase; letter-spacing:.12em; font-size:9px; font-weight:400; color:var(--orange); border:1px solid var(--orange); padding:0 4px; line-height:1.5; background:var(--bg); white-space:nowrap; }
.block .feat .new { position:absolute; right:-7px; top:-9px; transform:rotate(-4deg); z-index:2; }
.vblock .vfeat .new { position:absolute; right:-6px; top:-8px; transform:rotate(-4deg); z-index:2; }
td.starts .st s.was, td.starts .st.gone { text-decoration:line-through; }
td.starts .st s.was { color:var(--grey); margin-right:2px; }
td.starts .st.gone { color:var(--red); }
td .count-was { color:var(--grey); }
.legend i.ghost-i { border:1px dashed var(--ink); background:repeating-linear-gradient(135deg, transparent 0 3px, rgba(26,26,26,.16) 3px 4px); }
.legend s { color:var(--red); }
.replan { margin-top:36px; }
.replan .cols { margin-top:0; }
.replan td.what { font-family:"JetBrains Mono", ui-monospace, Menlo, monospace; text-transform:uppercase; letter-spacing:.1em; font-size:10px; white-space:nowrap; }
.replan td.what.added { color:var(--orange); } .replan td.what.removed { color:var(--red); }
.replan td.starts s { color:var(--red); }
.replan .claims { color:var(--grey); line-height:1.9; }
.replan .claims b { color:var(--ink); font-weight:500; }
footer { margin-top:56px; color:var(--grey); display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.week-table th.day { font-family:"JetBrains Mono", ui-monospace, Menlo, monospace; text-transform:uppercase; letter-spacing:.14em; font-size:11px; }
.week-table td.day { font-family:"JetBrains Mono", ui-monospace, Menlo, monospace; font-size:11px; letter-spacing:.02em; line-height:1.6; white-space:nowrap; }
.week-table td.day.dark { color:var(--grey); }
.week-table td.day.hold { background:rgba(27,45,79,.05); }
.held { display:inline-block; border:1px solid var(--blue); color:var(--blue); padding:1px 5px; transform:rotate(-1.2deg); font-size:10px; }
.status-inf { color:var(--red); font-weight:600; }
/* a strand is a mono tag, never a colour (DESIGN.md): the sheet is read by position and type */
.tag { display:inline-block; font-family:"JetBrains Mono", ui-monospace, Menlo, monospace; text-transform:uppercase; letter-spacing:.12em; font-size:9px; border:1px solid var(--ink); padding:0 4px; line-height:1.5; vertical-align:middle; white-space:nowrap; }
.day-page { margin-top:64px; padding-top:28px; border-top:1px solid var(--ink); position:relative; }
.day-page h2 { font-family:"Space Grotesk", "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight:700; font-size:34px; line-height:.95; letter-spacing:-.03em; margin:0 0 6px; position:relative; }
.day-page .stamp { margin-bottom:8px; }
.day-head { display:grid; grid-template-columns:1.15fr .85fr; gap:24px; align-items:end; margin-bottom:18px; }
/* the booth strips: one screen, its sessions in mono, the three-strip block turned vertical.
   Hidden on a desk; the phone shows them instead of the grid; print puts each on its own A4 */
.strips { display:none; }
.strip-page { page:strip; position:relative; margin-top:40px; padding-top:22px; border-top:1px solid var(--ink); }
.strip-head { display:grid; grid-template-columns:1fr auto; gap:16px; align-items:end; margin-bottom:16px; }
.strip-head .n { font-family:"Space Grotesk", "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight:700; font-size:34px; line-height:.92; letter-spacing:-.03em; position:relative; }
.strip-head .cap { color:var(--grey); margin-top:8px; }
.strip-head .meta { transform:rotate(.6deg); }
.vblock { position:relative; margin:0 0 4px; max-width:420px; }
.vblock > div { border:1px solid var(--ink); }
.vblock .vpre, .vblock .vclean { flex-wrap:wrap; letter-spacing:.1em; }
.vblock .vpre { background:repeating-linear-gradient(135deg, transparent 0 3px, rgba(26,26,26,.28) 3px 4px); border-bottom:0; padding:5px 9px; color:var(--ink); display:flex; justify-content:space-between; gap:12px; }
.vblock .vfeat { position:relative; z-index:0; background:var(--cream); padding:9px 10px 8px; }
.vblock.prime .vfeat { background:#fff; }
.vblock .vfeat::after { content:""; position:absolute; left:5px; top:4px; right:-5px; bottom:-4px; border:1px solid var(--orange); opacity:.35; z-index:-1; pointer-events:none; }
.vblock .vfeat .t { font-family:"Space Grotesk", Helvetica, Arial, sans-serif; font-weight:700; font-size:17px; letter-spacing:-.02em; line-height:1; }
.vblock .vfeat .tm { color:var(--grey); margin-top:6px; }
.vblock .vclean { background:repeating-linear-gradient(45deg, transparent 0 2px, rgba(212,98,43,.55) 2px 3px); border-top:0; padding:5px 9px; color:var(--ink); display:flex; justify-content:space-between; gap:12px; }
.vblock .vclean.over { border-top:1px dashed var(--ink); margin-top:-1px; }
.vblock .vclean b, .vblock .vpre b { font-weight:500; background:var(--bg); padding:0 3px; }
.vgap { color:var(--grey); padding:6px 0 10px 10px; max-width:420px; }
.vgap i { display:inline-block; width:1px; height:14px; background:var(--grey); vertical-align:middle; margin-right:10px; }
@page pinup { size:A3 landscape; margin:10mm 12mm; }
@page strip { size:A4 portrait; margin:14mm 16mm; }
@media print {
  * { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
  body::after { display:none; } .wash { display:none; }
  /* 3px of air at every page top: a stamp rotated -.8° otherwise pokes above the page and
     Chrome paints that sliver at the foot of the page before */
  .sheet { max-width:none; padding:3px 0 0; }
  h1 { font-size:44px; } .mono { font-size:10px; }
  .cols { margin-top:28px; gap:32px; }
  .cols > .panel, .legend, .meta { transform:none; }
  .grid, .strip-page, tr { break-inside:avoid; }
  table { break-inside:auto; }
  .cols table { font-size:11.5px; } .cols td { padding:5px 6px; } .cols th { padding:4px 6px 6px; }
  .day-page { break-before:page; page-break-before:always; border-top:0; margin-top:0; padding-top:3px; }
  .strips { display:block; }
  .strip-page { break-before:page; page-break-before:always; margin-top:0; padding-top:3px; border-top:0; }
  .vblock { max-width:none; }
  .vgap { max-width:none; }
  .block:hover { transform:none; }
  footer { page:strip; margin-top:32px; }
}
@media screen and (max-width:800px) {
  .sheet { padding:24px 16px 48px; }
  .sheet, .day-page { display:flex; flex-direction:column; }
  header, .divider, .day-head { order:-2; }
  .strips { display:block; order:-1; }
  .grid { display:none; }
  header, .cols, .day-head { grid-template-columns:1fr; display:grid; }
  .meta { text-align:left; transform:none; }
  .cols > .panel { transform:none; }
  h1 { font-size:38px; }
  .strip-page { margin-top:28px; padding-top:18px; }
  .strip-head .n { font-size:26px; }
  .vblock, .vgap { max-width:none; }
  footer { flex-direction:column; }
}