/* Temporary isolated movement prototype. Remove this stylesheet when the
   portfolio world is re-integrated. */
body.graybox-active{cursor:auto!important}
body.graybox-active #cur,
body.graybox-active #cur-ring,
body.graybox-active #flame-canvas{display:none!important}
body.graybox-active #privacy-settings{top:64px;right:24px}

body.graybox-active #s-world{background:#18253d}
body.graybox-active #s-world::before,
body.graybox-active #s-world::after{display:none}
body.graybox-active #three-canvas{cursor:grab;touch-action:none}
body.graybox-active #three-canvas:active{cursor:grabbing}
body.graybox-active #three-canvas.graybox-object-hovered{cursor:pointer}
body.graybox-active #moon-msg,
body.graybox-active #moon-hint,
body.graybox-active .world-legal,
body.graybox-active #world-fallback-art{display:none!important}

body.graybox-active #w-prompt{top:24px;left:24px;width:min(520px,calc(100vw - 48px));transform:none;text-align:left}
body.graybox-active .world-eyebrow{margin-bottom:10px;color:rgba(245,248,250,.68);font-size:.58rem}
body.graybox-active #w-prompt h2{font:500 clamp(2.1rem,4.5vw,4rem)/.95 'Cormorant Garamond',serif;color:#fff;letter-spacing:-.035em;text-shadow:0 8px 30px rgba(24,34,42,.25)}
body.graybox-active #w-prompt p{margin-top:12px;color:rgba(249,251,252,.76);font-size:.8rem;text-shadow:0 2px 12px rgba(20,29,36,.28)}

#graybox-controls{position:absolute;inset:0;pointer-events:none;z-index:30}
.graybox-help{position:absolute;left:24px;bottom:24px;display:flex;gap:24px;padding:11px 14px;border:1px solid rgba(255,255,255,.18);border-radius:6px;background:rgba(29,40,48,.54);backdrop-filter:blur(12px);color:rgba(250,251,252,.72);font:500 .58rem/1.25 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.06em}
.graybox-help span{display:flex;gap:7px;white-space:nowrap}
.graybox-help b{color:#fff;letter-spacing:.12em}
.graybox-touch{display:none}

#graybox-interact{position:absolute;left:50%;bottom:86px;display:flex;flex-direction:column;align-items:center;gap:5px;min-width:270px;padding:12px 18px;border:1px solid rgba(127,211,245,.58);border-radius:6px;background:rgba(19,33,43,.88);color:#fff;opacity:0;pointer-events:none;transform:translate(-50%,10px);transition:opacity .18s,transform .18s;box-shadow:0 12px 34px rgba(19,31,39,.22)}
#graybox-interact.show{opacity:1;pointer-events:auto;transform:translate(-50%,0);cursor:pointer}
#graybox-interact span{font:600 .54rem/1 'IBM Plex Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:#8ed9f4}
#graybox-interact strong{font:500 .72rem/1.2 'Inter',sans-serif;color:#fff}
#graybox-status{position:absolute;right:24px;top:24px;padding:8px 11px;border-radius:5px;background:rgba(31,42,49,.5);color:rgba(255,255,255,.72);font:500 .58rem/1 'IBM Plex Mono',monospace;letter-spacing:.08em;text-transform:uppercase}

body.graybox-active #s-world.graybox-no-webgl{background:#18253d}
body.graybox-active #s-world.graybox-no-webgl #world-ui{display:block}
body.graybox-active #s-world.graybox-no-webgl #w-prompt{position:absolute;margin:0}
body.graybox-active #s-world.graybox-no-webgl #graybox-status{display:block}

#graybox-character{position:absolute;right:24px;bottom:24px;pointer-events:auto;padding:8px 11px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(22,26,38,.62);color:rgba(255,255,255,.76);font:600 .54rem 'IBM Plex Mono',monospace;letter-spacing:.07em;text-transform:uppercase;cursor:pointer}
#graybox-character:hover,#graybox-character:focus-visible{outline:none;border-color:rgba(255,255,255,.62);color:#fff}
#speed-unlock{position:absolute;z-index:40;left:50%;top:50%;width:min(390px,calc(100vw - 40px));display:grid;justify-items:center;gap:8px;padding:42px 28px;text-align:center;pointer-events:none;opacity:0;transform:translate(-50%,-50%) scale(.82);transition:opacity .5s,transform .65s cubic-bezier(.18,.84,.24,1)}
#speed-unlock[hidden]{display:none}#speed-unlock.show{opacity:1;transform:translate(-50%,-50%) scale(1)}
#speed-unlock::before,#speed-unlock::after,#speed-unlock i{content:'';position:absolute;left:50%;top:50%;border:1px solid rgba(202,225,255,.52);border-radius:50%;transform:translate(-50%,-50%);animation:galeRune 2.4s ease-out both}
#speed-unlock::before{width:230px;height:230px}#speed-unlock::after{width:176px;height:176px;animation-delay:.12s}#speed-unlock i{width:112px;height:112px;border-style:double;box-shadow:0 0 55px rgba(152,197,255,.26);animation-delay:.24s}
#speed-unlock strong{position:relative;color:#f5f8ff;font:500 2.7rem/.9 'Cormorant Garamond',serif;letter-spacing:-.03em;text-shadow:0 0 24px rgba(166,204,255,.45)}#speed-unlock span{position:relative;color:#c7d5e8;font:600 .58rem/1.6 'IBM Plex Mono',monospace;letter-spacing:.11em;text-transform:uppercase}
#speed-boost{position:absolute;z-index:36;left:50%;top:96px;display:flex;gap:10px;align-items:center;padding:7px 11px;border:1px solid rgba(178,211,255,.38);border-radius:999px;background:rgba(13,20,34,.72);color:#dceaff;transform:translateX(-50%);font:600 .55rem 'IBM Plex Mono',monospace;letter-spacing:.1em;text-transform:uppercase}#speed-boost[hidden]{display:none}#speed-boost b{min-width:28px;color:#fff;font-variant-numeric:tabular-nums}
.speed-surging #three-canvas{animation:galeSurge .65s ease-out}
@keyframes galeRune{0%{opacity:0;transform:translate(-50%,-50%) scale(.35) rotate(-35deg)}35%{opacity:1}100%{opacity:.22;transform:translate(-50%,-50%) scale(1) rotate(22deg)}}
@keyframes galeSurge{0%{filter:brightness(1)}26%{filter:brightness(1.32) saturate(1.16)}100%{filter:brightness(1)}}

@media(max-width:760px),(pointer:coarse){
  body.graybox-active #privacy-settings{top:112px;right:16px}
  body.graybox-active #w-prompt{top:16px;left:16px;width:calc(100vw - 32px)}
  body.graybox-active .world-eyebrow{font-size:.5rem;margin-bottom:7px}
  body.graybox-active #w-prompt h2{font-size:clamp(2rem,10vw,3rem)}
  body.graybox-active #w-prompt p{max-width:330px;margin-top:8px;font-size:.72rem}
  .graybox-help{display:none}
  .graybox-touch{position:absolute;left:16px;right:16px;bottom:max(16px,env(safe-area-inset-bottom));display:flex;align-items:flex-end;justify-content:space-between;pointer-events:none}
  .graybox-stick{position:relative;width:112px;height:112px;border:1px solid rgba(255,255,255,.36);border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.11) 0 14%,transparent 15%),rgba(29,42,51,.52);backdrop-filter:blur(10px);box-shadow:inset 0 0 0 18px rgba(255,255,255,.035);pointer-events:auto;touch-action:none}
  .graybox-stick::before,.graybox-stick::after{content:'';position:absolute;background:rgba(255,255,255,.13);pointer-events:none}
  .graybox-stick::before{left:15px;right:15px;top:50%;height:1px}
  .graybox-stick::after{top:15px;bottom:15px;left:50%;width:1px}
  .graybox-stick-knob{position:absolute;left:50%;top:50%;width:38px;height:38px;margin:-19px;border:1px solid rgba(255,255,255,.6);border-radius:50%;background:rgba(154,211,236,.34);box-shadow:0 6px 18px rgba(18,28,34,.26);will-change:transform}
  .graybox-touch-actions{display:grid;grid-template-columns:repeat(2,64px);gap:9px;pointer-events:auto}
  .graybox-touch-actions button{appearance:none;width:64px;height:64px;border:1px solid rgba(255,255,255,.38);border-radius:50%;background:rgba(29,42,51,.64);backdrop-filter:blur(10px);color:#fff;font:600 .58rem/1 'IBM Plex Mono',monospace;letter-spacing:.07em;text-transform:uppercase;touch-action:manipulation}
  .graybox-touch-actions button[data-graybox-action="jump"]{border-color:rgba(242,204,120,.55);color:#ffe2a1}
  .graybox-touch-actions button[data-graybox-action="fly"]{border-color:rgba(154,194,239,.58);color:#c9e0ff}
  .graybox-touch-actions button[data-graybox-action="drop"]{visibility:hidden;border-color:rgba(220,156,148,.52);color:#ffd1ca}
  .graybox-flying .graybox-touch-actions button[data-graybox-action="drop"]{visibility:visible}
  .graybox-flying .graybox-touch-actions button[data-graybox-action="fly"]{border-color:rgba(174,215,255,.82);color:#e2f0ff;background:rgba(69,94,126,.72)}
  .graybox-touch-actions button:active{background:rgba(125,196,226,.35)}
  #graybox-interact{bottom:174px;min-width:0;width:min(270px,calc(100vw - 32px));padding:10px 12px}
  #graybox-status{top:auto;right:16px;bottom:148px;max-width:190px;text-align:right;background:transparent;padding:0;color:rgba(255,255,255,.62)}
  #graybox-character{right:16px;bottom:282px;font-size:.48rem}
  #speed-boost{top:104px}
}

@media(max-width:410px){
  .graybox-stick{width:98px;height:98px}
  .graybox-touch-actions{grid-template-columns:repeat(2,52px);gap:5px}
  .graybox-touch-actions button{width:52px;height:52px;font-size:.52rem}
  #graybox-interact{bottom:148px}
}

@media(prefers-reduced-motion:reduce){
  #graybox-interact,#speed-unlock{transition:none}#speed-unlock::before,#speed-unlock::after,#speed-unlock i,.speed-surging #three-canvas{animation:none}
}