/* Phone play screen (portrait, auction theme): seat paddles on top, the dial in the middle,
   a large stage for the price reveal, and every action in the thumb zone.
   Design: "对局界面重设计", boards 01–04. Desktop and the classroom theme are untouched. */
.ledger-button,.game-menu-button{display:none}
@media(max-width:899px){
  /* ---------- top bar: one ⋯ menu instead of four buttons ---------- */
  .game-app[data-theme=auction]:has(#play:not([hidden])) .topbar{position:relative;z-index:31;min-height:44px}
  .game-app[data-theme=auction]:has(#play:not([hidden])) h1{font-size:18px}
  .game-app[data-theme=auction]:has(#play:not([hidden])) .topbar{grid-template-columns:minmax(0,1fr) auto auto}
  .game-app[data-theme=auction]:has(#play:not([hidden])) .game-menu-button{display:grid;place-items:center;grid-column:3;grid-row:1 / 3;width:44px;height:44px;padding:0;border:2px solid #b7833699;background:#10182099;color:#f2e2b9}
  /* 账本 sits beside ⋯, so the bottom of the screen is only the input. */
  .game-app[data-theme=auction]:has(#play:not([hidden])) .ledger-button{display:flex;align-items:center;gap:5px;grid-column:2;grid-row:1 / 3;height:44px;padding:0 10px;border:2px solid #b7833699;background:#10182099;color:#f2e2b9;font-size:14px}
  .game-app[data-theme=auction]:has(#play:not([hidden])) .ledger-button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.4}
  .game-app[data-theme=auction].ledger-open .ledger-button{border-color:#e4b75b;background:#e4b75b26}
  .game-app[data-theme=auction]:has(#play:not([hidden])) .top-actions{position:absolute;right:0;top:calc(100% + 6px);z-index:30;display:none;flex-direction:column;align-items:stretch;gap:4px;min-width:150px;padding:6px;border:2px solid #b78336;background:#102a2cf5;box-shadow:3px 4px 0 #0b1518b0}
  .game-app[data-theme=auction]:has(#play:not([hidden])) .topbar.menu-open .top-actions{display:flex}
  .game-app[data-theme=auction]:has(#play:not([hidden])) .top-actions button{display:flex;align-items:center;gap:8px;justify-content:flex-start;text-align:left;min-height:44px;padding:6px 12px}
  .game-app[data-theme=auction]:has(#play:not([hidden])) .top-actions .settings-button::after{content:"设置";font-size:15px}

  /* ---------- seat paddles: name and total only; whose turn shows once, by the glow ---------- */
  .game-app[data-theme=auction]:has(#play:not([hidden])) .scoreboard{position:relative;z-index:20}
  .game-app[data-theme=auction]:has(#play:not([hidden])) .score{padding:7px 10px;gap:2px}
  .game-app[data-theme=auction]:has(#play:not([hidden])) .score :is(.score-caption,.paddle-no){display:none}
  .game-app[data-theme=auction]:has(#play:not([hidden])) .score>b{font-size:24px;line-height:1.3}
  .game-app[data-theme=auction]:has(#play:not([hidden])) .score .summon-list{display:none}
  /* Three or more paddles share the row: a smaller smile button keeps the name readable. */
  .game-app[data-theme=auction][data-multi=true]:has(#play:not([hidden])) .score .emote-send{width:24px;min-height:24px;font-size:17px}
  .game-app[data-theme=auction][data-multi=true]:has(#play:not([hidden])) .score-heading{gap:4px}
  /* Four to six seats (online rooms): two rows of three compact paddles. */
  .game-app[data-theme=auction]:is([data-player-count="4"],[data-player-count="5"],[data-player-count="6"],[data-player-count="7"],[data-player-count="8"]):has(#play:not([hidden])) .score{padding:5px 7px;gap:0}
  .game-app[data-theme=auction]:is([data-player-count="4"],[data-player-count="5"],[data-player-count="6"],[data-player-count="7"],[data-player-count="8"]):has(#play:not([hidden])) .score>b{font-size:18px}
  .game-app[data-theme=auction]:is([data-player-count="4"],[data-player-count="5"],[data-player-count="6"],[data-player-count="7"],[data-player-count="8"]):has(#play:not([hidden])) .score-skips{display:none}
  /* Four to eight seats: shorter paddles so two rows leave the dial room, and a
     total box wide enough for the longest short amount (¥8765.43万). */
  .game-app[data-theme=auction]:is([data-player-count="4"],[data-player-count="5"],[data-player-count="6"],[data-player-count="7"],[data-player-count="8"]):has(#play:not([hidden])) .scoreboard{gap:5px}
  .game-app[data-theme=auction]:is([data-player-count="4"],[data-player-count="5"],[data-player-count="6"],[data-player-count="7"],[data-player-count="8"]):has(#play:not([hidden])) .score{padding:4px 5px}
  .game-app[data-theme=auction]:is([data-player-count="4"],[data-player-count="5"],[data-player-count="6"],[data-player-count="7"],[data-player-count="8"]):has(#play:not([hidden])) .score-heading{gap:3px;font-size:12px;line-height:18px}
  #valuation-app.game-app[data-theme=auction]:is([data-player-count="4"],[data-player-count="5"],[data-player-count="6"],[data-player-count="7"],[data-player-count="8"]):has(#play:not([hidden])) .seat-avatar{width:18px;height:18px}
  .game-app[data-theme=auction]:is([data-player-count="4"],[data-player-count="5"],[data-player-count="6"],[data-player-count="7"],[data-player-count="8"]):has(#play:not([hidden])) .score .emote-send{width:20px;min-height:20px;font-size:15px}
  .game-app[data-theme=auction]:is([data-player-count="4"],[data-player-count="5"],[data-player-count="6"],[data-player-count="7"],[data-player-count="8"]):has(#play:not([hidden])) .score>b{padding:1px 3px;line-height:1.2;letter-spacing:-1px}
  .game-app[data-theme=auction][data-turn-focus=true]:has(#play:not([hidden])) .score.asset-vault.turn-current::after{display:none}
  .game-app[data-theme=auction][data-turn-focus=true]:has(#play:not([hidden])) .score.asset-vault.turn-current{border-color:#e4b75b;box-shadow:0 0 0 3px #e4b75b40,0 0 18px #e4b75b66}
  /* The ledger opens under each paddle from the 账本 button. */
  .game-app[data-theme=auction].ledger-open:has(#play:not([hidden])) .score .summon-list:not(:empty){display:block;position:absolute;left:-2px;right:-2px;top:calc(100% + 4px);max-height:42vh;margin:0;padding:6px 10px;border:2px solid #8e673b;background:#16261ff7;box-shadow:3px 4px 0 #0b1518b0}
  .game-app[data-theme=auction].ledger-open:has(#play:not([hidden])) .summon-item{color:#f2e2b9}

  /* Whose turn is already on the glowing paddle and the input; keep the line for screen readers only. */
  .game-app[data-theme=auction]:has(#play:not([hidden])) .turn-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

  /* ---------- the dial: the letter to chain on, ringed by the countdown ---------- */
  .game-app[data-theme=auction] .challenge{position:relative;flex:0 0 auto;min-height:0;display:grid;place-items:center;gap:0;padding:0 0 24px;background:none}
  .game-app[data-theme=auction] .challenge::before{content:"";grid-area:1 / 1;width:144px;height:144px;border-radius:50%;background:radial-gradient(#234a49,#12292b);box-shadow:inset 0 0 0 3px #1a0f05,0 0 0 4px #1a0f05,0 0 30px #e4b75b33}
  .game-app[data-theme=auction] .challenge>.chain,.game-app[data-theme=auction] .challenge>.timer{grid-area:1 / 1}
  .game-app[data-theme=auction] .chain{position:static;z-index:1;padding-bottom:10px}
  .game-app[data-theme=auction] .chain>b{font-size:72px;line-height:1;text-shadow:4px 4px 0 #1a0f05}
  .game-app[data-theme=auction] .chain>b.free{font-size:24px}
  .game-app[data-theme=auction] .chain p{position:absolute;left:50%;bottom:0;transform:translateX(-50%);margin:0;padding:2px 10px;font-size:12px;background:#10182099}
  .game-app[data-theme=auction] .timer{position:relative;min-width:0;display:grid;place-items:center}
  .game-app[data-theme=auction] .clock-face{width:172px;height:172px;filter:none}
  .game-app[data-theme=auction] .clock-face :is(.clock-rim,.clock-ticks,.classroom-clock-outline,#clock-hand,.clock-pin){display:none}
  .game-app[data-theme=auction] .clock-track{stroke:#3c5042;stroke-width:7}
  .game-app[data-theme=auction] .clock-progress{stroke:#e4b75b;stroke-width:7}
  .game-app[data-theme=auction] .timer.urgent .clock-progress{stroke:#ff9f82}
  .game-app[data-theme=auction] .timer-readout{position:absolute;left:50%;top:calc(50% + 36px);transform:translateX(-50%);z-index:1}
  .game-app[data-theme=auction] .timer-readout b{font-size:16px;color:#e4b75b}
  .game-app[data-theme=auction] .timer-readout span{font-size:12px}

  /* ---------- the stage takes the room; the last sale lies on the table as a price tag ---------- */
  .game-app[data-theme=auction] #play{position:relative}
  .game-app[data-theme=auction] .auction-stage{flex:1 1 auto;min-height:150px;max-height:none}
  .game-app[data-theme=auction] .reward-chest{width:170px;bottom:30px}
  .game-app[data-theme=auction] .latest-summon{position:absolute;left:4px;bottom:22px;z-index:2;width:auto;max-width:44%;min-height:0;display:flex;flex-direction:column;align-items:center;gap:4px;padding:0;border:0;background:none;box-shadow:none}
  .game-app[data-theme=auction]:has(#result-banner:not([hidden])) .latest-summon{display:none}
  .game-app[data-theme=auction] .latest-summon :is(.latest-summon-owner,.lot-no,.sold-stamp,.latest-summon-npc,.latest-summon-unit){display:none}
  .game-app[data-theme=auction] .latest-summon-thumb{position:static;width:96px;max-height:64px;height:auto;object-fit:contain;object-position:50% 100%;image-rendering:pixelated}
  .game-app[data-theme=auction] .latest-summon-word,.game-app[data-theme=auction] .latest-summon-value{font-size:16px;line-height:1.2}
  .game-app[data-theme=auction] .latest-summon-word{padding:4px 0 0 8px}
  /* word and price read as one paper tag */
  .game-app[data-theme=auction] .latest-summon>:is(.latest-summon-word,.latest-summon-value){background:#f2e2b9;color:#342721;border:2px solid #1a0f05;padding:3px 8px;transform:rotate(-3deg);max-width:100%;overflow:hidden;text-overflow:ellipsis}
  .game-app[data-theme=auction] .latest-summon>.latest-summon-value{margin-top:-6px;color:#946013}

  /* ---------- notices: one bubble just above the input, over the table ---------- */
  .game-app[data-theme=auction]:has(#move-form:not([hidden])) .feedback-row{position:absolute;left:18px;right:18px;bottom:var(--notice-bottom,96px);z-index:25;min-height:0;padding:0;justify-content:center;pointer-events:none}
  .game-app[data-theme=auction]:has(#move-form:not([hidden])) .feedback-row:has(#feedback:empty){display:none}
  .game-app[data-theme=auction]:has(#move-form:not([hidden])) #feedback{flex:0 1 auto;padding:8px 14px;border:2px solid #b7833699;border-radius:12px;background:#10241ff2;box-shadow:0 6px 18px #0009;color:#f2e2b9;font-size:14px;text-shadow:none;text-align:center;pointer-events:auto}
  .game-app[data-theme=auction]:has(#move-form:not([hidden])) #feedback.error{border-color:#e0806a;background:#3a1c16f2;color:#ffd9cc}
  .game-app[data-theme=auction]:has(#move-form:not([hidden])) #feedback.guest{border-color:#e4b75b;background:#2c2412f2;color:#ffe9b0;animation:notice-pop .32s cubic-bezier(.2,.9,.3,1.3)}
  .game-app[data-theme=auction]:has(#move-form:not([hidden])) #retry-button{pointer-events:auto}
  /* Online rooms keep the round chat button clear on the right. */
  body:has(.room-chat:not([hidden])) .game-app[data-theme=auction]:has(#move-form:not([hidden])) .feedback-row{right:72px}

  /* ---------- thumb zone ---------- */
  /* While a hand is revealed the input steps back. */
  .game-app[data-theme=auction][data-celebration-layout] :is(.move-form,.ledger-button){opacity:.45}
  .game-app[data-theme=auction][data-celebration-layout=tall] .score.turn-current{border-color:#ffe98a;box-shadow:0 0 0 3px #be82ff66,0 0 26px #be82ffaa}

  /* Keyboard open: the dial shrinks so the stage keeps its chest. */
  .game-app[data-theme=auction].compact .challenge::before{width:84px;height:84px}
  .game-app[data-theme=auction].compact .clock-face{width:100px;height:100px}
  .game-app[data-theme=auction].compact .chain>b{font-size:40px}
  .game-app[data-theme=auction].compact .timer-readout{top:calc(50% + 22px)}
  .game-app[data-theme=auction].compact .timer-readout b{font-size:12px}
  .game-app[data-theme=auction].compact .chain p{display:none}
  .game-app[data-theme=auction].compact .challenge{padding-bottom:0}
}