/* Shared public phone and tablet scale. Screen-only keeps worksheets printable. */
@media screen and (max-width: 1024px) {
  body:not(.admin-body) {
    --pad-x: clamp(16px, 3vw, 24px);
    --text-page: clamp(30px, 5.2vw, 34px);
    --text-section: clamp(20px, 6vw, 24px);
    --space-section: 40px;
    --space-stack: 24px;
    font-size: 16px;
    line-height: 1.6;
  }

  .section, .page-about .section {
    padding: var(--space-section) var(--pad-x);
  }
  .section__head, .page-about .section__head { margin-bottom: var(--space-stack); gap: 12px; }
  .goal { min-height: 0; }
  .goal__body, .chapter__grid { gap: var(--space-stack); }
  .goal__text, .chapter__body { min-width: 0; }
  .goal__line, .chapter__lead, .chapter__facts li, .socials__intro,
  .archive-page__intro, .entry-page__lead, .entry-page__body, .slop-lead, .slop-intro, .slop-specimen__check {
    font-size: 16px;
    line-height: 1.6;
    letter-spacing: 0;
  }
  .goal__line + .goal__line { margin-top: 16px; }
  .chapter__facts { margin-top: 16px; gap: 12px; }
  .goal__media-link { margin-top: 16px; font-size: 13px; }

  .archive-page, .entry-shell, .slop-shell, .cl {
    padding: var(--space-section) var(--pad-x);
    max-width: none;
  }
  .entry-page { padding: 0; }
  .ew-material { max-width: none; padding: var(--space-section) var(--pad-x); }
  body:not(.admin-body) main h1,
  body:not(.admin-body) main h1.section__title {
    font-size: var(--text-page);
    line-height: 1.2;
    letter-spacing: -.025em;
    margin-top: 0;
    overflow-wrap: anywhere;
    text-wrap: balance;
  }
  body:not(.admin-body) main h2,
  body:not(.admin-body) main h2.section__title {
    font-size: var(--text-section);
    line-height: 1.3;
    letter-spacing: -.02em;
    overflow-wrap: anywhere;
    hyphens: manual;
  }
  body:not(.admin-body) main h3 { font-size: 20px; line-height: 1.35; overflow-wrap: anywhere; }
  .archive-page__intro, .entry-page__lead, .slop-lead { margin-top: 16px; }
  .entry-page__meta, .archive-list__meta, .archive-card__meta { font-size: 13px; letter-spacing: 0; }
  .entry-page__body, .entry-page__cover { margin-top: var(--space-stack); }
  .entry-page__body > * + *, .entry-page__body p + p { margin-top: 20px; }
  .entry-page__body h3 { margin-top: 32px; }
  .archive-tools { margin-top: 20px; padding: 0; gap: 8px; }
  .archive-search input { min-height: 44px; padding-block: 8px; }
  .archive-tools__status { min-height: 24px; font-size: 12px; }
  .archive-tools__status button { min-height: 44px; padding-block: 10px; }
  .archive-search, .archive-tools__status { font-size: 13px; }
  .archive-list, .archive-tools ~ #archiveContent .archive-list { margin-top: var(--space-stack); gap: var(--space-stack); }
  .archive-list__preview { margin-bottom: 16px; }
  .archive-list__title { font-size: 20px; line-height: 1.35; }
  .archive-list__summary { margin: 12px 0 16px; }
  .archive-preview__grid { gap: 16px; }
  .archive-card, .archive-card:first-child { min-height: 0; padding: 20px; }
  .archive-card__title, .archive-card:first-child .archive-card__title { font-size: 20px; line-height: 1.35; }
  .archive-card__summary, .archive-card:first-child .archive-card__summary { font-size: 16px; line-height: 1.6; margin-top: 12px; }
  .archive-card__meta, .archive-card:first-child .archive-card__meta { margin-top: 16px; }

  .project--studio-feature { min-height: 0; padding: 20px; gap: 24px 12px; grid-template-columns: minmax(0, 1fr) 24px; }
  .studio-feature__brand { width: min(100%, 280px); }
  .studio-feature__tagline { font-size: 16px; line-height: 1.6; }
  .studio-feature__arrow { width: 24px; height: 24px; }
  .media__head { padding: 24px 0 16px; }
  .media__name { font-size: 20px; }
  .media__channel { display: grid; grid-template-columns: minmax(0, 1fr) 24px; padding: 16px; gap: 6px 12px; }
  .media__channel-name { grid-column: 1; grid-row: 1; font-size: 20px; line-height: 1.35; }
  .media__channel-note { grid-column: 1; grid-row: 2; font-size: 13px; line-height: 1.5; }
  .media__channel .project__arrow { grid-column: 2; grid-row: 1 / 3; align-self: center; width: 20px; height: 20px; margin: 0; }

  .socials__intro { margin-bottom: var(--space-stack); }
  .social {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 24px;
    align-items: start;
    gap: 6px 12px;
    padding: 16px;
    min-width: 0;
  }
  .social__name { grid-column: 1; grid-row: 1; font-size: 24px; line-height: 1.2; }
  .social__handle { grid-column: 1; grid-row: 2; min-width: 0; font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; }
  .social__tag { grid-column: 1; grid-row: 3; margin: 2px 0 0; font-size: 15px; line-height: 1.3; color: var(--steel); transform: none; }
  .social:is(.is-hovered, :focus-visible) .social__tag { color: var(--taupe); }
  .social__arrow { grid-column: 2; grid-row: 1 / 3; align-self: center; margin: 0; width: 20px; height: 20px; }
  .social__soon { grid-column: 2; grid-row: 1 / 3; align-self: center; justify-self: end; margin: 0; font-size: 15px; line-height: 1.3; transform: none; }
  .social--soon { grid-template-columns: minmax(0, 1fr) auto; }
  .social--soon:hover { padding-left: 16px; }

  .slop-intro { margin: 24px 0 40px; }
  .slop-catalog { margin-top: 40px; }
  .slop-specimen { padding-block: 24px; gap: 24px; }
  .slop-section__head { margin-bottom: 24px; }
  .slop-source, .slop-outro { margin-top: 24px; font-size: 13px; }

  /* Reading text has one scale, while dates and field guidance stay secondary. */
  .ew-material p, .ew-material .ew-intro p:first-child,
  .ew-material .ew-facts ul { font-size: 16px; line-height: 1.6; }
  .ew-material :is(.ew-date, .ew-language, .ew-fiction-note, .ew-example-nav__help,
    .ew-specimen__type, .ew-seed__label, .ew-field > p, .ew-worksheet__notes p,
    .ew-status, .ew-colophon) { font-size: 13px; line-height: 1.5; }
  .ew-date { margin-bottom: 24px; }
  .ew-material h2 { margin-bottom: 16px; }
  .ew-material h3 { margin-bottom: 16px; }
  .ew-material h4 { font-size: 16px; line-height: 1.5; }
  .ew-material .ew-specimen__type { margin-bottom: 16px; }
  .ew-guide { margin: 40px auto; }
  .ew-examples { padding-top: 0; }
  .ew-example { margin-top: 32px; }
  .ew-example + .ew-example { padding-top: 32px; }
  .ew-facts { gap: 16px; margin-block: 24px; }
  .ew-comparison section, .ew-comparison section + section { padding: 20px 16px 24px 0; }
  .ew-comparison section + section { padding-left: 16px; padding-right: 0; }
  .ew-annotations { margin: 16px 0 24px; }
  .ew-annotations ol { gap: 24px; }
  .ew-annotations strong, .ew-annotations p { font-size: 14px; line-height: 1.6; }
  .ew-specimens { gap: 24px; }
  .ew-example__conclusion { margin-top: 24px; }
  .ew-seed, .ew-form, .ew-actions { margin-top: 24px; gap: 16px; }
  .ew-field label, .ew-manual label { font-size: 16px; }
  .ew-telegram { margin-bottom: 24px; padding-top: 24px; }
  .ew-colophon { padding-bottom: 0; }

  /* All standalone articles use the same reading scale and top rhythm. */
  .bc-shell { width: 100%; max-width: 820px; padding: 40px var(--pad-x); }
  .bc-lead, .bc-prose, .bc-section { font-size: 16px; line-height: 1.65; }
  .bc-hero h1 { margin-bottom: 16px; }
  .bc-hero { padding-bottom: 24px; }
  .bc-lead { margin-bottom: 16px; }
  .bc-opening { margin-top: 24px; }
  .bc-section { margin-top: 36px; }
  .bc-section > h2, .bc-prose h2 { margin-bottom: 16px; }
  .bc-prose p, .bc-section > p { margin-bottom: 18px; }
  .bc-contents { margin-block: 24px; padding-block: 12px; gap: 0 24px; }
  .bc-check { padding: 20px 16px; margin-block: 24px; border-radius: var(--radius-control); }
  .bc-private { font-size: 13px; line-height: 1.5; margin-bottom: 20px; }
  .bc-check legend { font-size: 18px; margin-bottom: 10px; }
  .bc-check .bc-situations { margin-top: 24px; }
  .bc-situations, .bc-answer-options { gap: 8px; }
  .bc-situations label, .bc-answer-options label { min-height: 44px; padding: 10px 12px; font-size: 14px; line-height: 1.5; border-radius: var(--radius-control); }
  .bc-questions > fieldset { margin-bottom: 24px; padding-top: 20px; }
  .bc-questions fieldset > p { font-size: 15px; margin-bottom: 12px; }
  .bc-check summary { padding-block: 10px; font-size: 13px; }
  .bc-actions { margin-top: 20px; gap: 8px; }
  .bc-button { gap: 10px; min-height: 44px; padding: 10px 14px; border-radius: var(--radius-control); }
  .bc-check label { font-size: 16px; }
  .bc-check :is(.bc-situations, .bc-answer-options) label { font-size: 14px; }
  .bc-status:empty { min-height: 0; margin: 0; }
  .bc-notes { margin-top: 24px; gap: 20px; }
  .bc-results { margin-top: 24px; padding-top: 20px; }
  .bc-end { margin-top: 20px; }

  body:not(.admin-body) main :is(input, textarea, select) { font-size: 16px; }
  body:not(.admin-body) main button,
  .archive-preview__button, .ew-example-nav a, .ew-contents a, .ew-example__use { font-size: 14px; line-height: 1.5; }
  .archive-preview__button { padding: 12px 16px; letter-spacing: 0; }
  .cl__block { margin-top: 32px; }
  .cl-entry { padding-block: 24px; }
  .cl-entry__changes { font-size: 16px; line-height: 1.6; }
  .site-footer { padding: 24px var(--pad-x); gap: 16px; font-size: 13px; }
}

@media screen and (max-width: 600px) {
  .archive-page__intro { max-width: 36ch; }
  .archive-list, .archive-tools ~ #archiveContent .archive-list { gap: 0; margin-top: 16px; }
  .archive-list__link {
    display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 14px;
    align-items: start; height: auto; padding-block: 20px;
  }
  .archive-list__preview { width: 96px; aspect-ratio: 4 / 3; margin: 0; border-radius: 6px; }
  .archive-list__preview img { object-fit: contain; }
  .archive-list__body { grid-column: 2; min-width: 0; padding-right: 0; }
  .archive-list__link:not(:has(.archive-list__preview)) .archive-list__body { grid-column: 1 / -1; }
  .archive-list__title { font-size: 17px; line-height: 1.4; overflow-wrap: normal; }
  .archive-list__summary { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin: 8px 0 0; font-size: 14px; line-height: 1.5; }
  .archive-list__arrow { display: none; }
  .archive-page { padding-top: 32px; }
}

@media screen and (max-width: 360px) {
  .archive-list__link { grid-template-columns: 76px minmax(0, 1fr); gap: 12px; }
  .archive-list__preview { width: 76px; }
  .archive-list__title { font-size: 16px; }
}

@media screen and (max-width: 600px) {
  .ew-comparison section, .ew-comparison section + section { padding-inline: 0; }
  .ew-example-nav, .ew-form { grid-template-columns: minmax(0, 1fr); }
}

@media screen and (max-width: 768px) {
  .site-nav a { padding: 16px 2px; font-size: 24px; line-height: 1.25; }
  .site-nav a::before { content: none; }
}

/* A tall phone must not enlarge the face or add empty space above it. */
@media screen and (max-width: 1024px) and (orientation: portrait) {
  .hero { height: clamp(520px, calc(280px + 76vw), 680px); min-height: 0; max-height: none; }
  .hero__stage,
  .hero:has(.role.is-active, .role__link:focus-visible) .hero__stage { position: relative; display: block; padding: 0; height: 100%; width: 100%; }
  .hero__datetime, .hero__arrow { display: none; }
  .hero__hi { position: absolute; top: 84px; left: 50%; translate: -50% 0; margin: 0; font-size: 26px; }
  .hero__living { position: absolute; top: 118px; left: 50%; right: auto; bottom: auto; translate: -50% 0; margin: 0; font-size: 20px; line-height: 1.05; text-align: center; align-items: center; }
  .hero__living-line--offset { align-self: center; }
  .hero__portrait { position: absolute; top: auto; bottom: 0; left: 50%; translate: -50% 0; width: min(100%, calc(400px * 1800 / 1005)); max-width: none; height: calc(100% - 280px); aspect-ratio: auto; margin: 0; container-type: size; }
  .role { font-size: 13px; line-height: 1.3; }
  .role--entrepreneur { left: 50%; top: -108px; }
  .role--creator { left: max(12%, 60px); top: -76px; }
  .role--strategist { left: min(88%, calc(100% - 60px)); top: -76px; }
  .role--architect { left: max(14%, 60px); top: -44px; }
  .role--designer { left: min(86%, calc(100% - 60px)); top: -44px; }
  .role__card { width: min(336px, calc(100vw - 32px)); padding: 16px; bottom: auto; translate: -50% 0; }
  .role__card::before, .role__card::after { display: none; }
  .role__card-copy { font-size: 14px; line-height: 1.5; }
  .role__card-cta { font-size: 12px; }
  .role--entrepreneur .role__card { top: 108px; left: 50%; right: auto; bottom: auto; }
  .role--creator .role__card { top: 76px; left: calc(50% + 50cqw - max(12cqw, 60px)); right: auto; bottom: auto; }
  .role--architect .role__card { top: 44px; left: calc(50% + 50cqw - max(14cqw, 60px)); right: auto; bottom: auto; }
  .role--strategist .role__card { top: 76px; left: calc(50% - 50cqw + max(12cqw, 60px)); right: auto; bottom: auto; }
  .role--designer .role__card { top: 44px; left: calc(50% - 50cqw + max(14cqw, 60px)); right: auto; bottom: auto; }
  .hero:has(.role.is-active) .hero__living,
  .hero:has(.role:hover) .hero__living { opacity: 1 !important; visibility: visible !important; }
}