@font-face{font-family:ClassicComic;src:url(ComicNeue-Regular.ttf) format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:ClassicComic;src:url(ComicNeue-Bold.ttf) format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:ComicCyrillic;src:url(Neucha.ttf) format('truetype');font-display:swap}
@font-face{font-family:Hindi;src:url(Kalam-Bold.ttf) format('truetype');font-weight:700;font-display:swap}
.canvas .line:not(.title),.panel-dialogue .line:not(.title){font-family:ClassicComic,Comic,Hindi,sans-serif;font-weight:700;font-size:2.04cqw;line-height:1.12;letter-spacing:.025em;text-transform:uppercase}
.canvas .line.caption,.panel-dialogue .line.caption{background:#faf8ef;color:#111;border:1.5px solid #111;border-radius:0;box-shadow:none;padding:.4em .55em;max-width:88%}
.canvas .line.epigraph,.panel-dialogue .line.epigraph{background:#f7f4e9;color:#171719;border:1.5px solid #111;font-family:Georgia,serif;font-weight:normal;text-transform:none;font-size:1.65cqw;line-height:1.3;letter-spacing:0}
.canvas .line.balloon,.panel-dialogue .line.balloon{position:relative;isolation:isolate;display:block;width:fit-content;max-width:94%;padding:.55em 1.05em;margin:5px 0;background:none;border:0;border-radius:0;box-shadow:none;color:#111;text-align:center;overflow:visible}
.balloon-copy{position:relative;z-index:1}.balloon-outline{position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:0;pointer-events:none}.balloon-outline path{fill:#fffdf5;stroke:#111;stroke-width:1.6px;vector-effect:non-scaling-stroke;stroke-linejoin:round}.whisper .balloon-outline path{stroke-dasharray:4 2}.balloon .speaker{position:absolute!important;width:1px;height:1px;padding:0!important;margin:-1px!important;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.canvas .letter-panel{gap:1.35cqw;padding:1.7%}.canvas .letter-panel .line[data-role=next]{align-self:flex-end}
.page[data-id=i01-p06-07] .canvas .line{font-size:1.25cqw;line-height:1.13}.page[data-id=i01-p06-07] .canvas .letter-panel{gap:.8cqw;padding:1.15%}
.page[data-id=i01-p04] .canvas .line.caption{margin-top:5cqw}.cover .canvas .line.caption{background:none;border:0;color:var(--paper);font-family:Georgia,serif;font-weight:normal;text-transform:none;letter-spacing:0}
.panel-item{position:relative;border:2px solid #070707;background:#eeeae0;overflow:hidden;margin-bottom:24px}.panel-dialogue{container-type:inline-size;padding:20px 18px;gap:22px;align-items:flex-start;background:#eeeae0;color:#111}
.panel-dialogue .line:not(.title){font-size:20px;line-height:1.18}.panel-dialogue .line.epigraph{font-size:17px}.panel-dialogue .line.caption{max-width:100%;font-size:18px}.panel-dialogue .line.balloon{max-width:94%;margin:5px 0;padding:.55em 1.1em}.panel-dialogue .line.balloon:nth-child(even){align-self:flex-end}
.panel-item.dialogue-overlay .panel-dialogue{position:absolute;inset:0 0 auto;background:none;pointer-events:none;padding:15px 12px;gap:18px}.panel-item.dialogue-overlay.dialogue-bottom .panel-dialogue{inset:auto 0 0}.panel-item.dialogue-overlay .line.caption{max-width:90%}
html[lang=ru] .canvas .line:not(.title),html[lang=ru] .panel-dialogue .line:not(.title){font-family:ComicCyrillic,Comic,sans-serif;font-weight:400;letter-spacing:.025em;font-size:2.12cqw;line-height:1.13}
html[lang=ru] .page[data-id=i01-p06-07] .canvas .line{font-size:1.36cqw;line-height:1.14}
html[lang=hi] .canvas .line:not(.title),html[lang=hi] .panel-dialogue .line:not(.title){font-family:Hindi,sans-serif;font-weight:700;letter-spacing:0;font-size:2.07cqw;line-height:1.43;text-transform:none}
html[lang=hi] .page[data-id=i01-p06-07] .canvas .line{font-size:1.25cqw;line-height:1.35}
html[lang=hi] .panel-dialogue .line:not(.title),html[lang=ru] .panel-dialogue .line:not(.title){font-size:20px}
html[lang=hi] .cover .canvas .line.caption{font-family:Hindi,sans-serif;font-weight:400}html[lang=ru] .cover .canvas .line.caption{font-family:Georgia,serif;font-weight:400;text-transform:none}
@media(max-width:700px){.panel-dialogue .line:not(.title),html[lang=ru] .panel-dialogue .line:not(.title),html[lang=hi] .panel-dialogue .line:not(.title){font-size:19px}.panel-dialogue .line.epigraph{font-size:16px}.canvas .line.balloon{margin:2px 0}.canvas .letter-panel{gap:1.1cqw}.balloon-outline path{stroke-width:1.3px}}

/* Voice-specific balloon surfaces. Blood-written narration is handled below. */
.canvas .line:not(.title),.panel-dialogue .line:not(.title){letter-spacing:.018em}
.line.balloon{--balloon-paper:#ddd4bc;--balloon-ink:#201b18;--balloon-edge:#26201b;--balloon-echo:#8b7960}
.canvas .line.balloon,.panel-dialogue .line.balloon{color:var(--balloon-ink);padding:.48em .8em}
.balloon-outline .balloon-body{fill:var(--balloon-paper);stroke:var(--balloon-edge);stroke-width:1.7px}
.balloon-outline .ink-echo{fill:none;stroke:var(--balloon-echo);stroke-width:1px;opacity:.58;transform:translate(1.5px,2px)}
.line.balloon[data-tone=curse]{--balloon-paper:#29100e;--balloon-ink:#f3ddbc;--balloon-edge:#b9523b;--balloon-echo:#da6c43;font-style:italic}
.line.balloon[data-tone=wrath]{--balloon-paper:#291b16;--balloon-ink:#f3ddbc;--balloon-edge:#9e6146;--balloon-echo:#b9523b}
.line.balloon[data-tone=ancestor]{--balloon-paper:#172129;--balloon-ink:#dce5df;--balloon-edge:#879f9e;--balloon-echo:#496264}
.line.balloon[data-tone=dread]{--balloon-paper:#28201d;--balloon-ink:#e8d7bd;--balloon-edge:#98725d;--balloon-echo:#8e372b}
.line.balloon[data-tone=whisper]{--balloon-paper:#1c1d1b;--balloon-ink:#d8c9af;--balloon-edge:#9d8e76;--balloon-echo:#553329}
.key-word{color:inherit;font-style:normal;font-weight:700}
.line[data-tone=ancestor] .key-word{color:inherit}
.line.balloon[data-tone=curse] .balloon-outline .balloon-body{stroke-width:2.1px}
.canvas .line.caption,.panel-dialogue .line.caption{background:linear-gradient(112deg,#211d18,#151514);color:#e2d5b8;border:1px solid #75624b;border-left:3px solid #9c8159;padding:.45em .6em;box-shadow:2px 3px 0 #0008;clip-path:polygon(0 2px,38% 0,71% 1px,100% 0,calc(100% - 1px) 71%,100% 100%,62% calc(100% - 1px),29% 100%,1px calc(100% - 2px))}
.canvas .line.caption[data-atmosphere=blood],.panel-dialogue .line.caption[data-atmosphere=blood]{background:linear-gradient(108deg,#2b1713,#151312 75%);border-color:#664438;border-left-color:#bd4935;color:#eddbc0}
.canvas .line.epigraph,.panel-dialogue .line.epigraph{background:#191a17;color:#dbccb0;border-color:#76614a}
.cover .canvas .line.caption{background:none;border:0;box-shadow:none;clip-path:none}
.panel-item,.panel-dialogue{background:#171615}

/* Re-letter the crowded ancestral spread in dedicated bands. Every pixel of each panel remains visible. */
.composed-page>.master{display:none}
.composed-rows{display:flex;flex-direction:column;gap:8px;background:#050505}
.comic-row{display:grid;grid-template-columns:var(--columns);gap:7px}
.comic-frame{display:flex;flex-direction:column;min-width:0;background:linear-gradient(125deg,#211b17,#101214);border-top:2px solid #5b2b23}
.frame-lettering{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:10px;padding:18px 18px 30px;flex:1}
.comic-frame .panel-art{flex-shrink:0;border-top:1px solid #72543a}
.page[data-id=i01-p06-07] .composed-page .line:not(.title),html[lang=ru] .page[data-id=i01-p06-07] .composed-page .line:not(.title){font-size:clamp(16px,1.5cqw,21px);line-height:1.2}
html[lang=hi] .page[data-id=i01-p06-07] .composed-page .line:not(.title){font-size:clamp(17px,1.5cqw,21px);line-height:1.5}
.composed-page .line.caption{max-width:100%;margin:0;box-shadow:none}
.composed-page .line.balloon{max-width:100%;align-self:center;margin:0}
.composed-page .comic-frame[data-panel=i01-p06-07-h] .frame-lettering{flex-direction:row;align-items:center;justify-content:space-between;gap:30px}
body[data-view=art] .composed-page>.master{display:block}
body[data-view=art] .composed-rows{display:none}
.page[data-id=i01-p06-07] .panel-item .panel-dialogue{padding-top:30px}
@media(max-width:900px){
 .comic-row{grid-template-columns:1fr;gap:22px}
 .composed-rows{gap:22px}
 .frame-lettering{padding:18px 20px 30px}
 .page[data-id=i01-p06-07] .composed-page .line:not(.title),html[lang=hi] .page[data-id=i01-p06-07] .composed-page .line:not(.title),html[lang=ru] .page[data-id=i01-p06-07] .composed-page .line:not(.title){font-size:19px}
 .composed-page .comic-frame[data-panel=i01-p06-07-h] .frame-lettering{flex-direction:column;align-items:flex-start;gap:20px}
}

/* Time, family and source transitions remain outside the artwork. */
.scene-bridge{font:700 18px/1.4 ClassicComic,Comic,sans-serif;color:#d9c9ac;background:#1c1916;border-left:3px solid #8d6950;margin:0 0 12px;padding:12px 18px;max-width:100%}
html[lang=hi] .scene-bridge{font-family:Hindi,sans-serif;line-height:1.6}
html[lang=ru] .scene-bridge{font-family:ComicCyrillic,sans-serif;font-weight:400;font-size:19px}
body[data-view=art] .scene-bridge{display:none}

/* Blood is a stroke treatment, not red highlighting. Keep this rare and readable:
   three short narrative phrases, never a whole speech or a philosophical term. */
@font-face{font-family:BloodInk;src:url(RubikWetPaint-Regular.ttf) format('truetype');font-weight:400;font-display:swap}
.ink-defs{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.canvas .blood-script,.panel-dialogue .blood-script{font-family:BloodInk,ClassicComic,sans-serif;font-weight:400;font-size:.92em;font-style:normal;letter-spacing:.015em;line-height:1.4;color:inherit;filter:url(#blood-ink-edge);text-shadow:0 .035em 0 currentColor}
html[lang=ru] .canvas .blood-script,html[lang=ru] .panel-dialogue .blood-script{font-family:BloodInk,ComicCyrillic,sans-serif;font-weight:400}
html[lang=hi] .canvas .blood-script,html[lang=hi] .panel-dialogue .blood-script{font-family:Hindi,sans-serif;font-weight:700;font-size:1em;letter-spacing:0;-webkit-text-stroke:.25px currentColor;text-shadow:0 .045em 0 currentColor}

/* Full-art reading: glass sits on a blurred extension OUTSIDE the panel crop. */
.protected-page .comic-row{align-items:start;gap:12px}
.protected-page .composed-rows{gap:18px;background:#060809}
.protected-frame{--glaze:104,162,181;position:relative;isolation:isolate;container-type:inline-size;background:#070a0d;border:1px solid #29353a;overflow:hidden}
.protected-frame[data-palette=carmine]{--glaze:202,54,52;border-color:#402323}
.protected-frame[data-palette=olive]{--glaze:167,153,94;border-color:#34372c}
.protected-frame .panel-art{order:0;flex:none;border:0;z-index:1}
.protected-frame .glass-lettering{position:relative!important;inset:auto!important;order:1;isolation:isolate;flex:none;width:100%!important;margin:0!important;min-height:0;padding:32px 22px 22px;gap:17px;overflow:hidden;background:linear-gradient(118deg,rgba(10,16,21,.87),rgba(5,7,9,.94));border-top:1px solid rgba(var(--glaze),.55);box-shadow:inset 0 1px 18px rgba(var(--glaze),.07);pointer-events:auto}
.protected-frame .glass-lettering::before{content:"";position:absolute;z-index:-2;inset:-35px;background-image:var(--scene-image);background-size:cover;background-position:center;filter:blur(28px) saturate(.65);opacity:.25;pointer-events:none}
.protected-frame .glass-lettering::after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(130deg,rgba(var(--glaze),.08),transparent 40%,#05080bd9);pointer-events:none}
.protected-frame .line:not(.title),html[lang=ru] .protected-frame .line:not(.title){font-size:clamp(17px,3.4cqw,21px)!important;line-height:1.27!important;letter-spacing:.015em}
html[lang=hi] .protected-frame .line:not(.title){font-size:clamp(18px,3.4cqw,21px)!important;line-height:1.5!important}
.protected-frame .line.caption{max-width:100%;width:fit-content;margin:0;padding:.62em .8em;background:linear-gradient(125deg,#17222ab0,#090e13bb);color:#e7dfd1;border:1px solid rgba(var(--glaze),.35);border-left:2px solid rgba(var(--glaze),.85);border-radius:3px;clip-path:none;box-shadow:inset 0 1px 0 #ffffff0d,0 5px 18px #0004;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.protected-frame .line.balloon{max-width:100%;align-self:flex-start;margin:0;padding:.55em .9em;--balloon-paper:#e1d9c6eb;--balloon-edge:#6a685a;--balloon-echo:#91acb040;--balloon-ink:#171c1c}
.protected-frame .line.balloon:nth-child(even){align-self:flex-end}
.protected-frame .line.balloon[data-tone=curse]{--balloon-paper:#29100eeb;--balloon-ink:#f3ddbc;--balloon-edge:#bd5346}
.protected-frame .line.balloon[data-tone=wrath]{--balloon-paper:#291b16eb;--balloon-ink:#f3ddbc;--balloon-edge:#9e6146}
.protected-frame .line.balloon[data-tone=ancestor]{--balloon-paper:#172129eb;--balloon-ink:#dce5df;--balloon-edge:#879f9e}
.protected-frame .line.balloon[data-tone=dread]{--balloon-paper:#28201deb;--balloon-ink:#e8d7bd;--balloon-edge:#98725d}
.protected-frame .line.balloon[data-tone=whisper]{--balloon-paper:#1c1d1beb;--balloon-ink:#d8c9af;--balloon-edge:#9d8e76}
.protected-frame .line.epigraph{max-width:100%;background:#0d1115c9;border-color:#88755466}
.protected-page .comic-frame[data-panel=i01-p06-07-h] .frame-lettering{flex-direction:column;align-items:flex-start;gap:17px}
.panel-item.protected-frame .panel-dialogue{display:flex}
.panel-item.protected-frame .panel-dialogue:empty{display:none}
@media(min-width:1100px){.page:not(.cover){max-width:1060px}.page.spread{max-width:1300px}}
@media(max-width:900px){.protected-page .comic-row{grid-template-columns:1fr;gap:18px}.protected-frame .glass-lettering{padding:30px 18px 20px}}
@media(min-width:901px){
 .page[data-id=i01-p10] .protected-page .composed-rows{display:grid;grid-template-columns:1.25fr 1fr;gap:12px;align-items:start}
 .page[data-id=i01-p10] .protected-page .comic-row{display:contents}
 .page[data-id=i01-p10] .comic-frame[data-panel=i01-p10-a]{grid-column:1;grid-row:1 / span 3}
 .page[data-id=i01-p10] .comic-frame:not([data-panel=i01-p10-a]){grid-column:2}
}
/* The atmosphere continues beneath the glass, while the sharp art stops at its own edge. */
.protected-frame .glass-lettering{background:#080c10;box-shadow:inset 0 1px 0 #ffffff16}
.protected-frame .glass-lettering::before{filter:blur(18px) saturate(.85);opacity:.66}
.protected-frame .glass-lettering::after{background:linear-gradient(130deg,#050a0e68,rgba(var(--glaze),.10) 45%,#04070bd9)}
.protected-frame .line.caption{background:linear-gradient(125deg,#111b2470,#090e138c);box-shadow:inset 0 1px 0 #ffffff12,0 5px 18px #0003}
