@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,400,0,0&display=swap');

:root {
  --sf-bg: #07111c;
  --sf-bg-deep: #040b13;
  --sf-layer-1: #0a1725;
  --sf-layer-2: #0d1c2b;
  --sf-layer-3: #112235;
  --sf-line: rgba(139, 176, 211, .16);
  --sf-line-strong: rgba(111, 183, 255, .34);
  --sf-text: #e8f0f8;
  --sf-soft: #b7c5d5;
  --sf-muted: #7f92a8;
  --sf-blue: #51a8ff;
  --sf-cyan: #28d7e5;
  --sf-violet: #9b82ff;
  --sf-green: #3bd49a;
  --sf-amber: #f5b942;
  --sf-red: #ff6b78;
  --sf-radius-sm: 6px;
  --sf-radius-md: 10px;
  --sf-radius-lg: 16px;
  --sf-max: 1440px;
  --sf-header-h: 64px;
  color-scheme: dark;
}

html { scroll-behavior: smooth; background: var(--sf-bg-deep); }
body.sf-v2 {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(circle at 12% 0%, rgba(40, 215, 229, .055), transparent 28%),
    linear-gradient(180deg, var(--sf-bg) 0%, var(--sf-bg-deep) 100%);
  color: var(--sf-text);
  font-family: Inter, "Noto Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  font-size: 15px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  --lime: var(--sf-blue);
  --agent-accent: var(--sf-blue);
  --notes-accent: var(--sf-blue);
  --notes-ink: var(--sf-text);
  --notes-paper: var(--sf-soft);
  --notes-muted: var(--sf-muted);
  --notes-line: var(--sf-line);
}

body.sf-v2 *, body.sf-v2 *::before, body.sf-v2 *::after { box-sizing: border-box; }
body.sf-v2 a { color: inherit; }
body.sf-v2 code, body.sf-v2 .mono { font-family: "JetBrains Mono", ui-monospace, monospace; }
.material-symbols-rounded { font-family:"Material Symbols Rounded"; font-size: 20px; line-height: 1; font-weight:normal; font-style:normal; letter-spacing:normal; text-transform:none; white-space:nowrap; word-wrap:normal; direction:ltr; -webkit-font-feature-settings:'liga'; -webkit-font-smoothing:antialiased; font-feature-settings:'liga'; font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; }

.sf-skip-link {
  position: fixed; top: 8px; left: 8px; z-index: 1000; transform: translateY(-160%);
  padding: 10px 14px; border-radius: var(--sf-radius-sm); background: var(--sf-blue); color: #03101c !important;
}
.sf-skip-link:focus { transform: translateY(0); }

.sf-global-header {
  position: sticky; top: 0; z-index: 100;
  min-height: var(--sf-header-h); border-bottom: 1px solid var(--sf-line);
  background: rgba(4, 11, 19, .88); backdrop-filter: blur(18px);
}
.sf-header-inner {
  width: min(var(--sf-max), calc(100% - 40px)); min-height: var(--sf-header-h); margin: 0 auto;
  display: grid; grid-template-columns: minmax(210px, 1fr) auto minmax(210px, 1fr); align-items: center; gap: 24px;
}
.sf-brand { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; min-width: 0; }
.sf-brand-mark {
  width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto;
  border: 1px solid var(--sf-line-strong); border-radius: 8px; color: var(--sf-text);
  font: 600 15px/1 "JetBrains Mono", monospace; background: var(--sf-layer-2);
}
.sf-brand-copy { min-width: 0; }
.sf-brand-copy strong { display: block; font-size: 15px; line-height: 1.2; letter-spacing: -.01em; }
.sf-brand-copy small { display: block; margin-top: 2px; color: var(--sf-muted); font: 10px/1.2 "JetBrains Mono", monospace; letter-spacing: .08em; text-transform: uppercase; }
.sf-primary-nav { display: flex; align-items: stretch; height: var(--sf-header-h); }
.sf-primary-nav a {
  position: relative; display: inline-flex; align-items: center; padding: 0 18px;
  color: var(--sf-muted); font-size: 13px; font-weight: 500; text-decoration: none; white-space: nowrap;
}
.sf-primary-nav a:hover, .sf-primary-nav a[aria-current="page"] { color: var(--sf-text); }
.sf-primary-nav a[aria-current="page"]::after { content: ""; position: absolute; left: 18px; right: 18px; bottom: 0; height: 2px; background: var(--sf-blue); }
.sf-header-tools { justify-self: end; display: flex; align-items: center; gap: 10px; }
.sf-system-status {
  display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 0 12px;
  border: 1px solid var(--sf-line); border-radius: 8px; color: var(--sf-soft); text-decoration: none; font-size: 12px;
}
.sf-status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--sf-green); box-shadow: 0 0 10px rgba(59, 212, 154, .55); }
.sf-menu-button { display: none; width: 40px; height: 40px; border: 1px solid var(--sf-line); border-radius: 8px; background: var(--sf-layer-1); color: var(--sf-text); }

.sf-page {
  width: min(var(--sf-max), calc(100% - 40px)); margin: 0 auto; padding: 24px 0 72px;
}
.sf-page-head {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; align-items: end;
  padding: 22px 0 20px; border-bottom: 1px solid var(--sf-line);
}
.sf-eyebrow { color: var(--sf-blue); font: 600 11px/1.3 "JetBrains Mono", monospace; letter-spacing: .1em; text-transform: uppercase; }
.sf-page-head h1 { margin: 8px 0 0; font-size: clamp(32px, 4vw, 56px); line-height: 1.03; letter-spacing: -.045em; }
.sf-page-head p { max-width: 780px; margin: 12px 0 0; color: var(--sf-soft); font-size: 16px; line-height: 1.7; }
.sf-meta-row { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.sf-chip { display: inline-flex; align-items: center; gap: 6px; min-height: 30px; padding: 0 9px; border: 1px solid var(--sf-line); border-radius: 6px; color: var(--sf-muted); font: 11px/1 "JetBrains Mono", monospace; background: rgba(255,255,255,.015); }
.sf-chip[data-tone="green"] { color: var(--sf-green); }
.sf-chip[data-tone="amber"] { color: var(--sf-amber); }
.sf-chip[data-tone="blue"] { color: var(--sf-blue); }

.sf-local-nav { display: flex; gap: 4px; overflow-x: auto; padding: 10px 0; border-bottom: 1px solid var(--sf-line); scrollbar-width: thin; }
.sf-local-nav a { padding: 8px 12px; border-radius: 6px; color: var(--sf-muted); text-decoration: none; font-size: 13px; white-space: nowrap; }
.sf-local-nav a:hover, .sf-local-nav a[aria-current="page"] { color: var(--sf-text); background: var(--sf-layer-2); }

.sf-panel { background: rgba(10, 23, 37, .76); border: 1px solid var(--sf-line); border-radius: var(--sf-radius-md); }
.sf-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 44px; padding: 0 14px; border-bottom: 1px solid var(--sf-line); }
.sf-panel-head h2, .sf-panel-head h3 { margin: 0; font: 600 11px/1.2 "JetBrains Mono", monospace; letter-spacing: .08em; text-transform: uppercase; }
.sf-panel-head a { color: var(--sf-blue); font-size: 12px; text-decoration: none; }
.sf-panel-body { padding: 14px; }

.sf-data-table { width: 100%; border-collapse: collapse; }
.sf-data-table th { padding: 10px 12px; color: var(--sf-muted); font: 500 10px/1.2 "JetBrains Mono", monospace; text-align: left; text-transform: uppercase; border-bottom: 1px solid var(--sf-line); }
.sf-data-table td { padding: 11px 12px; border-bottom: 1px solid var(--sf-line); color: var(--sf-soft); font-size: 13px; }
.sf-data-table tr:last-child td { border-bottom: 0; }
.sf-data-table strong { color: var(--sf-text); }

.sf-status { display: inline-flex; align-items: center; gap: 6px; color: var(--sf-soft); font-size: 12px; }
.sf-status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.sf-status.ok { color: var(--sf-green); }
.sf-status.warn { color: var(--sf-amber); }
.sf-status.fail { color: var(--sf-red); }

.sf-section { padding: 28px 0; border-bottom: 1px solid var(--sf-line); }
.sf-section:last-child { border-bottom: 0; }
.sf-section-title { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 16px; }
.sf-section-title h2 { margin: 0; font-size: clamp(22px, 2.6vw, 34px); letter-spacing: -.03em; }
.sf-section-title p { max-width: 620px; margin: 0; color: var(--sf-muted); }

.sf-footer { border-top: 1px solid var(--sf-line); color: var(--sf-muted); }
.sf-footer-inner { width: min(var(--sf-max), calc(100% - 40px)); margin: 0 auto; min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 20px; font-size: 12px; }
.sf-footer a { color: var(--sf-soft); text-decoration: none; }

body.sf-v2 > .topbar, body.sf-v2 > .notes-grain, body.sf-v2 > .manual-grain,
body.sf-v2 > .noise, body.sf-v2 > .kko-grid-bg, body.sf-v2 > .ambient,
body.sf-v2 .shell > header, body.sf-v2 > footer:not(.sf-footer),
body.sf-v2 > .footer:not(.sf-footer), body.sf-v2 > .notes-footer { display: none !important; }

:focus-visible { outline: 2px solid var(--sf-blue); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; } }

@media (max-width: 980px) {
  .sf-header-inner { grid-template-columns: 1fr auto; }
  .sf-primary-nav {
    display: none; position: absolute; top: var(--sf-header-h); left: 0; right: 0; height: auto;
    padding: 10px 20px 18px; background: rgba(4,11,19,.98); border-bottom: 1px solid var(--sf-line);
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  .sf-primary-nav[data-open="true"] { display: grid; }
  .sf-primary-nav a { min-height: 44px; padding: 0 12px; border-bottom: 1px solid var(--sf-line); }
  .sf-primary-nav a[aria-current="page"]::after { display: none; }
  .sf-header-tools { grid-column: 2; grid-row: 1; }
  .sf-system-status { display: none; }
  .sf-menu-button { display: grid; place-items: center; }
}

@media (max-width: 640px) {
  :root { --sf-header-h: 58px; }
  .sf-header-inner, .sf-page, .sf-footer-inner { width: min(100% - 28px, var(--sf-max)); }
  .sf-brand-copy small { display: none; }
  .sf-page { padding-top: 12px; }
  .sf-page-head { grid-template-columns: 1fr; align-items: start; padding: 18px 0; }
  .sf-page-head h1 { font-size: clamp(34px, 11vw, 44px); }
  .sf-meta-row { justify-content: flex-start; }
  .sf-section-title { display: grid; gap: 8px; }
  .sf-footer-inner { min-height: 92px; padding: 18px 0; flex-direction: column; align-items: flex-start; justify-content: center; }
  .sf-data-table { min-width: 680px; }
  .sf-table-scroll { overflow-x: auto; }
}

/* Existing content adapters: preserve legacy content while moving it into V2 grammar. */
body.sf-v2 .agents-page, body.sf-v2 .kko-wrap { color: var(--sf-text); }
body.agents-page.sf-v2 main,
body.sf-v2 .kko-wrap,
body.sf-v2 .shell,
body.sf-v2 .app-shell,
body.sf-v2 .notes-manual,
body.sf-v2 > main:not(.sf-page) {
  width: min(var(--sf-max), calc(100% - 40px)); max-width: none; margin: 0 auto; padding: 24px 0 72px;
}

body.agents-page.sf-v2 .hero,
body.sf-v2 .notes-hero,
body.sf-v2 .module-hero {
  min-height: 0; margin: 0; padding: 24px 0; border-bottom: 1px solid var(--sf-line);
  background: transparent; box-shadow: none;
}
body.agents-page.sf-v2 .hero { grid-template-columns:minmax(0,1fr) minmax(360px,.72fr); }
body.agents-page.sf-v2 .hero h1, body.sf-v2 .notes-hero h1, body.sf-v2 .module-hero h1 {
  font-family: Inter, "Noto Sans SC", "PingFang SC", sans-serif; font-size:clamp(38px,4vw,58px); line-height:1.03; letter-spacing:-.045em;
}
body.agents-page.sf-v2 .hero .lead, body.sf-v2 .notes-lead { max-width:760px; color:var(--sf-soft); font-size:16px; }
body.agents-page.sf-v2 .section, body.sf-v2 .notes-section { padding: 30px 0; border-bottom:1px solid var(--sf-line); }
body.agents-page.sf-v2 .section-head h2 { font-size:clamp(28px,3.2vw,42px); line-height:1.08; letter-spacing:-.035em; }
body.agents-page.sf-v2 .eyebrow, body.agents-page.sf-v2 .section-label, body.sf-v2 .notes-kicker, body.sf-v2 .section-label { color:var(--sf-blue); }
body.agents-page.sf-v2 .agent-panel,
body.agents-page.sf-v2 .capability-panel,
body.agents-page.sf-v2 .shortcut-panel,
body.agents-page.sf-v2 .playbook-panel,
body.agents-page.sf-v2 .governance-panel,
body.agents-page.sf-v2 .console-card,
body.sf-v2 .notes-boundary {
  border-radius:var(--sf-radius-md); border-color:var(--sf-line); background:rgba(10,23,37,.7); box-shadow:none; transform:none;
}
body.agents-page.sf-v2 .capability-grid { gap:12px; }
body.agents-page.sf-v2 .capability-panel { padding:16px; }
body.agents-page.sf-v2 .capability-panel h3 { margin:0; font-size:15px; }
body.agents-page.sf-v2 .capability-panel p { font-size:13px; }
body.agents-page.sf-v2 .detail-list li { font-size:12px; }

body.sf-v2 .kko-wrap { padding-top:24px; }
body.sf-v2 .cockpit { grid-template-columns:220px minmax(0,1fr)260px; gap:12px; }
body.sf-v2 .panel { border-radius:var(--sf-radius-md); border-color:var(--sf-line); background:rgba(10,23,37,.76); box-shadow:none; }
body.sf-v2 .panel::before { display:none; }
body.sf-v2 .hero-panel { min-height:0; padding:22px; }
body.sf-v2 .hero-title { margin:12px 0; font-size:clamp(38px,4.4vw,60px); }
body.sf-v2 .hero-title span { color:var(--sf-text); background:none; -webkit-text-fill-color:initial; }
body.sf-v2 .side { padding:14px; }
body.sf-v2 .section { padding:30px 0; }
body.sf-v2 .flow-board, body.sf-v2 .agent-grid { gap:10px; }
body.sf-v2 .flow-card, body.sf-v2 .agent-card, body.sf-v2 .map-card, body.sf-v2 .review-card { border-radius:var(--sf-radius-md); }

body.sf-v2 .shell { color:var(--sf-text); }
body.sf-v2 .shell { --accent:var(--sf-blue); --panel:var(--sf-layer-1); --panel2:var(--sf-layer-2); --ink:var(--sf-text); --dim:var(--sf-muted); --line:var(--sf-line); }
body.sf-v2 .shell #app { margin-top:0; }
body.sf-v2 .shell section, body.sf-v2 .shell .event-card, body.sf-v2 .shell .market-card, body.sf-v2 .shell .macro-card,
body.sf-v2 .shell .oat-panel, body.sf-v2 .shell .commentary-card { border-radius:var(--sf-radius-md); box-shadow:none; }
body.sf-v2 .trading-module-nav { position:sticky; top:var(--sf-header-h); z-index:20; padding:10px 0; background:rgba(4,11,19,.94); border-bottom:1px solid var(--sf-line); }
body.sf-v2 .trading-module-nav a { min-height:34px; border-radius:6px; }
body.sf-v2 .trading-intro { margin:20px 0 24px; padding:0; overflow:hidden; border:1px solid var(--sf-line); border-radius:var(--sf-radius-md); background:rgba(10,23,37,.76); }
body.sf-v2 .trading-intro-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(360px,.82fr); }
body.sf-v2 .trading-intro-copy, body.sf-v2 .trading-workflows { padding:18px 20px; }
body.sf-v2 .trading-workflows { border-left:1px solid var(--sf-line); }
body.sf-v2 .trading-intro-label { margin-bottom:9px; color:var(--sf-blue); font:600 10px/1.3 "JetBrains Mono",monospace; letter-spacing:.1em; }
body.sf-v2 .trading-intro h1 { margin:0 0 8px; color:var(--sf-text); font-size:clamp(26px,2.5vw,36px); letter-spacing:-.035em; }
body.sf-v2 .trading-intro-text { color:var(--sf-soft); font-size:13px; line-height:1.7; }
body.sf-v2 .trading-workflow-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; border:1px solid var(--sf-line); background:var(--sf-line); }
body.sf-v2 .trading-workflow-grid span { min-width:0; padding:8px 9px; background:var(--sf-layer-1); color:var(--sf-soft); font:11px/1.35 "JetBrains Mono",monospace; overflow-wrap:anywhere; }
body.sf-v2 .trading-intro .trading-module-nav { position:sticky; margin:0; padding:8px 12px; }

body.sf-v2 .app-shell { display:block; }
body.sf-v2 .system-rail { display:none; }
body.sf-v2 .content-plane { max-width:none; }
body.sf-v2 .content-plane .hero { grid-template-columns:minmax(0,1fr) 320px; gap:12px; }
body.sf-v2 .content-plane .hero-card, body.sf-v2 .content-plane .panel, body.sf-v2 .talos-panel,
body.sf-v2 .status-live-card, body.sf-v2 .talos-module { border-radius:var(--sf-radius-md); background:rgba(10,23,37,.76); box-shadow:none; border-color:var(--sf-line); }
body.sf-v2 .content-plane .hero h1 { font-size:clamp(38px,4vw,58px); line-height:1.03; }
body.sf-v2 .status-live-grid { gap:12px; }

body.sf-v2 .notes-manual { color:var(--sf-text); }
body.sf-v2 .notes-hero { grid-template-columns:160px minmax(0,1fr) 320px; min-height:0; }
body.sf-v2 .notes-heading h2, body.sf-v2 .notes-crosslinks h2 { font-size:clamp(26px,3vw,40px); }
body.sf-v2 .notes-list a { border-color:var(--sf-line); background:transparent; }
body.sf-v2 .notes-list a:hover { background:var(--sf-layer-2); }
body.agents-page.sf-v2 .button.primary { background:var(--sf-blue); color:#04101b; border-color:var(--sf-blue); }
body.agents-page.sf-v2 .button.primary:hover { background:#79bbff; }

@media(max-width:900px){
  body.agents-page.sf-v2 .hero, body.sf-v2 .cockpit, body.sf-v2 .content-plane .hero, body.sf-v2 .notes-hero, body.sf-v2 .trading-intro-grid { grid-template-columns:1fr; }
  body.sf-v2 .trading-workflows { border-left:0; border-top:1px solid var(--sf-line); }
  body.sf-v2 .cockpit .right { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:640px){
  body.agents-page.sf-v2 main, body.sf-v2 .kko-wrap, body.sf-v2 .shell, body.sf-v2 .app-shell, body.sf-v2 .notes-manual, body.sf-v2 > main:not(.sf-page) { width:calc(100% - 28px); padding-top:14px; }
  body.sf-v2 .cockpit .right { grid-template-columns:1fr; }
  body.sf-v2 .trading-module-nav { top:var(--sf-header-h); }
  body.sf-v2 .content-plane .hero h1, body.sf-v2 .notes-hero h1, body.agents-page.sf-v2 .hero h1 { font-size:38px; }
  body.sf-v2 .notes-index { display:none; }
  body.sf-v2 .trading-workflow-grid { grid-template-columns:1fr; }
  body.sf-v2 .hero > *,
  body.sf-v2 .key-table-wrap { min-width:0; max-width:100%; }
  body.sf-v2 .security-note code,
  body.sf-v2 .prompt-card code { display:inline-block; max-width:100%; overflow-wrap:anywhere; word-break:break-all; vertical-align:bottom; }
}

/* Unified display typography: compact enough for data-dense Chinese/English surfaces. */
body.sf-v2 h1,
body.sf-v2 h2 {
  text-wrap: balance;
}

body.sf-v2 .sf-page-head h1,
body.agents-page.sf-v2 .hero h1,
body.sf-v2 .content-plane .hero h1,
body.sf-v2 .notes-hero h1,
body.sf-v2 > main:not(.sf-page) .hero h1,
body.sf-v2 .article-wrap h1 {
  font-family: Inter, "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: clamp(40px, 3.5vw, 50px);
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: -.035em;
}

body.sf-v2 .hero-title,
body.sf-v2 .talos-hero h1 {
  font-family: Inter, "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: clamp(38px, 3.25vw, 48px) !important;
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: -.035em;
}

body.sf-v2 .hero-title span {
  display: inline;
}

body.sf-v2 .trading-intro h1 {
  line-height: 1.1;
}

body.agents-page.sf-v2 .section-head h2,
body.sf-v2 .notes-manual h2,
body.sf-v2 .notes-heading h2,
body.sf-v2 .notes-crosslinks h2 {
  font-size: clamp(26px, 2.25vw, 32px);
  font-weight: 600;
  line-height: 1.16;
  letter-spacing: -.025em;
}

body.sf-v2 .section-title h2 {
  font-size: clamp(24px, 2vw, 30px);
  line-height: 1.18;
  letter-spacing: -.02em;
}

@media(max-width:640px){
  body.sf-v2 .sf-page-head h1,
  body.agents-page.sf-v2 .hero h1,
  body.sf-v2 .content-plane .hero h1,
  body.sf-v2 .notes-hero h1,
  body.sf-v2 > main:not(.sf-page) .hero h1,
  body.sf-v2 .article-wrap h1,
  body.sf-v2 .hero-title,
  body.sf-v2 .talos-hero h1 {
    font-size: 36px !important;
    line-height: 1.1;
    letter-spacing: -.025em;
  }

  body.agents-page.sf-v2 .section-head h2,
  body.sf-v2 .notes-manual h2,
  body.sf-v2 .notes-heading h2,
  body.sf-v2 .notes-crosslinks h2,
  body.sf-v2 .section-title h2 {
    font-size: 26px;
    line-height: 1.2;
  }
}
