/* A single viewport: two parts board, one part controls. Desktop DOM is restored on exit. */
#mobile-workspace[hidden]{display:none!important}
body.mobile-duel{height:100dvh;overflow:hidden;overscroll-behavior:none}
body.mobile-duel>main,body.mobile-duel>.topbar,body.mobile-duel>#online-panel,body.mobile-duel>#site-account-bar,body.mobile-duel>#session-notice{display:none!important}
#mobile-workspace{position:fixed;inset:0;bottom:auto;width:100%;height:var(--mobile-height,100dvh);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);display:grid;grid-template-rows:minmax(0,2fr) minmax(190px,1fr);background:#101719;z-index:25;overflow:hidden}
#mobile-workspace [hidden]{display:none!important}
#mobile-arena{min-height:0;display:flex;flex-direction:column;overflow:hidden;background:radial-gradient(ellipse at 30% 25%,#19302c44,transparent 70%)}
.mobile-hud{display:flex;align-items:center;align-self:center;gap:6px;flex-shrink:0;width:fit-content;max-width:100%;height:30px;min-height:30px;padding:0 6px;border:1px solid #2a3b3d;border-top:0;border-radius:0 0 8px 8px;font-size:10px;line-height:1.2;color:#bdcbc5;white-space:nowrap}
#mobile-round{font-weight:500;white-space:nowrap;color:#83c9ba}#mobile-turn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#mobile-turn.urgent{color:#ffa48f;font-weight:700}
#mobile-help,.mobile-hud #layout-button{border:0;background:transparent;border-radius:4px;width:28px;height:28px;min-height:28px;padding:0;flex-shrink:0;color:#bdcbc5}
.mobile-hud #layout-button{font-size:0;order:1}.mobile-hud #layout-button::after{content:'⤢';font-size:18px}#mobile-help{order:2;font-size:13px}
.mobile-duel #mobile-arena .board-shell{display:flex;flex-direction:column;flex:1;min-height:0;margin:0;border:0;border-radius:0;background:transparent}
.mobile-duel .board-toolbar{display:none}
.mobile-duel .board-wrap{flex:1;min-height:0;overflow:hidden;display:flex;align-items:stretch}
.mobile-duel #board,.mobile-duel #board.portrait{display:block;width:100%;height:100%;max-height:none;min-height:0;flex:1;touch-action:none}
.mobile-duel #board.portrait .node-body{r:30px}.mobile-duel #board.portrait .core-ring{r:36px}.mobile-duel #board.portrait .generalized-ring{r:34px}.mobile-duel #board.portrait .threat-ring{r:40px}
.mobile-duel #board.portrait .node-text{font-size:23px}.mobile-duel #board.portrait .tuple-text{font-size:19px}.mobile-duel #board.portrait .hp-text{font-size:12px;transform:translateY(-20px)}.mobile-duel #board.portrait .edge-label{font-size:12px}
.mobile-duel .board-footer{display:flex;flex-wrap:nowrap;gap:7px;flex-shrink:0;justify-content:center;padding:4px 5px;min-height:20px;font-size:8px;background:#101719;border-top:1px solid #24332f}.mobile-duel .board-footer .core-legend{display:none}.mobile-duel .legend-dot{width:5px;height:5px;margin-right:3px}
#mobile-dock{display:flex;flex-direction:column;min-height:0;border-top:2px solid #5e9e8d;background:#172225;box-shadow:0 -5px 24px #0003;overflow:hidden}
.mobile-tabs{display:grid;grid-template-columns:repeat(4,1fr);flex-shrink:0;height:40px;border-bottom:1px solid #31433e;background:#13201e}
.mobile-tabs button{font-size:13px;font-weight:600;color:#98aea6;background:transparent;border:0;border-bottom:2px solid transparent;padding:8px}
.mobile-tabs button[aria-selected=true]{color:#aff1dc;background:#233a32;border-bottom-color:#87d7c0}.mobile-tabs button:disabled{opacity:.35}
.mobile-dock-summary{display:flex;justify-content:space-between;gap:8px;padding:4px 10px;flex-shrink:0;line-height:1.3;font-size:10px;color:#adc6bb}.mobile-dock-summary>span+span{color:#748d83}
.mobile-dock-content{flex:1;min-height:0;overflow:hidden}
.mobile-dock-content>[role=tabpanel]{height:100%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#50665c transparent;padding:6px 10px;scroll-padding:8px}
#mobile-actions{display:grid;grid-template-columns:minmax(90px,1fr) minmax(160px,2fr);gap:8px;padding:5px 10px 6px;flex-shrink:0;border-top:1px solid #304139;background:#15201d}
#mobile-actions #end-button{width:100%;margin:0;min-height:38px;padding:9px 13px;border-radius:6px;font-size:13px;background:#a8d9c6;color:#122820}
#mobile-actions #undo-button{width:100%;margin:0;font-size:11px;min-height:38px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mobile-duel .panel{margin:0;padding:0;border:0}.mobile-duel .step{display:none}
#mobile-cards .cards-panel{display:grid;grid-template-columns:100px minmax(0,1fr);gap:5px 8px;align-items:start}
#mobile-cards .section-heading,#mobile-cards #hand-count{display:none}
#mobile-cards #hand{grid-column:1/-1;grid-row:1;display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:64px;justify-content:start;gap:6px;overflow-x:auto;overscroll-behavior-x:contain;margin:0;padding:0 0 3px;scrollbar-width:thin;min-height:55px}
#mobile-cards .hand-card{min-height:52px;height:52px;border-radius:6px;padding:3px 4px;gap:1px;justify-content:center}
#mobile-cards .hand-card small{font-size:8px}#mobile-cards .hand-card strong{font-size:18px}#mobile-cards .hand-card.tuple strong{font-size:11px}#mobile-cards .hand-card.defense strong{font-size:12px}#mobile-cards .hand-card span{display:none}
#mobile-cards .empty-hand{grid-column:1/-1;min-width:270px;margin:4px 0;font-size:11px}
#mobile-cards .segmented{grid-column:1;grid-row:2;display:flex;margin:0;height:38px}#mobile-cards .segmented button{padding:3px;flex:1;font-size:10px}
#mobile-cards #create-form{display:contents}#mobile-cards #number-fields,#mobile-cards #tuple-fields{grid-column:2;grid-row:2}
#mobile-cards label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
#mobile-cards input{font-size:16px;height:38px;min-height:38px;margin:0;padding:6px 10px;border-radius:6px}
#mobile-cards .tuple-inputs{gap:5px}#mobile-cards .tuple-inputs span{font-size:16px}
#mobile-cards #create-button{grid-column:1/-1;grid-row:3;min-height:35px;padding:8px 12px;margin:0;border-radius:6px;font-size:12px}
#mobile-cards #form-status{grid-column:1/-1;grid-row:4;padding:0;margin:0;font-size:10px;line-height:1.4;min-height:0}
#mobile-relations .section-heading{margin:0 0 8px}#mobile-relations h3{font-size:13px}#mobile-relations .selected-heading{margin-bottom:6px}#mobile-relations .node-detail{margin:4px 0;font-size:11px}
#mobile-relations button{min-height:36px}#mobile-relations input{font-size:16px;min-height:36px;padding:6px}.mobile-duel .microcopy{font-size:11px;line-height:1.5}
#mobile-info>nav{display:flex;justify-content:space-between;gap:10px;margin:0 0 10px}#mobile-info>nav button{min-height:36px;font-size:12px}
#mobile-info .arena-heading{margin:8px 0}#mobile-info .arena-heading>div:first-child{display:none}#mobile-info .round-box{display:flex;align-items:center;gap:8px;padding:0;border:0}#mobile-info .round-box strong{font-size:22px}#mobile-info .round-box small{display:block}
#mobile-info .turn-card{padding:8px 0}#mobile-info .turn-card .eyebrow{display:none}#mobile-info .turn-title h2{font-size:16px}#mobile-info .turn-title #energy{font-size:22px}#mobile-info .turn-card p{min-height:0;font-size:12px}
#mobile-info .base-panel{padding:10px 0;border-top:1px solid #304139}#mobile-info .base-panel h3{font-size:13px}
#mobile-info .scoreboard{margin:8px 0;gap:6px}#mobile-info .player-card{padding:8px}#mobile-info .player-name{font-size:12px}#mobile-info .player-mark{display:none}
#mobile-info .bottom-grid{display:block;margin:8px 0}#mobile-info .journal{display:block;margin:8px 0;padding:8px 0}#mobile-info .explain-card{padding:10px 0}#mobile-info .watch-entry{margin:10px 0;padding:10px}#mobile-info .watch-start{padding:8px 10px}
#mobile-info #spectator-controls{flex-wrap:wrap;margin:8px 0}#mobile-info .watch-playback,#mobile-info .watch-run{flex-wrap:wrap}#mobile-info .mode-note{margin:12px 0}
#mobile-info #session-notice{margin:5px 0;padding:8px}#mobile-info #hand-rule{font-size:11px;line-height:1.6;margin:8px 0}
#mobile-room #site-account-bar{padding:0 0 8px;margin:0 0 8px;gap:7px;font-size:11px;background:transparent;z-index:auto}#mobile-room #site-account-bar button{font-size:11px;min-height:34px;padding:5px 8px}#mobile-room #site-account-bar span{flex-basis:100%;font-size:10px}
#mobile-room #online-panel{margin:0;padding:0;border:0;background:transparent;gap:7px;font-size:12px}#mobile-room #online-panel strong{flex-basis:100%;font-size:13px;margin:0}#mobile-room #online-panel button{font-size:12px;min-height:36px;padding:7px 9px}#mobile-room #online-code{min-height:38px;font-size:16px;width:130px;min-width:90px;flex:1}#mobile-room #online-status{font-size:11px;margin:3px 0;line-height:1.5}
.mobile-duel #toast{z-index:50;bottom:calc(33.333dvh + 10px);max-width:90vw;font-size:12px}
.mobile-duel dialog{max-height:85dvh;overflow:auto}.mobile-duel dialog input{font-size:16px}
@media (max-height:500px){#mobile-workspace{grid-template-rows:minmax(0,1fr) 190px}.mobile-hud{min-height:26px}.mobile-duel .board-footer{display:none}.mobile-dock-summary{padding-top:1px;padding-bottom:1px}.mobile-tabs{height:34px}#mobile-actions{padding-top:3px;padding-bottom:3px}#mobile-actions #end-button,#mobile-actions #undo-button{min-height:32px;padding-top:6px;padding-bottom:6px}}
@media (max-height:650px){
  .mobile-duel #board.portrait .node-body{r:19px}
  .mobile-duel #board.portrait .core-ring{r:23px}
  .mobile-duel #board.portrait .generalized-ring{r:22px}
  .mobile-duel #board.portrait .threat-ring{r:25px}
  .mobile-duel #board.portrait .node-text{font-size:17px}
  .mobile-duel #board.portrait .tuple-text{font-size:13px}
  .mobile-duel #board.portrait .hp-text{font-size:10px;transform:translateY(-35px)}
  .mobile-duel #board.portrait .graph-node rect{transform:translateY(-7px)}
}

.mobile-local-modes{padding:0 0 8px;margin-bottom:8px;border-bottom:1px solid #304139;font-size:12px}
.mobile-local-modes>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:7px}
.mobile-local-modes button{min-height:36px;padding:6px 4px;font-size:12px;border:1px solid #49645c;border-radius:6px;background:#213b33;color:#c6e9db}
.mobile-local-modes p{margin:6px 0 0;font-size:10px;line-height:1.5;color:#98aea6}

.mobile-dock-summary{align-items:center;min-height:38px;padding:2px 10px}
#mobile-energy{white-space:nowrap}
#mobile-upgrade{display:flex;align-items:center;gap:5px;min-width:0;color:#d9c99c}
#mobile-base-level{font-size:10px;white-space:nowrap}
#mobile-upgrade #upgrade-button{min-height:34px;padding:6px 8px;font-size:11px}

.mobile-ai-setting{display:flex;align-items:center;gap:8px;margin:8px 0;color:#bdcbc5;font-size:11px}.mobile-ai-setting select{flex:1;min-width:0;min-height:36px;background:#142321;color:#dceae4;border:1px solid #49645c;border-radius:5px;padding:5px;font-size:16px}