/* Imposter Snack Party — 本游戏自己的样式(前缀 bfg-isp-)。共用组件在 static/bfg.css「GAME UI KIT」一段。
   一屏 = 顶栏(浅黄,只放信息)/ .bfg-isp-grow 信息区 / .bfg-isp-dock 拇指区。 */
.bfg-isp .bfg-ftop{background:var(--floor);border-bottom:2px solid var(--ink);padding-bottom:4px;min-height:58px}
.bfg-isp-mid{flex:1;min-width:0;display:grid;gap:7px;justify-items:start}
.bfg-isp-mid .bfg-kick{font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.bfg-isp-mc{--s:14px;display:inline-flex;gap:3px;padding:4px;background:var(--ink);border-radius:99px;transform:rotate(-3deg)}
.bfg-isp-mc:empty{display:none}
.bfg-isp-mc i{width:var(--s);height:var(--s);border-radius:50%;flex:none;background:var(--pc,#fff);box-sizing:border-box;transition:transform .3s var(--spring),opacity .2s}
.bfg-isp-mc i.r{background:var(--ink);border:3px solid var(--pc,#fff)}
.bfg-isp-mc i.w{opacity:.38}
.bfg-isp-mc i.on{transform:scale(1.4);box-shadow:0 0 0 2px var(--floor),0 0 0 4px var(--ink)}

.bfg-isp-grow{flex:1;min-height:0;overflow:hidden;padding:16px 16px 8px;display:flex;flex-direction:column;gap:10px;position:relative}
.bfg-isp-dock{flex:none;padding:12px 16px 14px;display:grid;gap:12px;position:relative;z-index:2}
.bfg-isp-dock:empty{display:none}
.bfg-isp-dock.mine,.bfg-isp-dock.verdict{background:var(--pers);border-top:2px solid var(--ink)}
.bfg-stage.bfg-v3 .bfg-isp-dock.mine .bfg-btn:not(.alt),.bfg-stage.bfg-v3 .bfg-isp-dock.verdict .bfg-btn:not(.alt){background:var(--ink);color:#fff;box-shadow:0 6px 0 rgba(23,21,20,.35)}
.bfg-stage.bfg-v3 .bfg-isp .bfg-btn:disabled{background:transparent;border-style:dashed;box-shadow:none;transform:translateY(6px);color:var(--mute);cursor:default}
.bfg-isp .bfg-btn{margin-bottom:6px}
.bfg-isp-q{font-weight:800;font-size:min(8.2vw,30px);font-size:min(8.2cqw,30px);line-height:1.05;letter-spacing:-.025em;margin:0}
.bfg-isp-q.big{font-size:min(9.6vw,36px);font-size:min(9.6cqw,36px)}
.bfg-isp-grow>p{font-size:16.5px;line-height:1.4}
.bfg-isp-grow .bfg-sd{color:var(--mute)}
.bfg-isp-wait{font:500 14px/1.5 var(--mono);margin:auto 0!important}

/* 圆点(名字前两个字母) */
.bfg-isp-pd{--d:36px;width:var(--d);height:var(--d);border-radius:50%;display:inline-grid;place-items:center;flex:none;font:600 calc(var(--d)*.34)/1 var(--mono);font-style:normal;letter-spacing:0;border:2px solid var(--ink);color:var(--ink);background:var(--pc,#fff);box-sizing:border-box;transition:transform .42s cubic-bezier(.3,1.7,.5,1),border-radius .25s,background .25s}
.bfg-isp-pd.r{color:#fff;background:var(--ink);box-shadow:inset 0 0 0 calc(var(--d)*.11) var(--pc,#fff)}

/* 偷看卡:盖子只在手指按着的时候掀开 */
.bfg-isp-peek{position:relative;height:168px;border:2px solid var(--ink);border-radius:22px;overflow:hidden;background:var(--tint);cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;outline-offset:3px}
.bfg-isp-peek .un{position:absolute;inset:0;display:grid;place-content:end center;justify-items:center;gap:4px;padding:0 10px 22px;text-align:center}
.bfg-isp-peek .un b{font:800 30px/1 var(--disp);font-variation-settings:var(--dv)}
.bfg-isp-peek .lid{position:absolute;inset:-2px;border-radius:20px;border:2px solid var(--ink);background:repeating-linear-gradient(-45deg,var(--pers) 0 14px,var(--floor) 14px 28px);display:grid;place-content:center;justify-items:center;gap:8px;transition:transform .14s ease-out;transform-origin:20% 0;pointer-events:none}
.bfg-isp-peek .lid b{font:800 26px/1 var(--disp);font-variation-settings:var(--dv);background:var(--wall);border:2px solid var(--ink);border-radius:99px;padding:9px 18px 10px}
.bfg-isp-peek .lid .bfg-an{background:var(--wall);padding:3px 8px;border-radius:5px;font-size:11px}
.bfg-isp-peek.open .lid{transform:translateY(-62%) rotate(-5deg)}
.bfg-isp-peek.open .lid>*{opacity:0}
.bfg-isp-peek.sm{height:48px;border-radius:14px;flex:1;min-width:0}
.bfg-isp-peek.sm .un{place-content:center;padding:0 8px}
.bfg-isp-peek.sm .un b{font-size:19px;white-space:nowrap}
.bfg-isp-peek.sm .lid{border-radius:12px}
.bfg-isp-peek.sm .lid b{font:600 12px/1 var(--mono);font-variation-settings:normal;letter-spacing:.08em;text-transform:uppercase;border:0;padding:5px 9px;border-radius:5px}
.bfg-isp-peek.sm.open .lid{transform:translateY(-110%)}

/* 线索列表:贴底,新的一行从下面滑进来 */
.bfg-isp-clues{list-style:none;margin:auto 0 0;padding:0;overflow-y:auto;max-height:100%;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.bfg-isp-clues li{display:flex;align-items:center;gap:10px;min-height:40px;border-bottom:1.5px dashed rgba(23,21,20,.3)}
.bfg-isp-clues .bfg-isp-pd{--d:26px;border-width:1.5px}
.bfg-isp-clues .nm{font:600 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;width:64px;flex:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bfg-isp-clues b{font:700 22px/1.05 var(--disp);font-variation-settings:var(--dv);overflow-wrap:anywhere;min-width:0}
.bfg-isp-clues li.rd{min-height:26px;border:0;font:600 11px/1 var(--mono);letter-spacing:.12em;color:var(--mute)}
.bfg-isp-clues li.new{animation:bfg-isp-rowin .32s cubic-bezier(.3,1.5,.5,1)}
@keyframes bfg-isp-rowin{from{opacity:0;transform:translateY(16px)}}
.bfg-isp-clues li.think{color:var(--mute);font:500 14px/1.2 var(--mono)}
.bfg-isp-clues li.think .bfg-isp-pd{animation:bfg-isp-bob 1s ease-in-out infinite}
@keyframes bfg-isp-bob{50%{transform:translateY(-4px)}}
.bfg-isp-in{display:flex;gap:8px}
.bfg-isp-inp{flex:1;width:100%;min-width:0;height:56px;border:2px solid var(--ink);border-radius:14px;background:var(--tint);padding:0 16px;font:600 19px var(--body);color:var(--ink);outline:0;-webkit-user-select:text;user-select:text;-webkit-appearance:none;appearance:none}
.bfg-isp-inp:focus{box-shadow:0 0 0 3px var(--cobalt)}
.bfg-isp-inp::placeholder{color:var(--mute);opacity:1;font-weight:500}
.bfg-fs .bfg-isp-in .bfg-btn{width:auto;min-width:84px;min-height:56px;padding:0 16px;margin:0 0 6px;flex:none}
.bfg-isp-meta{display:flex;align-items:center;gap:10px}
.bfg-isp-meta .ct{font:600 12px/1 var(--mono);flex:none;min-width:44px;text-align:right}
.bfg-isp-dock .err{color:#8E1B10;animation:bfg-nope .3s}
.bfg-isp-order{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-height:36px}
.bfg-isp-order .bfg-an{margin-right:4px}
.bfg-isp-order .bfg-isp-pd{--d:28px;border-width:1.5px}
.bfg-isp-order.many .bfg-isp-pd{--d:22px;font-size:0}
.bfg-isp-order .bfg-isp-pd.now{transform:scale(1.25);box-shadow:0 0 0 3px var(--pers)}
.bfg-isp-order .bfg-isp-pd.done{opacity:.35}
.bfg-isp-grow .bfg-isp-order{margin-top:6px}
.bfg-isp.kb .bfg-isp-dock{padding-bottom:8px}

/* 投票:先选再锁定 */
.bfg-isp-votes{display:grid;gap:8px 10px;grid-template-columns:1fr;margin-top:auto}
.bfg-isp-votes.two{grid-template-columns:1fr 1fr}
.bfg-isp-vt{display:flex;align-items:center;gap:10px;min-height:74px;padding:8px 12px;margin:0 0 5px;border:2px solid var(--ink);border-radius:16px;background:var(--tint);box-shadow:0 5px 0 var(--ink);text-align:left;font:inherit;color:inherit;cursor:pointer;transition:transform .1s,box-shadow .1s;min-width:0;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.bfg-isp-vt:active{transform:translateY(5px);box-shadow:0 0 0 var(--ink)}
.bfg-isp-vt.on{background:var(--ink);color:#fff;transform:translateY(5px);box-shadow:0 0 0 var(--ink)}
.bfg-isp-vt.on .bfg-isp-pd{border-color:#fff}
.bfg-isp-vt:disabled{cursor:default}
.bfg-isp-vt:disabled:not(.on){opacity:.45;box-shadow:none;transform:translateY(5px)}
.bfg-isp-vt>span{min-width:0;display:grid;gap:3px;pointer-events:none}
.bfg-isp-vt .bfg-isp-pd{pointer-events:none}
.bfg-isp-vt b{font:700 21px/1.05 var(--disp);font-variation-settings:var(--dv);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bfg-isp-vt small{font:500 13px/1.25 var(--mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bfg-isp-votes.two .bfg-isp-vt{min-height:60px;padding:6px 10px;gap:8px}
.bfg-isp-votes.two .bfg-isp-vt b{font-size:17px}
.bfg-isp-votes.two .bfg-isp-pd{--d:30px}
.bfg-isp-votes.two .bfg-isp-vt small{font-size:12px}
.bfg-isp-votes.many{gap:5px 8px}
.bfg-isp-votes.many .bfg-isp-vt{min-height:50px}

/* 招牌瞬间(变体 B):胶囊吐人 */
.bfg-isp-dock.verdict{transform:translateY(105%);transition:transform .38s cubic-bezier(.2,.9,.3,1)}
.bfg-isp-dock.verdict.show{transform:none}
.bfg-isp-dock.verdict p{font-size:17px;line-height:1.35}
.bfg-isp-flash{position:absolute;inset:0;background:var(--pers);opacity:0;pointer-events:none;z-index:5}
.bfg-isp-flash.go{animation:bfg-isp-flash .45s ease-out}
@keyframes bfg-isp-flash{15%{opacity:.85}100%{opacity:0}}
.bfg-isp-ej{margin:auto 0;display:flex;flex-direction:column;gap:6px}
.bfg-isp-rc{position:relative;display:inline-grid;grid-template-columns:repeat(var(--cols),var(--d));gap:var(--g);padding:var(--p);transform:rotate(-3deg);transform-origin:left center;align-self:flex-start;margin:92px 0 10px 4px;--up:calc(var(--d) + 30px)}
.bfg-isp-rc .bg{position:absolute;inset:0;background:var(--ink);border-radius:calc(var(--d)/2 + var(--p));transform-origin:left center;transition:transform .34s cubic-bezier(.3,1.5,.5,1)}
.bfg-isp-rc .bfg-isp-pd{position:relative;border-color:transparent}
.bfg-isp-rc.wig{animation:bfg-isp-wig .22s linear infinite}
@keyframes bfg-isp-wig{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(-4.6deg) translateY(2px)}}
.bfg-isp-rc .bfg-isp-pd.spot{transform:scale(1.2);box-shadow:0 0 0 4px var(--pers)}
.bfg-isp-rc .bfg-isp-pd.r.spot{box-shadow:inset 0 0 0 calc(var(--d)*.11) var(--pc,#fff),0 0 0 4px var(--pers)}
.bfg-isp-rc .bfg-isp-pd.half{transform:translateY(-18px) rotate(-8deg)}
.bfg-isp-rc .bfg-isp-pd.out{transform:translateY(calc(-1*(var(--up) + var(--row,0)*(var(--d) + var(--g))))) scale(1.2);border-color:var(--ink);z-index:2}
.bfg-isp-rc .bfg-isp-pd.sh{transform:translateX(calc(-1*(var(--d) + var(--g))))}
.bfg-isp-rc.shr .bg{transform:scaleX(var(--from))}
.bfg-isp-rc .bfg-isp-pd.sq{border-radius:18%;background:#F45D22;color:var(--ink);box-shadow:none;border-color:var(--ink);transform:rotate(16deg) scale(1.08)}
.bfg-isp-rc .bfg-isp-pd.sh.sq{transform:translateX(calc(-1*(var(--d) + var(--g)))) rotate(16deg) scale(1.08)}
.bfg-isp-rc .bfg-isp-pd.out.sq{transform:translateY(calc(-1*(var(--up) + var(--row,0)*(var(--d) + var(--g))))) scale(1.2) rotate(16deg)}
.bfg-isp-cp{min-height:20px;opacity:0;transition:opacity .25s}
.bfg-isp-cp.in{opacity:1}

/* 结果屏(BFG.result 里的 html 部分):两块零食牌 + 谁投了谁 */
.bfg-isp-r .bfg-res{justify-content:flex-start;overflow-y:auto;gap:9px;padding-top:12px;overscroll-behavior:contain}
.bfg-isp-r .bfg-rt,.bfg-isp-r .bfg-rt.m{font-size:min(8.6vw,32px);font-size:min(8.6cqw,32px);line-height:1.04}
.bfg-isp-r .bfg-vline{font-size:17px}
.bfg-isp-r .bfg-pline{display:none}
.bfg-isp-r .bfg-res>.bfg-sd{color:var(--mute)}
.bfg-isp-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px;flex:none}
.bfg-isp-sn{border:2px solid var(--ink);border-radius:16px;padding:11px 12px 12px;display:grid;gap:5px;align-content:start;background:var(--pist);min-width:0}
.bfg-isp-sn.b{background:#F45D22;transform:rotate(1.6deg)}
.bfg-isp-sn b{font:800 23px/1 var(--disp);font-variation-settings:var(--dv);overflow-wrap:anywhere}
.bfg-isp-sn .bfg-an{font-size:10.5px}
.bfg-isp-sn .sh{display:flex;gap:5px;flex-wrap:wrap;margin-top:6px}
.bfg-isp-sn .sh i{width:18px;height:18px;border-radius:50%;background:var(--tint);border:2px solid var(--ink);box-sizing:border-box}
.bfg-isp-sn.b .sh i{border-radius:4px;transform:rotate(16deg)}
.bfg-isp-vv{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:5px 12px;font-size:15px;flex:none}
.bfg-isp-vv li{display:flex;align-items:center;gap:5px;white-space:nowrap;min-width:0}
.bfg-isp-vv li span{overflow:hidden;text-overflow:ellipsis;min-width:0}
.bfg-isp-vv .bfg-isp-pd{--d:20px;font-size:0;border-width:1.5px}
.bfg-isp-vv li.hit{font-weight:700}
.bfg-isp-vv u{text-decoration:none;font-family:var(--mono);color:var(--mute);flex:none}

/* 矮屏 / 键盘弹出:可有可无的脚注先让位 */
@container bfgfs (max-height:600px){
 .bfg-isp-opt{display:none}
 .bfg-isp-rc{margin-top:78px}
 .bfg-isp-peek:not(.sm){height:150px}
}
.bfg-isp.kb .bfg-isp-opt{display:none}
/* 横屏手机:信息在左,要点的东西在右 */
@container bfgfs (max-height:520px) and (min-width:560px){
 .bfg-isp .bfg-isp-grow{grid-column:1;grid-row:2/6;padding-top:10px}
 .bfg-isp .bfg-isp-dock{grid-column:2;grid-row:2/6;align-content:end;padding:10px 20px 10px 0}
 .bfg-isp .bfg-isp-dock.mine,.bfg-isp .bfg-isp-dock.verdict{padding-left:14px;border-top:0;border-left:2px solid var(--ink)}
 .bfg-isp-dock.verdict{transform:translateX(105%)}
 .bfg-isp-peek:not(.sm){height:120px}
 .bfg-isp-rc{margin-top:70px}
 .bfg-isp-q,.bfg-isp-q.big{font-size:24px}
 .bfg-isp-votes{grid-template-columns:1fr 1fr}
 .bfg-isp-votes .bfg-isp-vt{min-height:50px}
}
/* 桌面游戏区:手机版放大 */
@container bfgfs (min-width:700px) and (min-height:521px){
 .bfg-isp-grow{padding:22px 40px 8px}.bfg-isp-dock{padding:14px 40px 20px}
 .bfg-isp .bfg-ftop{padding-left:12px;padding-right:24px}
 .bfg-isp-peek:not(.sm){max-width:520px;width:100%;justify-self:center}
 .bfg-isp-dock>.bfg-btn{max-width:520px;justify-self:center}
 .bfg-isp-votes{grid-template-columns:1fr 1fr}
 .bfg-isp-r .bfg-res{padding-top:20px}
}
