/* 手机样式独立于 PC 复刻样式。只有明确启用 mobile-ui 才生效。 */
.mobile-only { display: none !important; }
body.mobile-ui { font: 14px/1.5 var(--hei); -webkit-text-size-adjust: 100%; }
.mobile-ui .mobile-only { display: flex !important; }
.mobile-ui [hidden] { display: none !important; }
.mobile-ui #desktop { padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); }
.mobile-ui.mobile-keyboard #desktop { top: var(--visible-top); bottom: auto; height: var(--visible-height); }
.mobile-ui .xp-main { position: relative; border: 0; }
.mobile-ui #titlebar { display: none; }
.mobile-ui .masthead { order: -1; height: 58px; min-height: 58px; padding: 0 12px; }
.mobile-ui .logo { margin: 0; padding: 0; }
.mobile-ui .logo-cn { font-size: 32px; letter-spacing: 2px; }
.mobile-ui .logo-url { font-size: 10px; letter-spacing: 0; }
.mobile-ui .slogan, .mobile-ui .bamboo-left, .mobile-ui .bamboo-right { display: none; }
.mobile-ui .mast-buttons { margin-left: auto; gap: 6px; }
.mobile-ui .blue-btn { height: 40px; min-width: 48px; padding: 0 8px; font-size: 13px; }
.mobile-ui .menubar { height: 42px; min-height: 42px; padding: 0; display: flex; }
.mobile-ui .menubar .menu { flex: 1; display: flex; align-items: center; justify-content: center; padding: 0 3px; font-size: 13px; }
.mobile-ui .menubar .menu.has-dot::after { top: 8px; right: 6px; }
.mobile-ui #view { overflow: auto; overscroll-behavior: contain; }
.mobile-ui .statusbar { height: auto; min-height: 26px; font-size: 11px; }
.mobile-ui .status-label, .mobile-ui .status-right { display: none; }
.mobile-ui .status-cell { padding: 2px 6px; }
.mobile-ui #status-conn { flex: none; max-width: 38%; }
.mobile-ui .xp-btn, .mobile-ui .xp-btn.small, .mobile-ui .tool-btn,
.mobile-ui .lb-btn, .mobile-ui .tab, .mobile-ui .st-tool,
.mobile-ui .replay-bar button, .mobile-ui .home-side-btn, .mobile-ui .mail-send { min-height: 44px; height: auto; font-size: 14px; touch-action: manipulation; }
.mobile-ui input:not([type=checkbox]):not([type=radio]):not([type=file]),
.mobile-ui textarea, .mobile-ui select.sel { font-size: 16px; min-height: 44px; min-width: 0; max-width: 100%; }
.mobile-ui input[type=checkbox], .mobile-ui input[type=radio] { width: 20px; height: 20px; flex: none; }
.mobile-ui .mobile-tabs { flex: none; gap: 6px; padding: 6px 8px; background: #e9d9b3; }
.mobile-ui .mobile-tabs button { flex: 1; min-width: 0; }
.mobile-ui .mobile-tabs button.on { color: #fff; background: linear-gradient(#365d9c, #173b78); border-color: #10264a; }

/* 登录、注册与账号表单 */
.mobile-ui .front { min-height: 100%; height: auto; padding: 16px 10px; }
.mobile-ui .beian { flex-wrap: wrap; gap: 4px 10px !important; font-size: 10px !important; }
.mobile-ui .login-motto { display: none; }
.mobile-ui .login-right { align-items: stretch; min-width: 0; padding: 22px 16px; }
.mobile-ui .login-brand { margin: 0 0 20px; text-align: center; }
.mobile-ui .login-input, .mobile-ui .login-btn { margin: 0 0 14px; width: 100%; min-height: 44px; }
.mobile-ui .login-links, .mobile-ui .login-right .form-error, .mobile-ui .login-cap { margin-left: 0; flex-wrap: wrap; }
.mobile-ui .login-links a { padding: 8px 0; }
.mobile-ui .reg-page, .mobile-ui .acct-page, .mobile-ui .home-page { height: auto; min-height: 100%; overflow: visible; }
.mobile-ui .reg-panel, .mobile-ui .home-sheet { min-width: 0; width: 100%; }
.mobile-ui .reg-body, .mobile-ui .acct-body { flex-direction: column; align-items: stretch; padding: 16px 12px; gap: 18px; }
.mobile-ui .reg-avatar-col { align-self: stretch; width: 100%; display: grid; grid-template-columns: 96px minmax(0,1fr); gap: 8px 12px; align-items: start; }
.mobile-ui .reg-avatar { width: 96px; height: 96px; grid-column: 1; grid-row: 1 / 3; }
.mobile-ui .reg-avatar-col .upload-btn { width: 96px; min-height: 44px; margin: 0; font-size: 14px; grid-column: 1; grid-row: 3; }
.mobile-ui .avatar-upload-help { grid-column: 1 / -1; grid-row: 4; margin: 0; text-align: left; }
.mobile-ui .reg-avatar-col > .muted { grid-column: 2; grid-row: 1; margin: 0 !important; text-align: left; }
.mobile-ui .avatar-picks { grid-column: 2; grid-row: 2 / 4; grid-template-columns: repeat(auto-fit,44px); justify-content: start; margin: 0; max-height: 140px; overflow: auto; }
.mobile-ui .avatar-picks img { width: 44px; height: 44px; }
.mobile-ui .reg-form { width: 100%; min-width: 0; }
.mobile-ui .form-row { flex-wrap: wrap; gap: 6px; margin: 14px 0; }
.mobile-ui .form-row > label:first-child { width: 100%; text-align: left; }
.mobile-ui .form-row > .hint { flex-basis: 100%; }
.mobile-ui .form-row .text-input, .mobile-ui .reg-form .form-row .text-input { flex: 1; width: 100%; }
.mobile-ui .form-row > .reg-control { flex-basis: 100%; }
.mobile-ui .reg-form .reg-sign { width: 100% !important; max-width: 100%; flex-basis: 100%; }
.mobile-ui .reg-agree { line-height: 1.8; flex-wrap: wrap; }
.mobile-ui .birth-sel { max-width: 100%; flex-wrap: wrap; gap: 4px; }
.mobile-ui .privacy-body { padding: 12px; }
.mobile-ui .danger-zone { flex-wrap: wrap; }
.mobile-ui .home-facts { width: 100%; padding: 0 12px; grid-template-columns: 40% minmax(0, 1fr); overflow-wrap: anywhere; }
/* 手机主页：「私信 / 对战 / 返回」紧跟名字，不放在最底下 */
.mobile-ui .home-title { order: -3; }
.mobile-ui .home-av, .mobile-ui .home-name, .mobile-ui .home-sign { order: -2; }
.mobile-ui .home-side { position: static; flex-direction: row; flex-wrap: wrap; justify-content: center; order: -1; margin: 10px 0 0; }
.mobile-ui .home-more { margin-top: 14px; justify-content: center; }
.mobile-ui .home-actions { flex-wrap: wrap; justify-content: center; padding: 0 10px; }
.mobile-ui .home-games { max-width: 100%; width: 100%; flex-direction: column; padding: 0 10px; }
.mobile-ui .home-strip-box, .mobile-ui .same-name-list { width: 100%; max-width: 100%; }
.mobile-ui .home-sign { padding: 0 12px; overflow-wrap: anywhere; text-align: center; }
.mobile-ui .home-more { padding: 18px 16px 0; }
.mobile-ui .home-more button { min-height: 32px; font-size: 13px; }

/* 大厅在同一实例内切换棋桌、棋友与聊天，输入和房间选择保留。 */
.mobile-ui .lobby { display: flex; flex-direction: column; height: 100%; min-height: 320px; }
.mobile-ui .lobby-strip { flex: none; overflow-x: auto; min-height: 54px; padding: 3px 8px; border-width: 1px; }
.mobile-ui .strip-rank { width: auto; margin-right: 12px; }
.mobile-ui .strip-top { flex: none; padding: 0 6px; }
.mobile-ui .lobby-tables { flex: 1; min-height: 0; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); padding: 16px 6px; }
.mobile-ui .gtable .cap .stand { display: inline-flex; align-items: center; min-height: 44px; padding: 0 6px; }
.mobile-ui .lobby-side { flex: 1; min-height: 0; overflow-y: auto; border: 0; }
.mobile-ui .lobby-side .side-scroll { overflow: visible; }
/* 手机上先看在线棋手和好友，房间列表放后面 */
.mobile-ui .lobby-side > .side-scroll { flex: none; order: 1; }
.mobile-ui .lobby-side > .side-head-rooms, .mobile-ui .lobby-side > .tree { order: 2; }
.mobile-ui .me-links { display: flex; flex-wrap: wrap; gap: 6px 16px; }
.mobile-ui .me-links .link, .mobile-ui .tree .troom, .mobile-ui .tree .zone, .mobile-ui .plist .p { min-height: 44px; display: flex; align-items: center; }
.mobile-ui .tree, .mobile-ui .plist { font-size: 14px; }
.mobile-ui .freq-link { min-height: 44px; font-size: 14px; }
.mobile-ui .freq-item .xp-btn { height: 34px; padding: 0 12px; font-size: 13px; }
.mobile-ui .lobby-bottom { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.mobile-ui .lobby-chat { flex: 1; min-height: 0; }
.mobile-ui .chat-log { font-size: 14px; }
.mobile-ui .chat-input { flex-wrap: wrap; }
.mobile-ui .chat-input select.sel { width: 90px; }
.mobile-ui .chat-input .text-input { width: 100px; }
.mobile-ui .resume-bar { margin: 0; flex: none; }
.mobile-ui .lobby-quick { display: flex !important; gap: 8px; padding: 8px 8px 0; flex: none; }
.mobile-ui .lobby-quick .xp-btn { flex: 1; min-height: 44px; font-size: 16px; }
.mobile-ui .lobby-quick[hidden], .mobile-ui .lobby:not([data-panel=tables]) .lobby-quick { display: none !important; }
/* 有人的桌子在前；空桌默认收成一行，点「显示全部」再展开 */
.mobile-ui .lobby-tables .gtable.busy { order: -1; }
.mobile-ui .lobby-tables:not(.show-free) .gtable.free { display: none; }
.mobile-ui .lobby-tables > .empty-tables { order: 1; display: flex !important; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px; grid-column: 1 / -1; padding: 14px 8px; color: #dfe8ff; font-size: 15px; }
.mobile-ui .lobby-tables > .empty-tables[hidden] { display: none !important; }
.mobile-ui .lobby-tables > .empty-tables .xp-btn { min-height: 40px; min-width: 72px; }
.mobile-ui .lobby-tables { align-content: start; }
.mobile-ui .lobby:not([data-panel=tables]) .lobby-tables,
.mobile-ui .lobby:not([data-panel=players]) .lobby-side,
.mobile-ui .lobby:not([data-panel=chat]) .lobby-bottom { display: none; }

/* 对局：计时与双方棋手在上，棋盘始终按宽度显示，工具在下。 */
.mobile-ui .room { height: auto; min-height: 100%; flex-direction: column; justify-content: flex-start; padding-bottom: 8px; }
.mobile-ui .room-left { width: 100%; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 6px; padding: 6px 8px 0; }
.mobile-ui .room-left .spacer { display: none; }
/* 棋手卡片压成两行：头像｜名字　时间 / 提子　读秒，给棋盘让出高度 */
.mobile-ui .pcard { min-width: 0; padding: 4px 6px; display: grid; grid-template-columns: 28px minmax(0,1fr) auto; grid-template-rows: auto auto; gap: 0 6px; align-items: center; box-shadow: none; text-align: left; }
.mobile-ui .pcard::before, .mobile-ui .pcard::after, .mobile-ui .pcard .corner-b,
.mobile-ui .pcard .rec, .mobile-ui .pcard .rk, .mobile-ui .pcard .card-chat { display: none; }
.mobile-ui .pcard .av-wrap { width: 28px; height: 28px; margin: 0; grid-row: 1 / 3; grid-column: 1; }
.mobile-ui .pcard .av-wrap img { width: 28px; height: 28px; border-width: 1px; }
.mobile-ui .pcard .stone-badge { width: 13px; height: 13px; left: -4px; bottom: -3px; }
.mobile-ui .pcard .nm { margin: 0; font-size: 13px; grid-column: 2; grid-row: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mobile-ui .pcard .clk { font-size: 17px; letter-spacing: 0; grid-column: 3; grid-row: 1; }
.mobile-ui .pcard .caps { grid-column: 2; grid-row: 2; font-size: 11px; line-height: 14px; }
.mobile-ui .pcard .byo { grid-column: 3; grid-row: 2; text-align: right; min-height: 14px; font-size: 11px; line-height: 14px; white-space: nowrap; }
.mobile-ui .pcard.to-move { box-shadow: inset 0 0 0 2px #fff6a6; }
/* 对局信息并成一行：规则、手数、观战人数；对局室编号在页面标题里 */
.mobile-ui .room-info { grid-column: 1 / -1; grid-row: 2; padding: 0; font-size: 12px; display: flex; align-items: center; gap: 6px; flex-wrap: nowrap; white-space: nowrap; min-width: 0; }
.mobile-ui .room-info > .room-no { display: none; }
.mobile-ui .room-info > div { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.mobile-ui .room-info > .room-progress { flex: none; }
/* 手机上对局类型放在这一行最前面，省去「对局信息：」 */
.mobile-ui .room-info > .kind-tag { flex: none; margin: 0; font-size: 13px; line-height: 20px; padding: 0 4px 0 6px; letter-spacing: 2px; }
.mobile-ui .room-info .info-label { display: none; }
.mobile-ui .watch-count { min-height: 36px; padding: 0 4px; margin-left: auto; flex: none; }
.mobile-ui .room-board, .mobile-ui .room.watch .room-board { flex: none; width: 100%; padding: 4px; }
.mobile-ui .board-holder { height: auto; }
.mobile-ui .board-svg { touch-action: manipulation; -webkit-user-select: none; user-select: none; }
.mobile-ui .board-banner { pointer-events: none; max-width: 96%; white-space: normal; padding: 4px 8px; text-align: center; }
.mobile-ui .mobile-game-actions { gap: 6px; padding: 4px 8px; flex-wrap: wrap; }
.mobile-ui .board-confirm { gap: 6px; flex: 1; padding: 0; min-width: 210px; }
.mobile-ui .board-confirm .primary { flex: 1; min-width: 0; }
.mobile-ui .board-confirm .primary.hint:disabled { color: #b01818; }
.mobile-ui .board-confirm .small { min-width: 48px; }
.mobile-ui .mobile-game-actions > button { min-width: 56px; }
.mobile-ui .room.watch .mobile-game-actions > .board-confirm { flex-basis: 100%; } /* 观战、看棋谱试下时选点单独一行 */
/* 对方的申请占满棋盘下面那一行，先答复再落子 */
.mobile-ui .mobile-game-actions.has-req > :not(.req-box) { display: none !important; }
.mobile-ui .mobile-game-actions > .req-box { flex: 1 1 100%; margin: 0; padding: 4px 8px; flex-wrap: nowrap; font-size: 15px; }
.mobile-ui .mobile-game-actions > .req-box .req-acts { flex: none; flex-basis: auto; }
.mobile-ui .mobile-game-actions > .req-box .req-acts .xp-btn { min-width: 64px; height: 40px; }
.mobile-ui .mobile-game-actions > .req-box .req-sub { display: none; }
.mobile-ui .mobile-game-actions .flash { animation: flash 1s steps(2) infinite; }
.mobile-ui .room-right { width: 100% !important; padding: 0 8px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 4px; }
.mobile-ui .room-right > :not(.lb-btn) { grid-column: 1 / -1; }
.mobile-ui .room > .mobile-tabs { order: -10; padding: 4px 8px; }
.mobile-ui .room-right > [data-key=draw] { grid-column: 1 / -1; }
.mobile-ui .room-right > [data-key=pass] { display: none; } /* 手机棋盘下面已经有「停一手」 */
.mobile-ui .room-right > .score-box { order: -2; }
.mobile-ui .room-right > .replay-controls { order: -1; }
/* 手机上「试下」和翻手键排成一行，紧跟棋盘 */
.mobile-ui .replay-bar { flex-wrap: nowrap; }
.mobile-ui .replay-bar button { min-width: 0; }
.mobile-ui .replay-bar .replay-trial { flex: 1.8 1 0; height: auto; letter-spacing: 0; }
.mobile-ui .tab-body { height: 180px; flex: none; }
.mobile-ui .movelist { font-size: 14px; }
.mobile-ui .movelist .mv { min-height: 40px; display: flex; align-items: center; }
.mobile-ui .navy-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.mobile-ui .navy-grid button { font-size: 24px; min-height: 44px; }
.mobile-ui .watch-tools { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
.mobile-ui .watch-tools .lb-btn { min-width: 0; }
.mobile-ui .social-tools { grid-template-columns: repeat(3,minmax(0,1fr)); }
.mobile-ui .record-tools { grid-template-columns: repeat(3,minmax(0,1fr)); }
.mobile-ui .room:not([data-panel=moves]):not(.study) .room-right > .tabs,
.mobile-ui .room:not([data-panel=moves]):not(.study) .room-right > .tab-body,
.mobile-ui .room:not([data-panel=tools]):not(.study) .room-right > .lb-btn,
.mobile-ui .room:not([data-panel=tools]):not(.study) .room-right > .navy-grid,
.mobile-ui .room:not([data-panel=tools]):not(.study) .watch-tools:not(.social-tools) { display: none; }
.mobile-ui .vs-panel { padding: 6px; }
.mobile-ui .vs-info { font-size: 12px; }
/* 看棋谱、观战：头像缩小放在名字和计时左边（带执黑执白的标记），不多占高度 */
.mobile-ui .vs-side { display: grid; grid-template-columns: 32px minmax(0, max-content); justify-content: center; align-items: center; column-gap: 6px; text-align: left; }
.mobile-ui .vs-side .av-wrap { width: 32px; height: 32px; margin: 0; grid-row: 1 / 3; }
.mobile-ui .vs-side img { width: 32px; height: 32px; border-width: 1px; }
.mobile-ui .vs-side .stone-badge { width: 13px; height: 13px; left: -4px; top: -4px; }
.mobile-ui .vs-side .nm { margin-top: 0; }
.mobile-ui .vs-side .clk { justify-self: start; margin-top: 2px; }
.mobile-ui .room.watch .room-right { display: contents; }
.mobile-ui .room.watch .vs-panel { order: -1; margin: 6px 8px 0; }
.mobile-ui .room.watch .room-right > :not(.vs-panel) { margin-left: 8px; margin-right: 8px; }
.mobile-ui .room.watch .score-box, .mobile-ui .room.watch .replay-controls { order: 0; }
.mobile-ui .tab-body.ai { height: auto; }
.mobile-ui .review-box { font-size: 14px; }
.mobile-ui .review-box .rv-graph { height: 84px; }
.mobile-ui .review-box .rv-cand, .mobile-ui .review-box .rv-prob { min-height: 36px; font-size: 13.5px; }
.mobile-ui .review-box .rv-switch button { height: 26px; }
.mobile-ui .review-box .rv-bar { height: 10px; }

/* 死活题：棋盘在上，题目、提示和按钮紧跟着，再是级别和练习 / 测试，记录放在最下面（电脑端是网格，这里改回一列） */
.mobile-ui .tsumego { display: flex; }
.mobile-ui .tsumego > .room-board { order: 1; }
.mobile-ui .tsumego > .tsg-info { order: 2; margin: 2px 8px 0; }
.mobile-ui .tsumego > .board-confirm { order: 2; flex: none; padding: 4px 8px; }
.mobile-ui .tsumego > .tsg-under, .mobile-ui .tsumego .room-left { display: contents; }
.mobile-ui .tsumego .tsg-under > * { order: 2; margin-left: 8px; margin-right: 8px; }
.mobile-ui .tsumego .room-left > * { order: 3; margin-left: 8px; margin-right: 8px; }
.mobile-ui .tsumego .tsg-panel { order: 4; }
.mobile-ui .tsumego .st-head { display: none; }
.mobile-ui .tsumego .tabs { order: 5; margin-top: 6px; }
.mobile-ui .tsumego .tsg-me, .mobile-ui .tsumego .tsg-recent { order: 6; }
.mobile-ui .tsumego .tsg-src { order: 7; margin-top: 4px; }
.mobile-ui .tsumego .room-left > .lb-btn { order: 8; margin-top: 0; margin-bottom: 8px; }
.mobile-ui .tsumego .tsg-status { min-height: 0; }
.mobile-ui .tsumego .tsg-actions { flex: 1; }
.mobile-ui .tsumego .tsg-actions .xp-btn { flex: 1; min-height: 40px; }
.mobile-ui .tsumego .tsg-recent { max-height: 260px; }

/* 研究仍复用同一棋盘，工具展开后也不销毁棋盘。前进后退和试下紧跟棋盘，工具和手顺在下面 */
.mobile-ui .study .room-left { order: 3; display: flex; padding: 8px; }
.mobile-ui .study .room-right { display: contents; }
.mobile-ui .study .room-right > * { order: 4; margin-left: 8px; margin-right: 8px; }
.mobile-ui .study .room-right > .st-nav { order: 1; margin-top: 2px; }
.mobile-ui .study .room-right > .lb-btn { order: 5; margin-bottom: 8px; }
.mobile-ui .study > .board-confirm { flex: none; padding: 4px 8px; }
.mobile-ui .study:not([data-panel=tools]) .study-left > :not(.st-turn):not(.st-count),
.mobile-ui .study:not([data-panel=moves]) .room-right > :not(.st-nav):not(.lb-btn) { display: none; }
.mobile-ui .study .st-tools { grid-template-columns: repeat(4,minmax(0,1fr)); }
.mobile-ui .study .st-tool { padding: 4px; }
.mobile-ui .study .st-row > button { flex: 1; }
.mobile-ui .study .st-turn { min-height: 28px; }
.mobile-ui .study .st-nav { grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(0, 1.6fr); }
.mobile-ui .study .st-nav .st-trial { grid-column: auto; height: auto; letter-spacing: 0; }

/* 弹窗与对局聊天跟随软键盘上方的可见区域，不依赖鼠标拖动。 */
.mobile-ui .modal-mask { right: auto; bottom: auto; left: var(--visible-left,0px); top: var(--visible-top,0px); width: var(--visible-width,100vw); height: var(--visible-height,100dvh); padding: 8px; }
.mobile-ui .modal-mask > .xp-win { position: relative !important; left: auto !important; top: auto !important; transform: none !important; max-width: 100%; max-height: 100%; display: flex; flex-direction: column; }
.mobile-ui .xp-win-title { height: 44px; min-height: 44px; cursor: default; }
.mobile-ui .xp-close { width: 36px; height: 36px; }
.mobile-ui .xp-close::before, .mobile-ui .xp-close::after { top: 16px; left: 10px; width: 14px; }
.mobile-ui .xp-win .xp-min, .mobile-ui .xp-resize-handle { display: none; }
.mobile-ui .xp-dock { display: none; } /* 手机上没有最小化；切到手机布局时收着的小窗自动还原（ui.js） */
.mobile-ui .xp-win-body { overflow: auto; min-height: 0; }
.mobile-ui .xp-win.collapsed .xp-win-body { display: block; }
.mobile-ui .dlg-content { padding: 16px 12px; gap: 10px; }
.mobile-ui .dlg-icon, .mobile-ui .dlg-avatar { width: 36px; height: 36px; align-self: flex-start; }
.mobile-ui .dlg-msg { min-width: 0; overflow-wrap: anywhere; font-size: 14px; }
.mobile-ui .dlg-buttons { padding: 0 12px 14px; gap: 8px; flex-wrap: wrap; }
.mobile-ui .dlg-buttons .xp-btn { min-width: 0; flex: 1; padding: 4px 10px; }
.mobile-ui .dlg .row { flex-wrap: wrap; }
.mobile-ui .dlg .row > label:first-child { text-align: left; width: auto; }
.mobile-ui .dlg .row .text-input { min-width: 100px; }
.mobile-ui .dlg .skin-row .skin-pick { flex-basis: 100%; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.mobile-ui .dlg .help-text { max-height: none; overflow: visible; }
.mobile-ui .login-dlg .dlg-buttons { display: none; }
.mobile-ui .login-dlg .dlg-content { padding: 0; }
.mobile-ui .chat-win { position: fixed; z-index: 60; left: calc(var(--visible-left,0px) + 8px) !important; top: auto !important; bottom: max(env(safe-area-inset-bottom), calc(100% - var(--visible-top,0px) - var(--visible-height,100dvh) + 8px)); width: calc(var(--visible-width,100vw) - 16px) !important; height: min(420px, calc(var(--visible-height,100dvh) - 16px)) !important; max-width: 600px; }
.mobile-ui .chat-win .xp-win-body { display: flex !important; }
.mobile-ui .gchat-input { gap: 6px; padding: 6px; align-items: flex-end; }
.mobile-ui .gchat-text { height: 64px; flex: 1; font-weight: normal; }
.mobile-ui .gchat-input .xp-btn { flex: none; min-width: 64px; }
.mobile-ui .gchat-log { padding: 8px 10px; }
.mobile-ui .gchat-status { padding: 4px 8px; }
.mobile-ui .menu-pop { max-width: calc(var(--visible-width,100vw) - 8px); max-height: calc(var(--visible-height,100dvh) - 8px); overflow: auto; }
.mobile-ui .menu-item { min-height: 44px; display: flex; align-items: center; font-size: 14px; white-space: normal; }
.mobile-ui #toasts { top: calc(var(--visible-top,0px) + 104px); right: 8px; max-width: calc(100vw - 16px); }
.mobile-ui .pm-notice { max-width: calc(100vw - 16px); }
.mobile-ui .follow-notice {
  left: calc(var(--visible-left,0px) + 8px); right: auto;
  top: calc(var(--visible-top,0px) + max(8px, env(safe-area-inset-top))); bottom: auto;
  width: calc(var(--visible-width,100vw) - 16px); max-width: 600px;
  border-radius: 14px; padding: 10px 12px;
  animation-name: follow-mobile-enter;
}
.mobile-ui .follow-close { min-width: 44px; min-height: 44px; }
.mobile-ui .follow-avatar { width: 36px; height: 36px; }
.mobile-ui .follow-content { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 0 8px; }
.mobile-ui .follow-content > :not(button) { grid-column: 1; }
.mobile-ui .follow-title, .mobile-ui .follow-content .muted { font-size: 11px; }
.mobile-ui .follow-message { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin: 0; }
.mobile-ui .follow-content .xp-btn { grid-column: 2; grid-row: 1 / span 3; align-self: center; margin: 0; padding: 4px 8px; font-size: 12px; }
.mobile-ui .follow-notice.special-follow-notice { max-width: 420px; padding: 0; border-radius: 7px 7px 2px 2px; }
.mobile-ui .special-follow-notice .follow-content { display: block; }
.mobile-ui .special-follow-notice .follow-avatar { width: 44px; height: 44px; }
.mobile-ui .special-follow-notice .follow-message { white-space: normal; overflow-wrap: anywhere; font-size: 14px; }
.mobile-ui .special-follow-notice .follow-actions { padding: 2px 12px 12px; }
.mobile-ui .special-follow-notice .follow-actions .xp-btn { flex: 1; min-width: 0; }
.mobile-ui .follow-notice.leaving { transform: translateY(-12px); }
@keyframes follow-mobile-enter { from { opacity: 0; transform: translateY(-12px); } to { opacity: 1; transform: translateY(0); } }
.mobile-ui .verdict { padding: 12px; }
.mobile-ui .vd-head { gap: 10px; }
.mobile-ui .vd-reason { font-size: 24px; }
.mobile-ui .vd-social .xp-btn { flex: 1 0 auto; padding: 0 12px; }
.mobile-ui .finder-card { gap: 10px; padding: 10px; }
.mobile-ui .finder-card .nm { font-size: 18px; gap: 10px; }

/* 列表保留全部字段，表格可横向滚动；筛选与标题在屏内。 */
.mobile-ui .rank-page, .mobile-ui .records-page, .mobile-ui .acct-page { padding: 12px 8px; }
.mobile-ui .rank-head { flex-wrap: wrap; align-items: center; gap: 10px; }
.mobile-ui .rank-head h2 { font-size: 26px; }
.mobile-ui .rank-tabs { margin: 0; flex-wrap: wrap; }
.mobile-ui .rank-note { margin-left: 0; }
.mobile-ui .records-filter { flex-wrap: wrap; gap: 6px; }
.mobile-ui .records-filter input { width: 110px; }
.mobile-ui .rank-table, .mobile-ui .records-table { display: block; overflow-x: auto; }
.mobile-ui .rank-table td, .mobile-ui .records-table td { min-height: 44px; height: 44px; white-space: nowrap; }
.mobile-ui .mail-send-row { padding: 8px 14px 16px; }
.mobile-ui .blog-body { flex-direction: column; gap: 20px; }
.mobile-ui .blog-side { width: 100%; }
.mobile-ui .blog-top { flex-wrap: wrap; }
.mobile-ui .blog-banner { height: 160px; }
.mobile-ui .blog-banner span { font-size: 24px; }
.mobile-ui .bh-banner { height: 110px; }
.mobile-ui .blog-nav { gap: 14px; }
.mobile-ui .blog-nav a, .mobile-ui .blog-pager a, .mobile-ui .cmt-tools a, .mobile-ui .bh-tab { min-height: 44px; display: inline-flex; align-items: center; }
.mobile-ui .bh-bar { flex-direction: column; align-items: stretch; gap: 8px; }
.mobile-ui .bh-tabs { overflow-x: auto; }
.mobile-ui .bh-tab { flex: none; padding: 0 14px; }
.mobile-ui .bh-search { padding-bottom: 10px; }
.mobile-ui .bh-search .text-input { flex: 1; width: auto; min-height: 40px; }
.mobile-ui .post-row { flex-direction: column; }
.mobile-ui .post-thumb { width: 160px; }
.mobile-ui .post-meta { flex-wrap: wrap; gap: 4px 12px; }
.mobile-ui .post-adj { flex-direction: column; gap: 8px; }
.mobile-ui .post-adj a { max-width: 100%; }
.mobile-ui .cmt-input { font-size: 16px; }
.mobile-ui .cmt-send .xp-btn, .mobile-ui .bs-acts .xp-btn { min-height: 44px; }
.mobile-ui .adm-page { flex-direction: column; height: auto; min-height: 100%; }
.mobile-ui .adm-nav { width: 100%; padding: 6px; }
.mobile-ui .adm-nav-box { display: flex; flex-wrap: wrap; }
.mobile-ui .adm-nav-head, .mobile-ui .adm-nav-me { width: 100%; }
.mobile-ui .adm-nav a { flex: none; min-height: 44px; }
.mobile-ui .adm-main { padding: 12px 8px; }
.mobile-ui .adm-grid, .mobile-ui .adm-page-edit { grid-template-columns: minmax(0,1fr); }
.mobile-ui .adm-cards { grid-template-columns: repeat(2,minmax(0,1fr)); }
.mobile-ui .adm-head { flex-wrap: wrap; }
.mobile-ui .adm-check { margin-left: 0; }

@media (orientation: landscape) and (min-width: 600px) and (max-height: 560px) {
  .mobile-ui .masthead { height: 44px; min-height: 44px; }
  .mobile-ui .logo-cn { font-size: 24px; }
  .mobile-ui .logo-url { display: none; }
  .mobile-ui .room-board { max-width: 520px; align-self: start; }
  .mobile-ui .room { display: grid; grid-template-columns: minmax(240px, 1fr) minmax(260px, 1fr); align-content: start; align-items: start; }
  .mobile-ui .room > .room-board { grid-column: 1; grid-row: 1 / span 6; }
  .mobile-ui .room > .room-left, .mobile-ui .room > .mobile-game-actions, .mobile-ui .room > .room-right,
  .mobile-ui .room > .mobile-tabs, .mobile-ui .room > .board-confirm,
  .mobile-ui .study .room-right > *, .mobile-ui .tsumego .room-left > *, .mobile-ui .tsumego .tsg-under > *, .mobile-ui .tsumego > .tsg-info { grid-column: 2; }
  .mobile-ui .room.watch .room-right { display: grid; }
  .mobile-ui .room.watch .vs-panel { order: -3; margin: 0; }
  .mobile-ui .study .room-left { order: 0; }
  .mobile-ui .room.watch .room-right > :not(.vs-panel) { margin-left: 0; margin-right: 0; }
}

/* 第一轮体验改进：复用原配色，主要动作留在屏内。 */
.mobile-ui .reg-form .form-row > label.reg-agree { display: block; width: 100%; max-width: 100%; min-width: 0; line-height: 1.8; }
.mobile-ui .reg-agree input { vertical-align: middle; }
.mobile-ui .reg-agree a { display: inline-block; white-space: nowrap; }
.mobile-ui .desktop-game-list { display: none; }
.mobile-ui .game-cards { flex-direction: column; gap: 10px; width: 100%; }
.mobile-ui .game-card { min-width: 0; padding: 12px; background: var(--cream-2); border: 1px solid var(--tan-line); color: var(--navy-deep); }
.mobile-ui .game-card-players { display: grid; gap: 6px; }
.mobile-ui .game-card-player { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: baseline; gap: 8px; }
.mobile-ui .game-card-player a { font-weight: bold; overflow-wrap: anywhere; }
.mobile-ui .game-card-color { font-weight: bold; }
.mobile-ui .game-card-player small { white-space: nowrap; }
.mobile-ui .game-card-summary { margin-top: 8px; font-weight: bold; overflow-wrap: anywhere; }
.mobile-ui .game-card-meta { margin: 4px 0 10px; font-size: 12px; font-variant-numeric: tabular-nums; }
.mobile-ui .game-card-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.mobile-ui .game-card-actions a { display: inline-flex; align-items: center; justify-content: center; min-width: 80px; text-decoration: none; white-space: nowrap; }
.mobile-ui .game-card-details { margin-top: 6px; }
.mobile-ui .game-card-details summary { padding: 12px 0; min-height: 44px; cursor: pointer; }
.mobile-ui .game-card-details p { margin: 0 0 4px; overflow-wrap: anywhere; }
.mobile-ui .game-card-details a { min-height: 44px; display: inline-flex; align-items: center; }
.mobile-ui .game-card :focus-visible { outline: 2px solid var(--blue-text); outline-offset: 2px; }

/* 手机私信跟随可见区域；内容独立滚动，回信和发送保持可达。 */
.mobile-ui .mail-window {
  position: fixed !important; left: calc(var(--visible-left,0px) + 8px) !important; top: calc(var(--visible-top,0px) + 8px) !important;
  width: calc(var(--visible-width,100vw) - 16px) !important; height: min(680px, calc(var(--visible-height,100dvh) - 16px)) !important;
  max-width: none; max-height: none;
}
.mobile-ui .mail-window .mail-send-row { padding: 6px 8px 8px; }
/* 手机上先列出对话，点进去再看往来 */
.mobile-ui .pm-threads { width: 100%; border-right: none; }
.mobile-ui .pm-sheet[data-pane="list"] .pm-chat, .mobile-ui .pm-sheet[data-pane="chat"] .pm-threads { display: none; }
.mobile-ui .pm-back { display: inline-flex; align-items: center; justify-content: center; flex: none; min-height: 36px; height: 36px; padding: 0 14px; }
.mobile-ui .pm-thread { min-height: 58px; font-size: 14px; }
.mobile-ui .pm-chat-head { padding: 4px 8px; }
.mobile-ui .pm-chat-ops .link, .mobile-ui .pm-more { min-height: 44px; display: inline-flex; align-items: center; }
.mobile-ui .pm-text { height: 72px; font-size: 16px; }

/* 棋盘类页面（对局、观战、回放、研究、死活题）：页头收窄，棋盘下面的按钮留在首屏 */
.mobile-ui.board-page .masthead { height: 36px; min-height: 36px; padding: 0 10px; }
.mobile-ui.board-page .logo-cn { font-size: 20px; letter-spacing: 1px; }
.mobile-ui.board-page .logo-url { display: none; }
.mobile-ui.board-page .blue-btn { height: 28px; min-width: 40px; padding: 0 6px; font-size: 12px; }
.mobile-ui.board-page .menubar { height: 36px; min-height: 36px; }

/* 手机排行榜：名次、棋手、段位和这个榜的数字（电脑仍是完整表格） */
.mobile-ui .rank-cards { display: flex; flex-direction: column; gap: 8px; max-width: 600px; margin: 0 auto; }
.mobile-ui .rank-card { display: grid; grid-template-columns: 54px 36px minmax(0,1fr) auto; align-items: center; gap: 8px; min-height: 56px; padding: 6px 10px; background: var(--cream-2); border: 1px solid var(--tan-line); color: var(--navy-deep); }
.mobile-ui .rank-card .place { font: bold italic 15px Georgia, "Times New Roman", serif; color: #6b5a3a; }
.mobile-ui .rank-card.p1 .place { color: #b8860b; }
.mobile-ui .rank-card.p2 .place { color: #7d7d7d; }
.mobile-ui .rank-card.p3 .place { color: #a0522d; }
.mobile-ui .rank-card img { width: 36px; height: 36px; border: 1px solid #8a6a2a; background: #fff; object-fit: cover; }
.mobile-ui .rank-card .nm { font: bold 15px var(--hei); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.mobile-ui .rank-card .nm a { color: #1238b8; text-decoration: none; }
.mobile-ui .rank-card .sub { font: 12px var(--hei); color: #4f3b18; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.mobile-ui .rank-card .num { display: flex; flex-direction: column; align-items: flex-end; }
.mobile-ui .rank-card .num b { font: bold 18px Tahoma, sans-serif; color: #172a6e; }
.mobile-ui .rank-card .num small { font: 11px var(--hei); color: #4f3b18; }

/* 手机注册：选填资料收起 */
.mobile-ui .reg-optional { margin: 14px 0; }
.mobile-ui .reg-optional > summary { display: flex; align-items: center; gap: 6px; min-height: 44px; font: bold 15px var(--hei-b); color: #111; cursor: pointer; list-style: none; }
.mobile-ui .reg-optional > summary::-webkit-details-marker { display: none; }
.mobile-ui .reg-optional > summary::before { content: "▸"; font-size: 13px; color: #4a3a1c; }
.mobile-ui .reg-optional[open] > summary::before { content: "▾"; }
.mobile-ui .reg-optional > summary::after { content: "性别、年龄、生日、星座、婚姻状况"; font: 12px var(--hei); color: #4a3a1c; }
.mobile-ui .reg-optional[open] > summary { margin-bottom: -6px; }

/* 围棋入门：棋盘占满宽度，讲解在下 */
.mobile-ui .learn-page { padding: 8px; }
.mobile-ui .learn { flex-direction: column; justify-content: flex-start; height: auto; min-height: 0; gap: 6px; font: 15px/1.7 var(--hei); }
/* 课名、讲解、题目在棋盘上面，对错和按钮紧跟棋盘下面 */
.mobile-ui .learn-side { display: contents; }
.mobile-ui .learn-head { order: 1; padding: 0 4px; }
.mobile-ui .learn-intro { order: 2; font-size: 14px; }
.mobile-ui .learn-q { order: 3; padding: 0 4px; }
.mobile-ui .learn-turn { order: 4; padding: 0 4px; }
.mobile-ui .learn-board { order: 5; flex: none; }
.mobile-ui .learn-choices { order: 6; padding: 0 4px; }
.mobile-ui .learn-fb { order: 7; padding: 0 4px; }
.mobile-ui .learn-acts { order: 8; padding: 0 4px 8px; }
.mobile-ui .learn-choices .xp-btn, .mobile-ui .learn-acts .xp-btn { min-height: 44px; min-width: 88px; }
.mobile-ui .learn-row { min-height: 44px; }