.fox-honeycomb-frame{width:100%;container-type:inline-size}.fox-honeycomb{--fox-hex-gap:6px;--fox-hex-fill:calc((100vw - 32px - 2 * var(--fox-hex-gap)) / 3);--fox-hex-w:clamp(min(132px, var(--fox-hex-fill)), min(var(--fox-hex-fill), calc((100dvh - 210px) / 2.89)), 196px);--fox-hex-h:calc(var(--fox-hex-w) * 1.1547);--fox-hex-step-x:calc(var(--fox-hex-w) + var(--fox-hex-gap));--fox-hex-step-y:calc(var(--fox-hex-step-x) * .866);width:calc(3 * var(--fox-hex-w) + 2 * var(--fox-hex-gap));height:calc(2 * var(--fox-hex-step-y) + var(--fox-hex-h));margin:0 auto;position:relative}@supports (width:1cqi){.fox-honeycomb{--fox-hex-fill:calc((100cqi - 2 * var(--fox-hex-gap)) / 3)}}.fox-hex-cell{left:calc(50% + var(--x) * var(--fox-hex-step-x) - var(--fox-hex-w) / 2);top:calc(var(--row) * var(--fox-hex-step-y));width:var(--fox-hex-w);height:var(--fox-hex-h);list-style:none;position:absolute}.fox-hex-tile{--fox-tile-edge:color-mix(in oklab, var(--tile) 48%, var(--fox-line-hairline));--fox-tile-fill:color-mix(in oklab, var(--tile) 14%, var(--fox-bg-surface1));--fox-tile-border:1px;--fox-tile-lift:0px;color:var(--fox-text-primary);-webkit-tap-highlight-color:transparent;clip-path:polygon(50% -4px,100% calc(25% - 4px),100% 75%,50% 100%,0 75%,0 calc(25% - 4px));outline:none;display:block;position:absolute;inset:0;container-type:inline-size}.fox-hex-tile:hover{--fox-tile-edge:color-mix(in oklab, var(--tile) 78%, var(--fox-text-primary));--fox-tile-fill:color-mix(in oklab, var(--tile) 20%, var(--fox-bg-surface1));--fox-tile-lift:-3px}.fox-hex-tile:focus-visible{--fox-tile-edge:var(--fox-focus-ring);--fox-tile-fill:color-mix(in oklab, var(--tile) 20%, var(--fox-bg-surface1));--fox-tile-border:2.5px;--fox-tile-lift:-3px}.fox-hex-face{transform:translateY(var(--fox-tile-lift));transition:transform .16s var(--stm-ease-standard);position:absolute;inset:0}.fox-hex-edge,.fox-hex-fill{clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);transition:background-color .16s var(--stm-ease-standard);position:absolute}.fox-hex-edge{background:var(--fox-tile-edge);inset:0}.fox-hex-fill{inset:calc(var(--fox-tile-border) * 1.1547) var(--fox-tile-border);background:var(--fox-tile-fill)}.fox-hex-body{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:3px;padding:0 13%;display:flex;position:absolute;inset:0}.fox-hex-icon{width:24px;height:24px;color:color-mix(in oklab, var(--tile) 82%, var(--fox-text-primary));flex:none;margin-bottom:2px}.fox-hex-title{max-width:100%;font-family:var(--font-display);letter-spacing:.02em;color:color-mix(in oklab, var(--tile) 22%, var(--fox-text-primary));font-size:clamp(14px,11cqi,19px);font-weight:600;line-height:1.15}.fox-hex-line{text-wrap:balance;max-width:100%;color:var(--fox-text-secondary);-webkit-line-clamp:3;line-clamp:3;overflow-wrap:anywhere;-webkit-box-orient:vertical;font-size:clamp(11px,8.2cqi,13.5px);line-height:1.3;display:-webkit-box;overflow:hidden}.fox-hex-line[data-single]{white-space:nowrap;text-overflow:ellipsis;display:block}@media not (min-width:520px){.fox-hex-body{padding:0 6%}.fox-hex-line,.fox-hex-line[data-single]{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}}.fox-hex-centre{-webkit-tap-highlight-color:transparent;outline:none;display:block;position:absolute;inset:0}.fox-hex-mark{width:109.89%;transform:translateY(var(--fox-tile-lift,0px));transition:transform .16s var(--stm-ease-standard);position:absolute;top:-2.381%;left:-4.945%}.fox-hex-ring{pointer-events:none;opacity:0;width:calc(100% + 6px);height:calc(100% + 6.93px);transform:translateY(var(--fox-tile-lift,0px));transition:opacity .12s linear, transform .16s var(--stm-ease-standard);position:absolute;inset:-3.46px -3px;overflow:visible}.fox-hex-ring polygon{fill:none;stroke:var(--fox-text-primary);stroke-width:2px;vector-effect:non-scaling-stroke}.fox-hex-centre:hover{--fox-tile-lift:-3px}.fox-hex-centre:active{--fox-tile-lift:0px}.fox-hex-centre:focus-visible .fox-hex-ring{opacity:1}@media (prefers-reduced-motion:reduce){.fox-hex-tile:hover,.fox-hex-tile:focus-visible,.fox-hex-centre:hover{--fox-tile-lift:0px}.fox-hex-face,.fox-hex-edge,.fox-hex-fill,.fox-hex-mark,.fox-hex-ring{transition:none}}@media (forced-colors:active){.fox-hex-edge{forced-color-adjust:none;background:canvastext}.fox-hex-fill{forced-color-adjust:none;background:canvas}.fox-hex-tile:focus-visible .fox-hex-edge{background:highlight}}
