:root{
  --site-game-pink:#fff6fb;
  --site-game-pink-strong:#f7d8e7;
  --site-game-pink-line:#efbdd5;
  --site-game-ink:#2c2430;
  --site-game-accent:#b91f69;
}

html{
  min-height:100%;
  background:#f8f6f7;
}

body{
  min-height:100%;
  background:#f8f6f7 !important;
}

.site-game-frame{
  min-height:100vh;
  padding:clamp(10px,2vw,24px);
  background:#f8f6f7;
}

.site-game-frame__viewport{
  width:min(1220px,100%);
  margin:0 auto;
}

.site-game-frame__bar{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:12px;
  min-height:50px;
  padding:0 4px 10px;
}

.site-game-frame__back{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:42px;
  padding:8px 14px 8px 11px;
  border:1px solid var(--site-game-pink-line);
  border-radius:13px;
  color:var(--site-game-accent);
  background:#fff;
  box-shadow:0 7px 18px rgba(181,35,105,.10);
  font:800 14px/1 Arial,Helvetica,sans-serif;
  text-decoration:none;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}

.site-game-frame__back img{
  width:19px;
  height:19px;
  display:block;
}

.site-game-frame__back:hover,
.site-game-frame__back:focus-visible{
  transform:translateY(-1px);
  border-color:#dc8fb5;
  box-shadow:0 11px 24px rgba(181,35,105,.16);
}

.site-game-frame__back:focus-visible{
  outline:3px solid rgba(192,38,124,.2);
  outline-offset:2px;
}

.site-game-frame__brand{
  display:flex;
  align-items:baseline;
  gap:7px;
  min-width:0;
  font-family:Arial,Helvetica,sans-serif;
  white-space:nowrap;
}

.site-game-frame__brand strong{
  color:#2c2430;
  font-size:20px;
  letter-spacing:.02em;
}

.site-game-frame__brand span{
  color:#795e6d;
  font-size:13px;
  font-weight:700;
}

.site-game-frame__fullscreen{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  min-width:42px;
  height:42px;
  margin-left:auto;
  padding:0;
  border:1px solid var(--site-game-pink-line);
  border-radius:13px;
  color:var(--site-game-accent);
  background:#fff;
  box-shadow:0 7px 18px rgba(181,35,105,.10);
  cursor:pointer;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}

.site-game-frame__fullscreen img{
  display:block;
  width:21px;
  height:21px;
}

.site-game-frame__fullscreen:hover,
.site-game-frame__fullscreen:focus-visible{
  transform:translateY(-1px);
  border-color:#dc8fb5;
  box-shadow:0 11px 24px rgba(181,35,105,.16);
}

.site-game-frame__fullscreen:focus-visible{
  outline:3px solid rgba(192,38,124,.2);
  outline-offset:2px;
}

.site-game-frame__viewport > .game-shell,
.site-game-frame__viewport > .arcade-shell,
.site-game-frame__viewport > .territory-shell{
  min-height:0;
  padding:0;
}

.site-game-stage{
  width:100% !important;
  min-height:0;
  aspect-ratio:16 / 9;
  padding:10px;
  overflow:hidden;
  border:1px solid var(--site-game-pink-line);
  border-radius:24px;
  background:var(--site-game-pink);
  box-shadow:0 24px 60px rgba(129,43,84,.16);
}

.site-game-stage > .arcade-frame,
.site-game-stage > .territory-frame{
  height:100%;
}

.site-game-stage > #gameCanvas,
.site-game-stage #gCanvas,
.site-game-stage #territoryCanvas{
  width:100%;
  height:100%;
  max-height:none;
}

.dijican-stage > .dijican-app{
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  width:100%;
  height:100%;
  min-height:0;
  padding:0;
  overflow:hidden;
}

.dijican-stage .dijican-intro{
  min-height:58px;
  margin-bottom:8px;
  padding:8px 14px;
}

.dijican-stage .dijican-intro h1{
  font-size:28px;
}

.dijican-stage .dijican-layout{
  grid-template-columns:minmax(360px,1.04fr) minmax(360px,.96fr);
  gap:10px;
  min-height:0;
  height:100%;
  overflow:hidden;
  align-items:stretch;
}

.dijican-stage .dijican-toy-wrap{
  min-height:0;
  height:100%;
  padding:22px 8px 8px;
}

.dijican-stage .dijican-keyring{
  top:2px;
  transform:translateX(-50%) scale(.65);
  transform-origin:top center;
}

.dijican-stage .dijican-toy{
  width:min(100%,355px);
  min-height:0;
  height:100%;
  padding:50px 40px 25px;
  border-width:7px;
}

.dijican-stage .dijican-brand{
  top:23px;
  font-size:19px;
}

.dijican-stage .dijican-toy__shine{
  top:46px;
  height:110px;
}

.dijican-stage .dijican-screen{
  min-height:0;
  height:330px;
  padding:13px 12px 10px;
  border-width:7px;
}

.dijican-stage .dijican-scene{
  min-height:158px;
}

.dijican-stage .dijican-pet{
  width:125px;
  height:125px;
}

.dijican-stage .dijican-controls{
  grid-template-columns:repeat(3,54px);
  gap:20px;
  margin-top:17px;
}

.dijican-stage .dijican-control{
  width:54px;
  height:39px;
  border-width:4px;
}

.dijican-stage .dijican-control-hint{
  margin-top:14px;
}

.dijican-stage .dijican-dashboard{
  grid-template-rows:auto auto minmax(0,1fr) auto auto;
  gap:8px;
  min-height:0;
  overflow:hidden;
}

.dijican-stage .dijican-card{
  padding:10px 12px;
  border-radius:14px;
}

.dijican-stage .dijican-card h2{
  font-size:17px;
}

.dijican-stage .dijican-profile h2{
  font-size:22px;
}

.dijican-stage .dijican-card__copy{
  margin:5px 0 7px;
  font-size:12px;
}

.dijican-stage .dijican-daily-tasks div{
  min-height:34px;
  padding:6px 8px;
}

.dijican-stage .dijican-needs{
  gap:6px;
  margin-top:8px;
}

.dijican-stage .dijican-routine{
  grid-template-columns:38px 1fr;
  gap:8px;
}

.dijican-stage .dijican-routine__icon{
  width:38px;
  height:38px;
  font-size:21px;
}

.dijican-stage .dijican-routine p{
  margin-top:2px;
  font-size:11px;
}

.dijican-stage .dijican-reset{
  min-height:38px;
}

.dijican-stage .dijican-note{
  display:none;
}

@media (max-width:860px){
  .dijican-stage{
    aspect-ratio:auto;
    overflow:visible;
  }

  .dijican-stage > .dijican-app{
    height:auto;
    overflow:visible;
  }

  .dijican-stage .dijican-layout{
    grid-template-columns:1fr;
    height:auto;
    overflow:visible;
    align-items:start;
  }

  .dijican-stage .dijican-toy-wrap{
    min-height:560px;
    height:auto;
  }

  .dijican-stage .dijican-toy{
    min-height:520px;
    height:520px;
  }

  .dijican-stage .dijican-dashboard{
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-rows:auto;
    overflow:visible;
  }

  .dijican-stage .dijican-profile,
  .dijican-stage .dijican-routine,
  .dijican-stage .dijican-reset{
    grid-column:1 / -1;
  }
}

.site-game-frame__viewport:fullscreen{
  width:100vw;
  max-width:none;
  height:100vh;
  padding:10px;
  overflow:hidden;
  background:#f8f6f7;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
}

.site-game-frame__viewport:fullscreen .site-game-frame__bar{
  min-height:50px;
  padding-bottom:8px;
}

.site-game-frame__viewport:fullscreen > .game-shell,
.site-game-frame__viewport:fullscreen > .arcade-shell,
.site-game-frame__viewport:fullscreen > .territory-shell{
  width:100%;
  height:100%;
  min-height:0;
  display:flex;
  align-items:center;
  justify-content:center;
}

.site-game-frame__viewport:fullscreen .site-game-stage{
  width:var(--site-game-fullscreen-width,1220px) !important;
  height:auto;
  max-width:none;
  max-height:none;
  margin:0 auto;
  align-self:center;
  justify-self:center;
  aspect-ratio:16 / 9;
  box-shadow:none;
}

@media (max-width:570px){
  .site-game-frame{padding:8px}
  .site-game-frame__bar{gap:9px;min-height:48px;padding-bottom:8px}
  .site-game-frame__back{min-height:40px;padding:7px 10px 7px 8px}
  .site-game-frame__brand{display:grid;gap:0}
  .site-game-frame__brand strong{font-size:17px}
  .site-game-frame__brand span{font-size:11px}
  .site-game-stage{padding:6px;border-radius:18px}
  .dijican-stage{overflow:visible}
  .dijican-stage > .dijican-app{min-width:0}
  .dijican-stage .dijican-dashboard{grid-template-columns:1fr}
  .dijican-stage .dijican-card,
  .dijican-stage .dijican-profile,
  .dijican-stage .dijican-routine,
  .dijican-stage .dijican-reset{grid-column:auto}
}

@media (prefers-reduced-motion:reduce){
  .site-game-frame__back,
  .site-game-frame__fullscreen{transition:none}
}