/* 游戏攻略页的主题皮（照 bug-evolution.wiki 这类排第一的 Roblox 小 wiki 做：游戏画风首屏 + 实时数据 + 结局卡片 + 侧栏速查）。
   站点通用组件仍用 style.css；这里只放 .gw-* 和按游戏换的颜色变量。新游戏页复制一份 <body class="gw"> 的结构，改 --g-* 即可。 */
.gw{--g-paper:#ececec;--g-ink:#262626;--g-red:#e53935;--g-red-dark:#b71c1c;--g-soft:#f6f6f6}
.gw main{background:var(--g-paper)}
.gw main a{color:var(--g-red-dark)}
.gw .crumb,.gw .crumb a{color:#5f5f5f}
/* 游戏子导航 */
.gw-nav{position:sticky;top:0;z-index:20;background:var(--g-ink);color:#fff}
.gw-nav .wrap{display:flex;align-items:center;gap:20px;height:52px;overflow-x:auto;scrollbar-width:none}
.gw-nav .wrap::-webkit-scrollbar{display:none}
.gw-nav b{flex:none;display:flex;align-items:center;gap:8px;white-space:nowrap;font-size:15px}
.gw-nav b img{width:28px;height:28px;border:1px solid #fff}
.gw-nav a{color:#ddd;text-decoration:none;font-size:14px;font-weight:600;white-space:nowrap}
.gw-nav a:hover{color:#fff}
.gw-nav .play{margin-left:auto;background:var(--g-red);color:#fff;padding:6px 14px}
.gw-nav .play:hover{background:var(--g-red-dark)}
/* 首屏 */
.gw-hero{padding:28px 0 44px}
.gw-hero .wrap{display:grid;grid-template-columns:1.05fr 1fr;gap:44px;align-items:center}
.gw-kick{display:inline-block;font:400 18px/1 "Bebas Neue",sans-serif;letter-spacing:1.5px;background:var(--g-red);color:#fff;padding:6px 10px 4px}
.gw-hero h1{font-size:54px;margin:16px 0 0;color:var(--g-ink)}
.gw-hero .lead{margin:16px 0 0;color:#3a3a3a}
.gw-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.gw .btn{border-color:var(--g-ink);box-shadow:3px 3px 0 var(--g-ink)}
.gw .btn.red{background:var(--g-red);color:#fff}
@media (hover:hover){.gw .btn.red:hover{background:var(--g-red-dark);color:#fff}}
.gw-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:28px}
.gw-stats div{background:#fff;border:2px solid var(--g-ink);padding:10px 12px}
.gw-stats b{display:block;font:400 30px/1 "Bebas Neue",sans-serif;letter-spacing:.5px;color:var(--g-ink);font-variant-numeric:tabular-nums}
.gw-stats span{font-size:12px;color:#5f5f5f;font-weight:600}
.gw-stats .live b::after{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#2e7d32;margin-left:6px;vertical-align:6px}
.gw-asof{font-size:12px;color:#6b6b6b;margin:8px 0 0}
/* 电视机框：游戏里所有画面都在这台电视上播 */
.gw-tv{position:relative;border:6px solid var(--g-ink);background:#fff;margin-top:34px}
.gw-tv::before,.gw-tv::after{content:"";position:absolute;top:-38px;width:6px;height:40px;background:var(--g-ink)}
.gw-tv::before{left:42%;transform:rotate(-28deg)}.gw-tv::after{left:56%;transform:rotate(28deg)}
.gw-tv img{width:100%;aspect-ratio:16/9;object-fit:cover}
.gw-tick{display:flex;align-items:center;gap:10px;background:var(--g-red);color:#fff;font:400 22px/1 "Bebas Neue",sans-serif;letter-spacing:1px;padding:8px 12px 6px}
.gw-tick i{font-style:normal;font-size:30px;line-height:.8}
/* 快速答案 */
.gw-quick{background:#fff;border:2px solid var(--g-ink);border-left:10px solid var(--g-red);padding:18px 22px;max-width:860px}
.gw-quick p{margin:0;color:#333}.gw-quick p+p{margin-top:8px}
/* 结局卡片 */
.gw-sec{padding:56px 0;border-top:2px solid #d4d4d4}
.gw-sec h2{color:var(--g-ink)}
.gw-prog{display:flex;align-items:center;gap:14px;background:#fff;border:2px solid var(--g-ink);padding:12px 16px;margin-bottom:22px;position:sticky;top:52px;z-index:10}
.gw-prog b{white-space:nowrap}
.gw-prog .bar{flex:1;height:12px;border:2px solid var(--g-ink);background:var(--g-soft)}
.gw-prog .bar i{display:block;height:100%;width:0;background:var(--g-red);transition:width .25s}
#sc-count{font:400 24px/1 "Bebas Neue",sans-serif;letter-spacing:1px;color:var(--g-ink);font-variant-numeric:tabular-nums}
.sc-reset{border:1px solid #bbb;background:#fff;font:inherit;font-size:13px;padding:2px 10px;cursor:pointer;color:#555}
.sc-reset:hover{border-color:var(--g-ink);color:var(--g-ink)}
.gw-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:0;padding:0;list-style:none}
.gw-card{background:#fff;border:2px solid var(--g-ink);box-shadow:4px 4px 0 var(--g-ink);display:flex;flex-direction:column}
.gw-card .gw-tick{font-size:24px}
.gw-card .n{margin-left:auto;font-size:18px;opacity:.85}
.gw-card .bd{padding:12px 14px 6px;flex:1}
.gw-tag{display:inline-block;font-size:12px;font-weight:700;padding:1px 8px;border:1px solid var(--g-ink);margin-right:6px}
.gw-tag.q{background:#e8f5e9}.gw-tag.c{background:#fff3e0}.gw-tag.h{background:#ffebee;color:var(--g-red-dark);border-color:var(--g-red-dark)}
.gw-card p{margin:8px 0 0;color:#333;font-size:15px;line-height:1.5}
.gw-card .ft2{display:flex;align-items:center;gap:12px;padding:10px 14px;border-top:1px dashed #c8c8c8;font-size:14px;flex-wrap:wrap}
.gw-card label{display:flex;align-items:center;gap:6px;font-weight:700;cursor:pointer;color:var(--g-ink)}
.gw-card input{width:18px;height:18px;accent-color:var(--g-red)}
.gw-card a{color:var(--g-ink);font-weight:600}
.gw-card a.vid{margin-left:auto;color:var(--g-red-dark)}
.gw-card.done{opacity:.6}.gw-card.done .gw-tick{background:#5f5f5f}
/* 正文 + 侧栏 */
.gw-cols{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:40px;align-items:start}
.gw-side{position:sticky;top:120px;background:#fff;border:2px solid var(--g-ink)}
.gw-side .top{display:flex;gap:12px;align-items:center;padding:14px;border-bottom:2px solid var(--g-ink)}
.gw-side .top img{width:64px;height:64px;border:1px solid var(--g-ink)}
.gw-side .top b{font-size:16px;line-height:1.25;color:var(--g-ink)}
.gw-side dl{margin:0;padding:6px 14px 10px;font-size:14px}
.gw-side dt{color:#6b6b6b;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-top:10px}
.gw-side dd{margin:2px 0 0;color:#222}
.gw-side .btn{margin:4px 14px 16px;width:calc(100% - 28px)}
.gw-guide{background:#fff;border:2px solid var(--g-ink);padding:8px 28px 28px}
.gw-guide h2{margin:28px 0 12px}
.gw-guide h3{display:flex;align-items:center;gap:10px;margin:30px 0 8px;font-size:20px;scroll-margin-top:120px}
.gw-guide h3::before{content:"#";font:400 24px/1 "Bebas Neue",sans-serif;background:var(--g-red);color:#fff;padding:4px 7px 2px}
.gw-guide p,.gw-guide li{color:#333}
.gw-guide .w{font-size:14px;margin:4px 0 0}
.gw-guide .w a{color:var(--g-red-dark);font-weight:600}
.gw-shot{margin:22px 0;border:4px solid var(--g-ink)}
.gw-shot figcaption{font-size:13px;color:#555;padding:6px 10px;background:var(--g-soft);border-top:2px solid var(--g-ink)}
/* 视频：点了才加载 YouTube，首屏不背 iframe */
.gw-video{position:relative;width:100%;aspect-ratio:16/9;border:4px solid var(--g-ink);background:#000 center/cover no-repeat}
.gw-video button{position:absolute;inset:0;width:100%;border:0;background:none;cursor:pointer;padding:0}
.gw-video span{position:absolute;inset:0;margin:auto;width:84px;height:58px;background:var(--g-red);border-radius:14px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:28px}
.gw-video button:hover span{background:var(--g-red-dark)}
.gw-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.gw-chap{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 0;padding:0;list-style:none;font-size:13px}
.gw-chap button{border:1px solid var(--g-ink);background:#fff;padding:3px 9px;cursor:pointer;font:inherit;font-weight:600}
.gw-chap button:hover{background:var(--g-ink);color:#fff}
.gw .faq{background:#fff;border:2px solid var(--g-ink);padding:0 20px}
.gw .faq details:last-child{border-bottom:0}
.gw .faq summary::after{color:var(--g-red)}
.gw-log{margin:0;padding:0;list-style:none;font-size:14px;color:#333}
.gw-log li{padding:8px 0;border-bottom:1px dashed #c8c8c8}
.gw-log b{display:inline-block;min-width:96px}
@media (max-width:900px){
  .gw-hero .wrap,.gw-cols{grid-template-columns:1fr}
  .gw-side{position:static;order:-1}
  .gw-cards{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:600px){
  .gw-hero h1{font-size:38px}
  .gw-stats{grid-template-columns:repeat(2,1fr)}
  .gw-cards{grid-template-columns:1fr}
  .gw-guide{padding:4px 16px 20px}
  .gw-prog{top:52px}
  .gw-nav .wrap{padding:0 16px;gap:16px}
  .gw-nav b span,.gw-prog b{display:none}
}