@property --metal-turn {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}
@keyframes metal-reflection-flow {
  from { --metal-turn: 0deg; }
  to { --metal-turn: 360deg; }
}
/* Liquid chrome theme. Opaque black faces; iridescence is confined to the rim. */
:root {
  --bg: #08090b;
  --card: #101114;
  --surface: #15171b;
  --plan-free: #edf2fa;
  --plan-explorer: #79d8ff;
  --plan-pro: #ffb16e;
  --plan-plus: #d0a0ff;
  --plan-max: #d4f578;
  --included: #65df91;
  --metal-face: linear-gradient(180deg, #14161a, #090a0d);
  --metal-edge: linear-gradient(125deg,
    #363b43 0%, #9faab7 8%, #f4f8ff 13%, #777f8c 16%,
    #20252e 23%, #535e6e 34%, #a7dbef 37%, #3d73a8 39%,
    #cbd4df 42%, #fff 48%, #656b75 51%, #272d36 63%,
    #abb5c2 74%, #f2f7fc 79%, #72939f 81%, #404955 85%,
    #161b22 92%, #aab5c3 100%);
  --rainbow: var(--metal-edge);
}
.pricing-nav {
  background: rgba(16,18,22,.88);
  box-shadow: inset 0 1px 0 rgba(232,241,255,.15), inset 0 -1px 0 rgba(163,184,210,.07);
}
.bill-h1 { color: #f0f2f5; }
.bill-highlights li::before { background: #aebfcd; box-shadow: 0 0 4px rgba(175,220,242,.15); }

/* The first, fully opaque layer prevents the reflective rim from filling the face. */
.bill-btn,
.topup-pack > .topup-btn,
.topup-custom-btn,
.bill-comparison-table .compare-subscribe,
.bill-comparison-table a.compare-subscribe:not([data-subscribe-plan]),
.bill-enterprise-cta,
.pricing-open,
.pricing-skip,
.bill-cycle button[aria-pressed="true"] {
  --metal-edge: conic-gradient(from var(--metal-turn),
    #515d70 0deg, #d9e5f5 28deg, #fff 40deg, #7c8798 48deg,
    #252d3c 74deg, #76889b 104deg, #8ce2ff 116deg, #497dce 122deg,
    #dceaff 130deg, #fff 142deg, #566376 153deg, #232936 187deg,
    #9ba9b9 214deg, #f8fcff 238deg, #fff 246deg, #bbc7d7 254deg,
    #656d80 276deg, #c6baff 288deg, #648dba 295deg, #2c3546 313deg,
    #515d70 360deg);
  border: 2px solid transparent;
  background: var(--metal-face) padding-box, var(--metal-edge) border-box;
  color: #eff3f8;
  box-shadow: inset 0 1px 0 rgba(240,247,255,.15), inset 0 -1px 0 rgba(116,149,188,.12), 0 0 9px rgba(159,193,231,.08);
  animation: metal-reflection-flow 14s linear infinite;
  text-shadow: 0 1px 1px #000;
  transition: box-shadow .2s ease, filter .2s ease;
}
.bill-btn { padding: 8px 14px; font-weight: 600; }
.topup-pack > .topup-btn,
.topup-custom-btn,
.bill-comparison-table .compare-subscribe,
.bill-enterprise-cta { padding: 8px 18px; font-weight: 600; }
.pricing-open { padding: 5px 14px; }
.bill-cycle button[aria-pressed="true"] { padding: 0 8px; }
.bill-cycle { background: #14161a; box-shadow: inset 0 1px 2px #000; }
.bill-cycle-save { background: #22262d; color: #d6e4ee; }
.bill-btn:hover:not(:disabled):not([aria-disabled="true"]),
.topup-pack > .topup-btn:hover:not(:disabled),
.topup-custom-btn:hover:not(:disabled),
.bill-comparison-table .compare-subscribe:hover:not(:disabled),
.bill-enterprise-cta:hover,
.pricing-open:hover,
.bill-cycle button[aria-pressed="true"]:hover {
  background: var(--metal-face) padding-box, var(--metal-edge) border-box;
  filter: brightness(1.12);
  box-shadow: inset 0 1px 0 rgba(240,247,255,.1), 0 0 12px rgba(163,199,225,.1);
}
.bill-btn:disabled,
.bill-btn.subscribed,
.bill-btn[aria-disabled="true"],
.bill-card.free .bill-btn,
.topup-pack > .topup-btn:disabled,
.topup-custom-btn:disabled,
.bill-comparison-table .compare-subscribe:disabled,
.bill-comparison-table .compare-subscribe[data-subscribe-plan="free"] {
  border-color: #30343c;
  background: #181a1e;
  box-shadow: none;
  color: #969ca6;
  text-shadow: none;
  filter: none;
  animation: none;
}
.bill-btn.subscribed { color: #d4e0e9; }

.bill-card { box-shadow: inset 0 1px 0 rgba(217,230,245,.17), inset 0 0 0 1px rgba(178,191,210,.08); }
.bill-card.plus::before {
  inset: -33px -2px -2px;
  padding: 2px;
  background: var(--metal-edge);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
}
.bill-card.plus::after { background: var(--card); }
.bill-recommend-label {
  background: #101317;
  color: #dde7ef;
  border-radius: 18px 18px 0 0;
  box-shadow: inset 0 1px 0 rgba(240,248,255,.7), inset 0 -1px 0 rgba(151,183,207,.18);
  letter-spacing: .025em;
}
.bill-card.vip:not(.plus) { outline-color: #8eacbe; }
/* Color emphasizes the plan and useful quantities; ordinary copy stays neutral. */
.bill-card.free { --plan-accent: var(--plan-free); }
.bill-card.explorer { --plan-accent: var(--plan-explorer); }
.bill-card.pro { --plan-accent: var(--plan-pro); }
.bill-card.plus { --plan-accent: var(--plan-plus); }
.bill-card.max { --plan-accent: var(--plan-max); }
.manifest-pricing .bill-card .bill-plan-name,
.manifest-pricing .bill-card .bill-credit-number,
.manifest-pricing .bill-card .bill-tagline,
.bill-feature-accent { color: var(--plan-accent); }
.bill-feature-heading { color: #8dbdff; }
.bill-card-body > .bill-feature-heading:first-child { color: var(--plan-accent); }
.bill-feature-heading-quality { color: #c7a9f7; }
.bill-feat li::before { color: var(--included); font-weight: 700; }
.bill-recommend-label, .compare-ribbon { color: var(--plan-plus); }
.bill-comparison-table thead th:nth-child(2) { --plan-accent: var(--plan-free); }
.bill-comparison-table thead th:nth-child(3) { --plan-accent: var(--plan-explorer); }
.bill-comparison-table thead th:nth-child(4) { --plan-accent: var(--plan-pro); }
.bill-comparison-table thead th:nth-child(5) { --plan-accent: var(--plan-plus); }
.bill-comparison-table thead th:nth-child(6) { --plan-accent: var(--plan-max); }
.compare-plan-name, .compare-tagline { color: var(--plan-accent); }
.bill-comparison-table tbody tr:nth-child(2) td:nth-child(2) { color: var(--plan-free); }
.bill-comparison-table tbody tr:nth-child(2) td:nth-child(3) { color: var(--plan-explorer); }
.bill-comparison-table tbody tr:nth-child(2) td:nth-child(4) { color: var(--plan-pro); }
.bill-comparison-table tbody tr:nth-child(2) td:nth-child(5) { color: var(--plan-plus); }
.bill-comparison-table tbody tr:nth-child(2) td:nth-child(6) { color: var(--plan-max); }
.topup-pack:nth-child(1) .t-cr { color: var(--plan-explorer); }
.topup-pack:nth-child(2) .t-cr { color: var(--plan-pro); }
.topup-pack:nth-child(3) .t-cr { color: var(--plan-plus); }
.topup-pack:nth-child(4) .t-cr { color: var(--plan-max); }
.bill-card.explorer .bill-btn { animation-delay: -2s; }
.bill-card.pro .bill-btn { animation-delay: -4s; }
.bill-card.plus .bill-btn { animation-delay: -7s; }
.bill-card.max .bill-btn { animation-delay: -10s; }
.bill-note a, .bill-renew-management a { color: #c6d6e5; }
.topup-pack,
.bill-enterprise-card { box-shadow: inset 0 1px 0 rgba(217,230,245,.14), inset 0 0 0 1px rgba(178,191,210,.07); }
.topup-custom-field { background: #121418; border-color: #3c4652; }
.bill-comparison-table .recommended-column {
  border-left-width: 2px;
  border-right-width: 2px;
  border-image: linear-gradient(180deg, #e1edf6, #4f6c86 8%, #5a6471 30%, #c6cfd9 50%, #323c49 70%, #b8c9d8) 1;
}
.compare-ribbon { background: #101317; color: #dde7ef; box-shadow: inset 0 1px 0 #b7c8d8, inset 0 -1px 0 #37434f; }
.bill-comparison-table td strong { color: #c9dbe8; }
.bill-comparison-table .compare-yes { color: var(--included); font-size: 20px; font-weight: 700; line-height: 20px; }
.compare-ribbon { color: var(--plan-plus); }
.bill-comparison-table .compare-no { color: #888f99; }
.bill-faq-item { background: #121418; box-shadow: inset 0 1px 0 rgba(226,237,251,.07); }
@media (prefers-reduced-motion: reduce) {
  .manifest-pricing * { animation: none !important; }
  .bill-btn, .topup-btn, .topup-custom-btn, .compare-subscribe,
  .bill-enterprise-cta, .pricing-open, .bill-cycle button { transition: none; }
}