/* SEN V SNE / NIGHT DIPTYCH — self-contained, no external services */
:root{color-scheme:dark;--ink:#f7f0df;--muted:#bdc7df;--gold:#f2ce90;--gold-deep:#b78554;--night:#070b20;--panel:#0e1530;--edge:rgba(243,205,144,.22);--serif:Georgia,'Times New Roman',serif;--sans:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;min-width:300px;background:var(--night);color:var(--ink);font:16px/1.65 var(--sans);overflow-x:hidden}
body::before{content:"";position:fixed;z-index:-2;inset:0;pointer-events:none;background:radial-gradient(ellipse 60% 45% at 48% 13%,rgba(28,67,116,.37),transparent 76%),radial-gradient(ellipse 75% 44% at 90% 65%,rgba(70,36,93,.26),transparent 72%),linear-gradient(180deg,#06091e 1%,#0c1531 45%,#080d24 100%)}
body::after{content:"";position:fixed;z-index:-1;inset:0;pointer-events:none;opacity:.53;background-image:radial-gradient(circle at 11% 16%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 71% 30%,#f9deb2 0 1px,transparent 1.7px),radial-gradient(circle at 38% 66%,#d9e9ff 0 1px,transparent 1.6px),radial-gradient(circle at 86% 86%,#fff 0 .9px,transparent 1.5px);background-size:222px 211px,307px 289px,173px 181px,393px 303px}
a{color:inherit}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid #fff2c0;outline-offset:5px}
.skip-link{position:absolute;left:12px;top:-100px;z-index:200;padding:.65rem 1rem;background:#e8cc9b;color:#0b1023}.skip-link:focus{top:12px}
.site-nav{width:min(1180px,calc(100% - 32px));margin:auto;padding:21px 0;display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand{font:600 .72rem/1.4 var(--sans);letter-spacing:.22em;text-decoration:none;color:#e7d4b4;text-transform:uppercase}
.lang-switch{display:flex;align-items:center;gap:9px;border:1px solid var(--edge);border-radius:100px;padding:5px;font:.76rem/1.4 var(--sans);letter-spacing:.07em;white-space:nowrap}
.lang-switch .label{padding:0 9px;color:var(--muted)}
.lang-switch a{text-decoration:none;border-radius:999px;padding:8px 12px;color:#d9d2cf;transition:background .2s}
.lang-switch a[aria-current=page]{background:linear-gradient(135deg,#ebc990,#d5a66b);color:#21132a;font-weight:800}
.lang-switch a:not([aria-current]):hover{background:rgba(255,255,255,.10)}
.hero{position:relative;padding:62px 16px 66px;text-align:center;isolation:isolate;overflow:hidden}
.hero::before{content:"";position:absolute;left:50%;top:10px;z-index:-1;transform:translateX(-50%);width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,#ffd8a0 0 12%,#d0a2ad 19%,rgba(179,169,210,.4) 30%,transparent 60%);filter:blur(7px);opacity:.16}
.hero .eyebrow{margin:0 0 23px;color:#e6cdac;font-size:.75rem;letter-spacing:.29em;font-weight:700}
.hero h1{margin:0 auto;max-width:1000px;color:#ffe5b3;text-wrap:balance;font:500 clamp(3.45rem,9vw,7.3rem)/1.01 var(--serif);letter-spacing:.012em;text-shadow:0 3px 2px #392a4a,0 0 40px rgba(245,183,108,.20)}
.hero-ornament{margin:12px auto 13px;color:#e3b985;font:2.2rem/1 var(--serif);letter-spacing:.2em}
.hero .second-name{margin:0;color:#c2c8e1;font:italic 1.1rem/1.6 var(--serif);letter-spacing:.22em}
.hero .hero-sub{margin:26px 0 0;color:#f4d3a1;font-size:.72rem;letter-spacing:.24em;font-weight:650}
.hero .lead{max-width:710px;margin:27px auto 0;color:#d1d7e6;font:1.1rem/1.95 var(--serif)}
.chapters-nav{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:34px auto 0}
.chapters-nav a,.soft-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:10px 19px;border:1px solid rgba(242,206,144,.42);border-radius:100px;color:#ffebcd;background:rgba(17,29,60,.53);font:.8rem/1.4 var(--sans);text-decoration:none;letter-spacing:.03em;cursor:pointer;transition:background .2s,transform .2s,border-color .2s}
.chapters-nav a:hover,.soft-button:hover{background:rgba(229,184,112,.15);transform:translateY(-2px);border-color:#f0ce97}
.page-main{width:min(1200px,calc(100% - 24px));margin:auto}
.reading-note{width:min(900px,calc(100% - 12px));margin:0 auto 86px;padding:18px 25px;color:#c5cce1;border-top:1px solid rgba(243,205,144,.25);border-bottom:1px solid rgba(243,205,144,.25);font-size:.89rem;text-align:center}
.reading-note strong{color:#f7d7a0}
.chapter{position:relative;margin:0 auto 115px;max-width:1140px;scroll-margin-top:22px}
.chapter .chapter-head{text-align:center;margin:0 auto 31px;padding:0 12px}
.chapter-index{font-size:.72rem;color:#e0b87f;font-weight:750;letter-spacing:.3em}
.chapter h2{color:#f7ddb1;margin:9px 0;font:400 clamp(2.15rem,6vw,4.2rem)/1.18 var(--serif);text-wrap:balance}
.chapter .chapter-subtitle{max-width:680px;margin:12px auto 0;font:italic 1.05rem/1.7 var(--serif);color:#d0d5e9}
.star-rule{margin:31px auto 0;width:160px;height:1px;background:linear-gradient(90deg,transparent,#c6a27b,transparent);position:relative}
.star-rule::after{content:'✧';position:absolute;top:50%;left:50%;transform:translate(-50%,-54%);padding:0 10px;background:#0d1530;color:#eac58a}
.comic-figure{margin:0 auto;width:min(100%,1097px);position:relative}
.art-shell{padding:8px;position:relative;background:linear-gradient(140deg,#b88b59,#f9e7ba 24%,#866e65 55%,#c79c67 83%,#f5d09a);border-radius:5px;box-shadow:0 0 0 1px rgba(250,214,154,.15),0 24px 100px rgba(0,0,0,.5),0 0 100px rgba(112,87,162,.11)}
.artboard{position:relative;aspect-ratio:1087/1536;overflow:hidden;background:#12172e;isolation:isolate;touch-action:pan-y}
.artboard img{display:block;width:100%;height:auto;aspect-ratio:1087/1536;object-fit:contain}
.localized-art{display:none;position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:hidden}
html[lang=en].show-translations .localized-art{display:block}
.balloon-type{fill:#17141e;font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:bold;paint-order:stroke;stroke:#fffaf0;stroke-width:1px}
.plaque-type{font-family:Georgia,'Times New Roman',serif;font-weight:bold;font-style:italic}
.axiom-type{font-family:Georgia,'Times New Roman',serif;fill:#312238;font-weight:bold;letter-spacing:.35px}
.figure-controls{display:flex;align-items:center;justify-content:center;gap:10px 13px;flex-wrap:wrap;margin:21px 0 0}
.figcaption{font-size:.78rem;color:#a9b4d0;margin:11px 0 0;text-align:center;letter-spacing:.06em}
.translation-switch{display:flex;align-items:center;gap:4px;border:1px solid rgba(242,206,144,.38);border-radius:100px;padding:4px}
.translation-switch button{background:none;border:0;border-radius:100px;padding:10px 13px;color:#d6dcf0;cursor:pointer;font:600 .77rem var(--sans)}
.translation-switch button[aria-pressed=true]{background:#e3c293;color:#1b1731}
.dialogue{width:min(900px,calc(100% - 12px));margin:27px auto 0;border:1px solid var(--edge);border-radius:15px;background:linear-gradient(135deg,rgba(21,33,69,.78),rgba(18,18,45,.87));color:#e6e9f6;overflow:hidden;box-shadow:0 12px 40px rgba(0,0,0,.15)}
.dialogue summary{cursor:pointer;padding:15px 22px;color:#edcd9d;font:600 1rem var(--serif);letter-spacing:.03em}
.dialogue summary:hover{background:rgba(255,255,255,.04)}
.dialogue ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 30px;list-style:none;counter-reset:panel;margin:0;padding:11px 24px 24px}
.dialogue li{display:flex;align-items:baseline;gap:12px;font:1rem/1.65 var(--serif);color:#ebe6e0}
.dialogue li::before{counter-increment:panel;content:counter(panel, decimal-leading-zero);font:700 .7rem var(--sans);color:#c99b70;min-width:25px;letter-spacing:.04em}
.motto{padding:70px 20px 98px;text-align:center;border-top:1px solid var(--edge);max-width:970px;margin:0 auto}
.motto .white-dove{font-size:2.5rem;filter:drop-shadow(0 0 25px rgba(255,255,255,.33));margin-bottom:14px}
.motto .before{font:.9rem/1.8 var(--serif);font-style:italic;color:#c5cce1}
.motto blockquote{margin:16px auto;color:#f6dba9;font:500 clamp(1.9rem,4.9vw,3.6rem)/1.25 var(--serif);max-width:900px;text-wrap:balance}
.motto .after{color:#d9d6e1;font:italic 1.12rem/1.7 var(--serif)}
.site-footer{text-align:center;border-top:1px solid var(--edge);padding:42px 15px 54px;color:#d7c7bc}
.site-footer .credit{display:block;font:italic clamp(.95rem,2.4vw,1.38rem) var(--serif);letter-spacing:.02em;color:#f3d5a5}
.site-footer small{display:block;color:#a9afc2;font-size:.78rem;margin-top:13px;letter-spacing:.05em}
.return-top{display:inline-block;margin-top:25px;text-decoration:none;color:#b9c5e9;font-size:.84rem}
.image-dialog{width:calc(100vw - 25px);max-width:1450px;max-height:96vh;background:#050817;color:var(--ink);border:1px solid var(--gold-deep);border-radius:10px;padding:14px;overflow:auto;box-shadow:0 0 130px #000}
.image-dialog::backdrop{background:rgba(0,1,9,.91);backdrop-filter:blur(9px)}
.image-dialog .dialog-toolbar{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:2px 5px 13px;background:#050817}
.image-dialog .dialog-toolbar span{font:1.15rem var(--serif);color:#f2d2a3}
.image-dialog .artboard{width:min(100%,1120px);margin:0 auto;height:auto;touch-action:pan-x pan-y}
.image-dialog .artboard img{width:100%}
body.dialog-open{overflow:hidden}
@media (max-width:700px){.site-nav{padding:16px 0}.brand{font-size:.62rem;letter-spacing:.1em}.lang-switch .label{display:none}.lang-switch{gap:0}.lang-switch a{padding:7px 9px}.hero{padding:39px 16px 52px}.hero .eyebrow,.hero .hero-sub{font-size:.63rem;letter-spacing:.12em}.hero .lead{font-size:1rem;line-height:1.8}.reading-note{margin-bottom:58px}.chapter{margin-bottom:78px}.chapter .chapter-head{margin-bottom:22px}.chapter .chapter-subtitle{font-size:.96rem}.dialogue ol{grid-template-columns:1fr;padding:8px 16px 20px}.art-shell{padding:4px}.motto{padding:42px 10px 68px}.reading-note{font-size:.8rem;padding:16px}.figure-controls{flex-direction:column}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
@media print{@page{size:A4 portrait;margin:0}*{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}html,body{width:210mm;background:#fff!important}body::before,body::after,.site-nav,.hero,.reading-note,.chapter-head,.figure-controls,.figcaption,.dialogue,.motto,.site-footer,.image-dialog{display:none!important}.page-main{width:100%;margin:0}.chapter{width:210mm;max-width:210mm;margin:0!important;padding:0!important;break-before:page;break-after:page;break-inside:avoid}.chapter:first-of-type{break-before:auto}.comic-figure{width:210mm!important;margin:0!important}.art-shell{padding:0!important;border-radius:0!important;box-shadow:none!important;background:none!important}.artboard{width:210mm!important;height:297mm!important}.artboard img{width:210mm!important;height:297mm!important;object-fit:fill!important}}

/* 19 October 2026 — final site integration (scoped component additions) */
.site-return-links{margin:24px auto 0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.site-return-links a{display:inline-flex;padding:8px 13px;border:1px solid rgba(242,206,144,.30);border-radius:30px;text-decoration:none;color:#efd8b1;font:12px/1.5 system-ui,sans-serif}
.site-return-links a:hover{background:#f0d19a;color:#121a30}
.art-mode-controls{margin:-54px auto 68px}
@media(max-width:700px){.art-mode-controls{margin:-34px auto 48px}}
@media print{.site-return-links,.art-mode-controls{display:none!important}}