.map-hint {
  margin: 8px 0 12px;
  color: var(--soft);
  font-size: .72rem;
  line-height: 1.5;
}
.pilot-city-list { display: flex; gap: 6px; flex-wrap: wrap; margin: 0 0 9px; }
.pilot-city-list[hidden] { display: none; }
.pilot-city-list .city-filter-toggle { margin-left: auto; border-style: dashed; color: #f4cb66; }
.city-filter-panel { margin: 0 0 10px; padding: 13px; border: 1px solid #77936b; border-radius: 12px; background: #0a1d12; }
.city-filter-panel[hidden] { display: none; }
.city-filter-panel p { margin: 0 0 12px; color: var(--soft); font-size: .72rem; }
.city-filter-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 7px; }
.city-filter-list label { display: flex; align-items: center; gap: 7px; padding: 7px; border: 1px solid #315940; border-radius: 7px; font-size: .69rem; }
.city-filter-list input { min-width: 0; accent-color: var(--green); }
.city-filter-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 13px; }
.city-filter-actions #save-city-filter { min-height: 37px; padding: 7px 11px; border: 1px solid var(--green); background: var(--green); color: #041307; font: inherit; font-size: .67rem; font-weight: 700; }
.aura-rank { margin: 0 0 10px; padding: 10px; border: 1px solid #315c49; border-radius: 12px; background: #071812e8; }
.aura-rank[hidden] { display: none; }
.aura-rank-head { display: flex; justify-content: space-between; align-items: baseline; gap: 9px; margin-bottom: 7px; }
.aura-rank-head h2 { margin: 0; color: #d8f5dc; font-size: .72rem; text-transform: uppercase; letter-spacing: .07em; }
.aura-rank-head span { color: var(--soft); font-size: .57rem; text-align: right; }
.aura-rank-list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; margin: 0; padding: 0; list-style: none; }
.aura-rank-list button { display: flex; align-items: center; flex-wrap: wrap; gap: 3px 6px; width: 100%; min-height: 38px; padding: 5px 7px; border: 1px solid color-mix(in srgb, var(--aura) 65%, #193529); border-left: 3px solid var(--aura); border-radius: 7px; background: color-mix(in srgb, var(--aura) 14%, #091913); color: #eefbef; font: inherit; font-size: .61rem; text-align: left; }
.aura-rank-list button:hover, .aura-rank-list button:focus-visible { outline: 1px solid var(--aura); box-shadow: 0 0 15px color-mix(in srgb, var(--aura) 40%, transparent); }
.aura-rank-number { color: var(--aura); font-weight: 700; }
.aura-rank-count { width: 100%; color: #b9d4c0; font-size: .52rem; overflow-wrap: anywhere; }
.pilot-city-list button { padding: 5px 8px; border: 1px solid #739b74; border-radius: 9px; background: #14311d; color: #e9ffda; font: inherit; font-size: .63rem; text-transform: lowercase; }
.pilot-city-list button:hover, .pilot-city-list button:focus-visible { border-color: #f4cb66; outline: 1px solid #f4cb66; }

.aura-map {
  height: min(67vh, 610px);
  min-height: 460px;
  touch-action: none;
  cursor: grab;
  border-color: #244330;
}
.aura-map:active { cursor: grabbing; }
.aura-map:focus-visible { outline: 1px solid var(--green); }
.aura-map:has(.city-panel.is-pilot) { height: min(88dvh, 760px); min-height: 520px; }
.aura-world {
  position: absolute;
  inset: 0;
  transform-origin: center center;
  transition: transform .5s cubic-bezier(.2,.8,.2,1);
  will-change: transform;
}
.aura-map.is-dragging .aura-world { transition: none; }
.aura-world[hidden], .map-controls[hidden] { display: none; }
.earth-world[hidden], .thought-interactions[hidden], .earth-empty[hidden] { display: none; }
.aura-map > .map-controls { z-index: 3; }
.pool-tool-actions { display: flex; gap: 7px; flex-wrap: wrap; justify-content: flex-end; }
.aura-map[hidden], .memoric-panel[hidden], .jury-panel[hidden], .latest-thoughts[hidden], .compose-panel[hidden] { display: none; }
.jury-panel{margin:12px 0 18px;padding:18px;border:1px solid #a9c69b;border-radius:17px;background:radial-gradient(circle at 95% 0%,#bad86b2b,transparent 45%),#0d201b;box-shadow:0 16px 30px #0006}
.jury-panel h2{margin:5px 0 9px;color:#e6f8de;font-size:clamp(1.2rem,4vw,1.7rem);letter-spacing:-.04em}
.jury-panel>p{max-width:650px;color:var(--soft);font-size:.73rem;line-height:1.6}
.jury-list{display:grid;gap:12px;list-style:none;margin:16px 0 0;padding:0}
.jury-card{display:grid;gap:11px;padding:15px;border:1px solid var(--aura);border-radius:12px;background:linear-gradient(140deg,color-mix(in srgb,var(--aura) 12%,#0a1a16),#071713)}
.jury-card .overline{color:var(--aura)}
.jury-card p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:.86rem;line-height:1.55}
.jury-card .subtle{font-size:.61rem}
.jury-actions{display:flex;gap:9px;flex-wrap:wrap}
.jury-actions button{min-height:38px;padding:7px 11px;border-radius:9px}
.jury-actions .primary{border:1px solid var(--aura);background:var(--aura);color:#06130b;font:inherit;font-size:.67rem;font-weight:700;text-transform:uppercase}
.jury-actions .primary:hover,.jury-actions .primary:focus-visible{box-shadow:0 0 14px color-mix(in srgb,var(--aura) 55%,transparent)}
.memoric-panel{margin:18px 0 22px;padding:22px;border:1px solid #749f83;border-radius:18px;background:radial-gradient(ellipse at 86% 4%,#6d9b7a30,transparent 41%),linear-gradient(155deg,#0d251d,#071311 75%);box-shadow:inset 0 0 0 1px #ffffff10,0 17px 36px #0007}
.memoric-head h2{margin:4px 0 8px;color:#ddf8e0;font-size:clamp(1.4rem,4vw,2rem);letter-spacing:-.04em;text-transform:lowercase}
.memoric-head p{max-width:650px;margin:0 0 18px;color:var(--soft);font-size:.73rem;line-height:1.65}
.memoric-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,235px),1fr));gap:14px;list-style:none;margin:16px 0 0;padding:0;perspective:1000px}
.memoric-card{--aura:#adf29c;display:flex;flex-direction:column;min-height:220px;padding:18px;border:1px solid var(--aura);border-radius:13px;background:linear-gradient(145deg,color-mix(in srgb,var(--aura) 18%,#12302b),#07161b 76%);box-shadow:inset 0 0 0 1px #ffffff16,8px 12px 0 -5px color-mix(in srgb,var(--aura) 20%,#14301c),0 16px 25px #0008;transform:rotateY(-5deg);transition:transform .25s,box-shadow .25s}
.memoric-card:hover,.memoric-card:focus-within{transform:rotateY(0) translateY(-4px);box-shadow:0 0 26px color-mix(in srgb,var(--aura) 25%,transparent),0 18px 29px #0009}
.memoric-card .overline{color:var(--aura)}
.memoric-card p{flex:1;margin:18px 0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:.82rem;line-height:1.55}
.memoric-foot{display:grid;gap:3px;border-top:1px solid color-mix(in srgb,var(--aura) 55%,#244639);padding-top:10px;color:#bbd6c8;font-size:.57rem}
.memoric-card button{align-self:start;margin-top:14px}
@media(prefers-reduced-motion:reduce){.memoric-card{transform:none;transition:none}.memoric-card:hover,.memoric-card:focus-within{transform:none}}
.earth-world { position: absolute; inset: 0; transform-origin: center; transition: transform .28s ease-out; }
.aura-map.is-dragging .earth-world { transition: none; }
.earth-surface { position: absolute; top: 50%; left: 0; width: 100%; aspect-ratio: 2; transform: translateY(-50%); border: 1px solid #4a756b; background: radial-gradient(ellipse at 50% 50%, #17322b, #071a1c 74%); overflow: hidden; }
.earth-surface::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(0deg, transparent 0 calc(25% - 1px), #51796b42 25%), repeating-linear-gradient(90deg, transparent 0 calc(25% - 1px), #51796b42 25%); opacity: .45; }
.earth-shape { position: absolute; inset: 0; width: 100%; height: 100%; filter: drop-shadow(0 0 9px #7acb8275); user-select: none; pointer-events: none; }
.earth-markers { position: absolute; inset: 0; transition: opacity .2s ease-out; }
.earth-cities { position: absolute; inset: 0; pointer-events: none; }
.earth-marker { --aura: #9fc79a; position: absolute; z-index: 2; width: 12px; height: 12px; padding: 0; border: 2px solid #ebffde; border-radius: 50%; background: var(--aura); box-shadow: 0 0 0 8px color-mix(in srgb, var(--aura) 29%, transparent), 0 0 19px var(--aura); transform: translate(-50%, -50%) scale(var(--counter-zoom, 1)); }
.earth-marker:hover, .earth-marker:focus-visible { width: 18px; height: 18px; outline: none; }
.city-label { position: absolute; z-index: 3; pointer-events: auto; min-height: 15px; padding: 1px 3px; border: 1px solid #a2c5a480; border-radius: 5px; background: #091910e8; color: #e6f7d8; font: inherit; font-size: .42rem; white-space: nowrap; text-transform: lowercase; transform-origin: left top; transform: translate(var(--label-shift-x, 0px), var(--label-shift-y, 0px)) scale(var(--counter-zoom, 1)); text-shadow: 0 1px 3px #000; cursor: pointer; }
.city-label.pilot { border-color: #c9e89d; background: #254a2ee8; color: #efffd4; box-shadow: 0 0 12px #a6d68678; }
.city-label:hover, .city-label:focus-visible { border-color: #f4cb66; outline: 2px solid #f4cb66; outline-offset: 1px; }
.city-label[hidden] { display: none; }
.city-panel { position: absolute; z-index: 5; top: 12px; right: 12px; bottom: 60px; width: min(340px, calc(100% - 24px)); padding: 14px; overflow-y: auto; touch-action: pan-y; background: #081710f5; border: 1px solid #8caf8e; border-radius: 14px; box-shadow: 0 12px 38px #000b; color: var(--ink); font-size: .73rem; cursor: auto; }
.city-panel[hidden], .city-aura-scale[hidden], .city-local-map[hidden], .city-details[hidden] { display: none; }
.city-panel.is-pilot { inset: 0; width: 100%; padding: 12px; display: grid; grid-template-rows: auto auto auto minmax(0, 1fr) minmax(72px, 14%); gap: 5px; overflow: hidden; border-radius: 0; }
.city-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--green); text-transform: uppercase; letter-spacing: .08em; }
.city-panel-head button { width: 28px; height: 28px; border: 1px solid var(--line); border-radius: 8px; background: #10251a; color: var(--ink); font-size: 1.1rem; }
.city-panel h2 { margin: 8px 0; color: #efffd4; font-size: 1.2rem; text-transform: lowercase; }
.city-panel p { line-height: 1.5; }
.city-panel.is-pilot h2 { margin: 0; }
.city-panel.is-pilot #city-panel-state { margin: 0; color: #d9eccf; }
.city-local-map { position: relative; min-height: 0; overflow: hidden; touch-action: none; perspective: 900px; border: 1px solid #527b61; border-radius: 14px; background: radial-gradient(ellipse at 50% 42%, #254a3e 0, #102d32 35%, #07161d 73%, #030b13 100%); cursor: grab; isolation: isolate; }
.city-local-map::before { content: ""; position: absolute; z-index: 0; inset: 12% 6%; pointer-events: none; background: linear-gradient(135deg, transparent 44%, #c6f6e01b 49.8%, #c6f6e027 50%, transparent 55%); }
.field-space { flex: 1; min-height: 0; }
.city-local-map:active { cursor: grabbing; }
.city-local-map:focus-visible { outline: 2px solid var(--green); }
.city-space-sky { position: absolute; inset: 0; opacity: .48; pointer-events: none; background-image: radial-gradient(circle at 16% 24%, #d7f7dc 0 1px, transparent 2px), radial-gradient(circle at 72% 17%, #a9f2dd 0 1px, transparent 2px), radial-gradient(circle at 41% 38%, #e3f6bf 0 1px, transparent 2px), radial-gradient(circle at 83% 55%, #c5e6f7 0 1px, transparent 2px); background-size: 167px 139px, 213px 179px, 257px 191px, 281px 211px; animation: city-stars 22s ease-in-out infinite alternate; }
@keyframes city-stars { to { transform: translate3d(-17px, 10px, 0); opacity: .7; } }
.city-space-floor { position: absolute; left: -24%; bottom: -46%; width: 148%; height: 91%; pointer-events: none; transform: rotateX(71deg); transform-origin: center top; background: repeating-linear-gradient(90deg, transparent 0 43px, #73c9ad36 44px 45px), repeating-linear-gradient(0deg, transparent 0 43px, #73c9ad36 44px 45px); background-position: var(--city-floor-offset, 0px) 0, 0 var(--city-floor-offset, 0px); transition: background-position .52s ease-out; mask-image: linear-gradient(transparent, #000 35%, #000 82%, transparent); box-shadow: 0 -25px 75px #5bd5ac20; }
.city-local-world, .city-local-points { position: absolute; inset: 0; transform-style: preserve-3d; pointer-events: none; }
.city-local-thought { --aura: #9fc79a; position: absolute; left: 50%; top: 48%; width: min(70%, 410px); height: min(64%, 390px); padding: clamp(13px, 2vw, 22px); display: flex; flex-direction: column; gap: 8px; border: 2px solid var(--aura); border-radius: 11px; background: linear-gradient(145deg, color-mix(in srgb, var(--aura) 25%, #12313bd9), #081520d9 68%); backdrop-filter: blur(9px); color: #f1faec; font: inherit; text-align: left; overflow: hidden; overflow-wrap: anywhere; box-shadow: 0 0 35px color-mix(in srgb, var(--aura) 32%, transparent), inset 0 0 0 1px #ffffff24; backface-visibility: hidden; pointer-events: auto; transition: transform .52s cubic-bezier(.2,.75,.2,1), opacity .42s ease, box-shadow .42s ease; }
.city-local-thought::after { content: ""; position: absolute; inset: 7px; border: 1px solid color-mix(in srgb, var(--aura) 40%, transparent); border-radius: 6px; pointer-events: none; }
.city-local-thought[hidden] { display: none; }
.city-local-thought.is-current { box-shadow: 0 0 55px color-mix(in srgb, var(--aura) 47%, transparent), 0 25px 55px #0009, inset 0 0 0 1px #ffffff28; }
.city-local-thought:hover, .city-local-thought:focus-visible { outline: 2px solid var(--aura); outline-offset: 3px; }
.city-window-chrome { display: block; flex: none; padding-bottom: 7px; border-bottom: 1px solid color-mix(in srgb, var(--aura) 55%, transparent); color: #cde5de; font-size: .53rem; letter-spacing: .08em; text-transform: uppercase; }
.city-thought-heading { color: var(--aura); font-size: .66rem; text-transform: uppercase; letter-spacing: .11em; }
.city-thought-body { flex: 1; min-height: 0; overflow: auto; font-size: clamp(.82rem, 2vw, 1.08rem); line-height: 1.45; scrollbar-width: thin; }
.city-local-thought:not(.is-current) .city-thought-body { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.city-thought-source { color: #d0e2d4; font-size: .61rem; line-height: 1.4; }
.city-space-head { position: absolute; z-index: 8; top: 10px; left: 12px; right: 12px; display: flex; justify-content: space-between; gap: 12px; color: #d2f5e2; font-size: .63rem; text-transform: uppercase; text-shadow: 0 1px 5px #000; pointer-events: none; }
.city-space-head span:last-child { color: #a6c5bd; text-align: right; }
.city-space-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.city-space-actions { position: absolute; z-index: 8; bottom: 34px; left: 10px; right: 10px; display: flex; justify-content: center; gap: 7px; }
.city-space-actions button { min-width: 0; padding: 7px 10px; border: 1px solid #8bbfad; border-radius: 9px; background: #092024e8; color: #e6f8e9; font: inherit; font-size: .62rem; text-transform: uppercase; }
.city-space-actions button:hover, .city-space-actions button:focus-visible { border-color: var(--green); background: #194233; outline: none; }
.city-space-actions button:disabled { opacity: .36; }
.city-local-empty { position: absolute; z-index: 7; left: 50%; top: 48%; transform: translate(-50%, -50%); width: 75%; text-align: center; color: var(--soft); }
.city-local-empty[hidden] { display: none; }
.city-map-caption { position: absolute; z-index: 8; left: 8px; right: 8px; bottom: 5px; margin: 0; color: #b5cfc4; font-size: .58rem; text-align: center; text-shadow: 0 1px 5px #000; pointer-events: none; }
.city-details { min-height: 0; overflow-y: auto; padding: 5px 2px 2px; }
.city-aura-scale { display: grid; gap: 7px; margin: 14px 0; }
.city-aura-row { display: grid; grid-template-columns: 80px 1fr 24px; gap: 8px; align-items: center; text-transform: lowercase; }
.city-aura-row > span:last-child { text-align: right; }
.city-aura-track { height: 9px; overflow: hidden; background: #314033; border-radius: 9px; }
.city-aura-track i { display: block; height: 100%; border-radius: inherit; }
.city-sample-note { color: var(--soft); font-size: .66rem; }
.city-thoughts { display: grid; gap: 7px; }
.city-thought { width: 100%; padding: 9px; border: 1px solid #4c7657; border-radius: 10px; background: #10271b; color: var(--ink); text-align: left; line-height: 1.45; overflow-wrap: anywhere; }
.city-thought:hover, .city-thought:focus-visible { border-color: var(--green); }
.thought-source { display: block; margin-top: 5px; color: var(--soft); font-size: .62rem; line-height: 1.35; }
.thought-source[hidden] { display: none; }
.earth-empty { position: absolute; left: 50%; bottom: 8%; width: 90%; transform: translateX(-50%); text-align: center; font-size: .7rem; color: var(--soft); text-shadow: 0 1px 5px #000; }
.location-choice { display: flex; align-items: center; gap: 9px; text-transform: none !important; cursor: pointer; }
.location-choice input { width: 17px; height: 17px; accent-color: var(--green); }
.location-note { color: var(--soft); font-size: .68rem; line-height: 1.5; margin: 0 0 5px; }

.region {
  position: absolute;
  z-index: 4;
  inset: 0;
  padding: 14px;
  background: radial-gradient(ellipse at 48% 48%, #183122, #06120b 78%);
  display: flex;
  flex-direction: column;
}
.region-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.region-heading h2 {
  margin: 0;
  color: var(--green);
  font-size: .83rem;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.region .map-hint { margin: 5px 0 9px; }
.region .thought-map { flex: 1; min-height: 0; height: auto; }
.thought-interactions { --aura: #9fc79a; position: absolute; z-index: 10; inset: 0; display: grid; grid-template-rows: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; padding: 12px; background: radial-gradient(ellipse at 50% 24%, color-mix(in srgb, var(--aura) 13%, #06120b), #04100bf5 70%); box-shadow: 0 0 55px #000c; font-size: .73rem; animation: interaction-arrive .28s ease-out both; }
@keyframes interaction-arrive { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.interaction-original { min-height: 0; display: flex; flex-direction: column; gap: 8px; }
.interaction-original-card { flex: 1; min-height: 0; width: min(82%, 520px); margin: 0 auto; padding: 14px 18px; display: flex; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; border: 1px solid var(--aura); border-radius: 12px; background: linear-gradient(145deg, color-mix(in srgb, var(--aura) 17%, #12313b), #081520 70%); box-shadow: 0 12px 36px #000a, 0 0 24px color-mix(in srgb, var(--aura) 27%, transparent); transform: perspective(900px) translateZ(-70px) scale(.92); }
.interaction-response { position: relative; min-height: 0; overflow-y: auto; padding: 12px; border: 1px solid #88b58d; border-radius: 12px; background: #07160ff5; box-shadow: 0 0 35px #0009; }
#interaction-author { margin: 6px 0 9px; text-align: left; }
.interaction-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; text-transform: uppercase; color: var(--green); }
.interaction-head button { color: var(--ink); background: transparent; border: 1px solid var(--line); width: 28px; height: 28px; }
.interaction-thought { max-height: 100%; min-height: 0; margin: auto 0; overflow-y: auto; white-space: pre-wrap; overflow-wrap: anywhere; text-align: center; font-size: clamp(.77rem, 1.8vw, 1.02rem); line-height: 1.42; }
.interaction-original-card .thought-source { flex: none; max-width: 100%; margin: 4px 0 0; text-align: center; }
.thought-reaction-summary { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 5px 10px; margin-top: 5px; color: #e8eee8; font-size: .66rem; line-height: 1; }
.thought-reaction-summary[hidden] { display: none; }
.thought-reaction-summary > span { display: inline-flex; align-items: center; gap: 3px; white-space: nowrap; }
.reaction-symbol { display: inline-flex; align-items: center; justify-content: center; width: 1.25em; height: 1.25em; color: currentColor; font-family: Georgia, serif; font-size: 1.1em; line-height: 1; }
.reaction-symbol svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.reaction-symbol img { width: 100%; height: 100%; object-fit: contain; }
.reaction-hint { position: absolute; right: 12px; top: 5px; z-index: 2; padding: 4px 8px; border: 1px solid var(--green); border-radius: 8px; background: #173322; color: #edffe8; box-shadow: 0 7px 18px #000a; text-transform: lowercase; pointer-events: none; }
.reaction-hint[hidden] { display: none; }
.reaction-list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 5px; margin-top: 9px; }
.reaction-list button { min-width: 0; min-height: 42px; border: 1px solid #777; border-radius: 8px; background: #151a17; color: #f4f4f4; padding: 4px; font-size: 1.25rem; line-height: 1; }
.reaction-list button[aria-pressed="true"] { border-color: #fff; background: #444; }
.reaction-list button .reaction-symbol { margin: auto; }
.interaction-contact-actions { margin-top: 6px; }
.interaction-contact-actions .request-author { min-height: 32px; width: 100%; padding: 6px 10px; border: 1px solid var(--green); border-radius: 8px; background: #10271b; color: var(--green); font: inherit; font-size: .67rem; font-weight: 700; }
.comment-list { list-style: none; padding: 0; margin: 14px 0; max-height: 160px; overflow-y: auto; }
.comment-list li { border-top: 1px solid #28432d; padding: 7px 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.comment-list time { display: block; color: var(--soft); font-size: .61rem; }
.comment-form { display: grid; gap: 6px; }
.comment-form label { color: var(--soft); }
.comment-form textarea { width: 100%; padding: 8px; }
.comment-form div { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--soft); }
.comment-form button[type=submit] { min-height: 30px; padding: 5px 9px; }
.comment-form .comment-share-choice{display:flex;align-items:flex-start;gap:8px;font-size:.62rem;line-height:1.35;text-transform:none}
.comment-share-choice input{margin:2px 0 0;min-width:auto;accent-color:#8ee5a0}
.comment-list li button{display:block;margin-top:7px;text-align:left;font-size:.59rem}

.aura {
  transition: transform .5s ease, opacity .5s ease, filter .5s ease;
}
.aura-1::before { background: radial-gradient(ellipse, #3ba6bcad, #24728455 46%, transparent 76%); }
.aura-2::before { background: radial-gradient(ellipse, #7976d3ad, #544d9955 46%, transparent 76%); }
.aura-3::before { background: radial-gradient(ellipse, #59b675ad, #3a855455 46%, transparent 76%); }
.aura-4::before { background: radial-gradient(ellipse, #e6b64ead, #a27d2755 46%, transparent 76%); }
.aura-5::before { background: radial-gradient(ellipse, #eb748bad, #a5435b55 46%, transparent 76%); }
.aura.selected { transform: scale(1.24); }
.aura-map:has(.aura.selected) .aura:not(.selected) { opacity: .65; filter: blur(2px); }
.region-enter { animation: region-zoom .55s ease-out both; }
@keyframes region-zoom {
  from { opacity: 0; transform: scale(.92); }
  to { opacity: 1; transform: scale(1); }
}

.thought-map {
  position: relative;
  height: min(66vh, 600px);
  min-height: 420px;
  overflow: hidden;
  cursor: grab;
  touch-action: none;
  outline: none;
  border: 0;
  background:
    radial-gradient(ellipse at 45% 49%, #3452474a 0, transparent 47%),
    radial-gradient(ellipse at 68% 25%, #6a537a28 0, transparent 40%),
    radial-gradient(ellipse at 25% 80%, #4f685036 0, transparent 45%),
    #05100b;
}

.thought-map:focus-visible { outline: 1px solid var(--green); }
.thought-map:active { cursor: grabbing; }
.thought-map::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .27;
  background: radial-gradient(#b9d0ba 1px, transparent 1px) 0 0 / 25px 25px;
}

.thought-world {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 0;
  height: 0;
  transform-origin: 0 0;
  transition: transform .55s cubic-bezier(.2,.8,.2,1);
  will-change: transform;
}
.thought-map.is-dragging .thought-world { transition: none; }

.map-thought {
  --aura: #9fc79a;
  position: absolute;
  width: 220px;
  min-height: 120px;
  padding: 17px 19px;
  transform: translate(-50%, -50%);
  border: 0;
  border-radius: 39% 56% 43% 47% / 23% 19% 24% 20%;
  background: radial-gradient(ellipse at 50% 48%, color-mix(in srgb, var(--aura) 22%, #10221a) 0, #0a1a12ed 52%, transparent 100%);
  isolation: isolate;
  color: var(--ink);
  text-align: left;
  line-height: 1.5;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 10px;
  transition: width .5s ease, min-height .5s ease, transform .5s ease, background .5s ease;
}

.map-thought::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -28px;
  pointer-events: none;
  border-radius: 46% 54% 62% 38% / 54% 40% 60% 46%;
  background: radial-gradient(ellipse, color-mix(in srgb, var(--aura) 24%, transparent), transparent 70%);
  filter: blur(18px);
  opacity: .85;
  transition: inset .5s ease, opacity .5s ease;
}

.map-thought:hover, .map-thought:focus-visible, .map-thought.expanded {
  background: radial-gradient(ellipse at 50% 48%, color-mix(in srgb, var(--aura) 33%, #10221a), #0a1a12f5 56%, transparent 100%);
}
.map-thought:hover::before, .map-thought.expanded::before { inset: -43px; opacity: 1; }
.map-thought:focus-visible { outline: 2px solid var(--aura); outline-offset: 3px; }
.map-thought.expanded {
  z-index: 2;
  width: min(310px, 78vw);
  min-height: 180px;
  max-height: 330px;
  border-radius: 33% 50% 39% 45% / 17% 18% 16% 20%;
  transform: translate(-50%, -50%) scale(1.04);
  background: radial-gradient(ellipse at 50% 40%, color-mix(in srgb, var(--aura) 37%, #10221a), #091810e8 78%, transparent 100%);
}
.map-thought-body {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  line-clamp: 4;
  overflow: hidden;
  font-size: .79rem;
}
.map-thought.expanded .map-thought-body {
  display: block;
  max-height: 240px;
  overflow: auto;
  font-size: .93rem;
}
.map-thought-date { color: var(--soft); font-size: .64rem; }
.map-empty {
  position: absolute;
  width: 220px;
  transform: translate(-50%, -50%);
  color: var(--soft);
  text-align: center;
  font-size: .8rem;
}
.map-controls {
  position: absolute;
  z-index: 3;
  right: 12px;
  bottom: 12px;
  display: flex;
  gap: 4px;
  padding: 4px;
  background: #06120cf2;
  border: 1px solid #355640;
}
.overview-zoom-level { align-self: center; min-width: 34px; padding: 0 4px; color: var(--soft); font-size: .62rem; text-align: center; }
.overview-zoom-level[hidden] { display: none; }
.map-controls button {
  width: 38px;
  height: 38px;
  border: 0;
  background: transparent;
  color: var(--green);
  font-size: 1.2rem;
}
.map-controls button:hover, .map-controls button:focus-visible { background: #24472b; }

@media (max-width: 650px) {
  .aura-rank-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .aura-rank-list button { min-height: 36px; }
  .thought-interactions { padding: 8px; gap: 6px; }
  .interaction-original-card { width: min(91%, 370px); padding: 10px 12px; }
  .interaction-thought { font-size: .79rem; line-height: 1.35; }
  .interaction-response { padding: 9px; }
  .reaction-list button { min-height: 37px; font-size: 1.08rem; }
  .city-label { font-size: .42rem; }
  .city-panel { top: auto; bottom: 60px; height: min(53%, 330px); }
  .city-panel.is-pilot { top: 0; bottom: 0; height: 100%; grid-template-rows: auto auto auto minmax(0, 1fr) minmax(72px, 14%); padding: 9px; }
  .city-local-thought { width: min(76%, 320px); height: min(61%, 350px); gap: 7px; }
  .city-thought-body { font-size: .85rem; }
  .city-space-head { font-size: .57rem; }
  .city-space-actions button { padding: 7px 8px; font-size: .55rem; }
  .aura-map { height: 60vh; min-height: 440px; }
  .aura-map:has(.city-panel.is-pilot) { height: calc(100dvh - 82px); min-height: 480px; }
  .region { padding: 10px; }
  .region .thought-map { min-height: 0; }
  .map-thought { width: 195px; }
  .map-thought.expanded { width: min(280px, 72vw); }
}

@media (prefers-reduced-motion: reduce) {
  .thought-interactions { animation: none; }
  .region-enter { animation: none; }
  .aura, .aura-world, .thought-world, .map-thought, .map-thought::before, .city-local-thought, .city-space-floor { transition: none; }
  .city-space-sky { animation: none; }
}

/* Pool Earth uses spherical coordinates; city panels keep their existing layout. */
.is-globe .earth-world { transform: none; transition: none; }
.is-globe .earth-surface { inset: 0; width: 100%; height: 100%; aspect-ratio: auto; transform: none; border: 0; overflow: visible; background: none; pointer-events: none; }
.is-globe .earth-surface::before, .is-globe .earth-shape { display: none; }
.pool-globe-canvas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.is-globe .city-label { min-height: 25px; padding: 4px 6px; font-size: .56rem; transform: none; box-shadow: none; }
.is-globe .earth-marker { pointer-events: auto; transform: translate(-50%, -50%); width: 14px; height: 14px; box-shadow: 0 0 0 5px color-mix(in srgb, var(--aura) 23%, transparent); }
.is-globe .earth-marker[hidden] { display: none; }
.is-globe .earth-empty { left: 10px; right: 10px; bottom: 12px; top: auto; width: auto; transform: none; text-align: left; max-width: calc(100% - 165px); font-size: .57rem; pointer-events: none; }
.globe-caption { position: absolute; left: 16px; top: 12px; margin: 0; color: #bed3bb; font-size: .6rem; letter-spacing: .06em; pointer-events: none; }
.is-globe .city-label:focus-visible { outline: 2px solid #f4cb66; outline-offset: 2px; }
