/* 5.9.2: a light palette and the same navigation in School, Reinforcement and the test Portal. */
body[data-portal-ui] { --portal-ink:#17324d; --portal-muted:#50657a; --portal-panel:#ffffff; --portal-line:#ccd9e6; --portal-classic-topbar-height:76px; background:#f4f7fb; color:var(--portal-ink); color-scheme:light; }
body[data-portal-ui] :is(button,a,input,select,textarea,summary) { touch-action:manipulation; }
body[data-portal-ui] :is(button,a,input,select,textarea,summary):focus-visible { outline:3px solid #805609; outline-offset:3px; }
body[data-portal-ui] :is(.public-main,.portal-classic-shell,.demo-layout) { max-width:1200px; margin-inline:auto; }
body[data-portal-ui] .portal-classic-shell { background:#f4f7fb; color:var(--portal-ink); color-scheme:light; }
body[data-portal-ui] .portal-classic-stage { padding:0; height:calc(100svh - var(--portal-classic-topbar-height)); }
body[data-portal-ui] .portal-classic-shell .portal-app-pages { padding:24px 24px calc(112px + env(safe-area-inset-bottom)); }
body[data-portal-ui] .portal-classic-topbar { height:var(--portal-classic-topbar-height); min-height:var(--portal-classic-topbar-height); padding:14px 24px; background:#ffffff; border-bottom:1px solid var(--portal-line); }
body[data-portal-ui]:has(.portal-classic-shell) > .public-nav { display:none; }
body[data-portal-ui] .portal-classic-brand strong { font-size:1rem; color:var(--portal-ink); }
body[data-portal-ui] .portal-classic-brand span { color:var(--portal-muted); font-size:.84rem; }
body[data-portal-ui] :is(.portal-view-heading,.portal-home-heading) h2 { font-size:clamp(1.4rem,2.5vw,2rem); letter-spacing:-.025em; line-height:1.22; color:var(--portal-ink); }
body[data-portal-ui] :is(.portal-view-heading,.portal-home-heading) p { color:var(--portal-muted); font-size:1rem; line-height:1.65; }
body[data-portal-ui] .portal-home-view > .public-hero { min-height:0; display:grid; grid-template-columns:minmax(0,1fr) 210px; padding:30px; gap:24px; border-radius:24px; background:radial-gradient(ellipse at 95% 0,#deebfa,transparent 65%),#edf4fc; border:1px solid #cad9e8; }
body[data-portal-ui] .portal-home-view > .public-hero h1 { font-size:clamp(1.8rem,3vw,2.5rem); margin:10px 0; letter-spacing:-.035em; line-height:1.15; color:var(--portal-ink); }
body[data-portal-ui] .portal-home-view > .public-hero .kicker { color:#805609!important; }
body[data-portal-ui] .portal-home-view > .public-hero .public-hero-copy { min-width:0; }
body[data-portal-ui] .portal-home-view > .public-hero .public-hero-copy p { color:#465f78; line-height:1.65; }
body[data-portal-ui] .portal-home-view > .public-hero .public-hero-side { width:100%; min-width:0; }
body[data-portal-ui] .portal-home-view > .public-hero .public-hero-art { width:100%; max-height:220px; background:transparent; }
body[data-portal-ui] .portal-home-view > .public-hero img { width:100%; max-height:220px; object-fit:contain; }
body[data-portal-ui] .portal-home-block { margin-top:24px; }
body[data-portal-ui] :is(.portal-v539-now-item,.portal-v539-study,.portal-v539-performance,.portal-next-card,.portal-pending-card) { border-radius:18px; }
body[data-portal-ui] .portal-shortcut-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
body[data-portal-ui] .portal-shortcut-grid button { min-height:88px; min-width:0; padding:16px; text-align:left; border-radius:18px; background:#ffffff; color:var(--portal-ink); border-color:var(--portal-line); }
body[data-portal-ui] .portal-shortcut-grid strong { font-size:1rem; color:var(--portal-ink); }
body[data-portal-ui] .portal-shortcut-grid small { font-size:.84rem; line-height:1.4; color:var(--portal-muted); }
body[data-portal-ui] .portal-app-nav { background:#ffffff; border:1px solid var(--portal-line); border-radius:20px; }
body[data-portal-ui] .portal-app-nav button { color:#50657a; min-height:56px; border:1px solid transparent; border-radius:14px; background:transparent; }
body[data-portal-ui] .portal-app-nav button[aria-current=page] { background:#e5f0fc; color:#174f88; border-color:#b5cfea; }
/* Keep the classic Portal's stronger legacy selectors on the same theme. */
body[data-portal-ui].public-portal .portal-classic-shell .portal-app-nav.portal-bottom-nav { grid-template-columns:repeat(5,minmax(0,1fr))!important; background:#ffffff; border-color:var(--portal-line); border-radius:20px; }
body[data-portal-ui] .portal-classic-shell .portal-bottom-nav .portal-nav-item { color:#50657a; min-height:56px; padding:8px 1px!important; }
body[data-portal-ui] .portal-classic-shell .portal-bottom-nav .portal-nav-item[aria-current=page] { background:#e5f0fc; color:#174f88; box-shadow:inset 0 0 0 1px #b5cfea; }
body[data-portal-ui] .portal-classic-shell .portal-bottom-nav .portal-nav-item strong { font-size:.8rem!important; line-height:1.3; color:inherit; max-width:100%; letter-spacing:-.015em; }
body[data-portal-ui] .portal-classic-shell .portal-bottom-nav .portal-nav-icon,body[data-portal-ui] .portal-classic-shell .portal-bottom-nav .portal-nav-icon svg { color:inherit!important; }
body[data-portal-ui] .portal-section-nav { background:#ffffff; border-color:var(--portal-line); border-radius:16px; gap:8px; padding:10px; }
body[data-portal-ui] .portal-section-nav button { background:#f1f6fc; border-color:#ccd9e6; border-radius:12px; min-height:46px; color:#17324d; }
body[data-portal-ui] .portal-section-nav button[aria-current=page] { background:#1d5c9e; border-color:#1d5c9e; color:#fff; }
body[data-portal-ui] .portal-context-bar { display:flex; align-items:center; gap:14px; margin:0 0 18px; padding:10px 0; }
body[data-portal-ui] .portal-context-bar[hidden] { display:none; }
body[data-portal-ui] .portal-context-bar button { display:flex; align-items:center; gap:8px; min-height:44px; padding:10px 14px; font:inherit; color:#17324d; background:#ffffff; border:1px solid #bacde0; border-radius:12px; }
body[data-portal-ui] .portal-context-bar small,body[data-portal-ui] .portal-context-bar strong { display:block; }
body[data-portal-ui] .portal-context-bar small { font-size:.73rem; color:var(--portal-muted); }
body[data-portal-ui] .portal-context-bar strong { font-size:1rem; }
body[data-portal-ui] .demo-content { padding:24px; }
body[data-portal-ui] .demo-welcome { border-radius:24px; background:radial-gradient(ellipse at 90% 0,#deebfa,transparent 70%),#edf4fc; }
body[data-portal-ui] .demo-kpis article { border-radius:18px; background:#ffffff; }
body[data-portal-ui] .demo-kpis strong { font-size:1.45rem; }
body[data-portal-ui] .demo-kpis button { margin-top:12px; }
body[data-portal-ui] .demo-topbar { padding:14px 24px; }
body[data-portal-ui] .demo-test-controls { border-color:#ccd9e6; background:#ffffff; border-radius:18px; }
body[data-portal-ui] .portal-optional-access-card { color:var(--portal-ink); background:#ffffff; border-color:var(--portal-line); }
body[data-portal-ui] .portal-optional-access-card h3 { color:var(--portal-ink); }
body[data-portal-ui] .portal-optional-access-card :is(.muted,.kicker) { color:var(--portal-muted)!important; }
body[data-portal-ui] .portal-optional-access-card .portal-install-steps { color:var(--portal-ink); background:#f1f6fc; border-color:var(--portal-line); }
body[data-portal-ui] .portal-optional-access-card .portal-install-steps :is(li,strong) { color:inherit; }
@media(max-width:700px) {
 body[data-portal-ui] { --portal-classic-topbar-height:68px; }
 body[data-portal-ui] .public-main { padding:0; }
 body[data-portal-ui] .demo-content,body[data-portal-ui] .portal-classic-shell .portal-app-pages { padding:16px 14px calc(112px + env(safe-area-inset-bottom)); }
 body[data-portal-ui] :is(.portal-classic-topbar,.demo-topbar) { padding:12px 14px; min-height:68px; gap:10px; }
 body[data-portal-ui] .portal-classic-brand { min-width:0; gap:10px; }
 body[data-portal-ui] :is(.portal-classic-brand img,.demo-topbar img) { width:40px; height:40px; }
 body[data-portal-ui] .portal-classic-brand strong { font-size:.88rem; }
 body[data-portal-ui] .portal-classic-brand span { font-size:.75rem; line-height:1.4; }
 body[data-portal-ui] .portal-classic-actions { gap:6px; }
 body[data-portal-ui] .portal-classic-actions .btn { min-height:44px; }
 body[data-portal-ui] .portal-home-view > .public-hero { grid-template-columns:1fr; padding:22px 20px; gap:0; }
 body[data-portal-ui] .portal-home-view > .public-hero .public-hero-side { display:none; }
 body[data-portal-ui] .portal-home-view > .public-hero h1 { font-size:1.9rem; }
 body[data-portal-ui] .portal-shortcut-grid { grid-template-columns:1fr 1fr; gap:10px; }
 body[data-portal-ui] .portal-shortcut-grid button { display:grid; grid-template-columns:1fr; gap:8px; padding:14px 12px; min-height:90px; align-content:start; }
 body[data-portal-ui] .portal-shortcut-grid strong { font-size:.91rem; }
 body[data-portal-ui] .portal-section-nav { flex-wrap:nowrap; overflow-x:auto; max-width:100%; scrollbar-width:thin; scroll-padding:10px; }
 body[data-portal-ui] .portal-section-nav button { flex:0 0 auto; white-space:nowrap; padding:10px 12px; font-size:.86rem; }
 body[data-portal-ui] .portal-app-nav { position:fixed; z-index:90; left:8px; right:8px; bottom:calc(8px + env(safe-area-inset-bottom)); width:auto; max-width:680px; margin-inline:auto; padding:6px!important; gap:3px!important; box-shadow:0 -6px 32px #2545661a; }
 body[data-portal-ui].public-portal .portal-classic-shell .portal-app-nav.portal-bottom-nav { left:8px!important; right:8px!important; bottom:calc(8px + env(safe-area-inset-bottom))!important; width:auto; transform:none; padding:6px 4px!important; gap:1px!important; box-shadow:0 -6px 32px #2545661a; }
 body[data-portal-ui] .portal-classic-shell .portal-bottom-nav .portal-nav-item strong { font-size:.7rem!important; }
 body[data-portal-ui] .portal-primary-five .portal-nav-item,body[data-portal-ui] .demo-nav button { min-height:56px; padding:8px 2px!important; font-size:.68rem; }
 body[data-portal-ui] .portal-app-nav svg { width:21px; height:21px; }
 body[data-portal-ui] .demo-welcome { padding:22px 20px; }
 body[data-portal-ui] .demo-welcome h1 { font-size:1.8rem; }
 body[data-portal-ui] .demo-home-actions { display:grid; grid-template-columns:1fr; }
 body[data-portal-ui] .demo-home-actions button { margin:0; min-height:46px; }
 body[data-portal-ui] .demo-test-controls { margin:12px 14px; padding:16px; }
 body[data-portal-ui] :is(.pet-care,.pet-fitting,.portal-view-heading) { scroll-margin-top:20px; }
}
@media(prefers-reduced-motion:reduce) { body[data-portal-ui] * { scroll-behavior:auto!important; } }

/* Light surfaces also cover login, activity lists, study, reports and chat. */
body[data-portal-ui] :is(.public-main,.portal-classic-stage,.portal-app-stage) { background:#f4f7fb; color:var(--portal-ink); }
body[data-portal-ui] :is(.card,.feature,.login-card,.portal-v539-now,.portal-v539-study,.portal-v539-performance) { background:#fff!important; color:var(--portal-ink)!important; border-color:var(--portal-line)!important; }
body[data-portal-ui] :is(h1,h2,h3,h4) { color:var(--portal-ink); }
body[data-portal-ui] :is(.muted,.field label,.field small,.demo-topbar span) { color:var(--portal-muted)!important; }
body[data-portal-ui] .kicker { color:#805609!important; }
body[data-portal-ui] a { color:#1d5c9e; }
body[data-portal-ui] .btn { min-height:44px; background:#fff!important; color:#174f88!important; border:1px solid #bacde0!important; border-radius:12px; }
body[data-portal-ui] .btn.primary { background:#1d5c9e!important; color:#fff!important; border-color:#1d5c9e!important; }
body[data-portal-ui] .btn.gold { background:#fff0ce!important; color:#795413!important; border-color:#ddc68f!important; }
body[data-portal-ui] .btn.danger { background:#fff1f1!important; color:#9b3038!important; border-color:#edc9cd!important; }
body[data-portal-ui] :is(input,select,textarea):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]) { background:#fff!important; color:var(--portal-ink)!important; border-color:#bacde0!important; font-size:1rem; color-scheme:light; }
body[data-portal-ui] :is(input,textarea)::placeholder { color:#596e83; opacity:1; }
body[data-portal-ui] :is(.portal-v539-now-item,.portal-shortcut-grid button) small { color:var(--portal-muted); }
body[data-portal-ui] :is(.notice,.pill) { background:#edf4fc; color:#365e80; border-color:#cad9e8; }
body[data-portal-ui] :is(.notice.ok,.pill.green) { background:#e8f5ed; color:#25624b; border-color:#bedbcc; }
body[data-portal-ui] :is(.notice.warn,.pill.gold) { background:#fff4dc; color:#795413; border-color:#e3cf9e; }
body[data-portal-ui] :is(.notice.error,.pill.red) { background:#fff0f0; color:#98313a; border-color:#e8c1c5; }
body[data-portal-ui] .portal-classic-shell :is(.portal-chat-page,.portal-chat-box-full,.portal-chat-conversations,.portal-chat-box-full>header,.chat-composer,.portal-chat-tab) { background:#fff!important; color:var(--portal-ink)!important; border-color:var(--portal-line)!important; }
body[data-portal-ui] .portal-classic-shell .chat-messages { background:#f4f7fb!important; }
body[data-portal-ui] .portal-classic-shell :is(.chat-bubble,.portal-chat-tab.active) { background:#e9f2fc!important; color:var(--portal-ink)!important; border-color:#c9dced!important; }
body[data-portal-ui] .portal-classic-shell :is(.chat-text,.portal-chat-title-wrap>strong,.portal-chat-tab strong) { color:var(--portal-ink)!important; }
body[data-portal-ui] .portal-classic-shell :is(.portal-chat-tab small,.portal-chat-title-wrap>span,.chat-message-meta) { color:var(--portal-muted)!important; }
body[data-portal-ui] :is(.demo-welcome,.demo-kpis article,.demo-test-controls) { color:var(--portal-ink); }
body[data-portal-ui] .demo-nav button[aria-current=page] { color:#174f88; }

/* A readable login card replaces the old form positioned over a dark bitmap. */
body[data-portal-ui].public-portal.portal-login-active { overflow:auto!important; background:#f4f7fb!important; }
body[data-portal-ui].public-portal.portal-login-active > .portal-nav { display:none!important; }
body[data-portal-ui].public-portal.portal-login-active .public-main { min-height:100svh; padding:24px 14px max(24px,env(safe-area-inset-bottom))!important; }
body[data-portal-ui].public-portal.portal-login-active .portal-login-art { position:relative!important; width:min(520px,100%)!important; height:auto!important; min-height:0!important; margin:20px auto!important; overflow:visible!important; border:1px solid #ccd9e6!important; border-radius:24px!important; background:#fff!important; box-shadow:0 16px 48px #25456612!important; }
body[data-portal-ui].public-portal.portal-login-active :is(.portal-login-art>img,.portal-art-access,.portal-mobile-art) { display:none!important; }
body[data-portal-ui].public-portal.portal-login-active .portal-art-login { position:static!important; inset:auto!important; display:block!important; width:100%!important; height:auto!important; max-width:none; margin:0!important; padding:0!important; border:0; background:transparent!important; box-shadow:none; pointer-events:auto; }
body[data-portal-ui].public-portal.portal-login-active .portal-mobile-access-card { position:static!important; inset:auto!important; display:block; padding:28px!important; border:0; border-radius:24px; background:#fff!important; box-shadow:none!important; }
body[data-portal-ui].public-portal.portal-login-active .portal-mobile-access-card::before { content:""; display:block; width:72px; height:72px; margin-bottom:18px; background:url('/assets/brand/pjs-avatar-logo.webp') center/contain no-repeat; }
body[data-portal-ui].public-portal.portal-login-active .portal-mobile-login-copy { display:block!important; margin:0 0 22px!important; }
body[data-portal-ui].public-portal.portal-login-active .portal-mobile-login-copy .kicker { color:#805609!important; font-size:.8rem; }
body[data-portal-ui].public-portal.portal-login-active .portal-mobile-login-copy h2 { margin:10px 0!important; font-size:1.8rem!important; line-height:1.2; color:#17324d; }
body[data-portal-ui].public-portal.portal-login-active .portal-mobile-login-copy p { display:block!important; margin:8px 0 0; color:#50657a; font-size:1rem!important; line-height:1.5; }
body[data-portal-ui].public-portal.portal-login-active .portal-art-login :is(.field,.portal-art-submit,.portal-art-msg) { position:static!important; width:100%!important; height:auto!important; margin:14px 0 0!important; }
body[data-portal-ui].public-portal.portal-login-active .portal-art-login .field label { position:static!important; display:block; width:auto!important; height:auto!important; margin:0 0 7px!important; padding:0!important; overflow:visible!important; clip:auto!important; white-space:normal!important; font-size:.95rem!important; color:#365e80!important; }
body[data-portal-ui].public-portal.portal-login-active .portal-art-login .field input { height:48px!important; min-height:48px!important; padding:12px!important; font-size:1rem!important; border-radius:12px!important; }
body[data-portal-ui].public-portal.portal-login-active .portal-art-login .portal-art-submit { min-height:48px!important; margin-top:22px!important; font-size:1rem!important; }
body[data-portal-ui].public-portal.portal-login-active .portal-login-help { gap:10px; }
body[data-portal-ui].public-portal.portal-login-active .portal-login-help button { min-height:44px; font-size:.85rem; line-height:1.4; }
body[data-portal-ui].public-portal.portal-login-active .portal-mobile-first-access { display:block!important; margin-top:20px; padding:12px; border-radius:12px; background:#f4f7fb; color:#50657a; font-size:.9rem; }
body[data-portal-ui].public-portal.portal-login-active .portal-mobile-first-access summary { min-height:44px; padding:10px 0; color:#174f88; }
@media(max-width:600px) { body[data-portal-ui].public-portal.portal-login-active .portal-mobile-access-card { padding:22px!important; } }