/* ==========================================================================
   ALEXPHAN READ DESKTOP — SINGLE SURFACE AUTHORITY
   This file owns READ base chrome + Desktop READ only.
   It does NOT own tablet/mobile structural layout and does NOT own FLIP.
   Template Engine supplies geometry tokens.
   ========================================================================== */
/* ==========================================================================
   ALEXPHAN READER 5.29 — INDEPENDENT MAIN-PAGE SHELL AUTHORITY
   Each READ page is an independent paper/card with border, shadow and inner breathing room.
   T1 geometry tokens still come from Plugin Template Engine; inner ART/TXT tracks scale
   proportionally to the inset page body. FLIP remains independent.
   ========================================================================== */
:root{
  --ap-paper:#eef0ee;
  --ap-text-paper:#fbfdf7;
  --ap-ink:#172033;
  --ap-line:#cbd5e1;
  --ap-blue:#2563eb;
  --ap-blue-soft:#eff6ff;
  --ap-navy:#0b1d33;
}
*{box-sizing:border-box}
html,body{margin:0;max-width:100%;overflow-x:clip}
body.ap-reader-page{min-height:100vh;background:#eef4fb;color:var(--ap-ink);font-family:Inter,"Segoe UI",Arial,sans-serif}
[hidden]{display:none!important}
a{color:inherit;text-decoration:none}
button,select{font:inherit}

/* HEADER — HOME PAGE MASTER VISUAL AUTHORITY, centered on the same 1250 Reader axis. */
.ap-header.ap-game-header{
  position:sticky;top:0;z-index:80;isolation:isolate;overflow:visible;
  background:#050b14;color:#e2e8f0;border-bottom:2px solid #00e7f5;
  box-shadow:0 6px 18px rgba(3,10,22,.18),0 1px 0 rgba(0,240,255,.12) inset;
}
.ap-header.ap-game-header:before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(rgba(0,240,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(0,240,255,.035) 1px,transparent 1px);
  background-size:32px 32px;opacity:.75;
}
.ap-header .ap-shell,.ap-header-top.ap-game-header-inner{width:min(var(--ap-shell,1250px),calc(100% - 20px))!important;max-width:var(--ap-shell,1250px)!important;margin-left:auto!important;margin-right:auto!important;padding-left:0!important;padding-right:0!important}
.ap-header-top{height:58px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.ap-game-brand-zone,.ap-game-user-zone,.ap-main-nav,.ap-header-actions{display:flex;align-items:center;gap:9px;min-width:0}
.ap-game-brand-zone{flex:0 1 auto}.ap-game-user-zone{justify-content:flex-end;flex:0 1 auto}
.ap-brand{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;font-family:Orbitron,"Segoe UI",Arial,sans-serif;font-size:20px;font-weight:900;letter-spacing:1.05px;color:#fff;text-shadow:0 0 12px rgba(0,240,255,.34)}
.ap-brand-bolt{margin-right:1px;font-size:19px;filter:drop-shadow(0 0 5px rgba(255,170,0,.35))}.ap-brand-alex{color:#fff}.ap-brand-phan{color:#22e6f4}
.ap-game-nav .ap-top-link,.ap-game-book-toggle,.ap-account-btn,.ap-login-link,.ap-inline-toggle{
  height:34px;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:0 11px;
  border:1.5px solid rgba(0,231,245,.62);border-radius:6px;background:rgba(5,11,20,.58);color:#dffaff;
  box-shadow:0 0 10px rgba(0,240,255,.07),inset 0 1px 0 rgba(255,255,255,.03);
  font-family:Orbitron,"Segoe UI",Arial,sans-serif;font-size:9px;font-weight:800;letter-spacing:.35px;cursor:pointer;
  transition:background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease;
}
.ap-game-nav .ap-top-link:hover,.ap-game-book-toggle:hover,.ap-account-btn:hover,.ap-login-link:hover{transform:translateY(-1px);border-color:#00f0ff;color:#fff;background:rgba(0,240,255,.10);box-shadow:0 0 15px rgba(0,240,255,.23)}
.ap-game-nav .is-active,.ap-game-book-toggle.is-active{border-color:#00f0ff;color:#00f0ff;background:rgba(0,240,255,.065);box-shadow:0 0 13px rgba(0,240,255,.19)}
.ap-book-nav{position:relative}.ap-book-nav-menu{position:absolute;top:40px;left:0;z-index:100;width:280px;padding:7px;border:1px solid rgba(0,240,255,.62);border-radius:8px;background:#07111e;box-shadow:0 18px 42px rgba(0,0,0,.42),0 0 20px rgba(0,240,255,.12)}.ap-book-nav-option{display:flex;gap:8px;padding:8px;border-radius:6px;color:#dbeafe}.ap-book-nav-option:hover,.ap-book-nav-option.is-current{background:#0b3150}.ap-book-nav-option small{display:block;opacity:.7}
.ap-game-progress-zone{display:flex;align-items:center;gap:7px;min-width:0}.ap-game-level-badge,.ap-game-rank-badge{height:30px;display:flex;align-items:center;padding:0 10px;border:1px solid rgba(0,240,255,.55);border-radius:999px;background:rgba(0,240,255,.045);color:#6ff5ff;font-family:Orbitron,"Segoe UI",Arial,sans-serif;font-size:8px;font-weight:800;letter-spacing:.15px;white-space:nowrap}.ap-game-level-badge{border-color:rgba(255,170,0,.58);color:#ffc44d;background:rgba(255,170,0,.055)}.ap-game-xp{width:88px;height:5px;border:1px solid #14536d;border-radius:99px;overflow:hidden;background:#071827}.ap-game-xp i{display:block;height:100%;background:linear-gradient(90deg,#00b9d6,#00f0ff);box-shadow:0 0 8px rgba(0,240,255,.72)}
.ap-inline-toggle{border-color:#7447da!important;color:#c9a6ff!important;background:rgba(80,35,140,.10)!important}.ap-inline-toggle:hover{border-color:#a875ff!important;color:#f2e7ff!important;box-shadow:0 0 16px rgba(157,0,255,.24)!important;transform:translateY(-1px)}
.ap-account-btn,.ap-login-link{border-color:rgba(0,231,245,.38)!important;color:#e7f8ff!important}.ap-game-account{display:flex;align-items:center;gap:7px;min-width:0}
.ap-mobile-menu-btn,.ap-mobile-panel{display:none}

/* READ ROOT + TOOLBAR */
.ap-reader-shell{width:min(var(--ap-shell,100%),100%);max-width:var(--ap-shell,100%);margin:0 auto;padding:8px 0 18px;--ap-reader-user-scale:1}
.ap-reader-toolbar{position:sticky;top:58px;z-index:60;width:100%;min-height:42px;display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 10px;padding:5px 8px;border:1px solid var(--ap-line);border-radius:0 0 10px 10px;background:rgba(255,255,255,.97);box-shadow:0 3px 10px rgba(15,23,42,.08)}
.ap-reader-toolbar-primary,.ap-reader-toolbar-actions,.ap-reader-jump-controls,.ap-reader-tools,.ap-reader-segment{display:flex;align-items:center;gap:5px;min-width:0}.ap-reader-toolbar-primary{flex:1}.ap-reader-toolbar-actions{justify-content:flex-end}
.ap-reader-progress-meta{display:flex;gap:5px;font-size:12px;font-weight:900;white-space:nowrap}.ap-reader-progress-track{width:150px;height:4px;border-radius:99px;overflow:hidden;background:#dbe4ef}.ap-reader-progress-bar{height:100%;background:#2563eb}.ap-reader-chapter-chip{display:flex;gap:5px;font-size:12px;white-space:nowrap}.ap-reader-jump-controls label{height:27px;display:flex;align-items:center;gap:2px;padding:0 4px 0 6px;border:1px solid var(--ap-line);border-radius:7px;background:#fff;color:#64748b;font-size:12px;font-weight:900}.ap-reader-jump-controls select{height:23px;max-width:72px;border:0;background:transparent;color:#334155;font-size:12px;font-weight:900}
.ap-reader-segment button,.ap-icon-btn{height:27px;min-width:28px;padding:0 7px;border:1px solid var(--ap-line);border-radius:7px;background:#fff;color:#475569;font-size:12px;font-weight:950;cursor:pointer}.ap-reader-segment button.is-active,.ap-reader-segment button[aria-selected="true"]{background:#2563eb;border-color:#2563eb;color:#fff}.ap-icon-btn:hover,.ap-reader-segment button:hover{border-color:#60a5fa;color:#1d4ed8}
.ap-reader-language-segment{display:flex;align-items:center;flex:0 0 auto}.ap-reader-language-select-wrap{display:flex;align-items:center}.ap-reader-language-select{height:27px;min-width:72px;padding:0 26px 0 9px;border:1px solid var(--ap-line);border-radius:7px;background:#fff;color:#334155;font-size:12px;font-weight:950;cursor:pointer}.ap-reader-language-select:focus{outline:2px solid rgba(37,99,235,.22);outline-offset:1px;border-color:#60a5fa}.ap-reader-lang-compat{display:none!important}


/* Persistent LEFT/spacer are retired on every READ surface. */
.ap-reader-breathing-space,.ap-reader-library{display:none!important}

/* Desktop RIGHT is always sticky on the Desktop READ surface.
   Short viewports scroll only the chapter list inside the rail. */
@media (min-width:1260px){
  /* 5.17 sticky hardening: every ancestor on the Desktop READ axis stays overflow-visible.
     The RIGHT rail itself sticks; only its chapter section becomes the short-viewport scroller. */
  .ap-reader-shell,.ap-reader-read-view,.ap-reader-read-layout{overflow:visible!important}
  .ap-reader-sidebar{position:-webkit-sticky!important;position:sticky!important;top:110px!important;align-self:start!important;height:max-content!important;max-height:calc(100vh - 122px)!important;overflow:visible!important;overscroll-behavior:contain!important;z-index:24!important}
  .ap-reader-sidebar .ap-reader-side-panel{display:flex!important;flex-direction:column!important;max-height:calc(100vh - 122px)!important;overflow:hidden!important}
  .ap-reader-sidebar .ap-reader-side-sticky{flex:0 0 auto!important}
  .ap-reader-sidebar .ap-reader-side-chapters{flex:1 1 auto!important;min-height:0!important;overflow:auto!important;overscroll-behavior:contain!important;scrollbar-width:thin}
}

/* CENTER page shell. */
.ap-reader-shell[data-reader-view="read"] .ap-reader-main-column{position:relative;display:grid;grid-template-rows:minmax(0,1fr) auto;min-height:0;overflow:hidden;border-radius:10px;background:linear-gradient(180deg,#e8eef5 0%,#dce6ef 100%);box-shadow:inset 0 0 0 1px rgba(71,85,105,.38),0 8px 20px rgba(15,23,42,.11)}
.ap-reader-continuous-stack{display:flex;flex-direction:column;align-items:stretch;gap:24px;width:100%;min-height:0;padding:14px 10px 28px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scroll-behavior:smooth;scrollbar-width:auto;scrollbar-color:#38bdf8 rgba(219,234,254,.72)}
.ap-reader-continuous-stack::-webkit-scrollbar{width:12px}
.ap-reader-continuous-stack::-webkit-scrollbar-track{background:linear-gradient(180deg,rgba(239,246,255,.96),rgba(219,234,254,.72));border-radius:999px;box-shadow:inset 0 0 6px rgba(14,165,233,.18)}
.ap-reader-continuous-stack::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#67e8f9 0%,#38bdf8 42%,#2563eb 100%);border:2px solid rgba(239,246,255,.94);border-radius:999px;box-shadow:0 0 7px rgba(14,165,233,.68),0 1px 3px rgba(37,99,235,.44),inset 0 0 3px rgba(255,255,255,.82)}
.ap-reader-continuous-stack::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#a5f3fc 0%,#22d3ee 38%,#2563eb 100%);box-shadow:0 0 10px rgba(6,182,212,.82),0 2px 5px rgba(37,99,235,.52),inset 0 0 4px rgba(255,255,255,.92)}
.ap-reader-card.ap-reader-continuous-page{flex:0 0 auto;width:100%;max-width:100%;margin:0;padding:0;border:1px solid #9aa9b8;border-radius:14px;background:#fbfaf6;box-shadow:0 12px 28px rgba(15,23,42,.18),0 2px 6px rgba(15,23,42,.10);scroll-margin-top:10px;overflow:hidden}
.ap-reader-card.is-current{border-color:#7e9fc2;box-shadow:0 0 0 2px rgba(37,99,235,.14),0 14px 32px rgba(15,23,42,.20),0 3px 7px rgba(15,23,42,.10)}
.ap-reader-page-headbar{height:32px;display:flex;align-items:center;justify-content:space-between;margin:14px 14px 0!important;padding:0 9px;border-radius:8px 8px 3px 3px;background:#0c263b;color:#fff;box-shadow:0 2px 5px rgba(15,23,42,.15)}.ap-reader-page-head-context{display:flex;align-items:center;gap:6px;min-width:0;font-size:10px}.ap-reader-page-head-context>b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px;line-height:1.1}.ap-reader-page-head-number{display:flex;align-items:baseline;gap:2px;font-size:7px}.ap-reader-page-head-number strong{font-size:20px}.ap-reader-page-head-number small{font-size:9px}
.ap-reader-read-view .ap-reader-content{width:100%;max-width:100%;margin:0;padding:10px 14px 8px;background:transparent!important;overflow:visible}
.ap-reader-page-headbar + .ap-reader-content{margin-top:0!important;padding-top:10px!important}.ap-reader-page-headbar + .ap-reader-content>.ap-story-canvas{margin-top:0!important}
.ap-reader-page-footer-marker{display:flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;min-height:30px!important;padding:2px 0 9px!important;background:#fbfaf6!important;border-top:0!important;border-radius:0 0 13px 13px!important;color:#354255!important;font:900 12px/1 Inter,system-ui,sans-serif!important;letter-spacing:.02em!important}.ap-reader-page-footer-marker span,.ap-reader-page-footer-marker strong{display:inline-block!important}.ap-reader-page-footer-marker span{opacity:.92!important}

/* T1 CURRENT — Template Engine owns geometry; Theme owns only structural rendering. */
.ap-reader-read-view .ap-story-canvas.ap-t1-family,
.ap-reader-read-view .ap-story-canvas.ap-six-layout{
  display:flex!important;
  flex-direction:column!important;
  gap:var(--ap-row-gap)!important;
  width:100%!important;
  max-width:100%!important;
  height:var(--ap-page-body)!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  background-color:#f4efdf!important;
  background-image:
    repeating-linear-gradient(28deg,rgba(55,65,81,.055) 0 1px,transparent 1px 16px),
    repeating-linear-gradient(152deg,rgba(55,65,81,.035) 0 1px,transparent 1px 22px)!important;
}

/* One real connected row per semantic IT pair. This DOM contract mirrors Studio. */
.ap-reader-read-view .ap-story-canvas.ap-t1-family>.ap-template-row{
  position:relative!important;
  display:grid!important;
  flex:0 0 var(--ap-row)!important;
  height:var(--ap-row)!important;
  min-width:0!important;
  min-height:0!important;
  gap:var(--ap-pair-gap)!important;
  overflow:hidden!important;
  background:#111!important;
  border:0!important;
  border-radius:3px!important;
  box-shadow:none!important;
  filter:none!important;
}
.ap-reader-read-view .ap-story-canvas.ap-t1-family[data-panel-border="grunge"]>.ap-template-row::after{content:""!important;display:block!important;position:absolute!important;inset:1px!important;z-index:40!important;pointer-events:none!important;border:var(--ap-panel-border-width,1.4px) solid #070d18!important;border-radius:inherit!important;box-shadow:var(--ap-panel-shadow-strength,1px) var(--ap-panel-shadow-strength,1px) 0 rgba(7,13,24,.45)!important;filter:url("grunge-border-filter.svg#grunge-thin")!important}
.ap-reader-read-view .ap-story-canvas.ap-t1-family[data-panel-border="thin_shadow"]>.ap-template-row{border:var(--ap-panel-border-width,1px) solid #111827!important;box-shadow:var(--ap-panel-shadow-strength,1px) var(--ap-panel-shadow-strength,1px) 0 rgba(15,23,42,.18)!important}
.ap-reader-read-view .ap-story-canvas.ap-t1-family[data-panel-border="none"]>.ap-template-row{border:0!important;box-shadow:none!important}
.ap-reader-read-view .ap-story-canvas.ap-t1-family>.ap-template-row[data-pair-order="art-text"]{grid-template-columns:minmax(0,var(--ap-art-track)) minmax(0,var(--ap-text-track))!important}
.ap-reader-read-view .ap-story-canvas.ap-t1-family>.ap-template-row[data-pair-order="text-art"]{grid-template-columns:minmax(0,var(--ap-text-track)) minmax(0,var(--ap-art-track))!important}

/* 5.10: internal ART↔TXT divider uses the same thin jagged/grunge language as the row frame. */
.ap-reader-read-view .ap-story-canvas.ap-t1-family>.ap-template-row::before{content:none!important;display:none!important}
.ap-reader-read-view .ap-story-canvas.ap-t1-family>.ap-template-row>.ap-six-zone{
  position:relative!important;
  inset:auto!important;
  width:auto!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  overflow:hidden!important;
  align-self:stretch!important;
  justify-self:stretch!important;
  clip-path:none!important;
  border:0!important;
  box-shadow:none!important;
  filter:none!important;
}
.ap-reader-read-view .ap-it-pair-frame{display:none!important}
.ap-reader-read-view .ap-six-art{padding:0!important;background:#071827!important}
.ap-reader-read-view .ap-six-art>.ap-comic-image-box,.ap-reader-read-view .ap-six-art .ap-story-art{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;margin:0!important;padding:0!important;overflow:hidden!important}
.ap-reader-read-view .ap-six-art .ap-story-art img{display:block!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important;object-position:var(--ap-art-object-position,50% 50%)!important}
.ap-reader-read-view .ap-six-text{background:var(--ap-text-paper)!important;border:0!important;box-shadow:none!important}
.ap-reader-read-view .ap-six-text>.ap-six-text-content{width:100%!important;height:100%!important;margin:0!important;padding:var(--ap-text-inner-padding,10px)!important;overflow-x:hidden!important;overflow-y:hidden!important;overscroll-behavior:auto!important;scrollbar-width:thin!important;scrollbar-color:rgba(71,85,105,.48) transparent!important;background:rgba(251,253,247,.98)!important;color:#152015!important;font-family:var(--ap-reader-font-family,"Segoe UI",Arial,sans-serif)!important;font-size:calc(var(--ap-reader-base-font-size,18px) * var(--ap-reader-user-scale,1))!important;line-height:var(--ap-reader-line-height,1.30)!important}
.ap-reader-read-view .ap-story-block{position:relative;margin:0 0 .22em}.ap-reader-read-view .ap-story-text{font:inherit!important;color:inherit!important}.ap-reader-read-view [data-story-lang]{display:none!important}.ap-reader-read-view [data-story-lang].is-reader-language{display:block!important}.ap-reader-read-view [data-story-lang].is-local-translation{display:block!important;margin-top:.35em!important;padding-top:.35em!important;border-top:1px dashed #a8b7a0!important;color:#155e75!important;font-size:.94em!important;font-style:italic!important}
.ap-reader-read-view .ap-story-canvas.ap-t1-family .ap-six-zone::before,
.ap-reader-read-view .ap-story-canvas.ap-t1-family .ap-six-zone::after{content:none!important;display:none!important}
.ap-reader-read-view .ap-story-canvas.ap-t1-family>.ap-template-row[data-pair-order="art-text"]>.ap-six-art::after,
.ap-reader-read-view .ap-story-canvas.ap-t1-family>.ap-template-row[data-pair-order="text-art"]>.ap-six-text::after{
  content:""!important;display:block!important;position:absolute!important;top:1px!important;right:0!important;bottom:1px!important;width:1.5px!important;z-index:41!important;pointer-events:none!important;background:#070d18!important;filter:url("grunge-border-filter.svg#grunge-thin")!important
}
.ap-local-lang-toggle{position:absolute;right:4px;top:4px;width:20px;height:20px;display:grid;place-items:center;padding:0;border:1px solid #b9c8b0;border-radius:50%;background:#fff;color:#3f6212;font-size:9px;line-height:1;cursor:pointer;z-index:2}.ap-local-lang-toggle:hover{border-color:#65a30d;background:#f7fee7}

/* RIGHT: current state + 10-page window + chapter list. */
.ap-reader-side-panel{display:flex;flex-direction:column;padding:10px;max-height:none;min-height:0;border:1px solid #d6e0eb;border-radius:10px;background:#fff;box-shadow:0 5px 16px rgba(51,65,85,.08);overflow:hidden}.ap-reader-side-sticky{flex:0 0 auto;position:relative;z-index:2;background:#fff}.ap-reader-side-chapters{min-height:0}.ap-reader-side-section+.ap-reader-side-section{margin-top:8px;padding-top:8px;border-top:1px solid #e5eaf0}.ap-reader-side-kicker{font-size:8px;font-weight:950;color:#7c3aed}.ap-reader-side-book{font-size:8px;color:#94a3b8}.ap-reader-side-current h2{margin:2px 0;font-size:16px;color:#312e81}.ap-reader-side-title-en,.ap-reader-side-title-vi{margin:2px 0;font-size:9px}.ap-reader-side-title-vi{color:#64748b;font-style:italic}.ap-reader-side-progress-label{display:flex;justify-content:space-between;font-size:8px;color:#64748b}.ap-reader-side-progress{height:4px;margin-top:4px;border-radius:99px;background:#e9eef5;overflow:hidden}.ap-reader-side-progress span{display:block;height:100%;background:#2563eb}
.ap-reader-global-pages{margin-top:8px;padding-top:8px;border-top:1px solid #e5eaf0}.ap-reader-global-pages-head{display:flex;justify-content:space-between;margin-bottom:5px;font-size:8px;font-weight:900;color:#64748b}.ap-reader-global-pages-window{display:grid;grid-template-columns:22px 1fr 22px;gap:5px;align-items:stretch}.ap-reader-global-page-shift{border:1px solid #dbe5f0;border-radius:5px;background:#fff;color:#1d4ed8;font-weight:950;cursor:pointer}.ap-reader-global-page-shift:disabled{opacity:.25;cursor:default}.ap-reader-global-pages-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}.ap-reader-global-page-slot{min-width:0;height:26px;padding:0;border:1px solid #dbe5f0;border-radius:5px;background:#f8fafc;color:#475569;font-size:8px;font-weight:950;cursor:pointer}.ap-reader-global-page-slot.is-current{background:#2563eb;border-color:#2563eb;color:#fff}.ap-reader-global-page-slot[hidden]{display:none!important}
.ap-reader-side-chapters{margin-top:8px;padding-top:8px;border-top:1px solid #e5eaf0}.ap-reader-side-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px;font-size:8px;color:#64748b}.ap-reader-chapter-list{display:grid;gap:4px}.ap-reader-chapter-jump{width:100%;height:auto;min-height:36px;display:grid;grid-template-columns:max-content minmax(0,1fr);align-items:baseline;gap:8px;padding:6px;border:1px solid #e5eaf0;border-radius:6px;background:#fff;color:#334155;text-align:left;cursor:pointer}.ap-reader-chapter-jump.is-current{background:#eff6ff;border-color:#93c5fd;box-shadow:inset 3px 0 #2563eb}.ap-reader-side-ch-num{font-size:8px;font-weight:950;white-space:nowrap;align-self:auto}.ap-reader-side-ch-title{min-width:0;font-size:9px;font-weight:800;overflow-wrap:break-word;word-break:normal}.ap-reader-toc-close,.ap-reader-toc-backdrop{display:none}

/* CONTAINED BOTTOM PAGER — one row, fully inside Reader/CENTER. */
.ap-reader-bottom-pager{position:sticky;left:auto;right:auto;top:auto;bottom:0;transform:none;z-index:30;display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;gap:7px;width:100%;max-width:100%;min-height:52px;margin:0;padding:6px 14px;border:0;border-top:1px solid rgba(96,165,250,.42);border-radius:0 0 10px 10px;background:linear-gradient(180deg,rgba(16,47,73,.99) 0%,rgba(8,27,43,1) 100%);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 -5px 16px rgba(15,23,42,.12);pointer-events:auto}
.ap-reader-bottom-label{flex:0 0 auto;display:inline-flex;align-items:center;height:34px;margin-right:2px;color:#9fdcff;font-size:11px;font-weight:950;letter-spacing:.08em}.ap-reader-bottom-total{flex:0 0 auto;min-width:46px;font-size:13px;font-weight:900;color:#c7dff2;white-space:nowrap}.ap-reader-bottom-slots{flex:0 1 auto;display:inline-flex;align-items:center;gap:6px;min-width:0}
.ap-reader-bottom-slot,.ap-reader-bottom-pager-arrow{flex:0 0 auto;height:34px;min-width:36px;padding:0 9px;border:1px solid rgba(147,197,253,.20);border-radius:999px;background:rgba(255,255,255,.035);color:#e5f3ff;font-size:15px;font-weight:950;line-height:1;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.05);transition:transform .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease}.ap-reader-bottom-slot:hover,.ap-reader-bottom-pager-arrow:hover{transform:translateY(-1px);border-color:rgba(94,234,255,.72);background:rgba(56,189,248,.13);color:#fff}.ap-reader-bottom-slot.is-current{transform:translateY(-1px) scale(1.06);border-color:#f6cf59;background:linear-gradient(180deg,#ffd86a 0%,#f4bd2d 100%);color:#101827;box-shadow:0 4px 12px rgba(245,190,45,.30),inset 0 1px 0 rgba(255,255,255,.62)}.ap-reader-bottom-slot[hidden]{display:none!important}.ap-reader-bottom-pager-arrow{min-width:44px;font-size:27px;color:#8ee8ff}.ap-reader-bottom-pager-arrow:disabled{opacity:.28;cursor:default}
.ap-reader-shell[data-reader-view="flipbook"] .ap-reader-bottom-pager{display:none!important}


/* 5.10 overflow + pager hardening */
.ap-reader-read-view .ap-six-text>.ap-six-text-content::-webkit-scrollbar{width:6px}
.ap-reader-read-view .ap-six-text>.ap-six-text-content::-webkit-scrollbar-track{background:transparent}
.ap-reader-read-view .ap-six-text>.ap-six-text-content::-webkit-scrollbar-thumb{background:rgba(71,85,105,.40);border-radius:999px}


/* DESKTOP READ STRUCTURAL GATE — no responsive exceptions in this file. */
@media (min-width:1260px){
  .ap-reader-read-layout{display:grid!important;grid-template-columns:minmax(0,var(--ap-center,1fr)) var(--ap-right,0px)!important;column-gap:var(--ap-gap,10px)!important;width:var(--ap-shell,100%)!important;max-width:100%!important;margin:0 auto!important;align-items:start!important}
  .ap-reader-main-column{grid-column:1!important;width:var(--ap-center,100%)!important;max-width:100%!important;min-width:0!important;height:calc(100dvh - 128px)!important;min-height:520px!important;max-height:920px!important}
  .ap-reader-continuous-stack{height:100%!important;min-height:0!important}
  .ap-reader-sidebar{grid-column:2!important;display:block!important;width:var(--ap-right,0px)!important;min-width:0!important}
}


/* 5.16 RIGHT UI TYPOGRAPHY — independent from story TXT / A− A+. */
.ap-reader-sidebar,.ap-reader-side-panel{font-family:Inter,"Segoe UI",Arial,sans-serif!important;font-size:14px!important;line-height:1.18!important;--ap-reader-user-scale:1!important;--ap-reader-base-font-size:14px!important}
.ap-reader-side-kicker,.ap-reader-side-book,.ap-reader-side-title-en,.ap-reader-side-title-vi,.ap-reader-side-progress-label,.ap-reader-global-pages-head,.ap-reader-side-heading,.ap-reader-side-ch-num,.ap-reader-side-ch-title{font-size:14px!important;line-height:1.18!important}
.ap-reader-side-current h2{font-size:18px!important;line-height:1.1!important}
.ap-reader-global-page-slot{font-size:14px!important}
.ap-reader-chapter-jump{height:auto!important;min-height:36px!important;grid-template-columns:max-content minmax(0,1fr)!important;gap:8px!important}

/* 5.16 Story TXT authority only: 18px × user view scale, default scale 1.00. */
.ap-reader-read-view .ap-six-text>.ap-six-text-content{font-size:calc(var(--ap-reader-base-font-size,18px) * var(--ap-reader-user-scale,1))!important;line-height:var(--ap-reader-line-height,1.30)!important}


/* 5.18 DESKTOP READ — toolbar 12 / page title 14 / true sticky / chapter baseline. */
@media (min-width:1260px){
  html,body{overflow-x:clip!important}
  body.ap-reader-page{overflow-x:clip!important}
  .ap-reader-shell,.ap-reader-read-view,.ap-reader-read-layout{overflow:visible!important}
  .ap-reader-sidebar{position:-webkit-sticky!important;position:sticky!important;top:110px!important;align-self:start!important}
}
.ap-reader-toolbar .ap-reader-progress-meta,
.ap-reader-toolbar .ap-reader-chapter-chip,
.ap-reader-toolbar .ap-reader-jump-controls label,
.ap-reader-toolbar .ap-reader-jump-controls select,
.ap-reader-toolbar .ap-reader-segment button,
.ap-reader-toolbar .ap-icon-btn{font-size:12px!important}
.ap-reader-page-head-context>b{font-size:14px!important;line-height:1.1!important}
.ap-reader-chapter-jump{align-items:baseline!important}
.ap-reader-side-ch-num{align-self:auto!important}
/* 5.30 BI-LANGUAGE CLICK: click the TXT box itself; no local arrow button. */
body.ap-inline-edit-disabled .ap-six-text-content[data-bi-language-click-ready="1"]{cursor:pointer!important;}
body.ap-edit-mode .ap-six-text-content[data-bi-language-click-ready="1"]{cursor:text!important;}
.ap-local-lang-toggle{display:none!important;}



/* ==========================================================================
   5.53 READER FOOTER — REAL READER CSS AUTHORITY
   HTML: reader.php -> .ap-reader-footer-wrap -> template-parts/site-footer.php
   CSS:  assets/read-desktop.css (this file is actually enqueued on Reader routes)
   The footer is a direct child of .ap-reader-shell, so width:100% follows the same
   live --ap-shell axis as toolbar + READ layout (1250px desktop authority).
   ========================================================================== */
.ap-reader-footer-wrap{
  width:100%;
  max-width:100%;
  margin:14px 0 0;
  padding:0;
  clear:both;
}
.ap-reader-footer-wrap>.ap-site-footer{
  position:relative;
  width:100%;
  max-width:none;
  margin:0;
  padding:38px 44px 39px;
  overflow:hidden;
  border:1px solid rgba(14,165,164,.62);
  border-top:2px solid rgba(6,182,212,.90);
  border-radius:10px;
  background:linear-gradient(135deg,#dff7f2 0%,#dceffd 58%,#e8f7f2 100%);
  color:#17324a;
  box-shadow:0 -5px 18px rgba(6,182,212,.18),0 12px 28px rgba(14,116,144,.16),inset 0 1px 0 rgba(255,255,255,.92);
}
.ap-reader-footer-wrap>.ap-site-footer::before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:3px;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,#22d3ee 16%,#14b8a6 50%,#22d3ee 84%,transparent);
  box-shadow:0 0 16px rgba(34,211,238,.52);
}
.ap-reader-footer-wrap .ap-site-footer-inner{
  width:100%;
  max-width:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  text-align:center;
}
.ap-reader-footer-wrap .ap-site-footer-line{
  color:#17324a;
  font-family:Inter,"Segoe UI",Arial,sans-serif;
  font-size:13px;
  line-height:1.55;
  font-weight:700;
  text-shadow:0 1px 0 rgba(255,255,255,.82);
}
.ap-reader-footer-wrap .ap-site-footer-credit{color:#36566f;font-size:12px}
.ap-reader-footer-wrap .ap-site-footer-sep{color:#0f9fa8;opacity:.82}
.ap-reader-footer-wrap .ap-site-footer a{
  color:#087f9c;
  font-weight:800;
  text-decoration:none;
  text-shadow:0 0 8px rgba(34,211,238,.18);
}
.ap-reader-footer-wrap .ap-site-footer a:hover{
  color:#075985;
  text-decoration:underline;
  text-shadow:0 0 10px rgba(34,211,238,.36);
}


/* ==========================================================================
   5.55 READ RIGHT SIDEBAR — CROPPED NEXT STORIES BANNER
   Static promo lives directly below CHAPTERS inside the READ sidebar.
   ========================================================================== */
.ap-reader-next-stories{
  width:100%;
  margin:10px 0 2px;
  padding:4px;
  overflow:hidden;
  border:1px solid rgba(6,182,212,.78);
  border-radius:9px;
  background:linear-gradient(180deg,#071827 0%,#06121f 100%);
  box-shadow:0 5px 15px rgba(15,23,42,.14),0 0 12px rgba(34,211,238,.14),inset 0 1px 0 rgba(255,255,255,.12);
}
.ap-reader-next-stories img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:52/29;
  object-fit:cover;
  border:0;
  border-radius:6px;
}

/* ========================================================================== 
   5.56 READ PAIR MODE — DESKTOP/TABLET PRESENTATION
   Theme-only presentation. Plugin/JSON remain content authority.
   ========================================================================== */
.ap-reader-language-segment{position:relative}
.ap-reader-pair-menu{display:none;position:absolute;top:calc(100% + 5px);right:0;z-index:95;width:190px;padding:7px;border:1px solid #8ed7e8;border-radius:9px;background:rgba(247,252,255,.985);box-shadow:0 12px 28px rgba(15,23,42,.20),0 0 16px rgba(34,211,238,.14)}
.ap-reader-pair-menu-title{padding:3px 6px 6px;color:#64748b;font:900 10px/1.1 Inter,"Segoe UI",Arial,sans-serif;letter-spacing:.08em}
.ap-reader-pair-menu button{display:grid;width:100%;grid-template-columns:1fr;gap:2px;padding:7px 8px;border:0;border-radius:7px;background:transparent;color:#0f172a;text-align:left;cursor:pointer}
.ap-reader-pair-menu button+button{margin-top:2px}.ap-reader-pair-menu button strong{font:900 12px/1.1 Inter,"Segoe UI",Arial,sans-serif;color:#075985}.ap-reader-pair-menu button span{font:700 10px/1.15 Inter,"Segoe UI",Arial,sans-serif;color:#64748b}.ap-reader-pair-menu button:hover,.ap-reader-pair-menu button.is-active{background:#e5f7fb;box-shadow:inset 3px 0 #06b6d4}
@media (hover:hover) and (pointer:fine) and (min-width:1260px){.ap-reader-language-segment:hover .ap-reader-pair-menu,.ap-reader-language-segment:focus-within .ap-reader-pair-menu{display:block}}

.ap-reader-read-view .ap-template-row>.ap-six-art,.ap-reader-read-view .ap-template-row>.ap-six-text{position:relative!important}
.ap-pair-art-overlay{position:absolute;inset:0;z-index:64;display:grid;grid-template-rows:auto minmax(0,1fr);min-width:0;min-height:0;border:1px solid rgba(8,145,178,.72);background:rgba(247,252,249,.86);backdrop-filter:blur(1px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.52),0 0 14px rgba(6,182,212,.18);overflow:hidden;pointer-events:none;transition:background .16s ease,box-shadow .16s ease}
.ap-pair-art-overlay.is-quick-compare{grid-template-rows:auto minmax(0,1fr) auto;background:rgba(247,252,249,.86);box-shadow:inset 0 0 0 1px rgba(255,255,255,.56),0 7px 20px rgba(15,23,42,.20),0 0 18px rgba(6,182,212,.18)}
.ap-pair-overlay-head{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:30px;padding:5px 7px;border-bottom:1px solid rgba(8,145,178,.34);background:linear-gradient(180deg,rgba(224,248,247,.90),rgba(236,248,255,.84));pointer-events:auto}
.ap-pair-overlay-title{min-width:0;color:#075985;font:900 10px/1.1 Inter,"Segoe UI",Arial,sans-serif;letter-spacing:.045em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ap-pair-art-peek-btn,.ap-pair-quick-close{flex:0 0 auto;height:21px;min-width:34px;padding:0 6px;border:1px solid #67c7d5;border-radius:999px;background:#fff;color:#075985;font:900 9px/1 Inter,"Segoe UI",Arial,sans-serif;cursor:pointer;box-shadow:0 1px 5px rgba(15,23,42,.10)}
.ap-pair-art-peek-btn:hover,.ap-pair-quick-close:hover{background:#cffafe;border-color:#06b6d4}.ap-pair-quick-close{min-width:21px;width:21px;padding:0;font-size:14px}
.ap-pair-overlay-body{min-height:0;padding:10px 12px;color:#111827;font-family:var(--ap-reader-font-family,"Segoe UI",Arial,sans-serif);font-size:18px;line-height:1.30;overflow:hidden;pointer-events:auto;transition:opacity .16s ease;background:rgba(255,255,255,.08);text-shadow:0 1px 0 rgba(255,255,255,.58)}
.ap-pair-overlay-foot{display:flex;align-items:center;justify-content:center;min-height:27px;padding:3px 8px 5px;border-top:1px solid rgba(8,145,178,.22);background:rgba(235,248,247,.70);pointer-events:auto}
.ap-pair-overlay-toggle{min-width:72px;height:21px;padding:0 10px;border:1px solid rgba(8,145,178,.55);border-radius:999px;background:rgba(255,255,255,.90);color:#075985;font:900 9px/1 Inter,"Segoe UI",Arial,sans-serif;letter-spacing:.04em;cursor:pointer;box-shadow:0 2px 7px rgba(15,23,42,.18)}
.ap-pair-overlay-toggle:hover{background:#cffafe;border-color:#06b6d4;box-shadow:0 3px 10px rgba(15,23,42,.24),0 0 10px rgba(6,182,212,.18)}
.ap-pair-art-overlay.is-translation-hidden{background:rgba(247,252,249,.10);backdrop-filter:none;border-color:rgba(8,145,178,.40)}
.ap-pair-art-overlay.is-translation-hidden .ap-pair-overlay-body{opacity:0;pointer-events:none}
.ap-pair-art-overlay.is-translation-hidden .ap-pair-overlay-head,.ap-pair-art-overlay.is-translation-hidden .ap-pair-overlay-foot{background:rgba(236,248,255,.76)}
.ap-pair-copy-block+.ap-pair-copy-block{margin-top:.22em}.ap-pair-copy-text{display:block!important;font:inherit!important;color:inherit!important;white-space:normal}.ap-pair-copy-text br{display:block}
.ap-six-art.is-pair-art-peek .ap-pair-art-overlay{background:rgba(5,20,30,.08);border-color:rgba(34,211,238,.55)}.ap-six-art.is-pair-art-peek .ap-pair-overlay-body{opacity:0}.ap-six-art.is-pair-art-peek .ap-pair-overlay-head{background:rgba(7,24,39,.82);border-bottom-color:rgba(94,234,255,.28)}.ap-six-art.is-pair-art-peek .ap-pair-overlay-title{color:#d8fbff}
.ap-pair-original-badge{position:absolute;right:6px;top:5px;z-index:24;display:inline-flex;align-items:center;min-height:20px;padding:0 6px;border:1px solid rgba(100,116,139,.28);border-radius:999px;background:rgba(255,255,255,.90);color:#475569;font:900 8px/1 Inter,"Segoe UI",Arial,sans-serif;letter-spacing:.05em;pointer-events:none}
.ap-reader-shell[data-reader-pair] .ap-reader-read-view .ap-six-text>.ap-six-text-content{padding-top:max(var(--ap-text-inner-padding,10px),29px)!important}

.ap-quick-compare{position:absolute;right:6px;top:5px;z-index:26;height:23px;padding:0 7px;border:1px solid #4fbfd3;border-radius:999px;background:rgba(255,255,255,.96);color:#075985;font:900 8px/1 Inter,"Segoe UI",Arial,sans-serif;letter-spacing:.035em;cursor:pointer;box-shadow:0 4px 10px rgba(15,23,42,.34),0 0 0 1px rgba(255,255,255,.76),0 0 10px rgba(6,182,212,.16);opacity:0;transform:translateY(-2px);pointer-events:none;transition:opacity .14s ease,transform .14s ease,background .14s ease,box-shadow .14s ease}
body.ap-inline-edit-disabled .ap-reader-read-view .ap-six-text:hover>.ap-quick-compare,body.ap-inline-edit-disabled .ap-reader-read-view .ap-quick-compare:focus{opacity:1;transform:none;pointer-events:auto}.ap-quick-compare:hover{background:#cffafe;border-color:#06b6d4;box-shadow:0 5px 13px rgba(15,23,42,.42),0 0 12px rgba(6,182,212,.28)}


/* 5.59 Pair interaction: Pair mode arms ART but leaves artwork visible by default. */
.ap-reader-shell[data-reader-pair] .ap-reader-read-view .ap-six-art.ap-pair-art-ready{cursor:pointer!important;transition:box-shadow .14s ease,filter .14s ease!important}
@media (hover:hover) and (pointer:fine){.ap-reader-shell[data-reader-pair] .ap-reader-read-view .ap-six-art.ap-pair-art-ready:hover{box-shadow:inset 0 0 0 2px rgba(6,182,212,.68),0 0 12px rgba(6,182,212,.16)!important}}
.ap-reader-shell[data-reader-pair] .ap-reader-read-view .ap-six-art.ap-pair-art-ready:focus-visible{outline:2px solid #06b6d4!important;outline-offset:-2px!important}
.ap-reader-read-view .ap-quick-compare{display:none!important}
.ap-reader-read-view .ap-pair-art-overlay{cursor:pointer!important}
.ap-reader-read-view .ap-pair-art-overlay .ap-pair-overlay-head button{cursor:pointer!important}

/* Mobile panel is created by JS but hidden above the phone breakpoint. */
.ap-pair-mobile-translation{display:none}