.about{width:100%;container:about/inline-size}.about__title,.about-card--cover .about-card__title{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.about__grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;max-width:1580px;margin:0 auto;padding:0;list-style:none;display:grid}.about-item{min-width:0;position:relative;container-type:inline-size}.about-item:has(:hover,:focus-visible){z-index:2}.about-card{aspect-ratio:2/3;perspective:1000px;-webkit-tap-highlight-color:transparent;border-radius:12px;display:block;position:relative}.about-card:focus-visible{outline:2px solid var(--sakura-500);outline-offset:4px}.about-card__face{border-radius:inherit;transform-style:preserve-3d;transition:transform .42s cubic-bezier(.2,.75,.25,1),box-shadow .3s;position:absolute;inset:0;transform:rotateX(0)rotateY(0);box-shadow:0 14px 26px -16px #080e1e99}.about-card__art{border-radius:inherit;background:radial-gradient(120% 70% at 10% 0%, color-mix(in oklab, var(--card-accent) 55%, #fff) 0%, transparent 60%), linear-gradient(165deg, var(--card-accent) 20%, color-mix(in oklab, var(--card-accent) 45%, #060a14) 100%);position:absolute;inset:0;overflow:hidden}.about-card:not(.about-card--cover) .about-card__art:before{content:"";aspect-ratio:1;opacity:.1;width:120%;-webkit-mask:var(--logo) center / contain no-repeat;mask:var(--logo) center / contain no-repeat;background:#fff;position:absolute;bottom:-10%;right:-42%;transform:rotate(-14deg)}.about-card__art:after{content:"";border-radius:inherit;background:linear-gradient(#ffffff29,#0000 28%),linear-gradient(#0000 58%,#04081266);position:absolute;inset:0;box-shadow:inset 0 0 0 1px #ffffff29}.about-card--cover .about-card__art:after{background:linear-gradient(#ffffff1f,#0000 28%)}.about-card__art img{object-fit:cover;width:100%;height:100%;display:block}.about-card__logo{aspect-ratio:1;filter:drop-shadow(0 10px 18px #00000038);width:46%;position:absolute;top:41%;left:50%;transform:translateZ(40px)}.about-card__logo:before{content:"";-webkit-mask:var(--logo) center / contain no-repeat;mask:var(--logo) center / contain no-repeat;background:#fff;position:absolute;inset:0}.about-card__title{color:#fff;letter-spacing:.02em;text-align:center;text-overflow:ellipsis;text-shadow:0 2px 14px #0000004d;white-space:nowrap;margin:0;padding-inline:8%;font-size:clamp(15px,10.5cqi,40px);font-weight:800;line-height:1.25;position:absolute;bottom:9%;left:0;right:0;overflow:hidden;transform:translateZ(28px)}.about-card__glare{border-radius:inherit;background-image:radial-gradient(ellipse 90% 65% at var(--pointer-x,50%) var(--pointer-y,0%), #fff6, #ffffff1a 45%, transparent 75%), linear-gradient(110deg, transparent 38%, #ffffff3d 47%, #ffffff0f 53%, transparent 62%);background-position:0 0, var(--pointer-x,50%) 0;opacity:0;pointer-events:none;background-size:100% 100%,280% 100%;transition:opacity .3s;position:absolute;inset:0;transform:translateZ(1px)}.about-card:is(:hover,:focus-visible) .about-card__face{box-shadow:0 30px 44px -20px #080e1ea6}.about-card:is(:hover,:focus-visible) .about-card__glare{opacity:1}.about-qq{border:1px solid var(--card-border);background:var(--bubble-solid);width:min(300px,100vw - 36px);max-height:calc(100dvh - 40px);backdrop-filter:var(--glass-blur);color:var(--ink-500);text-align:center;border-radius:16px;padding:28px 28px 18px;box-shadow:0 30px 60px -20px #28141e59}.about-qq::backdrop{backdrop-filter:blur(6px);background:#28141e66}.about-qq__close{background:var(--surface-soft);width:28px;height:28px;color:var(--ink-500);cursor:pointer;border:0;border-radius:50%;font-size:12px;position:absolute;top:10px;right:10px}.about-qq__close:hover{background:var(--sakura-100);color:var(--sakura-700)}.about-qq h2{color:var(--ink-900);margin:0 0 14px;font-size:15px}.about-qq__image{border:1px solid var(--border-soft);object-fit:contain;background:#fff;border-radius:12px;width:200px;height:200px;margin:0 auto 12px;padding:10px;display:block}.about-qq__number{margin:0;font-size:13px}.about-qq__number strong{color:var(--ink-900);font-family:var(--font-mono);user-select:all;margin-left:6px}.about-qq>a{color:var(--sakura-500);padding-block:8px;font-size:12px;display:inline-block}.about-qq a:focus-visible,.about-qq button:focus-visible{outline:2px solid var(--sakura-500);outline-offset:3px}@media (prefers-reduced-motion:no-preference){.about-item{animation:rise-in .5s var(--ease-sakura) backwards;animation-delay:calc(var(--i,0) * 50ms)}.about-card:is(:hover,:focus-visible) .about-card__face{transform:translateY(-6px)scale(1.03)}.about-qq[open]{animation:.25s cubic-bezier(.2,.8,.2,1) both qq-pop}}@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.about-card.is-tilting .about-card__face{transform:translateY(-8px) rotateX(var(--rotate-x,0deg)) rotateY(var(--rotate-y,0deg)) scale(1.04);will-change:transform;transition:transform .13s ease-out,box-shadow .3s}}@container about (width<=760px){.about__grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}}@container about (width<=520px){.about__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}}@media (width<=860px){.about{padding-left:22px}}@media (prefers-reduced-motion:reduce){.about *,.about :before,.about :after{transition:none!important}}
