/* ==========================================================================\n   ALEXPHAN READ TABLET / MOBILE — SINGLE RESPONSIVE SURFACE AUTHORITY\n   This file owns READ below desktop shell width only.\n   RIGHT yields before CENTER. Mobile is pair-safe ART -> TXT.\n   No FLIP rules live here.\n   ========================================================================== */

@media (max-width:1259px){
  html,body{max-width:100%;overflow-x:hidden}
  body.ap-reader-page{background:#eef4fb}
  .ap-header-top{gap:9px!important}
  .ap-brand{font-size:17px!important;letter-spacing:.75px!important}
  .ap-brand-bolt{font-size:17px!important}
  .ap-game-nav .ap-top-link,.ap-game-book-toggle,.ap-account-btn,.ap-login-link,.ap-inline-toggle{height:31px!important;padding-inline:8px!important;font-size:8px!important}
  .ap-game-level-badge,.ap-game-rank-badge{height:28px!important;padding-inline:8px!important;font-size:7px!important}
  .ap-game-xp{width:64px!important}
  .ap-reader-shell{width:min(var(--ap-center,100%),calc(100% - 12px))!important;max-width:100%!important;margin:0 auto!important;padding-bottom:8px!important}
  .ap-reader-read-layout{display:block!important;width:100%!important;max-width:100%!important;margin:0 auto!important}
  .ap-reader-main-column{width:100%!important;max-width:100%!important;min-width:0!important;height:calc(100dvh - 118px)!important;min-height:440px!important;display:grid!important;grid-template-rows:minmax(0,1fr) auto!important;overflow:hidden!important}
  .ap-reader-continuous-stack{height:100%!important;min-height:0!important;display:flex!important;flex-direction:column!important;gap:18px!important;padding:10px 6px 18px!important;overflow-y:auto!important;overflow-x:hidden!important}
  .ap-reader-card.ap-reader-continuous-page{flex:0 0 auto!important;border:1px solid #9aa9b8!important;border-radius:12px!important;background:#fbfaf6!important;box-shadow:0 9px 22px rgba(15,23,42,.15),0 2px 5px rgba(15,23,42,.08)!important}
  .ap-reader-sidebar{display:none!important}
  .ap-reader-toolbar{top:58px!important;flex-wrap:wrap!important}
  .ap-reader-toolbar-primary{min-width:100%!important}
  .ap-reader-card.ap-reader-continuous-page,.ap-reader-read-view .ap-reader-content{width:100%!important;max-width:100%!important}
  .ap-reader-page-headbar{margin:10px 10px 0!important}
  .ap-reader-read-view .ap-reader-content{padding:8px 10px 7px!important}
  .ap-reader-page-footer-marker{display:flex!important;align-items:flex-end!important;justify-content:center!important;gap:5px!important;min-height:24px!important;padding:1px 0 8px!important;border-radius:0 0 12px 12px!important;font:900 12px/1 Inter,system-ui,sans-serif!important}
  .ap-reader-read-view .ap-story-canvas.ap-t1-family,
  .ap-reader-read-view .ap-story-canvas.ap-six-layout{width:100%!important;height:auto!important;max-height:none!important;gap:clamp(4px,1.1vw,var(--ap-row-gap,10px))!important}
  .ap-reader-read-view .ap-story-canvas.ap-t1-family>.ap-template-row{width:100%!important;height:auto!important;flex-basis:auto!important;aspect-ratio:var(--ap-center-num)/var(--ap-row-num)!important;gap:clamp(4px,1.1vw,var(--ap-pair-gap,10px))!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.26 responsive divider authority: retire the desktop pixel-positioned row divider below 1260px.
     The divider is anchored to the actual first grid zone edge, so it follows the live ART/TXT track
     automatically at every tablet width. No JS and no hard-coded left coordinate. */
  .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[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-reader-bottom-pager{gap:5px!important;min-height:48px!important;padding:5px 8px!important;border-radius:0 0 9px 9px!important}
  .ap-reader-bottom-slot,.ap-reader-bottom-pager-arrow{height:32px!important;min-width:32px!important;padding:0 7px!important;font-size:14px!important}
  .ap-reader-bottom-pager-arrow{min-width:38px!important;font-size:23px!important}
  .ap-reader-bottom-label{height:32px!important;font-size:10px!important}
  .ap-reader-bottom-total{min-width:38px!important;font-size:12px!important}

  /* CH/PG drawer is the only RIGHT presentation below desktop. */
  body.ap-reader-toc-open{overflow:hidden}
  body.ap-reader-toc-open .ap-reader-sidebar{display:block!important;position:fixed!important;right:10px!important;top:70px!important;z-index:120!important;width:min(var(--ap-right,340px),calc(100vw - 24px))!important;max-height:calc(100vh - 84px)!important;overflow:hidden!important}
  body.ap-reader-toc-open .ap-reader-side-panel{max-height:calc(100vh - 84px)!important;overflow:hidden!important}
  body.ap-reader-toc-open .ap-reader-side-chapters{flex:1 1 auto!important;min-height:0!important;overflow:auto!important}
  body.ap-reader-toc-open .ap-reader-toc-backdrop{display:block!important;position:fixed!important;inset:0!important;z-index:110!important;border:0!important;background:rgba(15,23,42,.38)!important}
  body.ap-reader-toc-open .ap-reader-toc-close{display:grid!important;place-items:center!important;position:absolute!important;right:5px!important;top:5px!important;z-index:3!important;width:24px!important;height:24px!important;border:0!important;border-radius:50%!important;background:#0f172a!important;color:#fff!important;cursor:pointer!important}
}

@media (max-width:767px){
  .ap-header-top{height:58px!important;gap:8px!important}
  .ap-brand{font-size:18px!important;letter-spacing:.8px!important}
  .ap-brand-bolt{font-size:18px!important}
  .ap-game-progress-zone{display:none!important}
  .ap-main-nav,.ap-account-desktop{display:none!important}
  .ap-mobile-menu-btn{display:inline-flex!important;width:38px;height:38px;align-items:center;justify-content:center;border:1.5px solid #00dbea;border-radius:7px;background:rgba(0,240,255,.035);box-shadow:0 0 10px rgba(0,240,255,.10)}
  .ap-mobile-menu-btn{flex-direction:column!important;gap:4px!important;padding:0!important}
  .ap-mobile-menu-btn span{display:block!important;width:19px!important;height:2px!important;flex:0 0 2px!important;border-radius:99px!important;background:#00e7f2!important;box-shadow:0 0 5px rgba(0,231,242,.40)!important}
  body.ap-reader-page{height:100dvh!important;min-height:100dvh!important;overflow:hidden!important}
  .ap-reader-shell{width:100%!important;height:calc(100dvh - 58px)!important;min-height:0!important;display:flex!important;flex-direction:column!important;padding:6px 6px 0!important;overflow:hidden!important}
  .ap-reader-toolbar{position:relative!important;top:auto!important;flex:0 0 auto!important;display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto auto!important;align-items:center!important;padding:5px!important;gap:5px!important;margin-bottom:6px!important}
  .ap-reader-progress-track,.ap-reader-chapter-chip,.ap-reader-jump-controls{display:none!important}
  .ap-reader-toolbar-primary{grid-row:1!important;display:flex!important;width:100%!important;min-width:0!important;justify-content:flex-start!important;padding:0 4px 4px!important;border-bottom:1px solid #dbe4ef!important}
  .ap-reader-progress-meta{width:100%!important;display:flex!important;align-items:center!important;gap:5px!important;font-size:12px!important;line-height:1.15!important;white-space:nowrap!important}
  .ap-reader-toolbar-actions{grid-row:2!important;display:flex!important;width:100%!important;min-width:0!important;justify-content:space-between!important;gap:4px!important;overflow:visible!important;white-space:nowrap!important}
  .ap-reader-read-view{flex:1 1 auto!important;min-height:0!important;overflow:hidden!important}
  .ap-reader-read-layout{height:100%!important;min-height:0!important;overflow:hidden!important}
  .ap-reader-main-column{height:100%!important;min-height:0!important;display:grid!important;grid-template-rows:minmax(0,1fr) auto!important;overflow:hidden!important}
  .ap-reader-continuous-stack{height:100%!important;min-height:0!important;gap:14px!important;padding:6px 4px 14px!important;overflow-y:auto!important;overflow-x:hidden!important}
  .ap-reader-card.ap-reader-continuous-page{padding:0!important;flex:0 0 auto!important;border-radius:10px!important;box-shadow:0 7px 18px rgba(15,23,42,.14)!important}
  .ap-reader-page-headbar{margin:6px 6px 0!important}
  .ap-reader-read-view .ap-reader-content{padding:6px!important}
  .ap-reader-page-footer-marker{min-height:23px!important;padding:0 0 7px!important;font-size:12px!important;gap:4px!important}
  .ap-reader-bottom-pager{position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;transform:none!important;flex:0 0 auto!important;padding-bottom:max(5px,env(safe-area-inset-bottom))!important}
  .ap-reader-page-headbar{height:30px!important}
  .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;aspect-ratio:auto!important;height:auto!important;gap:var(--ap-row-gap,10px)!important;background-image:none!important}
  .ap-reader-read-view .ap-story-canvas.ap-t1-family>.ap-template-row{display:flex!important;flex-direction:column!important;width:100%!important;height:auto!important;flex-basis:auto!important;aspect-ratio:auto!important;gap:0!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:none!important;display:none!important}
  .ap-reader-read-view .ap-story-canvas.ap-t1-family>.ap-template-row[data-pair-order="text-art"]>.ap-six-art{order:1!important}
  .ap-reader-read-view .ap-story-canvas.ap-t1-family>.ap-template-row[data-pair-order="text-art"]>.ap-six-text{order:2!important}
  .ap-reader-read-view .ap-story-canvas.ap-t1-family>.ap-template-row>.ap-six-zone{width:100%!important;height:auto!important;min-height:0!important;order:initial!important}
  .ap-reader-read-view .ap-six-art>.ap-comic-image-box,.ap-reader-read-view .ap-six-art .ap-story-art{position:relative!important;height:auto!important;aspect-ratio:var(--ap-art-ratio-w)/var(--ap-art-ratio-h)!important}
  .ap-reader-read-view .ap-six-art .ap-story-art img{position:absolute!important;inset:0!important}
  .ap-reader-read-view .ap-six-text>.ap-six-text-content{height:auto!important;min-height:220px!important;overflow:visible!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}

  /* 5.25 mobile chrome authority: READ is implicit and FLIP is disabled, so remove both view buttons. */
  .ap-reader-view-segment{display:none!important}
  .ap-reader-language-segment,.ap-reader-font-tools{flex:0 0 auto!important}
  .ap-reader-language-select{height:31px!important;min-width:76px!important;padding-inline:8px 24px!important;font-size:12px!important}
  .ap-reader-language-segment{gap:3px!important}
  .ap-reader-font-tools{display:flex!important;gap:3px!important;min-width:0!important}
  .ap-reader-toolbar-actions .ap-reader-segment button,
  .ap-reader-toolbar-actions .ap-icon-btn{min-width:0!important;padding-inline:8px!important}

  /* Compact one-line mobile chapter head: CH n | title | n/total. */
  .ap-reader-page-headbar{height:36px!important;min-height:36px!important;padding:0 8px!important;gap:6px!important}
  .ap-reader-page-head-context{flex:1 1 auto!important;min-width:0!important;display:flex!important;align-items:center!important;gap:7px!important}
  .ap-reader-page-chapter-label{flex:0 0 auto!important;white-space:nowrap!important;font-size:0!important;line-height:1!important}
  .ap-reader-page-chapter-label::before{content:"CH ";font-size:11px!important;font-weight:800!important;color:#dbeafe!important}
  .ap-reader-page-chapter-label strong{font-size:11px!important;font-weight:900!important;color:#fff!important}
  .ap-reader-page-head-context>b{display:block!important;flex:1 1 auto!important;min-width:0!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;font-size:13px!important;line-height:1.05!important}
  .ap-reader-page-head-context>b>[data-reader-meta-lang]{white-space:nowrap!important}
  .ap-reader-page-head-number{flex:0 0 auto!important;display:flex!important;align-items:baseline!important;gap:1px!important;white-space:nowrap!important}
  .ap-reader-page-number-label{display:none!important}
  .ap-reader-page-head-number strong{font-size:13px!important;line-height:1!important}
  .ap-reader-page-head-number small{font-size:10px!important;line-height:1!important}
}

@media (max-width:520px){
  .ap-reader-bottom-pager{gap:3px!important;padding-inline:5px!important}
  .ap-reader-bottom-slot,.ap-reader-bottom-pager-arrow{height:30px!important;min-width:29px!important;padding:0 5px!important;font-size:13px!important}
  .ap-reader-bottom-pager-arrow{min-width:34px!important;font-size:21px!important}
  .ap-reader-bottom-label{font-size:9px!important;margin-right:0!important}
  .ap-reader-bottom-total{min-width:32px!important;font-size:11px!important}
}

@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}


/* 5.53 Reader footer responsive ownership. */
@media (max-width:1259px) and (min-width:768px){
  .ap-reader-footer-wrap{width:100%!important;margin:10px 0 0!important}
  .ap-reader-footer-wrap>.ap-site-footer{padding:32px 30px 33px!important;border-radius:9px!important}
  .ap-reader-footer-wrap .ap-site-footer-line{font-size:12px!important}
  .ap-reader-footer-wrap .ap-site-footer-credit{font-size:11px!important}
}
@media (max-width:767px){
  .ap-reader-footer-wrap{display:none!important}
}

/* ========================================================================== 
   5.56 READ PAIR MODE — PHONE STACK
   ART remains visible. EN original stays in TXT; translation stacks below it.
   ========================================================================== */
@media (max-width:767px){
  .ap-reader-pair-menu{display:none!important}
  .ap-reader-language-select{min-width:112px!important;max-width:132px!important;font-size:10px!important}
  .ap-quick-compare{display:none!important}
  .ap-pair-art-overlay{display:grid!important}
  .ap-reader-shell[data-reader-pair] .ap-reader-read-view .ap-six-text>.ap-six-text-content{padding-top:10px!important}
  .ap-pair-original-badge{position:static!important;order:0!important;display:flex!important;width:100%!important;min-height:28px!important;padding:5px 10px!important;border:0!important;border-bottom:1px solid #dbe5df!important;border-radius:0!important;background:#edf7f4!important;color:#475569!important;font-size:10px!important;pointer-events:none!important}
  .ap-reader-shell[data-reader-pair] .ap-reader-read-view .ap-six-text{display:flex!important;flex-direction:column!important}
  .ap-reader-shell[data-reader-pair] .ap-reader-read-view .ap-six-text>.ap-six-text-content{order:1!important}
  .ap-pair-mobile-translation{display:none!important}
  .ap-pair-mobile-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;min-height:34px!important;padding:6px 10px!important;border-bottom:1px solid #bfe4df!important;background:linear-gradient(90deg,#dcf7f2,#e7f5ff)!important}
  .ap-pair-mobile-head strong{font:900 11px/1.1 Inter,"Segoe UI",Arial,sans-serif!important;color:#075985!important;letter-spacing:.04em!important}
  .ap-pair-mobile-head button{height:24px!important;min-width:48px!important;padding:0 8px!important;border:1px solid #67c7d5!important;border-radius:999px!important;background:#fff!important;color:#075985!important;font:900 9px/1 Inter,"Segoe UI",Arial,sans-serif!important}
  .ap-pair-mobile-body{padding:11px 12px 13px!important;font-family:var(--ap-reader-font-family,"Segoe UI",Arial,sans-serif)!important;font-size:18px!important;line-height:1.40!important;color:#152015!important}
  .ap-pair-mobile-translation[data-pair-target="zh"] .ap-pair-mobile-body{font-size:20px!important;line-height:1.42!important}
  .ap-pair-mobile-translation[data-pair-target="ko"] .ap-pair-mobile-body{font-size:19px!important;line-height:1.42!important}
  .ap-pair-mobile-translation.is-collapsed .ap-pair-mobile-body{display:none!important}
  .ap-pair-copy-block+.ap-pair-copy-block{margin-top:.28em!important}.ap-pair-copy-text{display:block!important;font:inherit!important;color:inherit!important}
}
