/* the agent page: getting the Chrome extension and connecting it */
.ag-get{display:grid;grid-template-columns:1.2fr 1fr;gap:18px;margin-top:22px}
.ag-get > div{border-radius:20px;padding:20px 22px;background:linear-gradient(160deg,rgba(255,255,255,.9),rgba(238,245,255,.85));border:1px solid rgba(10,19,48,.08);box-shadow:0 10px 30px -18px rgba(10,19,48,.35)}
.ag-get h3{margin:0 0 10px;font-size:18px}
.ag-get ol{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:10px;line-height:1.5}
.ag-get code{font-size:.92em;background:rgba(10,19,48,.07);padding:1px 6px;border-radius:6px}
.ag-get .btn.small{margin-right:4px}
.ag-conn{display:flex;flex-direction:column;gap:10px}
.ag-conn-st{margin:0;font-weight:600;color:var(--tx-2,#3A4664)}
.ag-conn-st[data-ok="1"]{color:#0A8466}
.ag-conn-st[data-ok="0"]{color:#B42318}
.ag-conn-b{display:flex;gap:8px;flex-wrap:wrap}
.ag-conn .fine{margin:0}
@media (max-width:820px){.ag-get{grid-template-columns:1fr}}
/* dark theme: deep glass cards with light text (the light glass made the text unreadable) */
html[data-theme="dark"] .ag-get > div{background:linear-gradient(160deg,rgba(22,32,66,.92),rgba(12,20,46,.92));border-color:rgba(255,255,255,.1);box-shadow:0 14px 34px -18px rgba(0,0,0,.7)}
html[data-theme="dark"] .ag-get h3{color:#fff}
html[data-theme="dark"] .ag-get ol,html[data-theme="dark"] .ag-get li{color:#D9E0F0}
html[data-theme="dark"] .ag-get b{color:#fff}
html[data-theme="dark"] .ag-get code{background:rgba(255,255,255,.1);color:#E6ECFA}
html[data-theme="dark"] .ag-get .sp-note,html[data-theme="dark"] .ag-conn .fine{color:#A9B4D0}
html[data-theme="dark"] .ag-conn-st{color:#D9E0F0}
html[data-theme="dark"] .ag-conn-st[data-ok="1"]{color:#3BD6A8}
html[data-theme="dark"] .ag-conn-st[data-ok="0"]{color:#FF8A6B}
.ag-code{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.ag-code .btn{align-self:flex-start}
.ag-code-out{margin:0;font-size:14px;line-height:1.5}
.ag-code-out b{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:18px;letter-spacing:.12em;padding:2px 8px;border-radius:8px;background:rgba(47,91,255,.1)}
html[data-theme="dark"] .ag-code-out{color:#D9E0F0} html[data-theme="dark"] .ag-code-out b{background:rgba(143,168,255,.18);color:#fff}