/* Load after site-polish.css so the controls and progress states share one visual system. */
#graph .curriculum-globe-controls{display:grid;gap:10px;margin:0 0 16px}
#graph .curriculum-globe-controls .globe-filter{position:relative;min-width:0;padding:10px;border:1px solid color-mix(in srgb,var(--mb-brand,#1d6d46) 12%,#fff);border-radius:16px;background:color-mix(in srgb,var(--mb-tint,#e8f3eb) 40%,#fff);transition:border-color .18s,box-shadow .18s,transform .18s}
#graph .curriculum-globe-controls .globe-filter:hover{border-color:color-mix(in srgb,var(--mb-brand,#1d6d46) 32%,#fff);box-shadow:0 6px 18px rgba(21,46,37,.07)}
#graph .curriculum-globe-controls .globe-filter:focus-within{border-color:var(--mb-brand,#1d6d46);box-shadow:0 0 0 3px color-mix(in srgb,var(--mb-brand,#1d6d46) 14%,transparent)}
#graph .curriculum-globe-controls label{display:block;margin:0 3px 7px;color:var(--mb-muted,#52675a);font-size:11px;font-weight:750;line-height:1.3;letter-spacing:.02em}
#graph .curriculum-globe-controls select.globe-native-select{position:absolute!important;width:1px!important;height:1px!important;min-height:1px!important;padding:0!important;margin:0!important;opacity:0!important;pointer-events:none!important;overflow:hidden!important;clip-path:inset(50%)!important}
#graph .curriculum-globe-controls .globe-choice-trigger{display:flex;align-items:center;gap:8px;width:100%;min-height:42px;padding:9px 11px;border:1px solid color-mix(in srgb,var(--mb-brand,#1d6d46) 18%,#fff);border-radius:11px;background:#fff;color:var(--mb-ink,#173b2b);font-family:inherit;font-size:13px;font-weight:650;line-height:1.35;text-align:left;cursor:pointer;box-shadow:0 1px 3px rgba(20,40,30,.035);transition:border-color .16s,background .16s,box-shadow .16s}
#graph .curriculum-globe-controls .globe-choice-trigger:hover:not(:disabled),#graph .curriculum-globe-controls .globe-choice-trigger[aria-expanded=true]{border-color:var(--mb-brand,#1d6d46);background:color-mix(in srgb,var(--mb-tint,#e8f3eb) 24%,#fff);box-shadow:0 4px 12px rgba(21,46,37,.08)}
#graph .curriculum-globe-controls .globe-choice-trigger:focus-visible{outline:3px solid color-mix(in srgb,var(--mb-brand,#1d6d46) 36%,transparent);outline-offset:2px}
#graph .curriculum-globe-controls .globe-choice-trigger:disabled{color:#68737b;cursor:not-allowed}
#graph .curriculum-globe-controls .globe-choice-value{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#graph .curriculum-globe-controls .globe-choice-count{flex:none;color:var(--mb-muted,#607369);font-size:10px;font-weight:600;white-space:nowrap}
#graph .curriculum-globe-controls .globe-choice-arrow{flex:none;width:8px;height:8px;margin:0 3px 4px 2px;border-right:2px solid var(--mb-brand,#1d6d46);border-bottom:2px solid var(--mb-brand,#1d6d46);transform:rotate(45deg);transition:transform .16s}
#graph .curriculum-globe-controls .globe-choice-trigger[aria-expanded=true] .globe-choice-arrow{margin-top:5px;transform:rotate(225deg)}
.globe-choice-popover{position:fixed;z-index:10000;max-height:min(420px,72vh);padding:10px;border:1px solid color-mix(in srgb,var(--mb-brand,#1d6d46) 20%,#fff);border-radius:16px;background:#fff;box-shadow:0 22px 55px rgba(20,42,31,.21);animation:globe-menu-in .16s ease-out;display:flex;flex-direction:column;gap:9px}
.globe-choice-popover[hidden]{display:none}
.globe-choice-header{display:flex;align-items:center;justify-content:space-between;padding:2px 3px 1px;color:var(--mb-ink,#173b2b);font-size:13px}
.globe-choice-close{width:28px;height:28px;border:0;border-radius:8px;background:var(--mb-tint,#e8f3eb);color:var(--mb-ink,#173b2b);font-size:19px;line-height:1;cursor:pointer}
.globe-choice-search{width:100%;min-height:38px;padding:8px 11px;border:1px solid var(--mb-line,#d5e7da);border-radius:10px;background:color-mix(in srgb,var(--mb-tint,#e8f3eb) 23%,#fff);color:var(--mb-ink,#173b2b);font-family:inherit;font-size:13px;font-weight:500;line-height:1.3;outline:none}
.globe-choice-search:focus{border-color:var(--mb-brand,#1d6d46);box-shadow:0 0 0 3px color-mix(in srgb,var(--mb-brand,#1d6d46) 14%,transparent)}
.globe-choice-list{min-height:0;overflow:auto;display:grid;gap:3px;overscroll-behavior:contain}
.globe-choice-option{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:36px;padding:8px 10px;border:0;border-radius:9px;background:transparent;color:var(--mb-ink,#173b2b);font-family:inherit;font-size:12px;font-weight:550;line-height:1.35;text-align:left;cursor:pointer}
.globe-choice-option:hover,.globe-choice-option:focus-visible{outline:none;background:color-mix(in srgb,var(--mb-tint,#e8f3eb) 65%,#fff)}
.globe-choice-option[aria-selected=true]{background:var(--mb-tint,#e8f3eb);color:var(--mb-brand,#1d6d46);font-weight:750}
.globe-choice-option[aria-selected=true]:after{content:'✓';flex:none;font-size:13px}
.globe-choice-empty{margin:4px 0 6px;padding:12px;color:var(--mb-muted,#52675a);font-size:12px;text-align:center}
@keyframes globe-menu-in{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:599px){.globe-choice-popover{max-height:min(70vh,520px);border-radius:18px;padding:13px;box-shadow:0 0 0 100vmax rgba(12,31,20,.16),0 22px 55px rgba(20,42,31,.24)}}
@media(prefers-reduced-motion:reduce){.globe-choice-popover,.globe-choice-arrow{animation:none!important;transition:none!important}}
#graph .curriculum-globe-controls button[data-globe-motion-open]{display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;min-height:38px;margin-top:7px;padding:8px 12px;border:1px solid var(--mb-brand,var(--brand-primary,#1d6d46));border-radius:8px;background:var(--mb-brand,var(--brand-primary,#1d6d46));color:#fff;font-family:inherit;font-size:12px;font-weight:700;line-height:1.35;cursor:pointer}
#graph .curriculum-globe-controls button[data-globe-motion-open]:hover:not(:disabled){filter:brightness(.92)}
#graph .curriculum-globe-controls button[data-globe-motion-open]:disabled{background:var(--mb-soft,#e5e8e8);border-color:var(--mb-line,#d5e7da);color:#68737b;cursor:not-allowed}
#graph .curriculum-globe-controls button[data-globe-motion-open]:focus-visible{outline:3px solid var(--mb-brand,var(--brand-primary,#1d6d46));outline-offset:2px}
#graph .curriculum-globe-controls [data-globe-scope]{margin:1px 2px 0;color:var(--mb-muted,var(--brand-muted,#52675a));font-size:11px;line-height:1.5}

/* The status legend is independent of the six subject colors on the sphere. */
#graph .globe-state-legend i{border-color:#59636b;background:#d8dde0;box-shadow:none}
#graph .globe-state-legend i.learning{border-color:#59636b;background:linear-gradient(90deg,#59636b 0 50%,var(--mb-brand,var(--brand-primary,#1d6d46)) 50% 100%)}
#graph .globe-state-legend i.learned{border-color:var(--mb-brand,var(--brand-primary,#1d6d46));background:var(--mb-brand,var(--brand-primary,#1d6d46));box-shadow:0 0 6px color-mix(in srgb,var(--mb-brand,var(--brand-primary,#1d6d46)) 35%,transparent)}

#graph #nodeList .node[data-progress=none]{--node-progress-ink:#4d5862;--node-progress-line:#c9d0d4;--node-progress-bg:#eceff0}
#graph #nodeList .node[data-progress=learning]{--node-progress-ink:var(--mb-ink,var(--brand-ink,#173b2b));--node-progress-line:color-mix(in srgb,var(--mb-brand,var(--brand-primary,#1d6d46)) 42%,#aab3b8);--node-progress-bg:color-mix(in srgb,var(--mb-tint,#e8f3eb) 52%,#e8ebed)}
#graph #nodeList .node[data-progress=learned]{--node-progress-ink:var(--mb-brand,var(--brand-primary,#1d6d46));--node-progress-line:color-mix(in srgb,var(--mb-brand,var(--brand-primary,#1d6d46)) 42%,#fff);--node-progress-bg:var(--mb-tint,#e8f3eb)}
#graph #nodeList .node[data-progress]{background:var(--node-progress-bg)!important;border:1px solid var(--node-progress-line)!important;border-left:4px solid var(--node-progress-ink)!important;color:var(--node-progress-ink)!important}
#graph #nodeList .node[data-progress]:hover{border-color:var(--node-progress-ink)!important;background:var(--node-progress-bg)!important}
#graph #nodeList .node[data-progress].selected{box-shadow:inset 0 0 0 2px var(--mb-brand,var(--brand-primary,#1d6d46))!important}
#graph #nodeList .node .node-progress-state{padding:0!important;background:transparent!important;color:var(--node-progress-ink)!important}
#graph #nodeList .node .node-progress-label{padding:3px 8px!important;background:color-mix(in srgb,var(--node-progress-bg) 65%,#fff)!important;color:var(--node-progress-ink)!important}
#graph #nodeList .node[data-progress=learning] .node-progress-state i{background:linear-gradient(90deg,#59636b 0 50%,var(--mb-brand,var(--brand-primary,#1d6d46)) 50% 100%)}
#graph #nodeList .node[data-progress=learned] .node-progress-state i{background:var(--mb-brand,var(--brand-primary,#1d6d46))}
#graph #nodeList .node[data-progress=none] .node-progress-state i{background:#59636b}
@media(max-width:800px){#graph .curriculum-globe-controls{grid-template-columns:repeat(2,minmax(0,1fr))}#graph .curriculum-globe-controls .globe-filter:nth-child(3),#graph .curriculum-globe-controls [data-globe-scope]{grid-column:1/-1}}
@media(max-width:470px){#graph .curriculum-globe-controls{grid-template-columns:1fr}#graph .curriculum-globe-controls .globe-filter:nth-child(3),#graph .curriculum-globe-controls [data-globe-scope]{grid-column:auto}}
