/* scb-ux.css — Task G UX enhancements (scb_universe_deploy).
   Adapted from K3 blueprint: real content class is .chapter-main and the
   theme's light mode is body.scb-light (dark is default, no data-theme). */

/* Back to top */
.scb-btt{position:fixed;bottom:2rem;right:2rem;z-index:900;
  width:44px;height:44px;border-radius:50%;border:none;
  background:var(--scb-accent,#1a73e8);color:#fff;font-size:1.4rem;
  cursor:pointer;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 8px rgba(0,0,0,.25)}
.scb-btt.visible{opacity:1;visibility:visible}
.scb-btt:hover{background:var(--scb-accent-hover,#1557b0)}
@media(max-width:768px){.scb-btt{bottom:1rem;right:1rem;width:40px;height:40px}}

/* Chapter meta row (readingtime + font size) */
.scb-chapter-meta{display:flex;flex-wrap:wrap;justify-content:space-between;
  align-items:center;gap:.75rem;margin:.25rem 0 .5rem}

/* Font size controls */
.scb-fontsize{display:inline-flex;gap:.25rem;align-items:center}
.scb-fontsize button{background:none;border:1px solid var(--scb-border,#ccc);
  border-radius:4px;padding:.15rem .45rem;cursor:pointer;font-size:.85rem;
  color:var(--scb-text,#333);line-height:1}
.scb-fontsize button:hover{background:var(--scb-hover-bg,#f0f0f0)}
.scb-fontsize button.active{background:var(--scb-accent,#1a73e8);color:#fff;border-color:var(--scb-accent,#1a73e8)}

/* Font size body classes (both K3 .scb-content and real .chapter-main) */
body.scb-fs-small .scb-content, body.scb-fs-small .chapter-main{font-size:.9rem}
body.scb-fs-medium .scb-content, body.scb-fs-medium .chapter-main{font-size:1rem}
body.scb-fs-large .scb-content, body.scb-fs-large .chapter-main{font-size:1.15rem}

/* Reading time */
.scb-readingtime{display:flex;align-items:center;gap:.4rem;
  font-size:.85rem;color:var(--scb-muted,#666);margin:.5rem 0}
.scb-readingtime-icon{font-size:1rem}

/* Related pages */
.scb-related{margin:2rem 0;padding:1.5rem;
  border:1px solid var(--scb-border,#e0e0e0);border-radius:8px;
  background:var(--scb-card-bg,#fafafa)}
.scb-related-title{font-size:1rem;margin:0 0 .75rem;color:var(--scb-heading,#333)}
.scb-related-list{list-style:none;padding:0;margin:0;display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.5rem}
.scb-related-item a{display:block;padding:.5rem .75rem;border-radius:4px;
  text-decoration:none;color:var(--scb-link,#1a73e8);font-size:.9rem;
  transition:background .2s}
.scb-related-item a:hover{background:var(--scb-hover-bg,#f0f0f0)}

/* Consent banner override (minimal — consent plugin provides base) */
.consent-banner{font-size:.85rem}

/* Dark-mode overrides: dark is the theme default (body:not(.scb-light)) */
body:not(.scb-light) .scb-related{background:var(--scb-card-bg-dark,#1e1e1e);
  border-color:var(--scb-border-dark,#333)}
body:not(.scb-light) .scb-btt{background:var(--scb-accent-dark,#4da6ff)}
body:not(.scb-light) .scb-fontsize button{border-color:var(--scb-border-dark,#555);
  color:var(--scb-text-dark,#ddd)}

/* scb_final_cleanup T2 2026-09-27: 390px no-overflow. .scb-layout (scb-manual.css L905)
   uses width:100vw full-bleed; 100vw includes the scrollbar (390 vs clientWidth 375)
   -> phantom 8-15px horizontal overflow on classic-scrollbar browsers. Below 1023px the
   grid is single-column so the full-bleed serves no purpose; width:auto removes it. */
@media (max-width: 1023px) {
  .scb-manual .scb-layout { width: auto; margin-left: 0; }
}