/* The sky is the page. Kanshan owns the controls; typography stays in the skin. */
#shell[data-kanshan-hub] { --reading-width: min(500px, 40vw); }
#shell[data-kanshan-hub] .topbar { grid-template-columns: 150px minmax(0,1fr) auto; grid-template-rows: auto; align-items: start; padding: 22px 32px 8px; gap: 16px; background: none; }
#shell[data-kanshan-hub] .topbar__meta { grid-column: 2; grid-row: 1; min-height: 46px; justify-content: center; }
#shell[data-kanshan-hub] .topbar__actions { grid-column: 3; grid-row: 1; gap: 10px; align-items: center; }
#shell[data-kanshan-hub] .brand { font-size: 12px; min-height: 46px; }
#shell[data-kanshan-hub][data-study-level=universe] .brand { visibility: hidden; pointer-events: none; }
#shell[data-kanshan-hub] #crumbs { max-width: 100%; font-size: 12px; white-space: nowrap; overflow-x: auto; scrollbar-width: none; }
#shell[data-kanshan-hub] .focus-return { min-height: 32px; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border: 0; background: transparent; color: #abc7ce; font: inherit; font-size: 11px; padding: 4px 8px; cursor: pointer; }
#shell[data-kanshan-hub] .focus-return[hidden] { display: none; }
#shell[data-kanshan-hub] #study-toolbar,
#shell[data-kanshan-hub] #study-panel,
#shell[data-kanshan-hub] #constellation-learning-slot,
#shell[data-kanshan-hub] #journey-footer,
#shell[data-kanshan-hub] #scene-catalog,
#shell[data-kanshan-hub] #primary-action { display: none !important; }
#shell[data-kanshan-hub] .view-settings summary { width: 46px; height: 46px; padding: 0; border-radius: 16px; background: #10121dbd; border-color: #cad8ec26; }
#shell[data-kanshan-hub] .view-settings summary::after { display: none; }
#shell[data-kanshan-hub] .view-settings summary svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.6; }
#shell[data-kanshan-hub] .event-status { min-width: 126px; min-height: 46px; padding: 6px 15px; border: 1px solid #cad8ec26; border-radius: 16px; background: #10121dbd; }
#shell[data-kanshan-hub] .event-status__ring small { display: block; font-size: 12px; color: #e1e5ed; }
#shell[data-kanshan-hub] .event-status__ring > span { display: grid; grid-template-columns: auto auto; align-items: baseline; gap: 2px 4px; }
#shell[data-kanshan-hub] .event-status__ring small { grid-column: 1 / -1; }
#shell[data-kanshan-hub] .event-status__ring b { font-size: 11px; text-align: right; color: #a6b8c9; }
#shell[data-kanshan-hub] #progress-total { font-size: 10px; text-align: left; color: #a6b8c9; }
#shell[data-kanshan-hub] .hero-copy { top: 105px; left: 42px; width: min(290px,25vw); max-height: calc(100dvh - 210px); overflow: visible; }
#shell[data-kanshan-hub] .hero-copy h1 { margin: 6px 0 12px; font-size: clamp(28px,3.1vw,44px); line-height: 1.15; font-weight: 500; }
#shell[data-kanshan-hub] .hero-copy__eyebrow, #shell[data-kanshan-hub] .data-context { display: none; }
#shell[data-kanshan-hub] .hero-copy__english { display: block; margin-top: 16px; font-size: 11px; letter-spacing: 1.5px; line-height: 1.6; color: #b9bbcd; }
#shell[data-kanshan-hub] .hero-copy__description { display: block; font-size: 13px; font-weight: 400; line-height: 1.85; margin: 18px 0 0; color: #c4c9d6; white-space: pre-line; }
#shell[data-kanshan-hub][data-study-level=universe] .hero-copy { top: 48px; width: min(460px,36vw); }
#shell[data-kanshan-hub][data-study-level=universe] .hero-copy h1 { font-size: clamp(44px,5.2vw,80px); letter-spacing: 4px; font-weight: 500; text-shadow: 0 0 28px #a4aeec35; }
#shell[data-kanshan-hub][data-study-level=universe] .hero-copy__english { font-size: clamp(12px,1.25vw,18px); letter-spacing: 2px; text-transform: none; }
#shell[data-kanshan-hub][data-study-level=universe] .hero-copy__description { margin-top: 18px; }
#shell[data-kanshan-hub] .scene-pagination { bottom: 24px; left: 32px; right: auto; width: auto; transform: none; translate: none; background: #090d17a8; border: 1px solid #c3d1e51c; border-radius: 24px; padding: 2px 6px; }
#shell[data-kanshan-hub] .dossier { z-index: 36; width: var(--reading-width); background: linear-gradient(110deg,#090e18f5,#090e18ed); border-color: #c5d6e01a; }
#shell[data-kanshan-hub] .dossier__head, #shell[data-kanshan-hub][data-guidance=true] .dossier__head { padding: 96px 26px 18px; }
#shell[data-kanshan-hub] .dossier__body { padding: 0 26px 170px; }
#shell[data-kanshan-hub] #music-toggle-detail { display: none; }
#shell[data-kanshan-hub] .star-summary__avatar { width: 44px; height: 58px; object-fit: contain; }
#shell[data-kanshan-hub] .star-summary__speech { border: 1px solid #bed8dd20; border-radius: 3px 18px 18px 18px; padding: 15px 17px; background: #cadbe608; line-height: 1.9; }
#shell[data-kanshan-hub] .interface { z-index: 38; }
#shell[data-kanshan-hub] .immersive-stage { z-index: 30; }
#shell[data-kanshan-hub] .immersive-return { display: none; }
#shell[data-kanshan-hub][data-immersive=active] #space { pointer-events: none; }
#shell[data-kanshan-hub][data-immersive=active] .hero-copy { pointer-events: none; }
#shell[data-kanshan-hub] .reading-extras { flex-wrap: wrap; }
#shell[data-kanshan-hub] .reading-topic-toggle { min-height: 72px; }
#shell[data-kanshan-hub] .card-summary { font-size: 14px; }
@media(max-width:1100px) and (orientation:landscape) {
  #shell[data-kanshan-hub] .topbar { grid-template-columns: 90px minmax(0,1fr) auto; padding: 14px 22px; }
  #shell[data-kanshan-hub][data-study-level=universe] .hero-copy { top: 74px; left: 26px; width: 300px; }
  #shell[data-kanshan-hub][data-study-level=universe] .hero-copy h1 { font-size: 46px; }
  #shell[data-kanshan-hub] .hero-copy { top: 94px; left: 26px; width: 225px; }
}
@media(max-width:820px) and (orientation:portrait) {
  #shell[data-kanshan-hub] { --reading-width: 100%; }
  #shell[data-kanshan-hub] .topbar { grid-template-columns: minmax(0,1fr) auto; grid-template-rows: 44px; padding: calc(9px + env(safe-area-inset-top,0px)) 14px 3px; gap: 6px; }
  #shell[data-kanshan-hub] .brand { display: none; }
  #shell[data-kanshan-hub] .topbar__meta { grid-column: 1; grid-row: 1; justify-content: start; min-height: 44px; flex-wrap: wrap; align-content: center; gap: 0; }
  #shell[data-kanshan-hub] .topbar__actions { grid-column: 2; grid-row: 1; gap: 6px; }
  #shell[data-kanshan-hub] .view-settings summary { width: 42px; height: 42px; min-width: 42px; min-height: 42px; border-radius: 14px; }
  #shell[data-kanshan-hub] .event-status { min-width: 72px; min-height: 42px; padding: 3px 9px; border-radius: 14px; }
  #shell[data-kanshan-hub] .event-status__ring small { font-size: 10px; }
  #shell[data-kanshan-hub] #crumbs { font-size: 10px; width: 100%; }
  #shell[data-kanshan-hub] .focus-return { font-size: 10px; min-height: 22px; padding: 0; max-width: 100%; }
  #shell[data-kanshan-hub] .hero-copy,
  #shell[data-kanshan-hub][data-study-level=universe] .hero-copy { left: 22px; top: calc(80px + env(safe-area-inset-top,0px)); width: calc(100% - 44px); max-height: none; }
  #shell[data-kanshan-hub] .hero-copy h1 { font-size: 29px; }
  #shell[data-kanshan-hub][data-study-level=universe] .hero-copy h1 { font-size: 37px; letter-spacing: 3px; margin: 0 0 8px; }
  #shell[data-kanshan-hub][data-study-level=universe] .hero-copy__english { font-size: 11px; letter-spacing: 1.1px; margin-top: 7px; }
  #shell[data-kanshan-hub] .hero-copy__description { font-size: 11px; line-height: 1.65; margin-top: 10px; }
  #shell[data-kanshan-hub][data-study-level=universe] .hero-copy__description { margin-top: 10px; }
  #shell[data-kanshan-hub]:not([data-study-level=universe]) .hero-copy__english { display: none; }
  #shell[data-kanshan-hub] .dossier { top: var(--detail-top,180px); bottom: 0; left: 0; right: 0; width: 100%; height: auto; border-radius: 22px 22px 0 0; border-top: 1px solid #c4d4e025; }
  #shell[data-kanshan-hub] .dossier__head,
  #shell[data-kanshan-hub][data-guidance=true] .dossier__head { padding: 18px 20px 12px; }
  #shell[data-kanshan-hub] .dossier__head .reading-heading { font-size: 20px; }
  #shell[data-kanshan-hub] .dossier__body { padding: 0 20px calc(155px + env(safe-area-inset-bottom,0px)); }
  #shell[data-kanshan-hub] .scene-pagination { left: 16px; bottom: calc(88px + env(safe-area-inset-bottom,0px)); max-width: calc(100vw - 116px); }
  #shell[data-kanshan-hub] .card-overlay__bar { padding: 14px 18px; }
  #shell[data-kanshan-hub] .card-overlay__body { padding: 18px; font-size: 14px; }
  #shell[data-kanshan-hub] .card-summary__metrics b { font-size: 22px; }
}
@media(max-height:640px) and (orientation:landscape) {
  #shell[data-kanshan-hub] .topbar { padding: 8px 16px; }
  #shell[data-kanshan-hub] .hero-copy,
  #shell[data-kanshan-hub][data-study-level=universe] .hero-copy { top: 68px; left: 22px; width: 230px; }
  #shell[data-kanshan-hub][data-study-level=universe] .hero-copy h1 { font-size: 34px; }
  #shell[data-kanshan-hub] .hero-copy__description { font-size: 11px; margin-top: 10px; }
  #shell[data-kanshan-hub] .dossier__head { padding-top: 72px; }
}

/* The public sample must remain identifiable when the decorative eyebrow is hidden. */
#shell[data-kanshan-hub] .data-context{display:block;font-size:11px;color:#aab7c9;line-height:1.6}
