/* HAHUMI 6.28 — stage overlay policy, phone layout, tap targets and the last a11y debts (agent: layout).
 * Loads after home60.css and the fix627-*.css files. The few !important below only beat earlier !important rules
 * (toast and hint placement in fix627-boot.css / home60.css, the switch size in home60.css).
 *
 * Overlay policy on the stage (home60.js note628, coach613.js) — nothing covers the hero's face:
 *  1. The speech bubble sits in the top strip of the stage, between «Образ» and the side buttons — above the head.
 *  2. The wish card lives in a note strip (#stageNote628): laptop/tablet — the free floor corner left of the hero, inside
 *     the stage; phone — right under the stage (it keeps its height, so nothing below jumps).
 *  3. The «Погладь…» hint: laptop/tablet — in the same strip (the wish wins, as in 6.21); phone — in the bubble's slot,
 *     only while the hero is silent. It waits while a toast is shown: one transient message over the stage at a time.
 *  4. Toasts sit at the top of the screen, outside the stage.
 *  5. The side buttons («Снимок», «Звук», «Тишина») are above the hero layer: a tap on them never pets the hero. */

/* 5. side buttons win over the hero layer (#heroArt is wider than the hero and covered them at 320–390 px) */
#homeView .stage .stage-top{z-index:6}

/* 1. the bubble: in the top strip, above the head */
#homeView .stage .speech-bubble{top:22px;left:140px;right:204px;width:fit-content;max-width:none;margin-inline:auto;transform:none;text-wrap:balance}
@media (max-width:740px){
 #homeView .stage .speech-bubble{top:12px;left:62px;right:62px;padding:8px 12px}
 /* a dare banner takes the top strip on phones (fix627-boot.css): then the bubble goes under it */
 #homeView .stage:has(.dare625) .speech-bubble{top:62px}
}
@media (max-width:400px){
 /* narrow phones: the hero steps down a little so a two-line bubble clears the head */
 #homeView .stage .hero-art{width:min(74%,360px);bottom:18%}
 #homeView .stage .speech-bubble{font-size:var(--fs-2);line-height:1.3}
}

/* 2. the note strip */
.note628 .care69-wish{position:static;z-index:auto;width:100%;max-width:none;margin:0;box-sizing:border-box;text-align:left;animation:none;transform:none}
.note628 .care69-wish::before,.note628 .care69-wish::after{display:none}
.note628 .care69-wish[hidden],.note628 .coach613[hidden]{display:none}
.note628 .coach613{position:static;transform:none;width:auto;max-width:none;margin:0;box-sizing:border-box;visibility:visible;animation:none}
@media (min-width:741px){
 /* the free floor corner, left of the hero and above the care dock */
 #homeView .stage>.note628{position:absolute;left:clamp(14px,2vw,24px);bottom:108px;z-index:4;width:min(27%,210px);display:flex;flex-direction:column;gap:8px}
 .note628 .care69-wish{padding:10px 12px 10px 10px;align-items:flex-start}
}
@media (max-width:740px){
 .home-grid>.note628{min-height:56px;display:flex;flex-direction:column;margin-top:calc(-1 * clamp(4px,1vw,8px))}
 .note628 .care69-wish{min-height:52px;padding:6px 14px 6px 6px}
 .note628 .care69-wish-txt{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:10px;row-gap:2px;flex:1 1 auto;min-width:0}
 .note628 .care69-wish-verb{margin-left:auto;white-space:nowrap}
 /* 3. phone hint: the bubble's slot (the bubble is idle while it shows) */
 #homeView .stage>.coach613{top:12px!important;bottom:auto!important;left:62px!important;right:62px!important;transform:none;width:auto;max-width:none;
  z-index:5;animation:none;visibility:visible;padding:4px 4px 4px 12px;font-size:var(--fs-2);line-height:1.3}
 #homeView .stage>.coach613 .coach613-dot{display:none}
 #homeView .stage:has(.dare625)>.coach613{top:62px!important}
 /* the slot is shared: while the hint shows, a fading bubble is gone at once */
 #homeView .stage:has(>.coach613:not([hidden])) .speech-bubble{visibility:hidden}
}
@media (prefers-reduced-motion:no-preference){
 .note628 .care69-wish:not([hidden]),#homeView .stage .coach613.pop{animation:note628-in var(--dur-2) ease-out both}
}
@keyframes note628-in{from{opacity:0;translate:0 -6px}to{opacity:1;translate:0 0}}
/* while the stage is busy with something else, the strip keeps its place but stays quiet */
.home-grid:has(.stage:is(.catch-on,.catch-done)) .note628>*,
.home-grid:has(.stage .name621) .note628>*,
.home-grid:has(.look613-pop:not([hidden])) .note628 .care69-wish{visibility:hidden}

/* 4. toasts: at the top, outside the stage (phones: under the app bar — not over the wordmark, the face or the dock) */
@media (max-width:740px){
 html body[data-state=home]:not([data-welcome="1"]) #toast{top:calc(env(safe-area-inset-top,0px) + 68px)!important;bottom:auto!important}
}

/* tap targets: 44 px at least */
html body .coach613-x{width:44px;height:44px;margin:-6px -8px -6px 0}
html body .catch610-exit{width:44px;height:44px}
html body .switch622-add{min-height:44px}
html body .dash618-link{min-height:44px;display:inline-flex;align-items:center;padding-inline:10px}
.keep625-row{min-height:44px}
.keep625-row input[type=checkbox]{width:24px;height:24px;margin:0;flex:0 0 auto}
/* switches: the visible track stays 46×28, the input itself is 46×44 (the track and the knob are drawn in ::before/::after) */
.switch-row.switch-row input[type=checkbox]{height:44px!important;width:46px!important;min-width:46px;background:transparent;box-shadow:none;flex:0 0 auto}
.switch-row.switch-row input[type=checkbox]:not(:checked){background:transparent;box-shadow:none}
.switch-row.switch-row input[type=checkbox]::before{content:"";position:absolute;left:0;top:8px;width:46px;height:28px;border-radius:999px;background:#6F7C74;box-shadow:inset 0 0 0 1px #5E6A63}
.switch-row.switch-row input[type=checkbox]:checked::before{background:var(--act,#2F6B4F);box-shadow:none}
.switch-row.switch-row input[type=checkbox]::after{top:11px;z-index:1}
.switch-row.switch-row input[type=checkbox]:focus-visible{outline:none}
.switch-row.switch-row input[type=checkbox]:focus-visible::before{outline:2px solid var(--act,#2F6B4F);outline-offset:3px}

/* 1.4.11: field borders ≥ 3:1 against the card (were rgba(31,58,46,.22) = 1.51:1) */
html body :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),select,textarea){border-color:#6F7C74}

/* 1.4.12: with extra letter/word spacing the «Личное дело» link wraps instead of pushing the page 11 px wider */
html body .dash618-link{max-width:100%;white-space:normal;overflow-wrap:anywhere;text-align:right}
html body :has(>.dash618-link){flex-wrap:wrap;min-width:0}

/* «Лови!»: the game area takes the focus when a round starts (home60.js); its ring stays inside the stage */
#homeView .stage .catch610:focus{outline:none}
#homeView .stage .catch610:focus-visible{outline:3px solid var(--act,#2F6B4F);outline-offset:-8px;border-radius:var(--r-l)}

/* Settings → «Комфорт»: the last switch row and the divider drew two lines */
.settings-card .switch-row:has(+ .divider){border-bottom:0}

/* Friends on a phone: no orphan dashes and one-letter words at line ends */
#friendsView :is(p,h1,h2){text-wrap:pretty}