@charset "UTF-8";

:root { --archive-paper:#f5f3eb; --archive-ink:#111218; --archive-blue:#087bcc; --archive-deep:#034c9a; --archive-cyan:#57d7e8; --archive-line:rgba(17,18,24,.18); --archive-shell:min(calc(100% - 40px),1440px); }
body.portal-archive-site { margin:0; overflow-x:hidden; color:var(--archive-ink); background:var(--archive-paper); font-family:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif; font-size:18px; line-height:1.8; }
body.portal-archive-site *, body.portal-archive-site *::before, body.portal-archive-site *::after { box-sizing:border-box; }
body.portal-archive-site h1, body.portal-archive-site h2, body.portal-archive-site p, body.portal-archive-site figure { margin:0; }
body.portal-archive-site p { margin:clamp(1.75rem,3vw,2.75rem) 0 0; }
body.portal-archive-site a { color:inherit; text-decoration:none; }
body.portal-archive-site img { display:block; max-width:100%; }
body.portal-archive-site .portal-header a, body.portal-archive-site .portal-footer a { color:inherit; }
body.portal-archive-site .portal-header__brand img { width:100%; height:auto; filter:brightness(0) invert(1); }
body.portal-archive-site .portal-header.is-scrolled .portal-header__brand img { filter:none; }
.archive-page { overflow:clip; background:#fbfcf8; }
.archive-shell, .archive-content, body.portal-archive-site .portal-shell { width:var(--archive-shell); margin-inline:auto; }
.archive-label { font:italic 400 .72rem/1.4 Arial,sans-serif; letter-spacing:.16em; text-transform:uppercase; }

.archive-hero { background:radial-gradient(circle at 82% 22%,rgba(87,215,232,.82),transparent 29%),radial-gradient(circle at 18% 82%,rgba(245,163,211,.3),transparent 24%),linear-gradient(145deg,#021d54,#087bcc 58%,#57d7e8); }
.archive-hero--photo { background:radial-gradient(circle at 82% 25%,rgba(255,255,255,.26),transparent 24%),radial-gradient(circle at 18% 80%,rgba(87,215,232,.42),transparent 28%),linear-gradient(145deg,#034c9a,#087bcc 62%,#72dce8); }
.archive-hero::before { content:""; position:absolute; width:70vw; height:18vw; right:-12%; top:36%; border:1px solid rgba(255,255,255,.24); border-radius:50%; transform:rotate(-9deg); }
.archive-hero__noise { position:absolute; inset:-5%; opacity:.12; pointer-events:none; background:url("../img/common/noise.png") repeat; background-size:300px; mix-blend-mode:soft-light; animation:archive-grain .5s steps(2,end) infinite; }
@keyframes archive-grain { 50% { transform:translate3d(1%,-1%,0); } }

.archive-content { position:relative; padding:clamp(5rem,10vw,10rem) 0 clamp(8rem,14vw,14rem); }
.works-archive .archive-content { z-index:0; isolation:isolate; }
.works-archive .archive-content::before { content:""; position:absolute; z-index:-1; inset:0 auto 0 50%; width:100vw; transform:translateX(-50%); pointer-events:none; background:radial-gradient(circle at 88% 6%,rgba(87,215,232,.14),transparent 28%); }
.archive-filter { display:flex; gap:clamp(1.5rem,4vw,4rem); margin-bottom:clamp(4rem,8vw,8rem); padding-bottom:.7rem; overflow-x:auto; scrollbar-width:none; white-space:nowrap; }
.archive-filter::-webkit-scrollbar { display:none; }
.archive-filter a { position:relative; flex:0 0 auto; min-height:44px; font:500 .78rem/44px Arial,sans-serif; letter-spacing:.12em; }
.archive-filter a::after { content:""; position:absolute; left:0; right:100%; bottom:0; height:1px; background:var(--archive-blue); transition:right .25s ease; }
.archive-filter a:hover::after, .archive-filter a:focus-visible::after, .archive-filter a.is-current::after { right:0; }
.archive-filter a.is-current { color:var(--archive-blue); }

.works-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(3rem,6vw,7rem) clamp(1.5rem,4vw,4rem); }
.works-card--large,.works-card--small,.works-card--half { grid-column:auto; }
.works-card a { display:block; }
.works-card__image { position:relative; width:100%; overflow:hidden; background:linear-gradient(135deg,#dff8f7,#87dce8 55%,#087bcc); }
.works-card--large .works-card__image,.works-card--small .works-card__image,.works-card--half .works-card__image { aspect-ratio:4/3; }
.works-card__image.has-image { margin-bottom:5%; }
.works-card__image img { width:100%; height:100%; object-fit:cover; object-position:var(--archive-image-position,center); transition:transform .65s cubic-bezier(.22,.61,.36,1); }
.works-card:hover .works-card__image img { transform:scale(1.025); }
.works-card__meta { margin-bottom:.65rem; font:italic 400 .68rem/1.5 Arial,sans-serif; letter-spacing:.13em; color:var(--archive-blue); }
.works-card__title { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding-bottom:.8rem; border-bottom:1px solid var(--archive-line); font-size:clamp(1rem,1.4vw,1.35rem); font-weight:500; line-height:1.55; }
.works-card__title .link-arrow { flex:0 0 auto;transition:transform .25s ease; }.works-card:hover .works-card__title .link-arrow { transform:translate(3px,-3px); }

.photo-archive { background:radial-gradient(circle at 90% 5%,rgba(106,215,232,.08),transparent 30%),#fbfaf4; }
.photo-content { background:transparent; }
.photo-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(3rem,6vw,7rem) clamp(1.5rem,4vw,4rem); }
.photo-card:nth-child(n) { grid-column:auto; margin-top:0; }
.photo-card { opacity:1; transform:none; }
.photo-card.is-reveal-ready { opacity:0; transform:translateY(30px); transition:opacity .75s ease,transform .75s cubic-bezier(.22,.61,.36,1); }
.photo-card.is-visible { opacity:1; transform:none; }
.photo-card__image { aspect-ratio:4/3; margin:0 0 clamp(1rem,2vw,1.75rem); overflow:hidden; background:#edfaff; }
.photo-card__image img { width:100%; height:100%; object-fit:cover; object-position:var(--archive-image-position,center); }
.photo-card__meta time { display:block; margin-bottom:.5rem; color:var(--archive-blue); font:italic 400 .68rem/1.5 Arial,sans-serif; letter-spacing:.13em; }
.photo-card__meta h2 { font-size:clamp(1rem,1.4vw,1.3rem); font-weight:500; line-height:1.6; }

.archive-pagination { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:.35rem; margin-top:clamp(6rem,10vw,10rem); }
.archive-pagination .page-numbers { display:grid; place-items:center; min-width:44px; min-height:44px; padding:.5rem; border-bottom:1px solid var(--archive-line); font:500 .75rem/1 Arial,sans-serif; letter-spacing:.08em; }
.archive-pagination .current { color:#fff; border-color:var(--archive-blue); background:var(--archive-blue); }.archive-pagination .prev,.archive-pagination .next { padding-inline:1rem; }
.archive-empty { padding:5rem 0; text-align:center; }
.archive-closing { padding:clamp(7rem,12vw,12rem) 0 clamp(9rem,14vw,14rem); color:#fff; background:linear-gradient(180deg,#dff8f7 0,#087bcc 40%,#034c9a 100%); }
.archive-closing--photo { color:var(--archive-ink); background:linear-gradient(180deg,#fbfaf4,#e3f7f6); }
body.portal-archive-site .archive-closing h2 { max-width:18em; margin:1.25rem 0 clamp(2rem,4vw,3.5rem); font-size:clamp(1.7rem,3vw,2.375rem); font-weight:400; line-height:1.55; }
.archive-closing a { display:inline-flex; gap:4rem; min-height:48px; align-items:center; border-bottom:1px solid currentColor; font:600 .78rem/1 Arial,sans-serif; letter-spacing:.12em; }
body.portal-archive-site .portal-footer { color:#fff; background:var(--archive-deep); }
body.portal-archive-site .portal-footer__wave { color:var(--archive-deep); }

.games-archive-heading { position:relative;padding:clamp(8rem,11vw,10rem) 0 clamp(3rem,5vw,4.5rem);overflow:hidden;background:linear-gradient(145deg,#fbfcf8,#eef9f8);border-bottom:1px solid var(--archive-line); }
.games-archive-heading::after { content:"";position:absolute;right:-7%;bottom:-55%;width:38vw;aspect-ratio:1;border:1px solid rgba(8,123,204,.12);border-radius:50%;pointer-events:none; }
.games-archive-heading__inner { position:relative;z-index:1; }
.games-archive-heading .archive-label { margin-bottom:clamp(2.25rem,4vw,3.5rem);color:var(--archive-blue); }
.games-archive-heading h1 { margin:0;font:400 clamp(3.5rem,7vw,90px)/.95 "Fredoka",sans-serif;letter-spacing:.02em; }
.games-archive-heading__description { max-width:34em;margin-top:clamp(2rem,3.5vw,3rem);font-size:clamp(1rem,1.2vw,1.125rem); }
.games-content { width:min(calc(100% - 48px),1440px);padding-top:clamp(3.5rem,6vw,6rem); }
.games-grid { display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(5rem,10vw,9rem); }
.game-card { width:100%;padding-bottom:clamp(3rem,6vw,5rem);border-bottom:1px solid var(--archive-line); }
.game-card__visual-link { display:block; }
.game-card__figure { display:grid;place-items:center;width:100%;aspect-ratio:16/10;margin:0;overflow:hidden;color:#fff;background:linear-gradient(145deg,#034c9a,#57d7e8); }
.game-card__figure img { width:100%;height:100%;object-fit:cover;object-position:var(--game-image-position,center);transition:transform .65s cubic-bezier(.22,.61,.36,1); }.game-card__figure span { font:500 .75rem/1 Arial,sans-serif;letter-spacing:.15em; }
.game-card.has-external-link .game-card__visual-link:hover img,.game-card.has-external-link .game-card__visual-link:focus-visible img { transform:scale(1.025); }
.game-card__body { display:grid;grid-template-columns:minmax(0,1.35fr) minmax(14rem,.65fr);gap:clamp(2rem,6vw,7rem);align-items:start; }
.game-status { color:var(--archive-blue);font:600 .7rem/1.5 Arial,sans-serif;letter-spacing:.14em; }.games-archive .game-status { margin-top:clamp(1.25rem,2.5vw,2.5rem);margin-bottom:.65rem; }
.game-card h2 { font:500 clamp(1.65rem,3vw,2.75rem)/1.2 "Fredoka","Zen Kaku Gothic New",sans-serif;letter-spacing:.035em; }
.game-card__title a { display:inline; }
.game-card__excerpt { max-width:42rem;margin-top:1rem; }.game-card__details { padding-top:clamp(1.25rem,2.5vw,2.5rem); }.game-card__meta { margin:0;font-size:.75rem;letter-spacing:.08em; }
.game-card__cta,.game-single__cta a { display:inline-flex;align-items:center;justify-content:space-between;gap:2rem;min-width:12rem;min-height:44px;margin-top:1.5rem;border-bottom:1px solid currentColor;color:var(--archive-blue);font:600 .72rem/1 Arial,sans-serif;letter-spacing:.12em; }
.game-single__hero { background:radial-gradient(circle at 82% 20%,rgba(245,163,211,.48),transparent 25%),radial-gradient(circle at 15% 82%,rgba(87,215,232,.68),transparent 28%),linear-gradient(145deg,#021d54,#087bcc 58%,#7468a8); }.game-single__hero .game-status { color:#fff; }.game-single__lead { max-width:46rem; }.game-single__facts { display:flex;flex-wrap:wrap;gap:1rem 2.5rem;font:.7rem/1.5 Arial,sans-serif;letter-spacing:.12em; }
.game-single__body { padding:clamp(5rem,9vw,9rem) 0 clamp(9rem,14vw,14rem); }.game-single__main-image { margin-bottom:clamp(4rem,8vw,8rem); }.game-single__main-image img { width:100%; height:auto; }.game-single__content { width:min(100%,860px); margin-inline:auto; }.game-single__content > * + * { margin-top:1.75rem; }.game-single__content img { max-width:100%; height:auto; }
.game-gallery { margin-top:clamp(6rem,10vw,10rem); }.game-gallery h2 { margin:.75rem 0 3rem; font:400 clamp(2rem,4vw,3.5rem)/1 "Fredoka",sans-serif; }.game-gallery__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(1.25rem,3vw,3rem); }.game-gallery figure { margin:0; }.game-gallery img { display:block; width:100%; height:auto; }
.game-single__cta { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:2rem; margin-top:clamp(5rem,9vw,9rem); padding-top:2rem; border-top:1px solid var(--archive-line); }.game-single__cta p { color:var(--archive-blue); font:600 .75rem/1.5 Arial,sans-serif; letter-spacing:.13em; }

.archive-single { background:linear-gradient(180deg,#edfaff,#fbfcf8 34%,#f5f3eb); }
.archive-single__header { background:radial-gradient(circle at 82% 22%,rgba(87,215,232,.72),transparent 30%),linear-gradient(145deg,#021d54,#087bcc 68%,#57d7e8); }
.archive-single__header--photo { background:linear-gradient(145deg,#034c9a,#087bcc 62%,#72dce8); }
.archive-single__header h1 { max-width:18em; margin:1rem 0; font-size:clamp(2rem,5vw,4.75rem); line-height:1.2; overflow-wrap:anywhere; }
.archive-single__terms { font:italic 400 .72rem/1.5 Arial,sans-serif; letter-spacing:.13em; }
.archive-single__body { padding:clamp(5rem,10vw,10rem) 0 clamp(9rem,14vw,14rem); }
.archive-single__lead-image { margin-bottom:clamp(4rem,8vw,8rem); }.archive-single__lead-image img { width:100%; height:auto; }
.archive-single__content { width:min(100%,860px); margin-inline:auto; }.archive-single__content > * + * { margin-top:1.75rem; }.archive-single__content img { width:auto; max-width:100%; height:auto; margin-inline:auto; }
.archive-single__content a { color:var(--archive-blue); text-decoration:underline; text-underline-offset:.2em; }
.archive-single__nav { display:grid; grid-template-columns:1fr auto 1fr; gap:1.5rem; align-items:center; margin-top:clamp(5rem,10vw,9rem); padding-top:2rem; border-top:1px solid var(--archive-line); font-size:.78rem; letter-spacing:.06em; }.archive-single__nav > div:last-child { text-align:right; }.archive-single__nav > a { color:var(--archive-blue); font-weight:700; letter-spacing:.12em; }

@media (max-width:767px) {
	:root { --archive-shell:min(calc(100% - 40px),1440px); }
	body.portal-archive-site { font-size:16.5px; }
	.archive-hero::before { width:130vw; height:42vw; right:-55%; top:42%; }
	.archive-filter { margin-bottom:4rem; }
	.works-grid,.photo-grid { display:block; }
	.works-card,.photo-card,.photo-card:nth-child(n) { margin:0 0 4.5rem; }
	.works-card:last-child,.photo-card:last-child { margin-bottom:0; }
	.works-card--large .works-card__image,.works-card--small .works-card__image,.works-card--half .works-card__image { aspect-ratio:4/3; }
	.works-card__image.has-image { margin-bottom:5vw; }
	.photo-card.is-reveal-ready { transform:translateY(22px); }
	.archive-pagination { gap:.2rem; }.archive-pagination .page-numbers { min-width:40px; min-height:44px; }.archive-pagination .prev,.archive-pagination .next { width:100%; margin:.25rem 25%; }
	.archive-single__nav { grid-template-columns:1fr 1fr; }.archive-single__nav > a { grid-column:1/-1; grid-row:2; justify-self:center; }.archive-single__nav > div { overflow-wrap:anywhere; }
	.games-content { width:min(calc(100% - 40px),1440px);padding-top:3.5rem; }.games-archive-heading { padding:7rem 0 3.5rem; }.games-archive-heading::after { width:70vw;right:-30%; }.games-archive-heading .archive-label { margin-bottom:2rem; }.games-archive-heading h1 { font-size:clamp(3rem,15vw,4.5rem); }.games-grid,.game-gallery__grid { grid-template-columns:1fr; }.game-card__body { display:block; }.game-card__details { padding-top:0; }.games-archive .game-status { margin-top:1.5rem; }.game-card__cta { width:min(100%,18rem); }
}
@media (max-width:360px) { :root { --archive-shell:calc(100% - 36px); } }
@media (prefers-reduced-motion:reduce) { .archive-hero__noise { animation:none; }.photo-card,.photo-card.is-reveal-ready { opacity:1; transform:none; transition:none; }.works-card__image img,.works-card__image::after { transition:none; } }
