*{box-sizing:border-box}html,body,#root{margin:0;height:100%}body{font-family:Hiragino Sans,Noto Sans JP,sans-serif;background:#2e3440;color:#2b2b2b}button{font:inherit;cursor:pointer;border:none;border-radius:8px;padding:.55em 1.1em;background:#4c7a5d;color:#fff}button:disabled{opacity:.5;cursor:default}input{font:inherit;padding:.55em .8em;border:1.5px solid #c8c2b4;border-radius:8px;min-width:0}.vvo-center{height:100%;display:flex;align-items:center;justify-content:center;color:#eee}.vvo-card{background:#f6f1e7;color:#2b2b2b;border-radius:16px;padding:2rem 2.5rem;width:min(440px,92vw);box-shadow:0 12px 40px #00000059;text-align:center}.vvo-card-wide{width:min(520px,92vw)}.vvo-card h1{font-size:1.3rem;margin:0 0 .5rem}.vvo-form{display:flex;gap:.5rem;margin-top:1rem}.vvo-form input{flex:1}.vvo-error{color:#b3261e;margin-top:.8rem}.vvo-avatar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;margin-top:1rem}.vvo-avatar-choice{background:#fff;border:2px solid transparent;border-radius:12px;padding:.3rem}.vvo-avatar-choice.selected{border-color:#4c7a5d;background:#e7f0e9}.vvo-room-list{list-style:none;padding:0;margin:1rem 0 0;display:flex;flex-direction:column;gap:.5rem}.vvo-room-list button{width:100%;background:#fff;color:#2b2b2b;border:1.5px solid #c8c2b4;text-align:left;padding:.7em 1em}.vvo-room-list button:hover{border-color:#4c7a5d;background:#e7f0e9}.vvo-office{height:100%;display:flex;flex-direction:column}.vvo-office-header{display:flex;align-items:center;gap:1rem;padding:.6rem 1.2rem;background:#232831;color:#eee}.vvo-office-header h1{font-size:1.05rem;margin:0;flex:1}.vvo-occupancy{opacity:.75;font-size:.9rem}.vvo-office-body{flex:1;display:flex;min-height:0}.vvo-scene-wrap{flex:1;display:flex;align-items:center;justify-content:center;padding:1rem;position:relative}.vvo-scene{width:100%;height:100%;max-width:1100px;border-radius:12px;box-shadow:0 10px 36px #0006}.vvo-connecting{position:absolute;color:#eee}.vvo-chat{width:300px;display:flex;flex-direction:column;background:#f6f1e7;border-left:1px solid #00000022}.vvo-chat-log{flex:1;overflow-y:auto;padding:.8rem;display:flex;flex-direction:column;gap:.45rem}.vvo-chat-msg{background:#fff;border-radius:10px;padding:.45rem .7rem;font-size:.88rem;line-height:1.45;overflow-wrap:anywhere}.vvo-chat-msg.own{background:#e7f0e9}.vvo-chat-handle{display:block;font-size:.72rem;font-weight:600;color:#4c7a5d}.vvo-chat-form{display:flex;gap:.4rem;padding:.6rem;border-top:1px solid #00000018}.vvo-chat-form input{flex:1}.vvo-name{font-size:12px;font-weight:600;fill:#2b2b2b;paint-order:stroke;stroke:#ffffffd9;stroke-width:3px}.vvo-self-ring{fill:none;stroke:#4c7a5d;stroke-width:2.5;stroke-dasharray:5 4}.vvo-bubble{background:#fff;border:1.5px solid #2b2b2b22;border-radius:10px;padding:5px 9px;font-size:11px;line-height:1.35;max-height:56px;overflow:hidden;text-align:center;width:fit-content;max-width:160px;margin:0 auto;box-shadow:0 3px 10px #0000002e;animation:vvo-bubble-pop .18s ease-out;overflow-wrap:anywhere}@keyframes vvo-bubble-pop{0%{transform:translateY(6px) scale(.85);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}.vvo-idle{animation:vvo-bob 2.6s ease-in-out infinite}@keyframes vvo-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-2.5px)}}.vvo-idle .vvo-eye{transform-box:fill-box;transform-origin:center;animation:vvo-blink 4.5s infinite}@keyframes vvo-blink{0%,94%,to{transform:scaleY(1)}96%,98%{transform:scaleY(.1)}}.vvo-walking{animation:vvo-walk-rock .34s ease-in-out infinite}@keyframes vvo-walk-rock{0%,to{transform:rotate(-2.5deg) translateY(0)}50%{transform:rotate(2.5deg) translateY(-2.5px)}}.vvo-leg-l,.vvo-leg-r{transform-box:fill-box;transform-origin:center top}.vvo-walking .vvo-leg-l{animation:vvo-step .34s ease-in-out infinite}.vvo-walking .vvo-leg-r{animation:vvo-step .34s ease-in-out infinite reverse}@keyframes vvo-step{0%,to{transform:rotate(24deg)}50%{transform:rotate(-24deg)}}.vvo-hop{animation:vvo-hop .45s cubic-bezier(.28,1.6,.5,1)}@keyframes vvo-hop{0%{transform:translateY(0)}35%{transform:translateY(-9px)}70%{transform:translateY(1.5px)}to{transform:translateY(0)}}.vvo-tail{transform-box:fill-box;transform-origin:left bottom;animation:vvo-tail-wag 2s ease-in-out infinite}@keyframes vvo-tail-wag{0%,to{transform:rotate(0)}50%{transform:rotate(7deg)}}.vvo-ear-l,.vvo-ear-r{transform-box:fill-box;transform-origin:center bottom}.vvo-ear-l{animation:vvo-ear-sway 3.4s ease-in-out infinite}.vvo-ear-r{animation:vvo-ear-sway 3.4s ease-in-out .4s infinite}@keyframes vvo-ear-sway{0%,to{transform:rotate(0)}50%{transform:rotate(-5deg)}}.vvo-antenna{transform-box:fill-box;transform-origin:center bottom;animation:vvo-antenna-sway 2.2s ease-in-out infinite}@keyframes vvo-antenna-sway{0%,to{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}.vvo-wing-l,.vvo-wing-r{transform-box:fill-box}.vvo-wing-l{transform-origin:right top}.vvo-wing-r{transform-origin:left top}.vvo-walking .vvo-wing-l{animation:vvo-flap-l .28s ease-in-out infinite}.vvo-walking .vvo-wing-r{animation:vvo-flap-r .28s ease-in-out infinite}@keyframes vvo-flap-l{0%,to{transform:rotate(0)}50%{transform:rotate(28deg)}}@keyframes vvo-flap-r{0%,to{transform:rotate(0)}50%{transform:rotate(-28deg)}}.vvo-leaf{transform-box:fill-box;transform-origin:center bottom;animation:vvo-leaf-sway 3s ease-in-out infinite}@keyframes vvo-leaf-sway{0%,to{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}.vvo-ghost-body{animation:vvo-float 3s ease-in-out infinite}@keyframes vvo-float{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.vvo-tentacles{transform-box:fill-box;transform-origin:center bottom;animation:vvo-tentacle-wiggle 2.4s ease-in-out infinite}@keyframes vvo-tentacle-wiggle{0%,to{transform:scaleY(1)}50%{transform:scaleY(.94) scaleX(1.04)}}.vvo-cap{transform-box:fill-box;transform-origin:center bottom;animation:vvo-cap-tilt 3.6s ease-in-out infinite}@keyframes vvo-cap-tilt{0%,to{transform:rotate(-2.5deg)}50%{transform:rotate(2.5deg)}}.vvo-avatar-choice{display:flex;flex-direction:column;align-items:center;gap:.1rem}.vvo-avatar-label{font-size:.72rem;color:#5a5346}