/* GRAVITISM — LITERATURE / dark shelf prototype */
html.literature-page,
html.literature-page body { overflow:hidden; }
body.literature-page {
  position:relative;
  min-height:100svh;
  background:#0d0c0c;
  color:rgba(240,238,234,.90);
  overflow:hidden;
}
.literature-page::before,
.literature-page::after { content:""; position:fixed; inset:-12%; pointer-events:none; }
.literature-page::before {
  z-index:0;
  background:
    radial-gradient(ellipse at 22% 56%, rgba(255,255,255,.035), transparent 32%),
    radial-gradient(ellipse at 78% 54%, rgba(180,150,120,.025), transparent 34%),
    radial-gradient(ellipse at 50% 100%, rgba(255,255,255,.025), transparent 38%);
  filter:blur(30px);
}
.literature-page::after {
  z-index:1;
  background:radial-gradient(ellipse at center, transparent 38%, rgba(0,0,0,.38) 100%);
}
.literature-page .site-header { z-index:40; top:calc(4.15% + 5px); }
.literature-page .site-header a { color:#f0eeea; }
.literature-page .site-header span { color:#f0eeea; }
.literature-page .site-header a.active,
.literature-page .site-header a[aria-current="page"] { color:#777674; pointer-events:auto; cursor:pointer; }
.literature-page .works-home-logo { z-index:40; }
.literature-page .works-home-logo img { filter:invert(1); opacity:.88; }
.literature-page .language-globe { color:#f0eeea; opacity:.82; }
.literature-page .language-panel { background:rgba(17,16,15,.94); border-color:transparent; }
.literature-page .language-option { color:#f0eeea; }
.literature-page .language-option:focus-visible { color:#fff; }
.literature-page .language-switcher.is-open .language-panel { border-color:rgba(240,238,234,.16); }

.literature-stage {
  position:relative;
  z-index:8;
  width:100%;
  height:100svh;
  min-height:650px;
  display:flex;
  flex-direction:column;
  align-items:center;
  overflow:hidden;
}
.literature-title {
  position:absolute;
  top:15.2%;
  margin:0;
  font-size:28px;
  line-height:1;
  font-weight:400;
  letter-spacing:.34em;
  text-indent:.34em;
  color:#f0eeea;
}
.literature-rule { position:absolute; top:20.7%; width:54px; height:1px; background:#f0eeea; opacity:.52; }

.book-carousel {
  position:absolute;
  top:23%;
  left:0;
  width:100%;
  height:49%;
  min-height:340px;
  display:flex;
  align-items:center;
  justify-content:center;
  perspective:1600px;
  perspective-origin:50% 40%;
}
.book-track {
  position:relative;
  width:min(1220px,100%);
  height:100%;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  transform-style:preserve-3d;
  overflow:visible;
}
.book-slot {
  --spine-color:#292726;
  --spine-ink:#f0eeea;
  width:58px;
  height:390px;
  color:inherit;
  cursor:pointer;
  outline-offset:5px;
  background:transparent;
  border:0;
  border-radius:0;
  flex:0 0 58px;
  margin:0;
  padding:0;
  transition:flex-basis .72s cubic-bezier(.22,.7,.2,1), margin .72s cubic-bezier(.22,.7,.2,1);
  position:relative;
  overflow:visible;
}
.book-slot:hover,.book-slot:focus-visible { background:transparent; }
.book-slot.is-active { z-index:30; flex-basis:252px; }
.book-slot::after {
  content:"";
  background:radial-gradient(50% 50%, rgba(0,0,0,.85), transparent 72%);
  opacity:0;
  pointer-events:none;
  width:150%;
  height:18px;
  transition:opacity .45s .15s;
  position:absolute;
  bottom:-12px;
  left:50%;
  transform:translate(-50%);
}
.book-slot.is-active::after { opacity:1; }

.book-pull {
  width:245px;
  height:390px;
  transform-style:preserve-3d;
  pointer-events:none;
  transition:transform .22s ease-out;
  display:block;
  position:absolute;
  bottom:0;
  left:0;
  transform:translateZ(0);
}
.book-slot.is-active .book-pull { transform:translateZ(50px) translateY(-15px) rotateX(2deg); }
.book-volume {
  transform-origin:0;
  transform-style:preserve-3d;
  transition:transform .58s cubic-bezier(.2,.72,.2,1) .16s;
  display:block;
  position:absolute;
  inset:0;
  transform:rotateY(-84deg);
}
.book-slot.is-active .book-volume { transform:rotateY(-11deg); }
.book-front {
  background:#242220;
  box-shadow:3px 4px 12px rgba(0,0,0,.75);
  backface-visibility:hidden;
  text-align:left;
  opacity:0;
  transition:opacity .12s 60ms,box-shadow .58s .1s;
  display:block;
  position:absolute;
  inset:0;
  overflow:hidden;
}
.book-slot.is-active .book-front { opacity:1; box-shadow:16px 24px 44px rgba(0,0,0,.72); transition-delay:.19s,.1s; }
/* Every active cover opens the Reader (was books 08 and 09 only). */
.book-slot.is-active .book-front { pointer-events:auto; cursor:pointer; }
.book-front::after { content:""; background:linear-gradient(90deg,rgba(0,0,0,.6),transparent); width:13px; position:absolute; inset:0 auto 0 0; }
.book-front::before { content:""; background:linear-gradient(112deg,#ffffff20 0%,#fff0 26% 68%,#00000035 100%); position:absolute; inset:0; z-index:2; pointer-events:none; }
.book-front img { object-fit:cover; width:100%; height:100%; display:block; }
.book-pages {
  transform-origin:0;
  background:repeating-linear-gradient(90deg,#ffffff14 0 1px,#fff0 1px 3px),linear-gradient(90deg,#d8d3c8,#aaa49a);
  width:22px;
  position:absolute;
  top:3px;
  bottom:3px;
  left:100%;
  transform:rotateY(90deg);
  opacity:0;
  backface-visibility:hidden;
  transition:opacity .12s 60ms;
  box-shadow:inset 0 3px 4px -3px #000,inset 0 -3px 4px -3px #000;
}
.book-slot.is-active .book-pages { opacity:1; transition-delay:.19s; }
.cover-copy {
  background:linear-gradient(transparent,rgba(0,0,0,.88));
  color:#f0eeea;
  white-space:normal;
  flex-direction:column;
  align-items:start;
  gap:11px;
  padding:28px 23px 31px;
  display:flex;
  position:absolute;
  inset:auto 0 0;
  z-index:3;
}
.cover-kicker,.cover-author { font:700 9px/1.2 Arial,sans-serif; letter-spacing:.15em; }
.cover-copy strong { font:400 33px/.99 Georgia,serif; letter-spacing:-.03em; }
.book-spine {
  background:linear-gradient(90deg,#151515 0%,#383532 20%,#56514b 46%,var(--spine-color) 70%,#2a2826 92%,#111 100%);
  flex-direction:column;
  justify-content:space-between;
  align-items:center;
  width:54px;
  height:100%;
  padding:21px 0 18px;
  display:flex;
  position:absolute;
  top:0;
  left:0;
  color:var(--spine-ink);
  transform-origin:0;
  box-shadow:inset -6px 0 8px -6px #000,inset 3px 0 3px -2px #777,inset 0 2px 3px -2px #777,inset 0 -2px 3px -2px #111;
  transform:rotateY(90deg);
  backface-visibility:hidden;
}
.spine-mark { font:27px/1 Georgia,serif; }
.spine-title { writing-mode:vertical-rl; font:400 16px/1 Georgia,serif; letter-spacing:.025em; white-space:nowrap; transform:rotate(180deg); }
.spine-number { font:700 10px/1 Arial,sans-serif; letter-spacing:.08em; }
.shelf-plank {
  position:absolute;
  height:22px;
  bottom:8px;
  left:calc(4% + 400px);
  right:calc(4% + 400px);
  background:#191817;
  border-top:1px solid rgba(240,238,234,.14);
  box-shadow:0 8px 0 #111,0 16px 30px rgba(0,0,0,.8);
}
.shelf-topline,.shelf-bottomline {
  position:absolute;
  left:clamp(24px,7.5vw,110px);
  right:clamp(24px,7.5vw,110px);
  color:#777674;
  font:9px/1 Arial,sans-serif;
  letter-spacing:.16em;
  display:flex;
  justify-content:space-between;
  align-items:center;
  z-index:20;
}
.shelf-topline { top:-5px; }
.shelf-bottomline { bottom:-28px; }
.shelf-instruction { color:#777674; }
.shelf-counter { color:#d5d1ca; font:400 20px/1 Georgia,serif; letter-spacing:.05em; }
.shelf-counter span { color:#67645f; font-size:14px; }

.book-information {
  position:absolute;
  top:74.5%;
  width:min(720px,82vw);
  text-align:center;
  color:#f0eeea;
}
.book-number { color:#777674; font:11px/1 Arial,sans-serif; letter-spacing:.30em; margin-bottom:12px; }
.book-title-row {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:28px;
  min-height:28px;
}
.book-information h2 { margin:0; font:400 22px/1.2 Georgia,serif; letter-spacing:.20em; text-indent:.20em; }
.book-nav {
  appearance:none;
  border:0;
  background:transparent;
  color:#777674;
  width:24px;
  height:28px;
  padding:0;
  margin:0;
  font:300 24px/1 Georgia,serif;
  cursor:pointer;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(1px);
  transition:opacity .35s ease, color .25s ease, transform .35s ease, visibility 0s linear .35s;
}
.book-nav.is-visible {
  opacity:.72;
  visibility:visible;
  pointer-events:auto;
  transition-delay:0s;
}
.book-nav:hover,.book-nav:focus-visible { color:#f0eeea; opacity:1; transform:translateY(1px) scale(1.12); outline:none; }
.book-meta { display:flex; justify-content:center; align-items:center; gap:12px; margin-top:10px; font:9px/1 Arial,sans-serif; letter-spacing:.19em; color:#777674; }
.book-meta i { width:1px; height:11px; background:#55524d; display:block; }
.book-information p { margin:18px auto 0; max-width:620px; font:12px/1.75 Arial,sans-serif; letter-spacing:.035em; color:#777674; }
.book-counter { position:absolute; bottom:5.5%; color:#777674; font:11px/1 Arial,sans-serif; letter-spacing:.28em; }
#worksParticles {
  position:fixed;
  z-index:6;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
}

html.grav-incoming-literature body.literature-page > *:not(.page-transition) { opacity:0; animation:gravLiteratureReveal 1000ms cubic-bezier(.22,.72,.22,1) forwards; }
html.grav-incoming-literature body.literature-page .page-transition { opacity:1; visibility:visible; background:#0d0c0c; }
@keyframes gravLiteratureReveal { from{opacity:0} to{opacity:1} }

@media (max-width:1100px){
  .shelf-plank{left:clamp(24px,7.5vw,70px);right:clamp(24px,7.5vw,70px)}

}
@media (max-width:740px){
  .shelf-plank{left:18px;right:18px}

  .literature-title{top:13.5%;font-size:18px;letter-spacing:.27em;text-indent:.27em}
  .literature-rule{top:18.5%;width:44px}
  .book-carousel{top:21%;height:49%;min-height:300px}
  .book-track{max-width:700px}
  .book-slot{width:28px;height:260px;bottom:34px}
  .book-slot.is-active{flex-basis:163px}
  .book-pull{width:160px;height:260px}
  .book-volume{transform:rotateY(-84deg)}
  .book-spine{width:27px;padding:12px 0 10px}
  .spine-mark{font-size:17px}.spine-title{font-size:12px}.spine-number{font-size:8px}
  .cover-copy{gap:7px;padding:17px 13px 20px}.cover-copy strong{font-size:23px}.cover-kicker,.cover-author{font-size:7px}.book-pages{width:13px}
  .shelf-topline,.shelf-bottomline{left:18px;right:18px;font-size:7px}.shelf-counter{font-size:16px}
  .book-information{top:72.5%;width:88vw}.book-title-row{gap:16px}.book-nav{font-size:22px;width:20px}.book-information h2{font-size:16px;letter-spacing:.14em;text-indent:.14em}.book-information p{font-size:11px;line-height:1.6;margin-top:12px}.book-counter{bottom:3.5%;font-size:10px}
}
@media (max-width:480px){
  .literature-title{top:12.5%;font-size:15px}.literature-rule{top:17.5%}.book-carousel{top:20%;height:47%}.book-slot{width:25px;height:245px}.book-slot.is-active{flex-basis:148px}.book-pull{width:146px;height:245px}.book-information{top:69.5%;width:90vw}.book-information p{max-width:340px}.book-title-row{gap:12px}.book-nav{font-size:20px;width:18px}
}

/* Literature metadata: full publication details below the shelf. */
.book-front .cover-copy { display:none !important; }
.book-spine { justify-content:flex-end; }
.spine-title { position:absolute; bottom:54px; left:50%; transform:translateX(-50%) rotate(180deg); }
.spine-number { position:absolute; bottom:12px; left:50%; transform:translateX(-50%); }
.book-details {
  margin:16px auto 0;
  max-width:680px;
  display:flex;
  flex-direction:column;
  gap:7px;
  color:#777674;
  font:11px/1.5 Arial,sans-serif;
  letter-spacing:.035em;
}
.book-details span { display:block; }
.book-information p { display:none; }
@media (max-width:740px){
  .book-details { margin-top:12px; max-width:88vw; font-size:10px; gap:5px; }
}

.book-meta { display:none; }

/* V103 — darker chromatic spines, bottom-aligned titles, varied book heights. */
.book-slot:nth-child(1){height:372px;}
.book-slot:nth-child(2){height:390px;}
.book-slot:nth-child(3){height:372px;}
.book-slot:nth-child(4){height:390px;}
.book-slot:nth-child(5){height:354px;}
.book-slot:nth-child(6){height:390px;}
.book-slot:nth-child(7){height:372px;}
.book-slot:nth-child(8){height:354px;}
.book-slot:nth-child(9){height:390px;}

/* V102 — Literature shelf refinement: chromatic linen spines + compact mobile shelf. */
.book-slot {
  transition: flex-basis .58s cubic-bezier(.22,.7,.2,1), margin .58s cubic-bezier(.22,.7,.2,1);
}
.book-slot.is-active { flex-basis:252px; }
.book-spine {
  background:
    repeating-linear-gradient(0deg, rgba(255,255,255,.018) 0 1px, transparent 1px 3px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.012) 0 1px, transparent 1px 4px),
    linear-gradient(90deg,
      color-mix(in srgb, var(--spine-color) 48%, #000 52%),
      color-mix(in srgb, var(--spine-color) 78%, #000 22%) 22%,
      color-mix(in srgb, var(--spine-color) 92%, #000 8%) 48%,
      color-mix(in srgb, var(--spine-color) 70%, #000 30%) 72%,
      color-mix(in srgb, var(--spine-color) 42%, #000 58%));
  background-blend-mode:normal,normal,normal;
  box-shadow:inset -5px 0 7px -6px rgba(0,0,0,.88), inset 3px 0 4px -3px rgba(255,255,255,.10), inset 0 2px 3px -2px rgba(255,255,255,.08), inset 0 -2px 3px -2px rgba(0,0,0,.60);
}
.book-spine::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.26;
  background:
    repeating-linear-gradient(8deg, transparent 0 2px, rgba(255,255,255,.035) 2px 3px, transparent 3px 5px),
    repeating-linear-gradient(98deg, transparent 0 3px, rgba(0,0,0,.045) 3px 4px, transparent 4px 7px),
    repeating-linear-gradient(0deg, transparent 0 2px, rgba(255,255,255,.018) 2px 3px, transparent 3px 5px);
  mix-blend-mode:soft-light;
}

@media (max-width:740px){
  .book-carousel {
    top:20.5%;
    height:49%;
    min-height:285px;
    padding:0 7px;
    box-sizing:border-box;
  }
  .book-track {
    width:100%;
    max-width:none;
    height:100%;
    padding:0;
    justify-content:center;
    align-items:flex-end;
    overflow:visible;
  }
  .book-slot {
    width:clamp(20px, 6.2vw, 25px);
    flex:0 0 clamp(20px, 6.2vw, 25px);
    height:clamp(235px, 62vw, 260px);
    bottom:34px;
    margin:0;
  }
  .book-slot.is-active {
    flex:0 0 clamp(126px, 37vw, 146px);
  }
  .book-pull {
    width:clamp(126px, 37vw, 146px);
    height:100%;
  }
  .book-spine {
    width:clamp(19px, 5.8vw, 24px);
    padding:11px 0 9px;
  }
  .spine-title { font-size:clamp(9px, 2.7vw, 12px); }
  .spine-number { font-size:7px; }
  .spine-mark { font-size:15px; }
  .book-pages { width:11px; }
  .book-information { top:71.5%; }
}

@media (max-width:480px){
  .book-carousel {
    top:19.5%;
    height:47%;
    min-height:270px;
    padding:0 5px;
  }
  .book-slot {
    width:clamp(17px, 5.5vw, 21px);
    flex-basis:clamp(17px, 5.5vw, 21px);
    height:clamp(218px, 61vw, 242px);
    bottom:30px;
  }
  .book-slot.is-active { flex-basis:clamp(112px, 35vw, 132px); }
  .book-pull { width:clamp(112px, 35vw, 132px); }
  .book-spine { width:clamp(16px, 5.1vw, 20px); padding:9px 0 8px; }
  .spine-title { font-size:clamp(8px, 2.45vw, 10px); }
  .spine-number { font-size:6px; }
  .spine-mark { font-size:13px; }
  .book-information { top:68.5%; width:92vw; }
  .book-title-row { gap:10px; }
  .book-information h2 { font-size:15px; }
}

/* V103 responsive height rhythm */
@media (max-width:740px){
  .book-slot:nth-child(1){height:clamp(220px,59vw,248px);}
  .book-slot:nth-child(2){height:clamp(235px,62vw,260px);}
  .book-slot:nth-child(3){height:clamp(220px,59vw,248px);}
  .book-slot:nth-child(4){height:clamp(235px,62vw,260px);}
  .book-slot:nth-child(5){height:clamp(208px,56vw,236px);}
  .book-slot:nth-child(6){height:clamp(235px,62vw,260px);}
  .book-slot:nth-child(7){height:clamp(220px,59vw,248px);}
  .book-slot:nth-child(8){height:clamp(208px,56vw,236px);}
  .book-slot:nth-child(9){height:clamp(235px,62vw,260px);}
}
@media (max-width:480px){
  .book-slot:nth-child(1){height:clamp(204px,56vw,228px);}
  .book-slot:nth-child(2){height:clamp(218px,61vw,242px);}
  .book-slot:nth-child(3){height:clamp(204px,56vw,228px);}
  .book-slot:nth-child(4){height:clamp(218px,61vw,242px);}
  .book-slot:nth-child(5){height:clamp(192px,52vw,218px);}
  .book-slot:nth-child(6){height:clamp(218px,61vw,242px);}
  .book-slot:nth-child(7){height:clamp(204px,56vw,228px);}
  .book-slot:nth-child(8){height:clamp(192px,52vw,218px);}
  .book-slot:nth-child(9){height:clamp(218px,61vw,242px);}
}


/* V105 — V103 baseline: stable shelf geometry across desktop monitors. */
.shelf-topline,
.shelf-bottomline { display:none !important; }
.shelf-plank {
  left:50%;
  right:auto;
  width:min(800px, calc(100vw - 80px));
  transform:translateX(-50%);
}
@media (max-width:1100px){
  .shelf-plank {
    left:50%;
    right:auto;
    width:min(760px, calc(100vw - 48px));
    transform:translateX(-50%);
  }
}
@media (max-width:740px){
  .shelf-plank {
    left:50%;
    right:auto;
    width:calc(100vw - 36px);
    transform:translateX(-50%);
  }
}
@media (max-width:480px){
  .shelf-plank {
    width:calc(100vw - 24px);
  }
}

/* Literature intro — same visual language as the gallery intro windows. */
.literature-intro-overlay {
  position:fixed;
  inset:0;
  z-index:200;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:30px;
  background:rgba(0,0,0,.30);
  backdrop-filter:blur(30px);
  -webkit-backdrop-filter:blur(30px);
  opacity:1;
  visibility:visible;
}
.literature-intro-overlay.is-hidden {
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity 240ms ease, visibility 0s linear 240ms;
}
.literature-intro-overlay .abstract-intro-box {
  width:min(980px, calc(100vw - 80px));
  min-height:390px;
  box-sizing:border-box;
  padding:42px 76px 34px;
  border:4px solid rgba(240,238,234,.18);
  border-radius:24px;
  background:rgba(7,7,7,.94);
  box-shadow:0 28px 80px rgba(0,0,0,.62), 0 0 0 1px rgba(255,255,255,.035) inset;
  color:rgba(240,238,234,.9);
  text-align:left;
}
.literature-intro-overlay .abstract-intro-box h2 {
  margin:0 0 22px;
  font-size:18px;
  line-height:1.25;
  font-weight:500;
  letter-spacing:.25em;
  color:rgba(240,238,234,.96);
}
.literature-intro-overlay .abstract-intro-box p {
  margin:0;
  max-width:820px;
  white-space:pre-line;
  font-size:14px;
  line-height:1.55;
  font-weight:400;
  letter-spacing:.025em;
  color:rgba(220,218,214,.88);
}
.literature-intro-overlay .abstract-intro-actions {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:14px;
  margin-top:28px;
  width:100%;
}
.literature-intro-overlay .abstract-intro-ok {
  min-width:74px;
  height:34px;
  padding:0 18px;
  border:1px solid rgba(240,238,234,.4);
  border-radius:0;
  background:transparent;
  color:rgba(240,238,234,.9);
  font:400 11px/1 Arial,sans-serif;
  letter-spacing:.18em;
  cursor:pointer;
}
.literature-intro-overlay .abstract-intro-ok:hover,
.literature-intro-overlay .abstract-intro-ok:focus-visible {
  border-color:rgba(240,238,234,.8);
  background:rgba(240,238,234,.1);
  color:#fff;
  outline:none;
}
.literature-intro-overlay .abstract-intro-check {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  color:rgba(210,208,204,.68);
  font-size:11px;
  line-height:1.4;
  letter-spacing:.03em;
  cursor:pointer;
  user-select:none;
}
.literature-intro-overlay .abstract-intro-check input {
  appearance:none;
  -webkit-appearance:none;
  width:14px;
  height:14px;
  margin:0;
  border:1px solid rgba(240,238,234,.45);
  background:transparent;
  cursor:pointer;
  position:relative;
}
.literature-intro-overlay .abstract-intro-check input:checked::after {
  content:'✓';
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  color:rgba(240,238,234,.95);
  font-size:11px;
}
@media (max-width:700px) {
  .literature-intro-overlay { padding:18px; }
  .literature-intro-overlay .abstract-intro-box {
    width:calc(100vw - 36px);
    min-height:0;
    max-height:calc(100svh - 36px);
    overflow:auto;
    padding:36px 28px 32px;
    border-radius:18px;
  }
  .literature-intro-overlay .abstract-intro-box h2 { font-size:14px; margin-bottom:22px; letter-spacing:.18em; }
  .literature-intro-overlay .abstract-intro-box p { font-size:13px; line-height:1.72; }
  .literature-intro-overlay .abstract-intro-actions { margin-top:30px; gap:18px; }
}


/* Publication line under each book description. */
.book-details .book-publication { color:#9a968f; letter-spacing:.08em; }

/* AI-translation notice (empty shelf state). */
.ai-notice {
  display:none;
  margin:16px auto 0;
  max-width:560px;
  padding:12px 18px 11px;
  background:rgba(255,255,255,.7);
  color:#141414;
  border-radius:3px;
  font:11px/1.6 Arial,sans-serif;
  letter-spacing:.02em;
  text-align:center;
}
.ai-notice.is-visible { display:block; animation:aiNoticeIn .5s ease both; }
@keyframes aiNoticeIn { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:none; } }
.ai-notice-check {
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin-top:8px;
  font-size:10px;
  letter-spacing:.06em;
  color:#3a3a3a;
  cursor:pointer;
  user-select:none;
}
.ai-notice-check input { width:12px; height:12px; margin:0; accent-color:#141414; cursor:pointer; }
@media (max-width:740px){
  .ai-notice { margin-top:12px; max-width:88vw; padding:10px 12px 9px; font-size:10px; line-height:1.5; }
}

/* V201 — Literature intro on phones / short screens: title and button stay
   visible, only the text scrolls inside the window. */
@media (max-width:700px), (max-height:620px) {
  .literature-intro-overlay { padding:14px; }
  .literature-intro-overlay .abstract-intro-box {
    display:flex; flex-direction:column;
    width:min(620px, calc(100vw - 28px));
    min-height:0; max-height:calc(100svh - 28px);
    overflow:hidden;
    padding:24px 20px 16px; border-width:2px; border-radius:16px;
  }
  .literature-intro-overlay .abstract-intro-box h2 { flex:0 0 auto; font-size:12px; margin-bottom:12px; letter-spacing:.14em; line-height:1.45; }
  .literature-intro-overlay .abstract-intro-box p {
    flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain;
    font-size:13px; line-height:1.6; padding:0 4px 16px 0;
    -webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 22px),transparent);
            mask-image:linear-gradient(180deg,#000 calc(100% - 22px),transparent);
  }
  .literature-intro-overlay .abstract-intro-actions { flex:0 0 auto; margin-top:12px; gap:10px; }
}
@media (max-height:520px) and (orientation:landscape) {
  .literature-intro-overlay .abstract-intro-actions { flex-direction:row; gap:22px; }
}

/* V208 — Library on phones.
   Every book is sized from one height (--bh) with the real cover proportion
   (2:3), so open covers are no longer cropped and spines keep the desktop
   proportion instead of looking stretched. The page flows top-to-bottom
   (title → shelf → book details → reader guide) and scrolls when needed,
   so nothing is cut off or overlapped on short screens. */
@media (max-width:740px) {
  html:has(body.literature-page) { overflow:hidden !important; height:100%; }
  body.literature-page { height:100%; overflow-x:hidden !important; overflow-y:auto !important; -webkit-overflow-scrolling:touch; }
  .literature-page { --bh:min(calc((100vw - 24px) / 1.6), 42svh, 300px); }

  .literature-stage {
    height:auto; min-height:100svh; overflow:visible; box-sizing:border-box;
    padding:64px 0 0; justify-content:flex-start;
  }
  .literature-title { position:relative; top:auto; margin-top:clamp(10px, 3svh, 26px); font-size:clamp(14px, 4.6vw, 18px); }
  .literature-rule { position:relative; top:auto; margin-top:clamp(10px, 2svh, 16px); flex:0 0 1px; }
  .book-carousel {
    position:relative; top:auto; flex:0 0 auto;
    height:calc(var(--bh) + 58px) !important; min-height:0 !important;
    margin-top:clamp(6px, 2svh, 18px); padding:0 12px !important;
  }
  .book-slot {
    --k:1;
    width:calc(var(--bh) * .115) !important; flex:0 0 calc(var(--bh) * .115) !important;
    height:calc(var(--bh) * var(--k)) !important; bottom:30px !important;
  }
  .book-slot:nth-child(1), .book-slot:nth-child(3), .book-slot:nth-child(7) { --k:.95; }
  .book-slot:nth-child(5), .book-slot:nth-child(8) { --k:.91; }
  .book-slot.is-active { flex-basis:calc(var(--bh) * var(--k) * .667) !important; }
  .book-pull { width:calc(var(--bh) * var(--k) * .667) !important; height:100% !important; }
  .book-spine { width:calc(var(--bh) * .11) !important; padding:calc(var(--bh) * .04) 0 calc(var(--bh) * .03) !important; }
  .spine-title { font-size:clamp(7px, calc(var(--bh) * .046), 11px) !important; bottom:calc(var(--bh) * .13) !important; }
  .spine-number { font-size:clamp(5.5px, calc(var(--bh) * .028), 8px) !important; bottom:calc(var(--bh) * .03) !important; }
  .spine-mark { font-size:clamp(10px, calc(var(--bh) * .06), 15px) !important; }
  .book-pages { width:calc(var(--bh) * .045) !important; }
  .book-slot.is-active .book-pull { transform:translateZ(30px) translateY(-10px) rotateX(2deg); }

  .book-information {
    position:relative; top:auto; flex:0 0 auto;
    width:min(92vw, 560px) !important; margin:clamp(4px, 1.5svh, 14px) auto 0;
  }
  .book-number { margin-bottom:8px; }
  .book-title-row { gap:10px !important; }
  .book-information h2 { font-size:clamp(13px, 4.2vw, 16px) !important; letter-spacing:.12em; text-indent:.12em; }
  .book-details { max-width:92vw; font-size:10.5px; line-height:1.55; }

  .literature-page .reader-guide-link-fixed {
    position:relative; right:auto; bottom:auto; z-index:9;
    display:flex; width:max-content; margin:22px auto calc(22px + env(safe-area-inset-bottom, 0px));
    font-size:9px;
  }
}
/* Landscape phones: a shorter shelf so the details stay close. */
@media (max-height:520px) and (orientation:landscape) {
  html:has(body.literature-page) { overflow:hidden !important; height:100%; }
  body.literature-page { height:100%; overflow-x:hidden !important; overflow-y:auto !important; }
  .literature-page { --bh:min(52svh, 210px); }
  .literature-stage { height:auto; min-height:100svh; overflow:visible; padding-top:58px; box-sizing:border-box; justify-content:flex-start; }
  .literature-title { position:relative; top:auto; margin-top:6px; font-size:15px; }
  .literature-rule { position:relative; top:auto; margin-top:10px; flex:0 0 1px; }
  .book-carousel { position:relative; top:auto; height:calc(var(--bh) + 56px) !important; min-height:0 !important; margin-top:4px; }
  .book-slot { --k:1; width:calc(var(--bh) * .13) !important; flex:0 0 calc(var(--bh) * .13) !important; height:calc(var(--bh) * var(--k)) !important; bottom:30px !important; }
  .book-slot:nth-child(1), .book-slot:nth-child(3), .book-slot:nth-child(7) { --k:.95; }
  .book-slot:nth-child(5), .book-slot:nth-child(8) { --k:.91; }
  .book-slot.is-active { flex-basis:calc(var(--bh) * var(--k) * .667) !important; }
  .book-pull { width:calc(var(--bh) * var(--k) * .667) !important; height:100% !important; }
  .book-spine { width:calc(var(--bh) * .125) !important; }
  .spine-title { font-size:clamp(7px, calc(var(--bh) * .05), 11px) !important; bottom:calc(var(--bh) * .13) !important; }
  .book-information { position:relative; top:auto; margin:6px auto 0; width:min(86vw, 640px) !important; }
  .literature-page .reader-guide-link-fixed { position:relative; right:auto; bottom:auto; display:flex; width:max-content; margin:18px auto 18px; }
}
@media (max-width:740px), (max-height:520px) and (orientation:landscape) {
  .literature-stage { min-height:calc(100svh - 62px - env(safe-area-inset-bottom, 0px)); }
}
/* Dark band behind the header on phones, so scrolled content fades under it. */
@media (max-width:740px), (max-height:520px) and (orientation:landscape) {
  .literature-page .site-header::before {
    content:""; position:fixed; left:0; right:0; top:0; height:72px; z-index:-1; pointer-events:none;
    background:linear-gradient(to bottom, #0d0c0c 0, #0d0c0c 76%, rgba(13,12,12,0) 100%);
  }
}
@media (max-width:740px), (max-height:520px) and (orientation:landscape) {
  .literature-page .internal-wordmark { z-index:120; }
}