/* 20260914 幸運拉霸（璀璨果寶）頁面樣式。
   取代 20260910 那版三軸機台的 slot.css（已移到 backup/A_幸運拉霸_20260914/）。

   相容性：遊戲登入器是 IE11。
   不用 CSS 自訂變數當唯一來源（顏色寫字面值）、不用 grid、不用 filter、不用 conic-gradient。
   站台 CSP 沒有開 style-src 'unsafe-inline'，所以樣板裡**不能有 style="" 屬性**，
   需要動態切換的狀態一律換 class（見 slotgame.js）。 */

/* ---------- 導覽列入口 ---------- */
.navslot{
  margin-left:10px; padding:4px 10px; border-radius:3px;
  font-size:13px; font-weight:700; letter-spacing:.1em; white-space:nowrap;
  color:#F2C462;
  border:1px solid #B98523;
  background:rgba(242,196,98,.08);
}
.navslot:hover{background:rgba(242,196,98,.18); text-decoration:none;}
/* 20261004 RUSH 試玩入口：形狀同拉霸入口，顏色換成紫色區分 */
.navrush{
  margin-left:10px; padding:4px 10px; border-radius:3px;
  font-size:13px; font-weight:700; letter-spacing:.1em; white-space:nowrap;
  color:#D9B8FF; border:1px solid #8E5BD6; background:rgba(160,110,240,.10);
}
.navrush:hover{background:rgba(160,110,240,.22); text-decoration:none;}

/* ---------- 版面 ---------- */
.slotpanel .slot-rule{font-size:12px; letter-spacing:.04em; margin-left:auto;}

.slotwrap{
  margin:0 auto;
  max-width:980px;
}

/* 機台：canvas 用原生比例縮放，IE11 沒有 object-fit，所以靠 width/height:auto */
.slotstage{
  position:relative;
  margin:0 auto 14px;
  background:#0b1a14;
  border:2px solid #B98523;
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 10px 28px rgba(0,0,0,.45);
}
.slotstage canvas{
  display:block;
  width:100%;
  height:auto;
  max-width:100%;
}

/* 舊 IE 內嵌視窗：大面板用純色避免繪製層閃白；Canvas 清空／重設尺寸時保留底圖。 */
body.ie-stable .slotpanel{background:#2c0c13;box-shadow:none;}
body.ie-stable .slotpanel .panel-head{background:#3a1119;}
body.ie-stable .slotstage{box-shadow:none;}
body.ie-stable .slotstage canvas{
  background:#0b1a14 url(/static/slot/art/background.jpg) no-repeat center center;
  background-size:100% 100%;
}

/* 載入中遮罩 */
.slot-loading{
  position:absolute; left:0; top:0; right:0; bottom:0;
  background:rgba(8,20,15,.88);
  color:#F2C462;
  font-size:15px; font-weight:700; letter-spacing:.08em;
  text-align:center;
  padding-top:22%;
}
.slot-loading.hidden{display:none;}

/* ---------- 數值列 ---------- */
.slot-stats{
  display:flex;
  flex-wrap:wrap;
  margin:0 0 12px;
}
.slot-stat{
  flex:1 1 120px;
  margin:0 6px 8px;
  padding:8px 10px;
  border:1px solid #2c4a3c;
  border-radius:6px;
  background:rgba(255,255,255,.03);
  text-align:center;
}
.slot-stat .k{
  display:block;
  font-size:11px; letter-spacing:.12em;
  color:#8fa79a;
  margin-bottom:3px;
}
.slot-stat .v{
  display:block;
  font-size:22px; font-weight:700;
  color:#F2C462;
}
.slot-stat.win .v{color:#8fa79a;}
.slot-stat.win.on .v{color:#7ee0a8;}

/* ---------- 控制列 ---------- */
.slot-controls{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  margin:0 0 10px;
}
.slot-controls > *{margin:0 5px 8px;}

.slot-btn{
  padding:9px 16px;
  border:1px solid #B98523;
  border-radius:6px;
  background:rgba(242,196,98,.10);
  color:#F2C462;
  font-size:14px; font-weight:700;
  cursor:pointer;
}
.slot-btn:hover:enabled{background:rgba(242,196,98,.2);}
.slot-btn:disabled{opacity:.4; cursor:default;}
.slot-btn.main{
  padding:11px 34px;
  font-size:17px; letter-spacing:.14em;
  color:#22160a;
  border-color:#E8C877;
  background:#E0B35A;
}
.slot-btn.main:hover:enabled{background:#EFC877;}
.slot-btn.small{padding:6px 11px; font-size:13px;}

.slot-betbox{
  display:inline-block;
  padding:4px 6px;
  border:1px solid #2c4a3c;
  border-radius:6px;
  background:rgba(255,255,255,.03);
  white-space:nowrap;
}
.slot-betbox .k{
  font-size:11px; letter-spacing:.12em; color:#8fa79a;
  margin:0 6px 0 4px;
}
.slot-betbox .v{
  display:inline-block;
  min-width:44px;
  font-size:16px; font-weight:700; color:#F2C462;
  text-align:center;
}

/* ---------- 提示 ---------- */
.slot-notice{display:none;}
.slot-notice.on{
  display:block;
  margin:0 0 10px;
  padding:8px 12px;
  border:1px solid #8a3a3a;
  border-radius:6px;
  background:rgba(180,60,60,.12);
  color:#f0b7b7;
  font-size:13px;
  text-align:center;
}

/* 展示模式說明 */
.slot-demo{
  margin:0 0 12px;
  padding:8px 12px;
  border-left:3px solid #B98523;
  background:rgba(242,196,98,.06);
  color:#cdbf9a;
  font-size:13px;
  line-height:1.7;
}

/* 沒有 JavaScript 或太舊的瀏覽器 */
.slot-fallback{
  margin:10px 0 0;
  padding:10px 12px;
  border:1px dashed #2c4a3c;
  border-radius:6px;
  color:#8fa79a;
  font-size:13px;
}

/* ---------- 遊戲登入器小視窗（寬度 520 以下） ---------- */
@media (max-width:520px){
  .slot-stat{flex:1 1 90px; margin:0 3px 6px; padding:6px 6px;}
  .slot-stat .v{font-size:18px;}
  .slot-controls > *{margin:0 3px 6px;}
  .slot-btn{padding:8px 12px; font-size:13px;}
  .slot-btn.main{padding:10px 24px; font-size:15px;}
  .slot-demo{font-size:12px;}
}