/* AWARA Solar Map v0.5 — offline styles only (system fonts, no CDN). */
:root {
  --bg0: #04050d; --bg1: #090c1d; --bg2: #120f2a;
  --ink: #eeeaf6; --ink2: #c3c6da; --mute: #8d93ad;
  --glass: rgba(15, 19, 40, .62); --glass2: rgba(12, 15, 33, .9);
  --line: rgba(255, 255, 255, .09); --line2: rgba(255, 255, 255, .18);
  --sun: #ffd79a; --accent: #9fd8c8; --focus: #ffe2a8;
  --st-active: #86e3b6; --st-working: #93b9ff; --st-waiting: #ebc77f; --st-review: #c6a6ff; --st-done: #a7cfa9;
  --st-blocked: #ff8f7f; --st-hypothesis: #bdb6cf; --st-demo: #74d6d6; --st-draft: #f5d3a1; --st-planned: #8f88a8; --st-historical: #a39478;
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --r: 16px; --ease: cubic-bezier(.22, .8, .24, 1);
}
* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; }
body { background: radial-gradient(1400px 900px at 50% 46%, #17123a 0%, var(--bg1) 45%, var(--bg0) 100%); color: var(--ink); font: 14px/1.45 var(--sans); overflow: hidden; -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; color: inherit; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: fixed; left: -999px; top: 8px; z-index: 100; background: #000; padding: 8px; }
.skip:focus { left: 8px; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
a { color: var(--accent); }
code { font: 12px var(--mono); color: var(--ink2); }

/* ---------- deep space ---------- */
#nebula { position: fixed; inset: -12%; z-index: 0; pointer-events: none; will-change: transform; }
#nebula i { position: absolute; border-radius: 50%; filter: blur(60px); opacity: .55; }
#nebula .n1 { width: 60vw; height: 50vh; left: 8%; top: 18%; background: radial-gradient(closest-side, rgba(92, 64, 190, .55), transparent); }
#nebula .n2 { width: 50vw; height: 60vh; right: 4%; top: 6%; background: radial-gradient(closest-side, rgba(40, 110, 160, .4), transparent); }
#nebula .n3 { width: 46vw; height: 40vh; left: 30%; bottom: 4%; background: radial-gradient(closest-side, rgba(150, 60, 140, .3), transparent); }
#nebula .n4 { width: 36vw; height: 36vh; left: 4%; bottom: 14%; background: radial-gradient(closest-side, rgba(30, 140, 120, .28), transparent); }
#stars { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; }

.glass { background: var(--glass); border: 1px solid var(--line); border-radius: var(--r); backdrop-filter: blur(16px) saturate(125%); -webkit-backdrop-filter: blur(16px) saturate(125%); box-shadow: 0 14px 44px rgba(0, 0, 0, .38); }

/* ---------- top bar ---------- */
.topbar { position: fixed; top: 10px; left: 10px; right: 10px; z-index: 40; display: grid; grid-template-columns: auto minmax(180px, 1fr) auto auto; grid-template-areas: "brand search modes right" "views views views modes2"; gap: 8px 14px; align-items: center; padding: 8px 12px; }
.mode-contemplation .topbar { grid-template-areas: "brand search modes right"; background: rgba(10, 13, 30, .35); }
.brand { grid-area: brand; display: flex; gap: 10px; align-items: center; }
.brand-sun { width: 26px; height: 26px; border-radius: 50%; background: radial-gradient(circle at 40% 38%, #fff6dc, var(--sun) 45%, #d9893f); box-shadow: 0 0 22px rgba(255, 200, 120, .75); flex: none; }
.brand-title { font: 18px var(--serif); letter-spacing: .2em; }
.brand-sub { font-size: 11px; color: var(--mute); white-space: nowrap; }
.search { grid-area: search; position: relative; max-width: 560px; width: 100%; justify-self: center; }
.search input { width: 100%; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--line); background: rgba(255, 255, 255, .05); outline: none; }
.search input:focus { border-color: var(--line2); background: rgba(255, 255, 255, .09); }
.search-results { position: absolute; top: calc(100% + 6px); left: 0; right: 0; list-style: none; margin: 0; padding: 6px; max-height: 60vh; overflow: auto; background: var(--glass2); z-index: 60; }
.search-results li { padding: 8px 10px; border-radius: 10px; cursor: pointer; display: grid; gap: 2px; }
.search-results li[aria-selected="true"], .search-results li:hover { background: rgba(255, 255, 255, .08); }
.sr-name { font-weight: 600; } .sr-meta { font-size: 12px; color: var(--mute); } .sr-empty { color: var(--mute); }
#modes { grid-area: modes; }
.top-right { grid-area: right; display: flex; gap: 8px; align-items: center; justify-content: flex-end; }
.views { grid-area: views; display: flex; gap: 4px; flex-wrap: wrap; }
.views button { border: 1px solid transparent; background: none; color: var(--ink2); padding: 5px 11px; border-radius: 999px; cursor: pointer; min-height: 32px; }
.views button.on { background: rgba(255, 255, 255, .12); color: var(--ink); border-color: var(--line2); }
.data-modes { grid-area: modes2; display: flex; gap: 5px; justify-content: flex-end; flex-wrap: wrap; }
.mode-contemplation .work-only { display: none !important; }
.seg { display: inline-flex; gap: 2px; background: rgba(255, 255, 255, .05); border: 1px solid var(--line); border-radius: 999px; padding: 3px; }
.seg.wrap { flex-wrap: wrap; border-radius: 14px; }
.seg button { border: 0; background: none; padding: 6px 12px; border-radius: 999px; cursor: pointer; color: var(--ink2); min-height: 32px; }
.seg button.on { background: rgba(255, 255, 255, .14); color: var(--ink); }
.prefs { position: fixed; top: 64px; right: 12px; z-index: 70; padding: 14px; width: 300px; display: grid; gap: 8px; background: var(--glass2); }
.pref { display: flex; gap: 8px; align-items: center; min-height: 32px; }

.btn { border: 1px solid var(--line2); background: rgba(255, 255, 255, .08); padding: 8px 13px; border-radius: 10px; cursor: pointer; min-height: 36px; transition: background .2s; }
.btn:hover:not(:disabled) { background: rgba(255, 255, 255, .14); }
.btn:disabled { opacity: .45; cursor: not-allowed; }
.btn.small { padding: 5px 10px; font-size: 12.5px; min-height: 32px; }
.btn.ghost { background: transparent; border-color: var(--line); color: var(--ink2); }
.btn.primary { background: linear-gradient(180deg, rgba(255, 215, 154, .26), rgba(255, 190, 120, .14)); border-color: rgba(255, 215, 154, .5); color: #fff4df; }
.btn.danger { border-color: rgba(255, 143, 127, .45); color: #ffc5bc; }
.icon-btn { flex: none; width: 36px; height: 36px; border-radius: 10px; border: 1px solid var(--line); background: rgba(255, 255, 255, .05); cursor: pointer; display: inline-grid; place-items: center; font-size: 16px; }
.icon-btn:hover { background: rgba(255, 255, 255, .12); }
.linkish { border: 0; background: none; padding: 0; color: var(--accent); cursor: pointer; text-align: left; }
.linkish:hover { text-decoration: underline; }
.linkish.block { display: block; margin: 2px 0; }

.fresh-pill { display: inline-flex; gap: 6px; align-items: center; padding: 5px 10px; border-radius: 999px; font-size: 12px; border: 1px solid var(--line); white-space: nowrap; max-width: 300px; overflow: hidden; text-overflow: ellipsis; }
.fresh-pill .dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; flex: none; }
.fresh-fresh { color: var(--st-active); } .fresh-partial { color: var(--st-waiting); } .fresh-stale, .fresh-no_data { color: var(--st-blocked); }

/* ---------- status chips ---------- */
.status-chips { position: fixed; top: 108px; left: 50%; transform: translateX(-50%); z-index: 15; display: flex; gap: 6px; flex-wrap: wrap; justify-content: center; max-width: calc(100% - 24px); }
.chip { display: inline-flex; gap: 5px; align-items: center; padding: 4px 10px; border-radius: 999px; font-size: 12px; border: 1px solid var(--line); background: rgba(8, 11, 26, .55); cursor: pointer; white-space: nowrap; min-height: 30px; backdrop-filter: blur(6px); }
.chip .chip-l { color: var(--ink2); } .chip b { color: var(--ink); }
.chip[aria-pressed="true"] { border-color: currentColor; background: rgba(255, 255, 255, .1); }

.st-active { color: var(--st-active); } .st-working { color: var(--st-working); } .st-waiting { color: var(--st-waiting); } .st-review { color: var(--st-review); }
.st-done { color: var(--st-done); } .st-blocked { color: var(--st-blocked); } .st-hypothesis { color: var(--st-hypothesis); } .st-demo { color: var(--st-demo); } .st-draft { color: var(--st-draft); } .st-planned { color: var(--st-planned); } .st-historical { color: var(--st-historical); }
.as-unknown { color: #a9a6bd; } .as-standby { color: #a8c7e8; } .as-assigned { color: var(--st-waiting); } .as-acked { color: #b9e3a0; } .as-reported { color: var(--st-working); }
.as-verified { color: var(--st-active); } .as-submitted { color: var(--st-review); } .as-rverified { color: #ffe2a8; } .as-blocked { color: var(--st-blocked); } .as-stale { color: #c9a98a; }

/* ---------- map ---------- */
#stage { position: fixed; inset: 0; z-index: 1; }
#map { width: 100%; height: 100%; display: block; cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; }
#map.dragging { cursor: grabbing; }
.orbit { fill: none; stroke: rgba(255, 255, 255, .055); stroke-dasharray: 2 8; }
.orbit.slow { animation: spin 300s linear infinite; transform-origin: 0 0; }
@keyframes spin { to { transform: rotate(360deg); } }
.ray { fill: none; stroke-linecap: round; }
.branch { stroke-width: 1.2; fill: none; }
.link { fill: none; stroke: rgba(159, 216, 200, .26); stroke-width: 1.2; stroke-dasharray: 3 7; }
.link.hot { stroke: rgba(255, 222, 160, .9); stroke-width: 1.8; animation: flowdash 1.8s linear infinite; }
.link.draft { stroke: rgba(245, 211, 161, .8); stroke-dasharray: 2 5; }
@keyframes flowdash { to { stroke-dashoffset: -20; } }
.flow { fill: #fff3d6; filter: url(#soft); pointer-events: none; }
.node { cursor: pointer; outline: none; }
.node .halo, .node .vglow, .node .pin { pointer-events: none; }
.node .halo { opacity: .38; transition: opacity .4s; }
.node:hover .halo, .node.selected .halo, .node:focus-visible .halo { opacity: .85; }
.node .vglow { opacity: 0; transition: opacity 1.2s; }
.node.verified .vglow { opacity: .9; animation: vbreath 6s ease-in-out infinite; }
@keyframes vbreath { 50% { opacity: .55; } }
.node .ring { fill: none; stroke-width: 1.6; }
.node .pin { fill: none; stroke: none; }
.node.locked .pin { stroke: rgba(255, 226, 168, .7); stroke-width: 1; stroke-dasharray: 1 3; }
.node.status-waiting .ring, .node.status-hypothesis .ring { stroke-dasharray: 3 4; }
.node.status-demo .ring { stroke-dasharray: 1 4; }
.node.status-blocked .ring { animation: warn 2.6s ease-in-out infinite; }
@keyframes warn { 50% { stroke-opacity: .25; } }
.node.alive .halo { animation: breathe 3.8s ease-in-out infinite; }
@keyframes breathe { 50% { opacity: .9; } }
.node.selected .ring { stroke: #fff; stroke-width: 2.4; }
.node:focus-visible .ring { stroke: var(--focus); stroke-width: 3; }
.node.draft .ring { stroke: var(--st-draft); stroke-dasharray: 5 3; }
.node.more .body { stroke: var(--line2); stroke-dasharray: 2 3; }
.node.match .ring { stroke: #fff; stroke-width: 2.4; }
.node.dim { opacity: .14 !important; }
.node .label { fill: var(--ink); font-family: var(--serif); text-anchor: middle; paint-order: stroke; stroke: rgba(4, 5, 13, .88); stroke-width: 4px; stroke-linejoin: round; }
.node .slabel { font: 10.5px var(--sans); text-anchor: middle; paint-order: stroke; stroke: rgba(4, 5, 13, .92); stroke-width: 3px; }
.node .badge { font: 600 11px var(--sans); fill: rgba(4, 5, 13, .85); text-anchor: middle; dominant-baseline: central; pointer-events: none; }
.sun-corona { animation: corona 10s ease-in-out infinite; pointer-events: none; }
@keyframes corona { 50% { r: 166px; opacity: .78; } }
.sun-label { font: 17px var(--serif); letter-spacing: .22em; fill: #fff8e8; text-anchor: middle; paint-order: stroke; stroke: rgba(90, 40, 10, .45); stroke-width: 3px; }
.sun-sub { font: 12px var(--sans); letter-spacing: .4em; fill: #ffe6bf; text-anchor: middle; }
.map-tools { position: fixed; right: 12px; bottom: 94px; z-index: 30; display: flex; flex-direction: column; gap: 6px; padding: 6px; align-items: center; }
.map-tools .btn { min-width: 36px; padding: 4px 6px; font-size: 11.5px; }
.mini { position: fixed; right: 84px; bottom: 94px; z-index: 30; width: 190px; height: 128px; padding: 4px; }
.mini svg { width: 100%; height: 100%; display: block; cursor: crosshair; touch-action: none; }
.mini-view { stroke: rgba(255, 226, 168, .85); fill: rgba(255, 226, 168, .06); }
body[data-view]:not([data-view="map"]) .map-tools, body[data-view]:not([data-view="map"]) .mini, body[data-view]:not([data-view="map"]) .status-chips { display: none; }
.mode-contemplation .mini { opacity: .55; }

/* ---------- panels ---------- */
.panel { position: fixed; z-index: 20; display: flex; flex-direction: column; background: var(--glass2); min-width: 260px; overflow: hidden; animation: pin .32s var(--ease); }
@keyframes pin { from { opacity: 0; transform: translateY(8px); } }
.panel-head { display: flex; align-items: center; gap: 8px; padding: 8px 10px 8px 14px; border-bottom: 1px solid var(--line); cursor: move; touch-action: none; flex: none; }
.panel-title { margin: 0; font: 16px var(--serif); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.panel-actions { display: flex; gap: 4px; }
.panel-actions .icon-btn { width: 32px; height: 32px; font-size: 15px; }
.panel-body { overflow: auto; padding: 12px 14px 16px; flex: 1; overscroll-behavior: contain; }
.panel.collapsed .panel-body, .panel.collapsed .resize-handle { display: none; }
.resize-handle { position: absolute; right: 0; bottom: 0; width: 18px; height: 18px; cursor: nwse-resize; background: linear-gradient(135deg, transparent 50%, rgba(255, 255, 255, .25) 50%, transparent 58%, transparent 66%, rgba(255, 255, 255, .25) 66%, transparent 74%); }
.sheet-grip { display: none; }
.view-panel { z-index: 18; }

/* ---------- inspector / content ---------- */
.crumbs { font-size: 12px; color: var(--mute); margin-bottom: 4px; }
.insp-name { font: 22px/1.2 var(--serif); }
.insp-badges { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
.badge-pill { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 999px; font-size: 11.5px; border: 1px solid var(--line2); background: rgba(255, 255, 255, .05); white-space: nowrap; }
.b-demo { color: var(--st-demo); border-color: rgba(116, 214, 214, .45); } .b-draft { color: var(--st-draft); border-color: rgba(245, 211, 161, .45); }
.b-ok { color: var(--st-active); border-color: rgba(134, 227, 182, .45); } .b-warn { color: var(--st-waiting); border-color: rgba(235, 199, 127, .45); }
.b-bad { color: var(--st-blocked); border-color: rgba(255, 143, 127, .45); } .b-sim { color: #d7b8ff; border-color: rgba(215, 184, 255, .45); }
.astate { font-size: 12px; white-space: normal; }
.tabs { display: flex; flex-wrap: wrap; gap: 3px; margin: 12px 0 8px; border-bottom: 1px solid var(--line); padding-bottom: 6px; }
.tabs button { border: 0; background: none; color: var(--ink2); padding: 5px 9px; border-radius: 8px; cursor: pointer; font-size: 12.5px; min-height: 32px; }
.tabs button.on { background: rgba(255, 255, 255, .12); color: var(--ink); }
.sec { font-size: 11px; letter-spacing: .13em; text-transform: uppercase; color: var(--mute); margin: 16px 0 8px; font-weight: 600; }
.sec.small { margin: 10px 0 4px; }
.sec .count { letter-spacing: 0; }
.desc { color: var(--ink2); margin: 4px 0 10px; }
.kv { display: grid; grid-template-columns: fit-content(42%) minmax(0, 1fr); gap: 4px 12px; margin: 6px 0; font-size: 13px; }
.kv dt { color: var(--mute); } .kv dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.kv.small { font-size: 11.5px; }
.muted { color: var(--mute); } .small { font-size: 12px; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0; }
.chip-btn { font-size: 12px; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--line); background: rgba(255, 255, 255, .04); cursor: pointer; min-height: 30px; }
.btnrow { display: flex; gap: 6px; margin: 10px 0; flex-wrap: wrap; }
.btnrow.sticky { position: sticky; bottom: -16px; padding: 10px 0; background: linear-gradient(transparent, var(--glass2) 30%); }
.form-row { display: flex; gap: 6px; align-items: center; margin: 8px 0; }
.form-row.wrap { flex-wrap: wrap; }
.form, .task-form { display: grid; gap: 8px; }
.form label, .field { display: grid; gap: 3px; font-size: 12px; color: var(--mute); }
.fl { color: var(--ink2); font-size: 12px; }
.hint { font-size: 11px; color: var(--mute); }
input, select, textarea { background: rgba(255, 255, 255, .05); border: 1px solid var(--line); border-radius: 8px; padding: 7px 9px; color: var(--ink); min-height: 34px; max-width: 100%; }
textarea { resize: vertical; font-family: var(--sans); }
#ack-in, .modal textarea { font: 12px/1.5 var(--mono); width: 100%; }
select option { background: #12162c; }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.checks { list-style: none; padding: 0; margin: 0; display: grid; gap: 4px; }
.checks li { display: flex; gap: 8px; } .checks .tk { width: 16px; text-align: center; color: var(--mute); } .checks li.done .tk { color: var(--st-done); } .checks li.done span:last-child { color: var(--mute); }
.warn-line { margin: 8px 0; padding: 7px 10px; border-radius: 10px; border: 1px solid rgba(255, 143, 127, .4); color: #ffcabf; font-size: 12.5px; background: rgba(255, 143, 127, .07); }
.demo-line { margin: 8px 0; padding: 7px 10px; border-radius: 10px; border: 1px dashed rgba(116, 214, 214, .5); color: var(--st-demo); font-size: 12.5px; }
.draft-line { margin: 8px 0; padding: 7px 10px; border-radius: 10px; border: 1px dashed rgba(245, 211, 161, .6); color: var(--st-draft); font-size: 12.5px; }
.src-line { font-size: 13px; margin: 3px 0; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.link-row { display: flex; gap: 8px; align-items: center; margin: 4px 0; flex-wrap: wrap; }
.ev-row { border-left: 2px solid var(--line2); padding: 4px 0 6px 10px; margin: 6px 0; font-size: 13px; }
.ev-meta { font-size: 11.5px; color: var(--mute); display: flex; gap: 4px; flex-wrap: wrap; align-items: center; }
.ev-meta b { color: var(--ink2); font-weight: 600; }
.ev-id { font: 10.5px var(--mono); color: #6f7593; overflow-wrap: anywhere; }
details summary { cursor: pointer; color: var(--mute); font-size: 12px; }

/* agents / tasks */
.agent-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; }
.agent-card { color: var(--ink); border: 1px solid var(--line); border-radius: 14px; padding: 10px 12px; background: rgba(255, 255, 255, .03); display: grid; gap: 4px; }
.agent-card header { font-size: 15px; } .ac-name { font-family: var(--serif); font-weight: 400; font-size: 16px; color: var(--ink); }
.task-row { display: grid; width: 100%; text-align: left; gap: 2px; padding: 8px 10px; margin: 5px 0; border-radius: 12px; border: 1px solid var(--line); background: rgba(255, 255, 255, .03); cursor: pointer; }
.task-row:hover { border-color: var(--line2); background: rgba(255, 255, 255, .06); }
.tr-id { font: 11px var(--mono); color: var(--mute); } .tr-title { font-size: 13.5px; } .tr-meta { font-size: 12px; color: var(--ink2); }
.lc-delivery_unknown, .lc-blocked, .lc-rejected { border-color: rgba(255, 143, 127, .45); }
.lc-verified, .lc-closed { border-color: rgba(255, 226, 168, .45); }
.task-row .lc { color: var(--ink); }
.task-head { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.tid { font-size: 13px; color: var(--sun); }
.task-title { font: 20px/1.25 var(--serif); margin: 6px 0 8px; }
.chain { list-style: none; display: flex; flex-wrap: wrap; gap: 4px 2px; padding: 0; margin: 6px 0 10px; font-size: 11.5px; }
.chain li { display: inline-flex; align-items: center; gap: 4px; padding: 3px 7px; border-radius: 999px; color: var(--mute); border: 1px solid transparent; }
.chain li .dot { width: 7px; height: 7px; border-radius: 50%; background: rgba(255, 255, 255, .18); }
.chain li.past { color: var(--ink2); } .chain li.past .dot { background: var(--st-done); }
.chain li.now { color: #fff3d6; border-color: rgba(255, 226, 168, .55); background: rgba(255, 226, 168, .08); } .chain li.now .dot { background: var(--sun); box-shadow: 0 0 8px var(--sun); }
.layers { font: 11.5px var(--mono); color: var(--ink2); }
.att-row { font-size: 12.5px; padding: 6px 8px; border-radius: 10px; background: rgba(255, 255, 255, .03); margin: 4px 0; border: 1px solid var(--line); }
.att-row.quarantine { border-color: rgba(255, 143, 127, .45); }
.cols2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.filebtn { display: inline-flex; align-items: center; }
.reserve .steps { list-style: none; padding: 0; display: grid; gap: 6px; margin: 6px 0; }
.reserve .steps li.done .btn { color: var(--st-done); }

/* now panel */
.fresh { padding: 10px 12px; border-radius: 12px; border: 1px solid var(--line2); }
.fresh.fresh-fresh { border-color: rgba(134, 227, 182, .4); } .fresh.fresh-stale, .fresh.fresh-no_data { border-color: rgba(255, 143, 127, .55); background: rgba(255, 143, 127, .07); }
.fresh b { display: block; }
.kpis { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; margin: 10px 0; }
.kpi { padding: 8px; border-radius: 12px; border: 1px solid var(--line); background: rgba(255, 255, 255, .03); }
.kpi b { display: block; font: 22px var(--serif); } .kpi span { font-size: 11px; color: var(--mute); }
.kpi.warn b { color: var(--st-waiting); } .kpi.bad b { color: var(--st-blocked); } .kpi.ok b { color: var(--st-active); }
.now-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.now-line { width: 100%; text-align: left; display: grid; gap: 1px; border: 1px solid transparent; background: rgba(255, 255, 255, .03); padding: 6px 8px; border-radius: 10px; cursor: pointer; min-height: 40px; }
.now-line:hover { border-color: var(--line); background: rgba(255, 255, 255, .07); }
.nl-meta { font-size: 11.5px; color: var(--mute); }

/* tree */
.tree, .tree ul { list-style: none; margin: 0; padding-left: 20px; }
.tree { padding-left: 0; }
.tree ul { border-left: 1px solid var(--line); }
.tree li { outline: none; }
.tree li:focus-visible > .trow { outline: 2px solid var(--focus); outline-offset: 1px; }
.trow { display: flex; align-items: baseline; gap: 8px; padding: 6px 8px; border-radius: 10px; flex-wrap: wrap; cursor: pointer; min-height: 36px; }
.trow:hover { background: rgba(255, 255, 255, .05); } .trow.selected { background: rgba(255, 255, 255, .1); }
.ttog { width: 16px; color: var(--mute); } .tdot { width: 8px; height: 8px; border-radius: 50%; align-self: center; flex: none; }
.tname { font: 15px var(--serif); } .ttype, .towner { font-size: 12px; color: var(--mute); }

/* memory / sources */
.modes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.mode-card, .src-card { padding: 10px 12px; border-radius: 12px; border: 1px solid var(--line); background: rgba(255, 255, 255, .03); margin: 6px 0; }
.mode-card p, .src-card p { margin: 6px 0 0; font-size: 12.5px; color: var(--ink2); }
.growth { list-style: none; padding: 0; border-left: 1px solid var(--line2); margin-left: 6px; }
.growth li { padding: 4px 0 8px 14px; position: relative; display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; }
.growth li::before { content: ""; position: absolute; left: -5px; top: 10px; width: 9px; height: 9px; border-radius: 50%; background: var(--sun); box-shadow: 0 0 8px var(--sun); }
.growth time { font: 12px var(--mono); color: var(--mute); }
.journal-list { margin-top: 8px; }

/* ---------- timeline ---------- */
.timeline { position: fixed; left: 10px; right: 10px; bottom: 10px; z-index: 16; display: flex; gap: 12px; align-items: center; padding: 8px 14px; min-height: 64px; }
.mode-contemplation .timeline { background: rgba(10, 13, 30, .35); }
.tl-track { position: relative; flex: 1; padding-top: 22px; }
.tl-events { position: absolute; left: 8px; right: 8px; top: 0; height: 22px; }
.tl-ev { position: absolute; transform: translateX(-50%); border: 0; background: none; color: var(--ink2); font-size: 11px; cursor: pointer; padding: 0 3px; min-height: 22px; }
.tl-ev::after { content: ""; display: block; width: 6px; height: 6px; border-radius: 50%; background: var(--sun); margin: 1px auto 0; box-shadow: 0 0 8px var(--sun); }
.tl-ev.future { opacity: .35; } .tl-ev.cur { color: var(--sun); font-weight: 600; }
#tl-range { width: 100%; accent-color: #ffd79a; min-height: 24px; padding: 0; border: 0; background: none; }
.tl-label { width: 250px; display: grid; } .tl-label b { font: 15px var(--serif); font-weight: 400; } .tl-label span { font-size: 12px; color: var(--ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---------- tip / toast / modal ---------- */
.tip { position: fixed; z-index: 80; pointer-events: none; padding: 10px 12px; width: 310px; background: var(--glass2); font-size: 12.5px; }
.tip .tt { font: 16px var(--serif); margin-bottom: 4px; }
.tip dl { display: grid; grid-template-columns: max-content 1fr; gap: 2px 10px; margin: 0; }
.tip dt { color: var(--mute); } .tip dd { margin: 0; overflow-wrap: anywhere; }
.toast { position: fixed; left: 50%; bottom: 90px; transform: translate(-50%, 16px); z-index: 90; padding: 9px 16px; border-radius: 999px; background: rgba(20, 28, 52, .95); border: 1px solid var(--line2); opacity: 0; transition: opacity .3s, transform .3s var(--ease); pointer-events: none; max-width: calc(100% - 24px); text-align: center; }
.toast.show { opacity: 1; transform: translate(-50%, 0); }
.toast.err { border-color: rgba(255, 143, 127, .6); color: #ffd3cb; }
.modal { position: fixed; inset: 0; z-index: 95; display: grid; place-items: center; background: rgba(0, 0, 0, .55); padding: 16px; }
.modal-box { width: min(760px, 100%); padding: 16px; display: grid; gap: 10px; background: var(--glass2); }
.modal-title { font: 16px var(--serif); }

body.offline .work-only#btn-refresh { opacity: .4; }

/* ---------- phones: bottom sheets, big targets ---------- */
@media (max-width: 760px) {
  .topbar { left: 6px; right: 6px; top: 6px; grid-template-columns: auto 1fr auto; grid-template-areas: "brand modes right" "search search search" "views views views"; padding: 6px 8px; gap: 6px; }
  .mode-contemplation .topbar { grid-template-areas: "brand modes right" "search search search"; }
  .brand-sub, .brand-title { display: none; }
  .data-modes, .fresh-pill span:not(.dot), #btn-refresh { display: none !important; }
  .fresh-pill { padding: 0 14px; min-height: 44px; }
  .views { flex-wrap: nowrap; overflow-x: auto; }
  .views button { flex: none; min-height: 40px; }
  .status-chips { top: 148px; left: 6px; right: 6px; transform: none; flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; max-width: none; }
  .mode-contemplation .status-chips { display: none; }
  .seg button, .btn, .icon-btn, .tabs button, .chip, .chip-btn, .now-line { min-height: 44px; }
  .icon-btn, .panel-actions .icon-btn { width: 44px; height: 44px; }
  .views button { min-height: 44px; }
  .panel.sheet .sheet-grip { height: 44px !important; }
  .btn.small { min-height: 44px; }
  .panel.sheet { left: 0 !important; right: 0; bottom: 0; top: auto !important; width: auto !important; border-radius: 18px 18px 0 0; z-index: 50; min-width: 0; }
  .panel.sheet[data-sheet="peek"] { height: 30vh !important; }
  .panel.sheet[data-sheet="half"] { height: 58vh !important; }
  .panel.sheet[data-sheet="full"] { height: calc(100vh - 70px) !important; }
  .panel.sheet .panel-head { cursor: default; }
  .panel.sheet .sheet-grip { display: block; width: 44px; height: 44px; border: 0; background: none; position: relative; flex: none; cursor: pointer; }
  .panel.sheet .sheet-grip::before { content: ""; position: absolute; left: 8px; right: 8px; top: 20px; height: 4px; border-radius: 4px; background: var(--line2); }
  .panel.sheet .resize-handle { display: none; }
  .map-tools { right: 6px; bottom: 82px; flex-direction: column; }
  .mini { display: none; }
  .timeline { left: 6px; right: 6px; bottom: 6px; padding: 6px 10px; min-height: 60px; gap: 8px; }
  .tl-ev { font-size: 0; } .tl-label { width: 70px; } .tl-label span { display: none; }
  .tip { display: none !important; }
  .cols2, .grid2, .modes { grid-template-columns: 1fr; }
  .kpis { grid-template-columns: 1fr 1fr; }
  .agent-grid { grid-template-columns: 1fr; }
  .prefs { left: 6px; right: 6px; width: auto; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }
body.reduced *, body.reduced *::before, body.reduced *::after { animation: none !important; transition: none !important; }
@media (prefers-contrast: more) { :root { --glass: rgba(6, 8, 18, .95); --glass2: rgba(6, 8, 18, .98); --mute: #b8bdd4; --line: rgba(255, 255, 255, .3); } }
.form-row select, .form-row input { min-width: 0; flex: 1 1 160px; }
.form-row { flex-wrap: wrap; }

/* SOLAR-MAP-006 */
.decision { border: 1px solid rgba(255, 215, 154, .35); background: rgba(255, 215, 154, .05); border-radius: 12px; padding: 9px 10px; margin: 6px 0; display: grid; gap: 5px; }
.decision.q { border-color: rgba(255, 143, 127, .4); background: rgba(255, 143, 127, .05); }
.decision .dq { font-size: 13.5px; color: var(--ink); }
.decision input { width: 100%; font-size: 12px; min-height: 30px; }
.grounds { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; font-size: 11.5px; color: var(--ink2); }
.grounds li::before { content: "◇ "; color: var(--sun); }
.grounds code { font-size: 10.5px; color: var(--mute); }
.dec-badge { border: 1px solid rgba(255, 215, 154, .55); background: rgba(255, 215, 154, .12); color: #ffeac4; border-radius: 999px; padding: 5px 11px; font-size: 12px; cursor: pointer; white-space: nowrap; min-height: 32px; }
.btn.warn { color: var(--st-waiting); border-color: rgba(235, 199, 127, .45); }
.btn.ok { color: var(--st-active); border-color: rgba(134, 227, 182, .45); }
.modal-box input[type=password] { width: 100%; }
@media (max-width: 760px) { .topbar .brand { display: none; } .topbar { grid-template-columns: 1fr auto; grid-template-areas: "modes right" "search search" "views views"; } .mode-contemplation .topbar { grid-template-areas: "modes right" "search search"; } .dec-badge { min-height: 44px; font-size: 0; padding: 0 14px; } .dec-badge::before { content: "⚑"; font-size: 16px; } #owner-btn { display: none; } }

/* SOLAR-TEAM-006 */
.team-chain { margin: 8px 0 12px; }
.team-task { border-left: 2px solid rgba(235, 199, 127, .5); padding: 4px 0 4px 10px; margin: 6px 0; }
.team-groups { display: grid; gap: 10px; margin-top: 8px; }
.team-group h4 { margin: 6px 0 4px; font-size: 14px; }
.team-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 4px 0; border-bottom: 1px solid rgba(255, 255, 255, .06); }
.team-row .team-id { min-width: 64px; min-height: 32px; font-weight: 600; }
.team-row .team-name { flex: 1 1 180px; }
.team-search { width: 100%; max-width: 420px; margin: 8px 0; }
.team-tasks summary { cursor: pointer; padding: 6px 0; }
.node.type-constellation .body { opacity: .85; }
.node.status-planned .ring { stroke-dasharray: 3 4; }
.node.status-historical .ring { stroke-dasharray: 1 5; }
ul.plain { list-style: none; padding-left: 0; margin: 4px 0; }
@media (max-width: 640px) { .team-row .team-id { min-height: 44px; } }

/* SOLAR-INTEGRATION-008 */
.inbox-card { margin: 8px 0 12px; }
.inbox-row { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.inbox-for-task { margin: 8px 0; }
.inbox-card .badge-pill, .inbox-row .badge-pill, .team-chain .badge-pill { white-space: normal; max-width: 100%; text-align: left; }