/* CXDK: Shared brand tokens; graph renderers also use these colours for canvas/SVG output. */
:root{--bg:#152A30;--bg2:#203B41;--card:#203B41;--card2:#29474D;--line:#456268;--line2:#58777D;--ink:#F3EFE6;--ink-2:#BACBC6;--ink-3:#9DB4AF;--brass:#D99A3A;--cyan:#B5D3CB;--green:#A4C3AD;--violet:#B5A3CB;--signal:#B5D3CB;--idea:#B5A3CB;--person:#B5D3CB;--circle:#CBAA94;--influence:#A4C3AD;--principle:#F3EFE6;--known:#A4C3AD;--edge:#D99A3A;--dark:#B5A3CB}
/* CXDK: The example keeps its original canvas palette. */
body.example{--bg:#12203F;--bg2:#1B2C55;--card:#1B2C55;--card2:#1E3160;--line:#2E4174;--line2:#3F5690;--ink:#F1EBDD;--ink-2:#B7B9C7;--ink-3:#6F7590;--brass:#D9A756;--signal:#7BD4E6;--idea:#C48BE0;--person:#7BD4E6;--circle:#E07A6A;--influence:#7BC47F;--principle:#F1EBDD;--known:#7BD4E6;--edge:#D9A756;--dark:#6F7590}
idk-header{display:block;min-height:34px}
header{align-items:center!important;gap:16px;flex-wrap:wrap;padding:16px 22px!important}
header .map-link{pointer-events:auto;color:var(--ink);font-size:13px;text-decoration:none;border:1px solid var(--line);border-radius:24px;padding:9px 14px;margin-left:auto;background:var(--bg)}
.btn,#find input,#timeSel{background:var(--card)}
.btn.p,.btn.primary{background:var(--brass);border-color:var(--brass);color:var(--bg)}
.btn.g{background:var(--green);color:var(--bg)}
.btn:focus-visible,a:focus-visible,.nd:focus-visible{outline:2px solid var(--brass);outline-offset:4px}
.nd.learnt circle{fill:#29473C;stroke:var(--green)}
.nd.knew circle{fill:var(--card2);stroke:var(--ink-2)}
.nd.selected circle{stroke:var(--brass);stroke-width:3}
.nd.selected text{fill:var(--ink)}
#panel,#answer{background:var(--bg)}
#ask textarea{background:var(--card)}
#labels .lb{text-shadow:0 1px 6px var(--bg),0 0 2px var(--bg)}
#bar{flex-wrap:nowrap}
.learning-note{position:fixed;left:22px;top:86px;z-index:3;max-width:360px;color:var(--ink-2);font-size:13px;line-height:1.6;background:var(--bg);padding:12px 16px;border:1px solid var(--line);border-radius:12px}
.learning-note a{color:var(--brass)}
@media(max-width:700px){header{padding:12px!important;gap:10px}#find{width:100%;margin-left:0}#find input{flex:1;width:0;min-width:0}header .map-link{font-size:12px;padding:8px 10px}#bar{gap:5px;padding:10px}.btn{padding:9px 11px}.learning-note{top:94px;left:12px;right:12px;max-width:none}#panel{padding:82px 22px 24px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* CXDK: Keep the bottom discovery controls clear of mobile home indicators. */
@media(max-width:700px){#bar{padding-bottom:calc(10px + env(safe-area-inset-bottom))}}