/* A two-ink comic journal. The approved art, broad frame and compact colophon remain. */
:root {
  --print-ease: cubic-bezier(.23,1,.32,1);
  --motion-in-out: cubic-bezier(.77,0,.175,1);
  --motion-reveal: 600ms;
  --motion-stagger: 60ms;
  --edition-light: #faf2e1;
  --edition-muted: #d9cdb7;
}
.home-page .intro-meta { border:0; font-size:13px; letter-spacing:.04em; }
.home-page .intro-caption { top:66svh; }
.home-page .intro-caption p { font:500 clamp(20px,1.7vw,30px)/1.45 var(--text); letter-spacing:-.02em; text-align:center; }
.home-page .intro-caption p span { font:inherit; color:var(--muted); }
.home-page .intro-folio { font:500 14px/1.5 var(--text); letter-spacing:0; }
.home-page .intro-scroll { font-size:13px; letter-spacing:.04em; gap:16px; }
.home-page .scroll-arrow { border:0; background:var(--ink); color:var(--paper); transform:none; }
.has-intro .opening-header::after { display:none; }
.home-page .masthead-bottom { border-top:0; border-bottom:3px solid var(--ink); letter-spacing:.04em; }
.home-page #main { scroll-margin-top:24px; }
.home-page .home-cover { padding-block:clamp(40px,4vw,80px); }
.home-page .home-hero-art { border:3px solid var(--ink); transform:none; }
.home-page .home-hero-art:hover { transform:none; }
.home-page .hero-caption { font-size:13px; letter-spacing:.04em; padding:12px 16px; }
.home-page .home-lead { font-size:clamp(22px,1.6vw,32px); line-height:1.45; }
.home-page .cover-description { font-size:var(--body-size); color:var(--ink); line-height:1.65; }
.home-page .marked-word svg { display:none; }
.home-page .read-button { position:relative; overflow:hidden; isolation:isolate; }
.home-page .read-button::before { content:''; position:absolute; inset:0; z-index:-1; background:var(--ink); transform:translateX(-101%); transition:transform var(--motion-ui) var(--print-ease); }
.home-page .read-button:hover { background:var(--red); }
.home-page .read-button:focus-visible::before { transform:translateX(0); }
.home-page .read-button:focus-visible { color:var(--paper); }
.home-page .print-rails { display:none; }
.home-page .news-strip { background:var(--ink); padding-block:20px; }
.home-page .news-strip span { font-size:clamp(13px,.85vw,18px); letter-spacing:.04em; }
.home-page .news-strip span+span::before { display:none; }
.home-page .issues-section { padding-block:clamp(64px,7vw,144px); }
.home-page .issues-section .section-heading { border:0; padding-bottom:12px; }
.home-page .issues-section .section-heading h2 { padding:12px 24px 16px; transform:none; }
.home-page .issue-shelf-note { font-size:14px; letter-spacing:0; }
.home-page .shelf-filters { border:0; margin-block:16px 40px; gap:8px; flex-wrap:wrap; }
.home-page .shelf-filters button { padding:12px 20px; font-size:16px; font-weight:600; min-height:48px; transition:background-color var(--motion-ui) ease,color var(--motion-ui) ease; }
.home-page .shelf-filters button[aria-pressed=true] { background:var(--ink); color:var(--paper); }
.home-page .shelf-filters button::after { display:none; }
.home-page .issue-shelf { gap:clamp(36px,4vw,96px); margin-inline:0; }
.home-page .shelf-card { align-items:start; }
.home-page .shelf-card .shelf-art { box-shadow:none; background:var(--ink); }
.home-page .shelf-card-copy { background:transparent; border:0; padding:0; }
.home-page .shelf-edition { border:0; padding-bottom:0; font-size:14px; }
.home-page .status-label { font-size:13px; letter-spacing:0; }
.home-page .shelf-card h3 { font-size:clamp(36px,2.65vw,64px); line-height:1.04; text-wrap:balance; margin-block:20px; }
.home-page .shelf-card-copy p { color:var(--ink); font-size:var(--body-size); line-height:1.6; }
.home-page .shelf-synopsis { margin-bottom:20px; }
.home-page .shelf-synopsis summary { font-size:15px; }
.home-page .shelf-card-bottom { border:0; background:var(--edition-light); padding:8px 16px; margin-top:20px; }
.home-page .shelf-meta { font-size:14px; }
.home-page .shelf-link { font-size:16px; }
.home-page .reading-storage-note { font-size:13px; margin-top:40px; }
.home-page .shelf-empty { background:var(--edition-light); border:0; padding:32px; }
.home-page .editorial { background:var(--ink); color:var(--paper); border:0; padding:clamp(32px,4vw,80px); }
.home-page .editorial-copy { grid-template-columns:minmax(0,.8fr) minmax(0,1.3fr); gap:clamp(32px,5vw,100px); align-items:start; }
.home-page .editorial h2 { font-size:clamp(48px,5.1vw,112px); line-height:.98; margin:0; color:var(--paper); }
.home-page .editorial-columns { columns:auto; display:grid; grid-template-columns:1fr 1fr; gap:32px; }
.home-page .editorial-columns > div { display:block; }
.home-page .editorial-columns p { color:var(--paper); font-size:var(--body-size); line-height:1.65; margin:0 0 24px; }
.home-page .dropcap:first-letter { color:var(--paper); font:inherit; margin:0; float:none; }
.home-page .themes { padding-block:clamp(64px,7vw,144px); gap:clamp(32px,5vw,100px); }
.home-page .themes-heading h2 { font-size:clamp(44px,4.5vw,96px); line-height:1; }
.home-page .theme-list { border:0; gap:32px; }
.home-page .theme-list article,.home-page .theme-list article:nth-child(even) { border:0; padding:0; }
.home-page .theme-list h3 { font-size:clamp(26px,1.9vw,40px); padding:0; }
.home-page .theme-list p { color:var(--ink); }
.home-page .characters { border-top:3px solid var(--ink); padding-block:clamp(48px,5vw,100px); }
.home-page .character-grid { gap:clamp(24px,3vw,64px); }
.home-page .character-card { border:3px solid var(--ink); background:var(--edition-light); }
.home-page .character-text { background:var(--edition-light); }
.home-page .character-text h3 { font-size:clamp(32px,2.3vw,52px); line-height:1.05; }
.home-page .character-text p { color:var(--ink); line-height:1.65; }
.home-page .character-text h3 em { color:var(--ink); }
.home-page .character-name { font-size:clamp(24px,1.5vw,36px); letter-spacing:0; padding:10px 20px; bottom:0; }
.home-page .site-footer { border-top:3px solid var(--ink); }
@media(hover:hover) and (pointer:fine) {
  .home-page .read-button:hover::before { transform:translateX(0); }
  .home-page .shelf-card .shelf-art:hover { transform:rotate(0deg) translateY(-3px); }
  .home-page .shelf-link:hover .ui-icon { transform:translateX(4px); }
}
@media(max-width:1200px) {
  .home-page .editorial-copy { grid-template-columns:1fr; }
  .home-page .editorial h2 br { display:none; }
  .home-page .editorial h2 { max-width:16ch; }
}
@media(max-width:900px) {
  .home-page .home-cover { grid-template-columns:1fr; }
  .home-page .home-cover-copy { display:contents; }
  .home-page .home-cover h1 { order:1; font-size:clamp(64px,10vw,96px); margin-bottom:0; }
  .home-page .home-hero-art { order:3; width:100%; max-width:none; margin:0; }
  .home-page .home-lead { order:2; margin:0; }
  .home-page .cover-description { order:4; margin:0; max-width:60ch; }
  .home-page .home-cover .read-button { order:5; }
  .home-page .editorial-columns { gap:24px; }
  .home-page .themes { grid-template-columns:1fr; }
}
@media(max-width:600px) {
  .home-page .intro-caption { top:62svh; }
  .home-page .intro-caption p { font-size:20px; }
  .home-page .intro-meta span:last-child,.home-page .intro-folio { display:none; }
  .home-page .intro-scroll { left:0; right:0; justify-content:space-between; }
  .home-page .home-cover { padding-block:32px 40px; gap:24px; }
  .home-page .home-cover h1 { font-size:clamp(60px,17vw,80px); }
  .home-page .hero-caption { font-size:13px; padding:8px 12px; }
  .home-page .home-lead { font-size:20px; }
  .home-page .issues-section .section-heading { align-items:center; }
  .home-page .issues-section .section-heading h2 { padding:10px 16px 14px; }
  .home-page .issue-shelf-note { display:none; }
  .home-page .shelf-filters { display:grid; grid-template-columns:1fr 1fr; gap:4px; margin-bottom:32px; }
  .home-page .shelf-filters button { padding:10px 12px; font-size:15px; }
  .home-page .shelf-card { gap:24px; }
  .home-page .shelf-card h3 { font-size:36px; }
  .home-page .shelf-card-bottom { flex-direction:row; align-items:center; padding:8px 12px; gap:12px; }
  .home-page .shelf-card .shelf-art { width:min(86%,320px); }
  .home-page .editorial { padding:28px 24px; }
  .home-page .editorial h2 { font-size:44px; }
  .home-page .editorial h2 br { display:block; }
  .home-page .editorial-columns { grid-template-columns:1fr; gap:0; }
  .home-page .editorial-columns p { margin-bottom:20px; }
  .home-page .editorial-columns > div:last-child p:last-child { margin-bottom:0; }
  .home-page .themes-heading h2 { font-size:44px; }
  .home-page .characters .section-heading h2 { font-size:44px; }
  .home-page .character-text h3 { font-size:32px; }
  .home-page .character-name { font-size:24px; }
}
/* A pending print panel is cut from the page; its content remains a single live surface. */
[data-print-enter="panel"] { clip-path:inset(0 100% 0 0); }
html[data-input="keyboard"] [data-print-enter], [data-print-enter]:focus-within { clip-path:none; opacity:1; }
@media(prefers-reduced-motion:reduce) {
  [data-print-enter="panel"] { clip-path:none; }
  .home-page .read-button::before { transform:none; opacity:0; transition:opacity var(--motion-ui) ease !important; }
  .home-page .read-button:hover::before,.home-page .read-button:focus-visible::before { opacity:1; }
}

/* Motion ink belongs to the gutters, leaving all reading and artwork still. */
.home-page [data-comic-frame] { position:relative; }
.comic-gutter {
  position:absolute; inset:0; pointer-events:none; opacity:0;
  transition:opacity var(--motion-ui) var(--print-ease);
  --gutter-ink-width:clamp(16px,calc(var(--page-gutter) - 12px),88px);
}
.home-page .comic-gutter__edge {
  position:absolute; inset-block:0; width:var(--gutter-ink-width); color:var(--ink);
}
.comic-gutter__edge--left { right:calc(100% + (var(--page-gutter) - var(--gutter-ink-width)) / 2); }
.comic-gutter__edge--right { left:calc(100% + (var(--page-gutter) - var(--gutter-ink-width)) / 2); }
.comic-gutter__print { position:sticky; top:38svh; height:clamp(180px,24vw,300px); }
.comic-gutter svg { display:block; width:100%; height:100%; }
.comic-gutter__edge--right svg { scale:-1 1; }
.comic-gutter__dots { color:var(--red); opacity:.6; }
.comic-gutter pattern circle { fill:var(--red); }
.comic-gutter__strokes { opacity:.75; }
.comic-gutter__strokes path { vector-effect:non-scaling-stroke; }
html[data-comic-scroll] .home-page .comic-gutter { opacity:1; }
@supports (animation-timeline:view()) {
  .home-page [data-comic-frame] { view-timeline:--comic-frame block; }
  .comic-gutter__print {
    animation:comic-gutter-pass linear both;
    animation-timeline:--comic-frame;
    animation-range:entry 0% exit 100%;
  }
  @keyframes comic-gutter-pass {
    0% { transform:translate3d(0,48px,0); opacity:0; }
    30% { opacity:1; }
    65% { opacity:1; }
    100% { transform:translate3d(0,-32px,0); opacity:0; }
  }
}
@media(max-width:680px) {
  .home-page .comic-gutter__edge {
    inset-block:8px auto; width:104px; height:32px;
  }
  .comic-gutter__edge--right { left:auto; right:0; }
  .comic-gutter__edge--left { right:auto; left:0; }
  .comic-gutter__print { position:static; height:100%; }
  .comic-gutter svg { height:132px; transform:translateY(-44px) rotate(-90deg); }
  .comic-gutter__edge { overflow:clip; }
  .comic-gutter__print { animation:none; }
}
@media(prefers-reduced-motion:reduce) {
  .comic-gutter { display:none; transition:none !important; }
  .comic-gutter__print { animation:none !important; }
}
