/* GENERATED by scripts/build-games-assets.mjs from the The Crossing prototype.
   Edit the prototype (or the hand-written *-schedule.js) and re-run; do not
   hand-edit this file — the next port would silently drop the edit.

   EXCEPTION, 2026-09-20 Times sweep: the three custom-property blocks below
   were hand-edited (the prototype directory is gone). See the note in the
   first block; re-apply the white/black/Times values after any re-port. */
.rt-crossing{
  /* 2026-09-20 Times sweep. The board was blue-grey newsprint in a system
     sans: --paper #D4D7DC / #C2C6CD / #E2E4E8, --blue #1B3C7D, --red #9E2318,
     --slug #565D6B, --rule-soft #9AA0AA. Now white/black/Times, with --blue
     carrying the site's one link blue (#14387f, the `clay-dark` slug's value)
     because every use of it here is a link, an active state or a focus ring.
     --red had exactly one use (the error message, which says the error in
     words) so it is ink. --f-type stays monospace: it is the letter grid.
     NOTE: this file is generated from a prototype that is no longer on disk,
     so this block is the source of truth; re-apply it after any re-port. */
  --paper:#ffffff; --paper-2:#f4f4f4; --paper-3:#f4f4f4;
  --ink:#000000; --blue:#14387f; --red:#000000; --slug:#555555;
  --rule:#000000; --rule-soft:#bbbbbb;
  --f-ui:"Times New Roman",Times,"Nimbus Roman",serif;
  --f-type:ui-monospace,"SFMono-Regular","SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --f-read:"Times New Roman",Times,"Nimbus Roman",serif; /* 2026-09-20 Times sweep */
  /* 2026-09-21 owner "rethink": the whole scale stepped up a size — s2 (the
     descriptive blurb under the masthead) was the 13px the owner first
     flagged as too small; s7 (the masthead) now reaches the 40-48px bold
     title size used across every game page. Still a hand-edited exception
     to the GENERATED file, same as the palette block above. */
  --s0:13px; --s1:14px; --s2:17px; --s3:17px; --s4:19px; --s5:24px; --s6:30px;
  --s7:clamp(2rem, 1.5rem + 3vw, 2.75rem); /* masthead: 32px phone, 44px desktop */
  color-scheme:light;
}

.rt-crossing[data-theme="light"]{
  --paper:#ffffff; --paper-2:#f4f4f4; --paper-3:#f4f4f4;
  --ink:#000000; --blue:#14387f; --red:#000000; --slug:#555555;
  --rule:#000000; --rule-soft:#bbbbbb; color-scheme:light;
}
.rt-crossing[data-theme="dark"]{
  --paper:#111111; --paper-2:#1c1c1c; --paper-3:#1c1c1c;
  --ink:#ffffff; --blue:#9fb6e8; --red:#ffffff; --slug:#bbbbbb;
  --rule:#ffffff; --rule-soft:#555555; color-scheme:dark;
}
.rt-crossing, .rt-crossing *{box-sizing:border-box}
.rt-crossing{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--f-ui); font-size:var(--s3); line-height:1.5;
  -webkit-text-size-adjust:100%; overflow-x:hidden;
}
.rt-crossing .wrap{max-width:41rem; margin:0 auto; padding:1.25rem 1.15rem 4rem}
.rt-crossing /* ---- labels: letterspaced caps,.rt-crossing the paper's small type ---- */
.lab{
  font-size:var(--s0); font-weight:700; letter-spacing:.16em;
  text-transform:uppercase; color:var(--slug);
}
.rt-crossing /* ---- masthead ---- */
.head{border-bottom:3px solid var(--rule); padding-bottom:.55rem; margin-bottom:.5rem}
.rt-crossing .head .kicker{display:flex; justify-content:space-between; align-items:baseline; gap:1rem; flex-wrap:wrap}
.rt-crossing h1{
  font-family:var(--f-ui); font-size:var(--s7); line-height:.95; margin:.3rem 0 .35rem;
  font-weight:800; letter-spacing:-.02em; text-transform:uppercase;
}
.rt-crossing h1 .the{font-size:var(--s4); font-weight:700; letter-spacing:.22em; display:block; margin-bottom:.15rem}
.rt-crossing .head .sub{font-size:var(--s2); color:var(--slug); max-width:32rem}
.rt-crossing /* ---- the slug line under the masthead ---- */
.slugline{
  display:flex; gap:.9rem; align-items:baseline; flex-wrap:wrap;
  border-bottom:1px solid var(--rule); padding:.5rem 0 .55rem; margin-bottom:1.4rem;
}
.rt-crossing .slugline b{font-weight:700; color:var(--ink); letter-spacing:.04em}
.rt-crossing .slugline .dot{color:var(--rule-soft)}
.rt-crossing /* ---- the ladder: set type in a galley ---- */
.galley{margin:0 0 1.1rem}
.rt-crossing .rung{
  display:grid; grid-template-columns:2.6rem 1fr auto; align-items:center;
  gap:.6rem; padding:.34rem 0; position:relative;
}
.rt-crossing .rung + .rung{border-top:1px solid var(--rule-soft)}
.rt-crossing .rung .no{
  font-family:var(--f-type); font-size:var(--s0); color:var(--slug);
  text-align:right; letter-spacing:.02em; font-variant-numeric:tabular-nums;
}
.rt-crossing .word{
  font-family:var(--f-type); font-weight:700;
  font-size:clamp(1.5rem,8.5vw,2.05rem); line-height:1.05;
  letter-spacing:.24em; text-transform:uppercase; margin:0;
  white-space:nowrap;
}
.rt-crossing .word .ch{display:inline-block}
.rt-crossing .word .ch.moved{color:var(--blue)}
.rt-crossing .rung .tag{font-size:var(--s0); font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--slug); white-space:nowrap}
.rt-crossing .rung.bank{background:linear-gradient(to right,var(--paper-3),transparent 70%)}
.rt-crossing .rung.bank .word{color:var(--ink)}
.rt-crossing .rung.far .word{color:var(--slug)}
.rt-crossing .rung.far.done .word{color:var(--ink)}
.rt-crossing .rung.pending{opacity:.55}
.rt-crossing .rung.pending .word{color:var(--slug); letter-spacing:.24em}
.rt-crossing .rung.hinted .word{color:var(--blue)}
.rt-crossing /* ---- the input line ---- */
.entry{display:grid; grid-template-columns:2.6rem 1fr; gap:.6rem; align-items:center; margin:.15rem 0 .2rem}
.rt-crossing .entry .no{font-family:var(--f-type); font-size:var(--s0); color:var(--blue); text-align:right; font-weight:700}
.rt-crossing #rtx-guess{
  width:100%; background:transparent; color:var(--ink);
  font-family:var(--f-type); font-weight:700;
  font-size:clamp(1.5rem,8.5vw,2.05rem); letter-spacing:.24em; text-transform:uppercase;
  border:0; border-bottom:3px solid var(--blue); border-radius:0;
  padding:.15rem 0 .2rem; outline-offset:3px;
}
.rt-crossing #rtx-guess::placeholder{color:var(--rule-soft); letter-spacing:.24em}
.rt-crossing #rtx-guess:focus-visible{outline:2px solid var(--blue)}
.rt-crossing .msg{min-height:1.4rem; font-size:var(--s2); margin:.35rem 0 .75rem; padding-left:3.2rem}
.rt-crossing .msg.err{color:var(--red); font-weight:600}
.rt-crossing .msg.ok{color:var(--blue); font-weight:600}
.rt-crossing /* ---- controls ---- */
.controls{display:flex; gap:.5rem; flex-wrap:wrap; margin-bottom:1.5rem}
.rt-crossing button{
  font-family:var(--f-ui); font-size:var(--s1); font-weight:700;
  letter-spacing:.13em; text-transform:uppercase;
  background:transparent; color:var(--ink);
  border:1.5px solid var(--ink); border-radius:0;
  padding:.6rem .85rem; cursor:pointer; min-height:44px;
}
.rt-crossing button:hover{background:var(--ink); color:var(--paper)}
.rt-crossing button:focus-visible{outline:2px solid var(--blue); outline-offset:2px}
.rt-crossing button:disabled{opacity:.35; cursor:default}
.rt-crossing button:disabled:hover{background:transparent; color:var(--ink)}
.rt-crossing button.primary{background:var(--ink); color:var(--paper)}
.rt-crossing button.primary:hover{background:var(--blue); border-color:var(--blue); color:#fff}
.rt-crossing[data-theme="dark"] button.primary:hover,.rt-crossing button.primary:hover{color:var(--paper)}
.rt-crossing /* ---- the solved plate ---- */
.plate{border-top:3px solid var(--rule); padding-top:.9rem; margin-top:.4rem; display:none}
.rt-crossing .plate.on{display:block}
.rt-crossing .plate .score{font-family:var(--f-type); font-size:var(--s5); font-weight:700; letter-spacing:.02em; margin:.3rem 0 .1rem}
.rt-crossing .plate .score .par{color:var(--slug); font-size:var(--s3)}
.rt-crossing .note{
  font-family:var(--f-read); font-size:var(--s4); line-height:1.55;
  margin:.85rem 0 1rem; padding-left:.9rem; border-left:2px solid var(--blue);
}
.rt-crossing .bars{font-family:var(--f-type); letter-spacing:.1em; color:var(--blue); font-size:var(--s4)}
.rt-crossing /* ---- archive ---- */
details{border-top:1px solid var(--rule-soft); margin-top:2rem; padding-top:.75rem}
.rt-crossing summary{
  cursor:pointer; list-style:none; display:flex; justify-content:space-between;
  align-items:center; gap:1rem; flex-wrap:wrap;
  min-height:44px; padding:.55rem 0;      /* the row is a tap target, not a line of type */
}
.rt-crossing summary::-webkit-details-marker{display:none}
.rt-crossing summary:focus-visible{outline:2px solid var(--blue); outline-offset:2px}
.rt-crossing summary .lab{color:var(--ink)}
.rt-crossing .weeks{display:grid; grid-template-columns:repeat(auto-fill,minmax(3.1rem,1fr)); gap:.35rem; margin:.9rem 0 .4rem}
.rt-crossing .weeks button{
  padding:.45rem .2rem; font-family:var(--f-type); font-size:var(--s1);
  letter-spacing:0; border-color:var(--rule-soft); min-height:44px;
}
.rt-crossing .weeks button.done{border-color:var(--blue); color:var(--blue)}
.rt-crossing .weeks button.now{background:var(--ink); color:var(--paper); border-color:var(--ink)}
.rt-crossing footer{margin-top:2.5rem; border-top:1px solid var(--rule-soft); padding-top:.8rem;
  display:flex; justify-content:space-between; gap:1rem; align-items:baseline; flex-wrap:wrap}
.rt-crossing footer p{margin:0; font-size:var(--s1); color:var(--slug); max-width:28rem}
.rt-crossing .linkish{background:none; border:0; padding:.7rem 0; min-height:44px; color:var(--blue);
  text-decoration:underline; text-underline-offset:3px; letter-spacing:.08em; cursor:pointer}
.rt-crossing .linkish:hover{background:none; color:var(--blue)}
@media (prefers-reduced-motion:no-preference){.rt-crossing .rung.fresh .word{animation:rtx-set .28s ease-out}
@keyframes rtx-set{from{opacity:0; transform:translateY(-.25rem)}to{opacity:1; transform:none}}}
@media (max-width:26rem){.rt-crossing .word,.rt-crossing #rtx-guess{letter-spacing:.16em}
.rt-crossing .rung{grid-template-columns:2rem 1fr auto}
.rt-crossing .entry{grid-template-columns:2rem 1fr}
.rt-crossing .msg{padding-left:2.6rem}}
