/* V1.1.0 shared glass material layer. Layout stays owned by each screen module. */
:root {
  --glass-panel: linear-gradient(145deg, rgba(151, 225, 235, .13), rgba(8, 28, 41, .62) 46%, rgba(3, 13, 22, .54));
  --glass-panel-strong: linear-gradient(145deg, rgba(151, 225, 235, .16), rgba(7, 25, 38, .76) 48%, rgba(2, 11, 19, .7));
  --glass-control-sheen: linear-gradient(180deg, rgba(239, 255, 255, .12), rgba(103, 228, 214, .035) 48%, rgba(0, 7, 13, .08));
  --glass-control: rgba(8, 30, 42, .52);
  --glass-control-hover: rgba(30, 91, 103, .62);
  --glass-border: rgba(184, 235, 241, .28);
  --glass-border-strong: rgba(213, 248, 252, .42);
  --glass-highlight: rgba(245, 255, 255, .17);
  --glass-shadow: inset 1px 1px 0 var(--glass-highlight), inset -1px -1px 0 rgba(103, 228, 214, .06), 0 16px 40px rgba(0, 0, 0, .22);
  --glass-shadow-control: inset 1px 1px 0 rgba(245, 255, 255, .15), inset 0 0 18px rgba(103, 228, 214, .045), 0 8px 22px rgba(0, 0, 0, .16);
  --glass-shadow-hover: inset 1px 1px 0 rgba(255, 255, 255, .24), inset 0 0 24px rgba(103, 228, 214, .11), 0 15px 34px rgba(0, 0, 0, .24), 0 0 24px rgba(103, 228, 214, .12);
  --glass-shadow-selected: inset 1px 1px 0 rgba(255, 255, 255, .28), inset 0 0 28px rgba(103, 228, 214, .16), 0 12px 30px rgba(0, 0, 0, .22), 0 0 0 1px rgba(103, 228, 214, .28), 0 0 28px rgba(103, 228, 214, .18);
  --glass-shadow-pressed: inset 0 2px 12px rgba(0, 5, 10, .34), inset 0 0 18px rgba(103, 228, 214, .08), 0 4px 10px rgba(0, 0, 0, .16);
  --glass-blur: blur(18px) saturate(1.2) brightness(1.035);
  --glass-blur-compact: blur(11px) saturate(1.16) brightness(1.03);
}

/* Shared navigation chrome */
.ritual-header,
.minimal-header,
.learn-header,
.cockpit-top,
.cockpit-header,
.learning-topbar,
.talent-header,
.insight-topbar {
  border-color: var(--glass-border);
  background: linear-gradient(180deg, rgba(8, 28, 41, .72), rgba(3, 13, 22, .46));
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
  box-shadow: inset 0 -1px 0 rgba(238, 255, 255, .07), 0 12px 34px rgba(0, 0, 0, .14);
}

/* Onboarding, profile, and early journey screens */
.life-caption,
.aside-copy,
.profile-use,
.profile-recycle-item,
.privacy-note,
.option,
.dna-card,
.dna-primary-action,
.inference-evidence,
.stage-caption,
.ideal-field,
.injection-console,
.key-code,
.key-rights,
.boarding-console,
.command-bar,
.cockpit-nav,
.context-card,
.source-rail,
.source-card,
.content-column,
.notes-column,
.ai-draft,
.self-check,
.probe,
.evidence-card-large,
.growth-log,
.growth-stats span,
.audit,
.beacon-form,
.beacon-note,
.visibility {
  border-color: var(--glass-border);
  background: var(--glass-panel);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
  box-shadow: var(--glass-shadow);
}

.option.is-selected,
.visibility button.is-selected {
  border-color: rgba(103, 228, 214, .58);
  background: linear-gradient(145deg, rgba(75, 171, 181, .28), rgba(8, 29, 42, .6));
}

input:not([type="checkbox"]):not([type="radio"]),
textarea,
select {
  border-color: rgba(193, 237, 241, .25);
  background-color: rgba(5, 23, 34, .52);
  background-image: linear-gradient(180deg, rgba(237, 255, 255, .07), rgba(103, 228, 214, .018));
  -webkit-backdrop-filter: var(--glass-blur-compact);
  backdrop-filter: var(--glass-blur-compact);
  box-shadow: inset 1px 1px 0 rgba(247, 255, 255, .08), inset 0 0 20px rgba(103, 228, 214, .035);
}

input:not([type="checkbox"]):not([type="radio"]):focus,
textarea:focus,
select:focus {
  border-color: rgba(103, 228, 214, .66);
  background-color: rgba(7, 31, 43, .68);
  box-shadow: inset 1px 1px 0 rgba(247, 255, 255, .12), 0 0 0 3px rgba(103, 228, 214, .08);
}

/* Every visible command gets a translucent reflective layer. Visual map nodes keep their own material. */
:where(.screen, .usable-cockpit, .learning-prototype, .talent-screen, .insight-app)
:where(button:not(.knowledge-marker):not(.map-node):not(.map-3d-label):not(.talent-icon-node):not(.spine-domain-label)) {
  background-color: var(--glass-control);
  background-image: var(--glass-control-sheen);
  -webkit-backdrop-filter: var(--glass-blur-compact);
  backdrop-filter: var(--glass-blur-compact);
  box-shadow: var(--glass-shadow-control);
  transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease, color .18s ease, transform .18s ease;
}

:where(.screen, .usable-cockpit, .learning-prototype, .talent-screen, .insight-app)
:where(button:not(:disabled):not(.knowledge-marker):not(.map-node):not(.map-3d-label):not(.talent-icon-node):not(.spine-domain-label):hover) {
  border-color: var(--glass-border-strong);
  background-color: var(--glass-control-hover);
  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .2), inset 0 0 22px rgba(103, 228, 214, .08), 0 11px 28px rgba(0, 0, 0, .2);
}

.btn,
.text-btn,
.back-link,
.learning-back,
.explorer-actions a,
.atom-heading-actions a,
.atom-next-card > a,
.map-inspector-actions a,
.evidence-empty a,
.evidence-record footer a,
.evidence-paused > div > a,
.talent-header-actions a,
.talent-empty-actions a,
.insight-button,
.insight-icon-button {
  border-color: var(--glass-border);
  background-color: var(--glass-control);
  background-image: var(--glass-control-sheen);
  -webkit-backdrop-filter: var(--glass-blur-compact);
  backdrop-filter: var(--glass-blur-compact);
  box-shadow: var(--glass-shadow-control);
}

/* Global interaction states: lift on hover, compress on press, glow while selected. */
:is(.screen, .usable-cockpit, .learning-prototype, .talent-screen, .insight-app)
button:not(.knowledge-marker):not(.map-node):not(.map-3d-label):not(.talent-icon-node):not(.spine-domain-label):not(:disabled) {
  transform-origin: center;
  will-change: transform, filter;
}

:is(.screen, .usable-cockpit, .learning-prototype, .talent-screen, .insight-app)
button:not(.knowledge-marker):not(.map-node):not(.map-3d-label):not(.talent-icon-node):not(.spine-domain-label):not(:disabled):is(:hover, :focus-visible) {
  transform: translate3d(0, -3px, 0);
  filter: brightness(1.09) saturate(1.08);
  box-shadow: var(--glass-shadow-hover);
}

:is(.screen, .usable-cockpit, .learning-prototype, .talent-screen, .insight-app)
button:not(.knowledge-marker):not(.map-node):not(.map-3d-label):not(.talent-icon-node):not(.spine-domain-label):not(:disabled):active {
  transform: translate3d(0, 1px, 0) scale(.985);
  filter: brightness(.98) saturate(1.04);
  box-shadow: var(--glass-shadow-pressed);
  transition-duration: .07s;
}

:is(.screen, .usable-cockpit, .learning-prototype, .talent-screen, .insight-app)
button:not(.knowledge-marker):not(.map-node):not(.map-3d-label):not(.talent-icon-node):not(.spine-domain-label):not(:disabled):is(.is-selected, .is-active, [aria-pressed="true"], [aria-expanded="true"], [aria-current]):not(:active) {
  transform: translate3d(0, -1px, 0);
  filter: brightness(1.07) saturate(1.12);
  border-color: var(--glass-border-strong);
  background-color: var(--glass-control-hover);
  box-shadow: var(--glass-shadow-selected);
}

:is(
  .btn,
  .text-btn,
  .back-link,
  .learning-back,
  .explorer-actions a,
  .atom-heading-actions a,
  .atom-next-card > a,
  .map-inspector-actions a,
  .map-accessible-list li a,
  .evidence-empty a,
  .evidence-record footer a,
  .evidence-paused > div > a,
  .talent-header-actions a,
  .talent-empty-actions a,
  .insight-button,
  .insight-icon-button,
  .insight-nav-item,
  .insight-material-actions a,
  .top-commands a,
  .side-rail a,
  .flight-meta,
  .knowledge-node-card,
  .insight-library-card
):not([aria-disabled="true"]) {
  transform-origin: center;
  will-change: transform, filter;
  transition: transform .18s cubic-bezier(.2, .75, .25, 1), filter .18s ease, border-color .18s ease, background-color .18s ease, box-shadow .18s ease, color .18s ease;
}

:is(
  .btn,
  .text-btn,
  .back-link,
  .learning-back,
  .explorer-actions a,
  .atom-heading-actions a,
  .atom-next-card > a,
  .map-inspector-actions a,
  .map-accessible-list li a,
  .evidence-empty a,
  .evidence-record footer a,
  .evidence-paused > div > a,
  .talent-header-actions a,
  .talent-empty-actions a,
  .insight-button,
  .insight-icon-button,
  .insight-nav-item,
  .insight-material-actions a,
  .top-commands a,
  .side-rail a,
  .flight-meta,
  .knowledge-node-card,
  .insight-library-card
):not([aria-disabled="true"]):is(:hover, :focus-visible) {
  transform: translate3d(0, -3px, 0);
  filter: brightness(1.09) saturate(1.08);
  box-shadow: var(--glass-shadow-hover);
}

:is(
  .btn,
  .text-btn,
  .back-link,
  .learning-back,
  .explorer-actions a,
  .atom-heading-actions a,
  .atom-next-card > a,
  .map-inspector-actions a,
  .map-accessible-list li a,
  .evidence-empty a,
  .evidence-record footer a,
  .evidence-paused > div > a,
  .talent-header-actions a,
  .talent-empty-actions a,
  .insight-button,
  .insight-icon-button,
  .insight-nav-item,
  .insight-material-actions a,
  .top-commands a,
  .side-rail a,
  .flight-meta,
  .knowledge-node-card,
  .insight-library-card
):not([aria-disabled="true"]):active {
  transform: translate3d(0, 1px, 0) scale(.985);
  filter: brightness(.98) saturate(1.04);
  box-shadow: var(--glass-shadow-pressed);
  transition-duration: .07s;
}

:is(
  .btn,
  .text-btn,
  .back-link,
  .learning-back,
  .explorer-actions a,
  .atom-heading-actions a,
  .atom-next-card > a,
  .map-inspector-actions a,
  .map-accessible-list li a,
  .evidence-empty a,
  .evidence-record footer a,
  .evidence-paused > div > a,
  .talent-header-actions a,
  .talent-empty-actions a,
  .insight-button,
  .insight-icon-button,
  .insight-nav-item,
  .insight-material-actions a,
  .top-commands a,
  .side-rail a,
  .flight-meta,
  .knowledge-node-card,
  .insight-library-card
):not([aria-disabled="true"]):is(.is-selected, .is-active, [aria-pressed="true"], [aria-expanded="true"], [aria-current]):not(:active) {
  transform: translate3d(0, -1px, 0);
  filter: brightness(1.07) saturate(1.12);
  border-color: var(--glass-border-strong);
  background-color: var(--glass-control-hover);
  box-shadow: var(--glass-shadow-selected);
}

.learning-source-card {
  transform-origin: center;
  transition: transform .18s cubic-bezier(.2, .75, .25, 1), filter .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.learning-source-card:hover,
.learning-source-card:focus-within {
  transform: translate3d(0, -2px, 0);
  filter: brightness(1.045) saturate(1.05);
  box-shadow: var(--glass-shadow-hover);
}

.learning-source-card.is-active {
  transform: translate3d(0, -1px, 0);
  filter: brightness(1.07) saturate(1.12);
  border-color: var(--glass-border-strong);
  box-shadow: var(--glass-shadow-selected);
}

/* A selected control still rises fully when the pointer returns to it. */
:is(.screen, .usable-cockpit, .learning-prototype, .talent-screen, .insight-app)
:is(
  button:not(.knowledge-marker):not(.map-node):not(.map-3d-label):not(.talent-icon-node):not(.spine-domain-label),
  .btn,
  .text-btn,
  .back-link,
  .learning-back,
  .insight-button,
  .insight-icon-button,
  .insight-nav-item,
  .flight-meta,
  .knowledge-node-card,
  .insight-library-card,
  .learning-source-card
):is(.is-selected, .is-active, [aria-pressed="true"], [aria-expanded="true"], [aria-current]):is(:hover, :focus-visible):not(:active) {
  transform: translate3d(0, -3px, 0);
  filter: brightness(1.12) saturate(1.14);
  border-color: var(--glass-border-strong);
  box-shadow: var(--glass-shadow-selected);
}

.btn.primary,
.insight-button.is-primary,
.top-commands .insight-command,
.workspace-success-actions .is-primary,
.talent-empty-actions .is-primary {
  border-color: rgba(112, 242, 224, .62);
  color: #effffc;
  background: linear-gradient(180deg, rgba(78, 198, 187, .58), rgba(13, 93, 91, .5));
  box-shadow: inset 1px 1px 0 rgba(244, 255, 255, .25), inset 0 0 24px rgba(103, 228, 214, .15), 0 12px 30px rgba(19, 123, 127, .2);
}

.btn.gold,
.insight-button.is-gold,
.injection-trigger,
.boarding-trigger {
  border-color: rgba(255, 218, 148, .62);
  color: #fff6dd;
  background: linear-gradient(180deg, rgba(199, 144, 69, .62), rgba(91, 55, 21, .58));
  box-shadow: inset 1px 1px 0 rgba(255, 249, 225, .24), inset 0 0 24px rgba(242, 190, 114, .13), 0 12px 30px rgba(122, 76, 26, .2);
}

/* Cockpit: keep the organism unframed while all surrounding controls use one material. */
.top-commands,
.flight-meta,
.side-rail,
.mission-card,
.domain-empty-state,
.domain-overview-card,
.domain-summary,
.domain-data-viz,
.cockpit-domain-superpower,
.talent-panel,
.talent-ledger,
.ai-assistant-dialog,
.cockpit-footer,
.domain-archive-dialog > section,
.today-action-dialog,
.route-dialog > form,
.cockpit-workspace-dialog > section,
.workspace-section,
.workspace-success,
.cockpit-direction-card {
  border-color: var(--glass-border);
  background: var(--glass-panel);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
  box-shadow: var(--glass-shadow);
}

.top-commands a,
.side-rail a,
.flight-meta,
.knowledge-marker,
.stage-ticker,
.domain-detail-back,
.domain-detail-archive,
.domain-start-action,
.domain-assistant-action,
.cockpit-footer button,
.today-action-dialog button,
.domain-archive-dialog button,
.cockpit-workspace-dialog button,
.ai-assistant-dialog button {
  -webkit-backdrop-filter: var(--glass-blur-compact);
  backdrop-filter: var(--glass-blur-compact);
}

.top-commands a:hover,
.side-rail a:hover,
.side-rail a:focus-visible {
  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .14), inset 0 0 22px rgba(103, 228, 214, .075);
}

.viewport-shell {
  border-color: rgba(205, 244, 249, .36);
  box-shadow: inset 0 1px rgba(247, 255, 255, .2), inset 0 0 92px rgba(1, 7, 12, .56), 0 24px 84px rgba(0, 0, 0, .24);
}

/* Learning, evidence, growth, knowledge nodes, and the complete map. */
.learning-route,
.learning-local,
.reading-trigger,
.reading-panel,
.focus-timer,
.source-library,
.source-library-tools,
.source-filter-tabs,
.learning-source-card,
.learning-content,
.today-learning-context,
.talent-learning-context,
.material-stage,
.material-timeline-entry,
.material-web-reader,
.material-pdf-reader,
.material-extraction,
.note-panel,
.note-panel-header,
.note-toolbar-edit,
.note-toolbar-edit > details[open],
.note-toolbar,
.note-ai-panel,
.note-ai-message,
.note-mindmap-workspace,
.explorer-toolbar,
.knowledge-node-card,
.map-visual-panel,
.map-inspector-panel,
.map-accessible-list,
.map-relation-inspector li,
.atom-state-panel,
.atom-record-card,
.probe-context,
.probe-card,
.review-copy article,
.evidence-record,
.evidence-paused,
.evidence-empty,
.growth-confirmation,
.growth-summary,
.material-dialog > form,
dialog[data-material-dialog] > form {
  border-color: var(--glass-border);
  background: var(--glass-panel);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
  box-shadow: var(--glass-shadow);
}

.source-library-tools button,
.source-filter-tabs button,
.source-ai-discovery-button,
.learning-source-card button,
.material-stage button,
.material-timeline-entry button,
.note-toolbar button,
.note-toolbar-edit button,
.note-panel-header button,
.map-stage-controls button,
.explorer-filter button,
.probe-actions button,
.evidence-record footer button,
dialog[data-material-dialog] button {
  border-color: var(--glass-border);
  background-color: var(--glass-control);
  background-image: var(--glass-control-sheen);
}

.map-3d-label,
.map-core-node,
.map-domain-node,
.map-atom-node {
  -webkit-backdrop-filter: blur(8px) saturate(1.2);
  backdrop-filter: blur(8px) saturate(1.2);
  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .13), 0 8px 22px rgba(0, 0, 0, .2);
}

/* Talent tree, worldview content, goals, dialogs, and all supporting panes. */
.talent-header,
.spine-pane,
.growth-pane,
.talent-empty-core,
.spine-core-caption,
.spine-controls,
.talent-branch-tabs,
.flow-spotlight,
.flow-all,
.talent-detail-card,
.talent-evidence-card,
.parallel-domains-card,
.market-reference-card,
.goals-card,
.milestones-card,
.game-branch-tabs,
.game-goal-bar,
.talent-level-strip,
.talent-page-sidebar,
.talent-page-board,
.talent-tree-surface,
.talent-tree-column-panel,
.game-inspector,
.talent-category-bar .game-branch-tabs,
.goal-hero,
.goal-step-row,
.talent-dialog > form,
.talent-dialog > section {
  border-color: var(--glass-border);
  background-color: rgba(5, 20, 30, .54);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
  box-shadow: var(--glass-shadow);
}

.talent-header-actions button,
.talent-branch-tabs button,
.game-branch-tabs button,
.talent-level-strip button,
.talent-page-actions button,
.goal-step-row > button,
.spine-controls button,
.talent-dialog button {
  border-color: var(--glass-border);
  background-color: var(--glass-control);
  background-image: var(--glass-control-sheen);
  -webkit-backdrop-filter: var(--glass-blur-compact);
  backdrop-filter: var(--glass-blur-compact);
}

.talent-icon-frame,
.talent-page-branch-icon,
.game-branch-icon,
.spine-domain-label {
  -webkit-backdrop-filter: blur(8px) saturate(1.2);
  backdrop-filter: blur(8px) saturate(1.2);
  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .15), 0 7px 18px rgba(0, 0, 0, .22);
}

/* Insight flow uses the same glass hierarchy in both themes. */
.insight-app {
  --insight-panel: rgba(8, 27, 40, .58);
  --insight-panel-strong: rgba(14, 48, 61, .64);
  --insight-input: rgba(5, 22, 33, .48);
  --insight-shadow: var(--glass-shadow);
  background:
    radial-gradient(circle at 76% 12%, rgba(85, 69, 157, .16), transparent 31%),
    radial-gradient(circle at 24% 30%, rgba(38, 123, 132, .18), transparent 34%),
    linear-gradient(145deg, #04101a, #071b27 55%, #05121c);
}

.insight-topbar,
.insight-sidebar,
.insight-panel,
.insight-progress li,
.insight-library-card,
.insight-mode-badge,
.insight-link-entry,
.insight-material-thumb,
.insight-material-ai-note,
.insight-saved-record blockquote,
.insight-question-list li {
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
  box-shadow: var(--glass-shadow);
}

.insight-sidebar,
.insight-panel,
.insight-progress li,
.insight-library-card {
  background: var(--glass-panel);
}

.insight-nav-item,
.insight-icon-button,
.insight-material-tools button,
.insight-material-actions a,
.insight-material-actions button,
.insight-link-entry button,
.insight-button {
  -webkit-backdrop-filter: var(--glass-blur-compact);
  backdrop-filter: var(--glass-blur-compact);
  box-shadow: var(--glass-shadow-control);
}

.insight-nav-item.is-active {
  background: linear-gradient(145deg, rgba(78, 187, 178, .22), rgba(8, 31, 43, .58));
}

.insight-app[data-theme="light"] {
  --glass-panel: linear-gradient(145deg, rgba(255, 255, 255, .72), rgba(238, 248, 246, .54) 54%, rgba(220, 238, 236, .5));
  --glass-panel-strong: linear-gradient(145deg, rgba(255, 255, 255, .86), rgba(231, 244, 241, .7));
  --glass-control: rgba(245, 252, 250, .6);
  --glass-control-hover: rgba(220, 242, 238, .78);
  --glass-border: rgba(46, 107, 108, .23);
  --glass-border-strong: rgba(26, 119, 116, .48);
  --glass-highlight: rgba(255, 255, 255, .9);
  --glass-shadow: inset 1px 1px 0 rgba(255, 255, 255, .94), inset -1px -1px 0 rgba(45, 105, 108, .06), 0 16px 38px rgba(45, 77, 75, .1);
  --glass-shadow-control: inset 1px 1px 0 rgba(255, 255, 255, .94), inset 0 0 16px rgba(255, 255, 255, .34), 0 8px 20px rgba(45, 77, 75, .08);
  --glass-shadow-hover: inset 1px 1px 0 rgba(255, 255, 255, .98), inset 0 0 22px rgba(32, 138, 132, .09), 0 14px 30px rgba(45, 77, 75, .13), 0 0 22px rgba(32, 138, 132, .1);
  --glass-shadow-selected: inset 1px 1px 0 rgba(255, 255, 255, .98), inset 0 0 25px rgba(32, 138, 132, .13), 0 12px 28px rgba(45, 77, 75, .12), 0 0 0 1px rgba(26, 119, 116, .24), 0 0 24px rgba(32, 138, 132, .13);
  --insight-bg: #e9f2ef;
  --insight-panel: rgba(252, 255, 254, .64);
  --insight-panel-strong: rgba(233, 246, 242, .74);
  --insight-input: rgba(250, 254, 252, .62);
  background:
    radial-gradient(circle at 76% 12%, rgba(126, 111, 184, .13), transparent 31%),
    radial-gradient(circle at 24% 30%, rgba(89, 167, 164, .18), transparent 34%),
    linear-gradient(145deg, #edf5f2, #e3efed 55%, #f2f7f5);
}

.insight-app[data-theme="light"] .insight-topbar,
.insight-app[data-theme="light"] .insight-sidebar,
.insight-app[data-theme="light"] .insight-panel,
.insight-app[data-theme="light"] .insight-progress li,
.insight-app[data-theme="light"] .insight-library-card {
  background: var(--glass-panel);
}

.insight-app[data-theme="light"] input,
.insight-app[data-theme="light"] textarea,
.insight-app[data-theme="light"] select {
  border-color: var(--glass-border);
  color: var(--insight-text);
  background-color: rgba(255, 255, 255, .62);
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .8), rgba(223, 241, 237, .34));
}

dialog::backdrop {
  background: rgba(0, 8, 14, .54);
  -webkit-backdrop-filter: blur(7px) saturate(1.08);
  backdrop-filter: blur(7px) saturate(1.08);
}

/* Daylight reading mode keeps the existing palette and gains transparent depth. */
.reading-soft {
  --glass-panel: linear-gradient(145deg, rgba(255, 255, 255, .76), rgba(236, 247, 244, .58) 54%, rgba(220, 237, 235, .5));
  --glass-control: rgba(246, 252, 250, .66);
  --glass-control-hover: rgba(217, 239, 235, .82);
  --glass-border: rgba(43, 103, 108, .23);
  --glass-border-strong: rgba(40, 127, 127, .48);
  --glass-highlight: rgba(255, 255, 255, .94);
  --glass-shadow: inset 1px 1px 0 rgba(255, 255, 255, .94), inset -1px -1px 0 rgba(43, 103, 108, .05), 0 15px 36px rgba(52, 87, 85, .09);
  --glass-shadow-control: inset 1px 1px 0 rgba(255, 255, 255, .95), 0 7px 18px rgba(52, 87, 85, .07);
  --glass-shadow-hover: inset 1px 1px 0 rgba(255, 255, 255, .98), inset 0 0 22px rgba(40, 127, 127, .08), 0 14px 30px rgba(52, 87, 85, .12), 0 0 22px rgba(40, 127, 127, .09);
  --glass-shadow-selected: inset 1px 1px 0 rgba(255, 255, 255, .98), inset 0 0 25px rgba(40, 127, 127, .12), 0 12px 28px rgba(52, 87, 85, .11), 0 0 0 1px rgba(40, 127, 127, .22), 0 0 24px rgba(40, 127, 127, .12);
}

.reading-soft .learning-topbar,
.reading-soft .reading-panel,
.reading-soft .explorer-toolbar,
.reading-soft .knowledge-node-card,
.reading-soft .map-visual-panel,
.reading-soft .map-inspector-panel,
.reading-soft .map-accessible-list,
.reading-soft .atom-state-panel,
.reading-soft .atom-record-card {
  border-color: var(--glass-border);
  background: var(--glass-panel);
  box-shadow: var(--glass-shadow);
}

.reading-soft input:not([type="checkbox"]):not([type="radio"]),
.reading-soft textarea,
.reading-soft select {
  border-color: var(--glass-border);
  color: #173d40;
  background-color: rgba(255, 255, 255, .62);
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .82), rgba(224, 241, 237, .38));
  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .94), inset 0 0 18px rgba(255, 255, 255, .3);
}

@media (max-width: 820px) {
  :root {
    --glass-blur: blur(13px) saturate(1.15) brightness(1.025);
    --glass-blur-compact: blur(8px) saturate(1.12) brightness(1.02);
    --glass-shadow: inset 1px 1px 0 var(--glass-highlight), 0 10px 26px rgba(0, 0, 0, .16);
  }

  .insight-sidebar {
    background: linear-gradient(90deg, rgba(8, 28, 41, .76), rgba(8, 33, 44, .62));
  }

  .insight-app[data-theme="light"] .insight-sidebar {
    background: linear-gradient(90deg, rgba(250, 255, 253, .82), rgba(231, 244, 241, .7));
  }
}

@media (prefers-reduced-transparency: reduce) {
  :root {
    --glass-panel: rgba(7, 23, 34, .94);
    --glass-panel-strong: rgba(5, 18, 28, .98);
    --glass-control: rgba(9, 31, 43, .94);
  }
}

@media (prefers-reduced-motion: reduce) {
  :is(.screen, .usable-cockpit, .learning-prototype, .talent-screen, .insight-app) button,
  :is(.btn, .text-btn, .back-link, .learning-back, .explorer-actions a, .atom-heading-actions a, .atom-next-card > a, .map-inspector-actions a, .map-accessible-list li a, .evidence-empty a, .evidence-record footer a, .evidence-paused > div > a, .talent-header-actions a, .talent-empty-actions a, .insight-button, .insight-icon-button, .insight-nav-item, .insight-material-actions a, .top-commands a, .side-rail a, .flight-meta, .knowledge-node-card, .insight-library-card),
  .learning-source-card {
    transform: none !important;
    will-change: auto;
    transition-duration: .01ms !important;
  }
}

/* V1.1.0 unified command material. Keep content nodes out of this baseline. */
:root {
  --glass-button-text: #edf7f3;
  --glass-button-text-muted: #c6d9d5;
  --glass-button-accent: #65dfcf;
  --glass-button-gold: #efbd73;
}

.reading-soft,
.insight-app[data-theme="light"],
.discovery-app[data-theme="light"] {
  --glass-control: rgba(246, 252, 250, .66);
  --glass-control-hover: rgba(217, 239, 235, .82);
  --glass-control-sheen: linear-gradient(180deg, rgba(255, 255, 255, .76), rgba(40, 127, 127, .035) 48%, rgba(255, 255, 255, .08));
  --glass-border: rgba(43, 103, 108, .23);
  --glass-border-strong: rgba(40, 127, 127, .48);
  --glass-highlight: rgba(255, 255, 255, .94);
  --glass-shadow-control: inset 1px 1px 0 rgba(255, 255, 255, .95), inset 0 0 16px rgba(40, 127, 127, .08), 0 7px 18px rgba(52, 87, 85, .07);
  --glass-shadow-hover: inset 1px 1px 0 rgba(255, 255, 255, .98), inset 0 0 22px rgba(40, 127, 127, .08), 0 14px 30px rgba(52, 87, 85, .12), 0 0 22px rgba(40, 127, 127, .09);
  --glass-shadow-selected: inset 1px 1px 0 rgba(255, 255, 255, .98), inset 0 0 25px rgba(40, 127, 127, .12), 0 12px 28px rgba(52, 87, 85, .11), 0 0 0 1px rgba(40, 127, 127, .22), 0 0 24px rgba(40, 127, 127, .12);
  --glass-shadow-pressed: inset 0 2px 12px rgba(38, 83, 82, .18), inset 0 0 18px rgba(40, 127, 127, .06), 0 4px 10px rgba(52, 87, 85, .08);
  --glass-button-text: #244348;
  --glass-button-text-muted: #466966;
  --glass-button-accent: #287f7f;
  --glass-button-gold: #9a641d;
}

:is(
  .screen,
  .usable-cockpit,
  .learning-prototype,
  .talent-screen,
  .insight-app,
  .discovery-app
) :is(
  button,
  a,
  [role="button"]
):where(:not(.knowledge-marker):not(.map-node):not(.map-3d-label):not(.talent-icon-node):not(.spine-domain-label):not(.note-source-block):not(.brand):not(.discovery-brand):not(.discovery-skip):not(.skip-link):not(.learning-skip):not(.insight-skip):not(.insight-brand):not(.learning-brand):not(.cockpit-brand):not(.talent-brand)) {
  border-width: 1px !important;
  border-style: solid !important;
  border-color: var(--glass-border) !important;
  color: var(--glass-button-text) !important;
  background-color: var(--glass-control) !important;
  background-image: var(--glass-control-sheen) !important;
  -webkit-backdrop-filter: var(--glass-blur-compact) !important;
  backdrop-filter: var(--glass-blur-compact) !important;
  box-shadow: var(--glass-shadow-control) !important;
  transition: transform .18s cubic-bezier(.2, .75, .25, 1), filter .18s ease, border-color .18s ease, background-color .18s ease, box-shadow .18s ease, color .18s ease !important;
}

:is(
  .screen,
  .usable-cockpit,
  .learning-prototype,
  .talent-screen,
  .insight-app,
  .discovery-app
) :is(
  button,
  a,
  [role="button"]
):where(:not(:disabled):not([aria-disabled="true"]):not(.knowledge-marker):not(.map-node):not(.map-3d-label):not(.talent-icon-node):not(.spine-domain-label):not(.note-source-block):not(.brand):not(.discovery-brand):not(.discovery-skip):not(.skip-link):not(.learning-skip):not(.insight-skip):not(.insight-brand):not(.learning-brand):not(.cockpit-brand):not(.talent-brand)):is(:hover, :focus-visible) {
  transform: translate3d(0, -3px, 0) !important;
  filter: brightness(1.09) saturate(1.08) !important;
  border-color: var(--glass-border-strong) !important;
  background-color: var(--glass-control-hover) !important;
  box-shadow: var(--glass-shadow-hover) !important;
}

:is(
  .screen,
  .usable-cockpit,
  .learning-prototype,
  .talent-screen,
  .insight-app,
  .discovery-app
) :is(
  button,
  a,
  [role="button"]
):where(:not(:disabled):not([aria-disabled="true"]):not(.knowledge-marker):not(.map-node):not(.map-3d-label):not(.talent-icon-node):not(.spine-domain-label):not(.note-source-block):not(.brand):not(.discovery-brand):not(.discovery-skip):not(.skip-link):not(.learning-skip):not(.insight-skip):not(.insight-brand):not(.learning-brand):not(.cockpit-brand):not(.talent-brand)):active {
  transform: translate3d(0, 1px, 0) scale(.985) !important;
  filter: brightness(.98) saturate(1.04) !important;
  box-shadow: var(--glass-shadow-pressed) !important;
  transition-duration: .07s !important;
}

:is(
  .screen,
  .usable-cockpit,
  .learning-prototype,
  .talent-screen,
  .insight-app,
  .discovery-app
) :is(
  button,
  a,
  [role="button"]
):where(:not(:disabled):not([aria-disabled="true"]):not(.knowledge-marker):not(.map-node):not(.map-3d-label):not(.talent-icon-node):not(.spine-domain-label):not(.note-source-block):not(.brand):not(.discovery-brand):not(.discovery-skip):not(.skip-link):not(.learning-skip):not(.insight-skip):not(.insight-brand):not(.learning-brand):not(.cockpit-brand):not(.talent-brand)):is(.is-selected, .is-active, [aria-pressed="true"], [aria-expanded="true"], [aria-current]):not(:active) {
  transform: translate3d(0, -1px, 0) !important;
  filter: brightness(1.07) saturate(1.12) !important;
  border-color: var(--glass-border-strong) !important;
  background-color: var(--glass-control-hover) !important;
  box-shadow: var(--glass-shadow-selected) !important;
}

:is(
  .screen,
  .usable-cockpit,
  .learning-prototype,
  .talent-screen,
  .insight-app,
  .discovery-app
) :is(.btn.primary, .insight-button.is-primary, .discovery-button.is-primary, .is-primary) {
  color: var(--glass-button-text) !important;
  border-color: color-mix(in srgb, var(--glass-button-accent) 70%, var(--glass-border-strong)) !important;
  background-color: color-mix(in srgb, var(--glass-button-accent) 19%, var(--glass-control)) !important;
  background-image: var(--glass-control-sheen) !important;
  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .22), inset 0 0 22px color-mix(in srgb, var(--glass-button-accent) 16%, transparent), 0 10px 26px color-mix(in srgb, var(--glass-button-accent) 15%, transparent) !important;
}

:is(
  .screen,
  .usable-cockpit,
  .learning-prototype,
  .talent-screen,
  .insight-app,
  .discovery-app
) :is(.btn.gold, .insight-button.is-gold, .is-gold) {
  color: var(--glass-button-text) !important;
  border-color: color-mix(in srgb, var(--glass-button-gold) 68%, var(--glass-border-strong)) !important;
  background-color: color-mix(in srgb, var(--glass-button-gold) 17%, var(--glass-control)) !important;
  background-image: var(--glass-control-sheen) !important;
  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .22), inset 0 0 22px color-mix(in srgb, var(--glass-button-gold) 14%, transparent), 0 10px 26px color-mix(in srgb, var(--glass-button-gold) 14%, transparent) !important;
}

:is(
  .screen,
  .usable-cockpit,
  .learning-prototype,
  .talent-screen,
  .insight-app,
  .discovery-app
) :is(button, a, [role="button"]):where(:not(.brand):not(.discovery-brand):not(.discovery-skip):not(.skip-link):not(.learning-skip):not(.insight-skip):not(.insight-brand):not(.learning-brand):not(.cockpit-brand):not(.talent-brand)):disabled,
:is(
  .screen,
  .usable-cockpit,
  .learning-prototype,
  .talent-screen,
  .insight-app,
  .discovery-app
) :is(button, a, [role="button"]):where(:not(.brand):not(.discovery-brand):not(.discovery-skip):not(.skip-link):not(.learning-skip):not(.insight-skip):not(.insight-brand):not(.learning-brand):not(.cockpit-brand):not(.talent-brand))[aria-disabled="true"] {
  border-color: color-mix(in srgb, var(--glass-border) 70%, transparent) !important;
  color: color-mix(in srgb, var(--glass-button-text-muted) 62%, transparent) !important;
  background-color: color-mix(in srgb, var(--glass-control) 65%, transparent) !important;
  box-shadow: var(--glass-shadow-control) !important;
  filter: saturate(.62) !important;
}

@media (prefers-reduced-motion: reduce) {
  :is(.screen, .usable-cockpit, .learning-prototype, .talent-screen, .insight-app, .discovery-app) :is(button, a, [role="button"]) {
    transform: none !important;
    transition-duration: .01ms !important;
  }
}

/* The cockpit keeps a stronger gold/cyan tint for these two primary actions. */
.usable-cockpit .domain-start-action,
.usable-cockpit .persistent-action-zone .domain-start-action {
  color: var(--glass-button-text) !important;
  border-color: color-mix(in srgb, var(--glass-button-gold) 68%, var(--glass-border-strong)) !important;
  background-color: color-mix(in srgb, var(--glass-button-gold) 17%, var(--glass-control)) !important;
  background-image: var(--glass-control-sheen) !important;
  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .22), inset 0 0 22px color-mix(in srgb, var(--glass-button-gold) 14%, transparent), 0 10px 26px color-mix(in srgb, var(--glass-button-gold) 14%, transparent) !important;
}

.usable-cockpit .domain-assistant-action,
.usable-cockpit .persistent-action-zone .domain-assistant-action {
  color: var(--glass-button-text) !important;
  border-color: color-mix(in srgb, var(--glass-button-accent) 70%, var(--glass-border-strong)) !important;
  background-color: color-mix(in srgb, var(--glass-button-accent) 19%, var(--glass-control)) !important;
  background-image: var(--glass-control-sheen) !important;
  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .22), inset 0 0 22px color-mix(in srgb, var(--glass-button-accent) 16%, transparent), 0 10px 26px color-mix(in srgb, var(--glass-button-accent) 15%, transparent) !important;
}

/* The live AI conversation must remain readable over the cockpit canvas. */
.usable-cockpit .ai-assistant-dialog {
  background: #061722 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}