.research-sky { --sky-ink: #e5eafa; --global-text-color: #e5eafa; color: var(--sky-ink); background: #080f20; border: 1px solid #26314a; border-radius: 16px; overflow: hidden; margin: 1.5rem 0; }
.sky-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; padding: 16px 20px; font-size: .8rem; border-bottom: 1px solid #26314a; }
.research-sky [hidden] { display: none; }
.sky-toolbar label { margin: 0; color: #e5eafa; }
.sky-toolbar select, .sky-toolbar button { color: #e5eafa; background: #121e34; border: 1px solid #52617b; border-radius: 5px; padding: 6px; }
.sky-stage { position: relative; background: radial-gradient(ellipse at 28% 25%, #16213a77, transparent 55%), #080f20; }
#research-sky-map { display: block; width: 100%; height: auto; }
.sky-region { font: 18px Georgia, serif; letter-spacing: 1px; fill: #ccd8eb; opacity: .95; }
.sky-region--methodology { font-size: 20px; text-transform: uppercase; letter-spacing: .5px; }
.sky-region--application { font: italic 18px Georgia, serif; letter-spacing: 1px; paint-order: stroke; stroke: #080f20; stroke-width: 2px; }
.sky-affiliations { display: flex; flex-wrap: wrap; gap: 6px; }
.sky-tag { font-size: .72rem; border: 1px solid #637795; border-radius: 4px; padding: 3px 7px; }
.sky-tag--application { font-style: italic; border-style: dashed; }
.sky-direction-label { font: 16px Georgia, serif; fill: #f2f5ff; text-anchor: middle; paint-order: stroke; stroke: #080f20; stroke-width: 3px; stroke-linejoin: round; }
.sky-star { cursor: pointer; outline: none; }
.sky-star .sky-focus { fill: none; stroke: #fff; stroke-width: 1.3; opacity: 0; }
.sky-star:focus .sky-focus, .sky-star:hover .sky-focus, .sky-star[aria-pressed="true"] .sky-focus { opacity: 1; }
.sky-star.is-muted { opacity: .23; }
.sky-star.is-constellation { filter: drop-shadow(0 0 4px var(--star-color)); }
.sky-direction-label.is-active { fill: #fff; filter: drop-shadow(0 0 4px #a9caff); }
.sky-edge { stroke: #c5d6ff; stroke-width: 1.2; opacity: .7; }
.sky-edge.is-subdued { opacity: .16; }
.sky-edge.is-adjacent { stroke: #edf5ff; stroke-width: 2; opacity: 1; filter: drop-shadow(0 0 3px #a9caff) drop-shadow(0 0 7px #709cdb); }
.research-sky { position: relative; }
.sky-tooltip { position: absolute; z-index: 5; width: 310px; max-width: calc(100% - 24px); padding: 14px 16px; border: 1px solid #90a9d2; border-radius: 9px; background: #16243b; box-shadow: 0 8px 26px #0009; color: #f4f7ff; font-size: .8rem; line-height: 1.5; }
.sky-tooltip strong { display: block; color: #fff; margin: 5px 0; font-size: .9rem; }
.sky-tooltip small { display: block; color: #d0dff5; }
.sky-hint { text-align: center; color: #aebbd2; font-size: .75rem; padding: 0 12px 16px; margin: 0; }
.sky-detail { min-height: 145px; padding: 22px 26px; background: #111b2d; border-top: 1px solid #26314a; }
.sky-detail h3 { font-size: 1.15rem; line-height: 1.45; color: #f3f5ff; }
.sky-detail p { font-size: .88rem; line-height: 1.65; color: #e5eafa; }
.sky-detail a { color: #b9dbff; text-decoration: underline; }
.sky-detail small { display: block; color: #b8c6dd; margin-bottom: 9px; }
.sky-thread { border-top: 1px solid #45536d; margin-top: 20px; padding-top: 18px; }
.sky-thread h4 { color: #e5eafa; font-size: 1rem; margin-bottom: 10px; }
.sky-thread p:last-child { margin-bottom: 0; }
.sky-thread-choices { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.sky-thread-choices button { background: #182842; color: #e5eafa; border: 1px solid #637795; border-radius: 5px; padding: 6px 10px; }
.sky-thread-choices button[aria-pressed="true"] { border-color: #e5eafa; background: #304666; }
.sky-legend { display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: .72rem; padding: 18px 24px 0; color: #c0cbe0; }
.sky-note { font-size: .72rem; color: #9eacc3; padding: 0 24px 16px; margin: 0; }
.sky-catalogue summary { cursor: pointer; padding: 12px 0; }
.sky-catalogue h2 { font-size: 1.3rem; margin-top: 24px; }
.sky-catalogue h3 { font-size: 1rem; }
.sky-source { margin: 20px 0; }
.sky-catalogue .bibliography { padding-left: 22px; }
.sky-citation { font-size: .88rem; }
@media (max-width: 540px) { .sky-toolbar { padding: 12px; gap: 10px; } .sky-toolbar select { max-width: 230px; } .sky-detail { padding: 18px; } .sky-stage { overflow-x: auto; } #research-sky-map { min-width: 680px; } .sky-hint { min-width: 680px; } .sky-direction-label { font-size: 17px; } }