:root{
    /* ── accent ── */
    --accent:#BC13FE; --accent-rgb:188,19,254; --accent-hover:#A810E0; --accent-bright:#CF00FF;
    --accent-05:rgba(188,19,254,.05); --accent-06:rgba(188,19,254,.06); --accent-10:rgba(188,19,254,.10);
    --accent-12:rgba(188,19,254,.12); --accent-20:rgba(188,19,254,.20); --accent-30:rgba(188,19,254,.30);
    --accent-wash:#FAF7FD;
    /* ── ink ── */
    --ink:#1A1A1A; --ink-strong:#000; --ink-900:#111; --ink-700:#374151; --ink-muted:#6B7280;
    --ink-soft:#888; --ink-faint:#9CA3AF;
    /* ── surfaces ── */
    --surface:#fff; --surface-canvas:#FAFAFA; --surface-subtle:#F9FAFB; --surface-ios:#F2F2F7; --surface-key:#F4F4F5;
    /* ── borders ── */
    --border:#E5E7EB; --border-strong:#D9D9D9; --border-soft:#E5E5E5;
    /* ── type ── */
    --font-sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
    --font-display:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    --font-ui:'Roboto',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    --font-mono:'SF Mono','SFMono-Regular',Menlo,Monaco,Consolas,monospace;
    --font-display-weight-hero:800; --font-display-weight-feature:700; --font-display-weight-cta:700;
    --display-sm:28px; --display-md:40px; --display-lg:56px; --display-xl:72px;
    --tracking-tight:-0.03em;
    /* ── radii ── */
    --radius-xs:4px; --radius-sm:6px; --radius-md:8px; --radius-lg:12px; --radius-xl:16px; --radius-2xl:24px; --radius-pill:999px;
    /* ── shadow ── */
    --shadow-xs:0 1px 3px rgba(0,0,0,.08); --shadow-md:0 2px 8px rgba(0,0,0,.14);
    --shadow-xl:0 12px 32px rgba(0,0,0,.10); --shadow-2xl:0 24px 64px rgba(0,0,0,.14);
    /* ── layout ── */
    --container-max:1200px;
    color-scheme:light;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{margin:0;font-family:var(--font-sans);color:var(--ink);background:var(--surface);-webkit-font-smoothing:antialiased;}
  a{color:var(--accent);text-decoration:none;transition:color .15s ease;}
  a:hover{color:var(--accent-hover);}
  ::selection{background:var(--accent-20);color:var(--ink-strong);}

  .docs-kbd{font-family:inherit;font-size:inherit;font-weight:700;
    letter-spacing:.01em;color:inherit;}

  /* buttons (flattened from the design-system Button component) */
  .btn{display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;
    letter-spacing:-0.01em;border-radius:var(--radius-md);cursor:pointer;border:1px solid transparent;
    transition:background .15s ease,color .15s ease,border-color .15s ease,box-shadow .15s ease;white-space:nowrap;text-decoration:none;gap:8px;}
  .btn-md{height:40px;padding:0 18px;font-size:15px;}
  .btn-lg{height:52px;padding:0 26px;font-size:17px;}
  .btn-accent{background:var(--accent);color:#fff;box-shadow:0 4px 16px rgba(188,19,254,.20);}
  .btn-accent:hover{background:var(--accent-hover);color:#fff;}
  .btn-ghost{background:transparent;color:var(--ink-700);border-color:var(--border);}
  .btn-ghost:hover{background:var(--surface-subtle);color:var(--ink-strong);}
  .btn-md img{width:18px;height:18px;display:block;flex:0 0 auto;}
  .btn-lg img{width:20px;height:20px;display:block;flex:0 0 auto;}

  /* documentation page */
  .docs-main{max-width:760px;margin:0 auto;padding:64px 32px 112px;}

  .docs-title{font-family:var(--font-display);font-weight:800;font-size:48px;
    letter-spacing:-0.03em;line-height:1.08;color:var(--ink-strong);margin:0 0 16px;}
  .docs-subtitle{font-size:19px;line-height:1.6;color:var(--ink-muted);margin:0 0 48px;}

  .docs-card{border:1px solid var(--border);border-radius:var(--radius-xl);
    background:var(--surface-subtle);padding:24px 28px;margin:0 0 88px;}
  .docs-card-title{font-family:var(--font-display);font-weight:700;font-size:16px;
    letter-spacing:-0.01em;color:var(--ink-strong);margin:0 0 18px;}
  .docs-toc-group{margin:0 0 22px;}
  .docs-toc-group:last-child{margin-bottom:0;}
  .docs-toc-group-label{font-family:var(--font-ui);font-size:11px;font-weight:600;
    letter-spacing:0.1em;text-transform:uppercase;color:var(--ink-faint);margin:0 0 8px;}
  .docs-toc{margin:0;padding-left:22px;font-size:16px;line-height:1.9;color:var(--ink-700);}
  .docs-toc li{margin-bottom:2px;}
  .docs-toc li::marker{color:var(--ink-faint);}
  .docs-toc a{color:var(--ink-700);font-weight:500;}
  .docs-toc a:hover{color:var(--accent);}

  .docs-group{margin-bottom:96px;}
  .docs-group:last-child{margin-bottom:0;}
  .docs-group-label{font-family:var(--font-ui);font-size:11px;font-weight:600;
    letter-spacing:0.1em;text-transform:uppercase;color:var(--ink-muted);margin:0 0 10px;}
  .docs-group-rule{border:none;border-top:1px solid var(--border);margin:0 0 44px;}

  .docs-section{margin-bottom:72px;scroll-margin-top:96px;}
  .docs-section:last-child{margin-bottom:0;}
  .docs-section h2{font-family:var(--font-display);font-weight:800;font-size:32px;
    letter-spacing:-0.03em;line-height:1.2;color:var(--ink-strong);
    margin:0 0 20px;}
  .docs-section p{font-size:17px;line-height:1.75;color:var(--ink-700);margin:0 0 18px;}
  .docs-section p:last-child{margin-bottom:0;}
  .docs-section ul,
  .docs-section ol{margin:0 0 18px;padding-left:22px;font-size:17px;line-height:1.75;
    color:var(--ink-700);}
  .docs-section ul{list-style:disc;}
  .docs-section li{margin-bottom:10px;}
  .docs-section li:last-child{margin-bottom:0;}
  .docs-section li::marker{color:var(--ink-faint);}
  .docs-section strong{font-weight:600;color:var(--ink-strong);}
  .docs-section a,
  .docs-section .docs-mode-inline{color:var(--accent);font-weight:500;transition:color .15s ease;}
  .docs-section a:hover,
  .docs-section .docs-mode-inline:hover{color:var(--accent-hover);}
  .docs-figure-pair{position:relative;display:flex;flex-wrap:wrap;gap:16px;margin:0 0 24px;
    width:min(1136px,100vw);margin-left:calc(50% - min(1136px,100vw)/2);margin-right:calc(50% - min(1136px,100vw)/2);}
  .docs-figure-pair > img{flex:1 1 280px;min-width:0;width:100%;height:auto;display:block;border:1px solid var(--border);border-radius:var(--radius-lg);}
  .docs-install-card{flex:1 1 280px;min-width:0;margin:0;}
  .docs-install-shot{position:relative;aspect-ratio:1;background-size:cover;background-position:center top;background-repeat:no-repeat;
    border:1px solid var(--border);border-radius:var(--radius-lg);
    --bubble-right:6%;
    /* --bubble-top: found on screen, not derived from the screenshot. */
    --bubble-top:18%;}
  .docs-install-bubble{position:absolute;top:var(--bubble-top);right:var(--bubble-right);z-index:1;
    max-width:58%;padding:8px 12px;background:#fff;border-radius:var(--radius-md);
    box-shadow:var(--shadow-md);font-size:13px;line-height:1.35;font-weight:500;color:var(--ink-strong);white-space:nowrap;}
  .docs-install-card figcaption{font-size:15px;line-height:1.5;color:var(--ink-700);margin:10px 0 0;}
  .docs-install-card figcaption strong{display:block;font-weight:600;color:var(--ink-strong);margin:0 0 2px;}
  #first-copy .docs-mode-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 20px;flex-wrap:wrap;}
  #first-copy .docs-mode-heading h2{margin:0;}
  .docs-mode-switch{position:relative;display:flex;flex-shrink:0;padding:4px;background:var(--accent);
    border:1px solid var(--border);border-radius:var(--radius-pill);
    box-shadow:inset 0 1px 3px rgba(0,0,0,.35);}
  .docs-mode-pill{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);
    background:var(--surface);border-radius:var(--radius-pill);box-shadow:var(--shadow-md);
    transition:transform .25s ease;pointer-events:none;}
  .docs-mode-switch[data-mode="editor"] .docs-mode-pill{transform:translateX(100%);}
  .docs-mode-switch [role="tab"]{position:relative;z-index:1;flex:1 1 0;min-width:0;border:none;background:transparent;
    font-family:var(--font-sans);font-size:14px;font-weight:600;line-height:1;padding:8px 20px;cursor:pointer;
    color:rgba(255,255,255,.7);border-radius:var(--radius-pill);}
  .docs-mode-switch [role="tab"][aria-selected="true"]{color:var(--ink-strong);}
  #first-copy .docs-mode-detail{display:none;}
  #first-copy[data-mode="instant"] .docs-mode-detail[data-mode-panel="instant"]{display:block;}
  #first-copy[data-mode="editor"] .docs-mode-detail[data-mode-panel="editor"]{display:block;}
  #first-copy .docs-mode-shared{margin-top:36px;}
  .docs-mode-inline{display:inline;padding:0;margin:0;border:none;background:none;
    font-family:inherit;font-size:inherit;line-height:inherit;letter-spacing:inherit;cursor:pointer;
    text-decoration:none;vertical-align:baseline;}
  .docs-figure-placeholder{flex:1 1 280px;min-width:0;width:100%;aspect-ratio:797/580;display:block;border:1px solid var(--border);border-radius:var(--radius-lg);
    background-color:var(--surface-subtle);background-size:cover;background-position:center top;background-repeat:no-repeat;}
  .docs-figure-copy{flex:1 1 280px;min-width:0;}
  .docs-figure-copy > p:first-child{margin-top:0;}
  .docs-figure-copy .docs-library-actions{list-style:none;padding-left:0;}
  .docs-figure-copy .docs-library-actions li{display:flex;align-items:flex-start;gap:10px;}
  .docs-library-action-copy{flex:1 1 auto;min-width:0;}
  .docs-figure-copy .docs-library-actions .docs-action-icon{flex-shrink:0;width:18px;height:1.75em;
    color:var(--ink-strong);}
  .docs-action-icon--stroke{fill:none;stroke:currentColor;stroke-width:2;
    stroke-linecap:round;stroke-linejoin:round;}
  .docs-action-icon--fill path{fill:currentColor;}
  .docs-figure-pair--library .docs-figure-placeholder{
    border-left:none;border-bottom:none;
    border-radius:0 var(--radius-lg) 0 0;}
  .docs-demo-browser,
  .docs-demo-canvas{flex:1 1 280px;min-width:0;width:100%;aspect-ratio:593/434;position:relative;overflow:hidden;
    border:1px solid var(--border);border-radius:var(--radius-lg);}
  .docs-demo-chrome{position:absolute;inset:0;display:flex;flex-direction:column;overflow:hidden;
    container-type:inline-size;--docs-u:calc(100cqw / 593);
    --docs-btn-u:calc(var(--docs-u) / 1.7);
    background:#DFDFDF;border-top:1px solid #E6E7EB;
    border-radius:calc(3 * var(--docs-u));box-shadow:0 0 calc(4 * var(--docs-u)) 0 rgba(0,0,0,.25);}
  .docs-demo-header{display:flex;align-items:center;gap:calc(6 * var(--docs-u));width:100%;
    height:calc(30 * var(--docs-u));flex-shrink:0;
    padding:calc(6 * var(--docs-u)) calc(18 * var(--docs-u)) calc(6 * var(--docs-u)) calc(10 * var(--docs-u));}
  .docs-demo-traffic{display:flex;align-items:center;justify-content:center;flex-shrink:0;
    height:calc(18 * var(--docs-u));gap:calc(5 * var(--docs-u));
    padding:0 calc(6 * var(--docs-u)) 0 0;background:#DEE1E6;border-radius:0 0 calc(4 * var(--docs-u)) 0;}
  .docs-demo-dot{width:calc(8 * var(--docs-u));height:calc(8 * var(--docs-u));border-radius:50%;flex-shrink:0;}
  .docs-demo-dot--red{background:#FF5F57;}
  .docs-demo-dot--yellow{background:#FEBC2E;}
  .docs-demo-dot--green{background:#28C840;}
  .docs-demo-urlbar{display:flex;align-items:center;flex:1;min-width:0;height:100%;
    padding:0 calc(23 * var(--docs-u)) 0 calc(10 * var(--docs-u));
    background:#FEFEFE;border:1px solid #E6E7EB;border-radius:calc(70 * var(--docs-u));}
  .docs-demo-urlbar-line{flex:1;min-width:0;height:calc(2.5 * var(--docs-u));
    border-radius:calc(10 * var(--docs-u));background:#DEE1E6;}
  .docs-demo-profile-logo{display:flex;align-items:center;justify-content:center;flex-shrink:0;
    width:calc(18 * var(--docs-u));height:calc(18 * var(--docs-u));
    padding:calc(2 * var(--docs-u)) 0;background:#E1E1E2;border-radius:calc(20 * var(--docs-u));}
  .docs-demo-profile-logo img{width:100%;height:auto;display:block;object-fit:contain;}
  .docs-demo-body{position:relative;display:flex;flex-direction:row;flex:1;min-height:0;width:100%;overflow:hidden;
    background:var(--surface);border-radius:calc(8 * var(--docs-u));}
  .docs-demo-sidebar{display:flex;flex-direction:column;align-items:center;flex-shrink:0;
    width:calc(30 * var(--docs-u));gap:calc(24 * var(--docs-u));
    padding-top:calc(16 * var(--docs-u));border-right:0.5px solid #C8C8C0;}
  .docs-demo-sidebar-item{display:flex;align-items:center;justify-content:center;width:100%;opacity:.5;}
  .docs-demo-sidebar-icon{display:block;object-fit:contain;}
  .docs-demo-sidebar-icon--home{width:calc(10 * var(--docs-u));height:calc(11 * var(--docs-u));}
  .docs-demo-sidebar-icon--category{width:calc(11 * var(--docs-u));height:calc(11 * var(--docs-u));}
  .docs-demo-sidebar-icon--add{width:calc(10 * var(--docs-u));height:calc(10 * var(--docs-u));}
  .docs-demo-sidebar-icon--notification{width:calc(10 * var(--docs-u));height:calc(11 * var(--docs-u));}
  .docs-demo-sidebar-icon--message{width:calc(12 * var(--docs-u));height:calc(12 * var(--docs-u));}
  .docs-demo-gallery{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);
    gap:calc(10 * var(--docs-u));padding:calc(10 * var(--docs-u));flex:1;min-width:0;height:100%;
    background:var(--surface);border-radius:0 calc(14 * var(--docs-u)) 0 0;}
  .docs-demo-tile{position:relative;border-radius:calc(8 * var(--docs-u));overflow:hidden;
    background:var(--surface-key);transition:box-shadow .25s ease;}
  .docs-demo-tile img{width:100%;height:100%;object-fit:cover;display:block;border-radius:inherit;}
  .docs-demo-tile--hot{box-shadow:0 0 calc(13 * var(--docs-u)) 0 var(--accent-bright);}
  .docs-demo-tile--tall{grid-row:span 2;}
  .docs-demo-cursor{position:absolute;left:0;top:0;z-index:5;pointer-events:none;
    --docs-u:calc((min(1136px, 100vw) - 16px) / 2 / 593);
    width:calc(26 * var(--docs-u));height:calc(26 * var(--docs-u));opacity:0;
    transition:transform 1s cubic-bezier(.4,0,.2,1),opacity .25s ease;}
  .docs-demo-cursor--on{opacity:1;}
  .docs-demo-cursor img{width:100%;height:100%;display:block;}
  .docs-demo-tip{position:absolute;left:calc(18 * var(--docs-u));top:calc(-20 * var(--docs-u));
    display:inline-flex;align-items:center;white-space:nowrap;
    padding:calc(4 * var(--docs-u)) calc(8 * var(--docs-u));
    background:var(--accent-bright);border-radius:calc(5 * var(--docs-u));
    font-family:var(--font-sans);font-weight:700;line-height:1;color:#fff;
    font-size:calc(11 * var(--docs-u));
    opacity:0;transition:opacity .3s ease;}
  .docs-demo-tip--in{opacity:1;transition:none;}
  .docs-demo-toast{position:absolute;z-index:4;
    top:calc(10 * var(--docs-u));right:calc(10 * var(--docs-u));
    display:inline-flex;align-items:center;gap:calc(5 * var(--docs-u));
    padding:calc(6 * var(--docs-u)) calc(11 * var(--docs-u));
    background:#BC13FE;border:1px solid #BC13FE;border-radius:999px;
    font-family:var(--font-sans);font-weight:600;line-height:1.4;
    font-size:calc(11 * var(--docs-u));color:#f0f0f0;white-space:nowrap;
    opacity:0;pointer-events:none;transition:opacity .3s ease;}
  .docs-demo-toast img{width:calc(11 * var(--docs-u));height:calc(11 * var(--docs-u));display:block;
    filter:brightness(0) invert(1);}
  .docs-demo-toast--in{opacity:1;}
  .docs-demo-canvas{display:flex;flex-direction:column;overflow:hidden;
    container-type:inline-size;--docs-u:calc(100cqw / 593);
    background:#DFDFDF;}
  .docs-demo-canvas-header{display:flex;align-items:center;gap:calc(6 * var(--docs-u));width:100%;
    height:calc(30 * var(--docs-u));flex-shrink:0;
    padding:calc(6 * var(--docs-u)) calc(18 * var(--docs-u)) calc(6 * var(--docs-u)) calc(10 * var(--docs-u));
    border-bottom:1px solid #E6E7EB;}
  .docs-demo-canvas-body{position:relative;flex:1;min-height:0;width:100%;overflow:hidden;background:#000;}
  .docs-demo-canvas-pan{position:absolute;inset:0;}
  .docs-demo-paste{position:absolute;left:0;top:0;display:none;object-fit:contain;}
  .docs-demo-paste--in{display:block;}
  @keyframes heroSpin{to{transform:rotate(360deg);}}
  .docs-demo-overlay{position:absolute;inset:0;z-index:2;display:flex;align-items:center;
    justify-content:center;background:rgba(0,0,0,0.82);
    opacity:0;pointer-events:none;transition:opacity .3s ease;}
  .docs-demo-overlay--on{opacity:1;}
  .docs-demo-overlay-figure{position:relative;display:flex;align-items:center;justify-content:center;
    margin:0;max-width:62%;max-height:64%;aspect-ratio:2000/1333;background:rgb(51,51,51);
    -webkit-user-select:none;user-select:none;}
  .docs-demo-overlay-picture{position:relative;flex:0 1 auto;width:auto;height:auto;
    max-width:100%;max-height:100%;}
  .docs-demo-overlay-figure img{-webkit-user-drag:none;user-drag:none;pointer-events:none;}
  .docs-demo-overlay-img{display:block;width:100%;height:100%;object-fit:contain;}
  .docs-demo-overlay-after{position:absolute;left:0;top:0;width:100%;height:100%;display:block;
    object-fit:contain;z-index:2;
    clip-path:inset(0 0 0 100%);-webkit-clip-path:inset(0 0 0 100%);
    transition:clip-path 1.4s ease,-webkit-clip-path 1.4s ease;}
  .docs-demo-overlay-after--in{clip-path:inset(0 0 0 0);-webkit-clip-path:inset(0 0 0 0);}
  .docs-demo-overlay-after--alpha{background-color:#ffffff;
    background-image:
      linear-gradient(45deg,#d8d8d8 25%,transparent 25%,transparent 75%,#d8d8d8 75%),
      linear-gradient(45deg,#d8d8d8 25%,transparent 25%,transparent 75%,#d8d8d8 75%);
    background-size:calc(10 * var(--docs-u)) calc(10 * var(--docs-u));
    background-position:0 0,calc(5 * var(--docs-u)) calc(5 * var(--docs-u));}
  .docs-demo-marquee{position:absolute;left:0;top:0;width:0;height:0;display:none;z-index:1;
    border:1px solid #BC13FE;background:rgba(188,19,254,.18);pointer-events:none;}
  .docs-demo-marquee--on{display:block;}
  .docs-demo-overlay-tools{position:absolute;left:0;bottom:calc(100% + 12 * var(--docs-btn-u));
    display:inline-flex;align-items:center;gap:calc(5 * var(--docs-btn-u));}
  .docs-demo-tool{display:inline-flex;align-items:center;justify-content:center;
    width:calc(27 * var(--docs-btn-u));height:calc(27 * var(--docs-btn-u));
    background:#333333;border:1px solid #555555;border-radius:calc(6 * var(--docs-btn-u));
    transition:background .15s ease,border-color .15s ease;}
  .docs-demo-tool img{width:calc(12 * var(--docs-btn-u));height:calc(12 * var(--docs-btn-u));
    display:block;filter:brightness(0) invert(1);}
  .docs-demo-tool--on{background:#BC13FE;border-color:transparent;}
  .docs-demo-hint{margin-left:calc(6 * var(--docs-btn-u));
    font-family:var(--font-sans);font-weight:600;line-height:1.4;
    font-size:calc(11 * var(--docs-btn-u));color:#ffffff;white-space:nowrap;}
  .docs-demo-hint--off{display:none;}
  .docs-demo-overlay-btn-group{position:absolute;right:0;bottom:calc(100% + 12 * var(--docs-btn-u));
    display:inline-flex;align-items:center;gap:calc(8 * var(--docs-btn-u));}
  .docs-demo-overlay-btn{display:inline-flex;align-items:center;gap:calc(5 * var(--docs-btn-u));
    padding:calc(6 * var(--docs-btn-u)) calc(11 * var(--docs-btn-u));
    background:#7C1FA8;border:1px solid #BC13FE;border-radius:calc(6 * var(--docs-btn-u));
    font-family:var(--font-sans);font-weight:600;line-height:1.4;
    font-size:calc(11 * var(--docs-btn-u));color:#f0f0f0;white-space:nowrap;
    transition:background .15s ease,border-color .15s ease;}
  .docs-demo-overlay-btn img{width:calc(11 * var(--docs-btn-u));height:calc(11 * var(--docs-btn-u));display:block;
    filter:brightness(0) invert(1);}
  .docs-demo-overlay-btn--hidden{visibility:hidden;}
  .docs-demo-overlay-btn--hover{background:#BC13FE;border-color:transparent;}
  .docs-demo-overlay-btn--press{background:#8A8A8E;border-color:transparent;}
  .docs-demo-busy{position:absolute;inset:0;z-index:3;display:none;
    flex-direction:column;align-items:center;justify-content:center;
    gap:calc(14 * var(--docs-u));
    background:rgba(0,0,0,0.45);pointer-events:none;}
  .docs-demo-busy--on{display:flex;}
  .docs-demo-busy-ring{width:calc(28 * var(--docs-btn-u));height:calc(28 * var(--docs-btn-u));
    border:calc(3 * var(--docs-btn-u)) solid rgba(255,255,255,0.2);
    border-top-color:#BC13FE;border-radius:50%;flex:0 0 auto;
    animation:heroSpin .8s linear infinite;}
  .docs-demo-busy-text{font-family:var(--font-sans);font-weight:600;line-height:1.4;
    font-size:calc(14 * var(--docs-btn-u));color:#ffffff;white-space:nowrap;}
  .docs-demo-overlay-bar{position:absolute;top:calc(100% + 12 * var(--docs-btn-u));
    left:0;right:0;display:flex;align-items:center;justify-content:space-between;}
  .docs-demo-overlay-bar-left,
  .docs-demo-overlay-bar-right{display:inline-flex;align-items:center;
    gap:calc(8 * var(--docs-btn-u));}
  .docs-demo-overlay-act{position:static;
    display:inline-flex;align-items:center;gap:calc(5 * var(--docs-btn-u));
    padding:calc(6 * var(--docs-btn-u)) calc(11 * var(--docs-btn-u));
    background:#7C1FA8;border:1px solid #BC13FE;border-radius:calc(6 * var(--docs-btn-u));
    font-family:var(--font-sans);font-weight:600;line-height:1.4;
    font-size:calc(11 * var(--docs-btn-u));color:#f0f0f0;white-space:nowrap;
    opacity:1;transition:opacity .35s ease;}
  .docs-demo-overlay-act--ghost{background:#333333;border-color:#555555;opacity:.55;}
  .docs-demo-overlay-act--hover{background:#BC13FE;border-color:transparent;}
  .docs-demo-overlay-act--press{background:#8A8A8E;border-color:transparent;}
  .docs-demo-overlay-act img{width:calc(11 * var(--docs-btn-u));
    height:calc(11 * var(--docs-btn-u));display:block;filter:brightness(0) invert(1);}
  .docs-demo-overlay-act--late{opacity:0;visibility:hidden;
    transition:opacity .35s ease,visibility 0s linear .35s;}
  .docs-demo-overlay-act--late.docs-demo-overlay-act--in{opacity:.55;visibility:visible;
    transition:opacity .35s ease,visibility 0s;}
  .docs-demo-slider{position:absolute;inset:0;z-index:3;display:none;
    overflow:hidden;pointer-events:none;}
  .docs-demo-slider-handle{position:absolute;top:0;bottom:0;left:0;
    width:calc(2 * var(--docs-u));background:var(--accent-bright);
    transform:translateX(-50%);display:flex;pointer-events:none;
    align-items:center;justify-content:center;
    box-shadow:0 0 0 1px rgba(255,255,255,.5);}
  .docs-demo-slider--wipe{display:block;}
  .docs-demo-slider--wipe .docs-demo-slider-handle{transition:left 1.4s ease;
    width:calc(3 * var(--docs-u));background:#BC13FE;
    box-shadow:0 0 calc(12 * var(--docs-u)) rgba(188,19,254,0.9);
    will-change:left;}

  @media (max-width:820px){
    .nav-links{display:none !important;}
    header > div{padding:14px 20px !important;gap:12px !important;}
    header > div > a.btn{display:none !important;}
    footer > div{padding:36px 20px !important;}
    .docs-main{padding:48px 20px 80px;}
    .docs-title{font-size:34px;}
    .docs-subtitle{font-size:17px;margin-bottom:36px;}
    .docs-card{padding:20px 22px;margin-bottom:64px;}
    .docs-group{margin-bottom:72px;}
    .docs-group-rule{margin-bottom:32px;}
    .docs-section{margin-bottom:56px;}
    .docs-section h2{font-size:26px;}
    .docs-section p,
    .docs-section ul,
    .docs-section ol{font-size:16px;}
    .docs-main{overflow-x:hidden;max-width:100%;}
    .docs-figure-pair:not(#firstCopyDemo):not(.docs-figure-pair--library){
      display:flex;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;
      -webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;
      gap:16px;width:100%;max-width:100%;margin-left:0;margin-right:0;margin-bottom:24px;
      padding-bottom:4px;scrollbar-width:none;}
    .docs-figure-pair:not(#firstCopyDemo):not(.docs-figure-pair--library)::-webkit-scrollbar{display:none;}
    .docs-figure-pair:not(#firstCopyDemo):not(.docs-figure-pair--library) > *{
      flex:0 0 calc(100vw - 40px - 32px);min-width:0;width:auto;max-width:none;
      scroll-snap-align:start;}
    #firstCopyDemo.docs-figure-pair{display:flex;flex-direction:column;gap:0;
      width:100%;max-width:100%;margin-left:0;margin-right:0;}
    #firstCopyDemo .docs-demo-browser{flex:0 0 auto;width:100%;}
    #firstCopyDemo .docs-demo-canvas{display:none;}
    #firstCopyDemo .docs-demo-cursor{--docs-u:calc((100vw - 40px) / 593);}
    .docs-figure-pair--library{display:flex;flex-direction:column;gap:18px;
      width:100%;max-width:100%;margin-left:0;margin-right:0;}
    .docs-figure-pair--library .docs-figure-placeholder{
      display:block;flex:0 0 auto;width:100%;aspect-ratio:797/580;
      border:1px solid var(--border);border-radius:var(--radius-lg);}
    .docs-figure-pair--library .docs-figure-copy{flex:0 0 auto;width:100%;}
    .docs-figure-copy .docs-library-actions li{
      display:grid;grid-template-columns:18px 1fr;column-gap:10px;row-gap:2px;align-items:start;}
    .docs-figure-copy .docs-library-actions .docs-action-icon{grid-column:1;grid-row:1;}
    .docs-library-action-copy{display:contents;}
    .docs-library-action-copy strong{grid-column:2;grid-row:1;}
    .docs-library-action-sep{display:none;}
    .docs-library-action-detail{grid-column:2;grid-row:2;display:block;}
    #first-copy .docs-mode-heading{flex-wrap:nowrap;align-items:flex-end;gap:10px;}
    #first-copy .docs-mode-heading h2{flex:1 1 auto;min-width:0;}
    #first-copy .docs-mode-switch{flex-shrink:0;padding:3px;max-width:46%;}
    #first-copy .docs-mode-pill{top:3px;bottom:3px;left:3px;width:calc(50% - 3px);}
    #first-copy .docs-mode-switch [role="tab"]{font-size:11px;padding:5px 8px;}
  }

  @media (max-width:480px){
    header > div{padding:12px 16px !important;}
  }