/* skin.css for rulewell/tables-first: the itch pack (memory/projects/audiences/itch.md): one bold theme committed
   hard. Riso: hot orange ink on near-black, cream tables like printed zine pages, a display with character and mono
   for the numbers. The rolled row lights in orange; the die spins in its number. No remote fonts. */
.rw-tf{--t-ground:#121010;--t-ink:#f6efe4;--t-sub:#b7aa98;--t-hot:#ff5a1f;--t-paper:#f3ead9;--t-paper-ink:#1d1814;--t-rule:#d6c7ad;
  --t-display:"Rockwell Extra Bold","Rockwell","Cooper Black","Georgia",serif;--t-mono:ui-monospace,Consolas,monospace;
  color-scheme:dark;background:var(--t-ground);color:var(--t-ink);min-height:100svh;margin:0;padding-inline:16px}
.rw-tf.rw-body::before,.rw-tf.rw-body::after{display:none}
.rw-tf__bar,.rw-tf__main,.rw-tf__footer{max-width:1120px;margin:0 auto}
.rw-tf__bar{padding-block:18px 0}
.rw-tf__home{font:700 20px var(--f-display,serif);color:var(--t-ink);text-decoration:none}
.rw-tf__main{padding-block:32px 24px;display:grid;gap:24px}
.rw-tf__hero{display:grid;gap:12px;max-width:64ch}
.rw-tf__eye{margin:0;font:600 12px var(--t-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--t-hot)}
.rw-tf__title{margin:0;font:800 clamp(42px,8vw,84px)/.95 var(--t-display);color:var(--t-hot);text-wrap:balance}
.rw-tf__lede{margin:0;font-size:18px;line-height:1.5;color:var(--t-sub)}
.rw-tf__actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:6px}
.rw-tf__all{font:800 17px var(--t-display);padding:13px 22px;border-radius:12px;border:0;cursor:pointer;background:var(--t-hot);color:#140a04;box-shadow:4px 4px 0 var(--t-ink)}
.rw-tf__all:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--t-ink)}
.rw-tf__all:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--t-ink)}
#rw-tf-pwyw{--btn-ground-a:transparent;--btn-ground-b:transparent;--btn-edge:var(--t-ink);--btn-ink:var(--t-ink);--btn-hover-ink:#140a04;--btn-radius:12px}
#rw-tf-pwyw:hover{--btn-ground-a:var(--t-ink);--btn-ground-b:var(--t-ink)}

/* the prep strip: the session, rolled */
.rw-tf__strip{display:grid;gap:8px;padding:18px 20px;border:2px solid var(--t-hot);border-radius:14px}
.rw-tf__beat{margin:0;display:grid;grid-template-columns:minmax(120px,170px) 1fr;gap:12px;align-items:baseline;animation:rw-tf-in .4s ease-out both}
@keyframes rw-tf-in{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}
.rw-tf__beat-key{font:700 12px var(--t-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--t-hot)}
.rw-tf__beat-val{font-size:16px;line-height:1.45}
@media (max-width:520px){.rw-tf__beat{grid-template-columns:1fr;gap:2px}}

/* the tables: zine pages */
.rw-tf__tables{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr));gap:18px}
.rw-tf__table{min-width:0;background:var(--t-paper);color:var(--t-paper-ink);border-radius:10px;padding:16px 16px 12px;box-shadow:0 14px 30px -16px rgba(0,0,0,.7)}
.rw-tf__head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}
.rw-tf__name{margin:0;font:800 20px var(--t-display)}
.rw-tf__die{min-width:54px;height:40px;border-radius:10px;border:2px solid var(--t-paper-ink);background:transparent;color:var(--t-paper-ink);
  font:700 15px var(--t-mono);cursor:pointer;font-variant-numeric:tabular-nums}
.rw-tf__die:hover{background:var(--t-paper-ink);color:var(--t-paper)}
.rw-tf__die.is-rolled{background:var(--t-hot);border-color:var(--t-hot);color:#140a04;animation:rw-tf-spin .45s cubic-bezier(.2,.8,.3,1.3)}
@keyframes rw-tf-spin{from{transform:rotate(-200deg) scale(.6)}to{transform:none}}
.rw-tf__rows{list-style:none;margin:0;padding:0}
.rw-tf__row{display:grid;grid-template-columns:28px 1fr;gap:8px;padding:5px 4px;border-top:1px solid var(--t-rule);font-size:14px;line-height:1.4;border-radius:4px;transition:background-color .3s}
.rw-tf__n{font:700 12px var(--t-mono);color:#8a7a62;font-variant-numeric:tabular-nums;text-align:right}
.rw-tf__row.is-hit{background:var(--t-hot);color:#140a04}
.rw-tf__row.is-hit .rw-tf__n{color:#140a04}
.rw-tf__note{margin:0;font-size:14px;color:var(--t-sub)}
.rw-tf__footer{padding-block:24px 32px;font-size:13px;color:var(--t-sub)}
.rw-tf__footer a{color:var(--t-hot)}
@media (prefers-reduced-motion:reduce){.rw-tf__die.is-rolled,.rw-tf__beat{animation:none}}