/* The Revenue Room: Beat the Revenue Manager — on top of /assets/play/play.css */
.vs-hero{display:flex;align-items:center;justify-content:center;gap:18px;margin:0 0 22px}
.fighter{display:flex;flex-direction:column;align-items:center;gap:6px;font:800 15px var(--fd);color:var(--ink)}
.fighter .av{width:76px;height:76px;border-radius:50%;display:grid;place-items:center;font-size:38px;border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);background:var(--lime)}
.fighter img.av{border:0;background:none;padding:0}
.fighter b small{display:block;font:500 11px var(--fm);color:var(--mute);text-align:center}
.fighter.bot .av{animation:bob 2.4s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(-5px)}}
.vs-x{font:900 26px var(--fd);color:var(--rose);transform:rotate(-8deg)}

.board{padding:14px 16px}
.b-top{display:flex;justify-content:space-between;gap:10px;margin-bottom:10px}
.hud-n{font:500 12px var(--fm);letter-spacing:.08em;text-transform:uppercase;color:var(--ink)}
.hud-m{font:400 12px var(--fm);color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.race{display:flex;flex-direction:column;gap:8px}
.lane{display:grid;grid-template-columns:62px 1fr auto;gap:10px;align-items:center}
.who{font:700 13px var(--fd);color:var(--ink);white-space:nowrap}
.trk{height:16px;border-radius:99px;background:rgba(22,33,58,.08);overflow:hidden;border:1.5px solid var(--ink)}
.trk i{display:block;height:100%;width:0;background:var(--lime);transition:width .7s var(--ease)}
.lane.bot .trk i{background:var(--teal2)}
.lane .num{font-size:14px;min-width:7ch;text-align:right}

.sit{padding:22px}
.sit.in{animation:deal .35s var(--ease)}
.s-ico{font-size:40px;line-height:1;margin-bottom:8px}
.sit h2{font:900 25px/1.15 var(--fd);margin-bottom:6px}
.s-body{font-size:16px;color:var(--ink);margin:0 0 16px}
.s-q{margin-bottom:8px}
.opts{display:flex;flex-direction:column;gap:10px}
.opt{display:grid;grid-template-columns:1fr auto;grid-template-areas:"l r" "t t";gap:2px 10px;align-items:center;text-align:left;border:1.5px solid var(--ink);border-radius:12px;background:#fff;padding:14px 16px;font:700 16px var(--fd);color:var(--ink);box-shadow:3px 3px 0 var(--ink);transition:transform .12s var(--ease),box-shadow .12s var(--ease),background .2s}
.opt:not(:disabled):hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink);background:#F4FBEF}
.opt:not(:disabled):active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.opt:disabled{cursor:default}
.o-l{grid-area:l}.o-r{grid-area:r;font-size:15px}.o-tag{grid-area:t;display:flex;gap:6px}
.o-tag:empty{display:none}
.o-tag i{font:600 11px var(--fm);font-style:normal;padding:2px 8px;border-radius:99px;margin-top:4px}
.t-you{background:var(--lime)}.t-bot{background:var(--teal2)}
.opt.done{opacity:.55;box-shadow:none}
.opt.best{opacity:1;background:#EEF8F9;border-color:var(--teal)}
.opt.mine{opacity:1}
.opt.wrong{background:#FBF0F2;border-color:var(--rose)}
.opt.best.mine{background:#F0F8EB;border-color:var(--lime-d)}
.out{margin-top:16px;animation:deal .3s var(--ease)}
.o-head{margin:0 0 12px;font:900 19px/1.3 var(--fd);color:var(--ink)}
.o-head span{display:block;font:500 14px var(--fb);color:var(--body);margin-top:2px}
.o-head.win{color:var(--lime-d)}.o-head.lose{color:var(--rose)}
.recap li{grid-template-columns:28px 1fr auto}
.recap li.bad .rc-n{color:var(--rose)}.recap li.good .rc-n{color:var(--lime-d)}
#r-bars .bar{grid-template-columns:1fr auto}
#r-bars .bar b{font-size:15px}
img.rev{vertical-align:-5px;border-radius:50%}
.lane{grid-template-columns:max-content 1fr auto}
.race .who{min-width:4.5em}
.o-tag i img.rev{width:16px;height:16px;vertical-align:-4px}
