.vault-page{font-family:var(--font-sans);overflow:clip}.vault-heading{font-family:var(--font-heading)}.vault-mesh{background:radial-gradient(ellipse at 12% 30%, color-mix(in srgb, var(--primary) 25%, transparent), transparent 54%), radial-gradient(ellipse at 90% 25%, color-mix(in srgb, var(--success) 13%, transparent), transparent 47%), radial-gradient(ellipse at 65% 95%, color-mix(in srgb, var(--warning) 12%, transparent), transparent 52%), var(--background);background-size:120% 120%;animation:8s ease-in-out infinite alternate vault-mesh-shift}.vault-grid{background-image:linear-gradient(color-mix(in srgb, var(--primary) 9%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--primary) 9%, transparent) 1px, transparent 1px);mask-image:radial-gradient(ellipse, var(--foreground), transparent 72%);background-size:64px 64px}.vault-gradient-text{background:linear-gradient(110deg, var(--primary) 15%, var(--chart-4) 57%, var(--warning) 100%);color:#0000;-webkit-background-clip:text;background-clip:text}.vault-cta{--pulse-x:50%;--pulse-y:50%;isolation:isolate;border:2px solid var(--warning);background:linear-gradient(115deg, var(--primary), var(--chart-1));color:var(--primary-foreground);box-shadow:0 0 20px color-mix(in srgb, var(--primary) 22%, transparent);transition:transform .3s ease-out,box-shadow .3s ease-out;position:relative;overflow:hidden}.vault-cta:before{content:"";pointer-events:none;z-index:-1;width:300px;height:300px;left:var(--pulse-x);top:var(--pulse-y);background:radial-gradient(circle, var(--success), transparent 70%);transition:transform .3s ease-out;position:absolute;transform:translate(-50%,-50%)scale(0)}.vault-cta:hover:before,.vault-cta:focus-visible:before{transform:translate(-50%,-50%)scale(2)}.vault-cta:hover{box-shadow:0 0 32px color-mix(in srgb, var(--warning) 25%, transparent);transform:translateY(-2px)}.vault-frame{--frame-color:var(--primary);border:2px solid color-mix(in srgb, var(--frame-color) 55%, var(--border));background:color-mix(in srgb, var(--card) 92%, transparent);box-shadow:0 0 16px color-mix(in srgb, var(--frame-color) 6%, transparent);transition:transform .25s,border-color .25s,box-shadow .25s}.vault-frame[data-tone=amber]{--frame-color:var(--warning)}.vault-frame[data-tone=emerald]{--frame-color:var(--success)}.vault-feature:hover,.vault-feature:focus-within{border-color:var(--frame-color);box-shadow:0 0 24px color-mix(in srgb, var(--frame-color) 19%, transparent);transform:translateY(-4px)rotate(-.6deg)}.vault-link{transition:color .2s;position:relative}.vault-link:after{content:"";background:var(--success);transform-origin:0;height:2px;transition:transform .2s;position:absolute;bottom:-4px;left:0;right:0;transform:scaleX(0)}.vault-link:hover:after,.vault-link:focus-visible:after{transform:scaleX(1)}.vault-link:hover{color:var(--foreground)}.vault-hardware{background:linear-gradient(155deg, var(--muted), var(--card) 55%, var(--background));border:2px solid var(--border);box-shadow:var(--shadow-lg), 0 0 90px color-mix(in srgb, var(--primary) 20%, transparent);transform:rotate(-8deg)}.vault-screen{background:linear-gradient(145deg, var(--success-muted), var(--card));border:1px solid var(--success-border)}.vault-banner{background:linear-gradient(120deg, var(--secondary), color-mix(in srgb, var(--warning-muted) 65%, var(--card)))}@keyframes vault-mesh-shift{0%{background-position:0 20%}to{background-position:65% 80%}}@media (prefers-reduced-motion:reduce){.vault-mesh{animation:none}.vault-page *,.vault-page :before,.vault-page :after,.vault-cta,.vault-cta:before,.vault-link,.vault-link:after{transition:none!important;animation:none!important}.vault-feature:hover,.vault-feature:focus-within,.vault-cta:hover{transform:none}}
