/* Phone rules at EVERY viewport (lead, 2026-10-13). Codex wrote the iPhone layout inside @media (max-width: 900px),
   so on the owner's laptop (the phone frame scaled up to 1920) none of it applied: the goal thought covered the
   avatar, choice answers lost their 44 pt sizes. Copied from fix9/fix10/fix11 and scoped to the iPhone page only;
   loaded before lead-final.css, whose later rules still win. */
.f-ios .premium-dialogue .tk-heading { margin-top: calc(var(--u) * 3); font-size: calc(var(--u) * 17); }
.f-ios .premium-dialogue .tk-heading + .tk-line { margin-top: calc(var(--u) * 1); font-size: calc(var(--u) * 14); }
.f-ios .premium-dialogue.choice-dialogue .tk-card { top: calc(var(--u) * 30); }
.f-ios .premium-dialogue.choice-dialogue .tk-answers { top: calc(var(--u) * 130); gap: calc(var(--u) * 3); }
.f-ios .premium-dialogue .tk-answers .button-row { margin-top: 0; gap: calc(var(--u) * 5); }
.f-ios .premium-dialogue .tk-answers .button-row button { min-height: calc(var(--u) * 44); padding: 0 calc(var(--u) * 13); font-size: calc(var(--u) * 14); }
.f-ios .premium-dialogue .name-input { min-height: calc(var(--u) * 44); padding: 0 calc(var(--u) * 14); font-size: calc(var(--u) * 16); }
/* the letter to tomorrow's me (2026-10-23): at 16u its hint, "Which moment of today would you like to remember?", is
   385u wide in a field of 349u and was cut at the right edge. The field of a titled page (the letter is the only one;
   Freddy's name field has no title and stays as it is) reads at 14u, the layout standard's iPhone reading size and the
   size of Send / Not today under it: the whole hint shows (337u). Same field, words, limit and buttons. */
.f-ios .premium-dialogue:has(.tk-heading) .name-input { font-size: calc(var(--u) * 14); }
.f-ios .premium-dialogue.continue-dialogue .tk-answers { top: auto; bottom: calc(var(--u) * 28); }
.f-ios .premium-dialogue.long-dialogue .tk-line { font-size: calc(var(--u) * 19); }
.f-ios .premium-input-label { margin-bottom: 2px; font-size: calc(var(--u) * 12); }
.f-ios .story-scene-layout { padding: calc(var(--u) * 8) calc(var(--u) * 60) calc(var(--u) * 8); }
.f-ios .story-scene-stage { border-width: calc(var(--u) * 3); border-radius: calc(var(--u) * 16); }
.f-ios .story-scene-caption { grid-template-columns: calc(var(--u) * 145) minmax(0,1fr) auto; min-height: calc(var(--u) * 112); gap: calc(var(--u) * 8); padding-top: calc(var(--u) * 6); }
.f-ios .story-scene-meta h2 { font-size: calc(var(--u) * 16); }
.f-ios .story-card .story-scene-narration { font-size: calc(var(--u) * 13); line-height: 1.25; }
.f-ios .story-scene-controls { max-width: calc(var(--u) * 224); gap: calc(var(--u) * 4); }
.f-ios .story-scene-controls button { min-height: calc(var(--u) * 44); padding: 0 calc(var(--u) * 10); font-size: calc(var(--u) * 12); }
.f-ios .tablet-content { font-size: calc(var(--su) * 21); }
.f-ios .tablet-content .call-stage { grid-template-columns: minmax(0,.64fr) minmax(0,1.36fr); gap: calc(var(--su) * 12); }
.f-ios .tablet-content .call-stage > div:last-child { padding: calc(var(--su) * 10); }
.f-ios .tablet-content .call-stage .option-grid { gap: calc(var(--su) * 4); margin-top: calc(var(--su) * 4); }
.f-ios .tablet-content .call-stage .tk-ans { min-height: calc(var(--su) * 48); }
.f-ios .tablet-content .call-stage .tk-ans kbd { display: none; }
.f-ios .tablet-content .call-stage .tk-t { font-size: calc(var(--su) * 17); }
.iphone-page .notification-dock { left: calc(var(--u) * 168); top: calc(var(--u) * 20); width: calc(var(--u) * 310); }
.f-ios .premium-dialogue .tk-answers, .f-ios .premium-dialogue .tk-card { right: calc(var(--u) * 59); }
.f-ios .premium-dialogue.choice-dialogue .tk-card { right: auto; width: calc(var(--u) * 286); max-width: calc(var(--u) * 286); }
.f-ios .premium-dialogue .tk-answers .button-row { min-height: calc(var(--u) * 44); }
.f-ios .premium-dialogue .tk-answers .button-row button { min-width: calc(var(--u) * 132); }
.f-ios .tablet-content .look-intro p, .f-ios .tablet-content .look-intro .speaker-name, .f-ios .tablet-content .look-group h3, .f-ios .tablet-content .look-ready .item-card, .f-ios .tablet-content .look-items .look-item, .f-ios .tablet-content .settings-title small, .f-ios .tablet-content .audio-slider-row small, .f-ios .tablet-content .tablet-row small, .f-ios .tablet-content .settings-actions .tablet-row strong, .f-ios .tablet-content .settings-actions .tablet-row button, .f-ios .tablet-content .settings-zoom button, .f-ios .tablet-content .goal-card, .f-ios .tablet-content .goal-card small, .f-ios .tablet-content .goal-card button { font-size: 12px !important; }
.f-ios .tablet-content .settings-zoom button { min-width: 44px; }
.f-ios .tablet-content .settings-actions .tablet-row > button { min-width: 44px; }
.f-ios .tablet-content .settings-layout { grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); }
.f-ios .tablet-content .look-items .item-card { min-height: 60px; }
.f-ios .tablet-content .look-items .look-item { grid-template-rows: 28px auto; line-height: 1.05; }
.f-ios .tablet-content .look-items .look-item img { height: 28px; }
.f-ios .tablet-content .goal-card { display: grid; grid-template-columns: minmax(0,1fr) auto; grid-template-rows: auto auto; column-gap: 5px; align-items: center; }
.f-ios .tablet-content .goal-card > strong, .f-ios .tablet-content .goal-card > small { grid-column: 1; min-width: 0; }
.f-ios .tablet-content .goal-card > button { grid-column: 2; grid-row: 1 / span 2; margin: 0; }
.f-ios .tablet-content .state-columns { grid-template-columns: minmax(0,.72fr) minmax(0,.72fr) minmax(0,1.56fr); gap: calc(var(--su) * 6); }
.f-ios .tablet-content .state-column { padding: calc(var(--su) * 6); }
.f-ios .demo-place-adapted .pl-line { margin-top: calc(var(--u) * 3); }
.f-ios .demo-place-adapted .pl-btns { margin-top: calc(var(--u) * 4); }
.f-ios .story-scene-caption { grid-template-columns: calc(var(--u) * 145) minmax(0,1fr); grid-template-rows: minmax(0,1fr) calc(var(--u) * 44); grid-template-areas: "meta narration" "controls controls"; min-height: calc(var(--u) * 136); gap: calc(var(--u) * 4) calc(var(--u) * 8); padding: calc(var(--u) * 6) calc(var(--u) * 59) calc(var(--u) * 21); box-sizing: border-box; }
.f-ios .story-scene-controls { max-width: none; justify-content: flex-start; flex-wrap: nowrap; }

/* The phone is played with the TWO PAWS (owner 2026-10-14: "де лапки на мобільній версії... ліва і права лапки, а не
   кліки, це не клавіатура"): left paw moves, right paw talks or goes in. They were shown only under 900 px wide, so
   the phone frame on the laptop had none and showed the keyboard keys instead. Now at every viewport; no key hints. */
.iphone-page .premium-paws { display: block; }
.iphone-page .premium-paws .paw-zone,
.iphone-page .premium-paws .paw-joy,
.iphone-page .premium-paws .paw-act { display: block; }
.iphone-page .game > .hud .hud-keys, .f-ios .hud-keys, .f-ios .kh, .f-ios .tb-key, .f-ios .tk-ans kbd, .f-ios .bub kbd { display: none !important; }