@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;700&display=swap');
:root{--bg:#07080a;--panel:#0d0f12;--line:#1c2026;--line2:#262b33;--ink:#eef1f4;--mute:#8a929c;--dim:#4a515b;--acc:#d9ff71;--accInk:#0b0d05;--red:#ff4d5e;--mono:'JetBrains Mono',ui-monospace,Menlo,monospace;--sans:'Inter Tight',system-ui,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{background:var(--bg);color:var(--ink);font:16px/1.5 var(--sans);-webkit-font-smoothing:antialiased;overflow:hidden}
body:before{content:'';position:fixed;inset:0;pointer-events:none;background:radial-gradient(900px 500px at 78% -10%,rgba(217,255,113,.07),transparent 60%),radial-gradient(700px 500px at 0% 110%,rgba(217,255,113,.04),transparent 60%)}
.mono{font-family:var(--mono)}
header.top{height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 36px;border-bottom:1px solid var(--line);position:relative;z-index:2}
.brand{display:flex;align-items:center;gap:12px;font-weight:700;font-size:19px;letter-spacing:-.01em}
.brand i{width:12px;height:12px;border-radius:3px;background:var(--acc);box-shadow:0 0 18px var(--acc)}
.brand span{color:var(--mute);font-weight:500}
.pills{display:flex;gap:10px}
.pill{font:500 12px var(--mono);letter-spacing:.06em;color:var(--mute);border:1px solid var(--line2);border-radius:999px;padding:6px 12px;display:flex;align-items:center;gap:8px;text-transform:uppercase}
.pill b{width:7px;height:7px;border-radius:50%;background:var(--dim)}
.pill.ok b{background:var(--acc);box-shadow:0 0 8px var(--acc)}
.pill.warn{color:var(--red);border-color:rgba(255,77,94,.4)}
.pill.warn b{background:var(--red)}
.split{display:grid;grid-template-columns:52fr 48fr;height:calc(100vh - 68px);position:relative;z-index:1}
.pane{padding:36px 44px;overflow:auto;display:flex;flex-direction:column;min-height:0}
.pane+.pane{border-left:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.012),transparent)}
.eyebrow{font:500 12px var(--mono);letter-spacing:.16em;color:var(--mute);text-transform:uppercase;display:flex;align-items:center;gap:10px}
.eyebrow .n{color:var(--acc)}
h1.hl{font-weight:700;font-size:44px;line-height:1.02;letter-spacing:-.035em;margin:14px 0 6px;max-width:760px}
h1.hl em{font-style:normal;color:var(--acc)}
.sub{color:var(--mute);font-size:17px;max-width:640px}
/* chat */
.chat{flex:1;display:flex;flex-direction:column;gap:18px;margin-top:28px;overflow:auto;padding-right:6px;scroll-behavior:smooth}
.msg{max-width:88%;animation:rise .45s cubic-bezier(.2,.8,.2,1) both}
.msg .who{font:500 11px var(--mono);letter-spacing:.14em;color:var(--dim);text-transform:uppercase;margin-bottom:6px}
.msg .bubble{font-size:20px;line-height:1.4;letter-spacing:-.01em}
.msg.user{align-self:flex-end;text-align:right}
.msg.user .bubble{background:#15181d;border:1px solid var(--line2);padding:14px 18px;border-radius:16px 16px 4px 16px;display:inline-block;text-align:left}
.msg.agent .bubble{color:#d6dbe1}
.tool{border:1px solid var(--line2);border-radius:14px;background:#0a0c0f;overflow:hidden;font:15px/1.65 var(--mono);animation:rise .45s cubic-bezier(.2,.8,.2,1) both;max-width:92%}
.tool .bar{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;border-bottom:1px solid var(--line);font-size:12px;letter-spacing:.1em;color:var(--mute);text-transform:uppercase}
.tool .bar .fn{color:var(--acc)}
.tool pre{padding:16px 18px;white-space:pre-wrap;color:#c9d0d8}
.tool .k{color:#8fa0b3}.tool .s{color:#e8f5c4}.tool .v{color:var(--acc)}.tool .c{color:var(--dim)}
.tool.ret{border-color:rgba(217,255,113,.25)}
.composer{display:flex;gap:10px;align-items:center;margin-top:20px;padding-top:20px;border-top:1px solid var(--line);flex-wrap:wrap}
.composer input{flex:1;min-width:260px;background:#0b0d10;border:1px solid var(--line2);border-radius:12px;color:var(--ink);font:17px var(--sans);padding:14px 16px;outline:none}
.composer input:focus{border-color:rgba(217,255,113,.5)}
.btn{font:600 15px var(--sans);border-radius:12px;padding:14px 18px;border:1px solid var(--line2);background:#12151a;color:var(--ink);cursor:pointer;transition:transform .15s,background .2s;white-space:nowrap;text-decoration:none;display:inline-flex;align-items:center;gap:8px}
.btn:hover{transform:translateY(-1px);background:#181c22}
.btn.primary{background:var(--acc);color:var(--accInk);border-color:var(--acc)}
.btn.primary:hover{background:#e6ff9c}
.btn small{font:500 10px var(--mono);letter-spacing:.1em;opacity:.7}
.demo-tag{font:600 10px var(--mono);letter-spacing:.12em;color:var(--red);border:1px solid rgba(255,77,94,.45);border-radius:6px;padding:2px 6px}
/* money */
.amount{display:flex;align-items:flex-end;justify-content:space-between;margin:14px 0 24px}
.amount .big{font-weight:700;font-size:84px;line-height:.9;letter-spacing:-.05em;transition:color .5s}
.amount .big.held{color:var(--ink)}.amount .big.cap{color:var(--acc)}.amount .big.void{color:var(--red);text-decoration:line-through;text-decoration-thickness:4px}
.amount .what{text-align:right;font:500 13px var(--mono);letter-spacing:.1em;color:var(--mute);text-transform:uppercase}
.amount .what b{display:block;color:var(--ink);font:600 20px var(--sans);letter-spacing:-.01em;text-transform:none;margin-top:4px}
.steps{display:flex;flex-direction:column;gap:12px;flex:1}
.step{display:grid;grid-template-columns:54px 1fr auto;gap:18px;align-items:center;padding:16px 20px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.012);opacity:.38;transform:translateX(0);transition:all .6s cubic-bezier(.2,.8,.2,1)}
.step .dot{width:54px;height:54px;border-radius:14px;border:1px solid var(--line2);display:grid;place-items:center;font:600 16px var(--mono);color:var(--dim);transition:all .6s}
.step .nm{font-weight:700;font-size:30px;letter-spacing:-.03em;line-height:1}
.step .ds{color:var(--mute);font-size:15px;margin-top:6px}
.step .id{text-align:right;font:500 15px var(--mono);color:var(--mute);max-width:330px;word-break:break-all}
.step .id .st{display:inline-block;margin-top:6px;font:600 11px var(--mono);letter-spacing:.12em;padding:3px 8px;border-radius:6px;border:1px solid var(--line2);color:var(--mute)}
.step.on{opacity:1;border-color:var(--line2);background:rgba(255,255,255,.025)}
.step.on .dot{background:var(--acc);color:var(--accInk);border-color:var(--acc);box-shadow:0 0 28px rgba(217,255,113,.35)}
.step.on .id{color:var(--ink)}
.step.on .id .st{color:var(--acc);border-color:rgba(217,255,113,.4)}
.step.now{border-color:rgba(217,255,113,.55);box-shadow:0 0 0 1px rgba(217,255,113,.15),0 20px 60px -30px rgba(217,255,113,.4)}
.step.now .dot{animation:pulse 1.6s infinite}
.step.void{opacity:1;border-color:rgba(255,77,94,.6);background:rgba(255,77,94,.06)}
.step.void .dot{background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 0 28px rgba(255,77,94,.4)}
.step.void .nm{color:var(--red)}
.step.void .id .st{color:var(--red);border-color:rgba(255,77,94,.5)}
.step.gone{opacity:.15;filter:grayscale(1)}
.step.gone .nm{text-decoration:line-through}
.foot{margin-top:18px;font:500 12px var(--mono);color:var(--dim);letter-spacing:.06em;display:flex;justify-content:space-between;gap:12px}
/* verdict */
.verdict{border:1px solid var(--line2);border-radius:16px;overflow:hidden;display:grid;grid-template-columns:200px 1fr;background:#0a0c0f;animation:rise .5s cubic-bezier(.2,.8,.2,1) both;max-width:94%}
.verdict img{width:100%;height:100%;object-fit:cover;min-height:170px;background:#111}
.verdict .body{padding:18px 20px}
.verdict .tag{display:inline-flex;gap:8px;align-items:center;font:700 13px var(--mono);letter-spacing:.14em;padding:5px 10px;border-radius:8px}
.verdict.pass{border-color:rgba(217,255,113,.45)}.verdict.pass .tag{background:var(--acc);color:var(--accInk)}
.verdict.fail{border-color:rgba(255,77,94,.5)}.verdict.fail .tag{background:var(--red);color:#fff}
.verdict .ans{font-weight:700;font-size:24px;letter-spacing:-.02em;margin:12px 0 8px}
.verdict ul{list-style:none;display:flex;flex-direction:column;gap:6px}
.verdict li{color:#c3cad2;font-size:15px;padding-left:22px;position:relative}
.verdict li:before{content:'→';position:absolute;left:0;color:var(--mute);font-family:var(--mono)}
.linkrow{display:flex;gap:10px;flex-wrap:wrap;animation:rise .45s both}
.typing{display:inline-flex;gap:5px}.typing i{width:7px;height:7px;border-radius:50%;background:var(--mute);animation:blink 1.2s infinite}.typing i:nth-child(2){animation-delay:.2s}.typing i:nth-child(3){animation-delay:.4s}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(217,255,113,.5)}50%{box-shadow:0 0 0 10px rgba(217,255,113,0)}}
@keyframes blink{0%,100%{opacity:.25}50%{opacity:1}}
@media(max-width:1100px){body{overflow:auto}.split{grid-template-columns:1fr;height:auto}.pane+.pane{border-left:0;border-top:1px solid var(--line)}}
.chat>*{flex-shrink:0}
.composer{flex-wrap:nowrap}.composer input{min-width:160px}.composer #loc{flex:0 0 190px!important;min-width:0!important}.composer .btn{padding:14px 14px}
[hidden]{display:none!important}