.dsg-page{--dsg-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    --dsg-ink:#1c1b22; --dsg-muted:#6b6a76; --dsg-line:#e2e1ea;
    --dsg-bg:#fafafa; --dsg-card:#ffffff; --dsg-tint:#f6f6fb;
    --dsg-blue:#3B82F6; --dsg-violet:#8B5CF6; --dsg-cyan:#06B6D4; --dsg-green:#0f9e75;
    --dsg-shadow:0 1px 2px rgba(15,23,42,.10);}
@media (prefers-color-scheme: dark){.dsg-page{--dsg-ink:#ecebf3; --dsg-muted:#a6a4b2; --dsg-line:#3c3b49;
      --dsg-bg:#151420; --dsg-card:#1c1b2a; --dsg-tint:#211f31;
      --dsg-blue:#7aadf2; --dsg-violet:#a9a1f2; --dsg-cyan:#5ad4e6; --dsg-green:#5cd0a4;
      --dsg-shadow:0 1px 2px rgba(0,0,0,.35);}}
.dsg-page{margin:0;background:var(--dsg-bg);color:var(--dsg-ink);font-family:var(--dsg-font)}
.dsg-page .dsg-wrap{max-width:860px;margin:0 auto;padding:40px 20px 72px;line-height:1.65}
.dsg-page .dsg-hero{text-align:center;margin-bottom:8px}
.dsg-page .dsg-hero h1{font-size:30px;font-weight:800;letter-spacing:-.02em;margin:14px 0 8px}
.dsg-page .dsg-hero p{color:var(--dsg-muted);font-size:15.5px;max-width:560px;margin:0 auto}
.dsg-page .dsg-lockup{display:inline-flex;align-items:center;gap:9px;font-weight:800;font-size:19px;letter-spacing:-.02em;
    background:linear-gradient(90deg,#3B82F6,#8B5CF6,#06B6D4);-webkit-background-clip:text;background-clip:text;color:transparent}
.dsg-page .dsg-lockup svg{display:block}
.dsg-page .dsg-part{background:var(--dsg-card);border:1px solid var(--dsg-line);border-radius:16px;
    box-shadow:var(--dsg-shadow);padding:28px 30px;margin:26px 0}
.dsg-page .dsg-part-head{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.dsg-page .dsg-num{width:38px;height:38px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;
    font-weight:800;font-size:15px;color:#fff;background:linear-gradient(135deg,var(--nc1),var(--nc2))}
.dsg-page .dsg-part h2{font-size:19px;font-weight:800;margin:0;letter-spacing:-.01em}
.dsg-page .dsg-part p{color:var(--dsg-muted);font-size:14.5px;margin:.5em 0}
.dsg-page .dsg-part strong{color:var(--dsg-ink);font-weight:650}
.dsg-page .dsg-kicker{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--dsg-muted)}
.dsg-page .dsg-box{border-radius:12px;padding:13px 16px;display:flex;gap:11px;align-items:flex-start;margin:14px 0;font-size:13.5px;color:var(--dsg-muted)}
.dsg-page .dsg-box b{color:var(--dsg-ink);font-weight:650}
.dsg-page .dsg-box.tip{background:rgba(139,92,246,.08);border:1px solid rgba(139,92,246,.25)}
.dsg-page .dsg-box.info{background:rgba(59,130,246,.08);border:1px solid rgba(59,130,246,.25)}
.dsg-page .dsg-box.ok{background:rgba(16,185,129,.08);border:1px solid rgba(16,185,129,.25)}
.dsg-page .dsg-url{display:flex;gap:12px;align-items:center;background:var(--dsg-tint);border:1px solid var(--dsg-line);
    border-radius:10px;padding:12px 16px;margin:14px 0;flex-wrap:wrap}
.dsg-page .dsg-url .lbl{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--dsg-muted)}
.dsg-page .dsg-url code{font-family:ui-monospace,Menlo,monospace;font-size:13.5px;color:var(--dsg-blue);word-break:break-all}
.dsg-page .dsg-mini{list-style:none;margin:14px 0;padding:0;display:flex;flex-direction:column;gap:9px}
.dsg-page .dsg-mini li{display:flex;gap:11px;align-items:flex-start;font-size:14px;color:var(--dsg-muted)}
.dsg-page .dsg-mini .n{width:22px;height:22px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;
    font-size:11px;font-weight:700;color:var(--dsg-violet);background:rgba(139,92,246,.12);border:1px solid rgba(139,92,246,.3);margin-top:1px}
.dsg-page .dsg-chips{display:flex;flex-wrap:wrap;gap:9px;margin:14px 0}
.dsg-page .dsg-chip{border:1px solid rgba(59,130,246,.3);background:rgba(59,130,246,.07);border-radius:999px;
    padding:7px 15px;font-size:13px;font-style:italic;color:var(--dsg-ink)}
.dsg-page /* CSS-only tabs */
  .dsg-tabs input{position:absolute;opacity:0;pointer-events:none}
.dsg-page .dsg-tabbar{display:flex;gap:8px;margin:6px 0 18px}
.dsg-page .dsg-tabbar label{flex:1;text-align:center;padding:11px 16px;border-radius:10px;cursor:pointer;font-weight:700;font-size:14px;
    color:var(--dsg-muted);background:var(--dsg-tint);border:1px solid var(--dsg-line);transition:all .15s}
.dsg-page #dsg-tab-claude:checked ~ .dsg-tabbar label[for="dsg-tab-claude"], .dsg-page #dsg-tab-chatgpt:checked ~ .dsg-tabbar label[for="dsg-tab-chatgpt"]{color:var(--dsg-ink);background:rgba(59,130,246,.1);border-color:rgba(59,130,246,.45)}
.dsg-page .dsg-pane{display:none}
.dsg-page #dsg-tab-claude:checked ~ .dsg-pane-claude{display:block}
.dsg-page #dsg-tab-chatgpt:checked ~ .dsg-pane-chatgpt{display:block}
.dsg-page /* FAQ */
  .dsg-faq details{border-bottom:1px solid var(--dsg-line);padding:4px 0}
.dsg-page .dsg-faq summary{cursor:pointer;font-weight:650;font-size:14.5px;padding:12px 0;list-style:none;display:flex;justify-content:space-between;align-items:center}
.dsg-page .dsg-faq summary::after{content:"+";color:var(--dsg-muted);font-weight:400;font-size:18px}
.dsg-page .dsg-faq details[open] summary::after{content:"–"}
.dsg-page .dsg-faq .a{color:var(--dsg-muted);font-size:13.5px;padding:0 0 14px}
.dsg-page .dsg-cta{text-align:center;margin-top:34px}
.dsg-page .dsg-cta a{display:inline-block;background:linear-gradient(135deg,#3B82F6,#2563EB);color:#fff;font-weight:700;
    font-size:15px;padding:14px 30px;border-radius:11px;text-decoration:none;box-shadow:var(--dsg-shadow)}
.dsg-page .dsg-cta .sub{color:var(--dsg-muted);font-size:12.5px;margin-top:9px}
.dsg-page .dsg-visual{margin:20px 0 4px}
.dsg-page /* "the clock is real" — timestamped setup checklist (hero → Part 1 bridge). Static: no motion, .dsg-page so reduced-motion safe by construction */
  .dsg-clock{background:var(--dsg-card);border:1px solid var(--dsg-line);border-radius:16px;
    box-shadow:var(--dsg-shadow);padding:22px 30px 26px;margin:26px 0}
.dsg-page .dsg-clock-head{display:flex;align-items:baseline;justify-content:space-between;gap:6px 16px;flex-wrap:wrap;margin-bottom:22px}
.dsg-page .dsg-clock-note{font-size:12px;color:var(--dsg-muted)}
.dsg-page .dsg-clock-list{list-style:none;margin:0;padding:0;position:relative;display:grid;grid-template-columns:repeat(4,1fr)}
.dsg-page .dsg-clock-list::before{content:"";position:absolute;top:6px;left:12.5%;right:12.5%;height:3px;border-radius:2px;
    background:linear-gradient(90deg,var(--dsg-blue),var(--dsg-violet),var(--dsg-cyan),var(--dsg-green))}
.dsg-page .dsg-ck{position:relative;text-align:center;padding:0 8px}
.dsg-page .dsg-ck-dot{position:relative;z-index:1;display:block;width:15px;height:15px;border-radius:50%;margin:0 auto;
    box-sizing:border-box;background:var(--dsg-card);border:3px solid var(--dsg-blue)}
.dsg-page .dsg-ck:nth-child(2) .dsg-ck-dot{border-color:var(--dsg-violet)}
.dsg-page .dsg-ck:nth-child(3) .dsg-ck-dot{border-color:var(--dsg-cyan)}
.dsg-page .dsg-ck:nth-child(4) .dsg-ck-dot{border-color:var(--dsg-green);background:var(--dsg-green)}
.dsg-page .dsg-ck:nth-child(4) .dsg-ck-dot::after{content:"";position:absolute;left:1.5px;top:2.5px;width:5px;height:2.5px;
    border-left:1.6px solid #fff;border-bottom:1.6px solid #fff;transform:rotate(-45deg)}
.dsg-page .dsg-ck-time{display:block;margin-top:10px;font-family:ui-monospace,Menlo,monospace;font-size:15.5px;font-weight:800;
    letter-spacing:-.01em;color:var(--dsg-ink);font-variant-numeric:tabular-nums}
.dsg-page .dsg-ck-label{display:block;margin-top:4px;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
    color:var(--dsg-muted);line-height:1.6}
@media (max-width:560px){.dsg-page .dsg-clock{padding:20px 22px 22px}
.dsg-page .dsg-clock-list{display:flex;flex-direction:column;gap:18px;padding-left:4px}
.dsg-page .dsg-clock-list::before{top:9px;bottom:9px;left:10px;right:auto;width:3px;height:auto;
      background:linear-gradient(180deg,var(--dsg-blue),var(--dsg-violet),var(--dsg-cyan),var(--dsg-green))}
.dsg-page .dsg-ck{display:grid;grid-template-columns:15px 1fr;column-gap:13px;text-align:left;padding:0}
.dsg-page .dsg-ck-dot{grid-row:1 / span 2;margin:2px 0 0}
.dsg-page .dsg-ck-time{margin-top:0}
.dsg-page .dsg-ck-label{margin-top:3px}}
.dsg-page /* ===== uniform site chrome — header + footer (matches the package set) ===== */
  .dsg-shell{max-width:1080px;margin:0 auto;padding:0 22px}
.dsg-page .dsg-siteband{background:#0a0e1f;padding:18px 0}
.dsg-page .dsg-topbar{display:flex;align-items:center;justify-content:space-between;gap:12px 16px;flex-wrap:wrap}
.dsg-page .dsg-topbar .dsg-lockup{font-size:18px}
.dsg-page .dsg-nav{display:flex;align-items:center;gap:4px;row-gap:8px;flex-wrap:wrap;justify-content:flex-end}
.dsg-page .dsg-nav a{font-size:13.5px;font-weight:600;color:rgba(236,235,243,.72);text-decoration:none;
    padding:8px 12px;border-radius:9px;transition:color .15s,background .15s,filter .15s}
.dsg-page .dsg-nav a:hover{color:#fff;background:rgba(255,255,255,.07)}
.dsg-page .dsg-nav .sep{width:1px;height:18px;background:rgba(255,255,255,.18);margin:0 8px;flex-shrink:0}
.dsg-page .dsg-nav a.dsg-nav-login{color:rgba(236,235,243,.58)}
.dsg-page .dsg-nav a.dsg-nav-login:hover{color:#fff;background:none;text-decoration:underline}
.dsg-page .dsg-nav a.dsg-nav-start{color:#fff;font-weight:700;border-radius:999px;padding:9px 18px;margin-left:6px;
    background:linear-gradient(120deg,#3B82F6,#8B5CF6 55%,#06B6D4);box-shadow:0 6px 18px rgba(89,91,246,.32)}
.dsg-page .dsg-nav a.dsg-nav-start:hover{filter:brightness(1.08);
    background:linear-gradient(120deg,#3B82F6,#8B5CF6 55%,#06B6D4)}
.dsg-page .dsg-sitefoot{background:#070a17;color:rgba(236,235,243,.6);padding:54px 0 0;font-size:13.5px}
.dsg-page .dsg-sitefoot .dsg-lockup{font-size:17px}
.dsg-page .dsg-foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.15fr;gap:36px 28px;padding-bottom:42px}
@media (max-width:860px){.dsg-page .dsg-foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.dsg-page .dsg-foot-grid{grid-template-columns:1fr}}
.dsg-page .dsg-foot-brand p{color:rgba(236,235,243,.55);font-size:13.5px;line-height:1.6;margin:12px 0 0;max-width:250px}
.dsg-page .dsg-foot-col h4{font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
    color:rgba(236,235,243,.42);margin:4px 0 12px}
.dsg-page .dsg-foot-col a{display:block;color:rgba(236,235,243,.7);font-size:13.5px;font-weight:500;
    text-decoration:none;padding:5px 0;transition:color .15s}
.dsg-page .dsg-foot-col a:hover{color:#fff;text-decoration:underline}
.dsg-page .dsg-foot-bar{display:flex;align-items:center;justify-content:space-between;gap:10px 18px;
    flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.08);padding:18px 0 24px;
    font-size:12.5px;color:rgba(236,235,243,.48)}
.dsg-page /* inline links in body copy */
  .dsg-part a, .dsg-page .dsg-cta .sub a{color:var(--dsg-blue);font-weight:600;text-decoration:none}
.dsg-page .dsg-part a:hover, .dsg-page .dsg-cta .sub a:hover{text-decoration:underline}
.dsg-page /* ===== embedded visual: setup-3-steps ===== */

  :root{--dast-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --dast-ink:#1c1b22;
    --dast-muted:#6b6a76;
    --dast-line:#c4c3d0;
    --dast-data:#2f6fd0;  --dast-data-tint:#eaf1fb;
    --dast-hub:#5b53c9;   --dast-hub-tint:#f4f3fe;
    --dast-ai:#0f9e75;    --dast-ai-tint:#e2f5ee;
    --dast-check:#ffffff;
    --dast-panel:#fbfbfe;}
@media (prefers-color-scheme: dark){.dsg-page{--dast-ink:#ecebf3; --dast-muted:#a6a4b2; --dast-line:#3c3b49;
      --dast-data:#7aadf2; --dast-data-tint:#172234;
      --dast-hub:#a9a1f2;  --dast-hub-tint:#1f1d31;
      --dast-ai:#5cd0a4;   --dast-ai-tint:#0e3128;
      --dast-check:#14131f;
      --dast-panel:#16151f;}}
.dsg-page .dast-strip{max-width:780px;margin:0 auto;padding:8px 16px 4px;font-family:var(--dast-font)}
.dsg-page .dast-strip svg{display:block;width:100%;height:auto}
.dsg-page .dast-title{font-size:15px;font-weight:600;fill:var(--dast-ink)}
.dsg-page .dast-sub{font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;fill:var(--dast-muted)}
.dsg-page .dast-num{font-size:16.5px;font-weight:700}
.dsg-page .dast-brand{font-size:11px;font-weight:800;letter-spacing:-0.02em}
.dsg-page .dast-panel{fill:var(--dast-panel);stroke:var(--dast-line);stroke-opacity:.6;stroke-width:1}
.dsg-page .dast-node{filter:drop-shadow(0 1px 2px rgba(15,23,42,.10))}
@media (prefers-color-scheme: dark){.dsg-page .dast-node{filter:drop-shadow(0 1px 2px rgba(0,0,0,.35))}}
.dsg-page .dast-track{fill:none;stroke:var(--dast-line);stroke-width:3;stroke-linecap:round;opacity:.55}
.dsg-page .dast-fill{fill:none;stroke:url(#dastGrad);stroke-width:3;stroke-linecap:round}
.dsg-page .dast-lit{opacity:0;transform-box:fill-box;transform-origin:center}
.dsg-page .dast-ring{opacity:0;fill:none;transform-box:fill-box;transform-origin:center}
.dsg-page .dast-chk{opacity:0}
@media (prefers-reduced-motion: no-preference){.dsg-page .dast-fill{stroke-dasharray:540;animation:dastDraw 6s ease-in-out infinite}
.dsg-page .dast-lit, .dsg-page .dast-num, .dsg-page .dast-chk, .dsg-page .dast-ring{animation-duration:6s;
      animation-timing-function:ease-out;
      animation-iteration-count:infinite;}
.dsg-page .dast-s1 .dast-lit{animation-name:dastLit1}
.dsg-page .dast-s2 .dast-lit{animation-name:dastLit2}
.dsg-page .dast-s3 .dast-lit{animation-name:dastLit3}
.dsg-page .dast-s1 .dast-num{animation-name:dastNum1}
.dsg-page .dast-s2 .dast-num{animation-name:dastNum2}
.dsg-page .dast-s3 .dast-num{animation-name:dastNum3}
.dsg-page .dast-s1 .dast-chk{animation-name:dastChk1}
.dsg-page .dast-s2 .dast-chk{animation-name:dastChk2}
.dsg-page .dast-s3 .dast-chk{animation-name:dastChk3}
.dsg-page .dast-s1 .dast-ring{animation-name:dastRing1}
.dsg-page .dast-s2 .dast-ring{animation-name:dastRing2}
.dsg-page .dast-s3 .dast-ring{animation-name:dastRing3}
@keyframes dastDraw{
      0%,4%{stroke-dashoffset:540;opacity:0}
      7%{opacity:1}
      66%{stroke-dashoffset:0}
      90%{stroke-dashoffset:0;opacity:1}
      96%,100%{stroke-dashoffset:0;opacity:0}
    }
@keyframes dastLit1{
      0%,5%{opacity:0;transform:scale(.85)}
      9%{opacity:1;transform:scale(1.06)}
      12%,90%{opacity:1;transform:scale(1)}
      96%,100%{opacity:0;transform:scale(1)}
    }
@keyframes dastLit2{
      0%,35%{opacity:0;transform:scale(.85)}
      39%{opacity:1;transform:scale(1.06)}
      42%,90%{opacity:1;transform:scale(1)}
      96%,100%{opacity:0;transform:scale(1)}
    }
@keyframes dastLit3{
      0%,64%{opacity:0;transform:scale(.85)}
      68%{opacity:1;transform:scale(1.06)}
      71%,90%{opacity:1;transform:scale(1)}
      96%,100%{opacity:0;transform:scale(1)}
    }
@keyframes dastNum1{0%,6%{opacity:1}10%,92%{opacity:0}98%,100%{opacity:1}}
@keyframes dastNum2{0%,36%{opacity:1}40%,92%{opacity:0}98%,100%{opacity:1}}
@keyframes dastNum3{0%,65%{opacity:1}69%,92%{opacity:0}98%,100%{opacity:1}}
@keyframes dastChk1{0%,7%{opacity:0}11%,90%{opacity:1}96%,100%{opacity:0}}
@keyframes dastChk2{0%,37%{opacity:0}41%,90%{opacity:1}96%,100%{opacity:0}}
@keyframes dastChk3{0%,66%{opacity:0}70%,90%{opacity:1}96%,100%{opacity:0}}
@keyframes dastRing1{0%,5%{opacity:0;transform:scale(1)}9%{opacity:.5}18%,100%{opacity:0;transform:scale(1.6)}}
@keyframes dastRing2{0%,35%{opacity:0;transform:scale(1)}39%{opacity:.5}48%,100%{opacity:0;transform:scale(1.6)}}
@keyframes dastRing3{0%,64%{opacity:0;transform:scale(1)}68%{opacity:.5}77%,100%{opacity:0;transform:scale(1.6)}}}
.dsg-page .dast-cap{margin:2px auto 0;max-width:560px;text-align:center;font-size:13.5px;line-height:1.5;color:var(--dast-muted)}
.dsg-page .dast-cap b{color:var(--dast-ink);font-weight:500}
.dsg-page /* ===== embedded visual: connect-in-claude ===== */

  :root{--dcn-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --dcn-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    --dcn-ink:#1c1b22;
    --dcn-muted:#6b6a76;
    --dcn-line:#c4c3d0;
    --dcn-panel:#f8f9fc;
    --dcn-win:#ffffff;
    --dcn-field:#f4f5f9;
    --dcn-chipfill:#ffffff;
    --dcn-scrim:#0f172a;
    --dcn-hub:#5b53c9;  --dcn-hub-tint:#f4f3fe;
    --dcn-ai:#0f9e75;   --dcn-ai-tint:#e2f5ee;}
@media (prefers-color-scheme: dark){.dsg-page{--dcn-ink:#ecebf3; --dcn-muted:#a6a4b2; --dcn-line:#3c3b49;
      --dcn-panel:#17161f; --dcn-win:#1d1c28; --dcn-field:#262433;
      --dcn-chipfill:#211f2c; --dcn-scrim:#06060a;
      --dcn-hub:#a9a1f2;  --dcn-hub-tint:#1f1d31;
      --dcn-ai:#5cd0a4;   --dcn-ai-tint:#0e3128;}}
.dsg-page .dcn-connect{max-width:780px;margin:0 auto;padding:8px 16px 4px;font-family:var(--dcn-font)}
.dsg-page .dcn-connect svg{display:block;width:100%;height:auto}
.dsg-page .dcn-panelbg{fill:var(--dcn-panel);stroke:var(--dcn-line);stroke-width:1}
.dsg-page .dcn-winbox{fill:var(--dcn-win);stroke:var(--dcn-line);stroke-width:1;filter:drop-shadow(0 3px 8px rgba(15,23,42,.10))}
.dsg-page .dcn-modalbox{fill:var(--dcn-win);stroke:var(--dcn-line);stroke-width:1;filter:drop-shadow(0 6px 16px rgba(15,23,42,.18))}
.dsg-page .dcn-rowbox{fill:var(--dcn-hub-tint);stroke:url(#dcnWordGrad);stroke-width:1.5;filter:drop-shadow(0 1px 2px rgba(15,23,42,.08))}
.dsg-page .dcn-chip{fill:var(--dcn-chipfill);stroke:var(--dcn-line);stroke-width:1.25;filter:drop-shadow(0 1px 2px rgba(15,23,42,.08))}
@media (prefers-color-scheme: dark){.dsg-page .dcn-winbox{filter:drop-shadow(0 3px 8px rgba(0,0,0,.40))}
.dsg-page .dcn-modalbox{filter:drop-shadow(0 6px 16px rgba(0,0,0,.50))}
.dsg-page .dcn-rowbox{filter:none}
.dsg-page .dcn-chip{filter:none}}
.dsg-page .dcn-brand{font-size:15px;font-weight:800;letter-spacing:-0.02em}
.dsg-page .dcn-name{font-size:13px;font-weight:700;letter-spacing:-0.01em;fill:var(--dcn-ink)}
.dsg-page .dcn-label{font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;fill:var(--dcn-muted)}
.dsg-page .dcn-wintitle{font-size:11.5px;font-weight:500;fill:var(--dcn-muted)}
.dsg-page .dcn-url{font-family:var(--dcn-mono);font-size:11px;font-weight:500;fill:var(--dcn-ink)}
.dsg-page .dcn-chipt{font-family:var(--dcn-mono);font-size:11px;font-weight:500;fill:var(--dcn-muted)}
.dsg-page .dcn-btnt{font-size:12.5px;font-weight:600;fill:#ffffff}
.dsg-page .dcn-signin{font-size:12.5px;font-weight:600;fill:var(--dcn-ink)}
.dsg-page .dcn-connt{font-size:10.5px;font-weight:600;fill:var(--dcn-ai)}
.dsg-page .dcn-num{font-size:10px;font-weight:700;fill:var(--dcn-hub)}
.dsg-page .dcn-emptyt{font-size:11.5px;font-weight:400;font-style:italic;fill:var(--dcn-muted)}
.dsg-page .dcn-inputbox{fill:var(--dcn-field);stroke:var(--dcn-line);stroke-width:1.25}
.dsg-page .dcn-leader{fill:none;stroke:var(--dcn-line);stroke-width:1.25;stroke-dasharray:4 6;stroke-linecap:round}
.dsg-page .dcn-numring{fill:var(--dcn-hub-tint);stroke:var(--dcn-hub);stroke-width:1.25}
.dsg-page .dcn-sep{stroke:var(--dcn-line);stroke-width:1}
.dsg-page .dcn-dot{fill:var(--dcn-line)}
.dsg-page .dcn-skel{fill:var(--dcn-line);opacity:.5}
.dsg-page /* static defaults = STATE C (connected row + tool chips visible; modal, caret and pops hidden) */
  .dcn-cover, .dsg-page .dcn-caret, .dsg-page .dcn-scrim, .dsg-page .dcn-modal, .dsg-page .dcn-pop, .dsg-page .dcn-empty{opacity:0}
.dsg-page .dcn-press{transform-box:fill-box;transform-origin:center}
.dsg-page .dcn-pop{fill:none;stroke-width:1.5;transform-box:fill-box;transform-origin:center}
.dsg-page .dcn-cover{transform-box:fill-box;transform-origin:100% 50%}
@media (prefers-reduced-motion: no-preference){.dsg-page /* STATE A · 0–30% : URL types in, .dsg-page caret blinks, .dsg-page Add press-pops */
    @keyframes dcnType{0%{opacity:1;transform:scaleX(1)}
      6%{opacity:1;transform:scaleX(1)}
      20%{opacity:1;transform:scaleX(0)}
      22%,100%{opacity:0;transform:scaleX(0)}}
@keyframes dcnCaret{
      0%,19%{opacity:0}
      21%{opacity:1}
      23%{opacity:.1}
      25%{opacity:1}
      27%,100%{opacity:0}
    }
@keyframes dcnFocus{
      0%,5%{stroke:var(--dcn-line)}
      9%{stroke:#8B5CF6}
      24%{stroke:#8B5CF6}
      30%,100%{stroke:var(--dcn-line)}
    }
@keyframes dcnAddPress{
      0%,24%{transform:scale(1)}
      26%{transform:scale(.955)}
      28%,100%{transform:scale(1)}
    }
@keyframes dcnAddPop{
      0%,25%{opacity:0;transform:scale(.92)}
      28.5%{opacity:.45;transform:scale(1.04)}
      34%,100%{opacity:0;transform:scale(1.22)}
    }
.dsg-page /* STATE B · 30–60% : OAuth modal slides in, .dsg-page Approve press-pops */
    @keyframes dcnScrim{0%,30%{opacity:0}
      34%{opacity:1}
      55%{opacity:1}
      59%,100%{opacity:0}}
@keyframes dcnModal{
      0%,31%{opacity:0;transform:translateY(10px)}
      35%{opacity:1;transform:translateY(0)}
      55%{opacity:1;transform:translateY(0)}
      59%,100%{opacity:0;transform:translateY(4px)}
    }
@keyframes dcnOkPress{
      0%,47%{transform:scale(1)}
      49%{transform:scale(.955)}
      51%,100%{transform:scale(1)}
    }
@keyframes dcnOkPop{
      0%,48%{opacity:0;transform:scale(.92)}
      51.5%{opacity:.45;transform:scale(1.04)}
      57%,100%{opacity:0;transform:scale(1.22)}
    }
.dsg-page /* STATE C · 60–95% : connected row arrives, .dsg-page tool chips fade in one by one; 95–100% graceful reset */
    @keyframes dcnEmpty{0%,57%{opacity:.75}
      62%,100%{opacity:0}}
@keyframes dcnRow{
      0%,61%{opacity:0;transform:translateY(6px)}
      65%{opacity:1;transform:translateY(0)}
      94%{opacity:1;transform:translateY(0)}
      99%,100%{opacity:0;transform:translateY(0)}
    }
@keyframes dcnRowPop{
      0%,63%{opacity:0;transform:scale(.985)}
      66.5%{opacity:.5;transform:scale(1.015)}
      73%,100%{opacity:0;transform:scale(1.03)}
    }
@keyframes dcnChipA{
      0%,67%{opacity:0;transform:translateY(5px)}
      71%{opacity:1;transform:translateY(0)}
      94%{opacity:1}
      99%,100%{opacity:0}
    }
@keyframes dcnChipB{
      0%,73%{opacity:0;transform:translateY(5px)}
      77%{opacity:1;transform:translateY(0)}
      94%{opacity:1}
      99%,100%{opacity:0}
    }
@keyframes dcnChipC{
      0%,79%{opacity:0;transform:translateY(5px)}
      83%{opacity:1;transform:translateY(0)}
      94%{opacity:1}
      99%,100%{opacity:0}
    }
.dsg-page .dcn-cover{animation:dcnType 6.8s ease-in-out infinite}
.dsg-page .dcn-caret{animation:dcnCaret 6.8s ease-in-out infinite}
.dsg-page .dcn-inputbox{animation:dcnFocus 6.8s ease-in-out infinite}
.dsg-page .dcn-press.add{animation:dcnAddPress 6.8s ease-in-out infinite}
.dsg-page .dcn-pop.add{animation:dcnAddPop 6.8s ease-in-out infinite}
.dsg-page .dcn-scrim{animation:dcnScrim 6.8s ease-in-out infinite}
.dsg-page .dcn-modal{animation:dcnModal 6.8s ease-in-out infinite}
.dsg-page .dcn-press.ok{animation:dcnOkPress 6.8s ease-in-out infinite}
.dsg-page .dcn-pop.ok{animation:dcnOkPop 6.8s ease-in-out infinite}
.dsg-page .dcn-empty{animation:dcnEmpty 6.8s ease-in-out infinite}
.dsg-page .dcn-row{animation:dcnRow 6.8s ease-in-out infinite}
.dsg-page .dcn-pop.row{animation:dcnRowPop 6.8s ease-in-out infinite}
.dsg-page .dcn-chipa{animation:dcnChipA 6.8s ease-in-out infinite}
.dsg-page .dcn-chipb{animation:dcnChipB 6.8s ease-in-out infinite}
.dsg-page .dcn-chipc{animation:dcnChipC 6.8s ease-in-out infinite}}
.dsg-page .dcn-cap{margin:2px auto 0;max-width:560px;text-align:center;font-size:13.5px;line-height:1.5;color:var(--dcn-muted)}
.dsg-page .dcn-cap b{color:var(--dcn-ink);font-weight:500}
.dsg-page /* ===== embedded visual: ask-answer-chat ===== */

  :root{--dch-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --dch-ink:#1c1b22;
    --dch-muted:#6b6a76;
    --dch-line:#c4c3d0;
    --dch-panel:#f8f9fc;
    --dch-win:#ffffff;
    --dch-chipfill:#ffffff;
    --dch-bub:#f3f4f9;
    --dch-data:#2f6fd0;  --dch-data-tint:#eaf1fb;
    --dch-hub:#5b53c9;   --dch-hub-tint:#f4f3fe;
    --dch-ai:#0f9e75;    --dch-ai-tint:#e2f5ee;}
@media (prefers-color-scheme: dark){.dsg-page{--dch-ink:#ecebf3; --dch-muted:#a6a4b2; --dch-line:#3c3b49;
      --dch-panel:#17161f; --dch-win:#1e1d29; --dch-chipfill:#2b2938; --dch-bub:#262433;
      --dch-data:#7aadf2; --dch-data-tint:#172234;
      --dch-hub:#a9a1f2;  --dch-hub-tint:#1f1d31;
      --dch-ai:#5cd0a4;   --dch-ai-tint:#0e3128;}}
.dsg-page .dch-chat{max-width:780px;margin:0 auto;padding:8px 16px 4px;font-family:var(--dch-font)}
.dsg-page .dch-chat svg{display:block;width:100%;height:auto}
.dsg-page .dch-panelbg{fill:var(--dch-panel);stroke:var(--dch-line);stroke-width:1}
.dsg-page .dch-window{fill:var(--dch-win);stroke:var(--dch-line);stroke-width:1.25;filter:drop-shadow(0 2px 4px rgba(15,23,42,.10))}
.dsg-page .dch-bubble{filter:drop-shadow(0 1px 2px rgba(15,23,42,.08))}
.dsg-page .dch-chip{fill:var(--dch-chipfill);stroke:var(--dch-line);stroke-width:1.25;filter:drop-shadow(0 1px 2px rgba(15,23,42,.08))}
.dsg-page .dch-brand{font-size:12px;font-weight:800;letter-spacing:-0.02em}
.dsg-page .dch-label{font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;fill:var(--dch-muted)}
.dsg-page .dch-chrometext{font-size:11px;font-weight:600;fill:var(--dch-muted)}
.dsg-page .dch-chiptext{font-size:11px;font-weight:500;fill:var(--dch-muted)}
.dsg-page .dch-msg{font-size:12.5px;font-weight:500;fill:var(--dch-ink)}
.dsg-page .dch-cust{font-size:12px;font-weight:600;fill:var(--dch-ink)}
.dsg-page .dch-city{font-size:12px;font-weight:400;fill:var(--dch-muted)}
.dsg-page .dch-rev{font-size:12px;font-weight:700;fill:var(--dch-ai)}
.dsg-page .dch-foottext{font-size:11px;font-weight:400;fill:var(--dch-muted)}
.dsg-page .dch-divider{stroke:var(--dch-line);stroke-width:1}
.dsg-page .dch-cover{opacity:0}
.dsg-page .dch-caret{opacity:0}
.dsg-page .dch-shim{opacity:0}
.dsg-page .dch-pop{opacity:0;fill:none;stroke-width:1.5;transform-box:fill-box;transform-origin:center}
@media (prefers-color-scheme: dark){.dsg-page .dch-window{filter:drop-shadow(0 2px 4px rgba(0,0,0,.35))}
.dsg-page .dch-bubble{filter:none}
.dsg-page .dch-chip{filter:none}}
@media (prefers-reduced-motion: no-preference){@keyframes dchSceneFade{0%,93%{opacity:1}100%{opacity:0}}
@keyframes dchUserIn{0%{opacity:0;transform:translateY(6px)}4%,100%{opacity:1;transform:translateY(0)}}
@keyframes dchType{0%,5%{transform:translateX(0)}20%,100%{transform:translateX(332px)}}
@keyframes dchCaret{0%,4%{opacity:0}6%,19%{opacity:1}23%,100%{opacity:0}}
@keyframes dchChipIn{0%,20%{opacity:0;transform:translateY(5px)}25%,100%{opacity:1;transform:translateY(0)}}
@keyframes dchShim{0%,24%{transform:translateX(0);opacity:0}26%{opacity:.9}35%{transform:translateX(392px);opacity:.9}37%,100%{transform:translateX(392px);opacity:0}}
@keyframes dchPop{0%,35%{opacity:0;transform:scale(.9)}39%{opacity:.55;transform:scale(1.05)}47%,100%{opacity:0;transform:scale(1.6)}}
@keyframes dchAsstIn{0%,34%{opacity:0;transform:translateX(-12px)}40%,100%{opacity:1;transform:translateX(0)}}
@keyframes dchHead{0%,40%{opacity:0}44%,100%{opacity:1}}
@keyframes dchRow1{0%,45%{opacity:0;transform:translateY(4px)}49%,100%{opacity:1;transform:translateY(0)}}
@keyframes dchRow2{0%,50%{opacity:0;transform:translateY(4px)}54%,100%{opacity:1;transform:translateY(0)}}
@keyframes dchRow3{0%,55%{opacity:0;transform:translateY(4px)}59%,100%{opacity:1;transform:translateY(0)}}
@keyframes dchRow4{0%,60%{opacity:0;transform:translateY(4px)}64%,100%{opacity:1;transform:translateY(0)}}
@keyframes dchRow5{0%,65%{opacity:0;transform:translateY(4px)}69%,100%{opacity:1;transform:translateY(0)}}
@keyframes dchFoot{0%,76%{opacity:0}84%,100%{opacity:1}}
.dsg-page .dch-scene{animation:dchSceneFade 6s ease-in-out infinite}
.dsg-page .dch-user{animation:dchUserIn 6s ease-in-out infinite;transform-box:fill-box}
.dsg-page .dch-cover{opacity:1;animation:dchType 6s ease-in-out infinite}
.dsg-page .dch-caret{animation:dchCaret 6s ease-in-out infinite}
.dsg-page .dch-chipg{animation:dchChipIn 6s ease-in-out infinite;transform-box:fill-box}
.dsg-page .dch-shim{animation:dchShim 6s ease-in-out infinite}
.dsg-page .dch-pop{animation:dchPop 6s ease-in-out infinite}
.dsg-page .dch-asst{animation:dchAsstIn 6s ease-in-out infinite;transform-box:fill-box}
.dsg-page .dch-head{animation:dchHead 6s ease-in-out infinite}
.dsg-page .dch-row1{animation:dchRow1 6s ease-in-out infinite;transform-box:fill-box}
.dsg-page .dch-row2{animation:dchRow2 6s ease-in-out infinite;transform-box:fill-box}
.dsg-page .dch-row3{animation:dchRow3 6s ease-in-out infinite;transform-box:fill-box}
.dsg-page .dch-row4{animation:dchRow4 6s ease-in-out infinite;transform-box:fill-box}
.dsg-page .dch-row5{animation:dchRow5 6s ease-in-out infinite;transform-box:fill-box}
.dsg-page .dch-foot{animation:dchFoot 6s ease-in-out infinite}}
.dsg-page .dch-cap{margin:2px auto 0;max-width:560px;text-align:center;font-size:13.5px;line-height:1.5;color:var(--dch-muted)}
.dsg-page .dch-cap b{color:var(--dch-ink);font-weight:500}

/* ============================================================
 * DataAssist-IO — setup guide black theme + build tweaks.
 * The source dark palette, with the page background forced black
 * and card surfaces to "light black". Everything else unchanged.
 * ========================================================== */
.dsg-page{
  --dsg-ink:#ecebf3; --dsg-muted:#a6a4b2; --dsg-line:#26262f;
  --dsg-bg:#000; --dsg-card:#0d0d13; --dsg-tint:#131320;
  --dsg-blue:#7aadf2; --dsg-violet:#a9a1f2; --dsg-cyan:#5ad4e6; --dsg-green:#5cd0a4;
  --dsg-shadow:0 1px 2px rgba(0,0,0,.5);
  background:#000; color:var(--dsg-ink);
}
/* headings in the HTML-widget sections inherit the theme's dark heading colour;
   force them back to the page ink so they read on black. */
.dsg-page h1, .dsg-page h2, .dsg-page h3, .dsg-page h4, .dsg-page h5, .dsg-page h6{ color:var(--dsg-ink) !important; }
/* boxed reading column (replaces the source .dsg-wrap) + kill Elementor gaps/padding */
.dsg-page > .e-con-inner, .dsg-page{ padding-left:0; padding-right:0; }
.dsg-page .dsg-wrap{ max-width:860px; margin:0 auto; padding:40px 20px 72px; line-height:1.65; gap:0; }
.dsg-page .dsg-wrap > .e-con-inner{ gap:0; }
.dsg-page .elementor-widget:not(:last-child){ margin-bottom:0; }
/* native hero (centered) */
.dsg-page .dsg-kicker .elementor-heading-title{ font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dsg-muted); }
.dsg-page .dsg-kicker{ text-align:center;margin:0 0 6px; }
.dsg-page .dsg-h1 .elementor-heading-title{ font-size:30px;font-weight:800;letter-spacing:-.02em;color:var(--dsg-ink); }
.dsg-page .dsg-h1{ text-align:center;margin:0 0 8px; }
.dsg-page .dsg-hero-sub{ text-align:center;color:var(--dsg-muted);font-size:15.5px;max-width:560px;margin:0 auto 6px; }
.dsg-page .dsg-hero-sub p{ margin:0; }
/* improved CTA block */
.dsg-page .dsg-cta2{ text-align:center;margin:38px 0 4px;display:flex;flex-direction:column;align-items:center;gap:16px; }
.dsg-page .dsg-cta2-btn{ display:inline-block;background:linear-gradient(135deg,#3B82F6,#2563EB);color:#fff;font-weight:700;
  font-size:15px;padding:15px 32px;border-radius:12px;text-decoration:none;box-shadow:0 8px 24px rgba(59,130,246,.35);transition:filter .15s; }
.dsg-page .dsg-cta2-btn:hover{ filter:brightness(1.07); }
.dsg-page .dsg-cta2-meta{ display:flex;flex-wrap:wrap;justify-content:center;gap:10px; }
.dsg-page .dsg-cta2-chip{ display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:var(--dsg-ink);
  text-decoration:none;background:var(--dsg-card);border:1px solid var(--dsg-line);border-radius:999px;padding:8px 16px;transition:border-color .15s; }
.dsg-page .dsg-cta2-chip:hover{ border-color:rgba(122,173,242,.55); }
.dsg-page .dsg-cta2-chip .i{ font-size:14px;line-height:1; }
.dsg-page .dsg-cta2-more{ display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 12px;font-size:13px; }
.dsg-page .dsg-cta2-more .lbl{ color:var(--dsg-muted); }
.dsg-page .dsg-cta2-links{ display:inline-flex;flex-wrap:wrap;gap:6px 8px; }
.dsg-page .dsg-cta2-links a{ color:var(--dsg-blue);font-weight:650;text-decoration:none;padding:4px 10px;border-radius:8px;
  border:1px solid transparent;transition:border-color .15s,background .15s; }
.dsg-page .dsg-cta2-links a:hover{ background:rgba(122,173,242,.10);border-color:rgba(122,173,242,.35); }

/* ============================================================
 * WHITE / LIGHT parts — the five .dsg-part cards (steps 1-4 +
 * Troubleshooting) render as near-white cards on the black page.
 * Re-scope the source LIGHT palette: the main --dsg-* vars plus
 * the two embedded-SVG sub-palettes --dcn-* / --dch-* used by the
 * connect-flow (step 3) and chat (step 4) animations. Every text
 * node, box, tab, mono code and figure reads these vars, so the
 * whole card + its animation adapt to the light surface. Heading
 * flips dark via the var(--dsg-ink) force rule; the numbered
 * badges keep their coloured gradients (they use --nc1/--nc2).
 * ========================================================== */
.dsg-page .dsg-part{
  --dsg-ink:#1c1b22; --dsg-muted:#6b6a76; --dsg-line:#e2e1ea;
  --dsg-bg:#fafafa; --dsg-card:#ffffff; --dsg-tint:#f6f6fb;
  --dsg-blue:#3B82F6; --dsg-violet:#8B5CF6; --dsg-cyan:#06B6D4; --dsg-green:#0f9e75;
  --dsg-shadow:0 1px 2px rgba(15,23,42,.10);
  /* connect-flow diagram (step 3) */
  --dcn-ink:#1c1b22; --dcn-muted:#6b6a76; --dcn-line:#c4c3d0;
  --dcn-panel:#f8f9fc; --dcn-win:#ffffff; --dcn-field:#f4f5f9;
  --dcn-chipfill:#ffffff; --dcn-scrim:#0f172a;
  --dcn-hub:#5b53c9; --dcn-hub-tint:#f4f3fe; --dcn-ai:#0f9e75; --dcn-ai-tint:#e2f5ee;
  /* chat animation (step 4) */
  --dch-ink:#1c1b22; --dch-muted:#6b6a76; --dch-line:#c4c3d0;
  --dch-panel:#f8f9fc; --dch-win:#ffffff; --dch-chipfill:#ffffff; --dch-bub:#f3f4f9;
  --dch-data:#2f6fd0; --dch-data-tint:#eaf1fb; --dch-hub:#5b53c9; --dch-hub-tint:#f4f3fe;
  --dch-ai:#0f9e75; --dch-ai-tint:#e2f5ee;
  color:var(--dsg-ink);
}