/* Iter's shared visual system: design tokens, responsive layout, accessibility
   states, and component styles for the build-free application. */

:root {
  /* Modern agent redesign — calm, high-contrast neutral surface with a single
     disciplined violet accent (brand cyan kept only for the mark). Every
     component reads these tokens, so retuning them re-skins the whole app. */
  --void: #0a0a0c;
  --midnight: #101014;
  --panel: #141418;
  --panel-strong: #17171d;
  --panel-raised: #1c1c23;
  --line: rgba(255, 255, 255, 0.07);
  --line-strong: rgba(255, 255, 255, 0.13);
  --text: #f5f5f7;
  --muted: #a2a2ad;
  --subtle: #71717c;
  --accent: #7c6cff;
  --accent-soft: rgba(124, 108, 255, 0.14);
  --blue: #6ea8ff;
  --violet: #9a7cff;
  --cyan: #4de2d0;
  --amber: #f0b45f;
  --rose: #ff7a9c;
  --red: #ff6b6b;
  --gold: #e8c86a;
  --magenta: #ff7ac9;
  --teal: #46d39a;
  --orange: #ff9a5a;
  --slate: #9aa0b4;
  --radius: 14px;
  --radius-sm: 10px;
  --radius-lg: 20px;
  --shadow: 0 24px 64px rgba(0, 0, 0, 0.5);
  --shadow-soft: 0 8px 28px rgba(0, 0, 0, 0.35);
  /* Ordinary product pages share one spacing scale. Full-screen Home/Agent
     workbenches opt out explicitly below; no later generic workspace rule is
     allowed to erase these gutters for Dashboard, Plan, Explore, Calendar,
     Profile, Evidence, Events, or Settings-style views. */
  --page-gutter-y: 40px;
  --page-gutter-x: 42px;
  --page-section-gap: 24px;
  --ease: cubic-bezier(.16, 1, .3, 1);
  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --stagger: 40ms;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

* { box-sizing: border-box; }
/* Any element styled with an explicit `display` (flex/grid/inline-flex
   buttons, panels, etc.) silently defeats the plain `hidden` attribute,
   since author-stylesheet `display` rules of equal specificity win over the
   UA's own `[hidden] { display: none }` default. Several components already
   carry a narrow `X[hidden]` override for this; this is the universal
   backstop so a `hidden` button never renders as an empty visible box again. */
[hidden] { display: none !important; }
html { background: var(--void); }
body { min-width: 320px; min-height: 100vh; margin: 0; overflow-x: hidden; color: var(--text); background: radial-gradient(circle at 78% -4%, rgba(124, 108, 255, 0.1), transparent 34rem), radial-gradient(circle at -6% 96%, rgba(77, 226, 208, 0.05), transparent 32rem), var(--void); font-family: Manrope, Inter, ui-sans-serif, system-ui, sans-serif; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }

.ambient-glow { position: fixed; z-index: -1; width: 28rem; height: 28rem; border-radius: 50%; filter: blur(120px); opacity: 0.16; pointer-events: none; animation: breathe 13s ease-in-out infinite alternate; }
.glow-one { top: 15%; left: 36%; background: var(--violet); }.glow-two { right: -9%; bottom: -16%; background: var(--blue); animation-delay: -6s; }
.app-shell { width: min(1640px, calc(100% - 32px)); min-height: calc(100vh - 32px); margin: 16px auto; overflow: hidden; border: 1px solid var(--line-strong); border-radius: 10px; background: rgba(8, 9, 28, 0.87); box-shadow: var(--shadow), inset 0 1px rgba(255,255,255,.04); backdrop-filter: blur(22px); }
.command-bar { display: grid; grid-template-columns: 244px 1fr auto auto auto auto; align-items: center; gap: 10px; min-height: 66px; padding: 0 18px; border-bottom: 1px solid var(--line); background: rgba(14, 16, 42, .8); }
.guest-banner { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px; padding: 8px 18px; border-bottom: 1px solid var(--line); background: rgba(239, 184, 102, .1); color: var(--amber); font-size: .68rem; }
.guest-banner.is-exhausted { background: rgba(255, 97, 97, .12); color: var(--rose); }
.guest-banner .text-action { color: inherit; text-decoration: underline; }
.briefing-banner { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px; padding: 8px 18px; border-bottom: 1px solid var(--line); background: rgba(100,168,255,.1); color: var(--blue); font-size: .68rem; }
.briefing-banner-actions { display: flex; align-items: center; gap: 6px; }
.briefing-banner .text-action { color: inherit; text-decoration: underline; }
.briefing-banner .icon-button { color: inherit; }
.wordmark { display: inline-flex; align-items: center; gap: 10px; width: fit-content; padding: 0; border: 0; background: none; color: var(--text); cursor: pointer; font-family: "DM Mono", monospace; font-size: 1.04rem; font-weight: 500; letter-spacing: .18em; }
.wordmark-glyph { display: block; width: 28px; height: 28px; flex: 0 0 28px; background: linear-gradient(115deg, var(--cyan) 0%, #72b7ff 34%, var(--violet) 67%, var(--cyan) 100%); background-size: 220% 220%; -webkit-mask: url("/assets/iter-mark.png") center / contain no-repeat; mask: url("/assets/iter-mark.png") center / contain no-repeat; filter: drop-shadow(0 0 5px rgba(77,226,208,.38)); animation: logo-spectrum 7s ease-in-out infinite alternate; }
.system-path, .save-status, .eyebrow, .rail-label, .route-counter, .status-badge { font-family: "DM Mono", ui-monospace, monospace; letter-spacing: .1em; }
.system-path { color: var(--muted); font-size: .7rem; }.system-path b { padding: 0 8px; color: var(--violet); }.save-status { display: inline-flex; align-items: center; gap: 8px; margin-right: 16px; color: var(--cyan); font-size: .65rem; }.save-status i, .status-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 0 4px rgba(77,226,208,.11), 0 0 13px var(--cyan); }
.icon-button { display: grid; width: 33px; height: 33px; place-items: center; border: 1px solid var(--line-strong); border-radius: 5px; background: rgba(255,255,255,.03); color: var(--muted); cursor: pointer; font-size: 1.12rem; transition: border-color 160ms ease, color 160ms ease, transform 160ms ease; }.icon-button:hover { border-color: var(--blue); color: var(--text); transform: translateY(-1px); }.icon-button.small { width: 28px; height: 28px; font-size: .83rem; }
.advanced-toggle { display: inline-flex; align-items: center; gap: 6px; margin-right: 10px; padding: 0 10px; min-height: 29px; border: 1px solid var(--line-strong); border-radius: 20px; background: rgba(255,255,255,.03); color: var(--muted); cursor: pointer; font-family: "DM Mono", monospace; font-size: .55rem; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; transition: border-color 160ms ease, color 160ms ease; }.advanced-toggle:hover { border-color: var(--blue); color: var(--text); }.advanced-toggle i { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--subtle); }.advanced-toggle.is-active { border-color: rgba(150,109,255,.5); color: #c8b8ff; }.advanced-toggle.is-active i { background: var(--violet); box-shadow: 0 0 8px var(--violet); }
body:not(.show-advanced) [data-tier="advanced"] { display: none; }
.confirm-note-form { display: grid; gap: 6px; margin-top: 9px; }.confirm-note-form textarea { width: 100%; padding: 8px 9px; border: 1px solid var(--line); border-radius: 5px; outline: none; background: rgba(5,7,22,.64); color: var(--text); font-family: Manrope, sans-serif; font-size: .65rem; line-height: 1.5; resize: vertical; }.confirm-note-form textarea:focus { border-color: rgba(100,168,255,.9); box-shadow: 0 0 0 3px rgba(100,168,255,.11); }.confirm-note-actions { display: flex; gap: 8px; }
.text-action.is-active { border-color: rgba(77,226,208,.4); background: rgba(77,226,208,.09); color: var(--cyan); }.text-action:disabled { cursor: not-allowed; opacity: .45; }
.chat-attachment-note, .roleplay-attachment-note { margin: 0; color: var(--subtle); font-size: .53rem; }
.app-frame { display: grid; grid-template-columns: 244px minmax(0, 1fr); min-height: calc(100vh - 100px); }.side-rail { display: flex; flex-direction: column; padding: 20px 12px; border-right: 1px solid var(--line); background: rgba(8,10,27,.5); }
.identity-block { display: flex; gap: 10px; align-items: center; padding: 2px 8px 25px; }.identity-block strong { display: block; font-size: .8rem; }.identity-block small { display: block; margin-top: 3px; color: var(--subtle); font-size: .67rem; }.identity-block #sidebarLogout { flex: 0 0 auto; margin-left: auto; }.avatar-orbit { display: grid; width: 35px; height: 35px; place-items: center; border: 1px solid rgba(150,108,255,.7); border-radius: 50%; color: #ddd3ff; background: linear-gradient(135deg, rgba(147,108,255,.42), rgba(83,163,255,.18)); box-shadow: 0 0 0 4px rgba(149,108,255,.06); font-family: "DM Mono", monospace; font-size: .62rem; }
.primary-nav { display: grid; gap: 3px; }.rail-label { margin: 13px 8px 6px; color: var(--subtle); font-size: .57rem; }.rail-label:first-child { margin-top: 0; }.rail-label-lower { margin-top: 21px; }.nav-item { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 37px; padding: 0 9px; border: 0; border-left: 2px solid transparent; background: transparent; color: var(--muted); cursor: pointer; font-size: .76rem; font-weight: 700; text-align: left; transition: background 160ms ease, border-color 160ms ease, color 160ms ease; }.nav-item:hover, .nav-item.is-active { border-left-color: var(--blue); background: rgba(100,133,255,.11); color: var(--text); }.nav-icon { width: 15px; color: var(--violet); font-family: "DM Mono", monospace; font-size: .8rem; text-align: center; }.rail-footer { display: flex; gap: 8px; align-items: center; margin-top: auto; padding: 14px 8px 1px; border-top: 1px solid var(--line); color: var(--subtle); font-family: "DM Mono", monospace; font-size: .59rem; }.rail-footer .status-dot { width: 5px; height: 5px; box-shadow: none; }

.workspace { min-width: 0; padding: 34px; }.view { animation: enter .38s var(--ease) both; }.view[hidden] { display: none; }.view-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 25px; }.view-header.compact { margin-bottom: 20px; }.eyebrow { margin: 0 0 7px; color: var(--subtle); font-size: .59rem; font-weight: 500; }.view-header h1, h2, p { margin-top: 0; }.view-header h1 { margin-bottom: 8px; font-size: 1.42rem; line-height: 1.2; }.view-subtitle { max-width: 660px; margin-bottom: 0; color: var(--muted); font-size: .77rem; line-height: 1.55; }.primary-action { display: inline-flex; align-items: center; justify-content: center; gap: 14px; min-height: 37px; padding: 0 12px; border: 1px solid rgba(100,168,255,.55); border-radius: 5px; background: linear-gradient(90deg, rgba(77,106,255,.22), rgba(146,108,255,.18)); color: #d9e4ff; cursor: pointer; font-size: .68rem; font-weight: 800; white-space: nowrap; transition: border-color 160ms ease, background 160ms ease, transform 160ms ease; }.primary-action:hover { border-color: var(--blue); background: linear-gradient(90deg, rgba(77,106,255,.36), rgba(146,108,255,.3)); transform: translateY(-1px); }.primary-action.full { width: 100%; }.primary-action:disabled { cursor: wait; opacity: .65; transform: none; }

.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }.metric-card { min-height: 112px; padding: 16px; border: 1px solid var(--line); border-radius: 7px; background: var(--panel); box-shadow: inset 0 1px rgba(255,255,255,.03); }.metric-card span { display: block; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .56rem; letter-spacing: .09em; text-transform: uppercase; }.metric-card strong { display: block; margin-top: 11px; color: var(--text); font-family: "DM Mono", monospace; font-size: 1.46rem; font-weight: 500; }.metric-card small { display: block; margin-top: 5px; color: var(--muted); font-size: .65rem; line-height: 1.35; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.28fr) minmax(330px, .72fr); gap: 12px; margin-bottom: 12px; }.panel { border: 1px solid var(--line); border-radius: 7px; background: var(--panel); box-shadow: inset 0 1px rgba(255,255,255,.03); }.next-panel, .activity-panel { min-height: 188px; padding: 18px; }.panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }.panel-heading h2, .profile-card h2, .source-panel h2 { margin: 0; font-size: .91rem; }.body-copy { margin: 12px 0 0; color: var(--muted); font-size: .72rem; line-height: 1.62; }.text-action { min-height: 27px; padding: 0 5px; border: 1px solid transparent; border-radius: 4px; background: transparent; color: var(--blue); cursor: pointer; font-size: .62rem; font-weight: 700; }.text-action:hover { border-color: var(--line); background: rgba(99,167,255,.08); }.meta-row { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 16px; }.meta-row span { padding: 4px 6px; border: 1px solid rgba(153,174,255,.19); border-radius: 3px; color: var(--muted); font-family: "DM Mono", monospace; font-size: .53rem; }.activity-list { display: grid; gap: 7px; margin-top: 14px; }.activity-item { display: grid; grid-template-columns: 7px minmax(0,1fr) auto; gap: 8px; align-items: center; color: var(--muted); font-size: .66rem; }.activity-item i { width: 6px; height: 6px; border-radius: 50%; background: var(--violet); box-shadow: 0 0 8px var(--violet); }.activity-item time { color: var(--subtle); font-family: "DM Mono", monospace; font-size: .52rem; }.empty-activity { color: var(--subtle); font-size: .68rem; }
.dashboard-commands { padding: 18px; }.command-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 9px; margin-top: 16px; }.command-card { min-height: 76px; padding: 14px; border: 1px solid var(--line); border-radius: 6px; background: rgba(8,10,28,.42); color: var(--text); cursor: pointer; text-align: left; transition: border-color 160ms ease, background 160ms ease, transform 160ms ease; }.command-card:hover { border-color: rgba(100,168,255,.58); background: rgba(65,77,151,.2); transform: translateY(-2px); }.command-card strong, .command-card small { display: block; }.command-card strong { margin-top: 13px; font-size: .71rem; }.command-card small { margin-top: 5px; color: var(--muted); font-size: .6rem; line-height: 1.45; }.command-icon { display: grid; width: 24px; height: 24px; place-items: center; border: 1px solid rgba(150,109,255,.45); color: var(--violet); font-family: "DM Mono", monospace; font-size: .76rem; }

.advisor-layout { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(230px,.6fr); gap: 12px; }.chat-panel { display: flex; min-height: 610px; flex-direction: column; overflow: hidden; }.chat-log { display: flex; flex: 1; flex-direction: column; gap: 17px; min-height: 430px; max-height: 590px; overflow-y: auto; padding: 20px; scrollbar-color: var(--line-strong) transparent; }.message { display: grid; grid-template-columns: 26px minmax(0,1fr); gap: 10px; animation: arrive .32s var(--ease) both; }.message.user { grid-template-columns: minmax(0,1fr) 26px; }.message.user .message-copy { grid-column: 1; grid-row: 1; justify-self: end; border-color: rgba(116,140,255,.28); background: rgba(94,126,255,.14); }.message.user .message-avatar { grid-column: 2; grid-row: 1; }.message-avatar { display: grid; width: 26px; height: 26px; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; color: var(--blue); background: rgba(96,112,255,.11); font-family: "DM Mono", monospace; font-size: .55rem; }.message.user .message-avatar { color: var(--cyan); background: rgba(77,226,208,.09); }.message-copy { max-width: 86%; padding: 11px 12px; border: 1px solid transparent; border-radius: 3px 8px 8px 8px; background: rgba(255,255,255,.025); color: #d9dcf2; font-size: .72rem; line-height: 1.58; }.message.user .message-copy { border-radius: 8px 3px 8px 8px; }.message-copy p { margin: 0; white-space: pre-line; overflow-wrap: anywhere; }.message-meta { margin: 8px 0 0; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .53rem; letter-spacing: .02em; }
.message-avatar.is-thinking { border-color: transparent; background: transparent; }
.message-avatar.is-thinking .wordmark-glyph { width: 20px; height: 20px; flex: 0 0 20px; animation: logo-spectrum 3.2s ease-in-out infinite alternate, spin 1.15s linear infinite; }
.message-copy .is-thinking-text { color: var(--subtle); font-style: italic; }
@keyframes spin { to { transform: rotate(360deg); } }.prompt-set { display: flex; flex-wrap: wrap; gap: 6px; padding: 5px 18px 12px; }.prompt-set button { border: 1px solid var(--line); border-radius: 4px; background: rgba(37,42,84,.3); color: var(--muted); cursor: pointer; font-size: .6rem; padding: 7px 8px; }.prompt-set button:hover { border-color: rgba(99,167,255,.55); color: var(--text); }.chat-composer { display: grid; grid-template-columns: 1fr 48px; gap: 8px; padding: 15px 18px 18px; border-top: 1px solid var(--line); }.chat-composer textarea, .control-form input, .control-form select, .control-form textarea, .filter-bar input, .filter-bar select, .profile-layout input, .profile-layout select, .profile-layout textarea, .bridge-panel input, .node-inspector input, .node-inspector select, .node-inspector textarea { width: 100%; border: 1px solid var(--line); border-radius: 5px; outline: none; background: rgba(5,7,22,.64); color: var(--text); transition: border-color 160ms ease, box-shadow 160ms ease; }.chat-composer textarea { min-height: 52px; padding: 11px; resize: none; color: #d1d5ee; font-size: .72rem; line-height: 1.45; }.chat-composer textarea:focus, .control-form input:focus, .control-form select:focus, .control-form textarea:focus, .filter-bar input:focus, .filter-bar select:focus, .profile-layout input:focus, .profile-layout select:focus, .profile-layout textarea:focus, .bridge-panel input:focus, .node-inspector input:focus, .node-inspector select:focus, .node-inspector textarea:focus { border-color: rgba(100,168,255,.9); box-shadow: 0 0 0 3px rgba(100,168,255,.11); }.send-button { align-self: end; display: grid; width: 48px; height: 42px; place-items: center; border: 1px solid rgba(100,168,255,.62); border-radius: 5px; background: rgba(79,110,255,.2); color: var(--blue); cursor: pointer; font-family: "DM Mono", monospace; font-size: .72rem; }.send-button:hover { background: rgba(79,110,255,.4); }.advisor-context, .profile-aside { display: grid; align-content: start; gap: 12px; }.context-card { padding: 16px; }.context-card strong { display: block; color: #e3e5fb; font-size: .78rem; line-height: 1.5; }.context-card .text-action { margin-top: 12px; padding-left: 0; }.plain-list { display: grid; gap: 8px; margin: 11px 0 0; padding-left: 16px; color: var(--muted); font-size: .66rem; line-height: 1.45; }

.canvas-panel { overflow: hidden; }.canvas-toolbar { display: flex; justify-content: space-between; gap: 15px; min-height: 47px; padding: 0 17px; align-items: center; border-bottom: 1px solid var(--line); }.route-counter, .canvas-hint { color: var(--muted); font-size: .57rem; }.canvas-hint { color: var(--subtle); font-family: "DM Mono", monospace; }.path-canvas { position: relative; min-height: 620px; overflow: hidden; isolation: isolate; outline: none; background: rgba(5,7,20,.22); }.path-canvas:focus-visible { box-shadow: inset 0 0 0 1px var(--blue); }.canvas-grid { position: absolute; inset: 0; z-index: -2; opacity: .58; background-image: linear-gradient(rgba(139,154,255,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(139,154,255,.07) 1px, transparent 1px); background-size: 32px 32px; }.connection-layer { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }.connection-line { fill: none; stroke: rgba(126,139,255,.43); stroke-width: 1.4; stroke-dasharray: 5 5; animation: dash 12s linear infinite; }.connection-line.is-complete { stroke: rgba(77,226,208,.54); }.node-layer { position: absolute; inset: 0; z-index: 1; pointer-events: none; }.path-node { position: absolute; width: 170px; min-height: 98px; padding: 12px 11px 11px; border: 1px solid var(--node-color); border-radius: 6px; background: linear-gradient(135deg, rgba(22,25,60,.98), rgba(10,12,34,.97)); box-shadow: 0 10px 28px rgba(0,0,20,.32), inset 0 1px rgba(255,255,255,.05); cursor: grab; pointer-events: auto; user-select: none; transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; animation: node-enter .32s ease both; }.path-node:hover, .path-node.is-selected { border-color: color-mix(in srgb, var(--node-color), white 25%); box-shadow: 0 14px 32px rgba(0,0,18,.44), 0 0 0 3px color-mix(in srgb, var(--node-color), transparent 84%); transform: translateY(-2px); }.path-node.is-dragging { cursor: grabbing; transition: none; transform: scale(1.025); }.node-topline { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 9px; }.node-status { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-family: "DM Mono", monospace; font-size: .5rem; letter-spacing: .08em; text-transform: uppercase; }.node-status i { width: 6px; height: 6px; border-radius: 50%; background: var(--node-color); box-shadow: 0 0 10px var(--node-color); }.node-grip { display: grid; width: 22px; height: 22px; place-items: center; padding: 0 0 4px; border: 1px solid transparent; border-radius: 4px; background: transparent; color: var(--subtle); cursor: pointer; font-family: "DM Mono", monospace; font-size: .72rem; letter-spacing: .13em; line-height: 1; }.node-grip:hover, .node-grip:focus-visible { border-color: rgba(100,168,255,.45); outline: none; background: rgba(100,168,255,.1); color: var(--blue); }.path-node strong { display: block; color: #e5e7fc; font-size: .72rem; line-height: 1.35; }.path-node p { display: -webkit-box; margin: 6px 0 0; overflow: hidden; color: var(--muted); font-size: .59rem; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }.path-node.status-complete { --node-color: var(--cyan); }.path-node.status-active { --node-color: var(--violet); }.path-node.status-planned { --node-color: var(--blue); }.path-node.goal-drill { border-style: dashed; }.path-node.goal-reflection { background: linear-gradient(135deg, rgba(36,29,65,.98), rgba(11,12,34,.97)); }.goal-kind { border-color: rgba(150,109,255,.3) !important; color: #c6b3ff !important; }.goal-drill .goal-kind { border-color: rgba(77,226,208,.32) !important; color: var(--cyan) !important; }.goal-review .goal-kind { border-color: rgba(100,168,255,.32) !important; color: var(--blue) !important; }.canvas-corner-label { position: absolute; z-index: 0; color: rgba(126,139,207,.28); font-family: "DM Mono", monospace; font-size: .54rem; letter-spacing: .13em; pointer-events: none; }.top-left { top: 14px; left: 16px; }.bottom-right { right: 16px; bottom: 13px; }.canvas-footer { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; min-height: 43px; padding: 0 17px; border-top: 1px solid var(--line); background: rgba(13,15,38,.64); color: var(--muted); font-family: "DM Mono", monospace; font-size: .54rem; }.canvas-footer span { display: inline-flex; align-items: center; gap: 5px; }.legend-dot { width: 6px; height: 6px; border-radius: 50%; }.legend-dot.complete { background: var(--cyan); }.legend-dot.active { background: var(--violet); }.legend-dot.planned { background: var(--blue); }
.canvas-header-actions, .view-header-actions { display: flex; align-items: center; gap: 8px; }.workspace-switcher { display: inline-flex; align-items: center; gap: 2px; padding: 3px; border: 1px solid var(--line); border-radius: 5px; background: rgba(5,7,22,.42); }.workspace-switcher button { min-height: 28px; padding: 0 8px; border: 1px solid transparent; border-radius: 3px; background: transparent; color: var(--subtle); cursor: pointer; font-family: "DM Mono", monospace; font-size: .51rem; letter-spacing: .03em; }.workspace-switcher button:hover { color: var(--text); }.workspace-switcher button.is-active { border-color: rgba(100,168,255,.35); background: rgba(80,112,255,.18); color: var(--blue); }.route-readiness { color: var(--subtle); font-family: "DM Mono", monospace; font-size: .53rem; letter-spacing: .05em; }.canvas-toolbar .text-action { margin-left: auto; }.path-node.is-blocked { --node-color: var(--amber); }.path-node.is-blocked .node-status { color: var(--amber); }.node-metadata { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; }.node-metadata span { padding: 3px 4px; border: 1px solid rgba(170,184,255,.14); border-radius: 3px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .46rem; line-height: 1.2; }.node-metadata .is-blocked { border-color: rgba(239,184,102,.32); color: var(--amber); }.node-unblock { width: 100%; margin-top: 9px; padding: 5px 0; border: 1px solid rgba(239,184,102,.3); border-radius: 3px; background: rgba(239,184,102,.07); color: var(--amber); cursor: pointer; font-family: "DM Mono", monospace; font-size: .46rem; letter-spacing: .04em; }.node-unblock:hover { border-color: rgba(239,184,102,.62); background: rgba(239,184,102,.13); }.route-calendar-action { width: 100%; margin-top: 2px; border: 1px solid rgba(77,226,208,.25); border-radius: 4px; color: var(--cyan); }.route-calendar-action:hover { border-color: rgba(77,226,208,.5); background: rgba(77,226,208,.07); }.control-form { display: grid; align-content: start; gap: 13px; padding: 18px; }.control-form label, .filter-bar label, .profile-layout label, .bridge-panel label, .node-inspector label { display: grid; gap: 7px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .58rem; letter-spacing: .04em; }.control-form input, .control-form select, .control-form textarea, .filter-bar input, .filter-bar select, .profile-layout input, .profile-layout select, .profile-layout textarea, .bridge-panel input, .node-inspector input, .node-inspector select, .node-inspector textarea { min-height: 36px; padding: 9px; font-family: Manrope, sans-serif; font-size: .71rem; letter-spacing: 0; }.control-form textarea, .profile-layout textarea, .node-inspector textarea { resize: vertical; }.form-note { margin: 0; color: var(--subtle); font-size: .6rem; line-height: 1.55; }.empty-state { display: grid; min-height: 350px; place-items: center; color: var(--subtle); font-size: .73rem; text-align: center; }.result-head { display: flex; gap: 20px; align-items: flex-start; justify-content: space-between; padding-bottom: 18px; border-bottom: 1px solid var(--line); }.result-head h2 { margin: 0; font-size: 1.03rem; line-height: 1.35; }.result-score { color: var(--blue); font-family: "DM Mono", monospace; font-size: 1.55rem; }.result-section { margin-top: 18px; }.result-section h3 { margin: 0 0 9px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .58rem; font-weight: 500; letter-spacing: .09em; }.result-section ul, .result-section ol { display: grid; gap: 7px; margin: 0; padding-left: 18px; color: var(--muted); font-size: .7rem; line-height: 1.5; }
.chance-estimate-section { padding: 13px 15px; border: 1px solid rgba(239,184,102,.28); border-left: 2px solid var(--amber); border-radius: 5px; background: rgba(239,184,102,.06); }
.chance-estimate-section h3 { color: var(--amber); }
.chance-estimate-band { margin: 0 0 8px; display: flex; align-items: baseline; gap: 8px; }
.chance-estimate-band strong { color: var(--amber); font-family: "DM Mono", monospace; font-size: 1.15rem; }
.chance-estimate-band span { color: var(--subtle); font-size: .58rem; text-transform: uppercase; letter-spacing: .06em; }
.chance-estimate-basis { margin: 0 0 8px; color: var(--muted); font-size: .65rem; line-height: 1.5; }
.chance-estimate-disclaimer, .chance-estimate-unavailable { margin: 0; color: var(--subtle); font-size: .6rem; line-height: 1.5; }
.chance-settings-panel .status-badge.is-configured { color: var(--amber); border-color: rgba(239,184,102,.4); }
.chance-settings-panel .consent-control { margin-top: 15px; }
.chance-settings-panel .form-note { margin-top: 9px; }
.language-settings-panel label { display: flex; align-items: center; gap: 10px; margin-top: 14px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .58rem; letter-spacing: .04em; }
.language-settings-panel select { min-width: 170px; min-height: 36px; padding: 0 9px; border: 1px solid var(--line); border-radius: 5px; outline: none; background: rgba(5,7,22,.64); color: var(--text); font-family: Manrope, sans-serif; font-size: .68rem; cursor: pointer; }
.language-settings-panel select:focus { border-color: rgba(100,168,255,.7); box-shadow: 0 0 0 3px rgba(100,168,255,.14); }
.language-settings-panel, .chance-settings-panel, .google-calendar-panel, .github-connector-panel, .google-docs-panel { margin-top: 12px; padding: 18px; }
.coach-google-doc-row { display: flex; gap: 8px; }
.coach-google-doc-row input { flex: 1; min-width: 0; }
.google-calendar-actions { display: flex; gap: 8px; margin-top: 14px; }
.google-calendar-panel #googleCalendarMessage, .github-connector-panel #githubMessage { margin-top: 9px; }
.github-repo-picker { margin-top: 12px; padding: 18px; }
.github-repo-list { display: grid; gap: 0; margin-top: 13px; }
.github-repo-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 11px 0; border-top: 1px solid rgba(170,183,255,.1); }
.github-repo-row:first-child { padding-top: 0; border-top: 0; }
.github-repo-row strong { display: block; color: #e1e4f8; font-size: .7rem; }
.github-repo-row span { display: block; margin-top: 4px; color: var(--subtle); font-size: .59rem; line-height: 1.4; }

.filter-bar { display: grid; grid-template-columns: 1fr 220px; gap: 12px; padding: 14px; margin-bottom: 12px; }.event-search-bar { grid-template-columns: minmax(0,1fr) auto 170px; align-items: end; }.event-search-bar .primary-action { min-height: 36px; }.opportunity-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }.opportunity-card { display: flex; min-height: 210px; flex-direction: column; padding: 17px; border: 1px solid var(--line); border-top: 2px solid var(--opportunity-color, var(--blue)); border-radius: 7px; background: var(--panel); }.opportunity-kind { color: var(--opportunity-color, var(--blue)); font-family: "DM Mono", monospace; font-size: .54rem; letter-spacing: .1em; }.opportunity-card h2 { margin: 13px 0 0; font-size: .82rem; line-height: 1.45; }.opportunity-card p { margin: 9px 0 0; color: var(--muted); font-size: .67rem; line-height: 1.5; }.opportunity-card footer { display: flex; flex-direction: column; align-items: flex-start; gap: 9px; margin-top: auto; padding-top: 16px; }.opportunity-kind { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-transform: uppercase; }.opportunity-card p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; }.opportunity-meta { display: grid; gap: 5px; margin-top: 13px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .54rem; line-height: 1.45; }.no-results { display: grid; gap: 12px; justify-items: center; }.no-results p { max-width: 52ch; margin: 0; line-height: 1.6; }.source-chip { color: var(--subtle); font-family: "DM Mono", monospace; font-size: .52rem; }.route-add-button { min-height: 29px; padding: 0 8px; border: 1px solid var(--line-strong); border-radius: 4px; background: rgba(93,114,255,.14); color: #cedbff; cursor: pointer; font-size: .6rem; font-weight: 800; }.route-add-button:hover { border-color: var(--blue); }.no-results { grid-column: 1 / -1; padding: 36px; border: 1px dashed var(--line-strong); color: var(--subtle); text-align: center; font-size: .72rem; }

.event-status-panel { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 15px 17px; margin-bottom: 12px; }.event-status-panel strong { display: block; color: #dce4fb; font-size: .7rem; }.event-source-badges { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }.event-source-badges span { padding: 5px 6px; border: 1px solid var(--line); border-radius: 3px; color: var(--muted); font-family: "DM Mono", monospace; font-size: .52rem; }.event-source-badges span.is-live { border-color: rgba(77,226,208,.36); color: var(--cyan); }.event-source-badges span.is-stale { border-color: rgba(239,184,102,.38); color: var(--amber); }.event-source-badges span.is-unavailable { border-color: rgba(255,117,152,.32); color: var(--rose); }.event-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }.event-card { display: flex; min-height: 245px; flex-direction: column; padding: 17px; border: 1px solid var(--line); border-top: 2px solid var(--event-color, var(--cyan)); border-radius: 7px; background: var(--panel); }.event-card.is-discovery { border-top-style: dashed; }.event-card h2 { margin: 10px 0 0; font-size: .82rem; line-height: 1.43; }.event-card p { margin: 9px 0 0; color: var(--muted); font-size: .65rem; line-height: 1.5; }.event-card .event-meta { display: grid; gap: 5px; margin-top: 13px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .54rem; line-height: 1.45; }.event-card footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 15px; }.event-card footer a { color: var(--blue); font-size: .6rem; text-decoration: none; }.event-card footer a:hover { color: var(--cyan); text-decoration: underline; }.event-relevance { color: var(--event-color, var(--cyan)); font-family: "DM Mono", monospace; font-size: .55rem; letter-spacing: .08em; }.calendar-save-button { min-height: 29px; padding: 0 8px; border: 1px solid rgba(77,226,208,.38); border-radius: 4px; background: rgba(77,226,208,.08); color: var(--cyan); cursor: pointer; font-size: .58rem; font-weight: 800; }.calendar-save-button:hover { border-color: var(--cyan); }.event-empty { grid-column: 1 / -1; display: grid; min-height: 220px; place-items: center; padding: 26px; border: 1px dashed var(--line-strong); color: var(--subtle); font-size: .72rem; text-align: center; }

.calendar-layout { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(250px,.5fr); gap: 12px; }.calendar-panel { min-width: 0; overflow-x: auto; padding: 16px; }.calendar-toolbar { display: grid; grid-template-columns: 30px 1fr 30px; align-items: center; gap: 12px; min-width: 560px; padding-bottom: 14px; }.calendar-toolbar h2 { margin: 0; color: #e5e8fb; font-size: .9rem; text-align: center; }.calendar-weekdays, .calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(80px,1fr)); min-width: 560px; }.calendar-weekdays { border-bottom: 1px solid var(--line); }.calendar-weekdays span { padding: 8px 7px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .54rem; text-align: right; }.calendar-grid { grid-auto-rows: 112px; }.calendar-day { position: relative; min-width: 0; padding: 6px; border-right: 1px solid rgba(170,184,255,.11); border-bottom: 1px solid rgba(170,184,255,.11); background: rgba(5,7,22,.18); }.calendar-day:nth-child(7n) { border-right: 0; }.calendar-day.is-other-month { background: rgba(5,7,22,.36); }.calendar-day.is-today { box-shadow: inset 0 0 0 1px rgba(100,168,255,.52); }.calendar-day-number { display: block; margin-left: auto; padding: 0; border: 0; background: transparent; color: var(--subtle); cursor: pointer; font-family: "DM Mono", monospace; font-size: .57rem; }.calendar-day-number:hover { color: var(--blue); }.calendar-events { display: grid; gap: 4px; margin-top: 7px; }.calendar-event { width: 100%; overflow: hidden; padding: 4px 5px; border: 1px solid var(--calendar-color, var(--blue)); border-radius: 3px; background: rgba(82,105,228,.11); color: #dce4ff; cursor: pointer; font-size: .56rem; line-height: 1.32; text-align: left; text-overflow: ellipsis; white-space: nowrap; }.calendar-event:hover { background: rgba(82,105,228,.24); }.calendar-editor { padding: 17px; }.calendar-form-actions { display: grid; grid-template-columns: 1fr auto; gap: 8px; }.calendar-google-sync { width: 100%; margin-top: 10px; padding: 8px 0; border: 1px solid var(--line); border-radius: 4px; text-align: center; }.calendar-google-sync:disabled { border-color: transparent; }.compact-danger { min-height: 37px; width: auto; margin: 0; padding: 0 10px; white-space: nowrap; }.compact-danger:disabled { cursor: not-allowed; opacity: .42; }

.patterns-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }.patterns-grid .panel { padding: 18px; }.source-panel { grid-column: 1 / -1; }.pattern-bars { display: grid; gap: 14px; margin-top: 18px; }.pattern-row { display: grid; grid-template-columns: 130px 1fr 35px; gap: 9px; align-items: center; color: var(--muted); font-size: .66rem; }.pattern-meter { height: 5px; overflow: hidden; border-radius: 5px; background: rgba(140,157,255,.11); }.pattern-meter i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--violet), var(--blue)); box-shadow: 0 0 12px var(--blue); }.pattern-row strong { color: var(--subtle); font-family: "DM Mono", monospace; font-size: .56rem; text-align: right; }.source-list { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; margin-top: 17px; }.source-item { padding: 11px; border: 1px solid rgba(170,183,255,.12); border-radius: 5px; background: rgba(7,9,25,.35); }.source-item strong { display: block; color: #e0e3f5; font-size: .66rem; }.source-item span { display: block; margin-top: 5px; color: var(--subtle); font-size: .57rem; line-height: 1.4; }

.profile-layout { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(240px,.55fr); gap: 12px; }.profile-basics { padding: 18px; }.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 13px; }.full-grid-label { grid-column: 1 / -1; }.wide-label { margin-top: 13px; }.form-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; }.file-button { position: relative; display: inline-flex; width: fit-content; min-height: 34px; align-items: center; padding: 0 9px; overflow: hidden; border: 1px solid var(--line); border-radius: 4px; color: var(--blue) !important; cursor: pointer; font-family: Manrope !important; font-size: .65rem !important; font-weight: 700; letter-spacing: 0 !important; }.file-button input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }.profile-card { padding: 17px; }.coverage-list { display: grid; gap: 10px; margin-top: 15px; }.coverage-row { display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: .65rem; }.coverage-row i { width: 8px; height: 8px; border: 1px solid var(--subtle); border-radius: 50%; }.coverage-row.is-covered i { border-color: var(--cyan); background: var(--cyan); box-shadow: 0 0 7px var(--cyan); }
.integration-layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 12px; }.integration-layout[hidden] { display: none; }.bridge-panel, .integration-panel { padding: 18px; }.status-badge { padding: 5px 6px; border: 1px solid var(--line-strong); border-radius: 3px; color: var(--muted); font-size: .5rem; }.status-badge.is-configured { border-color: rgba(77,226,208,.4); color: var(--cyan); }.bridge-panel label { margin-top: 16px; }.bridge-panel .primary-action { margin-top: 13px; }.integration-list { display: grid; gap: 11px; margin-top: 17px; }.integration-item { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 11px 0; border-bottom: 1px solid rgba(170,183,255,.1); }.integration-item:last-child { border-bottom: 0; }.integration-item strong { display: block; color: #e1e4f8; font-size: .7rem; }.integration-item span { display: block; margin-top: 4px; color: var(--subtle); font-size: .59rem; line-height: 1.4; }.integration-item button { min-height: 29px; padding: 0 8px; border: 1px solid var(--line-strong); border-radius: 4px; background: rgba(95,113,255,.11); color: var(--blue); cursor: pointer; font-size: .58rem; font-weight: 700; }.integration-item button:hover { border-color: var(--blue); }.integration-item button.is-ready { border-color: rgba(77,226,208,.35); color: var(--cyan); }.consent-control { display: flex !important; gap: 9px !important; align-items: center; color: var(--muted) !important; font-family: Manrope !important; font-size: .64rem !important; letter-spacing: 0 !important; }.bridge-panel .consent-control input { width: 14px !important; min-height: 14px !important; margin: 0; padding: 0 !important; accent-color: var(--cyan); }

.briefing-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; margin-bottom: 12px; }.briefing-panel { min-height: 214px; padding: 18px; }.briefing-list { display: grid; gap: 8px; margin-top: 15px; }.briefing-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 9px; align-items: center; padding: 9px 0; border-top: 1px solid rgba(170,183,255,.09); }.briefing-row:first-child { border-top: 0; padding-top: 0; }.briefing-row strong, .briefing-row span { display: block; }.briefing-row strong { color: #e1e5fb; font-size: .66rem; line-height: 1.42; }.briefing-row span { margin-top: 3px; color: var(--subtle); font-size: .57rem; line-height: 1.42; }.briefing-row.risk-high strong { color: #ffb2c3; }.briefing-row.risk-medium strong { color: #f1c77a; }.briefing-row.risk-low strong { color: #ced9ff; }

.message-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }.message-actions .route-add-button { background: rgba(77,226,208,.08); border-color: rgba(77,226,208,.36); color: var(--cyan); }

.account-plan-row { display: flex; align-items: center; gap: 8px; margin: 12px 0 4px; }.plan-badge { padding: 4px 8px; border: 1px solid var(--line-strong); border-radius: 3px; color: var(--muted); font-family: "DM Mono", monospace; font-size: .54rem; font-weight: 600; letter-spacing: .06em; }.plan-badge.is-paid { border-color: rgba(77,226,208,.5); color: var(--cyan); }.plan-note { color: var(--subtle); font-size: .58rem; }.account-billing-button { width: 100%; margin: 8px 0 10px; min-height: 34px; }

.message-sources { margin-top: 12px; padding-top: 11px; border-top: 1px solid rgba(170,183,255,.14); }.message-sources-label { display: block; margin-bottom: 8px; color: var(--muted); font-family: "DM Mono", monospace; font-size: .52rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; }.message-sources-list { display: grid; gap: 5px; margin: 0; padding: 0; list-style: none; counter-reset: none; }.message-source { margin: 0; }.message-source-link { display: grid; grid-template-columns: 18px minmax(0,1fr); align-items: baseline; gap: 8px; padding: 7px 9px; border: 1px solid rgba(100,168,255,.18); border-radius: 5px; background: rgba(13,18,52,.32); color: var(--text); text-decoration: none; transition: border-color .12s ease, background .12s ease; }.message-source-link:hover { border-color: rgba(100,168,255,.6); background: rgba(16,23,64,.5); }.message-source-index { color: var(--blue); font-family: "DM Mono", monospace; font-size: .58rem; font-weight: 600; }.message-source-title { color: #dfe4fb; font-size: .64rem; line-height: 1.36; }.message-source-meta { grid-column: 2; margin-top: 2px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .52rem; line-height: 1.35; word-break: break-word; }

.opportunity-tracker { padding: 18px; margin-bottom: 12px; }.tracker-list { display: grid; gap: 0; margin-top: 14px; }.tracker-item { display: grid; grid-template-columns: minmax(170px,.74fr) minmax(0,1.26fr); gap: 16px; padding: 14px 0; border-top: 1px solid rgba(170,183,255,.1); }.tracker-item:first-child { padding-top: 0; border-top: 0; }.tracker-copy strong, .tracker-copy span { display: block; }.tracker-copy strong { margin-top: 7px; color: #e4e7fa; font-size: .71rem; line-height: 1.42; }.tracker-source { margin-top: 5px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .54rem; line-height: 1.4; }a.tracker-source { width: fit-content; color: var(--blue); text-decoration: none; }a.tracker-source:hover { color: var(--cyan); text-decoration: underline; }.tracker-controls { display: grid; grid-template-columns: 122px minmax(0,1fr); gap: 8px; }.tracker-status, .tracker-notes { width: 100%; border: 1px solid var(--line); border-radius: 4px; outline: none; background: rgba(5,7,22,.64); color: var(--text); font-family: Manrope, sans-serif; font-size: .64rem; }.tracker-status { min-height: 32px; padding: 0 7px; text-transform: capitalize; }.tracker-notes { min-height: 46px; padding: 7px; resize: vertical; }.tracker-status:focus, .tracker-notes:focus { border-color: rgba(100,168,255,.9); box-shadow: 0 0 0 3px rgba(100,168,255,.1); }.tracker-actions { display: flex; grid-column: 1 / -1; gap: 3px; }.danger-text { color: var(--rose); }.opportunity-actions { display: flex; gap: 5px; }.route-add-button.is-tracked { border-color: rgba(77,226,208,.38); background: rgba(77,226,208,.08); color: var(--cyan); }

/* A tracked-source alert sits before preparation controls and spans their full
   grid. Amber marks time pressure, violet marks a changed publisher snapshot;
   neither colour is reused as a verified-eligibility state. */
.tracker-item.has-source-alert { border-left: 2px solid rgba(239,184,102,.72); padding-left: 12px; }
.tracker-source-alert-panel { display: grid; grid-column: 1 / -1; gap: 8px; padding: 12px; border: 1px solid rgba(239,184,102,.3); border-radius: 8px; background: rgba(239,184,102,.055); }
.tracker-source-alert-panel > strong { color: var(--amber); font-size: .68rem; }
.tracker-source-alert-panel > p { margin: -2px 0 2px; color: var(--muted); font-size: .58rem; line-height: 1.5; }
.tracker-source-alert { display: grid; grid-template-columns: 24px minmax(0,1fr) auto; gap: 9px; align-items: center; padding: 9px; border: 1px solid rgba(239,184,102,.18); border-radius: 6px; background: rgba(5,7,22,.36); }
.tracker-source-alert > i { display: grid; width: 22px; height: 22px; place-items: center; border: 1px solid rgba(239,184,102,.42); border-radius: 50%; color: var(--amber); font: .58rem "DM Mono", monospace; }
.tracker-source-alert.is-updated > i { border-color: rgba(150,109,255,.5); color: #c8b8ff; }
.tracker-source-alert strong { display: block; color: #eef0ff; font-size: .62rem; }
.tracker-source-alert p { margin: 3px 0 0; color: var(--muted); font-size: .56rem; line-height: 1.45; }
.tracker-source-alert-actions { display: flex; align-items: center; justify-content: flex-end; gap: 3px; }
.scenario-preflight { padding: 13px; border: 1px solid rgba(100,168,255,.25); border-left: 2px solid var(--blue); border-radius: 5px; background: rgba(13,18,52,.35); }.scenario-preflight.is-blocked { border-left-color: var(--rose); }.scenario-preflight.is-needs-verification { border-left-color: var(--amber); }.scenario-preflight.is-ready-for-review { border-left-color: var(--cyan); }.scenario-preflight-heading strong, .scenario-preflight-heading span { display: block; }.scenario-preflight-heading strong { color: #e5e9ff; font-size: .69rem; text-transform: capitalize; }.scenario-preflight-heading span { margin-top: 5px; color: var(--muted); font-size: .61rem; line-height: 1.48; }.scenario-preflight-checks, .scenario-preflight-actions { display: grid; gap: 0; margin-top: 11px; }.scenario-preflight-check, .scenario-preflight-action { padding: 9px 0; border-top: 1px solid rgba(170,183,255,.1); }.scenario-preflight-check strong, .scenario-preflight-check span, .scenario-preflight-action strong, .scenario-preflight-action span { display: block; }.scenario-preflight-check strong, .scenario-preflight-action strong { color: #e2e6fb; font-size: .62rem; }.scenario-preflight-check span, .scenario-preflight-action span { margin-top: 3px; color: var(--subtle); font-size: .55rem; line-height: 1.45; }.scenario-preflight-check.is-blocked strong { color: var(--rose); }.scenario-preflight-check.is-needs-verification strong { color: var(--amber); }.scenario-preflight-check.is-met strong { color: var(--cyan); }.scenario-preflight-action { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; align-items: center; }

.evidence-metric-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; margin-bottom: 12px; }.evidence-metric { min-height: 70px; padding: 16px; }.evidence-metric span, .evidence-metric strong, .evidence-metric small { display: block; }.evidence-metric span { color: var(--subtle); font-family: "DM Mono", monospace; font-size: .56rem; letter-spacing: .09em; text-transform: uppercase; }.evidence-metric strong { margin-top: 10px; color: var(--cyan); font-family: "DM Mono", monospace; font-size: 1.35rem; font-weight: 500; }.evidence-metric small { margin-top: 4px; color: var(--muted); font-size: .61rem; line-height: 1.4; }.evidence-layout { display: grid; grid-template-columns: minmax(0,1.36fr) minmax(285px,.64fr); gap: 12px; }.evidence-map-panel, .requirement-editor, .requirements-panel { padding: 18px; }.evidence-graph { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; margin-top: 17px; }.evidence-node { min-height: 164px; padding: 13px; border: 1px solid var(--line); border-top: 2px solid var(--line-strong); border-radius: 6px; background: rgba(7,9,27,.36); }.evidence-node.is-covered { border-top-color: var(--cyan); }.evidence-node.is-developing { border-top-color: var(--blue); }.evidence-node.is-gap { border-top-color: var(--rose); }.evidence-node-header, .requirement-card-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }.evidence-status, .evidence-score { display: inline-flex; align-items: center; min-height: 19px; font-family: "DM Mono", monospace; font-size: .5rem; letter-spacing: .06em; }.evidence-status { color: var(--subtle); }.is-covered .evidence-status { color: var(--cyan); }.is-developing .evidence-status { color: var(--blue); }.is-gap .evidence-status { color: var(--rose); }.evidence-score { color: var(--muted); }.evidence-node h2, .requirement-card h2 { margin: 13px 0 0; color: #e2e6fb; font-size: .75rem; line-height: 1.42; }.evidence-proof { display: grid; gap: 4px; margin-top: 10px; }.evidence-proof span { color: var(--subtle); font-size: .57rem; line-height: 1.42; }.evidence-node .text-action { margin-top: 11px; padding-left: 0; }.requirements-panel { margin-top: 12px; }.requirements-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; margin-top: 17px; }.requirement-card { display: flex; min-height: 214px; flex-direction: column; padding: 14px; border: 1px solid var(--line); border-top: 2px solid var(--line-strong); border-radius: 6px; background: rgba(7,9,27,.36); }.requirement-card.is-covered { border-top-color: var(--cyan); }.requirement-card.is-developing { border-top-color: var(--blue); }.requirement-card.is-gap { border-top-color: var(--rose); }.requirement-card > p { margin: 10px 0 0; color: var(--muted); font-size: .63rem; line-height: 1.5; }.requirement-proof { color: var(--subtle) !important; }.requirement-source-link, .requirement-card .source-chip { display: inline-block; width: fit-content; margin-top: auto; padding-top: 14px; color: var(--blue); font-family: "DM Mono", monospace; font-size: .54rem; line-height: 1.4; text-decoration: none; }.requirement-source-link:hover { color: var(--cyan); text-decoration: underline; }.requirement-actions { display: flex; gap: 4px; margin-top: 8px; }.requirement-actions .text-action { padding-left: 0; }.requirement-editor .consent-control { display: flex !important; align-items: center; gap: 9px !important; color: var(--muted) !important; font-family: Manrope !important; font-size: .64rem !important; letter-spacing: 0 !important; }.requirement-editor .consent-control input { width: 14px !important; min-height: 14px !important; margin: 0; padding: 0 !important; accent-color: var(--cyan); }

.requirement-source-metadata { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }.requirement-source-metadata label:last-child { grid-column: 1 / -1; }.source-fingerprint-control { display: grid; gap: 8px; padding: 11px; border: 1px solid rgba(100,168,255,.2); border-radius: 5px; background: rgba(5,7,22,.28); }.source-fingerprint-control label { display: grid; gap: 7px; }.source-fingerprint-control textarea { width: 100%; min-height: 70px; padding: 9px; border: 1px solid var(--line); border-radius: 4px; outline: none; background: rgba(5,7,22,.62); color: var(--text); font-family: Manrope, sans-serif; font-size: .64rem; letter-spacing: 0; line-height: 1.45; resize: vertical; }.source-fingerprint-control textarea:focus { border-color: rgba(100,168,255,.9); box-shadow: 0 0 0 3px rgba(100,168,255,.11); }.source-fingerprint-control .text-action { justify-self: start; padding-left: 0; }.source-fingerprint-control .form-note { margin: 0; }.requirement-freshness { margin-top: 7px !important; color: var(--subtle) !important; font-family: "DM Mono", monospace; font-size: .48rem !important; letter-spacing: .035em; text-transform: uppercase; }.requirement-freshness.is-fresh { color: var(--cyan) !important; }.requirement-freshness.is-stale, .requirement-freshness.is-changed { color: var(--amber) !important; }
@media (max-width: 460px) { .requirement-source-metadata { grid-template-columns: 1fr; }.requirement-source-metadata label:last-child { grid-column: auto; } }

.node-inspector { position: fixed; z-index: 10; top: 82px; right: 26px; width: min(312px, calc(100vw - 32px)); padding: 17px; border: 1px solid var(--line-strong); border-radius: 7px; background: rgba(17,19,48,.98); box-shadow: var(--shadow); backdrop-filter: blur(22px); opacity: 0; pointer-events: none; transform: translateY(-8px) translateX(8px); transition: opacity .18s ease, transform .18s ease; }.node-inspector.is-open { opacity: 1; pointer-events: auto; transform: translateY(0) translateX(0); }.inspector-heading { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 7px; }.inspector-heading h2 { margin: 0; font-size: .9rem; }.danger-action { width: 100%; min-height: 34px; margin-top: 15px; border: 1px solid rgba(255,116,152,.35); border-radius: 4px; background: rgba(255,94,138,.08); color: var(--rose); cursor: pointer; font-size: .65rem; font-weight: 800; }.danger-action:hover { background: rgba(255,94,138,.16); }.toast { position: fixed; z-index: 20; right: 22px; bottom: 22px; max-width: min(360px, calc(100vw - 44px)); padding: 11px 13px; border: 1px solid rgba(77,226,208,.35); border-radius: 5px; background: rgba(15,29,49,.96); color: #d8fffa; box-shadow: var(--shadow); font-size: .68rem; opacity: 0; pointer-events: none; transform: translateY(8px); transition: opacity .18s ease, transform .18s ease; }.toast.is-visible { opacity: 1; transform: translateY(0); }

.route-readiness.is-ready { color: var(--cyan); }.path-node.is-blocked .node-metadata span:last-child { border-color: rgba(239,184,102,.32); color: var(--amber); }.coach-layout { display: grid; grid-template-columns: minmax(270px,.62fr) minmax(0,1.38fr); gap: 12px; }.coach-form, .coach-preview-panel, .coach-result-panel { padding: 18px; }.coach-preview-panel { min-width: 0; }.coach-preview { display: grid; min-height: 520px; margin-top: 17px; overflow: auto; border: 1px solid var(--line); border-radius: 6px; background: rgba(5,7,22,.42); }.coach-preview .empty-activity { margin: 0; }.coach-image-surface { position: relative; display: inline-block; width: fit-content; max-width: 100%; margin: auto; }.coach-image-surface img { display: block; max-width: 100%; max-height: 660px; object-fit: contain; }.coach-callout { position: absolute; display: grid; min-width: 19px; min-height: 19px; place-items: center; border: 1px solid rgba(255,117,152,.9); border-radius: 3px; background: rgba(255,87,137,.13); color: #ffe0e8; box-shadow: 0 0 0 1px rgba(10,11,29,.6), 0 0 15px rgba(255,117,152,.2); font-family: "DM Mono", monospace; font-size: .53rem; pointer-events: auto; }.coach-callout.is-unreadable { border-color: rgba(239,184,102,.9); background: rgba(239,184,102,.12); }.coach-callout.is-clarity, .coach-callout.is-repetition { border-color: rgba(100,168,255,.9); background: rgba(100,168,255,.12); }.coach-file-card { align-self: center; justify-self: center; max-width: 340px; padding: 20px; border: 1px dashed var(--line-strong); color: var(--muted); text-align: center; }.coach-file-card strong { display: block; color: #e3e7fb; font-size: .75rem; }.coach-file-card p { margin: 8px 0 0; font-size: .63rem; line-height: 1.55; }.coach-result-panel { margin-top: 12px; }.coach-output-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; margin-top: 18px; }.coach-findings, .coach-goals { display: grid; gap: 8px; margin-top: 10px; }.coach-finding { padding: 10px; border: 1px solid rgba(100,168,255,.18); border-left: 2px solid var(--blue); border-radius: 4px; background: rgba(9,12,34,.3); }.coach-finding.is-typo { border-left-color: var(--rose); }.coach-finding.is-repetition { border-left-color: var(--amber); }.coach-finding span { color: var(--blue); font-family: "DM Mono", monospace; font-size: .52rem; letter-spacing: .06em; text-transform: uppercase; }.coach-finding p { margin: 5px 0 0; color: var(--muted); font-size: .62rem; line-height: 1.48; }.coach-goal { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 11px 0; border-top: 1px solid rgba(170,183,255,.1); }.coach-goal strong { display: block; color: #e1e5fa; font-size: .67rem; }.coach-goal p { margin: 4px 0 0; color: var(--subtle); font-size: .58rem; line-height: 1.45; }.coach-goal .route-add-button:disabled { cursor: default; opacity: .55; }.runtime-panel { margin-top: 12px; padding: 18px; }.runtime-grid { display: grid; grid-template-columns: minmax(0,.88fr) minmax(0,1.12fr); gap: 24px; margin-top: 16px; }.source-chip-list { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }.source-chip-list .source-chip { padding: 5px 6px; border: 1px solid rgba(100,168,255,.26); border-radius: 3px; background: rgba(72,103,205,.08); color: var(--blue); }.source-registry-list { display: grid; gap: 0; margin-top: 10px; }.registry-item { display: grid; grid-template-columns: minmax(0,1fr) minmax(100px,.5fr); gap: 12px; align-items: center; padding: 10px 0; border-top: 1px solid rgba(170,183,255,.1); }.registry-item strong, .registry-item span { display: block; }.registry-item strong { color: #e1e4f8; font-size: .67rem; }.registry-item span, .registry-item small { color: var(--subtle); font-size: .56rem; line-height: 1.4; }.registry-item small { text-align: right; }
.coach-callout.is-strength { border-color: rgba(77,226,208,.9); background: rgba(77,226,208,.14); color: #d7fff8; }.coach-callout.is-story-link { border-color: rgba(150,109,255,.9); background: rgba(150,109,255,.14); color: #ece4ff; }
.coach-callout.is-grammar, .coach-callout.is-mistake { border-color: rgba(255,97,97,.9); background: rgba(255,97,97,.14); color: #ffe1e1; }.coach-callout.is-vague { border-color: rgba(232,197,71,.9); background: rgba(232,197,71,.14); color: #fbf1cf; }.coach-callout.is-unsupported-claim { border-color: rgba(255,110,199,.9); background: rgba(255,110,199,.14); color: #ffe1f2; }.coach-callout.is-missing-number { border-color: rgba(62,207,142,.9); background: rgba(62,207,142,.14); color: #d6f7e6; }.coach-callout.is-date-conflict { border-color: rgba(255,145,66,.9); background: rgba(255,145,66,.14); color: #ffe4cf; }.coach-callout.is-unreadable { border-color: rgba(154,165,201,.9); background: rgba(154,165,201,.16); color: #e4e7f3; }
.coach-finding.is-strength { border-left-color: var(--cyan); }.coach-finding.is-story-link { border-left-color: var(--violet); }
.coach-finding.is-grammar { border-left-color: var(--red); }.coach-finding.is-vague { border-left-color: var(--gold); }.coach-finding.is-unsupported-claim { border-left-color: var(--magenta); }.coach-finding.is-missing-number { border-left-color: var(--teal); }.coach-finding.is-date-conflict { border-left-color: var(--orange); }.coach-finding.is-unreadable, .coach-finding.is-mistake { border-left-color: var(--slate); }
.coach-finding-section { margin: 14px 0 0; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .5rem; letter-spacing: .07em; text-transform: uppercase; }.coach-finding-section:first-child { margin-top: 0; }
.coach-preview-panel { position: relative; }
.coach-finding:hover { transform: translateX(2px); }
.coach-finding.is-focused { box-shadow: 0 0 0 2px rgba(100,168,255,.6); }
.coach-finding-apply { margin-top: 8px; }

.path-canvas.is-connecting { box-shadow: inset 0 0 0 1px rgba(77,226,208,.3); }
.path-canvas.is-connecting .path-node:not(.is-connection-source) { cursor: crosshair; }
.path-node.is-connection-source { border-color: var(--cyan); box-shadow: 0 0 0 3px rgba(77,226,208,.15), 0 15px 34px rgba(0,8,24,.5); }
.path-node.is-connection-target { border-color: rgba(100,168,255,.68); }
.connection-port { position: absolute; z-index: 3; display: grid; width: 22px; height: 22px; place-items: center; padding: 0; border: 0; background: transparent; cursor: crosshair; }
.connection-port::after { width: 9px; height: 9px; border: 2px solid rgba(212,222,255,.92); border-radius: 50%; background: #151a42; box-shadow: 0 0 0 2px rgba(8,10,28,.72), 0 0 13px color-mix(in srgb, var(--node-color), transparent 38%); content: ""; transition: transform 140ms ease, background 140ms ease, border-color 140ms ease; }
.connection-port:hover::after, .path-node.is-connection-source .connection-port::after { border-color: #e1fffb; background: var(--cyan); transform: scale(1.25); }
.connection-choice { display: block; margin-top: 9px; color: var(--blue); font-family: "DM Mono", monospace; font-size: .48rem; letter-spacing: .05em; }.connection-choice.is-source { color: var(--cyan); }
.port-top { top: -11px; left: 50%; transform: translateX(-50%); }.port-right { top: 50%; right: -11px; transform: translateY(-50%); }.port-bottom { bottom: -11px; left: 50%; transform: translateX(-50%); }.port-left { top: 50%; left: -11px; transform: translateY(-50%); }
.connection-layer { pointer-events: auto; }.connection-hitbox { fill: none; stroke: rgba(255,255,255,0); stroke-width: 18; stroke-linecap: round; stroke-linejoin: round; pointer-events: stroke; cursor: pointer; }.connection-line { stroke: rgba(122,143,255,.6); stroke-width: 1.8; stroke-dasharray: 7 8; stroke-linecap: round; stroke-linejoin: round; pointer-events: stroke; cursor: pointer; animation: none; }.connection-line.is-direction-forward { animation: connection-flow-forward 1.35s linear infinite; }.connection-line.is-direction-backward { animation: connection-flow-backward 1.35s linear infinite; }.connection-line.is-direction-none { animation: none; }.connection-line.is-complete { stroke: rgba(77,226,208,.78); }.connection-line.is-active { stroke: rgba(150,109,255,.84); }.connection-line.is-planned { stroke: rgba(100,168,255,.62); }.connection-line.is-selected { stroke-width: 2.6; filter: drop-shadow(0 0 4px currentColor); }.connection-preview-line { fill: none; stroke: rgba(77,226,208,.84); stroke-width: 2.1; stroke-dasharray: 4 6; stroke-linecap: round; pointer-events: none; filter: drop-shadow(0 0 5px rgba(77,226,208,.34)); }.connection-arrow { fill: #8c9cff; }.connection-popover { position: absolute; z-index: 5; display: grid; gap: 8px; width: min(250px, calc(100% - 24px)); padding: 11px; border: 1px solid rgba(100,168,255,.42); border-radius: 6px; background: rgba(15,18,45,.98); box-shadow: 0 16px 44px rgba(0,0,20,.38); color: var(--muted); font-size: .59rem; }.connection-popover[hidden] { display: none; }.connection-popover strong { color: #eef2ff; font-size: .68rem; }.connection-popover > span { overflow: hidden; color: var(--subtle); text-overflow: ellipsis; white-space: nowrap; }.connection-popover .connection-direction { min-height: 31px !important; padding: 0 7px !important; }.connection-edge-controls { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; }.connection-edge-control { display: grid; gap: 4px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .48rem; }.connection-edge-control .connection-direction { width: 100%; min-height: 28px !important; }.connection-popover-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }.connection-popover .danger-action { min-height: 30px; margin-top: 0; }.connection-editor { display: grid; gap: 7px; margin-top: 13px; padding-top: 13px; border-top: 1px solid rgba(170,183,255,.12); color: var(--subtle); font-family: "DM Mono", monospace; font-size: .54rem; letter-spacing: .04em; }.connection-editor-list { display: grid; gap: 4px; }.connection-editor-row { display: grid; grid-template-columns: minmax(0,1fr) minmax(76px,.65fr) 24px; gap: 7px; align-items: center; padding: 6px 0 6px 7px; border-left: 1px solid rgba(100,168,255,.5); background: rgba(100,168,255,.05); }.connection-editor-row span { min-width: 0; }.connection-editor-row small, .connection-editor-row strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.connection-editor-row small { color: var(--subtle); font-size: .45rem; }.connection-editor-row strong { margin-top: 2px; color: #e2e6fb; font-family: Manrope, sans-serif; font-size: .6rem; font-weight: 700; letter-spacing: 0; }.connection-direction { min-width: 0; min-height: 27px !important; padding: 0 3px !important; border-radius: 3px !important; color: var(--blue) !important; font-family: "DM Mono", monospace !important; font-size: .5rem !important; }.connection-remove { display: grid; width: 24px; height: 24px; place-items: center; border: 1px solid transparent; border-radius: 3px; background: transparent; color: var(--subtle); cursor: pointer; font-family: "DM Mono", monospace; font-size: .68rem; }.connection-remove:hover { border-color: rgba(255,117,152,.4); color: var(--rose); }.connection-empty { padding: 6px 0; color: var(--subtle); font-size: .51rem; letter-spacing: 0; }.canvas-link-legend { color: var(--subtle); }.canvas-toolbar .text-action.is-active { border-color: rgba(77,226,208,.5); background: rgba(77,226,208,.08); color: var(--cyan); }
.node-rationale { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; margin-top: 13px; padding: 12px 0 0 9px; border-top: 1px solid rgba(170,183,255,.12); border-left: 1px solid rgba(77,226,208,.55); }.node-rationale > div { min-width: 0; }.node-rationale .eyebrow { margin-bottom: 5px; color: var(--cyan); }.node-rationale p:not(.eyebrow) { margin: 0; color: var(--muted); font-size: .6rem; line-height: 1.5; }.node-rationale span { display: block; margin-top: 7px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .46rem; line-height: 1.4; }

@keyframes breathe { to { opacity: .25; transform: translate3d(2%,-3%,0) scale(1.08); } } @keyframes logo-spectrum { 0% { background-position: 0% 50%; filter: drop-shadow(0 0 5px rgba(77,226,208,.38)); } 100% { background-position: 100% 50%; filter: drop-shadow(0 0 7px rgba(150,109,255,.42)); } } @keyframes enter { from { opacity: 0; transform: translateY(9px) scale(.99); } to { opacity: 1; transform: translateY(0) scale(1); } } @keyframes arrive { from { opacity: 0; transform: translateY(7px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } } @keyframes node-enter { from { opacity: 0; transform: translateY(8px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } } @keyframes connection-flow-forward { from { stroke-dashoffset: 0; } to { stroke-dashoffset: -44; } } @keyframes connection-flow-backward { from { stroke-dashoffset: 0; } to { stroke-dashoffset: 44; } } @keyframes card-enter { from { opacity: 0; transform: translateY(10px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } }

.metric-grid > *, .command-grid > *, .dashboard-grid > *, .briefing-grid > *, .advisor-context > *, .opportunity-grid > *, .event-grid > *, .requirements-grid > *, .onboarding-grid > *, .patterns-grid > * { animation: card-enter .42s var(--ease) both; } .metric-grid > *:nth-child(1), .command-grid > *:nth-child(1), .dashboard-grid > *:nth-child(1), .briefing-grid > *:nth-child(1), .advisor-context > *:nth-child(1), .opportunity-grid > *:nth-child(1), .event-grid > *:nth-child(1), .requirements-grid > *:nth-child(1), .onboarding-grid > *:nth-child(1), .patterns-grid > *:nth-child(1) { animation-delay: calc(var(--stagger) * 0); } .metric-grid > *:nth-child(2), .command-grid > *:nth-child(2), .dashboard-grid > *:nth-child(2), .briefing-grid > *:nth-child(2), .advisor-context > *:nth-child(2), .opportunity-grid > *:nth-child(2), .event-grid > *:nth-child(2), .requirements-grid > *:nth-child(2), .onboarding-grid > *:nth-child(2), .patterns-grid > *:nth-child(2) { animation-delay: calc(var(--stagger) * 1); } .metric-grid > *:nth-child(3), .command-grid > *:nth-child(3), .dashboard-grid > *:nth-child(3), .briefing-grid > *:nth-child(3), .advisor-context > *:nth-child(3), .opportunity-grid > *:nth-child(3), .event-grid > *:nth-child(3), .requirements-grid > *:nth-child(3), .onboarding-grid > *:nth-child(3), .patterns-grid > *:nth-child(3) { animation-delay: calc(var(--stagger) * 2); } .metric-grid > *:nth-child(4), .command-grid > *:nth-child(4), .dashboard-grid > *:nth-child(4), .briefing-grid > *:nth-child(4), .advisor-context > *:nth-child(4), .opportunity-grid > *:nth-child(4), .event-grid > *:nth-child(4), .requirements-grid > *:nth-child(4), .onboarding-grid > *:nth-child(4), .patterns-grid > *:nth-child(4) { animation-delay: calc(var(--stagger) * 3); } .metric-grid > *:nth-child(5), .command-grid > *:nth-child(5), .dashboard-grid > *:nth-child(5), .briefing-grid > *:nth-child(5), .advisor-context > *:nth-child(5), .opportunity-grid > *:nth-child(5), .event-grid > *:nth-child(5), .requirements-grid > *:nth-child(5), .onboarding-grid > *:nth-child(5), .patterns-grid > *:nth-child(5) { animation-delay: calc(var(--stagger) * 4); } .metric-grid > *:nth-child(6), .command-grid > *:nth-child(6), .dashboard-grid > *:nth-child(6), .briefing-grid > *:nth-child(6), .advisor-context > *:nth-child(6), .opportunity-grid > *:nth-child(6), .event-grid > *:nth-child(6), .requirements-grid > *:nth-child(6), .onboarding-grid > *:nth-child(6), .patterns-grid > *:nth-child(6) { animation-delay: calc(var(--stagger) * 5); } .metric-grid > *:nth-child(7), .command-grid > *:nth-child(7), .dashboard-grid > *:nth-child(7), .briefing-grid > *:nth-child(7), .advisor-context > *:nth-child(7), .opportunity-grid > *:nth-child(7), .event-grid > *:nth-child(7), .requirements-grid > *:nth-child(7), .onboarding-grid > *:nth-child(7), .patterns-grid > *:nth-child(7) { animation-delay: calc(var(--stagger) * 6); } .metric-grid > *:nth-child(8), .command-grid > *:nth-child(8), .dashboard-grid > *:nth-child(8), .briefing-grid > *:nth-child(8), .advisor-context > *:nth-child(8), .opportunity-grid > *:nth-child(8), .event-grid > *:nth-child(8), .requirements-grid > *:nth-child(8), .onboarding-grid > *:nth-child(8), .patterns-grid > *:nth-child(8) { animation-delay: calc(var(--stagger) * 7); }
@media (prefers-reduced-motion: reduce) { .wordmark-glyph, .connection-line { animation: none; background-position: 50% 50%; } }
@media (max-width: 1120px) { .workspace { padding: 24px; }.metric-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.command-grid, .opportunity-grid, .event-grid, .requirements-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.advisor-layout,.profile-layout,.calendar-layout,.briefing-grid,.evidence-layout,.coach-layout{ grid-template-columns: 1fr; }.advisor-context { grid-template-columns: repeat(3,minmax(0,1fr)); }.app-frame { grid-template-columns: 214px minmax(0,1fr); }.command-bar { grid-template-columns: 214px 1fr auto auto auto auto; }.source-list { grid-template-columns: 1fr; }.briefing-panel { min-height: 0; }.tracker-item { grid-template-columns: 1fr; } }
@media (max-width: 780px) { .tracker-source-alert { grid-template-columns: 24px minmax(0,1fr); }.tracker-source-alert-actions { grid-column: 2; justify-content: flex-start; flex-wrap: wrap; } }
@media (max-width: 780px) { .app-shell { width: 100%; min-height: 100vh; margin: 0; border-right: 0; border-left: 0; border-radius: 0; }.command-bar { grid-template-columns: 1fr auto auto auto auto; gap: 6px; min-height: 57px; padding: 0 14px; }.system-path { display: none; }.save-status { margin-right: 10px; font-size: .57rem; }.advanced-toggle { margin-right: 0; padding: 0 6px; font-size: .5rem; }.app-frame { display: block; }.side-rail { display: block; padding: 8px 10px; border-right: 0; border-bottom: 1px solid var(--line); overflow-x: auto; }.identity-block, .rail-label, .rail-footer { display: none; }.primary-nav { display: flex; gap: 3px; min-width: max-content; }.nav-item { width: auto; min-height: 33px; padding: 0 8px; border-left: 0; border-bottom: 2px solid transparent; font-size: .64rem; }.nav-item:hover, .nav-item.is-active { border-left-color: transparent; border-bottom-color: var(--blue); }.workspace { padding: 20px 14px; }.view-header { flex-direction: column; gap: 13px; margin-bottom: 18px; }.view-header h1 { font-size: 1.18rem; }.view-header-actions, .canvas-header-actions { width: 100%; flex-wrap: wrap; }.workspace-switcher { max-width: 100%; overflow-x: auto; }.metric-grid,.dashboard-grid,.integration-layout,.patterns-grid,.evidence-metric-grid,.runtime-grid,.coach-output-grid{ grid-template-columns: 1fr; }.command-grid, .opportunity-grid, .event-grid, .requirements-grid, .evidence-graph { grid-template-columns: 1fr; }.advisor-context { grid-template-columns: 1fr; }.filter-bar, .form-grid, .tracker-controls { grid-template-columns: 1fr; }.chat-panel { min-height: 560px; }.path-canvas { min-height: 565px; }.path-node { width: 144px; }.canvas-hint, .canvas-link-legend { display: none; }.canvas-toolbar { justify-content: flex-start; flex-wrap: wrap; padding-top: 8px; padding-bottom: 8px; }.canvas-toolbar .text-action { margin-left: 0; }.node-inspector { top: 68px; right: 16px; }.form-actions { align-items: stretch; flex-direction: column; }.form-actions .primary-action, .file-button { width: 100%; justify-content: center; }.source-panel { grid-column: auto; }.pattern-row { grid-template-columns: 108px 1fr 33px; }.event-status-panel { align-items: flex-start; flex-direction: column; }.event-source-badges { justify-content: flex-start; }.calendar-form-actions { grid-template-columns: 1fr; }.compact-danger { width: 100%; }.danger-zone-actions { grid-template-columns: 1fr; }.toast { right: 14px; bottom: 14px; }.briefing-row { grid-template-columns: 1fr; }.briefing-row .text-action { justify-self: start; }.tracker-actions { flex-wrap: wrap; }.registry-item { grid-template-columns: 1fr; gap: 4px; }.registry-item small { text-align: left; }.coach-preview { min-height: 360px; }.coach-goal { grid-template-columns: 1fr; }.coach-goal .route-add-button { width: 100%; }.tutorial-shell { padding: 18px; }.tutorial-progress { grid-template-columns: 1fr; gap: 10px; }.tutorial-progress > span { justify-self: start; }.tutorial-step-list { grid-template-columns: repeat(2,minmax(0,1fr)); }.tutorial-step-list span { white-space: normal; }.tutorial-actions { flex-wrap: wrap; }.tutorial-actions .text-action:first-child { margin-right: 0; }.tutorial-actions .primary-action { margin-left: auto; } }

.agent-studio-header { align-items: flex-end; }.agent-mode-control { display: grid; min-width: 195px; gap: 6px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .55rem; letter-spacing: .08em; }.agent-mode-control select { min-height: 37px; padding: 0 30px 0 10px; border: 1px solid rgba(118,142,255,.48); border-radius: 5px; outline: none; background: rgba(21,25,62,.76); color: #dbe5ff; cursor: pointer; font-family: Manrope, sans-serif; font-size: .68rem; font-weight: 700; letter-spacing: 0; }.agent-mode-control select:focus { border-color: var(--cyan); box-shadow: 0 0 0 3px rgba(77,226,208,.1); }.agent-surface { min-width: 0; animation: enter .24s ease both; }.agent-surface[hidden] { display: none; }
@media (max-width: 780px) { .agent-studio-header { align-items: stretch; }.agent-mode-control { width: 100%; min-width: 0; }.agent-mode-control select { width: 100%; } }

.networking-summary { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; margin-bottom: 12px; }.network-summary-card { min-height: 72px; padding: 16px; }.network-summary-card span, .network-summary-card strong, .network-summary-card small { display: block; }.network-summary-card span { color: var(--subtle); font-family: "DM Mono", monospace; font-size: .54rem; letter-spacing: .08em; text-transform: uppercase; }.network-summary-card strong { margin-top: 10px; color: #e2e6fb; font-size: .75rem; line-height: 1.45; }.network-summary-card small { margin-top: 5px; color: var(--muted); font-size: .59rem; line-height: 1.45; }.networking-layout { display: grid; grid-template-columns: minmax(230px,.42fr) minmax(0,1.58fr); gap: 12px; }.network-filter-panel { display: grid; align-content: start; gap: 18px; padding: 17px; }.network-filter-panel > label { display: grid; gap: 7px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .57rem; letter-spacing: .05em; }.network-filter-panel input { width: 100%; min-height: 37px; padding: 9px; border: 1px solid var(--line); border-radius: 5px; outline: none; background: rgba(5,7,22,.64); color: var(--text); font-family: Manrope, sans-serif; font-size: .68rem; letter-spacing: 0; }.network-filter-panel input:focus { border-color: rgba(100,168,255,.9); box-shadow: 0 0 0 3px rgba(100,168,255,.11); }.network-filter-panel .text-action { justify-self: start; padding-left: 0; }.network-type-filters { display: grid; gap: 5px; margin-top: 9px; }.network-type-control { display: flex; align-items: center; gap: 8px; min-height: 28px; color: var(--muted); cursor: pointer; font-size: .65rem; }.network-type-control input { width: 14px; min-height: 14px; margin: 0; padding: 0; accent-color: var(--cyan); }.networking-results { min-width: 0; }.network-signal-panel, .network-saved-panel { padding: 17px; }.network-signal-panel { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 12px; }.network-signal-panel h2 { margin: 0; color: #e2e6fb; font-size: .8rem; }.network-signal-summary { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }.network-signal { padding: 5px 6px; border: 1px solid rgba(77,226,208,.28); border-radius: 3px; background: rgba(77,226,208,.06); color: var(--cyan); font-family: "DM Mono", monospace; font-size: .52rem; }.network-saved-panel { margin-bottom: 12px; }.network-saved-list { display: grid; gap: 0; margin-top: 14px; }.network-saved-item { display: grid; grid-template-columns: minmax(165px,.62fr) minmax(0,1.38fr); gap: 14px; align-items: center; padding: 11px 0; border-top: 1px solid rgba(170,183,255,.1); }.network-saved-item:first-child { padding-top: 0; border-top: 0; }.network-saved-copy strong, .network-saved-copy span { display: block; }.network-saved-copy strong { color: #e1e5fb; font-size: .68rem; }.network-saved-copy span { margin-top: 4px; color: var(--subtle); font-size: .57rem; line-height: 1.42; }.network-saved-controls { display: grid; grid-template-columns: 132px minmax(0,1fr) auto; gap: 7px; align-items: center; }.network-saved-controls .tracker-notes { min-height: 32px; }.network-saved-controls .text-action { padding: 0; }.network-result-heading { display: flex; justify-content: space-between; gap: 12px; margin: 18px 0 10px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .53rem; letter-spacing: .06em; }.network-result-heading span:first-child { color: var(--blue); }.network-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }.network-card { display: flex; min-height: 283px; flex-direction: column; padding: 16px; border: 1px solid var(--line); border-top: 2px solid var(--network-color, var(--blue)); border-radius: 7px; background: var(--panel); }.network-person-heading { display: grid; grid-template-columns: 35px minmax(0,1fr) auto; gap: 9px; align-items: start; }.network-avatar { display: grid; width: 35px; height: 35px; place-items: center; border: 1px solid color-mix(in srgb, var(--network-color), transparent 38%); border-radius: 50%; background: color-mix(in srgb, var(--network-color), transparent 88%); color: var(--network-color); font-family: "DM Mono", monospace; font-size: .58rem; }.network-person-identity { min-width: 0; }.network-type { color: var(--network-color); font-family: "DM Mono", monospace; font-size: .5rem; letter-spacing: .08em; text-transform: uppercase; }.network-person-identity h2 { margin: 4px 0 0; color: #e5e8fb; font-size: .76rem; line-height: 1.25; }.network-person-identity p { margin: 3px 0 0; color: var(--subtle); font-size: .56rem; line-height: 1.35; }.network-score { max-width: 92px; color: var(--network-color); font-family: "DM Mono", monospace; font-size: .5rem; font-weight: 500; line-height: 1.3; text-align: right; text-transform: uppercase; letter-spacing: .02em; }
.network-disclaimer { margin: -4px 0 12px; color: var(--muted); font-size: .61rem; line-height: 1.5; }.network-focus { display: block; margin-top: 14px; color: #dfe4fa; font-size: .66rem; line-height: 1.42; }.network-card > p { margin: 8px 0 0; color: var(--muted); font-size: .61rem; line-height: 1.5; }.network-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 12px; }.network-tags span { padding: 4px 5px; border: 1px solid rgba(168,181,255,.16); border-radius: 3px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .49rem; }.network-card footer { display: flex; align-items: flex-end; justify-content: space-between; gap: 7px; margin-top: auto; padding-top: 14px; }.network-card-signal { max-width: 90px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .48rem; line-height: 1.35; }.network-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; }.network-dismiss { border-color: transparent; color: var(--subtle); }.network-dismiss:hover { border-color: rgba(255,117,152,.38); color: var(--rose); }
@media (max-width: 1120px) { .networking-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }.networking-layout { grid-template-columns: 1fr; }.network-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 780px) { .networking-summary, .network-grid { grid-template-columns: 1fr; }.network-signal-panel { align-items: flex-start; flex-direction: column; }.network-signal-summary { justify-content: flex-start; }.network-saved-item, .network-saved-controls { grid-template-columns: 1fr; }.network-result-heading { align-items: flex-start; flex-direction: column; }.network-card { min-height: 260px; }.network-card footer { align-items: flex-start; flex-direction: column; }.network-actions { justify-content: flex-start; } }

@media (max-width: 780px) { .path-canvas.is-compact { min-height: 430px; overflow: hidden; }.path-canvas.is-compact .path-node { width: calc(100% - 32px); min-height: 112px; cursor: grab; touch-action: none; }.path-canvas.is-compact .canvas-corner-label { display: none; }.path-canvas.is-compact .connection-port { width: 28px; height: 28px; }.path-canvas.is-compact .connection-port::after { width: 9px; height: 9px; }.path-canvas.is-compact .port-top { top: -14px; }.path-canvas.is-compact .port-right { right: -14px; }.path-canvas.is-compact .port-bottom { bottom: -14px; }.path-canvas.is-compact .port-left { left: -14px; }.path-canvas.is-compact .path-node.is-connection-target { box-shadow: 0 0 0 2px rgba(100,168,255,.16); } }

.workspace-readiness-panel { margin-bottom: 12px; padding: 18px; border-top-color: rgba(100,168,255,.52); }.panel-heading-actions { display: flex; align-items: center; gap: 8px; }.workspace-readiness-panel .body-copy { max-width: 950px; }.workspace-readiness-lanes { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; margin-top: 15px; }.workspace-readiness-lane { display: grid; align-content: start; min-height: 123px; padding: 12px; border: 1px solid rgba(168,181,255,.18); border-top: 2px solid var(--line-strong); border-radius: 5px; background: rgba(8,11,30,.52); color: inherit; cursor: pointer; text-align: left; transition: border-color 160ms ease, background 160ms ease, transform 160ms ease; }.workspace-readiness-lane:hover { border-color: rgba(100,168,255,.62); background: rgba(34,42,91,.26); transform: translateY(-1px); }.workspace-readiness-lane:focus-visible, .workspace-readiness-action:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }.workspace-readiness-lane.is-ready { border-top-color: var(--cyan); }.workspace-readiness-lane.is-watch { border-top-color: #f1c77a; }.workspace-readiness-lane.is-attention, .workspace-readiness-lane.is-urgent { border-top-color: var(--rose); }.workspace-readiness-lane-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }.workspace-readiness-lane-heading span { color: var(--subtle); font-family: "DM Mono", monospace; font-size: .51rem; letter-spacing: .07em; text-transform: uppercase; }.workspace-readiness-lane-heading b { color: #e6ebff; font-family: "DM Mono", monospace; font-size: .67rem; font-weight: 500; }.workspace-readiness-lane small { min-height: 44px; margin-top: 10px; color: var(--muted); font-size: .58rem; line-height: 1.48; }.workspace-readiness-lane em { margin-top: auto; padding-top: 9px; color: var(--blue); font-family: "DM Mono", monospace; font-size: .48rem; font-style: normal; letter-spacing: .06em; }.workspace-readiness-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; margin-top: 10px; }.workspace-readiness-action { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 9px; align-items: center; min-height: 65px; padding: 10px; border: 1px solid rgba(168,181,255,.15); border-radius: 5px; background: rgba(18,22,53,.54); color: inherit; cursor: pointer; text-align: left; transition: border-color 160ms ease, background 160ms ease; }.workspace-readiness-action:hover { border-color: rgba(100,168,255,.52); background: rgba(34,42,91,.3); }.workspace-readiness-action i { min-width: 32px; padding: 4px 0; border: 1px solid rgba(100,168,255,.3); border-radius: 3px; color: var(--blue); font-family: "DM Mono", monospace; font-size: .45rem; font-style: normal; letter-spacing: .05em; text-align: center; }.workspace-readiness-action.is-high i { border-color: rgba(255,117,152,.4); color: #ffb2c3; }.workspace-readiness-action.is-low i { border-color: rgba(77,226,208,.36); color: var(--cyan); }.workspace-readiness-action span { min-width: 0; }.workspace-readiness-action strong, .workspace-readiness-action small { display: block; }.workspace-readiness-action strong { color: #e4e8fc; font-size: .63rem; line-height: 1.35; }.workspace-readiness-action small { margin-top: 3px; color: var(--subtle); font-size: .53rem; line-height: 1.4; }.workspace-readiness-action b { color: var(--blue); font-family: "DM Mono", monospace; font-size: .47rem; font-weight: 500; letter-spacing: .06em; }.workspace-readiness-actions > .empty-activity { grid-column: 1 / -1; margin: 2px 0 0; }
@media (max-width: 1120px) { .workspace-readiness-lanes { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 780px) { .workspace-readiness-panel { padding: 15px; }.workspace-readiness-panel .panel-heading { align-items: flex-start; }.panel-heading-actions { flex-shrink: 0; }.workspace-readiness-lanes, .workspace-readiness-actions { grid-template-columns: 1fr; }.workspace-readiness-lane { min-height: 108px; }.workspace-readiness-lane small { min-height: 0; }.workspace-readiness-action { min-height: 61px; } }
@media (max-width: 780px) { .connection-popover { width: min(234px, calc(100% - 24px)); } }

.chat-composer { grid-template-columns: minmax(0,1fr) 48px; align-items: end; }.chat-composer-input { display: grid; gap: 8px; min-width: 0; }.agent-mode-chat-slot { min-height: 31px; }.agent-mode-chat-slot .agent-mode-control { min-width: 178px; width: fit-content; gap: 4px; }.agent-mode-chat-slot .agent-mode-control select { min-height: 30px; padding-top: 0; padding-bottom: 0; background: rgba(20,24,61,.92); font-size: .64rem; }.agent-mode-chat-slot .agent-mode-control span { font-size: .49rem; }.agent-mode-fallback:empty { display: none; }.agent-mode-fallback .agent-mode-control { min-width: 195px; }
@media (max-width: 780px) { .agent-mode-fallback { width: 100%; }.agent-mode-fallback .agent-mode-control { width: 100%; min-width: 0; }.agent-mode-fallback .agent-mode-control select { width: 100%; } }

.chat-session-rail { display: grid; gap: 6px; margin-top: 14px; min-height: 0; }.chat-session-heading { display: flex; align-items: center; justify-content: space-between; }.chat-session-heading .rail-label { margin: 0 8px; }.chat-session-heading .icon-button { margin-right: 5px; }.chat-session-list { display: grid; gap: 3px; max-height: 192px; overflow-y: auto; padding-right: 2px; }.chat-session-item { display: grid; gap: 3px; width: 100%; padding: 8px 9px; border: 1px solid transparent; border-left: 2px solid transparent; border-radius: 3px; background: transparent; color: var(--muted); cursor: pointer; text-align: left; }.chat-session-item:hover, .chat-session-item.is-active { border-color: rgba(115,142,255,.18); border-left-color: var(--cyan); background: rgba(77,226,208,.055); color: var(--text); }.chat-session-item strong { overflow: hidden; font-size: .61rem; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }.chat-session-item span, .chat-limit-status { color: var(--subtle); font-family: "DM Mono", monospace; font-size: .48rem; letter-spacing: .02em; }.agent-mode-chat-slot { display: flex; align-items: end; justify-content: space-between; gap: 10px; }.chat-limit-status { padding-bottom: 4px; white-space: nowrap; }.agent-surface:not([data-agent-surface="chat"]) { margin-top: 12px; }

.profile-records-layout { display: grid; grid-template-columns: 1fr; gap: 12px; margin-top: 12px; }.profile-record-editor, .profile-record-list { padding: 18px; }.profile-record-editor label { display: grid; gap: 7px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .58rem; letter-spacing: .04em; }.record-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }.record-full-label { grid-column: 1 / -1; }.profile-record-editor input, .profile-record-editor select, .profile-record-row input, .profile-record-row select { width: 100%; min-height: 36px; padding: 9px; border: 1px solid var(--line); border-radius: 5px; outline: none; background: rgba(5,7,22,.64); color: var(--text); font-family: Manrope, sans-serif; font-size: .69rem; letter-spacing: 0; }.profile-record-editor input:focus, .profile-record-editor select:focus, .profile-record-row input:focus, .profile-record-row select:focus { border-color: rgba(100,168,255,.9); box-shadow: 0 0 0 3px rgba(100,168,255,.11); }.profile-record-list-body { display: grid; gap: 0; margin-top: 13px; }.profile-record-row { display: grid; gap: 6px; align-items: center; padding: 9px 0; border-top: 1px solid rgba(170,183,255,.1); }.profile-record-row:first-child { padding-top: 0; border-top: 0; }.profile-exam-row { grid-template-columns: minmax(0,1.65fr) .58fr .58fr minmax(112px,.9fr) 26px; }.profile-experience-row { grid-template-columns: minmax(86px,.68fr) minmax(110px,1fr) minmax(110px,1fr) minmax(92px,.84fr) minmax(92px,.84fr) minmax(140px,1.25fr) 26px; }.profile-record-row input, .profile-record-row select { min-width: 0; min-height: 32px; padding: 7px; font-size: .61rem; }.profile-record-remove { display: grid; width: 26px; height: 26px; place-items: center; border: 1px solid transparent; border-radius: 3px; background: transparent; color: var(--subtle); cursor: pointer; font-family: "DM Mono", monospace; }.profile-record-remove:hover { border-color: rgba(255,117,152,.4); color: var(--rose); }
.profile-intelligence-panel { margin-top: 12px; padding: 18px; border-top-color: rgba(77,226,208,.56); }.profile-intelligence-panel .body-copy { max-width: 860px; margin-top: 12px; }.profile-intelligence-list { display: grid; gap: 0; margin-top: 14px; }.profile-intelligence-row, .profile-intelligence-gap { padding: 12px 0; border-top: 1px solid rgba(170,183,255,.1); }.profile-intelligence-head { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; align-items: start; }.profile-intelligence-head strong, .profile-intelligence-head span { display: block; }.profile-intelligence-head strong { color: #e4e8ff; font-size: .7rem; }.profile-intelligence-head span { margin-top: 4px; color: var(--muted); font-size: .59rem; line-height: 1.42; }.profile-intelligence-state { padding: 4px 5px; border: 1px solid rgba(168,181,255,.18); border-radius: 3px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .45rem; font-weight: 500; letter-spacing: .04em; line-height: 1.25; text-transform: uppercase; white-space: nowrap; }.profile-intelligence-state.is-meets-verified-target { border-color: rgba(77,226,208,.38); color: var(--cyan); }.profile-intelligence-state.is-below-verified-target { border-color: rgba(255,117,152,.42); color: var(--rose); }.profile-intelligence-state.is-pending-target { border-color: rgba(239,184,102,.4); color: var(--amber); }.profile-intelligence-meter { height: 4px; margin-top: 11px; overflow: hidden; border-radius: 2px; background: rgba(168,181,255,.12); }.profile-intelligence-meter i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--blue), var(--cyan)); transition: width .3s ease; }.profile-intelligence-row > p, .profile-intelligence-gap p { margin: 8px 0 0; color: var(--muted); font-size: .61rem; line-height: 1.5; }.profile-intelligence-meta { display: flex; flex-wrap: wrap; gap: 7px 12px; margin-top: 9px; }.profile-intelligence-meta a, .profile-intelligence-meta span, .profile-intelligence-gap a { color: var(--purple); font-family: "DM Mono", monospace; font-size: .49rem; line-height: 1.45; }.profile-intelligence-meta a:hover, .profile-intelligence-gap a:hover { color: var(--cyan); }.profile-intelligence-gap strong { color: var(--amber); font-size: .65rem; }.profile-intelligence-gap a { display: inline-block; margin-top: 8px; }
@media (max-width: 1120px) { .profile-records-layout { grid-template-columns: 1fr; }.profile-experience-row { grid-template-columns: repeat(3,minmax(0,1fr)) 26px; }.profile-experience-row > input:last-of-type { grid-column: span 2; } }
.profile-segment { margin-bottom: 12px; border: 1px solid var(--line); border-radius: 7px; background: var(--panel); box-shadow: inset 0 1px rgba(255,255,255,.03); overflow: hidden; }.profile-segment:last-of-type { margin-bottom: 0; }.profile-segment-summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 18px; cursor: pointer; list-style: none; user-select: none; transition: background 160ms ease; }.profile-segment-summary::-webkit-details-marker { display: none; }.profile-segment-summary:hover { background: rgba(100,133,255,.07); }.profile-segment-summary:focus-visible { outline: 2px solid var(--blue); outline-offset: -2px; }.profile-segment-summary-text { display: block; }.profile-segment-summary-text .eyebrow { margin-bottom: 5px; }.profile-segment-summary-text h2 { margin: 0; font-size: .91rem; }.profile-segment-hint { display: block; margin-top: 4px; color: var(--muted); font-size: .68rem; line-height: 1.4; }.profile-segment-caret { display: grid; flex: 0 0 auto; width: 22px; height: 22px; place-items: center; border: 1px solid var(--line-strong); border-radius: 5px; color: var(--muted); font-size: .6rem; transition: transform 200ms ease, color 160ms ease; }.profile-segment-caret::before { content: "\2304"; }.profile-segment[open] > .profile-segment-summary .profile-segment-caret { transform: rotate(180deg); color: var(--blue); }.profile-segment-body { padding: 0 18px 18px; }.profile-segment-body .profile-layout, .profile-segment-body .profile-records-layout { margin-top: 0; }.profile-segment-body > .panel, .profile-segment-body > section.panel { border: 0; background: transparent; box-shadow: none; }
@media (max-width: 780px) { .chat-session-rail { display: none; }.agent-mode-chat-slot { align-items: flex-start; flex-direction: column; }.chat-limit-status { padding: 0; }.record-form-grid { grid-template-columns: 1fr; }.profile-exam-row, .profile-experience-row { grid-template-columns: 1fr 1fr; }.profile-record-row > .profile-record-remove { grid-column: 2; justify-self: end; }.profile-experience-row > input:last-of-type { grid-column: auto; }.profile-intelligence-head { grid-template-columns: 1fr; }.profile-intelligence-state { justify-self: start; white-space: normal; } }

.agent-decision-card { border-top-color: rgba(77,226,208,.62); }
.agent-action-trace { display: grid; gap: 0; margin-top: 12px; }
.agent-trace-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; align-items: start; padding: 9px 0; border-top: 1px solid rgba(170,183,255,.1); }
.agent-trace-copy { display: grid; gap: 3px; min-width: 0; }
.agent-trace-copy strong { color: #e6e9ff; font-size: .61rem; line-height: 1.32; }
.agent-trace-copy span { color: var(--subtle); font-size: .54rem; line-height: 1.42; }
.agent-trace-status { padding: 3px 4px; border: 1px solid rgba(168,181,255,.15); border-radius: 3px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .43rem; letter-spacing: .04em; line-height: 1.2; text-transform: uppercase; white-space: nowrap; }
.agent-trace-row.is-applied .agent-trace-status { border-color: rgba(77,226,208,.34); color: var(--cyan); }
.agent-trace-row.is-ready .agent-trace-status { border-color: rgba(100,168,255,.36); color: var(--blue); }
.agent-trace-row.is-needs-verification .agent-trace-status { border-color: rgba(239,184,102,.4); color: var(--amber); }
.agent-trace-row.is-reverted .agent-trace-status { border-color: rgba(168,181,255,.24); color: var(--subtle); }
.agent-knowledge-note { display: grid; gap: 4px; margin-top: 4px; padding-top: 9px; border-top: 1px solid rgba(170,183,255,.1); }
.agent-knowledge-note > span { color: var(--purple); font-family: "DM Mono", monospace; font-size: .45rem; letter-spacing: .08em; }
.agent-knowledge-note p { margin: 0; color: var(--muted); font-size: .54rem; line-height: 1.45; }
.agent-loop-card { border-top-color: rgba(150,109,255,.58); }
.agent-loop-checks { display: grid; gap: 0; margin: 12px 0 3px; }
.agent-loop-check { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 0; border-top: 1px solid rgba(170,183,255,.1); color: var(--muted); font-size: .55rem; }
.agent-loop-check i { color: var(--cyan); font-family: "DM Mono", monospace; font-size: .44rem; font-style: normal; letter-spacing: .04em; text-transform: uppercase; }
.agent-loop-check.is-review i { color: var(--amber); }
button.agent-loop-check { width: 100%; border: 0; border-top: 1px solid rgba(170,183,255,.1); border-radius: 0; background: transparent; text-align: left; cursor: pointer; }
button.agent-loop-check:hover { color: var(--text); }
button.agent-loop-check:hover i { color: var(--blue); }
button.agent-loop-check.is-review:hover i { color: var(--amber); }
.agent-journal-card { border-top-color: rgba(100,168,255,.52); }
.agent-journal-list { display: grid; gap: 0; margin: 12px 0 3px; }
.agent-journal-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; align-items: center; padding: 8px 0; border-top: 1px solid rgba(170,183,255,.1); }
.agent-journal-row strong, .agent-journal-row span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.agent-journal-row strong { color: #e2e6fb; font-size: .58rem; }
.agent-journal-row span { margin-top: 3px; color: var(--subtle); font-size: .5rem; }
.agent-journal-row i { color: var(--cyan); font-family: "DM Mono", monospace; font-size: .43rem; font-style: normal; letter-spacing: .04em; text-transform: uppercase; }
.agent-journal-row.is-undone { opacity: .62; }
.chat-utility-bar { display: flex; align-items: center; gap: 8px; padding: 10px 18px; border-top: 1px solid var(--line); background: rgba(10,12,32,.4); }.chat-utility-new { display: grid; flex: 0 0 auto; width: 26px; height: 26px; place-items: center; border: 1px solid var(--line-strong); border-radius: 5px; background: rgba(255,255,255,.03); color: var(--muted); cursor: pointer; font-size: .82rem; line-height: 1; transition: border-color 160ms ease, color 160ms ease; }.chat-utility-new:hover { border-color: var(--blue); color: var(--text); }.chat-utility-tabs { display: flex; gap: 4px; }.chat-utility-tab { display: inline-flex; align-items: center; gap: 6px; min-height: 26px; padding: 0 10px; border: 1px solid transparent; border-radius: 20px; background: transparent; color: var(--muted); cursor: pointer; font-size: .63rem; font-weight: 700; transition: border-color 160ms ease, background 160ms ease, color 160ms ease; }.chat-utility-tab:hover { color: var(--text); }.chat-utility-tab.is-active { border-color: rgba(100,168,255,.4); background: rgba(100,168,255,.1); color: var(--blue); }.commits-count-badge { display: inline-grid; min-width: 15px; height: 15px; padding: 0 4px; place-items: center; border-radius: 8px; background: rgba(100,168,255,.22); color: #d9e4ff; font-family: "DM Mono", monospace; font-size: .48rem; }
.commits-panel { padding: 14px 18px 18px; border-top: 1px solid var(--line); max-height: 340px; overflow-y: auto; }.commits-panel .form-note { margin: 0 0 12px; }.commits-list { display: grid; gap: 10px; }.commit-row { padding: 12px 13px; border: 1px solid var(--line); border-radius: 6px; background: rgba(8,10,28,.42); }.commit-row.is-undone { opacity: .58; }.commit-row-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }.commit-row-head strong { color: #e5e7fc; font-size: .7rem; }.commit-row-head time { color: var(--subtle); font-family: "DM Mono", monospace; font-size: .49rem; white-space: nowrap; }.commit-row-summary { margin: 6px 0 0; color: var(--cyan); font-size: .63rem; }.commit-row-prompt { margin: 5px 0 0; color: var(--muted); font-size: .62rem; font-style: italic; line-height: 1.45; }.commit-row-details { display: grid; gap: 4px; margin-top: 9px; padding-top: 9px; border-top: 1px solid rgba(170,183,255,.1); }.commit-detail-row { color: var(--muted); font-family: "DM Mono", monospace; font-size: .56rem; line-height: 1.5; word-break: break-word; }.commit-row-status { display: inline-block; margin-top: 9px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .5rem; letter-spacing: .04em; text-transform: uppercase; }.commit-row .text-action { margin-top: 9px; padding-left: 0; }
.agent-journal-row.is-undone i { color: var(--subtle); }
.integration-permission { display: block; margin-top: 6px; color: var(--purple); font-family: "DM Mono", monospace; font-size: .47rem; letter-spacing: .04em; }
.agent-eval-panel { margin-top: 12px; padding: 18px; }
.agent-eval-list { display: grid; gap: 0; margin-top: 14px; }
.agent-eval-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 10px 0; border-top: 1px solid rgba(170,183,255,.1); }
.agent-eval-row strong, .agent-eval-row span { display: block; }
.agent-eval-row strong { color: #e2e6fb; font-size: .67rem; }
.agent-eval-row span { margin-top: 4px; color: var(--subtle); font-size: .56rem; }
.agent-eval-row b { padding: 4px 5px; border: 1px solid rgba(77,226,208,.3); border-radius: 3px; color: var(--cyan); font-family: "DM Mono", monospace; font-size: .46rem; font-weight: 500; letter-spacing: .05em; text-transform: uppercase; }
.agent-eval-row.is-failing b { border-color: rgba(239,184,102,.35); color: var(--amber); }
.agent-observability-panel { margin-top: 12px; padding: 18px; border-top-color: rgba(150,109,255,.58); }
.agent-observability-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 7px; margin-top: 15px; }
.agent-observability-metric { display: grid; gap: 4px; min-height: 51px; padding: 8px; border: 1px solid rgba(168,181,255,.14); border-radius: 4px; background: rgba(9,12,34,.28); }
.agent-observability-metric small { color: var(--subtle); font-family: "DM Mono", monospace; font-size: .43rem; letter-spacing: .06em; text-transform: uppercase; }
.agent-observability-metric strong { color: #e5e8ff; font-size: .72rem; }
.agent-observability-list { display: grid; gap: 0; margin-top: 14px; }
.agent-observability-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 10px 0; border-top: 1px solid rgba(170,183,255,.1); }
.agent-observability-copy { min-width: 0; }
.agent-observability-copy strong, .agent-observability-copy span, .agent-observability-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.agent-observability-copy strong { color: #e2e6fb; font-size: .65rem; }
.agent-observability-copy span { margin-top: 4px; color: var(--muted); font-family: "DM Mono", monospace; font-size: .49rem; }
.agent-observability-copy small { margin-top: 4px; color: var(--subtle); font-size: .52rem; }
.agent-observability-row b { padding: 4px 5px; border: 1px solid rgba(77,226,208,.3); border-radius: 3px; color: var(--cyan); font-family: "DM Mono", monospace; font-size: .45rem; font-weight: 500; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }
.agent-observability-row.is-needs-review b, .agent-observability-row.is-needs-attention b { border-color: rgba(239,184,102,.35); color: var(--amber); }
@media (max-width: 780px) { .agent-observability-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }.agent-observability-row { align-items: start; grid-template-columns: minmax(0,1fr); gap: 6px; }.agent-observability-row b { justify-self: start; }.agent-observability-copy strong, .agent-observability-copy span, .agent-observability-copy small { white-space: normal; } }

.student-twin-view { max-width: 1380px; }.profile-twin-workspace { margin-top: 26px; padding-top: 24px; border-top: 1px solid rgba(150,109,255,.28); }.profile-twin-header { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 14px; }.profile-twin-header h2 { margin: 0; color: #e8ebff; font-size: 1.2rem; }.profile-twin-header .body-copy { max-width: 760px; margin: 7px 0 0; }.twin-metric-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin-bottom: 12px; }.twin-metric-card { min-height: 114px; padding: 17px; border-top: 2px solid rgba(77,226,208,.56); }.twin-metric-card span, .twin-metric-card strong, .twin-metric-card small { display: block; }.twin-metric-card span { color: var(--subtle); font-family: "DM Mono", monospace; font-size: .51rem; letter-spacing: .08em; text-transform: uppercase; }.twin-metric-card strong { margin-top: 12px; color: #e8ebff; font-family: "DM Mono", monospace; font-size: 1.26rem; font-weight: 500; }.twin-metric-card small { margin-top: 6px; color: var(--muted); font-size: .57rem; line-height: 1.38; }.twin-top-grid, .twin-content-grid { display: grid; grid-template-columns: minmax(0,1.38fr) minmax(280px,.62fr); gap: 12px; }.twin-story-panel, .twin-preferences-panel, .twin-themes-panel, .twin-growth-panel, .twin-source-panel { padding: 18px; }.twin-preferences-panel { border-top-color: rgba(150,109,255,.55); }.twin-thesis-label { display: grid; gap: 7px; margin-top: 14px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .55rem; letter-spacing: .06em; text-transform: uppercase; }.twin-thesis-label textarea { width: 100%; min-height: 88px; padding: 11px; border: 1px solid var(--line); border-radius: 5px; outline: none; background: rgba(5,7,22,.64); color: #e3e7fc; font-family: Manrope, sans-serif; font-size: .71rem; letter-spacing: 0; line-height: 1.58; resize: vertical; text-transform: none; }.twin-thesis-label textarea:focus { border-color: rgba(100,168,255,.9); box-shadow: 0 0 0 3px rgba(100,168,255,.11); }.twin-story-panel .form-note { max-width: 760px; margin: 10px 0 0; }.twin-choice-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; margin-top: 13px; }.twin-choice { display: grid; grid-template-columns: 15px minmax(0,1fr); gap: 8px; align-items: start; min-height: 55px; padding: 8px; border: 1px solid rgba(168,181,255,.14); border-radius: 4px; background: rgba(9,12,34,.24); color: var(--muted); cursor: pointer; }.twin-choice:hover { border-color: rgba(100,168,255,.36); }.twin-choice input { width: 14px; height: 14px; margin: 2px 0 0; accent-color: var(--cyan); }.twin-choice strong, .twin-choice small { display: block; }.twin-choice strong { color: #e0e5fb; font-size: .61rem; line-height: 1.25; }.twin-choice small { margin-top: 3px; color: var(--subtle); font-size: .49rem; line-height: 1.35; }.twin-section { margin-top: 23px; }.twin-section > .panel-heading { margin-bottom: 10px; }.twin-workspace-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 10px; }.twin-workspace-card { position: relative; display: grid; align-content: start; min-height: 198px; padding: 15px; border: 1px solid var(--line); border-top: 2px solid rgba(100,168,255,.42); border-radius: 7px; background: rgba(11,15,42,.72); }.twin-workspace-card.is-preferred { border-top-color: var(--cyan); box-shadow: 0 0 0 1px rgba(77,226,208,.1), 0 14px 28px rgba(1,6,23,.18); }.twin-workspace-heading { display: flex; align-items: center; gap: 8px; min-width: 0; }.twin-workspace-heading strong { overflow: hidden; color: #e7eafd; font-size: .69rem; text-overflow: ellipsis; white-space: nowrap; }.twin-workspace-icon { display: grid; width: 25px; height: 25px; flex: 0 0 auto; place-items: center; border: 1px solid rgba(100,168,255,.34); border-radius: 4px; color: var(--blue); font-family: "DM Mono", monospace; font-size: .55rem; }.twin-workspace-card > p { margin: 12px 0 0; color: var(--muted); font-size: .58rem; line-height: 1.52; }.twin-preference-button { justify-self: start; margin-top: 12px; padding: 4px 6px; border: 1px solid rgba(168,181,255,.2); border-radius: 3px; background: rgba(15,18,48,.46); color: var(--subtle); cursor: pointer; font-family: "DM Mono", monospace; font-size: .46rem; letter-spacing: .04em; text-transform: uppercase; }.twin-preference-button:hover, .twin-preference-button.is-active { border-color: rgba(77,226,208,.45); color: var(--cyan); }.twin-workspace-card footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 13px; border-top: 1px solid rgba(170,183,255,.1); }.twin-workspace-card footer span { color: var(--subtle); font-family: "DM Mono", monospace; font-size: .46rem; line-height: 1.35; }.twin-workspace-card footer .text-action { padding: 0; }.twin-content-grid { margin-top: 12px; }.twin-themes { display: grid; gap: 0; }.twin-theme-card { padding: 13px 0; border-top: 1px solid rgba(170,183,255,.12); }.twin-theme-card:first-child { padding-top: 0; border-top: 0; }.twin-theme-heading { display: flex; align-items: start; justify-content: space-between; gap: 9px; }.twin-theme-heading strong, .twin-theme-heading span { display: block; }.twin-theme-heading strong { color: #e2e6fa; font-size: .67rem; }.twin-theme-heading span { margin-top: 4px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .47rem; }.twin-pin-button { flex: 0 0 auto; padding: 3px 5px; border: 1px solid rgba(168,181,255,.18); border-radius: 3px; background: transparent; color: var(--subtle); cursor: pointer; font-family: "DM Mono", monospace; font-size: .43rem; letter-spacing: .05em; text-transform: uppercase; }.twin-pin-button:hover, .twin-pin-button.is-pinned { border-color: rgba(150,109,255,.5); color: #c8b8ff; }.twin-theme-card > p { margin: 7px 0 0; color: var(--muted); font-size: .58rem; line-height: 1.48; }.twin-evidence-list { display: grid; gap: 0; margin-top: 9px; }.twin-evidence-row { display: grid; grid-template-columns: 18px minmax(0,1fr); gap: 7px; width: 100%; padding: 7px 0; border: 0; border-top: 1px solid rgba(170,183,255,.08); background: transparent; color: inherit; cursor: pointer; text-align: left; }.twin-evidence-row:hover strong { color: var(--cyan); }.twin-evidence-row i { display: grid; width: 17px; height: 17px; place-items: center; border: 1px solid rgba(100,168,255,.28); border-radius: 50%; color: var(--blue); font-family: "DM Mono", monospace; font-size: .43rem; font-style: normal; }.twin-evidence-row strong, .twin-evidence-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.twin-evidence-row strong { color: #dfe4fa; font-size: .56rem; }.twin-evidence-row small { margin-top: 3px; color: var(--subtle); font-size: .48rem; }.twin-growth-list { display: grid; gap: 0; }.twin-growth-row { display: grid; grid-template-columns: 56px minmax(0,1fr) auto; gap: 8px; align-items: center; width: 100%; padding: 10px 0; border: 0; border-top: 1px solid rgba(170,183,255,.12); background: transparent; color: inherit; cursor: pointer; text-align: left; }.twin-growth-row:first-child { padding-top: 0; border-top: 0; }.twin-growth-row:hover strong { color: var(--cyan); }.twin-growth-row > i { color: var(--purple); font-family: "DM Mono", monospace; font-size: .45rem; font-style: normal; line-height: 1.35; }.twin-growth-row strong, .twin-growth-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.twin-growth-row strong { color: #e1e5fb; font-size: .59rem; }.twin-growth-row small { margin-top: 4px; color: var(--subtle); font-size: .48rem; }.twin-growth-row b { color: var(--subtle); font-family: "DM Mono", monospace; font-size: .42rem; font-weight: 500; letter-spacing: .05em; text-transform: uppercase; }.twin-source-panel { margin-top: 12px; border-top-color: rgba(239,184,102,.48); }.twin-source-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0 16px; margin-top: 14px; }.twin-source-row { display: flex; align-items: center; justify-content: space-between; gap: 9px; min-width: 0; padding: 10px 0; border-top: 1px solid rgba(170,183,255,.12); }.twin-source-row div { min-width: 0; }.twin-source-row a, .twin-source-row span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.twin-source-row a { color: #e1e5fb; font-size: .6rem; text-decoration: none; }.twin-source-row a:hover { color: var(--cyan); }.twin-source-row span { margin-top: 4px; color: var(--subtle); font-size: .47rem; }.twin-source-row small { flex: 0 0 auto; color: var(--amber); font-family: "DM Mono", monospace; font-size: .4rem; letter-spacing: .04em; text-transform: uppercase; }.twin-source-row.is-prepared small { color: var(--cyan); }.twin-source-row.is-connected small { color: var(--cyan); }
@media (max-width: 1120px) { .twin-metric-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.twin-top-grid, .twin-content-grid { grid-template-columns: 1fr; }.twin-workspace-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }.twin-source-list { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 780px) { .twin-metric-grid, .twin-workspace-grid, .twin-source-list { grid-template-columns: 1fr; }.twin-choice-list { grid-template-columns: 1fr; }.twin-metric-card { min-height: 90px; }.twin-workspace-card { min-height: 166px; }.twin-growth-row { grid-template-columns: 52px minmax(0,1fr); }.twin-growth-row b { grid-column: 2; }.student-twin-actions { width: 100%; }.student-twin-actions .primary-action, .student-twin-actions .text-action { flex: 1 1 auto; justify-content: center; } }
@media print { body.is-printing-twin { background: #fff !important; color: #10131a !important; }.is-printing-twin .command-bar, .is-printing-twin .side-rail, .is-printing-twin .student-twin-actions, .is-printing-twin .twin-preferences-panel, .is-printing-twin .twin-pin-button, .is-printing-twin .twin-preference-button, .is-printing-twin .twin-workspace-card footer .text-action, .is-printing-twin .twin-source-panel .text-action { display: none !important; }.is-printing-twin .app-shell { width: 100%; min-height: 0; margin: 0; border: 0; border-radius: 0; background: #fff; box-shadow: none; }.is-printing-twin .app-frame { display: block; }.is-printing-twin .workspace { padding: 0; }.is-printing-twin .view:not([data-view="twin"]) { display: none !important; }.is-printing-twin [data-view="twin"] { display: block !important; color: #10131a; }.is-printing-twin .view-header { margin-bottom: 18px; }.is-printing-twin .view-header h1, .is-printing-twin .panel-heading h2, .is-printing-twin .twin-workspace-heading strong, .is-printing-twin .twin-theme-heading strong, .is-printing-twin .twin-growth-row strong, .is-printing-twin .twin-source-row a { color: #10131a !important; }.is-printing-twin .view-subtitle, .is-printing-twin .body-copy, .is-printing-twin .twin-workspace-card > p, .is-printing-twin .twin-theme-card > p, .is-printing-twin .twin-growth-row small, .is-printing-twin .twin-source-row span, .is-printing-twin .twin-story-panel .form-note { color: #39404b !important; }.is-printing-twin .panel, .is-printing-twin .twin-workspace-card { border-color: #ccd2dd !important; background: #fff !important; box-shadow: none !important; break-inside: avoid; }.is-printing-twin .twin-thesis-label textarea { min-height: 0; padding: 0; border: 0; background: transparent; color: #10131a; resize: none; }.is-printing-twin .twin-metric-card strong { color: #10131a; }.is-printing-twin .twin-evidence-row { cursor: default; }.is-printing-twin .twin-evidence-row strong { color: #232834; }.is-printing-twin .twin-evidence-row small, .is-printing-twin .twin-growth-row > i, .is-printing-twin .twin-growth-row b { color: #596274; }.is-printing-twin .twin-source-row small { color: #6b4e10; }.is-printing-twin .twin-content-grid, .is-printing-twin .twin-top-grid { grid-template-columns: 1fr 1fr; }.is-printing-twin .twin-workspace-grid { grid-template-columns: repeat(5,minmax(0,1fr)); }body.is-printing-brief { background: #fff !important; color: #10131a !important; }.is-printing-brief .command-bar, .is-printing-brief .side-rail, .is-printing-brief .brief-actions { display: none !important; }.is-printing-brief .app-shell { width: 100%; min-height: 0; margin: 0; border: 0; border-radius: 0; background: #fff; box-shadow: none; }.is-printing-brief .app-frame { display: block; }.is-printing-brief .workspace { padding: 0; }.is-printing-brief .view:not([data-view="brief"]) { display: none !important; }.is-printing-brief [data-view="brief"] { display: block !important; color: #10131a; }.is-printing-brief .view-header { margin-bottom: 18px; }.is-printing-brief .view-header h1, .is-printing-brief .panel-heading h2, .is-printing-brief .twin-growth-row strong { color: #10131a !important; }.is-printing-brief .view-subtitle, .is-printing-brief .body-copy, .is-printing-brief .twin-growth-row small, .is-printing-brief .form-note { color: #39404b !important; }.is-printing-brief .panel { border-color: #ccd2dd !important; background: #fff !important; box-shadow: none !important; break-inside: avoid; }.is-printing-brief .twin-metric-card strong { color: #10131a; }.is-printing-brief .twin-growth-row > i, .is-printing-brief .twin-growth-row b { color: #596274; }.is-printing-brief .twin-content-grid { grid-template-columns: 1fr 1fr; } }

.twin-source-row.is-watching small { color: var(--cyan); }

.connection-line.is-direction-forward, .connection-line.is-direction-backward { animation: connection-flow-forward 1.35s linear infinite; }
.connection-line.is-direction-none { animation: none; }
.connection-flow-pulse { fill: #e8fbff; stroke: #64e3d0; stroke-width: 1.1; pointer-events: none; filter: drop-shadow(0 0 4px rgba(77,226,208,.95)); }
/* Schoolar-style selected edge controls: direction belongs on the edge, not in a form. */
.connection-popover { display: flex; width: auto; padding: 4px; gap: 0; transform: translate(-50%,-50%); border-color: rgba(255,255,255,.2); border-radius: 8px; background: rgba(8,11,31,.98); box-shadow: 0 14px 32px rgba(0,0,20,.55); }
.connection-direction-controls { display: flex; align-items: center; gap: 2px; }.connection-direction-button, .connection-popover .connection-remove { display: grid; width: 28px; min-width: 28px; min-height: 28px; height: 28px; place-items: center; padding: 0; border: 1px solid transparent; border-radius: 5px; background: transparent; color: #e5e9ff; cursor: pointer; font-family: "DM Mono", monospace; font-size: .72rem; line-height: 1; transition: background 140ms ease, color 140ms ease; }.connection-direction-button:hover { border-color: transparent; background: rgba(255,255,255,.13); color: #fff; }.connection-direction-button.is-active { border-color: transparent; background: rgba(255,255,255,.2); color: #fff; }.connection-toolbar-divider { width: 1px; height: 20px; margin: 0 2px; background: rgba(255,255,255,.18); }.connection-popover .connection-remove { color: #ffb8c8; font-size: .78rem; }.connection-popover .connection-remove:hover { border-color: transparent; background: rgba(255,117,152,.16); color: #ffd4dc; }

.profile-project-layout, .profile-portfolio-layout { grid-template-columns: minmax(0,1.08fr) minmax(320px,.92fr); }.profile-record-editor textarea, .profile-project-row input, .portfolio-record-row input, .portfolio-record-row select { width: 100%; min-height: 36px; padding: 9px; border: 1px solid var(--line); border-radius: 5px; outline: none; background: rgba(5,7,22,.64); color: var(--text); font-family: Manrope, sans-serif; font-size: .69rem; letter-spacing: 0; }.profile-record-editor textarea { resize: vertical; line-height: 1.45; }.profile-record-editor textarea:focus, .profile-project-row input:focus, .portfolio-record-row input:focus, .portfolio-record-row select:focus { border-color: rgba(100,168,255,.9); box-shadow: 0 0 0 3px rgba(100,168,255,.11); }.profile-project-row { grid-template-columns: minmax(130px,1.05fr) minmax(105px,.8fr) minmax(105px,.8fr) minmax(140px,1.1fr) minmax(120px,.9fr) minmax(150px,1.35fr) 26px; }.portfolio-record-row { display: grid; grid-template-columns: minmax(86px,.6fr) minmax(105px,.9fr) minmax(150px,1.25fr) minmax(130px,1fr) 26px; gap: 6px; align-items: center; padding: 9px 0; border-top: 1px solid rgba(170,183,255,.1); }.portfolio-record-row:first-child { padding-top: 0; border-top: 0; }.portfolio-record-row .profile-record-remove { justify-self: center; }.portfolio-intelligence-panel { margin-top: 12px; padding: 18px; border-top-color: rgba(150,109,255,.56); }.panel-heading-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: end; gap: 8px; }.portfolio-intelligence-panel .body-copy { max-width: 900px; margin-top: 12px; }.portfolio-intelligence-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 22px; margin-top: 15px; }.portfolio-intelligence-list, .portfolio-story-list { display: grid; gap: 0; margin-top: 8px; }.portfolio-intelligence-row, .portfolio-story-link { padding: 11px 0; border-top: 1px solid rgba(170,183,255,.1); }.portfolio-intelligence-row strong, .portfolio-story-link strong { color: #e3e7fc; font-size: .68rem; }.portfolio-intelligence-row p, .portfolio-story-link p, .portfolio-integrity-note { margin: 5px 0 0; color: var(--muted); font-size: .59rem; line-height: 1.48; }.portfolio-intelligence-row small { display: block; margin-top: 7px; color: var(--purple); font-family: "DM Mono", monospace; font-size: .46rem; letter-spacing: .03em; }.portfolio-story-link.is-connected strong { color: var(--cyan); }.portfolio-story-link.is-open strong, .portfolio-story-link.is-needs-story strong { color: var(--amber); }.portfolio-integrity-note { padding-top: 10px; border-top: 1px solid rgba(170,183,255,.1); color: var(--subtle); }
@media (max-width: 1120px) { .profile-project-layout, .profile-portfolio-layout { grid-template-columns: 1fr; }.profile-project-row { grid-template-columns: repeat(3,minmax(0,1fr)) 26px; }.portfolio-record-row { grid-template-columns: repeat(2,minmax(0,1fr)) 26px; }.portfolio-intelligence-grid { grid-template-columns: 1fr; gap: 14px; } }
@media (max-width: 780px) { .profile-project-row, .portfolio-record-row { grid-template-columns: 1fr; }.profile-project-row .profile-record-remove, .portfolio-record-row .profile-record-remove { grid-column: auto; justify-self: end; }.panel-heading-actions { justify-content: start; } }

.narrative-workflow { display: grid; gap: 10px; margin: 0 18px; padding: 15px 0 14px; border-top: 1px solid rgba(150,109,255,.32); border-bottom: 1px solid rgba(100,168,255,.2); }.prompt-set[hidden], .narrative-workflow[hidden], .narrative-draft-actions[hidden] { display: none; }.narrative-workflow-heading { display: flex; align-items: start; justify-content: space-between; gap: 12px; }.narrative-workflow-heading .eyebrow { margin-bottom: 4px; color: #c8b8ff; }.narrative-workflow-heading h2 { margin: 0; color: #e3e7fc; font-size: .8rem; }.narrative-workflow .form-note { margin: 0; max-width: 700px; }.narrative-draft-actions { display: grid; gap: 10px; }.narrative-draft-label { display: grid; gap: 7px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .51rem; letter-spacing: .06em; }.narrative-draft-label textarea { width: 100%; min-height: 130px; padding: 11px; border: 1px solid var(--line); border-radius: 5px; outline: none; background: rgba(5,7,22,.64); color: #e3e7fc; font-family: Manrope, sans-serif; font-size: .7rem; letter-spacing: 0; line-height: 1.55; resize: vertical; }.narrative-draft-label textarea:focus { border-color: rgba(100,168,255,.9); box-shadow: 0 0 0 3px rgba(100,168,255,.11); }.narrative-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }.narrative-reset-empty { justify-self: start; padding-left: 0; }
@media (max-width: 780px) { .narrative-workflow { margin: 0 14px; }.narrative-workflow-heading { align-items: flex-start; }.narrative-actions { align-items: stretch; flex-direction: column; }.narrative-actions .primary-action, .narrative-actions .text-action { width: 100%; justify-content: center; } }

.auth-gate { position: fixed; inset: 0; z-index: 40; display: grid; place-items: center; padding: 24px; background: radial-gradient(circle at 72% 0%, rgba(94,83,255,.17), transparent 30rem), radial-gradient(circle at 4% 85%, rgba(47,121,255,.1), transparent 30rem), var(--void); }
.auth-gate[hidden], .counselor-shell[hidden] { display: none; }
#authNameField[hidden], .auth-role-field[hidden], #authBirthdateField[hidden] { display: none; }
.auth-card { width: 100%; max-width: 380px; padding: 28px; box-shadow: var(--shadow); }
.auth-brand { display: flex; align-items: center; gap: 8px; margin-bottom: 20px; color: var(--muted); font-family: "DM Mono", monospace; font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; }
.auth-card h1 { margin: 0; color: var(--text); font-size: 1.28rem; }
.auth-card .body-copy { margin-top: 8px; }
.auth-card .control-form { margin-top: 20px; gap: 14px; }
.auth-card .control-form label span { display: block; margin-bottom: 6px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .51rem; letter-spacing: .06em; text-transform: uppercase; }
.auth-card .control-form input { width: 100%; min-height: 40px; padding: 10px 11px; border: 1px solid var(--line); border-radius: 5px; outline: none; background: rgba(5,7,22,.64); color: var(--text); font-family: Manrope, sans-serif; font-size: .75rem; }
.auth-card .control-form input:focus { border-color: rgba(100,168,255,.9); box-shadow: 0 0 0 3px rgba(100,168,255,.11); }
.auth-role-field { display: grid; gap: 8px; }
.auth-role-field > span { color: var(--subtle); font-family: "DM Mono", monospace; font-size: .51rem; letter-spacing: .06em; text-transform: uppercase; }
.auth-role-field .auth-role-option { display: flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 11px; border: 1px solid var(--line); border-radius: 5px; background: rgba(9,12,34,.28); color: var(--muted); font-size: .72rem; cursor: pointer; }
.auth-role-field .auth-role-option:has(input:checked) { border-color: rgba(100,168,255,.62); color: var(--text); }
.auth-role-field .auth-role-option input { width: 14px; height: 14px; margin: 0; accent-color: var(--cyan); }
.auth-card .control-form .auth-remember-option { display: flex; align-items: center; gap: 8px; margin-top: -2px; color: var(--muted); font-size: .68rem; cursor: pointer; }
.auth-card .control-form .auth-remember-option span { display: inline; margin-bottom: 0; color: var(--muted); font-family: Manrope, sans-serif; font-size: .68rem; font-weight: 400; letter-spacing: normal; text-transform: none; }
.auth-card .auth-remember-option input { width: 14px; height: 14px; min-height: 0; padding: 0; margin: 0; accent-color: var(--cyan); }
.auth-error { margin: 0; padding: 9px 11px; border: 1px solid rgba(255,117,152,.35); border-radius: 5px; background: rgba(255,87,137,.09); color: #ffc2d1; font-size: .64rem; line-height: 1.5; }
.auth-card .primary-action { width: 100%; justify-content: center; margin-top: 4px; }
.auth-card #authModeToggle { display: block; width: 100%; margin-top: 14px; text-align: center; }
.auth-links { margin: 14px 0 0; text-align: center; color: var(--subtle); font-size: .62rem; }.auth-links a { color: var(--muted); text-decoration: none; }.auth-links a:hover { color: var(--cyan); }

.counselor-shell { display: block; min-height: 100vh; }
.counselor-shell .command-bar { grid-template-columns: auto 1fr auto; }

.opportunity-pulse-panel { display: grid; gap: 14px; }
.event-status-panel:has(.opportunity-source-health) { display: grid; grid-template-columns: minmax(240px,.62fr) minmax(0,1.38fr); align-items: start; gap: 24px; padding: 19px 20px; }
.opportunity-source-health { min-width: 0; }
.opportunity-source-health summary { padding: 2px 0; color: var(--muted); cursor: pointer; font-family: "DM Mono", monospace; font-size: .56rem; line-height: 1.5; list-style-position: outside; text-align: left; }
.opportunity-source-health[open] { padding-left: 18px; border-left: 1px solid var(--line); }
.opportunity-source-health[open] summary { margin-bottom: 12px; color: #dce4fb; }
.opportunity-source-health .event-source-badges { display: grid; grid-template-columns: repeat(auto-fit,minmax(210px,1fr)); max-height: 180px; overflow-y: auto; gap: 8px; padding-right: 4px; }
.opportunity-source-health .event-source-badges span { min-width: 0; line-height: 1.45; overflow-wrap: anywhere; }
.event-source-badges span.is-empty { border-color: rgba(100,168,255,.38); color: var(--blue); }
.event-source-badges span.is-aging { border-color: rgba(239,184,102,.42); color: var(--amber); }
.opportunity-source-incidents { display: grid; gap: 7px; max-height: 220px; margin-top: 12px; overflow-y: auto; padding-right: 4px; }
.opportunity-source-incidents:empty { display: none; }
.opportunity-source-incidents article { display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: 12px; align-items: center; padding: 9px 10px; border: 1px solid rgba(255,117,152,.25); border-radius: 7px; color: var(--rose); font-size: .56rem; line-height: 1.4; }
.opportunity-source-incidents article.is-recovered { border-color: rgba(77,226,208,.28); color: var(--cyan); }
.opportunity-source-incidents small { color: var(--subtle); font-family: "DM Mono", monospace; font-size: .5rem; }
.opportunity-pulse-panel .panel-heading > strong { color: var(--text-muted, #9ca8c8); font-size: .78rem; font-weight: 600; text-align: right; }
.opportunity-coverage-badges { display: flex; flex-wrap: wrap; gap: 7px; }
.opportunity-coverage-badges span { border: 1px solid rgba(148, 163, 184, .22); border-radius: 999px; color: #aeb9d6; font-size: .67rem; padding: 5px 9px; text-transform: uppercase; }
.opportunity-coverage-badges .is-live { border-color: rgba(87, 214, 154, .45); color: #77dfaa; }
.opportunity-coverage-badges .is-ready { border-color: rgba(100, 168, 255, .45); color: #88baff; }
.opportunity-coverage-badges .is-needs-credentials,
.opportunity-coverage-badges .is-needs-approval,
.opportunity-coverage-badges .is-not-connected { color: #d9b170; }
.opportunity-coverage-audit { border: 1px solid rgba(100,168,255,.18); border-radius: 12px; background: rgba(6,12,28,.34); padding: 11px 13px; }
.opportunity-coverage-audit > summary { color: var(--text-muted, #9ca8c8); cursor: pointer; font-family: "DM Mono", monospace; font-size: .62rem; line-height: 1.5; }
.opportunity-coverage-audit[open] > summary { margin-bottom: 9px; }
.opportunity-coverage-audit-grid { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.35fr); gap: 12px; margin-top: 11px; }
.opportunity-coverage-audit h3 { color: var(--text); font-size: .72rem; margin: 0 0 7px; }
.opportunity-coverage-audit h3.opportunity-region-heading { margin-top: 12px; }
/* Offline benchmark cards stay visually distinct from live provider reach so
   a strong fixture result cannot be mistaken for broad internet coverage. */
.opportunity-quality-benchmark { border-block: 1px solid rgba(148,163,184,.14); margin-top: 11px; padding: 11px 0; }
.opportunity-benchmark-heading { align-items: start; display: flex; gap: 12px; justify-content: space-between; }
.opportunity-benchmark-heading h3 { margin-bottom: 3px; }
.opportunity-benchmark-heading .form-note { margin: 0; }
.opportunity-benchmark-heading > strong { color: var(--muted); font-family: "DM Mono", monospace; font-size: .55rem; font-weight: 500; line-height: 1.5; max-width: 48%; text-align: right; }
.opportunity-benchmark-metrics { display: grid; gap: 6px; grid-template-columns: repeat(4,minmax(0,1fr)); margin-top: 9px; }
.opportunity-benchmark-metrics article { border: 1px solid rgba(148,163,184,.16); border-radius: 8px; display: grid; gap: 2px; padding: 8px; }
.opportunity-benchmark-metrics article.is-thin { border-color: rgba(239,184,102,.35); }
.opportunity-benchmark-metrics article.is-gap { border-color: rgba(255,117,152,.32); }
.opportunity-benchmark-metrics strong { color: var(--cyan); font-size: .76rem; }
.opportunity-benchmark-metrics .is-thin strong { color: var(--amber); }
.opportunity-benchmark-metrics .is-gap strong { color: var(--rose); }
.opportunity-benchmark-metrics span { color: var(--text); font-size: .58rem; font-weight: 650; }
.opportunity-benchmark-metrics small { color: var(--subtle); font-size: .51rem; line-height: 1.4; }
.opportunity-benchmark-profile-details { margin-top: 8px; }
.opportunity-benchmark-profile-details > summary { color: var(--muted); cursor: pointer; font-size: .57rem; }
.opportunity-benchmark-profiles { display: grid; gap: 5px; margin-top: 7px; }
.opportunity-benchmark-profiles article { align-items: center; border-left: 2px solid var(--cyan); display: grid; gap: 8px; grid-template-columns: minmax(0,1fr) auto; padding: 5px 8px; }
.opportunity-benchmark-profiles article.is-thin { border-color: var(--amber); }
.opportunity-benchmark-profiles article.is-gap { border-color: var(--rose); }
.opportunity-benchmark-profiles article > div { display: grid; gap: 1px; min-width: 0; }
.opportunity-benchmark-profiles strong { color: var(--text); font-size: .59rem; }
.opportunity-benchmark-profiles small,
.opportunity-benchmark-profiles span { color: var(--muted); font-size: .53rem; }
.opportunity-audit-list,
.opportunity-provider-list,
.opportunity-gap-list { display: grid; gap: 6px; }
.opportunity-provider-list { max-height: 270px; overflow-y: auto; padding-right: 3px; }
.opportunity-audit-list article,
.opportunity-provider-list article { align-items: center; border: 1px solid rgba(148,163,184,.14); border-radius: 8px; display: grid; gap: 8px; grid-template-columns: minmax(0,1fr) auto auto; padding: 8px 9px; }
.opportunity-region-list article { grid-template-columns: minmax(0,1fr) auto; }
.opportunity-region-list article > b { grid-column: 1 / -1; justify-self: start; }
.opportunity-region-list small { white-space: normal; }
.opportunity-provider-list article { grid-template-columns: minmax(0,1fr) auto; }
.opportunity-audit-list article > div,
.opportunity-provider-list article > div { display: grid; gap: 2px; min-width: 0; }
.opportunity-audit-list strong,
.opportunity-provider-list strong { font-size: .68rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.opportunity-audit-list small,
.opportunity-provider-list small { color: var(--subtle); font-size: .55rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.opportunity-audit-list article > span,
.opportunity-provider-list article > span { color: var(--muted); font-family: "DM Mono", monospace; font-size: .54rem; text-align: right; }
.opportunity-audit-list article > b { border-radius: 999px; color: #77dfaa; font-size: .52rem; font-weight: 600; padding: 3px 6px; text-transform: uppercase; }
.opportunity-audit-list article.is-thin > b,
.opportunity-audit-list article.is-unobserved > b,
.opportunity-audit-list article.is-gap > b,
.opportunity-audit-list article.is-reachable-leads-only > b,
.opportunity-audit-list article.is-declared-not-checked > b { color: var(--amber); }
.opportunity-audit-list article.is-declared-unreachable { border-color: rgba(255,117,152,.3); }
.opportunity-audit-list article.is-declared-unreachable > b { color: #ff7598; }
.opportunity-provider-list article.is-unavailable,
.opportunity-provider-list article.is-stale,
.opportunity-provider-list article.is-partial { border-color: rgba(255,117,152,.25); }
.opportunity-gap-section { margin-top: 12px; }
.opportunity-gap-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
.opportunity-gap-list article { border-left: 2px solid var(--amber); display: grid; gap: 2px; padding: 5px 8px; }
.opportunity-gap-list strong { color: #e7c47f; font-size: .61rem; }
.opportunity-gap-list span { color: var(--muted); font-size: .6rem; line-height: 1.45; }
.opportunity-alert-list { display: grid; gap: 8px; }
.opportunity-alert { align-items: center; border: 1px solid rgba(148, 163, 184, .18); border-radius: 12px; display: grid; gap: 10px; grid-template-columns: 28px minmax(0, 1fr) auto; padding: 10px 12px; }
.opportunity-alert > i { align-items: center; background: rgba(100, 168, 255, .12); border-radius: 50%; color: #88baff; display: flex; font-style: normal; height: 28px; justify-content: center; }
.opportunity-alert.is-urgent > i { background: rgba(255, 108, 108, .13); color: #ff8e8e; }
.opportunity-alert div { display: grid; gap: 2px; min-width: 0; }
.opportunity-alert div strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.opportunity-alert div span { color: var(--text-muted, #9ca8c8); font-size: .75rem; }
.brief-opportunity-row { grid-template-columns: 28px minmax(0, 1fr) auto auto auto; }
/* Opportunity journey uses compact ordinal stages so students and counselors
   can compare the same path without turning aggregate analytics into a score. */
.journey-panel, .journey-brief-panel { margin-top: 12px; border-top-color: rgba(124,108,255,.52); }
.journey-progress { height: 7px; margin: 14px 0 7px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.06); }
.journey-progress > span { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--accent),var(--cyan)); transition: width .2s ease; }
.journey-progress-text { margin: 0 0 12px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .55rem; }
.journey-stage-list { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 7px; }
.journey-stage { display: grid; grid-template-columns: 25px minmax(0,1fr); gap: 8px; align-items: center; min-height: 48px; padding: 8px; border: 1px solid var(--line); border-radius: 6px; background: rgba(255,255,255,.018); }
.journey-stage i { display: grid; width: 24px; height: 24px; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .48rem; font-style: normal; }
.journey-stage span { color: var(--muted); font-size: .58rem; line-height: 1.35; }
.journey-stage.is-complete { border-color: rgba(77,226,208,.24); background: rgba(77,226,208,.045); }
.journey-stage.is-complete i { border-color: rgba(77,226,208,.48); color: var(--cyan); }
.journey-stage.is-current { border-color: rgba(124,108,255,.45); background: rgba(124,108,255,.07); }
.journey-stage.is-current i, .journey-stage.is-current span { color: #d7d1ff; }
.journey-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 13px; }
.journey-privacy { margin-top: 12px; }
.journey-decision-summary { margin: 12px 0 0; color: var(--muted); font-family: "DM Mono", monospace; font-size: .56rem; }
.journey-panel .status-badge.is-completed, .journey-brief-panel .status-badge.is-completed { color: var(--cyan); }
.journey-panel .status-badge.is-paused, .journey-brief-panel .status-badge.is-paused,
.journey-panel .status-badge.is-stalled, .journey-brief-panel .status-badge.is-stalled { color: var(--amber); }
@media (max-width: 900px) { .journey-stage-list { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 520px) { .journey-stage-list { grid-template-columns: 1fr; }.journey-actions .text-action { flex: 1 1 auto; justify-content: center; } }
@media (prefers-reduced-motion: reduce) { .journey-progress > span { transition: none; } }
.opportunity-notice-banner { border-color: rgba(100, 168, 255, .45); }
.opportunity-notice-banner > span::before { color: #88baff; content: "●"; font-size: .68rem; margin-right: 9px; }
.counselor-frame { max-width: 1380px; margin: 0 auto; padding: 26px 28px 60px; }
.counselor-intro { padding: 20px; margin-bottom: 14px; border-top-color: rgba(100,168,255,.52); }
.counselor-intro h1 { margin: 6px 0 0; font-size: 1.1rem; }

.org-console { padding: 20px; margin-bottom: 14px; border-top-color: rgba(77,226,208,.5); }.org-seat-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; margin: 14px 0; }.org-seat-cell { display: grid; gap: 2px; padding: 12px; border: 1px solid var(--line); border-radius: 6px; background: rgba(13,18,52,.32); }.org-seat-cell.is-full { border-color: rgba(240,142,168,.4); }.org-seat-label { color: var(--muted); font-size: .56rem; text-transform: uppercase; letter-spacing: .06em; }.org-seat-count { color: #e4e7fa; font-size: 1.05rem; font-family: "DM Mono", monospace; }.org-seat-note { color: var(--subtle); font-size: .56rem; }.org-seat-cell.is-full .org-seat-note { color: var(--rose); }
.org-add-form { display: grid; grid-template-columns: minmax(0,1fr) 150px auto; gap: 10px; align-items: end; margin-top: 12px; }.org-add-form label { display: grid; gap: 5px; }.org-add-form span { color: var(--muted); font-size: .58rem; }.org-add-form input, .org-add-form select { min-height: 36px; padding: 0 9px; border: 1px solid var(--line); border-radius: 5px; background: rgba(5,7,22,.64); color: var(--text); font-family: Manrope, sans-serif; font-size: .68rem; }.org-add-form input:focus, .org-add-form select:focus { border-color: rgba(100,168,255,.9); outline: none; box-shadow: 0 0 0 3px rgba(100,168,255,.1); }.org-add-form button { min-height: 36px; }
.org-billing-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; padding: 13px 14px; border: 1px solid rgba(100,168,255,.22); border-radius: 6px; background: rgba(13,18,52,.32); }.org-billing-row .eyebrow { margin-bottom: 4px; }.org-billing-status { color: #dde2f6; font-size: .66rem; }.org-billing-status.is-error { color: var(--rose); }.org-billing-row button { min-height: 34px; }
.org-member-list { display: grid; gap: 6px; margin-top: 14px; }.org-member-row { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid rgba(170,183,255,.12); border-left: 2px solid rgba(170,183,255,.2); border-radius: 5px; background: rgba(13,18,52,.28); }.org-member-row.is-admin { border-left-color: var(--cyan); }.org-member-row.is-counselor { border-left-color: var(--blue); }.org-member-copy { display: grid; gap: 2px; }.org-member-copy strong { color: #e1e5fb; font-size: .68rem; word-break: break-word; }.org-member-copy span { color: var(--subtle); font-size: .56rem; }.org-member-remove { min-height: 30px; padding: 0 12px; border: 1px solid rgba(240,142,168,.3); border-radius: 4px; background: rgba(240,142,168,.07); color: var(--rose); cursor: pointer; font-size: .58rem; font-weight: 700; }.org-member-remove:hover { border-color: var(--rose); }.org-member-tag { color: var(--muted); font-family: "DM Mono", monospace; font-size: .52rem; text-transform: uppercase; letter-spacing: .06em; }.form-note.is-error { color: var(--rose); }
.counselor-layout { display: grid; grid-template-columns: minmax(230px,.32fr) minmax(0,.68fr); gap: 12px; align-items: start; }
.counselor-list-panel { padding: 16px; }
.counselor-student-list { display: grid; gap: 0; margin-top: 12px; }
.counselor-student-row { display: grid; grid-template-columns: 24px minmax(0,1fr); gap: 2px 8px; width: 100%; padding: 11px 9px; border: 0; border-top: 1px solid rgba(170,183,255,.1); border-left: 2px solid transparent; border-radius: 4px; background: transparent; color: inherit; cursor: pointer; text-align: left; }
.counselor-student-row:first-child { border-top: 0; }
.counselor-student-row:hover { background: rgba(34,42,91,.26); }
.counselor-student-row.is-active { background: rgba(77,226,208,.08); border-left-color: var(--cyan); }
.counselor-student-row > i { grid-row: 1 / 3; align-self: start; margin-top: 1px; font-family: "DM Mono", monospace; font-size: .48rem; font-style: normal; font-weight: 600; letter-spacing: .03em; }
.counselor-student-row.is-attention > i { color: var(--rose); }
.counselor-student-row.is-watch > i { color: var(--amber); }
.counselor-student-row.is-on-track > i { color: var(--cyan); }
.counselor-student-row strong { color: #e3e7fc; font-size: .68rem; }
.counselor-student-row small { display: block; overflow: hidden; color: var(--subtle); font-size: .53rem; text-overflow: ellipsis; white-space: nowrap; }
.counselor-brief-panel { min-width: 0; padding: 18px; }
.counselor-brief-panel .empty-activity { padding: 40px 0; text-align: center; }
@media (max-width: 1120px) { .counselor-layout { grid-template-columns: 1fr; } }
@media (max-width: 780px) { .counselor-frame { padding: 20px 14px 40px; } }

.student-setup-panel { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(330px, 1.25fr) auto; gap: 22px; align-items: center; margin-bottom: 12px; padding: 20px; border-color: rgba(100,168,255,.42); background: rgba(16,23,58,.86); }.student-setup-copy h2 { margin: 0; color: #e6eaff; font-size: 1rem; }.student-setup-copy .body-copy { margin-bottom: 0; }.student-setup-steps { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }.student-setup-steps li { display: grid; grid-template-columns: 36px minmax(0,1fr); gap: 9px; align-items: center; padding: 7px 0; border-top: 1px solid rgba(170,184,255,.1); }.student-setup-steps li:first-child { border-top: 0; }.student-setup-steps i { display: grid; min-height: 21px; place-items: center; border: 1px solid rgba(239,184,102,.38); border-radius: 3px; color: var(--amber); font-family: "DM Mono", monospace; font-size: .45rem; font-style: normal; letter-spacing: .04em; text-transform: uppercase; }.student-setup-steps li.is-complete i { border-color: rgba(77,226,208,.38); color: var(--cyan); }.student-setup-steps strong, .student-setup-steps span { display: block; }.student-setup-steps strong { color: #e4e8ff; font-size: .66rem; }.student-setup-steps span { margin-top: 3px; color: var(--subtle); font-size: .57rem; line-height: 1.42; }.workspace-backup-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 13px; }.workspace-backup-actions .file-button { min-height: 29px; font-size: .58rem !important; }.onboarding-dialog, .tutorial-dialog { width: min(720px, calc(100% - 28px)); max-height: min(730px, calc(100vh - 28px)); padding: 0; overflow: auto; border: 1px solid rgba(118,144,255,.6); border-radius: 8px; color: var(--text); background: #111432; box-shadow: 0 28px 96px rgba(0,0,20,.7); }.onboarding-dialog::backdrop, .tutorial-dialog::backdrop { background: rgba(2,3,14,.73); backdrop-filter: blur(5px); }.onboarding-form { display: grid; gap: 20px; padding: 25px; }.onboarding-heading, .tutorial-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }.onboarding-heading h2, .tutorial-heading h2 { margin: 0; color: #eff1ff; font-size: 1.18rem; }.onboarding-heading p:not(.eyebrow) { max-width: 530px; margin: 8px 0 0; color: var(--muted); font-size: .68rem; line-height: 1.55; }.onboarding-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 13px; }.onboarding-grid label { display: grid; gap: 7px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .57rem; letter-spacing: .04em; }.onboarding-grid input, .onboarding-grid select { width: 100%; min-height: 38px; padding: 9px; border: 1px solid var(--line); border-radius: 5px; outline: none; background: rgba(5,7,22,.65); color: var(--text); font-family: Manrope, sans-serif; font-size: .7rem; letter-spacing: 0; }.onboarding-grid input:focus, .onboarding-grid select:focus { border-color: rgba(100,168,255,.9); box-shadow: 0 0 0 3px rgba(100,168,255,.11); }.onboarding-grid .onboarding-wide { grid-column: 1 / -1; }.onboarding-actions { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding-top: 16px; border-top: 1px solid var(--line); }.onboarding-actions > span { color: var(--subtle); font-size: .58rem; line-height: 1.45; }.tutorial-shell { display: grid; gap: 18px; padding: 24px; }.tutorial-progress { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 14px; align-items: start; }.tutorial-progress > span { padding: 6px 7px; border: 1px solid rgba(100,168,255,.36); border-radius: 3px; color: var(--blue); font-family: "DM Mono", monospace; font-size: .53rem; white-space: nowrap; }.tutorial-step-list { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 5px; margin: 0; padding: 0; list-style: none; }.tutorial-step-list li { display: grid; gap: 4px; min-width: 0; padding-top: 5px; border-top: 2px solid rgba(154,169,255,.18); color: var(--subtle); }.tutorial-step-list li.is-active { border-color: var(--blue); color: #dfe9ff; }.tutorial-step-list li.is-complete { border-color: var(--cyan); }.tutorial-step-list i { color: var(--blue); font-family: "DM Mono", monospace; font-size: .48rem; font-style: normal; }.tutorial-step-list li.is-complete i { color: var(--cyan); }.tutorial-step-list span { overflow: hidden; font-size: .55rem; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }.tutorial-description { margin: 0; color: #dfe4fa; font-size: .8rem; line-height: 1.65; }.tutorial-state { margin: 0; padding: 10px; border-left: 2px solid rgba(239,184,102,.7); background: rgba(239,184,102,.06); color: #e8d5ae; font-size: .64rem; line-height: 1.45; }.tutorial-state.is-complete { border-left-color: var(--cyan); background: rgba(77,226,208,.06); color: #bdeee6; }.tutorial-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; padding-top: 16px; border-top: 1px solid var(--line); }.tutorial-actions .text-action:first-child { margin-right: auto; }.tutorial-actions .primary-action { min-width: 108px; }
.guide-dialog { max-height: min(680px, calc(100vh - 28px)); }
.guide-shell { display: grid; gap: 18px; padding: 24px; }
.guide-body { display: grid; gap: 20px; max-height: 62vh; overflow-y: auto; padding-right: 4px; }
.guide-section h3 { margin: 0 0 10px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .58rem; font-weight: 500; letter-spacing: .09em; text-transform: uppercase; }
.guide-list { display: grid; gap: 12px; margin: 0; }
.guide-list > div { padding-top: 10px; border-top: 1px solid rgba(170,183,255,.1); }
.guide-list > div:first-child { padding-top: 0; border-top: 0; }
.guide-list dt { margin: 0; color: #e5e9ff; font-size: .68rem; font-weight: 600; }
.guide-list dd { margin: 4px 0 0; color: var(--muted); font-size: .65rem; line-height: 1.55; }
@media (max-width: 980px) { .student-setup-panel { grid-template-columns: 1fr; gap: 14px; }.student-setup-panel .primary-action { width: 100%; }.student-setup-steps { grid-template-columns: repeat(3,minmax(0,1fr)); }.student-setup-steps li { grid-template-columns: 1fr; align-items: start; }.student-setup-steps li:not(:first-child) { border-top: 0; border-left: 1px solid rgba(170,184,255,.1); padding-left: 10px; } }
@media (max-width: 620px) { .onboarding-form { padding: 18px; }.onboarding-grid { grid-template-columns: 1fr; }.onboarding-grid .onboarding-wide { grid-column: auto; }.onboarding-actions { align-items: stretch; flex-direction: column; }.onboarding-actions .primary-action { width: 100%; }.student-setup-steps { grid-template-columns: 1fr; }.student-setup-steps li:not(:first-child) { border-top: 1px solid rgba(170,184,255,.1); border-left: 0; padding-left: 0; }.student-setup-steps li { grid-template-columns: 38px minmax(0,1fr); align-items: center; } }

.student-pulse-panel { margin-bottom: 12px; padding: 19px 20px 8px; border-top-color: rgba(77,226,208,.62); background: rgba(10,20,46,.82); }.student-pulse-panel .body-copy { max-width: 760px; margin: 9px 0 3px; }.student-pulse-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 20px; margin-top: 11px; }.student-pulse-item { display: grid; grid-template-columns: 30px minmax(0,1fr) auto; gap: 10px; align-items: center; min-height: 78px; padding: 11px 0; border-top: 1px solid rgba(170,184,255,.12); }.student-pulse-item > i { display: grid; width: 24px; height: 24px; place-items: center; border: 1px solid rgba(100,168,255,.32); border-radius: 50%; color: var(--blue); font-family: "DM Mono", monospace; font-size: .45rem; font-style: normal; }.student-pulse-item.is-now > i { border-color: rgba(77,226,208,.52); color: var(--cyan); }.student-pulse-item.is-later > i { border-color: rgba(239,184,102,.38); color: var(--amber); }.student-pulse-copy { min-width: 0; }.student-pulse-copy strong { display: block; color: #e5e9ff; font-size: .67rem; }.student-pulse-copy p { margin: 4px 0 0; color: var(--subtle); font-size: .56rem; line-height: 1.43; }.student-pulse-item .text-action { flex: 0 0 auto; white-space: nowrap; }
@media (max-width: 760px) { .student-pulse-panel { padding: 16px 15px 6px; }.student-pulse-list { grid-template-columns: 1fr; }.student-pulse-item { min-height: 70px; } }

.student-capture-panel { margin-bottom: 12px; padding: 19px 20px; border-top-color: rgba(150,109,255,.58); background: rgba(15,17,47,.82); }.student-capture-form { display: grid; gap: 13px; margin-top: 14px; }.student-capture-modes { display: inline-grid; grid-template-columns: repeat(4,minmax(0,1fr)); width: min(520px,100%); border: 1px solid rgba(168,181,255,.18); border-radius: 5px; overflow: hidden; }.student-capture-modes button { min-height: 32px; border: 0; border-left: 1px solid rgba(168,181,255,.14); background: rgba(5,7,22,.35); color: var(--subtle); cursor: pointer; font-family: "DM Mono", monospace; font-size: .54rem; letter-spacing: .04em; text-transform: uppercase; }.student-capture-modes button:first-child { border-left: 0; }.student-capture-modes button:hover { color: #e5e9ff; background: rgba(100,168,255,.09); }.student-capture-modes button.is-active { color: var(--cyan); background: rgba(77,226,208,.1); box-shadow: inset 0 -2px 0 var(--cyan); }.student-capture-fields { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 9px; }.student-capture-fields[hidden] { display: none; }.student-capture-fields label { display: grid; gap: 6px; min-width: 0; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .5rem; letter-spacing: .05em; text-transform: uppercase; }.student-capture-fields input, .student-capture-fields select { width: 100%; min-height: 36px; padding: 8px 9px; border: 1px solid var(--line); border-radius: 4px; outline: none; background: rgba(5,7,22,.62); color: var(--text); font-family: Manrope, sans-serif; font-size: .66rem; letter-spacing: 0; text-transform: none; }.student-capture-fields input:focus, .student-capture-fields select:focus { border-color: rgba(100,168,255,.9); box-shadow: 0 0 0 3px rgba(100,168,255,.11); }.student-capture-wide { grid-column: span 2; }.student-capture-panel .form-actions { margin-top: 0; padding-top: 13px; }.student-capture-panel .form-note { max-width: 650px; }
@media (max-width: 820px) { .student-capture-fields { grid-template-columns: repeat(2,minmax(0,1fr)); }.student-capture-wide { grid-column: span 2; } }
@media (max-width: 520px) { .student-capture-panel { padding: 16px 15px; }.student-capture-modes { width: 100%; }.student-capture-modes button { font-size: .48rem; }.student-capture-fields { grid-template-columns: 1fr; }.student-capture-wide { grid-column: auto; }.student-capture-panel .form-actions { align-items: stretch; flex-direction: column; }.student-capture-panel .primary-action { width: 100%; justify-content: center; } }

.home-view { display: block; }
.home-greeting { display: grid; justify-items: center; gap: 10px; max-width: 720px; margin: 0 auto 20px; text-align: center; }
.home-greeting-icon { display: block; width: 34px; height: 34px; background: linear-gradient(115deg, var(--cyan) 0%, #72b7ff 34%, var(--violet) 67%, var(--cyan) 100%); background-size: 220% 220%; -webkit-mask: url("assets/iter-mark.png") center / contain no-repeat; mask: url("assets/iter-mark.png") center / contain no-repeat; filter: drop-shadow(0 0 7px rgba(77,226,208,.4)); animation: logo-spectrum 7s ease-in-out infinite alternate; }
.home-greeting h1 { margin: 0; color: var(--text); font-size: 1.5rem; font-weight: 700; line-height: 1.25; }
@media (max-width: 780px) { .home-greeting h1 { font-size: 1.25rem; } }

.danger-zone-card { grid-column: 1 / -1; border-color: rgba(255,116,152,.28); }
.danger-zone-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 14px; }
.danger-zone-actions .compact-danger { width: 100%; margin: 0; }
.account-panel-actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 13px; }
.account-panel-actions .compact-danger { margin-top: 0; }
.danger-dialog { width: min(440px, calc(100% - 28px)); padding: 0; overflow: auto; border: 1px solid rgba(255,116,152,.4); border-radius: 8px; color: var(--text); background: #111432; box-shadow: 0 28px 96px rgba(0,0,20,.7); }
.danger-dialog.mod { border-color: rgba(239,184,102,.45); }
.danger-dialog.mod .danger-dialog-form input:focus { border-color: rgba(239,184,102,.8); box-shadow: 0 0 0 3px rgba(239,184,102,.16); }
.danger-dialog::backdrop { background: rgba(2,3,14,.73); backdrop-filter: blur(5px); }
.danger-dialog-form { display: grid; gap: 16px; padding: 24px; }
.danger-dialog-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.danger-dialog-heading h2 { margin: 0; color: #eff1ff; font-size: 1.05rem; }
.danger-dialog-form label { display: grid; gap: 7px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .57rem; letter-spacing: .04em; }
.danger-dialog-form input { width: 100%; min-height: 38px; padding: 9px; border: 1px solid var(--line); border-radius: 5px; outline: none; background: rgba(5,7,22,.65); color: var(--text); font-family: Manrope, sans-serif; font-size: .7rem; letter-spacing: 0; }
.danger-dialog-form input:focus { border-color: rgba(255,116,152,.7); box-shadow: 0 0 0 3px rgba(255,116,152,.14); }
.danger-dialog-form .consent-control input { width: 14px !important; min-height: 14px !important; margin: 0; padding: 0 !important; accent-color: var(--cyan); }
.danger-dialog-actions .danger-action { margin-top: 0; }
.profile-import-dialog { width: min(620px, calc(100% - 28px)); max-height: 86vh; border-color: rgba(100,168,255,.4); }
.profile-import-form { max-height: 86vh; overflow-y: auto; }
.profile-import-list { display: grid; gap: 14px; max-height: 46vh; overflow-y: auto; padding-right: 4px; }
.profile-import-group { display: grid; gap: 8px; }
.profile-import-group-label { margin: 0; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .55rem; letter-spacing: .07em; text-transform: uppercase; }
.profile-import-row { display: flex; align-items: flex-start; gap: 10px; padding: 10px 11px; border: 1px solid var(--line); border-radius: 6px; background: rgba(9,12,34,.32); cursor: pointer; transition: border-color 140ms ease, background 140ms ease; }
.profile-import-row:hover { border-color: rgba(100,168,255,.4); background: rgba(100,168,255,.05); }
.profile-import-row input[type="checkbox"] { flex: 0 0 auto; width: 14px; height: 14px; min-height: 0; margin-top: 2px; padding: 0; accent-color: var(--cyan); }
.profile-import-row-copy { min-width: 0; }
.profile-import-row-copy strong { display: block; color: #e5e9ff; font-size: .7rem; }
.profile-import-row-copy span { display: block; margin-top: 3px; color: var(--muted); font-size: .61rem; line-height: 1.45; }
.profile-import-row-copy small { display: block; margin-top: 4px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .52rem; line-height: 1.4; }

.grant-actions { display: flex; gap: 6px; }

/* -- Modern interaction layer: tactile press feedback and dialog motion,
   layered on top of the existing components above rather than restyling
   them, so nothing about the app's structure or visible density changes. -- */
.primary-action, .text-action, .icon-button, .command-card, .nav-item, .route-add-button, .send-button, .advanced-toggle, .workspace-switcher button, .chat-utility-tab { transition: border-color 160ms var(--ease), background 160ms var(--ease), color 160ms var(--ease), transform 120ms var(--ease), box-shadow 160ms var(--ease); }
.primary-action:active, .text-action:active, .icon-button:active, .command-card:active, .route-add-button:active, .send-button:active, .advanced-toggle:active { transform: scale(.96); }
.nav-item:active, .chat-utility-tab:active, .workspace-switcher button:active { transform: scale(.98); }
.primary-action:disabled:active, .send-button:disabled:active { transform: none; }

dialog { transition: opacity .22s var(--ease), transform .22s var(--ease), overlay .22s var(--ease) allow-discrete, display .22s var(--ease) allow-discrete; opacity: 1; transform: translateY(0) scale(1); }
dialog::backdrop { transition: opacity .22s var(--ease), overlay .22s var(--ease) allow-discrete, display .22s var(--ease) allow-discrete; opacity: 1; }
@starting-style {
  dialog[open] { opacity: 0; transform: translateY(10px) scale(.98); }
  dialog[open]::backdrop { opacity: 0; }
}
dialog:not([open]) { opacity: 0; transform: translateY(10px) scale(.98); }

.toast { transition: opacity .28s var(--ease), transform .28s var(--ease); }
.node-inspector { transition: opacity .22s var(--ease), transform .22s var(--ease); }

/* -- Chat composer: one rounded pill (textarea on top, an icon toolbar
   below) instead of a stack of separate bordered rows -- closer to a
   consumer chat interface, and wider/quieter message text to match.
   Layered on top of the base rules above rather than replacing them,
   since #agentModeControl is a single DOM node the app relocates between
   this composer and the page header depending on which Iter function is
   active (see navigate()/setAgentMode in app.js), so its own structure
   can't change, only how it's laid out here. -- */
.chat-composer { grid-template-columns: minmax(0,1fr) 52px; align-items: end; gap: 10px; padding: 14px 16px 16px; }
.chat-composer-input { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding: 8px 14px 8px; border: 1px solid var(--line); border-radius: 22px; background: rgba(5,7,22,.64); transition: border-color 160ms var(--ease), box-shadow 160ms var(--ease); }
.chat-composer-input:focus-within { border-color: rgba(100,168,255,.75); box-shadow: 0 0 0 3px rgba(100,168,255,.11); }
.chat-composer-input textarea#chatInput { min-height: 24px; max-height: 200px; padding: 6px 2px 4px; border: 0 !important; background: transparent !important; overflow-y: auto; }
.chat-composer-input textarea#chatInput:focus { border: 0 !important; box-shadow: none !important; }
.agent-mode-chat-slot { display: flex; align-items: center; gap: 6px; min-height: 0; }
.chat-icon-button { display: grid; flex: 0 0 auto; width: 27px; height: 27px; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; background: rgba(255,255,255,.03); color: var(--muted); cursor: pointer; font-family: "DM Mono", monospace; font-size: .92rem; line-height: 1; transition: border-color 160ms var(--ease), color 160ms var(--ease), background 160ms var(--ease), transform 120ms var(--ease); }
.chat-icon-button:hover { border-color: var(--blue); color: var(--text); }
.chat-icon-button:active { transform: scale(.92); }
.chat-icon-button.is-active { border-color: rgba(77,226,208,.55); background: rgba(77,226,208,.14); color: var(--cyan); transform: rotate(45deg); }
.chat-attachment-chip { max-width: 130px; overflow: hidden; color: var(--cyan); font-family: "DM Mono", monospace; font-size: .52rem; text-overflow: ellipsis; white-space: nowrap; }
.agent-mode-chat-slot .agent-mode-control { display: contents; }
.agent-mode-chat-slot .agent-mode-control span { display: none; }
.agent-mode-chat-slot .agent-mode-control select { min-height: 26px; min-width: 0; width: auto; padding: 0 22px 0 9px; border: 1px solid var(--line-strong); border-radius: 20px; background: rgba(20,24,61,.92); font-size: .56rem; }
.agent-mode-chat-slot .chat-limit-status { margin-left: auto; padding-bottom: 0; }
/* Square box == true circle. The grid column and the button share one size
   token so the send button can never render as an ellipse. */
.chat-composer { --send-size: 48px; grid-template-columns: minmax(0,1fr) var(--send-size); }
.send-button { width: var(--send-size); height: var(--send-size); flex: 0 0 var(--send-size); padding: 0; border-radius: 50%; aspect-ratio: 1 / 1; }
@media (max-width: 780px) { .chat-composer-input { border-radius: 18px; } .chat-composer { --send-size: 44px; } }

/* Wider, quieter message text -- less like a boxed dashboard card, closer
   to a plain document with generous line-height, matching the reference
   the density complaints pointed at. */
.chat-log { gap: 22px; padding: 24px; }
.message-copy { max-width: 92%; padding: 4px 2px; border-color: transparent !important; background: transparent !important; font-size: .78rem; line-height: 1.7; }
.message.user .message-copy { padding: 10px 15px; border-radius: 16px 4px 16px 16px; background: rgba(94,126,255,.14) !important; }

/* Coach Lab's PDF preview: the real rendered page (canvas), a PDF.js text
   layer kept invisible but laid out exactly on top of it (so real DOM
   Ranges -- and their getClientRects() -- give exact highlight positions,
   no hand-rolled PDF coordinate math), and highlight overlays positioned
   from those rects. */

/* ===========================================================================
   MODERN AGENT REDESIGN
   A calm, spacious, prompt-forward agent interface inspired by contemporary
   agent products (Base44, Replit Agent, e2.vc): high-contrast neutral surface,
   one disciplined violet accent, generous whitespace, visible agent work, and
   a cohesive motion system. Layered as overrides so the app keeps working; the
   retuned :root tokens already re-skinned every view.
   =========================================================================== */

/* --- Shell: quieter chrome, softer depth, larger radii --- */
.app-shell { border: 1px solid var(--line); border-radius: 18px; background: var(--midnight); box-shadow: 0 40px 120px rgba(0,0,0,.55); }
.command-bar { min-height: 60px; border-bottom: 1px solid var(--line); background: rgba(16,16,20,.72); backdrop-filter: blur(18px); }
.side-rail { background: rgba(11,11,14,.5); }
.workspace { padding: var(--page-gutter-y) var(--page-gutter-x); }
.panel { border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); box-shadow: none; }
.metric-card, .command-card, .opportunity-card, .event-card, .path-node { border-radius: var(--radius); }

/* Nav: rounded, roomy, a soft accent wash on the active item --- */
.nav-item { min-height: 40px; margin: 1px 0; padding: 0 12px; border-left: 0; border-radius: 10px; color: var(--muted); font-weight: 600; }
.nav-item:hover { background: rgba(255,255,255,.04); color: var(--text); }
.nav-item.is-active { border-left: 0; background: var(--accent-soft); color: #cdc4ff; }
.nav-item.is-active .nav-icon { color: var(--accent); }
.nav-icon { color: var(--subtle); }

/* Primary action & send: one confident accent gradient --- */
.primary-action { min-height: 40px; border: 1px solid transparent; border-radius: 11px; background: linear-gradient(180deg, #8877ff, #6d5cf0); color: #fff; font-weight: 700; box-shadow: 0 6px 18px rgba(109,92,240,.32); }
.primary-action:hover { border-color: transparent; background: linear-gradient(180deg, #948aff, #7a69f5); transform: translateY(-1px); box-shadow: 0 10px 26px rgba(109,92,240,.42); }

/* --- Home / hero: elegant, centered, welcoming entrance --- */
.home-greeting { gap: 14px; max-width: 760px; margin: 8px auto 26px; animation: riseIn .6s var(--ease-out) both; }
.home-greeting-icon { width: 44px; height: 44px; animation: logo-spectrum 7s ease-in-out infinite alternate, riseIn .6s var(--ease-out) both; }
.home-greeting h1 { font-size: 1.9rem; font-weight: 650; letter-spacing: -.02em; }
.home-greeting-sub { margin: 2px 0 0; color: var(--muted); font-size: .82rem; }
.agent-studio-header .eyebrow { color: var(--accent); }

/* Category quick-launch row (reference agent products' mode picker) */
.launch-row { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; max-width: 760px; margin: 0 auto 26px; }
.launch-tile { display: grid; justify-items: center; gap: 8px; width: 122px; padding: 15px 10px; border: 1px solid var(--line); border-radius: 14px; background: var(--panel); color: var(--muted); cursor: pointer; animation: riseIn .5s var(--ease-out) both; transition: border-color 160ms var(--ease), background 160ms var(--ease), color 160ms var(--ease), transform 140ms var(--ease), box-shadow 200ms var(--ease); }
.launch-tile:hover { border-color: var(--line-strong); color: var(--text); transform: translateY(-3px); box-shadow: var(--shadow-soft); }
.launch-tile:active { transform: translateY(-1px) scale(.98); }
.launch-tile.is-active { border-color: rgba(124,108,255,.5); background: var(--accent-soft); color: #cdc4ff; }
.launch-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: rgba(255,255,255,.03); color: var(--accent); font-size: 1.05rem; }
.launch-tile.is-active .launch-icon { background: rgba(124,108,255,.18); }
.launch-label { font-size: .68rem; font-weight: 600; white-space: nowrap; }
.launch-agent { color: var(--subtle); font-size: .55rem; font-weight: 500; text-align: center; line-height: 1.25; }
.launch-tile.is-active .launch-agent { color: rgba(205,196,255,.72); }

/* Designated-agent identity in the function header */
.agent-identity { display: inline-flex; align-items: center; gap: 8px; margin-top: 9px; padding: 5px 11px 5px 9px; border: 1px solid var(--line-strong); border-radius: 999px; background: var(--accent-soft); }
.agent-identity:empty { display: none; }
.agent-identity-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 8px var(--accent); }
.agent-identity strong { color: #cdc4ff; font-size: .7rem; font-weight: 700; }
.agent-identity-role { color: var(--muted); font-size: .62rem; }
@media (max-width: 640px) { .agent-identity-role { display: none; } }
.launch-tile:nth-child(1){animation-delay:.04s}.launch-tile:nth-child(2){animation-delay:.1s}.launch-tile:nth-child(3){animation-delay:.16s}.launch-tile:nth-child(4){animation-delay:.22s}.launch-tile:nth-child(5){animation-delay:.28s}
@media (max-width: 780px) { .launch-tile { width: calc(33.33% - 8px); } }

/* --- Chat thread: spacious, document-like, clear agent identity --- */
.chat-panel { min-height: 620px; border-radius: var(--radius-lg); background: var(--panel); }
.chat-log { gap: 26px; padding: 30px 30px 22px; }
.message { grid-template-columns: 30px minmax(0,1fr); gap: 14px; animation: msgIn .42s var(--ease-out) both; }
.message.user { grid-template-columns: minmax(0,1fr) 30px; }
.message-avatar { width: 30px; height: 30px; border: 1px solid var(--line-strong); border-radius: 50%; background: var(--accent-soft); color: #cdc4ff; font-size: .58rem; }
.message.user .message-avatar { background: rgba(77,226,208,.1); color: var(--cyan); }
.message-copy { max-width: 94%; font-size: .82rem; line-height: 1.72; color: #e6e6ec; }
.message.user .message-copy { padding: 11px 16px; border-radius: 16px 5px 16px 16px; background: var(--accent-soft) !important; color: #eceaff; }
.message-copy p { white-space: pre-line; }
.message-meta { color: var(--subtle); }

/* Thinking / streaming state --- */
.message-avatar.is-thinking .wordmark-glyph { animation: logo-spectrum 3.2s ease-in-out infinite alternate, spin 1.15s linear infinite; }
.message-copy .is-thinking-text { position: relative; color: var(--muted); font-style: normal; background: linear-gradient(90deg, var(--subtle) 20%, var(--text) 40%, var(--subtle) 60%); background-size: 220% 100%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: shimmer 1.7s linear infinite; }
.message-copy .is-thinking-text::after { content: "▋"; -webkit-text-fill-color: var(--accent); margin-left: 2px; animation: blink 1s steps(2) infinite; }

/* --- Inline agent activity: the agent's work as a scannable timeline,
   modeled on how coding agents surface their steps (Replit's agent log). --- */
.agent-activity { margin: 12px 0 6px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.02); animation: msgIn .42s var(--ease-out) both; }
.agent-activity-head { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; color: var(--muted); font-family: "DM Mono", monospace; font-size: .56rem; letter-spacing: .09em; text-transform: uppercase; }
.agent-activity-head i { display: inline-flex; gap: 3px; }
.agent-activity-head i b { width: 4px; height: 4px; border-radius: 50%; background: var(--accent); animation: dotPulse 1.2s ease-in-out infinite; }
.agent-activity-head i b:nth-child(2){animation-delay:.18s}.agent-activity-head i b:nth-child(3){animation-delay:.36s}
.agent-activity-timeline { position: relative; display: grid; gap: 11px; }
.agent-activity-timeline::before { content: ""; position: absolute; left: 8px; top: 9px; bottom: 9px; width: 1px; background: var(--line-strong); }
.agent-activity-step { position: relative; display: grid; grid-template-columns: 17px minmax(0,1fr); gap: 11px; align-items: start; animation: stepIn .34s var(--ease-out) both; }
.agent-activity-step .tick { z-index: 1; display: grid; place-items: center; width: 17px; height: 17px; border-radius: 50%; background: var(--midnight); box-shadow: 0 0 0 3px var(--midnight); color: var(--cyan); font-family: "DM Mono", monospace; font-size: .58rem; }
.agent-activity-step.is-web .tick { color: var(--blue); } .agent-activity-step.is-edit .tick { color: var(--accent); } .agent-activity-step.is-verify .tick { color: var(--teal); }
.agent-activity-body { display: grid; gap: 1px; min-width: 0; padding-top: 1px; }
.agent-activity-body b { color: #e6e6ec; font-size: .72rem; font-weight: 600; line-height: 1.4; }
.agent-activity-body small { color: var(--subtle); font-size: .62rem; text-transform: capitalize; }
.agent-activity-step:nth-child(1){animation-delay:.02s}.agent-activity-step:nth-child(2){animation-delay:.09s}.agent-activity-step:nth-child(3){animation-delay:.16s}.agent-activity-step:nth-child(4){animation-delay:.23s}.agent-activity-step:nth-child(5){animation-delay:.3s}.agent-activity-step:nth-child(6){animation-delay:.37s}
.agent-activity-done { display: flex; align-items: center; gap: 10px; margin-top: 13px; padding-top: 12px; border-top: 1px solid var(--line); color: var(--muted); font-family: "DM Mono", monospace; font-size: .58rem; letter-spacing: .02em; }
.agent-activity-done .tick { display: grid; place-items: center; width: 17px; height: 17px; border-radius: 50%; background: rgba(70,211,154,.14); color: var(--teal); font-size: .58rem; }

/* --- Suggestion chips (prompt set): pill chips that stagger in --- */
.prompt-set { gap: 8px; padding: 4px 30px 16px; }
.prompt-set button { padding: 9px 13px; border: 1px solid var(--line-strong); border-radius: 999px; background: rgba(255,255,255,.02); color: var(--muted); font-size: .68rem; font-weight: 500; animation: riseIn .5s var(--ease-out) both; transition: border-color 160ms var(--ease), color 160ms var(--ease), background 160ms var(--ease), transform 120ms var(--ease); }
.prompt-set button:hover { border-color: var(--accent); color: var(--text); background: var(--accent-soft); transform: translateY(-2px); }
.prompt-set button:nth-child(1){animation-delay:.05s}.prompt-set button:nth-child(2){animation-delay:.11s}.prompt-set button:nth-child(3){animation-delay:.17s}.prompt-set button:nth-child(4){animation-delay:.23s}.prompt-set button:nth-child(5){animation-delay:.29s}.prompt-set button:nth-child(6){animation-delay:.35s}

/* --- Composer: a prominent, tactile prompt bar --- */
.chat-composer { padding: 16px 24px 22px; border-top: 1px solid var(--line); }
.chat-composer-input { padding: 12px 18px; border: 1px solid var(--line-strong); border-radius: 20px; background: rgba(255,255,255,.03); box-shadow: var(--shadow-soft); transition: border-color 180ms var(--ease), box-shadow 220ms var(--ease), transform 220ms var(--ease); }
.chat-composer-input:focus-within { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft), var(--shadow-soft); }
.chat-composer-input textarea#chatInput { font-size: .82rem; line-height: 1.55; color: #eceaf4; }
.send-button { width: var(--send-size, 48px); height: var(--send-size, 48px); aspect-ratio: 1 / 1; padding: 0; border: 1px solid transparent; border-radius: 50%; background: linear-gradient(180deg, #8877ff, #6d5cf0); color: #fff; box-shadow: 0 6px 16px rgba(109,92,240,.4); transition: transform 140ms var(--ease), box-shadow 200ms var(--ease), filter 160ms var(--ease); }
.send-button:hover { background: linear-gradient(180deg, #8877ff, #6d5cf0); filter: brightness(1.08); transform: translateY(-1px) scale(1.04); }
.send-button:active { transform: scale(.94); }

/* --- Context / decision cards: calmer, rounded, less neon --- */
.advisor-context .context-card { border-radius: var(--radius); background: var(--panel); }
.context-card .eyebrow { color: var(--accent); }
.context-card strong { color: #ececf2; }

/* --- Utility bar & tabs --- */
.chat-utility-tab.is-active { color: var(--text); }
.chat-utility-tabs { border-radius: 10px; }

/* --- Card hover lift, applied broadly for a tactile feel --- */
.command-card:hover, .opportunity-card:hover, .event-card:hover { border-color: var(--line-strong); transform: translateY(-3px); box-shadow: var(--shadow-soft); }

/* --- Coach Lab: document review rendered as agent feedback --- */
.coach-findings { gap: 9px; }
.coach-review-line { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: rgba(70,211,154,.06); color: var(--muted); font-family: "DM Mono", monospace; font-size: .58rem; letter-spacing: .01em; }
.coach-review-line .tick { flex: none; display: grid; place-items: center; width: 17px; height: 17px; border-radius: 50%; background: rgba(70,211,154,.14); color: var(--teal); font-size: .58rem; }
.coach-finding { padding: 11px 13px; border: 1px solid var(--line); border-left: 2px solid var(--blue); border-radius: 10px; background: rgba(255,255,255,.02); }
.coach-finding:hover { transform: translateX(2px); border-color: var(--line-strong); }
.coach-finding span { font-size: .5rem; letter-spacing: .07em; }
.coach-finding p { margin-top: 6px; color: #d8d8de; font-size: .68rem; line-height: 1.5; }
.coach-finding-section { margin: 16px 0 2px; color: var(--subtle); font-size: .52rem; letter-spacing: .09em; }
.coach-finding-apply { margin-top: 10px; }
.coach-goal strong { color: #ececf2; font-size: .72rem; }
.coach-goal p { color: var(--muted); font-size: .62rem; }

/* --- Shared controls polish, unifying every view on the violet accent --- */
.workspace-switcher { padding: 4px; border-radius: 11px; background: rgba(255,255,255,.03); }
.workspace-switcher button { border-radius: 8px; }
.workspace-switcher button.is-active { border-color: rgba(124,108,255,.4); background: var(--accent-soft); color: #cdc4ff; }
.control-form input, .control-form select, .control-form textarea, .filter-bar input, .filter-bar select, .profile-layout input, .profile-layout select, .profile-layout textarea, .bridge-panel input, .coach-google-doc-row input, .node-inspector input, .node-inspector select, .node-inspector textarea { border-radius: 10px; }
.control-form input:focus, .control-form select:focus, .control-form textarea:focus, .filter-bar input:focus, .filter-bar select:focus, .profile-layout input:focus, .profile-layout select:focus, .profile-layout textarea:focus, .bridge-panel input:focus, .node-inspector input:focus, .node-inspector select:focus, .node-inspector textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.route-add-button, .calendar-save-button { border-radius: 9px; }
.route-add-button:hover { border-color: var(--accent); }
.status-badge { border-radius: 8px; }
.command-icon { color: var(--accent); border-color: rgba(124,108,255,.35); }

/* --- Markdown in agent replies + row-by-row reveal --- */
.message-copy .md-p { margin: 0 0 10px; white-space: normal; }
.message-copy .md-p:last-child { margin-bottom: 0; }
.message-copy .md-h { margin: 14px 0 7px; color: #f1f1f5; font-weight: 650; font-size: .92rem; line-height: 1.35; }
.message-copy .md-h:first-child { margin-top: 0; }
.message-copy h4.md-h { font-size: .84rem; color: #e8e8ee; }
.message-copy .md-list { display: grid; gap: 5px; margin: 2px 0 11px; padding-left: 20px; }
.message-copy .md-list:last-child { margin-bottom: 0; }
.message-copy .md-list li { line-height: 1.6; }
.message-copy .md-list li::marker { color: var(--accent); }
.message-copy code { padding: 1px 5px; border-radius: 5px; background: rgba(255,255,255,.06); font-family: "DM Mono", monospace; font-size: .9em; }
.message-copy strong { color: #f2f2f6; font-weight: 650; }
.message-copy em { color: #eceaf4; }
.message-copy a { color: var(--blue); text-decoration: underline; text-underline-offset: 2px; }
.md-reveal { animation: msgIn .42s var(--ease-out) both; }
@media (prefers-reduced-motion: reduce) { .md-reveal { animation: none !important; } }

/* --- Motion system --- */
@keyframes msgIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes riseIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
@keyframes stepIn { from { opacity: 0; transform: translateX(-6px); } to { opacity: 1; transform: translateX(0); } }
@keyframes shimmer { to { background-position: -220% 0; } }
@keyframes blink { 50% { opacity: 0; } }
@keyframes dotPulse { 0%, 100% { transform: scale(1); opacity: .5; } 50% { transform: scale(1.5); opacity: 1; } }

@media (prefers-reduced-motion: reduce) {
  .home-greeting, .home-greeting-icon, .message, .agent-activity, .agent-activity-step, .prompt-set button { animation: none !important; }
  .message-copy .is-thinking-text { animation: none; -webkit-text-fill-color: var(--muted); }
}

@media (max-width: 780px) {
  .workspace { padding: 22px 16px; }
  .home-greeting h1 { font-size: 1.4rem; }
  .chat-log { padding: 20px 16px; }
  .prompt-set { padding: 4px 16px 14px; }
  .chat-composer { padding: 14px 16px 18px; }
}

/* == COLLAPSIBLE RAIL ==================================================
   The rail collapses to an icon-only strip so only the glyphs stay
   visible. Desktop-only: under 780px the rail already stacks. */
.rail-toggle { display: none; }
@media (min-width: 781px) {
  /* Keep the control inside the rail's scroll boundary. A negative `right`
     value placed ten pixels of the old 22px circle outside an `overflow:auto`
     sidebar, so browsers correctly clipped almost half of the button. */
  .rail-toggle { position: absolute; z-index: 4; top: 14px; right: 8px; display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; background: var(--midnight); color: var(--muted); cursor: pointer; font-family: "DM Mono", monospace; font-size: .68rem; line-height: 1; opacity: .72; transition: opacity 160ms var(--ease), color 160ms var(--ease), border-color 160ms var(--ease), transform 120ms var(--ease); }
  .side-rail { position: relative; transition: none; }
  .side-rail:hover .rail-toggle, .rail-toggle:focus-visible { opacity: 1; }
  .rail-toggle:hover { border-color: var(--accent); color: var(--text); }
  .rail-toggle:active { transform: scale(.9); }
  body.rail-collapsed .rail-toggle { opacity: 1; }

  /* Reserve the button's slot in the expanded identity row so the collapse
     affordance and sign-out action never overlap at narrow desktop widths. */
  body:not(.rail-collapsed) .identity-block { padding-right: 42px; }

  body.rail-collapsed .app-frame { grid-template-columns: 68px minmax(0, 1fr); }
  body.rail-collapsed .command-bar { grid-template-columns: 68px 1fr auto auto auto auto; }
  body.rail-collapsed .side-rail { padding: 20px 8px; overflow: hidden; }

  /* Keep the pinwheel, drop the wordmark text. */
  body.rail-collapsed .wordmark span:not(.wordmark-glyph) { display: none; }
  body.rail-collapsed .wordmark { justify-content: center; gap: 0; }

  /* Icon-only nav: labels out, glyphs centered, tooltips carry the name. */
  body.rail-collapsed .nav-item { grid-template-columns: 1fr; justify-items: center; padding-inline: 0; }
  body.rail-collapsed .nav-item > span:not(.nav-icon) { display: none; }
  body.rail-collapsed .rail-label,
  body.rail-collapsed .chat-session-rail,
  body.rail-collapsed .identity-block > div,
  body.rail-collapsed .identity-block #sidebarLogout,
  body.rail-collapsed .rail-footer span:not(.status-dot) { display: none; }
  body.rail-collapsed .identity-block { justify-content: center; padding: 2px 0 18px; }
  body.rail-collapsed .rail-footer { justify-content: center; }
}

/* == DOCKED AGENT WORK PANEL ==========================================
   A right-hand dock that streams what the agent is doing, in the shape of
   the coding-agent work logs it is modelled on. */
.workspace { position: relative; }
.agent-dock { position: fixed; z-index: 22; top: 0; right: 0; display: flex; width: min(420px, 100vw); height: 100vh; flex-direction: column; border-left: 1px solid var(--line); background: var(--midnight); box-shadow: -24px 0 60px rgba(0,0,0,.42); transform: translateX(100%); transition: transform 280ms var(--ease-out); }
.agent-dock.is-open { transform: translateX(0); }
@media (prefers-reduced-motion: reduce) { .agent-dock { transition: none; } }
.agent-dock-head { display: flex; align-items: center; gap: 10px; padding: 16px 16px 13px; border-bottom: 1px solid var(--line); }
.agent-dock-head .eyebrow { margin: 0; }
.agent-dock-head strong { display: block; color: #eef2ff; font-size: .78rem; }
.agent-dock-head small { display: block; margin-top: 2px; color: var(--subtle); font-size: .58rem; }
.agent-dock-close { margin-left: auto; }
.agent-dock-body { flex: 1; min-height: 0; overflow-y: auto; padding: 16px; scrollbar-color: var(--line-strong) transparent; }
.agent-dock-body .agent-activity { margin: 0 0 14px; }
.agent-dock-empty { color: var(--subtle); font-size: .68rem; line-height: 1.6; }
.agent-dock-run { margin-bottom: 18px; padding-bottom: 16px; border-bottom: 1px solid var(--line); animation: riseIn .38s var(--ease-out) both; }
.agent-dock-run:last-child { border-bottom: 0; }
.agent-dock-run-head { display: flex; align-items: baseline; gap: 8px; margin-bottom: 10px; }
.agent-dock-run-head b { color: #e6e6ec; font-size: .72rem; }
.agent-dock-run-head span { margin-left: auto; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .55rem; }
.agent-dock-toggle { position: fixed; z-index: 21; right: 22px; bottom: 88px; display: inline-flex; align-items: center; gap: 7px; padding: 9px 14px; border: 1px solid var(--line-strong); border-radius: 999px; background: rgba(13,16,42,.96); color: var(--muted); cursor: pointer; font-family: "DM Mono", monospace; font-size: .58rem; letter-spacing: .06em; text-transform: uppercase; box-shadow: 0 14px 40px rgba(0,0,20,.42); transition: border-color 160ms var(--ease), color 160ms var(--ease), transform 120ms var(--ease); }
.agent-dock-toggle:hover { border-color: var(--accent); color: var(--text); transform: translateY(-1px); }
.agent-dock-toggle.is-running { border-color: rgba(124,108,255,.6); color: #d8d2ff; }
.agent-dock-toggle i { display: inline-flex; gap: 3px; }
.agent-dock-toggle i b { width: 4px; height: 4px; border-radius: 50%; background: var(--accent); }
.agent-dock-toggle.is-running i b { animation: dotPulse 1.2s ease-in-out infinite; }
.agent-dock-toggle.is-running i b:nth-child(2){animation-delay:.18s}
.agent-dock-toggle.is-running i b:nth-child(3){animation-delay:.36s}

/* == CHAT-NATIVE UPLOAD ============================================== */
.chat-panel { position: relative; }
.chat-dropzone { position: absolute; z-index: 6; inset: 0; display: grid; place-items: center; border: 2px dashed var(--accent); border-radius: var(--radius); background: rgba(10,10,14,.86); color: #ded8ff; font-size: .8rem; letter-spacing: .04em; opacity: 0; pointer-events: none; transition: opacity 160ms var(--ease); }
.chat-panel.is-dropping .chat-dropzone { opacity: 1; }
.chat-attachment-chip { display: inline-flex; align-items: center; gap: 5px; max-width: 190px; }

/* == FUNCTION STRIP ====================================================
   Roleplay and Scenario are conversations; what remains of their old form
   panels is a single quiet row of controls that shape the conversation. */
.function-strip { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 16px; margin-top: 12px; padding: 13px 16px; border: 1px solid var(--line); border-radius: var(--radius); background: rgba(255,255,255,.02); animation: riseIn .34s var(--ease-out) both; }
.function-control { display: grid; gap: 5px; min-width: 0; color: var(--subtle); font-family: "DM Mono", ui-monospace, monospace; font-size: .52rem; letter-spacing: .09em; text-transform: uppercase; }
.function-control select, .function-control input { min-height: 32px; min-width: 210px; padding: 0 10px; border: 1px solid var(--line-strong); border-radius: 8px; outline: none; background: rgba(5,7,22,.64); color: var(--text); font-family: Manrope, sans-serif; font-size: .7rem; letter-spacing: 0; text-transform: none; }
.function-control select:focus, .function-control input:focus { border-color: rgba(124,108,255,.8); box-shadow: 0 0 0 3px rgba(124,108,255,.13); }
.function-hint { flex: 1 1 260px; min-width: 220px; margin: 0; color: var(--subtle); font-size: .64rem; line-height: 1.55; }
@media (max-width: 780px) { .function-control select, .function-control input { min-width: 0; width: 100%; } }
.function-strip .coach-google-doc-row { display: flex; align-items: center; gap: 8px; }
.function-strip .coach-google-doc-row input { min-width: 240px; }
.function-strip .form-note { flex-basis: 100%; margin: 0; }
#coachFileStatus:not(:empty) { display: block; margin-top: 6px; color: var(--cyan); }
.network-profile-link { display: inline-flex; align-items: center; min-height: 30px; padding: 0 11px; border: 1px solid var(--line-strong); border-radius: 999px; color: var(--muted); font-size: .6rem; text-decoration: none; transition: border-color 160ms var(--ease), color 160ms var(--ease); }
.network-profile-link:hover { border-color: var(--accent); color: var(--text); }

/* Account actions: keep the two buttons on one line at equal weight instead
   of letting "Change password" wrap against a full-width Sign out. */
.account-panel-actions { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 12px; }
.account-panel-actions .text-action { white-space: nowrap; padding-left: 0; }
.account-panel-actions .compact-danger { width: 100%; }

/* == NAV ICONS ========================================================
   Real line icons instead of ASCII stand-ins (#, =, /, ~), which read as
   broken glyphs once the rail collapses to icons only. */
.nav-icon { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; flex: 0 0 18px; }
.nav-icon svg { width: 18px; height: 18px; display: block; }

/* The avatar is the profile picture, not a label: keep it when the rail
   collapses. The earlier `.identity-block > div` rule matched it too. */
@media (min-width: 781px) {
  body.rail-collapsed .identity-block > div:not(.avatar-orbit) { display: none; }
  body.rail-collapsed .identity-block > .avatar-orbit { display: grid; }
  body.rail-collapsed .nav-item { justify-items: center; }
}

/* == DRAFT COACH PAGE ==================================================
   A split workspace: the conversation with the Draft Editor on the left,
   the live document or image beside it, and the draft folder (sessions
   plus version history) in the right-hand menu. Stacks on narrow screens
   so the document always ends up under the conversation, never hidden. */
.draft-view .view-header { margin-bottom: 12px; }
.draft-function-strip { margin-top: 0; }
.draft-workspace { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr) 236px; gap: 12px; align-items: start; margin-top: 12px; }

.draft-doc-column { display: grid; gap: 12px; align-content: start; max-height: clamp(420px, calc(100vh - 372px), 780px); overflow-y: auto; scrollbar-color: var(--line-strong) transparent; }
.draft-doc-column .coach-preview-panel { min-height: 0; }
.draft-doc-column .coach-preview { min-height: 360px; }
.draft-doc-column .coach-result-panel { margin-top: 0; }
.draft-version-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 14px; }
.draft-version-chip { min-height: 26px; padding: 0 9px; border: 1px solid var(--line-strong); border-radius: 8px; background: rgba(255,255,255,.03); color: var(--muted); cursor: pointer; font-family: "DM Mono", monospace; font-size: .53rem; letter-spacing: .06em; transition: border-color 160ms var(--ease), color 160ms var(--ease); }
.draft-version-chip:hover { border-color: var(--accent); color: var(--text); }
.draft-version-chip.is-active { border-color: rgba(124,108,255,.55); background: var(--accent-soft); color: #cdc4ff; }
.draft-version-empty { color: var(--subtle); font-size: .58rem; }
.draft-revert-button { margin-left: auto; }

.draft-sessions-panel { padding: 16px; align-self: start; }
.draft-sessions-panel .panel-heading h2 { font-size: .8rem; }
.draft-session-list { display: grid; gap: 4px; margin-top: 14px; max-height: 280px; overflow-y: auto; scrollbar-color: var(--line-strong) transparent; }
.draft-session-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; align-items: center; border: 1px solid transparent; border-left: 2px solid transparent; border-radius: 8px; }
.draft-session-item:hover, .draft-session-item.is-active { border-color: rgba(124,108,255,.22); border-left-color: var(--accent); background: var(--accent-soft); }
.draft-session-open { display: grid; gap: 3px; min-width: 0; padding: 9px 10px; border: 0; background: transparent; color: var(--muted); cursor: pointer; text-align: left; }
.draft-session-item.is-active .draft-session-open { color: var(--text); }
.draft-session-open strong { overflow: hidden; font-size: .64rem; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.draft-session-open span { color: var(--subtle); font-family: "DM Mono", monospace; font-size: .48rem; letter-spacing: .02em; }
.draft-session-remove { margin-right: 7px; }
.draft-sessions-panel .form-note { margin-top: 10px; }
.draft-version-history { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.draft-version-list { display: grid; gap: 3px; margin-top: 8px; max-height: 240px; overflow-y: auto; scrollbar-color: var(--line-strong) transparent; }
.draft-version-row { display: grid; gap: 3px; width: 100%; padding: 8px 9px; border: 1px solid transparent; border-left: 2px solid transparent; border-radius: 8px; background: transparent; color: var(--muted); cursor: pointer; text-align: left; }
.draft-version-row:hover, .draft-version-row.is-active { border-color: rgba(77,226,208,.2); border-left-color: var(--cyan); background: rgba(77,226,208,.055); color: var(--text); }
.draft-version-row strong { overflow: hidden; font-size: .6rem; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.draft-version-row span { color: var(--subtle); font-family: "DM Mono", monospace; font-size: .46rem; letter-spacing: .02em; }
.draft-workspace .chat-dropzone { border-radius: var(--radius-lg); }
.draft-workspace.is-dropping .chat-dropzone { opacity: 1; }

@media (max-width: 1320px) {
  .draft-workspace { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); }
  .draft-sessions-panel { grid-column: 1 / -1; }
  .draft-session-list { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
  .draft-version-list { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
}
@media (max-width: 900px) {
  .draft-workspace { grid-template-columns: 1fr; }
  .draft-doc-column { max-height: none; overflow: visible; }
}
.opportunity-focus-chip { display: inline-block; margin-left: 6px; padding: 2px 8px; border: 1px solid var(--line-strong); border-radius: 999px; color: var(--subtle); font-family: "DM Mono", ui-monospace, monospace; font-size: .5rem; letter-spacing: .04em; text-transform: uppercase; cursor: help; }

/* Eligibility evidence stays visually subordinate to the source link. The
   collapsed summary makes the unknown state unavoidable without turning every
   result card into a long automated application review. */
.opportunity-eligibility { margin-top: 12px; border: 1px solid rgba(239,184,102,.22); border-radius: 9px; background: rgba(239,184,102,.035); }
.opportunity-eligibility-summary { display: grid; gap: 5px; padding: 9px 10px; color: var(--subtle); cursor: pointer; font: .52rem/1.45 "DM Mono", monospace; list-style-position: inside; }
.opportunity-eligibility-summary::marker { color: var(--amber); }
.opportunity-eligibility-badge { width: fit-content; padding: 3px 6px; border: 1px solid rgba(239,184,102,.36); border-radius: 999px; color: var(--amber); font-size: .47rem; letter-spacing: .05em; text-transform: uppercase; }
.opportunity-eligibility-body { display: grid; gap: 9px; padding: 0 10px 10px; border-top: 1px solid rgba(239,184,102,.12); }
.opportunity-eligibility-body > p { display: block; margin: 9px 0 0; color: #cbbd9e; font-size: .56rem; line-height: 1.5; -webkit-line-clamp: unset; overflow: visible; }
.opportunity-eligibility-list { display: grid; gap: 5px; }
.opportunity-eligibility-row { display: grid; grid-template-columns: minmax(95px,.62fr) minmax(120px,1fr); gap: 3px 8px; padding: 7px; border: 1px solid rgba(170,183,255,.11); border-radius: 7px; background: rgba(5,7,22,.28); }
.opportunity-eligibility-row strong { color: #e1e5f7; font-size: .55rem; }
.opportunity-eligibility-row > span { color: var(--subtle); font: .49rem "DM Mono", monospace; text-align: right; }
.opportunity-eligibility-row small { grid-column: 1 / -1; color: var(--muted); font-size: .53rem; line-height: 1.45; }
.opportunity-eligibility-row.is-signal { border-color: rgba(100,168,255,.22); }
.opportunity-eligibility-row.is-signal > span { color: var(--blue); }
.opportunity-eligibility-row.is-unknown > span { color: var(--amber); }
.opportunity-eligibility-legacy { color: var(--amber) !important; }

/* == GOAL COMPASS =====================================================
   The panel shows the reasoning chain in three layers: editable intent,
   unanswered decision questions, then evidence-linked fit suggestions. */
.goal-compass-panel { display: grid; gap: 18px; margin-bottom: 16px; padding: 22px; border-color: rgba(154,124,255,.28); background: radial-gradient(circle at 94% 8%, rgba(124,108,255,.12), transparent 34%), var(--panel); }
.goal-compass-intro { max-width: 1050px; margin: -5px 0 0; color: var(--muted); font-size: .68rem; line-height: 1.65; }
.goal-compass-target-form { display: grid; grid-template-columns: minmax(260px,1fr) 190px auto auto; gap: 10px; align-items: end; padding: 15px; border: 1px solid rgba(154,124,255,.18); border-radius: 12px; background: rgba(7,8,24,.34); }
.goal-compass-target-form label, .goal-compass-preferences-form label { display: grid; gap: 6px; min-width: 0; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .52rem; letter-spacing: .04em; text-transform: uppercase; }
.goal-compass-target-form input, .goal-compass-target-form select, .goal-compass-preferences-form input, .goal-compass-preferences-form select { width: 100%; min-height: 38px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 9px; outline: none; background: rgba(5,7,22,.64); color: var(--text); font: 600 .66rem Manrope, sans-serif; letter-spacing: 0; text-transform: none; }
.goal-compass-target-form input:focus, .goal-compass-target-form select:focus, .goal-compass-preferences-form input:focus, .goal-compass-preferences-form select:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.goal-compass-body { display: grid; grid-template-columns: minmax(230px,.34fr) minmax(0,1fr); gap: 18px; }
.goal-compass-questions, .goal-fit-results { min-width: 0; padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: rgba(7,8,24,.28); }
.goal-compass-subheading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 13px; }
.goal-compass-subheading h3 { margin: 0; color: #e9ebfa; font-size: .78rem; }
.goal-compass-subheading > span { color: var(--amber); font: .5rem "DM Mono", monospace; white-space: nowrap; }
#goalCompassQuestions { display: grid; gap: 8px; }
.goal-question { padding: 10px; border-left: 2px solid var(--amber); background: rgba(240,180,95,.045); }
.goal-question strong, .goal-question small { display: block; }
.goal-question strong { color: #ebe3d3; font-size: .62rem; line-height: 1.5; }
.goal-question small { margin-top: 5px; color: var(--subtle); font-size: .54rem; line-height: 1.45; }
.goal-fit-lanes { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.goal-fit-lane { min-width: 0; padding: 12px; border: 1px solid rgba(170,183,255,.12); border-radius: 10px; background: rgba(255,255,255,.018); }
.goal-fit-lane-head { min-height: 58px; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.goal-fit-lane-head strong { display: block; color: #e5e8fa; font-size: .66rem; }
.goal-fit-lane-head small { display: block; margin-top: 5px; color: var(--subtle); font-size: .51rem; line-height: 1.4; }
.goal-fit-list { display: grid; gap: 8px; margin-top: 10px; }
.goal-fit-card { display: grid; gap: 7px; padding: 10px; border: 1px solid rgba(124,108,255,.18); border-radius: 9px; background: rgba(124,108,255,.045); }
.goal-fit-card h4 { margin: 0; color: #f0eff9; font-size: .66rem; line-height: 1.4; }
.goal-fit-card > span { color: var(--blue); font: .48rem/1.4 "DM Mono", monospace; }
.goal-fit-card p { margin: 0; color: var(--muted); font-size: .54rem; line-height: 1.5; }
.goal-fit-card .goal-fit-uncertainty { color: #c8b58f; }
.goal-fit-actions { display: flex; flex-wrap: wrap; gap: 5px; padding-top: 3px; }
.goal-fit-actions .route-add-button { min-height: 27px; }
.goal-fit-source { width: fit-content; color: var(--cyan); font: .48rem "DM Mono", monospace; text-decoration: none; }
.goal-fit-source:hover { text-decoration: underline; }
.goal-fit-empty { margin: 10px 0 0; color: var(--subtle); font-size: .55rem; line-height: 1.5; }
.goal-compass-refine { border-top: 1px solid var(--line); }
.goal-compass-refine summary { width: fit-content; padding-top: 14px; color: var(--blue); cursor: pointer; font: .55rem "DM Mono", monospace; }
.goal-compass-preferences-form { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin-top: 14px; padding: 14px; border: 1px solid var(--line); border-radius: 10px; background: rgba(5,7,22,.3); }
.goal-compass-preferences-form .primary-action { align-self: end; }

/* == OPPORTUNITY INTELLIGENCE MAP ==================================== */
.opportunity-location-panel { display: grid; gap: 14px; margin-bottom: 12px; padding: 18px; background: radial-gradient(circle at 88% 12%, rgba(77,226,208,.08), transparent 34%), var(--panel); }
.opportunity-private-badge { padding: 5px 8px; border: 1px solid rgba(77,226,208,.32); border-radius: 999px; color: var(--cyan); font-family: "DM Mono", monospace; font-size: .48rem; letter-spacing: .07em; }
.opportunity-location-form { display: grid; grid-template-columns: repeat(3,minmax(120px,1fr)) 120px auto; gap: 9px; align-items: end; }
.opportunity-location-form label { display: grid; gap: 6px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .54rem; letter-spacing: .04em; }
.opportunity-location-form input, .opportunity-location-form select { width: 100%; min-height: 38px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; outline: none; background: rgba(5,7,22,.64); color: var(--text); font: 600 .68rem Manrope, sans-serif; }
.opportunity-location-form input:focus, .opportunity-location-form select:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.opportunity-location-submit { min-height: 38px; white-space: nowrap; }
.opportunity-location-choose { grid-column: 1 / -1; width: fit-content; padding-left: 0; }
.opportunity-location-choose.is-active { color: var(--cyan); }
.opportunity-location-footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding-top: 11px; border-top: 1px solid var(--line); }
.opportunity-location-footer p, .opportunity-privacy-note { margin: 0; color: var(--muted); font-size: .59rem; line-height: 1.55; }
.opportunity-privacy-note { color: var(--subtle); }
.opportunity-nearby-toggle { display: inline-flex; align-items: center; gap: 7px; color: #dce4fb; cursor: pointer; font-size: .59rem; white-space: nowrap; }
.opportunity-nearby-toggle input { accent-color: var(--cyan); }
.opportunity-nearby-toggle:has(input:disabled) { opacity: .45; cursor: not-allowed; }
.opportunity-filter-bar { grid-template-columns: minmax(0,1fr) 220px; align-items: end; }
.opportunity-watch-panel { display: grid; gap: 14px; margin-bottom: 12px; padding: 18px; }
.opportunity-watch-toolbar { align-items: center; display: flex; gap: 14px; justify-content: space-between; }
.opportunity-watch-toolbar p { color: var(--text-muted, #9ca8c8); font-size: .69rem; line-height: 1.45; margin: 0; max-width: 720px; }
.opportunity-notice-preferences { display: flex; flex-wrap: wrap; gap: 8px; }
.opportunity-notice-preferences label { align-items: center; background: rgba(100,168,255,.06); border: 1px solid rgba(100,168,255,.17); border-radius: 999px; color: var(--text-muted, #9ca8c8); display: flex; font-size: .66rem; gap: 7px; padding: 7px 10px; }
.opportunity-notice-preferences input { accent-color: var(--blue); }
.opportunity-watch-list { display: grid; gap: 8px; }
.opportunity-watch-row { align-items: center; border-top: 1px solid rgba(170,183,255,.1); display: grid; gap: 12px; grid-template-columns: minmax(0,1fr) auto; padding-top: 10px; }
.opportunity-watch-row > div:first-child { display: grid; gap: 3px; min-width: 0; }
.opportunity-watch-row strong { color: #e4e7fa; font-size: .72rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.opportunity-watch-row span { color: var(--subtle); font-size: .61rem; text-transform: capitalize; }
.opportunity-watch-actions { display: flex; gap: 4px; }
.opportunity-watch-matches { display: grid; gap: 6px; grid-column: 1 / -1; }
.opportunity-watch-match { align-items: center; background: rgba(100,168,255,.055); border: 1px solid rgba(100,168,255,.12); border-radius: 9px; display: grid; gap: 2px; padding: 8px 10px; text-decoration: none; transition: border-color .18s ease, background .18s ease; }
.opportunity-watch-match:hover, .opportunity-watch-match:focus-visible { background: rgba(100,168,255,.09); border-color: rgba(100,168,255,.32); }
.opportunity-watch-match strong { color: #dfe7ff; font-size: .66rem; }
.opportunity-watch-match span { color: #8796bd; font-size: .58rem; text-transform: none; }
.opportunity-alert-watch { color: #82b8ff; display: block; font-size: .58rem; margin-top: 3px; }
.tracker-item.is-due { border-left: 2px solid rgba(255,142,142,.7); padding-left: 12px; }
.tracker-review-copy { color: #ffb1b1 !important; font-family: "DM Mono", monospace; font-size: .55rem !important; margin-top: 6px; }
.tracker-review-field { display: grid; gap: 4px; }
.tracker-review-field > span { color: var(--subtle); font-size: .54rem; text-transform: uppercase; }
.tracker-review, .tracker-next-action { width: 100%; border: 1px solid var(--line); border-radius: 4px; outline: none; background: rgba(5,7,22,.64); color: var(--text); font-family: Manrope, sans-serif; font-size: .64rem; min-height: 34px; padding: 0 7px; }
.tracker-review:focus, .tracker-next-action:focus { border-color: rgba(100,168,255,.9); box-shadow: 0 0 0 3px rgba(100,168,255,.1); }
.tracker-source-check-badge { width: fit-content; margin-top: 8px; padding: 4px 7px; border: 1px solid rgba(239,184,102,.28); border-radius: 999px; color: var(--amber); font-family: "DM Mono", monospace; font-size: .49rem; letter-spacing: .03em; text-transform: uppercase; }
.tracker-source-check-badge.is-provider-checked { border-color: rgba(77,226,208,.36); background: rgba(77,226,208,.07); color: var(--cyan); }
.tracker-source-check-badge.is-needs-confirmation { border-color: rgba(255,142,142,.34); background: rgba(255,142,142,.06); color: #ffb1b1; }
.tracker-source-check-badge.is-decision-pursue { border-color: rgba(77,226,208,.36); background: rgba(77,226,208,.07); color: var(--cyan); }
.tracker-source-check-badge.is-decision-defer { border-color: rgba(239,184,102,.36); background: rgba(239,184,102,.07); color: var(--amber); }
.tracker-source-check-badge.is-decision-reject { border-color: rgba(255,142,142,.34); background: rgba(255,142,142,.06); color: #ffb1b1; }
.status-badge.is-attention { border-color: rgba(255,142,142,.42); background: rgba(255,142,142,.06); color: #ffb1b1; }
.tracker-official-link { display: block; width: fit-content; margin-top: 7px; color: var(--cyan); font-family: "DM Mono", monospace; font-size: .52rem; text-decoration: none; }
.tracker-official-link:hover { text-decoration: underline; }
.tracker-source-check { display: grid; grid-column: 1 / -1; gap: 9px; padding: 12px; border: 1px solid rgba(100,168,255,.2); border-radius: 6px; background: rgba(5,7,22,.32); }
.tracker-source-check > strong { color: #e4e7fa; font-size: .65rem; }
.tracker-source-check > p { margin: -4px 0 0; color: var(--subtle); font-size: .56rem; line-height: 1.45; }
.tracker-source-check-grid { display: grid; grid-template-columns: minmax(170px,.72fr) minmax(220px,1.28fr) minmax(150px,.58fr); gap: 8px; }
.tracker-source-check-field { display: grid; gap: 5px; min-width: 0; }
.tracker-source-check-field > span { color: var(--subtle); font-size: .52rem; letter-spacing: .03em; text-transform: uppercase; }
.tracker-source-check-field input, .tracker-source-check-field select { width: 100%; min-height: 34px; padding: 0 8px; border: 1px solid var(--line); border-radius: 4px; outline: none; background: rgba(5,7,22,.64); color: var(--text); font-family: Manrope, sans-serif; font-size: .61rem; }
.tracker-source-check-field input:focus, .tracker-source-check-field select:focus { border-color: rgba(100,168,255,.9); box-shadow: 0 0 0 3px rgba(100,168,255,.1); }
.tracker-source-check-question { grid-column: 1 / -1; }
/* Decision feedback is intentionally visually separate from source checking:
   it records the student's preference, never a claim about eligibility. */
.tracker-learning-summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px; border: 1px solid rgba(149,109,255,.24); border-radius: 8px; background: rgba(149,109,255,.055); }
.tracker-learning-copy { min-width: 0; }
.tracker-learning-copy strong { color: #e5e0ff; font-size: .68rem; }
.tracker-learning-copy p { max-width: 760px; margin: 4px 0 0; color: var(--subtle); font-size: .56rem; line-height: 1.5; }
.tracker-learning-counts { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 5px; }
.tracker-learning-counts span { padding: 4px 7px; border: 1px solid var(--line); border-radius: 999px; color: var(--subtle); font: .49rem "DM Mono", monospace; white-space: nowrap; }
.tracker-learning-counts .is-pursue { border-color: rgba(77,226,208,.3); color: var(--cyan); }
.tracker-learning-counts .is-defer { border-color: rgba(239,184,102,.3); color: var(--amber); }
.tracker-learning-counts .is-reject { border-color: rgba(255,142,142,.3); color: #ffb1b1; }
.tracker-learning-counts .is-signal { border-color: rgba(149,109,255,.4); color: #c7b6ff; }
.tracker-decision-feedback { display: grid; grid-column: 1 / -1; gap: 9px; padding: 12px; border: 1px solid rgba(149,109,255,.23); border-radius: 6px; background: rgba(11,8,28,.36); }
.tracker-decision-feedback > strong { color: #e5e0ff; font-size: .65rem; }
.tracker-decision-feedback > p { margin: -4px 0 0; color: var(--subtle); font-size: .56rem; line-height: 1.45; }
.tracker-decision-grid { display: grid; grid-template-columns: minmax(145px,.55fr) minmax(210px,.85fr) minmax(230px,1.1fr) auto; gap: 8px; align-items: end; }
.tracker-decision-note { min-width: 0; }
.tracker-decision-actions { display: flex; align-items: center; gap: 4px; min-height: 34px; }
.tracker-decision-actions .text-action:disabled { opacity: .38; cursor: not-allowed; }
.opportunity-learning-adjustment { color: #c7b6ff; }
.opportunity-learning-adjustment.is-up { color: var(--cyan); }
.opportunity-learning-adjustment.is-down { color: #ffb1b1; }
.opportunity-view-switcher { display: inline-flex; min-height: 36px; padding: 3px; border: 1px solid var(--line); border-radius: 9px; background: rgba(5,7,22,.5); }
.opportunity-view-switcher button { padding: 0 10px; border: 0; border-radius: 6px; background: transparent; color: var(--subtle); cursor: pointer; font: 600 .55rem "DM Mono", monospace; }
.opportunity-view-switcher button.is-active { background: rgba(100,168,255,.18); color: var(--blue); }
.opportunity-distance { color: var(--cyan); }
.opportunity-distance.is-online { color: var(--blue); }
.opportunity-map-panel { display: grid; gap: 15px; margin-bottom: 16px; padding: 22px; overflow: hidden; border-color: rgba(77,226,208,.24); background: radial-gradient(circle at 50% 40%, rgba(77,226,208,.05), transparent 42%), var(--panel); }
.opportunity-map-panel[hidden] { display: none; }
.opportunity-map-status { margin: 0; color: var(--muted); font-size: .62rem; line-height: 1.5; }
.opportunity-map-stage { position: relative; height: clamp(310px,38vw,470px); min-height: 310px; overflow: hidden; border: 1px solid rgba(124,143,255,.22); border-radius: 16px; background: #0a102d; box-shadow: inset 0 0 60px rgba(5,7,22,.55), 0 18px 45px rgba(0,0,0,.22); }
.opportunity-map-stage svg { display: block; width: 100%; height: 100%; min-height: 310px; }
.opportunity-map-stage.is-choosing { border-color: rgba(77,226,208,.65); cursor: crosshair; box-shadow: 0 0 0 3px rgba(77,226,208,.09), inset 0 0 60px rgba(5,7,22,.55); }
.opportunity-map-grid path { fill: none; stroke: rgba(142,158,226,.09); stroke-width: 1; }
.opportunity-map-land path { fill: rgba(100,126,191,.2); stroke: rgba(153,176,232,.24); stroke-width: 1.5; }
.opportunity-radar-field { pointer-events: none; }
.opportunity-radar-ring { fill: none; stroke: rgba(77,226,208,.22); stroke-width: 1.2; opacity: .62; animation: opportunity-radar-ring 3.2s ease-out infinite; }
.opportunity-radar-ring.ring-two { animation-delay: -1.05s; }.opportunity-radar-ring.ring-three { animation-delay: -2.1s; }
.opportunity-radar-sweep { transform-box: fill-box; transform-origin: center; animation: opportunity-radar-spin 4.8s linear infinite; }
.opportunity-radar-sweep path { fill: url(#opportunityRadarSweepGradient); opacity: .72; }
.opportunity-radar-sweep line { stroke: rgba(119,255,235,.8); stroke-width: 1.5; filter: drop-shadow(0 0 5px rgba(77,226,208,.8)); }
.opportunity-radar-origin { fill: var(--cyan); filter: drop-shadow(0 0 7px rgba(77,226,208,.9)); }
@keyframes opportunity-radar-spin { to { transform: rotate(360deg); } }
@keyframes opportunity-radar-ring { 0% { opacity: .08; transform: scale(.34); } 55% { opacity: .58; } 100% { opacity: 0; transform: scale(1.08); } }
.opportunity-map-marker { --marker-color: var(--blue); cursor: pointer; }
.opportunity-map-marker-halo { fill: var(--marker-color); opacity: .16; transform-box: fill-box; transform-origin: center; transition: opacity 160ms ease, transform 160ms ease; animation: opportunity-marker-pulse 2.6s ease-in-out infinite; animation-delay: var(--pulse-delay, 0s); }
@keyframes opportunity-marker-pulse { 0%,100% { opacity: .12; transform: scale(.75); } 50% { opacity: .34; transform: scale(1.45); } }
.opportunity-map-marker-core { fill: var(--marker-color); stroke: #eef3ff; stroke-width: 1.5; filter: drop-shadow(0 0 5px var(--marker-color)); }
.opportunity-map-marker:hover .opportunity-map-marker-halo, .opportunity-map-marker:focus .opportunity-map-marker-halo { opacity: .36; transform: scale(1.35); }
.opportunity-map-radius { fill: rgba(77,226,208,.07); stroke: rgba(77,226,208,.48); stroke-width: 1.5; stroke-dasharray: 5 5; pointer-events: none; }
.opportunity-map-user circle { fill: #f7fbff; stroke: var(--cyan); stroke-width: 3; filter: drop-shadow(0 0 7px rgba(77,226,208,.78)); }
.opportunity-map-user path { fill: var(--cyan); }
.opportunity-map-hint { position: absolute; top: 12px; left: 50%; z-index: 2; transform: translateX(-50%); padding: 8px 11px; border: 1px solid rgba(77,226,208,.42); border-radius: 999px; background: rgba(8,14,42,.92); color: var(--cyan); font: 600 .56rem "DM Mono", monospace; pointer-events: none; white-space: nowrap; }
.opportunity-map-legend { display: flex; flex-wrap: wrap; gap: 14px; color: var(--subtle); font: .52rem "DM Mono", monospace; }
.opportunity-map-legend span { display: inline-flex; align-items: center; gap: 6px; }
.opportunity-map-legend i { width: 8px; height: 8px; border-radius: 50%; background: var(--blue); }
.opportunity-map-legend i.is-user { border: 2px solid var(--cyan); background: #fff; }
.opportunity-map-legend i.is-unresolved { border: 1px dashed var(--subtle); background: transparent; }
.opportunity-map-results { border-top: 1px solid var(--line); }
.opportunity-map-results summary { width: fit-content; padding: 13px 0 0; color: var(--blue); cursor: pointer; font: .54rem "DM Mono", monospace; }
.opportunity-map-list { display: grid; max-height: 330px; overflow-y: auto; border-top: 1px solid var(--line); scrollbar-color: var(--line-strong) transparent; }
.opportunity-map-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 14px; align-items: center; padding: 12px 2px; border-bottom: 1px solid rgba(170,183,255,.1); }
.opportunity-map-row > div { display: grid; gap: 4px; min-width: 0; }
.opportunity-map-row strong { overflow: hidden; color: #e4e9ff; font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }
.opportunity-map-row small { color: var(--subtle); font: .51rem/1.4 "DM Mono", monospace; }
.opportunity-map-row-focus { color: var(--blue); font: .47rem "DM Mono", monospace; letter-spacing: .07em; text-transform: uppercase; }
@media (max-width: 1180px) { .opportunity-location-form { grid-template-columns: repeat(2,minmax(0,1fr)); }.opportunity-location-submit { align-self: end; }.opportunity-location-choose { grid-column: 1 / -1; }.opportunity-filter-bar { grid-template-columns: minmax(0,1fr) 200px; }.opportunity-view-switcher { grid-column: 1 / -1; width: fit-content; } }
@media (max-width: 1050px) { .goal-compass-target-form { grid-template-columns: minmax(0,1fr) 180px; }.goal-compass-target-form .primary-action, .goal-compass-target-form .text-action { justify-self: start; }.goal-compass-body { grid-template-columns: 1fr; }.goal-fit-lanes { grid-template-columns: 1fr; }.goal-compass-preferences-form { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 780px) { .event-status-panel:has(.opportunity-source-health) { grid-template-columns: 1fr; gap: 14px; }.opportunity-source-health[open] { padding: 13px 0 0; border-top: 1px solid var(--line); border-left: 0; }.goal-compass-panel, .opportunity-map-panel { padding: 16px; }.goal-compass-target-form, .goal-compass-preferences-form { grid-template-columns: 1fr; }.goal-compass-target-form .primary-action, .goal-compass-target-form .text-action { width: 100%; justify-content: center; }.opportunity-location-form { grid-template-columns: 1fr; }.opportunity-location-choose { grid-column: auto; }.opportunity-location-footer { align-items: flex-start; flex-direction: column; }.opportunity-nearby-toggle { white-space: normal; }.opportunity-filter-bar { grid-template-columns: 1fr; }.opportunity-map-stage { height: 260px; min-height: 260px; }.opportunity-map-stage svg { min-height: 260px; }.opportunity-map-hint { max-width: calc(100% - 20px); white-space: normal; text-align: center; }.opportunity-map-row { grid-template-columns: 1fr; }.opportunity-map-row .network-profile-link { justify-self: start; } }
@media (max-width: 780px) { .opportunity-watch-toolbar { align-items: stretch; flex-direction: column; }.opportunity-watch-row { align-items: start; grid-template-columns: 1fr; }.opportunity-coverage-audit-grid, .opportunity-gap-list { grid-template-columns: 1fr; }.opportunity-benchmark-heading { align-items: stretch; flex-direction: column; }.opportunity-benchmark-heading > strong { max-width: none; text-align: left; }.opportunity-benchmark-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }.opportunity-audit-list article { grid-template-columns: minmax(0,1fr) auto; }.opportunity-audit-list article > b { grid-column: 1 / -1; justify-self: start; }.tracker-controls, .tracker-source-check-grid, .tracker-decision-grid { grid-template-columns: 1fr; }.tracker-source-check, .tracker-source-check-question, .tracker-decision-feedback, .tracker-decision-note { grid-column: auto; }.tracker-actions { grid-column: auto; flex-wrap: wrap; }.tracker-learning-summary { align-items: flex-start; flex-direction: column; }.tracker-learning-counts { justify-content: flex-start; }.tracker-decision-actions { flex-wrap: wrap; } }
@media (max-width: 780px) { .brief-opportunity-row { grid-template-columns: 28px minmax(0,1fr) auto; }.brief-opportunity-row .text-action { grid-column: 2; justify-self: start; } }

/* == COLLAPSED RAIL ===================================================
   The expanded toggle owns a reserved internal slot, while the collapsed
   toggle returns to normal flow above the icon column. Labels are already
   display:none here, so the rail does not need to clip the control. */
@media (min-width: 781px) {
  body.rail-collapsed .side-rail { padding: 14px 10px 18px; overflow: visible; align-items: center; gap: 2px; }
  body.rail-collapsed .rail-toggle { position: static; margin: 0 0 10px; opacity: 1; transform: none; }
  body.rail-collapsed .identity-block { justify-content: center; padding: 0 0 14px; margin: 0; }
  body.rail-collapsed .avatar-orbit { margin: 0; }
  /* One square per row, identical box, so the icon column reads as a column. */
  body.rail-collapsed .primary-nav { display: grid; justify-items: center; gap: 4px; width: 100%; }
  body.rail-collapsed .nav-item { display: grid; width: 40px; height: 40px; padding: 0; place-items: center; border-radius: 11px; }
  body.rail-collapsed .rail-label { display: none; }
  body.rail-collapsed .rail-footer { justify-content: center; margin-top: auto; padding-top: 12px; }
}

/* == AGENT HANDOVER ===================================================
   Switching function used to swap surfaces on the same frame, which read as a
   glitch rather than a handover. The studio dips briefly while the incoming
   agent's surface rises into place. */
@keyframes agentHandover { 0% { opacity: 1; } 22% { opacity: .55; } 100% { opacity: 1; } }
@keyframes agentSurfaceIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
#agentSurfaceHost.is-handover { animation: agentHandover .34s var(--ease) both; }
.agent-surface.is-entering { animation: agentSurfaceIn .38s var(--ease-out) both; }
.agent-identity { transition: opacity 200ms var(--ease); }
#agentSurfaceHost.is-handover .agent-identity { animation: riseIn .42s var(--ease-out) both; }
@media (prefers-reduced-motion: reduce) {
  #agentSurfaceHost.is-handover, .agent-surface.is-entering { animation: none; }
}

/* == AGENT WORKSPACE ==================================================
   Every agent function uses one shape, the way an IDE does: the icon rail,
   then the conversation, then what is being worked on, then the panels that
   belong to that function. It fills the viewport and each column scrolls on
   its own, so the page itself never scrolls the conversation out of reach. */
@media (min-width: 1180px) {
  body:not(.rail-collapsed) .app-frame,
  body.rail-collapsed .app-frame { min-height: calc(100vh - 100px); }
  .home-view .advisor-layout {
    display: grid;
    grid-template-columns: minmax(360px, .95fr) minmax(0, 1.35fr) minmax(280px, .7fr);
    gap: 12px;
    align-items: stretch;
    height: calc(100vh - 232px);
    min-height: 560px;
  }
  .home-view .advisor-layout > * { min-height: 0; }
  .home-view .chat-panel { min-height: 0; height: 100%; }
  .home-view .chat-log { max-height: none; min-height: 0; flex: 1; }
  .home-view .advisor-context {
    display: grid; align-content: start; gap: 10px;
    min-height: 0; overflow-y: auto; padding-right: 2px;
    scrollbar-color: var(--line-strong) transparent;
  }
}
.agent-stage { display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow: hidden; }
.agent-stage-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; padding: 14px 16px 12px; border-bottom: 1px solid var(--line); }
.agent-stage-head h2 { margin: 2px 0 0; font-size: .92rem; }
.agent-stage-body { flex: 1; min-height: 0; overflow-y: auto; padding: 14px 16px 18px; scrollbar-color: var(--line-strong) transparent; }
.stage-empty { margin: 0; color: var(--subtle); font-size: .68rem; line-height: 1.6; }
.stage-row { display: grid; grid-template-columns: 18px minmax(0,1fr) auto; gap: 10px; align-items: start; padding: 9px 0; border-bottom: 1px solid var(--line); animation: stepIn .3s var(--ease-out) both; }
.stage-row:last-child { border-bottom: 0; }
.stage-row i { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: rgba(124,108,255,.14); color: var(--accent); font-family: "DM Mono", monospace; font-size: .5rem; font-style: normal; }
.stage-row b { display: block; color: #e6e6ec; font-size: .72rem; font-weight: 600; line-height: 1.4; }
.stage-row small { display: block; margin-top: 2px; color: var(--subtle); font-size: .61rem; line-height: 1.45; }
.stage-row em { color: var(--muted); font-family: "DM Mono", monospace; font-size: .55rem; font-style: normal; white-space: nowrap; }
.stage-section + .stage-section { margin-top: 16px; }
.stage-section > p.eyebrow { margin: 0 0 8px; }
@media (max-width: 1179px) { .agent-stage { min-height: 320px; } }

/* The workspace is the page. The greeting and the function picker compress to
   a single band so the conversation, the stage and the panels get the height,
   instead of the agent starting below the fold. */
@media (min-width: 1180px) {
  .home-view { padding-top: 4px; }
  .home-view .home-greeting { display: flex; align-items: baseline; gap: 12px; margin: 0 0 10px; text-align: left; }
  .home-view .home-greeting-icon { display: none; }
  .home-view .home-greeting h1 { font-size: 1.05rem; margin: 0; }
  .home-view .home-greeting-sub { margin: 0; font-size: .66rem; color: var(--subtle); }
  .home-view .launch-row { margin: 0 0 10px; }
  .home-view .launch-tile { width: 108px; padding: 8px 10px; }
  .home-view .launch-icon { width: 22px; height: 22px; font-size: .7rem; }
  .home-view .agent-studio-header { margin: 0 0 10px; padding: 0; }
  .home-view .agent-studio-header h1 { font-size: 1.02rem; }
  .home-view .advisor-layout { height: calc(100vh - 300px); min-height: 520px; }
}
/* Let the workspace measure itself: the view owns the viewport height and the
   three columns take whatever the band above them leaves, so the layout always
   ends exactly at the bottom edge rather than at a guessed offset. */
@media (min-width: 1180px) {
  .home-view.is-active { display: flex; flex-direction: column; height: calc(100vh - 152px); overflow: hidden; }
  .home-view #agentSurfaceHost { display: flex; flex-direction: column; flex: 1; min-height: 0; }
  .home-view .agent-surface[data-agent-surface="chat"] { display: flex; flex-direction: column; flex: 1; min-height: 0; }
  .home-view .advisor-layout { flex: 1; height: auto; min-height: 0; }
}

/* Size the workspace from the shell instead of guessing how tall the header
   and any banner are: the shell owns the viewport, every wrapper passes the
   remaining height down, and the columns end exactly at the bottom edge. */
@media (min-width: 1180px) {
  /* Only the conversational Home workspace owns one viewport. Long product
     pages (Explore, Profile, Calendar, and the route) use normal document
     flow, so neither the shell nor the workspace can trap their lower cards. */
  body.home-workspace-open .app-shell { display: flex; flex-direction: column; height: calc(100vh - 32px); min-height: 0; }
  body.home-workspace-open .app-frame { flex: 1; min-height: 0; height: auto; }
  body.home-workspace-open .workspace { min-height: 0; overflow: hidden; display: flex; flex-direction: column; }
  body.home-workspace-open .home-view.is-active { height: 100%; min-height: 0; }
  body:not(.home-workspace-open):not(.agent-workspace-open) .app-shell { display: block; height: auto; min-height: calc(100vh - 32px); }
  body:not(.home-workspace-open):not(.agent-workspace-open) .app-frame { min-height: calc(100vh - 100px); height: auto; }
  body:not(.home-workspace-open):not(.agent-workspace-open) .workspace { display: block; min-height: 0; overflow: visible; }
  body:not(.home-workspace-open):not(.agent-workspace-open) .side-rail { position: sticky; top: 0; align-self: start; width: 100%; min-height: calc(100vh - 100px); max-height: 100vh; overflow-y: auto; }
}
@media (min-width: 1180px) { .home-view .advisor-layout { min-height: 380px; } }

/* == STAGE BROWSER ====================================================
   A source the agent cited, or a listing you are tracking, opens beside the
   conversation instead of throwing you into another tab. Many sites refuse to
   be framed, so the preview says so plainly and hands over a real link. */
.stage-browser { display: flex; flex-direction: column; height: 100%; min-height: 0; }
.stage-browser-bar { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; background: rgba(5,7,22,.6); }
.stage-browser-url { flex: 1; min-width: 0; overflow: hidden; color: var(--muted); font-family: "DM Mono", ui-monospace, monospace; font-size: .58rem; text-overflow: ellipsis; white-space: nowrap; }
.stage-browser-frame { flex: 1; min-height: 240px; margin-top: 10px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.stage-browser-note { margin: 10px 0 0; color: var(--subtle); font-size: .63rem; line-height: 1.55; }
.stage-browser-blocked { display: grid; place-items: center; flex: 1; min-height: 240px; margin-top: 10px; padding: 20px; border: 1px dashed var(--line-strong); border-radius: 10px; text-align: center; }
.stage-browser-blocked p { max-width: 340px; margin: 0 0 12px; color: var(--muted); font-size: .68rem; line-height: 1.6; }
.source-preview-button { margin-left: 8px; padding: 2px 8px; border: 1px solid var(--line-strong); border-radius: 999px; background: transparent; color: var(--muted); cursor: pointer; font-family: "DM Mono", ui-monospace, monospace; font-size: .5rem; letter-spacing: .04em; text-transform: uppercase; }
.source-preview-button:hover { border-color: var(--accent); color: var(--text); }
/* On a short window the band above the workspace plus its minimum height no
   longer fit, so the band gives way first -- the conversation matters more
   than the greeting. */
@media (min-width: 1180px) and (max-height: 860px) {
  .home-view .home-greeting { margin-bottom: 6px; }
  .home-view .home-greeting h1 { font-size: .95rem; }
  .home-view .home-greeting-sub { display: none; }
  .home-view .launch-row { margin-bottom: 6px; }
  .home-view .launch-tile { width: 96px; padding: 6px 8px; }
  .home-view .launch-agent { display: none; }
  .home-view .agent-studio-header { margin-bottom: 6px; }
  .home-view .agent-studio-header h1 { font-size: .92rem; }
  .home-view .agent-studio-header .eyebrow { display: none; }
  .home-view .advisor-layout { min-height: 260px; }
}

/* == FILL THE SCREEN ==================================================
   Home and Agent are full-screen workbenches. Scope their compact padding to
   those two body states: this rule used to target every `.workspace`, which
   silently removed the gutters from every ordinary product page. */
@media (min-width: 1180px) {
  body.home-workspace-open .workspace,
  body.agent-workspace-open .workspace { padding: 14px 16px 16px; }
  /* The greeting is a page ornament; the function picker already says where
     you are, and the agent's own header says who is answering. */
  .home-view .home-greeting { display: flex; align-items: baseline; gap: 12px; margin: 10px 12px 8px; }
  .home-view .launch-row { margin: 0 0 8px; }
  .home-view .agent-studio-header { margin: 0 0 8px; }
  .home-view .advisor-layout { gap: 10px; }

  /* One header per panel. When Draft Coach hosts its document in the stage,
     the document panel brings its own heading, so the stage's generic one is
     duplication -- which is exactly what "LIVE DOCUMENT" twice looked like. */
  .agent-stage.is-hosting-document > .agent-stage-body { padding: 0; }
  .agent-stage.is-hosting-document .draft-doc-column { display: flex; flex-direction: column; gap: 10px; height: 100%; min-height: 0; }
  .agent-stage.is-hosting-document .coach-preview-panel { flex: 1; min-height: 0; display: flex; flex-direction: column; }
  .agent-stage.is-hosting-document .coach-preview { flex: 1; min-height: 0; overflow: auto; }
  .agent-stage.is-hosting-document .coach-result-panel { flex: 0 0 auto; max-height: 38%; overflow-y: auto; }
}

/* == SIDE PANEL TABS + COLUMN RESIZERS ================================ */
.workspace-tabbar { display: flex; gap: 4px; margin-bottom: 8px; padding: 3px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.02); }
.workspace-tab { flex: 1; min-height: 28px; padding: 0 8px; border: 0; border-radius: 7px; background: transparent; color: var(--subtle); cursor: pointer; font-family: "DM Mono", ui-monospace, monospace; font-size: .55rem; letter-spacing: .06em; text-transform: uppercase; transition: background 160ms var(--ease), color 160ms var(--ease); }
.workspace-tab:hover { color: var(--text); }
.workspace-tab.is-active { background: rgba(124,108,255,.16); color: #e9e6ff; }
.col-resizer { position: relative; align-self: stretch; width: 8px; cursor: col-resize; border-radius: 4px; transition: background 160ms var(--ease); }
.col-resizer::after { content: ""; position: absolute; top: 50%; left: 50%; width: 2px; height: 34px; transform: translate(-50%, -50%); border-radius: 2px; background: var(--line-strong); transition: background 160ms var(--ease); }
.col-resizer:hover::after, .col-resizer:focus-visible::after { background: var(--accent); }
.col-resizer:focus-visible { outline: 2px solid rgba(124,108,255,.5); outline-offset: 2px; }
@media (max-width: 1179px) { .col-resizer { display: none; } }

/* == IDE SURFACE ======================================================
   The workspace was still a dashboard: rounded cards floating on a page with
   gaps and shadows between them. An IDE reads the way it does because the
   panes are flush and flat, divided by hairlines, with thin headers -- the
   chrome gets out of the way and the content is the interface. */
@media (min-width: 1180px) {
  /* The IDE surface is edge-to-edge only while Home or Agent is active.
     Keeping the body-state qualifier here protects every other route from a
     zero-padding cascade regression. */
  body.home-workspace-open .workspace,
  body.agent-workspace-open .workspace { padding: 0; }
  .home-view.is-active { padding: 0; }

  /* One continuous surface, split by dividers rather than gaps. */
  .home-view .advisor-layout { gap: 0; border-top: 1px solid var(--line); }
  .home-view .advisor-layout > .panel,
  .home-view .advisor-layout > .agent-stage,
  .home-view .advisor-context {
    border-radius: 0;
    border: 0;
    box-shadow: none;
    background: transparent;
  }
  .home-view .advisor-layout > .chat-panel { border-right: 1px solid var(--line); }
  .home-view .advisor-layout > .agent-stage { border-right: 1px solid var(--line); }
  .home-view .advisor-context { padding: 10px 12px; }

  /* Hairline dividers instead of 8px drag bars. */
  .home-view .advisor-layout { grid-template-columns: 1fr 8px 1.35fr 8px .8fr; }
  /* The whole 8px track is the grab target; the hairline is drawn inside it,
     so the divider looks like 1px but can actually be caught by a pointer. */
  .col-resizer { width: 100%; background: transparent; border-radius: 0; }
  .col-resizer::after { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 1px; height: auto; transform: translateX(-50%); background: var(--line); transition: background 160ms var(--ease), width 160ms var(--ease); }
  .col-resizer:hover::after, .col-resizer:focus-visible::after { width: 3px; background: var(--accent); }

  /* Thin pane headers: a label, not a title block. */
  .home-view .agent-stage-head,
  .home-view .panel-heading {
    min-height: 34px; padding: 0 12px; align-items: center;
    border-bottom: 1px solid var(--line); background: rgba(255,255,255,.015);
  }
  .home-view .agent-stage-head h2,
  .home-view .panel-heading h2 { font-size: .7rem; font-weight: 600; margin: 0; }
  .home-view .agent-stage-head .eyebrow,
  .home-view .panel-heading .eyebrow { display: none; }
  .home-view .agent-stage-body { padding: 12px; }

  /* The function switcher is a toolbar, not a row of cards. */
  .home-view .launch-row { gap: 2px; margin: 0; padding: 6px 10px; border-bottom: 1px solid var(--line); }
  .home-view .launch-tile { width: auto; flex-direction: row; gap: 7px; padding: 5px 11px; border-radius: 7px; border-color: transparent; background: transparent; }
  .home-view .launch-tile .launch-icon { width: 16px; height: 16px; border-radius: 5px; font-size: .58rem; }
  .home-view .launch-tile .launch-label { font-size: .68rem; }
  .home-view .launch-tile.is-active { border-color: transparent; background: rgba(124,108,255,.16); }
  .home-view .agent-studio-header { margin: 0; padding: 7px 12px; border-bottom: 1px solid var(--line); }
  .home-view .agent-studio-header h1 { font-size: .78rem; font-weight: 600; }
  .home-view .agent-identity { margin: 0; }
  .home-view .chat-log { padding: 14px 12px; }
  .home-view .chat-composer { padding: 10px 12px 12px; }
}

/* == ORDINARY PAGE RHYTHM =============================================
   Every non-workbench route uses the same bounded content column and vertical
   rhythm. Direct children surrender one-off bottom margins to the parent gap,
   preventing 12px/24px mixtures from making adjacent pages feel unrelated. */
.workspace > .view:not(.home-view) {
  display: grid;
  width: 100%;
  max-width: 1440px;
  margin-inline: auto;
  align-content: start;
  gap: var(--page-section-gap);
}
.workspace > .view:not(.home-view) > * { margin-top: 0; margin-bottom: 0; }
.workspace > .view:not(.home-view) > .view-header { margin-bottom: 8px; }

/* The dashboard's paired cards and priority rows now follow the same spacing
   scale as the page stack instead of retaining the old dense 12px dashboard. */
[data-view="overview"] .dashboard-grid { gap: var(--page-section-gap); }
[data-view="overview"] .student-pulse-panel,
[data-view="overview"] .student-capture-panel,
[data-view="overview"] .journey-panel,
[data-view="overview"] .workspace-readiness-panel { padding: 26px 28px; }
[data-view="overview"] .student-pulse-panel { padding-bottom: 14px; }
[data-view="overview"] .student-pulse-list { gap: 0 28px; margin-top: 18px; }
[data-view="overview"] .student-pulse-item { min-height: 92px; padding: 17px 0; }
[data-view="overview"] .next-panel,
[data-view="overview"] .activity-panel { min-height: 210px; padding: 24px 26px; }

/* Medium screens keep real gutters without spending the desktop amount; the
   existing phone navigation continues to use the compact mobile treatment. */
@media (min-width: 781px) and (max-width: 1179px) {
  :root { --page-gutter-y: 30px; --page-gutter-x: 28px; --page-section-gap: 20px; }
}
@media (max-width: 780px) {
  :root { --page-gutter-y: 22px; --page-gutter-x: 16px; --page-section-gap: 18px; }
  .workspace > .view:not(.home-view) > .view-header { margin-bottom: 2px; }
  [data-view="overview"] .student-pulse-panel,
  [data-view="overview"] .student-capture-panel,
  [data-view="overview"] .journey-panel,
  [data-view="overview"] .workspace-readiness-panel,
  [data-view="overview"] .next-panel,
  [data-view="overview"] .activity-panel { padding: 20px 18px; }
}
.home-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; margin: 12px; }
.home-summary-card { display: grid; align-content: start; gap: 6px; padding: 14px 16px; }
.home-summary-card strong { color: #eef2ff; font-size: .95rem; }
.home-summary-card .body-copy { margin: 0; font-size: .68rem; }
.home-summary-card .text-action { justify-self: start; padding-left: 0; }

/* == HOME LANDING =====================================================
   Home is a landing, not a workspace: one centred column, generous type, and
   the cards sized to be read across the room rather than squeezed into a
   toolbar's leftovers. */
@media (min-width: 1180px) {
  .home-view[data-view="dashboard"] {
    display: flex; flex-direction: column; align-items: center;
    height: auto; min-height: 0; overflow-y: auto; padding: 56px 24px 48px;
  }
  .home-view[data-view="dashboard"] > * { width: 100%; max-width: 980px; }
  .home-view[data-view="dashboard"] .home-greeting {
    display: block; margin: 0 0 6px; text-align: center;
  }
  .home-view[data-view="dashboard"] .home-greeting h1 { font-size: 2.1rem; line-height: 1.2; }
  .home-view[data-view="dashboard"] .home-greeting-sub { display: block; margin-top: 10px; font-size: .85rem; color: var(--muted); }

  /* The picker is the main action on this page, so it gets real presence. */
  .home-view[data-view="dashboard"] .launch-row {
    display: flex; justify-content: center; flex-wrap: wrap; gap: 10px;
    margin: 30px 0 34px; padding: 0; border: 0;
  }
  .home-view[data-view="dashboard"] .launch-tile {
    flex-direction: column; gap: 10px; width: 168px; padding: 20px 14px;
    border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.02);
  }
  .home-view[data-view="dashboard"] .launch-tile .launch-icon { width: 38px; height: 38px; border-radius: 11px; font-size: 1rem; }
  .home-view[data-view="dashboard"] .launch-tile .launch-label { font-size: .88rem; font-weight: 600; }
  .home-view[data-view="dashboard"] .launch-tile .launch-agent { display: block; font-size: .64rem; color: var(--subtle); }
  .home-view[data-view="dashboard"] .launch-tile.is-active { border-color: rgba(124,108,255,.55); background: rgba(124,108,255,.12); }

  .home-view[data-view="dashboard"] .home-summary { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; margin: 0; }
  .home-view[data-view="dashboard"] .home-summary-card { padding: 20px 22px; border: 1px solid var(--line); border-radius: 14px; }
  .home-view[data-view="dashboard"] .home-summary-card strong { font-size: 1.3rem; }
  .home-view[data-view="dashboard"] .home-summary-card .body-copy { font-size: .74rem; line-height: 1.55; }
}

/* Collapsible side panel: the reference column folds away and gives its width
   to the document, with a tab left behind to bring it back. */
.aside-toggle { position: absolute; top: 8px; right: 8px; z-index: 5; display: grid; width: 22px; height: 22px; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; background: var(--midnight); color: var(--muted); cursor: pointer; font-family: "DM Mono", ui-monospace, monospace; font-size: .6rem; line-height: 1; transition: border-color 160ms var(--ease), color 160ms var(--ease); }
.aside-toggle:hover { border-color: var(--accent); color: var(--text); }
@media (min-width: 1180px) {
  [data-view="agent"] .advisor-layout { position: relative; transition: grid-template-columns 220ms var(--ease); }
  [data-view="agent"] .advisor-layout.aside-collapsed { grid-template-columns: 1fr 8px 1.35fr 0 0; }
  [data-view="agent"] .advisor-layout.aside-collapsed > .advisor-context { display: none; }
  [data-view="agent"] .advisor-layout.aside-collapsed > .col-resizer:last-of-type { display: none; }
}
@media (prefers-reduced-motion: reduce) { [data-view="agent"] .advisor-layout { transition: none; } }

/* Home vertical rhythm: every band shares the same column grid, gap and
   spacing, so the page reads as one stack rather than four different layouts
   that happen to sit above each other. */
@media (min-width: 1180px) {
  .home-view[data-view="dashboard"] { padding: 44px 24px 64px; gap: 0; }
  .home-view[data-view="dashboard"] .launch-row { margin: 26px 0 32px; }
  .home-view[data-view="dashboard"] .home-summary,
  .home-view[data-view="dashboard"] .metric-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin: 0 0 14px;
  }
  .home-view[data-view="dashboard"] .metric-grid > * {
    padding: 20px 22px; border: 1px solid var(--line); border-radius: 14px;
  }
  /* The two card rows should look like siblings, not different components. */
  .home-view[data-view="dashboard"] .home-summary-card,
  .home-view[data-view="dashboard"] .metric-grid > * { min-height: 132px; }
  .home-view[data-view="dashboard"] .dashboard-commands { margin: 18px 0 0; padding: 20px 22px; border-radius: 14px; }
  .home-view[data-view="dashboard"] .dashboard-commands .panel-heading { margin: 0 0 14px; padding: 0; border: 0; background: none; min-height: 0; }
  .home-view[data-view="dashboard"] .dashboard-commands .panel-heading h2 { font-size: .95rem; }
  .home-view[data-view="dashboard"] .command-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
  .home-view[data-view="dashboard"] .command-card { padding: 16px 18px; border-radius: 12px; }
}

/* == SCROLLBARS =======================================================
   Only Firefox was styled (scrollbar-color), so on Chrome and Safari every
   scrolling pane fell back to the platform default -- a bright, chunky bar
   against a dark workspace. One treatment for both engines, everywhere. */
* { scrollbar-width: thin; scrollbar-color: var(--line-strong) transparent; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-corner { background: transparent; }
*::-webkit-scrollbar-thumb {
  border: 3px solid transparent;
  border-radius: 999px;
  background-clip: padding-box;
  background-color: var(--line-strong);
}
*::-webkit-scrollbar-thumb:hover { background-color: rgba(124,108,255,.65); }
*::-webkit-scrollbar-thumb:active { background-color: var(--accent); }
/* A pane that scrolls inside a panel gets a slimmer bar so it reads as part
   of the panel rather than a second window edge. */
.chat-log::-webkit-scrollbar,
.agent-stage-body::-webkit-scrollbar,
.advisor-context::-webkit-scrollbar,
.coach-preview::-webkit-scrollbar,
.chat-session-list::-webkit-scrollbar { width: 8px; }
/* The document preview sits on white, so its thumb needs the opposite value. */
.coach-preview::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,.28); }
.coach-preview::-webkit-scrollbar-thumb:hover { background-color: rgba(0,0,0,.42); }
.draft-folder-actions { display: grid; gap: 6px; margin: 0 0 12px; }
.draft-folder-actions .primary-action { width: 100%; justify-content: center; }
.draft-folder-actions .text-action { justify-self: start; padding-left: 0; }
.row-resizer { position: relative; width: 100%; height: 8px; cursor: row-resize; }
.row-resizer::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; transform: translateY(-50%); background: var(--line); transition: background 160ms var(--ease), height 160ms var(--ease); }
.row-resizer:hover::after, .row-resizer:focus-visible::after { height: 3px; background: var(--accent); }
.row-resizer:focus-visible { outline: 2px solid rgba(124,108,255,.5); outline-offset: 2px; }
@media (min-width: 1180px) {
  .agent-stage.is-hosting-document .draft-doc-column { display: grid; grid-template-rows: 1.6fr 8px 1fr; gap: 0; }
  .agent-stage.is-hosting-document .coach-preview-panel,
  .agent-stage.is-hosting-document .coach-result-panel { min-height: 0; overflow: hidden; }
  .agent-stage.is-hosting-document .coach-result-panel { max-height: none; overflow-y: auto; }
}

/* The document panel. Pages are white because a draft is paper -- rendering a
   student's own CV in the app's dark palette makes it look like a different
   document than the one they will submit. Highlights sit above the page as
   positioned overlays rather than wrapping its text, so a mark can cross line
   wraps, table cells and a PDF canvas identically. */
.doc-view { position: relative; display: grid; grid-template-rows: auto minmax(0,1fr); min-height: 0; overflow: hidden; background: rgba(5,7,22,.42); }
.doc-view.is-empty { display: grid; place-items: center; }
.doc-empty-state { display: grid; width: min(430px, calc(100% - 40px)); justify-items: center; padding: 28px; text-align: center; }
.doc-empty-icon { display: grid; width: 42px; height: 42px; place-items: center; border: 1px solid rgba(124,108,255,.38); border-radius: 10px; background: rgba(124,108,255,.11); color: #b5aaff; font-size: 1rem; }
.doc-empty-state strong { margin-top: 13px; color: #f2f0ff; font-size: .82rem; }
.doc-empty-state p { max-width: 390px; margin: 7px 0 14px; color: var(--subtle); font-size: .62rem; line-height: 1.55; }
.doc-empty-state small { margin-top: 8px; color: var(--subtle); font-size: .5rem; }
.doc-empty-upload { min-height: 34px; padding: 0 14px; border: 1px solid rgba(124,108,255,.62); border-radius: 6px; background: rgba(124,108,255,.2); color: #ebe7ff; cursor: pointer; font-size: .6rem; font-weight: 750; }
.doc-empty-upload:hover { background: rgba(124,108,255,.3); }
.doc-toolbar { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-bottom: 1px solid var(--line); background: rgba(10,12,30,.72); }
.doc-toolbar-name { overflow: hidden; color: var(--muted); font-size: .62rem; text-overflow: ellipsis; white-space: nowrap; }
.doc-toolbar-spacer { flex: 1; }
.doc-toolbar-zoom { min-width: 40px; color: var(--subtle); font-family: "DM Mono", monospace; font-size: .55rem; text-align: center; }
/* Centring with align-items clips a page wider than the stage: the overflow
   lands on both sides but the scroll range only covers one, so zooming in cut
   the left edge off for good. Auto margins on the page centre it while leaving
   both overflows reachable. */
.doc-workspace { display: grid; grid-template-columns: minmax(0,1fr); min-height: 0; overflow: hidden; }
.doc-stage { display: flex; flex-direction: column; gap: 12px; min-width: 0; min-height: 0; padding: 14px; overflow: auto; }
.doc-stage > .doc-page { margin-inline: auto; }
.doc-page { position: relative; flex: 0 0 auto; overflow: hidden; border: 1px solid rgba(0,0,0,.5); border-radius: 2px; background: #fff; box-shadow: 0 10px 30px rgba(0,0,0,.45); }
.doc-page.is-image { display: grid; height: auto !important; place-items: center; background: #101014; }
.doc-page.is-image img { display: block; width: 100%; height: auto; }
.doc-page canvas { display: block; }
.doc-annotation-mark,.doc-inline-suggestion,.doc-annotation-connector,.doc-image-annotation {
  --annotation-ink: #5575dc;
  --annotation-soft: rgba(85,117,220,.17);
  --annotation-paper: rgba(246,248,255,.98);
  --annotation-text: #20336f;
}
.tone-strength { --annotation-ink: #16845e; --annotation-soft: rgba(42,192,134,.22); --annotation-paper: rgba(240,255,248,.98); --annotation-text: #0f503c; }
.tone-clarity { --annotation-ink: #496fe5; --annotation-soft: rgba(73,111,229,.19); --annotation-paper: rgba(245,248,255,.98); --annotation-text: #203979; }
.tone-warning { --annotation-ink: #d17a10; --annotation-soft: rgba(242,166,52,.22); --annotation-paper: rgba(255,250,239,.98); --annotation-text: #5c360b; }
.tone-addition { --annotation-ink: #7a53d6; --annotation-soft: rgba(135,92,226,.19); --annotation-paper: rgba(250,247,255,.98); --annotation-text: #422a79; }
.tone-replacement { --annotation-ink: #cf3f59; --annotation-soft: rgba(231,75,101,.17); --annotation-paper: rgba(255,247,249,.98); --annotation-text: #6d2030; }
.tone-correction { --annotation-ink: #e05b37; --annotation-soft: rgba(235,100,64,.16); --annotation-paper: rgba(255,248,244,.98); --annotation-text: #702c1a; }
.doc-annotation-mark { position: absolute; z-index: 4; display: block; box-sizing: border-box; padding: 0; border: 0; border-radius: 2px; background: transparent; color: var(--annotation-ink); cursor: pointer; mix-blend-mode: multiply; pointer-events: auto; }
.doc-annotation-mark.is-highlight { background: linear-gradient(transparent 38%,var(--annotation-soft) 38% 92%,transparent 92%); }
.doc-annotation-mark.is-underline { background: linear-gradient(var(--annotation-ink),var(--annotation-ink)) 0 100% / 100% 2px no-repeat; border-radius: 0; }
.doc-annotation-mark.is-underline.tone-warning { background: radial-gradient(circle at 3px 100%,transparent 2.4px,var(--annotation-ink) 2.6px 3.7px,transparent 3.9px) 0 100% / 7px 4px repeat-x; }
.doc-annotation-mark.is-addition { border-left: 2px solid var(--annotation-ink); border-radius: 2px; background: linear-gradient(transparent 38%,var(--annotation-soft) 38% 92%,transparent 92%); box-shadow: inset 0 -1.5px var(--annotation-ink); }
.doc-annotation-mark.is-addition.is-tail::after { content: "+"; position: absolute; right: -11px; bottom: -5px; display: grid; width: 12px; height: 12px; place-items: center; border-radius: 50%; background: var(--annotation-ink); color: #fff; font: 900 9px/1 system-ui,sans-serif; box-shadow: 0 0 0 2px rgba(255,255,255,.9); }
.doc-annotation-mark.is-change { background: linear-gradient(transparent 16%,var(--annotation-soft) 16% 86%,transparent 86%); }
.doc-annotation-mark.is-change::after { content: ""; position: absolute; top: 54%; right: 0; left: 0; height: 1.5px; background: var(--annotation-ink); transform: rotate(-1deg); }
.doc-annotation-mark.is-circle { margin: -2px; border: 1.5px solid var(--annotation-ink); border-radius: 999px; background: var(--annotation-soft); transform: rotate(-1deg); }
.doc-annotation-mark.is-circle::after { content: "✓"; position: absolute; top: -9px; right: -8px; color: var(--annotation-ink); font: 900 10px/1 system-ui,sans-serif; transform: rotate(8deg); }
.doc-annotation-mark.is-focused { z-index: 7; outline: 3px solid rgba(83,68,236,.52); outline-offset: 3px; }
.doc-inline-suggestion { position: absolute; z-index: 7; display: grid; box-sizing: border-box; align-content: start; gap: 4px; overflow: hidden; padding: 7px 9px; border: 1px solid var(--annotation-ink); border-left-width: 4px; border-radius: 6px; background: var(--annotation-paper); color: var(--annotation-text); box-shadow: 0 5px 17px rgba(16,25,32,.24); cursor: pointer; font-family: "Manrope",system-ui,sans-serif; line-height: 1.25; }
.doc-inline-action { overflow: hidden; font-size: 9px; font-weight: 850; letter-spacing: .015em; text-overflow: ellipsis; white-space: nowrap; }
.doc-inline-detail { display: -webkit-box; overflow: hidden; color: currentColor; font-size: 8px; line-height: 1.3; opacity: .82; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.doc-inline-redline { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 4px; min-width: 0; font-size: 8px; }
.doc-inline-redline del,.doc-inline-redline ins { overflow: hidden; padding: 2px 4px; border-radius: 2px; text-overflow: ellipsis; white-space: nowrap; }
.doc-inline-redline del { background: rgba(220,54,78,.12); color: #8f2637; }.doc-inline-redline ins { background: rgba(14,153,116,.14); color: #08654f; text-decoration: none; }
.doc-inline-apply { justify-self: end; min-height: 20px; padding: 0 6px; border: 1px solid rgba(10,143,121,.45); border-radius: 3px; background: #0a8f79; color: #fff; cursor: pointer; font-size: 8px; font-weight: 800; }
.doc-annotation-connector { position: absolute; z-index: 6; display: block; height: 1px; background: var(--annotation-ink); opacity: .72; pointer-events: none; transform-origin: 0 50%; }
.doc-inline-suggestion.is-focused { z-index: 9; box-shadow: 0 0 0 3px rgba(83,68,236,.32),0 8px 22px rgba(16,25,32,.3); }
.doc-image-annotation { position: absolute; z-index: 4; min-width: 26px; min-height: 26px; padding: 0; border: 3px solid var(--annotation-ink); border-radius: 48%; background: var(--annotation-soft); cursor: pointer; box-shadow: 0 0 0 1px rgba(255,255,255,.8),0 2px 10px rgba(0,0,0,.32); transform: rotate(-1.5deg); }
.doc-image-annotation.is-highlight { border-radius: 4px; }
.doc-image-annotation.is-focused { box-shadow: 0 0 0 4px rgba(124,108,255,.42),0 3px 12px rgba(0,0,0,.35); }
.doc-image-label { position: absolute; top: -10px; left: calc(100% + 7px); width: max-content; max-width: 150px; padding: 4px 6px; border: 1px solid var(--annotation-ink); border-radius: 4px; background: var(--annotation-paper); color: var(--annotation-text); font: 800 9px/1.2 "Manrope",system-ui,sans-serif; box-shadow: 0 3px 10px rgba(0,0,0,.24); transform: rotate(1.5deg); }
.doc-unplaced-note { display: grid; gap: 3px; width: min(540px,calc(100% - 24px)); margin: 0 auto; padding: 9px 11px; border: 1px solid rgba(239,184,102,.28); border-radius: 6px; background: rgba(239,184,102,.07); }
.doc-unplaced-note strong { color: #e7c88d; font-size: .58rem; }.doc-unplaced-note span { color: var(--subtle); font-size: .5rem; line-height: 1.4; }
.doc-page-number { position: absolute; z-index: 3; right: 6px; bottom: 5px; padding: 1px 5px; border-radius: 3px; background: rgba(10,11,29,.62); color: #e8e8f2; font-family: "DM Mono", monospace; font-size: .48rem; pointer-events: none; }
.doc-page-body { padding: 64px; color: #16161a; font-family: "Manrope", system-ui, sans-serif; font-size: 15px; line-height: 1.62; }
.doc-page-body h1, .doc-page-body h2, .doc-page-body h3, .doc-page-body h4 { margin: 0 0 .5em; color: #0d0d10; line-height: 1.24; }
.doc-page-body h1 { font-size: 1.7em; }.doc-page-body h2 { font-size: 1.35em; }.doc-page-body h3 { font-size: 1.14em; }
.doc-page-body p { margin: 0 0 .85em; }
.doc-page-body ul, .doc-page-body ol { margin: 0 0 .85em; padding-left: 1.4em; }
.doc-page-body li { margin-bottom: .3em; }
.doc-page-body blockquote { margin: 0 0 .85em; padding-left: 14px; border-left: 3px solid #d4d4dc; color: #46464f; }
.doc-page-body hr { margin: 1.2em 0; border: 0; border-top: 1px solid #dcdce4; }
.doc-page-body img { max-width: 100%; height: auto; }
.doc-page-body code { padding: 1px 4px; border-radius: 3px; background: #f0f0f5; font-family: "DM Mono", monospace; font-size: .9em; }
.doc-page-body table { width: 100%; border-collapse: collapse; margin: 0 0 .85em; font-size: .86em; }
.doc-page-body th, .doc-page-body td { padding: 5px 8px; border: 1px solid #d8d8e0; text-align: left; vertical-align: top; }
.doc-page-body th { background: #f2f2f7; font-weight: 700; }
.doc-text-layer { position: absolute; top: 0; left: 0; overflow: hidden; opacity: 0; line-height: 1; }
.doc-text-layer span { position: absolute; transform-origin: 0 0; white-space: pre; }
.doc-text-layer.is-inspect-editor { z-index: 2; overflow: visible; opacity: 1; }
.doc-text-layer.is-inspect-editor > span { min-width: 2px; outline: 0; background: #fff; color: #111; caret-color: #6d5cff; }
.doc-text-layer.is-inspect-editor > span:focus { z-index: 3; box-shadow: 0 0 0 2px rgba(109,92,255,.5); }
.doc-page-body.is-inspect-editor { outline: 0; caret-color: #6d5cff; }
.doc-page-body.is-inspect-editor:focus { box-shadow: inset 0 0 0 2px rgba(109,92,255,.24); }

/* Review explanations live beside the canvas, never on top of the uploaded
   document. The colour/gesture key opens by default, remains collapsible, and
   floats over the workspace so it does not permanently steal preview width. */
.doc-review-panel { position: absolute; z-index: 20; top: 10px; right: 12px; width: 112px; max-height: calc(100% - 20px); overflow: hidden; border: 1px solid rgba(124,108,255,.5); border-radius: 7px; background: rgba(15,15,20,.97); color: var(--text); box-shadow: 0 12px 34px rgba(0,0,0,.36); }
.doc-review-panel[open] { width: min(330px,calc(100% - 28px)); overflow: auto; }
.doc-review-summary { display: flex; min-height: 40px; align-items: center; justify-content: center; gap: 8px; padding: 0 10px; cursor: pointer; list-style: none; color: #e6e2ff; font-size: .58rem; font-weight: 780; white-space: nowrap; }
.doc-review-summary::-webkit-details-marker { display: none; }
.doc-review-summary > span { display: inline; }.doc-review-panel[open] .doc-review-summary { justify-content: space-between; border-bottom: 1px solid var(--line); }
.doc-review-summary b { display: grid; min-width: 20px; height: 20px; place-items: center; border-radius: 10px; background: rgba(124,108,255,.18); color: #b9afff; font: 700 .5rem/1 "DM Mono",monospace; }
.doc-review-legend { display: none; grid-template-columns: 1fr 1fr; gap: 5px; padding: 9px; border-bottom: 1px solid var(--line); }.doc-review-panel[open] .doc-review-legend { display: grid; }
.doc-review-key { display: grid; grid-template-columns: 19px 1fr; gap: 0 6px; align-items: center; min-width: 0; padding: 5px 6px; border: 1px solid rgba(255,255,255,.05); border-radius: 5px; background: rgba(255,255,255,.018); }
.doc-review-key i { grid-row: 1 / span 2; display: block; width: 17px; height: 9px; border-bottom: 2px solid var(--annotation-ink); background: var(--annotation-soft); transform: rotate(-2deg); }
.doc-review-key.is-highlight i { border-bottom: 0; background: linear-gradient(transparent 30%,var(--annotation-soft) 30% 92%,transparent 92%); }
.doc-review-key.is-underline i { height: 7px; border-bottom: 2px solid var(--annotation-ink); background: transparent; }
.doc-review-key.is-warning i { height: 7px; border: 0; background: radial-gradient(circle at 3px 100%,transparent 2.4px,var(--annotation-ink) 2.6px 3.7px,transparent 3.9px) 0 100% / 7px 4px repeat-x; }
.doc-review-key.is-addition i { height: 11px; border: 0; border-left: 2px solid var(--annotation-ink); border-bottom: 2px solid var(--annotation-ink); background: var(--annotation-soft); }
.doc-review-key.is-change i { height: 9px; border: 0; background: linear-gradient(transparent 42%,var(--annotation-ink) 42% 58%,transparent 58%),var(--annotation-soft); }
.doc-review-key.is-circle i { height: 11px; border: 2px solid var(--annotation-ink); border-radius: 50%; background: var(--annotation-soft); }
.doc-review-key span { color: #dedee7; font-size: .49rem; font-weight: 720; }.doc-review-key small { overflow: hidden; color: var(--subtle); font-size: .43rem; text-overflow: ellipsis; white-space: nowrap; }
.doc-review-list { display: none; padding: 6px; }.doc-review-panel[open] .doc-review-list { display: grid; gap: 5px; }
.doc-review-item { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; border: 1px solid rgba(255,255,255,.06); border-left: 3px solid var(--annotation-ink); border-radius: 6px; background: rgba(255,255,255,.018); }
.doc-review-item.is-focused { background: var(--annotation-soft); box-shadow: inset 0 0 0 1px var(--annotation-ink); }
.doc-review-open { display: grid; grid-template-columns: 12px minmax(0,1fr); gap: 2px 7px; min-width: 0; padding: 8px; border: 0; background: transparent; color: var(--text); cursor: pointer; text-align: left; }
.doc-review-swatch { grid-row: 1 / span 2; width: 9px; height: 9px; margin-top: 2px; border: 2px solid var(--annotation-ink); border-radius: 50%; background: var(--annotation-soft); }.doc-review-open strong { overflow: hidden; color: #ececf3; font-size: .52rem; text-overflow: ellipsis; white-space: nowrap; }.doc-review-open span { display: -webkit-box; overflow: hidden; color: var(--subtle); font-size: .46rem; line-height: 1.4; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.doc-review-edit { min-height: 25px; margin-right: 7px; padding: 0 8px; border: 1px solid var(--annotation-ink); border-radius: 4px; background: var(--annotation-soft); color: #fff; cursor: pointer; font-size: .48rem; font-weight: 750; }
.doc-tool-button,.doc-download-format { min-height: 27px; border: 1px solid var(--line-strong); border-radius: 5px; background: rgba(255,255,255,.025); color: var(--muted); font-size: .51rem; font-weight: 700; }.doc-tool-button { padding: 0 9px; cursor: pointer; }.doc-tool-button:hover,.doc-tool-button.is-active { border-color: rgba(124,108,255,.62); background: rgba(124,108,255,.14); color: #e9e4ff; }.doc-download-format { max-width: 76px; padding: 0 5px; }
.doc-workspace { position: relative; }.doc-workspace.is-select-tool-active .doc-page { cursor: crosshair; }.doc-workspace.is-select-tool-active .doc-annotation-mark { pointer-events: none; }
.doc-area-selection { position: absolute; z-index: 12; min-width: 3px; min-height: 3px; border: 1.5px solid #6d5cff; border-radius: 2px; background: rgba(109,92,255,.13); box-shadow: 0 0 0 1px rgba(255,255,255,.42) inset; pointer-events: none; }
.doc-selection-question { position: absolute; z-index: 24; right: 16px; bottom: 16px; display: grid; grid-template-columns: minmax(180px,1fr) auto auto; width: min(460px,calc(100% - 32px)); gap: 6px; padding: 8px; border: 1px solid rgba(124,108,255,.55); border-radius: 8px; background: rgba(14,14,20,.97); box-shadow: 0 12px 34px rgba(0,0,0,.42); }.doc-selection-question input { min-width: 0; height: 30px; padding: 0 9px; border: 1px solid var(--line-strong); border-radius: 5px; outline: 0; background: #09090e; color: var(--text); font-size: .57rem; }.doc-selection-question input:focus { border-color: var(--accent); }.doc-selection-question button { min-width: 34px; border: 1px solid rgba(124,108,255,.46); border-radius: 5px; background: rgba(124,108,255,.14); color: #e7e2ff; cursor: pointer; font-size: .53rem; font-weight: 750; }
.doc-note { margin: 0; color: var(--subtle); font-size: .6rem; }
.doc-missing { max-width: 340px; margin: auto; padding: 20px; border: 1px dashed var(--line-strong); color: var(--muted); text-align: center; }
.doc-missing strong { display: block; color: #e3e7fb; font-size: .75rem; }
.doc-missing p { margin: 8px 0 0; font-size: .63rem; line-height: 1.55; }
.doc-page.is-placeholder { width: min(320px, 70%); aspect-ratio: 794 / 1123; height: auto; border: 1px dashed var(--line-strong); background: rgba(255,255,255,.02); box-shadow: none; }

/* The workspace switcher. Home shows the same five functions as a menu of
   cards; here they are a toolbar above the conversation, because inside the
   workspace the question is not "which function exists" but "who is answering
   right now". */
.agent-switch-row { display: flex; flex-wrap: wrap; gap: 2px; margin: 0; padding: 6px 10px; border-bottom: 1px solid var(--line); }
.agent-switch-row .launch-tile { width: auto; flex-direction: row; align-items: center; gap: 7px; padding: 5px 11px; border-color: transparent; border-radius: 7px; background: transparent; animation: none; }
.agent-switch-row .launch-tile:hover { transform: none; box-shadow: none; background: rgba(255,255,255,.04); }
.agent-switch-row .launch-tile .launch-icon { width: 16px; height: 16px; border-radius: 5px; font-size: .58rem; }
.agent-switch-row .launch-tile .launch-label { font-size: .68rem; }
.agent-switch-row .launch-tile .launch-agent { display: none; }
.agent-switch-row .launch-tile.is-active { border-color: transparent; background: rgba(124,108,255,.16); color: #cdc4ff; }
/* Keyboard users get the same signal the cursor gets; without this the home
   row would have no visible state at all now that nothing is preselected. */
.launch-tile:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-color: var(--line-strong); color: var(--text); }

/* Inside the workspace the document panel is the work, so everything else in
   it -- heading, version chips, legend -- takes only the height it needs and
   the document takes the rest. Without this the page was a letterbox strip
   under a stack of chrome taller than the document itself. */
@media (min-width: 1180px) {
  .agent-stage.is-hosting-document .coach-preview-panel { display: flex; flex-direction: column; padding: 12px 14px; }
  .agent-stage.is-hosting-document .coach-preview-panel > .panel-heading,
  .agent-stage.is-hosting-document .draft-version-bar,
  .agent-stage.is-hosting-document .coach-preview { flex: 1 1 auto; min-height: 0; margin-top: 10px; }
  .agent-stage.is-hosting-document .draft-version-bar { margin-top: 10px; }
  /* One scrolling row rather than a block that grows taller than the page it
     is a key for. */
}

@media (min-width: 1180px) {
  /* The standalone page sized this column against the old header stack; in the
     workspace it is the stage, so it takes the stage's height instead of a cap
     that left the document in a 117px letterbox under half a screen of unused
     room. */
  .agent-stage.is-hosting-document .draft-doc-column { max-height: none; height: 100%; grid-template-rows: 2.4fr 8px 1fr; }
  .agent-stage.is-hosting-document > .agent-stage-body { height: 100%; min-height: 0; }
}

@media (min-width: 1180px) {
  /* The viewer's own toolbar already names the open file and its zoom, and the
     stage badge carries the mark count, so the panel heading above it was a
     third copy of the same line taking height from the document. */
  .agent-stage.is-hosting-document .coach-preview-panel > .panel-heading { display: none; }
  .agent-stage.is-hosting-document .draft-version-bar { margin-top: 0; }
  .agent-stage.is-hosting-document .draft-doc-column { grid-template-rows: 3fr 8px 1fr; }
}
.doc-native { width: 100%; height: 100%; min-height: 420px; border: 0; border-radius: 2px; background: #fff; }

@media (min-width: 1180px) {
  /* A function's controls are chrome for the conversation, not something that
     follows it. They are separate sections after the three-column layout in the
     markup, which put them below the fold -- ordering them first pins them
     under the agent switcher where they can actually be reached. */
  .home-view #agentSurfaceHost > .agent-surface:not([data-agent-surface="chat"]),
  .home-view #agentSurfaceHost > .draft-function-strip { order: -1; flex: 0 0 auto; }
  .home-view #agentSurfaceHost > .agent-surface:not([data-agent-surface="chat"]) .function-strip,
  .home-view #agentSurfaceHost > .draft-function-strip { margin: 0 0 10px; padding: 8px 12px; }
  .home-view #agentSurfaceHost .function-hint { margin: 0; font-size: .58rem; }
}
/* A session's name can be a whole sentence, so it has to wrap against the
   count beside it rather than push it off the panel. */
.draft-sessions-panel .panel-heading { align-items: flex-start; gap: 10px; }
.draft-sessions-panel .panel-heading h2 { overflow-wrap: anywhere; font-size: .82rem; line-height: 1.3; }
.draft-sessions-panel .panel-heading .status-badge { flex: 0 0 auto; white-space: nowrap; }
.draft-documents-label { margin: 14px 0 6px; }
/* The partial reply itself owns the caret. It survives unrelated re-renders,
   because the streamed text is stored on the message rather than hidden in a
   one-shot DOM animation. */
.message-answer.is-streaming > :last-child::after { content: "▍"; margin-left: 1px; color: var(--accent); animation: doc-caret 900ms steps(2) infinite; }
@keyframes doc-caret { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .message-answer.is-streaming > :last-child::after { animation: none; } }
/* Said in the panel, not only in the console: the student is looking at words
   where their document should be, and needs to know that is a fallback. */
.doc-fallback-note { flex: 0 0 auto; max-width: 720px; margin: 0; padding: 8px 11px; border: 1px solid rgba(239,184,102,.34); border-radius: 6px; background: rgba(239,184,102,.09); color: var(--amber); font-size: .6rem; line-height: 1.5; }
/* A fenced block is verbatim, so it scrolls inside itself rather than widening
   the conversation column. */
.md-code { max-width: 100%; margin: 8px 0; padding: 10px 12px; overflow-x: auto; border: 1px solid var(--line); border-radius: 6px; background: rgba(5,7,22,.55); }
.md-code code { color: #dfe4fa; font-family: "DM Mono", monospace; font-size: .62rem; line-height: 1.6; white-space: pre; }
.md-quote { margin: 8px 0; padding-left: 11px; border-left: 2px solid var(--line-strong); color: var(--muted); }
.md-table { display: block; max-width: 100%; margin: 8px 0; overflow-x: auto; border-collapse: collapse; font-size: .63rem; }
.md-table th, .md-table td { padding: 5px 9px; border: 1px solid var(--line); text-align: left; vertical-align: top; }
.md-table th { background: rgba(255,255,255,.04); color: var(--text); font-weight: 700; }
/* Draft Coach's own output. In the other functions the document takes the whole
   column, so this row collapses rather than showing a second agent's answer
   under the one the student is talking to. */
.agent-stage.is-hosting-document .coach-result-panel.is-foreign-mode { display: none; }
@media (min-width: 1180px) {
  .agent-stage.is-hosting-document:has(.coach-result-panel.is-foreign-mode) .draft-doc-column { grid-template-rows: 1fr; }
  .agent-stage.is-hosting-document:has(.coach-result-panel.is-foreign-mode) .row-resizer { display: none; }
}

/* The side-panel tab bar has to share its row with the collapse chevron, and
   it was laid out as if it had the whole width: the tabs ran under the button
   and off the end of the column. */
.workspace-tabbar { flex-wrap: wrap; padding-right: 40px; }
.workspace-tab { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* The switcher inside the workspace is a toolbar spanning the stage, not the
   centred menu of cards that home shows. */
#agentSwitchRow.launch-row { max-width: none; }
/* With nothing open the placeholder must fit the panel rather than start it
   scrolling on an empty state. */
.doc-view.is-empty { overflow: hidden; }
.doc-page.is-placeholder { max-height: 100%; }

/* Below the three-column breakpoint the panels stack, and with no height of
   their own the document simply grew to fit every page -- a ten-page PDF turned
   the workspace into 7000px of scroll with the conversation stranded above it.
   Each panel keeps its own scroll instead. */
@media (max-width: 1179px) {
  .doc-view { max-height: 68vh; }
  .agent-stage.is-hosting-document .coach-preview { max-height: 68vh; }
  .agent-stage.is-hosting-document .draft-doc-column { max-height: none; overflow: visible; }
  .home-view .chat-log { max-height: 52vh; }
  .home-view .advisor-context { max-height: 60vh; overflow: auto; }
}
/* The shell fills the window exactly: its own 16px margins are part of the
   height, and the body must not add a second viewport underneath it. */
@media (min-width: 1180px) {
  body.home-workspace-open, body.agent-workspace-open { min-height: 0; }
}

/* Between the phone layout and the full three-column workspace, the panels
   stacked into one long scroll that used about two-thirds of the window's
   width. Two columns fit here: the conversation beside the document, with the
   session's context underneath spanning both. */
@media (min-width: 900px) and (max-width: 1179px) {
  .home-view .advisor-layout {
    display: grid;
    grid-template-columns: minmax(300px, 1fr) minmax(0, 1.25fr);
    grid-auto-rows: minmax(0, auto);
    gap: 12px;
    align-items: stretch;
  }
  .home-view .advisor-layout > .col-resizer { display: none; }
  .home-view .advisor-layout > .advisor-context { grid-column: 1 / -1; max-height: none; }
  .home-view .chat-log { max-height: 46vh; }
  .doc-view, .agent-stage.is-hosting-document .coach-preview { max-height: 56vh; }
}
/* The document panel names the open file in its own heading and its own
   toolbar. The stage heading above it was a third copy, and below the
   three-column breakpoint it showed alongside them with a stale title. */
.agent-stage.is-hosting-document > .agent-stage-head { display: none; }
.agent-stage.is-hosting-document > .agent-stage-body { padding: 0; }

/* The frame was given a guessed height -- the viewport less a fixed 100px --
   while the shell above it already measures what is left after the command bar
   and any banner. When a banner was showing, the guess overshot and the strip
   along the bottom of the workspace was cut off with no way to scroll to it. */
@media (min-width: 1180px) {
  /* Not the shell's whole height -- the command bar and any banner sit above
     it inside that shell, so taking 100% put the bottom of the workspace past
     the window by exactly their height. */
  body:not(.rail-collapsed) .app-frame,
  body.rail-collapsed .app-frame { flex: 1 1 auto; min-height: 0; height: auto; }
  .app-frame > .workspace { min-height: 0; }
}

/* == REPLIT-STYLE AGENT WORKBENCH ====================================
   The agent route is an application surface, not a dashboard card. It owns the
   viewport, keeps chrome to one thin tab bar, and gives the preview every
   remaining vertical pixel. */
.agent-stage-tabs { display: flex; align-self: stretch; gap: 0; min-width: 0; }
.agent-stage-tab { position: relative; display: inline-flex; align-items: center; gap: 7px; min-width: 0; padding: 0 15px; border: 0; border-right: 1px solid var(--line); background: transparent; color: var(--subtle); cursor: pointer; font-size: .66rem; font-weight: 650; white-space: nowrap; }
.agent-stage-tab:hover { background: rgba(255,255,255,.025); color: var(--text); }
.agent-stage-tab.is-active { background: rgba(255,255,255,.035); color: #f4f3ff; }
.agent-stage-tab.is-active::after { content: ""; position: absolute; right: 10px; bottom: -1px; left: 10px; height: 2px; border-radius: 2px 2px 0 0; background: var(--accent); }
.agent-stage-tab span { color: var(--accent); font-family: "DM Mono", monospace; font-size: .68rem; }
.agent-stage-actions { display: flex; align-items: center; gap: 8px; min-width: 0; padding-right: 8px; }
.agent-stage-status { display: none; min-width: 0; }
.stage-new-session { min-height: 27px; padding: 0 9px; border: 1px solid var(--line-strong); border-radius: 5px; background: rgba(255,255,255,.025); color: #d8d7df; cursor: pointer; font-size: .52rem; font-weight: 700; white-space: nowrap; }
.stage-new-session:hover { border-color: rgba(124,108,255,.58); background: rgba(124,108,255,.13); color: #eeeaff; }
.stage-maximize-button { display: grid; width: 28px; height: 28px; place-items: center; border: 1px solid transparent; border-radius: 5px; background: transparent; color: var(--muted); cursor: pointer; font-size: .85rem; }
.stage-maximize-button:hover { border-color: var(--line-strong); background: rgba(255,255,255,.04); color: var(--text); }

.browser-workbench, .artifact-workbench { display: flex; flex-direction: column; width: 100%; height: 100%; min-height: 0; overflow: hidden; background: #101014; }
.browser-toolbar, .artifact-toolbar { display: flex; flex: 0 0 auto; align-items: center; gap: 6px; min-height: 42px; padding: 6px 8px; border-bottom: 1px solid var(--line); background: #151519; }
.browser-control { display: grid; flex: 0 0 29px; width: 29px; height: 29px; place-items: center; border: 1px solid transparent; border-radius: 5px; background: transparent; color: var(--muted); cursor: pointer; text-decoration: none; }
.browser-control:hover:not(:disabled) { border-color: var(--line-strong); background: rgba(255,255,255,.04); color: var(--text); }
.browser-control:disabled { cursor: default; opacity: .3; }
.browser-address, .artifact-title, .artifact-format { height: 29px; min-width: 0; border: 1px solid var(--line-strong); border-radius: 5px; outline: none; background: #0d0d11; color: var(--text); font-size: .62rem; }
.browser-address { flex: 1; padding: 0 11px; font-family: "DM Mono", ui-monospace, monospace; }
.browser-address:focus, .artifact-title:focus, .artifact-format:focus { border-color: var(--accent); box-shadow: 0 0 0 2px rgba(124,108,255,.13); }
.browser-go { min-height: 29px; padding: 0 11px; border: 1px solid rgba(124,108,255,.5); border-radius: 5px; background: rgba(124,108,255,.16); color: #e3dfff; cursor: pointer; font-size: .6rem; font-weight: 750; }
.browser-go:hover:not(:disabled) { background: rgba(124,108,255,.26); }
.browser-go:disabled { cursor: wait; opacity: .6; }
.browser-viewport { flex: 1; min-height: 0; overflow: auto; background: #f7f7f8; color: #17171b; }
.browser-empty { display: grid; width: min(520px, calc(100% - 48px)); min-height: 100%; margin: auto; place-content: center; justify-items: center; padding: 48px 0; text-align: center; }
.browser-empty strong { margin-top: 12px; font-size: 1rem; }
.browser-empty p { max-width: 460px; margin: 8px 0 0; color: #686871; font-size: .7rem; line-height: 1.65; }
.browser-mark { display: grid; width: 48px; height: 48px; place-items: center; border: 1px solid #d8d8df; border-radius: 12px; background: #fff; color: #6854ee; font-size: 1.35rem; box-shadow: 0 8px 24px rgba(0,0,0,.07); }
.browser-spinner { width: 26px; height: 26px; border: 2px solid #d9d8e3; border-top-color: #6854ee; border-radius: 50%; animation: browser-spin .75s linear infinite; }
@keyframes browser-spin { to { transform: rotate(360deg); } }
.browser-error strong { color: #b02a48; }
.browser-suggestions { display: flex; flex-wrap: wrap; justify-content: center; gap: 7px; margin-top: 20px; }
.browser-suggestions button { padding: 7px 10px; border: 1px solid #dedee5; border-radius: 6px; background: #fff; color: #45454d; cursor: pointer; font-size: .58rem; }
.browser-suggestions button:hover { border-color: #8073ec; color: #5947db; }
.browser-reader { width: min(880px, calc(100% - 48px)); margin: 0 auto; padding: 46px 0 72px; }
.browser-visual-page { min-height: 100%; background: #f7f7f8; color: #17171b; }
.browser-visual-page > .browser-reader-head,
.browser-visual-page > .browser-visual-content,
.browser-visual-page > .browser-links { width: min(920px, calc(100% - 48px)); margin-inline: auto; }
.browser-visual-page > .browser-reader-head { padding-top: 38px; }
.browser-visual-content { display: flow-root; padding: 24px 0 38px; }
.browser-visual-content > p { max-width: 760px; margin: 0 0 15px; color: #31313a; font: 400 .74rem/1.72 Georgia, serif; }
.browser-visual-heading { max-width: 820px; margin: 28px 0 10px; color: #17171b; font-family: "Manrope", system-ui, sans-serif; line-height: 1.24; }
.browser-visual-content h2 { font-size: 1.25rem; }.browser-visual-content h3 { font-size: 1rem; }.browser-visual-content h4 { font-size: .84rem; }
.browser-visual-image { width: min(100%, 760px); margin: 24px 0; overflow: hidden; border: 1px solid #dedee5; border-radius: 9px; background: #fff; box-shadow: 0 10px 28px rgba(22,22,32,.08); }
.browser-visual-image img { display: block; width: 100%; max-height: 560px; object-fit: contain; background: #eeeef2; }
.browser-visual-image figcaption { padding: 8px 10px; color: #777781; font-size: .52rem; }
.browser-visual-quote { max-width: 720px; margin: 20px 0; padding: 14px 18px; border-left: 3px solid #7c6cff; background: #efedff; color: #37334d; font: 500 .73rem/1.65 Georgia, serif; }
.browser-visual-code { max-width: 100%; margin: 18px 0; padding: 14px; overflow-x: auto; border: 1px solid #d9d9e1; border-radius: 7px; background: #17171c; color: #ededf2; font: .59rem/1.6 "DM Mono", monospace; }
.browser-visual-table-wrap { max-width: 100%; margin: 20px 0; overflow-x: auto; border: 1px solid #d9d9e1; border-radius: 7px; background: #fff; }
.browser-visual-table { width: 100%; border-collapse: collapse; font-size: .61rem; }
.browser-visual-table th, .browser-visual-table td { padding: 9px 11px; border-right: 1px solid #e2e2e8; border-bottom: 1px solid #e2e2e8; text-align: left; vertical-align: top; }
.browser-visual-table th { background: #efeff4; color: #24242b; font-weight: 750; }
.browser-reader-head { padding-bottom: 24px; border-bottom: 1px solid #ddddE4; }
.browser-domain { margin: 0 0 8px; color: #6b59df; font-family: "DM Mono", monospace; font-size: .56rem; letter-spacing: .06em; text-transform: uppercase; }
.browser-reader h1 { margin: 0; color: #111115; font-size: clamp(1.35rem, 3vw, 2.2rem); line-height: 1.14; }
.browser-description { max-width: 720px; margin: 12px 0 0; color: #55555e; font-size: .78rem; line-height: 1.62; }
.browser-reader-head small { display: block; margin-top: 13px; color: #8a8a93; font-size: .53rem; }
.browser-copy { padding: 24px 0; }
.browser-copy p { margin: 0 0 12px; color: #303039; font-family: Georgia, serif; font-size: .78rem; line-height: 1.72; }
.browser-links { display: grid; gap: 7px; padding-top: 22px; border-top: 1px solid #dddde4; }
.browser-links h2 { margin: 0 0 6px; color: #17171b; font-size: .85rem; }
.browser-link { overflow: hidden; padding: 9px 11px; border: 1px solid #dddde4; border-radius: 6px; background: #fff; color: #5142bf; cursor: pointer; font-size: .63rem; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.browser-link:hover { border-color: #8073ec; background: #f8f7ff; }
.browser-inline-link { display: inline-flex; min-height: 34px; align-items: center; margin: 4px 0 16px; padding: 0 14px; border: 1px solid #6b59df; border-radius: 6px; background: #fff; color: #5142bf; cursor: pointer; font-size: .66rem; font-weight: 760; }
.browser-inline-link:hover { background: #f0edff; }

.browser-tool { min-height: 29px; padding: 0 9px; border: 1px solid var(--line-strong); border-radius: 5px; background: transparent; color: var(--muted); cursor: pointer; font-size: .54rem; font-weight: 720; white-space: nowrap; }
.browser-tool:hover,.browser-tool.is-active { border-color: rgba(124,108,255,.62); background: rgba(124,108,255,.16); color: #eeeaff; }
.browser-viewport { position: relative; }
.browser-live-shell { display: flex; width: 100%; height: 100%; min-height: 0; flex-direction: column; background: #fff; }
.browser-live-note { display: flex; flex: 0 0 auto; align-items: center; gap: 9px; min-height: 34px; padding: 5px 9px; border-bottom: 1px solid #dedee5; background: #f5f4fb; color: #55525f; font-size: .5rem; }
.browser-live-note strong { color: #282331; font-size: .53rem; }.browser-live-note span { flex: 1; line-height: 1.35; }.browser-live-note button { min-height: 23px; padding: 0 7px; border: 1px solid #c9c4ec; border-radius: 4px; background: #fff; color: #5547b5; cursor: pointer; font-size: .49rem; font-weight: 700; }
.browser-live-frame { flex: 1; width: 100%; min-height: 0; border: 0; background: #fff; }
.browser-selection-layer { position: absolute; z-index: 30; inset: 0; overflow: hidden; cursor: crosshair; touch-action: none; background: rgba(109,92,255,.025); }
.browser-area-selection { position: absolute; min-width: 3px; min-height: 3px; border: 2px solid #6d5cff; border-radius: 3px; background: rgba(109,92,255,.14); box-shadow: 0 0 0 1px rgba(255,255,255,.8) inset; pointer-events: none; }
.browser-selection-question { position: absolute; z-index: 2; right: 12px; bottom: 12px; display: grid; grid-template-columns: minmax(180px,1fr) auto auto; width: min(520px,calc(100% - 24px)); gap: 6px; padding: 8px; border: 1px solid rgba(109,92,255,.75); border-radius: 7px; background: rgba(16,16,22,.97); box-shadow: 0 12px 32px rgba(0,0,0,.36); cursor: default; }
.browser-selection-question input { min-width: 0; height: 31px; padding: 0 9px; border: 1px solid #3f3e4c; border-radius: 5px; outline: 0; background: #09090e; color: #f1f1f5; font-size: .57rem; }.browser-selection-question input:focus { border-color: #7c6cff; }.browser-selection-question button { min-width: 35px; border: 1px solid rgba(124,108,255,.48); border-radius: 5px; background: rgba(124,108,255,.15); color: #ece8ff; cursor: pointer; font-size: .54rem; font-weight: 750; }

.artifact-title { flex: 1; padding: 0 10px; }
.artifact-format { flex: 0 0 116px; padding: 0 8px; }
.artifact-view-toggle { display: flex; gap: 4px; }
.artifact-view-toggle .browser-tool:disabled { cursor: not-allowed; opacity: .38; }
.artifact-visual-editor { flex: 1; width: 100%; min-height: 0; border: 0; background: #fff; }
.artifact-editor { flex: 1; width: 100%; min-height: 0; padding: 24px 28px; resize: none; border: 0; outline: none; background: #101014; color: #e8e8ee; font-family: "DM Mono", ui-monospace, monospace; font-size: .7rem; line-height: 1.7; }

.draft-tools-panel { display: grid; gap: 9px; margin: 0 0 12px; padding: 11px; border: 1px solid var(--line); border-radius: 7px; background: rgba(255,255,255,.018); }
.draft-tools-panel .function-control { display: grid; min-width: 0; gap: 5px; }
.draft-tools-panel .function-control select, .draft-tools-panel .function-control input { width: 100%; min-width: 0; }
.draft-tools-panel .function-hint { display: none; }
.draft-tools-panel .coach-google-doc-row { display: grid; gap: 5px; }

@media (min-width: 1180px) {
  body.agent-workspace-open { overflow: hidden; }
  body.agent-workspace-open .app-shell { width: 100%; max-width: none; height: 100vh; min-height: 0; margin: 0; border-width: 0; border-radius: 0; }
  body.agent-workspace-open .app-frame { min-height: 0; }
  body.agent-workspace-open .workspace { padding: 0; }
  [data-view="agent"].is-active { display: flex; flex: 1; flex-direction: column; width: 100%; height: 100%; min-height: 0; padding: 0; overflow: hidden; }
  [data-view="agent"] > .agent-studio-header,
  [data-view="agent"] > .agent-switch-row { display: none !important; }
  [data-view="agent"] #agentSurfaceHost,
  [data-view="agent"] .agent-surface[data-agent-surface="chat"] { display: flex; flex: 1; flex-direction: column; min-height: 0; }
  [data-view="agent"] #agentSurfaceHost > .agent-surface:not([data-agent-surface="chat"]) { display: none !important; }
  [data-view="agent"] .advisor-layout { flex: 1; height: 100%; min-height: 0; border-top: 0; }
  [data-view="agent"] .agent-stage-head,
  [data-view="agent"] .agent-stage.is-hosting-document > .agent-stage-head { display: flex; flex: 0 0 37px; min-height: 37px; padding: 0; align-items: stretch; background: #151519; }
  [data-view="agent"] .agent-stage-body,
  [data-view="agent"] .agent-stage.is-hosting-document > .agent-stage-body { height: auto; min-height: 0; padding: 0; overflow: hidden; }
  [data-view="agent"] .agent-stage.is-hosting-document .draft-doc-column { display: block !important; height: 100%; min-height: 0; }
  [data-view="agent"] .agent-stage.is-hosting-document .coach-preview-panel { display: flex; width: 100%; height: 100%; min-height: 0; padding: 0; border: 0; border-radius: 0; }
  [data-view="agent"] .agent-stage.is-hosting-document .coach-preview-panel > .panel-heading { display: none; }
  [data-view="agent"] .agent-stage.is-hosting-document .draft-version-bar { flex: 0 0 auto; margin: 0; padding: 6px 8px; }
  [data-view="agent"] .agent-stage.is-hosting-document .coach-preview { flex: 1; min-height: 0; margin: 0; border: 0; border-radius: 0; }
  [data-view="agent"] .agent-stage.is-hosting-document .coach-result-panel,
  [data-view="agent"] .agent-stage.is-hosting-document .row-resizer { display: none !important; }
  [data-view="agent"] .advisor-context { border-left: 0; }
  [data-view="agent"] .advisor-layout.stage-maximized { grid-template-columns: 0 0 minmax(0, 1fr) 0 0 !important; }
  [data-view="agent"] .advisor-layout.stage-maximized > .chat-panel,
  [data-view="agent"] .advisor-layout.stage-maximized > .advisor-context,
  [data-view="agent"] .advisor-layout.stage-maximized > .col-resizer,
  [data-view="agent"] .advisor-layout.stage-maximized > .aside-toggle { display: none !important; }
  [data-view="agent"] .advisor-layout.stage-maximized > .agent-stage { grid-column: 3; border: 0; }
}

@media (max-width: 1179px) {
  .agent-stage-head { align-items: stretch; padding: 0; }
  .agent-stage-actions .status-badge { display: none; }
  .agent-stage-tab { min-height: 40px; padding: 0 10px; }
  .agent-stage-status { display: none; }
  .browser-reader { width: min(100% - 30px, 880px); padding-top: 28px; }
  .browser-toolbar { flex-wrap: wrap; }
  .browser-address { order: 2; flex-basis: calc(100% - 52px); }
  .browser-go { order: 2; }
}

/* == WORKSPACE POLISH + ITER WEB AGENT ================================
   Keep the agent route dense like an IDE, turn web search into result cards,
   and keep the page-aware assistant attached to the browser instead of hiding
   it in the conversation. */
.browser-main { display: grid; grid-template-columns: minmax(0, 1fr); flex: 1; min-height: 0; overflow: hidden; }
.browser-main.has-agent { grid-template-columns: minmax(0, 1fr) minmax(250px, 302px); }
.browser-agent-toggle { display: inline-flex; align-items: center; gap: 6px; min-height: 29px; padding: 0 10px; border: 1px solid var(--line-strong); border-radius: 5px; background: transparent; color: var(--muted); cursor: pointer; font-size: .58rem; font-weight: 700; white-space: nowrap; }
.browser-agent-toggle:hover, .browser-agent-toggle.is-active { border-color: rgba(124,108,255,.58); background: rgba(124,108,255,.14); color: #e5e0ff; }
.browser-agent-panel { display: flex; min-width: 0; min-height: 0; flex-direction: column; overflow: hidden; border-left: 1px solid var(--line); background: #111116; color: var(--text); }
.browser-agent-head { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 8px; min-height: 49px; padding: 8px 9px 8px 12px; border-bottom: 1px solid var(--line); }
.browser-agent-identity { display: flex; min-width: 0; align-items: center; gap: 9px; }
.browser-agent-identity > div { display: grid; min-width: 0; gap: 2px; }
.browser-agent-identity strong { overflow: hidden; color: #f0edff; font-size: .67rem; text-overflow: ellipsis; white-space: nowrap; }
.browser-agent-identity small { color: var(--subtle); font-family: "DM Mono", monospace; font-size: .48rem; letter-spacing: .04em; text-transform: uppercase; }
.browser-agent-mark { display: grid; width: 25px; height: 25px; place-items: center; border: 1px solid rgba(124,108,255,.44); border-radius: 7px; background: rgba(124,108,255,.14); color: #a99cff; }
.browser-agent-actions { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 5px; padding: 9px; border-bottom: 1px solid var(--line); }
.browser-agent-actions button, .browser-agent-output-actions button { min-width: 0; min-height: 29px; padding: 4px 6px; border: 1px solid var(--line); border-radius: 5px; background: rgba(255,255,255,.025); color: var(--muted); cursor: pointer; font-size: .52rem; font-weight: 700; line-height: 1.25; }
.browser-agent-actions button:hover:not(:disabled), .browser-agent-actions button.is-active, .browser-agent-output-actions button:hover { border-color: rgba(124,108,255,.5); background: rgba(124,108,255,.12); color: #e5e0ff; }
.browser-agent-actions button:disabled { cursor: wait; opacity: .5; }
.browser-agent-output { flex: 1; min-height: 0; overflow-y: auto; padding: 14px 13px; color: #dcdce4; font-size: .62rem; line-height: 1.62; }
.browser-agent-output > .browser-spinner { display: block; margin: 26px auto 10px; }
.browser-agent-output > strong { display: block; margin: 3px 0 7px; color: #f0f0f4; font-size: .68rem; }
.browser-agent-output p { margin: 0 0 10px; color: #aaaab4; }
.browser-agent-output .md-h { margin: 2px 0 10px; color: #f0f0f4; font-size: .75rem; }
.browser-agent-output ul, .browser-agent-output ol { margin: 0 0 12px; padding-left: 18px; }
.browser-agent-output li { margin-bottom: 7px; }
.browser-agent-error { color: var(--rose) !important; }
.browser-agent-output-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 14px; padding-top: 11px; border-top: 1px solid var(--line); }
.browser-agent-primary { border-color: rgba(124,108,255,.55) !important; background: rgba(124,108,255,.18) !important; color: #e8e3ff !important; }
.browser-agent-ask { display: grid; flex: 0 0 auto; gap: 7px; padding: 9px; border-top: 1px solid var(--line); }
.browser-agent-ask textarea { width: 100%; min-height: 58px; padding: 8px 9px; resize: none; border: 1px solid var(--line-strong); border-radius: 6px; outline: none; background: #0b0b0f; color: var(--text); font-size: .58rem; line-height: 1.45; }
.browser-agent-ask textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 2px rgba(124,108,255,.12); }
.browser-agent-ask .browser-agent-primary { min-height: 30px; border-radius: 6px; cursor: pointer; font-size: .58rem; font-weight: 750; }

.browser-search-page { width: min(940px, calc(100% - 40px)); margin: 0 auto; padding: 28px 0 52px; }
.browser-search-head { padding: 0 2px 18px; border-bottom: 1px solid #dedee5; }
.browser-search-head h1 { margin: 0; color: #15151a; font-size: clamp(1.05rem, 2vw, 1.55rem); line-height: 1.2; }
.browser-search-head small { display: block; margin-top: 9px; color: #85858f; font-size: .52rem; }
.browser-search-results { display: grid; gap: 0; }
.browser-search-card { border-bottom: 1px solid #e2e2e8; }
.browser-search-open { display: grid; grid-template-columns: 32px minmax(0,1fr); gap: 12px; width: 100%; padding: 17px 2px; border: 0; background: transparent; color: #17171c; cursor: pointer; text-align: left; }
.browser-search-open:hover { background: linear-gradient(90deg, transparent, #f0efff 8%, #f0efff 92%, transparent); }
.browser-search-index { padding-top: 2px; color: #8a7bf1; font-family: "DM Mono", monospace; font-size: .52rem; }
.browser-search-copy { min-width: 0; }
.browser-search-copy small { display: block; margin-bottom: 3px; color: #777781; font-size: .5rem; }
.browser-search-copy strong { display: block; color: #3e32a7; font-size: .76rem; line-height: 1.35; }
.browser-search-copy p { margin: 6px 0 0; color: #4d4d56; font-size: .63rem; line-height: 1.55; }
.browser-search-copy em { display: block; margin-top: 7px; overflow: hidden; color: #8b8b94; font-family: "DM Mono", monospace; font-size: .47rem; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.browser-search-empty { margin: 22px 0; padding: 24px; border: 1px dashed #d3d3dc; border-radius: 8px; color: #6d6d77; font-size: .65rem; text-align: center; }

/* The screenshots were using almost a full pane of padding and very loose
   message leading. Tighten the chrome while preserving comfortable reading. */
@media (min-width: 1180px) {
  body.agent-workspace-open .command-bar { grid-template-columns: 48px minmax(0,1fr) auto auto auto auto; min-height: 52px; height: 52px; gap: 7px; padding: 0 12px; }
  body.agent-workspace-open .wordmark { width: 34px; }
  body.agent-workspace-open .wordmark > span:last-child { display: none; }
  body.agent-workspace-open .wordmark-glyph { width: 27px; height: 27px; flex-basis: 27px; }
  body.agent-workspace-open .system-path { font-size: .62rem; }
  body.agent-workspace-open .save-status { margin-right: 8px; font-size: .58rem; }
  body.agent-workspace-open .chat-log { gap: 19px; padding: 20px 22px 16px; scroll-padding: 18px; overscroll-behavior: contain; }
  body.agent-workspace-open .message { gap: 11px; }
  body.agent-workspace-open .message-copy { max-width: 92%; font-size: .75rem; line-height: 1.58; }
  body.agent-workspace-open .prompt-set { padding: 4px 22px 10px; }
  body.agent-workspace-open .chat-composer { padding: 11px 14px 13px; }
  body.agent-workspace-open .chat-utility-bar { min-height: 38px; }
  .browser-reader { width: min(800px, calc(100% - 40px)); padding: 30px 0 52px; }
  .browser-reader-head { padding-bottom: 18px; }
  .browser-reader h1 { font-size: clamp(1.15rem, 2.1vw, 1.75rem); }
  .browser-copy { padding: 18px 0; }
}

@media (max-width: 1380px) {
  .browser-main.has-agent { grid-template-columns: minmax(0, 1fr) 260px; }
  .browser-agent-actions { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .browser-main.has-agent { display: flex; flex-direction: column; }
  .browser-agent-panel { flex: 0 0 min(360px, 46vh); border-top: 1px solid var(--line); border-left: 0; }
  .browser-agent-actions { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .browser-agent-toggle { padding: 0 7px; }
  .doc-inline-suggestion { max-width: 132px; }
}