/* Palette from Android values/colors.xml and values-night/colors.xml. */
:root {
  --st-font-sans: Roboto, "Segoe UI", system-ui, sans-serif;
  --st-primary: #2563EB;
  --st-primary-strong: #1565C0;
  --st-primary-soft: #E3F2FD;
  --st-bg: #F7F8FB;
  --st-bg-elevated: #FFFFFF;
  --st-surface: #FFFFFF;
  --st-surface-2: #F7F8FB;
  --st-surface-3: #F2F9FF;
  --st-text: #171A20;
  --st-text-2: #3F4654;
  --st-text-3: #737B8C;
  --st-text-soft: #737B8C;
  --st-border: #E7EAF0;
  --st-border-strong: #C4CFDD;
  --st-banner: #E7F2FF;
  --st-answer-stroke: rgba(158, 191, 211, .35);
  --st-selected-option: #EBF9FF;
  --st-meta-chip-bg: #FAFBFC;
  --st-meta-chip-stroke: #E5E7EB;
  --st-shadow-sm: 0 2px 8px rgba(17, 24, 39, .04);
  --st-shadow-md: 0 4px 18px rgba(17, 24, 39, .08);
}
:root[data-theme="dark"] {
  --st-primary: #8AB4F8;
  --st-primary-strong: #64B5F6;
  --st-primary-soft: #233043;
  --st-bg: #111318;
  --st-bg-elevated: #1B1E25;
  --st-surface: #1B1E25;
  --st-surface-2: #111318;
  --st-surface-3: #222D37;
  --st-text: #F4F6FA;
  --st-text-2: #D2D7E0;
  --st-text-3: #9AA3B4;
  --st-text-soft: #9AA3B4;
  --st-border: #2B303A;
  --st-border-strong: #465368;
  --st-banner: #233043;
  --st-answer-stroke: rgba(161, 191, 211, .35);
  --st-selected-option: #163561;
  --st-meta-chip-bg: #21232C;
  --st-meta-chip-stroke: #383A45;
  --st-shadow-sm: 0 2px 8px rgba(0, 0, 0, .12);
  --st-shadow-md: 0 4px 18px rgba(0, 0, 0, .24);
}
body.st-catalog-page, body.st-play-page, body.st-open-page { background: var(--st-bg); }
body.st-catalog-page::before, body.st-play-page::before, body.st-open-page::before { display: none; }
body.st-catalog-page main::before, body.st-play-page main::before, body.st-open-page main::before { display: none; }
body.st-play-page .st-quiz-intro-panel::after, body.st-open-page .st-open-card::before { display: none; }
.st-page { background: var(--st-bg); }
main .st-btn--primary, main .st-progress__bar { background-image: none; background-color: var(--st-primary); }
.st-app-download { display: grid; grid-template-columns: 40px minmax(0, 1fr) 20px; align-items: center; gap: 12px; min-height: 64px; padding: 12px 16px; border: 1px solid var(--st-primary); border-radius: 16px; background: var(--st-primary-soft); color: var(--st-text); text-decoration: none; box-shadow: var(--st-shadow-xs); box-sizing: border-box; }
.st-app-download img { width: 40px; height: 40px; border-radius: 10px; }
.st-app-download strong { font-size: .95rem; line-height: 1.4; overflow-wrap: anywhere; }
.st-app-download > span { color: var(--st-primary); font-size: 1.3rem; }
.st-app-download:hover { border-color: var(--st-primary-strong); background: var(--st-surface-3); }
.st-app-download:focus-visible { outline: 3px solid var(--st-primary); outline-offset: 3px; }
body.st-play-page #quizResultsView > .st-app-download { margin-top: 16px; }
body.st-catalog-page .st-app-promo-card { min-width: 0; }
body.st-catalog-page .st-app-promo-card > .st-stack-sm:last-child { width: 100%; min-width: 0; }
@media (max-width: 760px) { body.st-catalog-page .st-app-promo-card { width: 100%; } }

/* Responsive application layout. */
body.st-catalog-page main .st-container { max-width: 1160px; }
body.st-catalog-page .st-hero { padding: 20px 0 0; }
body.st-catalog-page .st-hero .st-stack-xl { gap: 16px; }
body.st-catalog-page .st-title-xl { font-size: clamp(1.5rem, 3vw, 2rem); line-height: 1.25; }
body.st-catalog-page .st-public-command-grid { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 16px; }
body.st-catalog-page .st-search-card { display: grid; padding: 16px; gap: 12px; border-radius: 16px; }
body.st-catalog-page .st-search-card > * + *,
body.st-catalog-page #filtersPanel > * + *,
body.st-catalog-page #filtersPanel > .st-stack-md > * + * { margin-top: 0; }
body.st-catalog-page .st-search-card .st-input { min-height: 46px; border-radius: 12px; padding-inline: 14px; }
body.st-catalog-page .st-app-promo-card { padding: 0; border: 0; background: transparent; }
body.st-catalog-page .st-app-promo-card > .st-stack-sm:first-child { display: none; }
body.st-catalog-page .st-public-catalog-section { padding: 16px 0 32px; }
body.st-catalog-page .st-list-shell { grid-template-columns: minmax(0, 1fr); gap: 16px; }
body.st-catalog-page .st-sidebar { position: static; }
body.st-catalog-page .st-sidebar:has(#filtersPanel.st-hidden) { display: none; }
body.st-catalog-page #filtersPanel { border-radius: 16px; box-shadow: none; padding: 16px; gap: 16px; }
body.st-catalog-page #filtersPanel > .st-stack-sm:first-child { display: none; }
body.st-catalog-page #filtersPanel > .st-stack-md { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
body.st-catalog-page #filtersPanel .st-select { min-height: 44px; }
body.st-catalog-page .st-grid--cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
body.st-catalog-page .st-grid--cards > * { grid-column: auto; }
body.st-catalog-page .st-list-shell > section { gap: 12px; }
body.st-catalog-page #listBannerArea:empty { display: none; }
body.st-catalog-page .st-toolbar:has(.st-catalog-heading) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
body.st-catalog-page [hidden] { display: none !important; }
body.st-catalog-page .st-quiz-card { border-radius: 14px; }
body.st-catalog-page .st-quiz-card__top-accent { display: none; }
body.st-catalog-page .st-quiz-card__body { padding: 16px; gap: 8px; }
body.st-catalog-page .st-quiz-card__title { font-size: 1rem; line-height: 1.4; }
body.st-catalog-page .st-quiz-card__footer { padding: 10px 16px; }
body.st-catalog-page .st-quiz-card__description { font-size: .875rem; }
body.st-catalog-page .st-catalog-heading { display: none; }
body.st-play-page .st-quiz-shell { padding-top: 20px; }
body.st-play-page .st-container--content { width: min(100% - 32px, 900px); }
body.st-play-page .st-stack-lg { gap: 20px; }
body.st-play-page .st-quiz-panel,
body.st-play-page .st-question-card { padding: 24px; border-radius: 16px; }
body.st-play-page #quizIntroView > .st-quiz-panel { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; gap: 18px 24px; }
body.st-play-page #quizIntroView > .st-quiz-panel > * + * { margin-top: 0; }
body.st-play-page #quizIntroView > .st-quiz-panel > :not(.st-mode-card):not(.st-modifiers) { grid-column: 1 / -1; }
body.st-play-page #quizTitle { font-size: clamp(1.45rem, 3vw, 2rem); line-height: 1.3; }
body.st-play-page .st-mode-card { padding: 16px; gap: 12px; border-radius: 14px; }
body.st-play-page .st-mode-option { min-height: 64px; padding: 10px; }
body.st-play-page .st-mode-description { min-height: 0; font-size: .85rem; }
body.st-play-page .st-modifiers { padding-top: 0; border: 0; gap: 12px; }
body.st-play-page .st-modifier-switch { min-height: 44px; font-size: .9rem; }
body.st-play-page .st-modifier-switch input { appearance: none; position: relative; width: 42px; height: 26px; border-radius: 20px; border: 1px solid var(--st-border-strong); background: var(--st-surface-3); cursor: pointer; }
body.st-play-page .st-modifier-switch input::before { content: ''; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: var(--st-text-3); transition: transform 160ms ease; }
body.st-play-page .st-modifier-switch input:checked { background: var(--st-primary); border-color: var(--st-primary); }
body.st-play-page .st-modifier-switch input:checked::before { transform: translateX(16px); background: var(--st-text-on-primary); }
body.st-play-page .st-modifier-switch input:focus-visible { outline: 3px solid var(--st-primary); outline-offset: 3px; }
body.st-play-page .st-modifier-times { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
body.st-play-page .st-modifier-times .st-select { min-height: 44px; }
body.st-play-page .st-modifiers > .st-text-muted { font-size: .8rem; line-height: 1.5; }
body.st-play-page .st-question-card__title { font-size: clamp(1.2rem, 2.5vw, 1.65rem); line-height: 1.4; }
body.st-play-page #quizResultsView { max-width: 680px; margin-inline: auto; }
@media (max-width: 760px) {
  body.st-catalog-page .st-grid--cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.st-catalog-page .st-public-command-grid { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  body.st-catalog-page .st-app-promo-card { justify-content: flex-end; }
  body.st-catalog-page .st-app-promo-card .st-btn { min-height: 40px; padding: 8px 14px; }
  body.st-play-page #quizIntroView > .st-quiz-panel { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  body.st-play-page .st-quiz-panel, body.st-play-page .st-question-card { padding: 18px; }
  body.st-play-page .st-container--content { width: calc(100% - 24px); }
  body.st-play-page .st-mode-option { min-height: 60px; }
}
@media (max-width: 480px) {
  body.st-play-page .st-modifier-times { grid-template-columns: minmax(0, 1fr); }
  body.st-play-page .st-modifier-times .st-field { display: grid; grid-template-columns: minmax(0, 1fr) 150px; align-items: center; gap: 12px; }
  body.st-play-page .st-modifier-times .st-select { margin: 0; font-size: .875rem; }
  body.st-catalog-page .st-grid--cards { grid-template-columns: minmax(0, 1fr); }
  body.st-catalog-page #filtersPanel > .st-stack-md { grid-template-columns: minmax(0, 1fr); }
  body.st-play-page .st-modifier-times .st-label { font-size: .78rem; line-height: 1.4; }
}
@media (prefers-reduced-motion: reduce) {
  body.st-play-page .st-modifier-switch input::before { transition: none; }
}

/* Focused questionnaire surface: navigation only, without the catalog header. */
body.st-play-page .st-header, body.st-open-page .st-header { display: none; }
body.st-play-page .st-quiz-shell { padding: 12px 0 20px; }
body.st-play-page .st-container--content { width: min(100% - 24px, 720px); }
body.st-play-page .st-quiz-panel, body.st-play-page .st-question-card { padding: 16px; border-radius: 14px; }
body.st-play-page .st-title-sm { font-size: .94rem; }
body.st-play-page .st-text-body { font-size: .875rem; line-height: 1.5; }
body.st-play-page #quizTitle { font-size: 1.35rem; }
body.st-play-page #quizIntroView > .st-quiz-panel { gap: 12px 18px; }
body.st-play-page .st-mode-card { padding: 12px; gap: 10px; }
body.st-play-page .st-mode-option { min-height: 52px; padding: 8px; }
body.st-play-page .st-mode-option__icon { display: none; }
body.st-play-page .st-mode-option { grid-template-columns: minmax(0, 1fr); }
body.st-play-page .st-mode-option strong { font-size: .875rem; }
body.st-play-page .st-mode-option small { font-size: .72rem; }
body.st-play-page .st-modifiers { gap: 8px; }
body.st-play-page .st-modifier-switch { min-height: 40px; font-size: .85rem; }
body.st-play-page .st-btn { min-height: 44px; padding: 10px 12px; font-size: .85rem; border-radius: 12px; }
body.st-play-page #quizQuestionView { padding-bottom: calc(108px + env(safe-area-inset-bottom, 0px)); }
body.st-play-page #quizQuestionView > .st-quiz-panel { padding: 12px 14px; }
body.st-play-page #quizQuestionView .st-quiz-topbar .st-toolbar,
body.st-play-page .st-question-card__eyebrow { display: none; }
body.st-play-page #quizQuestionView .st-quiz-topbar { margin-top: 10px; }
body.st-play-page #quizQuestionView .st-progress { height: 5px; margin-top: 0; }
body.st-play-page #quizQuestionView .st-screen-nav { grid-template-columns: auto minmax(0, 1fr); gap: 10px; }
body.st-play-page #quizQuestionView .st-screen-nav__title { font-size: .875rem; line-height: 1.4; }
body.st-play-page .st-icon-back { min-height: 40px; padding: 6px 8px; font-size: .85rem; }
body.st-play-page #quizQuestionView > * + * { margin-top: 12px; }
body.st-play-page .st-question-card > * + * { margin-top: 12px; }
body.st-play-page .st-question-card > .st-stack-md { margin-top: 0; }
body.st-play-page .st-question-card__title { font-size: 1.15rem; line-height: 1.45; }
body.st-play-page .st-answer-stack { gap: 8px; }
body.st-play-page .st-answer-option, body.st-play-page .st-order-item { min-height: 48px; padding: 10px 12px; border-radius: 12px; gap: 10px; }
body.st-play-page .st-answer-option__text { font-size: .9rem; line-height: 1.45; }
body.st-play-page .st-answer-option__index { width: 28px; height: 28px; font-size: .8rem; }
body.st-play-page #questionTimer:not(.st-hidden) { display: inline-flex; margin-bottom: 12px; font-size: .75rem; }
body.st-play-page #quizQuestionView .st-action-bar { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(12px + env(safe-area-inset-bottom, 0px)); width: min(calc(100% - 24px), 720px); margin: 0; padding: 0; z-index: 30; }
body.st-play-page #quizQuestionView .st-action-bar__inner { padding: 8px; border: 1px solid var(--st-border); border-radius: 20px; background: var(--st-surface); box-shadow: var(--st-shadow-md); }
body.st-play-page #quizQuestionView .st-action-bar__grid { grid-template-columns: minmax(80px, 1fr) minmax(0, 2fr); gap: 8px; }
body.st-play-page #quizQuestionView .st-action-bar__grid > * { grid-column: auto; min-height: 44px; border-radius: 13px; }
body.st-play-page #questionFeedbackArea { scroll-margin-bottom: 120px; }
body.st-play-page #questionFeedbackArea:not(:empty) { margin-top: 24px; }
body.st-play-page #quizResultsView { padding-top: 0; padding-bottom: calc(140px + env(safe-area-inset-bottom, 0px)); max-width: 600px; }
body.st-play-page .st-result-emblem { display: grid; place-items: center; width: 64px; height: 64px; margin: 0 auto 12px; border-radius: 50%; color: var(--st-primary); background: var(--st-primary-soft); font-size: 2.25rem; }
body.st-play-page #resultsCaptureCard { padding: 20px 16px; border-radius: 22px; background: var(--st-surface); }
body.st-play-page .st-results-card__content { padding: 0; gap: 12px; }
body.st-play-page .st-results-card__content > * { margin-top: 0; margin-bottom: 0; }
body.st-play-page .st-results-mode-row { margin-bottom: 12px; }
body.st-play-page .st-results-score-block { margin-top: 18px; gap: 8px; }
body.st-play-page .st-results-score { min-width: 112px; min-height: 0; padding: 8px 20px; border-radius: 18px; font-size: 2.5rem; line-height: 1.2; background: var(--st-surface-2); color: var(--st-primary); border: 1px solid var(--st-border); box-shadow: none; }
body.st-play-page .st-results-meta { margin-top: 16px; }
body.st-play-page .st-results-stats { margin-top: 20px; padding: 0; background: transparent; border: 0; }
body.st-play-page .st-results-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
body.st-play-page .st-stat-chip { min-height: 76px; padding: 8px; border-radius: 16px; }
body.st-play-page .st-stat-chip__body { padding: 10px; border-radius: 10px; }
body.st-play-page .st-stat-chip__value { font-size: 1.2rem; line-height: 1.3; font-variant-numeric: tabular-nums; }
body.st-play-page #quizResultsView .st-footer-actions { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(12px + env(safe-area-inset-bottom, 0px)); width: min(calc(100% - 24px), 600px); padding: 8px; margin: 0; border-radius: 20px; background: var(--st-surface); border: 1px solid var(--st-border); box-shadow: var(--st-shadow-md); z-index: 30; }
body.st-play-page #quizResultsView .st-footer-actions > .st-container--content { width: 100%; padding: 0; margin: 0; }
body.st-play-page #quizResultsView .st-footer-actions__inner { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 0; }
body.st-play-page #quizResultsView .st-footer-actions__inner > * { grid-column: auto; width: 100%; border-radius: 13px; }
body.st-play-page #quizResultsView .st-footer-actions__inner > :last-child { grid-column: auto; }
body.st-catalog-page .st-title-xl { font-size: 1.45rem; }
body.st-catalog-page .st-search-card { padding: 12px; gap: 8px; }
body.st-catalog-page .st-quiz-card__body { padding: 12px; gap: 6px; }
body.st-catalog-page .st-quiz-card__title { font-size: .9rem; }
body.st-catalog-page .st-quiz-card__description { font-size: .8rem; min-height: 0; }
body.st-catalog-page .st-quiz-card__footer { padding: 8px 12px; }
@media (max-width: 760px) {
  body.st-play-page #quizIntroView > .st-quiz-panel { gap: 12px; }
  body.st-play-page .st-quiz-panel, body.st-play-page .st-question-card { padding: 14px; }
}

/* Match Android toolbar and Material controls across all public screens. */
.st-header { background: var(--st-surface); border-bottom: 1px solid var(--st-border); box-shadow: none; backdrop-filter: none; }
.st-header .st-container { max-width: 1160px; }
.st-header__inner { min-height: 68px; gap: 12px; }
.st-brand__mark { width: 40px; height: 40px; border-radius: 12px; box-shadow: none; }
.st-brand__title { font-weight: 700; }
.st-brand__subtitle { font-size: .75rem; }
.st-select-wrap--header .st-select { min-height: 44px; border-radius: 12px; }
.st-switch { width: 48px; height: 44px; border: 0; padding: 0; background: transparent; flex-shrink: 0; justify-content: center; }
.st-switch__thumb { width: 24px; height: 24px; border-radius: 0; background: var(--st-text-2); box-shadow: none; mask: url('../img/android/dark_mode.svg') center / contain no-repeat; }
.st-switch[aria-pressed="true"] .st-switch__thumb, .st-switch.is-active .st-switch__thumb { transform: none; background: var(--st-primary); }
.st-switch:hover { background: var(--st-primary-soft); }
.st-btn--primary { box-shadow: none; }
.st-btn--primary:hover:not(:disabled) { background: var(--st-primary-strong); box-shadow: none; transform: none; }
.st-app-download { border-color: var(--st-border); background: var(--st-banner); box-shadow: none; }
.st-card { box-shadow: none; }

/* item_browser_quiz.xml: type icon, two-line description and inset footer. */
body.st-catalog-page .st-title-xl { display: flex; align-items: center; gap: 12px; font-size: 1.5rem; letter-spacing: -.02em; }
body.st-catalog-page .st-title-xl::before { content: ''; width: 28px; height: 28px; flex-shrink: 0; background: var(--st-primary); mask: url('../img/android/public.svg') center / contain no-repeat; }
body.st-catalog-page .st-public-command-grid { grid-template-columns: minmax(0, 1fr) 260px; }
body.st-catalog-page .st-search-card { border-radius: 20px; background: var(--st-surface); }
body.st-catalog-page .st-search-card .st-field { position: relative; }
body.st-catalog-page .st-search-card .st-field::after { content: ''; position: absolute; left: 14px; bottom: 13px; width: 22px; height: 22px; background: var(--st-text-3); mask: url('../img/android/search.svg') center / contain no-repeat; pointer-events: none; }
body.st-catalog-page .st-search-card .st-input { min-height: 48px; border-radius: 14px; padding-inline: 46px 14px; font-size: .95rem; }
body.st-catalog-page .st-search-card .st-toolbar { gap: 8px; }
body.st-catalog-page .st-search-card .st-toolbar__group { width: auto; }
body.st-catalog-page .st-chip-toggle { min-height: 44px; border-radius: 12px; font-size: .85rem; }
body.st-catalog-page #toggleFiltersButton::before { content: ''; width: 20px; height: 20px; background: currentColor; mask: url('../img/android/filter_list.svg') center / contain no-repeat; }
body.st-catalog-page #toggleFiltersButton[aria-expanded="true"] { color: var(--st-primary); background: var(--st-primary-soft); border-color: var(--st-primary); }
body.st-catalog-page #resultsCountPill { min-height: 32px; font-size: .8rem; color: var(--st-text-3); background: var(--st-bg); border-color: var(--st-border); }
body.st-catalog-page .st-quiz-card { border-radius: 20px; border-color: var(--st-border); box-shadow: none; min-height: 156px; }
body.st-catalog-page .st-quiz-card:hover, body.st-catalog-page .st-quiz-card:focus-visible { transform: none; border-color: var(--st-primary); box-shadow: var(--st-shadow-xs); }
body.st-catalog-page .st-quiz-card__body { position: relative; padding: 14px 12px 0; gap: 12px; }
.st-quiz-card__heading { display: grid; grid-template-columns: 46px minmax(0, 1fr); align-items: start; gap: 12px; }
.st-quiz-card__icon { display: grid; place-items: center; width: 46px; height: 46px; border: 1px solid var(--st-answer-stroke); border-radius: 14px; background: var(--st-surface-3); color: var(--st-primary); }
.st-quiz-card__icon::before { content: ''; width: 22px; height: 22px; background: currentColor; mask: url('../img/android/article.svg') center / contain no-repeat; }
.st-quiz-card__copy { min-width: 0; }
body.st-catalog-page .st-quiz-card__title { font-size: 15px; font-weight: 700; line-height: 20px; -webkit-line-clamp: 1; letter-spacing: normal; }
body.st-catalog-page .st-quiz-card__description { font-size: 13px; line-height: 18px; min-height: 36px; margin-top: 4px; }
body.st-catalog-page .st-quiz-card__meta-row { gap: 5px; min-height: 25px; padding-inline: 2px; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
body.st-catalog-page .st-chip { flex-shrink: 0; }
body.st-catalog-page .st-chip--compact,
body.st-catalog-page .st-quiz-card__meta-row > .st-chip { min-height: 25px; font-size: 12px; border-radius: 8px; padding-inline: 8px; font-weight: 400; }
body.st-catalog-page .st-chip--count { min-width: 34px; padding-inline: 5px; background: var(--st-meta-chip-bg); border-color: var(--st-meta-chip-stroke); color: var(--st-text); }
body.st-catalog-page .st-chip--ai { min-width: 25px; padding-inline: 4px; color: var(--st-text-2); background: var(--st-meta-chip-bg); border-color: var(--st-meta-chip-stroke); }
body.st-catalog-page .st-chip--ai::before { content: ''; width: 17px; height: 17px; background: currentColor; mask: url('../img/android/auto_awesome.svg') center / contain no-repeat; }
body.st-catalog-page .st-quiz-card__divider { display: none; }
body.st-catalog-page .st-quiz-card__footer { position: relative; margin: 4px 8px 8px; padding: 6px 8px 6px 10px; min-height: 38px; border-radius: 12px; background: var(--st-surface); gap: 8px; flex-flow: row nowrap; align-items: center; }
body.st-catalog-page .st-quiz-card__footer-meta { font-size: .75rem; flex: 1 1 auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.st-catalog-page .st-quiz-card__footer-meta strong { font-weight: 700; color: inherit; }
body.st-catalog-page .st-chip--likes { min-height: 25px; border-radius: 12px; padding-inline: 7px 6px; gap: 4px; color: var(--st-text); background: var(--st-surface); }
body.st-catalog-page .st-chip--likes .st-chip__icon { width: 14px; height: 14px; background: var(--st-primary); mask: url('../img/android/favorite.svg') center / contain no-repeat; }

/* activity_test.xml: uncluttered question, 56px answer rows, bottom actions. */
body.st-play-page .st-header, body.st-open-page .st-header { display: block; }
body.st-play-page:has(#quizQuestionView:not(.st-hidden)) .st-header { display: none; }
body.st-play-page .st-container--content { width: min(100% - 32px, 900px); }
body.st-play-page:has(#quizQuestionView:not(.st-hidden)) .st-container--content { max-width: 760px; }
body.st-play-page .st-quiz-panel { padding: 20px; border-radius: 20px; border-color: var(--st-border); box-shadow: none; }
body.st-play-page #quizIntroView > .st-quiz-panel { gap: 20px 24px; }
body.st-play-page #quizTitle { font-size: clamp(1.35rem, 3vw, 1.8rem); }
body.st-play-page .st-mode-card { padding: 16px; border-radius: 16px; background: var(--st-bg); }
body.st-play-page .st-mode-option { min-height: 64px; padding: 12px 8px; }
body.st-play-page .st-mode-option strong { font-size: .9rem; }
body.st-play-page .st-modifier-switch { min-height: 48px; font-size: .9rem; }
body.st-play-page .st-btn { min-height: 48px; font-size: .9rem; }
body.st-play-page #quizQuestionView { padding-bottom: calc(160px + env(safe-area-inset-bottom, 0px)); }
body.st-play-page #quizQuestionView > .st-quiz-panel { padding: 12px 16px; background: var(--st-bg); border: 0; }
body.st-play-page #quizQuestionView .st-screen-nav { grid-template-columns: auto minmax(0, 1fr) auto; }
body.st-play-page #quizQuestionView .st-screen-nav__title { font-size: .95rem; text-align: start; }
body.st-play-page .st-icon-back { min-height: 44px; padding: 6px 10px; border: 0; background: transparent; }
body.st-play-page #quizQuestionView .st-quiz-topbar .st-toolbar { display: flex; }
body.st-play-page .st-quiz-topbar .st-toolbar__group { width: auto; gap: 6px; }
body.st-play-page .st-quiz-topbar .st-pill { min-height: 26px; padding: 0 8px; font-size: .75rem; flex: 0 1 auto; }
body.st-play-page #quizQuestionView .st-progress { margin-top: 8px; background: var(--st-border); }
body.st-play-page .st-question-card { padding: 14px; border: 0; background: transparent; box-shadow: none; }
body.st-play-page .st-question-card > .st-stack-md { padding: 0 8px; }
body.st-play-page .st-question-card__title { font-size: 1.1875rem; line-height: 1.5; font-weight: 700; }
body.st-play-page .st-answer-stack { gap: 10px; }
body.st-play-page .st-answer-option, body.st-play-page .st-order-item { min-height: 56px; padding: 12px; border-radius: 16px; gap: 12px; box-shadow: none; border-color: var(--st-answer-stroke); }
body.st-play-page .st-answer-option:hover, body.st-play-page .st-answer-option:focus-visible, body.st-play-page .st-order-item:focus-visible { transform: none; box-shadow: none; border-color: var(--st-primary); }
body.st-play-page .st-answer-option.is-selected { background: var(--st-selected-option); border-color: var(--st-primary); }
body.st-play-page .st-answer-option.is-correct { background: var(--st-success-bg); border-color: var(--st-success); }
body.st-play-page .st-answer-option.is-incorrect { background: var(--st-danger-bg); border-color: var(--st-danger); }
body.st-play-page .st-answer-option__text { font-size: .9375rem; line-height: 1.5; overflow-wrap: anywhere; }
body.st-play-page .st-answer-option__index, body.st-play-page .st-order-item__index { border-radius: 50%; background: var(--st-answer-stroke); }
body.st-play-page #quizQuestionView .st-action-bar { bottom: calc(16px + env(safe-area-inset-bottom, 0px)); width: min(calc(100% - 32px), 760px); }
body.st-play-page #quizQuestionView .st-action-bar__inner { padding: 12px; border-radius: 16px; }
body.st-play-page #quizQuestionView .st-action-bar__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
body.st-play-page #quizQuestionView .st-action-bar__grid > * { min-height: 48px; white-space: normal; }
body.st-play-page #questionFeedbackArea { scroll-margin-bottom: 180px; }
body.st-play-page #quizResultsView { max-width: 680px; padding-bottom: calc(160px + env(safe-area-inset-bottom, 0px)); }
body.st-play-page #resultsCaptureCard { border-color: var(--st-border); }
body.st-play-page #quizResultsView .st-footer-actions { bottom: calc(16px + env(safe-area-inset-bottom, 0px)); width: min(calc(100% - 32px), 680px); border-radius: 16px; padding: 12px; }
body.st-play-page #quizResultsView .st-footer-actions__inner > * { white-space: normal; }
body.st-open-page .st-open-shell { padding: 32px 0; }
body.st-open-page .st-open-card { padding: 24px; border-radius: 20px; box-shadow: none; border-color: var(--st-border); background: var(--st-surface); }
body.st-open-page #openResolvedView > .st-card, body.st-open-page #openErrorView > .st-card { border-radius: 16px; background: var(--st-bg); }

@media (max-width: 1000px) {
  body.st-catalog-page .st-grid--cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .st-header__inner { min-height: 60px; }
  .st-brand__subtitle { display: none; }
  .st-brand__title { font-size: .9rem; max-width: none; }
  .st-header .st-container, body.st-catalog-page main .st-container { width: calc(100% - 24px); }
  .st-header__actions { gap: 4px; }
  .st-select-wrap--header { min-width: 92px; }
  .st-select-wrap--header .st-select { padding-inline: 10px 28px; font-size: .8rem; }
  body.st-catalog-page .st-title-xl { font-size: 1.3rem; }
  body.st-catalog-page .st-public-command-grid { grid-template-columns: minmax(0, 1fr); }
  body.st-play-page .st-container--content { width: calc(100% - 24px); }
  body.st-play-page #quizIntroView > .st-quiz-panel { gap: 16px; }
  body.st-play-page .st-quiz-panel { padding: 16px; }
  body.st-play-page .st-question-card { padding: 4px 0; }
  body.st-play-page #quizQuestionView > .st-quiz-panel { padding: 0 0 12px; }
  body.st-play-page #quizQuestionView .st-action-bar { bottom: 0; width: 100%; padding-bottom: env(safe-area-inset-bottom, 0px); background: var(--st-surface); }
  body.st-play-page #quizQuestionView .st-action-bar__inner { border-width: 1px 0 0; border-radius: 0; padding: 12px; box-shadow: none; }
  body.st-play-page #quizResultsView .st-footer-actions { bottom: 0; width: 100%; border-width: 1px 0 0; border-radius: 0; padding: 12px 12px calc(12px + env(safe-area-inset-bottom, 0px)); box-shadow: none; }
  body.st-open-page .st-open-shell { padding: 16px 0; }
  body.st-open-page .st-open-card { padding: 20px 16px; }
}
@media (max-width: 600px) {
  body.st-catalog-page .st-grid--cards { grid-template-columns: minmax(0, 1fr); }
  body.st-catalog-page #filtersPanel > .st-stack-md { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 380px) {
  .st-brand { gap: 6px; }
  .st-brand__mark { width: 32px; height: 32px; }
  .st-brand__title { max-width: 115px; }
  .st-header__inner { gap: 4px; }
  body.st-play-page .st-stat-chip { grid-template-columns: minmax(0, 1fr); }
  body.st-play-page .st-stat-chip__icon { width: 24px; height: 24px; margin-inline: auto; }
}

/* sheet_start_quiz.xml: bordered sections and connected mode buttons. */
body.st-play-page #quizIntroView { max-width: 680px; margin-inline: auto; padding-bottom: calc(100px + env(safe-area-inset-bottom, 0px)); }
body.st-play-page #quizIntroView > .st-setup-panel { display: flex; flex-direction: column; gap: 12px; padding: 16px; border-radius: 20px; }
body.st-play-page #quizIntroView .st-mode-card,
body.st-play-page #quizIntroView .st-behavior-card,
body.st-play-page #quizIntroView .st-modifier-times { width: 100%; padding: 12px; border: 1px solid var(--st-border); border-radius: 16px; background: var(--st-surface); }
body.st-play-page #quizIntroView .st-mode-card { gap: 8px; }
body.st-play-page #quizIntroView .st-mode-toggle { gap: 0; grid-template-columns: 1fr 1fr; }
body.st-play-page #quizIntroView .st-mode-option { min-height: 44px; padding: 8px 16px; border: 1px solid var(--st-primary); border-radius: 0; box-shadow: none; background: transparent; }
body.st-play-page #quizIntroView .st-mode-option:first-child { border-radius: 12px 0 0 12px; }
body.st-play-page #quizIntroView .st-mode-option:last-child { border-radius: 0 12px 12px 0; border-left-width: 0; }
body.st-play-page #quizIntroView .st-mode-option.is-selected { background: var(--st-primary); color: var(--st-text-on-primary); }
body.st-play-page #quizIntroView .st-mode-option strong { color: inherit; font-size: 13px; font-weight: 500; }
body.st-play-page #quizIntroView .st-mode-option small { display: none; }
body.st-play-page #quizIntroView .st-mode-description { font-size: 12px; line-height: 1.5; min-height: 72px; }
body.st-play-page #quizIntroView .st-modifiers { width: 100%; gap: 8px; }
body.st-play-page #quizIntroView .st-modifier-switch { min-height: 44px; margin-top: 6px; font-size: 14px; }
.st-setting-description { margin: 2px 0 0; min-height: 36px; font-size: 12px; line-height: 1.5; color: var(--st-text-3); }
.st-setting-divider { height: 1px; margin: 10px 0 4px; background: var(--st-answer-stroke); }
body.st-play-page #quizIntroView .st-modifier-times { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
body.st-play-page #quizIntroView .st-modifier-times .st-field { display: flex; flex-direction: column; align-items: stretch; justify-content: space-between; gap: 6px; }
body.st-play-page #quizIntroView .st-modifier-times .st-label { font-size: 14px; line-height: 1.4; text-transform: none; letter-spacing: normal; }
body.st-play-page #quizIntroView .st-modifier-times .st-select { font-size: 14px; border-radius: 12px; min-height: 44px; background: transparent; }
body.st-play-page #quizIntroView .st-setup-actions { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(16px + env(safe-area-inset-bottom, 0px)); width: min(calc(100% - 32px), 680px); padding: 12px 16px; background: var(--st-surface); border: 1px solid var(--st-border); border-radius: 16px; box-shadow: var(--st-shadow-md); z-index: 30; }
body.st-play-page #quizIntroView .st-setup-actions .st-toolbar__group { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); }

/* activity_test.xml and AnswerOptionView: white/dark surface and outline states. */
@media (min-width: 900px) {
  body.st-play-page #quizIntroView { max-width: 900px; }
  body.st-play-page #quizIntroView > .st-setup-panel { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 16px; }
  body.st-play-page #quizIntroView .st-setup-actions { width: min(calc(100% - 32px), 900px); }
}
:root { --st-option-correct: #03B162; --st-option-incorrect: #BF0000; }
:root[data-theme="dark"] { --st-option-correct: #0ACE76; --st-option-incorrect: #F84242; }
body.st-play-page:has(#quizQuestionView:not(.st-hidden)),
body.st-play-page:has(#quizQuestionView:not(.st-hidden)) .st-page { background: var(--st-surface); }
body.st-play-page #quizQuestionView > .st-quiz-panel { padding: 0 4px 12px; background: var(--st-surface); }
body.st-play-page #quizQuestionView .st-screen-nav { min-height: 56px; grid-template-columns: 44px minmax(0, 1fr) auto 44px; gap: 8px; }
body.st-play-page #quizQuestionView .st-icon-back { width: 44px; justify-content: center; padding: 0; border-radius: 50%; }
.st-close-icon { display: block; width: 24px; height: 24px; background: currentColor; mask: url('../img/android/close.svg') center / contain no-repeat; }
body.st-play-page #questionProgressPill { min-height: 26px; padding: 0 6px; border: 0; background: transparent; color: var(--st-text-3); font-size: 12px; }
body.st-play-page #quizQuestionView .st-quiz-topbar { margin-top: 0; }
body.st-play-page #quizQuestionView .st-quiz-topbar .st-toolbar { display: none; }
body.st-play-page #quizQuestionView .st-progress { height: 3px; margin: 0 8px; background: var(--st-answer-stroke); }
body.st-play-page #quizQuestionView > * + * { margin-top: 12px; }
body.st-play-page .st-question-card { padding: 0 4px; }
body.st-play-page .st-question-card > .st-stack-md { padding: 0 14px; }
body.st-play-page .st-question-card__title { min-height: 52px; font-size: 19px; line-height: 1.45; }
body.st-play-page .st-answer-option { border-width: 2px; min-height: 56px; padding: 10px 12px; }
body.st-play-page .st-answer-option__text { font-size: 14px; }
body.st-play-page .st-answer-option.is-selected { background: var(--st-surface); border-width: 2px; }
body.st-play-page .st-answer-option.is-correct { background: var(--st-surface); border-color: var(--st-option-correct); }
body.st-play-page .st-answer-option.is-incorrect { background: var(--st-surface); border-color: var(--st-option-incorrect); }
body.st-play-page .st-answer-option__state.is-correct { background: var(--st-option-correct); }
body.st-play-page .st-answer-option__state.is-incorrect { background: var(--st-option-incorrect); }
body.st-play-page #quizQuestionView .st-action-bar__grid { grid-template-columns: minmax(0, 1fr) 48px; grid-template-areas: 'skip skip' 'primary hint'; gap: 8px; }
body.st-play-page #quizQuestionView #skipQuestionButton { grid-area: skip; justify-self: end; min-width: 100px; min-height: 40px; padding: 8px 12px; border: 2px solid var(--st-answer-stroke); font-size: 13px; }
body.st-play-page #quizQuestionView #primaryQuestionButton { grid-area: primary; }
body.st-play-page #quizQuestionView #questionHintButton { grid-area: hint; width: 48px; padding: 0; border: 2px solid var(--st-answer-stroke); background: transparent; color: var(--st-text); }
.st-hint-icon { display: block; width: 24px; height: 24px; background: currentColor; mask: url('../img/android/lightbulb.svg') center / contain no-repeat; }
body.st-play-page #questionHint:not([open]) { display: none; }
body.st-play-page #questionHint { scroll-margin-bottom: 180px; background: var(--st-bg); border: 2px solid var(--st-answer-stroke); }
@media (max-width: 760px) {
  body.st-play-page #quizIntroView > .st-setup-panel { padding: 14px; }
  body.st-play-page #quizIntroView .st-setup-actions { bottom: 0; width: 100%; padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px)); border-width: 1px 0 0; border-radius: 0; box-shadow: none; }
  body.st-play-page .st-question-card { padding: 0; }
}

/* Feedback icons share the title's 28px line, including wrapped explanations. */
body.st-play-page .st-feedback-card { grid-template-columns: 28px minmax(0, 1fr); gap: 12px; padding: 14px; border-radius: 16px; align-items: start; }
body.st-play-page .st-feedback-card__icon { width: 24px; height: 24px; margin-top: 2px; border-radius: 0; background: var(--st-info); mask: url('../img/android/lightbulb.svg') center / contain no-repeat; }
body.st-play-page .st-feedback-card__icon--correct { background: var(--st-option-correct); mask-image: url('../img/android/check_circle_24px.svg'); }
body.st-play-page .st-feedback-card__icon--incorrect { background: var(--st-option-incorrect); mask-image: url('../img/android/cancel_circle_24px.svg'); }
body.st-play-page .st-feedback-card__content > .st-title-sm { display: flex; align-items: center; min-height: 28px; margin: 0; font-size: 14px; line-height: 1.4; }
body.st-play-page .st-feedback-card__content > .st-text-body { margin: 4px 0 0; font-size: 14px; line-height: 1.5; }

/* activity_results.xml: original trophies, score pill and compact colored stats. */
:root { --st-result-stat-surface: #FFFFFF; --st-results-halo-start: rgba(56, 189, 248, .11); }
:root[data-theme="dark"] {
  --st-result-stat-surface: #171F29;
  --st-results-halo-start: rgba(255, 255, 255, .11);
  --st-chip-green: #2FCF7A; --st-chip-yellow: #E7AE20;
  --st-chip-blue-1: #1A91D9; --st-chip-blue-2: #3E5BDD;
  --st-chip-red-1: #D94141; --st-chip-red-2: #E03A55;
}
body.st-play-page:has(#quizResultsView:not(.st-hidden)) .st-header { display: none; }
body.st-play-page #quizResultsView { max-width: 680px; padding-bottom: calc(120px + env(safe-area-inset-bottom, 0px)); }
body.st-play-page #quizResultsView .st-results-nav { min-height: 56px; margin-bottom: 12px; }
body.st-play-page #resultsCaptureCard { padding: 22px 18px; border-radius: 24px; }
body.st-play-page #resultsCaptureCard .st-results-card__content { gap: 10px; }
body.st-play-page #resultsCaptureCard .st-results-mode-row { margin: 0; justify-content: flex-end; }
body.st-play-page #resultsCaptureCard #resultsModeLabel { min-height: 26px; font-size: 12px; padding: 0 10px; }
body.st-play-page #resultsCaptureCard .st-result-emblem { width: 104px; height: 104px; margin: 0; justify-self: center; background: linear-gradient(180deg, var(--st-results-halo-start), var(--st-results-halo-end)); }
body.st-play-page #resultsTrophy { width: 84px; height: 84px; object-fit: contain; }
body.st-play-page #resultsCaptureCard #resultsTitle { font-size: 20px; line-height: 1.4; font-weight: 700; }
body.st-play-page #resultsCaptureCard #resultsMessage { font-size: 16px; line-height: 1.5; }
body.st-play-page #resultsCaptureCard .st-results-score-block { margin-top: 4px; gap: 4px; }
body.st-play-page #resultsCaptureCard #resultsScoreLabel { font-size: 11px; }
body.st-play-page #resultsCaptureCard #resultsScoreValue { padding: 8px 18px; border-radius: 18px; font-size: 34px; line-height: 1.25; min-width: 90px; background: var(--st-bg); border-color: var(--st-answer-stroke); color: var(--st-text); }
body.st-play-page #resultsCaptureCard .st-results-meta { margin-top: 0; gap: 4px; text-align: center; }
body.st-play-page #resultsCaptureCard #resultsQuizTitle { font-size: 16px; font-weight: 700; }
body.st-play-page #resultsCaptureCard #resultsAuthor { margin: 0; font-size: 14px; }
body.st-play-page #resultsCaptureCard .st-results-stats { margin-top: 4px; padding: 12px; border: 1px solid var(--st-answer-stroke); border-radius: 18px; }
body.st-play-page #resultsCaptureCard .st-results-grid { gap: 12px; }
body.st-play-page #resultsCaptureCard .st-stat-chip { grid-template-columns: 24px minmax(0, 1fr); gap: 8px; padding: 3px 3px 3px 12px; border-radius: 14px; min-height: 54px; }
body.st-play-page #resultsCaptureCard .st-stat-chip__icon { width: 24px; height: 24px; margin: 0; background: #FFFFFF; mask: url('../img/android/check_circle_24px.svg') center / contain no-repeat; font-size: 0; }
body.st-play-page #resultsCaptureCard .st-result-icon--accuracy { mask-image: url('../img/android/target_24px.svg'); }
body.st-play-page #resultsCaptureCard .st-result-icon--skipped { mask-image: url('../img/android/step_over_24px.svg'); }
body.st-play-page #resultsCaptureCard .st-result-icon--time { mask-image: url('../img/android/timer_24px.svg'); }
body.st-play-page #resultsCaptureCard .st-result-icon--incorrect { mask-image: url('../img/android/cancel_circle_24px.svg'); }
body.st-play-page #resultsCaptureCard .st-stat-chip__body { padding: 7px 8px; border-radius: 10px; text-align: center; background: var(--st-result-stat-surface); }
body.st-play-page #resultsCaptureCard .st-stat-chip__label { font-size: 11px; font-weight: 400; }
body.st-play-page #resultsCaptureCard .st-stat-chip__value { margin-top: 2px; font-size: 18px; line-height: 1.25; font-weight: 700; }
body.st-play-page #resultsCaptureCard .st-stat-chip--yellow { background: var(--st-chip-yellow); }
body.st-play-page #quizResultsView #retryQuizButton { background: var(--st-primary); color: var(--st-text-on-primary); }
@media (max-width: 380px) {
  body.st-play-page #resultsCaptureCard { padding: 20px 12px; }
  body.st-play-page #resultsCaptureCard .st-results-stats { padding: 8px; }
  body.st-play-page #resultsCaptureCard .st-results-grid { gap: 8px; }
  body.st-play-page #resultsCaptureCard .st-stat-chip { padding-left: 6px; gap: 4px; grid-template-columns: 20px minmax(0, 1fr); }
  body.st-play-page #resultsCaptureCard .st-stat-chip__icon { width: 20px; height: 20px; }
}

/* Get the app lives in the active toolbar, including question/results views. */
.st-toolbar-get-app { display: inline-flex; align-items: center; justify-content: center; gap: 8px; flex: 0 0 auto; min-height: 44px; padding: 8px 12px; border: 1px solid var(--st-border); border-radius: 12px; background: var(--st-banner); color: var(--st-primary); font-size: 13px; font-weight: 600; line-height: 1.4; white-space: nowrap; }
.st-toolbar-get-app:hover { border-color: var(--st-primary); background: var(--st-primary-soft); }
.st-toolbar-get-app:focus-visible { outline: 3px solid var(--st-primary); outline-offset: 3px; }
.st-toolbar-get-app__icon { display: block; width: 22px; height: 22px; flex-shrink: 0; background: currentColor; mask: url('../img/android/download.svg') center / contain no-repeat; }
body.st-catalog-page .st-public-command-grid { grid-template-columns: minmax(0, 1fr); }
body.st-play-page #quizQuestionView .st-screen-nav { grid-template-columns: 44px minmax(0, 1fr) auto auto 44px; }
body.st-play-page #quizResultsView .st-results-nav { grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; background: var(--st-surface); padding: 8px 12px; border: 1px solid var(--st-border); border-radius: 16px; }
body.st-play-page #quizResultsView .st-results-nav .st-toolbar-get-app { grid-column: 2; }
body.st-play-page #quizResultsView #shareResultsButton { grid-column: 3; }
.st-share-icon { display: block; width: 24px; height: 24px; flex-shrink: 0; background: currentColor; mask: url('../img/android/share.svg') center / contain no-repeat; }
@media (max-width: 760px) {
  .st-toolbar-get-app { width: 44px; padding: 0; }
  .st-toolbar-get-app__text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .st-header__actions { flex-shrink: 0; }
}
@media (max-width: 380px) {
  .st-header .st-brand__text { display: none; }
}