/* «Что посмотреть» — scoped; theme tokens only. No :root/body/.container. */

.pick-page .pick-screen { padding-bottom: var(--sp-8, 2rem); }
.pick-page .quest-shell { max-width: 40rem; margin-inline: auto; }

.pick-eyebrow {
  margin: 0 0 var(--sp-2, 0.5rem);
  font-size: var(--fs-xs, 0.75rem);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--accent, #4a8cff);
}
.pick-hint {
  color: var(--text-muted, #6b7689);
  font-size: var(--fs-sm, 0.8125rem);
  margin: -0.25rem 0 1.25rem;
}
.pick-note {
  text-align: center;
  color: var(--text-secondary, #9aa6bf);
  margin: 0 0 var(--sp-4, 1rem);
}
.pick-intro-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-3, 0.75rem);
  justify-content: center;
  margin: var(--sp-6, 1.5rem) 0 var(--sp-8, 2rem);
}
.pick-progress { margin-bottom: var(--sp-4, 1rem); }

.pick-page .quest-opts { display: grid; gap: var(--sp-3, 0.75rem); }
.pick-page .quest-opt {
  display: flex;
  align-items: center;
  gap: var(--sp-3, 0.75rem);
  width: 100%;
  text-align: left;
  cursor: pointer;
  padding: var(--sp-4, 1rem) var(--sp-5, 1.25rem);
  border-radius: var(--r-lg, 14px);
  border: 1px solid var(--border, #232b3a);
  background: var(--surface, #161b26);
  color: var(--text, #e9edf5);
  font: inherit;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.pick-page .quest-opt:hover,
.pick-page .quest-opt:focus-visible {
  border-color: var(--accent, #4a8cff);
  background: var(--surface-hover, #232c3e);
  outline: none;
}
.pick-page .quest-opt__n {
  flex: 0 0 auto;
  width: 2rem;
  height: 2rem;
  display: grid;
  place-items: center;
  border-radius: 999px;
  font-weight: 600;
  font-size: var(--fs-sm, 0.8125rem);
  background: var(--surface-2, #1c2333);
  color: var(--text-secondary, #9aa6bf);
}
.pick-page .quest-opt:hover .quest-opt__n {
  background: var(--accent, #4a8cff);
  color: #fff;
}
.pick-page .quest-q h2 { margin: 0 0 var(--sp-4, 1rem); }
.pick-page .quest-foot {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-3, 0.75rem);
  margin-top: var(--sp-5, 1.25rem);
  justify-content: space-between;
  align-items: center;
}

.pick-page .progress {
  display: flex;
  align-items: center;
  gap: var(--sp-3, 0.75rem);
}
.pick-page .progress__track {
  flex: 1;
  height: 6px;
  border-radius: 999px;
  background: var(--surface-2, #1c2333);
  overflow: hidden;
}
.pick-page .progress__bar {
  height: 100%;
  border-radius: inherit;
  background: var(--accent, #4a8cff);
}
.pick-page .progress__meta {
  font-size: var(--fs-xs, 0.75rem);
  color: var(--text-muted, #6b7689);
  white-space: nowrap;
}

/* Share row reuses favorites__share-* ; spacing only */
.pick-share {
  max-width: 36rem;
  margin: 0 auto var(--sp-6, 1.5rem);
  text-align: left;
}
.pick-share__social {
  margin-top: var(--sp-3, 0.75rem);
  display: flex;
  justify-content: flex-start;
}

.honesty {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--sp-4, 1rem);
  padding: var(--sp-4, 1rem) var(--sp-5, 1.25rem);
  margin: 0 0 var(--sp-6, 1.5rem);
  border-radius: var(--r-lg, 14px);
  border: 1px solid var(--warn, #f5a623);
  background: var(--warn-subtle, rgb(245 166 35 / 0.12));
}
.honesty__icon {
  width: 1.75rem;
  height: 1.75rem;
  display: grid;
  place-items: center;
  border-radius: 999px;
  font-weight: 700;
  background: var(--warn, #f5a623);
  color: #111;
}
.honesty__title { margin: 0 0 var(--sp-2, 0.5rem); font-weight: 600; }
.honesty__body {
  margin: 0;
  color: var(--text-secondary, #9aa6bf);
  font-size: var(--fs-sm, 0.8125rem);
}
.honesty ul {
  margin: var(--sp-2, 0.5rem) 0 0;
  padding-left: 1.25rem;
  color: var(--text-secondary, #9aa6bf);
  font-size: var(--fs-sm, 0.8125rem);
}

.pick-page .film-grid,
.pick-results-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: var(--sp-4, 1rem);
}
.pick-page .mc {
  display: flex;
  flex-direction: column;
  border-radius: var(--r-lg, 14px);
  border: 1px solid var(--border, #232b3a);
  background: var(--surface, #161b26);
  overflow: hidden;
}
.pick-page .mc__poster {
  position: relative;
  display: block;
  aspect-ratio: 2 / 3;
  background: var(--surface-2, #1c2333);
  overflow: hidden;
}
.pick-page .mc__poster img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.pick-page .mc__poster-ph {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  color: var(--text-muted, #6b7689);
  font-size: 2rem;
}
.pick-page .mc__rating {
  position: absolute;
  top: var(--sp-2, 0.5rem);
  right: var(--sp-2, 0.5rem);
  padding: 0.15rem 0.45rem;
  border-radius: var(--r-sm, 6px);
  font-size: var(--fs-xs, 0.75rem);
  font-weight: 600;
  background: rgb(0 0 0 / 0.72);
  color: var(--rating-good, #2ecc71);
}
.pick-page .mc__body { padding: var(--sp-3, 0.75rem); }
.pick-page .mc__title {
  margin: 0 0 0.25rem;
  font-size: var(--fs-md, 0.875rem);
  font-weight: 600;
  line-height: 1.3;
}
.pick-page .mc__title a { color: inherit; text-decoration: none; }
.pick-page .mc__title a:hover { color: var(--accent, #4a8cff); }
.pick-page .mc__meta {
  margin: 0 0 var(--sp-2, 0.5rem);
  font-size: var(--fs-xs, 0.75rem);
  color: var(--text-muted, #6b7689);
}
.pick-page .why {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}
.pick-page .why span {
  font-size: var(--fs-xs, 0.75rem);
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  background: var(--surface-2, #1c2333);
  color: var(--text-secondary, #9aa6bf);
}

/* Home: inside .section — only inner chips spacing (section margins from theme) */
.pick-teaser__body {
  display: grid;
  gap: var(--sp-4, 1rem);
  margin-top: var(--sp-2, 0.5rem);
}
.pick-teaser__mood-label { margin: 0; }
.pick-inline-start {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2, 0.5rem);
}
.pick-inline-start a.chip { text-decoration: none; }

.film-pick-cta {
  margin-top: var(--sp-6, 1.5rem);
  padding: var(--sp-5, 1.25rem);
  border-radius: var(--r-lg, 14px);
  border: 1px solid var(--border, #232b3a);
  background: var(--accent-subtle, rgb(74 140 255 / 0.12));
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-4, 1rem);
  align-items: center;
  justify-content: space-between;
}
.film-pick-cta p {
  margin: 0;
  color: var(--text-secondary, #9aa6bf);
  font-size: var(--fs-sm, 0.8125rem);
  max-width: 36rem;
}
.film-pick-cta strong { color: var(--text, #e9edf5); }

@media (max-width: 640px) {
  .pick-page .film-grid,
  .pick-results-grid {
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  }
  .pick-share .favorites__share-row { flex-wrap: wrap; }
}