/* ════════════════════════════════════════════
   COMPONENTS — FrostProxies
   Modern, premium, smooth
════════════════════════════════════════════ */

/* ── NAV ── */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:900;
  height:var(--nav-h);
  display:flex; align-items:center; padding:0 40px;
  background:rgba(5,8,15,.6);
  backdrop-filter:blur(28px) saturate(200%);
  -webkit-backdrop-filter:blur(28px) saturate(200%);
  border-bottom:1px solid rgba(255,255,255,.055);
  transition:background .3s, border-color .3s;
  will-change:transform;
}
/* Gradient line under nav */
.nav::after {
  content:'';
  position:absolute; bottom:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg,transparent 0%,rgba(37,99,235,.5) 30%,rgba(6,182,212,.45) 55%,rgba(139,92,246,.3) 80%,transparent 100%);
  opacity:.6;
}
.nav--scrolled { background:rgba(5,8,15,.88); }

.nav__logo {
  display:flex; align-items:center; gap:10px;
  font-size:1.06rem; font-weight:800; color:var(--t-1);
  cursor:pointer; letter-spacing:-.025em; user-select:none;
  flex-shrink:0;
}
.nav__logo-mark {
  width:32px; height:32px; flex-shrink:0;
  background:linear-gradient(135deg,#1d4ed8 0%,#2563eb 40%,#06b6d4 100%);
  border-radius:9px;
  display:flex; align-items:center; justify-content:center;
  font-size:16px;
  box-shadow:0 2px 12px rgba(37,99,235,.55), inset 0 1px 0 rgba(255,255,255,.2);
  transition:box-shadow .3s, transform .2s;
}
.nav__logo:hover .nav__logo-mark { transform:rotate(-8deg) scale(1.08); box-shadow:0 4px 20px rgba(37,99,235,.7); }

.nav__links { display:flex; align-items:center; gap:2px; margin-left:auto; }
.nav__link {
  position:relative; padding:7px 14px;
  font-size:.85rem; font-weight:500; color:var(--t-2);
  border-radius:var(--r-sm);
  transition:color .2s, background .2s;
  letter-spacing:-.005em;
}
.nav__link::after {
  content:''; position:absolute; bottom:3px; left:14px; right:14px; height:1px;
  background:linear-gradient(90deg,var(--blue),var(--cyan));
  transform:scaleX(0); transform-origin:left;
  transition:transform .25s var(--ease);
  border-radius:1px;
}
.nav__link:hover { color:var(--t-1); background:rgba(255,255,255,.05); }
.nav__link:hover::after, .nav__link.is-active::after { transform:scaleX(1); }
.nav__link.is-active { color:var(--t-1); }

.nav__cta {
  margin-left:14px; padding:9px 22px;
  background:linear-gradient(135deg,#2563eb,#1d4ed8);
  color:#fff; border-radius:var(--r-sm);
  font-size:.875rem; font-weight:700; letter-spacing:-.01em;
  border:1px solid rgba(96,165,250,.25);
  box-shadow:0 2px 14px rgba(37,99,235,.4), inset 0 1px 0 rgba(255,255,255,.18);
  transition:all .2s var(--ease);
  position:relative; overflow:hidden;
}
.nav__cta::before {
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,.14),transparent);
  opacity:0; transition:opacity .2s;
}
.nav__cta:hover { transform:translateY(-1px); box-shadow:0 6px 28px rgba(37,99,235,.55), inset 0 1px 0 rgba(255,255,255,.2); }
.nav__cta:hover::before { opacity:1; }
.nav__cta:active { transform:translateY(0); }

.nav__user { display:flex; align-items:center; gap:10px; margin-left:16px; padding-left:16px; border-left:1px solid var(--line); }
.nav__user-name { font-size:.84rem; font-weight:600; color:var(--t-2); }
.nav__logout {
  font-size:.8rem; color:var(--t-3); padding:6px 13px;
  border-radius:var(--r-sm); border:1px solid var(--line);
  transition:all .18s;
}
.nav__logout:hover { color:var(--red); border-color:rgba(239,68,68,.3); background:rgba(239,68,68,.06); }

/* ── BUTTONS ── */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  font-family:var(--f); font-weight:600;
  border-radius:var(--r-sm);
  transition:all .2s var(--ease);
  cursor:pointer; white-space:nowrap;
  letter-spacing:-.01em;
  position:relative; overflow:hidden;
  -webkit-tap-highlight-color:transparent;
}
.btn::before {
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,.12),transparent);
  opacity:0; transition:opacity .18s;
}
.btn:hover::before { opacity:1; }
.btn:active { transform:scale(.975) !important; }

.btn--lg { padding:14px 36px; font-size:.975rem; border-radius:var(--r-md); }
.btn--md { padding:9px 20px; font-size:.86rem; }
.btn--sm { padding:7px 14px; font-size:.8rem; }
.btn--xs { padding:4px 10px; font-size:.72rem; border-radius:var(--r-xs); }
.btn--full { width:100%; }

.btn--primary {
  background:linear-gradient(135deg,#2563eb 0%,#1d4ed8 100%);
  color:#fff; border:1px solid rgba(96,165,250,.28);
  box-shadow:0 2px 14px rgba(37,99,235,.38), inset 0 1px 0 rgba(255,255,255,.18);
}
.btn--primary:hover {
  transform:translateY(-2px);
  box-shadow:0 8px 32px rgba(37,99,235,.55), inset 0 1px 0 rgba(255,255,255,.22);
}
.btn--ghost {
  background:rgba(255,255,255,.04); color:var(--t-2);
  border:1px solid var(--line-hi);
}
.btn--ghost:hover {
  background:rgba(255,255,255,.08); color:var(--t-1);
  border-color:rgba(255,255,255,.16); transform:translateY(-1px);
}
.btn--danger { background:var(--red-lo); color:var(--red); border:1px solid rgba(239,68,68,.22); }
.btn--danger:hover { background:rgba(239,68,68,.18); }
.btn--success { background:var(--green-lo); color:var(--green); border:1px solid rgba(16,185,129,.22); }
.btn:disabled { opacity:.45; cursor:not-allowed; transform:none !important; box-shadow:none !important; }

/* Ice btn */
.btn--ice {
  border:1px solid rgba(6,182,212,.32) !important;
  color:rgba(165,243,252,.95) !important;
  background:rgba(6,182,212,.07) !important;
  backdrop-filter:blur(8px);
}
.btn--ice:hover {
  background:rgba(6,182,212,.15) !important;
  border-color:rgba(6,182,212,.55) !important;
  transform:translateY(-2px) !important;
  box-shadow:0 0 28px rgba(6,182,212,.22) !important;
}

/* Glow btn */
.btn--glow { animation:btnGlowAnim 3.5s ease-in-out infinite; }
@keyframes btnGlowAnim {
  0%,100%{box-shadow:0 0 24px rgba(37,99,235,.38),0 4px 16px rgba(37,99,235,.3),inset 0 1px 0 rgba(255,255,255,.18)}
  50%{box-shadow:0 0 48px rgba(37,99,235,.65),0 6px 28px rgba(37,99,235,.5),0 0 80px rgba(6,182,212,.18),inset 0 1px 0 rgba(255,255,255,.22)}
}
.btn--glow:hover { animation:none; }

/* ── FORMS ── */
.form-label { display:block; font-size:.72rem; font-weight:600; color:var(--t-3); margin-bottom:6px; letter-spacing:.06em; text-transform:uppercase; }
.form-input {
  width:100%; padding:10px 14px;
  background:var(--bg-4); border:1px solid var(--line);
  border-radius:var(--r-sm); color:var(--t-1); font-size:.875rem;
  transition:border-color .18s, background .18s, box-shadow .18s;
  outline:none; appearance:none;
}
.form-input:focus { border-color:rgba(37,99,235,.7); background:var(--bg-5); box-shadow:0 0 0 3px rgba(37,99,235,.14); }
.form-input::placeholder { color:var(--t-3); }
select.form-input { cursor:pointer; }
.form-group { margin-bottom:16px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }

/* ── CARDS ── */
.card {
  background:var(--bg-3); border:1px solid var(--line);
  border-radius:var(--r-lg); padding:22px;
  transition:border-color .2s, box-shadow .2s;
}
.card:hover { border-color:var(--line-hi); }
.card--glow { border-color:rgba(37,99,235,.2); box-shadow:0 0 40px rgba(37,99,235,.06); }
.card--glow:hover { border-color:rgba(37,99,235,.35); box-shadow:0 0 60px rgba(37,99,235,.1); }
.card__header { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.card__title { font-size:.9rem; font-weight:700; color:var(--t-1); letter-spacing:-.01em; }

/* ── BADGES ── */
.badge {
  display:inline-flex; align-items:center; padding:2px 9px;
  border-radius:var(--r-full); font-size:.68rem; font-weight:700;
  letter-spacing:.04em; text-transform:uppercase; white-space:nowrap;
}
.badge--success { background:rgba(16,185,129,.12); color:var(--green); border:1px solid rgba(16,185,129,.22); }
.badge--warn    { background:rgba(245,158,11,.12);  color:var(--amber); border:1px solid rgba(245,158,11,.22); }
.badge--danger  { background:rgba(239,68,68,.12);   color:var(--red);   border:1px solid rgba(239,68,68,.22); }
.badge--info    { background:rgba(37,99,235,.14);   color:#60a5fa;      border:1px solid rgba(37,99,235,.28); }
.badge--cyan    { background:rgba(6,182,212,.12);   color:var(--cyan);  border:1px solid rgba(6,182,212,.22); }
.badge--muted   { background:rgba(255,255,255,.05); color:var(--t-3);   border:1px solid var(--line); }
.badge--purple  { background:rgba(139,92,246,.14);  color:#a78bfa;      border:1px solid rgba(139,92,246,.28); }

/* ── DOT ── */
.dot { display:inline-block; width:6px; height:6px; border-radius:50%; flex-shrink:0; }
.dot--online  { background:var(--green); box-shadow:0 0 8px var(--green); animation:pulse 2.2s ease-in-out infinite; }
.dot--warn    { background:var(--amber); box-shadow:0 0 6px var(--amber); }
.dot--offline { background:var(--t-3); }

/* ── TOGGLE ── */
.toggle { position:relative; display:inline-block; width:38px; height:21px; flex-shrink:0; }
.toggle input { opacity:0; width:0; height:0; position:absolute; }
.toggle__track { position:absolute; inset:0; background:var(--bg-5); border:1px solid var(--line); border-radius:var(--r-full); cursor:pointer; transition:all .22s var(--ease); }
.toggle__track::before { content:''; position:absolute; width:14px; height:14px; bottom:3px; left:3px; background:var(--t-3); border-radius:50%; transition:transform .22s var(--ease-back), background .22s; }
.toggle input:checked + .toggle__track { background:rgba(37,99,235,.25); border-color:var(--blue); }
.toggle input:checked + .toggle__track::before { transform:translateX(17px); background:var(--blue); box-shadow:0 0 8px rgba(37,99,235,.6); }

/* ── PROGRESS ── */
.progress { height:3px; background:rgba(255,255,255,.06); border-radius:2px; overflow:hidden; min-width:60px; }
.progress__fill { height:100%; background:linear-gradient(90deg,var(--blue),var(--cyan)); border-radius:2px; transition:width .7s var(--ease); }
.progress__fill--warn { background:linear-gradient(90deg,var(--amber),#fcd34d); }

/* ── TABLE ── */
.table { width:100%; border-collapse:collapse; }
.table th { padding:9px 16px; font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--t-3); text-align:left; border-bottom:1px solid var(--line); white-space:nowrap; }
.table td { padding:12px 16px; font-size:.84rem; border-bottom:1px solid rgba(255,255,255,.035); vertical-align:middle; }
.table tr:last-child td { border-bottom:none; }
.table tbody tr { transition:background .12s; }
.table tbody tr:hover td { background:rgba(255,255,255,.022); }
.table-wrap { background:var(--bg-3); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; margin-bottom:20px; }
.table-wrap__header { display:flex; align-items:center; justify-content:space-between; padding:13px 18px; border-bottom:1px solid var(--line); background:rgba(255,255,255,.014); }
.table-wrap__title { font-size:.9rem; font-weight:700; color:var(--t-1); }

/* ── TOAST ── */
.toast-wrap { position:fixed; bottom:24px; right:24px; z-index:9999; display:flex; flex-direction:column; gap:8px; pointer-events:none; }
.toast {
  display:flex; align-items:center; gap:10px; padding:11px 16px;
  background:rgba(12,17,32,.92); border:1px solid var(--line-hi);
  border-radius:var(--r-md); font-size:.84rem; font-weight:500;
  backdrop-filter:blur(24px);
  box-shadow:0 8px 40px rgba(0,0,0,.5), 0 1px 3px rgba(0,0,0,.4);
  min-width:220px; max-width:340px;
  pointer-events:all;
  animation:slideInR .28s var(--ease) both;
}
.toast--out { animation:none; opacity:0; transform:translateX(8px); transition:opacity .2s, transform .2s; }

/* ── SPINNER ── */
.spinner { width:16px; height:16px; border:2px solid rgba(255,255,255,.1); border-top-color:var(--blue); border-radius:50%; animation:spin .65s linear infinite; flex-shrink:0; }
.spinner--lg { width:28px; height:28px; border-width:3px; }

/* ── AVATAR ── */
.avatar {
  display:inline-flex; align-items:center; justify-content:center;
  width:30px; height:30px; border-radius:var(--r-sm);
  background:linear-gradient(135deg,var(--blue),var(--cyan));
  font-size:10px; font-weight:800; color:#fff; flex-shrink:0;
  box-shadow:0 2px 8px rgba(37,99,235,.35);
}

/* ── MODAL ── */
.modal-overlay {
  position:fixed; inset:0; z-index:9000;
  background:rgba(0,0,0,.78);
  backdrop-filter:blur(14px) saturate(150%);
  -webkit-backdrop-filter:blur(14px) saturate(150%);
  display:none; align-items:center; justify-content:center; padding:20px;
}
.modal-box {
  background:var(--bg-3); border:1px solid var(--line-hi);
  border-radius:var(--r-2xl); width:100%; max-width:600px;
  max-height:88vh; display:flex; flex-direction:column;
  box-shadow:var(--shadow-lg), 0 0 80px rgba(37,99,235,.06);
  animation:modalIn .3s var(--ease) both;
}
.modal-header { display:flex; align-items:center; justify-content:space-between; padding:22px 26px 0; flex-shrink:0; }
.modal-title { font-size:1.15rem; font-weight:800; color:var(--t-1); letter-spacing:-.03em; }
.modal-close { width:28px; height:28px; border-radius:var(--r-sm); background:rgba(255,255,255,.05); border:1px solid var(--line); color:var(--t-2); font-size:.8rem; display:flex; align-items:center; justify-content:center; transition:all .15s; cursor:pointer; }
.modal-close:hover { background:var(--red-lo); border-color:rgba(239,68,68,.3); color:var(--red); }
.modal-date { font-size:.72rem; color:var(--t-3); padding:8px 26px 0; }
.modal-body { overflow-y:auto; padding:18px 26px; flex:1; }
.modal-section { margin-bottom:18px; padding-bottom:18px; border-bottom:1px solid rgba(255,255,255,.04); }
.modal-section:last-child { border-bottom:none; margin-bottom:0; padding-bottom:0; }
.modal-section__title { font-size:.88rem; font-weight:700; color:var(--t-1); margin-bottom:7px; }
.modal-section__text { font-size:.84rem; color:var(--t-2); line-height:1.7; }
.modal-alert { display:flex; align-items:flex-start; gap:11px; padding:12px 14px; border-radius:var(--r-md); border:1px solid; }
.modal-alert--danger { background:var(--red-lo); border-color:rgba(239,68,68,.25); color:var(--t-2); font-size:.84rem; line-height:1.65; }
.modal-alert--danger strong { color:var(--red); }
.modal-alert__icon { color:var(--red); flex-shrink:0; margin-top:2px; }
.modal-list--forbidden { display:flex; flex-direction:column; gap:7px; padding:12px 14px; background:var(--red-lo); border:1px solid rgba(239,68,68,.18); border-radius:var(--r-md); }
.modal-list--forbidden li { display:flex; align-items:flex-start; gap:9px; font-size:.84rem; color:var(--t-2); line-height:1.5; }
.modal-list--forbidden li::before { content:'×'; color:var(--red); flex-shrink:0; font-weight:800; }
.modal-footer { display:flex; align-items:center; justify-content:flex-end; padding:16px 26px; border-top:1px solid var(--line); flex-shrink:0; gap:10px; }

/* ── UTILS ── */
.mono { font-family:var(--f-mono); }
.flex-between { display:flex; align-items:center; justify-content:space-between; }
.mt-sm { margin-top:12px; } .mt-md { margin-top:20px; }
.text-green { color:var(--green); } .text-red { color:var(--red); }
.text-cyan { color:var(--cyan); } .text-muted { color:var(--t-2); }

/* ── PAYMENT MODAL ── */
.pay-modal {
  background:linear-gradient(160deg,#0c1428 0%,#0a1020 55%,#0d1530 100%);
  border:1px solid rgba(6,182,212,.22);
  border-radius:var(--r-2xl); width:100%; max-width:520px;
  box-shadow:0 0 80px rgba(6,182,212,.14), 0 0 160px rgba(37,99,235,.07), var(--shadow-lg);
  animation:modalIn .3s var(--ease) both;
  overflow:hidden; position:relative;
}
.pay-modal::before { content:''; position:absolute; top:0; left:0; right:0; height:1px; background:linear-gradient(90deg,transparent,rgba(6,182,212,.8),rgba(37,99,235,.5),transparent); }
.pay-modal::after  { content:''; position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse 80% 50% at 50% 0%,rgba(6,182,212,.06),transparent 60%); }
.pay-modal__header { display:flex; align-items:center; justify-content:space-between; padding:20px 24px; border-bottom:1px solid rgba(6,182,212,.1); background:rgba(6,182,212,.025); position:relative; z-index:1; }
.pay-modal__header-left { display:flex; align-items:center; gap:12px; }
.pay-modal__logo { width:38px; height:38px; border-radius:var(--r-md); background:linear-gradient(135deg,var(--blue),var(--cyan)); display:flex; align-items:center; justify-content:center; font-size:18px; box-shadow:0 0 18px rgba(6,182,212,.4); flex-shrink:0; }
.pay-modal__title { font-size:.98rem; font-weight:800; color:var(--t-1); letter-spacing:-.02em; }
.pay-modal__sub { font-size:.7rem; color:rgba(6,182,212,.55); margin-top:2px; font-weight:500; }
.pay-modal__close { width:28px; height:28px; border-radius:var(--r-sm); background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08); color:var(--t-3); font-size:.85rem; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:all .15s; }
.pay-modal__close:hover { background:var(--red-lo); border-color:rgba(239,68,68,.3); color:var(--red); }
.pay-step { padding:20px 24px; position:relative; z-index:1; }
.pay-step--confirm { text-align:center; }
.pay-summary { background:rgba(37,99,235,.07); border:1px solid rgba(37,99,235,.18); border-radius:var(--r-lg); padding:14px 16px; margin-bottom:18px; position:relative; overflow:hidden; }
.pay-summary::before { content:''; position:absolute; top:0; left:0; right:0; height:1px; background:linear-gradient(90deg,transparent,rgba(37,99,235,.5),transparent); }
.pay-summary__label { font-size:.66rem; font-weight:700; text-transform:uppercase; letter-spacing:.12em; color:rgba(6,182,212,.55); margin-bottom:7px; }
.pay-summary__row { display:flex; align-items:center; justify-content:space-between; }
.pay-summary__plan { font-size:.88rem; font-weight:600; color:var(--t-2); }
.pay-summary__price { font-size:1.5rem; font-weight:900; letter-spacing:-.04em; background:linear-gradient(135deg,#fff,rgba(165,243,252,.9)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.pay-currency-label { font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.12em; color:var(--t-3); margin-bottom:11px; }
.pay-currency-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-bottom:16px; }
.pay-curr-btn { background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.08); border-radius:var(--r-md); padding:11px 8px; cursor:pointer; transition:all .18s var(--ease); text-align:center; display:flex; flex-direction:column; align-items:center; gap:3px; font-family:var(--f); }
.pay-curr-btn:hover { border-color:var(--curr-color,rgba(6,182,212,.5)); background:rgba(6,182,212,.06); transform:translateY(-2px); }
.pay-curr-btn.active { border-color:var(--curr-color,var(--cyan)); background:rgba(6,182,212,.1); box-shadow:0 0 18px rgba(6,182,212,.14); }
.pay-curr-btn__icon { font-size:1.25rem; }
.pay-curr-btn__sym { font-size:.68rem; font-weight:800; color:var(--t-2); text-transform:uppercase; letter-spacing:.04em; }
.pay-curr-btn__amt { font-family:var(--f-mono); font-size:.62rem; color:var(--t-3); }
.pay-secure-note { font-size:.7rem; color:var(--t-3); text-align:center; line-height:1.5; padding:9px; background:rgba(255,255,255,.02); border-radius:var(--r-sm); border:1px solid rgba(255,255,255,.05); }
.pay-step2-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.pay-back-btn { font-size:.82rem; font-weight:600; color:var(--t-2); cursor:pointer; transition:color .15s; background:none; border:none; padding:4px; display:flex; align-items:center; gap:4px; }
.pay-back-btn:hover { color:var(--cyan); }
.pay-timer-box { display:flex; align-items:center; gap:7px; padding:5px 13px; background:rgba(245,158,11,.08); border:1px solid rgba(245,158,11,.22); border-radius:var(--r-full); }
.pay-timer-val { font-family:var(--f-mono); font-size:.88rem; font-weight:800; color:var(--amber); }
.pay-amount-card { background:linear-gradient(135deg,rgba(37,99,235,.12),rgba(6,182,212,.08)); border:1px solid rgba(6,182,212,.2); border-radius:var(--r-lg); padding:16px; margin-bottom:14px; text-align:center; position:relative; overflow:hidden; }
.pay-amount-card::before { content:''; position:absolute; top:0; left:0; right:0; height:1px; background:linear-gradient(90deg,transparent,rgba(6,182,212,.6),transparent); }
.pay-amount-card__label { font-size:.66rem; font-weight:700; text-transform:uppercase; letter-spacing:.12em; color:rgba(6,182,212,.55); margin-bottom:7px; }
.pay-amount-card__crypto { font-family:var(--f-mono); font-size:1.4rem; font-weight:800; color:var(--t-1); letter-spacing:-.02em; margin-bottom:3px; }
.pay-amount-card__usd { font-size:.8rem; color:var(--t-3); margin-bottom:11px; }
.pay-amount-card__copy { display:inline-flex; align-items:center; gap:6px; padding:5px 15px; background:rgba(6,182,212,.1); border:1px solid rgba(6,182,212,.25); border-radius:var(--r-full); font-size:.74rem; font-weight:600; color:var(--cyan); cursor:pointer; transition:all .15s; }
.pay-amount-card__copy:hover { background:rgba(6,182,212,.2); border-color:rgba(6,182,212,.5); }
.pay-send-row { display:flex; gap:12px; margin-bottom:14px; align-items:stretch; }
.pay-qr-box { background:white; border-radius:var(--r-md); padding:8px; flex-shrink:0; display:flex; align-items:center; justify-content:center; box-shadow:0 0 22px rgba(6,182,212,.22),0 4px 12px rgba(0,0,0,.4); width:156px; height:156px; }
.pay-qr-box canvas { display:block; width:140px; height:140px; }
.pay-addr-col { flex:1; display:flex; flex-direction:column; gap:8px; }
.pay-addr-col__label { font-size:.66rem; font-weight:700; text-transform:uppercase; letter-spacing:.12em; color:var(--t-3); }
.pay-addr-col__addr { font-family:var(--f-mono); font-size:.66rem; color:var(--t-2); background:rgba(255,255,255,.04); border:1px solid rgba(6,182,212,.14); border-radius:var(--r-sm); padding:9px 10px; word-break:break-all; line-height:1.55; flex:1; }
.pay-addr-col__copy { display:inline-flex; align-items:center; gap:5px; padding:7px 14px; background:rgba(37,99,235,.1); border:1px solid rgba(37,99,235,.25); border-radius:var(--r-sm); font-size:.74rem; font-weight:600; color:var(--blue-hi); cursor:pointer; transition:all .15s; white-space:nowrap; }
.pay-addr-col__copy:hover { background:rgba(37,99,235,.2); border-color:rgba(37,99,235,.45); }
.pay-status-row { display:flex; align-items:center; gap:12px; background:rgba(255,255,255,.028); border:1px solid rgba(6,182,212,.1); border-radius:var(--r-md); padding:12px 15px; margin-bottom:11px; }
.pay-status-dot { width:9px; height:9px; border-radius:50%; flex-shrink:0; background:var(--cyan); box-shadow:0 0 8px var(--cyan); animation:pulse 1.5s ease-in-out infinite; }
.pay-status-text { font-size:.84rem; font-weight:600; color:var(--t-1); }
.pay-status-sub { font-size:.71rem; color:var(--t-3); margin-top:1px; }
.pay-footer-id { font-family:var(--f-mono); font-size:.63rem; color:var(--t-3); text-align:center; }
.pay-confirm-icon { font-size:3.2rem; margin-bottom:12px; filter:drop-shadow(0 0 20px rgba(16,185,129,.5)); }
.pay-confirm-title { font-size:1.35rem; font-weight:900; color:var(--green); margin-bottom:9px; letter-spacing:-.03em; }
.pay-confirm-sub { font-size:.875rem; color:var(--t-2); line-height:1.7; margin-bottom:16px; }
.pay-confirm-proxy { background:var(--green-lo); border:1px solid rgba(16,185,129,.25); border-radius:var(--r-md); padding:11px; margin-bottom:16px; font-family:var(--f-mono); font-size:.78rem; color:var(--green); }

/* Discount */
.pay-discount-row { margin:13px 0 0; }
.pay-discount-input-wrap { display:flex; gap:8px; }
.pay-discount-input { flex:1; padding:9px 13px; background:rgba(255,255,255,.04); border:1px solid rgba(6,182,212,.16); border-radius:var(--r-sm); color:var(--t-1); font-size:.84rem; font-family:var(--f-mono); letter-spacing:.06em; outline:none; transition:border-color .15s, background .15s; }
.pay-discount-input:focus { border-color:rgba(6,182,212,.45); background:rgba(6,182,212,.06); }
.pay-discount-input::placeholder { color:var(--t-3); font-family:var(--f); letter-spacing:0; font-size:.82rem; }
.pay-discount-apply { padding:9px 17px; background:rgba(6,182,212,.1); border:1px solid rgba(6,182,212,.24); border-radius:var(--r-sm); color:var(--cyan); font-size:.8rem; font-weight:600; cursor:pointer; transition:all .15s; white-space:nowrap; font-family:var(--f); }
.pay-discount-apply:hover { background:rgba(6,182,212,.2); border-color:rgba(6,182,212,.5); }
.pay-discount-result { margin-top:7px; min-height:18px; }
.discount-success { display:flex; align-items:center; gap:8px; padding:6px 11px; background:rgba(16,185,129,.1); border:1px solid rgba(16,185,129,.24); border-radius:var(--r-sm); font-size:.78rem; }
.discount-success__tag { font-family:var(--f-mono); font-weight:700; color:var(--green); font-size:.72rem; letter-spacing:.06em; }
.discount-success__txt { color:var(--green); flex:1; }
.discount-success__remove { background:none; border:none; color:rgba(16,185,129,.45); cursor:pointer; font-size:.78rem; padding:0 2px; transition:color .15s; font-family:var(--f); }
.discount-success__remove:hover { color:var(--red); }
.discount-error { font-size:.77rem; color:var(--red); display:flex; align-items:center; gap:5px; }

@media(max-width:768px){.nav{padding:0 18px;}.form-row{grid-template-columns:1fr;}}

/* ── ANNOUNCEMENT BAR ── */
.announce-bar {
  position:fixed; top:0; left:0; right:0; z-index:910;
  height:var(--announce-h); overflow:hidden;
  background:linear-gradient(90deg, #1d4ed8 0%, #1e40af 40%, #0e7490 100%);
  display:flex; align-items:center;
  font-size:.75rem; font-weight:500; color:rgba(255,255,255,.9);
  border-bottom:1px solid rgba(255,255,255,.12);
}
.announce-bar__track {
  display:flex; align-items:center; gap:0; white-space:nowrap;
  animation:marquee 28s linear infinite;
  will-change:transform;
}
.announce-bar__track:hover { animation-play-state:paused; }
@keyframes marquee { from{transform:translateX(0)} to{transform:translateX(-50%)} }
.announce-bar__item { padding:0 24px; letter-spacing:-.005em; }
.announce-bar__item strong { color:#fff; font-weight:700; }
.announce-bar__sep { color:rgba(255,255,255,.35); padding:0 4px; }
.announce-bar__dot { display:inline-block; width:5px; height:5px; background:#34d399; border-radius:50%; margin-right:6px; box-shadow:0 0 6px #34d399; animation:pulse 2s ease-in-out infinite; vertical-align:middle; }
.announce-bar__close { position:absolute; right:12px; background:none; border:none; color:rgba(255,255,255,.55); font-size:.75rem; cursor:pointer; padding:4px 6px; border-radius:3px; transition:color .15s, background .15s; flex-shrink:0; }
.announce-bar__close:hover { color:#fff; background:rgba(255,255,255,.12); }

/* Nav sits BELOW announce bar on landing page */
#page-landing.is-active ~ * .nav,
body:has(#page-landing.is-active) .nav,
.nav { top: 0; }

/* When landing is active, push nav below announce bar */
#page-landing.is-active { --page-has-announce: 1; }

/* Landing page announce bar spacing is handled in landing.css */

/* ── NAV SCROLL EFFECT ── */
.nav--scrolled { background:rgba(5,8,15,.95) !important; backdrop-filter:blur(32px) saturate(220%) !important; }