/* Desktop readability. Loaded last; layout can reflow when the browser is zoomed. */
:root { --text-secondary: #c3cbd7; --text-caption: #b6c0ce; }
html, body { font-size: 16px; }
body { line-height: 1.5; }
button, input, select { font-size: 16px; }
.sound-toggle, .guest, .skip-link { font-size: 16px; }
.sound-toggle { min-height: 48px; color: var(--text-secondary); }
.guest { color: var(--text-caption); letter-spacing: .06em; }
.muted { color: var(--text-secondary); font-size: 16px; }
.btn, .btn-primary, .btn-link, .tg-banner-cta, .season-more,
.rewards-to-cases, .modal-share, .modal-tg-later {
  font-size: 16px; line-height: 1.35; letter-spacing: .035em;
  min-height: 48px; height: auto; white-space: normal;
}
.preview-actions > .btn {
  font-size: 16px !important; line-height: 1.4 !important;
  min-height: 52px !important; height: auto !important;
  padding: 14px 18px !important; letter-spacing: .035em !important;
}
.btn-link.btn-contents { font-size: 16px; line-height: 1.4; padding: 12px 20px; }
.preview-headline { font-size: clamp(44px,4vw,54px); line-height: 1.08; }
.preview-lead, .season-copy p { font-size: 18px; line-height: 1.5; color: var(--text-secondary); }
.preview-stat-label, .preview-progress-label, .special-cases-title,
.preview-label, .preview-cases-meta-key, .section-label,
.season-eyebrow, .loading-eyebrow {
  font-size: 14px; line-height: 1.45; letter-spacing: .055em;
}
.preview-stat-label, .preview-stat-sub { color: var(--text-caption); }
.preview-stat-sub { font-size: 14px; line-height: 1.5; }
.preview-progress-text, .progress-context, .preview-cases-meta-val,
.special-case-label, .special-case-descr, .special-cases-foot, .special-cases-cta {
  font-size: 16px; line-height: 1.5;
}
.preview-progress-text, .progress-context, .special-case-descr { color: var(--text-secondary); }
.preview-progress-top { flex-wrap: wrap; gap: 10px 16px; }
.special-case-row { flex-wrap: wrap; row-gap: 3px; }
.preview-stats { align-items: stretch; }
.preview-stat { min-width: 0; }
.preview-stat-value { line-height: 1.25; }
.rule-title { font-size: 18px; line-height: 1.35; letter-spacing: .025em; }
.rule-desc, .rules-notes { font-size: 16px; line-height: 1.6; color: var(--text-secondary); }
.site-footer-left, .site-footer-right { font-size: 14px; line-height: 1.5; color: var(--text-caption); }
.season-copy { max-width: 580px; }
.season-copy h2 { font-size: clamp(34px,3vw,40px); }
.season-dialog { width: min(660px,calc(100vw - 40px)); }
.season-dialog p { font-size: 18px; line-height: 1.6; color: var(--text-secondary); }
.season-dialog .season-small { font-size: 16px; color: var(--text-secondary); }
.event-design-gallery figcaption { font-size: 16px; line-height: 1.5; }
.event-design-gallery figcaption span { font-size: 14px; color: var(--text-caption); }

/* Fewer columns leave room for readable names and complete model names. */
.prize-grid { grid-template-columns: repeat(auto-fit,minmax(190px,1fr)); gap: 16px; }
.prize-item { min-width: 0; height: auto; min-height: 284px; padding: 18px 12px; }
.prize-name { font-size: 16px; line-height: 1.35; letter-spacing: .025em; color: #edf0f5; }
.prize-rarity { font-size: 14px; line-height: 1.4; letter-spacing: .07em; margin-top: 12px; }
.prize-item.rarity-epic .prize-rarity { background: #7130b5; color: #fff; }
.prize-item.rarity-common .prize-rarity { background: #a2afc0; color: #101721; }
.event-prize-preview { grid-template-rows: auto minmax(140px,1fr) auto auto; gap: 8px; }
.event-prize-kicker { font-size: 14px; line-height: 1.4; letter-spacing: .025em; white-space: normal; }
.event-prize-edition { font-size: 16px; line-height: 1.35; white-space: normal; }
.event-prize-model { font-size: 16px; line-height: 1.4; color: var(--text-secondary); }
.event-prize-visual { height: 140px; }
.event-prize-render { height: 140px; min-height: 0; max-width: 100%; }
.event-info-eyebrow, .modal-sponsor-label, .modal-info-options-label,
.modal-note-rich .modal-note-title, .modal-won-badge, .prize-won-ribbon {
  font-size: 14px; line-height: 1.5; letter-spacing: .05em;
}
.modal-card { max-height: calc(100dvh - 48px); }
.modal-title { font-size: 28px; line-height: 1.25; }
.modal-desc, .modal-info-desc, .modal-info-card .modal-info-desc,
.modal-note, .modal-note-rich .modal-note-text, .dialog-intro, .contents-intro,
.modal-info-options-list li, .modal-info-specs-row dd, .event-info .modal-info-desc p {
  font-size: 18px; line-height: 1.6; color: var(--text-secondary);
}
.modal-info-specs-row dt { font-size: 16px; color: var(--text-caption); }
.event-info .modal-info-desc > p:first-child { font-size: 18px; }
.modal-info-specs-row { gap: 10px 20px; }
.modal-sponsor-link::after { font-size: 16px; }
.modal-unit, .modal-name { font-size: 16px; line-height: 1.5; }
#modal-result-card .modal-title { font-size: 16px; letter-spacing: .07em; }
#modal-result-card .modal-note { font-size: 18px; }
#modal-result-card .modal-close, #exchange-choice .btn { font-size: 16px; }
.result-saved, .history-item-date, .history-item-help { font-size: 14px; line-height: 1.5; color: var(--text-caption); }
.history-item-name { font-size: 18px; line-height: 1.4; }
.history-empty, .history-status, .action-error { font-size: 16px; line-height: 1.6; }
.history-item { min-width: 0; }
.history-item-meta { min-width: 0; }
.roulette-subtitle, .tile-name, .tile-unit { font-size: 14px; line-height: 1.35; letter-spacing: .025em; }
.tile-name, .tile-unit { color: #e0e6ef; }
.case-info .info-label { font-size: 16px; line-height: 1.5; }
.case-back { font-size: 16px; }

/* Telegram and intermediate states use the same scale as the main page. */
.tg-banner-sub, .modal-tg-desc, .modal-tg-qr-hint, .modal-legendary-desc,
.teaser-text { font-size: 18px; line-height: 1.6; }
.tg-banner-badge, .teaser-badge, .modal-tg-subtitle, .modal-tg-foot,
.loading-note, .legendary-tier-note { font-size: 14px; line-height: 1.5; }
.modal-tg-steps li, .modal-tg-waiting-text, .teaser-error { font-size: 16px; line-height: 1.5; }
.modal-tg-step-num { font-size: 14px; }
.teaser-form input, .teaser-form input::placeholder { font-size: 16px; }
#screen-loading .loading-text { font-size: 18px; max-width: 340px; }
.loading-note { color: var(--text-caption); }

/* Rewards: every condition remains legible, including future milestones. */
.rewards-nav button, .rewards-to-cases { font-size: 18px; }
.rewards-eyebrow, .rewards-streak .rewards-eyebrow { font-size: 14px; letter-spacing: .07em; }
.rewards-heading>div>p:last-child, .rewards-explainer,
.rewards-section-heading p:not(.rewards-eyebrow), .reward-tier p {
  font-size: 18px; line-height: 1.55; color: var(--text-secondary);
}
.rewards-explainer { max-width: 490px; }
.rewards-current>span { font-size: 18px; }
.rewards-current small, .rewards-streak-art figcaption, .rewards-month-total span,
.rewards-month-total small, .reward-tier-title>span, .reward-tier-bottom,
.rewards-updated { font-size: 14px; line-height: 1.5; color: var(--text-caption); }
.rewards-milestones { column-gap: 12px; }
.rewards-milestones li { padding-right: 0; }
.milestone-number { font-size: 28px; line-height: 1.25; }
.milestone-number small { font-size: 14px; }
.rewards-milestones li::after { top: 63px; }
.rewards-milestones b { font-size: 16px; line-height: 1.4; }
.rewards-milestones li>small { max-width: none; font-size: 14px; line-height: 1.5; color: var(--text-caption); }
.rewards-footnote { font-size: 16px; line-height: 1.6; color: var(--text-secondary); }
.rewards-details h3 { font-size: 18px; line-height: 1.4; }
.rewards-details p { font-size: 16px; line-height: 1.6; color: var(--text-secondary); }
.rewards-month-total small, .reward-tier.is-reached .reward-tier-title>span { color: var(--accent); }
.reward-tier-title, .reward-tier-bottom { flex-wrap: wrap; }
.rewards-section-heading { align-items: flex-start; }
.rewards-updated { color: var(--text-caption); }
.staging-toolbar, .staging-tools label, .staging-tools button, .staging-toolbar-heading b,
.staging-toolbar #demo-status { font-size: 14px; line-height: 1.5; }
.staging-tools select { font-size: 14px; max-width: 100%; }

/* Reflow supports smaller desktop windows and zoom, without shrinking type. */
@media (max-width:1100px) {
  .preview-hero { padding: 30px 28px; gap: 22px; }
  .preview-headline { font-size: 44px; }
  .preview-actions > .btn { flex-basis: 100%; }
  .rewards-milestones { grid-template-columns: repeat(4,minmax(0,1fr)); row-gap: 28px; }
  .rewards-milestones li:nth-child(4)::after { display: none; }
  .rewards-details { grid-template-columns: 1fr; gap: 24px; }
}
@media (max-width:800px) {
  .rewards-streak { grid-template-columns: 1fr; }
  .rewards-streak-art { position: static; width: 230px; margin: 18px auto 0; opacity: 1; }
  .rewards-streak h2 { max-width: none; }
  .rewards-streak-art figcaption { display: block; }
  .rewards-heading, .rewards-section-heading { display: block; }
  .rewards-month-total { text-align: left; margin-top: 20px; }
  .rewards-to-cases { padding-left: 0; }
  .milestone-number small { display: block; margin-left: 0; }
  .rewards-milestones li::after { top: 80px; }
}
@media (max-width:560px) {
  .rewards-milestones { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .rewards-milestones li:nth-child(even)::after { display: none; }
  .prize-grid { grid-template-columns: repeat(auto-fit,minmax(160px,1fr)); }
  .topbar-actions { gap: 12px; }
  .sound-toggle { font-size: 14px; }
}

/* Halloween event story: readable sections with the same site typography. */
.season-dialog { width: min(760px,calc(100vw - 40px)); }
.season-dialog .season-intro { margin-bottom: 24px; }
.season-dates { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; padding: 20px 0; border-block: 1px solid #3d414a; }
.season-dates span { display: block; color: var(--text-caption); font: 14px/1.5 var(--font-regular); margin-bottom: 5px; }
.season-dates strong { display: block; color: #ffe2c5; font: 18px/1.4 var(--font-body); }
.season-chapter { margin-top: 28px; }
.season-dialog .season-chapter h3 { margin: 0 0 12px; color: #fff1e5; font: 22px/1.3 var(--font-body); letter-spacing: -.01em; }
.season-chapter p { margin: 0 0 12px; }
.season-chapter .event-design-gallery { margin-top: 18px; }
.season-chapter .event-design-gallery img { height: 220px; aspect-ratio: auto; }
.season-chapter .event-design-gallery + p { margin-top: 14px; }
.season-after { padding-top: 24px; border-top: 1px solid #514338; }
@media(max-width:600px) { .season-dates { grid-template-columns: 1fr; gap: 14px; } .season-chapter .event-design-gallery img { height: 170px; } }

/* Event dialog typesetting: keep amounts intact and separate closing rules. */
.season-dialog { width: min(800px,calc(100vw - 40px)); padding: 40px; scrollbar-gutter: stable; }
.season-dialog p, .season-dialog dd { text-wrap: pretty; }
.season-dialog h2, .season-dialog h3 { text-wrap: balance; }
.season-dialog .season-nowrap { white-space: nowrap; }
.season-dialog .season-intro { margin-bottom: 28px; }
.season-dates { gap: 24px; padding-block: 22px; }
.season-chapter { margin-top: 32px; }
.season-dialog .season-chapter h3 { margin-bottom: 14px; }
.season-chapter .event-design-gallery { gap: 20px; }
.season-chapter .event-design-gallery + p { text-align: center; margin: 16px 0 0; }
.season-dialog .season-after {
  padding: 24px; border: 1px solid #514338; border-radius: 12px;
  background: linear-gradient(120deg,rgba(255,174,104,.055),rgba(255,174,104,.015));
}
.season-dialog .season-after > p { margin-bottom: 0; }
.season-dialog .season-after > p strong { color: #fff1e5; }
.season-after-rules { margin: 22px 0 0; }
.season-after-rules > div {
  display: grid; grid-template-columns: 155px minmax(0,1fr); gap: 24px;
  padding-block: 16px; border-top: 1px solid rgba(255,226,197,.12);
}
.season-after-rules > div:last-child { padding-bottom: 0; }
.season-after-rules dt { padding-top: 3px; color: #e5c8ae; font: 16px/1.5 var(--font-body); }
.season-after-rules dd { margin: 0; min-width: 0; color: var(--text-secondary); font: 18px/1.55 var(--font-regular); }
.season-dialog .btn-primary { margin-top: 28px; }
@media(max-width:600px) {
  .season-dialog { padding: 30px 24px; }
  .season-dialog .season-after { padding: 20px; }
  .season-after-rules > div { grid-template-columns: 1fr; gap: 6px; }
}