/* The workshop is a small, physical place to rearrange. */
html,body,dialog,textarea { scrollbar-color:#9c241a #472619; }
.chess-drawer { --chess-scroll-thumb:#c19a60;--chess-scroll-track:#35180d;--chess-scroll-hover:#d8b477;--chess-scroll-active:#f0dfb8; }
.chess-history { --chess-scroll-thumb:#af8a58;--chess-scroll-track:transparent;--chess-scroll-hover:#967453;--chess-scroll-active:#8d1c17; }
@supports selector(::-webkit-scrollbar) {
  html,body,dialog,textarea,.chess-drawer,.chess-history { scrollbar-color:auto;scrollbar-width:auto; }
  ::-webkit-scrollbar { width:13px;height:13px; }
  ::-webkit-scrollbar-track { background:linear-gradient(90deg,#2d140d,#664028 46%,#3b1c12);border-left:1px solid #b78c4b; }
  ::-webkit-scrollbar-thumb { min-height:52px;border:3px solid transparent;border-radius:2px;background:linear-gradient(180deg,#c19a5d 0 8%,#f0dfb8 8% 19%,#a2221c 19% 47%,#d4b174 47% 53%,#823b24 53% 81%,#f0dfb8 81% 92%,#bd9258 92%) padding-box;box-shadow:inset 0 0 0 1px #e8c38b70; }
  ::-webkit-scrollbar-thumb:hover { background:linear-gradient(180deg,#d1ac6d 0 8%,#fff0cd 8% 19%,#c02c24 19% 47%,#e8ca8b 47% 53%,#a05431 53% 81%,#fff0cd 81% 92%,#d1ac6d 92%) padding-box; }
  ::-webkit-scrollbar-thumb:active { background:linear-gradient(180deg,#9e7441 0 8%,#dfc79b 8% 19%,#7b1713 19% 47%,#b8955b 47% 53%,#532510 53% 81%,#dfc79b 81% 92%,#9e7441 92%) padding-box;box-shadow:inset 0 0 0 1px #efc88790,inset 1px 2px 3px #240b0866; }
  ::-webkit-scrollbar-corner { background:#472619; }
  /* The drawer and its paper ledger keep their own quiet brass scrollbars. */
  .chess-drawer::-webkit-scrollbar,.chess-history::-webkit-scrollbar { width:8px;height:8px; }
  .chess-drawer::-webkit-scrollbar-track,.chess-drawer::-webkit-scrollbar-corner,
  .chess-history::-webkit-scrollbar-track,.chess-history::-webkit-scrollbar-corner { background:var(--chess-scroll-track);border:0; }
  .chess-drawer::-webkit-scrollbar-thumb,.chess-history::-webkit-scrollbar-thumb { min-height:32px;background:var(--chess-scroll-thumb);border:2px solid var(--chess-scroll-track);box-shadow:none; }
  .chess-drawer::-webkit-scrollbar-thumb:hover,.chess-history::-webkit-scrollbar-thumb:hover { background:var(--chess-scroll-hover); }
  .chess-drawer::-webkit-scrollbar-thumb:active,.chess-history::-webkit-scrollbar-thumb:active { background:var(--chess-scroll-active);box-shadow:none; }
}
@supports(-moz-appearance:none){html,body,dialog,textarea{scrollbar-color:#9c241a #472619;scrollbar-width:auto}.chess-drawer,.chess-history{scrollbar-color:var(--chess-scroll-thumb) var(--chess-scroll-track);scrollbar-width:thin}}
@media (forced-colors:active) {
  html,body,dialog,textarea,.chess-drawer,.chess-history { scrollbar-color:auto;scrollbar-width:auto; }
  ::-webkit-scrollbar,::-webkit-scrollbar-track,::-webkit-scrollbar-corner,::-webkit-scrollbar-thumb,::-webkit-scrollbar-thumb:hover,::-webkit-scrollbar-thumb:active{all:revert}
  .chess-drawer::-webkit-scrollbar,.chess-drawer::-webkit-scrollbar-track,.chess-drawer::-webkit-scrollbar-corner,.chess-drawer::-webkit-scrollbar-thumb,.chess-drawer::-webkit-scrollbar-thumb:hover,.chess-drawer::-webkit-scrollbar-thumb:active,
  .chess-history::-webkit-scrollbar,.chess-history::-webkit-scrollbar-track,.chess-history::-webkit-scrollbar-corner,.chess-history::-webkit-scrollbar-thumb,.chess-history::-webkit-scrollbar-thumb:hover,.chess-history::-webkit-scrollbar-thumb:active { all:revert; }
}
.tabletop-invitation svg { width:26px;height:25px;fill:none;stroke:#8e2019;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round; }
.tabletop-invitation:disabled { opacity:.55; }
.tabletop-piece { position:absolute;pointer-events:none;transform-origin:var(--anchor-x) var(--anchor-y);will-change:transform; }
.tabletop-art { position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;opacity:0;filter:drop-shadow(4px 13px 10px #2b10052e);transition:opacity .22s,translate .17s ease,filter .17s ease; }
.tabletop-live .tabletop-art { opacity:1; }
#hero-stage.tabletop-live > .hero-car,#hero-stage.tabletop-live > .hero-garage { opacity:0!important;transition:opacity .22s; }
#hero-stage.tabletop-live > .hero-route { visibility:hidden; }
.tabletop-hit { position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:transparent;pointer-events:auto;touch-action:pan-y;outline:0; }
.tabletop-car .tabletop-hit { clip-path:polygon(24% 50%,27% 35%,39% 19%,60% 19%,73% 29%,90% 48%,94% 65%,94% 82%,75% 87%,33% 87%,19% 78%,19% 64%); }
.tabletop-workshop .tabletop-hit { clip-path:polygon(7% 28%,50% 4%,84% 23%,86% 80%,94% 88%,94% 94%,17% 96%,7% 86%); }
.tabletop-focus { position:absolute;left:20%;right:6%;top:71%;height:16%;border:2px solid #8c1d18;border-radius:50%;opacity:0;pointer-events:none;box-shadow:0 0 0 3px #f0dbadcc; }
.tabletop-workshop .tabletop-focus { left:8%;right:7%;top:86%;height:10%;border-radius:3px;transform:skewY(-2deg); }
.tabletop-piece:has(.tabletop-hit:focus-visible) .tabletop-focus { opacity:1; }
.tabletop-piece.is-picked .tabletop-art { translate:0 -9px;filter:drop-shadow(6px 22px 13px #2b100542); }
.tabletop-piece.is-picked .tabletop-focus { opacity:.7;border-color:#cb9e57;box-shadow:0 0 0 1px #fff1ce66; }
.tabletop-piece.is-dragging .tabletop-art { translate:0 -12px; }
.tabletop-landings { position:absolute;inset:0;z-index:8;pointer-events:none; }
.tabletop-landing { position:absolute;width:56px;height:44px;transform:translate(-50%,-50%);pointer-events:auto;border:0;background:transparent;padding:0;touch-action:manipulation; }
.tabletop-landing::before { content:"";position:absolute;inset:9px 2px;border:1px solid #efe0ad;border-radius:50%;background:radial-gradient(ellipse,#f5d28736,transparent 65%);box-shadow:0 0 0 2px #977138,inset 0 0 0 2px #76502d77,0 4px 6px #30120b38;transition:background .15s,box-shadow .15s,scale .15s; }
.tabletop-landing::after { content:"";position:absolute;width:5px;height:5px;left:calc(50% - 2.5px);top:calc(50% - 2.5px);border-radius:50%;background:#9e231b;box-shadow:0 1px 1px #ffefbb; }
.tabletop-landing:hover::before,.tabletop-landing.is-nearest::before,.tabletop-landing:focus-visible::before { background:#f5d28799;box-shadow:0 0 0 3px #9d2119,inset 0 0 0 2px #fff0c8,0 4px 9px #30120b44;scale:1.12; }
.tabletop-landing:focus-visible { outline:none; }
.tabletop-route { position:absolute;inset:0;width:100%;height:100%;z-index:1;overflow:visible;pointer-events:none;opacity:0; }
.tabletop-live .tabletop-route { opacity:1; }
.tabletop-route .tabletop-route-edge { fill:none;stroke:#f6e4bf;stroke-width:10;stroke-linecap:round;stroke-linejoin:round; }
.tabletop-route .tabletop-route-red { fill:none;stroke:#a91e18;stroke-width:5;stroke-linecap:round;stroke-linejoin:round; }
.tabletop-route .tabletop-seal { fill:#a91e18;stroke:#edc98d;stroke-width:1.5; }
.tabletop-route .tabletop-traveller { fill:#f1d18c;stroke:#7f2419;stroke-width:1; }
.tabletop-glow { position:absolute;width:140px;height:80px;pointer-events:none;z-index:2;transform:translate(-50%,-50%);background:radial-gradient(ellipse,#ffc55899,transparent 67%);mix-blend-mode:screen;opacity:0; }
.tabletop-live .tabletop-glow { opacity:var(--arrival-glow,.15);transition:opacity .5s; }
#hero-stage.tabletop-live > .garage-light { opacity:0!important;animation:none!important; }
.hero-play-controls { z-index:10; }
.tabletop-status { position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap; }
.tabletop-hint { position:absolute;left:7%;bottom:66px;z-index:9;font:italic 15px WorkshopSerif,Georgia,serif;color:#6a321b;background:#f4e5c5e6;padding:5px 10px;border-left:2px solid #a41c18;pointer-events:none;box-shadow:0 2px 6px #30120b18; }
.tabletop-probes { position:absolute;inset:0;pointer-events:none; }
.tabletop-probe { position:absolute;width:0;height:0;pointer-events:none; }
html.tabletop-carrying,html.tabletop-carrying * { user-select:none!important;cursor:url('assets/brass-pointer-active.svg') 3 2,grabbing!important; }
@media (max-width:680px) {
  .tabletop-hint { bottom:auto;top:6px;left:5%;font-size:13px;padding:4px 8px; }
  .tabletop-route .tabletop-route-edge { stroke-width:7; }
  .tabletop-route .tabletop-route-red { stroke-width:3.5; }
  .tabletop-landing { width:48px; }
  .tabletop-piece.is-picked .tabletop-art { translate:0 -6px; }
  .tabletop-glow { width:90px;height:55px; }
}
html[data-motion=off] .tabletop-art,html[data-motion=off] .tabletop-glow { transition:none;translate:none!important; }
@media (prefers-reduced-motion:reduce) {
  .tabletop-art,.tabletop-glow,.tabletop-landing::before { transition:none;translate:none!important; }
}
