/* rc1.7 (Pray attempt 9, James GO #80017): on phones the room's main button stays reachable.
   CSS only, phones only (<=600px). No DOM move, so focus order and aria are unchanged. See attempt9/DECISIONS.md.
   Docs: MDN position:sticky, env(), touch-action, :has() (URLs in DECISIONS.md). */
@media (max-width:600px){
  /* 1. Header collapse in room view: one line that scrolls sideways instead of wrapping to ~220px. Nothing hidden. */
  body.inroom .hdr{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}
  body.inroom .hdr .doors,body.inroom .hdr .tools{flex-wrap:nowrap;flex-shrink:0}
  body.inroom .hdr .brand,body.inroom .hdr .doors a,body.inroom .hdr .btn{white-space:nowrap;flex-shrink:0}
  body.inroom main{min-block-size:420px}
  /* 2. The action row (Begin / candle / hold / turn / incense / next) is the panel's direct-child .row that holds the
        primary button; in the Islam reading view it is the Next row. It sticks to the bottom of the panel scrollport. */
  .room .panel{scroll-padding-block-end:76px}
  .room .panel > .row:has(> .btn.primary),.room-islam .panel > .row{position:sticky;inset-block-end:0;z-index:3;margin-inline:-18px;margin-block:12px 0;padding:8px 18px;background:rgba(8,12,26,.97);border-block-start:1px solid var(--line);box-shadow:0 -8px 16px rgba(5,8,18,.85)}
  .room .panel > .row:has(> .btn.primary) .btn,.room-islam .panel > .row .btn{min-block-size:44px;min-inline-size:44px}
  /* hold-to-act: a press on the button never starts a pan (no pointercancel mid-hold); swipes elsewhere scroll as before. */
  .room .panel > .row > .btn.primary{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
  /* rc1.9: a sticky row with exactly two buttons keeps them side by side (was wrapping to 2 lines = 115px bar, 130px with inset). */
  .room .panel > .row:has(> .btn:nth-child(2)):not(:has(> .btn:nth-child(3))){flex-wrap:nowrap}
  .room .panel > .row:has(> .btn:nth-child(2)):not(:has(> .btn:nth-child(3))) > .btn{flex:1 1 0;min-inline-size:44px}
  /* 3. End card: the activity row is gone from the DOM (finishSession empties the panel); this is the belt. */
  .room.done .panel > .row{position:static}
  /* 4. Safe area: the footer is the last thing above the home indicator. */
  footer{padding-block-end:calc(10px + env(safe-area-inset-bottom,0px))}
}