/* ═══ CodeRabbit landing — dark IDE theme ═══ */
@font-face{font-family:'JetBrains Mono';src:url('../assets/fonts/JetBrainsMono.woff2') format('woff2');font-weight:100 800;font-style:normal;font-display:swap}
@font-face{font-family:'Space Grotesk';src:url('../assets/fonts/SpaceGrotesk.woff2') format('woff2');font-weight:300 700;font-style:normal;font-display:swap}

:root{
  --bg:#141218; --bg2:#1b1820; --panel:#211e28; --panel2:#2a2632; --panel3:#332f3b;
  --line:#3a3542; --line2:#4a4453;
  --tx:#f4f1f5; --mut:#aaa3ae; --dim:#706a75;
  --or:#FF570A; --or2:#fb923c; --orbg:rgba(255,87,10,.14);
  --grn:#65e6a6; --grnbg:rgba(101,230,166,.12);
  --red:#f87171; --redbg:rgba(248,113,113,.12);
  --pink:#ff7a92; --pur:#a78bfa; --yel:#e8a33d;
  --mono:'JetBrains Mono',ui-monospace,Menlo,monospace;
  --disp:'Space Grotesk','JetBrains Mono',system-ui,sans-serif;
  --abw:58px; --sbh:26px;
  --snap:cubic-bezier(.3,.9,.3,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--tx);font-family:var(--disp);font-size:16px;line-height:1.55;overflow-x:hidden}
.mono{font-family:var(--mono)}
.muted{color:var(--mut)}
img,svg{display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
kbd{background:var(--panel3);border:1px solid var(--line2);border-bottom-width:2px;border-radius:4px;padding:0 5px;font-family:var(--mono);font-size:.82em}
::selection{background:var(--or);color:#fff}

/* ═══ activity bar ═══ */
.activitybar{position:fixed;left:0;top:0;bottom:0;width:var(--abw);background:var(--bg2);border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:center;padding:10px 0;z-index:60}
.ab-logo{margin-bottom:14px;padding:6px;border-radius:10px;transition:background .15s}
.ab-logo:hover{background:var(--panel2)}
.ab-items{display:flex;flex-direction:column;gap:4px;flex:1}
.ab-item{position:relative;width:42px;height:42px;display:grid;place-items:center;border-radius:10px;color:var(--dim);border-left:2px solid transparent;transition:color .12s,background .12s}
.ab-item svg{width:20px;height:20px}
.ab-item:hover{color:var(--tx);background:var(--panel2)}
.ab-item.active{color:var(--or);border-left-color:var(--or);background:var(--orbg)}
.ab-tip{position:absolute;left:calc(100% + 10px);top:50%;translate:0 -50%;background:var(--panel3);border:1px solid var(--line2);color:var(--tx);font-family:var(--mono);font-size:11px;padding:3px 8px;border-radius:6px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s;z-index:70}
.ab-item:hover .ab-tip{opacity:1}
.ab-bottom{margin-top:auto}

#page{margin-left:var(--abw);padding-bottom:var(--sbh)}

/* ═══ shared IDE chrome ═══ */
.ide{background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 24px 60px -24px rgba(0,0,0,.6)}
.tl{width:11px;height:11px;border-radius:50%;display:inline-block}
.tl-r{background:#ff5f57}.tl-y{background:#febc2e}.tl-g{background:#28c840}
.ico-gh{width:14px;height:14px}
.pt-ico{width:15px;height:15px}
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;border-radius:10px;padding:12px 20px;font-size:15px;transition:transform .1s var(--snap),box-shadow .15s,background .15s}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--or);color:#fff;box-shadow:0 8px 24px -8px rgba(255,87,10,.55)}
.btn-primary:hover{background:#ff6a24;box-shadow:0 10px 28px -6px rgba(255,87,10,.7)}
.btn-ghost{background:var(--panel2);border:1px solid var(--line2);color:var(--tx)}
.btn-ghost:hover{background:var(--panel3)}
.ctl{background:var(--panel2);border:1px solid var(--line2);border-radius:8px;padding:6px 12px;font-size:12px;color:var(--mut);transition:color .12s,background .12s,transform .08s}
.ctl:hover{color:var(--tx);background:var(--panel3)}
.ctl:active{transform:scale(.95)}
.b-green{color:var(--grn)}
.editor-tabs{display:flex;gap:2px;background:var(--bg2);border:1px solid var(--line);border-radius:10px 10px 0 0;border-bottom:0;width:max-content;max-width:100%;padding:6px 8px 0;font-size:12px}
.et{padding:7px 14px;border-radius:8px 8px 0 0;color:var(--mut);background:var(--panel)}
.et.active{color:var(--tx);background:var(--panel);border-top:2px solid var(--or);color:var(--or2)}
.et.ghost{color:var(--dim);background:transparent}

/* ═══ hero ═══ */
.hero{min-height:100vh;display:grid;grid-template-columns:minmax(340px,1fr) minmax(0,1.35fr);gap:48px;align-items:center;padding:84px 48px 40px;position:relative}
.hero::before{content:"";position:absolute;inset:0;background:
  radial-gradient(700px 480px at 82% 12%,rgba(255,87,10,.10),transparent 65%),
  radial-gradient(500px 400px at 8% 90%,rgba(101,230,166,.05),transparent 60%);pointer-events:none}
.eyebrow{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--or2);letter-spacing:.04em;text-transform:uppercase;margin-bottom:22px}
.dot-live{width:8px;height:8px;border-radius:50%;background:var(--or);animation:blink 1.6s steps(2) infinite}
@keyframes blink{50%{opacity:.25}}
h1{font-size:clamp(34px,4.2vw,58px);line-height:1.06;letter-spacing:-.02em;font-weight:700}
h1 em,h2 em{font-style:normal;color:var(--or);position:relative}
h1 em::after{content:"";position:absolute;left:0;right:0;bottom:.04em;height:.09em;background:var(--or);opacity:.45;border-radius:2px}
.lede{color:var(--mut);font-size:17px;margin:20px 0 28px;max-width:46ch}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap}
.hero-note{margin-top:16px;font-size:12px;color:var(--dim)}

/* IDE window */
.hero-ide{position:relative;font-size:13.5px}
.ide-titlebar{display:flex;align-items:center;gap:7px;background:var(--bg2);border-bottom:1px solid var(--line);padding:10px 14px}
.ide-file{margin-left:8px;font-size:12px;color:var(--mut);display:flex;align-items:center;gap:8px}
.ide-status{margin-left:auto;font-size:11.5px;color:var(--or2);display:flex;align-items:center;gap:7px}
.ide-status.done{color:var(--grn)}
.pulse-dot{width:7px;height:7px;border-radius:50%;background:var(--or);animation:blink 1.2s steps(2) infinite}
.ide-pane-switch{display:none;background:var(--bg2);border-bottom:1px solid var(--line);padding:0 10px;gap:4px}
.ps-tab{font-size:12px;padding:8px 12px;color:var(--dim);border-bottom:2px solid transparent}
.ps-tab.active{color:var(--tx);border-bottom-color:var(--or)}
.ps-badge{background:var(--or);color:#fff;border-radius:8px;font-size:10px;padding:0 5px;margin-left:4px}
.ide-body{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);min-height:380px;max-height:480px;overflow:hidden}
.diff-pane{border-right:1px solid var(--line);display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden}
.diff-header{display:flex;justify-content:space-between;align-items:center;background:var(--bg2);border-bottom:1px solid var(--line);padding:7px 12px;font-size:11.5px;color:var(--mut)}
.fh-delta .add{color:var(--grn)}.fh-delta .del{color:var(--red)}
.chk-ok{font-size:11.5px}
.diff{flex:1;overflow:auto;font-family:var(--mono);font-size:12.5px;line-height:1.7;padding:8px 0}
.dl{display:grid;grid-template-columns:44px 20px 1fr;position:relative;white-space:pre;padding-right:12px;animation:dlIn .18s var(--snap)}
@keyframes dlIn{from{opacity:0;translate:0 -3px}to{opacity:1}}
.dl .ln{text-align:right;padding-right:10px;color:var(--dim);user-select:none;font-size:11px}
.dl .gut{position:relative}
.dl.ctx{color:#c9c4d0}
.dl.add{background:var(--grnbg);color:#bdf0d6}
.dl.add .ln{color:var(--grn)}
.dl.del{background:var(--redbg);color:#f5b8b8}
.dl.del .ln{color:var(--red)}
.dl.hunk{color:var(--pur);background:rgba(167,139,250,.07)}
.dl.flash-add{animation:flashAdd 1s var(--snap)}
@keyframes flashAdd{0%{background:rgba(101,230,166,.45)}100%{background:var(--grnbg)}}
.dl.flash-del{animation:flashDel 1s var(--snap)}
@keyframes flashDel{0%{background:rgba(248,113,113,.45)}100%{background:var(--redbg)}}
.dl.struck{color:var(--dim);text-decoration:line-through;opacity:.55}
.cmarker{position:absolute;left:3px;top:50%;translate:0 -50%;width:12px;height:12px;border-radius:3px;background:var(--or);cursor:pointer;animation:markPop .25s var(--snap);border:0}
.cmarker::after{content:"";position:absolute;inset:3px;background:#fff;border-radius:1.5px}
.cmarker:hover{scale:1.25}
.cmarker.pulse{animation:markPop .25s var(--snap),markPulse 1.6s .3s ease-in-out 3}
@keyframes markPop{0%{scale:0}70%{scale:1.3}100%{scale:1}}
@keyframes markPulse{50%{box-shadow:0 0 0 5px rgba(255,87,10,.25)}}
/* syntax */
.tk-k{color:#ff7a92}.tk-f{color:#7dd3fc}.tk-s{color:#a7e8a0}.tk-c{color:#5e5866;font-style:italic}.tk-n{color:#f5c97b}.tk-p{color:#c9c4d0}

/* review pane */
.review-pane{display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden;background:var(--bg2)}
.rp-tabs{display:flex;border-bottom:1px solid var(--line);flex:none}
.rp-tab{font-size:12px;padding:9px 14px;color:var(--dim);border-bottom:2px solid transparent}
.rp-tab.active{color:var(--tx);border-bottom-color:var(--or)}
.rp-feed{flex:1;min-height:0;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:12px}
.cmt{border:1px solid var(--line);background:var(--panel);border-radius:10px;padding:10px 12px;animation:cmtIn .22s var(--snap)}
@keyframes cmtIn{from{opacity:0;translate:8px 6px;scale:.97}to{opacity:1}}
.cmt.flash{animation:cmtIn .22s var(--snap),cmtFlash 1.4s .1s}
@keyframes cmtFlash{0%,60%{border-color:var(--or);box-shadow:0 0 0 3px rgba(255,87,10,.25)}}
.cmt-head{display:flex;align-items:center;gap:8px;font-size:12px;margin-bottom:6px}
.cmt-head img{width:22px;height:22px;border-radius:50%;background:var(--panel3)}
.cmt-head .who{font-weight:600}.cmt-head .bot-tag{background:var(--orbg);color:var(--or2);border-radius:4px;font-size:10px;padding:0 4px;font-family:var(--mono)}
.cmt-head time{margin-left:auto;color:var(--dim);font-size:11px;font-family:var(--mono)}
.cmt-body{font-size:12.5px;color:#ddd8e2}
.cmt-body code{background:var(--panel3);border-radius:4px;padding:0 4px;font-family:var(--mono);font-size:11.5px;color:var(--or2)}
.cmt-sug{margin-top:8px;border:1px solid var(--line2);border-radius:8px;overflow:hidden;font-family:var(--mono);font-size:11.5px}
.cmt-sug .sg-h{background:var(--panel3);padding:3px 8px;color:var(--dim);display:flex;justify-content:space-between;align-items:center}
.sg-apply{background:var(--grn);color:#0c2b1c;font-weight:700;font-size:10.5px;border-radius:5px;padding:3px 9px;transition:transform .08s}
.sg-apply:hover{filter:brightness(1.1)}
.sg-apply:active{transform:scale(.93)}
.sg-apply.applied{background:var(--panel2);color:var(--grn);pointer-events:none}
.cmt-sug .sg-b{padding:6px 8px}
.cmt-sug .d{color:var(--red);background:var(--redbg);display:block}
.cmt-sug .a{color:var(--grn);background:var(--grnbg);display:block}
.cmt.verified{border-color:rgba(101,230,166,.4)}
.cmt .v-tag{color:var(--grn)}
.typing-dots{display:inline-flex;gap:3px;padding:6px 2px}
.typing-dots i{width:5px;height:5px;border-radius:50%;background:var(--dim);animation:tdot 1s infinite}
.typing-dots i:nth-child(2){animation-delay:.15s}.typing-dots i:nth-child(3){animation-delay:.3s}
@keyframes tdot{30%{background:var(--or2);translate:0 -3px}}
.rp-summary{flex:1;min-height:0;overflow-y:auto;padding:14px;font-size:12.5px;display:flex;flex-direction:column}
.rp-summary[hidden]{display:none}
.sum-title{margin-bottom:10px;color:var(--or2)}
.rp-summary ul{list-style:none;display:flex;flex-direction:column;gap:7px;color:#d8d3de}
.rp-summary li{padding-left:16px;position:relative}
.rp-summary li::before{content:"▸";position:absolute;left:0;color:var(--or)}
.sum-cursor{color:var(--or);animation:blink .8s steps(2) infinite}
.sum-cursor.off{display:none}

/* checks bar */
.ide-checks{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:var(--bg2);border-top:1px solid var(--line);padding:9px 14px;font-size:11.5px}
.chk{display:flex;align-items:center;gap:6px;color:var(--dim);transition:color .2s}
.chk i{width:13px;height:13px;border-radius:50%;border:2px solid var(--dim);display:inline-block;position:relative;transition:all .2s}
.chk.run i{border-color:var(--or);border-top-color:transparent;animation:spin .7s linear infinite}
@keyframes spin{to{rotate:360deg}}
.chk.pass{color:var(--grn)}
.chk.pass i{border-color:var(--grn);background:var(--grn)}
.chk.pass i::after{content:"✓";position:absolute;inset:0;color:#0c2b1c;font-size:9px;display:grid;place-items:center;font-weight:700}
.merge-btn{margin-left:auto;background:var(--panel3);border:1px solid var(--line2);border-radius:8px;padding:7px 16px;font-size:12px;color:var(--dim);transition:all .15s}
.merge-btn.ready{background:#2ea043;border-color:#2ea043;color:#fff;cursor:pointer;animation:mergeGlow 1.8s ease-in-out infinite}
@keyframes mergeGlow{50%{box-shadow:0 0 14px rgba(46,160,67,.55)}}
.ide-controls{display:flex;align-items:center;gap:8px;padding:10px 14px;border-top:1px solid var(--line);background:var(--bg2);flex-wrap:wrap}
.ctl-hint{margin-left:auto;font-size:10.5px;color:var(--dim);display:flex;align-items:center;gap:6px}
.hint-marker{width:11px;height:11px;border-radius:3px;background:var(--or);display:inline-block;position:relative}
.hint-marker::after{content:"";position:absolute;inset:3px;background:#fff;border-radius:1.5px}

/* ticker */
.hero-ticker{grid-column:1/-1;border:1px solid var(--line);border-radius:10px;background:var(--bg2);overflow:hidden;padding:9px 0;font-size:12px;color:var(--dim);position:relative}
.ticker-track{display:flex;gap:34px;white-space:nowrap;width:max-content;animation:tick 40s linear infinite}
.ticker-track span b{color:var(--grn)}
@keyframes tick{to{transform:translateX(-50%)}}

/* ═══ stats — CI badges ═══ */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding:24px 48px 72px}
.stat-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px}
.stat-card p{color:var(--mut);font-size:13px;margin-top:12px}
.badge{display:inline-flex;border-radius:6px;overflow:hidden;font-size:13px;border:1px solid var(--line2)}
.b-left{background:var(--panel3);color:var(--mut);padding:5px 10px}
.b-right{display:flex;align-items:center;gap:6px;padding:5px 10px;background:#1e2b24;font-weight:700}
.b-right.b-green{background:#17352a;color:var(--grn)}
.b-right.b-orange{background:#3d2318;color:var(--or2)}
.b-right.b-purple{background:#2d2647;color:var(--pur)}
.tick{width:12px;height:12px;border-radius:50%;background:currentColor;display:inline-grid;place-items:center;scale:0;transition:scale .25s var(--snap)}
.tick::after{content:"✓";font-size:8px;color:#141218;font-weight:700}
.stat-card.on .tick{scale:1}
.stat-num{font-variant-numeric:tabular-nums}

/* ═══ sections ═══ */
.section{padding:84px 48px;max-width:1280px;margin:0 auto}
.sec-head{margin-bottom:34px}
h2{font-size:clamp(26px,3vw,40px);letter-spacing:-.015em;line-height:1.12;margin:16px 0 12px}
.sec-sub{color:var(--mut);max-width:64ch;font-size:15.5px}

/* ═══ game ═══ */
.game-wrap{font-size:13.5px}
.game-top{display:flex;align-items:center;justify-content:space-between;background:var(--bg2);border-bottom:1px solid var(--line);padding:10px 16px;font-size:13px}
.score{display:flex;align-items:center;gap:8px;color:var(--mut)}
.score b{font-size:18px;color:var(--tx);font-variant-numeric:tabular-nums;min-width:1.2ch;text-align:center}
.score.rabbit b{color:var(--or2)}
.bot-av{width:18px;height:18px;border-radius:50%}
.gstate{color:var(--dim);font-size:12px}
.gstate.live{color:var(--grn)}
.rabbit-meter{display:flex;align-items:center;gap:12px;padding:8px 16px;border-bottom:1px solid var(--line);background:var(--bg2)}
.rm-label{font-size:11px;color:var(--dim);white-space:nowrap}
.rm-bar{flex:1;height:6px;background:var(--panel3);border-radius:3px;overflow:hidden}
.rm-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--or),var(--or2));border-radius:3px}
.game-board{position:relative;background:var(--panel);outline:none}
.gb-lines{font-family:var(--mono);font-size:13px;line-height:2.1;padding:10px 0 12px;position:relative}
.gl{display:grid;grid-template-columns:46px 26px 1fr;align-items:center;position:relative;white-space:pre;padding-right:14px;border-radius:4px}
.gl .ln{text-align:right;padding-right:12px;color:var(--dim);font-size:11px;user-select:none}
.gl .gc{width:16px;height:16px;display:grid;place-items:center;user-select:none}
.gl .code{cursor:pointer}
.gl.cur{background:rgba(255,87,10,.07)}
.gl.cur .ln{color:var(--or2)}
.gl .cellbox{position:absolute;left:66px;top:4px;bottom:4px;border:1px solid rgba(255,87,10,.4);border-radius:5px;pointer-events:none;opacity:0;transition:opacity .15s}
.game-board.playing .cellbox{opacity:1}
.gl.found-you{background:var(--grnbg)}
.gl.found-you .gc{color:var(--grn)}
.gl.found-you .gc::before{content:"✓";font-weight:700}
.gl.found-rabbit{background:rgba(232,163,61,.1)}
.gl.found-rabbit .gc::before{content:"🥕";font-size:11px}
.gl.miss{animation:miss .35s}
@keyframes miss{25%{background:rgba(248,113,113,.35)}75%{background:rgba(248,113,113,.15)}}
.bunny{position:absolute;width:30px;height:30px;border-radius:8px;background:var(--or);display:grid;place-items:center;z-index:5;pointer-events:none;box-shadow:0 4px 14px rgba(255,87,10,.5);transition:left .13s var(--snap),top .13s var(--snap);opacity:0}
.bunny img{width:19px;height:19px}
.bunny.on{opacity:1}
.bunny.hop{animation:hop .22s var(--snap)}
@keyframes hop{40%{scale:.85 1.2;translate:0 -7px}}
.game-overlay{position:absolute;inset:0;background:rgba(20,18,24,.82);backdrop-filter:blur(3px);display:grid;place-items:center;z-index:8;transition:opacity .25s}
.game-overlay.hidden{opacity:0;pointer-events:none}
.go-card{text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px;padding:20px}
.go-card h3{font-size:22px}
.go-card p{color:var(--mut);font-size:13px}
.go-keys{font-size:11px;color:var(--dim)}
.game-foot{display:flex;align-items:center;gap:10px;padding:10px 16px;border-top:1px solid var(--line);background:var(--bg2);flex-wrap:wrap}
.gf-hint{margin-left:auto;font-size:11px;color:var(--dim)}

/* ═══ pipeline ═══ */
.platform-tabs{display:inline-flex;gap:4px;background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:4px;margin-top:18px}
.pt{display:flex;align-items:center;gap:7px;font-size:12.5px;padding:7px 16px;border-radius:7px;color:var(--mut);transition:all .12s}
.pt img{width:15px;height:15px}
.pt.active{background:var(--panel3);color:var(--tx);box-shadow:inset 0 0 0 1px var(--line2)}
.pipeline{padding:26px}
#pipelineSvg{width:100%;height:auto}
.edge{fill:none;stroke:url(#edgeGrad);stroke-width:2;stroke-dasharray:6 6;animation:dashmove 1.2s linear infinite}
.edge.loop{stroke:#4a4453;stroke-dasharray:4 5}
@keyframes dashmove{to{stroke-dashoffset:-12}}
.pnode rect{fill:var(--panel2);stroke:var(--line2);stroke-width:1.2}
.pnode.hot rect{fill:#2e2019;stroke:var(--or);stroke-width:1.6}
.pnode.ok rect{fill:#1a2b22;stroke:#2ea043}
.pn-t{fill:var(--tx);font-family:var(--mono);font-size:13px;text-anchor:middle;font-weight:700}
.pn-s{fill:var(--dim);font-family:var(--mono);font-size:10px;text-anchor:middle}
.packet{fill:#aaa3ae;filter:drop-shadow(0 0 4px rgba(255,255,255,.4))}
.packet.p-orange{fill:var(--or2);filter:drop-shadow(0 0 6px rgba(255,87,10,.8))}
.packet.p-green{fill:var(--grn);filter:drop-shadow(0 0 6px rgba(101,230,166,.8))}
.packet.p-loop{fill:var(--pink)}
.pipe-steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:26px}
.pipe-steps li{display:flex;gap:12px;background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:14px}
.pipe-steps b{color:var(--or);font-size:13px}
.pipe-steps h3{font-size:14.5px;margin-bottom:4px}
.pipe-steps p{font-size:12.5px;color:var(--mut)}

/* ═══ features — README ═══ */
.readme{padding:22px 26px}
.rm-shields{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.shield{display:inline-flex;border-radius:5px;overflow:hidden;font-size:11.5px;border:1px solid var(--line2)}
.shield i{background:var(--panel3);color:var(--mut);padding:3px 8px;font-style:normal}
.shield b{padding:3px 8px;background:#26222e;color:var(--tx)}
.shield b.b-green{background:#17352a;color:var(--grn)}
.shield b.b-orange{background:#3d2318;color:var(--or2)}
.shield b.b-purple{background:#2d2647;color:var(--pur)}
.feat-table{width:100%;border-collapse:collapse;font-size:13.5px}
.feat-table th{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--dim);text-align:left;padding:8px 12px;border-bottom:1px solid var(--line2)}
.feat-table td{padding:10px 12px;border-bottom:1px solid var(--line);color:#ddd8e2;vertical-align:top}
.feat-table td:first-child{white-space:nowrap;color:var(--tx)}
.feat-table tr:hover td{background:rgba(255,255,255,.02)}
.feat-table code{background:var(--panel3);border-radius:4px;padding:0 5px;font-family:var(--mono);font-size:12px;color:var(--or2)}

/* ═══ compare ═══ */
.ba-toggle{display:inline-flex;gap:4px;background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:4px;margin-top:18px}
.ba-t{font-size:12.5px;padding:7px 18px;border-radius:7px;color:var(--mut);transition:all .12s;display:flex;align-items:center;gap:7px}
.ba-t.active{background:var(--panel3);color:var(--tx)}
.ba-dot{width:7px;height:7px;border-radius:50%;background:var(--or)}
.ba-wrap{transition:opacity .18s}
.ba-wrap.swap{opacity:0}
.ba-pane{animation:baIn .25s var(--snap)}
@keyframes baIn{from{opacity:0;translate:0 8px}}
.ba-diff{padding:14px 16px;font-size:12.5px;line-height:1.75;overflow-x:auto;white-space:pre}
.dl-ctx{color:#c9c4d0}.dl-add{color:var(--grn);background:var(--grnbg)}.dl-del{color:var(--red);background:var(--redbg)}
.dl-cmt{color:var(--or2);margin-top:10px}.dl-cmt-b{color:var(--mut)}
.dl-sug{color:var(--grn);background:var(--grnbg)}
.ba-verdict{border-top:1px solid var(--line);padding:10px 16px;font-size:12px}
.ba-verdict.bad{color:var(--red)}
.ba-verdict.good{color:var(--grn)}

/* ═══ integrations ═══ */
.int-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.int-tile{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:20px;display:flex;flex-direction:column;align-items:flex-start;gap:10px;transition:border-color .15s,transform .15s var(--snap)}
.int-tile:hover{border-color:var(--line2);transform:translateY(-3px)}
.int-tile img,.int-tile svg{width:30px;height:30px}
.int-tile span{font-weight:700;font-family:var(--disp)}
.int-tile i{font-style:normal;font-size:11px;color:var(--dim)}

/* ═══ proof ═══ */
.proof-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pr-comment{padding:18px;display:flex;flex-direction:column;gap:12px}
.pr-comment header{display:flex;align-items:center;gap:10px}
.av{width:36px;height:36px;border-radius:50%;background:var(--av);color:#141218;font-weight:700;display:grid;place-items:center;font-size:13px;font-family:var(--mono)}
.pr-comment header b{display:block;font-size:14px}
.pr-comment header .muted{font-size:11px}
.approved{margin-left:auto;font-size:10.5px;color:var(--grn);background:var(--grnbg);border:1px solid rgba(101,230,166,.35);padding:3px 8px;border-radius:20px;white-space:nowrap}
.pr-comment p{font-size:13.5px;color:#ddd8e2;flex:1}
.pr-comment footer{font-size:11px;border-top:1px dashed var(--line);padding-top:10px}
.trusted{margin-top:34px;display:flex;align-items:center;gap:18px}
.tr-label{font-size:11.5px;color:var(--dim);white-space:nowrap;text-transform:uppercase;letter-spacing:.08em}
.tr-marquee{flex:1;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.tr-track{display:flex;gap:38px;white-space:nowrap;width:max-content;animation:tick 30s linear infinite;color:var(--mut);font-size:14px;font-weight:600}

/* ═══ pricing ═══ */
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:start}
.term{position:relative;display:flex;flex-direction:column}
.term.featured{border-color:var(--or);box-shadow:0 0 0 1px var(--or),0 24px 60px -24px rgba(255,87,10,.4)}
.term-flag{position:absolute;top:-11px;left:50%;translate:-50% 0;background:var(--or);color:#fff;font-size:10.5px;font-weight:700;padding:3px 12px;border-radius:20px;letter-spacing:.04em}
.term-bar{display:flex;align-items:center;gap:6px;background:var(--bg2);border-bottom:1px solid var(--line);padding:9px 13px;font-size:11px}
.term-bar .muted{margin-left:8px}
.term-body{padding:16px;font-size:12.5px;display:flex;flex-direction:column;gap:8px;flex:1}
.tp{color:var(--or2);font-weight:700}
.tok{color:var(--grn)}
.tdim{color:var(--dim)}
.tprice{margin-top:auto;padding-top:12px;font-size:22px;font-weight:700;color:var(--tx)}
.tprice span{font-size:11px;color:var(--dim);font-weight:400}
.t-cta{margin:0 16px 16px;justify-content:center}
.price-note{text-align:center;margin-top:22px;font-size:12px;color:var(--dim)}

/* ═══ docs & security ═══ */
.docs-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:18px}
.qs p{padding:2px 0}
.sec-list{list-style:none;padding:18px;display:flex;flex-direction:column;gap:12px;font-size:13px}
.sec-list i{color:var(--grn);font-style:normal;margin-right:8px;font-weight:700}
.sec-list li{border-bottom:1px dashed var(--line);padding-bottom:10px}
.sec-list li:last-child{border-bottom:0}

/* ═══ footer ═══ */
#footer{border-top:1px solid var(--line);background:var(--bg2);padding:56px 48px 26px}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:28px;max-width:1280px;margin:0 auto}
.foot-logo{height:20px;width:auto;margin-bottom:14px}
.foot-brand .mono{font-size:12px;line-height:1.7}
.foot-col{display:flex;flex-direction:column;gap:9px;font-size:13px}
.foot-col b{color:var(--dim);font-size:11px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:4px}
.foot-col a{color:var(--mut);transition:color .12s}
.foot-col a:hover{color:var(--or2)}
.foot-legal{max-width:1280px;margin:36px auto 0;border-top:1px solid var(--line);padding-top:18px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:11.5px}

/* ═══ status bar ═══ */
.statusbar{position:fixed;left:var(--abw);right:0;bottom:0;height:var(--sbh);background:var(--or);color:#fff;display:flex;align-items:center;font-size:11px;z-index:60;padding:0 10px;gap:16px}
.sb-item{display:flex;align-items:center;gap:5px;white-space:nowrap}
.sb-item img{filter:brightness(10)}
.sb-flex{flex:1}
.sb-branch{font-weight:700}

/* ═══ responsive ═══ */
@media(max-width:1100px){
  .hero{grid-template-columns:1fr;gap:34px;padding-top:100px}
  .stats{grid-template-columns:repeat(2,1fr)}
  .pipe-steps{grid-template-columns:repeat(2,1fr)}
  .int-grid{grid-template-columns:repeat(3,1fr)}
  .proof-grid{grid-template-columns:1fr}
  .price-grid{grid-template-columns:1fr;max-width:480px;margin:0 auto}
  .docs-grid{grid-template-columns:1fr}
}
@media(max-width:760px){
  :root{--abw:0px}
  #page{margin-left:0;padding-bottom:calc(var(--sbh) + 52px)}
  .activitybar{top:auto;bottom:var(--sbh);left:0;right:0;width:auto;height:52px;flex-direction:row;border-right:0;border-top:1px solid var(--line);padding:0 8px;gap:2px}
  .ab-logo{margin:0 4px 0 0;padding:2px}
  .ab-items{flex-direction:row;flex:1;justify-content:space-around}
  .ab-item{width:38px;height:38px;border-left:0;border-top:2px solid transparent}
  .ab-item.active{border-top-color:var(--or)}
  .ab-tip{display:none}
  .ab-bottom{margin:0}
  .statusbar{left:0}
  .hero,.section,.stats{padding-left:18px;padding-right:18px}
  .hero{padding-top:44px}
  .section{padding-top:64px;padding-bottom:64px}
  h1{font-size:33px}
  .ide-body{grid-template-columns:1fr;min-height:0;max-height:none}
  .ide-pane-switch{display:flex}
  .diff-pane{border-right:0}
  .review-pane{display:none;min-height:340px}
  .hero-ide.show-review .review-pane{display:flex}
  .hero-ide.show-review .diff-pane{display:none}
  .ide-checks{gap:8px}
  .ctl-hint{display:none}
  .stats{grid-template-columns:1fr;gap:12px}
  .int-grid{grid-template-columns:repeat(2,1fr)}
  .pipe-steps{grid-template-columns:1fr}
  .pipeline{overflow-x:auto;padding:16px}
  #pipelineSvg{min-width:660px}
  .foot-grid{grid-template-columns:1fr 1fr}
  .sb-item:not(.sb-branch):not(.sb-rabbit){display:none}
  .gb-lines{font-size:10.5px}
  .gb-lines .tk-c{display:none}
  .gl{grid-template-columns:30px 20px 1fr}
  .bunny{width:24px;height:24px}
  .bunny img{width:15px;height:15px}
  .feat-table td:first-child{white-space:normal}
}

/* ═══ reduced motion ═══ */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
  html{scroll-behavior:auto}
  .ticker-track,.tr-track{animation:none}
}