/* 慢慢遊戲大廳｜功能結構。宿主視覺請到 index_style.css。 */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0}
a{color:inherit}
button{font:inherit;cursor:pointer}
button,a{-webkit-tap-highlight-color:transparent}
[hidden]{display:none!important}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.ambient{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.page{position:relative;isolation:isolate;min-height:100svh}
main,.site-footer{position:relative;z-index:1}
.wrap{width:min(100%,1200px);margin-inline:auto;padding-inline:clamp(18px,4vw,48px)}
.spotlight{position:relative;display:flex;align-items:center;justify-content:center;isolation:isolate}
.stage-fx,.stage-meta{pointer-events:none}
.stage-fx{position:absolute;inset:0;overflow:hidden}
.feature-card{position:relative;z-index:2;display:flex;flex-direction:column;min-width:0}
.card-topline,.game-tile-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.card-visual,.tile-art{display:grid;place-items:center;position:relative}
.card-body{display:flex;flex-direction:column;min-height:0}
.showcase-controls{display:flex;justify-content:center;align-items:center;gap:10px}
.hand-row{display:flex;justify-content:center;align-items:flex-end;gap:0;overflow-x:auto;overflow-y:visible;scrollbar-width:none}
.hand-row::-webkit-scrollbar{display:none}
.stage-nav,.game-hand{position:relative}
.stage-tab,.game-tile{position:relative;flex:none;transform-origin:50% 110%;z-index:var(--fan-z,1);transform:translateY(var(--fan-rise,0px)) rotate(var(--fan-rotate,0deg));transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease,filter .25s ease}
.stage-tab{padding:0;border:0;background:transparent}
.game-tile{display:flex;flex-direction:column;align-items:stretch;text-align:left}
.chips{display:flex;gap:8px;overflow-x:auto;max-width:100%;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.empty,.load-status,.site-footer{text-align:center}
@media(max-width:720px){
  .wrap{padding-inline:16px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* 可滑動的扇形手牌：原生觸控水平捲動，視窗負責裁切並保留牌角空間。 */
.hand-carousel{position:relative;min-width:0}
.hand-viewport{
  position:relative;
  overflow-x:auto;
  overflow-y:hidden;
  width:100%;
  padding:42px 34px 38px;
  scroll-snap-type:x proximity;
  overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x pan-y;
  scrollbar-width:none;
}
.hand-viewport::-webkit-scrollbar{display:none}
.game-hand{
  display:flex;
  justify-content:center;
  align-items:flex-end;
  width:max-content;
  min-width:100%;
  overflow:visible;
  scroll-snap-type:none;
}
.game-tile{scroll-snap-align:center}
.hand-arrow{
  position:absolute;
  top:50%;
  z-index:350;
  transform:translateY(-50%);
  display:grid;
  place-items:center;
  padding:0;
  width:34px;
  height:56px;
  border:0;
  background:transparent;
  cursor:pointer;
}
.hand-arrow--prev{left:0}
.hand-arrow--next{right:0}

/* 上方五張牌維持原本固定扇形，左右箭頭只控制切換，不建立滑動容器。 */
.stage-hand-controls{display:flex;align-items:center;justify-content:center;gap:8px;min-width:0}
.stage-hand-controls .stage-nav{min-width:0;flex:0 1 auto}
.stage-hand-controls .stage-hand-arrow{position:static;transform:none;flex:none}
