*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#020a24;color:#fff;font-family:Arial,sans-serif}body{display:flex;justify-content:center}button,input{font:inherit}button{cursor:pointer}button:focus-visible{outline:3px solid #23e9ef;outline-offset:2px}#app{width:min(100vw,592px);position:relative;padding-top:env(safe-area-inset-top)}#room{height:385px;position:relative;background:radial-gradient(ellipse at 70% -30%,#153c8a 0,transparent 65%),radial-gradient(ellipse at 5% 50%,#102c64,transparent 40%),#041443}.profile{position:absolute;top:22px;left:16px;display:flex;gap:10px;align-items:center;background:#010d2b;border-radius:40px;padding:8px 18px 8px 8px;max-width:65%}.profile b{display:block;font-size:21px;max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.profile small{display:block;font-size:13px;color:#a6b7d6;margin-top:6px}#avatar{background:linear-gradient(135deg,#4775b1,#153d70);width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-size:25px;overflow:hidden}#avatar img{width:100%;height:100%;object-fit:cover}#room>button{position:absolute;top:30px;border:0;background:#020d2c;color:#d2c9a8;width:45px;height:45px;border-radius:50%;font-size:26px}#layout-toggle{right:82px}#room-menu{right:22px}.room-balance{position:absolute;top:108px;left:18px;background:#04102d;padding:7px 12px;border-radius:30px;color:#c4cee1}.seats{position:absolute;top:163px;left:16px;right:16px;display:grid;grid-template-columns:repeat(5,1fr);gap:27px 15px;text-align:center;color:#aab7d1}.seat-icon{width:70px;height:70px;margin:auto;border:2px solid #283f6d;border-radius:50%;background-size:100% 100%;background-position:center}.seat small{display:block;margin-top:5px;font-size:15px}#game{position:relative;aspect-ratio:592/820;overflow:hidden;border-radius:34px 34px 24px 24px;background:#143927}#canvas,#effects,#controls,#modal-root{position:absolute;top:0;right:0;bottom:0;left:0}#canvas canvas,#effects canvas{width:100%;height:100%;display:block}#effects,#controls{pointer-events:none}#controls button{pointer-events:auto;position:absolute;border:0;background:transparent;color:transparent;border-radius:22px;touch-action:manipulation}#controls button:disabled{cursor:default}#controls .selected{box-shadow:0 0 13px 4px #ffe72b}#modal-root:empty{pointer-events:none}.modal-shade{position:absolute;top:0;right:0;bottom:0;left:0;background:#000b;display:flex;align-items:center;justify-content:center;padding:8%}.modal{position:relative;width:100%;height:83%;border:2px solid #ffde9b;border-radius:17px;background:linear-gradient(#a83809,#321112);padding:35px 14px 14px;box-shadow:0 7px 20px #0008;color:#c04f21}.ribbon{position:absolute;top:-23px;left:20%;width:60%;padding:8px;text-align:center;background:linear-gradient(90deg,#ffad30,#ffe67a,#ffb23c);color:#9300ff;font-weight:900;font-size:29px;text-shadow:2px 2px white,-2px -2px white;border-radius:5px;box-shadow:0 4px 5px #0004}.close-modal{position:absolute;right:7px;top:3px;font-size:32px;border:0;background:transparent;color:#fff4c2;line-height:1}.modal-inner{background:#fff3c4;border-radius:18px;height:100%;overflow:hidden;display:flex;flex-direction:column}.tabs{display:flex;background:#efb570;flex-shrink:0}.tabs button{border:0;background:transparent;color:#c96123;padding:19px 0;width:33.333%;font-size:20px}.tabs .active{background:#fff3c4}.modal-content{padding:22px 15px;overflow:auto;flex:1;font-size:18px;line-height:1.5;scrollbar-width:thin}.setting{display:grid;grid-template-columns:40px 1fr 50px;gap:12px;align-items:center;margin:15px 10px 28px}.setting input{width:100%;accent-color:#e96748}.setting output{border-radius:16px;background:#9e17e9;color:#fff;font-size:14px;padding:0 4px}.food-icons{display:flex;gap:12px;margin:8px 0 20px}.food-icon{display:inline-block;width:35px;height:35px;background-repeat:no-repeat;background-size:592px 1280px}.record-head,.record-row{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:6px;padding:10px 0;border-bottom:1px solid #e6b26e}.record-head{font-size:16px}.record-row{font-size:13px;color:#8b441e}.empty{text-align:center;color:#b57c47;padding:45px 5px;font-size:15px}.ranking .modal{height:68%}.ranking .ribbon{font-size:18px;color:#a23b0e;text-shadow:none;width:75%;left:12.5%;top:-15px}.rank-row{display:flex;gap:10px;align-items:center;padding:20px 5px}.rank-row strong{margin-left:auto;color:#b78224}.rank-foot{text-align:center;font-size:12px;position:absolute;bottom:30px;left:0;right:0}.result-personal{text-align:center;color:#9035bc;font-size:18px;padding:14px;background:#ffeab0;border-radius:8px}.toast{opacity:1}#toast{position:absolute;left:8%;right:8%;top:53%;padding:10px;border-radius:8px;text-align:center;background:#281204de;color:#fff2b4;font-size:16px;pointer-events:none;opacity:0;transition:opacity .18s}#toast.show{opacity:1}#connection{position:absolute;right:10px;bottom:3px;font-size:9px;color:#ffdc9d;pointer-events:none}#loading{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;background:#000;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#a5e9f3;gap:20px}#loading[hidden]{display:none}.load-logo{width:300px;height:280px;background-image:url(../assets/loading.png);background-size:contain;background-position:center;background-repeat:no-repeat}.progress{border:7px solid #073c48;border-top-color:#00d9f4;border-bottom-color:#08798d;border-radius:50%;width:92px;height:92px;display:grid;place-items:center;box-shadow:0 0 15px #00c9ee44;font-size:24px}#loading p{max-width:85%;text-align:center}#retry{border:1px solid #04cce0;border-radius:20px;background:#082e37;color:#b3ffff;padding:10px 24px}.compact #room{display:none}.compact{max-width:min(100vw,calc(100dvh * 592 / 820))}.compact #game{border-radius:0}p{margin-top:0}.rules-note{font-size:13px;padding:10px;background:#ffe5a2;color:#89592f}#auto-label{position:absolute;pointer-events:none;background:linear-gradient(#dedede,#9a9a9a);border:2px solid #eee;border-radius:8px;color:#fff;display:grid;place-items:center;font-size:17px}#auto-label.on{background:linear-gradient(#8ea42d,#38761e);border-color:#e4ff60}@media(max-width:592px){#room{height:65vw}.profile{top:3.7vw;left:2.7vw;padding:1.3vw 3vw 1.3vw 1.3vw;gap:1.7vw}.profile b{font-size:3.6vw}.profile small{font-size:2.2vw;margin-top:1vw}#avatar{width:8.1vw;height:8.1vw;font-size:4.2vw}#room>button{top:5vw;width:7.6vw;height:7.6vw;font-size:4.4vw}#layout-toggle{right:14vw}#room-menu{right:3.7vw}.room-balance{top:18vw;left:3vw;font-size:3vw;padding:1vw 2vw}.seats{top:27.5vw;left:2.7vw;right:2.7vw;gap:4.5vw 2.5vw}.seat-icon{width:11.8vw;height:11.8vw;background-size:100% 100%;background-position:center}.seat small{font-size:2.5vw;margin-top:.85vw}#game{border-radius:5.7vw 5.7vw 4vw 4vw}.ribbon{font-size:4.9vw}.tabs button{font-size:3.4vw;padding:3.2vw 0}.modal-content{font-size:3vw;padding:3.7vw 2.5vw}.modal{padding:5.9vw 2.3vw 2.3vw}.modal-shade{padding:8%}.setting{grid-template-columns:7vw 1fr 8vw;gap:2vw;margin:2.5vw 1vw 4.7vw}.setting output{font-size:2.4vw}.record-head{font-size:2.7vw}.record-row{font-size:2.2vw}.ranking .ribbon{font-size:3vw}#toast{font-size:2.7vw}#auto-label{font-size:2.8vw}}#canvas canvas,#effects canvas{width:100%!important;height:100%!important}