:root{--bg:#08131b;--panel:#10212b;--panel2:#122832;--text:#f7f9f4;--muted:#9dadb3;--line:#2a3b44;--lime:#c7f76d;--teal:#74d7c6;--amber:#ffd583;--radius:20px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.5;overflow-x:hidden}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:not-allowed}.container{max-width:1160px;margin:0 auto;padding:0 28px;position:relative;z-index:1}.ambient{position:absolute;pointer-events:none;border-radius:50%;filter:blur(90px);opacity:.22}.ambient-one{width:620px;height:500px;right:-230px;top:170px;background:#12655c}.ambient-two{width:420px;height:390px;top:790px;left:-260px;background:#3c6332}.site-header{height:88px;display:flex;align-items:center;gap:40px;border-bottom:1px solid #24323b}.brand,.footer-brand{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:800;letter-spacing:.11em;white-space:nowrap}.brand strong{color:var(--lime)}.brand-mark{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;font-size:34px;color:#0f2829;background:var(--lime);border-radius:11px;font-family:Georgia,serif;font-weight:700;line-height:1}.site-header nav{display:flex;gap:30px;margin-left:auto}.site-header nav a{font-size:13px;font-weight:600;color:#b0c1c6}.site-header nav a:hover{color:var(--lime)}.mode{display:flex;gap:9px;align-items:center;color:#b5c7c4;border:1px solid #37514c;border-radius:999px;padding:8px 13px;font-size:11px;letter-spacing:.09em;font-weight:800;white-space:nowrap}.dot{background:var(--amber);box-shadow:0 0 0 4px #ffc56814;width:7px;height:7px;border-radius:50%}.mode.live .dot{background:var(--lime)}.hero{display:grid;grid-template-columns:1.22fr .78fr;min-height:464px;align-items:center;position:relative;padding:60px 0 45px}.eyebrow,.panel-kicker,.field-title,.invoice-heading,.api-label{font-size:11px;font-weight:850;letter-spacing:.18em;color:var(--lime);display:flex;align-items:center;gap:12px}.line{display:inline-block;width:27px;height:1px;background:var(--lime)}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(38px,5vw,66px);line-height:1.08;letter-spacing:-.052em;margin:23px 0 22px;font-weight:800}h1 em,h2 em{color:var(--lime);font-style:normal}h1 em{white-space:nowrap}.hero-copy>p{font-size:16px;max-width:530px;color:#b1c1c6;line-height:1.75}.hero-actions{display:flex;gap:12px;margin-top:26px;align-items:center}.primary,.secondary,.create-btn{display:inline-flex;gap:18px;align-items:center;justify-content:space-between;font-weight:800;font-size:14px}.primary{background:var(--lime);color:#102222;border-radius:10px;padding:15px 19px;box-shadow:0 6px 30px #c7f76d19}.primary:hover,.create-btn:hover{background:#d7ff91}.secondary{border:1px solid #415057;border-radius:10px;padding:14px 19px;color:#f0f4ec}.secondary:hover{border-color:var(--lime)}.hero-note{margin-top:28px;font-size:11px;color:#a2b4b6}.tiny-icon{color:var(--lime);font-size:16px}.separator{margin:0 9px;color:#5e7477}.hero-art{position:relative;height:365px;display:grid;place-items:center}.glow-ring{border:1px solid #a6f6b733;border-radius:50%;position:absolute;transform:rotate(-22deg);box-shadow:0 0 40px #8bfdc00b}.ring-one{width:240px;height:240px;border-color:#c8f76d80}.ring-two{width:315px;height:315px}.ring-three{width:380px;height:380px;border-style:dashed;border-color:#7bc7b021}.bolt-big{font:800 225px Georgia,serif;color:var(--lime);text-shadow:0 0 22px #c7f76d46,0 0 90px #c7f76d3b;line-height:1;transform:rotate(8deg)}.orbit{width:12px;height:12px;border-radius:50%;position:absolute;background:var(--lime);box-shadow:0 0 25px #c7f76d7a}.orbit-a{top:54px;right:96px}.orbit-b{bottom:82px;left:64px;width:7px;height:7px;background:var(--teal)}.section{scroll-margin-top:35px}.main-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.panel{background:linear-gradient(150deg,#142833,#0f222b);border:1px solid #324950;border-radius:var(--radius);padding:29px;min-height:455px;box-shadow:0 20px 65px #00000016}.panel-kicker{font-size:10px;color:#a9bfbb;margin-bottom:24px}.kicker-icon{color:var(--lime);font-weight:900}.test-panel h2{font-size:32px;letter-spacing:-.045em;margin-bottom:9px}.muted{color:#b0c1c4}.test-panel>p{font-size:13px;line-height:1.6;margin-bottom:26px}.field-title{color:#b8c9c8;justify-content:space-between;margin:0 0 12px}.field-title span{color:#77958e}.amount-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.amount{border:1px solid #3d565e;background:#0d1d26;border-radius:10px;padding:14px 6px;color:#f2f7f3;font-size:19px;font-weight:800;line-height:1.15}.amount small{display:block;font-size:10px;color:#94a9ac;font-weight:500;margin-top:4px}.amount.selected{border-color:var(--lime);background:#284133;color:var(--lime);box-shadow:inset 0 0 0 1px #c7f76d4a}.amount.selected small{color:#c9d9b9}.custom-label{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#d6e1de;font-weight:600;margin:19px 0 8px}.custom-label span{font-size:11px;color:#8aa19e}input{width:100%;background:#0d1d26;border:1px solid #3d565e;color:white;border-radius:9px;padding:12px 13px;outline:none}input:focus{border-color:var(--lime)}.create-btn{width:100%;border:0;margin-top:15px;background:var(--lime);color:#132823;padding:15px 18px;border-radius:9px}.notice{display:flex;gap:12px;align-items:flex-start;margin-top:19px;color:#a9c0ba}.notice span{color:var(--lime)}.notice p{font-size:11px;line-height:1.6;margin:0}.receipt-panel{position:relative;overflow:hidden}.receipt-empty{text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:310px}.empty-graphic{font:800 105px Georgia,serif;color:#5b8175;line-height:1;text-shadow:0 0 32px #c7f76d22;opacity:.76}.receipt-empty h3{font-size:19px;margin:9px 0 3px}.receipt-empty p{color:#a2b5b7;font-size:13px}.mini-steps{display:flex;align-items:center;gap:10px;color:#9fb5b3;font-size:9px;letter-spacing:.11em;margin-top:19px}.mini-steps i{font-style:normal;color:var(--lime)}.hidden{display:none!important}.statusline{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:-4px}.status-tag{font-size:11px;color:#ffe0a5;background:#4a3c2b;border-radius:99px;padding:6px 11px;letter-spacing:.08em;font-weight:800}.status-tag.success{color:#cdfba8;background:#244c36}.subtle{font-size:11px;color:#9fb2af}.qr-zone{display:flex;align-items:center;justify-content:center;margin:18px auto 16px;width:166px;height:166px;border-radius:10px;background:#eff4e7;padding:11px}.qr-demo{background:#e4e9da;width:100%;height:100%;border:2px dashed #9cae9b;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#19382d}.qr-demo-icon{font:700 54px Georgia,serif;line-height:1}.qr-demo strong{font-size:11px;letter-spacing:.08em}.qr-demo small{font-size:10px}#qrImage{display:block;width:100%;height:100%;object-fit:contain}.invoice-heading{color:#a8bcb7;font-size:10px;margin-bottom:7px}.invoice-text{background:#0a1a23;border:1px solid #344950;min-height:42px;border-radius:9px;padding:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#c6d5cf;font:11px ui-monospace,SFMono-Regular,Consolas,monospace}.receipt-actions{display:flex;gap:10px;margin-top:9px}.ghost-btn{background:#1b343a;border:1px solid #4a6267;border-radius:9px;padding:10px 12px;color:#d7e8e0;font-size:12px;flex:1;text-align:center}.ghost-btn:hover{border-color:var(--lime)}.demo-btn{background:none;border:1px solid #4a6652;border-radius:8px;color:var(--lime);padding:10px 12px;margin-top:12px;width:100%;font-size:12px;font-weight:700}.receipt-help{font-size:11px;color:#96aaa9;margin:12px 0 0;line-height:1.45}.how{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:32px 0 50px;border-bottom:1px solid #243640}.how-item{display:flex;gap:14px;align-items:flex-start}.num{font-size:27px;line-height:1;font-weight:900;color:#81ad80}.how h3{margin:1px 0 4px;font-size:14px}.how p{font-size:12px;color:#95abb0;margin:0}.troubleshoot-section{padding-top:74px}.section-top{display:flex;justify-content:space-between;align-items:center}.section-top h2,.agents-section h2{font-size:clamp(32px,4vw,46px);letter-spacing:-.055em;margin:14px 0 9px}.section-top p{font-size:14px}.section-symbol{font-size:72px;color:#3a7d69}.trouble-layout{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:28px}.trouble-options{display:grid;gap:8px}.issue{background:#0e2029;border:1px solid #30434d;border-radius:10px;color:#c9d9d6;text-align:left;display:flex;justify-content:space-between;align-items:center;padding:13px 18px;font-size:13px;font-weight:650}.issue span:last-child{opacity:.65}.issue.active{background:#263e35;border-color:#9ad876;color:#c7f76d}.issue:hover{border-color:#87aa8d}.solution-panel{border:1px solid #385349;background:linear-gradient(140deg,#19362e,#14292d);border-radius:15px;padding:27px;display:flex;flex-direction:column}.solution-top{color:var(--lime);font-size:10px;font-weight:900;letter-spacing:.16em;display:flex;gap:12px;align-items:center}.solution-icon{font-size:22px}.solution-panel h3{font-size:26px;letter-spacing:-.03em;margin:21px 0 13px}.solution-panel ol{padding-left:22px;margin:0;color:#d3dfd6;line-height:1.7;font-size:13px}.solution-panel li{padding:0 0 11px 6px}.solution-panel li::marker{color:var(--lime);font-weight:800}.tip{border-top:1px solid #395447;margin-top:auto;padding-top:14px;color:#9cb7a9;font-size:11px;line-height:1.6}.tip span{color:var(--lime);margin-right:6px}.agents-section{margin-top:85px;background:linear-gradient(130deg,#14382f,#0d282e);border:1px solid #315047;border-radius:21px;padding:38px;display:grid;grid-template-columns:1.07fr .93fr;gap:40px}.agents-section h2{font-size:36px;line-height:1.2}.agents-content>p{color:#b6cbc4;font-size:13px;line-height:1.75;max-width:480px}.api-label{margin-top:30px;margin-bottom:9px}.api-row{border-bottom:1px solid #345348;padding:11px 0;display:flex;justify-content:space-between;gap:10px;font-size:11px}.api-row code{color:#d7f7ac}.api-row span{color:#b4c9bf}.code-card{background:#091b22;border:1px solid #38524d;border-radius:12px;overflow:hidden;align-self:center}.code-card-top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #254039;color:#9db3a8;font-size:10px;letter-spacing:.1em;padding:13px 17px}.code-card-top>span:first-child{display:flex;gap:5px}.code-card-top i{width:7px;height:7px;border-radius:50%;background:#59766b}.code-card-top i:first-child{background:#c98272}.code-card-top i:nth-child(2){background:#e7c26f}.code-card-top i:nth-child(3){background:#9bc278}.api-version{color:var(--lime)}pre{padding:17px 19px;margin:0;overflow:auto;font-size:11px;color:#ccebd4;line-height:1.8}.copy-code{border:0;border-top:1px solid #28433c;padding:13px 17px;color:var(--lime);text-align:left;width:100%;background:#122931;font-size:12px}footer{display:flex;justify-content:space-between;gap:25px;align-items:flex-start;padding:60px 0 44px;flex-wrap:wrap}.footer-brand{font-size:11px;letter-spacing:.06em}.footer-brand .brand-mark{width:31px;height:31px;font-size:26px;border-radius:8px}footer p{font-size:12px;color:#e0e7de;margin:0}footer p span{color:#7e9898}.foot-warning{flex-basis:100%;color:#69878a;font-size:10px}.toast{position:fixed;bottom:24px;right:24px;background:#d6ff9e;color:#17301e;padding:13px 17px;border-radius:10px;z-index:5;box-shadow:0 10px 35px #0005;font-size:13px;font-weight:700}
@media(max-width:900px){.site-header{gap:16px}.site-header nav{gap:13px}.site-header nav a{font-size:11px}.hero{grid-template-columns:1fr .6fr}.hero-art{transform:scale(.8)}.agents-section{gap:20px;padding:28px}.agents-section h2{font-size:30px}.amount{font-size:16px}}
@media(max-width:700px){.container{padding:0 17px}.site-header{height:76px;gap:10px}.brand{font-size:10px}.brand-mark{width:32px;height:32px;font-size:27px}.site-header nav{display:none}.mode{margin-left:auto;padding:7px 9px;font-size:9px}.hero{grid-template-columns:1fr;min-height:auto;padding:54px 0 35px}.hero-art{display:none}h1{font-size:clamp(39px,9vw,58px);line-height:1.13}h1 em{white-space:normal}.hero-copy>p{font-size:14px}.hero-actions{flex-wrap:wrap}.primary,.secondary{font-size:12px}.hero-note{line-height:2}.main-grid,.trouble-layout,.agents-section{grid-template-columns:1fr}.panel{padding:22px;min-height:auto}.receipt-panel{min-height:360px}.amount-grid{gap:6px}.amount{padding:14px 3px;font-size:15px}.how{grid-template-columns:1fr;gap:19px;padding:30px 0}.troubleshoot-section{padding-top:58px}.section-symbol{display:none}.agents-section{margin-top:56px;padding:24px}.agents-section h2{font-size:29px}.code-card{min-width:0}footer{padding-top:43px}.footer-brand{width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Zeus onboarding: keep wallet test instructions near the invoice */
.zeus-callout{margin-top:20px;border:1px solid #416853;border-radius:12px;background:linear-gradient(135deg,#183c35,#142b32);padding:17px}
.zeus-heading{display:flex;align-items:center;gap:8px;font-size:14px}.zeus-heading strong{color:#edfbe5}.zeus-icon{font-size:18px}.zeus-chip{margin-left:auto;font-size:9px;border:1px solid #719f7a;color:var(--lime);letter-spacing:.08em;border-radius:99px;padding:3px 7px}
.zeus-callout p{font-size:12px;color:#b9d0c7;line-height:1.6;margin:10px 0}
.same-node-label{display:flex;align-items:center;gap:9px;color:#eff9e8;font-size:12px;font-weight:600;cursor:pointer;line-height:1.4}
.same-node-label input{width:17px;height:17px;accent-color:#c7f76d;flex-shrink:0;margin:0}
.zeus-callout .same-node-advice{padding:10px 12px;border-radius:8px;background:#102a29;margin-bottom:0;color:#f1d9a7;border:1px solid #48624b;font-size:11px}
.zeus-steps{margin-top:14px;padding:13px 15px;border-radius:10px;border:1px solid #416854;background:#102e2b;font-size:11px;color:#d4ebd9}
.zeus-steps strong{color:var(--lime);font-size:12px}
.zeus-steps ol{margin:7px 0 0;padding-left:20px;line-height:1.7}
.zeus-steps li{padding:2px 0}
.refresh-btn{width:100%;margin-top:10px;background:#183337;border:1px solid #416a60;color:#d9f2e1;border-radius:9px;padding:10px 12px;font-size:12px;cursor:pointer}
.refresh-btn:hover{border-color:var(--lime)}
.qr-zone{width:236px;height:236px;max-width:100%;margin-top:17px;margin-bottom:17px}
.qr-zone img{image-rendering:auto}
@media(max-width:400px){.qr-zone{width:215px;height:215px}.zeus-chip{font-size:8px}}

/* Wallet-neutral advanced testing guidance */
.advanced-test{margin-top:13px;border-top:1px solid #416853;padding-top:11px}
.advanced-test summary{cursor:pointer;color:#c7f76d;font-weight:650;font-size:12px;line-height:1.5}
.advanced-test .same-node-label{margin-top:12px}

/* v0.3.2: receipt display, intentionally separate from the payable invoice. */
.payment-confirmation{margin-top:19px;border:1px solid #557b58;border-radius:15px;padding:20px;background:linear-gradient(145deg,#1b4237,#132c31)}
.confirmation-heading{display:flex;align-items:center;gap:12px}
.confirmation-heading strong{display:block;color:#e6ffbe;font-size:19px;line-height:1.3}
.confirmation-heading small{display:block;color:#b8d3c2;font-size:11px;margin-top:5px}
.confirmation-check{width:37px;height:37px;border-radius:50%;background:var(--lime);display:inline-flex;align-items:center;justify-content:center;color:#163526;font-weight:900;font-size:23px;flex:none}
.confirmation-amount{font-size:42px;letter-spacing:-.05em;font-weight:850;color:#f0ffdb;margin:17px 0}
.confirmation-facts{margin:0;border-top:1px solid #527560}
.confirmation-facts>div{display:flex;justify-content:space-between;gap:14px;border-bottom:1px solid #416357;padding:11px 0;font-size:12px}
.confirmation-facts dt{color:#b4cabc;flex-shrink:0}
.confirmation-facts dd{margin:0;color:#f1f8e7;overflow-wrap:anywhere;text-align:right}
.confirmation-id{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:10px;max-width:65%}
.confirmation-note{font-size:11px;line-height:1.55;color:#aecaba;margin:15px 0}
.confirmation-actions{display:flex;gap:9px;flex-wrap:wrap}
.confirmation-actions .ghost-btn{min-width:135px}
@media(max-width:400px){.confirmation-facts>div{display:block}.confirmation-facts dd{text-align:left;margin-top:4px;max-width:100%}.confirmation-actions .ghost-btn{min-width:0}}

/* Public demo banner: always visible, including mobile */
.preview-banner { background:#2d2b16; color:#ffe8a2; border-bottom:1px solid #6d6130; padding:12px 22px; text-align:center; font-size:13px; line-height:1.5; }
.preview-banner strong { color:#fff2b5; }
