@import url('https://fonts.googleapis.com/css2?family=Exo+2:wght@600;700;800&display=swap');

    /* ── ai-agent-main.css ── */
    *,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
    :root{
      --bg:#03070f;--surface:#080f1e;--panel:#060d1a;--border:#0e2040;
      --accent:#00c2ff;--accent2:#0066ff;--green:#00ffaa;
      --red:#ff3b5c;--yellow:#ffc847;--text:#cde4ff;--muted:#3a5a80;
      --mono:'Share Tech Mono',monospace;--sans:'Syne',sans-serif;
      /* Top center headline block (.center-header) — alpha 0.7 */
      --center-header-bg:rgba(0,0,0,0.7);
      /* CTA title strip vs footer: tune independently */
      --micropost-strip-bg:rgba(0,0,0,1);
      /* Footer strip (alpha 0.7) */
      --micropost-footer-bg:rgba(0,0,0,0.7);
    }
    html,body{height:100%;background:var(--bg);color:var(--text);font-family:var(--sans);overflow-x:hidden;overflow-y:auto;overscroll-behavior-y:auto;overscroll-behavior-x:auto}
    .grid-bg{position:fixed;inset:0;z-index:0;background-image:linear-gradient(rgba(0,194,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(0,194,255,.03) 1px,transparent 1px);background-size:48px 48px;animation:gridDrift 40s linear infinite}
    @keyframes gridDrift{0%{background-position:0 0}100%{background-position:48px 48px}}
    .scanlines{position:fixed;inset:0;z-index:1;pointer-events:none;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.08) 2px,rgba(0,0,0,.08) 4px)}
    nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.5rem;border-bottom:2px solid var(--border);background:rgba(3,7,15,.92);backdrop-filter:blur(10px);height:52px}
    .nav-brand{font-family:'Exo 2',var(--sans);font-size:.95rem;font-weight:800;color:var(--accent)}
    .nav-right{display:flex;align-items:center;gap:.6rem}
    /* Match Logout spacing: gap before NFT Verified (3rd item) — reads as two pairs + Logout */
    .nav-right > div:nth-child(3){margin-left:.6rem}
    .nav-pill{font-family:var(--mono);font-size:.6rem;padding:.25rem .7rem;border-radius:20px;border:1px solid rgba(0,194,255,.25);color:var(--accent);background:rgba(0,194,255,.06);display:flex;align-items:center;gap:.35rem}
    .nav-pill.green{border-color:rgba(0,255,170,.25);color:var(--green);background:rgba(0,255,170,.06)}
    .nav-wallet{font-family:var(--mono);font-size:.6rem;color:var(--muted);padding:.25rem .7rem;border:1px solid var(--border);border-radius:20px}
    /* Match "NFT Verified" capsule styling for the Base wallet pill (leave Logout as-is) */
    #nav-wallet{border:1px solid rgba(0,255,170,.25)!important;background:rgba(0,255,170,.06)!important;color:var(--green)!important}
    .dot{width:5px;height:5px;border-radius:50%;background:var(--green);animation:pulse 2s infinite}
    @keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
    /* Extra space only before Logout (does not change gap between pills) */
    .logout-btn{margin-left:.6rem;font-family:var(--mono);font-size:.6rem;color:#7dd3ff;background:transparent;border:1px solid rgba(0,194,255,.6);border-radius:3px;padding:.25rem .65rem;cursor:pointer;transition:all .15s}
    .logout-btn:hover{border-color:var(--red);color:var(--red)}
    .layout{position:relative;z-index:2;display:grid;grid-template-columns:380px 1fr 400px;height:calc(100vh - 52px);margin-top:52px;overflow:hidden;padding-right:10px}
    .layout > *{min-height:0}
    .left-panel{border-right:1px solid var(--border);display:flex;flex-direction:column;background:var(--panel);overflow:visible;padding-bottom:50px;box-sizing:border-box}
    .agent-video-wrap{position:relative;z-index:7;flex-shrink:0;background:#000;overflow:visible}
    #agent-video{width:100%;display:block;max-height:460px;object-fit:contain}
    .agent-video-overlay{display:none}
    .agent-status-bar{position:absolute;bottom:-32px;left:0;right:0;padding:.5rem .85rem;display:flex;align-items:center;justify-content:space-between}
    .agent-name-tag{font-family:var(--mono);font-size:.65rem;color:var(--accent)}
    .agent-state{font-family:var(--mono);font-size:.6rem;color:var(--green);display:flex;align-items:center;gap:.3rem}
    .left-inner{flex:1;overflow-y:auto;padding:1rem;padding-top:3.0rem;display:flex;flex-direction:column;gap:.85rem;-webkit-overflow-scrolling:touch;overscroll-behavior-y:auto}
    .wallet-card{background:rgba(0,0,0,.3);border:1px solid var(--border);border-radius:3px;padding:1rem}
    .wc-label{font-family:var(--mono);font-size:.55rem;letter-spacing:.12em;color:var(--muted);text-transform:uppercase;margin-bottom:.6rem}
    .wc-address{font-family:var(--mono);font-size:.68rem;color:var(--accent2);word-break:break-all;line-height:1.4}
    .wc-address.none{color:var(--muted);font-style:italic}
    .balances{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:.75rem}
    .bal-box{background:rgba(0,194,255,.04);border:1px solid var(--border);border-radius:3px;padding:.5rem;text-align:center}
    .bal-label{font-family:var(--mono);font-size:.5rem;color:var(--muted);text-transform:uppercase}
    .bal-value{font-family:var(--mono);font-size:.85rem;font-weight:700;margin-top:.2rem;color:var(--text)}
    .bal-usd{font-family:var(--mono);font-size:.55rem;color:var(--muted);margin-top:.1rem}
    .pk-card{background:rgba(255,200,71,.04);border:1px solid rgba(255,200,71,.15);border-radius:3px;padding:.85rem}
    .pk-title{font-family:var(--mono);font-size:.55rem;color:var(--yellow);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.6rem}
    .pk-input-row{display:flex;gap:.4rem}
    #pk-input{flex:1;background:rgba(0,0,0,.4);border:1px solid var(--border);border-radius:3px;color:var(--text);font-family:var(--mono);font-size:.65rem;padding:.45rem .65rem;outline:none;transition:border-color .2s}
    #pk-input:focus{border-color:rgba(255,200,71,.4)}
    .pk-unlock-btn{font-family:var(--mono);font-size:.65rem;background:var(--yellow);color:#000;border:none;border-radius:3px;padding:.45rem .75rem;cursor:pointer;font-weight:700;white-space:nowrap}
    .pk-status{font-family:var(--mono);font-size:.6rem;margin-top:.4rem}
    .pk-status.set{color:var(--green)}.pk-status.unset{color:var(--muted)}
    .action-btns{display:flex;flex-direction:column;gap:.5rem}
    .action-btn{width:100%;padding:.75rem 1rem;border:1px solid var(--border);border-radius:3px;background:rgba(0,0,0,.2);color:var(--text);font-family:var(--mono);font-size:.75rem;font-weight:700;cursor:pointer;text-align:left;display:flex;align-items:center;gap:.65rem;transition:all .15s}
    .action-btn:hover{border-color:var(--accent);color:var(--accent);background:rgba(0,194,255,.05)}
    .action-btn.green:hover{border-color:var(--green);color:var(--green);background:rgba(0,255,170,.05)}
    /* Nudge AGENTIC logo + label inside the trustline button, without moving the button */
    button.action-btn .fwx-agentic-logo,
    button.action-btn .fwx-agentic-label{
      position:relative;
      left:-3px;
    }
    /* min-height:0 lets the center column shrink inside the fixed-height .layout (avoids phantom page scroll) */
    .center-panel{display:flex;flex-direction:column;overflow:hidden;min-height:0}
    .center-header{padding:.85rem 1.25rem;border-bottom:2px solid var(--border);flex-shrink:0;background:var(--center-header-bg)}
    .center-title{font-family:var(--sans);font-size:1.2rem;font-weight:800}
    .center-title span{color:var(--accent)}
    /* Make only the "AI-Monetized MicroPosts™" line gold (matches Live XRPL Balances) */
    .center-title .fwx-agent-micropost-gold{color:var(--yellow) !important}
    .center-sub{font-family:var(--mono);font-size:.65rem;color:var(--muted);margin-top:.25rem}
    .forms-area{flex:1;min-height:0;overflow-y:auto;padding:1.25rem 1.25rem max(0px,calc(1.25rem - 20px)) 1.25rem;display:flex;flex-direction:column;gap:1.1rem;-webkit-overflow-scrolling:touch;overscroll-behavior-y:auto}
    .command-grid{display:grid;grid-template-columns:470px 1fr;gap:6px;align-items:start}
    .command-grid.command-grid-tight{grid-template-columns:470px 1fr}
    .swap-card{max-width:470px;position:relative;top:-37px}
    .send-card{min-width:520px;position:relative;top:-37px}
    .form-group.amount-compact{flex:0 0 auto}
    .form-group.amount-compact .form-input{width:16ch}
    .form-group.sel-compact{flex:0 0 88px}
    /* Swap From/To: match Send box Currency column width (see .send-card .sel-compact) */
    .swap-card .form-group.sel-compact{flex:0 0 93px}
    .form-row.send-fields-row{flex-wrap:nowrap}
    .form-group.addr-grow{flex:0 0 auto}
    .form-group.addr-grow .form-input{width:38ch;max-width:100%}
    /* Send: optional XRPL destination tag (issuers / exchanges) */
    .form-group.dest-tag-compact{flex:0 0 calc(7.25rem - 30px);max-width:calc(7.25rem - 30px)}
    .form-group.dest-tag-compact .form-input{text-align:left}
    .swap-card .form-card-body{padding:1rem 4px 1rem 1rem}
    .swap-card .form-row{gap:.45rem}
    .swap-card .submit-btn.blue{margin-left:auto;margin-right:15px;margin-bottom:2px}
    /* Swap: cap note + approx received on one row (mirrors Send's cap+amount row) */
    .swap-card .swap-cap-approx-row{
      display:flex;
      flex-direction:row;
      align-items:flex-start;
      justify-content:space-between;
      gap:.75rem;
      flex-wrap:nowrap;
      margin:0;
      padding:0;
      position:relative;
      top:-7px; /* mirrors .send-cap-amount-row vertical rhythm */
    }
    .swap-card .swap-cap-approx-row .cap-note{
      flex:1;
      min-width:0;
      margin:0;
      padding:0;
      line-height:1.35;
    }
    .swap-card .swap-approx-inline{
      flex:0 0 auto;
      display:flex;
      flex-direction:row;
      align-items:center;
      justify-content:flex-end;
      gap:.45rem;
      margin:0;
      padding:0;
      position:relative;
      left:-1px; /* match send-amount-inline nudge */
      pointer-events:none; /* display-only */
    }
    .swap-card .swap-approx-inline .form-label{
      margin:0;
      padding:0;
      line-height:1;
      white-space:nowrap;
      position:relative;
      top:11px; /* visually centers label text with the box */
    }
    .swap-card .swap-approx-box{
      width:16ch; /* match .amount-compact input width */
      background:rgba(0,0,0,.4);
      border:1px solid var(--border);
      border-radius:3px;
      color:var(--text);
      font-family:var(--mono);
      font-size:.75rem;
      padding:.55rem .75rem;
      text-align:right;
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
      margin-top:0px;
      margin-bottom:-22px;
    }
    /* Send: tighten vertical rhythm — no extra gap below Amount row; trim 1px under Send btn */
    .send-card .form-card-body{gap:0;padding:1rem 1rem calc(1rem - 1px) 1rem}
    /* Send: demo cap + Amount on one row (Amount right — Send-only) */
    .send-card .send-cap-amount-row{display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between;gap:.75rem;flex-wrap:nowrap;margin:0;padding:0;position:relative;top:-7px}
    .send-card .send-cap-amount-row .cap-note{flex:1;min-width:0;margin:0;padding:0;line-height:1.35}
    .send-card .send-cap-amount-row .send-amount-inline{flex:0 0 auto;flex-direction:row;align-items:center;gap:.45rem;flex-wrap:nowrap;margin:0 0 2px 0;padding:0;position:relative;left:-1px}
    .send-card .send-cap-amount-row .send-amount-inline .form-label{margin:0;padding:0;line-height:1}
    .send-card .form-label{white-space:nowrap}
    .send-card .form-row{gap:.30rem}
    .send-card .send-fields-row{margin-top:-10px}
    .send-card .sel-compact{margin-left:.3rem;flex:0 0 93px}
    /* Send button: must follow .submit-btn.green so bg/text win cascade */
    .send-card .submit-btn.green{margin-left:calc(.3rem + 44px);margin-bottom:2px;background:#249e1b;color:#fff}
    .send-card .submit-btn.green:hover{filter:brightness(1.08)}
    .swap-card .form-card-header{padding:.7rem 1rem;font-size:.7rem;font-weight:700;margin-top:0;margin-bottom:0}
    .micropost-cta{margin-top:.15rem;padding:.75rem 1rem;border-top:1px solid rgba(0,194,255,.25);border-bottom:1px solid rgba(0,194,255,.25);background:var(--micropost-strip-bg);font-family:var(--sans);font-size:1.05rem;font-weight:800;letter-spacing:.01em;position:relative;top:-51px}
    .micropost-cta-white{color:#fff}
    .micropost-cta-blue{color:var(--accent)}
    /* Placeholder-like typography (from link-window), but slightly larger/heavier */
    .micropost-cta-passive{font-family:var(--mono);font-size:.82rem;font-weight:700;color:var(--muted)}
    .micropost-grid{display:grid;grid-template-columns:470px 1fr;gap:6px;margin-top:.35rem;align-items:start}
    .micropost-grid .full{grid-column:1 / -1;position:relative;top:-68px}
    .micropost-grid > .form-card:not(.full){position:relative;top:-68px;margin-bottom:0}
    .micropost-message-row{display:flex;gap:.65rem;align-items:flex-end}
    .micropost-message-row .message-grow{flex:1}
    .micropost-message-row .message-grow .form-input{white-space:nowrap;overflow-x:auto}
    .price-radio-row{display:flex;gap:12px;align-items:center;flex-wrap:nowrap;margin-top:.4rem}
    .price-submit-row{display:flex;justify-content:flex-end;margin-top:-1px;padding-bottom:5px}
    #micropost-submit{background:#2547b8;color:#fff;position:relative;left:-2px}
    #micropost-submit:hover{filter:brightness(1.08)}
    #micropost-copy{background:#8225b8;color:#fff;position:relative;left:-2px}
    #micropost-copy:hover{filter:brightness(1.08)}
    .price-radio{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.75rem;color:var(--text);padding:.35rem .55rem;border:1px solid var(--border);border-radius:3px;background:rgba(0,0,0,.18)}
    .price-radio input{accent-color:var(--accent2)}
    .link-window{background:rgba(0,0,0,.35);border:1px solid var(--border);border-radius:3px;padding:.65rem;min-height:52px;font-family:var(--mono);font-size:.75rem;color:var(--muted);display:flex;align-items:center;justify-content:flex-start;overflow:hidden}
    .copy-row{display:flex;justify-content:flex-end;margin-top:.2rem;padding-bottom:5px}
    .micropost-grid > .form-card:not(.full) .form-card-body{padding:.75rem 1rem}
    /* Balance cards: prevent flexbox from shrinking them when extra sections (footer) are added */
    .balance-bar{flex-shrink:0}
    .balance-bar .form-card-body{
      padding:0px 1rem;
      min-height:46px;
      display:flex;
      flex-direction:column;
      justify-content:center;
    }
    .balance-row{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
    .balance-title{font-family:var(--mono);font-size:.7rem;font-weight:700;letter-spacing:.02em;text-transform:uppercase}
    .balance-chip{font-family:var(--mono);font-size:.7rem;font-weight:700;color:var(--text);padding:.22rem .55rem;border:1px solid var(--border);border-radius:20px;background:rgba(0,0,0,.22)}
    .balance-bar.xrpl{position:relative;top:-14px}
    .balance-bar.base{position:relative;top:-26px}
    .balance-bar.xrpl .balance-title{color:var(--yellow)}
    .balance-bar.base .balance-title{color:var(--accent)}
    .balance-bar.xrpl .balance-chip span{color:var(--yellow)}
    .balance-bar.base .balance-chip span{color:var(--accent)}
    .form-card{background:rgba(8,15,30,.9);border:1px solid var(--border);border-radius:4px;overflow:hidden}
    .form-card-header{padding:.7rem 1rem;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:.6rem;font-family:var(--mono);font-size:.7rem;font-weight:700}
    .form-card-header.swap{color:var(--accent)}.form-card-header.send{color:var(--green)}.form-card-header.bal{color:var(--yellow)}
    .form-card-body{padding:1rem;display:flex;flex-direction:column;gap:.75rem}
    .form-row{display:flex;gap:.65rem;align-items:flex-end}
    .form-group{display:flex;flex-direction:column;gap:.3rem;flex:1}
    .form-label{font-family:var(--mono);font-size:.55rem;color:var(--muted);text-transform:uppercase;letter-spacing:.1em}
    .form-input,.form-select{background:rgba(0,0,0,.4);border:1px solid var(--border);border-radius:3px;color:var(--text);font-family:var(--mono);font-size:.75rem;padding:.55rem .75rem;outline:none;transition:border-color .2s;width:100%}
    .form-input:focus,.form-select:focus{border-color:rgba(0,194,255,.4)}
    .form-select option{background:var(--surface)}
    .cap-note{font-family:var(--mono);font-size:.6rem;color:var(--muted)}
    .cap-note span{color:var(--yellow)}
    .submit-btn{font-family:var(--mono);font-size:.75rem;font-weight:700;border:none;border-radius:3px;padding:.65rem 1.25rem;cursor:pointer;transition:all .15s;white-space:nowrap}
    .submit-btn.blue{background:var(--accent2);color:#fff}.submit-btn.green{background:var(--green);color:#000}.submit-btn.yellow{background:var(--yellow);color:#000}
    .submit-btn:hover{filter:brightness(1.1)}.submit-btn:active{transform:scale(.98)}.submit-btn:disabled{opacity:.35;cursor:not-allowed;filter:none}
    .right-panel{border-left:1px solid rgba(0,194,255,.25);display:flex;flex-direction:column;background:#000;overflow:hidden;padding-bottom:50px;box-sizing:border-box}
    .log-header{padding:.75rem 1rem;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
    .log-title{font-family:var(--mono);font-size:.7rem;font-weight:700;color:var(--text)}
    .log-live{font-family:var(--mono);font-size:.6rem;color:var(--green);display:flex;align-items:center;gap:.3rem}
    #activity-log{flex:1;overflow-y:auto;padding:.65rem;display:flex;flex-direction:column;gap:.25rem;font-family:var(--mono);font-size:.65rem;-webkit-overflow-scrolling:touch;overscroll-behavior-y:auto}
    .log-entry{padding:.35rem .6rem;border-radius:2px;line-height:1.5;animation:logFadeIn .25s ease}
    .log-entry.sys{color:#7dd3ff}
    .log-entry.sys .ts{color:rgba(0,194,255,.85)}
    .log-entry.info{color:var(--accent);background:rgba(0,194,255,.08);font-weight:700;text-shadow:0 0 8px rgba(0,194,255,.35)}
    .log-entry.success{color:var(--green);background:rgba(0,255,170,.05)}.log-entry.error{color:var(--red);background:rgba(255,59,92,.05)}
    .log-entry.tx{color:var(--yellow);background:rgba(255,200,71,.05)}
    .log-entry .ts{color:var(--muted);margin-right:.4rem;font-size:.6rem}
    .log-entry a{color:var(--accent);text-decoration:none}.log-entry a:hover{text-decoration:underline}
    @keyframes logFadeIn{from{opacity:0;transform:translateX(6px)}to{opacity:1;transform:translateX(0)}}
    .modal-overlay{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.8);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center}
    .modal-overlay.open{display:flex}
    .modal{background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:2rem;width:100%;max-width:480px;max-height:90vh;overflow-y:auto;position:relative}
    .modal::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--green),transparent)}
    .modal h3{font-family:var(--sans);font-size:1.1rem;font-weight:800;color:#fff}
    .modal-sub{font-family:var(--mono);font-size:.7rem;color:var(--muted);margin-top:.4rem;line-height:1.5}
    .modal-warning{margin:1rem 0;padding:.85rem 1rem;background:rgba(255,59,92,.07);border:1px solid rgba(255,59,92,.25);border-radius:3px;font-family:var(--mono);font-size:.72rem;color:var(--red);line-height:1.6}
    .cred-block{margin:.65rem 0;background:rgba(0,0,0,.4);border:1px solid var(--border);border-radius:3px;padding:.75rem}
    .cred-lbl{font-family:var(--mono);font-size:.55rem;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.3rem}
    .cred-val{font-family:var(--mono);font-size:.7rem;color:var(--text);word-break:break-all;line-height:1.5}
    .modal-actions{display:flex;gap:.75rem;margin-top:1.25rem}
    .modal-btn{font-family:var(--mono);font-size:.75rem;font-weight:700;border:none;border-radius:3px;padding:.65rem 1.25rem;cursor:pointer;transition:all .15s}
    .modal-btn.primary{background:var(--green);color:#000}.modal-btn.outline{background:transparent;color:var(--muted);border:1px solid var(--border)}
    .modal-btn:hover{filter:brightness(1.1)}

    /* ====== MicroPost Grid Footer (for ai-agent-16.ejs) ====== */
    /* Wrapper: negative margin trims phantom scroll below MicroPost + footer */
    .micropost-bottom-stack{display:flex;flex-direction:column;gap:0;margin-bottom:-58px}
    /* Footer: same borders as CTA; bg uses --micropost-footer-bg (not --micropost-strip-bg) */
    /* margin-top (not top) pulls the footer up in the layout flow and trims phantom scroll below it */
    .micropost-footer-compact{
      padding:.75rem 1rem;
      border-top:1px solid rgba(0,194,255,.25);
      border-bottom:1px solid rgba(0,194,255,.25);
      background:var(--micropost-footer-bg);
      font-family:var(--mono);
      font-size:.82rem;
      font-weight:700;
      color:var(--muted);
      margin:-61px 0 0;
      text-align:center;
      line-height:1.55;
      display:flex;
      align-items:center;
      justify-content:center;
    }
    .micropost-footer-compact::before{
      content:'© 2026 Fintech Wave / Fintech Wave AI';
    }

    @media (max-width: 1180px){
      .layout{grid-template-columns:340px 1fr 360px}
      .command-grid{grid-template-columns:1fr}
      .form-row.send-fields-row{flex-wrap:wrap}
      .form-group.addr-grow{min-width:100%}
    }