.gold-vault-stage, .gold-vault-stage * { box-sizing: border-box; letter-spacing: 0; font-family: Arial, Tahoma, sans-serif; }
.gold-vault-stage { --vault-top: calc(61px + env(safe-area-inset-top, 0px)); position: absolute; top: 0; inset-inline: 0; height: calc(var(--vault-top) + 216px); z-index: 0; opacity: 0; pointer-events: none; overflow: hidden; transition: opacity 340ms ease-out; }
.gold-vault-stage.is-active { opacity: 1; }
.gold-vault-stage { --vault-top: calc(111px + env(safe-area-inset-top, 0px)); }
.gold-vault { position: absolute; top: var(--vault-top); inset-inline: 12px; margin-inline: auto; max-width: 680px; height: 200px; padding: 14px 14px 24px; display: grid; grid-template-columns: minmax(0, 1fr) 132px; gap: 12px; border-radius: 18px; border: 1px solid #e5d9b9; background: linear-gradient(125deg, #fff 10%, #fffdf5 55%, #f8efda 100%); box-shadow: 0 3px 12px #5b4c2520; color: #23392f; text-align: start; transform: scale(.96); transform-origin: top center; transition: transform 340ms ease-out; font-family: Arial, Tahoma, sans-serif; }
.gold-vault { inset-inline: 0; max-width: none; border-radius: 0; border: 0; background: #fff; box-shadow: none; }
.gold-vault__summary { min-width: 0; padding-inline-start: 16px; }
.gold-vault__heading { display: flex; align-items: center; gap: 8px; height: 19px; }
.gold-vault .gold-vault__heading h2 { margin: 0; color: #58491f; font: 700 14px/19px Arial, sans-serif; }
.gold-vault h2::first-letter { font: inherit; color: inherit; }
.gold-vault__heading > span { color: #9b7538; font-size: 9px; }
.gold-vault p { margin: 0; text-align: start; font-family: inherit; }
.gold-vault .gold-vault__label { margin-top: 8px; color: #747467; font-size: 10px; line-height: 15px; }
.gold-vault__reserve { display: flex; align-items: baseline; gap: 5px; height: 31px; white-space: nowrap; }
.gold-vault__reserve strong { font-size: 27px; line-height: 31px; color: #263e32; font-variant-numeric: tabular-nums; }
.gold-vault__reserve > span { font-size: 12px; color: #727c6e; }
.gold-vault .gold-vault__value { font-size: 11px; line-height: 17px; color: #786d4f; }
.gold-vault__price { margin-top: 8px; border-top: 1px solid #e7dfcd; padding-top: 6px; display: flex; flex-direction: column; gap: 3px; }
.gold-vault__price > span { font-size: 9px; line-height: 12px; color: #6f776c; }
.gold-vault__price strong { font-size: 14px; line-height: 18px; color: #24483a; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.gold-vault__journey { min-width: 0; text-align: center; }
.gold-vault__rings { width: 126px; height: 126px; position: relative; margin-inline: auto; }
.gold-vault__rings svg { display: block; width: 100%; height: 100%; overflow: visible; }
.gold-vault__rings circle { fill: none; stroke-width: 5px; }
.gold-vault__track { stroke: #e9dfc6; }
.gold-vault__track--inner { stroke: #dae6de; }
.gold-vault__outer, .gold-vault__inner { stroke-dasharray: 100 100; stroke-dashoffset: 100; stroke-linecap: round; transform: rotate(-90deg); transform-origin: 66px 66px; }
.gold-vault__outer { stroke: url(#vaultMetal); }
.gold-vault__inner { stroke: #23875c; }
.gold-vault__center { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; color: #687765; }
.gold-vault__center > span { font-size: 9px; line-height: 14px; }
.gold-vault__center > strong { font-size: 23px; line-height: 29px; color: #244f3a; font-variant-numeric: tabular-nums; }
.gold-vault__center > small { font-size: 8px; line-height: 12px; }
.gold-vault .gold-vault__milestones { text-align: center; font-size: 9px; line-height: 13px; color: #8c6b29; }
.gold-vault .gold-vault__equivalent { text-align: center; font-size: 8px; line-height: 12px; color: #687765; white-space: nowrap; }
.gold-vault__status { position: absolute; inset-inline: 14px; bottom: 7px; font-size: 10px; line-height: 12px; color: #777968; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gold-vault__sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.gold-vault-hint { position: fixed; inset-inline: 0; top: calc(55px + env(safe-area-inset-top, 0px)); height: 16px; z-index: 2; pointer-events: none; opacity: 0; overflow: hidden; }
.gold-vault-hint { top: calc(47px + env(safe-area-inset-top, 0px)); height: 8px; z-index: 4; }
.gold-vault-available .gold-vault-hint { opacity: 1; }
html.home-page-active .header { border-bottom: 0; box-shadow: none; }
html:not(.gold-vault-available) .gold-vault-hint { display: none; }
.gold-vault-hint__light { display: block; height: 8px; background: radial-gradient(ellipse at 50% 0, #d7b75690, #f4df9a38 40%, transparent 75%); opacity: .4; animation: vault-breathe 4s ease-in-out infinite; }
.gold-vault-hint__sweep { position: absolute; top: 0; left: -30%; width: 25%; height: 4px; background: linear-gradient(90deg, transparent, #ecc65e90, transparent); animation: vault-sweep 10s ease-in-out infinite; }
.gold-vault-hint__chevron { display: none; }
.gold-vault-access { position: fixed; top: calc(56px + env(safe-area-inset-top, 0px)); right: 12px; z-index: 5; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); border: 0; background: #fff; color: #244f3a; }
.gold-vault-access:focus-visible { clip-path: none; width: auto; height: auto; min-height: 44px; padding: 10px 14px; outline: 2px solid #b69545; border-radius: 6px; }
html:not(.gold-vault-available) .gold-vault-access { display: none; }
.gold-vault-open #main, .gold-vault-open .gold-vault-hint { transition: transform 360ms cubic-bezier(.18,.75,.24,1); }
.gold-vault-pulling #main, .gold-vault-pulling .gold-vault, .gold-vault-pulling .gold-vault-hint { transition: none; }
.gold-vault-stage.is-threshold .gold-vault__inner { animation: vault-pulse 340ms ease-out; }
@keyframes vault-breathe { 0%, 100% { opacity: .25; } 50% { opacity: .7; } }
@keyframes vault-sweep { 0%, 70% { transform: translateX(0); opacity: 0; } 75% { opacity: .65; } 98% { transform: translateX(560%); opacity: .4; } 100% { transform: translateX(560%); opacity: 0; } }
@keyframes vault-pulse { 50% { stroke-width: 7px; } }
@media (max-width: 359px) { .gold-vault { grid-template-columns: minmax(0,1fr) 116px; gap: 8px; padding-inline: 12px; } .gold-vault__rings { width: 112px; height: 126px; } .gold-vault__reserve strong { font-size: 23px; } .gold-vault__price strong { font-size: 13px; } }
@media (prefers-reduced-motion: reduce) { .gold-vault-hint *, .gold-vault-stage.is-threshold .gold-vault__inner { animation: none; } .gold-vault-stage, .gold-vault, .gold-vault-open #main, .gold-vault-available #main, .gold-vault-open .gold-vault-hint { transition: none; } }