:root{font-family:system-ui,"Noto Sans TC",sans-serif;color:#e9f4f3;background:#101b20;color-scheme:dark}*{box-sizing:border-box}body{margin:0;padding:30px 4vw}header,footer{display:flex;justify-content:space-between;align-items:center;gap:20px}small,.eyebrow{letter-spacing:.18em;color:#a1bcb8;font-size:11px}h1{margin:8px 0 26px;font-size:34px;letter-spacing:-.04em}header>span{background:#213337;padding:10px 16px;border-radius:30px;font-size:13px}main{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:24px}.stage{position:relative;min-height:650px;background:#080f14;border:1px solid #345051;border-radius:20px;overflow:hidden}iframe{width:100%;height:100%;border:0;position:absolute;pointer-events:none}.badge{position:absolute;top:18px;left:18px;padding:10px 14px;border-radius:9px;background:#12262be0;font-size:13px;pointer-events:none}.badge span{color:#a5d9ca;margin-left:15px}aside{padding:26px;background:#1a2b2e;border:1px solid #345051;border-radius:20px}h2{font-size:26px;margin:10px 0}p{font-size:14px;line-height:1.7;color:#b4c9c5}button,input{font:inherit;border-radius:9px;padding:13px;width:100%;border:1px solid #46605d}input{margin:7px 0 12px;background:#132126}button{cursor:pointer;background:#c9eb91;color:#17261e;font-weight:650;border:0}button:disabled{opacity:.35;cursor:default}.secondary{margin-top:8px;background:#3a4b4b;color:white}.balance{display:flex;align-items:center;justify-content:space-between;padding-top:8px;border-top:1px solid #3b5352}.balance strong{font-size:36px}.balance span,.hint{font-size:12px;color:#a0b5b1}.pad{text-align:center;margin:18px 0 12px;touch-action:none;user-select:none}.pad button{width:54px;margin:3px;background:#314a4c;color:white}.pad button:active{background:#557977}.drop{background:#e3b17b}.text{background:none;color:#b5d6ca;padding:10px;font-size:12px}.notice{font-size:12px;border-top:1px solid #38504f;padding-top:18px}#message{color:#f5cf91}pre{font-size:11px;white-space:pre-wrap;line-height:1.6;max-height:160px;overflow:auto}footer{margin-top:24px;font-size:12px;color:#8da7a3}a{color:#a9cbbf}@media(max-width:900px){body{padding:20px}main{grid-template-columns:1fr}.stage{min-height:430px}aside{padding:20px}.pad{display:inline-block;width:60%}.drop{width:38%}footer{display:block}h1{font-size:29px}}
[hidden]{display:none!important}.welcome{display:flex;gap:30px;align-items:center;margin-bottom:30px}.welcome form{display:flex;align-items:center;gap:12px;min-width:520px}.welcome label{white-space:nowrap;font-size:13px}.welcome input{margin:0;width:150px}.welcome button{width:auto;white-space:nowrap}.identity-note{font-size:12px;max-width:750px}.section-line{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:18px 0}.section-line h2{font-size:23px}.section-line span{font-size:12px;color:#9cb8ad}.machine-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px}.machine-card{background:#1a2b2e;border:1px solid #3d5a53;border-radius:20px;padding:26px}.machine-card h3{font-size:25px;margin:16px 0}.machine-card .number{color:#bce788;letter-spacing:.2em;font-size:12px}.machine-card .art{height:125px;border-radius:12px;background:radial-gradient(ellipse at 50% 85%,#79cabe44,transparent 60%),linear-gradient(150deg,#254443,#132525);display:flex;align-items:center;justify-content:center;font-size:65px;font-weight:200;color:#bce788}.machine-card[data-theme="1"] .art{background:radial-gradient(ellipse at 50% 85%,#b884e844,transparent 60%),linear-gradient(150deg,#332a45,#192026);color:#cba0ff}.machine-card .tags{font-size:13px;color:#b3c9bd}.machine-card .machine-state{min-height:25px;color:#d9e8d2}.collection-group{padding:20px;background:#192a2b;border:1px solid #34504a;border-radius:12px;margin-bottom:12px}.collection-group h3{margin:0 0 14px;font-size:16px}.collection-chip{display:inline-block;border:1px solid #4a6257;border-radius:7px;padding:8px 12px;margin:0 8px 8px 0;color:#cae3c7;font-size:13px}#collection{margin-top:34px}header #identity{text-align:right;margin:12px 0}#back{text-align:left;padding-left:0;margin-bottom:14px}#machine-name{margin:0}.stage{min-height:650px}@media(max-width:900px){.welcome{display:block}.welcome form{min-width:0;flex-wrap:wrap}.machine-grid{grid-template-columns:1fr}.stage{min-height:430px}.section-line{align-items:flex-start}}

#activities{margin:30px 0}.activity-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}.activity-card{padding:24px;border:1px solid #57734f;border-radius:18px;background:linear-gradient(125deg,#243a30,#17292d)}.activity-card h3{margin:0 0 12px}.activity-reward{color:#d0ed9c;font-size:25px}.activity-card p{overflow-wrap:anywhere}.activity-disclaimer{font-size:12px;max-width:950px}#activities-refresh{width:auto;margin:0;flex-shrink:0}#activity-message{color:#f5cf91}#activity-history{margin-top:18px;color:#b4c9c5;font-size:13px}#activity-history li{margin:10px 0}.activity-countdown{font-variant-numeric:tabular-nums}@media(max-width:500px){header{align-items:flex-start;flex-wrap:wrap}.welcome input{width:100%}.welcome form{display:block}.welcome button{width:100%;margin-top:8px}.activity-card{padding:18px}.activity-grid{grid-template-columns:minmax(0,1fr)}.section-line{gap:10px}#activities-refresh{max-width:135px}header #identity{text-align:left}.machine-card{padding:20px}}

/* Room is a viewport, never an intrinsic grid row sized by changing status text. */
body.playing-view{padding:0;overflow:hidden;overscroll-behavior:none}body.playing-view>:not(#room){display:none!important}
#room{position:fixed;z-index:20;left:var(--game-x,0px);top:var(--game-y,0px);width:var(--game-w,100vw);height:var(--game-h,100dvh);margin:0;padding:0;display:block;overflow:hidden;background:#080f14;touch-action:none;isolation:isolate;--edge-x:max(12px,env(safe-area-inset-left));--edge-r:max(12px,env(safe-area-inset-right));--edge-t:max(8px,env(safe-area-inset-top));--edge-b:max(10px,env(safe-area-inset-bottom))}
#room .stage{position:absolute;inset:0;min-height:0;width:100%;height:100%;border:0;border-radius:0;overflow:hidden}#room #game{inset:0;width:100%;height:100%;display:block;border:0}
.game-top{position:absolute;left:var(--edge-x);right:var(--edge-r);top:var(--edge-t);display:flex;align-items:center;gap:10px;height:44px;z-index:2;pointer-events:none}.game-top>*{pointer-events:auto}.game-top button{width:auto;min-width:58px;height:44px;padding:8px 12px;margin:0!important;background:#15282ee8;color:#e5f2ed;border:1px solid #48615b;font-size:13px}.machine-title{min-width:0;flex:1;display:flex;gap:10px;align-items:center;color:#e4f0e8;text-shadow:0 2px 4px #000;font-size:14px}.machine-title span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.machine-title #phase{color:#b6d7c6;font-size:12px}.game-wallet{display:flex;align-items:center;gap:8px;background:#14272ddd;border-radius:9px;padding:5px 12px;white-space:nowrap}.game-wallet span{font-size:11px}.game-wallet strong{font-size:23px}
#room #back{padding:8px 12px;text-align:center}.game-status{position:absolute;top:calc(var(--edge-t) + 48px);left:25%;right:25%;height:72px;text-align:center;pointer-events:none;text-shadow:0 2px 5px #000;overflow:hidden}.game-status #role{font-size:16px;margin:0;line-height:22px}.game-status p{font-size:12px;line-height:17px;margin:1px 0;color:#e0eee6;overflow:hidden;max-height:34px}.game-status #room-message{color:#f5cf91;white-space:nowrap;text-overflow:ellipsis}
#room .pad{position:absolute;left:var(--edge-x);bottom:var(--edge-b);margin:0;width:auto;display:block;z-index:3;filter:drop-shadow(0 2px 4px #0008)}#room .pad button{width:52px;height:48px;margin:2px;padding:0;border:1px solid #68877d;background:#1e3945e8;color:white;font-size:22px;touch-action:none}#room .pad>div{display:flex}.game-actions{position:absolute;right:var(--edge-r);bottom:var(--edge-b);width:190px;display:grid;gap:6px;z-index:3}.game-actions button{height:44px;padding:8px 10px;font-size:13px;margin:0;touch-action:manipulation}.game-actions #drop{width:100%;height:54px;font-size:17px}.game-actions button:disabled,#room .pad button:disabled{opacity:.55}
#room #ledger{position:absolute;right:var(--edge-r);top:calc(var(--edge-t) + 52px);z-index:5;width:min(460px,75%);max-height:45%;margin:0;padding:14px;background:#102126f5;border:1px solid #57716a;border-radius:12px;overflow:auto;touch-action:pan-y}
#rotate-prompt{position:absolute;inset:0;z-index:10;background:#101b20;display:grid;place-items:center;padding:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));text-align:center;touch-action:pan-y;overflow:auto}#rotate-prompt>div{max-width:420px}.rotate-icon{font-size:68px;color:#c9eb91}#rotate-prompt h2{font-size:26px}#rotate-prompt button{min-height:48px;margin-top:10px}#rotate-prompt #orientation-note{font-size:12px}
@media(max-height:500px) and (orientation:landscape){#room .pad button{width:46px;height:42px}#room .game-actions{width:156px;gap:4px}#room .game-actions button{height:40px;font-size:12px}#room .game-actions #drop{height:46px;font-size:15px}.game-status{top:calc(var(--edge-t) + 46px);left:28%;right:28%;height:56px}.game-status #role{font-size:13px;line-height:18px}.game-status p{font-size:11px;line-height:15px}.game-status #room-message{display:none}.game-top{gap:6px}.machine-title{font-size:12px;gap:5px}.machine-title #phase{display:none}.game-top button{padding:6px 8px;font-size:12px}.game-wallet{padding:4px 7px}.game-wallet span{display:none}}

#room .game-status{top:auto;bottom:var(--edge-b);height:66px;left:25%;right:25%;display:flex;flex-direction:column;justify-content:flex-end}#room .game-status #status{background:#10242bc9;border-radius:6px;padding:2px 6px;max-height:38px}@media(max-height:500px) and (orientation:landscape){#room .game-status{height:54px;left:29%;right:29%}}

/* Portrait keeps the machine clear of fingers; landscape retains its full viewport. */
#room.portrait{--controls-h:180px;--hud-h:112px}
#room.portrait .stage{top:calc(var(--edge-t) + var(--hud-h));bottom:calc(var(--edge-b) + var(--controls-h));height:auto}
#room.portrait .game-top{height:44px;gap:5px}
#room.portrait .game-top button{min-width:44px;padding:6px;font-size:11px}
#room.portrait .machine-title{font-size:12px}
#room.portrait #phase{display:none}
#room.portrait .game-wallet{gap:4px;padding:4px 6px}
#room.portrait .game-wallet strong{font-size:20px}
#room.portrait .game-wallet span{font-size:10px}
#room.portrait .game-status{top:calc(var(--edge-t) + 48px);bottom:auto;left:var(--edge-x);right:var(--edge-r);height:60px;justify-content:flex-start}
#room.portrait .game-status #role{font-size:13px;line-height:18px}
#room.portrait .game-status p{font-size:12px;line-height:17px}
#room.portrait .pad{bottom:calc(var(--edge-b) + 8px)}
#room.portrait .pad button{width:48px;height:48px}
#room.portrait .game-actions{width:calc(100% - 190px - var(--edge-r));max-width:230px;bottom:calc(var(--edge-b) + 8px);gap:6px}
#room.portrait .game-actions #drop{height:72px;font-size:18px}
#room.portrait .game-actions button{height:38px;font-size:12px}
@media(min-width:600px){#room.portrait{--controls-h:200px}#room.portrait .pad button{width:62px;height:54px}#room.portrait .game-actions{width:230px}#room.portrait .game-actions #drop{height:82px}}

/* All platform pages and dialogs: suppress double-tap zoom while preserving pan, pinch and input. */
:where(html, body, body *) { touch-action: manipulation; }