:root{--line:#06c755;--ink:#172033;--muted:#687086}*{box-sizing:border-box}body{font-family:"Noto Sans Thai",sans-serif;color:var(--ink);min-height:100vh}.line-connect-shell{min-height:calc(100vh - 84px);display:grid;place-items:center;padding:48px 20px;background:radial-gradient(circle at 15% 15%,rgba(6,199,85,.12),transparent 32%),radial-gradient(circle at 85% 80%,rgba(109,91,255,.12),transparent 34%),#f7f8fc}.line-connect-card{width:min(620px,100%);padding:46px;border:1px solid #e7e9f1;border-radius:28px;background:rgba(255,255,255,.94);box-shadow:0 30px 80px rgba(31,37,58,.14);text-align:center}.line-state-icon{display:grid;place-items:center;width:72px;height:72px;margin:auto;border-radius:22px;background:var(--line);color:#fff;font-size:20px;font-weight:800;box-shadow:0 14px 30px rgba(6,199,85,.25)}.line-eyebrow{margin:22px 0 4px;color:var(--line);font-size:12px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.line-connect-card h2{margin:0;font-size:clamp(27px,5vw,38px)}.line-connect-card>p:not(.line-eyebrow){color:var(--muted)}.line-alert{margin:24px 0;padding:13px 16px;border-radius:14px;background:#f1f3f8;font-weight:600}.line-alert.success{background:#e7f9ee;color:#087f3b}.line-alert.waiting{background:#fff8df;color:#8b6500}.line-alert.error{background:#fff0f1;color:#b42332}.line-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}.line-steps div{padding:18px 12px;border:1px solid #e8eaf1;border-radius:16px}.line-steps b{display:grid;place-items:center;width:28px;height:28px;margin:0 auto 9px;border-radius:50%;background:#eef0ff;color:#5445dd}.line-steps span{font-size:13px;line-height:1.5}.line-primary,.line-secondary{display:block;width:100%;padding:15px;border:0;border-radius:14px;font:inherit;font-weight:800;text-decoration:none;cursor:pointer}.line-primary{background:var(--line);color:#fff;box-shadow:0 12px 24px rgba(6,199,85,.2)}.line-code-wrap{margin:18px 0;padding:20px;border:1px dashed #cfd3df;border-radius:16px;background:#fafbfe}.line-code-wrap small,.line-code-wrap span{display:block;color:var(--muted)}#line-code{border:0;background:none;color:var(--ink);font:800 42px/1.25 "Noto Sans Thai",sans-serif;letter-spacing:.14em;cursor:pointer}.line-secondary{background:#eef0f5;color:#343b4c}.hidden{display:none!important}@media(max-width:600px){.line-connect-card{padding:30px 20px}.line-steps{grid-template-columns:1fr;text-align:left}.line-steps div{display:flex;align-items:center;gap:12px}.line-steps b{margin:0;flex:0 0 28px}#line-code{font-size:34px}}
