.hexagon-wrapper{display:block;width:100%;filter:drop-shadow(0px 4px 12px rgba(0,0,0,.06));transition:filter .3s ease,transform .3s ease;will-change:transform,filter}@media(hover:hover)and (pointer:fine){.hexagon-wrapper:hover{filter:drop-shadow(0px 8px 20px rgba(245,67,135,.18));transform:translateY(-4px)}}.hexagon{width:100%;max-width:360px;min-height:270px;background:#fff;border-radius:24px;box-shadow:4px 4px 29px #00000012;cursor:pointer}@media(min-width:768px){.hexagon{width:360px;min-height:280px}}.hexagon-content{width:100%;height:100%;display:flex;flex-direction:column;justify-content:space-between;text-align:right;padding:20px;box-sizing:border-box}.hh{--hh-ease: cubic-bezier(.16, 1, .3, 1);position:relative;padding:76px 16px 8px;text-align:center;background:#fff}.hh-inner{position:relative;z-index:1;max-width:760px;margin-inline:auto;display:grid;justify-items:center}.hh-title{margin:0;font-weight:700;font-size:32px;line-height:1.2;color:#040035;text-wrap:balance}.hh-title .grad{font-weight:900;background:linear-gradient(270deg,#f54387,#41aef7);-webkit-background-clip:text;background-clip:text;color:transparent}.hh-label{margin-bottom:8px}.hh-town{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;overflow:hidden;pointer-events:none;opacity:0;transition:opacity .3s var(--hh-ease)}.hh-town.on{opacity:1}.hh-town canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.hh-deck{position:relative;width:100%;height:112px;margin-top:4px;pointer-events:none}.hh-card{--a: 0deg;--k: 1;--y: 0px;--s: 1;--sp: 1;--z: .5;position:absolute;left:50%;bottom:0;transform:translate(-50%) rotate(calc(var(--a) * var(--k) * var(--sp))) translateY(var(--y)) scale(var(--s));transform-origin:50% 190%;transition:transform .28s var(--hh-ease),opacity .28s var(--hh-ease),filter .28s var(--hh-ease)}.hh-card.s-on{--k: .45;--y: -28px;--s: 1.08;z-index:20}.hh-card.s-maybe{--k: .8;--y: -12px;z-index:15}.hh-card.s-off{--y: 24px;--s: .92;opacity:.32;filter:grayscale(1)}.hh-card.pv-on,.hh-card.pv-maybe{--k: .6;--y: -20px;--s: 1.04;z-index:25}.hh-card.pv-off{opacity:.45}.hh-tag{position:absolute;top:-11px;left:50%;z-index:2;white-space:nowrap;font-size:11px;font-weight:700;border-radius:999px;padding:3px 9px;background:#f54387;color:#fff;opacity:0;transform:translate(-50%) translateY(4px);transition:opacity .2s var(--hh-ease),transform .2s var(--hh-ease)}.hh-card.s-maybe .hh-tag{background:#fff;color:#e91e8c;box-shadow:inset 0 0 0 1px #f54387}.hh-card.s-on .hh-tag,.hh-card.s-maybe .hh-tag{opacity:1;transform:translate(-50%)}.hh-mini{position:relative;width:calc(120px * var(--z));height:calc(160px * var(--z))}.hh-doc{position:absolute;top:0;right:0;width:120px;height:160px;transform:scale(var(--z));transform-origin:top right;background:#fff;border:1px solid #e9e4ec;border-radius:10px;padding:9px 9px 8px;display:flex;flex-direction:column;gap:5px;overflow:hidden;text-align:right;box-shadow:0 1px #0000000a,0 6px 16px -8px #04003526;transition:box-shadow .28s var(--hh-ease),border-color .2s var(--hh-ease)}.hh-card.s-on .hh-doc{border-color:#f54387;box-shadow:0 0 0 2px #f54387,0 18px 30px -12px #f5438799}.hh-card.s-maybe .hh-doc{border-color:#f54387;border-style:dashed}.hh-card.pv-on .hh-doc,.hh-card.pv-maybe .hh-doc{box-shadow:0 0 0 2px #f54387}.hh-pop{animation:hh-pop .28s var(--hh-ease)}@keyframes hh-pop{0%{transform:scale(.96)}60%{transform:scale(1.04)}to{transform:scale(1)}}.hh-doc .dt{font-size:10px;font-weight:800;line-height:1.2;color:#040035;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hh-doc .ds{font-size:7.5px;color:#676176;line-height:1.2;white-space:nowrap;overflow:hidden}.hh-doc .hr{height:1px;background:#e9e4ec}.hh-doc .row{display:flex;justify-content:space-between;align-items:center;gap:4px;font-size:7px;color:#676176;line-height:1}.hh-doc .row i,.hh-doc .ln{display:block;height:4px;border-radius:2px;background:#e4dee8}.hh-doc .ln.s{width:55%}.hh-doc .ln.m{width:78%}.hh-doc .ln.l{width:100%}.hh-doc .hl{background:#fdf1f7;border-radius:3px;padding:2px 3px;margin-inline:-3px}.hh-doc .hl i{background:#f54387;opacity:.5}.hh-doc .box{display:flex;align-items:center;gap:4px;font-size:7px;color:#676176}.hh-doc .box:before{content:"";width:6px;height:6px;border:1px solid #6b6b6b;border-radius:2px;flex:none}.hh-doc .box.x:before{background:#f54387;border-color:#f54387}.hh-doc .code{height:14px;margin-top:auto;border-radius:1px;opacity:.75;background:repeating-linear-gradient(90deg,#040035 0 1px,transparent 1px 3px,#040035 3px 5px,transparent 5px 6px)}.hh-doc .stamp{position:absolute;left:8px;bottom:10px;border:1.5px solid #f54387;color:#f54387;font-size:7px;font-weight:800;padding:2px 4px;border-radius:4px;transform:rotate(-12deg)}.hh-doc .sig{margin-top:auto;height:12px;width:50%;border-bottom:1px solid #6b6b6b}.hh-doc .bolt{position:absolute;left:8px;top:8px;width:12px;height:12px;background:#f54387;clip-path:polygon(55% 0,10% 58%,45% 58%,35% 100%,90% 38%,55% 38%)}.hh-quiz{position:relative;z-index:30;width:100%;margin-top:-6px;text-align:right}.hh-step.enter{animation:hh-in .24s var(--hh-ease) both}@keyframes hh-in{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:none}}.hh-bar{height:4px;border-radius:4px;background:#f3f4f6;overflow:hidden}.hh-bar i{display:block;height:100%;border-radius:4px;background:#f54387;transform-origin:right;transition:transform .28s var(--hh-ease)}.hh-found{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;min-height:26px;margin-top:12px}.hh-found span{font-size:12px;font-weight:700;background:#fdf1f7;color:#e91e8c;border-radius:999px;padding:4px 10px;animation:hh-in .24s var(--hh-ease) both}@media(min-width:768px){.hh{padding:40px 32px 16px}.hh-title{font-size:48px}.hh-deck{height:236px;max-width:900px;margin-top:4px}.hh-card{--z: 1.08;--sp: 1.7;transform-origin:50% 330%}.hh-card.s-on{--y: -44px}.hh-quiz{max-width:620px;margin-top:-24px}}@media(min-width:1280px){.hh-title{font-size:64px}}@media(prefers-reduced-motion:reduce){.hh-card,.hh-doc,.hh-tag,.hh-bar i,.hh-town{transition-duration:.12s}.hh-pop,.hh-step.enter,.hh-found span{animation:none}}