/* Roadmap section — source: specs/V1-ROADMAP.md */
function CrtRoadmap() {
  const t = window.TWEAKS;
  const bp = window.useBreakpoint();

  const versions = [
    {
      v: 'v0.1.x',
      label: 'HOTFIX WAVE',
      tagline: 'Stability first.',
      color: t.amber,
      status: 'SHIPPED',
      bullets: [
        'P1 bugs from first-wave reviews and feedback loop',
        'Crash clusters, progression blockers, data-loss bugs',
        'Conservative balance tuning based on early telemetry',
      ],
    },
    {
      v: 'v0.2',
      label: 'FIRST DROP',
      tagline: 'Your first Legendary changes everything.',
      color: t.accentCyan,
      status: 'SHIPPED',
      bullets: [
        'Weapons drop as loot — Common, Rare, Epic, Legendary tiers with affixes',
        'Stash UI in Break Room — compare, equip, persist between runs',
        'Loadout cap: choose 3 weapon slots before each run',
      ],
    },
    {
      v: 'v0.3',
      label: 'TREE',
      tagline: 'Pick your path. Respec is free.',
      color: t.accentMagenta,
      status: 'SHIPPED',
      bullets: [
        'Skill Tree — 30 nodes across 3 branches, rings unlock by level',
        'Epic Affixes — 24-modifier pool, weapons can roll Epic tier',
        'XP/Level loop — GP converts to XP, grants Skill Points per level',
      ],
    },
    {
      v: 'v0.4',
      label: 'GEAR',
      tagline: 'Equip the build. Live the faction.',
      color: '#c9b896',
      status: 'SHIPPED',
      bullets: [
        'Apron + Portafilter slots added — 5-slot loadout total',
        'Faction 3-piece set bonuses — Espresso Syndicate, Oat Collective, Cold Brew Cartel',
        'Legendary unique modifiers active — 30-affix pool complete',
      ],
    },
    {
      v: 'v0.5',
      label: 'THE GRIND',
      tagline: 'Endless floors. Seeded days. No excuses.',
      color: t.accentCyan,
      status: 'SHIPPED',
      bullets: [
        'Endless Mode — The Grind: infinite floor escalation with modifier stacking',
        'Daily Challenge: seeded run, same for every player, resets 00:00 UTC',
        'GP multiplier scales per floor — ×10 cap at floor 30+',
      ],
    },
    {
      v: 'v0.6',
      label: 'COLD STORAGE',
      tagline: 'The building goes deeper.',
      color: '#6fa8cc',
      status: 'SHIPPED',
      bullets: [
        'Floor 4 — Cold Storage: 1.2× caffeine drain, new enemies Auditor + Concentrate + Shelfwalker',
        '7 new Cold Storage affixes (4 common, 3 rare) added to loot pool',
      ],
    },
    {
      v: 'v0.7',
      label: 'THE BLOOM WORKS',
      tagline: 'Sixty years of continuous bloom. Unattended.',
      color: '#a88250',
      status: 'SHIPPED',
      bullets: [
        'Floor 5 — The Bloom Works: pre-Guild fermentation chambers, The Dregs, The Assessor',
        'The Sommelier boss — Senior Sensory Director, in continuous session since Year 3',
      ],
    },
    {
      v: 'v0.8',
      label: 'THE PROPAGATION VAULTS',
      tagline: 'The Cultivator has been tending something here for sixty years.',
      color: '#7dc985',
      status: 'SHIPPED',
      bullets: [
        'Floor 7 — The Propagation Vaults: The Tendril, The Misting',
        'The Cultivator boss — Chief Cultivation Engineer, in continuous session since Year Zero',
      ],
    },
    {
      v: 'v0.9',
      label: 'PLATFORM PASS',
      tagline: 'Linux. Rumble. Mods.',
      color: '#c9b896',
      status: 'SHIPPED',
      bullets: [
        'Linux native export — full platform support (Win / Mac / Linux)',
        'Steam Workshop mod support + controller rumble',
      ],
    },
    {
      v: 'v1.0',
      label: 'OUT OF EARLY ACCESS',
      tagline: 'Out of EA. Builds that matter.',
      color: t.amber,
      status: 'SHIPPED',
      bullets: [
        '4 playable baristas — The Replacement + The Roasted now unlocked',
        'Full localization: EN + DE + PT-BR + KO + JP (167 strings, all v0.4–v0.9 content)',
        '15 achievements · balance pass on all v0.2–v0.9 player data',
      ],
    },
  ];

  const statusColor = { SHIPPED: t.accentCyan, SHIPPING: t.accentCyan, NEXT: t.amber, PLANNED: '#a88250', ENDGAME: t.accentMagenta };

  return (
    <CrtSection id="roadmap" tag="S08 :: ROADMAP" title="EA → V1.0 · FULL RELEASE SHIPPED">
      <div style={{ marginBottom: 20, fontSize: 13, color: '#a88250', letterSpacing: '0.06em' }}>
        <Dim>&gt;</Dim> No dates. Each version ships when its acceptance criteria are met.
      </div>
      <div style={{ display: 'flex', flexDirection: 'column', gap: 12 }}>
        {versions.map((ver, i) => (
          <div key={ver.v} style={{
            border: `1px solid rgba(255,179,71,${ver.status === 'SHIPPING' ? 0.5 : 0.22})`,
            background: ver.status === 'SHIPPING' ? 'rgba(255,179,71,0.05)' : '#050302',
            display: 'grid',
            gridTemplateColumns: bp.isMobile ? '1fr' : '200px 1fr',
            gap: 0,
            overflow: 'hidden',
          }}>
            {/* Left: version badge */}
            <div style={{
              padding: bp.isMobile ? '16px 18px 8px' : '22px 24px',
              borderRight: bp.isMobile ? 'none' : `1px solid rgba(255,179,71,0.2)`,
              borderBottom: bp.isMobile ? `1px solid rgba(255,179,71,0.2)` : 'none',
              display: 'flex',
              flexDirection: 'column',
              justifyContent: 'space-between',
              gap: 8,
            }}>
              <div>
                <div style={{ fontFamily: '"Oswald",sans-serif', fontSize: 22, color: ver.color, letterSpacing: '0.04em', lineHeight: 1 }}>{ver.v}</div>
                <div style={{ fontSize: 11, color: '#6e5a44', letterSpacing: '0.18em', marginTop: 4, textTransform: 'uppercase' }}>{ver.label}</div>
              </div>
              <div style={{ fontSize: 10, color: statusColor[ver.status] || '#a88250', letterSpacing: '0.2em', padding: '3px 8px', border: `1px solid ${statusColor[ver.status] || '#a88250'}33`, display: 'inline-block', alignSelf: 'flex-start' }}>
                {ver.status}
              </div>
            </div>
            {/* Right: tagline + bullets */}
            <div style={{ padding: bp.isMobile ? '12px 18px 18px' : '22px 28px' }}>
              <div style={{ fontFamily: '"JetBrains Mono",monospace', fontSize: 13, color: t.cream, marginBottom: 12, letterSpacing: '0.02em' }}>
                &gt; {ver.tagline}
              </div>
              <div style={{ display: 'flex', flexDirection: 'column', gap: 6 }}>
                {ver.bullets.map((b, j) => (
                  <div key={j} style={{ display: 'flex', gap: 10, fontSize: 12, color: '#c9b896', lineHeight: 1.55 }}>
                    <span style={{ color: ver.color, flexShrink: 0, marginTop: 1 }}>◆</span>
                    <span>{b}</span>
                  </div>
                ))}
              </div>
            </div>
          </div>
        ))}
      </div>
      <div style={{ marginTop: 20, fontSize: 12, color: '#6e5a44', letterSpacing: '0.08em', display: 'flex', gap: 24, flexWrap: 'wrap', alignItems: 'center' }}>
        <span><Dim>&gt;</Dim> All versions shipped. v1.0 out of Early Access.</span>
        <a href="/updates" style={{ textDecoration: 'none' }}>
          <span style={{ color: t.accentCyan, letterSpacing: '0.1em' }}>&gt; FULL PATCH NOTES → /updates</span>
        </a>
      </div>
    </CrtSection>
  );
}

Object.assign(window, { CrtRoadmap });