/* Task-specific comparison, using the existing AgiMo blue palette. */
.model-overview { background:#f3f6fc; }
.focus-panel { padding:24px; border-radius:16px; }
.focus-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:12px; margin:18px 0; }
.focus-task { display:flex; flex-direction:column; gap:9px; padding:16px; border:1px solid #d7e2f1; border-radius:10px; color:#244d80; text-decoration:none; }
.focus-task:hover { background:#edf3fc; }
.focus-task > span { font-size:12px; line-height:1.5; color:#566b85; }
.focus-panel summary { cursor:pointer; color:#244d80; font-size:13px; }
.model-overview .comparison-hero { position:relative; overflow:hidden; background:linear-gradient(118deg,#2b2f8f 0%,#3b4fd6 55%,#2a6fdd 100%); padding-top:50px; padding-bottom:48px; }
.comparison-hero .header-inner { position:relative; z-index:1; }
.comparison-hero h1 { max-width:780px; font-size:clamp(34px,4.1vw,58px); line-height:1.08; color:white; }
.comparison-hero .subtitle { max-width:650px; color:#d7e5fa; }
.comparison-hero .eyebrow { color:#bdd8ff; letter-spacing:.15em; }
.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:25px; }
.hero-actions a { color:#e3eeff; text-decoration:none; font-size:13px; font-weight:600; padding:12px 17px; border:1px solid #7798c4; border-radius:9px; transition:background .2s,transform .2s; }
.hero-actions a:first-child { background:#fff; color:#173f76; border-color:#fff; }
.hero-actions a:hover { transform:translateY(-2px); background:#e7effc; color:#173f76; }
.hero-orbits { position:absolute; width:580px; height:580px; right:-55px; top:-165px; pointer-events:none; }
.hero-orbits span { position:absolute; inset:0; border:1px solid #a8d0ff35; border-radius:50%; }
.hero-orbits span:nth-child(2) { inset:70px; border-style:dashed; }
.hero-orbits span:nth-child(3) { inset:140px; background:radial-gradient(circle,#8bc3ff18,transparent 70%); }
.hero-orbits span:first-child::after { content:""; position:absolute; width:10px; height:10px; border-radius:50%; background:#a1d3ff; top:12%; left:15%; box-shadow:0 0 25px #b3dfff; }
.leaders-section { margin:0 0 34px; scroll-margin-top:90px; }
.leaders-heading { display:flex; justify-content:space-between; align-items:end; gap:20px; }
.overview-kicker { display:block; text-transform:uppercase; letter-spacing:.12em; font-size:10px; font-weight:700; color:#536d92; }
.leaders-heading h2 { font-size:30px; letter-spacing:-.04em; margin:7px 0 0; }
.leaders-heading > a { color:#214f8d; font-size:13px; font-weight:600; text-decoration:none; white-space:nowrap; }
.leaders-note { color:#52647e; font-size:13px; line-height:1.6; max-width:850px; margin:13px 0; }
.leader-scope { display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; font-size:12px; color:#576984; margin:0 0 22px; }
.leader-scope strong { color:#264d80; background:#e4ecf8; border-radius:20px; padding:5px 11px; }
.leader-scope a { color:#315789; text-underline-offset:3px; }
.leader-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; align-items:start; }
.leader-card { min-width:0; padding:22px; background:white; border:1px solid #d7e2f1; border-radius:16px; box-shadow:0 6px 22px #183c7010; position:relative; overflow:hidden; transition:transform .22s,box-shadow .22s,border-color .22s; }
.leader-card::before { content:""; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,#21599c,#8ab9f2); }
.leader-card:hover { transform:translateY(-4px); box-shadow:0 12px 30px #183c701a; border-color:#8aacd6; }
.leader-card-top { display:flex; align-items:center; gap:10px; font-size:10px; color:#63758d; }
.leader-index { font-family:'JetBrains Mono',monospace; font-size:12px; color:#345e93; background:#edf3fb; padding:6px; border-radius:6px; }
.leader-card h3 { font-size:14px; line-height:1.55; margin:15px 0 20px; min-height:66px; }
.leader-card h3 a { color:#3a4f6b; text-decoration:none; }
.leader-card h3 a:hover { text-decoration:underline; }
.leader-identity { min-height:106px; }
.leader-identity > strong { display:block; margin-top:9px; font-size:18px; line-height:1.4; letter-spacing:-.03em; color:#173e72; overflow-wrap:anywhere; }
.leader-measure { margin:12px 0 20px; }
.leader-measure > strong { display:block; font-size:31px; letter-spacing:-.05em; color:#173e72; font-variant-numeric:tabular-nums; }
.leader-measure > span { display:block; font-size:11px; color:#65758b; margin-top:4px; min-height:32px; }
.leader-reference { display:flex; justify-content:space-between; gap:12px; padding:9px 0; border-top:1px solid #edf1f7; font-size:11px; color:#566a85; }
.leader-reference strong { color:#304863; font-variant-numeric:tabular-nums; text-align:right; }
.leader-comparison { margin-top:15px; border-top:1px solid #dce5f1; }
.leader-comparison summary { cursor:pointer; padding:15px 0; font-size:12px; font-weight:600; color:#234e88; }
.comparison-count { display:inline-block; margin-left:6px; padding:2px 6px; background:#edf3fb; border-radius:5px; font-size:10px; }
.leader-comparison ul { list-style:none; margin:0; padding:0; }
.leader-comparison li { display:flex; justify-content:space-between; gap:10px; border-top:1px solid #edf1f7; padding:10px 0; font-size:11px; line-height:1.5; }
.leader-comparison li a { color:#405b7e; overflow-wrap:anywhere; }
.leader-comparison li strong { white-space:nowrap; color:#234e88; }
.leader-evidence { display:block; color:#526e93; font-size:11px; text-decoration:none; padding-top:4px; }
.leader-evidence:hover { text-decoration:underline; }
.leader-empty { padding:26px; border:1px dashed #a8bedb; border-radius:14px; color:#415d80; }
.model-overview .planning-panel { background:linear-gradient(130deg,#fff,#eef4fe); border-radius:16px; }
.model-overview .wheel-node circle,.model-overview .wheel-node text { transition:fill .2s,stroke .2s; }
.model-overview .benchmark-panel { border-radius:16px; box-shadow:0 8px 28px #183c7008; }
.model-overview a:focus-visible,.model-overview summary:focus-visible { outline:3px solid #5084c6; outline-offset:5px; border-radius:4px; }
@media(min-width:901px) and (prefers-reduced-motion:no-preference) {
 .hero-orbits { animation:orbit-drift 4s ease-out both; }
 .leader-card { animation:card-enter .55s ease-out both; animation-delay:calc(var(--card-order) * 75ms); }
 @keyframes orbit-drift { from { transform:rotate(-12deg); opacity:.25; } to { transform:rotate(0); opacity:1; } }
 @keyframes card-enter { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:translateY(0); } }
}
@media(max-width:1100px) { .leader-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .leader-identity { min-height:76px; } .leader-card h3 { min-height:44px; } }
@media(max-width:600px) { .leader-grid { grid-template-columns:1fr; } .leader-card h3,.leader-identity { min-height:0; } .leader-card { padding:22px; } .leader-measure > span { min-height:0; } .comparison-hero .hero-orbits { right:-390px; } .model-overview .comparison-hero { padding-top:32px; padding-bottom:36px; } .leaders-heading h2 { font-size:25px; } }
@media(prefers-reduced-motion:reduce) { .model-overview *, .model-overview *::before,.model-overview *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; } }
/* Main comparison workspace: a dark planning map and a high-contrast data sheet. */
.model-overview { background:#f1f2ef; color:#172b3c; }
.model-overview .comparison-hero { padding:38px 0 32px; background:linear-gradient(118deg,#2b2f8f 0%,#3b4fd6 55%,#2a6fdd 100%); }
.comparison-hero h1 { font-size:clamp(34px,4vw,54px); max-width:900px; letter-spacing:-.045em; }
.comparison-hero .subtitle { max-width:780px; }
.model-overview main { margin-top:24px; }
.model-overview .planning-panel { grid-template-columns:minmax(180px,.8fr) minmax(300px,1.25fr) minmax(260px,1fr); padding:30px; gap:24px; background:linear-gradient(180deg,#eaf2fd,#dfeafc); border:1px solid #c6d8f2; border-radius:22px; box-shadow:0 16px 32px #10273c16; }
.planning-panel .planning-intro h2 { color:#16213a; font-size:28px; line-height:1.2; letter-spacing:-.035em; }
.planning-panel .small,.planning-panel .scope-form label { color:#4a5d7a; }
.planning-panel .cycle-reset { color:#2a5fc4; }
.planning-panel .scope-form select { background:#fff; color:#16213a; border:1px solid #b9cbe8; }
.model-overview .planning-wheel { width:100%; max-width:390px; justify-self:center; }
.wheel-guide { fill:none; stroke:#9fb8dc; stroke-dasharray:1 7; }
.cycle-arc { fill:none; stroke:#3b6fd6; stroke-width:2; stroke-linecap:round; }
.model-overview .wheel-arrows { display:none; }
.model-overview .wheel-center { fill:#2b4fb8; stroke:#2b4fb8; }
.model-overview .wheel-label { fill:#fff; font-size:27px; letter-spacing:-1px; }
.model-overview .wheel-sub { fill:#cfdcf7; }
.model-overview .wheel-node circle { fill:#3b6fd6; stroke:#3b6fd6; stroke-width:1; }
.model-overview .wheel-node text { fill:#fff; }
.model-overview .wheel-node.is-empty circle { fill:#fff; stroke:#9fb8dc; stroke-dasharray:none; }
.model-overview .wheel-node.is-empty text { fill:#4a5d7a; }
.model-overview .wheel-node:hover circle,.model-overview .wheel-node:focus circle,.model-overview .wheel-node.is-selected circle { fill:#16213a; stroke:#16213a; stroke-width:3; }
.model-overview .wheel-node:hover text,.model-overview .wheel-node:focus text,.model-overview .wheel-node.is-selected text { fill:#fff; }
.model-overview .planning-legend { grid-template-columns:1fr; gap:2px; }
.model-overview .planning-legend a { padding:7px 9px; align-items:center; }
.model-overview .planning-legend strong { color:#16213a; font-size:12px; }
.model-overview .planning-legend small { color:#5d6f7c; font-size:10px; }
.model-overview .planning-legend .phase-number { color:#2b4fb8; background:#d7e4fb; }
.model-overview .planning-legend a:hover,.model-overview .planning-legend a.is-active { background:#cfdffa; }
.matrix-panel { padding:28px; border-radius:20px; border:1px solid #d2d9dc; box-shadow:0 8px 24px #17324d08; scroll-margin-top:80px; }
.matrix-panel h2 { font-size:32px; letter-spacing:-.045em; margin:6px 0; }
.matrix-scroll { max-width:100%; overflow:auto; border:1px solid #d8e0e4; border-radius:12px; max-height:650px; scrollbar-color:#6b879c #edf1f3; }
.model-matrix { border-collapse:separate; border-spacing:0; width:100%; font-size:12px; }
.model-matrix th,.model-matrix td { padding:16px 18px; border-bottom:1px solid #dce4e8; border-right:1px solid #e2e8eb; min-width:200px; text-align:left; vertical-align:top; background:#fff; }
.model-matrix thead th { background:#e9eef2; position:sticky; top:0; z-index:2; }
.model-matrix th:first-child { position:sticky; left:0; min-width:220px; max-width:220px; z-index:1; box-shadow:3px 0 5px #17324d09; }
.model-matrix thead th:first-child { z-index:3; }
.model-matrix th a { color:#173952; text-decoration:none; font-weight:600; line-height:1.5; }
.model-matrix code,.model-matrix small { display:block; margin-top:9px; color:#627689; font-size:10px; }
.model-matrix td a { color:#244a6b; font-variant-numeric:tabular-nums; text-decoration:none; }
.model-matrix tbody tr:hover td,.model-matrix tbody tr:hover th { background:#f2f7f8; }
.model-matrix .matrix-winners th,.model-matrix .matrix-winners td { background:#e4f3ee; color:#194c44; }
.matrix-winners strong { display:block; font-size:12px; line-height:1.5; }
.matrix-score { display:block; font-size:25px; font-weight:700; letter-spacing:-.04em; margin-top:10px; }
.model-matrix .matrix-reference th,.model-matrix .matrix-reference td { background:#f4f3ef; color:#64716e; }
.model-matrix .matrix-winning { display:inline-block; background:#d7eee5; color:#145247; border:1px solid #9acbbb; border-radius:5px; padding:4px 8px; font-weight:700; }
.matrix-missing { color:#8b99a3; }
.matrix-key { font-size:11px; color:#617484; line-height:1.8; }
.matrix-protocol { border-top:1px solid #e0e6e9; padding-top:16px; }
.matrix-protocol summary { cursor:pointer; font-size:12px; color:#315675; }
.model-overview .benchmark-panel { padding:28px; border-radius:20px; }
.model-overview .benchmark-group th { background:#e7ecef; }
.model-overview .raw-result { color:#156554; }
@media(prefers-reduced-motion:no-preference) {
 .planning-wheel svg { animation:cycle-arrive 1s ease-out both; }
 .cycle-arc { stroke-dasharray:45; animation:arc-arrive 1.3s ease-out both; }
 .matrix-panel { animation:sheet-arrive .65s ease-out both; }
 @keyframes cycle-arrive { from { opacity:0; transform:scale(.93) rotate(-8deg); } to { opacity:1; transform:none; } }
 @keyframes arc-arrive { from { stroke-dashoffset:45; } to { stroke-dashoffset:0; } }
 @keyframes sheet-arrive { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:none; } }
}
@media(max-width:1050px) { .model-overview .planning-panel { grid-template-columns:1fr 1fr; } .planning-intro { grid-column:1/-1; } .planning-intro .scope-form { max-width:320px; } }
@media(max-width:600px) { .model-overview .planning-panel { padding:22px; grid-template-columns:1fr; gap:16px; } .model-overview .planning-wheel { max-width:300px; } .model-overview .planning-legend { grid-template-columns:1fr 1fr; } .model-overview .planning-legend a { padding:6px 0; } .model-overview .planning-legend strong { font-size:11px; } .matrix-panel,.model-overview .benchmark-panel { padding:18px; } .matrix-panel .section-heading { align-items:start; flex-direction:column; } .model-matrix th:first-child { min-width:135px; max-width:135px; overflow-wrap:anywhere; } .model-matrix th,.model-matrix td { min-width:180px; padding:12px; } .matrix-panel h2 { font-size:27px; } }

.model-matrix th { text-transform:none; letter-spacing:normal; font-size:12px; line-height:1.5; }
.model-matrix thead th:first-child { color:#536b7b; font-size:11px; }
.leader-bar { background:#fff; border:1px solid #d2dedb; border-top:4px solid #36aa90; border-radius:18px; padding:22px 26px 16px; box-shadow:0 10px 28px #17324d0c; }
.leader-bar-heading,.leader-bar-heading > div { display:flex; align-items:center; gap:12px; }
.leader-bar-heading { justify-content:space-between; margin-bottom:20px; }
.leader-bar-heading h2 { margin:0; font-size:23px; letter-spacing:-.035em; }
.leader-bar-heading > a { font-size:12px; color:#265d62; text-decoration:none; }
.leader-bar-symbol { display:grid; place-items:center; width:34px; height:34px; background:#d9eee6; border-radius:10px; color:#176b55; font-size:25px; }
.leader-bar-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:0; }
.leader-bar-item { display:flex; flex-direction:column; gap:10px; padding:8px 20px 12px; border-left:1px solid #dce5e4; text-decoration:none; transition:background .2s; min-width:0; }
.leader-bar-item:first-child { border-left:0; padding-left:0; }
.leader-bar-item:hover { background:#f1f8f4; }
.leader-bar-task { color:#607180; font-size:11px; line-height:1.5; }
.leader-bar-model { color:#163950; font-size:17px; line-height:1.4; letter-spacing:-.025em; overflow-wrap:anywhere; }
.leader-bar-score { margin-top:auto; font-size:30px; font-weight:700; color:#176b55; letter-spacing:-.045em; font-variant-numeric:tabular-nums; }
.leader-bar-score > span { display:block; font-size:10px; color:#61786f; letter-spacing:normal; font-weight:500; margin-top:3px; }
.leader-bar-note { font-size:10px; color:#677c82; line-height:1.6; margin:18px 0 0; }
.model-matrix th[id] { scroll-margin-top:90px; }
.model-matrix th[id]:target { background:#cfeadf; box-shadow:inset 0 3px #24866c; }
@media(prefers-reduced-motion:no-preference) { .leader-bar-item { animation:sheet-arrive .6s ease-out both; animation-delay:calc(var(--leader-order)*70ms); } }
@media(max-width:600px) { .leader-bar { padding:18px; } .leader-bar-grid { grid-template-columns:1fr; } .leader-bar-item,.leader-bar-item:first-child { padding:16px 0; border-left:0; border-top:1px solid #e0e8e4; } .leader-bar-heading h2 { font-size:21px; } }

/* Top models: one card per model, its own accent colour, skill scores per task. Counts and skills, never averages. */
.model-cards { background:#fff; border:1px solid #dfe4ee; border-radius:18px; padding:24px 26px 20px; box-shadow:0 10px 28px #17324d0c; margin-top:26px; }
.model-cards-heading { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; flex-wrap:wrap; margin-bottom:18px; }
.model-cards-heading h2 { margin:2px 0 0; font-size:24px; letter-spacing:-.035em; }
.model-cards-heading .small { max-width:48ch; margin:0; color:#5d6f7c; }
.model-cards-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:18px; }
.model-card { --accent:#2563eb; border:1px solid #e3e7ef; border-top:4px solid var(--accent); border-radius:14px; padding:18px 20px 16px; background:#fff; box-shadow:0 6px 18px #1a2a4a0a; display:flex; flex-direction:column; gap:12px; min-width:0; }
.model-card-top { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; }
.model-card h3 { margin:0; font-size:18px; line-height:1.3; letter-spacing:-.02em; color:#16213a; overflow-wrap:anywhere; }
.model-badge { flex:none; font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#fff; background:var(--accent); border-radius:999px; padding:4px 9px; white-space:nowrap; }
.model-card-count { display:flex; align-items:center; gap:12px; }
.model-card-count strong { font-size:46px; line-height:1; letter-spacing:-.05em; color:#16213a; font-variant-numeric:tabular-nums; }
.model-card-count span { font-size:12px; color:#5d6f7c; line-height:1.45; }
.model-card-count a { color:#16213a; text-decoration:none; font-weight:600; }
.model-card-count a:hover { text-decoration:underline; }
.model-card-tasks { list-style:none; margin:2px 0 0; padding:0; display:grid; gap:10px; }
.model-card-tasks li { display:grid; gap:4px; border-top:1px solid #edf0f5; padding-top:8px; }
.model-task-row { display:flex; justify-content:space-between; gap:10px; align-items:baseline; font-size:12.5px; }
.model-task-row a { color:#2b3d5c; text-decoration:none; }
.model-task-row a:hover { text-decoration:underline; }
.model-task-row strong { font-variant-numeric:tabular-nums; color:#16213a; font-size:14px; }
.model-task-bar { height:6px; border-radius:3px; background:#eceff5; overflow:hidden; }
.model-task-bar span { display:block; height:100%; background:var(--accent); border-radius:3px; opacity:.85; }
.model-card-tasks li.is-lead .model-task-bar span { opacity:1; }
.model-card-tasks .small { color:#6b7b86; font-size:11px; }
@media(prefers-reduced-motion:no-preference) { .model-card { animation:sheet-arrive .6s ease-out both; animation-delay:calc(var(--card-order)*80ms); } }
@media(max-width:600px) { .model-cards { padding:18px; margin-top:18px; } .model-card-count strong { font-size:38px; } }

.model-card-bar { height:8px; border-radius:4px; background:#eceff5; overflow:hidden; }
.model-card-bar span { display:block; height:100%; background:var(--accent); border-radius:4px; }
