/* ===== Design tokens (紅金主題) ===== */
:root{
  --red:#c8102e;
  --red-deep:#8e0b20;
  --red-soft:#e23b4e;
  --gold-1:#f7d774;
  --gold-2:#e0a92e;
  --gold-deep:#b67c1a;
  --gold-grad:linear-gradient(180deg,#f7d774,#e0a92e);
  --red-grad:linear-gradient(120deg,#a30d24 0%,#c8102e 55%,#e23b4e 100%);
  --page-grad:linear-gradient(180deg,#fbeedd 0%,#f6e1c8 100%);
  --ink:#3a2415;
  --muted:#9a7b5a;
  --card:#fffaf2;
  --footer:#5e1f22;
  --radius:14px;
  --shadow:0 6px 20px rgba(120,40,20,.14);
  --sidebar-w:220px;
  --header-h:96px;
}

*{box-sizing:border-box;margin:0;padding:0;}
body{
  font-family:"Microsoft JhengHei","PingFang TC","Segoe UI",sans-serif;
  color:var(--ink);
  background:var(--page-grad);
  min-height:100vh;
}
a{text-decoration:none;color:inherit;}

/* ===== Header ===== */
.header{
  position:sticky;top:0;z-index:50;
  height:var(--header-h);
  background:var(--red-grad);
  box-shadow:0 2px 16px rgba(120,10,30,.35);
  border-bottom:2px solid var(--gold-2);
}
.header__inner{
  max-width:1400px;margin:0 auto;height:100%;
  padding:0 32px;display:flex;align-items:center;justify-content:space-between;
}
/* 漢堡按鈕（手機顯示） */
.hamburger{
  display:none;background:none;border:none;cursor:pointer;
  flex-direction:column;gap:5px;padding:6px;margin-right:4px;
}
.hamburger span{display:block;width:24px;height:3px;border-radius:3px;background:#ffe8b0;transition:.25s;}
.hamburger.open span:nth-child(1){transform:translateY(8px) rotate(45deg);}
.hamburger.open span:nth-child(2){opacity:0;}
.hamburger.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg);}

.logo{display:flex;align-items:center;gap:12px;color:#fff;}
.logo__mark{display:flex;align-items:center;}
.logo__mark svg{display:block;}
.logo__img{width:50px;height:50px;display:block;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3));}
.logo__img{width:50px;height:50px;object-fit:contain;display:block;
  filter:drop-shadow(0 2px 5px rgba(0,0,0,.35));}
.logo__text strong{
  display:block;font-size:30px;letter-spacing:2px;line-height:1;
  background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.logo__text em{font-style:normal;font-size:13px;letter-spacing:3px;color:#ffe8b0;}
.header__actions{display:flex;align-items:center;gap:14px;}

.btn{
  cursor:pointer;border:none;border-radius:10px;
  padding:10px 26px;font-size:15px;font-weight:700;
}
.btn--ghost{
  background:transparent;color:#ffe8b0;
  border:1.5px solid var(--gold-1);
  transition:.2s;
}
.btn--ghost:hover{background:var(--gold-grad);color:var(--red-deep);}

.lang{
  position:relative;
  display:flex;align-items:center;gap:8px;color:#ffe8b0;cursor:pointer;
  border:1.5px solid var(--gold-1);border-radius:10px;
  padding:9px 16px;font-size:14px;user-select:none;
}
.lang.open svg{transform:rotate(180deg);}
.lang svg{transition:.2s;}
.lang svg path{stroke:#ffe8b0;}
.lang__menu{
  position:absolute;top:calc(100% + 8px);right:0;z-index:60;
  list-style:none;margin:0;padding:6px;min-width:140px;
  background:var(--card);border:1px solid var(--gold-2);border-radius:10px;
  box-shadow:0 8px 24px rgba(120,40,20,.25);
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:.18s;
}
.lang.open .lang__menu{opacity:1;visibility:visible;transform:translateY(0);}
.lang__menu li{
  padding:10px 14px;border-radius:7px;color:var(--ink);font-size:14px;
}
.lang__menu li:hover{background:#fbeede;color:var(--red);}
.lang__menu li.is-active{background:var(--red);color:#ffe8b0;font-weight:700;}

/* ===== Layout ===== */
.layout{max-width:1400px;margin:0 auto;display:flex;gap:24px;padding:24px 32px;align-items:flex-start;}

/* ===== Sidebar ===== */
.sidebar{
  width:var(--sidebar-w);flex:0 0 var(--sidebar-w);
  position:sticky;top:calc(var(--header-h) + 24px);
}
.menu{
  background:var(--card);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:8px;border:1px solid #f0dcbf;
}
.menu__item{
  display:flex;align-items:center;gap:12px;
  padding:15px 16px;border-radius:10px;
  font-size:16px;font-weight:600;color:var(--ink);
  transition:.18s;
}
.menu__item + .menu__item{border-top:1px solid #f2e4cf;}
.menu__icon{font-size:20px;width:26px;text-align:center;}
.menu__item:hover{background:#fbeede;color:var(--red);}
.menu__item.is-active{color:var(--red);background:#fbeede;}

.vip{
  margin-top:16px;display:flex;align-items:center;gap:10px;
  background:var(--gold-grad);color:#7a3b00;
  padding:16px 18px;border-radius:var(--radius);
  font-size:18px;font-weight:800;
  box-shadow:0 6px 16px rgba(224,154,46,.5);
  border:1px solid #fff2cf;
}
.vip__crown{font-size:20px;}
.vip__arrow{margin-left:auto;background:rgba(255,255,255,.5);
  width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:13px;}

/* ===== Main ===== */
.main{flex:1;min-width:0;display:flex;flex-direction:column;gap:24px;}
.panel{
  background:var(--card);border-radius:18px;
  box-shadow:var(--shadow);padding:30px 34px;border:1px solid #f0dcbf;
}
.section-title{
  text-align:center;font-size:34px;letter-spacing:2px;font-weight:800;
  background:linear-gradient(180deg,#f7d774,#c8102e);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  margin-bottom:6px;
}
.section-sub{text-align:center;color:var(--muted);margin-bottom:24px;}

/* ===== Hot games ===== */
.hot{background:linear-gradient(180deg,#fff4e2,#fffaf2);}
.tabs{display:flex;justify-content:center;gap:6px;margin:18px auto 24px;
  background:#f3e3c8;border-radius:30px;padding:5px;width:max-content;}
.tab{
  cursor:pointer;border:none;background:transparent;
  padding:9px 22px;border-radius:30px;font-size:16px;font-weight:700;color:var(--muted);
  transition:.18s;
}
.tab.is-active{background:var(--red);color:#ffe8b0;box-shadow:0 4px 10px rgba(200,16,46,.4);}

.carousel{position:relative;display:flex;align-items:center;}
.carousel__track{
  display:flex;gap:16px;overflow-x:auto;scroll-behavior:smooth;
  padding:6px 4px;scrollbar-width:none;
}
.carousel__track::-webkit-scrollbar{display:none;}
.game-card{
  position:relative;flex:0 0 200px;border-radius:14px;overflow:hidden;
  box-shadow:0 4px 14px rgba(120,40,20,.25);background:#fff;
  border:2px solid var(--gold-2);
}
.game-card__art{
  height:200px;overflow:hidden;
}
.game-card__art img{
  width:100%;height:100%;display:block;object-fit:cover;
  transition:transform .3s ease;
}
.game-card:hover .game-card__art img{transform:scale(1.06);}
.game-card figcaption{padding:12px;text-align:center;font-weight:700;background:#fffaf2;}
.game-card__rank{
  position:absolute;top:0;left:0;z-index:2;
  background:var(--gold-grad);color:var(--red-deep);
  font-size:22px;font-weight:800;line-height:1;
  padding:8px 12px 14px;border-bottom-right-radius:14px;
  display:flex;flex-direction:column;align-items:center;
}
.game-card__rank small{font-size:9px;letter-spacing:1px;}
.carousel__arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:42px;height:42px;border-radius:50%;border:none;cursor:pointer;
  background:var(--red);color:#ffe8b0;font-size:24px;
  box-shadow:0 4px 12px rgba(200,16,46,.5);
}
.carousel__arrow--prev{left:-14px;}
.carousel__arrow--next{right:-14px;}

/* ===== App download ===== */
.app{background:linear-gradient(180deg,#fff4e2,#fffaf2);}
.app__body{display:flex;gap:30px;align-items:center;flex-wrap:wrap;}
.app__visual{
  position:relative;flex:0 0 320px;height:300px;
  display:grid;place-items:center;
  background:radial-gradient(circle at center,#f7e0bd,transparent 70%);
  border-radius:18px;
}
.app__phones{font-size:90px;}
.app__watermark{
  position:absolute;bottom:30px;left:0;right:0;text-align:center;
  font-size:36px;font-weight:800;color:rgba(200,16,46,.25);letter-spacing:4px;
}
.app__info{flex:1;min-width:320px;}
.app__tabs{display:flex;gap:0;margin-bottom:22px;background:#f3e3c8;border-radius:30px;padding:5px;width:max-content;}
.pill{cursor:pointer;border:none;background:transparent;padding:11px 30px;border-radius:30px;font-weight:700;color:var(--muted);}
.pill.is-active{background:var(--red);color:#ffe8b0;}
.app__headline{display:flex;align-items:center;gap:14px;margin-bottom:16px;}
.app__logo{font-size:44px;}
.app__headline h3{color:var(--red);font-size:26px;}
.app__headline p{color:var(--ink);font-size:15px;}
.app__qr{
  margin-left:auto;width:90px;height:90px;border-radius:8px;
  background:
    repeating-linear-gradient(0deg,#222 0 6px,#fff 6px 12px),
    repeating-linear-gradient(90deg,#222 0 6px,#fff 6px 12px);
  background-blend-mode:difference;border:4px solid #fff;box-shadow:var(--shadow);
}
.app__desc{color:var(--ink);line-height:1.9;margin-bottom:16px;}
.app__note{background:#fbeede;border-radius:12px;padding:16px 18px;color:var(--muted);line-height:1.9;}
.app__note a{color:var(--red);font-weight:700;}

/* ===== Service ===== */
@property --gp{syntax:'<percentage>';inherits:false;initial-value:0%;}
.service{background:linear-gradient(180deg,#fbeede,#fffaf2);}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:30px;}
.stat{text-align:center;}
.gauge{
  width:140px;height:140px;border-radius:50%;margin:0 auto 14px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:conic-gradient(var(--red) var(--gp,0%), #f0dcbf 0);
  transition:--gp 1.6s cubic-bezier(.2,.7,.3,1);
  position:relative;
}
.gauge::after{content:"";position:absolute;inset:13px;border-radius:50%;background:#fffaf2;}
.gauge__num{position:relative;z-index:1;font-size:44px;font-weight:800;color:var(--red);line-height:1;}
.gauge__unit{position:relative;z-index:1;font-size:14px;color:var(--muted);margin-top:3px;}
.stat strong{display:block;font-size:18px;margin-top:4px;}
.stat em{font-style:normal;font-size:11px;color:var(--muted);letter-spacing:.5px;}

.features{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.feature{
  display:flex;gap:18px;align-items:flex-start;
  background:linear-gradient(180deg,#fffdf8,#fff6ea);border-radius:16px;
  padding:26px 24px;box-shadow:0 6px 18px rgba(120,40,20,.08);
  border:1px solid #f1e1c6;transition:.2s;
}
.feature:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(120,40,20,.16);border-color:var(--gold-2);}
.feature__icon{
  flex:0 0 auto;width:68px;height:68px;
  display:grid;place-items:center;font-size:34px;
}
.feature__icon img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(120,40,20,.28));}
.feature h4{color:var(--red);font-size:19px;margin-bottom:10px;font-weight:800;letter-spacing:.5px;}
.feature p{color:#6b5644;line-height:1.95;font-size:14px;}

/* ===== Footer ===== */
.footer{
  background:linear-gradient(180deg,#5e1f22,#491519);
  border-radius:18px;color:#e8cfb4;padding:36px 34px 0;text-align:center;
  border:1px solid var(--gold-deep);overflow:hidden;
}
.footer__brand{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:18px;}
.footer__logo{width:42px;height:42px;object-fit:contain;}
.footer__brand span{
  font-size:24px;font-weight:900;letter-spacing:1px;
  background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.footer__links{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-bottom:18px;font-size:14px;}
.footer__links a{color:#e8cfb4;transition:.15s;}
.footer__links a:hover{color:var(--gold-1);}
.footer__links span{opacity:.4;}
.footer__time{font-size:13px;margin-bottom:18px;color:#c9ad92;}
.footer__design{font-size:13px;color:#c9ad92;margin-bottom:14px;}
.footer__design a{color:var(--gold-1);font-weight:700;}
.footer__design a:hover{text-decoration:underline;}
.footer__copy{font-size:13px;opacity:.9;background:rgba(0,0,0,.22);margin:0 -34px;padding:16px;color:#c9ad92;}

/* ===== Floating widget ===== */
.floating{
  position:fixed;right:18px;bottom:120px;z-index:40;
  width:90px;height:90px;border-radius:50%;
  background:var(--gold-grad);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  color:var(--red-deep);font-size:30px;box-shadow:0 8px 20px rgba(224,154,46,.55);cursor:pointer;
  border:2px solid #fff2cf;
}
.floating span{font-size:10px;font-weight:800;line-height:1.1;text-align:center;}

/* ===== Hero Banner ===== */
.hero{
  position:relative;border-radius:18px;overflow:hidden;
  box-shadow:var(--shadow);
}
.hero__img{display:block;width:100%;height:auto;}
.hero__overlay{
  position:absolute;top:0;left:0;bottom:0;
  display:flex;flex-direction:column;justify-content:center;
  padding:0 6%;max-width:55%;
}
.hero__title{
  font-size:clamp(20px,3vw,38px);font-weight:900;color:#fff;
  text-shadow:0 2px 10px rgba(0,0,0,.45);margin-bottom:10px;line-height:1.2;
}
.hero__sub{
  font-size:clamp(12px,1.4vw,17px);color:#ffe8b0;
  text-shadow:0 1px 6px rgba(0,0,0,.5);margin-bottom:16px;
}
.hero__cta{
  align-self:flex-start;cursor:pointer;border:none;
  background:var(--gold-grad);color:var(--red-deep);
  font-weight:800;font-size:clamp(13px,1.3vw,16px);
  padding:10px 28px;border-radius:30px;
  box-shadow:0 6px 16px rgba(224,154,46,.5);transition:.18s;
}
.hero__cta:hover{transform:translateY(-2px);filter:brightness(1.05);}

/* ===== 分類大卡 ===== */
.lobby-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.cat-tile{
  position:relative;display:block;border-radius:16px;overflow:hidden;
  border:2px solid var(--gold-2);box-shadow:0 6px 18px rgba(120,40,20,.25);
  aspect-ratio:2 / 1;background:#1a1208;
}
.cat-tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease;}
.cat-tile:hover img{transform:scale(1.05);}
.cat-tile::after{
  content:"";position:absolute;inset:0;border-radius:14px;
  box-shadow:inset 0 0 0 0 rgba(247,215,116,0);transition:.25s;
}
.cat-tile:hover::after{box-shadow:inset 0 0 30px 4px rgba(247,215,116,.45);}
@keyframes catpulse{0%{box-shadow:0 0 0 0 rgba(247,215,116,.9);}100%{box-shadow:0 0 0 18px rgba(247,215,116,0);}}
.cat-tile.pulse{animation:catpulse .7s ease-out;}

/* ===== 熱門遊戲格 ===== */
.game-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));gap:18px;
}
.g-tile{
  position:relative;display:block;border-radius:16px;overflow:hidden;
  aspect-ratio:1/1;background:#7f0a1d;border:2px solid var(--gold-2);
  box-shadow:0 6px 16px rgba(120,40,20,.25);
  animation:tileIn .55s cubic-bezier(.2,.7,.3,1) both;
}
.g-tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease;}
.g-tile::after{
  content:"";position:absolute;inset:0;border-radius:14px;pointer-events:none;
  box-shadow:inset 0 0 0 0 rgba(247,215,116,0);transition:.25s;
}
.g-tile:hover{transform:translateY(-5px);}
.g-tile:hover img{transform:scale(1.08);}
.g-tile:hover::after{box-shadow:inset 0 0 26px 3px rgba(247,215,116,.55);}
.g-tile:nth-child(1){animation-delay:.05s}
.g-tile:nth-child(2){animation-delay:.13s}
.g-tile:nth-child(3){animation-delay:.21s}
.g-tile:nth-child(4){animation-delay:.29s}
.g-tile:nth-child(5){animation-delay:.37s}
@keyframes tileIn{from{opacity:0;transform:translateY(20px) scale(.95);}to{opacity:1;transform:none;}}

/* ===== 圖片素材接點 ===== */
.app__phone-img{width:100%;max-width:340px;height:auto;display:block;margin:0 auto;
  filter:drop-shadow(0 12px 24px rgba(120,40,20,.3));}
.app__logo{width:60px;height:60px;display:inline-grid;place-items:center;}
.app__logo img{width:100%;height:100%;object-fit:contain;}
.floating--img{background:none;box-shadow:none;border:none;width:96px;height:96px;}
.floating--img img{width:100%;height:100%;object-fit:contain;
  filter:drop-shadow(0 6px 14px rgba(0,0,0,.35));}

/* ===== 廣告跑馬燈 ===== */
.marquee{
  display:flex;align-items:center;gap:12px;
  background:linear-gradient(90deg,#7f0a1d,#c8102e);
  border:1px solid var(--gold-2);border-radius:12px;
  padding:11px 16px;color:#ffe8b0;overflow:hidden;box-shadow:var(--shadow);
}
.marquee__icon{font-size:18px;flex:0 0 auto;}
.marquee__viewport{flex:1;overflow:hidden;}
.marquee__track{
  display:inline-block;white-space:nowrap;font-weight:600;
  padding-left:100%;animation:marquee 28s linear infinite;
}
@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-100%);}}
.marquee:hover .marquee__track{animation-play-state:paused;}

/* ===== 遊戲介紹 ===== */
.intro{display:flex;flex-direction:column;gap:24px;}
.intro-row{
  display:flex;align-items:center;gap:34px;
  background:var(--card);border:1px solid #f0dcbf;border-radius:18px;
  box-shadow:var(--shadow);padding:30px 36px;
}
.intro-row--reverse{flex-direction:row-reverse;}
.intro-row__img{flex:0 0 40%;max-width:430px;}
.intro-row__img img{
  width:100%;border-radius:14px;display:block;
  box-shadow:0 6px 18px rgba(120,40,20,.25);border:2px solid var(--gold-2);
}
.intro-row__text{flex:1;min-width:0;}
.intro-row__title{display:flex;align-items:baseline;gap:12px;margin-bottom:16px;}
.intro-row__title span{font-size:30px;font-weight:900;color:var(--red);}
.intro-row__title em{font-style:normal;font-size:28px;font-weight:900;color:#e7d2b4;letter-spacing:2px;}
.intro-row__text p{color:var(--ink);line-height:2;margin-bottom:22px;font-size:15px;}
.intro-row__btn{
  display:inline-block;cursor:pointer;
  background:var(--gold-grad);color:var(--red-deep);font-weight:800;
  padding:11px 32px;border-radius:30px;box-shadow:0 5px 14px rgba(224,154,46,.45);transition:.18s;
}
.intro-row__btn:hover{transform:translateY(-2px);filter:brightness(1.05);}

/* ===== 手機遊戲大廳（桌面隱藏，手機顯示）===== */
.m-hall{display:none;}
.m-utils{
  display:flex;justify-content:space-around;align-items:center;
  background:var(--card);border:1px solid #f0dcbf;border-radius:14px;
  padding:10px 4px;margin-bottom:12px;box-shadow:var(--shadow);
}
.m-util{display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--ink);font-size:12px;flex:1;}
.m-util span{font-size:22px;}
.m-util i{font-style:normal;}
.m-hall__tabs{
  display:flex;gap:18px;align-items:center;
  padding:0 6px 10px;border-bottom:1px solid #f0dcbf;margin-bottom:12px;
}
.m-tab{
  background:none;border:none;cursor:pointer;position:relative;
  font-size:17px;font-weight:700;color:var(--muted);padding:6px 2px;
}
.m-tab.is-active{color:var(--red);}
.m-tab.is-active::after{
  content:"";position:absolute;left:50%;bottom:-11px;transform:translateX(-50%);
  width:24px;height:3px;border-radius:3px;background:var(--red);
}
.m-hall__body{display:flex;gap:10px;}
.m-rail{flex:0 0 60px;display:flex;flex-direction:column;gap:8px;}
.m-rail__item{
  display:flex;flex-direction:column;align-items:center;gap:3px;cursor:pointer;
  background:var(--card);border:1px solid #f0dcbf;border-radius:12px;
  padding:10px 2px;font-size:12px;color:var(--ink);transition:.15s;
}
.m-rail__item i{font-style:normal;}
.m-rail__ic{font-size:20px;}
.m-rail__item.is-active{background:var(--red);color:#ffe8b0;border-color:var(--red);}
.m-grid{flex:1;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;min-width:0;}
.m-game{display:flex;flex-direction:column;align-items:center;gap:6px;}
.m-game img{
  width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:16px;
  border:2px solid var(--gold-2);box-shadow:0 3px 10px rgba(120,40,20,.2);
}
.m-game span{font-size:13px;font-weight:600;color:var(--ink);text-align:center;line-height:1.2;}

/* ===== 抽屜遮罩 ===== */
.backdrop{
  display:none;position:fixed;inset:0;z-index:45;
  background:rgba(40,10,10,.5);opacity:0;transition:opacity .25s;
}
.backdrop.show{display:block;opacity:1;}

/* ===== 手機底部導覽列 ===== */
.bottom-nav{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:46;
  height:62px;background:var(--red-deep);
  border-top:2px solid var(--gold-2);
  justify-content:space-around;align-items:center;
  padding-bottom:env(safe-area-inset-bottom);
}
.bottom-nav__item{
  display:flex;flex-direction:column;align-items:center;gap:3px;
  font-size:11px;color:#f3d9bf;flex:1;
}
.bottom-nav__item span{font-size:21px;}
.bottom-nav__item i{font-style:normal;}
.bottom-nav__item.is-active{color:var(--gold-1);}
.bottom-nav__center span{
  background:var(--gold-grad);color:var(--red-deep);
  width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  margin-top:-22px;border:3px solid var(--red-deep);box-shadow:0 4px 10px rgba(0,0,0,.3);
}

/* ===== Responsive ===== */
@media(max-width:1024px){
  :root{--header-h:64px;}
  .layout{padding:16px;display:block;}

  /* 手機改用遊戲大廳，側欄隱藏 */
  .sidebar{display:none;}

  .main{gap:16px;}
  .panel{padding:20px 16px;border-radius:14px;}
  .section-title{font-size:26px;}
  .stats{grid-template-columns:1fr 1fr;}
  .features{grid-template-columns:1fr;}
  .floating{width:64px;height:64px;font-size:22px;}
}

@media(max-width:640px){
  .header__inner{padding:0 14px;}
  .logo__mark svg{width:38px;height:38px;}
  .logo__text strong{font-size:21px;}
  .logo__text em{font-size:11px;letter-spacing:2px;}
  .btn--ghost{padding:8px 14px;font-size:13px;}
  .lang{padding:7px 10px;font-size:12px;}
  .header__actions{gap:8px;}

  .section-title{font-size:22px;}
  .logo__img{width:40px;height:40px;}
  .tabs{width:100%;overflow-x:auto;justify-content:flex-start;flex-wrap:nowrap;}
  .tab{padding:8px 16px;font-size:14px;white-space:nowrap;}

  /* 熱門遊戲格手機改 3 欄 */
  .game-grid{grid-template-columns:repeat(3,1fr);gap:10px;}
  .hero__overlay{max-width:62%;}

  /* 遊戲卡：手機一次顯示約 2.2 張，可滑動 */
  .game-card{flex-basis:44vw;max-width:180px;}
  .game-card__art{height:44vw;max-height:180px;}
  .carousel__arrow{display:none;}

  .app__body{flex-direction:column;}
  .app__visual{flex-basis:auto;width:100%;height:220px;}
  .app__phones{font-size:64px;}
  .app__info{min-width:0;}
  .app__tabs{width:100%;}
  .pill{flex:1;padding:10px 8px;font-size:13px;text-align:center;}
  .app__headline{flex-wrap:wrap;}
  .app__qr{display:none;}

  .stats{gap:10px;}
  .gauge{width:108px;height:108px;}
  .gauge__num{font-size:34px;}
  .gauge__unit{margin-bottom:24px;}
  .stat strong{font-size:15px;}

  .feature{padding:18px;}

  /* 遊戲介紹手機改直式堆疊 */
  .intro-row, .intro-row--reverse{flex-direction:column;gap:18px;padding:20px;text-align:center;}
  .intro-row__img{flex-basis:auto;width:100%;max-width:none;}
  .intro-row__title{justify-content:center;}
  .intro-row__title span,.intro-row__title em{font-size:24px;}
  .intro-row__text p{text-align:left;font-size:14px;line-height:1.9;}
  .marquee__track{animation-duration:18s;}

  .footer{padding:24px 16px;}
  .footer__copy{margin:16px -16px -24px;}
}

/* ===== 共用：頭部下拉選單 + 底部導覽 ===== */
.balchip{display:none;align-items:center;gap:8px;background:#ffffff22;border:1.5px solid var(--gold-1);
  border-radius:30px;padding:4px 14px 4px 4px;color:#ffe8b0;cursor:pointer;font-weight:800;}
.balchip img{width:30px;height:30px;border-radius:50%;object-fit:contain;background:#fff3;}
.balchip .amt{font-size:14px;font-style:italic;}
.hambtn{display:none;background:transparent;border:1.5px solid var(--gold-1);border-radius:10px;
  color:#ffe8b0;font-size:18px;padding:8px 14px;cursor:pointer;line-height:1;}

.hmenu{position:absolute;top:calc(100% + 8px);right:max(20px, calc((100vw - 1400px) / 2 + 32px));z-index:70;width:268px;
  background:var(--card);border:1px solid var(--gold-2);border-radius:14px;box-shadow:0 12px 30px rgba(120,40,20,.28);
  opacity:0;visibility:hidden;transform:translateY(-8px);transition:.18s;overflow:hidden;}
.hmenu.open{opacity:1;visibility:visible;transform:none;}
.hmenu__user{display:flex;align-items:center;gap:10px;padding:16px;background:var(--red-grad);color:#fff;}
.hmenu__user img{width:46px;height:46px;border-radius:12px;border:2px solid var(--gold-1);object-fit:contain;background:#fff2;flex:0 0 auto;}
.hmenu__user .nm{font-weight:900;font-size:15px;}
.hmenu__user .lv{font-size:11px;color:var(--gold-1);font-weight:800;margin-top:2px;}
.hmenu__user .id{font-size:10px;opacity:.85;margin-top:1px;}
.hmenu a{display:flex;align-items:center;gap:10px;padding:13px 16px;color:var(--ink);font-size:14px;font-weight:600;}
.hmenu a + a{border-top:1px solid #f2e4cf;}
.hmenu a:hover{background:#fbeede;color:var(--red);}
.hm-langs{display:flex;gap:6px;padding:10px 16px;border-top:1px solid #f2e4cf;}
.hm-langs button{flex:1;border:1px solid #e6d6bd;background:#fffdf9;border-radius:8px;padding:7px;font-weight:700;cursor:pointer;font-size:12px;}
.hm-langs button.is-active{background:var(--red);color:#fff;border-color:var(--red);}

.bnav{display:none;position:fixed;left:0;right:0;bottom:0;z-index:60;height:62px;
  background:var(--red-deep);border-top:2px solid var(--gold-2);
  justify-content:space-around;align-items:center;padding-bottom:env(safe-area-inset-bottom);}
.bnav a{display:flex;flex-direction:column;align-items:center;gap:3px;color:#f3d9bf;font-size:11px;flex:1;}
.bnav a span{font-size:21px;}
.bnav a img{width:24px;height:24px;object-fit:contain;}
.bnav a.center img{width:30px;height:30px;}
.hmenu a img{width:22px;height:22px;object-fit:contain;}
.bnav a.is-active{color:var(--gold-1);}
.bnav a.center span{background:var(--gold-grad);color:var(--red-deep);width:46px;height:46px;border-radius:50%;
  display:grid;place-items:center;margin-top:-22px;border:3px solid var(--red-deep);box-shadow:0 4px 10px rgba(0,0,0,.3);}

@media(max-width:1024px){
  .balchip{display:flex;}
  .bnav{display:flex;}
  body{padding-bottom:62px;}
  .hmenu{right:14px;left:14px;width:auto;}
}
@media(min-width:1025px){ .hambtn{display:inline-block;} }

/* ===== 互動微優化（統一質感，2026-07；對準現行類別）===== */
/* 按鈕：過場＋按壓下沉回饋 */
.btn{transition:transform .12s ease, box-shadow .18s ease, background .18s ease, color .18s ease, filter .18s ease;}
.btn:active{transform:translateY(1px);}
/* 遊戲格：已有 hover 浮起＋金光，補「按壓」觸控回饋 */
.g-tile{transition:transform .22s ease, box-shadow .22s ease;}
.g-tile:active{transform:translateY(-2px) scale(.98);}
.hero__cta:active{transform:translateY(0) scale(.97);}
/* 分頁/藥丸/選單過場一致 */
.tab,.pill,.menu__item,.lang__menu li,.hmenu a,.bene,.doc-list a{transition:.18s ease;}
.bene:hover{border-color:var(--gold-2);box-shadow:0 8px 18px rgba(120,40,20,.14);transform:translateY(-2px);}
/* 浮動客服球：hover 靈動 */
.floating{transition:transform .25s ease, box-shadow .25s ease;}
.floating:hover{transform:scale(1.07) rotate(-4deg);box-shadow:0 12px 30px rgba(224,154,46,.72);}
/* 底部導覽點按回饋 */
.bnav a{transition:color .15s ease, transform .1s ease;}
.bnav a:active{transform:scale(.9);}
/* 統一鍵盤聚焦環（可及性＋質感） */
.btn:focus-visible,.tab:focus-visible,.pill:focus-visible,a:focus-visible,
input:focus-visible,select:focus-visible,button:focus-visible{
  outline:2px solid var(--gold-1);outline-offset:2px;}
/* 尊重「減少動態」系統偏好 */
@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;transition-duration:.001ms!important;}}
