/* 方块消除 / Block Clear —— 游戏分区专用样式表（V0.7）
   对标 stitch.css 的外部功能样式表：不进 lint 内联样式扫描；
   配色变量统一加 bc- 前缀，隔离于站点设计令牌（--text/--accent 等），避免串味顶栏/页脚。
   作用域限定 .bc-shell，不污染站点 chrome。 */

.bc-shell *{box-sizing:border-box;margin:0;padding:0}
/* 抵消站点全局 .panel 系列间距规则（其 specificity 0,2,0 高于 .bc-shell * 重置的 0,1,0，
   会导致面板间/面板内被偷偷加 16px）。在 .bc-shell 作用域内用 0,3,0 强制归零，
   间距统一改由栅格/ flex 的 gap 控制。 */
.bc-shell .panel + .panel{margin-top:0}
.bc-shell .panel > * + *{margin-top:0}
:root{
  --bc-panel:#2b1c40; --bc-panel2:#221434; --bc-line:#45336a;
  --bc-accent:#c9f24b; --bc-accent-deep:#86a81e;
  --bc-text:#f3eefb; --bc-dim:#a99ac6;
  --bc-c-I:#48cae4; --bc-c-O:#ffd670; --bc-c-T:#57cc99; --bc-c-S:#ff6f91;
  --bc-c-Z:#9d7bff; --bc-c-J:#ff9e40; --bc-c-L:#e9e9f2;
  --bc-font-display:ui-monospace,SFMono-Regular,Menlo,Consolas,'Liberation Mono',monospace;
  --bc-font-body:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Hiragino Sans GB','Microsoft YaHei','Noto Sans CJK SC',sans-serif;
}.bc-shell{
  font-family:var(--bc-font-body); color:var(--bc-text); min-height:100vh;
  display:flex; flex-direction:column; align-items:center; position:relative; overflow:hidden;
  background:
    radial-gradient(1100px 560px at 82% -10%, rgba(72,202,228,.12), transparent 60%),
    radial-gradient(900px 520px at 8% 108%, rgba(255,111,145,.10), transparent 60%),
    linear-gradient(180deg,#1c1229 0%,#170f22 55%,#221537 100%);
  background-attachment:fixed;
  -webkit-tap-highlight-color:transparent;
}.bc-shell #sky{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}.bc-shell .fp{position:absolute;top:-70px;opacity:.14;animation:drift linear infinite}.bc-shell .fp span{position:absolute;border-radius:2px;box-shadow:inset 0 -3px 0 rgba(0,0,0,.3)}
@keyframes drift{from{transform:translateY(-8vh) rotate(0)}to{transform:translateY(114vh) rotate(var(--spin))}}.bc-shell .wrap{position:relative;z-index:1;width:min(1060px,100%);padding:16px 14px 30px}.bc-shell .title{font-weight:900;font-size:clamp(30px,5vw,46px);letter-spacing:.12em;line-height:1.1;background:linear-gradient(90deg,var(--bc-c-I),var(--bc-c-T),var(--bc-c-S),var(--bc-c-Z),var(--bc-c-J),var(--bc-c-L));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;filter:drop-shadow(0 4px 0 rgba(0,0,0,.55));animation:titleGlow 2.6s ease-in-out infinite}.bc-shell .chip{font-family:var(--bc-font-display);font-size:10px;font-weight:700;padding:8px 10px;border:1px solid var(--bc-line);
  background:#1c1029;border-radius:6px;color:var(--bc-dim);letter-spacing:.12em}.bc-shell .chip b{color:var(--bc-accent)}
@keyframes blink{50%{opacity:.15}}@keyframes titleGlow{50%{filter:drop-shadow(0 0 14px rgba(201,242,75,.55))}}.bc-shell .cabinet{display:grid;grid-template-columns:190px minmax(280px,auto) 212px;gap:14px;justify-content:center;align-items:start;margin-top:14px}.bc-shell .side{display:flex;flex-direction:column;gap:10px}.bc-shell .panel{background:linear-gradient(180deg,var(--bc-panel),var(--bc-panel2));border:2px solid var(--bc-line);border-radius:10px;
  padding:10px 12px;box-shadow:0 6px 18px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.05)}.bc-shell .panel h3{font-size:11px;letter-spacing:.28em;color:var(--bc-accent);font-weight:700;display:flex;align-items:center;gap:7px;margin-bottom:9px}.bc-shell .panel h3::before{content:'';width:8px;height:8px;background:var(--bc-accent);box-shadow:0 0 8px rgba(201,242,75,.7)}.bc-shell .val{font-family:var(--bc-font-display);font-weight:700;font-size:15px;color:#fff;display:inline-block}.bc-shell .val.big{font-size:21px;color:var(--bc-accent)}.bc-shell .val.bump{animation:bump .25s}
@keyframes bump{40%{transform:scale(1.28);color:#fff}}.bc-shell .stat-row{display:flex;justify-content:space-between;align-items:baseline;padding:5px 0;border-bottom:1px dashed rgba(150,120,200,.3)}.bc-shell .stat-row:last-child{border-bottom:0}.bc-shell .stat-row .lb{font-size:12px;color:var(--bc-dim);letter-spacing:.15em}.bc-shell #hold, .bc-shell #next{display:block;width:100%;height:auto;image-rendering:pixelated}.bc-shell .btnrow{display:flex;flex-direction:column;gap:8px}.bc-shell .btn{font-family:var(--bc-font-body);font-weight:900;font-size:14px;letter-spacing:.12em;border:0;border-radius:9px;
  padding:10px 8px;cursor:pointer;background:var(--bc-accent);color:#202a06;
  box-shadow:0 4px 0 var(--bc-accent-deep),0 8px 14px rgba(0,0,0,.3);transition:transform .08s,box-shadow .08s,filter .15s}.bc-shell .btn:hover{filter:brightness(1.08)}.bc-shell .btn:active{transform:translateY(3px);box-shadow:0 1px 0 var(--bc-accent-deep)}.bc-shell .btn.ghost{background:#33254d;color:var(--bc-text);box-shadow:0 4px 0 #191026,0 8px 14px rgba(0,0,0,.25)}.bc-shell .btn.ghost:active{box-shadow:0 1px 0 #191026}.bc-shell .btn:disabled{opacity:.4;cursor:default;transform:none}.bc-shell .tglrow{display:flex;gap:6px;margin-top:8px}.bc-shell .tgl{flex:1;font-family:var(--bc-font-body);font-size:11px;font-weight:700;padding:7px 0;border-radius:8px;cursor:pointer;
  border:1px solid var(--bc-line);background:#1c1029;color:var(--bc-dim);transition:all .15s}.bc-shell .tgl.on{background:#2c3d16;border-color:#5d7a2a;color:#d3f77a}.bc-shell .tgl:not(.on){background:#3a1626;border-color:#6b2a44;color:#ff9db8}.bc-shell .screen-wrap{display:flex;flex-direction:column;align-items:center;gap:10px}.bc-shell .bezel{position:relative;padding:10px;border:2px solid var(--bc-line);border-radius:12px;
  background:linear-gradient(180deg,#342453,#1c102c);
  box-shadow:0 14px 40px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.07)}.bc-shell .bezel.glow{animation:gl .7s ease}
@keyframes gl{30%{box-shadow:0 0 44px rgba(201,242,75,.7),0 14px 40px rgba(0,0,0,.5)}}.bc-shell #board{display:block;height:min(66vh,608px);aspect-ratio:1/2;width:auto;background:#170e24;border-radius:4px}.bc-shell #board.shake{animation:shk .18s linear}
@keyframes shk{25%{transform:translate(-4px,2px)}50%{transform:translate(3px,-2px)}75%{transform:translate(-2px,1px)}}.bc-shell .scanlines{position:absolute;inset:10px;pointer-events:none;border-radius:4px;z-index:3;
  background:repeating-linear-gradient(0deg,rgba(255,255,255,.03) 0 1px,transparent 1px 3px),
             radial-gradient(ellipse at center,transparent 62%,rgba(0,0,0,.32) 100%)}.bc-shell #popLayer{position:absolute;inset:10px;pointer-events:none;overflow:hidden;z-index:4}.bc-shell .pop{position:absolute;font-family:var(--bc-font-display);font-weight:700;font-size:12px;color:#fff;white-space:nowrap;
  text-shadow:0 0 10px currentColor;animation:rise .95s ease-out forwards}.bc-shell .pop.big{font-size:16px;color:var(--bc-accent)}.bc-shell .pop.combo{color:var(--bc-c-S);font-size:10px}
@keyframes rise{from{transform:translateY(0);opacity:1}to{transform:translateY(-72px);opacity:0}}.bc-shell .overlay{position:absolute;inset:10px;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:14px;text-align:center;background:rgba(12,7,20,.86);backdrop-filter:blur(3px);border-radius:4px;padding:16px}.bc-shell .overlay.hidden{display:none}.bc-shell .ov-kicker{font-family:var(--bc-font-display);font-size:10px;color:var(--bc-dim);letter-spacing:.3em}.bc-shell .ov-title{font-family:var(--bc-font-display);font-weight:800;font-size:clamp(16px,3vw,22px);letter-spacing:.18em;color:var(--bc-accent);
  text-shadow:0 0 20px rgba(201,242,75,.5);line-height:1.6}.bc-shell .ov-cn{font-weight:900;font-size:clamp(26px,4vw,34px);letter-spacing:.15em}.bc-shell .ov-hint{font-size:12px;color:var(--bc-dim);line-height:1.9}.bc-shell .coin{font-family:var(--bc-font-display);font-size:11px;color:var(--bc-c-O)}.bc-shell .blink{animation:blink 1.1s steps(2) infinite}.bc-shell .ov-stats{display:grid;grid-template-columns:repeat(3,auto);gap:8px 22px}.bc-shell .ov-stats .lb{font-size:11px;color:var(--bc-dim);letter-spacing:.2em}.bc-shell .badge{display:inline-flex;align-items:center;justify-content:center;gap:4px;font-family:var(--bc-font-display);font-size:11px;color:#241a05;background:var(--bc-c-O);padding:6px 14px;border-radius:6px;
  box-shadow:0 0 18px rgba(255,214,112,.6);text-align:center;white-space:nowrap}.bc-shell .keys{display:grid;grid-template-columns:auto 1fr;gap:7px 10px;font-size:12px;color:var(--bc-dim);align-items:center}.bc-shell kbd{font-family:var(--bc-font-display);font-size:10px;background:#1c1029;border:1px solid var(--bc-line);border-bottom-width:3px;
  border-radius:5px;padding:4px 7px;color:#e4dcf7;white-space:nowrap}.bc-shell .next-strip{display:none;padding:8px}.bc-shell #nextStrip{display:block;width:min(210px,60vw);aspect-ratio:3/1;margin:0 auto}.bc-shell .touchpad{display:none;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:14px;user-select:none;width:100%}.bc-shell .tbtn{height:56px;border-radius:12px;border:2px solid var(--bc-line);background:#2b1c40;color:var(--bc-text);
  font-size:20px;box-shadow:0 4px 0 #150c20;touch-action:none;cursor:pointer;font-family:var(--bc-font-body);font-weight:900}.bc-shell .tbtn:active{transform:translateY(3px);box-shadow:none;background:#3b2a58}.bc-shell .tbtn.wide{grid-column:span 6;height:44px;font-size:14px;letter-spacing:.2em}

@media (pointer:coarse),(max-width:860px){.bc-shell .touchpad{display:grid}}
@media (max-width:940px){.bc-shell .cabinet{display:flex;flex-direction:column;align-items:center}.bc-shell .side{width:100%;max-width:520px;display:grid;grid-template-columns:1fr 1fr;align-items:stretch}.bc-shell .side .panel{min-width:0}.bc-shell .panel-keys{grid-column:span 2}.bc-shell .panel-next{display:none}.bc-shell .next-strip{display:block}.bc-shell #board{height:min(56vh,520px)}}

/* ── 手机端适配（≤560px）：棋盘最大化，固定元素压到最小，触屏键底部整条 ── */
@media (max-width:560px){
  /* 整页竖向铺满：站点页脚在游戏页隐藏，顶栏保留（用于导航），高度全部让给棋盘 */
  body{display:flex;flex-direction:column;height:100dvh;overflow:hidden}
  .footer{display:none}
  .topbar{flex:0 0 auto}
  .bc-shell{flex:1;min-height:0;overflow:hidden;justify-content:flex-start}
  .bc-shell .wrap{flex:1;min-height:0;display:flex;flex-direction:column;width:100%;padding:4px 8px 6px}
  /* 招牌压成一行小标题 */
  
  
  .bc-shell .title{font-size:clamp(19px,5.2vw,26px);letter-spacing:.04em}
  
  
  
  /* 机柜：状态行（上，极薄）+ 棋盘（中，占满）+ 触屏（下，整条） */
  .bc-shell .cabinet{display:flex;flex-direction:column;flex:1;min-height:0;gap:2px;margin-top:0}
  .bc-shell .side-l{display:flex;flex-direction:row;gap:5px;width:100%;max-width:100%}
  .bc-shell .side-r{display:none}
  .bc-shell .panel-hold,.bc-shell .panel-stats,.bc-shell .panel-keys,.bc-shell .panel-next,.bc-shell .next-strip{display:none}
  .bc-shell .panel-score{flex:1;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:6px;padding:2px 6px;min-width:0}
  .bc-shell .panel-score h3{display:none}
  .bc-shell .panel-score .val.big{font-size:18px;white-space:nowrap}
  .bc-shell .panel-score .stat-row{flex:0 1 auto;display:flex;flex-direction:column;align-items:flex-start;gap:0;min-width:0;border:0;padding:0}
  .bc-shell .panel-score .stat-row .lb{font-size:9px;color:var(--bc-dim);white-space:nowrap;opacity:.85;line-height:1}
  .bc-shell .panel-score .stat-row .val{font-size:14px;white-space:nowrap;color:var(--bc-text);line-height:1}
  .bc-shell .panel-system{flex:1.5;display:flex;flex-direction:column;gap:3px;padding:2px 6px}
  .bc-shell .panel-system h3{display:none}
  .bc-shell .panel{padding:2px 6px}
  .bc-shell .btnrow{flex-direction:row;flex-wrap:nowrap;gap:4px}
  .bc-shell .btn{flex:1;min-width:0;font-size:11px;padding:6px 3px}
  .bc-shell .tglrow{margin-top:0;gap:4px}
  .bc-shell .tgl{font-size:9px;padding:3px 0}
  /* 棋盘占满剩余高度（10×20 比例自动推导宽度） */
  .bc-shell .screen-wrap{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}
  .bc-shell .bezel{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:5px;width:100%;touch-action:none}
  .bc-shell #board{height:100%;width:auto;max-width:98vw;aspect-ratio:1/2;border-radius:3px}
  .bc-shell .scanlines{inset:5px}
  .bc-shell #popLayer{inset:5px}
  .bc-shell .overlay{inset:5px;padding:10px}
  .bc-shell .overlay .btn{flex:0 0 auto;min-height:40px;padding:10px 18px;width:auto;max-width:80%}
  .bc-shell .ov-title{font-size:clamp(14px,2.8vw,18px)}
  .bc-shell .ov-cn{font-size:clamp(22px,3.6vw,28px)}
  /* 触屏控制：底部整条单行七键，大按钮便于拇指操作（◀ ▼ ▶ ⟲ ⟳ ⤓ HOLD） */
  .bc-shell .touchpad{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-top:6px;width:100%;max-width:560px}
  .bc-shell .tbtn{height:54px;font-size:20px;border-radius:11px}
  .bc-shell #tpHD{background:var(--bc-accent);color:#202a06;border-color:var(--bc-accent-deep);box-shadow:0 4px 0 var(--bc-accent-deep)}
  .bc-shell .tbtn.wide{height:54px;font-size:12px;letter-spacing:.05em;grid-column:auto}
}
/* ── 超小屏（≤380px）再压紧一档 ── */
@media (max-width:380px){
  .bc-shell .title{font-size:18px;letter-spacing:.03em}
  .bc-shell .tbtn{height:48px;font-size:18px}
  .bc-shell .wrap{padding:4px 6px 5px}
}

/* ═══ 游戏切换卡片条 ═══ */
.bc-shell .bc-game-switch{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;margin-bottom:14px;width:100%;max-width:980px}
.bc-shell .bc-game-card{display:inline-flex;align-items:center;gap:7px;padding:9px 16px;border-radius:999px;background:var(--bc-panel);border:1.5px solid var(--bc-line);color:var(--bc-text);text-decoration:none;font-weight:700;font-size:13px;letter-spacing:.02em;transition:transform .15s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease;cursor:pointer}
.bc-shell .bc-game-card i{width:16px;height:16px;stroke-width:2}
.bc-shell .bc-game-card:hover:not(.soon):not(.on){border-color:var(--bc-accent);color:var(--bc-accent);transform:translateY(-1px)}
.bc-shell .bc-game-card.on:hover{color:#202a06;transform:translateY(-1px)}
.bc-shell .bc-game-card.on{background:var(--bc-accent);border-color:var(--bc-accent);color:#202a06;box-shadow:0 0 16px rgba(197,255,0,.35),0 4px 0 var(--bc-accent-deep)}
.bc-shell .bc-game-card.on:hover{transform:translateY(-1px)}
.bc-shell .bc-game-card.soon{opacity:.55;cursor:not-allowed}
.bc-shell .bc-game-meta{display:flex;align-items:center;gap:6px;margin-left:auto;font-weight:900;color:var(--bc-accent);font-size:14px}
.bc-shell .bc-game-meta .chip{background:transparent;border:1.5px dashed var(--bc-line);color:var(--bc-dim)}

/* 手机端：卡片条单行横向滚动，游戏名称按钮不再折行，隐藏最高分（面板里已有） */
@media (max-width:560px){
  .bc-shell .bc-game-switch{display:flex;flex-wrap:nowrap;justify-content:flex-start;gap:5px;margin-bottom:8px;max-width:100%;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch}
  .bc-shell .bc-game-switch::-webkit-scrollbar{display:none}
  .bc-shell .bc-game-card{flex:0 0 auto;justify-content:center;padding:5px 10px;font-size:11px;white-space:nowrap}
  .bc-shell .bc-game-card i{width:13px;height:13px;flex:0 0 auto}
  .bc-shell .bc-game-card span{white-space:nowrap}
  .bc-shell .bc-game-card.soon{padding:5px 9px;font-size:10px;letter-spacing:-.01em}
  .bc-shell .bc-game-meta{display:none}
}