/* Lancio leggibile a distanza, con il risultato presente fino al tiro successivo. */
#sound-toggle[aria-pressed="false"],#ambience-toggle[aria-pressed="false"]{opacity:.74}
#sound-toggle[aria-pressed="true"],#ambience-toggle[aria-pressed="true"]{background:#d8eef0;color:#14364b;border-color:#d8eef0}
@media(min-width:761px){.tabletop{grid-template-rows:minmax(0,1fr) 84px}}
.table-caption{gap:3px}
.last-throw{font-size:13px;min-height:49px;gap:12px}
.last-throw strong{gap:8px;font-size:20px}
.result-die{display:inline-flex;align-items:center;position:relative;filter:drop-shadow(0 4px 3px #0007)}
.result-die .fx-die{display:inline-grid;place-items:center;width:54px;height:54px;border-radius:13px;background:linear-gradient(150deg,#fffefa,#ebdfbf);border:2px solid #b98e40;box-shadow:0 4px 0 #8f6a33,inset 0 2px 0 #fff;vertical-align:middle}
.result-die svg{width:72%;height:72%;fill:#173c54}
.result-die small{position:absolute;right:-6px;bottom:-4px;display:grid;place-items:center;width:21px;height:21px;border-radius:50%;background:#ffcf60;color:#173047;font:900 12px/1 Nunito;border:1px solid #805a20}
.last-throw strong.rolling .result-die{animation:dice-tumble .2s ease-in-out infinite alternate}
.last-throw strong.rolling .result-die:nth-child(2){animation-delay:.08s}
@keyframes dice-tumble{from{transform:translateY(-7px) rotate(-12deg)}to{transform:translateY(4px) rotate(12deg)}}
#fx-confetti{position:fixed;inset:0;z-index:30;pointer-events:none}
@media(max-width:760px){.top #sound-toggle,.top #ambience-toggle{padding:0;width:42px;font-size:20px}.tabletop{grid-template-rows:36px minmax(0,1fr) 74px}.board-world .tabletop{grid-template-rows:minmax(0,1fr) 55px}.last-throw{font-size:10px;min-height:38px;gap:6px}.result-die .fx-die{width:35px;height:35px;border-radius:9px}.result-die small{width:16px;height:16px;font-size:10px}.last-throw strong{font-size:14px;gap:5px}}
@media(max-width:480px){.top{gap:2px}.top .logo{width:clamp(55px,calc(100vw - 304px),96px);height:42px}.top nav{gap:2px}.top #map-toggle,.top #sound-toggle,.top #ambience-toggle,.top #quiet,.top #fullscreen{width:44px;min-width:44px;min-height:44px;padding:0}.top #map-toggle{font-size:0}.top #map-toggle::before{content:"▦";font-size:20px}}
@media(prefers-reduced-motion:reduce){.last-throw strong.rolling .result-die{animation:none}}
.logo-home{display:inline-flex;align-items:center;justify-content:center;flex:none;min-height:44px;border-radius:8px;text-decoration:none;cursor:pointer}
.logo-home:focus-visible{outline:3px solid #ffce62;outline-offset:3px}
/* The board fills its playable area; view switch and result stay directly below it. */
.one-die-note{border-top:1px solid #c5cbb8;padding:10px 0 12px;margin:0 0 9px;color:#385969;font-size:12px;font-weight:800}
.view-control{display:flex;align-items:center;justify-content:center;min-height:40px}
.view-control .view-angle{min-height:40px;min-width:150px;touch-action:manipulation}
.view-control .view-angle:focus-visible{outline:4px solid #ffce62;outline-offset:2px}
@media(min-width:761px){
  body[data-view="board"] .app{padding-inline:clamp(8px,1vw,22px)}
  .board-layout{grid-template-columns:minmax(0,1fr) clamp(280px,22vw,360px);gap:clamp(8px,1vw,18px)}
  .tabletop{grid-template-rows:minmax(0,1fr) 42px 42px}
  .board-world .tabletop{grid-template-rows:minmax(0,1fr) 40px 44px}
  .table-caption{justify-content:center;gap:clamp(8px,1.4vw,24px)}
}
@media(max-width:760px){
  body[data-view="board"] .board-zone{min-height:clamp(205px,38dvh,410px)}
  .tabletop,.board-world .tabletop{grid-template-rows:minmax(0,1fr) 44px 48px}
  .table-toolbar{display:none}
  .view-control .view-angle{min-height:44px;min-width:145px}
  .table-caption{min-width:0;gap:2px}
}
@media(max-width:760px) and (max-height:740px){body[data-view="board"] .board-zone{min-height:215px}}
.tabletop>.scene-host{grid-row:1}
.tabletop>.view-control{grid-row:2}
.tabletop>.table-caption{grid-row:3}

body[data-view="board"] .app{max-width:none;min-height:0}
@media(max-width:760px){
  .board-world .view-control{display:none}
  .board-world .tabletop{grid-template-rows:minmax(0,1fr) 48px}
  .board-world .table-caption{grid-row:2}
}

/* Keep the persistent die below the artwork, centered under the board. */
@media(min-width:1101px){
  body[data-view="board"] .tabletop{grid-template-rows:minmax(0,1fr) 42px 68px}
  body[data-view="board"] .table-caption{position:relative;justify-content:center}
  body[data-view="board"] .position-caption{position:absolute;left:clamp(6px,1vw,18px);top:50%;transform:translateY(-50%)}
  body[data-view="board"] .last-throw{margin-inline:auto}
}
@media(max-width:1100px){
  body[data-view="board"] .table-caption{flex-wrap:wrap;white-space:normal}
  body[data-view="board"] .last-throw{margin-inline:auto}
}

/* A six-faced die flies in the action area, away from the board artwork. */
.dice-flight{display:flex;align-items:center;gap:15px;min-height:116px}
.dice-flight p{margin:0;font-weight:850}
.flight-dice{display:flex;align-items:center;justify-content:center;gap:8px;min-width:74px;perspective:560px}
.flight-die{--die-size:58px;--die-half:29px;display:block;position:relative;width:var(--die-size);height:var(--die-size);flex:none;transform-style:preserve-3d;animation:die-flight 1250ms cubic-bezier(.25,.12,.24,1) var(--die-delay) both}
.flight-die:after{content:"";position:absolute;left:10%;right:10%;bottom:-22px;height:12px;border-radius:50%;background:#26394b66;filter:blur(5px);animation:die-shadow 1250ms ease-out var(--die-delay) both}
.flight-cube{position:absolute;inset:0;transform-style:preserve-3d;animation:die-turn 1250ms cubic-bezier(.23,.3,.24,1) var(--die-delay) both}
.flight-face{position:absolute;inset:0;display:grid;place-items:center;backface-visibility:hidden;background:#fff7e4;border:2px solid #b88b46;border-radius:10px;box-shadow:inset 0 2px 0 #fff,0 2px 4px #0003}
.flight-face .fx-die{display:grid;place-items:center;width:100%;height:100%;border:0;background:none;box-shadow:none}
.flight-face svg{width:76%;height:76%;fill:#183c52}
.flight-face--front{transform:translateZ(var(--die-half))}
.flight-face--back{transform:rotateY(180deg) translateZ(var(--die-half))}
.flight-face--right{transform:rotateY(90deg) translateZ(var(--die-half))}
.flight-face--left{transform:rotateY(-90deg) translateZ(var(--die-half))}
.flight-face--top{transform:rotateX(90deg) translateZ(var(--die-half))}
.flight-face--bottom{transform:rotateX(-90deg) translateZ(var(--die-half))}
@keyframes die-flight{0%{transform:translateY(22px) scale(.85)}35%{transform:translateY(-42px) scale(1.08)}65%{transform:translateY(-51px) scale(1.08)}85%{transform:translateY(-18px)}100%{transform:translateY(0) scale(1)}}
@keyframes die-turn{0%{transform:rotateX(-30deg) rotateY(15deg)}24%{transform:rotateX(215deg) rotateY(160deg)}48%{transform:rotateX(425deg) rotateY(320deg)}72%{transform:rotateX(610deg) rotateY(560deg)}100%{transform:rotateX(calc(720deg + var(--land-x))) rotateY(calc(720deg + var(--land-y)))}}
@keyframes die-shadow{0%{opacity:.75;transform:scale(1)}45%{opacity:.2;transform:scale(.55)}100%{opacity:.7;transform:scale(1)}}
@media(max-width:760px){
  .dice-flight{min-height:82px;gap:10px}
  .flight-die{--die-size:46px;--die-half:23px}
  .flight-die:after{bottom:-13px}
  .flight-dice{min-width:56px}
  .dice-flight p{font-size:12px}
  @keyframes die-flight{0%{transform:translateY(10px) scale(.88)}35%{transform:translateY(-21px)}65%{transform:translateY(-25px)}100%{transform:translateY(0) scale(1)}}
}
@media(prefers-reduced-motion:reduce){.flight-die,.flight-cube,.flight-die:after{animation:none!important}}
.quiet-mode .flight-die,.quiet-mode .flight-cube,.quiet-mode .flight-die:after{animation:none!important}