.topbar .page-header-copy[data-page-identity]{
  --page-glow:#55d8ff;
  display:flex;
  align-items:center;
  gap:13px;
  min-width:0;
}
.topbar .page-header-text{display:grid;min-width:0}
.topbar .page-header-copy #page-title{margin-left:0;overflow-wrap:anywhere}
.page-identity-visual{
  position:relative;
  flex:0 0 50px;
  width:50px;
  height:50px;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--page-glow) 44%,#384651);
  background:linear-gradient(145deg,color-mix(in srgb,var(--page-glow) 10%,#111923),#090d14 68%);
  box-shadow:inset 0 0 0 3px #070b10,0 0 18px color-mix(in srgb,var(--page-glow) 13%,transparent);
  clip-path:polygon(6px 0,calc(100% - 6px) 0,100% 6px,100% calc(100% - 6px),calc(100% - 6px) 100%,6px 100%,0 calc(100% - 6px),0 6px);
}
.page-identity-visual[hidden]{display:none!important}
.page-identity-visual::after{content:'';position:absolute;inset:4px;pointer-events:none;border:1px solid color-mix(in srgb,var(--page-glow) 14%,transparent)}
.page-header-copy[data-page-identity="lesson"]{--page-glow:#f2b35f}
.page-header-copy[data-page-identity="schedule"]{--page-glow:#71d7b4}
.page-header-copy[data-page-identity="sage"]{--page-glow:#ff4a9d}
.page-header-copy[data-page-identity="family"]{--page-glow:#c68bea}
.page-header-copy[data-page-identity="beast"]{--page-glow:#d8ff59}
.page-header-copy[data-page-identity="curriculum"]{--page-glow:#e39a67}
.page-header-copy[data-page-identity="curriculum"] #page-title{overflow-wrap:normal;word-break:normal}
.page-header-copy[data-page-identity="people"]{--page-glow:#83bfff}
.page-header-copy[data-page-identity="chat"]{--page-glow:#72d5d8}
.page-identity-art{display:block;width:100%;height:100%;pointer-events:none}
.page-identity-art--scene{object-fit:cover;image-rendering:auto;filter:saturate(.86) contrast(1.06)}
.page-identity-art--portrait{position:absolute;inset:2px;overflow:hidden}
.page-identity-art--portrait img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 24%;filter:saturate(.92) contrast(1.05)}
.page-identity-art--pixel{object-fit:contain;padding:1px;box-sizing:border-box;image-rendering:pixelated;filter:drop-shadow(0 0 7px color-mix(in srgb,var(--page-glow) 28%,transparent))}
.page-identity-art--sprite{object-fit:contain;padding:5px;box-sizing:border-box;image-rendering:pixelated;filter:drop-shadow(0 0 7px color-mix(in srgb,var(--page-glow) 28%,transparent))}

/* Teaching Mode hides the global title bar, so the shared live-class art uses its compact cue. */
.teaching-live-visual{position:relative;flex:0 0 46px;width:46px;height:46px;border:1px solid color-mix(in srgb,var(--accent-blue) 48%,var(--line));background:linear-gradient(145deg,rgba(56,168,255,.08),rgba(8,12,18,.82)),url('assets/page-identity/live-class.png') center/contain no-repeat;box-shadow:inset 0 0 0 3px rgba(5,8,12,.8),0 0 16px rgba(56,168,255,.1);clip-path:polygon(6px 0,calc(100% - 6px) 0,100% 6px,100% calc(100% - 6px),calc(100% - 6px) 100%,6px 100%,0 calc(100% - 6px),0 6px)}

@media(max-width:760px){
  .topbar .page-header-copy[data-page-identity]{gap:9px}
  .page-identity-visual{flex-basis:42px;width:42px;height:42px}
  .teaching-live-visual{flex-basis:40px;width:40px;height:40px}
  .teaching-context{display:grid;grid-template-columns:40px minmax(0,1fr);align-items:start}
  .teaching-context-copy{grid-column:2}
  .teaching-session-state{grid-column:1/-1}
}
@media(max-width:390px){
  .topbar{align-items:center}
  .page-identity-visual{flex-basis:38px;width:38px;height:38px}
  .topbar .page-header-copy #page-title{font-size:27px}
  .topbar .page-header-copy[data-page-identity="curriculum"] #page-title{font-size:23px;letter-spacing:-1px}
}
@media(max-width:340px){
  .topbar .page-header-copy[data-page-identity]{gap:7px}
  .page-identity-visual{flex-basis:34px;width:34px;height:34px}
  .page-identity-visual[data-page-art-kind="scene"],.page-identity-visual[data-page-art-kind="pixel"]{display:none}
  .topbar .page-header-copy #page-title{font-size:22px}
  .teaching-live-visual{flex-basis:34px;width:34px;height:34px}
  .teaching-context{grid-template-columns:34px minmax(0,1fr)}
}