:root{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:#17283b;background:#f7f9fc;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 85% 25%,#eeedff 0,transparent 37%),#f7f9fc}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #4338ca;outline-offset:3px}a{color:inherit;text-decoration:none}.shell{max-width:1250px;margin:auto;padding:0 42px}.topbar{display:flex;align-items:center;justify-content:space-between;min-height:98px;border-bottom:1px solid #e5e9ed}.brand{display:inline-flex;gap:13px;align-items:center;font-size:17px;font-weight:750;letter-spacing:-.035em}.brand-mark{height:38px;width:38px;display:grid;place-items:center;color:#4f46e5}.brand-mark svg{width:34px}.quiet-button{border:0;background:transparent;color:#556477;font-size:13px;display:flex;gap:12px;align-items:center}.quiet-button span{font-size:23px;font-weight:300}.hero{display:grid;grid-template-columns:1.06fr .94fr;gap:min(6vw,80px);align-items:center;padding:77px 0 91px;min-height:690px}.content{max-width:585px}.eyebrow{color:#4f46e5;letter-spacing:.15em;font-size:11px;font-weight:800;display:flex;align-items:center;gap:9px}.dot{width:7px;height:7px;background:#4f46e5;border-radius:50%}h1{font-size:clamp(36px,4vw,55px);line-height:1.12;letter-spacing:-.048em;margin:19px 0 17px;font-weight:800;max-width:620px}.lead{color:#586777;font-size:17px;line-height:1.72;max-width:570px;margin:0 0 28px}code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.92em;background:#edf1f3;padding:1px 5px;border-radius:5px;color:#274355}.status{display:inline-flex;align-items:center;gap:8px;border:1px solid #dfeae7;background:#eef7f3;padding:9px 13px;border-radius:999px;color:#307067;font-size:12px;font-weight:650}.status[data-kind="offline"]{background:#f5f6f9;border-color:#e4e8ec;color:#5d6978}.status[data-kind="connected"]{background:#e8f7f0;border-color:#c9e8d9;color:#136e4f}.status-dot{width:7px;height:7px;border-radius:50%;background:currentColor}.instructions{margin-top:27px;min-height:203px}.instructions h2{font-size:20px;letter-spacing:-.03em;margin:0 0 14px}.steps{list-style:none;padding:0;margin:0;display:grid;gap:12px}.steps li{display:flex;gap:12px;align-items:start;color:#405165;line-height:1.46;font-size:14px}.steps strong{color:#213449}.step-number{flex:0 0 25px;height:25px;display:grid;place-items:center;border-radius:50%;background:#eeedff;color:#4f46e5;font-size:12px;font-weight:800}.inline-icon{display:inline-flex;vertical-align:middle;width:17px;height:17px}.inline-icon svg{width:17px}.bodycopy,.aside{font-size:14px;line-height:1.67;color:#637183}.aside{margin:13px 0 2px}.text-button{border:none;padding:0;background:transparent;color:#4f46e5;font-weight:700;font-size:13px;text-align:left;margin:15px 0 0;text-decoration:underline;text-underline-offset:4px}.actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:27px}.primary-button{border:1px solid #4f46e5;background:#4f46e5;color:#fff;font-size:14px;font-weight:750;padding:15px 23px;border-radius:12px;box-shadow:0 8px 18px #006e6926;display:inline-flex;align-items:center;gap:22px}.primary-button:hover{background:#4338ca}.primary-button:disabled{opacity:.5;cursor:wait}.secondary-button{background:#fff;border:1px solid #dae4e6;color:#32475c;padding:15px 20px;border-radius:12px;font-size:13px;font-weight:700}.secondary-button:hover{background:#eef6f6}.feedback{font-size:13px;color:#ac4d3d;margin:12px 0 0;min-height:21px;line-height:1.5}.feedback[data-kind="success"]{color:#18705e}.preview-banner{margin-top:15px;padding:11px 13px;border:1px solid #ebd7a9;background:#fff7e9;border-radius:9px;font-size:12px;color:#875d15}.visual{padding:28px 24px 20px;background:linear-gradient(145deg,#eeedff,#eeedff 60%,#eeedff);border-radius:25px;box-shadow:0 20px 55px #24455312}.visual-caption{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 18px 3px}.visual-tag{font-size:10px;font-weight:850;letter-spacing:.14em;color:#33645f}.visual-chip{border-radius:30px;background:#f0faf7;color:#27796e;padding:7px 9px;font-size:9px;font-weight:800;letter-spacing:.09em}.mock-app{background:#fff;border:1px solid #dfebec;box-shadow:0 25px 45px #395f6119;border-radius:16px;overflow:hidden}.mock-title{display:flex;align-items:center;gap:12px;padding:22px 20px;border-bottom:1px solid #edf0f2}.file-icon{width:36px;height:38px;border-radius:9px;background:#eeedff;color:#4f46e5;display:grid;place-items:center;font-weight:850}.mock-title strong{display:block;font-size:14px}.mock-title small{display:block;font-size:10px;color:#8a9ba7;margin-top:4px}.checkmark{margin-left:auto;background:#e0f6eb;border-radius:50%;padding:4px 7px;color:#4f46e5;font-size:11px}.mock-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:17px 20px}.mock-stats div{border:1px solid #e9edf0;border-radius:9px;padding:12px}.mock-stats span{display:block;color:#81909d;font-size:10px;margin-bottom:5px}.mock-stats strong{font-size:16px;font-weight:800}.mock-section{display:flex;justify-content:space-between;align-items:center;font-size:9px;font-weight:850;letter-spacing:.12em;padding:11px 20px 9px;color:#7a8a98}.mock-section span:last-child{font-weight:500;letter-spacing:0}.schema{display:grid;grid-template-columns:1fr auto;gap:11px 8px;margin:0 20px;padding:14px 16px;border-radius:9px;background:#f6f9fb;color:#4b6174;font:11px ui-monospace,SFMono-Regular,Consolas,monospace}.schema span:nth-child(even){color:#4f46e5}.rows-heading{margin-top:12px}.table-scroll{overflow-x:auto;margin:0 20px 19px;border:1px solid #edf0f2;border-radius:9px}table{width:100%;border-collapse:collapse;font-size:10px;white-space:nowrap}th{background:#f6f9fa;color:#617281;font-weight:750;text-align:left}td{color:#536878}td,th{padding:11px 13px;border-bottom:1px solid #edf1f2}tr:last-child td{border-bottom:0}.visual-note{text-align:center;color:#5f7f81;font-size:10px;margin:17px 0 0}footer{display:flex;justify-content:space-between;gap:20px;padding:24px 0 36px;border-top:1px solid #e5eaec;color:#8995a1;font-size:11px}@media(max-width:940px){.shell{padding:0 28px}.hero{gap:30px;grid-template-columns:1fr 1fr;padding:45px 0}h1{font-size:38px}.visual{padding:20px 13px}.mock-title{padding:15px 10px}.mock-stats{padding:10px;gap:4px}.mock-stats div{padding:7px}.mock-section{padding:11px}.schema{margin:0 10px}.table-scroll{margin:0 10px 10px}}@media(max-width:710px){.shell{padding:0 20px}.topbar{min-height:75px}.hero{display:flex;flex-direction:column;align-items:stretch;padding:46px 0 48px;min-height:auto;gap:36px}.content{max-width:none}h1{font-size:clamp(34px,8vw,43px)}.lead{font-size:16px}.instructions{min-height:0}.visual{max-width:520px;width:100%;margin:0 auto}.actions{margin-top:27px}.primary-button{flex:1;justify-content:center}.secondary-button{padding:13px 14px}.quiet-button{font-size:12px}footer{font-size:10px}}@media(max-width:380px){.actions{display:grid}.primary-button{justify-content:space-between}.secondary-button{justify-content:center}.brand{font-size:15px}.brand-mark{width:30px}.brand-mark svg{width:30px}}@media(prefers-reduced-motion:no-preference){button{transition:background .15s ease,transform .15s ease}.primary-button:active{transform:translateY(1px)}}