/* Connection guide: frosted glass over a warm instrument-panel surface. */
.connect-page{position:relative;z-index:1;max-width:1180px;margin:auto;padding:100px 28px 90px;color:#efebe6}
.connect-hero{max-width:780px;margin-bottom:40px}.connect-eyebrow{font:11px var(--ff-mono,monospace);letter-spacing:.2em;text-transform:uppercase;color:#efaa85}
.connect-hero h1{font:800 clamp(38px,6vw,70px)/1.05 var(--ff-head,system-ui);letter-spacing:-.025em;margin:18px 0}.connect-hero h1 em{font-style:normal;color:#ffb693}
.connect-hero p,.connect-panel p{color:#bcb6b2;line-height:1.7}.connect-hero p{max-width:60ch;font-size:18px}
.connect-panel,.connect-option{position:relative;border:1px solid #ffffff17;border-top-color:#ffffff30;border-radius:22px;background:linear-gradient(145deg,#ffffff0d,#ffffff02),#19181ccf;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);box-shadow:0 18px 45px #0005,inset 0 1px 0 #ffffff0a;padding:28px;min-width:0}
.connect-panel{margin:18px 0}.connect-panel::before{content:'';position:absolute;top:0;left:25px;right:25px;height:1px;background:linear-gradient(90deg,transparent,#efaa8570,transparent)}
.connect-stephead{display:flex;align-items:center;gap:16px;margin-bottom:18px}.connect-stephead h2{font:700 24px var(--ff-head,system-ui);margin:0}
.connect-number{flex:none;width:44px;height:44px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(145deg,#373236,#17161a);border:1px solid #ffffff12;box-shadow:4px 5px 10px #0007,inset 0 1px 0 #ffffff24;font:12px var(--ff-mono,monospace);color:#ffb693}
.connect-status{display:inline-flex;align-items:center;gap:8px;font:12px var(--ff-mono,monospace);color:#cbc6c1}.connect-status::before{content:'';width:7px;height:7px;border-radius:50%;background:#bda182;box-shadow:0 0 10px #bda18240}.connect-status[data-live=true]::before{background:#a4dfbf;box-shadow:0 0 10px #a4dfbf88}
.connect-options{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.connect-option{padding:24px;background:linear-gradient(160deg,#ffffff08,transparent),#18171bd9;display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.connect-option h3{font:700 23px var(--ff-head,system-ui);margin:0}.connect-option p{font-size:14px;margin:0;flex:1}.connect-option .gbtn{font-size:10px;letter-spacing:.08em;white-space:normal;line-height:1.5;text-align:center}
.connect-option--web{border-color:#d89c7055;background:radial-gradient(ellipse at 100% 0,#b9633428,transparent 75%),#211c20d9}
.connect-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:13px;color:#e7c1a9;font:23px system-ui;background:#131217;box-shadow:inset 3px 3px 7px #0009,inset -1px -1px 2px #ffffff14}
.connect-tag{font:10px var(--ff-mono,monospace);letter-spacing:.08em;text-transform:uppercase;color:#d8b393}.connect-actions{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin-top:20px}
.connect-page a:not(.gbtn){color:#ffbd9c;text-underline-offset:4px}.connect-page .gbtn:focus-visible,.connect-page summary:focus-visible{outline:2px solid #ffd3b8;outline-offset:5px}.connect-page button:disabled{opacity:.5;cursor:wait}
.connect-instructions{display:grid;grid-template-columns:1.1fr .9fr;gap:26px}.connect-steps{list-style:none;margin:0;padding:0;counter-reset:instruction}.connect-steps li{counter-increment:instruction;position:relative;padding:0 0 20px 32px;line-height:1.65;color:#c5bfba}.connect-steps li::before{content:counter(instruction);position:absolute;left:0;top:2px;color:#eab08e;font:12px/22px var(--ff-mono,monospace)}
.connect-readout{padding:22px;border-radius:16px;background:#101215;box-shadow:inset 5px 5px 12px #000b,inset -1px -1px 2px #ffffff20;border:1px solid #000;align-self:start}.connect-readout dl{display:grid;grid-template-columns:1fr auto;gap:18px;margin:20px 0 0}.connect-readout dt{font:10px var(--ff-mono,monospace);text-transform:uppercase;letter-spacing:.12em;color:#aaa7aa}.connect-readout dd{margin:0;font:600 19px var(--ff-mono,monospace);color:#b8ebd4;overflow-wrap:anywhere}
.connect-note{font-size:13px!important;color:#aca5a3!important}.connect-feedback{padding:16px;border-radius:12px;background:#211b18;border:1px solid #c98c5550;margin-top:18px;line-height:1.6}.connect-panel details{margin-top:22px;border-top:1px solid #ffffff14;padding-top:20px}.connect-panel summary{cursor:pointer;color:#e5d0bf}.connect-panel[hidden],.connect-page [hidden]{display:none!important}
.connect-entry{padding:24px;margin:24px 0;background:linear-gradient(120deg,#49302577,#1b1b22b8);border:1px solid #dba58140;border-radius:18px;box-shadow:inset 0 1px 0 #ffffff16,0 12px 30px #0003;backdrop-filter:blur(16px);display:flex;align-items:center;justify-content:space-between;gap:24px}.connect-entry h2{font-size:22px;margin:0 0 8px}.connect-entry p{color:var(--dim,#c0b9b4);margin:0;line-height:1.6}.connect-entry .gbtn{flex-shrink:0}
@media(max-width:850px){.connect-options{grid-template-columns:1fr}.connect-option{gap:12px}.connect-instructions{grid-template-columns:1fr}.connect-entry{align-items:flex-start;flex-direction:column}}
@media(max-width:480px){.connect-page{padding:84px 16px 60px}.connect-panel{padding:20px}.connect-stephead h2{font-size:21px}.connect-readout{padding:16px}.connect-readout dd{font-size:16px}.connect-actions .gbtn{width:100%;justify-content:center}.connect-hero h1{font-size:40px}}
@media(prefers-reduced-transparency:reduce){.connect-panel,.connect-option{background:#1d1b20;backdrop-filter:none}}