

  :root{
    --void-top:   #06060b;
    --void-mid:   #100f18;
    --void-low:   #17151f;
    --storm-deep: #211f30;
    --storm-mid:  #38344c;
    --storm-light:#4a4562;
    --mist:       #9a93b8;
    --glass:      #cdc4ef;
    --flash:      #eef0ff;
    --ink:        #e9e5f4;
    --muted:      #8d87a3;
  }

  *{ box-sizing:border-box; }

  html,body{
    margin:0;
    height:100%;
    background:var(--void-mid);
    overflow-x:hidden;
  }

  body{
    font-family:'EB Garamond', serif;
    color:var(--ink);
  }

  a{ color:inherit; }

  /* ---------- back layer: the Tempest, with a still-cloud fallback ---------- */

  .stage-back{
    position:fixed;
    inset:0;
    z-index:0;
    background:
      radial-gradient(ellipse at 50% -10%, var(--void-low) 0%, transparent 55%),
      linear-gradient(180deg, var(--void-top) 0%, var(--void-mid) 55%, var(--void-low) 100%);
    overflow:hidden;
  }

  .tempest-canvas{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    filter:brightness(.82);
  }
  .tempest-canvas[hidden]{ display:none; }

  .cloud-shade{
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, rgba(6,6,11,.55) 0%, transparent 32%, transparent 62%, rgba(6,6,11,.65) 100%);
  }

  .cluster{ position:absolute; will-change:transform; }

  .puff{
    position:absolute;
    border-radius:42% 58% 65% 35% / 55% 45% 60% 40%;
  }

  .puff.mid{ filter:blur(40px); }
  .puff.wisp{ filter:blur(18px); opacity:.8; }

  @keyframes driftA{
    0%   { transform:translate3d(0,0,0) rotate(0deg); }
    100% { transform:translate3d(4vw,3vw,0) rotate(3deg); }
  }
  @keyframes driftB{
    0%   { transform:translate3d(0,0,0) rotate(0deg); }
    100% { transform:translate3d(-5vw,4vw,0) rotate(-2.5deg); }
  }
  @keyframes driftC{
    0%   { transform:translate3d(0,0,0) scale(1); }
    100% { transform:translate3d(-3vw,-2vw,0) scale(1.06); }
  }

  /* ---------- page: real document flow, sits above back layer ---------- */

  .page{
    position:relative;
    z-index:2;
    min-height:100vh;
    display:flex;
    flex-direction:column;
  }

  .content{
    flex:1;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:8vh 6vw 4vh;
  }

  .eyebrow{
    font-family:'Cinzel', serif;
    font-weight:600;
    font-size:clamp(.64rem, 1.5vw, .9rem);
    letter-spacing:.32em;
    text-indent:.32em; /* balance the trailing tracking */
    color:var(--muted);
    margin:clamp(1.4rem, 3.5vw, 2.4rem) 0 0;
  }

  .title-wrap{
    position:relative;
    line-height:1;
  }

  .coming-soon{
    margin:0;
    font-family:'Grenze Gotisch', serif;
    font-weight:300;
    font-size:clamp(3.4rem, 13vw, 8.5rem);
    letter-spacing:.02em;
    color:var(--ink);
    text-shadow:
      0 0 18px rgba(205,196,239,.35),
      0 0 48px rgba(120,110,170,.25),
      0 6px 30px rgba(0,0,0,.6);
  }

  .credit{
    margin:clamp(1.6rem, 4vw, 2.6rem) 0 0;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:.55rem;
  }

  .credit-lead{
    font-family:'EB Garamond', serif;
    font-style:italic;
    font-weight:400;
    font-size:clamp(.85rem, 1.6vw, 1rem);
    letter-spacing:.04em;
    color:var(--muted);
  }

  .credit-name{
    font-family:'Cinzel', serif;
    font-weight:500;
    font-size:clamp(1.05rem, 2.4vw, 1.5rem);
    letter-spacing:.16em;
    color:var(--mist);
  }

  /* ---------- footer ---------- */

  .follow{
    position:relative;
    padding:0 6vw clamp(3rem, 6vh, 4.5rem);
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:1.1rem;
  }

  .follow-label{
    font-family:'Cinzel', serif;
    font-size:clamp(.72rem, 1.5vw, .85rem);
    letter-spacing:.32em;
    text-indent:.32em;
    color:var(--muted);
  }

  .social-row{
    display:flex;
    gap:1.4rem;
  }

  .social{
    display:flex;
    align-items:center;
    justify-content:center;
    width:48px;
    height:48px;
    border:1px solid rgba(205,196,239,.28);
    border-radius:50%;
    text-decoration:none;
    transition:border-color .35s ease, box-shadow .35s ease, transform .35s ease;
  }

  .social svg{
    width:19px;
    height:19px;
    stroke:var(--ink);
    fill:none;
    stroke-width:1.4;
    transition:stroke .35s ease;
  }

  .social:hover,
  .social:focus-visible{
    border-color:var(--glass);
    box-shadow:0 0 22px rgba(205,196,239,.35);
    transform:translateY(-2px);
    outline:none;
  }
  .social:hover svg,
  .social:focus-visible svg{ stroke:var(--glass); }

  /* ---------- ambient sound toggle ---------- */

  .sound-toggle{
    position:fixed;
    top:clamp(1.2rem, 3vw, 2rem);
    right:clamp(1.2rem, 3vw, 2rem);
    z-index:5;
    display:flex;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    background:rgba(6,6,11,.35);
    border:1px solid rgba(205,196,239,.28);
    border-radius:50%;
    cursor:pointer;
    transition:border-color .35s ease, box-shadow .35s ease;
  }
  .sound-toggle svg{
    width:18px;
    height:18px;
    stroke:var(--ink);
    fill:none;
    stroke-width:1.4;
  }
  .sound-toggle .icon-on{ display:none; }
  .sound-toggle.is-on .icon-on{ display:block; }
  .sound-toggle.is-on .icon-off{ display:none; }

  .sound-toggle:hover,
  .sound-toggle:focus-visible{
    border-color:var(--glass);
    box-shadow:0 0 18px rgba(205,196,239,.3);
    outline:none;
  }
  .sound-toggle.is-on{ border-color:rgba(255,84,56,.55); }
  .sound-toggle.is-on svg{ stroke:var(--glass); }

  /* ---------- front layer: veiling mist + lightning + grain, sits above the page but ignores clicks ---------- */

  .stage-front{
    position:fixed;
    inset:0;
    z-index:3;
    pointer-events:none;
    overflow:hidden;
  }

  .cluster.front .puff{
    mix-blend-mode:screen;
  }
  .cluster.front .puff.mid{
    background:
      radial-gradient(ellipse at 35% 30%, rgba(200,194,228,.5) 0%, transparent 55%),
      radial-gradient(circle, var(--mist) 0%, var(--storm-mid) 60%, transparent 76%);
  }
  .cluster.front .puff.wisp{
    background:radial-gradient(circle, var(--mist) 0%, var(--storm-light) 60%, transparent 78%);
  }

  .cf1{ width:56vw; height:30vw; top:36vh; left:-14vw;  opacity:.32; animation:driftB 52s ease-in-out infinite alternate; }
  .cf2{ width:46vw; height:26vw; top:26vh; right:-16vw; opacity:.26; animation:driftA 64s ease-in-out infinite alternate-reverse; }
  .cf3{ width:40vw; height:24vw; top:56vh; left:26vw;   opacity:.2;  animation:driftC 46s ease-in-out infinite alternate; }

  .grain{
    position:absolute;
    inset:0;
    background-image:radial-gradient(rgba(255,255,255,.6) 1px, transparent 1px);
    background-size:3px 3px;
    mix-blend-mode:overlay;
    opacity:.05;
  }

  .vignette{
    position:absolute;
    inset:0;
    background:radial-gradient(ellipse at 50% 50%, transparent 45%, rgba(0,0,0,.55) 100%);
  }

  /* ---------- small screens ---------- */

  @media (max-width:520px){
    .eyebrow{ letter-spacing:.2em; text-indent:.2em; }
    .social-row{ gap:1.6rem; }
  }

  /* ---------- respect reduced motion ---------- */

  @media (prefers-reduced-motion:reduce){
    .cluster,.flash{ animation:none !important; }
    .flash{ opacity:0 !important; }
    .stage-back{ background:linear-gradient(180deg, var(--void-top) 0%, var(--storm-deep) 55%, var(--void-low) 100%); }
  }


/* Release pages: the original storm, typography and effects are retained. */
:root { --muted:#b2abc6; }
.page { min-height:100svh; }
.skip-link { position:fixed; top:0; left:1rem; transform:translateY(-120%); z-index:10; background:var(--void-top); padding:1rem; }
.skip-link:focus { transform:translateY(0); }
.site-header { padding:1.5rem max(5vw, 1rem) 0; }
.site-nav { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:.3rem 1.7rem; max-width:1180px; margin:auto; padding:.6rem 0 1.2rem; border-bottom:1px solid rgba(205,196,239,.18); }
.site-nav a { font-family:'Cormorant Garamond',serif; font-weight:700; font-size:.76rem; letter-spacing:.06em; text-decoration:none; padding:.75rem 0; color:var(--mist); transition:color .2s; }
.site-nav a:hover,.site-nav a[aria-current=page] { color:var(--ink); }
.site-nav a[aria-current=page] { box-shadow:0 1px var(--glass); }
a:focus-visible,button:focus-visible { outline:2px solid var(--glass); outline-offset:5px; }
.site-nav .buy-link { border:1px solid rgba(205,196,239,.4); padding:.75rem 1rem; }
.content { padding:4rem 5vw 2.5rem; }
.series-title { max-width:1100px; margin:0; font-family:'Grenze Gotisch',serif; font-weight:300; font-size:clamp(3rem,7.5vw,7rem); line-height:1.08; text-wrap:balance; text-shadow:0 0 18px rgba(205,196,239,.3),0 6px 30px rgba(0,0,0,.6); }
.book-number { font-family:'Cormorant Garamond',serif; font-weight:600; margin:1.4rem 0 0; color:var(--glass); }
.book-title { font-family:'Cormorant Garamond',serif; font-weight:600; font-size:clamp(1.15rem,2.5vw,2rem); line-height:1.5; letter-spacing:.08em; margin:1rem 0 0; text-wrap:balance; }
.countdown-wrap { width:min(100%,500px); margin:2.4rem auto 0; }
.countdown { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); padding:1.15rem 0; border-top:1px solid rgba(205,196,239,.3); border-bottom:1px solid rgba(205,196,239,.3); }
.countdown-unit + .countdown-unit { border-left:1px solid rgba(205,196,239,.18); }
.countdown-value { display:block; font-family:'Grenze Gotisch',serif; font-size:clamp(2.15rem,calc(4.6vw + .25rem),3.45rem); font-variant-numeric:tabular-nums; font-weight:100; line-height:1.25; }
.countdown-label { display:block; font-family:'Cinzel',serif; font-size:.6rem; letter-spacing:.16em; color:var(--muted); margin-top:.45rem; }
.release-date { font-size:.95rem; letter-spacing:.04em; color:var(--muted); margin:1rem 0 0; }
.release-status { font-family:'Cinzel',serif; letter-spacing:.16em; }
[hidden] { display:none !important; }
.credit { margin:1.8rem 0 0; gap:.3rem; }
.credit-name { font-size:1.1rem; }
.home-intro { width:min(100%,42rem); margin:1.8rem 0 0; padding:1rem 1.25rem; font-size:1.15rem; line-height:1.6; color:var(--ink); background:rgba(6,6,11,.72); text-wrap:pretty; }
.home-intro a { text-underline-offset:.18em; }
.follow { padding:0 5vw 1.7rem; gap:.75rem; }
.follow-label { margin:0; font-size:.65rem; }
.social { width:40px; height:40px; }
.sound-toggle { position:static; flex-shrink:0; width:auto; min-height:44px; border-radius:24px; padding:0 1rem; gap:.6rem; }
.sound-label { color:var(--ink); font-family:'Cinzel',serif; font-size:.65rem; letter-spacing:.05em; }
.sound-error { color:var(--ink); text-align:center; font-size:.9rem; }
.sound-controls { display:flex; flex-direction:column; align-items:center; margin-top:.2rem; position:relative; z-index:5; }
.placeholder-title { font-family:'Cormorant Garamond',serif; font-size:clamp(1rem,3vw,1.6rem); font-weight:600; letter-spacing:.15em; margin:0 0 2rem; }
.placeholder .coming-soon { font-size:clamp(3.5rem,10vw,7.5rem); }
.placeholder { padding-block:5rem; }
@media(max-width:600px) {
 .site-header { padding-top:.6rem; }
 .site-nav { gap:0 1rem; padding-bottom:.6rem; }
 .site-nav a { font-size:.64rem; padding:.65rem 0; }
 .site-nav .buy-link { padding:.5rem .7rem; }
 .content { padding:2.7rem 6vw 2.2rem; }
 .series-title { max-width:440px; }
 .countdown-wrap { margin-top:1.8rem; }
 .countdown-label { font-size:.52rem; letter-spacing:.1em; }
 .release-date { font-size:.85rem; }
 .placeholder { padding-block:5rem; }
}

/* Independent music and effects controls. */
.sound-buttons { display:flex; justify-content:center; flex-wrap:wrap; gap:.6rem; }
.sound-buttons .sound-toggle { height:44px; min-width:88px; padding:0 .9rem; }
.sound-buttons .sound-toggle.is-muted { border-color:rgba(205,196,239,.5); background:rgba(205,196,239,.12); }
.sound-error { display:block; min-height:1.25em; margin-top:.45rem; font-size:.8rem; }
@media(max-width:360px) {
 .sound-buttons { gap:.4rem; }
 .sound-buttons .sound-toggle { min-width:0; padding:0 .75rem; }
}

/* Secondary page link and copyright. */
.footer-nav { display:flex; justify-content:center; }
.footer-nav a { font-family:'Cormorant Garamond',serif; font-weight:600; font-size:1rem; letter-spacing:.04em; padding:.3rem .6rem; text-decoration:none; color:var(--muted); }
.footer-nav a:hover, .footer-nav a[aria-current="page"] { color:var(--ink); text-decoration:underline; text-underline-offset:.25em; }
.copyright { margin:.25rem 0 0; font-family:'EB Garamond',serif; font-size:.85rem; color:var(--muted); text-align:center; }
@media(pointer:coarse) { .footer-nav a { min-height:44px; display:flex; align-items:center; } }

/* Readable credits and ownership information within the existing storm design. */
.acknowledgements { justify-content:flex-start; align-items:stretch; padding-block:3.5rem 4rem; }
.acknowledgements > .placeholder-title { text-align:center; overflow-wrap:anywhere; }
.acknowledgements-copy { width:min(100%,800px); margin:0 auto; padding:clamp(1.25rem,4vw,2.75rem); text-align:left; background:rgba(6,6,11,.78); border:1px solid rgba(205,196,239,.18); font-family:'EB Garamond',serif; font-size:1.25rem; line-height:1.55; }
.acknowledgements-copy section + section { margin-top:2rem; padding-top:1.75rem; border-top:1px solid rgba(205,196,239,.2); }
.acknowledgements-copy h2 { margin:0 0 1rem; font-family:'Cormorant Garamond',serif; font-weight:600; font-size:1.75rem; line-height:1.2; color:var(--glass); }
.acknowledgements-copy p { margin:.9rem 0 0; }
.acknowledgements-copy a { text-decoration-thickness:1px; text-underline-offset:.18em; }
.acknowledgements-copy a:hover { color:var(--glass); }
.music-credits { display:grid; grid-template-columns:max-content 1fr; gap:.3rem 1.5rem; margin:0 0 1rem; }
.music-credits dt { color:var(--muted); }
.music-credits dd { margin:0; }
.font-credits { margin:1rem 0; padding-left:1.2rem; }
.font-credits li + li { margin-top:.85rem; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
@media(max-width:600px) {
 .acknowledgements { padding-block:2.5rem; }
 .acknowledgements > .placeholder-title { font-size:1.5rem; letter-spacing:.05em; }
 .music-credits { grid-template-columns:1fr; gap:0; }
 .music-credits dt:not(:first-child) { margin-top:.65rem; }
}

/* Tempest integration: the same renderer persists during in-page navigation. */
.stage-back{
  background:#08070f url("tempest-still.jpg") center / cover no-repeat;
}
.visual-controls{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:.55rem;
  margin:1rem 0 .25rem;
}
.visual-controls[hidden]{ display:none; }
.tempest-paused .cluster{ animation-play-state:paused !important; }

/* Book copy and the exclusive FAQ accordion share the established reading style. */
.reading-page { justify-content:flex-start; align-items:stretch; padding-block:3.5rem 4rem; }
.reading-title { width:min(100%,850px); margin:0 auto 2rem; font-family:'Cormorant Garamond',serif; font-weight:600; font-size:clamp(2rem,5vw,3.25rem); line-height:1.15; text-align:center; text-wrap:balance; }
.reading-panel { width:min(100%,850px); margin:0 auto; padding:clamp(1.25rem,4vw,2.75rem); text-align:left; background:rgba(6,6,11,.82); border:1px solid rgba(205,196,239,.18); font-size:1.25rem; line-height:1.6; }
.book-logline { margin:0; color:var(--glass); font-size:clamp(1.4rem,2.5vw,1.65rem); line-height:1.5; }
.book-blurb { margin-top:2rem; padding-top:2rem; border-top:1px solid rgba(205,196,239,.2); }
.book-blurb:first-child { margin-top:0; padding-top:0; border-top:0; }
.book-blurb p { margin:0 0 1.2rem; }
.book-blurb p:last-child { margin-bottom:0; }
.reading-intro { width:min(100%,750px); margin:-.75rem auto 2rem; text-align:center; font-size:1.2rem; line-height:1.5; color:var(--glass); }
.faq-item + .faq-item { border-top:1px solid rgba(205,196,239,.2); }
.faq-item summary { position:relative; padding:1.2rem 2.2rem 1.2rem 0; cursor:pointer; list-style:none; font-family:'Cormorant Garamond',serif; font-weight:600; font-size:1.35rem; line-height:1.4; overflow-wrap:break-word; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::after { content:'+'; position:absolute; right:.15rem; top:1.2rem; color:var(--glass); font-family:serif; font-weight:400; }
.faq-item[open] summary::after { content:'−'; }
.faq-item summary:hover, .faq-item[open] summary { color:var(--glass); }
.faq-item summary:focus-visible { outline:2px solid var(--glass); outline-offset:4px; border-radius:2px; }
.faq-answer { padding:0 0 1.25rem; }
.faq-answer p { margin:0 0 1rem; }
.faq-answer p:last-child { margin-bottom:0; }
@media(max-width:600px) {
 .reading-page { padding-block:2.5rem; }
 .reading-panel { font-size:1.15rem; }
 .faq-item summary { font-size:1.25rem; }
}

/* Brief reader introductions, matching the Book One and FAQ reading panels. */
.reference-copy .character-entry + .character-entry,
.world-glossary > div + div { margin-top:1.6rem; padding-top:1.6rem; border-top:1px solid rgba(205,196,239,.2); }
.reference-copy h2, .world-glossary dt { margin:0 0 .6rem; font-family:'Cormorant Garamond',serif; font-weight:600; font-size:1.7rem; line-height:1.25; color:var(--glass); }
.reference-copy p, .world-glossary, .world-glossary dd { margin:0; }

/* Book cover and format choices, shared across seamless page navigation. */
.purchase-layout { display:grid; grid-template-columns:minmax(0,320px) minmax(0,1fr); align-items:center; gap:clamp(2rem,5vw,4rem); width:min(100%,850px); margin:0 auto; text-align:left; }
.purchase-cover { display:block; width:100%; height:auto; box-shadow:0 14px 45px rgba(0,0,0,.55); }
.purchase-details { min-width:0; }
.purchase-series { margin:0 0 1rem; font-family:'Cinzel',serif; font-size:.75rem; letter-spacing:.08em; line-height:1.7; color:var(--mist); }
.purchase-title { margin:0; font-family:'Cormorant Garamond',serif; font-weight:600; font-size:clamp(2rem,4vw,3rem); line-height:1.12; text-wrap:balance; }
.purchase-author { margin:1rem 0 2rem; font-size:1.3rem; color:var(--mist); }
.purchase-options { display:flex; flex-direction:column; gap:1rem; }
.purchase-button { display:flex; justify-content:center; align-items:center; box-sizing:border-box; width:100%; min-height:56px; padding:1rem; border:1px solid rgba(205,196,239,.65); border-radius:0; background:rgba(205,196,239,.13); color:var(--ink); font-family:'Cinzel',serif; font-size:.85rem; line-height:1.5; text-align:center; text-decoration:none; transition:background .2s,border-color .2s; }
a.purchase-button:hover { background:rgba(205,196,239,.24); border-color:var(--glass); }
.purchase-button:disabled { background:rgba(45,45,50,.55); border-color:rgba(150,150,155,.25); color:#939397; cursor:not-allowed; }
@media (max-width:650px) {
 .purchase-layout { grid-template-columns:minmax(0,1fr); gap:2rem; max-width:400px; text-align:center; }
 .purchase-cover { max-width:280px; margin:0 auto; }
 .purchase-title { font-size:2.2rem; }
 .purchase-author { margin-bottom:1.5rem; }
}

/* The countdown gives way to the book launch at midnight UK time. */
.countdown-ending { animation:countdown-fade-out 2s ease both; pointer-events:none; }
.launch-display { width:min(100%,800px); display:grid; grid-template-columns:minmax(0,320px) minmax(0,1fr); align-items:center; gap:clamp(1.5rem,4vw,3rem); margin:2rem auto 0; text-align:left; }
.launch-cover { display:block; width:100%; height:auto; filter:drop-shadow(0 18px 22px rgba(0,0,0,.4)); }
.launch-copy { text-align:center; container-type:inline-size; padding:1.6rem; background:rgba(6,6,11,.72); border:1px solid rgba(205,196,239,.18); }
.launch-copy h3 { margin:0; font-family:'Cormorant Garamond',serif; font-size:clamp(1rem,7.5cqi,1.9rem); font-weight:600; line-height:1.2; white-space:nowrap; }
.launch-copy p { margin:1.2rem 0 1.6rem; font-size:1.25rem; line-height:1.5; }
.launch-link { width:100%; }
.launch-enter { animation:launch-fade-in 4s ease both; }
@keyframes countdown-fade-out { to { opacity:0; } }
@keyframes launch-fade-in { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
@media (max-width:600px) {
 .launch-display { grid-template-columns:1fr; gap:1rem; max-width:360px; text-align:center; }
 .launch-cover { max-width:240px; margin:auto; }
 .launch-copy { padding:1.25rem; }
}
@media (prefers-reduced-motion:reduce) {
 .countdown-ending,.launch-enter { animation:none; }
}

/* Author contact form */
.contact-panel { margin-top:2rem; }
.contact-panel h2 { margin:0 0 1.5rem; font-family:'Cormorant Garamond',serif; font-size:2.25rem; font-weight:600; }
.contact-row { display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; }
.contact-field { min-width:0; margin-bottom:1.25rem; }
.contact-field label { display:block; margin-bottom:.45rem; }
.contact-field input,.contact-field textarea { box-sizing:border-box; display:block; width:100%; min-height:48px; padding:.7rem .85rem; border:1px solid rgba(205,196,239,.55); border-radius:0; background:rgba(205,196,239,.07); color:var(--ink); font:inherit; font-size:1.1rem; line-height:1.5; }
.contact-field textarea { min-height:190px; resize:vertical; }
.contact-field input:focus-visible,.contact-field textarea:focus-visible { outline:2px solid var(--glass); outline-offset:3px; }
.contact-note { font-size:1rem; opacity:.85; }
.contact-send { width:min(100%,200px); cursor:pointer; }
.contact-send:hover:not(:disabled) { background:rgba(205,196,239,.24); border-color:var(--glass); }
.contact-status { margin:1rem 0 0; font-size:1.1rem; }
.contact-status:empty { display:none; }
.contact-status[data-state="error"] { color:#ffd4c9; }
.contact-trap { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media (max-width:600px) { .contact-row { grid-template-columns:1fr; gap:0; } }

/* Keep the portrait within the biography while text wraps around it. */
.author-bio { display:flow-root; }
.author-photo { float:right; display:block; width:clamp(100px,24%,170px); height:auto; margin:.3rem 0 1rem 1.5rem; border:1px solid rgba(205,196,239,.35); }
@media (max-width:600px) { .author-photo { width:100px; max-width:36%; margin-left:1rem; } }

/* Design rules (17 Oct 2026), from the From the Beyond World design guidelines.
   Text is black, white or grey. Hyperlinks in running text are the one exception: link blue,
   lighter on hover. Lilac (glass) stays for the book number, focus rings, borders and hovers. */
:root { --ink-soft:#bdb6d3; --link:#6ea8fe; --link-hover:#aecbfa; }
.home-intro a,
.acknowledgements-copy a,
.reading-page p a:not(.purchase-button) { color:var(--link); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:.18em; transition:color .2s; }
.home-intro a:hover,
.acknowledgements-copy a:hover,
.reading-page p a:not(.purchase-button):hover { color:var(--link-hover); }
.acknowledgements-copy h2 { color:var(--ink); }
.book-logline { color:var(--ink); }
.reading-intro { color:var(--ink-soft); }
.reference-copy h2, .world-glossary dt { color:var(--ink); }
.sound-toggle.is-on { border-color:var(--glass); }
.contact-status[data-state="error"] { color:var(--ink); }

/* Design enhancements (17 Oct 2026), from the From the Beyond World design guidelines.
   The Eternal Night glow on the horizon; Book One panels in the cover's night-to-aurora greens;
   lamplight gold on the buying buttons; no text below 13px; one standard 78% scrim. */
:root { --b1-night:#091515; --b1-aurora-deep:#0f2e28; --b1-lamplight:#dfb67e; --night-glow:55,129,96; }

/* The Eternal Night glow: low, soft and directionless, along the foot of the sky. */
.stage-back::after { content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse 100% 42% at 50% 108%, rgba(var(--night-glow),.6) 0%, rgba(var(--night-glow),.22) 45%, transparent 78%); }

/* Book One panels take the cover's sky: night at the top, aurora green below. */
.launch-copy { background:linear-gradient(180deg, rgba(9,21,21,.9) 0%, rgba(15,46,40,.9) 100%); border:1px solid rgba(205,196,239,.2); }
.purchase-layout { padding:clamp(1.25rem,4vw,2.5rem); background:linear-gradient(180deg, rgba(9,21,21,.9) 0%, rgba(15,46,40,.9) 100%); border:1px solid rgba(205,196,239,.2); box-sizing:border-box; }

/* Buying buttons: the one warm point on the page. Labels stay white. */
.purchase-button:not(.contact-send) { border-color:rgba(223,182,126,.75); background:rgba(223,182,126,.10); transition:background .3s, border-color .3s, box-shadow .3s; }
a.purchase-button:not(.contact-send):hover,
a.purchase-button:not(.contact-send):focus-visible { border-color:var(--b1-lamplight); background:rgba(223,182,126,.2); box-shadow:0 0 22px rgba(223,182,126,.35); }

/* One standard scrim behind text over the storm: void at 78% with a fine border. */
.home-intro { background:rgba(6,6,11,.78); border:1px solid rgba(205,196,239,.2); }
.reading-panel { background:rgba(6,6,11,.78); }

/* No text below 13px. */
.site-nav a { font-size:.8125rem; }
.countdown-label { font-size:.8125rem; }
.follow-label { font-size:.8125rem; }
.sound-label { font-size:.8125rem; }
.purchase-series { font-size:.8125rem; }
.eyebrow { font-size:clamp(.8125rem, 1.5vw, .9rem); }
@media(max-width:600px) {
  .site-nav { gap:.1rem 1rem; }
  .site-nav a { font-size:.8125rem; padding:.55rem 0; }
  .countdown-label { font-size:.8125rem; letter-spacing:.06em; }
}

/* Alignment tags on the Characters page: a swatch in the lore colours, the words in white. */
.reference-copy .align-tag { display:inline-flex; align-items:center; gap:.55rem; margin:0 0 .7rem; font-family:'Cinzel',serif; font-weight:600; font-size:.8125rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink); }
.align-tag::before { content:""; width:.85rem; height:.85rem; box-sizing:border-box; flex:none; }
.align-good::before { background:#1e88e5; border:3px solid #ffffff; box-shadow:0 0 10px rgba(30,136,229,.6); }
.align-evil::before { background:#7f8f01; border:3px solid #000000; outline:1px solid rgba(127,143,1,.8); box-shadow:0 0 10px rgba(127,143,1,.5); }
