/* Page-scoped palette: every surface follows the site's night class. */
body.blindbox-demo{--bb-bg:#f4f6f9;--bb-panel:#fff;--bb-soft:#f8fafc;--bb-text:#26344a;--bb-muted:#63738a;--bb-line:#e1e7ef;--bb-accent:#3979df;--bb-tint:#edf3fd;--bb-card:#fff;--bb-deck:#e0eafb;background:var(--bb-bg);color:var(--bb-text)}
body.night.blindbox-demo{--bb-bg:#1d2025;--bb-panel:#272c33;--bb-soft:#2c323b;--bb-text:#e1e7f0;--bb-muted:#a7b3c3;--bb-line:#3d4653;--bb-accent:#8db7f5;--bb-tint:#303e54;--bb-card:#34445c;--bb-deck:#2d3b51}
body.blindbox-demo .site-header{background:var(--bb-panel);border-color:var(--bb-line);box-shadow:0 2px 8px rgba(28,43,65,.04);backdrop-filter:none;-webkit-backdrop-filter:none}
body.night.blindbox-demo .site-header{background:var(--bb-panel)}
body.blindbox-demo .site-header .layui-nav .layui-nav-item a,body.blindbox-demo .site-header .night-open,body.blindbox-demo .site-header .search-open,body.blindbox-demo .site-header .user-open a,body.blindbox-demo .site-header .menu{color:var(--bb-text)}
body.blindbox-demo .site-header .layui-nav .layui-nav-item a:hover{color:var(--bb-accent)}
body.blindbox-demo .site-header .layui-nav .layui-nav-item:after{background:var(--bb-accent)}
body.blindbox-demo .blindbox-page{background:var(--bb-bg)}
body.blindbox-demo .blindbox-page:before{display:none}
body.blindbox-demo .blindbox-stage,body.blindbox-demo .blindbox-page.has-result .blindbox-stage{width:1200px;max-width:calc(100% - 48px);min-height:0;padding:48px 0;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:64px}
body.blindbox-demo .picker-intro{max-width:480px;color:var(--bb-text)}
body.blindbox-demo .system-status{border-color:var(--bb-line);background:var(--bb-panel);color:var(--bb-muted);font-size:12px;box-shadow:none}
body.blindbox-demo .system-status>b{background:var(--bb-tint);color:var(--bb-accent)}
body.blindbox-demo .picker-kicker{color:var(--bb-accent);font-size:14px;letter-spacing:.04em}
body.blindbox-demo .picker-intro h1{color:var(--bb-text);font-size:48px;letter-spacing:-.025em;line-height:1.22}
body.blindbox-demo .picker-copy{color:var(--bb-muted);font-size:18px}
body.blindbox-demo .picker-note{color:var(--bb-muted);font-size:13px}
body.blindbox-demo .picker-note i{color:var(--bb-accent)}
body.blindbox-demo .picker-controls{margin-top:28px;border-color:var(--bb-line);background:var(--bb-panel);box-shadow:none}
body.blindbox-demo .control-field{border-color:var(--bb-line)}
body.blindbox-demo .control-field>span,body.blindbox-demo .switch-control strong{color:var(--bb-text);font-size:15px}
body.blindbox-demo .switch-control small{color:var(--bb-muted);font-size:13px}
body.blindbox-demo .control-field select{border-color:var(--bb-line);background:var(--bb-soft);color:var(--bb-text);font-size:14px}
body.blindbox-demo .control-field select:focus{border-color:var(--bb-accent);box-shadow:0 0 0 3px var(--bb-tint)}
body.blindbox-demo .switch-control>i{border-color:var(--bb-line);background:#b7c3d4}
body.blindbox-demo .switch-control input:checked+i{background:#3979df;border-color:#3979df}
body.blindbox-demo .switch-control input:focus-visible+i{outline-color:var(--bb-accent)}
body.blindbox-demo .draw-button{height:66px;border-color:#3979df;background:#3979df;box-shadow:0 9px 20px -14px rgba(42,96,191,.65)}
body.blindbox-demo .draw-button:hover{background:#306ed0;box-shadow:0 12px 24px -16px rgba(42,96,191,.65);filter:none}
body.blindbox-demo .draw-button-copy small{font-size:12px;color:#e4edff}
body.blindbox-demo .pool-status{color:var(--bb-muted);font-size:13px}
body.blindbox-demo .reveal-placeholder,body.blindbox-demo .game-result{height:568px;min-height:568px;border-color:var(--bb-line);border-radius:20px;background:var(--bb-panel);box-shadow:0 16px 40px -28px rgba(37,57,90,.28)}
body.blindbox-demo .reveal-placeholder{grid-template-rows:46px 282px minmax(0,1fr)}
body.blindbox-demo .game-result{grid-template-rows:46px 244px minmax(0,1fr)}
body.blindbox-demo .result-hud{height:46px;border-color:var(--bb-line);background:var(--bb-panel);color:var(--bb-muted);font-size:12px;line-height:46px}
body.blindbox-demo .result-hud span{color:var(--bb-text)}
body.blindbox-demo .result-hud b{color:var(--bb-muted)}
body.blindbox-demo .placeholder-visual{border-color:var(--bb-line);background:var(--bb-soft)}
body.blindbox-demo .blindbox-deck>i{border-color:var(--bb-line);background:var(--bb-deck);box-shadow:0 10px 24px -18px rgba(39,70,121,.28)}
body.blindbox-demo .placeholder-core{border-color:var(--bb-line);background:var(--bb-card);box-shadow:0 14px 26px -20px rgba(39,70,121,.35)}
body.blindbox-demo .blindbox-mark{border-color:var(--bb-line);background:var(--bb-tint);color:var(--bb-accent);font-size:28px}
body.blindbox-demo .reveal-placeholder .placeholder-core strong{color:var(--bb-text);font-size:14px}
body.blindbox-demo .placeholder-visual>.reveal-code{color:var(--bb-muted);font-size:12px}
body.blindbox-demo .placeholder-content,body.blindbox-demo .game-result-content{background:var(--bb-panel);padding:22px 24px}
body.blindbox-demo .placeholder-meta{color:var(--bb-accent);font-size:12px}
body.blindbox-demo .placeholder-content h2,body.blindbox-demo .game-result h2{color:var(--bb-text);font-size:24px}
body.blindbox-demo .placeholder-content p,body.blindbox-demo .game-result p{color:var(--bb-muted);font-size:14px}
body.blindbox-demo .placeholder-actions span{border-color:var(--bb-line);background:var(--bb-soft);color:var(--bb-muted);font-size:12px}
body.blindbox-demo .placeholder-actions span i{color:var(--bb-accent)}
body.blindbox-demo .game-cover-wrap{border-color:var(--bb-line);background:var(--bb-soft)}
body.blindbox-demo .game-meta{color:var(--bb-muted);font-size:12px}
body.blindbox-demo .result-verdict{font-size:12px}
body.blindbox-demo .result-primary{background:#3979df;color:#fff;font-size:14px}
body.blindbox-demo .result-secondary{border-color:var(--bb-line);background:var(--bb-soft);color:var(--bb-text);font-size:14px}
body.blindbox-demo .result-secondary:hover{border-color:var(--bb-accent);background:var(--bb-tint)}
body.blindbox-demo .history-inner{width:1200px}
body.blindbox-demo .history-track{border-color:var(--bb-line);background:var(--bb-panel);box-shadow:none}
body.blindbox-demo .history-inner h2 span,body.blindbox-demo .history-item strong{color:var(--bb-text);font-size:14px}
body.blindbox-demo .history-inner h2 small,body.blindbox-demo .history-item small{color:var(--bb-muted);font-size:12px}
body.blindbox-demo .history-item{border-color:var(--bb-line);background:var(--bb-soft)}
body.blindbox-demo .history-item:hover{border-color:var(--bb-accent);background:var(--bb-tint)}
body.blindbox-demo .gaming-fatigue{padding:0 0 44px;border:0;background:var(--bb-bg);color:var(--bb-text)}
body.blindbox-demo .gaming-fatigue:before{display:none}
body.blindbox-demo .fatigue-inner{box-sizing:border-box;width:1200px;max-width:calc(100% - 48px);padding:32px;border:1px solid var(--bb-line);border-radius:20px;background:var(--bb-panel);grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:26px 42px}
body.blindbox-demo .fatigue-kicker{color:var(--bb-accent);font-size:13px}
body.blindbox-demo .fatigue-intro h2{color:var(--bb-text);font-size:27px}
body.blindbox-demo .fatigue-intro p{color:var(--bb-muted);font-size:14px}
body.blindbox-demo .fatigue-signs span{border-color:var(--bb-line);background:var(--bb-soft);color:var(--bb-muted);font-size:12px}
body.blindbox-demo .recovery-rule{padding:16px;border:1px solid var(--bb-line);border-radius:12px;background:var(--bb-tint);grid-template-columns:110px minmax(0,1fr);gap:14px}
body.blindbox-demo .recovery-rule strong{color:var(--bb-accent)}
body.blindbox-demo .recovery-rule span{color:var(--bb-text)}
body.blindbox-demo .recovery-list{gap:0 20px}
body.blindbox-demo .recovery-list li{grid-template-columns:25px minmax(0,1fr);gap:8px;border-color:var(--bb-line)}
body.blindbox-demo .recovery-list li>b{color:var(--bb-accent);font-size:14px}
body.blindbox-demo .recovery-list li strong{color:var(--bb-text);font-size:15px}
body.blindbox-demo .recovery-list li span{color:var(--bb-muted);font-size:13px}
body.blindbox-demo .fatigue-note{border-color:var(--bb-line);color:var(--bb-muted);font-size:13px}
body.blindbox-demo footer{background:var(--bb-panel);color:var(--bb-muted);border-top:1px solid var(--bb-line)}
body.blindbox-demo footer a{color:var(--bb-muted)}
body.blindbox-demo footer .container{width:1200px;max-width:calc(100% - 28px);box-sizing:border-box}
body.blindbox-demo .search-dialog-panel{background:var(--bb-panel)}
body.blindbox-demo .search-dialog-panel h2{color:var(--bb-text)}
body.blindbox-demo .search-dialog input{background:var(--bb-soft);border-color:var(--bb-line);color:var(--bb-text)}
body.blindbox-demo .search-dialog-close{color:var(--bb-muted)}
@media(min-width:801px) and (max-width:1240px){
 body.blindbox-demo .site-header .container{width:calc(100% - 32px);max-width:100%}
 body.blindbox-demo .site-header .menu{display:block;float:left;width:34px;height:70px;margin-left:16px;line-height:70px;border:0;background:transparent;cursor:pointer}
 body.blindbox-demo .site-header nav{display:none;position:absolute;top:70px;left:0;right:0;float:none;width:auto;background:var(--bb-panel);border-bottom:1px solid var(--bb-line)}
 body.blindbox-demo .site-header.nav-open nav{display:block}
 body.blindbox-demo .site-header.nav-open .layui-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:12px 16px;background:var(--bb-panel)}
 body.blindbox-demo .site-header .layui-nav .layui-nav-item{height:44px;line-height:44px}
 body.blindbox-demo .site-header .layui-nav .layui-nav-item a{padding:0 10px;font-size:13px}
}
@media(max-width:1000px){
 body.blindbox-demo .blindbox-stage,body.blindbox-demo .blindbox-page.has-result .blindbox-stage{width:720px;grid-template-columns:1fr;gap:30px;padding:34px 0}
 body.blindbox-demo .picker-intro{max-width:600px}
 body.blindbox-demo .fatigue-inner{width:720px;grid-template-columns:1fr;padding:26px;gap:28px}
 body.blindbox-demo .history-inner{width:720px;max-width:calc(100% - 48px)}
}
@media(max-width:800px){body.blindbox-demo .site-header nav,body.blindbox-demo .site-header .layui-nav .layui-nav-item{background:var(--bb-panel)}}
@media(max-width:480px){
 body.blindbox-demo .blindbox-stage,body.blindbox-demo .blindbox-page.has-result .blindbox-stage{max-width:calc(100% - 28px);padding:28px 0;gap:26px}
 body.blindbox-demo .picker-intro h1{font-size:36px}
 body.blindbox-demo .picker-copy{font-size:16px}
 body.blindbox-demo .picker-note{font-size:12px;justify-content:center;text-align:center}
 body.blindbox-demo .picker-controls{margin-top:22px}
 body.blindbox-demo .switch-control small{font-size:12px}
 body.blindbox-demo .reveal-placeholder,body.blindbox-demo .game-result{height:auto;min-height:0;border-radius:17px}
 body.blindbox-demo .reveal-placeholder{grid-template-rows:44px 248px auto}
 body.blindbox-demo .game-result{grid-template-rows:44px auto auto}
 body.blindbox-demo .game-cover-wrap{aspect-ratio:460/215}
 body.blindbox-demo .result-hud{height:44px;line-height:44px;font-size:11px}
 body.blindbox-demo .placeholder-content,body.blindbox-demo .game-result-content{padding:20px}
 body.blindbox-demo .placeholder-content h2,body.blindbox-demo .game-result h2{font-size:22px}
 body.blindbox-demo .placeholder-actions{padding-top:22px}
 body.blindbox-demo .history-inner,body.blindbox-demo .fatigue-inner{max-width:calc(100% - 28px)}
 body.blindbox-demo .fatigue-inner{padding:22px 18px;border-radius:17px}
 body.blindbox-demo .fatigue-intro h2{font-size:24px}
 body.blindbox-demo .recovery-rule{grid-template-columns:1fr;gap:7px}
 body.blindbox-demo .recovery-list{grid-template-columns:1fr}
}