.lf{--lf-gold:#c8a257;--lf-pitch:32px;height:44px;width:calc(var(--lf-pitch) * 6);display:inline-flex}.lf-light{--lf-gold:#7a5c26}.lf-line{pointer-events:none;width:100%;height:20px;position:absolute;inset:0 0 auto;overflow:visible}.lf-line path{fill:none;stroke:var(--lf-gold);stroke-width:1px;opacity:.8}.lf-light .lf-line path{opacity:.55}.lf-row{width:100%;height:100%;display:flex;position:relative}.lf-item{width:var(--lf-pitch);height:100%;position:relative}.lf-btn{cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:999px;position:absolute;inset:0}.lf-btn:focus-visible{outline:1.5px solid var(--lf-gold);outline-offset:1px}.lf-flag{background-position:50%;background-repeat:no-repeat;background-size:cover;transition:transform .45s cubic-bezier(.16,1,.3,1),box-shadow .35s,height .35s;position:absolute;left:50%}.lf-pearl .lf-line{top:10px}.lf-pearl .lf-flag{--c:24px;top:calc(var(--y) - var(--c) / 2);width:var(--c);height:var(--c);margin-left:calc(var(--c) / -2);border-radius:50%;box-shadow:0 0 0 1.25px #c8a257,0 0 0 2.25px #00000059,0 2px 5px #00000073}.lf-pearl .lf-flag:after{content:"";background:linear-gradient(170deg,#ffffff6b 0%,#ffffff1a 42%,#0000 44%);border-radius:50%;position:absolute;inset:0}.lf-pearl .lf-item+.lf-item:before{content:"";left:-3.5px;top:calc(var(--py) - 3.5px);pointer-events:none;background:radial-gradient(circle at 34% 30%,#fff 0 14%,#f3eee4 34%,#d9d0bf 68%,#a99f8b 100%);border-radius:50%;width:7px;height:7px;position:absolute;box-shadow:0 1px 2px #00000073}.lf-pearl .lf-item:first-child{--y:15.7px}.lf-pearl .lf-item:nth-child(2){--y:21px;--py:18.7px}.lf-pearl .lf-item:nth-child(3){--y:23.7px;--py:22.7px}.lf-pearl .lf-item:nth-child(4){--y:23.7px;--py:24px}.lf-pearl .lf-item:nth-child(5){--y:21px;--py:22.7px}.lf-pearl .lf-item:nth-child(6){--y:15.7px;--py:18.7px}.lf-pearl .lf-btn:hover .lf-flag{transform:translateY(-2px)}.lf-pearl .lf-btn[aria-pressed=true] .lf-flag{transform:scale(1.22);box-shadow:0 0 0 1.25px #ddbf7e,0 0 0 2.25px #00000059,0 0 14px #c8a25780,0 2px 6px #00000080}.lf-btn[aria-pressed=true]:after{content:"";left:50%;top:calc(var(--y) + var(--lf-tri));border:3.5px solid #0000;border-top:0;border-bottom:4.5px solid var(--lf-gold);pointer-events:none;margin-left:-3.5px;position:absolute}.lf-pearl .lf-btn{--lf-tri:calc(var(--c,24px) * .61 + 3px)}.lf-pearl .lf-item{--c:24px}.lf-pennant .lf-btn{--lf-tri:calc(var(--fh,22px) + 6px)}.lf-pennant .lf-item{--fh:22px}.lf-pennant .lf-btn{filter:drop-shadow(0 0 .5px #141e3399)drop-shadow(0 2px 2px #00000038)}.lf-pennant .lf-flag{--fw:26px;--fh:22px;top:calc(var(--y) - .5px);width:var(--fw);height:var(--fh);margin-left:calc(var(--fw) / -2);clip-path:polygon(0 0,100% 0,100% 100%,50% 80%,0 100%);transform-origin:50% 0;animation:3.8s ease-in-out infinite alternate lf-sway;animation-delay:calc(var(--i) * -.65s)}.lf-pennant .lf-flag:after{content:"";background:linear-gradient(#00000038 0 1.5px,#0000 1.5px),linear-gradient(100deg,#0000001a 0%,#ffffff29 32%,#00000014 62%,#ffffff1a 88%);position:absolute;inset:0}.lf-pennant .lf-line{top:8px}.lf-pennant .lf-item:first-child{--y:12.7px}.lf-pennant .lf-item:nth-child(2){--y:15.1px}.lf-pennant .lf-item:nth-child(3),.lf-pennant .lf-item:nth-child(4){--y:16.4px}.lf-pennant .lf-item:nth-child(5){--y:15.1px}.lf-pennant .lf-item:nth-child(6){--y:12.7px}.lf-pennant .lf-btn[aria-pressed=true] .lf-flag{height:calc(var(--fh) + 4px)}@keyframes lf-sway{0%{transform:rotate(-3.5deg)}to{transform:rotate(3.5deg)}}@media (max-width:639.98px){.lf{--lf-pitch:clamp(18px, calc((100vw - 250px - clamp(0px, 56.3vw - 203px, 27px)) / 6), 26px)}.lf-pearl .lf-flag,.lf-pearl .lf-item{--c:calc(var(--lf-pitch) * .76)}.lf-pearl .lf-item+.lf-item:before{left:-2.5px;top:calc(var(--py) - 2.5px);width:5px;height:5px}.lf-pennant .lf-flag{--fw:calc(var(--lf-pitch) * .82);--fh:calc(var(--lf-pitch) * .7)}.lf-pennant .lf-item{--fh:calc(var(--lf-pitch) * .7)}}@media (prefers-reduced-motion:reduce){.lf-flag{transition:none}.lf-pennant .lf-flag{animation:none}}.lf-flat{width:auto}.lf-flat .lf-row{align-items:center;gap:6px}.lf-flat .lf-item{width:30px}.lf-flat .lf-btn{border-radius:3px}.lf-flat .lf-flag{border-radius:2px;width:24px;height:18px;margin:-9px 0 0 -12px;top:50%;box-shadow:0 0 0 1px #00000047}.lf-flat .lf-btn:hover .lf-flag{transform:translateY(-1px)}.lf-flat .lf-btn[aria-pressed=true] .lf-flag{box-shadow:0 0 0 1.5px var(--lf-gold), 0 0 0 3px #0000004d}@media (max-width:639px){.lf-flat .lf-row{gap:2px}.lf-flat .lf-item{width:21px}.lf-flat .lf-flag{width:17px;height:13px;margin:-6.5px 0 0 -8.5px}}@property --lf-p{syntax:"<number>";inherits:false;initial-value:0}@keyframes lf-grow{0%{--lf-p:0}to{--lf-p:1}}html.lf-vt::view-transition-old(root){mix-blend-mode:normal;animation:none}html.lf-vt::view-transition-new(root){mix-blend-mode:normal;animation:none}html.lf-vt::view-transition-old(root){--lf-f:140px;z-index:1;-webkit-mask-image:radial-gradient(circle at var(--lf-x) var(--lf-y), transparent calc(var(--lf-p) * (var(--lf-r) + var(--lf-f)) - var(--lf-f)), #000 calc(var(--lf-p) * (var(--lf-r) + var(--lf-f))));-webkit-mask-image:radial-gradient(circle at var(--lf-x) var(--lf-y), transparent calc(var(--lf-p) * (var(--lf-r) + var(--lf-f)) - var(--lf-f)), #000 calc(var(--lf-p) * (var(--lf-r) + var(--lf-f))));mask-image:radial-gradient(circle at var(--lf-x) var(--lf-y), transparent calc(var(--lf-p) * (var(--lf-r) + var(--lf-f)) - var(--lf-f)), #000 calc(var(--lf-p) * (var(--lf-r) + var(--lf-f))));animation:1.2s cubic-bezier(.4,.05,.3,1) both lf-grow}html.lf-vt::view-transition-group(lf-rim){animation:none}html.lf-vt::view-transition-new(lf-rim){animation:none}html.lf-vt::view-transition-group(lf-rim){z-index:2}html.lf-vt::view-transition-old(lf-rim){display:none}.lf-rim{--lf-f:140px;z-index:2147483000;pointer-events:none;view-transition-name:lf-rim;mix-blend-mode:screen;background:radial-gradient(circle at var(--lf-x) var(--lf-y), transparent calc(var(--lf-p) * (var(--lf-r) + var(--lf-f)) - var(--lf-f) * 1.1), #ffe6b938 calc(var(--lf-p) * (var(--lf-r) + var(--lf-f)) - var(--lf-f) * .55), transparent calc(var(--lf-p) * (var(--lf-r) + var(--lf-f))));animation:1.2s cubic-bezier(.4,.05,.3,1) forwards lf-grow;position:fixed;inset:0}.lf-btn[aria-busy=true] .lf-flag{animation:.9s ease-in-out infinite alternate lf-busy}@keyframes lf-busy{to{opacity:.55}}
