*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#151a1e;color:#fff;font-family:Nunito,sans-serif}.skip{position:absolute;top:-100px;left:12px;background:#fff;color:#123;padding:9px;z-index:30}.skip:focus{top:12px}.comic-reader{min-height:100dvh;position:relative;background:linear-gradient(180deg,#0f2325,#151a1e 280px)}.comic-reader:before{content:"";position:absolute;inset:0 0 auto;height:250px;background-image:linear-gradient(180deg,#0b1c20ba,#14191ffa),var(--comic-cover);background-size:cover;background-position:center;pointer-events:none}.comic-chrome{position:relative;z-index:5;display:flex;align-items:center;gap:16px;padding:14px max(16px,env(safe-area-inset-left));min-height:80px}.comic-back,.comic-controls button,.comic-settings button{border:1px solid #ffffff55;background:#101b1dcc;color:white;border-radius:999px;padding:10px 14px;text-decoration:none;font:700 14px Nunito,sans-serif;cursor:pointer}.comic-back:hover,.comic-controls button:hover,.comic-settings button:hover{background:#294b4f}.comic-back:focus-visible,.comic-controls button:focus-visible,.comic-settings :focus-visible,.comic-footer a:focus-visible{outline:3px solid #f5bf64;outline-offset:3px}.comic-heading{flex:1;min-width:0;text-align:center}.comic-heading small{color:#b3d0cf;letter-spacing:.12em;font-weight:800;font-size:10px}.comic-heading h1{font:700 clamp(17px,2.5vw,26px) Fredoka,sans-serif;margin:2px 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.comic-controls{display:flex;gap:8px}.comic-page-scroll{position:relative;display:flex;flex-direction:column;align-items:center;gap:22px;padding:14px 16px 50px}.comic-page{position:relative;container-type:inline-size;width:min(100%,680px);background:#f3f0e9;box-shadow:0 17px 48px #0008;overflow:hidden}.comic-page>img{display:block;width:100%;height:auto}.comic-text{position:absolute;box-sizing:border-box;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.18;overflow:hidden;font-family:Fredoka,sans-serif}.comic-text.rounded{border-radius:18px}.comic-text.cloud{border-radius:45%}.comic-text.speech{border-radius:16px 16px 16px 3px}.comic-text.note{border-radius:2px;box-shadow:3px 3px 0 #0003}.comic-text.caption{border-radius:7px}.comic-settings{position:fixed;z-index:15;right:16px;top:72px;width:min(320px,calc(100vw - 32px));background:#263437;color:white;border:1px solid #6e9898;border-radius:16px;padding:18px;box-shadow:0 18px 46px #0009}.comic-settings[hidden]{display:none}.comic-settings h2{font:700 20px Fredoka,sans-serif;margin:0 0 14px}.comic-settings label{display:flex;flex-direction:column;gap:6px;margin:12px 0;font-size:14px}.comic-settings select,.comic-settings input{width:100%;padding:8px;border-radius:7px}.comic-footer{position:relative;display:flex;justify-content:space-between;gap:16px;width:min(100%,680px);margin:auto;padding:0 16px 32px;color:#b8cbca}.comic-footer a{color:#f4c277}.comic-reader:fullscreen{overflow:auto;background:#151a1e}@media(max-width:600px){.comic-chrome{padding:10px 12px;gap:7px;min-height:62px}.comic-back span{display:none}.comic-heading small{font-size:8px}.comic-heading h1{font-size:17px}.comic-controls{gap:5px}.comic-controls button,.comic-back{padding:8px 10px}.comic-page-scroll{gap:9px;padding:6px 0 34px}.comic-page{width:100%;box-shadow:none}.comic-footer{padding:0 14px 24px;font-size:12px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media(max-width:600px){.comic-chrome{display:grid;grid-template-columns:36px minmax(0,1fr) 78px;gap:6px}.comic-back span{display:none}.comic-heading h1{font-size:16px}.comic-controls{gap:4px}.comic-controls button,.comic-back{display:grid;place-items:center;width:36px;height:36px;padding:0}}
.comic-about,.comic-related{position:relative;width:min(100%,680px);margin:0 auto 28px;padding:0 16px;color:#d4e0df;line-height:1.6}.comic-about p{margin:0 0 12px}.comic-about a,.comic-related a{color:#f4c277}.comic-credits{font-size:13px;color:#b8cbca}.comic-character-links{display:flex;gap:8px;flex-wrap:wrap}.comic-character-links a{padding:6px 12px;border:1px solid #54716f;border-radius:999px;text-decoration:none;font-size:13px}.comic-related h2{font:600 21px Fredoka,sans-serif;margin:0 0 16px;color:#fff}.comic-related>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.comic-related a{display:block;border:1px solid #43524f;border-radius:12px;overflow:hidden;text-decoration:none;background:#202c2c}.comic-related img{display:block;width:100%;height:auto;aspect-ratio:8/5;object-fit:cover}.comic-related span{display:block;padding:12px;font-weight:700;line-height:1.4}.comic-about a:focus-visible,.comic-related a:focus-visible{outline:3px solid #f5bf64;outline-offset:3px}.comic-settings{max-height:calc(100dvh - 88px);overflow:auto}@media(max-width:400px){.comic-related>div{gap:10px}.comic-related span{font-size:13px;padding:10px}}

.comic-controls [hidden]{display:none}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.comic-chrome{padding-left:120px}
.comic-back{position:fixed;top:max(14px,env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left));z-index:25;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;background:#102225f2;box-shadow:0 4px 18px #0007}
.comic-controls{align-items:center}
.comic-language select{height:40px;max-width:132px;border:1px solid #ffffff88;border-radius:999px;background:#102225ee;color:#fff;padding:0 9px;font:700 13px Nunito,sans-serif;cursor:pointer}
.comic-language select:focus-visible{outline:3px solid #f5bf64;outline-offset:3px}
@media(max-width:600px){.comic-chrome{grid-template-columns:minmax(0,1fr) auto;padding-left:62px;padding-right:10px}.comic-back{top:max(10px,env(safe-area-inset-top));left:max(10px,env(safe-area-inset-left));width:44px;height:44px;font-size:19px}.comic-heading small{display:none}.comic-heading h1{font-size:15px}.comic-language select{max-width:84px;height:36px;font-size:12px;padding:0 4px}.comic-controls button{width:36px;height:36px}}
.comic-cover-image{position:absolute;inset:0 0 auto;width:100%;height:250px;object-fit:cover;z-index:0;pointer-events:none}.comic-reader:before{background-image:linear-gradient(180deg,#0b1c20ba,#14191ffa);z-index:1}.comic-page-scroll{z-index:2}
.comic-text.fit-text{overflow:auto}
.comic-text.none{border-radius:0;box-shadow:none}

/* Keep the language selector available beside the reader controls while pages scroll. */
.comic-language{position:fixed;top:max(14px,env(safe-area-inset-top));right:105px;z-index:26}
@media(max-width:600px){.comic-language{top:max(10px,env(safe-area-inset-top));right:86px}}

.comic-language{position:fixed;top:max(12px,env(safe-area-inset-top));right:120px;z-index:26}
.comic-controls{padding-left:140px}
.comic-language-trigger{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:112px;min-height:44px;padding:0 13px;border:1px solid #ffffff55;border-radius:999px;background:linear-gradient(145deg,#183b3beF,#102225f5);box-shadow:0 5px 18px #0005,inset 0 1px #ffffff16;color:#fff;font:700 13px Nunito,sans-serif;cursor:pointer;transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.comic-language-trigger:hover{border-color:#8ac9c1;background:#1a4544;box-shadow:0 7px 22px #0007,inset 0 1px #ffffff20}
.comic-language-trigger svg{flex:none;transition:transform .18s ease}
.comic-language[data-open=true] .comic-language-trigger{border-color:#92d5ca;background:#1a4544;box-shadow:0 0 0 3px #91d2c52b,0 8px 24px #0007}
.comic-language[data-open=true] .comic-language-trigger svg{transform:rotate(180deg)}
.comic-language-trigger:focus-visible,.comic-language-option:focus-visible{outline:3px solid #f5bf64;outline-offset:3px}
.comic-language-menu{position:absolute;top:calc(100% + 9px);right:0;display:grid;gap:4px;width:176px;padding:6px;border:1px solid #ffffff30;border-radius:16px;background:#172729f5;box-shadow:0 16px 38px #0009;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);opacity:0;transform:translateY(-5px) scale(.98);transform-origin:top right;pointer-events:none;transition:opacity .16s ease,transform .16s ease}
.comic-language-menu[hidden]{display:none}
.comic-language[data-open=true] .comic-language-menu{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}
.comic-language-option{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:0 12px;border:0;border-radius:11px;background:transparent;color:#eaf3f2;text-align:left;font:600 14px Nunito,sans-serif;cursor:pointer;transition:background-color .14s ease,color .14s ease}
.comic-language-option:hover{background:#ffffff12}
.comic-language-option[aria-selected=true]{background:#28514d;color:#fff}
.comic-language-option svg{width:17px;height:17px;fill:none;stroke:#9be1cb;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.comic-language-option[aria-selected=true] svg{opacity:1}
@media(max-width:600px){.comic-language{top:max(10px,env(safe-area-inset-top));right:86px}.comic-controls{padding-left:92px}.comic-language-trigger{min-width:100px;min-height:44px;padding:0 11px;font-size:12px}.comic-language-menu{width:164px}}
@media(prefers-reduced-motion:reduce){.comic-language-trigger,.comic-language-trigger svg,.comic-language-menu,.comic-language-option{transition:none}}

/* Align the sticky fullscreen control with the sticky language picker. */
.comic-controls [data-fullscreen]{position:fixed;top:max(12px,env(safe-area-inset-top));right:max(16px,env(safe-area-inset-right));z-index:26;display:grid;place-items:center;width:44px;height:44px;padding:0}
.comic-controls::after{content:"";flex:0 0 44px;height:44px}
@media(max-width:600px){.comic-controls [data-fullscreen]{top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));width:44px;height:44px}.comic-controls::after{flex-basis:36px;width:36px;height:36px}}

@media(max-width:600px){
  .comic-language-menu{right:-30px;width:132px;padding:5px;border-radius:14px}
  .comic-language-option{min-height:44px;padding:0 10px;font-size:13px}
}