@layer hype-buttons {
  :root {
    --hype-button-solid:#df731a;
    --hype-button-solid-hover:#d26814;
    --hype-button-ink:#17313d;
    --hype-button-line:#bdd4df;
    --hype-button-mist:#edf7fc;
    --hype-button-radius:6px;
  }
  :is(.hype-btn--primary,.hype-btn--secondary) {
    appearance:none!important;
    box-sizing:border-box!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:10px!important;
    min-height:48px!important;
    height:auto!important;
    max-width:100%;
    padding:12px 20px!important;
    border:1px solid!important;
    border-radius:var(--hype-button-radius)!important;
    background-image:none!important;
    box-shadow:none!important;
    font:700 16px/1.35 Manrope,Arial,sans-serif!important;
    text-align:center!important;
    text-decoration:none!important;
    text-transform:none!important;
    text-shadow:none!important;
    letter-spacing:0!important;
    white-space:normal!important;
    vertical-align:middle;
    cursor:pointer;
    transition:background-color .16s ease,border-color .16s ease,color .16s ease,opacity .16s ease!important;
  }
  .hype-btn--primary {
    background-color:var(--hype-button-solid)!important;
    border-color:var(--hype-button-solid)!important;
    color:#fff!important;
  }
  .hype-btn--secondary {
    background-color:#fff!important;
    border-color:var(--hype-button-line)!important;
    color:var(--hype-button-ink)!important;
  }
  :is(.hype-btn--primary,.hype-btn--secondary) :is(span,b,strong) {
    color:inherit!important;
    font:inherit!important;
    text-transform:inherit!important;
    letter-spacing:inherit!important;
  }
  :is(.hype-btn--primary,.hype-btn--secondary)>span {
    padding:0!important;border:0!important;border-radius:0!important;
    background:transparent!important;box-shadow:none!important;
    min-height:0!important;height:auto!important;
  }
  @media(hover:hover) {
    .hype-btn--primary:hover {background-color:var(--hype-button-solid-hover)!important;border-color:var(--hype-button-solid-hover)!important;color:#fff!important}
    .hype-btn--secondary:hover {background-color:var(--hype-button-mist)!important;border-color:#78a9bf!important;color:var(--hype-button-ink)!important}
  }
  :is(.hype-btn--primary,.hype-btn--secondary)::before,
  :is(.hype-btn--primary,.hype-btn--secondary)::after {margin:0!important}
  :is(.hype-btn--primary,.hype-btn--secondary):active {filter:brightness(.96)}
  .hype-btn--secondary[aria-pressed="true"] {background-color:var(--hype-button-mist)!important;border-color:var(--hype-button-ink)!important;color:var(--hype-button-ink)!important}
  :is(.hype-btn--primary,.hype-btn--secondary):focus-visible {outline:3px solid #3499c4!important;outline-offset:3px!important}
  :is(.hype-btn--primary,.hype-btn--secondary):is(:disabled,[aria-disabled="true"],.disabled) {opacity:.5!important;cursor:not-allowed!important;filter:none!important}
  :is(.hype-btn--primary,.hype-btn--secondary):is(.loading,[aria-busy="true"]) {opacity:.7!important;cursor:progress!important}
  @media(prefers-reduced-motion:reduce){:is(.hype-btn--primary,.hype-btn--secondary){transition:none!important}}
  @media(max-width:600px){:is(.hype-btn--primary,.hype-btn--secondary){padding:12px!important;font-size:15px!important;gap:8px!important}}
}
@layer hype-buttons { .hype-btn--sm { min-height: 40px !important; height: 40px !important; padding: 0 18px !important; font-size: 15px !important; } }