/* One dark civic workspace. Decorative motion never represents live data. */
:root { color-scheme: dark; --bg:#061426; --surface:rgba(12,34,55,.95); --raised:#142f47; --text:#f1f7fc; --muted:#b8cadb; --line:rgba(151,191,218,.25); --green:#64e8ba; --gold:#f5d575; --blue:#89d4fb; --glass-radius:20px; --glass-padding:clamp(1rem,2vw,1.4rem); }
body { isolation:isolate; background:transparent; }
.civic-atmosphere { position:fixed; inset:0; z-index:-1; overflow:hidden; pointer-events:none; background:#061426; contain:strict; }
.civic-light { position:absolute; width:80vmax; height:80vmax; border-radius:50%; opacity:.46; will-change:transform; }
.civic-light-green { left:-45vmax; top:-25vmax; background:radial-gradient(circle,#09a776,transparent 65%); animation:civic-drift-green 10s ease-in-out infinite alternate; }
.civic-light-gold { right:-48vmax; top:5vmax; background:radial-gradient(circle,#b89523,transparent 62%); opacity:.3; animation:civic-drift-gold 13s ease-in-out infinite alternate; }
.civic-light-blue { left:5vmax; bottom:-55vmax; background:radial-gradient(circle,#167bce,transparent 65%); animation:civic-drift-blue 12s ease-in-out infinite alternate; }
.civic-network { position:absolute; inset:0; width:100%; height:100%; opacity:.8; }
.civic-network-lines path { fill:none; stroke:#70bad4; stroke-width:.85; opacity:.38; }
.civic-network-pulses path { fill:none; stroke:#74efc8; stroke-width:2.2; stroke-linecap:round; stroke-dasharray:24 260; animation:civic-network-flow 9s linear infinite; }
.civic-network-nodes { fill:#f5d575; opacity:.65; animation:civic-node-glow 6s ease-in-out infinite alternate; }
@keyframes civic-drift-green { to { transform:translate(12vmax,18vmax) scale(1.1); } }
@keyframes civic-drift-gold { to { transform:translate(-16vmax,12vmax); } }
@keyframes civic-drift-blue { to { transform:translate(-8vmax,-18vmax) scale(1.15); } }
@keyframes civic-network-flow { to { stroke-dashoffset:-1124; } }
@keyframes civic-node-glow { to { opacity:.25; } }
.site-header,.mobile-dock { background:rgba(7,25,43,.94); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); }
.site-header { border-top:0; }
.site-footer { background:rgba(6,20,38,.6); margin-top:2rem; }
.container { padding-top:1.5rem; }
.panel,.form-panel,.visual-card,.core-record,.core-paths .core-path,.core-region,.core-presentation,.core-intro,.core-profile .core-rating-card,.core-profile .performance-question,.core-profile .profile-opinion,.performance-financing,.account-shell form { border-radius:var(--glass-radius); background:linear-gradient(135deg,rgba(37,89,112,.1),transparent 65%),var(--surface); box-shadow:inset 0 1px rgba(205,235,255,.035),0 12px 36px rgba(0,9,23,.12); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.panel,.form-panel,.core-record,.account-shell form { padding:var(--glass-padding); }
.container > .panel + .panel,.container > .grid + .panel,.core-paths + .panel,.core-paths + section,.core-paths + details { margin-top:1rem; }
.core-home > .panel,.core-home > details { margin-block:1rem; }
.core-paths .core-path { grid-template-rows:auto auto 1fr auto; gap:.6rem; align-content:stretch; }
.core-paths .core-path > .icon { grid-column:1/-1; justify-self:end; margin-top:.15rem; }
.core-paths .core-path > span:not(.core-path-icon) { grid-column:1/-1; }
.core-paths .core-path strong { margin:0; }
.core-paths .core-path-icon { margin:0 0 .15rem; }
h1,h2,h3,h4 { text-wrap:balance; }
.panel > .icon-tile + h2,.panel > .icon-tile + h3,.panel > .icon + h3 { margin-top:.65rem; }
.panel > :first-child { margin-top:0; }
.panel > :last-child { margin-bottom:0; }
button,.button { border-radius:12px; min-height:46px; }
input:not([type=checkbox]):not([type=radio]),select,textarea { border-radius:12px; }
input[type=checkbox],input[type=radio] { accent-color:var(--green); }
/* A consistent, quiet disclosure affordance; meaning remains in the label. */
details > summary { cursor:pointer; min-height:48px; line-height:1.4; list-style:none; display:flex; align-items:center; gap:.75rem; padding:.75rem 0; color:var(--text); font-weight:600; }
details > summary::-webkit-details-marker { display:none; }
details > summary::marker { content:""; }
details > summary::after { content:"+"; display:grid; place-items:center; flex:0 0 26px; width:26px; height:26px; margin-left:auto; color:var(--green); font-size:1.35rem; font-weight:400; line-height:1; border:1px solid var(--line); border-radius:8px; }
:root details:not([open]) > summary::after { content:"+"; }
:root details[open] > summary::after { content:"−"; }
details > summary > .icon:last-child:not(:first-child) { display:none; }
details[open] > summary { margin-bottom:.45rem; }
details details > summary { font-weight:500; }
.account-shell { max-width:620px; }
.account-shell > h1 { margin-top:0; }
.account-shell .account-field { margin:0 0 1rem; }
.account-shell .account-field > label { margin-bottom:.45rem; }
.account-shell .account-choice > label { display:flex; align-items:center; gap:.7rem; min-height:44px; padding:.2rem 0; margin:0; cursor:pointer; font-weight:500; }
.account-shell .account-choice input { margin:0; flex:0 0 21px; width:21px; height:21px; min-height:0; }
.account-shell .account-choice .errorlist { width:100%; }
.account-shell form button[type=submit] { width:100%; background:var(--green); color:var(--ink); border-color:var(--green); }
.account-shell .helptext { margin-top:.4rem; }
.civic-help-launcher { position:fixed; right:1.1rem; bottom:1.1rem; z-index:20; width:48px; height:48px; padding:0; border-radius:16px; color:var(--green); border-color:rgba(100,232,186,.5); background:#102e43; box-shadow:0 4px 20px rgba(0,0,0,.3); }
.civic-help-launcher .icon { width:23px; height:23px; }
.body-modal .civic-help-launcher,.body-guide .civic-help-launcher { visibility:hidden; }
/* A short trace reveals each graphic; gentle ambient colour stays outside its data. */
.core-ring-segment,.performance-meter-fill { animation:none; }
.metric-visible .core-ring-segment,.metric-visible .performance-meter-fill { animation:refinement-trace .8s ease-out both; }
.civic-atmosphere.is-paused * { animation-play-state:paused!important; }
@keyframes refinement-trace { from { opacity:.2; stroke-width:3; } to { opacity:1; } }
.core-ring,.performance-meter { transition:filter .25s ease; }
@media (hover:hover) { .core-rating-card:hover .core-ring,.performance-question:hover .performance-meter { filter:drop-shadow(0 0 5px rgba(100,232,186,.15)); } }
@media(max-width:760px) {
 .container { padding:1.2rem 1rem 2.5rem; }
 .core-paths { gap:.75rem; }
 .core-paths .core-path { padding:1rem; min-height:0; }
 .core-paths .core-path strong { font-size:1.05rem; line-height:1.3; }
 .core-paths .core-path > span:not(.core-path-icon) { line-height:1.4; }
 .core-home > .panel,.core-home > details { margin-block:1rem; }
 .site-footer { padding-bottom:2rem; }
 .civic-help-launcher { right:.75rem; bottom:calc(5.2rem + env(safe-area-inset-bottom)); width:44px; height:44px; border-radius:14px; }
 .account-shell { padding-top:1.25rem; }
 .account-shell form { padding:1.15rem; }
}
@media(prefers-reduced-motion:reduce) {
 .civic-light,.civic-network-pulses path,.civic-network-nodes,.core-ring-segment,.performance-meter-fill { animation:none!important; will-change:auto; }
 .core-ring,.performance-meter { transition:none; }
}
@media print { .civic-atmosphere,.civic-help-launcher { display:none; } .panel,.core-record,.core-profile .core-rating-card,.core-profile .performance-question { background:white; box-shadow:none; } }
/* Optional help stays visually secondary and retains the current page. */
.help-dialog .guide-shell { max-width:620px; }
.help-dialog .guide-heading { min-width:0; }
.help-dialog .guide-heading h2 { font-size:1.35rem; }
.help-dialog .guide-heading p { font-size:1rem; line-height:1.4; }
.help-dialog .guide-content { padding:1.25rem; }
.help-topics { display:flex; flex-wrap:wrap; gap:.5rem; margin:1rem 0; }
.help-topics button { font-size:1rem; text-align:left; justify-content:flex-start; padding:.6rem .8rem; background:rgba(27,65,84,.5); font-weight:500; }
.help-conversation { display:grid; gap:.8rem; margin:1rem 0; }
.help-question,.help-answer { border:1px solid var(--line); border-radius:16px; padding:.9rem 1rem; max-width:94%; overflow-wrap:anywhere; }
.help-question { justify-self:end; background:var(--soft-green); }
.help-answer { justify-self:start; background:var(--surface); }
.help-question strong,.help-answer strong { font-size:.9rem; color:var(--muted); }
.help-question p,.help-answer p { margin:.3rem 0 0; line-height:1.5; }
.help-dialog .guide-search { display:flex; align-items:stretch; gap:.5rem; }
.help-dialog .guide-search input { min-width:0; flex:1; width:100%; }
.help-dialog .guide-search button { flex:0 0 48px; }
.help-limits { border-top:1px solid var(--line); margin-top:1rem; }
.help-limits p,.help-dialog .guide-input-note { color:var(--muted); font-size:1rem; line-height:1.45; }
@media(max-width:480px) { .help-dialog .guide-content { padding:1rem; } .help-dialog .guide-header { padding:1rem; } .help-topics { display:grid; grid-template-columns:1fr; } .help-dialog .guide-heading #journey-guide-description { max-width:none; } .help-question,.help-answer { max-width:100%; } }
/* Disclosure stacks keep the same breathing room as cards on every route. */
.method-reading, .container > section:has(> details.panel) { display:grid; gap:.8rem; margin-block:1rem; }
.method-reading > details.panel, .container > section > details.panel { margin:0; }
.container > details.panel { margin-block:.8rem; }
details.panel { padding-block:.35rem; }
details.panel > summary { padding-block:.65rem; }
details.panel[open] { padding-bottom:1rem; }
details.panel > summary + p { margin-top:.4rem; }

/* Glass is a material, not transparency: dense reading surfaces and a lit rim.
   Motion belongs to the decorative background, never a live-work claim. */
:root {
 --glass-surface:linear-gradient(130deg,rgba(78,139,160,.17),rgba(17,47,69,.04) 42%,rgba(26,82,104,.12)),rgba(10,31,51,.95);
 --glass-edge:rgba(147,202,222,.34);
 --glass-shadow:inset 0 1px 0 rgba(222,246,255,.2),inset 1px 0 0 rgba(175,228,240,.06),inset 0 -1px 0 rgba(2,10,22,.7),0 14px 32px rgba(0,7,18,.23);
}
.civic-atmosphere::before,.civic-atmosphere::after { content:""; position:absolute; pointer-events:none; }
.civic-atmosphere::before { inset:-20%; background:radial-gradient(ellipse at 15% 25%,rgba(21,206,145,.17),transparent 38%),radial-gradient(ellipse at 83% 75%,rgba(56,145,227,.19),transparent 42%); animation:civic-field-shift 11s ease-in-out infinite alternate; }
.civic-atmosphere::after { width:65vmax; height:65vmax; top:25%; left:35%; border:1px solid rgba(242,209,97,.12); border-radius:28%; transform:rotate(45deg); animation:civic-orbit 17s ease-in-out infinite alternate; }
@keyframes civic-field-shift { to { transform:translate3d(5%,-7%,0) scale(1.12); } }
@keyframes civic-orbit { to { transform:translate3d(-10%,-12%,0) rotate(61deg); } }
:is(.panel,.card,.form-panel,.visual-card,.core-record,.core-paths .core-path,.core-region,.core-presentation,.core-intro,.territory-explorer,.explore-selections,.performance-financing,.account-shell form),
.core-profile :is(.core-rating-card,.performance-question,.profile-opinion) {
 background:var(--glass-surface); border-color:var(--glass-edge); box-shadow:var(--glass-shadow);
 backdrop-filter:blur(18px) saturate(135%); -webkit-backdrop-filter:blur(18px) saturate(135%);
}
:is(.panel,.card,.core-record,.visual-card,.territory-explorer,.explore-selections) { border-radius:var(--glass-radius); }
.site-header { background:linear-gradient(110deg,rgba(67,112,133,.14),transparent 60%),rgba(6,23,40,.96); border-bottom:1px solid var(--glass-edge); box-shadow:inset 0 -1px rgba(189,230,244,.05),0 6px 25px rgba(0,8,19,.18); }
.site-header .nav-shell { background:rgba(8,29,47,.98); border:1px solid var(--glass-edge); box-shadow:var(--glass-shadow); border-radius:18px; }
.site-header .public-nav a { border-radius:12px; }
.site-header .public-nav a[aria-current=page] { color:var(--green); background:rgba(25,98,83,.34); }
.journey-guide { background:rgba(7,24,41,.98); }
.help-dialog .guide-shell { background:var(--glass-surface); }
.help-dialog .guide-header { background:rgba(12,35,54,.98); }
.help-topics button,.following-selector a,.explore-tabs a { box-shadow:inset 0 1px rgba(206,242,255,.09); background:linear-gradient(135deg,rgba(97,162,179,.12),transparent),rgba(12,34,53,.94); }
.explore-tabs .is-active,.following-selector a[aria-current=page] { background:linear-gradient(145deg,#20584f,#123b3e); box-shadow:inset 0 1px rgba(160,255,219,.22),0 0 16px rgba(59,224,171,.08); color:#e3fff5; border-color:#64d8b6; }
.civic-help-launcher { background:linear-gradient(145deg,#235265,#0b293f); box-shadow:inset 0 1px rgba(211,246,255,.25),0 7px 22px rgba(0,8,20,.35); }
@media(min-width:761px) {
 .site-header .nav-shell { padding:.25rem .5rem; }
}
@media(max-width:760px) {
 .header-actions .account-link { display:none; }
 .mobile-dock { gap:.35rem; padding:.5rem .65rem calc(.5rem + env(safe-area-inset-bottom)); border-top:1px solid rgba(173,220,238,.4); background:linear-gradient(135deg,rgba(76,132,155,.2),rgba(16,47,64,.15)),rgba(7,25,43,.97); box-shadow:inset 0 1px rgba(216,245,255,.1),0 -10px 32px rgba(0,8,20,.3); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); }
 .mobile-dock :is(a,button) { position:relative; min-width:0; min-height:60px; padding:.5rem .25rem; border:1px solid transparent; border-radius:16px; gap:.3rem; color:#c6d9e7; font-size:.875rem; line-height:1.2; font-weight:550; text-decoration:none; }
 .mobile-dock :is(a,button)>.icon { width:23px; height:23px; min-width:23px; padding:0; border-radius:0; background:transparent; color:inherit; }
 .mobile-dock [aria-current=page] { background:linear-gradient(140deg,rgba(49,135,110,.47),rgba(18,66,66,.65)); border-color:rgba(107,225,187,.4); color:#a3ffdb; box-shadow:inset 0 1px rgba(190,255,232,.22),0 3px 14px rgba(4,15,27,.2); }
 .mobile-dock [aria-current=page]::before { content:""; position:absolute; top:0; left:calc(50% - 13px); width:26px; height:2px; border-radius:0 0 3px 3px; background:#80f2c5; box-shadow:0 0 9px rgba(100,232,186,.6); }
 .mobile-dock-label { display:block; }
 .mobile-dock-caption { display:block; font-size:.75rem; line-height:1.2; color:var(--muted); }
 .site-header .nav-shell { background:rgba(8,29,47,.99); }
 .civic-help-launcher { bottom:calc(6rem + env(safe-area-inset-bottom)); }
}
@media(prefers-reduced-motion:reduce) {
 .civic-atmosphere::before,.civic-atmosphere::after { animation:none!important; }
}
@media print { .civic-atmosphere::before,.civic-atmosphere::after { display:none; } }

/* Observation choices keep the full label visible and the native radio accessible. */
#id_observation { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.65rem; margin:.7rem 0 1rem; }
#id_observation > div { min-width:0; }
#id_observation label { display:flex; align-items:center; gap:.6rem; height:100%; min-height:52px; padding:.75rem; border:1px solid var(--glass-edge); border-radius:12px; background:var(--glass-surface); font-size:1rem; box-sizing:border-box; cursor:pointer; }
#id_observation label:has(input:checked) { border-color:var(--green); background:#154c43; }
#id_observation input { width:20px; height:20px; flex:0 0 20px; margin:0; }
@media(max-width:400px) { #id_observation { grid-template-columns:1fr; } }

/* Moving light follows measured geometry; values and sectors remain fixed. */
.metric-light { fill:none; stroke:#efffff; stroke-width:2.5; stroke-linecap:round; pointer-events:none; opacity:.9; filter:drop-shadow(0 0 2px #b4fff1); animation:metric-light-travel 5.6s linear infinite; animation-play-state:paused; }
.metric-light-line { stroke-width:2.8; animation-duration:6.5s; }
.metric-in-view .metric-light { animation-play-state:running; }
.metric-visible .opinion-chart-series > polyline:not(.metric-light) { animation:metric-line-enter 1s ease-out both; }
@keyframes metric-light-travel { from { stroke-dashoffset:100; } to { stroke-dashoffset:0; } }
@keyframes metric-line-enter { from { opacity:.25; } to { opacity:1; } }
.visual-motion-paused .metric-light { animation-play-state:paused!important; }
.civic-network { animation:civic-network-drift 16s ease-in-out infinite alternate; }
.civic-traveller { fill:#e1fff4; filter:drop-shadow(0 0 4px #72e8c0); animation:civic-travel 20s linear infinite; opacity:.9; }
.civic-traveller:nth-child(3n) { fill:#ffe9a1; filter:drop-shadow(0 0 4px #dfc368); }
.civic-traveller:nth-child(3n + 2) { fill:#a7dfff; }
@keyframes civic-travel { from { offset-distance:0%; } to { offset-distance:100%; } }
@keyframes civic-network-drift { to { transform:translate3d(12px,-14px,0) scale(1.025); } }
/* More specific than the legacy open menu rule: opaque reading surface. */
.js .site-header .nav-shell.is-open { background:linear-gradient(125deg,#16384b,#092236 65%,#102d40); border-color:rgba(184,227,241,.42); box-shadow:inset 0 1px rgba(235,255,255,.25),inset 1px 0 rgba(195,236,249,.09),0 22px 60px rgba(0,8,20,.65); backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px); opacity:1; }
@media(prefers-reduced-motion:reduce) {
 .civic-network,.civic-traveller,.metric-light,.metric-visible .opinion-chart-series > polyline { animation:none!important; }
 .metric-light,.civic-travellers { display:none; }
}
@media print { .metric-light { display:none; } }
.opinion-chart .metric-light-line { stroke:#efffff; stroke-width:2.8; }
@property --aciv-trace-angle { syntax:'<angle>'; inherits:false; initial-value:360deg; }
.metric-visible.core-ring > svg,.metric-visible.performance-meter > svg {
 --aciv-trace-angle:360deg; mask-image:conic-gradient(#000 var(--aciv-trace-angle),transparent 0);
 animation:metric-sector-enter .95s ease-out both;
}
@keyframes metric-sector-enter { from { --aciv-trace-angle:0deg; } to { --aciv-trace-angle:360deg; } }
.metric-visible.opinion-chart > svg { animation:metric-chart-enter 1s ease-out both; }
@keyframes metric-chart-enter { from { clip-path:inset(0 100% 0 0); } to { clip-path:inset(0); } }
@media(prefers-reduced-motion:reduce) {
 .metric-visible.core-ring > svg,.metric-visible.performance-meter > svg,.metric-visible.opinion-chart > svg { animation:none!important; mask-image:none; clip-path:none; }
}
.visual-motion-paused .metric-visible > svg { animation-play-state:paused!important; }
progress.dimension-neutral-bar.metric-in-view::-webkit-progress-value { background-image:linear-gradient(100deg,transparent 20%,rgba(234,255,251,.8) 48%,transparent 75%); background-size:220% 100%; animation:metric-bar-light 5s linear infinite; }
progress.dimension-neutral-bar.metric-in-view::-moz-progress-bar { background-image:linear-gradient(100deg,transparent 20%,rgba(234,255,251,.8) 48%,transparent 75%); background-size:220% 100%; animation:metric-bar-light 5s linear infinite; }
@keyframes metric-bar-light { from { background-position:200% 0; } to { background-position:-200% 0; } }
.visual-motion-paused progress.dimension-neutral-bar::-webkit-progress-value { animation-play-state:paused!important; }
.visual-motion-paused progress.dimension-neutral-bar::-moz-progress-bar { animation-play-state:paused!important; }
@media(prefers-reduced-motion:reduce) {
 progress.dimension-neutral-bar::-webkit-progress-value { animation:none!important; background-image:none!important; }
 progress.dimension-neutral-bar::-moz-progress-bar { animation:none!important; background-image:none!important; }
}

/* Optical depth: dark glass, restrained reflections and luminous network trails. */
:root {
 --glass-surface:linear-gradient(118deg,rgba(195,232,249,.12),rgba(91,157,184,.035) 22%,transparent 45%,rgba(111,185,207,.065) 85%,rgba(211,245,255,.12)),rgba(8,29,46,.88);
 --glass-edge:rgba(157,210,231,.42);
 --glass-shadow:inset 0 1px 0 rgba(232,252,255,.31),inset 1px 0 0 rgba(191,232,249,.12),inset -1px 0 0 rgba(121,186,215,.08),inset 0 -1px 0 rgba(1,10,19,.8),0 8px 30px rgba(0,5,14,.3),0 1px 3px rgba(0,5,14,.25);
}
.civic-atmosphere { background:#05131f; }
.civic-light { opacity:.28; }
.civic-light-gold { opacity:.18; }
.civic-network { opacity:1; }
.civic-network-lines path { stroke:#88c4d6; stroke-width:1; opacity:.4; }
.civic-network-nodes { fill:#b9e6dc; opacity:.8; }
.civic-network-pulses path { opacity:.6; stroke-width:1.4; }
.civic-network-trail { fill:none; stroke:#c6fff0; stroke-width:2; stroke-linecap:round; stroke-dasharray:3 97; filter:drop-shadow(0 0 3px rgba(111,255,214,.9)); animation:civic-trail-travel 14s linear infinite; }
.civic-network-trail:nth-of-type(3n) { stroke:#ffe9a3; filter:drop-shadow(0 0 3px rgba(255,213,104,.65)); }
.civic-network-trail:nth-of-type(3n + 2) { stroke:#c4eaff; }
@keyframes civic-trail-travel { from { stroke-dashoffset:100; } to { stroke-dashoffset:0; } }
.core-profile :is(.core-rating-card,.performance-question) > details { background:linear-gradient(110deg,rgba(183,231,244,.045),transparent); border-radius:10px; }
.core-profile :is(.core-rating-card,.performance-question) > details > summary { padding-inline:.6rem; }
.help-dialog .guide-shell { background:linear-gradient(120deg,#16384b,#082337 65%); }
@media (prefers-reduced-motion:reduce) { .civic-network-trail { display:none; animation:none!important; } }
@media print { .civic-network-trail { display:none; } }

/* Mobile field fills the viewport instead of cropping a square illustration. */
.civic-network { inset:-3%; width:106%; height:106%; animation:civic-mobile-field 8s ease-in-out infinite alternate; }
.civic-network-trail { stroke-dasharray:10 90; stroke-width:2.4; }
@keyframes civic-mobile-field {
 from { transform:translate3d(-8px,6px,0); }
 to { transform:translate3d(14px,-16px,0); }
}
@media(prefers-reduced-motion:reduce) { .civic-network { animation:none!important; } }

/* Citizen action hierarchy and a visible background light on portrait screens. */
.demand-entry { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem; padding:1rem 0 1.5rem; }
.demand-entry h1 { margin:.2rem 0; font-size:clamp(1.6rem,5vw,2.2rem); }
.follow-control { display:flex; align-items:center; flex-wrap:wrap; gap:.6rem; }
.follow-control form { margin:0; }
.following-selector { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.5rem; }
.following-selector a { min-width:0; padding:.75rem .5rem; flex-wrap:wrap; justify-content:center; }
.demand-preview { margin:.5rem 0; }
.demand-preview img { width:100%; max-height:210px; object-fit:cover; border-radius:14px; }
.demand-preview figcaption { font-size:.8rem; color:var(--muted); }
.demand-people a { color:inherit; text-underline-offset:.2em; }
.civic-light-passage { position:absolute; left:-35%; top:15%; width:90%; height:55%; background:radial-gradient(ellipse,rgba(25,202,156,.32),rgba(17,118,181,.16) 45%,transparent 70%); animation:civic-light-passage 7s ease-in-out infinite alternate; will-change:transform; }
@keyframes civic-light-passage { from { transform:translate3d(-8%,0,0) rotate(-15deg); } to { transform:translate3d(75%,45%,0) rotate(20deg); } }
.visual-motion-paused .civic-light-passage { animation-play-state:paused; }
@media(max-width:600px) { .following-selector { grid-template-columns:repeat(2,minmax(0,1fr)); } .demand-entry .primary { width:100%; justify-content:center; } }
@media(prefers-reduced-motion:reduce) { .civic-light-passage { animation:none!important; will-change:auto; } }
@media print { .civic-light-passage { display:none; } }
/* A perceptible light layer independent of SVG/CSS path animation. */
.civic-moving-lights { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.preview-follow { display:flex; flex-wrap:wrap; align-items:center; gap:.65rem; }
.preview-follow small { display:block; flex-basis:100%; color:var(--muted); }
.preview-street svg { width:100%; height:auto; max-height:210px; display:block; }
.preview-street figcaption { font-size:.85rem; color:var(--muted); margin-top:.6rem; }
@media print { .civic-moving-lights { display:none; } }
.demand-people .badge { display:block; line-height:1.6; }
.demand-people .badge > .icon { vertical-align:middle; margin-right:.3rem; }
/* Aurora and optical glass replace the former polygonal network. */
.civic-aurora { background:radial-gradient(ellipse at 10% 20%,#073e43 0,transparent 52%),radial-gradient(ellipse at 90% 70%,#0a3154 0,transparent 55%),#04131f; }
.aurora-fallback { position:absolute; inset:0; background:linear-gradient(135deg,transparent 25%,rgba(32,218,157,.09) 42%,transparent 55%,rgba(67,145,235,.12) 72%,transparent); }
:root { --glass-surface:linear-gradient(125deg,rgba(193,239,255,.18),rgba(93,168,194,.04) 30%,rgba(7,28,44,.22) 65%,rgba(126,213,237,.10)),rgba(7,26,41,.72); --glass-edge:rgba(171,224,244,.5); --glass-shadow:inset 0 1px 0 rgba(233,254,255,.48),inset 1px 0 rgba(186,236,255,.15),inset 0 -1px rgba(0,5,15,.65),0 16px 44px rgba(0,7,18,.3); }
body .container :is(.panel,.card,.core-record,.core-profile-header,.core-rating-card,.performance-question,.profile-opinion,.core-path,.core-region,.core-intro,.account-shell form,.following-selector a,.following-view,.form-panel,.territory-explorer,.explore-selections) {
 background:var(--glass-surface); border:1px solid var(--glass-edge); box-shadow:var(--glass-shadow); backdrop-filter:blur(14px) saturate(145%); -webkit-backdrop-filter:blur(14px) saturate(145%);
}
.core-profile :is(.core-rating-card,.performance-question,.profile-opinion) { background:var(--glass-surface); backdrop-filter:blur(14px) saturate(145%); -webkit-backdrop-filter:blur(14px) saturate(145%); }
.mobile-dock,.site-header { background:linear-gradient(120deg,rgba(123,205,230,.13),transparent),rgba(6,24,38,.88); box-shadow:inset 0 1px rgba(222,250,255,.25); }
.person-avatar { position:relative; display:inline-grid; place-items:center; width:56px; height:56px; flex:0 0 56px; border-radius:50%; overflow:hidden; background:linear-gradient(145deg,#176b6a,#143955); border:2px solid rgba(121,235,206,.65); color:#efffff; font-size:1.1rem; font-weight:700; box-shadow:0 0 0 4px rgba(81,198,175,.08); }
.person-avatar img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.core-profile-header > .person-avatar { width:88px; height:88px; flex-basis:88px; font-size:1.7rem; }
.demand-people { display:flex; flex-wrap:wrap; gap:1rem; margin:1rem 0; }
.demand-person { display:flex; align-items:center; gap:.8rem; padding:.75rem 1rem; background:rgba(22,57,74,.55); border:1px solid rgba(151,208,223,.3); border-radius:18px; flex:1 1 240px; }
.demand-person small { display:block; margin-top:.3rem; color:var(--muted); }
.demand-diagram { padding:1rem; margin:1rem 0; border-radius:18px; border:1px solid rgba(151,208,223,.25); background:linear-gradient(120deg,rgba(30,96,109,.4),rgba(11,36,54,.65)); }
.demand-diagram-scene { display:flex; align-items:center; justify-content:space-between; position:relative; min-height:100px; overflow:hidden; padding:0 1rem; }
.diagram-theme,.diagram-result { position:relative; display:grid; place-items:center; width:74px; height:74px; border-radius:18px; background:rgba(56,163,165,.15); border:1px solid rgba(137,226,223,.4); color:#9df3dc; flex-shrink:0; }
.diagram-theme .icon,.diagram-result .icon { width:40px; height:40px; }
.diagram-result { color:#edce80; border-style:dashed; }
.positive .diagram-result { color:#7ce6bc; border-style:solid; }
.diagram-route { display:flex; justify-content:space-around; align-items:center; flex:1; margin:0 1rem; height:2px; background:linear-gradient(90deg,#55c8b1,#81bdd5,#e8c76d); }
.diagram-route i { width:8px; height:8px; border-radius:50%; background:#9bdcca; box-shadow:0 0 12px rgba(90,222,193,.5); }
.diagram-labels { display:flex; justify-content:space-between; gap:1rem; margin:.7rem 0; }
.diagram-labels strong { max-width:48%; font-size:.95rem; }
.diagram-labels strong:last-child { text-align:right; }
.diagram-labels small { display:block; color:var(--muted); font-weight:400; margin-top:.2rem; }
.demand-diagram figcaption { font-size:.8rem; color:var(--muted); }
@supports not (backdrop-filter:blur(1px)) { :is(.panel,.card,.core-record,.core-rating-card) { background:linear-gradient(125deg,#173e50,#092034); } }

.civic-aurora::before,.civic-aurora::after { content:none; animation:none; }

/* Explicit nonnegative layers, following the working reference composition. */
.civic-atmosphere { z-index:0; }
body > .site-header,body > main,body > .site-footer,body > .test-banner { position:relative; z-index:1; }
body > .mobile-dock { z-index:30; }
:root { --glass-surface:linear-gradient(125deg,rgba(202,240,255,.16),rgba(110,186,208,.025) 28%,transparent 65%,rgba(122,219,237,.09)),rgba(7,26,41,.58); }
body .container :is(.panel,.card,.core-record,.core-profile-header,.core-rating-card,.performance-question,.profile-opinion,.core-path,.core-region,.core-intro,.account-shell form,.following-selector a,.following-view,.form-panel,.territory-explorer,.explore-selections) { backdrop-filter:blur(6px) saturate(140%); -webkit-backdrop-filter:blur(6px) saturate(140%); }
.civic-moving-lights { display:block; }
@media print { .civic-atmosphere { display:none; } }

/* Brazil / sapphire glass round: one atmospheric layer, steady measured values. */
.civic-atmosphere::after { display:none; }
.civic-atmosphere::before { background:radial-gradient(ellipse at 15% 25%,rgba(15,145,128,.13),transparent 48%),radial-gradient(ellipse at 85% 75%,rgba(28,107,191,.16),transparent 48%); }
.mobile-dock { background:linear-gradient(115deg,rgba(36,87,117,.75),rgba(8,29,49,.94)); border-top:1px solid rgba(149,220,250,.3); box-shadow:inset 0 1px rgba(210,244,255,.13),0 -8px 30px rgba(0,8,20,.24); }
.mobile-dock :is(a,button) { color:#d3e6f2; }
.mobile-dock [aria-current=page] { color:#c4f8ff; background:linear-gradient(180deg,rgba(27,122,157,.14),rgba(13,70,101,.28)); border-color:transparent; box-shadow:none; }
.mobile-dock [aria-current=page]>.icon { color:#77ebff; filter:drop-shadow(0 0 5px rgba(59,213,255,.4)); }
.mobile-dock [aria-current=page]::before { top:auto; bottom:1px; left:25%; width:50%; height:2px; border-radius:3px; background:#60e8fc; box-shadow:0 0 8px rgba(70,222,255,.5); }
/* Entrance animation is now driven once by visibility, including inline details. */
.core-ring-segment,.performance-meter-fill,.metric-visible.core-ring>svg,.metric-visible.performance-meter>svg,.metric-visible.opinion-chart>svg { animation:none!important; mask-image:none; }
.core-ring-segment { transition:opacity .2s ease; cursor:pointer; }
.metric-legend-choice { display:flex; align-items:center; gap:.5rem; width:100%; min-height:44px; padding:.35rem .45rem; border:1px solid transparent; border-radius:9px; text-align:left; background:transparent; color:inherit; font:inherit; }
.metric-legend-choice[aria-pressed=true] { border-color:rgba(112,225,239,.5); background:rgba(33,121,144,.14); }
.metric-selection { margin:.4rem 0; font-size:.9rem; color:var(--text); }
.metric-card-ready { animation:metric-edge-breathe 14s ease-in-out 2s infinite; }
@keyframes metric-edge-breathe { 0%,18%,100% { border-color:rgba(153,208,230,.28); } 9% { border-color:rgba(130,228,243,.52); } }
.visual-motion-paused .metric-card-ready { animation-play-state:paused; }
@media(prefers-reduced-motion:reduce) { .metric-card-ready { animation:none; } .core-ring-segment { transition:none; } }

/* Approved concept fidelity: sapphire canvas and a floating glass navigation tray. */
.civic-atmosphere { background:radial-gradient(ellipse at 50% 52%,#092c45 0%,#041522 62%,#020b15 100%); }
.civic-atmosphere::before { display:none; }
:root { --glass-surface:linear-gradient(130deg,rgba(164,210,235,.2),rgba(45,94,123,.08) 38%,rgba(27,64,91,.18)),rgba(6,23,39,.64); }
body .container :is(.panel,.card,.core-record,.core-profile-header,.core-rating-card,.performance-question,.profile-opinion,.core-path,.core-region,.core-intro,.account-shell form,.following-selector a,.following-view,.form-panel,.territory-explorer,.explore-selections) { backdrop-filter:blur(2px) saturate(125%); -webkit-backdrop-filter:blur(2px) saturate(125%); border-color:rgba(172,216,240,.36); box-shadow:inset 0 1px rgba(232,249,255,.18),0 12px 30px rgba(0,5,15,.22); }
.core-profile-header::after { display:none; }
.metric-interaction-hint { font-size:.8rem!important; line-height:1.35; color:#c2dae9; margin:.25rem 0 .5rem; }
.core-profile .metric-legend-choice { border-color:rgba(128,195,221,.22); background:rgba(17,50,73,.5); padding:.4rem .5rem; }
.core-profile .metric-legend-choice[aria-pressed=true] { border-color:#6ce4ff; background:#124b65; box-shadow:inset 3px 0 #6ce4ff; }
.core-profile .metric-card-ready { animation:metric-edge-breathe 9s ease-in-out 1s infinite; }
@media(max-width:760px) {
 body>.mobile-dock { left:12px; right:12px; bottom:calc(10px + env(safe-area-inset-bottom)); width:auto; border:1px solid rgba(164,211,242,.4); border-radius:24px; padding:8px 8px 9px; background:linear-gradient(120deg,rgba(40,79,110,.88),rgba(8,27,48,.95)); box-shadow:inset 0 1px rgba(231,249,255,.18),0 8px 26px rgba(0,4,15,.55); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
 body>.mobile-dock :is(a,button) { border:0; border-radius:12px; min-height:60px; font-size:.8rem; font-weight:500; color:#d2dfef; padding:.4rem .15rem .65rem; }
 body>.mobile-dock [aria-current=page] { background:transparent; color:#eefcff; box-shadow:none; }
 body>.mobile-dock [aria-current=page]>.icon { color:#a0f2ff; filter:drop-shadow(0 0 7px #23bfee); }
 body>.mobile-dock [aria-current=page]::before { left:17%; width:66%; bottom:0; background:#55eaff; box-shadow:0 0 10px #20c5ee; }
 .civic-help-launcher { bottom:calc(112px + env(safe-area-inset-bottom)); }
 body { padding-bottom:110px; }
}
@media(prefers-reduced-motion:reduce) { .core-profile .metric-card-ready { animation:none; } }
/* Count up visually while retaining the final semantic value and original units. */
.metric-count-stack { display:inline-grid; position:relative; font:inherit; font-variant-numeric:tabular-nums; }
.metric-count-stack>.metric-count-final,.metric-count-stack>.metric-count-tween { grid-area:1/1; font:inherit; color:inherit; }
.metric-count-stack>.metric-count-final { opacity:0; }
.metric-count-stack>.metric-count-tween { text-align:inherit; }
progress.dimension-neutral-bar::-webkit-progress-value { transform:scaleX(var(--metric-progress,1)); transform-origin:left center; }
progress.dimension-neutral-bar::-moz-progress-bar { transform:scaleX(var(--metric-progress,1)); transform-origin:left center; }
.opinion-chart .opinion-flow-trace { fill:none; stroke:#e8fcff; stroke-width:3; stroke-linecap:round; pointer-events:none; filter:drop-shadow(0 0 3px #55dfff); animation:opinion-flow 5s linear infinite; animation-play-state:paused; }
.opinion-chart.metric-in-view .opinion-flow-trace { animation-play-state:running; }
@keyframes opinion-flow { from { stroke-dashoffset:100; } to { stroke-dashoffset:0; } }
.visual-motion-paused .opinion-chart .opinion-flow-trace { animation-play-state:paused; }
@media(prefers-reduced-motion:reduce) { .opinion-chart .opinion-flow-trace { animation-duration:16s; } }
@media print { .metric-count-tween,.opinion-flow-trace { display:none!important; } .metric-count-stack>.metric-count-final { opacity:1; } }
.performance-number>.metric-count-stack,.core-ring-value>.metric-count-stack { font:inherit; }
.opinion-observatory .opinion-chart-series .opinion-flow-trace { stroke:#e8fcff; stroke-width:3; filter:drop-shadow(0 0 3px #55dfff); }
@media(prefers-reduced-motion:reduce) { .opinion-chart .opinion-flow-trace { animation:opinion-flow 16s linear infinite!important; animation-play-state:paused!important; } .opinion-chart.metric-in-view .opinion-flow-trace { animation-play-state:running!important; } .visual-motion-paused .opinion-chart .opinion-flow-trace { animation-play-state:paused!important; } }
/* Numeric wrappers are not units: preserve their grid/font throughout count-up. */
.core-profile .performance-number>.metric-count-stack,
.core-profile .core-ring-value>.metric-count-stack { display:inline-grid; font:inherit; letter-spacing:inherit; margin:0; }
.core-profile .metric-count-stack>.metric-count-final,
.core-profile .metric-count-stack>.metric-count-tween { display:block; grid-area:1/1; margin:0; font:inherit; letter-spacing:inherit; text-align:center; }
.core-profile .performance-value-row { display:grid; place-items:center; width:116px; height:116px; min-height:116px; }
.core-profile .performance-value-row .performance-meter { grid-area:1/1; width:116px; height:116px; }
.core-profile .performance-value-row .performance-number { position:static; grid-area:1/1; z-index:1; display:flex; align-items:baseline; justify-content:center; gap:.08em; width:auto; max-width:82px; margin:0; padding:0; font-size:1.35rem; line-height:1; letter-spacing:-.03em; white-space:nowrap; overflow-wrap:normal; font-variant-numeric:tabular-nums; }
.core-profile .performance-value-row .performance-number>span:not(.metric-count-stack) { display:inline; margin:0; font-size:.68em; line-height:1; }
.site-footer .footer-brand { display:flex; align-items:center; flex-wrap:wrap; gap:.65rem; }
.site-footer .footer-brand-symbol { display:block; width:42px; height:42px; flex:0 0 42px; object-fit:contain; }
.site-footer .footer-brand strong { font:inherit; }
@media(max-width:360px) { .site-footer .footer-brand { gap:.5rem; } .site-footer .footer-brand span { font-size:.875rem; } }
.core-profile .performance-value-row .metric-count-final { position:absolute; inset:0; }
/* Readable feed introduction over the moving geographic background. */
body .container .following-intro { padding:1.25rem; margin-bottom:1rem; border:1px solid rgba(154,209,233,.28); border-radius:22px; background:linear-gradient(120deg,rgba(15,43,64,.98),rgba(5,22,38,.95)); box-shadow:inset 0 1px rgba(220,246,255,.1); }
.following-intro h1 { color:#f4faff; margin:.35rem 0 .7rem; }
.following-intro .lead { color:#e0ecf4; font-size:1.1rem; line-height:1.6; margin:0; max-width:54ch; }
.following-intro .feed-preview-label { color:#ffe58c; }
/* A numeric amount is one token, including during the count animation. */
.core-profile .performance-number,.core-profile .metric-count-stack,
.core-profile .metric-count-final,.core-profile .metric-count-tween { white-space:nowrap; overflow-wrap:normal; word-break:normal; }
@media(max-width:760px) {
 .core-profile .core-profile-header { grid-template-columns:64px minmax(0,1fr); align-items:center; gap:.8rem; padding:1rem; }
 .core-profile .core-profile-header>.person-avatar { width:64px; height:64px; min-width:64px; font-size:1.4rem; }
 .core-profile .core-profile-header>div:not(.core-profile-actions) { min-width:0; }
 .core-profile .core-profile-header h1 { font-size:1.55rem; line-height:1.2; margin:.4rem 0 0; overflow-wrap:anywhere; }
 .core-profile .core-profile-header .profile-fiction-label { font-size:.8rem; line-height:1.4; padding:.45rem .55rem; margin:0; }
 .core-profile .core-profile-header .core-profile-actions { display:flex; flex-direction:column; align-items:stretch; gap:.65rem; grid-column:1/-1; width:100%; margin-top:.25rem; }
 .core-profile .core-profile-actions .preview-follow { display:contents; }
 .core-profile .core-profile-actions :is(.button,button) { width:100%; min-height:48px; justify-content:center; box-sizing:border-box; font-size:1rem; line-height:1.35; padding:.75rem; }
 .core-profile .core-profile-actions>.primary { order:1; }
 .core-profile .core-profile-actions .preview-follow>small { order:2; flex-basis:auto; font-size:.85rem; line-height:1.5; margin:0; }
 .core-profile .core-profile-actions .preview-follow>.quiet { order:3; }
 .core-profile .core-profile-actions>.quiet { order:4; }
 .core-profile .performance-reading-value>.performance-number { font-size:2rem; margin:.4rem 0; }
 .core-profile .performance-reading { grid-template-columns:110px minmax(0,1fr); gap:.75rem; }
 .core-profile .performance-reading-context { min-width:0; }
 .following-intro h1 { font-size:1.9rem; line-height:1.2; }
}
@media(max-width:359px) { .core-profile .performance-reading { grid-template-columns:1fr; } .core-profile .performance-reading-context { text-align:center; } }

/* Full-width footer surface; align its contents with the central reading area. */
body>.site-footer { width:100%; max-width:none; box-sizing:border-box; margin-inline:0; padding-inline:max(1rem,calc((100% - 1256px)/2)); }
body>.site-footer>div,body>.site-footer>nav { min-width:0; }
@media(max-width:640px) { body>.site-footer { flex-direction:column; gap:1rem; } body>.site-footer>nav { width:100%; } }

/* Shared reading and spacing rules for the introductory screens audited together. */
body .container>.page-top { padding:clamp(1rem,2vw,1.5rem); border:1px solid rgba(154,209,233,.28); border-radius:22px; background:linear-gradient(120deg,rgba(15,43,64,.98),rgba(5,22,38,.95)); margin-block:0 1.25rem; }
body .container>.page-top h1 { margin:.35rem 0 .7rem; line-height:1.2; }
body .container>.page-top .lead { color:#e0ecf4; line-height:1.6; margin:0; }
body .container>.page-top .eyebrow { margin:0; }
.account-service-links { display:flex; flex-wrap:wrap; gap:.65rem; margin:.75rem 0 1.25rem; }
.account-service-links .button { min-height:44px; }
.core-profile .metric-legend-choice:focus-visible { outline:3px solid var(--gold,#f4d36a); outline-offset:3px; }
.detail-return a { display:inline-flex; align-items:center; gap:.4rem; min-height:44px; }
@media(max-width:760px) { .account-service-links .button { flex:1 1 auto; justify-content:center; } .form-panel .actions,.form-panel .form-actions { flex-wrap:wrap; gap:.75rem; } }