@font-face{font-family:'Google Sans Code';font-style:normal;font-weight:300;font-display:swap;src:url('./assets/fonts/google-sans-code-300.ttf') format('truetype')}
@font-face{font-family:'Google Sans Code';font-style:normal;font-weight:400;font-display:swap;src:url('./assets/fonts/google-sans-code-400.ttf') format('truetype')}
@font-face{font-family:'Google Sans Code';font-style:normal;font-weight:500;font-display:swap;src:url('./assets/fonts/google-sans-code-500.ttf') format('truetype')}
@font-face{font-family:'Host Grotesk';font-style:normal;font-weight:400;font-display:swap;src:url('./assets/fonts/host-grotesk-400.ttf') format('truetype')}
@font-face{font-family:'Host Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url('./assets/fonts/host-grotesk-500.ttf') format('truetype')}
@font-face{font-family:'Host Grotesk';font-style:normal;font-weight:600;font-display:swap;src:url('./assets/fonts/host-grotesk-600.ttf') format('truetype')}
@font-face{font-family:'Old Standard TT';font-style:italic;font-weight:400;font-display:swap;src:url('./assets/fonts/old-standard-tt-400-italic.ttf') format('truetype')}
@font-face{font-family:'Old Standard TT';font-style:normal;font-weight:400;font-display:swap;src:url('./assets/fonts/old-standard-tt-400.ttf') format('truetype')}
@font-face{font-family:'Old Standard TT';font-style:normal;font-weight:700;font-display:swap;src:url('./assets/fonts/old-standard-tt-700.ttf') format('truetype')}

/* FIXING shell — tokens, page frame, rules, chrome, motion. Build width 1920; --u = one mockup CSS px at 1920. */
:root{
  --paper:#ECE5D8;--ink:#1C1714;--muted:#6B6157;--sheet:#FBF7EF;--sheet-pink:#F6F0E4;--panel:#F3ECDF;
  --board:#1F3027;--chalk:#F2EEDC;--burgundy:#7A1B2A;--acid:#AECF32;--acid-rule:#7E9A1C;--fix-red:#D23F2E;
  --rule:#8C7F70;--rule-soft:#C4B6A2;--rule-sheet:#D3C6B2;--rule-dark:#2B2420;--rule-onboard:#3F5A4B;
  --font-display:'Old Standard TT',Georgia,serif;--font-body:'Host Grotesk',system-ui,sans-serif;--font-mono:'Google Sans Code',ui-monospace,monospace;
  --u:calc(100vw / 1920);
  /* page frame: one container for every route */
  --gutter:calc(42 * var(--u));
  /* border tokens: hairlines never below 1px */
  --w-frame:max(1px, calc(2.3 * var(--u)));--w-row:max(1px, calc(1.1 * var(--u)));--w-head:max(1px, calc(3.4 * var(--u)));--w-select:max(1px, calc(2.3 * var(--u)));--w-sel-strong:max(1px, calc(3.2 * var(--u)));
  /* motion: one easing + duration family (fixing-room: strike, lay, roll) */
  --ease:cubic-bezier(.2,.8,.2,1);--t-fast:220ms;--t-mid:400ms;--t-slow:700ms;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 calc(17 * var(--u))/1.4 var(--font-body);min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden}
img,svg,video,canvas{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--burgundy);outline-offset:2px}
.hs-date:focus-visible,.hs-select:focus-visible,.cal-day:focus-visible,.cal-month button:focus-visible{outline:2px solid var(--burgundy);outline-offset:2px}
td,th,.mono{font-variant-numeric:tabular-nums}
main{flex:1;width:100%;padding:0 var(--gutter)}
main.is-leaving{opacity:0;transition:opacity 200ms var(--ease)}
main:not(.is-leaving){transition:opacity 200ms var(--ease)}

/* ---- border classes (the only place borders are declared) ---- */
:where(button,input,select,textarea){border:0}
.rule-nav{border:var(--w-frame) solid var(--rule);border-radius:0}
.rule-panel{border:var(--w-frame) solid var(--rule);border-radius:0}
.rule-cap{border-top:calc(7 * var(--u)) solid var(--board)}
.rule-frame-tr{border-top:var(--w-frame) solid var(--rule);border-right:var(--w-frame) solid var(--rule)}
.rule-frame-lrb{border-left:var(--w-frame) solid var(--rule);border-right:var(--w-frame) solid var(--rule);border-bottom:var(--w-frame) solid var(--rule)}
.rule-paper-top:before{content:"";position:absolute;left:calc(14 * var(--u));right:0;top:0;border-top:var(--w-frame) solid var(--rule)}
.rule-bottom{border-bottom:var(--w-frame) solid var(--rule)}
.rule-ledger-row{box-shadow:inset 0 calc(-1 * var(--w-row)) var(--rule-soft)}
.rule-ledger-cols>span:not(:last-child){border-right:var(--w-row) solid var(--rule)}
.rule-row{border-bottom:var(--w-row) solid var(--rule-soft)}
.rule-row-sheet{border-bottom:var(--w-row) solid var(--rule-sheet)}
.rule-row:last-child,.rule-row-sheet:last-child{border-bottom:0}
.rule-section{border-top:var(--w-row) solid var(--rule)}
.book-page .market.rule-section,.book-page .bottom.rule-section{border-top:0}
.cal-record{box-shadow:none!important}
.book-page .notes{border-bottom:var(--w-row) solid var(--rule)}
.book-page .sorts button{border:0}
.rule-paper-top{background-image:linear-gradient(var(--rule),var(--rule));background-size:100% var(--w-frame);background-position:top left;background-repeat:no-repeat}
.fx-register{background-image:radial-gradient(rgba(122,27,42,.14) .6px,transparent .6px);background-size:calc(10 * var(--u)) calc(10 * var(--u))}
.rule-col{border-right:var(--w-row) solid var(--rule)}
.rule-col-soft{border-right:var(--w-row) solid var(--rule-soft)}
.rule-head{border-top:var(--w-head) solid var(--rule-dark)}
.rule-board{border-bottom:var(--w-row) solid var(--rule-onboard)}
.rule-select{border:var(--w-select) solid var(--acid-rule);border-radius:0}
.rule-select-strong{border:var(--w-sel-strong) solid var(--acid-rule);border-radius:0}
.rule-underline{border-bottom:var(--w-select) solid var(--acid-rule)}
.rule-btn{border:var(--w-frame) solid var(--ink);border-radius:calc(4 * var(--u))}
.rule-btn-acid{border:var(--w-frame) solid var(--acid-rule);border-radius:calc(4 * var(--u))}
.rule-btn-red{border:var(--w-frame) solid var(--fix-red);border-radius:calc(4 * var(--u))}
.rule-input{border:var(--w-frame) solid var(--rule);border-radius:calc(4 * var(--u));padding:0 calc(14 * var(--u))}

/* ---- nav (chrome/nav.html, no CA, no BUY) ---- */
.site-nav{width:100%;padding:calc(18 * var(--u)) var(--gutter) 0;background:var(--paper);font:400 calc(15 * var(--u)) var(--font-body);position:relative;z-index:5}
.site-nav .bar{height:calc(76 * var(--u));display:grid;grid-template-columns:calc(430 * var(--u)) 1fr auto;align-items:center;padding:0 calc(24 * var(--u));gap:calc(24 * var(--u))}
.site-nav .brand{display:flex;align-items:center;gap:calc(14 * var(--u));color:#1C1714;text-decoration:none;height:calc(50 * var(--u))}
.site-nav .brand img{width:calc(176 * var(--u));height:calc(56 * var(--u));object-fit:contain}
.site-nav .brand span{font-size:calc(34 * var(--u));font-weight:500;letter-spacing:.12em}
.site-nav .routes{display:flex;align-items:center;justify-content:flex-start;gap:calc(34 * var(--u));white-space:nowrap}
.site-nav .routes a,.site-nav .actions a{color:#1C1714;text-decoration:none}
.site-nav .routes a{padding:calc(27 * var(--u)) 0 calc(24 * var(--u));border-bottom:calc(3 * var(--u)) solid transparent;transition:color var(--t-fast) var(--ease)}
.site-nav .routes a:hover{color:var(--burgundy)}
.site-nav .routes a.is-active{border-bottom-color:var(--acid);color:var(--burgundy)}
.site-nav .actions{display:flex;align-items:center;gap:calc(18 * var(--u));height:calc(50 * var(--u));white-space:nowrap}
.site-nav .bell{padding:0 calc(18 * var(--u));border-left:var(--w-row) solid var(--rule);font:400 calc(13 * var(--u))/1.25 var(--font-mono);height:100%;display:flex;flex-direction:column;justify-content:center}
.site-nav .bell b{display:block;font-size:calc(17 * var(--u));font-weight:500;color:var(--fix-red);white-space:nowrap}
.site-nav .bell.is-closed b{color:var(--muted);font-size:calc(13 * var(--u))}
.site-nav .social{font-size:calc(14 * var(--u))}
.site-nav .social[aria-disabled="true"]{opacity:.55;pointer-events:none}
.menu-btn,.drawer{display:none}
.site-nav .bell.rule-col{border-right:var(--w-row) solid var(--rule)}

/* ---- footer (chrome/footer.html) ---- */
.site-foot{width:100%;min-height:calc(84 * var(--u));padding:calc(8 * var(--u)) calc(48 * var(--u));background:var(--paper);display:grid;grid-template-columns:calc(320 * var(--u)) 1fr calc(520 * var(--u));align-items:center;gap:calc(24 * var(--u));font:400 calc(13 * var(--u)) var(--font-body);margin-top:calc(64 * var(--u))}
.site-foot .brand{display:flex;align-items:center;gap:calc(12 * var(--u));height:calc(58 * var(--u))}
.site-foot .brand img{width:calc(152 * var(--u));height:calc(52 * var(--u));object-fit:contain}
.site-foot .brand b{font-size:calc(25 * var(--u));letter-spacing:.12em;font-weight:500}
.site-foot .copy{display:grid;gap:calc(7 * var(--u))}
.site-foot .boundary{font-weight:500;font-size:calc(14 * var(--u))}
.site-foot .sources{font:400 calc(11 * var(--u)) var(--font-mono);color:#5F564C}
.site-foot .actions{text-align:right;font:400 calc(12 * var(--u)) var(--font-mono)}
.site-foot .actions a{text-decoration:none}
.site-foot .actions a[aria-disabled="true"]{opacity:.55;pointer-events:none}
.site-foot .actions b{display:block;margin-top:calc(7 * var(--u));color:var(--burgundy);font-size:calc(13 * var(--u))}

/* ---- MOTION: the fixing room. strike (red 4PM line), lay (paper sheets settle), roll (ledger digits) ---- */
[data-lay]{opacity:0;transform:translateY(calc(18 * var(--u))) rotate(-.4deg);transform-origin:0 100%;transition:opacity var(--t-mid) var(--ease),transform var(--t-mid) var(--ease)}
[data-lay].is-in{opacity:1;transform:none}
[data-strike]{transform:scaleX(0);transform-origin:0 50%;transition:transform var(--t-slow) var(--ease)}
[data-strike].is-in{transform:scaleX(1)}
[data-roll]{display:inline-block;transition:transform var(--t-mid) var(--ease),opacity var(--t-fast) var(--ease)}
[data-roll].is-rolling{transform:translateY(-35%);opacity:0}
.bell-ring{animation:ring 300ms var(--ease) 1}
@keyframes ring{30%{transform:rotate(-4deg)}60%{transform:rotate(3deg)}100%{transform:none}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important}
  [data-lay],[data-strike],[data-roll]{transition:opacity var(--t-fast) linear!important;transform:none!important}
  main.is-leaving{transition:none}
}

/* ---- below 1024: mobile (px units, one column) ---- */
@media (max-width:1023px){
  :root{--u:1px;--gutter:16px}
  body{font-size:16px}
  .site-nav{padding:12px var(--gutter) 0}
  .site-nav .bar{height:auto;min-height:60px;grid-template-columns:1fr auto;padding:8px 12px;gap:12px}
  .site-nav .brand{height:44px;border-right:0}
  .site-nav .brand img{width:120px;height:40px}
  .site-nav .brand span{font-size:22px}
  .site-nav .routes,.site-nav .social{display:none}
  .site-nav .actions{height:auto;gap:10px}
  .site-nav .bell{font-size:11px;padding:0 10px}
  .site-nav .bell b{font-size:14px}
  .menu-btn{display:inline-flex;align-items:center;min-height:44px;min-width:44px;padding:0 14px;font:500 15px var(--font-body);background:transparent;color:var(--ink);cursor:pointer;border:var(--w-frame) solid var(--ink);border-radius:4px}
  .drawer{display:none;flex-direction:column;background:var(--paper);padding:8px 12px 12px}
  .drawer.is-open{display:flex}
  .drawer a{padding:13px 4px;font-size:17px;text-decoration:none;min-height:44px}
  .drawer a.is-active{color:var(--burgundy);font-weight:600}
  .site-foot{grid-template-columns:1fr;padding:16px;gap:12px;margin-top:40px}
  .site-foot .actions{text-align:left}
  .site-foot .brand img{width:120px;height:42px}
  .site-foot .sources{font-size:11px}
}
@media (max-width:480px){
  .site-nav .brand span,.site-nav .bell{display:none}
}