/* TAP5 UI foundation: opt in with .tap5-ui; no legacy page is restyled. */
:root {
  --tap5-black: #080807;
  --tap5-ink: #f8f5ed;
  --tap5-muted: #b5b0a4;
  --tap5-gold: #d8b871;
  --tap5-gold-deep: #a78038;
  --tap5-surface: #171713;
  --tap5-glass: rgb(28 27 23 / 78%);
  --tap5-line: rgb(216 184 113 / 22%);
  --tap5-danger: #ef817d;
  --tap5-success: #80c9a4;
  --tap5-warning: #efcb81;
  --tap5-radius-sm: .625rem;
  --tap5-radius-md: 1rem;
  --tap5-radius-lg: 1.5rem;
  --tap5-space-1: .25rem;
  --tap5-space-2: .5rem;
  --tap5-space-3: .75rem;
  --tap5-space-4: 1rem;
  --tap5-space-6: 1.5rem;
  --tap5-space-8: 2rem;
  --tap5-space-12: 3rem;
  --tap5-shadow: 0 20px 60px rgb(0 0 0 / 28%);
  --tap5-focus: 0 0 0 3px rgb(216 184 113 / 42%);
}
.tap5-ui { color: var(--tap5-ink); background: var(--tap5-black); font: 400 1rem/1.5 system-ui, -apple-system, 'Segoe UI', sans-serif; }
.tap5-ui *, .tap5-ui *::before, .tap5-ui *::after { box-sizing: border-box; }
.tap5-ui :focus-visible { outline: 2px solid var(--tap5-gold); outline-offset: 3px; }
.tap5-ui [hidden] { display: none !important; }
.tap5-ui a { color: var(--tap5-gold); }
.tap5-logo-crop { display:block;position:relative;width:126px;height:46px;overflow:hidden;flex:none; }
.tap5-logo-crop img { position:absolute;top:-34px;left:-7px;width:140px;height:109px;max-width:none;object-fit:contain; }
@media(max-width:899px) { .tap5-logo-crop { width:108px;height:42px; } .tap5-logo-crop img { width:124px;height:97px;top:-30px;left:-7px; } }
.tap5-display { font-size: clamp(2.5rem, 7vw, 5rem); line-height: 1.04; letter-spacing: -.045em; font-weight: 650; }
.tap5-heading { font-size: clamp(1.5rem, 4vw, 2.5rem); line-height: 1.15; letter-spacing: -.025em; }
.tap5-muted { color: var(--tap5-muted); }
.tap5-stack { display: grid; gap: var(--tap5-space-4); }
.tap5-cluster { display: flex; flex-wrap: wrap; align-items: center; gap: var(--tap5-space-3); }
.tap5-container { width: min(100% - 2rem, 80rem); margin-inline: auto; }
.tap5-button { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 44px; padding: .7rem 1.15rem; border: 1px solid var(--tap5-gold); border-radius: var(--tap5-radius-sm); background: var(--tap5-gold); color: var(--tap5-black); font: inherit; font-weight: 700; text-decoration: none; cursor: pointer; transition: background-color .18s ease, border-color .18s ease, transform .18s ease; }
.tap5-button:hover:not(:disabled) { background: #e6c887; transform: translateY(-1px); }
.tap5-button:disabled { opacity: .55; cursor: not-allowed; }
.tap5-button--outline { color: var(--tap5-gold); background: transparent; }
.tap5-button--outline:hover:not(:disabled) { background: rgb(216 184 113 / 12%); }
.tap5-button--quiet { color: var(--tap5-ink); border-color: transparent; background: transparent; }
.tap5-button--quiet:hover:not(:disabled) { background: rgb(255 255 255 / 8%); }
.tap5-field { display: grid; gap: .4rem; }
.tap5-label { font-size: .875rem; font-weight: 650; }
.tap5-input { width: 100%; min-height: 44px; padding: .7rem .875rem; border: 1px solid var(--tap5-line); border-radius: var(--tap5-radius-sm); background: var(--tap5-surface); color: var(--tap5-ink); font: inherit; }
.tap5-input::placeholder { color: var(--tap5-muted); }
.tap5-input[aria-invalid='true'] { border-color: var(--tap5-danger); }
.tap5-field-error { color: var(--tap5-danger); font-size: .8125rem; }
.tap5-card, .tap5-glass { padding: var(--tap5-space-6); border: 1px solid var(--tap5-line); border-radius: var(--tap5-radius-lg); box-shadow: var(--tap5-shadow); }
.tap5-card { background: var(--tap5-surface); }
.tap5-glass { background: var(--tap5-glass); }
@supports (backdrop-filter: blur(12px)) { .tap5-glass { backdrop-filter: blur(12px); } }
.tap5-badge { display: inline-flex; align-items: center; gap: .4rem; padding: .2rem .65rem; border: 1px solid var(--tap5-line); border-radius: 999px; color: var(--tap5-gold); font-size: .75rem; font-weight: 700; }
.tap5-badge--success { color: var(--tap5-success); }
.tap5-badge--danger { color: var(--tap5-danger); }
.tap5-status { display: inline-flex; align-items: center; gap: .5rem; }
.tap5-status::before { content: ''; width: .5rem; height: .5rem; border-radius: 50%; background: currentColor; }
.tap5-status--success { color: var(--tap5-success); }
.tap5-status--warning { color: var(--tap5-warning); }
.tap5-status--danger { color: var(--tap5-danger); }
.tap5-nav { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 64px; }
.tap5-nav__links { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.tap5-mobile-nav { display: none; }
.tap5-notice { padding: var(--tap5-space-4); border: 1px solid var(--tap5-line); border-radius: var(--tap5-radius-md); background: var(--tap5-surface); }
.tap5-notice--error { border-color: var(--tap5-danger); }
.tap5-notice--success { border-color: var(--tap5-success); }
.tap5-empty { display: grid; justify-items: center; gap: 1rem; padding: var(--tap5-space-12) var(--tap5-space-4); text-align: center; border: 1px dashed var(--tap5-line); border-radius: var(--tap5-radius-lg); }
.tap5-skeleton { min-height: 1rem; border-radius: var(--tap5-radius-sm); background: linear-gradient(90deg, #24231e 25%, #333127 50%, #24231e 75%); background-size: 200% 100%; animation: tap5-shimmer 1.5s ease-in-out infinite; }
.tap5-spinner { width: 1.25rem; height: 1.25rem; border: 2px solid rgb(216 184 113 / 30%); border-top-color: var(--tap5-gold); border-radius: 50%; animation: tap5-spin .8s linear infinite; }
.tap5-otp { display: flex; gap: .4rem; justify-content: space-between; max-width: 24rem; }
.tap5-otp__digit { width: min(14vw, 3.5rem); height: 3.5rem; text-align: center; font: 700 1.5rem/1 system-ui, sans-serif; border: 1px solid var(--tap5-line); border-radius: var(--tap5-radius-sm); color: var(--tap5-ink); background: var(--tap5-surface); }
.tap5-otp[data-state='invalid'] .tap5-otp__digit { border-color: var(--tap5-danger); }
.tap5-otp[data-state='success'] .tap5-otp__digit { border-color: var(--tap5-success); }
.tap5-dialog { max-width: min(100% - 2rem, 32rem); width: 100%; padding: var(--tap5-space-6); border: 1px solid var(--tap5-line); border-radius: var(--tap5-radius-lg); background: var(--tap5-surface); color: var(--tap5-ink); box-shadow: var(--tap5-shadow); }
.tap5-dialog::backdrop { background: rgb(0 0 0 / 72%); }
.tap5-sheet { position: fixed; inset: auto 0 0; z-index: 100; width: 100%; max-height: 90dvh; overflow: auto; padding: var(--tap5-space-6); border: 1px solid var(--tap5-line); border-radius: var(--tap5-radius-lg) var(--tap5-radius-lg) 0 0; background: var(--tap5-surface); color: var(--tap5-ink); box-shadow: var(--tap5-shadow); }
.tap5-sheet:not([data-open='true']) { display: none; }
.tap5-toast-region { position: fixed; right: 1rem; bottom: 1rem; z-index: 200; display: grid; gap: .5rem; width: min(24rem, calc(100vw - 2rem)); }
.tap5-toast { padding: .875rem 1rem; border: 1px solid var(--tap5-line); border-radius: var(--tap5-radius-sm); color: var(--tap5-ink); background: var(--tap5-surface); box-shadow: var(--tap5-shadow); }
.tap5-toast[data-tone='error'] { border-color: var(--tap5-danger); }
.tap5-toast[data-tone='success'] { border-color: var(--tap5-success); }
@media (max-width: 47.99rem) { .tap5-nav__links { display: none; } .tap5-mobile-nav { display: flex; align-items: center; gap: .5rem; } .tap5-nav[data-open='true'] .tap5-nav__links { display: grid; position: absolute; top: 64px; left: 1rem; right: 1rem; z-index: 20; padding: 1rem; border: 1px solid var(--tap5-line); border-radius: var(--tap5-radius-md); background: var(--tap5-surface); } }
@media (min-width: 48rem) { .tap5-container { width: min(100% - 3rem, 80rem); } }
@media (min-width: 72rem) { .tap5-container { width: min(100% - 4rem, 80rem); } }
@media (prefers-reduced-motion: reduce) { .tap5-ui *, .tap5-ui *::before, .tap5-ui *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; } }
@keyframes tap5-shimmer { to { background-position-x: -200%; } }
@keyframes tap5-spin { to { transform: rotate(360deg); } }

.header-install {
  min-height: 40px;
  padding: .55rem .85rem;
  border: 1px solid var(--tap5-line);
  border-radius: var(--tap5-radius-sm);
  background: rgb(216 184 113 / 10%);
  color: var(--tap5-gold);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.header-install:hover { background: rgb(216 184 113 / 18%); }
.header-install[hidden] { display: none !important; }
.customer-header__actions { display: flex; align-items: center; gap: .65rem; flex-wrap: wrap; }
@media (max-width: 47.99rem) {
  .header-install { width: 100%; }
}

:root[data-tap5-theme='light']{
  --tap5-black:#f6f2e8;
  --tap5-ink:#1a1711;
  --tap5-muted:#6f675a;
  --tap5-surface:#fffdfa;
  --tap5-glass:rgb(255 253 250 / 86%);
  --tap5-line:rgb(154 118 48 / 24%);
  --tap5-shadow:0 20px 50px rgb(70 48 14 / 12%);
}
:root[data-tap5-theme='light'] .tap5-ui{background:#f6f2e8;color:#1a1711}
:root[data-tap5-theme='light'] .tap5-input,
:root[data-tap5-theme='light'] .tap5-card,
:root[data-tap5-theme='light'] .tap5-dialog,
:root[data-tap5-theme='light'] .tap5-sheet,
:root[data-tap5-theme='light'] .tap5-toast{background:#fffdfa;color:#1a1711}
