:root{color-scheme:light;--bg:#f5f6f8;--ink:#20252d;--blue:#385adb}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo",Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer}
[hidden]{display:none!important}
a:focus-visible,button:focus-visible{outline:3px solid #91a6f3;outline-offset:5px}
.skip-link{position:absolute;top:-70px;left:12px;z-index:100;background:var(--blue);color:#fff;padding:12px}
.skip-link:focus{top:10px}
.header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dce0e7}
.brand span{color:var(--blue)}
.main-nav a{display:inline-flex;align-items:center;gap:11px;min-height:44px;padding:0 4px;font-size:11px;font-weight:650;letter-spacing:2.7px;color:var(--ink);transition:color .2s}
.main-nav .small-mark{font-size:26px;line-height:1;font-weight:400;color:#6e9185;letter-spacing:0}
.main-nav a span[lang]{white-space:nowrap}
@media(max-width:680px){.main-nav a{font-size:9px;letter-spacing:1.4px;gap:7px}.main-nav .small-mark{font-size:21px}}
.main-nav a:hover{color:var(--blue)}
.workshop-night .main-nav a{color:#d1dced}
.workshop-night .main-nav a:hover{color:#a6bcff}
.header{position:relative;z-index:10}
.main-nav{display:flex;align-items:center;gap:28px}
.mobile-menu-toggle{display:none}
@media(max-width:900px){
  .header.menu-ready .mobile-menu-toggle{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:0 4px 0 12px;border:0;background:none;color:var(--ink);font-size:11px;font-weight:600;letter-spacing:1.2px}
  .mobile-menu-toggle svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
  .menu-open .mobile-menu-toggle svg{transform:rotate(180deg)}
  .header.menu-ready .main-nav{display:none;position:absolute;right:0;top:calc(100% + 8px);width:min(260px,calc(100vw - 40px));max-height:min(60svh,420px);overflow-y:auto;overscroll-behavior:contain;flex-direction:column;align-items:stretch;gap:0;padding:8px;background:#f8f9f5;border:1px solid #dce0d6;border-radius:12px;box-shadow:0 12px 32px #25302c16}
  .header.menu-open .main-nav{display:flex}
  .header.menu-ready .main-nav a{min-height:52px;padding:10px 14px;border-radius:7px;font-size:10px;letter-spacing:1.8px;gap:10px}
  .main-nav a:hover{background:#e8ede4}
  .workshop-night .header .mobile-menu-toggle{color:#d1dced}
  .workshop-night .header.menu-ready .main-nav{background:#1c283b;border-color:#3a4960}
  .workshop-night .main-nav a:hover{background:#2b3a50}
}
main{--scene-vertical-padding:43px;max-width:1500px;width:calc(100% - 64px);margin:auto;padding:19px 0 24px}
.site-credit{height:24px;margin-top:-24px;padding:0 10px;display:flex;align-items:center;justify-content:center;gap:12px;color:#6c736b;font-size:11px;font-weight:400;line-height:1.5;letter-spacing:.1px;text-align:center}
.site-credit span{white-space:nowrap}.site-credit p{margin:0}
.workshop-night .site-credit{color:#9eaac0}
@media(max-width:680px){.site-credit{height:auto;min-height:60px;margin-top:-20px;padding:10px 16px;flex-direction:column;gap:4px}}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.house-scene{position:relative;isolation:isolate;overflow:hidden;height:max(240px,calc(100svh - var(--site-header-height,92px) - var(--scene-vertical-padding)));background:radial-gradient(ellipse at 50% 43%,#f0efe6 0%,#e8eade 70%,#e1e5d9 100%);border:1px solid #dfe3d7;border-radius:8px}
#desk-scene{position:absolute;inset:0;touch-action:pan-y}
#desk-scene canvas{display:block;width:100%;height:100%}

#scene-loading{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background:#e8eadf;color:#7a8b77;font-size:13px;transition:opacity .4s;pointer-events:none;z-index:4}
#scene-loading.loaded{opacity:0}
#scene-loading span{width:4px;height:4px;margin-left:8px;border-radius:50%;background:#8c9f82}
#scene-fallback{position:absolute;top:50%;left:10%;right:10%;z-index:2;text-align:center;line-height:1.7;padding:22px;background:#f6f7eecc;border-radius:6px;color:#70816b}
@media(max-width:1180px){main{--scene-vertical-padding:41px;width:calc(100% - 40px);padding-top:17px}}
@media(max-width:680px){main{width:calc(100% - 20px);padding:13px 0 20px}.house-scene{height:auto;aspect-ratio:1/1.04;border-radius:6px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* The game link follows the boss in the 3D scene on every viewport. */
.vulcan-link{position:absolute;z-index:3;transform:translate(-50%,-100%);white-space:nowrap;padding:10px 14px;border:1px solid #ffffffd9;border-radius:24px;background:#f8f9f0e8;box-shadow:0 3px 14px #59654e14;backdrop-filter:blur(8px);font-size:12px;font-weight:600;color:#465044;transition:background .2s,box-shadow .2s}
.vulcan-link span{margin-left:8px;color:#b67839}
.vulcan-link:hover{background:#fff;box-shadow:0 4px 18px #59654e25}
@media(max-width:680px){.vulcan-link{font-size:10px;padding:8px 10px;min-height:34px;display:flex;align-items:center}}

.scene-zoom{display:none}
@media(max-width:680px){
  #desk-scene{touch-action:none}
  #desk-scene.scene-zoomed{cursor:grab}
  .scene-zoom{position:absolute;bottom:14px;left:14px;z-index:3;display:flex;align-items:center;justify-content:center;width:34px;height:34px;color:#465044;pointer-events:none}
  .scene-zoom svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
  .scene-night .scene-zoom{color:#e8e6d6}
}

.main-nav .arcade-mark{display:inline-flex;width:28px;height:28px;color:#789887}.arcade-mark svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round}@media(max-width:680px){.main-nav .arcade-mark{width:23px;height:23px}}

.main-nav .library-nav-link{letter-spacing:.4px;white-space:nowrap}
@media(max-width:900px){.header.site-header.menu-ready .main-nav{right:var(--site-header-inset);width:min(260px,calc(100% - 2 * var(--site-header-inset)))}}
.main-nav .floorplan-mark{display:inline-flex;width:28px;height:28px;color:#789887}
.main-nav .floorplan-mark svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:1160px) and (min-width:901px){.main-nav{gap:12px}.header.site-header .main-nav a{gap:7px;letter-spacing:1.5px}.main-nav .floorplan-mark,.main-nav .arcade-mark{width:24px;height:24px}}
@media(max-width:1000px) and (min-width:901px){.main-nav{gap:8px}.header.site-header .main-nav a{gap:6px;font-size:10px;letter-spacing:1.1px}}
@media(max-width:680px){.main-nav .floorplan-mark{width:23px;height:23px}}