/* Personal radar - page-specific rules. Tokens and components come from site.css. */
.radar-pick__head { display: flex; flex-wrap: wrap; gap: var(--s5); align-items: end; justify-content: space-between; margin-bottom: var(--s6); }
.radar-pick__head p { margin-top: var(--s2); max-width: 38em; }
.radar-pick .seg { max-width: 100%; }
.radar-pick .seg label { white-space: normal; }

.radar-group { border: 0; border-top: 1px solid var(--line-soft); margin: 0; padding: var(--s4) 0 var(--s5); min-width: 0; display: grid; gap: var(--s3); }
.radar-group legend { float: left; width: 100%; padding: 0; margin-bottom: var(--s3); font-size: var(--fs-micro); letter-spacing: .08em; text-transform: uppercase; font-weight: 500; }
.radar-infer { text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--fg-muted); margin-left: .6em; }
.radar-chips { clear: both; display: flex; flex-wrap: wrap; gap: var(--s2); }
.radar-chip { position: relative; display: inline-flex; }
.radar-chip input { position: absolute; opacity: 0; width: 1px; height: 1px; min-height: 0; }
.radar-chip label { display: inline-flex; align-items: center; gap: .5em; min-height: 2.75rem; padding: .45em .85em; border: 1px solid var(--fg); font-size: var(--fs-small); line-height: 1.2; cursor: pointer; user-select: none; transition: background var(--t) var(--ease), color var(--t) var(--ease); }
.radar-chip label::before { content: ""; width: .6em; height: .6em; border: 1px solid currentColor; flex: none; }
.radar-chip label:hover { background: var(--panel); }
.radar-chip input:checked + label { background: var(--g-pro); color: var(--ink); border-color: transparent; }
.radar-chip input:checked + label::before { background: var(--ink); border-color: var(--ink); }
.radar-chip input:focus-visible + label { outline: 3px solid var(--accent); outline-offset: 2px; }
.radar-pick > .cluster { margin-top: var(--s5); align-items: center; }

.radar-cols { display: grid; gap: var(--s8); }
.radar-col { min-width: 0; display: grid; gap: var(--s5); align-content: start; }
@media (min-width: 64rem) {
  .radar-cols { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--s9); }
}

.radar-feed { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--fg); }
.radar-item { padding: var(--s5) 0; border-bottom: 1px solid var(--line-soft); display: grid; gap: var(--s2); }
.radar-item__meta { display: flex; flex-wrap: wrap; gap: var(--s3); align-items: center; font-size: var(--fs-micro); color: var(--fg-muted); margin: 0; }
.radar-item__meta .badge { color: var(--fg); }
.radar-item__meta .badge--solid { color: var(--pro-hi); }
.radar-item__t { font-size: clamp(1.25rem, 1.1rem + .5vw, 1.5rem); line-height: 1.2; letter-spacing: -.01em; font-weight: 400; margin: 0; max-width: 28em; }
.radar-item__t a { text-decoration-thickness: 1px; text-underline-offset: .15em; }
.radar-item__s { margin: 0; max-width: 40em; }
.radar-item__src { margin: 0; color: var(--fg-muted); overflow-wrap: anywhere; }
.radar-item__why { margin: var(--s1) 0 0; display: flex; flex-wrap: wrap; gap: var(--s2); }
.radar-why { font-size: var(--fs-micro); padding: .25em .5em; background: var(--panel); }
.radar-why--infer { background: transparent; border: 1px dashed var(--fg-muted); color: var(--fg-muted); }

/* The e-mail, shown as it is mailed (its own inline styles), inside a plain frame. */
.radar-mail { border: 1px solid var(--line); background: var(--bg); max-height: 38rem; overflow: auto; }
.radar-mail table { border-collapse: collapse; }
.radar-mail a { overflow-wrap: anywhere; }
.radar-mail--empty { border-style: dashed; padding: var(--s6); color: var(--fg-muted); max-height: none; }
.radar-mail--empty p { margin: 0; max-width: 30em; }

.radar-subwrap { margin-top: var(--s5); padding-top: var(--s6); border-top: 1px solid var(--fg); display: grid; gap: var(--s5); }
.radar-hp { position: absolute; left: -200vw; width: 1px; height: 1px; overflow: hidden; }
.radar-note { margin-top: var(--s6); }
.radar-manage-h { margin-top: var(--s7); }
.radar-cands { list-style: none; padding: 0; margin: 0; }
.radar-cand { display: grid; gap: var(--s3); }
[data-radar-busy] [data-radar-feed], [data-radar-busy] [data-radar-preview] { opacity: .55; transition: opacity 120ms linear; }
.radar-more { margin-top: var(--s4); }
.radar-more summary { cursor: pointer; min-height: 2.75rem; display: inline-flex; align-items: center; font-size: var(--fs-small); text-decoration: underline; text-underline-offset: .2em; }
.radar-more[open] summary { margin-bottom: var(--s3); }
.radar-more .radar-feed { border-top-color: var(--line-soft); }

/* Visual QA 2026-09-18 — the follow list read as a grey form. Chips become pills and every group
   gets its own hue (same family as the map's data layers), so the page has colour before anything
   is picked. Checked state keeps dark ink on a luminous fill (contrast >= 7:1). */
.radar-group { --chip: var(--pro); }
.radar-group[data-radar-group="company"] { --chip: var(--blue); }
.radar-group[data-radar-group="yard"] { --chip: var(--k-yard); }
.radar-group[data-radar-group="area"] { --chip: var(--pro); }
.radar-group[data-radar-group="sector"] { --chip: var(--k-oilgas); }
.radar-group[data-radar-group="discipline"] { --chip: var(--k-lng); }
.radar-group legend { color: var(--chip); font-family: var(--font-mono); }
.radar-chip label { border-radius: 999px; border-color: color-mix(in srgb, var(--chip) 45%, transparent); background: color-mix(in srgb, var(--chip) 7%, transparent); }
.radar-chip label::before { border-radius: 50%; border-color: var(--chip); }
.radar-chip label:hover { background: color-mix(in srgb, var(--chip) 18%, transparent); border-color: var(--chip); }
.radar-chip input:checked + label { background: var(--chip); color: var(--ink); border-color: transparent; box-shadow: 0 0 1.2rem -.3rem var(--chip); }
.radar-chip input:checked + label::before { background: var(--ink); border-color: var(--ink); }
.radar-feed, .radar-subwrap { border-top-color: var(--line); }

/* ---------- "Ten projects to watch" entrance (only while yr.radar.watch.world_tour_enabled()) */
.radar-watch-wrap { padding-block: var(--s5) 0; }
.radar-watch { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--s4) var(--s6); padding: var(--s4) var(--s6) var(--s4) var(--s4); border-radius: var(--r-lg); text-decoration: none; color: var(--fg);
  background: radial-gradient(40rem 18rem at 0% 50%, rgb(56 225 214 / .16), transparent 70%), radial-gradient(30rem 16rem at 100% 0%, rgb(157 140 255 / .16), transparent 70%), rgb(8 14 28 / .9);
  border: 1px solid rgb(56 225 214 / .38); box-shadow: var(--hi), 0 24px 60px -34px rgb(56 225 214 / .55); transition: border-color .25s, transform .25s, box-shadow .25s; }
.radar-watch:hover { border-color: var(--pro); transform: translateY(-2px); box-shadow: var(--hi), 0 30px 70px -30px rgb(56 225 214 / .7); }
.radar-watch:focus-visible { outline: 2px solid var(--pro-hi, var(--fg)); outline-offset: 3px; }
.radar-watch__globe { width: clamp(6.5rem, 14vw, 9.5rem); height: auto; display: block; filter: drop-shadow(0 0 22px rgb(56 225 214 / .35)); }
.radar-watch__arc { stroke-dasharray: 1; stroke-dashoffset: 0; animation: radar-watch-arc 5s ease-in-out infinite; filter: drop-shadow(0 0 3px currentColor); }
.radar-watch__arc:nth-of-type(2) { animation-delay: .8s; } .radar-watch__arc:nth-of-type(3) { animation-delay: 1.6s; }
.radar-watch__ring { opacity: .5; transform-box: fill-box; transform-origin: center; animation: radar-watch-ring 2.6s ease-out infinite; }
@keyframes radar-watch-arc { 0% { stroke-dashoffset: 1; } 45%, 100% { stroke-dashoffset: 0; } }
@keyframes radar-watch-ring { from { transform: scale(.6); opacity: .8; } to { transform: scale(1.9); opacity: 0; } }
.radar-watch__txt { display: grid; gap: .35rem; min-width: 0; }
.radar-watch__k { font: 500 var(--fs-micro)/1.2 var(--font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--pro); }
.radar-watch__t { font-size: clamp(1.5rem, 1.1rem + 1.8vw, 2.4rem); line-height: 1.02; letter-spacing: -.03em; font-weight: 500; text-wrap: balance; }
.radar-watch__s { color: var(--fg-muted); font-size: var(--fs-small); line-height: 1.45; max-width: 38em; }
.radar-watch__go { white-space: nowrap; font-weight: 500; font-size: var(--fs-small); color: var(--ink); background: var(--g-pro, var(--pro)); padding: .7em 1.1em; border-radius: 99px; }
@media (max-width: 44rem) {
  .radar-watch { grid-template-columns: auto 1fr; padding: var(--s4); gap: var(--s3) var(--s4); }
  .radar-watch__globe { width: 5.5rem; }
  .radar-watch__go { grid-column: 1 / -1; justify-self: start; }
}
@media (prefers-reduced-motion: reduce) { .radar-watch__arc, .radar-watch__ring { animation: none; } .radar-watch, .radar-watch:hover { transition: none; transform: none; } }
.radar-group[data-radar-group="project"] { --chip: var(--k-grid); }
/* admin: triage chips, bulk reject, external review */
.radar-triage { margin: 0; }
.radar-warn { color: var(--pro-hi, #c8a200); font-weight: 600; font-size: .85em; }
.radar-notrel > summary { cursor: pointer; padding: var(--s3, 12px) 0; }
.radar-bulk-pick { margin: 0; }
.radar-triage-sum p, .radar-external p { margin: 0 0 var(--s2, 8px); }