:root{
      --bg:#111214;          /* page background */
      --panel:#161719;       /* card background */
      --accent:#f6c400;      /* yellow accent */
      --accent-2:#ffe16a;    /* lighter yellow for hover */
      --text:#e9e9ea;        /* base text */
      --muted:#b7b7bb;       /* secondary text */
      --border:rgba(246,196,0,.6);
      --radius:14px;
      --shadow:0 2px 10px rgba(0,0,0,.45);
    }
    .tick {
        display:grid;
      place-items:center;
      padding:24px;
    }
    .card2{
      width:min(100%, 980px);
      background:var(--panel);
      border:1px solid rgba(255,255,255,.06);
      border-radius:var(--radius);
      box-shadow:var(--shadow);
      padding:22px 22px;
    }

    .label{
      font-size:14px;
      letter-spacing:.03em;
      text-transform:uppercase;
      color:var(--accent);
      margin-bottom:10px;
      font-weight:600;
    }

    .row2{
      display:flex;
      align-items:center;
      gap:14px;
    }

    .address-wrap{
      position:relative;
      flex:1 1 auto;
      min-width:0; /* enables text-overflow */
      padding:10px 12px;
      border-radius:10px;
      border:1px dashed rgba(246,196,0,.25);
      background:linear-gradient(0deg, rgba(255,255,255,0.02), rgba(255,255,255,0.02));
      transition:border-color .2s ease;
    }

    .address{
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
      font-size:16px;
      line-height:1.4;
      color:var(--accent);
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis; /* default desktop truncation at end */
      user-select:text;
      display:block;
    }

    /* Middle-ellipsis on narrow screens */
    @media (max-width: 560px){
      .address{ /* middle-ellipsis using two spans */
        white-space:normal; /* allow the custom layout below */
      }
      .address[data-middle-ellipsis="true"]{
        display:grid;
        grid-template-columns:1fr auto 1fr;
        gap:6px;
      }
      .address[data-middle-ellipsis="true"] .left,
      .address[data-middle-ellipsis="true"] .right{
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
      }
    }

    .copy-btn{
      flex:0 0 auto;
      display:inline-flex;
      align-items:center;
      gap:10px;
      padding:12px 16px;
      border-radius:999px;
      border:1px solid var(--border);
      color:var(--accent);
      background:transparent;
      font-weight:600;
      cursor:pointer;
      transition:transform .06s ease, border-color .2s ease, background-color .2s ease, color .2s ease;
    }
    .copy-btn:hover{border-color:var(--accent-2); color:var(--accent-2)}
    .copy-btn:active{transform:translateY(1px)}
    .copy-btn:focus-visible{outline:2px solid var(--accent); outline-offset:2px}

    .copy-btn svg{width:18px; height:18px; display:block}

    /* Mobile tweaks */
    @media (max-width: 560px){
      .card{padding:18px}
      .row{gap:10px}
      .copy-btn{padding:10px 14px}
      .label{font-size:12px}
      .address-wrap{padding:10px}
      .address{font-size:15px}
    }

    /* Toast */
    .toast{
      position:fixed; inset:auto 0 22px 0; margin:auto; width:max-content; max-width:calc(100% - 32px);
      background:rgba(28,29,33,.95);
      color:var(--accent);
      border:1px solid var(--border);
      border-radius:999px;
      padding:10px 14px;
      box-shadow:var(--shadow);
      display:none;
      z-index:20;
    }
    .toast.show{display:block; animation:fade 1.8s ease forwards}
    @keyframes fade{0%{opacity:0; transform:translateY(6px)} 10%{opacity:1; transform:translateY(0)} 80%{opacity:1} 100%{opacity:0}}