/* floor.css — the trading floor stage. Art is generated (plate, desk, mascot poses); code only places and animates it. */
.stagewrap{position:relative;width:100%;overflow:hidden;background:#07080b;border:1px solid var(--rule);border-top:0}
.stage{position:relative;width:1536px;height:1024px;transform-origin:0 0;background:url(img/floor/plate.webp) 0 0/1536px 1024px no-repeat;user-select:none}
.wall{position:absolute;left:368px;top:96px;width:704px;height:340px}
.wall canvas{width:100%;height:100%;display:block}
.desk{position:absolute;transform-origin:0 0;width:1192px;height:730px}
.desk>img{position:absolute;left:0;width:1192px;height:auto;pointer-events:none}
.desk .chair{top:0}
.desk .front{top:78px}
.desk canvas{position:absolute;left:97px;top:81px;width:997px;height:194px}
.m{position:absolute;left:596px;bottom:430px;width:390px;transform:translateX(-50%);transform-origin:50% 100%;animation:bob 3.2s ease-in-out infinite;will-change:transform}
.m img{position:static;width:100%;height:auto;display:block}
.m.typing{animation:typ .22s steps(2) infinite}
.m.cheer{animation:hop .55s ease-in-out 8}
.m.worried{animation:shake .14s linear 36}
.m.sleepy{animation:bob 4.5s ease-in-out infinite}
.m.boss{animation:bob 3.6s ease-in-out infinite}
.m.boss.cheer{animation:hop .55s ease-in-out 8}
.m.boss.worried{animation:shake .14s linear 36}
.tag{position:absolute;left:50%;top:-34px;transform:translateX(-50%);background:var(--bar);border:1px solid var(--rule-2);color:var(--ink);font:600 22px/1 var(--mono);padding:8px 12px;white-space:nowrap;opacity:0;transition:opacity .3s}
.tag.on{opacity:1}
.tag.up{color:#6fe8a8}.tag.dn{color:#f04c88}
.bossm{position:absolute;left:1118px;bottom:566px;width:172px;transform:translateX(-50%);transform-origin:50% 100%}
.bossm .m{position:static;transform:none;width:172px}
.bossm .tag{top:-40px}
@keyframes bob{0%,100%{transform:translateX(-50%) translateY(0) scale(1,1)}50%{transform:translateX(-50%) translateY(-6px) scale(1.01,.99)}}
@keyframes typ{0%{transform:translateX(-50%) translateY(0)}100%{transform:translateX(-50%) translateY(2px)}}
@keyframes hop{0%,100%{transform:translateX(-50%) translateY(0) scale(1,1)}30%{transform:translateX(-50%) translateY(-34px) scale(.96,1.06)}60%{transform:translateX(-50%) translateY(0) scale(1.05,.94)}}
@keyframes shake{0%{transform:translateX(calc(-50% - 4px))}100%{transform:translateX(calc(-50% + 4px))}}
.bossm .m{animation-name:bob2}
.bossm .m.cheer{animation:hop2 .55s ease-in-out 8}
.bossm .m.worried{animation:shake2 .14s linear 36}
@keyframes bob2{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes hop2{0%,100%{transform:translateY(0)}30%{transform:translateY(-30px) scale(.96,1.06)}60%{transform:translateY(0) scale(1.05,.94)}}
@keyframes shake2{0%{transform:translateX(-4px)}100%{transform:translateX(4px)}}
.vig{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 60%,transparent 55%,rgba(0,0,0,.45) 100%)}
.offline{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:rgba(7,8,11,.55);color:var(--ink);font:500 30px/1.4 var(--mono);text-align:center;padding:40px}
.offline.on{display:flex}

/* ticker */
.tick{height:30px;border:1px solid var(--rule);border-bottom:0;background:var(--bar);display:flex;align-items:center;overflow:hidden;white-space:nowrap;font-size:12.5px}
.tick__in{display:inline-flex;gap:28px;padding-left:100%;animation:tick 48s linear infinite}
.tick__in span b{color:var(--ink);font-weight:600;margin-right:6px}
.tick__in .up{color:#6fe8a8}.tick__in .dn{color:#f04c88}
@keyframes tick{to{transform:translateX(-100%)}}
.tick:hover .tick__in{animation-play-state:paused}

/* under the stage */
.under{display:grid;grid-template-columns:minmax(0,58fr) minmax(0,42fr);gap:1px;background:var(--rule);border:1px solid var(--rule);border-top:0}
.log--floor{max-height:240px;min-height:160px}
.log--floor li{grid-template-columns:8ch 11ch minmax(0,1fr)}
.roster{list-style:none;font-size:12.5px}
.roster li{display:grid;grid-template-columns:10ch 10ch minmax(0,1fr) 9ch;gap:10px;padding:5px 12px;border-bottom:1px solid var(--rule);white-space:nowrap}
.roster li:last-child{border-bottom:0}
.roster .who{color:var(--leg)}
.roster .mk{color:var(--ink)}
.roster .st{color:var(--ink-3);overflow:hidden;text-overflow:ellipsis}
.roster .pc{text-align:right}
.roster .up{color:#6fe8a8}.roster .dn{color:#f04c88}
@media (max-width:900px){
  .under{grid-template-columns:minmax(0,1fr)}
  .roster li{grid-template-columns:8ch 8ch minmax(0,1fr) 8ch;padding:5px 10px}
}
@media (max-width:600px){
  .roster li{grid-template-columns:minmax(0,9ch) 8ch minmax(0,1fr) 7ch;gap:6px}
  .roster .who,.roster .mk{overflow:hidden;text-overflow:ellipsis}
}
