/* Portable manga surface from the established local reader; no application UI. */
*{box-sizing:border-box}
.generated-page-layout:has(.panel-manga-page) {width:min(100%,900px); padding:22px; background:#fff;}
.panel-manga-page {
  display:grid; grid-template-columns: repeat(2,minmax(0,1fr));
  gap:12px; direction:rtl; align-items:start; width:100%;
}
.panel-manga-page .manga-panel {background:#fff;min-width:0;overflow:visible;border:3px solid #141414;}
.panel-manga-page.panel-count-3 .manga-panel:first-child,
.panel-manga-page.panel-count-4 .manga-panel:first-child {grid-column:1 / -1;}
.panel-manga-page.panel-count-4 .manga-panel:last-child {grid-column:1 / -1;}
.panel-manga-page .panel-scene {position:relative; background:#fff; width:100%;}
.panel-manga-page .panel-art {display:block; width:100%; height:auto; object-fit:contain; aspect-ratio:auto;}
.panel-manga-page .panel-placeholder {min-height:210px;background:repeating-linear-gradient(45deg,#f7f7f7,#f7f7f7 9px,#fafafa 9px,#fafafa 18px);display:grid;place-items:center;color:#969696;font-size:12px;text-align:center;padding:15px;}
.panel-manga-page .panel-dialogue {position:absolute;inset:0;pointer-events:none;direction:ltr;}
.panel-manga-page .panel-bubble {
  position:absolute; z-index:3; top:3%; width:min(69%,295px);padding:16px 17px;
  min-width:0;border:2px solid #161616;background:rgba(255,255,255,.98);
  border-radius:52% 48% 47% 53% / 48% 52% 52% 48%;
  display:flex;justify-content:center;align-items:center;pointer-events:auto;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.12));
}
.panel-manga-page .panel-bubble.bubble-left {left:3%;right:auto;}
.panel-manga-page .panel-bubble.bubble-right {right:3%;left:auto;}
.panel-manga-page .panel-bubble.bubble-center {right:50%;left:auto;transform:translateX(50%);}
.panel-manga-page .panel-bubble.line-2 {top:auto;bottom:3%;}
.panel-manga-page .panel-bubble.line-3 {top:51%;left:3%;right:auto;transform:none;}
/* A white diamond projects from the bottom of the bubble as a speech tail. */
.panel-manga-page .panel-bubble:not(.kind-narration):not(.bubble-center)::after {
  content:"";position:absolute;bottom:-10px;width:15px;height:15px;
  background:#fff;border-right:2px solid #161616;border-bottom:2px solid #161616;
  transform:rotate(45deg);
}
.panel-manga-page .panel-bubble.bubble-left::after {left:27%;}
.panel-manga-page .panel-bubble.bubble-right::after {right:27%;}
.panel-manga-page .panel-bubble.kind-narration {border-radius:3px;background:#fffef6;box-shadow:0 2px 0 #3332;}
.panel-manga-page .panel-bubble.kind-thought {border-style:dotted;border-width:3px;}
.panel-manga-page .panel-bubble .ocr-text {font-family:"Yu Gothic","Noto Sans CJK JP",Meiryo,sans-serif;color:#111;font-size:clamp(14px,1.42vw,20px);line-height:1.58;text-align:center;white-space:pre-wrap;overflow-wrap:anywhere;user-select:text;}
.panel-manga-page .panel-bubble ruby {ruby-position:over;white-space:nowrap;}
.panel-manga-page .panel-bubble rt {font-size:.48em;user-select:none;}
.panel-manga-page .panel-bubble:focus-within,.panel-manga-page .panel-bubble:hover {border-color:#9d7c44;}
/* If there's no image, present bubbles in readable flow rather than floating
   against an arbitrary placeholder height. */
.panel-manga-page .without-art .panel-dialogue {position:relative;display:flex;flex-direction:column;gap:10px;padding:8px;}
.panel-manga-page .without-art .panel-bubble {position:relative;top:auto;bottom:auto;left:auto;right:auto;transform:none;width:100%;min-height:64px;}
.panel-manga-page .without-art .panel-bubble::after {display:none;}
@media(max-width:760px){
 .generated-page-layout:has(.panel-manga-page){padding:8px;}
 .panel-manga-page {gap:7px;}
 .panel-manga-page .manga-panel {border-width:2px;}
 .panel-manga-page .panel-dialogue {position:relative;display:flex;flex-direction:column;gap:9px;padding:10px 7px;}
 .panel-manga-page .panel-bubble {position:relative;top:auto;bottom:auto;left:auto!important;right:auto!important;transform:none!important;width:100%;max-width:none;min-height:55px;padding:10px 12px;}
 .panel-manga-page .panel-bubble::after {display:none;}
 .panel-manga-page .panel-bubble .ocr-text {font-size:clamp(13px,2.65vw,19px);}
}
@media(max-width:460px){ .panel-manga-page{grid-template-columns:1fr;} .panel-manga-page .manga-panel{grid-column:1 / -1 !important;} }
/* Per-panel overflow fallback for especially long dialogue. */
.panel-manga-page .panel-scene.bubbles-flow .panel-dialogue {
 position:relative; inset:auto; display:flex; flex-direction:column;
 gap:10px; padding:12px; pointer-events:auto;
}
.panel-manga-page .panel-scene.bubbles-flow .panel-bubble {
 position:relative; inset:auto!important; transform:none!important;
 max-width:none; width:100%; min-height:68px;
}
.panel-manga-page .panel-scene.bubbles-flow .panel-bubble::after {display:none;}
/* Horizontal live text, organic silhouettes and small pointed speech tails. */
.panel-manga-page .panel-bubble {
  width: min(76%, 300px); padding: 20px 25px;
  border-radius: 49% 51% 46% 54% / 47% 46% 54% 53%;
  background: #fff; color: #111; filter: none;
}
.panel-manga-page .panel-bubble:nth-child(even) {
  border-radius: 53% 47% 52% 48% / 49% 54% 46% 51%;
}
.panel-manga-page .panel-bubble.is-tall,
.panel-manga-page .panel-bubble.is-long,
.generated-page-layout .manga-bubble.is-long {
  border-radius: 38px 44px 36px 42px / 30px 36px 28px 32px;
}
.panel-manga-page .panel-bubble .ocr-text {writing-mode: horizontal-tb; line-height: 1.85; min-width: 0; width: 100%;}
.panel-manga-page .panel-bubble ruby {white-space: normal; overflow-wrap: anywhere;}
.panel-manga-page .panel-bubble rt {pointer-events: none;}
.panel-manga-page .panel-bubble.bubble-left {left: 14px; right: auto; transform: none;}
.panel-manga-page .panel-bubble.bubble-right {right: 14px; left: auto; transform: none;}
.panel-manga-page .panel-bubble.kind-speech:not(.bubble-center)::before,
.panel-manga-page .panel-bubble.kind-speech:not(.bubble-center)::after {
  content: ""; position: absolute; width: 22px; height: 18px; bottom: -17px;
  left: 26%; right: auto; background: #161616; border: 0; transform: none;
  clip-path: polygon(0 0, 100% 0, 25% 100%);
}
.panel-manga-page .panel-bubble.kind-speech:not(.bubble-center)::after {
  width: 16px; height: 14px; bottom: -12px; margin-left: 3px; background: #fff;
}
.panel-manga-page .panel-bubble.kind-speech.bubble-right::before,
.panel-manga-page .panel-bubble.kind-speech.bubble-right::after {left: auto; right: 26%; scale: -1 1;}
.panel-manga-page .panel-bubble.kind-thought::after {display: none;}
.panel-manga-page .panel-bubble.kind-narration {
  border-radius: 2px; background: #fff; padding: 12px 16px; box-shadow: 2px 2px 0 #1112;
}
.panel-manga-page .kind-narration .ocr-text {text-align: left; font-size: .95em;}
.panel-manga-page .panel-actions {direction: ltr; padding: 7px; background: #fff; text-align: right; color-scheme: light;}
.panel-manga-page .without-art .panel-dialogue,
.panel-manga-page .panel-scene.bubbles-flow .panel-dialogue {gap: 16px; padding: 16px;}
.panel-manga-page .without-art .panel-bubble,
.panel-manga-page .panel-scene.bubbles-flow .panel-bubble {width: 92%; padding: 20px 25px; align-self: center;}
.panel-manga-page .without-art .bubble-left,
.panel-manga-page .panel-scene.bubbles-flow .bubble-left {align-self: flex-start;}
.panel-manga-page .without-art .bubble-right,
.panel-manga-page .panel-scene.bubbles-flow .bubble-right {align-self: flex-end;}
.panel-manga-page .without-art .panel-bubble::before,
.panel-manga-page .panel-scene.bubbles-flow .panel-bubble::before {display: none;}
@media(max-width: 760px) {
  .panel-manga-page .panel-dialogue {gap: 16px; padding: 16px 10px;}
  .panel-manga-page .panel-bubble {width: 96%; padding: 18px 22px; align-self: center;}
  .panel-manga-page .bubble-left {align-self: flex-start;}
  .panel-manga-page .bubble-right {align-self: flex-end;}
  .panel-manga-page .panel-bubble::before {display: none!important;}
}
/* Overrides on the shared manga styles; no generation controls are shipped. */
:root{color-scheme:dark;--desk:#080d17;--surface:#152030;--ink:#e5edf8;--line:#46546b;--control:#243246;--muted:#a5b4c9;font-family:"Segoe UI",Arial,sans-serif}
:root[data-theme=light]{color-scheme:light;--desk:#f4f4ef;--surface:#fff;--ink:#17202a;--line:#777;--control:#eee;--muted:#454b54}
body{background:var(--desk);color:var(--ink);margin:0}button,input,select{font:inherit}button,a,select{touch-action:manipulation}button{min-height:44px;color:var(--ink);background:var(--control);border:1px solid var(--line);border-radius:5px;padding:9px 14px}a{color:inherit}label{display:block;margin:18px 0 8px}input[type=search],select{color:var(--ink);background:var(--control);border:1px solid var(--line);padding:11px;width:100%;border-radius:4px;max-width:100%}input[type=checkbox]{accent-color:#7893bc}
[hidden]{display:none!important}#libraryHeader{display:flex;justify-content:space-between;align-items:center;padding:15px max(18px,4vw);background:var(--surface);border-bottom:1px solid var(--line)}.brand{font-size:20px;font-weight:700;text-decoration:none}#library{max-width:1300px;padding:25px;margin:auto}h1{font-size:28px}.shelf-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:28px;margin-top:25px}.book-open{border:0;background:none;padding:0;text-align:left;min-width:0}.book-cover{position:relative;aspect-ratio:2/3;background:#fff;overflow:hidden;display:grid;place-items:center}.book-cover img{width:100%;height:100%;object-fit:cover}.cover-title{position:absolute;left:0;right:0;bottom:0;background:#080d17df;color:white;padding:14px;font-size:19px;font-weight:650;overflow-wrap:anywhere}.book-title{display:block;line-height:1.5;margin-top:10px;font-weight:600}.book-progress,.snapshot-note,#shelfSummary{font-size:13px;color:var(--muted);line-height:1.7}
body.is-reading #reader{min-height:100dvh;width:100%;overflow:auto}#pageStage{position:relative;margin:auto;flex:none}#paper{position:absolute;left:0;top:0;width:var(--natural-width,700px);transform:scale(var(--scale,1));transform-origin:top left;border:0;margin:0;box-shadow:none;background:#fff;padding:0;min-height:0}#paper::before{display:none}.ocr-text{font-size:22px!important;writing-mode:horizontal-tb!important;color:#111!important;user-select:text!important;cursor:text}.panel-bubble{background:#fff!important;color:#111!important}.legacy-art{display:block;width:100%;height:auto}.legacy-lines{padding:20px;display:flex;flex-direction:column;gap:18px}.legacy-lines .panel-bubble{position:relative!important;width:auto!important;max-width:100%;margin:12px 0}
#hud{position:fixed;inset:0;pointer-events:none;color:var(--ink);z-index:10}#counter{position:absolute;top:12px;left:12px;background:var(--surface);padding:6px 9px;border-radius:4px;font-size:14px}#cog{pointer-events:auto;position:absolute;right:8px;top:6px;font-size:21px}.hud-hidden #hud{visibility:hidden}#backdrop{position:fixed;inset:0;background:#0008;z-index:20}#settings{position:fixed;right:0;top:0;bottom:0;width:min(390px,100vw);background:var(--surface);padding:20px 24px;overflow:auto;border-left:1px solid var(--line);z-index:21}#settings button{margin-bottom:8px}#settings p{font-size:13px;line-height:1.7;color:var(--muted)}.drawer-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}#status{max-width:700px;margin:20px auto;padding:0 16px;overflow-wrap:anywhere}body.is-reading #status:empty{display:none}.image-missing{min-height:180px;display:grid;place-items:center;color:#333;background:#fff;border:1px solid #444;padding:20px}
@media(max-width:600px){#library{padding:18px}.shelf-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 14px}.cover-title{font-size:16px;padding:10px}.book-title{font-size:14px}#paper .ocr-text{font-size:23px!important}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}