:root{--navy:#1B3A6B;--red:#E60023;--cream:#faf6ec;--brown:#4a3b2a;--frame:#2b2320}*{margin:0;padding:0;box-sizing:border-box}body{font-family:DotGothic16,Noto Sans JP,sans-serif;background:#0d0d10;min-height:100vh;display:flex;flex-direction:column}.gamebar{background:var(--cream);border-bottom:4px solid var(--frame);padding:10px 20px;display:flex;align-items:center;gap:16px}.gamebar .logo-chip{width:34px;height:34px;background:var(--navy);border:3px solid var(--frame);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:900;font-size:13px}.gamebar h1{font-size:20px;color:var(--frame);letter-spacing:.05em}.gamebar h1 .red{color:var(--red)}.gamebar .sub{font-size:10px;color:#8a7a60;letter-spacing:.2em}.stats{margin-left:auto;display:flex;gap:10px}.pill{background:#fff;border:3px solid var(--frame);padding:4px 14px;text-align:center;box-shadow:3px 3px #2b232040}.pill .num{font-size:16px;font-weight:900;color:var(--navy);line-height:1.1}.pill .num.green{color:#1e9e57}.pill .num.amber{color:#d98b00}.pill .lbl{font-size:9px;color:#8a7a60}.live{font-size:10px;color:#1e9e57;border:3px solid var(--frame);background:#fff;padding:6px 10px;box-shadow:3px 3px #2b232040}.stage-wrap{flex:1;display:grid;grid-template-columns:1fr 330px;gap:14px;padding:14px 20px;max-width:1500px;margin:0 auto;width:100%}.stage-frame{border:5px solid var(--frame);background:#000;position:relative;box-shadow:6px 6px #2b232066;align-self:start}.stage{position:relative;width:100%;aspect-ratio:1344/768;background:url(/office/bg5.png) center/cover;image-rendering:pixelated;overflow:hidden}.stage-title{position:absolute;top:8px;left:8px;background:#faf6eceb;border:2px solid var(--frame);font-size:10px;padding:3px 10px;color:var(--frame);z-index:20}.clock{position:absolute;top:8px;right:8px;background:#faf6eceb;border:2px solid var(--frame);font-size:10px;padding:3px 10px;color:var(--frame);z-index:20}.agent{position:absolute;transform:translate(-50%,-72%);cursor:pointer;z-index:3;transition:left .9s linear,top .9s linear;width:4.8%}.agent .portrait{width:100%;aspect-ratio:1/1;background-size:contain;background-repeat:no-repeat;background-position:center bottom;filter:drop-shadow(0 3px 3px rgba(0,0,0,.4))}.agent.stepping .portrait{animation:waddle .5s steps(2) infinite}@keyframes waddle{0%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}to{transform:rotate(-4deg)}}.agent.working .portrait{animation:typebob 1.6s ease-in-out infinite}@keyframes typebob{0%,to{transform:translateY(0)}50%{transform:translateY(-1.5px)}}.agent .nameplate{margin:0 auto;width:fit-content;background:#14100ed9;border:1px solid rgba(255,255,255,.3);border-radius:4px;padding:0 6px;color:#fff;white-space:nowrap;text-align:center;line-height:1.25}.agent .nameplate .rolemain{display:block;font-size:8.5px;font-weight:900}.agent .nameplate .namesub{display:block;font-size:6.5px;font-weight:400;color:#d8c391}.agent .bubble{position:absolute;bottom:102%;left:50%;transform:translate(-50%);white-space:normal;width:max-content;max-width:130px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;word-break:break-all;font-size:9px;line-height:1.45;padding:3px 8px;border:2px solid var(--frame);background:#fffffff5;color:var(--frame);z-index:4;border-radius:9px;text-align:left}.agent .bubble:after{content:"";position:absolute;top:100%;left:50%;margin-left:-4px;border:4px solid transparent;border-top-color:var(--frame)}.agent.working .bubble{background:#fff8d6}.agent.approval .bubble{background:#ffe9c2}.agent.blocked .bubble{background:#ffd6dc}.agent.talking{z-index:15}.agent.talking .bubble{white-space:normal;width:205px;max-width:none;overflow:visible;font-size:10.5px;font-weight:700;background:#fffef5;border-color:#b8860b;box-shadow:0 6px 14px #00000080}.agent .dot{position:absolute;top:-3px;right:-3px;width:10px;height:10px;border-radius:50%;border:2px solid var(--frame);display:none;z-index:5}.agent .alert-mark{display:none;position:absolute;top:-30%;right:-18%;z-index:8;width:28px;height:28px;border-radius:50%;background:var(--red);color:#fff;font-size:18px;font-weight:900;line-height:25px;text-align:center;border:3px solid #ffe75c;box-shadow:0 0 0 3px #e23a4659,0 4px 12px #0000008c;animation:alertbounce .9s ease-in-out infinite;pointer-events:none}.agent.approval .alert-mark,.agent.blocked .alert-mark{display:block}.agent.approval .bubble,.agent.blocked .bubble{font-weight:900}@keyframes alertbounce{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-8px) scale(1.12)}}.agent.b-high .bubble{bottom:128%}.agent.b-high .bubble:after{border-top-color:var(--frame)}.agent.working .dot{display:block;background:#2ecc71}.agent.approval .dot{display:block;background:#f6a821}.agent.blocked .dot{display:block;background:var(--red)}.side{display:flex;flex-direction:column;gap:12px;max-height:calc(100vh - 90px)}.panel{background:var(--cream);border:4px solid var(--frame);box-shadow:5px 5px #2b232066;display:flex;flex-direction:column;overflow:hidden}.panel-head{background:var(--frame);color:var(--cream);font-size:11px;padding:6px 12px;letter-spacing:.15em;display:flex;justify-content:space-between}.feed-list{overflow-y:auto;flex:1}.feed-item{padding:9px 12px;border-bottom:2px dashed #d8cdb4;display:flex;gap:8px;align-items:flex-start}.feed-item .mini{width:30px;height:30px;border:2px solid var(--frame);border-radius:6px;background-size:cover;background-position:center top;flex:0 0 30px;background-color:#fff}.feed-item .meta{font-size:9px;color:#8a7a60}.feed-item .txt{font-size:11px;color:var(--frame);line-height:1.5}#drawer{display:none}#drawer.open{display:flex}.drawer-body{padding:12px;font-size:11px;color:var(--frame);line-height:1.7}.drawer-body .big{display:flex;gap:10px;align-items:center;margin-bottom:8px}.drawer-body .big img{width:56px;height:56px;border:3px solid var(--frame);border-radius:8px;object-fit:cover;object-position:top;background:#fff}.drawer-body .role{font-size:10px;color:#8a7a60}.drawer-body .stchip{display:inline-block;border:2px solid var(--frame);padding:1px 8px;font-size:10px;margin:6px 0;background:#fff}.chat-log{max-height:180px;overflow-y:auto;margin:8px 0;display:flex;flex-direction:column;gap:6px}.chat-msg{font-size:11px;line-height:1.55;padding:6px 10px;border-radius:10px;max-width:92%}.chat-msg.me{align-self:flex-end;background:var(--navy);color:#fff}.chat-msg.ai{align-self:flex-start;background:#fff;border:2px solid var(--frame)}.chat-msg.sys{align-self:center;background:none;color:#a08f6a;font-size:9.5px}.chat-form{display:flex;gap:6px;margin-top:4px}.chat-form input{flex:1;border:2px solid var(--frame);border-radius:8px;padding:6px 10px;font-size:11px;font-family:inherit;background:#fff}.chat-form button{border:2px solid var(--frame);background:var(--red);color:#fff;font-weight:900;font-size:11px;padding:6px 14px;border-radius:8px;cursor:pointer;font-family:inherit}.chat-form button:disabled{opacity:.5;cursor:wait}.note{text-align:center;font-size:9px;color:#7a6a50;padding:6px}@media(max-width:1100px){.stage-wrap{grid-template-columns:1fr}.side{max-height:400px}}