:root{color:#5a391e;font-synthesis:none;background:#2e291d;font-family:Microsoft JhengHei,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden}button,input,select{font:inherit;color:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{cursor:default;opacity:.45}button:focus-visible,select:focus-visible,input:focus-visible{outline-offset:2px;outline:3px solid #276578}[hidden]{display:none!important}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}#app{width:100vw;height:100dvh;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);background:radial-gradient(#6f643e,#252216);justify-content:center;align-items:center;display:flex;position:relative}.viewport{width:min(100%, calc((100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom)) * 4 / 3), 1120px);flex-shrink:0;position:relative;overflow:hidden;box-shadow:0 8px 40px #0008}.logical-stage{transform-origin:0 0;width:800px;height:600px;position:absolute}.screen,.screen-art,#game-canvas{width:800px;height:600px;position:absolute;inset:0}.screen-art{pointer-events:none}#game-canvas{touch-action:none;outline:none;display:block}.coco-button{color:#6e410c;text-shadow:0 1px #fff8;background:linear-gradient(#fffac1,#ffcf5a 55%,#efaa25);border:2px solid #aa691d;border-radius:18px;padding:8px 18px;font-weight:900;box-shadow:inset 0 2px #fffbd9,0 2px #8a501b}.coco-button.primary{color:#fffce8;text-shadow:0 1px #385121;background:linear-gradient(#d9ef9e,#84ac4d 55%,#5c822e);border-color:#4c712d;box-shadow:inset 0 2px #e7ffbb,0 2px #405c23}.coco-button:hover{filter:brightness(1.08)}.coco-button:active{transform:translateY(1px)}.icon-button{color:#fff;text-shadow:0 1px #b87322;background:linear-gradient(#ffd960,#f0a52c);border:2px solid #fff7cc;border-radius:50%;width:30px;height:30px;padding:0;font-size:19px;font-weight:900}.landing{background:#60caf0}.portrait-reef{pointer-events:none;display:none}.landing-actions{background:#98cf2e;border-radius:12px;flex-direction:column;gap:7px;width:270px;height:95px;padding:3px 8px;display:flex;position:absolute;top:329px;left:225px}.landing-actions button{width:250px;min-height:38px;padding:5px;font-size:19px}.landing-actions small{margin-left:12px;font-size:11px}.room{background:#fc5}.room-title{display:none}.room-back{position:absolute;top:11px;right:9px}.room-help{position:absolute;top:11px;right:48px}.map-preview{object-fit:cover;width:145px;height:98px;position:absolute;top:62px;left:66px}.map-select{width:147px;font-size:0;position:absolute;top:163px;left:66px}.map-select select{background:#fff1b9;border:1px solid #dcaa4b;border-radius:4px;width:100%;font-size:10px}.room-name,.room-count,.room-time{text-align:center;font-size:10px;position:absolute}.room-name{width:103px;top:36px;left:319px}.room-count{width:49px;top:59px;left:343px}.room-time{width:49px;top:80px;left:343px}.room-mode{background:#878b86;gap:7px;width:224px;height:44px;padding:5px 6px;display:flex;position:absolute;top:97px;left:260px}.room-mode button{background:#d3c98c;border:1px solid #dddcb9;border-radius:7px;flex:1;padding:4px;font-size:11px}.room-mode button[aria-pressed=true]{color:#3f692e;background:#e3efb0;font-weight:700}.ready-button{width:117px;height:31px;padding:3px;font-size:16px;position:absolute;top:148px;left:266px}.character-area{width:450px;position:absolute;top:198px;left:35px}.character-area h2{display:none}.character-picker{gap:18px;display:flex}.character-choice{background:0 0;border:0;width:105px;height:137px;padding:0 6px 25px;position:relative}.character-choice img{object-fit:contain;width:93px;height:111px}.character-choice span{padding:4px;font-size:12px;position:absolute;bottom:0;left:0;right:0}.character-choice.selected span{color:#fff;background:linear-gradient(#a6c973,#658b3f);border:2px solid #def1b0;font-size:15px;font-weight:700;box-shadow:0 1px #52662c}.room-loadout{width:466px;position:absolute;top:358px;left:38px}.room-loadout h2{margin:0 0 8px;font-size:13px}.room-loadout>div{gap:7px;display:flex}.room-loadout button,.recovery-slot{background:#fff3c4;border:1px solid #d4aa5a;border-radius:4px;flex-direction:column;align-items:center;width:43px;height:48px;padding:0;display:inline-flex;position:relative}.room-loadout button.selected{background:#ffe198;border:2px solid #8b6934}.room-loadout small{height:12px;font-size:9px}.room-loadout img{width:31px;height:30px;image-rendering:pixelated}.recovery-slot b{color:#392c16;background:#fff9;font-size:9px;position:absolute;bottom:-1px;right:0}.room-loadout>strong{margin-top:5px;font-size:10px;display:block}.room-roster{width:173px;position:absolute;top:102px;left:571px}.room-roster h2{display:none}.room-player{height:59px;font-size:11px}.room-player img{float:left;object-fit:cover;width:42px;height:42px;margin-right:9px}.room-player strong{padding-top:3px;display:block}.room-player span{margin-top:6px;font-size:10px;display:block}.room-profile{background:#fff4ce;width:190px;height:150px;padding:8px;font-size:12px;position:absolute;top:425px;left:570px}.room-profile>img{float:left;width:46px;height:46px;margin:0 10px 9px 0}.room-profile>strong,.room-profile>span{margin:2px 0 7px;display:block}.room-profile>label{clear:both;align-items:center;gap:8px;font-size:11px;display:flex}.room-profile select{background:#fff9e6;border:1px solid #d7ad62;border-radius:4px;flex:1;padding:3px}.room-profile>div{gap:8px;margin-top:10px;display:flex}.room-profile .coco-button{width:80px;padding:6px;font-size:13px}.room-log{background:#fff8df;border:4px solid #f6bd52;border-radius:15px;width:515px;height:101px;padding:14px 17px;font-size:12px;position:absolute;top:479px;left:24px;box-shadow:inset 0 0 0 2px #fff}.room-log p{margin:0 0 10px}.room-log p:first-child{color:#62783a}.battle-controls{gap:6px;display:flex;position:absolute;top:9px;right:9px}.modal-portal{pointer-events:none;z-index:20;position:absolute;inset:0}.modal-portal>*{pointer-events:auto}.modal-scrim{padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));background:#302a1cad;place-items:center;display:grid;position:fixed;inset:0}.coco-dialog{width:min(470px,100%);max-height:calc(100dvh - 40px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overscroll-behavior:contain;touch-action:pan-y;text-align:center;background:#fff2ca;border:5px solid #ffd875;border-radius:20px;padding:22px;overflow-y:auto;box-shadow:inset 0 0 0 2px #fffbe2,0 8px 35px #0006}.coco-dialog h2{color:#92531f;margin:0 0 18px;font-size:23px}.coco-dialog h3{text-align:left;border-bottom:1px solid #d9c699;margin:18px 0 10px;padding-bottom:5px;font-size:14px}.coco-dialog p{font-size:13px;line-height:1.8}.setting-check{margin:20px 0 25px;display:block}.setting-check input{accent-color:#6b913d}.help-dialog .coco-button{min-width:130px;min-height:44px;margin:14px 5px 0}.bag-weapons{flex-wrap:wrap;gap:8px;display:flex}.bag-weapons button{background:#fff9e3;border:2px solid #e6c284;border-radius:7px;width:66px;min-height:64px;padding:5px}.bag-weapons img{width:31px;height:30px;margin:auto;display:block}.bag-weapons span{font-size:10px}.bag-weapons button.selected{background:#eef6ca;border-color:#789a46}.bag-status{color:#a03c23;min-height:15px;margin:6px 0}.bag-recovery{text-align:left;align-items:center;gap:14px;display:flex}.bag-recovery>img{width:42px;height:42px;image-rendering:pixelated}.bag-recovery strong{font-size:13px}.bag-recovery p{margin:4px 0;font-size:11px}.dye-picker{gap:8px;margin-bottom:24px;display:flex}.dye-picker button{background:#fff7dd;border:2px solid #e4ce9e;border-radius:7px;width:56px;min-height:55px}.dye-picker i{border-radius:50%;width:24px;height:24px;margin:4px auto;display:block}.dye-picker span{font-size:10px}.dye-picker .selected{border-color:#739742}.result-badge{width:65%;max-width:230px;height:auto;margin-bottom:16px}.result-cards img{object-fit:contain;width:94px;height:112px;margin:0 7px}.result-actions{justify-content:center;gap:14px;margin-top:20px;display:flex}.result-actions .coco-button{min-height:44px}.touch-controls{display:none}#app[data-touch=true][data-screen=battle] .touch-controls{touch-action:none;display:block}.touch-controls button{touch-action:none;color:#663915;background:linear-gradient(#fff2b1,#eeb343);border:2px solid #fcebb1;border-radius:10px;padding:3px;font-weight:700;box-shadow:0 2px #8e622d}.touch-inventory{gap:4px;display:grid}.touch-inventory button{border-radius:6px;min-width:44px;min-height:49px}.touch-inventory img{width:27px;height:27px;image-rendering:pixelated;margin:auto;display:block}.touch-inventory span{white-space:nowrap;font-size:9px;display:block}.touch-inventory .selected{background:#fff0bd;border-color:#eb6a31}.touch-move{grid-template-rows:repeat(2,44px);grid-template-columns:repeat(3,44px);gap:4px;display:grid}.touch-left{grid-area:2/1}.touch-jump{grid-area:1/2}.touch-right{grid-area:2/3}.touch-dig{grid-area:2/2}.touch-help{grid-area:1/1}.touch-facing{gap:6px;margin-bottom:6px;display:flex}.touch-facing button{flex:1;min-height:44px;font-size:20px}.touch-status{color:#f9edc1;text-align:center;min-height:22px;font-size:11px}.touch-angle{color:#eada9d;font-size:11px;display:block}.touch-angle output{float:right}.touch-angle input{accent-color:#edb746;touch-action:none;width:100%;height:38px;margin:0;display:block}.touch-primary-row{justify-content:space-between;align-items:center;gap:8px;display:flex}#touch-fire{border-width:3px;border-radius:50%;flex-shrink:0;width:76px;height:76px;position:relative;overflow:hidden}#touch-fire img{z-index:1;width:26px;height:26px;margin:auto;display:block;position:relative}#touch-fire span{z-index:1;font-size:14px;display:block;position:relative}#touch-fire i{height:var(--charge,0%);background:#ee78368c;position:absolute;bottom:0;left:0;right:0}#touch-pass{min-width:47px;min-height:44px;font-size:11px}@media (orientation:landscape){#app[data-touch=true][data-screen=battle] .viewport{width:min(calc(100vw - 296px - env(safe-area-inset-left) - env(safe-area-inset-right)), calc((100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom)) * 4 / 3))}.touch-controls{pointer-events:none;position:absolute;inset:0}.touch-controls>*{pointer-events:auto}.touch-inventory{left:max(8px,env(safe-area-inset-left));top:max(12px,env(safe-area-inset-top));grid-template-columns:repeat(2,1fr);width:130px;position:absolute}.touch-move{left:max(8px,env(safe-area-inset-left));bottom:max(12px,env(safe-area-inset-bottom));position:absolute}.touch-attack{right:max(8px,env(safe-area-inset-right));width:132px;position:absolute;top:50%;transform:translateY(-50%)}#app[data-touch=true] .ready-button:after{content:"";position:absolute;inset:-12px}}@media (orientation:portrait){#app[data-touch=true][data-screen=battle]{flex-direction:column;gap:8px}#app[data-touch=true][data-screen=battle] .viewport{width:min(100%,calc((100dvh - 284px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) * 4 / 3))}.touch-controls{flex-shrink:0;width:min(100%,520px);height:264px;position:relative}.touch-inventory{grid-template-columns:repeat(6,minmax(0,1fr));position:absolute;top:0;left:8px;right:8px}.touch-move{position:absolute;top:101px;left:8px}.touch-attack{width:calc(100% - 166px);max-width:240px;position:absolute;top:60px;right:10px}}@media (width<=600px) and (orientation:portrait){#app[data-touch=true]:not([data-screen=battle]){overscroll-behavior:contain;touch-action:pan-y;display:block;overflow-y:auto}.viewport.compact{width:100%;max-width:none;box-shadow:none}.compact .screen{width:400px}.compact .landing{background:linear-gradient(#60caf0 25%,#429eca 72%,#328aba);height:100%}.compact .title-art{clip-path:inset(0 0 28.334%);width:400px;height:300px;top:35px}.compact .portrait-reef{width:400px;height:85px;display:block;position:absolute;bottom:0;left:0}.compact .landing-actions{gap:9px;width:280px;height:118px;padding:5px;top:198px;left:66px}.compact .landing-actions button{width:270px;min-height:48px}.compact .room{background:#ffcb54;border:4px solid #fff6c9;border-radius:14px;height:900px}.compact .lobby-art,.compact .room-art,.compact .room-name,.compact .room-count,.compact .room-time,.compact .room-log{display:none}.compact .room-title{display:block;position:absolute;top:13px;left:20px}.compact .room-title h1{margin:0;font-size:22px}.compact .room-back{top:13px;right:14px}.compact .room-help{top:13px;right:56px}.compact .map-preview{border:5px solid #fff4bd;border-radius:13px;width:352px;height:143px;top:65px;left:20px}.compact .map-select{width:352px;top:216px;left:20px}.compact .map-select select{min-height:42px;font-size:15px}.compact .room-mode{background:0 0;width:352px;height:48px;padding:0;top:270px;left:20px}.compact .room-mode button{min-height:44px;font-size:14px}.compact .character-area{width:352px;top:337px;left:20px}.compact .character-area h2{margin:0 0 9px;font-size:15px;display:block}.compact .character-picker{justify-content:center;gap:32px}.compact .character-choice{width:120px;height:141px}.compact .room-loadout{width:352px;top:530px;left:20px}.compact .room-loadout h2{font-size:15px}.compact .room-loadout>div{gap:5px}.compact .room-loadout button,.compact .recovery-slot{width:48px;height:52px}.compact .room-loadout>strong{font-size:12px}.compact .room-roster{gap:12px;width:352px;display:flex;top:640px;left:20px}.compact .room-player{width:170px;font-size:12px}.compact .room-player img{width:36px;height:36px}.compact .room-profile{background:0 0;width:352px;height:90px;padding:0;top:710px;left:20px}.compact .room-profile>img,.compact .room-profile>strong,.compact .room-profile>span{display:none}.compact .room-profile label{font-size:14px}.compact .room-profile select{min-height:38px;font-size:14px}.compact .room-profile>div{gap:10px;margin-top:10px}.compact .room-profile .coco-button{width:171px;min-height:44px;font-size:16px}.compact .ready-button{width:352px;height:50px;font-size:22px;top:824px;left:20px}}