.connection-panel{background:var(--surface-2);border:1px solid var(--line);border-radius:26px;padding:42px;display:grid;grid-template-columns:.85fr 1.15fr;gap:65px;align-items:center}.connection-intro h2{font-size:35px;line-height:1.8;font-weight:800;letter-spacing:-.8px;margin:15px 0}.connection-intro>p{color:var(--muted);font-size:16px;max-width:320px}.use-choice{font-size:14px;margin-top:28px;display:inline-block;border:1px solid var(--line-2);padding:7px 15px;border-radius:30px;background:var(--glass);color:var(--mint)}.use-choice strong{font-weight:600}.connection-intro p.use-advice{font-size:14px;line-height:2.1}.connection-box{background:var(--surface);border-radius:20px;padding:27px;border:1px solid var(--mint-line)}.protocol-tabs{display:flex;background:var(--surface-2);border-radius:12px;padding:5px;gap:5px;direction:ltr}.protocol-tabs button{flex:1;border:0;background:none;color:var(--muted-2);border-radius:9px;padding:10px 5px;font-family:Arial,sans-serif;font-size:19px;font-weight:700}.protocol-tabs small{display:block;font:12px var(--font);margin-top:3px}.protocol-tabs button.active{background:var(--surface);color:var(--accent-dark);box-shadow:0 3px 10px var(--shadow)}.protocol-info h3{font-size:18px;margin:23px 0 7px}.protocol-info p{font-size:14px;color:var(--muted);line-height:2;margin:0 0 14px;min-height:56px}.sample-tag{font-size:12px;color:var(--accent-dark);background:var(--accent-soft);padding:5px 10px;border-radius:7px;margin-block:14px}.endpoint label{font-size:12px;color:var(--muted)}.endpoint>div{display:flex;direction:ltr;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;align-items:center;margin-top:5px;margin-bottom:10px;overflow:hidden}.endpoint input{background:none;border:0;color:var(--ink);font:16px monospace;padding:12px 13px;width:100%;min-width:0}.copy-button{border:0;border-left:1px solid var(--line);color:var(--muted-2);background:none;padding:10px 13px;display:flex}.copy-button:hover{color:var(--accent-dark);background:var(--accent-soft)}.copy-button svg{width:19px;height:19px}.connection-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:13px}.connection-bottom>span{font-size:12px;color:var(--muted-2)}.connection-bottom a{font-size:14px;color:var(--accent-dark);display:flex;gap:7px;align-items:center}.connection-bottom svg{width:18px}.guide-panel{border:1px solid var(--line);border-radius:20px;background:var(--surface);padding:27px 30px}.device-tabs{display:flex;gap:10px;border-bottom:1px solid var(--line);padding-bottom:20px;flex-wrap:wrap}.device-tabs button{border:1px solid transparent;background:var(--surface-2);border-radius:9px;color:var(--muted);font-size:14px;padding:8px 24px}.device-tabs .active{color:var(--accent-dark);background:var(--accent-soft);border-color:var(--accent-line)}.guide-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;padding-top:28px}.guide-step .step-number{width:31px;height:31px;background:var(--mint-soft);color:var(--mint);display:grid;place-items:center;border-radius:50%;font-size:14px}.guide-step h3{font-size:16px;margin:13px 0 6px}.guide-step p{font-size:14px;color:var(--muted);line-height:2;margin:0}.guide-note{font-size:12px;color:var(--p-butter);border-top:1px solid var(--line);padding-top:20px;margin-top:24px;margin-bottom:0}.guide-source{font-size:12px;color:var(--accent-dark)}.faq-section{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px}.faq-section h2{font-size:27px;margin:12px 0}.faq-section>div>p{font-size:14px;color:var(--muted)}.faq-list details{border-bottom:1px solid var(--line)}.faq-list summary{cursor:pointer;list-style:none;font-size:15px;padding:19px 0;display:flex;justify-content:space-between;gap:20px}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{content:'+';font:22px Arial,sans-serif;color:var(--faint)}.faq-list details[open] summary:after{content:'−'}.faq-list details p{font-size:14px;color:var(--muted);line-height:2.15;padding:0 0 20px;margin:0}.faq-list a{color:var(--accent-dark);text-decoration:underline}.button{background:var(--accent-dark)}.button:hover{background:var(--accent-dark)}.main-art{max-width:none}.hero-art{overflow:hidden}.card-text small,.float-label small,.art-caption{font-size:12px;letter-spacing:.5px}.card-text small{font-size:12px;letter-spacing:0}.hero-features{font-size:12px}.service-card{padding-left:18px}.card-arrow{display:none}
@media(max-width:1100px){.connection-panel{padding:30px;gap:30px}.connection-intro h2{font-size:31px}.connection-box{padding:21px}.service-card{flex-direction:column}.guide-steps{gap:23px}}
@media(max-width:760px){.connection-panel{padding:24px 17px;grid-template-columns:1fr;gap:17px}.connection-intro h2{font-size:29px;margin:10px 0}.connection-intro h2 br{display:none}.connection-intro>p{max-width:none}.use-choice{margin-top:5px}.connection-box{padding:18px}.protocol-tabs small{font-size:12px}.sample-tag{font-size:12px}.connection-bottom>span{font-size:12px}.guide-panel{padding:23px 20px}.device-tabs{gap:8px;display:grid;grid-template-columns:repeat(2,1fr)}.device-tabs button{padding:9px 13px}.guide-steps{grid-template-columns:1fr;gap:25px}.guide-step{position:relative;padding-right:46px}.guide-step .step-number{position:absolute;right:0;top:0}.guide-step h3{margin-top:0}.faq-section{grid-template-columns:1fr;gap:8px}.faq-section h2{font-size:25px}.faq-list summary{font-size:14px}.endpoint input{font-size:14px}.card-text small{font-size:12px}.hero-actions .button{padding:14px 13px}.float-label small{font-size:10px}.art-caption{font-size:10px}}@media(max-width:380px){h1{font-size:36px}.nav{gap:9px}.brand img{width:85px}.nav-cta{font-size:12px}.service-grid{grid-template-columns:1fr}.service-card{flex-direction:row}}
.main-art{width:112%;height:auto;max-height:100%;object-fit:contain;mask-image:radial-gradient(ellipse at center,black 38%,transparent 72%)}
