/* Shared visual language for existing readers/characters, not a replacement reader. */
body.kmh-connected { --ink:#26392f; --ink-soft:#53675b; --paper:#fff; --paper-deep:#f3f5f0; --night:#263e33; --sakura:#314e40; --line:#d9e0d9; background:#fff; color:#26392f; }
body.kmh-connected h1, body.kmh-connected h2, body.kmh-connected h3 { border:0; background:none; box-shadow:none; }
body.kmh-connected h1::before, body.kmh-connected h1::after,
body.kmh-connected h2::before, body.kmh-connected h2::after,
body.kmh-connected h3::before, body.kmh-connected h3::after { display:none; content:none; }
body.kmh-connected .site-header { background:#fff; border-bottom:1px solid #d9e0d9; box-shadow:none; }
body.kmh-connected .brand { font-weight:400; letter-spacing:.13em; }
body.kmh-connected .brand-mark { display:none; }
body.kmh-connected .button, body.kmh-connected .nav-cta { border-radius:3px; box-shadow:none; font-weight:400; }
body.kmh-connected .button.secondary { background:#fff; color:#314e40!important; border-color:#a9b9ac; }
body.kmh-connected .reader-header-actions .button { background:transparent; border:0; padding:8px 12px; text-decoration:underline; text-underline-offset:5px; }
body.kmh-connected .reader-hero { padding:28px 16px 20px; }
body.kmh-connected .reader-hero h1 { font-size:clamp(24px,3vw,34px); font-weight:400; }
body.kmh-connected .reader-kicker { color:#53675b; font-weight:400; }
body.kmh-connected .reader-wrap { --kmh-page-width:min(620px, max(340px, calc((100svh - 280px) * .708)), 100%); padding-bottom:40px; }
body.kmh-connected .reader-stage { width:var(--kmh-page-width); aspect-ratio:424/600; border:0; border-radius:2px; box-shadow:0 8px 24px #26392f0d; }
body.kmh-connected .reader-stage img { width:100%; height:auto; max-height:none; }
body.kmh-connected .reader-toolbar { width:var(--kmh-page-width); max-width:100%; border:1px solid #cbd6cc; border-radius:3px; background:#fff; box-shadow:0 4px 16px #26392f12; padding:5px; gap:6px; grid-template-columns:1fr auto 1fr; bottom:8px; }
body.kmh-connected .reader-nav-button { color:#26392f; border:0; border-radius:2px; padding:6px 12px; min-height:44px; font-weight:400; grid-row:auto; }
body.kmh-connected .reader-progress { color:#26392f; grid-column:auto; grid-row:auto; }
body.kmh-connected .reader-progress select { min-height:44px; font-size:16px; color:#26392f; background:#f3f5f0; border-radius:2px; padding:6px 8px; }
body.kmh-connected .reader-nav-button:hover:not([aria-disabled="true"]) { background:#edf2ec; }
body.kmh-connected .reader-end { background:#263e33; border-radius:3px; }
body.kmh-connected .reader-end h2 { font-size:clamp(23px,3vw,32px); font-weight:400; }
body.kmh-connected .reader-end .button { background:#fff; color:#26392f!important; }
body.kmh-connected .reader-end .button.secondary { background:transparent; color:#fff!important; }
body.kmh-connected .character-card { box-shadow:none; border-radius:3px; }
body.kmh-connected .site-footer { background:#f3f5f0; }
body.kmh-connected .kmh-after-reading { max-width:760px; margin:0 auto 32px; padding:24px; text-align:center; }
body.kmh-connected .kmh-after-reading p { color:inherit; margin:0 0 12px; }
body.kmh-connected .kmh-after-reading a { display:inline-flex; align-items:center; min-height:44px; margin:0 14px; color:inherit; text-underline-offset:5px; }
body.kmh-connected .reader-end .kmh-after-reading { border-top:1px solid #ffffff40; margin:28px 0 0; padding:24px 0 0; }
body.kmh-connected .kmh-instagram-reader-link a { border-radius:3px; }
body.kmh-connected :focus-visible { outline:2px solid #789981; outline-offset:4px; }
body.kmh-connected.admin-bar .site-header { top:32px; }
@media(max-width:782px) { body.kmh-connected.admin-bar .site-header { top:46px; } }
@media(max-width:760px) {
 body.kmh-connected .reader-wrap { --kmh-page-width:100%; width:calc(100% - 28px); }
 body.kmh-connected .site-header { gap:8px; padding:12px 16px; flex-wrap:wrap; }
 body.kmh-connected .reader-header-actions { gap:4px; }
 body.kmh-connected .reader-header-actions .button { min-height:44px; padding:8px; font-size:12px; }
 body.kmh-connected .reader-stage { scroll-margin-top:120px; }
 body.kmh-connected .reader-toolbar { bottom:0; }
 body.kmh-connected .reader-end { padding:28px 20px; }
}
