@import "https://fonts.googleapis.com/css2?family=Archivo+Black&family=DM+Sans:wght@400;600;700&display=swap";:root{color:#18211c;font-synthesis:none;--forest:#173a2b;--paper:#f8f4e9;--yellow:#f4bc3b;--green:#24734d;--red:#be4134;background:#e8e1d2;font-family:DM Sans,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}.shell{background-color:#e8e1d2;background-image:linear-gradient(#173a2b14 1px,#0000 1px),linear-gradient(90deg,#173a2b14 1px,#0000 1px);background-size:32px 32px;min-height:100vh;padding:clamp(1.25rem,5vw,4rem)}.brand{align-items:center;gap:1rem;max-width:1080px;margin:0 auto 3rem;display:flex}.route-marker{aspect-ratio:1;border:4px solid var(--paper);outline:3px solid var(--forest);background:var(--forest);width:58px;color:var(--paper);border-radius:50%;place-items:center;font-weight:700;display:grid}.eyebrow,.section-number{color:var(--red);text-transform:uppercase;margin:0;font-size:.75rem;font-weight:700}h1,h2{letter-spacing:0;font-family:Archivo Black,sans-serif}h1{margin:.15rem 0 0;font-size:clamp(1.5rem,4vw,2.5rem)}.version-stamp{color:#667068;margin-top:.35rem;font-size:.65rem;font-weight:600;line-height:1.3;display:block}.join-panel{border-top:12px solid var(--yellow);background:var(--paper);max-width:1080px;box-shadow:12px 12px 0 var(--forest);grid-template-columns:minmax(0,.9fr) minmax(320px,1.1fr);gap:clamp(2rem,7vw,6rem);margin:auto;padding:clamp(1.5rem,4vw,3.5rem);display:grid}h2{max-width:10ch;margin:.5rem 0;font-size:clamp(2rem,5vw,4.5rem);line-height:1.02}.game-form{align-content:start;gap:1.4rem;display:grid}label,legend{font-weight:700}input{border:2px solid var(--forest);background:#fff;width:100%;margin-top:.4rem;padding:.85rem 1rem}fieldset{border:0;margin:0;padding:0}.format-switch{grid-template-columns:1fr 1fr;gap:.6rem;margin-top:.4rem;display:grid}.format-switch button{border:2px solid var(--forest);background:0 0;min-height:76px;padding:.75rem;font-weight:700}.format-switch button[aria-pressed=true]{background:var(--forest);color:#fff}.format-switch small{margin-top:.2rem;font-weight:400;display:block}.primary-action,.code-entry button{background:var(--green);color:#fff;border:0;padding:1rem;font-weight:700}.divider{color:#667068;text-transform:uppercase;align-items:center;gap:.75rem;font-size:.8rem;display:flex}.divider:before,.divider:after{content:"";background:#c8c5ba;flex:1;height:1px}.code-entry{grid-template-columns:1fr auto;display:grid}.code-entry input{text-transform:uppercase;letter-spacing:.2em;margin:.4rem 0 0;font-family:Archivo Black,sans-serif}.code-entry button{margin-top:.4rem}.error-message{color:var(--red);margin:0;font-weight:700}.lobby h2{font-size:clamp(2rem,5vw,4rem)}.player-list{gap:.6rem;margin:1.25rem 0;padding:0;list-style:none;display:grid}.player-list li{border-left:5px solid var(--yellow);background:#fff;justify-content:space-between;align-items:center;padding:1rem;font-weight:700;display:flex}.player-list small{color:#667068;font-weight:600}.player-status{align-items:center;gap:.6rem;display:flex}.player-status button{border:1px solid var(--red);color:var(--red);background:0 0;padding:.3rem .5rem;font-size:.75rem;font-weight:700}.lobby-actions,.hand-actions{flex-wrap:wrap;gap:.75rem;display:flex}.lobby-actions button,.hand-actions button{border:2px solid var(--forest);background:0 0;min-height:44px;padding:.75rem 1rem;font-weight:700}.lobby-actions .primary-action,.hand-actions .primary-action{border-color:var(--green);background:var(--green);color:#fff}.muted{color:#667068;font-size:.875rem}.game-shell{background:#d8d2c4;min-height:100vh;padding:1.25rem clamp(1rem,3vw,2.5rem) 21rem}.game-header{justify-content:space-between;align-items:center;gap:1rem;max-width:1400px;margin:0 auto 1.25rem;display:flex}.compact-brand{margin:0}.compact-brand h1{font-size:clamp(1.3rem,3vw,2rem)}.compact-brand .version-stamp{max-width:42ch}.turn-sign{border:3px solid var(--paper);outline:3px solid var(--forest);background:var(--forest);color:#fff;text-align:center;min-width:180px;padding:.65rem 1rem}.turn-sign span,.turn-sign small{display:block}.turn-sign span{font-weight:700}.winner-banner{border-left:10px solid var(--yellow);background:var(--paper);justify-content:space-between;align-items:center;gap:1rem;max-width:1400px;margin:0 auto 1rem;padding:1rem 1.5rem;display:flex}.winner-banner h2{max-width:none;margin:.2rem 0 0;font-size:2rem}.winner-banner .primary-action{border:0;min-height:46px}.reaction-banner{border:3px solid var(--forest);background:var(--paper);justify-content:space-between;align-items:center;gap:1rem;max-width:1400px;margin:0 auto 1rem;padding:1rem 1.5rem;display:flex}.reaction-banner.your-reaction{border-left:12px solid var(--red)}.reaction-banner h2{max-width:none;margin:.15rem 0;font-size:clamp(1.25rem,3vw,2rem)}.reaction-banner p{margin:.35rem 0 0}.reaction-actions{flex-shrink:0;gap:.6rem;display:flex}.reaction-actions button{border:2px solid var(--forest);background:0 0;min-height:46px;padding:.7rem 1rem;font-weight:700}.reaction-actions .primary-action{border-color:var(--green);background:var(--green);color:#fff}.road-table{max-width:1400px;margin:auto}.tabletop-piles{border:2px solid var(--forest);background-color:#2c6049;background-image:radial-gradient(#f8f4e914 1px,#0000 1px);background-size:8px 8px;grid-template-columns:minmax(130px,.65fr) minmax(190px,1fr) minmax(190px,1fr);gap:1rem;min-height:220px;padding:1rem;display:grid;box-shadow:inset 0 0 0 5px #f8f4e91f}.target-marker{border:5px solid var(--paper);color:#173a2b;text-align:center;background:#f8f4e9;border-radius:64px 64px 7px 7px;outline:3px solid #173a2b;place-self:center;place-items:center;width:128px;min-height:154px;padding:1rem;display:grid;box-shadow:5px 7px #10221a59}.target-marker span,.target-marker small{text-transform:uppercase;font-size:.68rem;font-weight:700}.target-marker strong{text-align:center;width:100%;min-width:0;font-family:Archivo Black,sans-serif;font-size:2rem;line-height:1}.pile-zone{min-width:0;color:var(--paper);border:1px solid #f8f4e973;grid-template-rows:auto 1fr auto;padding:.7rem .85rem;display:grid}.pile-heading{border-bottom:1px solid #f8f4e959;justify-content:space-between;align-items:baseline;gap:.75rem;min-width:0;padding-bottom:.35rem;display:flex}.pile-heading span{text-transform:uppercase;font-size:.72rem;font-weight:700}.pile-heading strong{text-overflow:ellipsis;white-space:nowrap;font-size:.78rem;overflow:hidden}.pile-zone>small{color:#f8f4e9c7;text-align:center;align-self:end;font-size:.68rem}.draw-stack,.discard-stack{aspect-ratio:5/7;place-self:center;width:88px;margin:10px;position:relative}.draw-stack{isolation:isolate;color:inherit;background:0 0;border:0;padding:0}.draw-stack:disabled{opacity:.82}.draw-stack:not(:disabled){cursor:pointer}.draw-stack:not(:disabled):before{content:"";z-index:0;pointer-events:none;background:#69eb9f47;border:2px solid #84ffb5b8;border-radius:13px;animation:1.8s ease-in-out infinite draw-pile-pulse;position:absolute;inset:-9px;box-shadow:0 0 14px 7px #69eb9fbf,0 0 30px 13px #69eb9f61}.draw-stack:not(:disabled):hover .stacked-back:last-of-type,.draw-stack:not(:disabled):focus-visible .stacked-back:last-of-type{transform:translate(3px,-7px)rotate(2deg)}.draw-stack:focus-visible{outline:4px solid var(--yellow);outline-offset:9px}.stacked-back{z-index:1;transform:translate(calc(var(--stack-index) * -2px), calc(var(--stack-index) * -2px));transition:transform .14s;position:absolute;inset:0}.card-back{color:#173a2b;background-color:#e4ac2f;background-image:repeating-linear-gradient(45deg,#0000 0 7px,#173a2b2e 7px 9px),repeating-linear-gradient(-45deg,#0000 0 7px,#173a2b1f 7px 9px);border:2px solid #10291f;border-radius:5px;padding:6px;display:grid;position:absolute;inset:0;box-shadow:2px 3px #10221a59}.card-back-border{background:#f8f4e938;border:2px solid;border-radius:3px;align-content:center;place-items:center;display:grid}.card-back svg{width:42%;height:42%}.card-back strong{font-family:Archivo Black,sans-serif;font-size:1.15rem}.card-back small{text-transform:uppercase;font-size:.42rem;font-weight:700}.discard-stack{pointer-events:none}.discard-card{--discard-x:0;--discard-y:0;--discard-rotation:0;background:var(--paper);transform:translate(var(--discard-x), var(--discard-y)) rotate(var(--discard-rotation));transform-origin:50% 75%;border:2px solid #15231b;border-radius:5px;position:absolute;inset:0;overflow:hidden;box-shadow:2px 3px #10221a47}.discard-card .card-face{padding:7px}.discard-card .card-topline{font-size:5px}.discard-card .card-category{padding:1px 2px}.discard-card .card-caption{padding-top:3px}.discard-card .card-caption strong{min-height:2em;font-size:8px}.discard-card .card-caption small{display:none}.discard-card .card-illustration{margin:3px 0}.discard-card.distance .card-illustration strong{font-size:20px}.empty-pile{color:#f8f4e9bf;text-transform:uppercase;border:2px dashed #f8f4e98c;border-radius:5px;place-items:center;font-size:.68rem;font-weight:700;display:grid;position:absolute;inset:0}.racer-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;margin-top:1rem;display:grid}.racer-lane{background:var(--paper);border-top:7px solid #667068;min-width:0;padding:1rem;box-shadow:5px 5px #173a2b33}.racer-lane.your-lane{border-color:var(--yellow)}.racer-lane header{justify-content:space-between;align-items:start;gap:.75rem;display:flex}.racer-lane h2{overflow-wrap:anywhere;max-width:13ch;margin:0;font-size:1.15rem}.racer-lane header strong{white-space:nowrap;font-family:Archivo Black,sans-serif;font-size:1.5rem}.racer-lane header strong span{font-family:DM Sans,sans-serif;font-size:.75rem}.progress-track{background:#d8d2c4;height:8px;margin:.85rem 0;overflow:hidden}.progress-track span{background:var(--red);height:100%;display:block}.racer-tableau{grid-template-columns:repeat(3,1fr);gap:.55rem;margin-top:.8rem;display:grid}.tableau-slot{background:#ebe7dc;justify-items:center;gap:.3rem;min-width:0;padding:.4rem;display:grid}.tableau-slot>small{color:#667068;text-transform:uppercase;font-size:.62rem;font-weight:700}.tableau-card,.empty-tableau-card{aspect-ratio:5/7;background:var(--paper);border:2px solid #15231b;border-radius:4px;width:min(100%,68px);display:block;position:relative;overflow:hidden;box-shadow:2px 3px #173a2b38}.empty-tableau-card{box-shadow:none;color:#85877f;text-transform:uppercase;border-style:dashed;place-items:center;font-size:.52rem;font-weight:700;display:grid}.tableau-card .card-face{padding:6px}.tableau-card .card-topline{border-bottom-width:1px;gap:2px;padding-bottom:2px;font-size:4px}.tableau-card .card-category{padding:1px 2px}.tableau-card .card-illustration{margin:3px 0}.tableau-card .card-caption{border-top-width:1px;padding-top:3px}.tableau-card .card-caption strong{min-height:2em;font-size:7px}.tableau-card.distance .card-illustration strong{font-size:17px}.safety-slot{grid-column:1/-1;justify-items:start}.tableau-safeties{grid-template-columns:repeat(4,minmax(0,1fr));gap:.45rem;width:100%;max-width:293px;display:grid}.tableau-safeties .tableau-card{width:100%;max-width:68px}.score-strip{border-top:1px solid #c8c5ba;justify-content:space-between;margin-top:.75rem;padding-top:.65rem;font-size:.8rem;display:flex}.remove-action{border:1px solid var(--red);width:100%;min-height:38px;color:var(--red);background:0 0;margin-top:.75rem;font-weight:700}.target-action{background:var(--green);color:#fff;border:0;width:100%;min-height:42px;margin-top:.75rem;font-weight:700}.hand-dock{z-index:2;border-top:6px solid var(--forest);background:var(--paper);padding:.8rem clamp(1rem,3vw,2.5rem) 1rem;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -8px 24px #173a2b2e}.hand-toolbar{justify-content:space-between;align-items:center;max-width:1400px;margin:0 auto .65rem;display:flex}.hand-toolbar h2{max-width:none;margin:.1rem 0 0;font-size:1.2rem}.card-hand{overscroll-behavior-inline:contain;scroll-snap-type:inline proximity;grid-auto-columns:142px;grid-auto-flow:column;gap:.75rem;max-width:1400px;margin:auto;padding:5px 5px .5rem;display:grid;overflow-x:auto}.playing-card{aspect-ratio:5/7;color:#172019;text-align:left;scroll-snap-align:start;background:#faf6e9;border:3px solid #15231b;border-radius:7px;width:142px;padding:0;transition:transform .12s,box-shadow .12s;display:block;position:relative;overflow:hidden;box-shadow:3px 4px #173a2b47}.playing-card:after{content:"";z-index:3;opacity:.45;pointer-events:none;border:1px solid;border-radius:3px;position:absolute;inset:5px}.playing-card:not(:disabled):hover{transform:translateY(-4px);box-shadow:4px 8px #173a2b3d}.playing-card:focus-visible{outline:4px solid var(--yellow);outline-offset:2px}.playing-card:disabled{opacity:.72;filter:saturate(.78)}.playing-card.selected{outline:5px solid var(--yellow);outline-offset:1px;transform:translateY(-5px);box-shadow:4px 9px #173a2b4d}.card-face{--card-ink:#173a2b;--card-field:#f8f4e9;--card-accent:#e4ac2f;background:var(--card-field);color:var(--card-ink);grid-template-rows:auto 1fr auto;padding:12px;display:grid;position:absolute;inset:0;overflow:hidden}.card-face:before{content:"";background-image:repeating-linear-gradient(135deg, transparent 0 12px, color-mix(in srgb, var(--card-ink) 7%, transparent) 12px 13px);pointer-events:none;position:absolute;inset:0}.card-topline,.card-caption{z-index:2;position:relative}.card-topline{text-transform:uppercase;border-bottom:2px solid;justify-content:space-between;align-items:center;gap:6px;padding-bottom:5px;font-size:8px;font-weight:700;display:flex}.card-code{font-family:Archivo Black,sans-serif}.card-category{background:var(--card-ink);color:var(--card-field);padding:2px 4px}.card-illustration{z-index:1;background:var(--card-accent);clip-path:polygon(50% 0,100% 18%,92% 84%,50% 100%,8% 84%,0 18%);place-items:center;min-height:0;margin:7px 0;display:grid;position:relative;overflow:hidden}.card-illustration svg{z-index:2;fill:none;width:60%;height:60%;position:relative}.card-road-lines{opacity:.24;background:repeating-linear-gradient(90deg,#0000 0 43%,currentColor 43% 47%,#0000 47% 53%,currentColor 53% 57%,#0000 57% 100%);position:absolute;inset:0;transform:rotate(-24deg)scale(1.5)}.card-caption{border-top:2px solid;min-width:0;padding-top:6px;display:block}.card-caption strong{overflow-wrap:anywhere;min-height:2.2em;font-family:Archivo Black,sans-serif;font-size:13px;line-height:1.05;display:block}.card-caption small{text-transform:uppercase;margin-top:4px;font-size:8px;font-weight:700;display:block}:is(.playing-card,.tableau-card,.discard-card).hazard .card-face{--card-ink:#321713;--card-field:#ef6453;--card-accent:#f7cf47}:is(.playing-card,.tableau-card,.discard-card).hazard .card-illustration{clip-path:polygon(30% 0,70% 0,100% 30%,100% 70%,70% 100%,30% 100%,0 70%,0 30%)}:is(.playing-card,.tableau-card,.discard-card).remedy .card-face{--card-ink:#11364a;--card-field:#dcecf0;--card-accent:#70b9ca}:is(.playing-card,.tableau-card,.discard-card).safety .card-face{--card-ink:#173a2b;--card-field:#f4bc3b;--card-accent:#f8f4e9}:is(.playing-card,.tableau-card,.discard-card).safety .card-illustration{clip-path:polygon(50% 0,92% 16%,84% 72%,50% 100%,16% 72%,8% 16%)}:is(.playing-card,.tableau-card,.discard-card).distance .card-face{--card-ink:#f8f4e9;--card-field:#245942;--card-accent:#f8f4e9}:is(.playing-card,.tableau-card,.discard-card).distance .card-illustration{border:3px solid var(--card-ink);clip-path:none;color:#173a2b;background:#f8f4e9;border-radius:50% 50% 5px 5px}:is(.playing-card,.tableau-card,.discard-card).distance .card-illustration svg{opacity:.18;width:42%;height:42%;position:absolute;bottom:8%}:is(.playing-card,.tableau-card,.discard-card).distance .card-illustration strong{z-index:2;font-family:Archivo Black,sans-serif;font-size:31px;line-height:1;position:relative}:is(.playing-card,.tableau-card,.discard-card)[data-kind=distance-200] .card-face{--card-field:#8f352c;--card-accent:#f8f4e9}:is(.playing-card,.tableau-card,.discard-card)[data-kind=stop] .card-illustration svg{fill:#f8f4e9;color:#8f231d}:is(.playing-card,.tableau-card,.discard-card)[data-kind=roll] .card-illustration svg,:is(.playing-card,.tableau-card,.discard-card)[data-kind=right-of-way] .card-illustration svg,:is(.playing-card,.tableau-card,.discard-card)[data-kind=driving-ace] .card-illustration svg{fill:#f8f4e9}.floating-error{z-index:5;background:var(--red);color:#fff;margin:0;padding:.75rem 1rem;font-weight:700;position:fixed;top:1rem;left:50%;transform:translate(-50%)}@keyframes draw-pile-pulse{0%,to{opacity:.72;transform:scale(.97)}50%{opacity:1;transform:scale(1.03)}}@media (width<=760px){.brand{margin-bottom:1.5rem}.join-panel{box-shadow:7px 7px 0 var(--forest);grid-template-columns:1fr}h2{max-width:14ch;font-size:2.4rem}.format-switch{grid-template-columns:1fr}.game-shell{padding-bottom:19rem}.game-header{align-items:flex-start}.game-header .route-marker{display:none}.tabletop-piles{grid-template-columns:100px 1fr 1fr;gap:.5rem;min-height:190px;padding:.65rem}.target-marker{border-width:4px;width:88px;min-height:116px;padding:.55rem}.target-marker strong{font-size:1.4rem}.target-marker span,.target-marker small{font-size:.52rem}.pile-zone{padding:.5rem}.draw-stack,.discard-stack{width:67px;margin:8px}.pile-heading strong{display:none}.racer-grid{grid-template-columns:1fr 1fr}.hand-toolbar{align-items:flex-end}.reaction-banner,.winner-banner{flex-direction:column;align-items:stretch}.reaction-actions button{flex:1}.card-hand{grid-auto-columns:118px;gap:.55rem}.playing-card{width:118px}.card-face{padding:10px}.card-caption strong{font-size:11px}.card-illustration{margin:5px 0}.playing-card.distance .card-illustration strong{font-size:26px}}@media (width<=480px){.racer-grid{grid-template-columns:1fr}.turn-sign{min-width:130px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important}.draw-stack:not(:disabled):before{opacity:.75;animation:none;transform:none}}
