/* Areté — proportion (2026-09-11). Loaded last, so it settles how a room stands in the viewport.
   Governed by DESIGN-CONSTITUTION.md §6 and her ship prompt §4: composed, not hanging from the top.
   The :not(.hidden) guard is what keeps one room on screen at a time. */
@media (min-width:1024px){
  #content-wrap #view-brief:not(.hidden),
  #content-wrap #view-simulator:not(.hidden),
  #content-wrap #view-record:not(.hidden),
  #content-wrap #view-calibration:not(.hidden){
    display:flex !important; flex-direction:column; justify-content:center;
    min-height:calc(100dvh - 96px); }
}

/* Deep read: one reading column, standing in the middle of the room, with section
   statements sized for a 46ch measure rather than for the whole viewport. */
#content-wrap #view-deep #dr-col{ margin-left:auto; margin-right:auto; }
#content-wrap #view-deep .dr-s__h{ font-size:clamp(24px,1.8vw,30px) !important; line-height:1.1 !important; }

/* Radar's statement sits in a narrow left column: size it to that column, not to the viewport,
   or "Thirty days against your own level." breaks into four short lines. */
#content-wrap #view-radar .rdo-title{ font-size:clamp(24px,1.9vw,32px) !important; line-height:1.08 !important; text-wrap:balance; }
#content-wrap #view-radar .rdo-l{ min-width:0; }

/* UI/UX Pro pass: every control answers to a finger. The hit area grows; nothing moves.
   Record's quiet exits and Decide's sliders were under the 44px minimum. */
#content-wrap #view-record .rc-q{ position:relative; }
#content-wrap #view-record .rc-q::after{ content:''; position:absolute; left:-10px; right:-10px; top:50%; height:44px; transform:translateY(-50%); }
#content-wrap #view-simulator input[type="range"]{ min-height:44px; }
#content-wrap #view-profile .int-pill{ min-height:44px; }
#content-wrap #view-calendar .cl-field{ min-height:44px; }
#content-wrap #view-calendar .cl-quiet{ position:relative; }
#content-wrap #view-calendar .cl-quiet::after{ content:''; position:absolute; left:-8px; right:-8px; top:50%; height:44px; transform:translateY(-50%); }
