body.psych8-quest-open{overflow:hidden}

.mind-arcade-frame-shell{
  position:fixed;
  inset:0;
  z-index:10020;
  background:
    radial-gradient(circle at 18% 8%, rgba(255,46,136,.22), transparent 30%),
    radial-gradient(circle at 82% 90%, rgba(0,229,255,.16), transparent 34%),
    #09071a;
}
.mind-arcade-frame-shell iframe{
  width:100%;
  height:100%;
  border:0;
  display:block;
}
.mind-arcade-close{
  position:fixed;
  right:20px;
  top:18px;
  z-index:10030;
  min-height:42px;
  padding:10px 14px;
  border:2px solid rgba(255,212,71,.76);
  border-radius:14px;
  background:linear-gradient(135deg, rgba(42,30,92,.94), rgba(10,8,32,.94));
  color:#fff6d5;
  font-family:"Press Start 2P","VT323","Courier New",monospace;
  font-size:.62rem;
  cursor:pointer;
  box-shadow:0 12px 28px rgba(0,0,0,.34), 0 0 18px rgba(255,46,136,.24);
}
.mind-arcade-close:hover{
  transform:translateY(-1px);
  box-shadow:0 16px 32px rgba(0,0,0,.38), 0 0 22px rgba(0,229,255,.26);
}

@media (max-width:760px){
  .mind-arcade-close{
    top:10px;
    right:10px;
    left:10px;
    width:calc(100% - 20px);
  }
}
.psych8q-primary-btn,
.psych8q-ghost-btn{
  border:0;
  border-radius:16px;
  padding:13px 18px;
  font-weight:900;
  cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}
.psych8q-primary-btn{
  background:linear-gradient(135deg,#ffcf7a,#ff8f3a);
  color:#32190d;
  box-shadow:0 10px 28px rgba(211,105,20,.28);
}
.psych8q-ghost-btn{
  background:rgba(255,248,238,.08);
  color:#fff3e0;
  border:1px solid rgba(255,215,174,.22);
}
.psych8q-primary-btn:hover,
.psych8q-ghost-btn:hover{transform:translateY(-1px)}
.psych8q-ghost-btn[disabled]{opacity:.42;cursor:not-allowed;transform:none}

.psych8q-pixel-sprite,
.psych8q-runner{
  position:relative;
  width:42px;
  height:54px;
  transform-origin:center bottom;
}
.psych8q-pixel-sprite i,
.psych8q-runner i{
  position:absolute;
  left:10px;
  top:0;
  width:22px;
  height:22px;
  border-radius:4px;
  background:var(--psych8-skin,#ffd2a6);
  box-shadow:0 0 0 4px rgba(39,24,13,.18) inset;
}
.psych8q-pixel-sprite b,
.psych8q-runner b{
  position:absolute;
  left:7px;
  top:22px;
  width:28px;
  height:22px;
  border-radius:4px;
  background:var(--psych8-accent,#ffb347);
}
.psych8q-pixel-sprite em,
.psych8q-runner em{
  position:absolute;
  left:13px;
  top:44px;
  width:16px;
  height:10px;
  border-radius:3px;
  background:#694028;
}
.psych8q-pixel-sprite.theme-amber,
.psych8q-runner.theme-amber{--psych8-accent:#ffb347}
.psych8q-pixel-sprite.theme-mint,
.psych8q-runner.theme-mint{--psych8-accent:#6fd0a1}
.psych8q-pixel-sprite.theme-sky,
.psych8q-runner.theme-sky{--psych8-accent:#6db7ff}
.psych8q-pixel-sprite.theme-rose,
.psych8q-runner.theme-rose{--psych8-accent:#ef8ca8}
.psych8q-pixel-sprite.scale-2{transform:scale(1.18)}
.psych8q-pixel-sprite.scale-3{transform:scale(1.34)}
.psych8q-pixel-sprite.scale-4{transform:scale(1.52)}

#psych8-quest-root{
  position:fixed;
  inset:0;
  z-index:10020;
  display:none;
}
#psych8-quest-root.open{display:block}
.psych8q-shell{
  position:absolute;
  inset:0;
  background:radial-gradient(circle at top, rgba(255,185,97,.2), transparent 24%), linear-gradient(180deg,#261712 0%, #1a1110 100%);
  color:#fdf4e3;
  overflow:auto;
}
.psych8q-noise{
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.25;
  background:
    linear-gradient(rgba(18,16,16,0) 50%, rgba(0,0,0,.22) 50%),
    linear-gradient(90deg, rgba(255,0,0,.04), rgba(0,255,0,.02), rgba(0,80,255,.04));
  background-size:100% 3px, 4px 100%;
}
.psych8q-window{
  position:relative;
  z-index:1;
  min-height:100vh;
  padding:32px 36px 40px;
  font-family:"VT323","Courier New",monospace;
}
.psych8q-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:18px;
}
.psych8q-breadcrumb{
  font-family:"Press Start 2P","VT323","Courier New",monospace;
  font-size:.65rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#f4bc80;
}
.psych8q-top-actions{display:flex;gap:10px;flex-wrap:wrap}
.psych8q-track-wrap{
  margin-bottom:22px;
  padding:22px 24px;
  border-radius:26px;
  border:1px solid rgba(237,182,111,.22);
  background:linear-gradient(145deg, rgba(59,35,28,.95), rgba(31,19,16,.94));
  box-shadow:0 18px 44px rgba(0,0,0,.2);
}
.psych8q-track-copy{
  display:flex;
  justify-content:space-between;
  gap:14px;
  margin-bottom:12px;
  font-size:1.2rem;
}
.psych8q-track-copy strong{font-size:1.45rem;color:#fff7ea}
.psych8q-track{
  position:relative;
  height:22px;
  border-radius:999px;
  background:rgba(255,245,232,.08);
  border:1px solid rgba(255,226,189,.12);
  overflow:visible;
}
.psych8q-track-fill{
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#ffba62,#ff8747 78%);
  box-shadow:0 0 26px rgba(255,161,71,.34);
}
.psych8q-runner{
  position:absolute;
  top:-22px;
  transition:left .22s ease, transform .22s ease;
}
.psych8q-track-caption{
  margin-top:10px;
  color:#f0cfab;
  font-size:1rem;
}
.psych8q-stage{
  display:grid;
  grid-template-columns:minmax(0,1.65fr) minmax(290px,.75fr);
  gap:22px;
}
.psych8q-stage.avatar{align-items:start}
.psych8q-main-card,
.psych8q-side-card{
  border-radius:28px;
  border:1px solid rgba(238,197,147,.18);
  background:linear-gradient(180deg, rgba(60,38,31,.97), rgba(28,18,16,.98));
  box-shadow:0 22px 48px rgba(0,0,0,.24);
}
.psych8q-main-card{padding:26px}
.psych8q-main-head h2{
  margin:8px 0 8px;
  font-size:2.1rem;
  line-height:1.1;
  color:#fff7ec;
}
.psych8q-main-head p{
  margin:0;
  font-size:1.08rem;
  line-height:1.55;
  color:#f4d6b6;
}
.psych8q-option-grid{
  display:grid;
  gap:14px;
  margin-top:22px;
}
.psych8q-option{
  display:grid;
  grid-template-columns:54px 1fr;
  gap:14px;
  align-items:start;
  width:100%;
  text-align:left;
  padding:16px 18px;
  border-radius:18px;
  border:1px solid rgba(255,230,194,.12);
  background:rgba(255,249,240,.04);
  color:#fff3e0;
  cursor:pointer;
  transition:transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.psych8q-option:hover{
  transform:translateY(-1px);
  border-color:rgba(255,203,138,.35);
  box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.psych8q-option.active{border-color:#ffb15a;background:rgba(255,183,110,.11)}
.psych8q-option-key{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:rgba(255,255,255,.08);
  font-family:"Press Start 2P","VT323","Courier New",monospace;
  font-size:.9rem;
}
.psych8q-option-body{
  display:grid;
  gap:5px;
}
.psych8q-option-body strong{
  font-size:1.15rem;
  color:#fffaf2;
}
.psych8q-option-body span{
  font-size:1.05rem;
  line-height:1.45;
  color:#f1d6b8;
}
.psych8q-option.theme-amber .psych8q-option-key{background:rgba(255,179,71,.18)}
.psych8q-option.theme-mint .psych8q-option-key{background:rgba(111,208,161,.18)}
.psych8q-option.theme-sky .psych8q-option-key{background:rgba(109,183,255,.18)}
.psych8q-option.theme-rose .psych8q-option-key{background:rgba(239,140,168,.18)}
.psych8q-nav{
  display:flex;
  justify-content:space-between;
  gap:12px;
  margin-top:22px;
}
.psych8q-side-card{
  padding:22px;
  display:grid;
  align-content:start;
  gap:14px;
}
.psych8q-side-block{
  border-radius:18px;
  border:1px solid rgba(255,224,186,.12);
  background:rgba(255,249,240,.04);
  padding:16px;
}
.psych8q-side-block strong{
  display:block;
  margin-bottom:8px;
  font-size:1.12rem;
  color:#fff6e7;
}
.psych8q-side-block p,
.psych8q-side-block li{
  margin:0;
  font-size:1rem;
  line-height:1.45;
  color:#ecd0b1;
}
.psych8q-side-block ul{
  margin:0;
  padding-left:18px;
}
.psych8q-stat{
  display:flex;
  justify-content:space-between;
  gap:12px;
  font-size:1rem;
  color:#f1d7ba;
  padding:6px 0;
}
.psych8q-stat b{color:#fff8ef}
.psych8q-result-hero{
  display:grid;
  gap:14px;
  padding:20px 22px;
  border-radius:22px;
  background:linear-gradient(135deg, rgba(255,174,88,.12), rgba(255,255,255,.03));
  border:1px solid rgba(255,191,118,.2);
}
.psych8q-result-hero h2{
  margin:6px 0 6px;
  font-size:2.35rem;
  line-height:1.08;
}
.psych8q-result-hero p{
  margin:0;
  color:#f3d7b7;
  font-size:1.08rem;
  line-height:1.5;
}
.psych8q-result-tags{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.psych8q-result-tags span{
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,248,238,.08);
  border:1px solid rgba(255,216,175,.16);
  font-size:1rem;
}
.psych8q-alignment-grid,
.psych8q-trait-grid,
.psych8q-story-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin-top:18px;
}
.psych8q-story-card,
.psych8q-trait-card{
  border-radius:20px;
  border:1px solid rgba(255,223,185,.12);
  background:rgba(255,249,240,.04);
  padding:16px 18px;
}
.psych8q-story-card.wide{margin-top:18px}
.psych8q-story-card h4,
.psych8q-trait-card strong{
  display:block;
  margin:0 0 8px;
  font-size:1.14rem;
  color:#fff7ea;
}
.psych8q-story-card p,
.psych8q-trait-card p{
  margin:0;
  color:#efd4b4;
  font-size:1rem;
  line-height:1.5;
}
.psych8q-trait-card span{
  display:inline-block;
  margin-bottom:8px;
  color:#ffc889;
  font-size:1rem;
}
.psych8q-stack{
  margin-top:8px;
  border-radius:14px;
  padding:12px;
  background:rgba(0,0,0,.2);
  color:#ffd9af;
  font-size:1rem;
}
.psych8q-side-actions{
  display:grid;
  gap:10px;
}
.psych8q-avatar-grid,
.psych8q-baseline-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  margin-top:22px;
}
.psych8q-avatar-card{
  display:grid;
  justify-items:start;
  gap:12px;
  border-radius:22px;
  border:1px solid rgba(255,220,183,.16);
  background:rgba(255,249,240,.04);
  padding:18px;
  color:#fff4e2;
  text-align:left;
  cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.psych8q-avatar-card:hover,
.psych8q-avatar-card.active{
  transform:translateY(-2px);
  border-color:rgba(255,188,104,.42);
  box-shadow:0 16px 34px rgba(0,0,0,.18);
}
.psych8q-avatar-card strong{
  font-size:1.18rem;
}
.psych8q-avatar-card span{
  color:#efcfaf;
  font-size:1rem;
  line-height:1.45;
}
.psych8q-avatar-swatch{
  width:100%;
  min-height:120px;
  border-radius:18px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.04);
}
.psych8q-avatar-card.theme-amber .psych8q-avatar-swatch{background:rgba(255,179,71,.08)}
.psych8q-avatar-card.theme-mint .psych8q-avatar-swatch{background:rgba(111,208,161,.08)}
.psych8q-avatar-card.theme-sky .psych8q-avatar-swatch{background:rgba(109,183,255,.08)}
.psych8q-avatar-card.theme-rose .psych8q-avatar-swatch{background:rgba(239,140,168,.08)}
.psych8q-gate-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:20px;
}

@media (max-width: 1100px){
  .psych8q-stage{grid-template-columns:1fr}
  .psych8q-track-copy{flex-direction:column}
  .psych8q-avatar-grid,
  .psych8q-baseline-grid{grid-template-columns:1fr}
}
@media (max-width: 760px){
  .psych8q-window{padding:18px 14px 24px}
  .psych8q-main-head h2{font-size:1.55rem}
  .psych8q-alignment-grid,
  .psych8q-trait-grid,
  .psych8q-story-grid{grid-template-columns:1fr}
  .psych8q-topbar{align-items:flex-start;flex-direction:column}
  .psych8q-nav{flex-wrap:wrap}
}

/* Phase 63 Mind Arcade demo: SNES-inspired character mode. */
.psych8q-pixel-sprite.theme-violet,
.psych8q-runner.theme-violet{--psych8-accent:#b99cff}
.psych8q-avatar-card.theme-violet .psych8q-avatar-swatch{background:rgba(185,156,255,.1)}

.psych8q-shell{
  background:
    radial-gradient(circle at 18% 8%, rgba(89,184,255,.2), transparent 24%),
    radial-gradient(circle at 82% 0%, rgba(255,88,173,.18), transparent 28%),
    linear-gradient(180deg,#151827 0%, #241622 54%, #141018 100%) !important;
}
.psych8q-main-card,
.psych8q-side-card{
  border-color:rgba(255,232,170,.22) !important;
  background:linear-gradient(180deg, rgba(42,35,62,.97), rgba(25,18,34,.98)) !important;
  box-shadow:0 22px 48px rgba(0,0,0,.28), inset 0 0 0 2px rgba(255,255,255,.03) !important;
}
.psych8q-avatar-grid{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.psych8q-avatar-card{background:linear-gradient(180deg, rgba(255,249,240,.08), rgba(255,249,240,.025))}
.psych8q-avatar-swatch{
  background:
    linear-gradient(180deg, rgba(98,198,255,.2), transparent 52%),
    repeating-linear-gradient(0deg, rgba(255,255,255,.06) 0 2px, transparent 2px 8px),
    rgba(0,0,0,.24) !important;
}

.psych8q-world.snes{
  min-height:240px;
  border:4px solid #f8d94d;
  border-radius:20px;
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(#6fc8ff 0 42%, #6554b8 42% 48%, #2b234f 48% 66%, #1f1832 66%),
    repeating-linear-gradient(90deg, transparent 0 26px, rgba(255,255,255,.07) 26px 28px);
  box-shadow:inset 0 0 0 5px rgba(0,0,0,.35), 0 18px 30px rgba(0,0,0,.28);
}
.psych8q-world.snes::before{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height:54px;
  background:repeating-linear-gradient(90deg, #5b3273 0 34px, #7c4594 34px 68px);
  box-shadow:0 -8px 0 #f0c35e, 0 -16px 0 rgba(23,18,38,.5);
}
.psych8q-world.snes::after{
  content:"";
  position:absolute;
  right:8%;
  top:25%;
  width:170px;
  height:84px;
  background:#f6d57c;
  box-shadow:14px 14px 0 #b95877,-84px 34px 0 #67c978,-118px 54px 0 #2e8b63,48px 42px 0 #7bd6ff;
  clip-path:polygon(0 24%,100% 0,100% 100%,0 82%);
}
.psych8q-stage-lights{
  position:absolute;
  left:10%;
  top:14%;
  width:190px;
  height:80px;
  background:
    radial-gradient(circle at 18% 18%, #fff3a8 0 8px, transparent 9px),
    radial-gradient(circle at 50% 6%, #ff8dc8 0 7px, transparent 8px),
    radial-gradient(circle at 82% 18%, #7ee8ff 0 8px, transparent 9px);
}
.psych8q-hero-sprite,
.psych8q-player{
  width:86px;
  height:116px;
  position:absolute;
  image-rendering:pixelated;
  background:
    linear-gradient(#ffd3a3 0 0) 30px 16px/30px 28px no-repeat,
    linear-gradient(var(--job-hair,#3b2430) 0 0) 22px 6px/46px 22px no-repeat,
    linear-gradient(var(--job-shirt,#6db7ff) 0 0) 20px 48px/48px 38px no-repeat,
    linear-gradient(#2c2f5b 0 0) 24px 86px/18px 28px no-repeat,
    linear-gradient(#2c2f5b 0 0) 48px 86px/18px 28px no-repeat,
    linear-gradient(#fff1d0 0 0) 14px 56px/12px 32px no-repeat,
    linear-gradient(#fff1d0 0 0) 64px 56px/12px 32px no-repeat;
  filter:drop-shadow(0 10px 0 rgba(0,0,0,.22));
}
.psych8q-hero-sprite{left:15%;bottom:48px;animation:psychHeroIdle 1.1s steps(2,end) infinite}
.psych8q-player{left:13%;bottom:42px;animation:psychHeroRun .85s steps(4,end) infinite}
.psych8q-hero-sprite.job-director,.psych8q-player.job-director{--job-shirt:#ffb347;--job-hair:#3c2531}
.psych8q-hero-sprite.job-writer,.psych8q-player.job-writer{--job-shirt:#6db7ff;--job-hair:#253a5a}
.psych8q-hero-sprite.job-dp,.psych8q-player.job-dp{--job-shirt:#6fd0a1;--job-hair:#203a2e}
.psych8q-hero-sprite.job-gaffer,.psych8q-player.job-gaffer{--job-shirt:#ef8ca8;--job-hair:#47302b}
.psych8q-hero-sprite.job-producer,.psych8q-player.job-producer{--job-shirt:#b99cff;--job-hair:#2b2447}
@keyframes psychHeroIdle{50%{transform:translateY(-3px)}}
@keyframes psychHeroRun{50%{transform:translate(8px,-3px)}}

.psych8q-minigame{display:grid;grid-template-columns:minmax(320px,1.25fr) minmax(260px,.75fr);gap:18px;align-items:stretch}
.psych8q-game-board.snes{
  min-height:280px;
  position:relative;
  overflow:hidden;
  border-radius:22px;
  border:4px solid #f8d94d;
  background:
    linear-gradient(#35275e 0 28%, #6246a1 28% 48%, #1c1730 48% 76%, #15101f 76%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.08) 0 2px, transparent 2px 26px);
  box-shadow:inset 0 0 0 5px rgba(0,0,0,.4), 0 16px 30px rgba(0,0,0,.26);
}
.psych8q-game-hud{position:absolute;z-index:3;left:14px;right:14px;top:12px;display:flex;justify-content:space-between;font-family:"Press Start 2P","VT323",monospace;font-size:.62rem;color:#fff5c9}
.psych8q-city{position:absolute;left:0;right:0;bottom:54px;height:92px;background:linear-gradient(#2f8b7c 0 0) 10% 28px/72px 64px no-repeat,linear-gradient(#b95d8e 0 0) 38% 12px/96px 80px no-repeat,linear-gradient(#e5b85d 0 0) 70% 34px/82px 58px no-repeat;opacity:.92}
.psych8q-thought-boss{position:absolute;right:14%;bottom:70px;width:84px;height:74px;background:#ff5fad;border-radius:42% 42% 48% 48%;box-shadow:16px -10px 0 #ffd84f,-12px 12px 0 #55d6ff;animation:psychBossFloat 1.4s ease-in-out infinite}
.psych8q-dialogue-bubble{position:absolute;right:8%;top:58px;max-width:260px;padding:12px 14px;border-radius:16px;background:#fff2bd;color:#2d1b37;font-weight:900;box-shadow:0 8px 0 rgba(0,0,0,.24)}
.psych8q-pickup{position:absolute;bottom:82px;width:18px;height:18px;background:#ffe15b;transform:rotate(45deg);box-shadow:0 0 18px rgba(255,225,91,.6);animation:psychPickup 1.2s ease-in-out infinite}
.psych8q-pickup.p1{left:42%}
.psych8q-pickup.p2{left:52%;animation-delay:.2s;background:#69e6ff}
.psych8q-pickup.p3{left:62%;animation-delay:.4s;background:#ff7ec4}
@keyframes psychBossFloat{50%{transform:translateY(-8px)}}
@keyframes psychPickup{50%{transform:translateY(-8px) rotate(45deg)}}
@media (max-width:900px){.psych8q-minigame{grid-template-columns:1fr}}
