/* MONTAMON LP — mobile first;
all pixel artwork comes from the game. */
:root {
  color-scheme:dark;
  --bg:#111927;
  --panel:#192438;
  --line:#354359;
  --ink:#f6f2df;
  --muted:#b2bdce;
  --mint:#96f2cd;
  --yellow:#ffe477;
  --pink:#ff91d0;
  --purple:#b7a0ff;
  --mono:Consolas,"Courier New",monospace;
}
* {
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:24px;
}
body {
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:"Yu Gothic",Meiryo,system-ui,sans-serif;
  line-height:1.8;
  -webkit-font-smoothing:antialiased;
}
a {
  color:inherit;
  text-decoration:none;
}
a:focus-visible,button:focus-visible {
  outline:3px solid var(--yellow);
  outline-offset:5px;
}
img {
  max-width:100%;
  height:auto;
}
h1,h2,h3,p {
  margin:0;
}
h1,h2,h3 {
  line-height:1.45;
  letter-spacing:.025em;
}
h2 {
  font-size:clamp(25px,3.3vw,40px);
}
.wrap {
  width:min(1120px,calc(100% - 40px));
  margin-inline:auto;
}
.section {
  padding-block:72px;
}
.section-label {
  font-family:var(--mono);
  font-weight:700;
  font-size:12px;
  letter-spacing:.13em;
  color:var(--mint);
  margin-bottom:24px;
}
.mint {
  color:var(--mint);
}
.small-note,.micro {
  font-size:12px;
  color:var(--muted);
}
.skip-link {
  position:absolute;
  left:16px;
  top:-100px;
  z-index:10;
  background:var(--mint);
  color:var(--bg);
  padding:12px;
}
.skip-link:focus {
  top:12px;
}
.site-header {
  min-height:76px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--line);
  gap:16px;
}
.wordmark {
  font-family:var(--mono);
  font-weight:900;
  letter-spacing:.08em;
  font-size:18px;
}
.wordmark span {
  color:var(--mint);
}
.wordmark i {
  color:var(--yellow);
  margin-left:9px;
  font-style:normal;
}
.hero {
  text-align:center;
  padding-top:34px;
  padding-bottom:44px;
}
.eyebrow {
  font:700 11px var(--mono);
  letter-spacing:.15em;
  color:var(--mint);
  display:flex;
  gap:9px;
  align-items:center;
  justify-content:center;
}
.status-dot {
  width:7px;
  height:7px;
  background:var(--mint);
  box-shadow:3px 3px 0 #477963;
}
.logo-plate {
  position:relative;
  width:min(440px,90%);
  margin:25px auto 28px;
  padding:24px 12px 15px;
  background:var(--panel);
  border:3px solid var(--mint);
  box-shadow:6px 6px 0 #080e19;
  transform:rotate(-2deg);
}
.logo-caption {
  position:absolute;
  bottom:58.6207%;
  left:30.5%;
  right:1.5%;
  font:700 clamp(18px,5.4vw,28px)/1 var(--mono);
  text-align:center;
  white-space:nowrap;
  letter-spacing:.12em;
  color:var(--yellow);
}
.logo-letters {
  position:relative;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  transform:translateY(-4px);
}
.logo-letters img {
  width:17%;
  image-rendering:pixelated;
  filter:brightness(0) invert(1);
}
.logo-letters img:first-of-type {
  width:29%;
}
.hero h1 {
  font-size:clamp(25px,4.4vw,48px);
  font-weight:900;
}
.hero-second {
  font-size:.72em;
}
.hero-copy {
  font-size:12px;
  color:var(--muted);
  margin-top:18px;
  line-height:1.95;
}
.hero-monsters {
  display:flex;
  justify-content:center;
  gap:clamp(3px,1vw,12px);
  align-items:flex-end;
  margin:23px auto 18px;
}
.hero-monsters img {
  width:clamp(46px,13vw,92px);
  height:auto;
}
.hero-monsters img:nth-child(3),
.hero-monsters img:nth-child(4) {
  width:clamp(54px,15vw,108px);
}
.hero-monsters img:nth-child(-n+3) {
  transform:scaleX(-1);
}
.hero-monsters img:nth-child(2),
.hero-monsters img:nth-child(4),
.hero-monsters img:nth-child(6) {
  translate:0 -10px;
}
.release-status {
  display:block;
  font-size:13px;
  font-weight:800;
  letter-spacing:.1em;
  color:var(--yellow);
  margin:0 0 12px;
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  min-height:58px;
  width:min(310px,100%);
  padding:13px 24px;
  font:900 20px "Yu Gothic",Meiryo,sans-serif;
  color:var(--mint);
  background:var(--panel);
  border:2px solid var(--mint);
  box-shadow:4px 4px 0 #426955;
}
.button:disabled {
  opacity:1;
  color:var(--ink);
  background:#263449;
  border-color:#708078;
  box-shadow:4px 4px 0 #080e19;
  cursor:default;
}
.button span {
  font:26px var(--mono);
}
a.button:hover {
  color:var(--yellow);
  background:var(--panel);
  border-color:var(--yellow);
}
.hero .micro {
  margin-top:16px;
  font-size:10px;
}
.pv-section {
  padding-top:10px;
  padding-bottom:25px;
}
.section-bar {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:13px;
}
.section-bar h2 {
  font:700 12px var(--mono);
  letter-spacing:.14em;
}
.section-bar>span {
  color:var(--muted);
  font-size:10px;
}
.media-frame {
  padding:8px;
  background:#1c293a;
  border:1px solid #526076;
  box-shadow:5px 5px 0 #080e19;
}
.placeholder {
  width:100%;
  min-width:0;
  background-color:#101825;
  background-image:linear-gradient(#7082990e 1px,transparent 1px),linear-gradient(90deg,#7082990e 1px,transparent 1px);
  background-size:24px 24px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:10px;
  text-align:center;
}
.pv-placeholder {
  aspect-ratio:16/9;
  min-height:185px;
}
.video-symbol {
  display:grid;
  place-items:center;
  width:45px;
  height:40px;
  border:1px solid var(--mint);
  color:var(--mint);
  font-size:18px;
  box-shadow:3px 3px 0 #34574f;
}
.pv-placeholder strong {
  font:700 clamp(17px,4vw,32px) var(--mono);
  letter-spacing:.09em;
}
.pv-placeholder>span:last-child {
  font-size:11px;
  color:var(--muted);
}
.pv-media {
  display:block;
  width:100%;
  border:0;
  aspect-ratio:16/9;
  background:#080e19;
}
.pv-media.portrait {
  aspect-ratio:9/16;
  max-width:380px;
  margin:auto;
}
.pv-section .media-frame:has(.pv-media.portrait) {
  width:min(100%,380px);
  margin-inline:auto;
  padding:6px;
  border-color:#b7a0ff80;
  box-shadow:0 12px 36px #00000030;
}
.two-columns {
  display:grid;
  gap:30px;
}
.display {
  font-family:var(--mono);
  font-size:clamp(42px,8vw,76px);
  line-height:1.06;
  letter-spacing:-.04em;
}
.section-copy {
  margin-top:25px;
  font-size:14px;
}
.summon-methods {
  display:grid;
  gap:22px;
  margin-top:24px;
}
.summon-methods h3 {
  display:inline-block;
  font-size:13px;
  border:1px solid var(--line);
  background:var(--panel);
  padding:5px 13px;
  margin:0 0 10px;
}
.summon-methods p {
  color:var(--muted);
  font-size:14px;
  line-height:1.8;
}
.summon-window {
  border:2px solid #788ba1;
  box-shadow:5px 5px 0 #080e19;
}
.summon-video {
  display:block;
  width:auto;
  height:min(70vh,620px);
  max-width:100%;
  aspect-ratio:9/20;
  object-fit:contain;
  margin-inline:auto;
  background:#080e19;
}
.window-top,.window-bottom {
  display:flex;
  justify-content:space-between;
  padding:9px 14px;
  background:#243246;
  font:12px var(--mono);
  color:var(--muted);
}
.window-bottom {
  color:var(--mint);
  border-top:1px solid var(--line);
}
.screenshot-placeholder {
  aspect-ratio:4/3;
  min-height:170px;
}
.placeholder>span:not(.video-symbol):not(.pixel-cross) {
  font-family:var(--mono);
}
.placeholder small {
  font:10px var(--mono);
  letter-spacing:.1em;
  color:var(--muted);
}
.pixel-cross {
  font:52px var(--mono);
  color:#62788c;
  line-height:1;
}
.screenshot {
  display:block;
  width:100%;
  max-height:640px;
  object-fit:contain;
  background:#101825;
}
.possibilities {
  background:var(--bg);
  color:var(--ink);
  border-block:2px solid var(--mint);
  overflow:hidden;
}
.possibilities .section-label {
  color:var(--mint);
}
.huge-number {
  color:var(--yellow);
  position:relative;
  display:flex;
  align-items:baseline;
  justify-content:center;
  font:900 clamp(95px,23vw,230px)/1.1 var(--mono);
  letter-spacing:-.09em;
  white-space:nowrap;
}
.huge-number .approx {
  font-size:.26em;
  margin-right:.3em;
  letter-spacing:0;
}
.huge-number .unit {
  font:900 .28em/1.2 "Yu Gothic",Meiryo,sans-serif;
  letter-spacing:-.05em;
  margin-left:.15em;
}
.spark {
  color:var(--pink);
  position:absolute;
  right:3%;
  top:-.15em;
  font-size:.17em;
  letter-spacing:0;
}
.combination-info {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:2px;
  border-top:1px solid #356c5c80;
  border-bottom:1px solid #356c5c80;
  padding:18px 0;
  margin-top:25px;
  font-size:12px;
}
.combination-info strong {
  font-size:22px;
  font-weight:900;
}
.times {
  font:25px var(--mono);
  color:var(--purple);
}
.possibilities-copy {
  text-align:center;
  font-size:clamp(20px,3vw,28px);
  font-weight:900;
  margin-top:28px;
}
.collection-heading {
  display:flex;
  justify-content:space-between;
  flex-direction:column;
  gap:12px;
  margin-bottom:28px;
}
.monster-grid {
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  grid-template-rows:repeat(2,136px);
  grid-auto-columns:112px;
  grid-auto-flow:column;
  gap:10px;
  overflow-x:auto;
  padding-bottom:14px;
  scroll-snap-type:x mandatory;
  scrollbar-color:var(--mint) var(--panel);
}
.monster-grid li {
  background:var(--panel);
  border:1px solid var(--line);
  padding:6px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:space-between;
  scroll-snap-align:start;
}
.monster-number {
  align-self:flex-start;
  font:10px var(--mono);
  color:var(--muted);
}
.monster-grid img {
  width:80px;
  height:80px;
  image-rendering:pixelated;
}
.monster-grid li.album-monster img {
  /* Native 32px sprites at exactly 3x; preserve original outlines and colors. */
  width:96px;
  height:96px;
  flex-shrink:0;
  object-fit:contain;
  image-rendering:pixelated;
}
.games {
  padding-top:20px;
}
.games>h2 {
  margin-bottom:30px;
}
.game-cards {
  gap:20px;
}
.game-card {
  border:1px solid var(--mint);
  padding:20px;
  min-width:0;
  background:var(--panel);
  box-shadow:4px 4px 0 #080e19;
}
.game-card-top {
  display:flex;
  justify-content:space-between;
  gap:8px;
  font:10px var(--mono);
  color:var(--mint);
}
.game-card h3 {
  font:900 clamp(35px,7vw,54px) var(--mono);
  letter-spacing:-.06em;
  margin:18px 0 10px;
}
.game-card>p {
  font-size:12px;
  color:var(--muted);
  min-height:44px;
  margin-bottom:18px;
}
.game-card .screenshot-placeholder {
  border:1px solid var(--line);
  aspect-ratio:16/10;
  min-height:150px;
}
.game-card-bottom {
  display:flex;
  justify-content:space-between;
  font-size:11px;
  margin-top:16px;
}
.shooting {
  border-color:var(--pink);
}
.shooting .game-card-top {
  color:var(--pink);
}
.extra-gallery {
  display:grid;
  gap:20px;
  margin-top:24px;
}
.extra-gallery figure {
  margin:0;
}
.story {
  background:#192436;
  border-block:1px solid var(--line);
}
.zero {
  font:900 1.8em/1 var(--mono);
  padding-left:.1em;
}
.story-copy>p:first-child {
  font-size:20px;
  font-weight:800;
  margin-bottom:20px;
}
.story-copy>p:nth-child(2) {
  font-size:13px;
  color:var(--muted);
}
.text-link {
  display:inline-block;
  color:var(--mint);
  border-bottom:1px solid var(--mint);
  font-size:14px;
  font-weight:700;
  margin-top:24px;
  padding:8px 0;
}
.text-link span {
  padding-left:25px;
}
.story-facts {
  display:grid;
  gap:14px;
  margin-top:34px;
}
.story-fact {
  padding:20px;
  border:1px solid var(--line);
  border-left:4px solid var(--mint);
  background:var(--bg);
  box-shadow:4px 4px 0 #080e19;
}
.art-fact {
  border-left-color:var(--yellow);
}
.story-fact>h3 {
  display:block;
  font-size:clamp(19px,5vw,25px);
  font-weight:900;
  line-height:1.35;
}
.story-fact:first-child>h3 {
  color:var(--mint);
}
.art-fact>h3 {
  color:var(--yellow);
}
.story-fact p {
  margin-top:8px;
  color:var(--muted);
  font-size:12px;
}
.creator {
  scroll-margin-top:20px;
}
.creator-card {
  padding:28px 22px;
  border:1px solid var(--line);
  border-top:4px solid var(--mint);
  background:linear-gradient(135deg,#23394766,transparent 60%),var(--panel);
  box-shadow:6px 6px 0 #080e19;
}
.creator h2 {
  font-size:clamp(22px,7vw,32px);
  min-width:0;
}
.creator-heading {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.creator-avatar {
  display:block;
  width:clamp(64px,12vw,88px);
  height:auto;
  aspect-ratio:1;
  flex:0 0 auto;
  border-radius:50%;
  object-fit:cover;
  border:2px solid var(--line);
  box-shadow:0 4px 14px #00000035;
}
.creator h2 span {
  display:block;
  font:11px var(--mono);
  letter-spacing:.2em;
  color:var(--muted);
  margin-top:8px;
}
.creator-bio {
  font-size:13px;
  margin-top:24px;
  overflow-wrap:anywhere;
}
.credits {
  font-size:12px;
  color:var(--muted);
  margin-top:14px;
}
.social-invitation {
  margin-top:30px;
  font-size:17px;
  font-weight:800;
  color:var(--mint);
}
.social-links {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:16px;
}
.social-links a {
  position:relative;
  border:1px solid #718d89;
  padding:9px 10px;
  background:#243b3b;
  min-height:60px;
  transition:background .15s,color .15s;
}
.social-links a:hover {
  background:var(--bg);
  border-color:var(--mint);
  color:var(--mint);
}
.social-links span {
  display:block;
  font:700 17px var(--mono);
}
.social-links small {
  display:block;
  font:9px var(--mono);
  margin-top:10px;
}
.social-links i {
  position:absolute;
  right:10px;
  top:8px;
  font-style:normal;
}
.game-info {
  padding-top:0;
}
.game-info h2 {
  margin-bottom:25px;
}
.info-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
  margin:0;
}
.info-grid>div {
  background:var(--bg);
  padding:13.5px 14px;
}
.info-grid dt {
  font-size:11px;
  color:var(--muted);
  margin-bottom:6px;
}
.info-grid dd {
  font-size:14px;
  font-weight:700;
  margin:0;
}
.info-grid .environment {
  grid-column:1/-1;
}
.info-grid small {
  display:block;
  color:var(--muted);
  font-size:11px;
  font-weight:400;
  margin-top:4px;
}
.closing {
  text-align:center;
  padding-top:65px;
}
.closing>p {
  font-size:clamp(24px,4vw,36px);
  font-weight:900;
  line-height:1.5;
  margin-bottom:28px;
}
.closing .release-status {
  margin-top:18px;
}
.site-footer {
  padding-block:24px 35px;
  border-top:1px solid var(--line);
  display:flex;
  align-items:center;
  flex-direction:column;
  gap:18px;
}
.supported-environment {
  width:100%;
  margin:0;
  color:var(--muted);
  font-size:12px;
  line-height:1.7;
  text-align:center;
}
.site-footer nav {
  display:flex;
  gap:25px;
  font-size:12px;
  color:var(--muted);
}
.site-footer>small {
  font:11px var(--mono);
  color:var(--muted);
}
.legal {
  max-width:840px;
  padding-block:40px 80px;
}
.legal h1 {
  font-size:clamp(24px,5vw,40px);
  margin:30px 0;
}
.legal-text {
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  line-height:2;
  font-size:15px;
  margin-bottom:35px;
}
.back-link {
  color:var(--mint);
  font-size:14px;
  display:inline-block;
  padding-block:10px;
}
@media(min-width:700px) {
  .wrap {
    width:min(1120px,calc(100% - 80px));
  }
  .section {
    padding-block:96px;
  }
  .site-header {
    min-height:86px;
  }
  .wordmark {
    font-size:21px;
  }
  .hero {
    padding-top:44px;
    padding-bottom:54px;
  }
  .hero-copy {
    font-size:15px;
  }
  .hero .micro {
    font-size:12px;
  }
  .mobile-break {
    display:none;
  }
  .logo-plate {
    margin-top:30px;
    margin-bottom:32px;
  }
  .two-columns {
    grid-template-columns:1fr 1fr;
    align-items:center;
    gap:48px;
  }
  .section-bar>span {
    font-size:12px;
  }
  .pv-section {
    max-width:960px;
  }
  .pv-placeholder {
    min-height:300px;
  }
  .video-symbol {
    width:64px;
    height:54px;
    font-size:24px;
    margin-bottom:10px;
  }
  .pv-placeholder>span:last-child {
    font-size:13px;
  }
  .combination-info {
    flex-direction:row;
    justify-content:center;
    gap:26px;
    font-size:14px;
  }
  .combination-info strong {
    font-size:27px;
  }
  .collection-heading {
    flex-direction:row;
    align-items:flex-end;
  }
  .collection-heading .small-note {
    display:none;
  }
  .monster-grid {
    grid-template-rows:none;
    grid-template-columns:repeat(4,1fr);
    grid-auto-flow:row;
    gap:12px;
    overflow:visible;
  }
  .monster-grid li {
    min-height:148px;
  }
  .monster-grid img {
    width:min(112px,100%);
    height:auto;
  }
  .games {
    padding-top:20px;
  }
  .game-cards {
    gap:24px;
    align-items:stretch;
  }
  .game-card {
    padding:26px;
  }
  .game-card>p {
    font-size:13px;
  }
  .game-card .screenshot-placeholder {
    min-height:210px;
  }
  .extra-gallery {
    grid-template-columns:repeat(3,1fr);
  }
  .story-facts {
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
  }
  .story-fact {
    min-height:148px;
    padding:22px;
  }
  .creator-card {
    padding:48px;
  }
  .creator h2 {
    font-size:42px;
  }
  .creator-avatar {
    width:112px;
  }
  .creator-bio {
    font-size:15px;
  }
  .social-links {
    grid-template-columns:repeat(4,1fr);
    gap:16px;
  }
  .social-links a {
    padding:13.5px 14px;
  }
  .social-links small {
    font-size:10px;
  }
  .social-links span {
    font-size:21px;
  }
  .info-grid {
    grid-template-columns:repeat(4,1fr);
  }
  .info-grid>div {
    padding:18px;
  }
  .info-grid dd {
    font-size:17px;
  }
  .game-info {
    padding-top:0;
  }
  .site-footer {
    flex-wrap:wrap;
    flex-direction:row;
    justify-content:space-between;
  }
  .site-footer nav {
    margin-left:auto;
  }
  .site-footer>small {
    margin-left:15px;
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  * {
    transition:none!important;
  }
}

/* Neon accents stay on text and borders, keeping large surfaces dark. */
.summon-methods article:nth-child(1) h3 { color:var(--mint); border-color:var(--mint); }
.summon-methods article:nth-child(2) h3 { color:var(--purple); border-color:var(--purple); }
.summon-methods article:nth-child(3) h3 { color:var(--pink); border-color:var(--pink); }
.collection .section-label { color:var(--purple); }
.games>.section-label { color:var(--yellow); }
.monster-grid li:nth-child(4n+1) { border-top-color:var(--mint); }
.monster-grid li:nth-child(4n+2) { border-top-color:var(--purple); }
.monster-grid li:nth-child(4n+3) { border-top-color:var(--yellow); }
.monster-grid li:nth-child(4n) { border-top-color:var(--pink); }
.story-fact:nth-child(3) { border-left-color:var(--pink); }
.story-fact:nth-child(3) h3 { color:var(--pink); }
.creator-card { border-top-color:var(--pink); }
.creator .section-label { color:var(--pink); }
.social-links a { background:var(--bg); }
.social-links a:nth-child(2) { border-color:var(--yellow); }
.social-links a:nth-child(3) { border-color:var(--purple); }
.social-links a:nth-child(4) { border-color:var(--pink); }

/* Low-intensity ambient light; no animation or extra content. */
body {
  background-image:
    radial-gradient(ellipse 75% 650px at 10% 0, #96f2cd09, transparent 75%),
    radial-gradient(ellipse 65% 750px at 100% 10%, #b7a0ff0b, transparent 75%),
    radial-gradient(ellipse 80% 650px at 0 55%, #ff91d007, transparent 75%);
}
.hero {
  background:radial-gradient(ellipse at 50% 25%, #96f2cd08, transparent 65%);
}
.logo-plate {
  background:linear-gradient(135deg,#ffffff06,transparent 65%),var(--panel);
  box-shadow:4px 4px 0 #080e19,0 16px 36px #00000030,0 0 28px #96f2cd08,inset 0 1px 0 #ffffff14;
}
.section-label {
  text-shadow:0 0 16px #b7a0ff12;
}
.possibilities {
  background:radial-gradient(ellipse at 50% 45%,#ffe47707,transparent 70%),var(--bg);
  border-block-color:#96f2cd66;
  box-shadow:inset 0 1px 0 #ffffff08;
}
.huge-number {
  text-shadow:0 2px 0 #080e19,0 0 30px #ffe47712;
}
.summon-window,.game-card,.creator-card,.story-fact {
  box-shadow:3px 3px 0 #080e19,0 12px 26px #00000026,inset 0 1px 0 #ffffff0d;
}
.game-card,.story-fact {
  background-image:linear-gradient(145deg,#ffffff04,transparent 55%);
}
.story {
  background:radial-gradient(ellipse at 85% 10%,#ff91d006,transparent 65%),#192436;
  border-block-color:#35435999;
}
.creator-card {
  background:linear-gradient(135deg,#ff91d006,transparent 55%),var(--panel);
}
.monster-grid li {
  background-image:linear-gradient(160deg,#ffffff05,transparent 60%);
  box-shadow:inset 0 1px 0 #ffffff08;
}
.social-links a {
  box-shadow:inset 0 1px 0 #ffffff08;
  transition:background .18s,color .18s,box-shadow .18s;
}
@media(hover:hover) and (pointer:fine) {
  .social-links a:hover {
    box-shadow:inset 0 1px 0 #ffffff12,0 4px 14px #00000025;
  }
}

/* Final layout pass: consistent spacing, quiet frames, readable copy. */
:root {
  --line:#303d50;
  --muted:#b7c0ce;
}
.section { padding-block:clamp(56px,7vw,88px); }
.section-label { margin-bottom:20px; letter-spacing:.16em; text-shadow:none; }
.hero { padding-top:32px; padding-bottom:40px; }
.hero h1 { line-height:1.55; letter-spacing:.015em; }
.hero-copy { font-size:13px; line-height:1.85; margin-top:20px; }
.logo-plate {
  transform:rotate(-1deg);
  border-width:2px;
  border-color:#96f2cd99;
  box-shadow:0 12px 32px #00000030,inset 0 1px 0 #ffffff0a;
}
.hero-monsters { margin-block:26px 24px; }
.button:disabled {
  background:#1c293b;
  border-color:#96f2cd70;
  box-shadow:0 6px 18px #00000020;
}
.pv-section { padding-top:12px; padding-bottom:20px; }
.summon-methods { gap:24px; }
.summon-methods h3 { font-weight:700; padding:4px 11px; }
.summon-methods p { line-height:1.9; }
.summon-window { border:1px solid #56667c; }
.summon-window,.game-card,.creator-card,.story-fact {
  box-shadow:0 10px 28px #00000022,inset 0 1px 0 #ffffff08;
}
.possibilities { border-block-width:1px; border-block-color:#96f2cd45; }
.combination-info { border-color:var(--line); }
.collection-heading { gap:16px; margin-bottom:24px; }
.monster-grid li { border-color:var(--line); }
.games { padding-top:24px; }
.game-card { border-color:var(--line); border-top:2px solid #96f2cd99; }
.game-card.shooting { border-color:var(--line); border-top-color:#ff91d099; }
.game-card h3 { letter-spacing:-.035em; margin-top:20px; }
.game-card>p { line-height:1.85; }
.game-card .screenshot {
  aspect-ratio:4/5;
  height:auto;
  max-height:none;
  object-fit:contain;
  border:1px solid #ffffff0a;
  background:#0d1423;
}
.game-card-bottom { display:block; position:relative; padding-right:20px; line-height:1.9; }
.game-card-bottom>span { position:absolute; top:0; right:0; color:var(--muted); }
.story-facts { margin-top:24px; gap:16px; }
.story-fact { border-left-width:2px; padding:22px; }
.story-fact p { font-size:13px; line-height:1.9; margin-top:12px; }
.creator { padding-top:48px; }
.creator-card { max-width:920px; margin-inline:auto; border-top-width:2px; }
.creator-bio { max-width:68ch; line-height:1.95; color:#d4dae3; }
.social-links { margin-top:28px; }
.social-links a:nth-child(n) { border-color:var(--line); }
.social-links a:nth-child(1) span { color:var(--mint); }
.social-links a:nth-child(2) span { color:var(--yellow); }
.social-links a:nth-child(3) span { color:var(--purple); }
.social-links a:nth-child(4) span { color:var(--pink); }
.social-links small { overflow-wrap:anywhere; }
.site-footer { border-top-color:var(--line); gap:16px; padding-block:24px 32px; }
@media(min-width:800px) {
  .game-card .screenshot { height:460px; aspect-ratio:auto; }
  .creator-bio { font-size:14px; }
  .story-fact>h3 { font-size:21px; }
}
@media(max-width:380px) {
  .wrap { width:calc(100% - 32px); }
  .creator-card { padding:24px 16px; }
  .social-links span { font-size:15px; }
}

.logo-plate { padding-top:16px; padding-bottom:12px; }

/* 2026-10-02: larger game visuals and a clearer four-color hierarchy. */
.hero { padding-top:28px; background:radial-gradient(ellipse at 50% 28%,#b7a0ff16,transparent 68%); }
.logo-plate {
  width:min(640px,100%);
  margin-block:26px 32px;
  background:linear-gradient(125deg,#96f2cd0c,#b7a0ff0b 55%,#ff91d00b),var(--panel);
  border-color:#96f2cdba;
  box-shadow:0 16px 40px #00000035,0 0 32px #96f2cd0a,inset 0 1px 0 #ffffff16;
}
.logo-caption { font-size:clamp(18px,5.4vw,38px); }
.hero h1 { font-size:clamp(27px,4.4vw,48px); line-height:1.5; }
.hero-second { font-size:.78em; }
.hero h1 .mint { color:var(--yellow); }
.hero-copy { font-size:clamp(13px,1.5vw,16px); margin-top:20px; }
.hero-copy strong { display:inline-block; color:var(--mint); font-weight:700; margin-top:3px; }
.hero-monsters { gap:clamp(4px,1vw,12px); margin-block:30px 26px; }
.hero-monsters img { width:clamp(46px,13vw,116px); image-rendering:pixelated; filter:drop-shadow(0 8px 8px #00000030); }
.hero-monsters img:nth-child(3),.hero-monsters img:nth-child(4) { width:clamp(54px,15vw,132px); }
.hero .micro { line-height:2; color:var(--muted); }
.platform-steam { color:#c5b9ec; }
.button:disabled { border-color:#ffe47788; background:linear-gradient(110deg,#ffe4770c,#ff91d006),#1c293b; }
.section-label { display:flex; align-items:center; gap:12px; }
.section-label::before { content:""; width:22px; height:2px; background:currentColor; flex-shrink:0; }
.summon-section .section-label,.summon-methods h3 { color:var(--mint); }
.collection .section-label { color:var(--purple); }
.games>.section-label { color:var(--yellow); }
.story .section-label { color:var(--pink); }
.section h2:not(.section-label):not(.huge-number) { text-wrap:balance; }
.monster-grid li:nth-child(4n+1) { border-top:2px solid #96f2cd99; }
.monster-grid li:nth-child(4n+2) { border-top:2px solid #b7a0ff99; }
.monster-grid li:nth-child(4n+3) { border-top:2px solid #ffe47799; }
.monster-grid li:nth-child(4n) { border-top:2px solid #ff91d099; }
.game-card.battle h3 { color:var(--mint); }
.game-card.shooting h3 { color:var(--pink); }
.game-card { background:linear-gradient(145deg,#96f2cd06,transparent 50%),var(--panel); }
.game-card.shooting { background:linear-gradient(145deg,#ff91d008,transparent 50%),var(--panel); }
.story-fact { border-left-color:#b7a0ff99; }
.story-fact:nth-child(2) { border-left-color:#ffe47799; }
.story-fact:nth-child(2) h3 { color:var(--yellow); }
.creator-avatar { border-color:#ff91d066; }
@media(min-width:700px) {
  .monster-grid li.album-monster img { width:128px; height:128px; }
  .monster-grid li { min-height:166px; }
  .creator-bio { font-size:15px; }
}
@media(min-width:1100px) {
  .monster-grid { grid-template-columns:repeat(6,minmax(0,1fr)); }
}
@media(max-width:520px) {
  .hero-monsters { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); width:min(340px,100%); gap:10px 6px; justify-items:center; }
  .hero-monsters img,.hero-monsters img:nth-child(3),.hero-monsters img:nth-child(4) { width:100%; max-width:100px; image-rendering:pixelated; translate:none; }
  .hero-monsters img:nth-child(-n+3) { transform:none; }
  .hero-monsters img:nth-child(3n+1) { transform:scaleX(-1); }
  .hero h1 { font-size:clamp(24px,6.9vw,32px); }
  .hero-second { font-size:.82em; }
  .logo-plate { margin-bottom:28px; }
}

/* 2026-10-04: restrained accents, shared surfaces and editorial spacing. */
:root {
  --surface-edge:#445168;
  --surface-top:#68768b;
  --surface-shadow:0 16px 36px #050a142e,inset 0 1px 0 #ffffff06;
}
.logo-plate {
  border-width:1px;
  border-color:#96f2cd80;
  border-top-color:#b5ead7b0;
  margin-block:34px 40px;
  padding:20px 16px 16px;
  background:linear-gradient(145deg,#ffffff07,transparent 65%),#1b2739;
  box-shadow:0 18px 44px #050a1445,0 0 70px #96f2cd0b,inset 0 1px 0 #ffffff0a;
}
.hero { padding-top:36px; background:radial-gradient(ellipse at 50% 24%,#b7a0ff0d,transparent 68%); }
.pv-section {
  position:relative;
  isolation:isolate;
  padding-block:20px 28px;
}
.pv-section::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(ellipse at center,#b7a0ff12,transparent 68%);
}
.media-frame,.summon-window,.game-card,.game-card.shooting,.creator-card,.story-fact {
  border:1px solid var(--surface-edge);
  border-top-color:var(--surface-top);
  box-shadow:var(--surface-shadow);
}
.pv-section .media-frame:has(.pv-media.portrait) {
  border-color:var(--surface-edge);
  border-top-color:var(--surface-top);
  background:#172133;
  box-shadow:var(--surface-shadow);
}
.game-card,.game-card.shooting,.creator-card {
  background:linear-gradient(145deg,#ffffff05,transparent 58%),var(--panel);
}
.collection .section-label,.story .section-label,.creator .section-label { color:var(--purple); }
.games>.section-label { color:var(--mint); }
.summon-methods article:nth-child(n) h3 { color:var(--mint); border-color:#96f2cd40; background:#96f2cd04; }
.game-card.battle h3,.game-card.shooting h3 { color:var(--ink); }
.shooting .game-card-top { color:var(--purple); }
.game-card.battle { border-top-color:#96f2cd90; }
.game-card.shooting { border-top-color:#ff91d090; }
.game-card.battle h3 { color:var(--mint); }
.game-card.shooting h3 { color:var(--pink); }
.summon-methods article:nth-child(2) h3 { color:var(--purple); border-color:#b7a0ff60; }
.summon-methods article:nth-child(3) h3 { color:var(--pink); border-color:#ff91d060; }
.story-fact:nth-child(n) h3 { color:var(--ink); }
.story-fact:nth-child(n) { border-left:1px solid var(--surface-edge); }
.story-fact:nth-child(1) { border-left-color:#96f2cd90; }
.story-fact:nth-child(2) { border-left-color:#ffe47790; }
.story-fact:nth-child(3) { border-left-color:#b7a0ff90; }
.creator-card { border-top-color:#b7a0ff90; }
.monster-grid li:nth-child(n) { border:1px solid var(--line); border-top-color:#b7a0ff60; }
.monster-grid li:nth-child(4n+1) { border-top-color:#96f2cd80; }
.monster-grid li:nth-child(4n+3) { border-top-color:#ffe47760; }
.monster-grid li:nth-child(4n) { border-top-color:#ff91d060; }
.social-links a:nth-child(n) span { color:var(--ink); }
.social-links a:nth-child(n) i { color:var(--mint); }
.social-links a:nth-child(2) i { color:var(--yellow); }
.social-links a:nth-child(3) i { color:var(--purple); }
.social-links a:nth-child(4) i { color:var(--pink); }
.creator-avatar { border-color:#b7a0ff60; }
.summon-methods { gap:28px; }
.summon-methods p { max-width:32em; line-height:2; }
.game-card>p,.game-card-bottom { line-height:2; }
.game-card-bottom { font-size:12px; margin-top:20px; }
.story-fact p { line-height:2; }
.creator-bio { max-width:44em; line-height:2.1; margin-top:30px; }
.creator-card { padding:30px 24px; }
.section-label { margin-bottom:24px; }
.collection-heading,.games>h2 { margin-bottom:32px; }
@media(min-width:700px) {
  .hero { padding-top:44px; }
  .logo-plate { margin-block:38px 44px; padding:24px 20px 20px; }
  .pv-section { padding-block:32px 48px; }
  .pv-section::before { inset:0 -5%; }
  .summon-layout { gap:64px; }
  .game-card { padding:30px; }
  .creator-card { padding:48px 56px; }
  .story-facts { gap:20px; }
}
@media(max-width:380px) {
  .creator-card { padding:26px 18px; }
}

/* Combination-count footnote, shared by the three visible claims. */
.combination-mark { font-size:.45em; line-height:0; vertical-align:super; margin-left:.15em; font-weight:400; letter-spacing:0; color:var(--muted); }
.combination-note { margin-top:10px; text-align:center; font-size:11px; line-height:1.6; font-weight:400; color:var(--muted); }
