.hv2x-mock{max-width:340px;border-radius:var(--r-md);border:1.5px solid var(--card-border);background:radial-gradient(120% 130% at 78% -12%,color-mix(in srgb,var(--brand-primary) 11%,transparent) 0%,transparent 60%),var(--panel-bg);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand-light) 8%,transparent),0 12px 30px -20px color-mix(in srgb,var(--brand-primary) 65%,transparent);overflow:hidden}.hv2x-mock-bar{direction:ltr;display:flex;align-items:center;gap:10px;padding:8px 12px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--brand-light) 6%,transparent)}.hv2x-mock-dots{display:inline-flex;gap:5px;flex:none}.hv2x-mock-dot{width:8px;height:8px;border-radius:50%;background:color-mix(in srgb,var(--brand-light) 55%,transparent)}.hv2x-mock-dot:nth-child(2){background:color-mix(in srgb,var(--brand-blue) 62%,transparent)}.hv2x-mock-dot:nth-child(3){background:var(--glass-highlight)}.hv2x-mock-url{flex:1;height:10px;border-radius:999px;background:var(--glass-bg);box-shadow:inset 0 0 0 1px var(--glass-border)}.hv2x-mock-body{display:flex;flex-direction:column;align-items:stretch;gap:5px;padding:14px}.hv2x-mock-step{padding:9px 12px;border-radius:var(--r-sm);border:1px solid color-mix(in srgb,var(--brand-light) 26%,var(--line-strong));background:color-mix(in srgb,var(--brand-primary) 8%,transparent);font-family:var(--hv2-font-text);font-size:var(--t-small);font-weight:600;line-height:1.4;color:var(--page-fg);text-align:start;overflow-wrap:anywhere}.hv2x-mock-arrow{display:flex;align-items:center;justify-content:center;color:var(--brand-light);opacity:.68}@media(prefers-reduced-motion:no-preference){.hv2x-mock-step,.hv2x-mock-arrow{animation:hv2x-mock-in .45s var(--ease) both;animation-delay:calc(var(--si, 0) * 55ms)}}@keyframes hv2x-mock-in{0%{transform:translateY(7px)}to{transform:translateY(0)}}.hv2x-mock-nav{display:flex;align-items:center;gap:8px;padding:7px 12px;border-bottom:1px solid var(--line)}.hv2x-mock-nav-logo{flex:none;width:22px;height:8px;border-radius:999px;background:color-mix(in srgb,var(--brand-light) 55%,transparent)}.hv2x-mock-nav-items{display:inline-flex;gap:6px;margin-inline-start:auto}.hv2x-mock-nav-items span{width:22px;height:6px;border-radius:999px;background:var(--glass-border)}.hv2x-mock-fan{--card-h: 58px;--step-y: 34px;--step-x: 10px;position:relative;height:calc(var(--card-h) + (var(--pn, 5) - 1) * var(--step-y));margin:14px 16px 16px}.hv2x-mock-page{position:absolute;top:calc(var(--pi) * var(--step-y));inset-inline-start:calc(var(--pi) * var(--step-x));inset-inline-end:calc((var(--pn, 5) - 1 - var(--pi)) * var(--step-x));height:var(--card-h);z-index:calc(var(--pi) + 1);display:flex;flex-direction:column;gap:6px;padding:9px 12px;border-radius:var(--r-sm);border:1px solid color-mix(in srgb,var(--brand-light) 24%,var(--line-strong));background:color-mix(in srgb,var(--brand-primary) 10%,var(--card-bg));box-shadow:0 6px 16px -10px #0009}.hv2x-mock-page[data-front=true]{border-color:var(--brand-light);background:color-mix(in srgb,var(--brand-primary) 18%,var(--card-bg))}.hv2x-mock-page-label{font-family:var(--hv2-font-text);font-size:var(--t-small);font-weight:600;line-height:1.2;color:var(--page-fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hv2x-mock-page-line{height:4px;width:62%;border-radius:999px;background:var(--glass-border)}@media(prefers-reduced-motion:no-preference){.hv2x-mock-page{animation:hv2x-mock-in .45s var(--ease) both;animation-delay:calc(var(--pi, 0) * 60ms)}}.hv2x-mock[data-compact=true]{max-width:300px}.hv2x-mock[data-compact=true] .hv2x-mock-body{gap:4px;padding:11px}.hv2x-mock[data-compact=true] .hv2x-mock-step{padding:7px 10px;font-size:var(--t-micro)}.hv2x-mock[data-compact=true] .hv2x-mock-nav{padding:6px 11px}.hv2x-mock[data-compact=true] .hv2x-mock-fan{--card-h: 48px;--step-y: 28px;margin:11px 13px 13px}.hv2x-mock[data-compact=true] .hv2x-mock-page{padding:7px 10px;gap:4px}.hv2x-mock[data-compact=true] .hv2x-mock-page-label{font-size:var(--t-micro)}