.hud-frame.svelte-1x8fqre{--chamfer:16px;--border-width:1px;--border-color:oklch(71.4% .203 305.504);--chevron-outer-width:10px;--chevron-outer-offset:2px;--chevron-gap:3px;--chevron-inner-width:18px;--chevron-inner-offset:calc(var(--chevron-outer-offset) + var(--chevron-outer-width) + var(--chevron-gap));--diag-to-axis:.707;position:relative;overflow:visible}.hud-frame.variant-default.svelte-1x8fqre{filter:drop-shadow(0 2px 4px oklab(38.1% .100917 -.144194/.15))drop-shadow(0 4px 8px oklab(43.8% .121032 -.181315/.1))}.hud-frame.variant-modal.svelte-1x8fqre{filter:drop-shadow(0 0 12px oklab(62.7% .147802 -.219953/.5))drop-shadow(0 0 24px oklab(71.4% .117894 -.165257/.3))drop-shadow(0 4px 12px oklab(55.8% .153983 -.243379/.2))}.hud-frame.sm.svelte-1x8fqre{--chamfer:10px;--chevron-outer-width:7px;--chevron-outer-offset:1.5px;--chevron-gap:2px;--chevron-inner-width:12px}.hud-frame.lg.svelte-1x8fqre{--chamfer:22px;--chevron-outer-width:14px;--chevron-outer-offset:3px;--chevron-gap:4px;--chevron-inner-width:24px}.dark .hud-frame.svelte-1x8fqre{--border-color:oklch(70.2% .183 293.541)}.dark .hud-frame.variant-default.svelte-1x8fqre{filter:drop-shadow(0 2px 4px oklab(28.3% .0507343 -.131556/.3))drop-shadow(0 4px 8px oklab(0% none none/.2))}.dark .hud-frame.variant-modal.svelte-1x8fqre{filter:drop-shadow(0 0 15px oklab(60.6% .096545 -.230606/.5))drop-shadow(0 0 30px oklab(70.2% .0730911 -.16777/.25))}.hud-frame.svelte-1x8fqre:before{content:"";pointer-events:none;inset:calc(var(--border-width)*-1);background:var(--border-color);clip-path:polygon(var(--chamfer)0,calc(100% - var(--chamfer))0,100% var(--chamfer),100% calc(100% - var(--chamfer)),calc(100% - var(--chamfer))100%,var(--chamfer)100%,0 calc(100% - var(--chamfer)),0 var(--chamfer));position:absolute}.dark .hud-frame.variant-modal.svelte-1x8fqre:before{filter:drop-shadow(0 0 6px oklch(70.2% .183 293.541))drop-shadow(0 0 12px oklab(70.2% .0730911 -.16777/.5))}.chevron.svelte-1x8fqre{pointer-events:none;width:var(--chevron-outer-width);transform-origin:0%;background:linear-gradient(90deg,#bf7eff80,#bf7eff 50% 100%);background:linear-gradient(90deg,color(xyz 0.483 0.331 1.042 / 0.502),color(xyz 0.483 0.331 1.042) 50% 100%);border-radius:.5px;height:1px;position:absolute;transform:rotate(45deg)}.dark .chevron.svelte-1x8fqre{background:linear-gradient(90deg,#a686ff99,#a686ff 40% 100%);background:linear-gradient(90deg,color(xyz 0.43 0.322 1.031 / 0.6),color(xyz 0.43 0.322 1.031) 40% 100%)}.dark .hud-frame.variant-modal.svelte-1x8fqre .chevron:where(.svelte-1x8fqre){box-shadow:0 0 4px #a686ffcc;box-shadow:0 0 4px oklab(70.2% .0730911 -.16777/.8)}.chevron--tl.svelte-1x8fqre{top:calc(var(--chevron-outer-offset)*var(--diag-to-axis));left:calc(var(--chevron-outer-offset)*var(--diag-to-axis)*-1);transform:rotate(-45deg)}.chevron--tr.svelte-1x8fqre{top:calc(var(--chevron-outer-offset)*var(--diag-to-axis));right:calc(var(--chevron-outer-offset)*var(--diag-to-axis)*-1)}.chevron--bl.svelte-1x8fqre{bottom:calc(var(--chevron-outer-offset)*var(--diag-to-axis));left:calc(var(--chevron-outer-offset)*var(--diag-to-axis)*-1)}.chevron--br.svelte-1x8fqre{bottom:calc(var(--chevron-outer-offset)*var(--diag-to-axis));right:calc(var(--chevron-outer-offset)*var(--diag-to-axis)*-1);transform:rotate(-45deg)}.chevron-inner.svelte-1x8fqre{pointer-events:none;width:var(--chevron-inner-width);transform-origin:0%;background:#bf7eff;background:oklch(71.4% .203 305.504);border-radius:1px;height:1.5px;position:absolute;transform:rotate(45deg)}.dark .chevron-inner.svelte-1x8fqre{background:#a686ff;background:oklch(70.2% .183 293.541)}.dark .hud-frame.variant-modal.svelte-1x8fqre .chevron-inner:where(.svelte-1x8fqre){box-shadow:0 0 6px #a686ffcc;box-shadow:0 0 6px oklab(70.2% .0730911 -.16777/.8)}.chevron-inner--tl.svelte-1x8fqre{top:calc(var(--chevron-inner-offset)*var(--diag-to-axis));left:calc(var(--chevron-inner-offset)*var(--diag-to-axis)*-1);transform:rotate(-45deg)}.chevron-inner--tr.svelte-1x8fqre{top:calc(var(--chevron-inner-offset)*var(--diag-to-axis));right:calc(var(--chevron-inner-offset)*var(--diag-to-axis)*-1)}.chevron-inner--bl.svelte-1x8fqre{bottom:calc(var(--chevron-inner-offset)*var(--diag-to-axis));left:calc(var(--chevron-inner-offset)*var(--diag-to-axis)*-1)}.chevron-inner--br.svelte-1x8fqre{bottom:calc(var(--chevron-inner-offset)*var(--diag-to-axis));right:calc(var(--chevron-inner-offset)*var(--diag-to-axis)*-1);transform:rotate(-45deg)}.hud-panel.svelte-1x8fqre{background-color:var(--color-white,#fff);clip-path:polygon(var(--chamfer)0,calc(100% - var(--chamfer))0,100% var(--chamfer),100% calc(100% - var(--chamfer)),calc(100% - var(--chamfer))100%,var(--chamfer)100%,0 calc(100% - var(--chamfer)),0 var(--chamfer));position:relative;overflow:hidden}.dark .hud-panel.svelte-1x8fqre{background-color:var(--color-gray-900,oklch(21% .034 264.665))}.hud-panel.svelte-1x8fqre:after{content:"";pointer-events:none;inset:calc(var(--spacing,.25rem)*0);z-index:10;opacity:.4;background:repeating-linear-gradient(0deg,#0000,#0000 2px,#805ad508 2px 4px);position:absolute}.dark .hud-panel.svelte-1x8fqre:after{opacity:.5;background:repeating-linear-gradient(0deg,#0000,#0000 2px,#0000001a 2px 4px)}.hud-titlebar.svelte-1x8fqre{padding-block:calc(var(--spacing,.25rem)*2);padding-left:calc(var(--chamfer) + 8px);padding-right:calc(var(--chamfer) + 8px);color:#8200d9;color:oklch(49.6% .265 301.924);background:linear-gradient(135deg,#f3e8ff,#faf5ff);border-bottom:1px solid oklch(90.2% .063 306.703);justify-content:center;align-items:center;display:flex}.dark .hud-titlebar.svelte-1x8fqre{color:#c4b4ff;color:oklch(81.1% .111 293.571);background:linear-gradient(135deg,#4d179a99,#2f0d6866);border-bottom:1px solid oklab(49.1% .103677 -.249301/.5)}.hud-content.svelte-1x8fqre{padding-inline:calc(var(--spacing,.25rem)*2);padding-top:calc(var(--spacing,.25rem)*4);padding-bottom:calc(var(--spacing,.25rem)*4)}@media(min-width:40rem){.hud-content.svelte-1x8fqre{padding-inline:calc(var(--spacing,.25rem)*6);padding-top:calc(var(--spacing,.25rem)*6);padding-bottom:calc(var(--spacing,.25rem)*2)}}