/* BeeBright warm glass: translucent surfaces, opaque readable text, existing brand accents. */
:root{--bb-glass:rgba(255,250,240,.64);--bb-glass-soft:rgba(255,244,224,.68);--bb-glass-border:rgba(255,255,250,.82);--bb-glass-line:rgba(203,166,116,.27);--bb-glass-blur:12px;--bb-glass-shadow:0 12px 32px rgba(119,77,27,.085),inset 0 1px 0 rgba(255,255,255,.92),inset 0 -1px 0 rgba(215,184,139,.14)}
html body{position:relative;isolation:isolate}
html body::after{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 12% 12%,rgba(255,232,177,.32),transparent 46%),radial-gradient(ellipse at 88% 48%,rgba(255,205,157,.22),transparent 45%),radial-gradient(ellipse at 40% 92%,rgba(255,255,255,.62),transparent 48%)}
/* Major panels. No new frames are added to editorial headings or unboxed introductions. */
html body :is(.plan-card,.quiz-card,.access-panel,.tile,aside.demo-note,.demo-cta,.insight-preview,.education-grid>article,.overview-grid>article,.steps>article,.demo-picker .tile,.subject-card,.grade-card,.profile-panel,.scope,.panel,.question-panel,.assessment-panel,.course-welcome,.course-mission,.interactive-entry,.mission-entry,.course-topic,.course-games>button,.learn-grid>.tile,.mission-panel,.mission-card,.mission-intro,.mission-welcome,.mission-task,.mission-result,.mission-stage,.garden-card,.interactive-lessons:not(.single-subject)>article,.interactive-paths>article,.activity-task,.activity-result,.interactive-saved,.interactive-access,.results-hero,.result,.subject-progress-card,.results-empty,.child,.account-empty,.subscription-preparation,.subscription-example,.source-details,.faq-list>details,form){background:linear-gradient(135deg,rgba(255,255,255,.34),rgba(255,244,220,.12)),var(--bb-glass)!important;border-color:var(--bb-glass-border)!important;box-shadow:var(--bb-glass-shadow)!important;-webkit-backdrop-filter:blur(var(--bb-glass-blur)) saturate(1.1);backdrop-filter:blur(var(--bb-glass-blur)) saturate(1.1)}
/* Smaller nested surfaces keep the glass appearance without multiplying heavy blur layers. */
html body :is(.workshop-list>a,.guide-bubble,.equal-box,.order-answer,.sort-zone,.composition-parts,.equal-boxes>section,.sequence-answer,.clue-cards>li,.reading-passage,.dialogue-line,.activity-guide p,.activity-result-metrics p,.formed-pairs>button,.insight-metrics>div,.insight-attempt,.insight-score,.policy-list>li,.source-detail-body,.subscription-badge,.billing-status,.activity-count){background:linear-gradient(135deg,rgba(255,255,255,.32),rgba(255,228,182,.14)),var(--bb-glass-soft)!important;border-color:rgba(255,255,250,.78)!important;box-shadow:0 6px 18px rgba(125,81,30,.065),inset 0 1px 0 rgba(255,255,255,.94)!important}
/* Navigation and menus share the same surface across sales, learning and accounts. */
html body :is(header.nav,.learning-header,.interactive-header,.mobile-menu nav,.profile-overlay .profile-panel,.album){background:rgba(255,250,240,.67)!important;border-color:var(--bb-glass-border)!important;box-shadow:0 8px 26px rgba(119,77,27,.07),inset 0 1px 0 rgba(255,255,255,.9)!important;-webkit-backdrop-filter:blur(var(--bb-glass-blur)) saturate(1.12);backdrop-filter:blur(var(--bb-glass-blur)) saturate(1.12)}
html body :is(header.nav,.interactive-header){border-radius:20px}
html body .interactive-header{padding:12px 16px;margin-bottom:18px}
/* Secondary actions and answer choices stay distinct from orange primary actions. */
html body :is(.secondary-button,.account-link,.warm-button,.sound-toggle,#interactive-sound-toggle,.grade-tabs>button:not([aria-pressed=true]),.option:not(.selected):not(.correct):not(.wrong),.answers>button:not(.correct):not(.wrong),.token-bank>button:not([aria-pressed=true]),.paint-palette>button:not([aria-pressed=true]),.pair-columns button:not([aria-pressed=true]),.clock-controls button,.melody-keys button,.sound-controls button,.mission-options>button:not(.picked):not(.correct):not(.wrong),.match-board button:not(.picked):not(.matched),.order-bank button){background:linear-gradient(135deg,rgba(255,255,255,.5),rgba(255,230,190,.22)),rgba(255,248,233,.64)!important;border-color:rgba(230,198,150,.58)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.96),0 4px 12px rgba(117,78,29,.07)!important;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
html body :is(.primary,.button,.access-primary,.child-start,.continue-button,.result-continue,#email-form button,#code-form button){background:linear-gradient(135deg,rgba(255,189,114,.92),rgba(249,143,69,.88))!important;border-color:rgba(255,236,197,.82)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.68),0 4px 0 rgba(190,113,51,.62),0 8px 22px rgba(217,140,53,.15)!important;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}
html body :is(.grade-tabs button[aria-pressed=true],.token-bank button[aria-pressed=true],.pair-columns button[aria-pressed=true],.plan-card.featured){background:linear-gradient(135deg,rgba(255,244,212,.86),rgba(255,214,151,.66))!important;border-color:rgba(213,155,75,.64)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 5px 15px rgba(165,104,30,.13)!important}
html body :is(input,select,textarea){background:rgba(255,254,248,.78)!important;border-color:rgba(174,145,103,.65)!important;box-shadow:inset 0 2px 5px rgba(116,79,35,.035),0 1px 0 rgba(255,255,255,.9)}
@media(max-width:700px){:root{--bb-glass-blur:6px;--bb-glass:rgba(255,250,240,.75);--bb-glass-soft:rgba(255,244,224,.76)}html body :is(.token-bank>button,.pair-columns button,.clock-controls button,.melody-keys button,.sound-controls button,.workshop-list>a){-webkit-backdrop-filter:none;backdrop-filter:none}html body .interactive-header{padding:10px 12px;gap:8px}}
@media(prefers-reduced-transparency:reduce){:root{--bb-glass:#fffaf3;--bb-glass-soft:#fff4e3;--bb-glass-blur:0px}html body::after{display:none}html body :is(button,a,input,select,textarea,header,.profile-panel){-webkit-backdrop-filter:none!important;backdrop-filter:none!important}html body :is(.primary,.button,.access-primary,.child-start,.continue-button,.result-continue){background:#ff984f!important}html body :is(.secondary-button,.account-link,.warm-button,#interactive-sound-toggle,.option,.answers>button){background:#fff6e8!important}}
@media(forced-colors:active){html body::after{display:none}html body :is(article,form,header,.activity-task,.activity-result,.profile-panel,.workshop-list>a,input,select,textarea,button,.primary,.button){background:Canvas!important;box-shadow:none!important;border-color:CanvasText!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}}
@media print{html body::after{display:none}html body *{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;box-shadow:none!important}}

/* Reading destinations do not need a control-shaped focus frame. */
html body :is(h1,h2,h3)[tabindex="-1"]:focus,html body :is(h1,h2,h3)[tabindex="-1"]:focus-visible{outline:none!important;outline-offset:0!important}
@media(max-width:360px){html body .interactive-header{padding:10px 8px;gap:6px}.interactive-header .brand{font-size:24px}.interactive-header #interactive-sound-toggle{font-size:11px;padding:8px 10px}}
/* Preserve comfortable touch targets across older and newer screens. */
html body :is(button,input:not([type=checkbox]):not([type=radio]),select,summary,a.button,a.primary,a.back,.hub-back,.account-link,.help-link,.sound-toggle){min-height:44px!important}
html body :is(button,a.button,a.primary,a.back,.hub-back,.account-link,.sound-toggle){min-width:44px!important}
/* A blurred ancestor would trap the legacy fixed mobile answer bar. */
@media(max-width:700px){html body.quiz-active :is(.panel,.question-panel,.assessment-panel){-webkit-backdrop-filter:none!important;backdrop-filter:none!important}html body.quiz-active .quiz-actions{background:rgba(255,250,240,.86)!important;box-shadow:0 -8px 22px rgba(118,80,33,.07),inset 0 1px 0 rgba(255,255,255,.9)!important;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}}

html body .interactive-entry{text-decoration:none}
