/* Tutti: a fixed first screen with a tall, round-headed conversion arch. */
:root { --layout-arch-width:480px; --layout-left-inset:58px; --layout-content-y:34px; --layout-content-gap:14px; }
.masthead { gap:12px; }
.masthead-beta { border:1px solid #668177; border-radius:4px; padding:1px 7px; font:500 .75rem var(--sans); letter-spacing:.07em; }
.masthead-nav { gap:22px; min-height:38px; }
.nav-quota { color:var(--leaf); font-size:.9375rem; white-space:nowrap; }
.prototype-bar { background:#e1be77; color:#25332b; padding:6px var(--gutter); font-size:.8125rem; display:flex; gap:18px; align-items:center; position:relative; z-index:25; }
.prototype-bar>div { display:flex; gap:14px; align-items:center; }
.prototype-bar strong { font-size:.625rem; letter-spacing:.1em; white-space:nowrap; }
.prototype-controls { margin-left:auto; flex:none; position:relative; }
.prototype-controls summary { cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.prototype-controls-body { position:absolute; right:0; top:calc(100% + 6px); background:#e1be77; box-shadow:0 8px 24px #173a3333; padding:0 16px 16px; width:332px; max-width:calc(100vw - 32px); }
.prototype-controls label { display:block; margin:18px 0 5px; }
.prototype-controls select { display:block; max-width:100%; width:300px; padding:8px; font:inherit; margin-bottom:16px; }
.prototype-controls-body button { display:block; margin-top:14px; }
.mvp-page { overflow-anchor:none; }
.hall {
  height:calc(100vh - var(--site-chrome-height, 65px));
  height:calc(100dvh - var(--site-chrome-height, 65px));
  min-height:0; padding:clamp(12px, 3dvh, 36px) var(--gutter);
}
.hall-grid { height:100%; min-height:0; grid-template-columns:minmax(0,1fr) minmax(310px,min(var(--layout-arch-width),50%)); padding-inline-end:min(var(--layout-left-inset),10%); gap:clamp(40px,8vw,130px); max-width:1200px; align-items:start; }
.hall-lead { min-height:0; padding:8px 0 0; margin:0; background:var(--myrtle-deep); }
.eyebrow { color:var(--brass); font-size:.875rem; letter-spacing:.14em; margin-bottom:22px; }
.hall h1 { font-size:clamp(2.8rem,4.7vw,4.2rem); line-height:1.05; max-width:10.8em; letter-spacing:-.025em; }
.hero-continuation { font:400 clamp(1.6rem,2.5vw,2.25rem)/1.35 var(--serif); margin-top:18px; color:var(--brass); }
.word-slot { display:inline-block; min-width:9.4ch; white-space:nowrap; }
.hall-beta { max-width:26em; margin-top:22px; padding-top:20px; }
.hall-beta strong { font-family:var(--sans); font-style:normal; font-size:1.125rem; color:var(--vellum); }
.input-scope { margin-top:20px; color:var(--leaf); font-size:1rem; max-width:29em; }
.input-scope p+p { margin-top:8px; }
.input-scope .scope-current { font-size:.875rem; color:#bccfc3; }
.hall-score { top:auto; bottom:-12px; height:clamp(180px,34dvh,430px); opacity:.72; mask-image:linear-gradient(to bottom,transparent,#000 20%); }
/* Frame dimensions depend only on the viewport, never on the active state. */
.converter-column { min-width:0; min-height:0; width:100%; height:min(100%,700px); contain:size; display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:minmax(0,1fr) auto; gap:12px; }
.arch-wrap { width:100%; height:100%; min-width:0; min-height:0; max-width:none; padding:10px; }
.arch-wrap::before { border-radius:999px 999px 0 0; border-bottom:0; }
/* Equal full-width top radii produce a semicircle, not four rounded corners.
   Keep the working area inside the dome's chord at every workflow state. */
.arch { border-radius:999px 999px 0 0; height:100%; min-height:0; display:block; padding:28% 26px 24px; }
.conversion-stage { height:100%; min-height:0; display:flex; flex-direction:column; align-items:center; }
.panel { height:auto; flex:0 0 auto; min-height:0; min-width:0; gap:var(--panel-fit-gap,var(--layout-content-gap)); width:100%; margin:0; }
.panel-heading { width:100%; }
.panel-heading .step-label { display:block; margin-bottom:5px; }
.panel--idle { position:static; padding:0; justify-content:center; }
.panel--selected,.panel--received,.panel--failed { padding-top:0; }
.panel--busy { justify-content:center; }
.panel-title { max-width:100%; font-size:1.75rem; line-height:1.1; }
.panel-title:focus { box-shadow:none; }
.panel-note,.panel-body { font-size:1rem; line-height:1.35; }
.panel .file { margin:2px 0; padding:12px; }
.panel .file-icon { width:28px; height:36px; }
.panel .file-name,.panel .file-in { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }
.panel .file-in { font-size:1rem; }
.file-line { display:flex; gap:12px; align-items:center; width:100%; }
.file-line .file-in { min-width:0; flex:1; text-align:left; }
.pdf-page-total { color:var(--ink-soft); font-size:.875rem; white-space:nowrap; }
.panel-actions { display:flex; flex-direction:column; align-items:center; gap:10px; width:100%; margin-top:0; padding-top:10px; }
.panel .panel-actions .btn { margin-top:0; min-height:48px; padding:10px 16px; font-size:1.0625rem; line-height:1.2; }
.panel-secondary { display:flex; gap:16px; justify-content:center; width:100%; }
.panel-secondary .link-button { font-size:.9375rem; }
.panel .field-error,.panel-error { position:static; margin:0; width:100%; color:var(--rubric); background:none; padding:0; font-size:.9375rem; line-height:1.3; text-align:left; }
.drop { border:0; padding:0; min-height:0; flex:0 0 auto; gap:clamp(10px,var(--layout-content-gap),22px); justify-content:center; }
.drop-title { font:500 2rem/1.15 var(--serif); }
.drop-page { width:40px; height:52px; margin-bottom:4px; }
.drop-hint { font-size:.875rem; margin:0; }
.demo-button { font-size:.875rem; }
.step-label { font-size:.75rem; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-soft); font-weight:700; }
.security-note { display:flex; align-items:center; gap:8px; max-width:400px; margin:0 auto; font-size:.8125rem; line-height:1.35; color:#bdcec2; text-align:left; background:var(--myrtle-deep); box-shadow:0 0 0 3px var(--myrtle-deep); }
.security-note svg { width:1em; height:1.1em; flex:none; margin:0; }
.consent { display:flex; align-items:flex-start; gap:10px; font-size:.9375rem; line-height:1.3; text-align:left; }
.consent input { accent-color:var(--myrtle-deep); height:18px; width:18px; flex:none; margin:2px 0; }
.consent a { text-underline-offset:2px; }
body[data-state="range"] [data-panel="range"],body[data-state="processing"] [data-panel="processing"],body[data-state="analyzing"] [data-panel="analyzing"],body[data-state="rejected"] [data-panel="rejected"] { display:flex; }
.page-range { display:grid; grid-template-columns:1fr auto 1fr; gap:16px; width:100%; align-items:center; margin-top:3px; text-align:left; }
.page-range label { min-width:0; font-weight:700; font-size:.875rem; }
.page-range .field { margin:4px 0 0; font-size:1.125rem; font-variant-numeric:tabular-nums; }
.quota-summary { display:flex; gap:8px; justify-content:space-between; width:100%; border-top:1px solid #c7d0c1; padding-top:10px; font-size:.9375rem; color:var(--ink-soft); }
.quota-summary strong { font-weight:500; white-space:nowrap; }
.range-message { width:100%; text-align:left; font-size:.875rem; line-height:1.3; color:var(--ink-soft); }
.range-message.is-error { color:var(--rubric); }
.busy-score { font:4rem var(--serif); color:var(--myrtle); animation:breathe 1.3s ease-in-out infinite alternate; }
@keyframes breathe { from{opacity:.35;transform:translateY(2px)}to{opacity:1;transform:translateY(-2px)} }
.completeness { font-size:1rem; color:var(--myrtle-deep); font-weight:700; line-height:1.3; }
.result-accounting { border-top:1px solid #c7d0c1; padding-top:10px; width:100%; font-size:.9375rem; color:var(--ink-soft); }
.trial-section { gap:80px; }
.trial-section .panel-note { margin-top:14px; max-width:100%; }
.local-login { text-align:left; margin-bottom:16px; }
.local-label { color:var(--brass-deep); font-weight:700; font-size:.875rem; margin-bottom:16px; }
.local-login .panel-note { margin-top:12px; font-size:.875rem; }
body[data-mode="prototype"] [data-google],body[data-mode="prototype"] .or-rule,body[data-mode="prototype"] [data-email-form] { display:none; }
.modal--survey { width:min(670px,calc(100vw - 28px)); padding:38px; }
.modal--survey>.step-label { margin-bottom:10px; }
.survey-question { border:0; border-top:1px solid #c7d0c1; padding:20px 0 8px; margin:0; min-width:0; }
.survey-question legend { font-weight:700; font-size:1.0625rem; line-height:1.35; padding:0 0 10px; float:left; width:100%; }
.survey-question legend+* { clear:both; }
.survey-option { display:flex; gap:10px; align-items:flex-start; font-size:1rem; margin:5px 0; padding:8px 10px; border:1px solid transparent; border-radius:4px; cursor:pointer; }
.survey-option:has(input:checked) { background:#d8e4d7; border-color:#91a593; }
.survey-option input { accent-color:var(--myrtle); margin:4px 0 0; width:17px; height:17px; flex:none; }
.survey-hint { font-size:.875rem; color:var(--ink-soft); margin:0 0 7px; }
.feature-counter { font-size:.8125rem; color:var(--ink-soft); text-align:right; }
.modal--survey [data-survey-error] { margin:10px 0; }
.modal--survey .panel-note { margin-top:14px; text-align:center; max-width:none; }
.score-action { margin-top:6px; font-size:.9375rem; }
button:disabled { cursor:not-allowed; }


@media(max-height:780px) and (min-width:761px) {
  .hall h1 { font-size:clamp(2.4rem,4.2vw,3.4rem); }
  .eyebrow { margin-bottom:14px; }
  .hall-beta { margin-top:18px; padding-top:12px; }
  .input-scope { margin-top:18px; font-size:.9375rem; }
  .arch { padding:28% 24px 18px; }
  .panel-heading .step-label { display:none; }
  .panel-title { font-size:1.5rem; }
  .panel-actions { gap:6px; padding-top:0; }
  .panel .panel-actions .btn { font-size:.9375rem; }
  .page-range .field { min-height:40px; padding:6px 10px; }
  .quota-summary { padding-top:6px; }
}
@media(max-width:1000px) {
  .hall-grid { gap:28px; grid-template-columns:minmax(0,1fr) minmax(290px,min(var(--layout-arch-width),60%)); }
  .hall h1 { font-size:clamp(2rem,4.4vw,2.8rem); }
  .hero-continuation { font-size:1.625rem; }
  .nav-quota { display:none; }
  .arch { padding-inline:24px; }
}
@media(max-width:760px) {
  .hall-grid { padding-inline-end:0; grid-template-columns:1fr; grid-template-rows:auto minmax(0,1fr); max-width:540px; gap:35px; align-items:start; }
  .hall { padding:22px var(--gutter) 16px; }
  .hall-lead { margin:0; padding:0; }
  .eyebrow { display:none; }
  .hall h1 { font-size:clamp(1.75rem,11.2vw,2.75rem); line-height:1.1; max-width:18em; }
  .hero-continuation,.input-scope { display:none; }
  .hall-beta { margin-top:14px; padding:0; border:0; font-size:min(1.09375rem,4.4vw); max-width:none; }
  .hall-beta strong { font-size:min(1.09375rem,4.4vw); }
  .hall-beta br { display:none; }
  .hall-score { display:block; height:220px; opacity:.45; }
  .converter-column { max-width:min(var(--layout-arch-width),350px); height:100%; max-height:500px; align-self:start; margin:0 auto; gap:8px; }
  .arch-wrap { padding:7px; }
  .arch-wrap::before { border-radius:999px 999px 0 0; }
  .arch { border-radius:999px 999px 0 0; min-height:0; padding:28% 22px 18px; }
  .panel-heading .step-label { display:none; }
  .panel-title { font-size:1.6rem; }
  .panel .panel-actions .btn { font-size:1rem; }
  .drop { gap:clamp(8px,var(--layout-content-gap),18px); }
  .drop-title { font-size:1.8rem; }
  .drop-page { width:30px; height:39px; }
  .masthead-nav { gap:15px; }
  .trial-section { gap:36px; }
  .modal--survey { padding:32px 22px; }
  .prototype-bar { gap:10px; padding-block:5px; }
  .prototype-bar>div { gap:8px; }
  .prototype-bar span,.prototype-controls summary { font-size:.75rem; }
  .security-note { font-size:.75rem; line-height:1.3; }
  .how,.terms,.why,.scenes,.articles,.faq { scroll-margin-top:80px; }
}
@media(max-width:400px) {
  .masthead-nav { gap:12px; font-size:.9375rem; }
  .masthead { gap:8px; }
  .masthead-nav>[data-open-feedback] { display:none; }
  .arch { padding:28% 20px 16px; }
  .panel-title { font-size:1.5rem; }
  .panel .panel-actions .btn { font-size:.9375rem; }
  .panel-secondary { gap:12px; }
  .panel-secondary .link-button { font-size:.875rem; }
  .quota-summary { gap:6px; font-size:.875rem; padding-top:6px; }
  .page-range { gap:10px; }
  .page-range .field { min-height:40px; padding:6px 10px; }
  .prototype-bar>div { gap:6px; }
  .prototype-bar strong { font-size:.5625rem; letter-spacing:.05em; }
  .prototype-bar span { font-size:.6875rem; }
  .prototype-controls-body { position:fixed; right:16px; left:16px; top:32px; width:auto; }
  .foot { gap:18px; }
}
/* Short portrait screens keep the form readable; repeated marketing detail stays in FAQ. */
@media(max-height:760px) and (max-width:760px) and (orientation:portrait) {
  .drop-page { display:none; }
  .arch { padding:28% 20px 14px; }
  .panel-actions { gap:6px; padding-top:0; }
  .panel-title { font-size:1.4rem; }
  .panel .file { padding:8px; }
  .panel .file-in,.panel .panel-note,.panel .panel-body,.completeness { font-size:.9375rem; }
  .panel .panel-actions .btn { padding:8px 12px; }
  .page-range .field { padding:6px 10px; min-height:40px; margin-top:2px; }
  .page-range label { font-size:.8125rem; }
  .quota-summary { padding-top:6px; }
}
/* The three-line big title only fits with every workflow state below 830px of height. */
@media(max-height:829px) and (max-width:760px) and (orientation:portrait) {
  .hall h1 { font-size:min(8.4vw,4.6dvh); }
}
@media(max-height:680px) and (max-width:760px) and (orientation:portrait) {
  .hall { padding-block:6px; }
  .hall-grid { gap:8px; }
  .hall h1 { font-size:1.5rem; }
  .hall-beta { margin-top:4px; font-size:.8125rem; }
  .hall-beta strong { font-size:.8125rem; }
}
/* Landscape phones use two columns rather than a very short stacked card. */
@media(max-height:520px) and (min-width:600px) {
  .masthead { padding-block:6px; }
  .masthead-nav { min-height:34px; }
  .hall { padding:8px 20px; }
  .hall-grid { padding-inline-end:0; grid-template-columns:minmax(0,.6fr) minmax(430px,1.4fr); grid-template-rows:1fr; gap:24px; align-items:center; max-width:1200px; }
  .hall h1 { font-size:1.65rem; }
  .eyebrow { display:none; }
  .hero-continuation,.input-scope { display:none; }
  .hall-beta { border:0; padding:0; margin-top:10px; font-size:.875rem; }
  .hall-beta strong { font-size:.875rem; }
  .input-scope { margin-top:10px; font-size:.8125rem; }
  .input-scope p:not(:first-child) { display:none; }
  .converter-column { height:100%; gap:4px; }
  .security-note { font-size:.6875rem; }
  .arch-wrap { padding:5px; }
  .arch-wrap::before { border-radius:50% 50% 0 0 / 58px 58px 0 0; }
  .arch { padding:34px 18px 12px; border-radius:50% 50% 0 0 / 53px 53px 0 0; }
  .panel-title { font-size:1.3rem; }
  .panel-heading .step-label { display:none; }
  .panel--range .panel-heading { display:none; }
  .panel .file { padding:5px 8px; }
  .panel .file-in,.panel .panel-note,.panel .panel-body,.completeness,.consent { font-size:.875rem; line-height:1.2; }
  .panel .file-icon { display:none; }
  .page-range { margin:0; }
  .page-range label { font-size:.75rem; }
  .page-range .field { min-height:36px; padding:3px 8px; margin-top:1px; font-size:1rem; }
  .quota-summary,.result-accounting { font-size:.8125rem; padding-top:4px; }
  .panel-actions { padding:0; gap:4px; }
  .panel .panel-actions .btn { min-height:42px; padding:5px 12px; font-size:.875rem; }
  .panel-secondary .link-button { font-size:.8125rem; }
  .drop { gap:4px; }
  .drop-page { width:20px; height:26px; }
  .drop-title { font-size:1.5rem; }
  .drop-hint { font-size:.8125rem; }
  .busy-score { font-size:3rem; }
}

/* Public preview is closed until a real converter is connected. */
/* The drop area takes drops only; clicking its empty space does nothing. */
[data-drop] { cursor:default; }
[data-drop]:hover:not(.is-over) { border-color:transparent; }
body[data-conversion-enabled="pending"] [data-drop], body[data-conversion-enabled="pending"] .security-note { visibility:hidden; }
body[data-conversion-enabled="false"] .security-note { visibility:hidden; }
body[data-conversion-enabled="false"] [data-choose-file] { background:#b9beb5; color:#46534c; opacity:1; cursor:not-allowed; }

/* Upload errors belong to the centered drop area, not a text-entry field. */
.panel [data-file-error] { text-align:center; }

/* A long list stays inside the arch: the result panel may not grow past the
   stage, and only the list scrolls, so the download button stays in view. */
.panel--received { flex:0 1 auto; max-height:100%; }
.panel--received > * { flex:none; }
.panel--received > .result-checks { flex:0 1 auto; min-height:4.5em; overflow-y:auto; overscroll-behavior:contain; }
.result-checks { width:100%; margin-top:6px; text-align:left; border-top:1px solid var(--vellum-deep); padding-top:10px; }
.result-checks-title { font-size:1rem; font-weight:600; margin:0 0 8px; text-align:center; }
.result-checks-list { margin:0; padding-left:1.1em; display:grid; gap:10px; }
.result-check-text { margin:0; font-size:.9375rem; line-height:1.35; }
.result-check-where { margin:2px 0 0; font-size:.8125rem; opacity:.75; overflow-wrap:anywhere; }

/* ---------- browser pre-check: verdict line and the PDF list ---------- */
.precheck-line { width:100%; margin:0; font-size:.9375rem; line-height:1.3; text-align:left; color:var(--ink-soft); }
.precheck-line[data-group="convert"] { color:var(--myrtle-deep); }
.precheck-line[data-group="unsupported"] { color:var(--rubric); }
.precheck-line[data-upload-only] { color:var(--ink-soft); }
/* One button: on a computer it offers PDF files or a folder (a native picker can't do both). */
.drop-local { font-size:.9375rem; line-height:1.3; color:var(--ink-soft); max-width:22em; }
.choose { position:relative; display:inline-flex; pointer-events:auto; }
.choose-menu { position:absolute; top:calc(100% + 6px); left:50%; transform:translateX(-50%); z-index:5; display:flex; flex-direction:column; min-width:100%; padding:4px; background:#fff; border:1px solid #b3bdb5; border-radius:6px; box-shadow:0 12px 28px -12px rgba(10,30,25,.45); }
.choose-menu button { font:inherit; font-size:1rem; text-align:left; white-space:nowrap; padding:9px 14px; border:0; border-radius:4px; background:none; color:var(--ink); cursor:pointer; }
.choose-menu button { display:flex; flex-direction:column; gap:2px; white-space:normal; min-width:16em; }
.choose-menu button strong { font-weight:700; }
.choose-menu button span:not(.choose-rec) { font-size:.875rem; color:var(--ink-soft); }
.choose-rec { margin-left:6px; padding:1px 6px; border-radius:3px; font-size:.75rem; font-weight:600; background:var(--vellum-deep); color:var(--myrtle); }
.choose-menu button:hover, .choose-menu button:focus-visible { background:var(--vellum-deep); outline:none; }
.modal--precheck .modal-title:focus { outline:none; box-shadow:none; }
.modal--precheck { width:min(640px,calc(100vw - 32px)); display:none; flex-direction:column; padding-bottom:26px; }
.modal--precheck[open] { display:flex; }
.modal--precheck .modal-lede { margin-bottom:8px; }
.precheck-progress { margin:0 0 10px; max-width:none; }
.precheck-progress:empty { display:none; }
.precheck-list { flex:1 1 auto; min-height:80px; overflow-y:auto; margin:0 -6px 12px; padding:0 6px; border-top:1px solid #c3cbbf; border-bottom:1px solid #c3cbbf; }
.precheck-group { padding:12px 0 4px; }
.precheck-group + .precheck-group { border-top:1px solid #d3d9cf; }
.precheck-group-title { font:700 1rem/1.3 var(--sans); margin:0; }
.precheck-group-note { font-size:.9375rem; color:var(--ink-soft); margin:2px 0 6px; }
.precheck-row { display:flex; align-items:flex-start; gap:10px; padding:8px 0; cursor:pointer; }
.precheck-row input { accent-color:var(--myrtle-deep); width:18px; height:18px; flex:none; margin:3px 0 0; }
.precheck-row[data-disabled] { cursor:default; }
.precheck-row[data-disabled] .precheck-name { color:var(--ink-soft); }
.precheck-text { min-width:0; flex:1; display:flex; flex-direction:column; }
.precheck-name { font-weight:700; line-height:1.3; overflow-wrap:anywhere; }
.precheck-reason { font-size:.9375rem; line-height:1.3; color:var(--ink-soft); }
.precheck-row[data-status="failed"] .precheck-reason { color:var(--rubric); }
.precheck-summary { font-size:.9375rem; margin:0 0 12px; color:var(--ink-soft); }
.modal--precheck .consent { margin-bottom:12px; }
.modal--precheck > .field-error { margin:-4px 0 12px; }
@media (max-width:560px) { .modal--precheck { padding:30px 18px 20px; } }