/* Labels carry meaning even without colour. Colours are light on the dark console. */
.topic-heading{grid-column:1/-1;margin:4px 0 0;color:#d5e4ee;font-size:12px}
.topic-filters{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px}
.topic-filters button{min-height:44px;padding:8px 12px;border:1px solid #607988;border-radius:20px;background:#091623;color:#e9f4fc;font:inherit;font-size:12px;cursor:pointer;display:flex;align-items:center;gap:7px}
.topic-filters button::before,.topic-badge::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--topic-color,#e9f4fc);flex:none}
.topic-filters button[aria-pressed=true]{border-color:var(--topic-color,#e9f4fc);box-shadow:inset 0 0 0 1px var(--topic-color,#e9f4fc);background:#213444}
.topic-filters button:hover{background:#243d50}.topic-filters button:focus-visible{outline:3px solid #fff;outline-offset:3px}
.destination .topic-badges{display:flex;flex-wrap:wrap;gap:4px 8px;margin:5px 0 2px}
.destination .topic-badge{display:inline-flex;align-items:center;gap:5px;font-size:10px;line-height:1.45;color:var(--topic-color);white-space:normal}
.spiral-view .topic-badge:nth-child(n+2){display:none}
.portal-stage .destination{border-inline-start:3px solid var(--destination-color,#607988)}
.topic-result{grid-column:1/-1;color:#bdceda;font-size:11px;margin:0}
@media(min-width:701px){.portal-stage.spiral-view{height:680px}.spiral-view .destination{top:calc(24px + var(--slot)*160px)}}
@media(min-width:701px) and (max-width:1050px){.portal-stage.spiral-view{height:800px}.spiral-view .destination{top:calc(20px + var(--slot)*190px)}}
@media(max-width:700px){.topic-filters{gap:5px}.topic-filters button{padding:7px 9px;font-size:11px}.destination .topic-badge{font-size:10px}}