//    :root{
//      --page-bg:#f7f8fb;
//      --text:#0b1a33;
//      --border:rgba(40,110,230,.25);
//    }
//    *{ box-sizing:border-box; }
//    html,body{ height:100%; }
//    body{
//      margin:0;
//      font: 16px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
//      color:var(--text);
//      background:var(--page-bg);
//      padding:24px;
//    }

    .wrap{
      max-width:960px;
      margin:0 auto;
      background:#fff;
      border-radius:16px;
      box-shadow:0 12px 32px rgba(0,0,0,.06);
      padding:16px 16px 32px;
      border:1px solid #eef1f7;
    }

    .back-button{
      display:flex;
      justify-content:flex-end;
      padding:6px 6px 0;
    }

    .btn-pop{
      --btn-scale: .80;
      --btn-lift: 0px;
      appearance:none;
      border:1px solid var(--border);
      border-radius:999px;
      background:linear-gradient(180deg,#ffffff,#f2f4ff);
      color:var(--text);
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:10px 16px;
      font:600 16px/1.1 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
      cursor:pointer;
      box-shadow:
        0 10px 20px rgba(0,0,0,.12),
        inset 0 1px 0 rgba(255,255,255,.7);
      transform: scale(var(--btn-scale)) translateY(var(--btn-lift));
      transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
      will-change: transform;
    }
    .btn-pop svg{ width:18px; height:18px; fill:currentColor; }

    .btn-pop:hover{
      --btn-lift:-2px;
      box-shadow:
        0 14px 28px rgba(40,110,230,.22),
        inset 0 1px 0 rgba(255,255,255,.8);
      background:linear-gradient(180deg,#ffffff,#eaf1ff);
    }
    .btn-pop:active{ --btn-lift:0px;
      box-shadow:
        0 6px 16px rgba(40,110,230,.18),
        inset 0 2px 6px rgba(0,0,0,.08);
      background:linear-gradient(180deg,#f7f9ff,#e6eeff);
    }
    .btn-pop:focus-visible{
      outline:none;
      box-shadow:
        0 0 0 3px rgba(40,110,230,.25),
        0 8px 22px rgba(40,110,230,.22),
        inset 0 1px 0 rgba(255,255,255,.8);
    }

    @media (max-width: 991px){
      .btn-pop{ --btn-scale: .75; }
    }
    @media (max-width: 575px){
      .btn-pop{ --btn-scale: .70; }
    }

    h1{ margin:16px 16px 0; font-size:26px; }
    p.demo{ margin:10px 16px 0; color:#4b5563; }
    .box{
      margin:20px 16px 0;
      padding:18px;
      border-radius:12px;
      background:#f8fafc;
      border:1px solid #eef2f7;
    }