/* five-dice · fullscreen — paired with fullscreen-fit.js (sets --fs-die, --fs-row, --fs-w, --fs-lw, --fs-rw, .fs-wide).
   Everything is scoped under html.pip-immersive, so normal play and leaving fullscreen are untouched. */
html.pip-immersive .fd{
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  overflow:hidden!important;padding-left:max(10px,env(safe-area-inset-left,0px));padding-right:max(10px,env(safe-area-inset-right,0px));
}
html.pip-immersive .fd > section{width:var(--fs-w,min(100%,520px));max-width:100%;margin-inline:auto;transform-origin:50% 0}
html.pip-immersive .fd > section{margin-block:auto}
html.pip-immersive .fd .fd-note{display:none}
html.pip-immersive .fd .fd-hud{padding:.1rem 0 .3rem}
html.pip-immersive .fd .fd-actions{margin:.45rem 0 .4rem}
html.pip-immersive .fd .fd-slot{margin:0 0 .35rem;min-height:44px}
html.pip-immersive .fd .fd-status{min-height:0}

/* dice scale with --fs-die (set by the fit script) */
html.pip-immersive .fd .fd-die{
  --s:var(--fs-die,44px);--half:calc(var(--fs-die,44px) / 2);max-width:none;height:calc(var(--fs-die,44px) * 1.9);
  perspective:calc(var(--fs-die,44px) * 8.6);
}
html.pip-immersive .fd .fd-hop{margin-top:calc(var(--fs-die,44px) * .27)}
html.pip-immersive .fd .fd-face{padding:calc(var(--fs-die,44px) * .136);border-radius:calc(var(--fs-die,44px) * .2)}
html.pip-immersive .fd .fd-pip{width:calc(var(--fs-die,44px) * .18);height:calc(var(--fs-die,44px) * .18)}
html.pip-immersive .fd .fd-f1 .fd-pip{width:calc(var(--fs-die,44px) * .27);height:calc(var(--fs-die,44px) * .27)}
html.pip-immersive .fd .fd-held-tag{font-size:calc(var(--fs-die,44px) * .15)}
html.pip-immersive .fd .fd-tray{padding:calc(var(--fs-die,44px) * .3) 6px 8px}

/* score pad rows follow --fs-row */
html.pip-immersive .fd .fd-card th,html.pip-immersive .fd .fd-card td{height:var(--fs-row,33px);font-size:clamp(10px,calc(var(--fs-row,33px) * .42),16px)}
html.pip-immersive .fd .fd-card thead th,html.pip-immersive .fd .fd-card .fd-total th,html.pip-immersive .fd .fd-card .fd-total td,
html.pip-immersive .fd .fd-card .fd-sub th,html.pip-immersive .fd .fd-card .fd-sub td{height:var(--fs-row,33px);font-size:clamp(10px,calc(var(--fs-row,33px) * .4),15px)}
html.pip-immersive .fd .fd-card tbody th{font-size:clamp(10px,calc(var(--fs-row,33px) * .4),15px)}
html.pip-immersive .fd .fd-card tbody th small{font-size:clamp(8px,calc(var(--fs-row,33px) * .28),11px)}
html.pip-immersive .fd .fd-pick{min-height:0}
html.pip-immersive .fd .fd-ai-pick{line-height:var(--fs-row,33px)}

/* landscape: dice + controls on the left, the score pad on the right */
html.pip-immersive .fd.fs-wide #fd-play{
  display:grid;width:calc(var(--fs-lw) + var(--fs-rw) + 16px);max-width:100%;
  grid-template-columns:var(--fs-lw) var(--fs-rw);column-gap:16px;grid-template-rows:auto auto auto auto 1fr;align-content:start;
}
html.pip-immersive .fd.fs-wide #fd-play > *{grid-column:1;min-width:0}
html.pip-immersive .fd.fs-wide #fd-play > .fd-pad{grid-column:2;grid-row:1 / -1;align-self:start}