/* Hallmark · shape: app screen · genre: playful · theme: Squeeze (deal 1/3, seed feltboard-live-kanban-board-043c·8ffcb64d·2026-10-30·r0)
 * nav: a top bar with the wordmark, who is here and sign out · signature: the board, deep green wells of lighter tiles that move for everyone · states: dragging, full column, filtered, watched, open card, offline
 * axes: mid/geometric-sans/warm · posture: drenched · contrast: pass · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H4 E4 S4 R3 V4 · weakest: R, a board is tiles all the way down; the van day as one big figure and the warm-white card for the open card give the screens their range */
@import url("./tokens-bf459866dfaaa099b460115ee4442383.css?vsn=d");
@import url("./base-1b6664168be53ae9a7bace68abc7e99f.css?vsn=d");

/* ---------- shell ---------- */
.skip { position: absolute; left: var(--space-md); top: calc(-1 * var(--space-4xl)); padding: var(--space-xs) var(--space-md); background: var(--color-card); color: var(--color-card-ink); border-radius: var(--radius-control); font-weight: 700; z-index: var(--z-toast); }
.skip:focus-visible { top: var(--space-md); }

.topbar { border-bottom: var(--rule-bar) solid var(--color-rule); }
.topbar__inner { display: flex; align-items: center; gap: var(--space-md); min-height: var(--space-3xl); padding-block: var(--space-sm); }
.wordmark { font-family: var(--font-display); font-weight: 800; font-size: var(--text-xl); letter-spacing: var(--tracking-display); text-decoration: none; }
.topbar__team { font-size: var(--text-sm); font-weight: 700; color: var(--color-muted); }
.topbar__end { margin-left: auto; display: flex; align-items: center; gap: var(--space-md); }
.topbar__me { font-size: var(--text-sm); font-weight: 700; }
.online { display: flex; align-items: center; gap: var(--space-xs); }
.online__label { font-size: var(--text-sm); font-weight: 700; color: var(--color-muted); }
.online__people { display: flex; margin: 0; padding: 0; list-style: none; }
.online__people li + li { margin-left: calc(-1 * var(--space-2xs)); }
.online__people .avatar { box-shadow: 0 0 0 var(--rule-bar) var(--color-paper); }

.page { padding-block: var(--space-xl) var(--space-3xl); }
.colophon { border-top: var(--rule-bar) solid var(--color-rule); }
.colophon__inner { display: grid; gap: var(--space-xs); padding-block: var(--space-xl); font-size: var(--text-sm); color: var(--color-muted); }
.colophon__inner p { max-width: 72ch; }
.colophon a { font-weight: 700; color: var(--color-ink); }

/* ---------- controls ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-xs); min-height: var(--space-2xl); padding: var(--space-sm) var(--space-lg); border: var(--rule-bar) solid transparent; border-radius: var(--radius-control); font-family: var(--font-body); font-weight: 700; font-size: var(--text-md); line-height: 1.2; text-decoration: none; cursor: pointer; transition: background-color var(--dur-micro) var(--ease-out), transform var(--dur-micro) var(--ease-out); }
.btn:active { transform: translateY(1px); }
.btn--small { min-height: calc(var(--space-xl) + var(--space-xs)); padding: var(--space-xs) var(--space-md); font-size: var(--text-sm); }
.btn--primary { background: var(--color-accent); color: var(--color-accent-ink); }
.btn--primary:hover { background: var(--color-accent-2); }
.btn--line { background: transparent; color: var(--color-ink); border-color: var(--color-ink); }
.btn--line:hover { background: var(--color-paper-2); }
.btn--ink { background: transparent; color: var(--color-card-ink); border-color: var(--color-card-ink); }
.btn--ink:hover { background: color-mix(in oklab, var(--color-card-ink) 8%, var(--color-card)); }
.btn--quiet { background: transparent; color: inherit; padding-inline: var(--space-xs); text-decoration: underline; text-underline-offset: 0.2em; }
.btn--quiet:hover { text-decoration-color: var(--color-accent-2); }

input, select, textarea { min-height: calc(var(--space-xl) + var(--space-xs)); padding: var(--space-xs) var(--space-sm); border: var(--rule-bar) solid var(--color-rule); border-radius: var(--radius-control); background: var(--color-paper-3); color: var(--color-ink); }
input::placeholder, textarea::placeholder { color: var(--color-muted); opacity: 0.85; }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 1px; }
textarea { width: 100%; resize: vertical; line-height: 1.5; }

.chip { display: inline-flex; align-items: center; gap: var(--space-2xs); min-height: var(--space-xl); padding: var(--space-2xs) var(--space-md); border-radius: var(--radius-pill); background: var(--color-paper-2); font-size: var(--text-sm); font-weight: 700; cursor: pointer; transition: background-color var(--dur-micro) var(--ease-out), box-shadow var(--dur-short) var(--ease-out); }
.chip:hover { background: color-mix(in oklab, var(--color-paper-2) 88%, var(--color-ink)); }
.chip.is-on { background: var(--color-paper-3); box-shadow: 0 0 0 3px var(--color-accent); }
.chip:has(input:focus-visible) { outline: 2px solid var(--color-focus); outline-offset: 4px; }

.label { display: inline-block; padding: 0 var(--space-xs); border-radius: var(--radius-pill); background: var(--color-paper-3); color: var(--color-ink-2); font-size: var(--text-xs); font-weight: 700; line-height: 1.7; }

.avatar { display: inline-grid; place-items: center; flex: none; inline-size: var(--space-xl); block-size: var(--space-xl); border-radius: 50%; background: var(--color-ink-2); color: var(--color-card-ink); font-family: var(--font-display); font-weight: 800; font-size: var(--text-sm); letter-spacing: 0; line-height: 1; }
.avatar--xs { inline-size: calc(var(--space-md) + var(--space-2xs)); block-size: calc(var(--space-md) + var(--space-2xs)); font-size: 0.5625rem; }
.avatar--s { inline-size: calc(var(--space-lg) + var(--space-2xs)); block-size: calc(var(--space-lg) + var(--space-2xs)); font-size: var(--text-xs); }
.avatar--l { inline-size: var(--space-2xl); block-size: var(--space-2xl); font-size: var(--text-lg); }
.avatars { display: flex; margin: 0; padding: 0; list-style: none; }
.avatars li + li { margin-left: calc(-1 * var(--space-2xs)); }
.avatars .avatar { box-shadow: 0 0 0 var(--rule-bar) var(--color-paper-2); }

.flashes:empty { display: none; }
.flash { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); margin-bottom: var(--space-lg); padding: var(--space-sm) var(--space-md); border: var(--rule-bar) solid var(--color-rule); border-radius: var(--radius-control); background: var(--color-paper-3); font-weight: 700; }
.flash--error { border-color: var(--color-ink); }
.flash__close { flex: none; padding: var(--space-2xs) var(--space-xs); border: 0; background: none; color: var(--color-muted); font-size: var(--text-sm); font-weight: 700; text-decoration: underline; cursor: pointer; }

.due { font-size: var(--text-xs); font-weight: 700; color: var(--color-ink-2); white-space: nowrap; }
.due--late, .due--today { padding: 0 var(--space-xs); border: var(--rule-bar) solid var(--color-ink); border-radius: var(--radius-pill); color: var(--color-ink); line-height: 1.6; }

/* ---------- the board ---------- */
.board-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: var(--space-xl); margin-bottom: var(--space-xl); }
.board-head__text { display: grid; gap: var(--space-xs); justify-items: start; }
.crumb { font-size: var(--text-sm); font-weight: 700; color: var(--color-muted); text-decoration: none; }
.crumb:hover { color: var(--color-ink); text-decoration: underline; text-decoration-color: var(--color-accent); }
.board-head h1 { font-size: calc(var(--text-display) * 1.4); }
.board-head .lead { color: var(--color-muted); }
.board-head__how { font-size: var(--text-sm); color: var(--color-muted); }
.goal { text-align: right; }
.goal__label { font-size: var(--text-sm); font-weight: 700; color: var(--color-muted); }
.goal__figure { font-family: var(--font-display); font-weight: 800; font-size: calc(var(--text-section) * 3.6); letter-spacing: -0.04em; line-height: 0.95; }
.goal__note { margin-top: var(--space-xs); font-size: var(--text-sm); color: var(--color-ink-2); }

.filters { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-sm) var(--space-lg); margin-bottom: var(--space-lg); }
.chips { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-xs); margin: 0; padding: 0; border: 0; min-width: 0; }
.chips__legend { float: left; margin-right: var(--space-xs); font-size: var(--text-sm); font-weight: 700; color: var(--color-muted); }
.filters__find { display: flex; align-items: center; gap: var(--space-md); }
.filters__find input { inline-size: 14rem; }
.filters__clear { font-size: var(--text-sm); font-weight: 700; }

/* Positioned, so the visually hidden labels inside the columns scroll with them rather than
   stretching the page from outside the board's scroll box. */
.board { position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(16.5rem, 1fr); gap: var(--space-md); align-items: start; overflow-x: auto; padding-bottom: var(--space-xs); scroll-snap-type: x proximity; }
.column { position: relative; display: flex; flex-direction: column; gap: var(--space-sm); min-height: 18rem; padding: var(--space-md); border-radius: var(--radius-card); background: var(--color-paper-3); scroll-snap-align: start; }
.column__head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-sm); padding-inline: var(--space-2xs); }
.column__head h2 { font-size: var(--text-section); }
.column__count { display: flex; align-items: center; gap: var(--space-xs); font-size: var(--text-sm); font-weight: 700; color: var(--color-muted); white-space: nowrap; }
.column__full { padding: 0 var(--space-xs); border: var(--rule-bar) solid var(--color-ink); border-radius: var(--radius-pill); color: var(--color-ink); line-height: 1.6; }
.column__cards { display: flex; flex-direction: column; gap: var(--space-xs); min-height: var(--space-3xl); margin: 0; padding: 0; list-style: none; }
.column__empty { padding: var(--space-xs) var(--space-2xs); font-size: var(--text-sm); color: var(--color-muted); }
.column--full .column__cards { min-height: var(--space-xl); }

.tile { position: relative; display: grid; gap: var(--space-xs); padding: var(--space-sm) var(--space-md); border-radius: var(--radius-control); background: var(--color-paper-2); cursor: grab; transition: background-color var(--dur-micro) var(--ease-out), box-shadow var(--dur-short) var(--ease-out); }
.tile:hover { background: color-mix(in oklab, var(--color-paper-2) 88%, var(--color-ink)); }
.tile__title { font-weight: 700; line-height: 1.35; text-decoration: none; text-wrap: pretty; }
.tile__title::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.tile__title:focus-visible { outline: none; }
.tile:has(.tile__title:focus-visible) { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.tile__labels { display: flex; flex-wrap: wrap; gap: var(--space-2xs); margin: 0; padding: 0; list-style: none; }
.tile__meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-xs) var(--space-sm); min-height: calc(var(--space-lg) + var(--space-2xs)); }
.tile__who { margin-left: auto; }
.tile__viewers { font-size: var(--text-xs); font-weight: 700; color: var(--color-ink); }
.tile--watched { box-shadow: 0 0 0 var(--rule-bar) var(--color-accent); }
.tile--chosen { box-shadow: 0 0 0 3px var(--color-accent); }
.tile--ghost { opacity: 0.4; }
.tile--drag { box-shadow: var(--shadow-card); }
.count { display: inline-flex; align-items: center; gap: var(--space-2xs); font-size: var(--text-xs); font-weight: 700; color: var(--color-ink-2); }
.count svg { inline-size: var(--space-sm); block-size: var(--space-sm); fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.count--all { color: var(--color-ink); }

.add-card { display: flex; gap: var(--space-xs); margin-top: auto; padding-top: var(--space-xs); }
.add-card input { flex: 1; min-width: 0; background: transparent; }

.activity { margin-top: var(--space-2xl); max-width: 52rem; }
.activity h2 { margin-bottom: var(--space-sm); }
.feed { margin: 0; padding: 0; list-style: none; }
.feed__row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-sm); padding-block: var(--space-xs); border-top: var(--rule-hair) solid var(--color-rule); }
.feed__row p { color: var(--color-ink-2); }
.feed__row strong { color: var(--color-ink); }
.feed__row time, .feed__board { font-size: var(--text-xs); font-weight: 700; color: var(--color-muted); white-space: nowrap; }

/* ---------- the open card: the one warm-white card ---------- */
.scrim { position: fixed; inset: 0; z-index: var(--z-modal); display: grid; justify-items: center; align-items: start; overflow-y: auto; padding: var(--space-2xl) var(--gutter); background: color-mix(in oklab, var(--color-paper-3) 72%, transparent); }
.dialog { inline-size: min(100%, 60rem); padding: var(--space-xl); border-radius: var(--radius-card); background: var(--color-card); color: var(--color-card-ink); box-shadow: var(--shadow-card); }
.dialog :focus-visible { outline-color: var(--color-card-ink); }
.dialog__head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); margin-bottom: var(--space-lg); }
.dialog__where { font-size: var(--text-sm); color: color-mix(in oklab, var(--color-card-ink) 70%, var(--color-card)); }
.dialog__grid { display: grid; grid-template-columns: minmax(0, 1fr) 15rem; gap: var(--space-xl); }
.dialog__main { display: grid; gap: var(--space-xl); align-content: start; }
.dialog__side { display: grid; gap: var(--space-md); align-content: start; }
.dialog h3 { font-size: var(--text-lg); }
.dialog input, .dialog select, .dialog textarea { inline-size: 100%; background: var(--color-card); color: var(--color-card-ink); border-color: color-mix(in oklab, var(--color-card-ink) 28%, var(--color-card)); }
.dialog input::placeholder, .dialog textarea::placeholder { color: color-mix(in oklab, var(--color-card-ink) 55%, var(--color-card)); }
.dialog input[type="checkbox"] { inline-size: auto; min-height: 0; accent-color: var(--color-paper); }
.field__label { display: block; margin-bottom: var(--space-2xs); font-size: var(--text-sm); font-weight: 700; }
.field__error { margin-top: var(--space-2xs); font-size: var(--text-sm); font-weight: 700; color: var(--color-error); }
.card-text { display: grid; gap: var(--space-2xs); }
.card-text__title { field-sizing: content; min-height: 0; margin-bottom: var(--space-sm); resize: none; font-family: var(--font-display); font-weight: 800; font-size: var(--text-xl); letter-spacing: var(--tracking-display); line-height: 1.2; }
.card-text__actions { display: flex; gap: var(--space-sm); margin-top: var(--space-sm); }
.dialog__section-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-sm); margin-bottom: var(--space-xs); }
.checklist__tally { font-size: var(--text-sm); font-weight: 700; }
.meter { block-size: var(--space-xs); margin-bottom: var(--space-sm); border-radius: var(--space-2xs); background: color-mix(in oklab, var(--color-card-ink) 12%, var(--color-card)); overflow: hidden; }
.meter span { display: block; block-size: 100%; background: var(--color-paper); transition: inline-size var(--dur-short) var(--ease-out); }
.checklist__items { display: grid; gap: var(--space-2xs); margin: 0 0 var(--space-sm); padding: 0; list-style: none; }
.check { display: flex; align-items: flex-start; gap: var(--space-sm); padding: var(--space-2xs) 0; cursor: pointer; }
.check input { margin-top: var(--space-2xs); }
.check--done span { color: color-mix(in oklab, var(--color-card-ink) 55%, var(--color-card)); text-decoration: line-through; }
.inline-form { display: flex; gap: var(--space-xs); }
.inline-form input { flex: 1; min-width: 0; }
.comments h3 { margin-bottom: var(--space-sm); }
.comments__list { display: grid; margin: 0 0 var(--space-md); padding: 0; list-style: none; }
.comment { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-sm); padding-block: var(--space-sm); border-top: var(--rule-hair) solid color-mix(in oklab, var(--color-card-ink) 14%, var(--color-card)); }
.comment .avatar { background: var(--color-paper); color: var(--color-ink); }
.comment__who { font-size: var(--text-sm); }
.comment__who time { margin-left: var(--space-xs); color: color-mix(in oklab, var(--color-card-ink) 60%, var(--color-card)); }
.comments__none { margin-bottom: var(--space-md); font-size: var(--text-sm); color: color-mix(in oklab, var(--color-card-ink) 65%, var(--color-card)); }
.comment-form__actions { display: flex; align-items: center; justify-content: flex-end; gap: var(--space-md); margin-top: var(--space-xs); }
.comment-form__hint { font-size: var(--text-xs); color: color-mix(in oklab, var(--color-card-ink) 60%, var(--color-card)); }
.toggles { display: flex; flex-wrap: wrap; gap: var(--space-xs); margin: 0; padding: 0; border: 0; min-width: 0; }
.toggles legend { float: left; inline-size: 100%; }
.toggle { min-height: var(--space-xl); padding: var(--space-2xs) var(--space-md); border: var(--rule-bar) solid color-mix(in oklab, var(--color-card-ink) 28%, var(--color-card)); border-radius: var(--radius-pill); background: transparent; color: var(--color-card-ink); font-size: var(--text-sm); font-weight: 700; cursor: pointer; transition: background-color var(--dur-micro) var(--ease-out), box-shadow var(--dur-short) var(--ease-out); }
.toggle:hover { background: color-mix(in oklab, var(--color-card-ink) 7%, var(--color-card)); }
.toggle[aria-pressed="true"] { border-color: var(--color-paper); background: var(--color-paper); color: var(--color-ink); box-shadow: 0 0 0 3px var(--color-accent); }
.dialog__also { font-size: var(--text-sm); font-weight: 700; }
.dialog__delete { justify-self: start; margin-top: var(--space-md); }

/* ---------- the boards ---------- */
.intro { display: grid; gap: var(--space-sm); margin-bottom: var(--space-xl); }
.intro h1 { font-size: calc(var(--text-display) * 1.6); }
.intro .lead { color: var(--color-muted); }
.bento { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--space-md); }
.board-tile, .mine, .lately { padding: var(--space-lg); border-radius: var(--radius-card); background: var(--color-paper-2); }
.board-tile { position: relative; display: flex; flex-direction: column; gap: var(--space-sm); grid-column: span 4; transition: background-color var(--dur-micro) var(--ease-out); }
.board-tile:hover { background: color-mix(in oklab, var(--color-paper-2) 90%, var(--color-ink)); }
.board-tile--lead { grid-column: 1 / span 8; grid-row: 1; }
.board-tile__top { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-sm); }
.board-tile h2 { font-size: var(--text-xl); }
.board-tile--lead h2 { font-size: var(--text-2xl); }
.board-tile__link { text-decoration: none; }
.board-tile__link::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.board-tile__link:focus-visible { outline: none; }
.board-tile:has(.board-tile__link:focus-visible) { outline: 2px solid var(--color-focus); outline-offset: 3px; }
.board-tile__live { font-size: var(--text-xs); font-weight: 700; color: var(--color-ink); white-space: nowrap; }
.board-tile__about { color: var(--color-muted); }
.board-tile__figure { display: flex; align-items: baseline; gap: var(--space-xs); margin-top: auto; }
.board-tile__figure .figure { font-family: var(--font-display); font-weight: 800; font-size: calc(var(--text-section) * 2.4); letter-spacing: -0.04em; line-height: 1; }
.board-tile--lead .board-tile__figure .figure { font-size: calc(var(--text-section) * 4); }
.board-tile__unit { font-weight: 700; }
.board-tile__columns { display: flex; flex-wrap: wrap; gap: var(--space-2xs) var(--space-md); margin: 0; padding: 0; list-style: none; font-size: var(--text-sm); color: var(--color-ink-2); }
.board-tile__columns .num { font-family: var(--font-display); font-weight: 800; color: var(--color-ink); }
.board-tile__foot { display: flex; align-items: center; justify-content: space-between; gap: var(--space-sm); padding-top: var(--space-sm); border-top: var(--rule-bar) solid var(--color-rule); }
.board-tile__goal { font-size: var(--text-sm); color: var(--color-ink-2); }
.bento__photo { grid-column: 9 / span 4; grid-row: 1 / span 2; min-height: 26rem; margin: 0; border-radius: var(--radius-card); }
.mine, .lately { grid-column: span 6; align-self: start; }
.mine h2, .lately h2 { margin-bottom: var(--space-sm); }
.mine__list { margin: 0; padding: 0; list-style: none; }
.mine__list li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 0 var(--space-sm); padding-block: var(--space-xs); border-top: var(--rule-hair) solid var(--color-rule); }
.mine__title { font-weight: 700; text-decoration: none; }
.mine__title:hover { text-decoration: underline; text-decoration-color: var(--color-accent); }
.mine__where { grid-column: 1; font-size: var(--text-xs); font-weight: 700; color: var(--color-muted); }
.mine__list .due { grid-column: 2; grid-row: 1 / span 2; }
.mine__none { color: var(--color-muted); }
.lately .feed__row { grid-template-columns: auto minmax(0, 1fr); }
.lately .feed__row time { grid-column: 2; }

/* ---------- signing in ---------- */
.stage { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-xl); align-items: stretch; }
.stage__text { display: grid; gap: var(--space-md); align-content: start; padding-block: var(--space-lg); }
.stage h1 { font-size: calc(var(--text-display) * 1.9); max-width: 14ch; }
.stage .lead { color: var(--color-muted); }
.pick { display: grid; gap: var(--space-sm); margin-top: var(--space-md); }
.pick__title { font-size: var(--text-section); }
.people { display: grid; gap: var(--space-sm); margin: 0; padding: 0; list-style: none; }
.person { display: flex; align-items: center; gap: var(--space-md); padding: var(--space-md) var(--space-lg); border-radius: var(--radius-card); background: var(--color-paper-2); }
.person__text { flex: 1; min-width: 0; }
.person__name { font-family: var(--font-display); font-weight: 800; font-size: var(--text-lg); }
.person__role { font-size: var(--text-sm); color: var(--color-muted); }
.pick__note { font-size: var(--text-sm); color: var(--color-muted); }
.stage__photo { min-height: 30rem; margin: 0; border-radius: var(--radius-card); }

.error-page { display: grid; gap: var(--space-md); }

/* ---------- narrower screens ---------- */
@media (max-width: 60rem) {
  .board-head { grid-template-columns: minmax(0, 1fr); }
  .goal { text-align: left; }
  .board { grid-auto-columns: minmax(16rem, 82%); scroll-snap-type: x mandatory; }
  .dialog__grid { grid-template-columns: minmax(0, 1fr); }
  .dialog__side { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dialog__side .toggles, .dialog__also, .dialog__delete { grid-column: 1 / -1; }
  .bento > * { grid-column: 1 / -1; grid-row: auto; }
  .bento__photo { min-height: 0; aspect-ratio: 4 / 3; }
  .stage { grid-template-columns: minmax(0, 1fr); }
  .stage__photo { min-height: 0; aspect-ratio: 3 / 2; order: -1; }
}
@media (max-width: 40rem) {
  .topbar__team, .topbar__me, .online__label { display: none; }
  .scrim { padding: var(--space-md) var(--space-xs); }
  .dialog { padding: var(--space-lg) var(--space-md); }
  .dialog__side { grid-template-columns: minmax(0, 1fr); }
  .filters__find, .filters__find input { inline-size: 100%; }
  .person { flex-wrap: wrap; }
  .person__go { inline-size: 100%; }
  .person__go .btn { inline-size: 100%; }
}