[hidden] { display:none!important; }
body.home-mode { background:#faf9f6;color:#191b19; }
body.home-mode > .demo { display:none; }
.home { min-height:100vh;background:#faf9f6;color:#191b19; }
body:not(.home-mode) .home { display:none; }
.home-nav { display:flex;align-items:center;justify-content:space-between;padding:26px 5vw;border-bottom:1px solid #191b1915; }
.home-nav .demo-brand { color:#191b19; }
.home button:not(.invocation-pill) { background:none;border:0;color:inherit;font:600 .875rem/1.4 Arial,sans-serif;cursor:pointer; }
.home button:focus-visible { outline:3px solid #ff4b18;outline-offset:5px; }
.home-main { max-width:1000px;margin:auto;padding:44px 24px 48px;text-align:center; }
.home-eyebrow { font-size:.75rem;font-weight:700;letter-spacing:.14em;color:#686962; }
.home h1 { margin:18px 0 14px;font:400 clamp(3.2rem,6vw,5.2rem)/.98 Georgia,serif;letter-spacing:-.05em; }
.home h1 em { color:#d83d0e; }
.home-description { font:1.05rem/1.5 Arial,sans-serif;color:#595c55;margin:0 0 24px; }
.home-capture { max-width:700px;margin:auto;text-align:left;padding:22px 26px;border:1px solid #dcded5;border-radius:24px;background:#fff;box-shadow:0 16px 60px #1d211008; }
.preview-label { margin:0 0 14px;color:#6e7168;font-size:.75rem;line-height:1.5;letter-spacing:.04em; }
.home #liveSquireForm > label { display:block;font-size:1rem;color:#252923;margin:8px 0; }
.home #liveSquireInput { width:100%;min-height:112px;padding:14px;border:1px solid #d9dbd3;border-radius:12px;background:#fafbf8;color:#171b15;font:1rem/1.5 Arial,sans-serif;resize:vertical; }
.home .capture-file { margin-top:12px; }
.home .capture-file label { padding:12px;color:#42483d; }
.home .capture-file label b,.home .capture-file label small { font-size:.8rem;letter-spacing:0; }
.home .capture-privacy { font-size:.8rem;line-height:1.5;color:#62685b; }
.home .capture-ready { padding:20px 0; }
.home .capture-ready h3 { font:2rem/1.1 Georgia,serif; }
.home .capture-ready p { font-size:1rem;line-height:1.6; }
.demo-entrance { margin:32px auto 0;max-width:860px;text-align:left; }
.demo-entrance > div { display:flex;align-items:center;justify-content:space-between;gap:15px; }
.demo-entrance h2 { font:400 1.4rem/1.3 Georgia,serif; }
#homeScenes { display:flex;gap:8px;flex-wrap:wrap; }
.home #homeScenes button { border:1px solid #cccec5;border-radius:999px;padding:12px 17px;transition:background .2s,border-color .2s; }
.home #homeScenes button:hover { background:#fff0e8;border-color:#ff4b18; }
.demo-entrance > p { font-size:.8rem;color:#6b7165;line-height:1.5; }
/* Shared reading rhythm: lower, balanced, and clear of scene navigation. */
.stage .story,.stage.ai-output .story { top:29%;bottom:130px;display:flex;flex-direction:column;justify-content:center; }
.stage .story > small { line-height:1.5;font-size:.75rem; }
.stage .story .scene-count { margin:20px 0 18px; }
.stage .story h1 { line-height:1; }
.stage .story blockquote { margin:28px 0 0;line-height:1.18; }
.stage .story .invocation-question { margin-top:30px; }
.stage .story .tier-badge { margin-top:20px; }
@media(max-width:760px) {
  .home-nav { padding:20px; }.home-main { padding:28px 18px; }.home-capture { padding:18px; }
  .stage .story,.stage.ai-output .story { top:46%;bottom:110px;justify-content:center; }
  .stage .story h1 { font-size:clamp(2.1rem,7vw,3rem); }
  .stage .story blockquote { margin-top:18px;font-size:1.35rem; }
  .stage .story .scene-count { margin:10px 0; }.stage .story .invocation-question { margin-top:16px; }
  .demo-entrance > div { align-items:flex-start; }.demo-entrance h2 { margin-top:0; }
}

/* Keep the everyday demo readable on narrow and short screens. */
@media(max-width:900px) {
  .stage:not(.is-pro) .moment-rail[data-mode="squire"] { grid-template-columns:repeat(6,minmax(155px,1fr));overflow-x:auto;overscroll-behavior-x:contain; }
}
@media(max-width:760px) {
  .stage:not(.is-pro) { height:auto;min-height:100svh;padding:190px 24px 28px;overflow:visible; }
  .stage:not(.is-pro) .story { position:relative;inset:auto;width:100%;max-width:none;justify-content:flex-start; }
  .stage:not(.is-pro) .story>* { flex-shrink:0; }
  .stage:not(.is-pro) .story .floating-invocation { max-width:100%;margin-bottom:28px; }
  .stage:not(.is-pro) .moment-rail[data-mode="squire"] { position:relative;inset:auto;width:100%;height:auto;min-height:80px;margin-top:24px;padding-bottom:8px;background:transparent; }
  .stage:not(.is-pro) .moment-rail button { min-height:72px; }
  .stage:not(.is-pro) .moment-rail button span { font-size:.875rem;line-height:1.3; }
  .stage:not(.is-pro) .scene-arrows { position:relative;inset:auto;margin-top:16px;justify-content:flex-end; }
  .stage:not(.is-pro) .scene-arrows button { width:44px;height:44px; }
  .demo-nav { height:auto;min-height:84px;padding:12px 18px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px; }
  .demo-nav .mode-switch button { min-height:44px;font-size:.6875rem;letter-spacing:.04em; }
}