/* 1.0.1 — integrated 3-D model board. Real pieces, labels and hit targets stay independent. */
.track-shell{background:#f5dca8;border:2px solid #b98857;border-radius:25px;box-shadow:inset 0 0 0 4px #fff0cc,0 7px 0 #ab774e,0 17px 26px #774a3033;overflow:hidden}
#track.track{aspect-ratio:5/3;min-height:0;border-radius:23px;background:url('./assets/track-model.svg') center/100% 100% no-repeat;isolation:isolate}
#track::before,#track::after{display:none}
#track .track-inner{left:21%;top:32%;width:58%;height:45%;background:none;border:0;border-radius:0;box-shadow:none;pointer-events:none}
#track .pyramid{background:none;clip-path:none;left:11%;top:17%;width:37%;height:68%;transform:none;filter:drop-shadow(3px 5px 3px #9b642926)}
#track .pyramid::before,#track .pyramid::after{display:none}
#track .pyramid img{width:100%;height:100%;object-fit:contain}
#track .race-sun{width:15%;height:auto;aspect-ratio:1;right:28%;top:2%;opacity:.7;box-shadow:0 0 20px 12px #ffe8b966}
#track .track-piske{width:20%;height:39%;right:4%;bottom:19%;transform:rotate(-6deg);filter:drop-shadow(2px 6px 4px #85522a3b)}
#track .desert-note{left:16%;bottom:9%;color:#976738;font-size:7px;letter-spacing:1.4px}
#track .dice-stage{left:53%;top:12%;width:37%;height:59%}
#track .dice-stage .die{width:clamp(26px,3.4vw,48px);height:auto;aspect-ratio:1;font-size:clamp(17px,2vw,29px);border-radius:10px;color:#654127!important;text-shadow:0 1px #fffa}
#track .dice-stage>span{font-size:clamp(8px,.75vw,12px);background:#fff3d9ef;color:#735133;border:1px solid #d7b080;max-width:100%;white-space:normal;text-align:center;font-weight:800;line-height:1.4;box-shadow:0 2px 0 #cf9f6d66}
#track .used-dice,#track .finish-flag{display:none}
#track .cell{width:6.6%;height:8.5%;aspect-ratio:auto;border:0;border-radius:9px;padding:0;background:transparent;box-shadow:none;opacity:1;filter:none!important;transform:translate(-50%,-5%);z-index:5;display:flex;align-items:flex-start;justify-content:center;color:#765231;font-size:clamp(9px,1vw,15px)}
#track .cell>span{min-width:2.4em;padding:.06em .3em;line-height:1.3;border:1px solid #f7e1b6;border-radius:8px;background:linear-gradient(#fff0cddc,#eac591f0);box-shadow:inset 0 1px #fff6,0 2px 0 #b78a57,0 4px 6px #7f502b24;font-weight:950;text-shadow:0 1px #fff4}
#track .cell.spawn>span{color:#285e4d;background:linear-gradient(#e0edc5,#bed1a3);border-color:#f2f5d2;box-shadow:0 2px 0 #6d946c,0 3px 5px #654a2924}
#track .cell.homeward>span{color:#714246;background:linear-gradient(#ffdacb,#eab0aa);border-color:#ffe8cb;box-shadow:0 2px 0 #b68569,0 3px 5px #654a2924}
#track .cell.legal{background:#93ca8c77;outline:2px solid #65ac72;box-shadow:0 0 0 4px #ffefc599;transform:translate(-50%,-38%);height:13%;z-index:8;align-items:center;animation:legal-glow 1.3s ease-in-out infinite alternate}
#track .cell.legal>span{background:#e3f6bc;color:#316342;border-color:#fff9cd}
#track .camel-piece{--facing:1;position:absolute;width:10.8%;height:auto;aspect-ratio:1.4;border:0;border-radius:0;background:none;padding:0;opacity:1;transform:translate(-50%,-100%);transition:none;filter:none;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
#track .camel-piece>img{display:block;width:100%;height:100%;object-fit:contain;object-position:bottom;transform:scaleX(var(--facing));filter:drop-shadow(1px 3px 1px #72502d27);transition:filter .12s;position:relative;z-index:1}
#track .camel-piece>i.contact-shadow{position:absolute;left:13%;right:10%;height:13%;bottom:0;background:#68462542;border-radius:50%;filter:blur(2px);transform:scaleX(.9);pointer-events:none;transition:opacity .14s}
#track .camel-piece[data-level="0"]>i.contact-shadow{opacity:1;filter:blur(3px)}
#track .camel-piece> b{left:auto;right:9%;top:27%;width:1.5em;height:1.5em;line-height:1.5em;border:1px solid #fff3d5;border-radius:50%;font-size:clamp(8px,.8vw,12px);background:#755132e8;color:#fff1d1;box-shadow:0 2px 4px #684c2729;z-index:2;text-shadow:none}
#track .camel-piece.selected>img{filter:drop-shadow(0 0 2px #fff2b6) drop-shadow(0 0 5px #d89836)}
#track .camel-piece:focus-visible{outline:3px solid #8d6040;outline-offset:3px;border-radius:18px}
#track .camel-piece.race-running{will-change:transform}
#track .camel-piece.race-running>i.contact-shadow{opacity:.55}
#track .camel-piece.crossed> b{background:#c64d6c}
#track .camel-piece.moving{animation:none}
#track .support-token{font-size:clamp(9px,.9vw,13px);min-width:40px;text-align:center;padding:3px 6px;transform:translate(-50%,-105%) rotate(-8deg);z-index:10}
#track .route-arrow{position:absolute;width:16px;height:20px;line-height:18px;font-size:22px;font-weight:900;color:#fff4dbb8;text-shadow:0 1px 1px #98683933;pointer-events:none;z-index:3}
#finishGate{position:absolute;left:50%;top:76%;width:14%;height:17%;transform:translateX(-50%);z-index:12;pointer-events:none}
#finishGate::before,#finishGate::after{content:'';position:absolute;top:16%;bottom:2%;width:7%;border:1px solid #fff3ce;border-radius:5px;background:repeating-linear-gradient(180deg,#fff0ce 0 18%,#cd736b 18% 36%);box-shadow:2px 3px 0 #a1764659}
#finishGate::before{left:5%}#finishGate::after{right:5%}
#finishGate strong{position:relative;display:block;color:#fff5d9;background:linear-gradient(135deg,#dd8c86,#b8556c);font-size:clamp(9px,1.3vw,20px);font-weight:950;text-align:center;border:2px solid #fff0cf;border-radius:9px;padding:2px 0;box-shadow:0 3px 0 #8e573f,0 6px 10px #653e332b;z-index:1}
#finishGate small{display:block;text-align:center;font-size:clamp(6px,.6vw,9px);letter-spacing:1.5px;color:#744b35;background:#fff0cd;line-height:1.2;margin:6px 12% 0;border-radius:4px;position:relative;z-index:1}
.start-pointer,.home-stretch{position:absolute;bottom:1.4%;border-radius:8px;padding:.2% 1%;font-weight:850;font-size:clamp(8px,.9vw,13px);pointer-events:none;z-index:5;box-shadow:0 2px #98663833;white-space:nowrap;line-height:1.5}
.start-pointer{left:26%;color:#386341;background:#e1e9b8;border:1px solid #fff6cf}.home-stretch{right:25%;color:#a35558;background:#ffe5c8;border:1px solid #fff0d4}
.race-brand{position:absolute;left:29%;right:29%;top:5%;text-align:center;color:#a07044;letter-spacing:3px;font-weight:850;font-size:clamp(8px,.9vw,12px);pointer-events:none}
.leg-dashboard{display:grid;grid-template-columns:1.2fr 1fr;gap:0;margin-top:10px;border:1px solid #d9b48b;border-radius:17px;background:linear-gradient(115deg,#fff6e5,#f5e2c3);box-shadow:inset 0 2px #fffc,0 4px 0 #c69b6933;overflow:hidden}
.leg-block,.race-block{padding:12px 15px;min-width:0}.race-block{border-left:1px dashed #d9b088;background:#eed3a34a}
.leg-top{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:6px}.leg-top>b{font-size:16px;color:#785437}.leg-top strong{color:#bb607c;font-size:19px}.leg-top small{font-size:10px;color:#a6754a}
#legPips{display:flex;gap:5px;margin:6px 0}.leg-dashboard #legPips>span{display:grid;place-items:center;width:23px;height:23px;border:1px solid #cfa774;border-radius:7px;color:#aa8157;background:#f8e7c5;box-shadow:0 2px 0 #a97c4933;font-weight:800;font-size:12px}
#legPips>span.done{background:linear-gradient(#9bc5a1,#6da586);color:#fff9dc;border-color:#d4e1ba;box-shadow:0 2px 0 #547c65}
#legExplain{font-size:11px;color:#8b6847;line-height:1.4;margin-top:5px;min-height:16px}
#raceDistance{font-size:12px;font-weight:850;line-height:1.5;color:#805834}.race-block>small{display:block;font-size:10px;color:#9b7954;margin-bottom:5px}
.race-progress{height:8px;border-radius:9px;background:#b8946736;border:1px solid #bd99684d;overflow:hidden;margin:8px 0 5px}.race-progress i{display:block;height:100%;background:linear-gradient(90deg,#deac77,#e48798);border-radius:9px;transition:width .3s}
#diceTray{display:flex;gap:7px;align-items:center;margin-top:4px}.available-die{display:flex;align-items:center;gap:2px}.available-die>i{width:22px;height:22px;border-radius:6px;background:var(--die-color);color:#fff;font-weight:900;font-size:13px;font-style:normal;border:1px solid #fff4d7;box-shadow:0 2px 0 #69422f44;display:grid;place-items:center}.available-die>small{font-size:9px;color:#805638}.available-die.used{opacity:.45}.available-die.used>i{filter:saturate(.4)}
#diceRemain{font-size:11px;font-weight:850;background:#dfecd7;color:#53765b;white-space:nowrap}#legLabel{letter-spacing:1.3px}.race-banner h2{font-size:19px}
.race-board-foot{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:10px 3px 0;color:#885f40;font-size:10px}.race-board-foot p{margin:0}#raceLegend{white-space:nowrap;color:#786475}#camelInspect{flex:1;line-height:1.5}
.action-panel #actionHint{font-size:13px;line-height:1.6}.action-tabs button{font-size:12px;min-height:38px}.bet-card .camel-art{width:70px;height:49px}.bet-card{min-height:114px;padding-top:18px}.bet-card span{font-size:10px}.bet-card strong{font-size:20px}.bet-card small{font-size:9px}.roll-btn{min-height:48px;box-shadow:inset 0 2px #ffeda9,0 4px 0 #bf6d78,0 7px 14px #c582622e}
#localControls{display:flex;align-items:center;gap:7px;margin-top:8px;flex-wrap:wrap}#localControls .smallbtn{font-size:11px;padding:6px 10px}.local-note{font-size:10px;color:#997151}
.guide-essential{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0}.guide-essential>article{background:#fff2d2;border:1px solid #daba8e;border-radius:15px;padding:17px}.guide-essential h3{font-size:18px;color:#ad5770;margin:4px 0 9px}.guide-essential p{font-size:13px;line-height:1.8}.guide-essential small{font-size:10px;letter-spacing:2px;color:#ae8251}.guide-arrow{font-size:15px;letter-spacing:3px;color:#926036;font-weight:800;margin:8px 0}.score-next-note{background:#e4edd8;border:1px solid #b8ccab;border-radius:12px;color:#4e6f4c;padding:12px 16px;margin:13px 0;text-align:left;font-size:13px;line-height:1.8}.score-finish-note{background:#fde3d7;border-color:#e7b6a4;color:#90556a}.resume-local{width:100%;margin-top:10px}
@keyframes legal-glow{to{box-shadow:0 0 0 4px #fff0c944,0 0 10px #66ac7877}}
@media(min-width:1550px){.race-grid{grid-template-columns:166px minmax(0,1fr) 222px}.race-banner h2{font-size:21px}.bet-card span{font-size:11px}}
@media(max-width:1200px){.leg-block,.race-block{padding:10px}.leg-top>b{font-size:14px}.leg-top strong{font-size:16px}#legExplain{font-size:10px}.available-die>small{display:none}.race-banner h2{font-size:16px}#diceRemain{font-size:10px;padding:6px 8px}.bet-card .camel-art{width:56px;height:40px}}
@media(max-width:950px){.race-grid{grid-template-columns:minmax(0,1fr) 170px}.players-panel>#players{display:flex;gap:8px}.players-panel .player-chip{flex-shrink:0}#track.track{aspect-ratio:1.6}.race-board-foot{flex-wrap:wrap}.leg-dashboard{grid-template-columns:1fr 1fr}}
@media(max-width:650px){#track.track{aspect-ratio:1.28;min-height:0}.track-shell{border-radius:18px}#track .camel-piece{width:12.5%;aspect-ratio:1.4}#track .cell{font-size:9px}#track .cell>span{min-width:2.3em}.race-brand{font-size:8px;top:6%;letter-spacing:1px}.start-pointer{left:16%;font-size:8px;bottom:1.8%}.home-stretch{right:15%;font-size:8px;bottom:1.8%}#finishGate{width:18%;top:77%;height:16%}#finishGate strong{font-size:11px;border-width:1px}#finishGate small{font-size:6px;margin-top:4px;letter-spacing:.5px}#track .dice-stage .die{width:29px;height:29px}#track .dice-stage>span{font-size:8px;padding:2px 3px;margin-top:7px;line-height:1.4}#track .desert-note{left:9%;font-size:5px;letter-spacing:.2px}#track .desert-note b{font-size:6px}#track .pyramid{width:40%;left:8%;top:19%}#track .support-token{font-size:9px;min-width:24px;padding:2px 3px}#track .route-arrow{font-size:16px}#track .track-piske{width:24%;right:0;bottom:18%}.leg-dashboard{margin-top:9px;border-radius:13px;grid-template-columns:1fr 1.03fr}.leg-block,.race-block{padding:9px 8px}.leg-top>b{font-size:13px}.leg-top strong{font-size:15px}.leg-top small{font-size:8px}#legPips{gap:4px}.leg-dashboard #legPips>span{width:20px;height:21px;font-size:10px}#legExplain{font-size:9px;min-height:25px}#raceDistance{font-size:10px}.race-block>small{font-size:9px}#diceTray{gap:4px}.available-die>i{width:19px;height:19px;font-size:11px;border-radius:5px}.available-die>small{display:none}.race-board-foot{font-size:9px;gap:3px;padding:8px 3px 0}.race-banner{padding:10px}.race-banner h2{font-size:15px;line-height:1.4}#diceRemain{font-size:9px;padding:6px;white-space:normal;max-width:105px}.action-tabs button{font-size:10px}.bet-card{min-height:106px;padding-top:18px}.bet-card .camel-art{width:46px;height:35px}.bet-card strong{font-size:18px}.bet-card span{font-size:8px}.bet-card small{font-size:8px}.guide-essential{grid-template-columns:1fr}.guide-essential p{font-size:12px}#localControls .smallbtn{font-size:10px;padding:6px 8px}.local-note{font-size:9px}.race-center{overflow:visible}}
.low-motion .race-progress i{transition:none}.low-motion #track .cell.legal{animation:none}
/* Keep the approved sunset-fairground scenery around the live model track. */
#track.track{background-image:url('./assets/track-model.svg'),url('./assets/race-environment.webp');background-position:center;background-size:100% 100%;background-repeat:no-repeat}
#track .race-brand{top:4%;left:31%;right:31%;padding:4px 5px;border:1px solid #fff0c18c;border-radius:12px;background:#fff2ccba;box-shadow:0 3px 6px #8b592326}
@media(min-width:1150px){#track.track{aspect-ratio:auto;height:clamp(340px,43vh,570px)}.race-banner{padding:9px 14px}.leg-block,.race-block{padding:8px 12px}.leg-dashboard{margin-top:8px}.leg-dashboard #legPips>span{height:20px;width:22px}.leg-dashboard #legPips{margin:4px 0}.action-panel{padding:10px 12px;margin-top:10px}.action-panel .bet-card{min-height:98px}.action-panel .bet-card .camel-art{width:59px;height:40px}.action-panel .bet-card strong{font-size:18px}.action-panel .roll-btn{min-height:43px;margin-top:8px}.room-heading{padding:10px 15px}.room-heading h1{font-size:25px}#localControls{margin-top:5px}.topbar{padding-top:9px;padding-bottom:9px}}

.rankings .rank-row{width:100%;border:0;border-bottom:1px solid #dcc09d40;background:transparent;text-align:left;cursor:pointer;color:inherit;font-family:inherit}.rankings .rank-row:hover{background:#e5d0ae50}.rankings .rank-row:focus-visible{outline:2px solid #bb7890;outline-offset:1px;border-radius:7px}
