:root{--desk:#eceee6;--surface:#ffffff;--ink:#0a0b1f;--ink-muted:#4a4c5c;--vw-pink:#ff71ce;--vw-pink-hot:#ff3ea5;--vw-pink-pale:#ffd6f2;--vw-pink-ink:#b0126f;--vw-cyan:#06d3ff;--vw-cyan-pale:#c9f3ff;--vw-cyan-ink:#006c87;--sky-top:#18c4ff;--sky-bottom:#ff5fd2;--grid-line:#ffffff;--win-face:#c0c0c0;--win-hilite:#ffffff;--win-light:#dfdfdf;--win-shadow:#808080;--win-dark:#0a0b1f;--title-a:#06d3ff;--title-b:#ff71ce;--logo-blue:#3f8bff;--focus:#ff3ea5;--paper:#bcbdb8;--backdrop:#0f0e0c;--on-backdrop:#e8e6df;--on-backdrop-muted:#9c9a93;--line:#6b6860;--trail-low:#eb0000;--trail-mid:#ffd70f;--trail-high:#ffa600;--trail-core:#fff0d4;--glass-bg:#05060b;--glass-text:#f2f3f7;--glass-text-muted:#8b8f9c;--glass-line:#5d6170;--glass-focus:#66c5f1;--card-accent-1:#d7ff3f;--card-accent-2:#ff9ad5;--card-accent-3:#8ff7ff;--card-accent-4:#ffcc66;--card-accent-5:#b9a7ff;--card-accent-6:#7fffd4;--card-accent-7:#8fff9f;--card-accent-8:#ff8f8f;--photo-ground:#141619;--photo-paper:#e9ebed;--photo-ink:#e6e7e9;--photo-ink-dim:#8a8d93;--retro-black:#050505;--retro-bezel:#1c1b19;--retro-bezel-hi:#2a2925;--retro-bezel-line:#57544c;--retro-label:#a8a498;--retro-phosphor:#58f07a;--retro-amber:#ffb43a;--font-sans:"Alte Haas Grotesk", "Helvetica Neue", Arial, sans-serif;--font-geist:Geist, system-ui, sans-serif;--font-mono:"VT323", "DotGothic16", ui-monospace, monospace;--font-serif:"Instrument Serif", Georgia, serif;--font-pixel:"DotGothic16", "MS Gothic", monospace;--font-body:"Noto Sans JP", "Hiragino Sans", system-ui, sans-serif;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;--space-8:32px;--space-12:48px;--space-16:64px;--radius-none:0px;--radius-sm:5px;--radius-md:6px;--radius-card:20px;--radius-tile:24px;--radius-full:9999px;--bevel-out:inset -1px -1px 0 #0a0b1f, inset 1px 1px 0 #ffffff, inset -2px -2px 0 #808080, inset 2px 2px 0 #dfdfdf;--bevel-in:inset 1px 1px 0 #808080, inset -1px -1px 0 #ffffff, inset 2px 2px 0 #0a0b1f, inset -2px -2px 0 #dfdfdf;--drop-hard:6px 6px 0 #0a0b1f;--glow-pink:0 0 24px rgba(255,113,206,0.65);--glow-cyan:0 0 24px rgba(6,211,255,0.6);--shadow-frame:0 24px 80px -12px rgba(0,0,0,0.75);--trail-grid:120;--trail-radius:0.06;--trail-decay:0.94;--trail-strength:0.7;--trail-falloff:2.6;--trail-warp:0.012;--trail-intensity:1.6;--trail-bloom:0.75;--trail-pixel:2;--glass-tile-width:0.26;--glass-gap:0.045;--glass-corner:0.166;--glass-bevel-width:0.275;--glass-bevel-power:8.4;--glass-bevel-slope:2.92;--glass-ior:2.3;--glass-refract:0.41;--glass-dispersion:0.32;--glass-fresnel-f0:0.2;--glass-env-intensity:1.75;--glass-env-mix:0.27;--glass-rim-intensity:0.07;--glass-bulge:0.34;--glass-drag-stiffness:116;--glass-fling:0.1;--glass-mesh-cols:32;--glass-mesh-stiffness:520;--glass-mesh-anchor:14;--glass-mesh-viscosity:3;--glass-cloth-points:192;--glass-cloth-substeps:12;--glass-cloth-follow:0.12;--glass-cloth-viscosity:0.88;--glass-paint-radius:180;--step-duration:0.85s;--step-ease:cubic-bezier(.2,.1,.25,1);--step-bulge:0.06;--step-parallax:0.12;--step-lens:0.1;--step-blur-max:28px;--step-seam-bend:0.014;--crt-curvature:0.12;--crt-corner:0.06;--crt-scanlines:0.55;--crt-scan-height:3;--crt-mask:0.35;--crt-bloom:0.35;--crt-vignette:0.35;--ease-out:cubic-bezier(.22,1,.36,1);--dur-fast:180ms;--dur-base:320ms;--dur-slow:800ms;--glitch-interval:2.4s;--swipe-threshold:40px;}
/* NEO LOGEEK — LP parts. Reads the tokens (tokens.css). Class prefix: nl- */

.nl-root, .nl-root *, .nl-window, .nl-window *, .nl-overlay * { box-sizing: border-box; }
.nl-root { font-family: var(--font-body); color: var(--ink); background: var(--desk); }
.nl-pixel { font-family: var(--font-pixel); font-weight: 400; letter-spacing: 0; -webkit-font-smoothing: none; }

/* ---------- MenuBar ---------- */
.nl-menubar { position: sticky; top: 0; z-index: 40; display: flex; gap: 0; align-items: center; height: 32px; padding: 0 4px;
  background: var(--win-face); box-shadow: inset 0 -1px 0 var(--win-shadow), inset 0 1px 0 var(--win-hilite); font: 400 18px/1 var(--font-mono); color: #0a0b1f; }
.nl-menubar > .nl-menu { position: relative; }
.nl-menubar button { font: inherit; color: inherit; background: none; border: 0; padding: 6px clamp(4px, 1.6vw, 8px); cursor: pointer; white-space: nowrap; }
.nl-menubar button u { text-decoration: underline; text-underline-offset: 2px; }
.nl-menubar button[aria-expanded="true"], .nl-menubar button:hover { background: var(--title-a); }
.nl-menubar button:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
.nl-menu-list { position: absolute; top: 100%; left: 0; min-width: 180px; margin: 0; padding: 3px; list-style: none; background: var(--win-face);
  box-shadow: var(--bevel-out), var(--drop-hard); display: none; }
.nl-menu-list[data-open] { display: block; }
.nl-menu-list a { display: block; padding: 6px 12px; color: #0a0b1f; text-decoration: none; font: 400 16px/1.2 var(--font-pixel); }
.nl-menu-list a:hover, .nl-menu-list a:focus-visible { background: linear-gradient(90deg, var(--title-a), var(--title-b)); outline: none; }

/* ---------- Window ---------- */
.nl-window { position: relative; display: flex; flex-direction: column; background: var(--win-face); padding: 4px;
  box-shadow: var(--bevel-out), var(--drop-hard); color: #0a0b1f; transform-origin: 50% 0;
  transition: transform var(--dur-base) var(--ease-out), opacity var(--dur-base) var(--ease-out); }
.nl-window[data-state="closed"] { transform: scale(.92) translateY(-8px); opacity: 0; pointer-events: none; }
.nl-window[data-state="min"] .nl-window-body, .nl-window[data-state="min"] .nl-window-scroll { display: none; }
.nl-titlebar { display: flex; align-items: center; gap: var(--space-2); min-height: 30px; padding: 2px 3px 2px 8px;
  background: linear-gradient(90deg, var(--title-a), var(--title-b)); }
.nl-window[data-inactive] .nl-titlebar { background: var(--win-shadow); }
.nl-titlebar h2, .nl-titlebar .nl-title { flex: 1; margin: 0; font: 400 16px/1.2 var(--font-pixel); color: #0a0b1f; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nl-tb-btns { display: flex; gap: 2px; }
.nl-tb-btn { width: 24px; height: 22px; padding: 0; display: grid; place-items: center; background: var(--win-face); border: 0; box-shadow: var(--bevel-out); cursor: pointer; color: #0a0b1f; }
.nl-tb-btn:active { box-shadow: var(--bevel-in); }
.nl-tb-btn:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }
.nl-tb-btn svg { width: 10px; height: 10px; }
.nl-window-body { margin-top: 4px; background: var(--surface); box-shadow: var(--bevel-in); padding: 2px; overflow: hidden; position: relative; }
.nl-window-body[data-flush] { padding: 0; }
.nl-window-scroll { margin-top: 3px; height: 18px; display: grid; grid-template-columns: 18px 1fr 18px; box-shadow: var(--bevel-in); background: var(--win-light); }
.nl-window-scroll i { box-shadow: var(--bevel-out); background: var(--win-face); }
.nl-window-scroll b { position: relative; }
.nl-window-scroll b::after { content: ""; position: absolute; top: 0; bottom: 0; left: var(--nl-thumb-at, 0%); width: var(--nl-thumb, 30%); background: var(--win-face); box-shadow: var(--bevel-out); transition: left var(--dur-base) var(--ease-out); }

/* ---------- Buttons ---------- */
.nl-btn { font: 400 16px/1 var(--font-pixel); color: #0a0b1f; background: var(--win-face); border: 0; padding: 10px 18px; box-shadow: var(--bevel-out); cursor: pointer; }
.nl-btn:active { box-shadow: var(--bevel-in); }
.nl-btn[data-variant="neon"] { background: var(--vw-pink); box-shadow: inset -2px -2px 0 var(--vw-pink-hot), inset 2px 2px 0 var(--vw-pink-pale), 4px 4px 0 #0a0b1f; }
.nl-btn[data-variant="neon"]:hover { box-shadow: inset -2px -2px 0 var(--vw-pink-hot), inset 2px 2px 0 var(--vw-pink-pale), 4px 4px 0 #0a0b1f, var(--glow-pink); }
.nl-btn:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }

/* ---------- Desktop icon ---------- */
.nl-icon { display: inline-grid; justify-items: center; gap: var(--space-1); background: none; border: 0; padding: 6px; cursor: pointer; color: var(--ink); }
.nl-icon svg { width: 56px; height: 56px; image-rendering: pixelated; filter: drop-shadow(3px 3px 0 rgba(10,11,31,.35)); transition: transform var(--dur-fast) var(--ease-out), filter var(--dur-fast); }
.nl-icon span { font: 400 18px/1.1 var(--font-pixel); padding: 1px 4px; }
.nl-icon:hover svg { transform: translateY(-2px); filter: drop-shadow(3px 3px 0 rgba(10,11,31,.35)) drop-shadow(0 0 10px rgba(255,113,206,.7)); }
.nl-icon:focus-visible { outline: none; }
.nl-icon:focus-visible span, .nl-icon[aria-pressed="true"] span { background: var(--vw-cyan); outline: 1px dotted #0a0b1f; color: #0a0b1f; }

/* ---------- Feature tiles ---------- */
.nl-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); }
.nl-tile { min-width: 0; display: grid; gap: var(--space-2); justify-items: center; background: none; border: 0; padding: 0; cursor: pointer; color: var(--ink); }
.nl-tile-face { width: 100%; aspect-ratio: 1; border-radius: var(--radius-tile); background: var(--surface); display: grid; place-items: center; text-align: center;
  font: 400 14px/1.5 var(--font-body); color: var(--ink); box-shadow: 0 2px 0 rgba(10,11,31,.08); transition: transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast); padding: var(--space-2); }
.nl-tile:hover .nl-tile-face { transform: translateY(-3px); box-shadow: 0 8px 0 var(--vw-pink), 0 8px 24px rgba(255,113,206,.35); }
.nl-tile-label { font: 400 12px/1.3 var(--font-pixel); text-align: center; letter-spacing: -.02em; }
.nl-tile:focus-visible { outline: none; }
.nl-tile:focus-visible .nl-tile-face { outline: 2px solid var(--focus); outline-offset: 3px; }

/* ---------- Text card (inside story windows) ---------- */
.nl-card { border: 4px solid #ffffff; border-radius: var(--radius-card); background: #a9a9a9; padding: var(--space-4); color: #0a0b1f; }
.nl-card h3 { margin: 0 0 var(--space-2); font: 400 24px/1.2 var(--font-pixel); }
.nl-card p { margin: 0; font: 400 14px/1.85 var(--font-body); }

/* ---------- Section scaffolding ---------- */
.nl-section { position: relative; padding: var(--space-12) var(--space-4); overflow: hidden; }
.nl-h-display { font: 400 44px/1 var(--font-pixel); margin: 0; color: #0a0b1f; }
.nl-fade-lines { display: grid; gap: 18px; justify-items: center; }
.nl-fade-lines > * { font: 400 16px/1.6 var(--font-pixel); background: var(--surface); padding: 2px 12px; color: var(--ink); opacity: var(--nl-in, 1); transform: translateY(calc((1 - var(--nl-in, 1)) * 14px)); transition: none; }

/* ---------- Avatar list ---------- */
.nl-list { margin: 0; padding: var(--space-2) var(--space-3); list-style: none; font: 400 16px/2 var(--font-pixel); }
.nl-list li::before { content: "▸ "; color: var(--vw-pink-ink); }

/* ---------- Lightbox / gallery ---------- */
.nl-gallery { position: relative; display: grid; gap: var(--space-3); }
.nl-shot { display: block; padding: 0; border: 0; background: none; cursor: zoom-in; box-shadow: var(--drop-hard); }
.nl-shot img, .nl-shot canvas { display: block; width: 100%; height: auto; }
.nl-shot:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
.nl-overlay { position: fixed; inset: 0; z-index: 60; display: grid; place-items: safe center; overflow: auto; padding: var(--space-4); background: rgba(10,11,31,.55); }
.nl-overlay[hidden] { display: none; }

/* ---------- Footer ---------- */
.nl-footer { position: relative; overflow: hidden; min-height: 560px; }
.nl-footer-links { position: relative; z-index: 2; display: grid; gap: var(--space-8); padding: var(--space-12) var(--space-4); justify-items: start; }
.nl-footer-links a, .nl-footer-links button { font: 400 30px/1.1 var(--font-pixel); color: #0a0b1f; text-decoration: none; background: none; border: 0; padding: 0; cursor: pointer; text-shadow: 2px 2px 0 var(--vw-pink); }
.nl-footer-links a:hover, .nl-footer-links button:hover { text-shadow: 2px 2px 0 var(--vw-cyan), var(--glow-cyan); }
.nl-footer-links :focus-visible { outline: 2px solid var(--focus); outline-offset: 4px; }

@media (prefers-reduced-motion: reduce) {
  .nl-window, .nl-tile-face, .nl-icon svg, .nl-window-scroll b::after { transition: none; }
}