/* @lat: [[session-visuals#Design]] */
/* Decision: AGENTS.md Decisions > Session design. Topic colors never encode work state. */
.session-designed{--design-ink:var(--ink);--decoration-ink:var(--ink);--text-blue:#215685;--text-purple:#683791;--text-green:#285d1b;--text-red:#9b2941;position:relative}
html[data-theme="dark"] .session-designed{--text-blue:#9dd4ff;--text-purple:#d8b4ff;--text-green:#aff59b;--text-red:#ffa7b4}
.session-designed[data-design-tone="blue"]{--design-ink:var(--text-blue)}
.session-designed[data-design-tone="purple"]{--design-ink:var(--text-purple)}
.session-designed[data-design-tone="green"]{--design-ink:var(--text-green)}
.session-designed[data-design-tone="red"]{--design-ink:var(--text-red)}
.session-design-emphasis{color:var(--design-ink);font-weight:800}
.session-designed[data-design-voice="serif"] :is(.session-tab-title,.super-monitor-topic,.super-monitor-title){font-family:Georgia,serif}
.session-designed[data-design-voice="mono"] :is(.session-tab-title,.super-monitor-topic,.super-monitor-title){font-family:var(--font-mono,monospace);font-size:.95em}
.session-tab-copy.session-designed{grid-template-columns:minmax(0,1fr);background:linear-gradient(100deg,transparent,color-mix(in srgb,var(--design-ink) 8%,transparent))}
.session-tab-copy.session-designed>:is(.session-tab-title,.session-tab-app){grid-column:1}
.super-monitor-heading.session-designed{display:grid;grid-template-columns:minmax(0,1fr);background:linear-gradient(100deg,transparent,color-mix(in srgb,var(--design-ink) 9%,transparent))}
.super-monitor-heading.session-designed>:is(.super-monitor-topic,.super-monitor-title){grid-column:1}
.super-overview-row a.session-designed{display:flex;align-items:center;gap:8px}

.super-overview-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
/* Funnel links stay in the gutter and never catch a click or cover text. */
#super-sidebar-links{position:fixed;inset:0;width:100%;height:100%;z-index:6;pointer-events:none;overflow:hidden}
#super-sidebar-links path{fill:var(--link-ink,var(--accent));fill-opacity:.07;stroke:var(--link-ink,var(--accent));stroke-opacity:.28;stroke-width:1}
#super-sidebar-links path.is-active{fill-opacity:.24;stroke-opacity:.9;stroke-width:1.5}
.super-monitor-session.super-linked{outline:2px solid var(--accent);outline-offset:-1px}
.session-tab.super-linked{box-shadow:inset 0 0 0 2px var(--accent)}

/* @lat: [[session-visuals#Palette]] */
/* Topic colors are tints of the containing app's theme, never a separate theme owner. */
.session-palette{--tab-selected:color-mix(in srgb,var(--palette-primary) 28%,var(--page));--session-fill:color-mix(in srgb,var(--palette-primary) 18%,var(--page));--session-emphasis:color-mix(in srgb,var(--palette-secondary) 14%,var(--ink))}
.session-tab.session-palette:not([data-factory]){--row-bg:var(--session-fill)}
.super-monitor-session.session-palette{background:var(--session-fill)}
.session-palette .session-designed{--design-ink:var(--session-emphasis)}
.session-palette .session-tab-copy.session-designed,.session-palette .super-monitor-heading.session-designed{background:none}

/* @lat: [[super-chart#Words and squares]] */
/* Decision: AGENTS.md Decisions > System status. Faint arrows stay visible; hover, focus and tap trace the full group. */
/* Decision: AGENTS.md Decisions > Super dashboard. Arrows sit under text and squares; text keeps a page-colored halo. */
:is(.super-squares-monitor,#super-session-routes){position:relative;isolation:isolate;text-shadow:0 0 2px var(--page),0 0 2px var(--page),0 0 3px var(--page)}
:is(.super-squares-monitor,#super-session-routes) :is(.super-overview-row,.super-limit-square,button,table,figure){text-shadow:none}
/* A 1px layer whose arrows overflow as ink only, so they never add scroll room. */
.super-word-arrows{position:absolute;left:0;top:0;width:1px;height:1px;z-index:-1;overflow:visible;pointer-events:none}
.super-word-arrows .super-word-arrow{fill:none;stroke:var(--ink);stroke-opacity:.17;stroke-width:1;stroke-linecap:round;stroke-linejoin:round}
:is(.super-word-arrows,#super-sidebar-links) .super-word-arrow.is-active{fill:none;stroke:var(--accent);stroke-opacity:1;stroke-width:2}
.super-system-status .super-word-reference{display:inline;-webkit-box-decoration-break:clone;box-decoration-break:clone;appearance:none;border:0;border-radius:2px;padding:0;margin:0;background:color-mix(in srgb,var(--accent) 9%,var(--page));color:inherit;font:inherit;line-height:inherit;text-align:inherit;white-space:normal;cursor:pointer;user-select:text;text-decoration:none}
.super-system-status .super-word-reference:is(:focus-visible,.super-word-linked){outline:2px solid var(--accent);outline-offset:2px;background:var(--surface);color:var(--ink)}
.super-overview-row.super-word-linked{outline:2px solid var(--ink)!important;outline-offset:2px!important;box-shadow:0 0 0 4px var(--page);z-index:1}

.super-limit-reference.super-word-linked{outline:2px solid var(--accent)!important;outline-offset:2px}
