@font-face{font-family:Righteous;src:url(/fonts/Righteous.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:PixelCode;src:url(/fonts/pixelcode.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}html,body,#root{height:100%;margin:0}*{box-sizing:border-box}body{background:#0b0d16;color:#e6e6f0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif}.stage{position:fixed;inset:0;display:grid;place-items:center;padding:16px}.stage-inner{position:relative;width:100%;height:100%;max-width:1600px}.frame{position:absolute;inset:0;background:#000;border:12px solid var(--c1,#ffea00);box-shadow:inset 0 0 0 6px var(--c2,#ff003b),0 0 0 6px var(--c2,#ff003b);border-radius:12px;overflow:hidden}.frame.chaos{animation:zxFrame 1.2s steps(2,end) infinite}@keyframes zxFrame{0%{--c1:#ffea00;--c2:#ff003b}50%{--c1:#00e5ff;--c2:#7c3aed}to{--c1:#ffea00;--c2:#ff003b}}.frame-controls{position:absolute;left:16px;right:16px;top:10px;display:flex;justify-content:space-between;align-items:center;gap:10px;z-index:3}.contact-btn,.pirate-btn{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:10px;text-decoration:none;font-family:PixelCode,monospace;font-size:14px;letter-spacing:.02em;box-shadow:0 8px 20px #00000059}.contact-btn{background:#101745;border:2px solid #2c3a85;color:#dbeafe}.pirate-btn{background:#21161a;border:2px solid #5a2a36;color:#ffdbe6}.contact-btn img{width:18px;height:18px;image-rendering:pixelated;filter:drop-shadow(0 0 3px rgba(0,0,0,.8))}.pirate-btn img{width:22px;height:22px;image-rendering:pixelated}.site-header{position:absolute;left:24px;right:24px;top:50px;text-align:center;z-index:2}.site-title{font-family:Righteous,sans-serif;font-size:clamp(28px,4.2vw,56px);letter-spacing:.06em;margin:0;color:#c6ff00;text-shadow:0 0 0 #000,2px 2px 0 #000,-2px -2px 0 #000,-2px 2px 0 #000,2px -2px 0 #000,0 0 14px rgba(198,255,0,.35)}.site-sub{margin:6px 0 0;color:#86efac;font-family:PixelCode,monospace;font-size:clamp(12px,1.4vw,16px);text-shadow:0 1px 0 #000}.toolbar{margin:8px auto 0;display:flex;justify-content:center;gap:12px}.btn{background:#c6ff00;color:#0b0d16;border:none;font-weight:800;padding:8px 14px;border-radius:9999px;cursor:pointer;font-family:PixelCode,monospace}:root{--g: 18px;--tile: clamp(240px, 24vw, 300px)}.grid{display:grid;grid-template-columns:repeat(4,var(--tile));grid-auto-rows:var(--tile);gap:var(--g);width:calc(var(--tile)*4 + var(--g)*3);max-width:100%;justify-content:center}.grid-wrap{position:absolute;inset:270px 24px 24px;display:flex;justify-content:center;align-items:flex-start;z-index:2}@media (max-width: 1100px){:root{--tile: clamp(180px, 44vw, 260px)}.grid{grid-template-columns:repeat(2,var(--tile));width:calc(var(--tile) * 2 + var(--g))}}.tile{position:relative;aspect-ratio:1/1;background-size:cover;background-position:center;border:3px solid #fff;border-radius:12px;overflow:hidden;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease;box-shadow:0 6px 20px #00000040}.tile:hover{transform:scale(1.02);box-shadow:0 10px 28px #00000059}.tile-title{position:absolute;top:8px;left:50%;transform:translate(-50%);margin:0;font-family:PixelCode,monospace;font-size:clamp(16px,2.1vw,24px);letter-spacing:.02em;color:#fff;text-shadow:2px 2px 0 #000;background:#00000059;padding:6px 10px;border-radius:8px}.float-layer{position:absolute;inset:0;z-index:3;pointer-events:none}.float-tile{position:absolute;width:clamp(240px,24vw,300px);aspect-ratio:1 / 1;border:3px solid #fff;border-radius:12px;overflow:hidden;background-size:cover;background-position:center;box-shadow:0 10px 28px #00000059;pointer-events:auto;animation-timing-function:linear;animation-iteration-count:infinite;image-rendering:pixelated}@keyframes drift1{0%{transform:translate(-8vw,-6vh)}to{transform:translate(8vw,6vh)}}@keyframes drift2{0%{transform:translate(6vw,-8vh)}to{transform:translate(-6vw,8vh)}}.sprite-layer{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:1}.sprite{position:absolute;width:56px;height:auto;image-rendering:pixelated;filter:drop-shadow(0 0 4px rgba(0,0,0,.8));animation-timing-function:linear,ease-in-out;animation-iteration-count:infinite,infinite}.sprite.goR{animation-name:diagR,bobble}.sprite.goL{animation-name:diagL,bobble}@keyframes diagR{0%{left:-80px;top:100vh}to{left:120vw;top:-20vh}}@keyframes diagL{0%{left:110vw;top:100vh}to{left:-120px;top:-20vh}}@keyframes bobble{0%,to{margin-top:0}50%{margin-top:-6px}}.site-title .letter{display:inline-block;will-change:transform,text-shadow,filter}.site-title.glitchy .letter{animation:titleGlitch .9s steps(2,end) infinite,titleDrip 1.4s ease-in-out infinite;animation-delay:calc(var(--i) * 35ms);text-shadow:2px 0 0 rgba(255,0,128,.6),-2px 0 0 rgba(0,255,255,.6),0 2px 0 rgba(255,255,0,.4),0 0 0 #000}.site-title.glitchy .letter:nth-child(3n){animation-duration:.7s,1.2s;filter:contrast(1.2) saturate(1.2)}@keyframes titleGlitch{0%{transform:translate(0) skew(0)}20%{transform:translate(-1px) skew(-1deg)}40%{transform:translate(2px) skew(1.2deg)}60%{transform:translate(-2px) skew(-.8deg)}80%{transform:translate(1px) skew(.6deg)}to{transform:translate(0) skew(0)}}@keyframes titleDrip{0%{transform:translateY(0)}45%{transform:translateY(3px)}55%{transform:translateY(4px)}to{transform:translateY(0)}}.section{min-height:100%;padding:24px;max-width:1200px;margin:0 auto}.section h1{font-family:Righteous,sans-serif;letter-spacing:.06em;color:#c6ff00;margin:10px 0 6px}.section .sub{font-family:PixelCode,monospace;color:#86efac;margin:0 0 16px}.section .list a{display:block;padding:10px 12px;border:1px solid #ffffff20;border-radius:10px;margin:10px 0;text-decoration:none;color:#e6e6f0;background:#0f1320bb;font-family:PixelCode,monospace}.section .list a small{display:block;opacity:.85;color:#a6e3ff;margin-top:4px}.section .back{display:inline-block;margin-top:10px;color:#a6e3ff;text-decoration:none;font-family:PixelCode,monospace}.story-content{font-family:IBM Plex Mono,monospace;font-size:18px;line-height:1.7;color:#fff;background:#000;padding:20px;white-space:pre-line}.story-content em{font-style:italic}.tabs{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 14px}.tab{font-family:PixelCode,monospace;border:1px solid #ffffff30;background:#111624;color:#e6e6f0;padding:8px 12px;border-radius:12px;cursor:pointer}.tab.active{background:#c6ff00;color:#0b0d16;border-color:transparent}.bioPanel{border:1px solid #ffffff25;background:#0f1320;border-radius:12px;padding:16px;font-family:PixelCode,monospace}.sec-root{position:fixed;inset:0;overflow:hidden}.sec-content{position:relative;min-height:100%;display:flex;flex-direction:column}.sec-header{z-index:2}.sec-body{flex:1;overflow:auto;padding:clamp(14px,2.6vw,36px);scroll-behavior:smooth}.sec-body:before,.sec-body:after{content:"";position:sticky;left:0;right:0;display:block;height:26px;z-index:1;pointer-events:none}.sec-body:before{top:0;background:linear-gradient(#000a,transparent);margin-top:-14px}.sec-body:after{bottom:0;background:linear-gradient(transparent,#000a);margin-bottom:-14px}.sec-body::-webkit-scrollbar{height:10px;width:10px}.sec-body::-webkit-scrollbar-track{background:#0b0d16}.sec-body::-webkit-scrollbar-thumb{background:#2c3a85;border:2px solid #0b0d16}.items{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}.sec-body.row{overflow-x:auto;overflow-y:hidden}.sec-body.row .items{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(260px,28vw,360px);gap:12px;padding-bottom:8px;scroll-snap-type:x mandatory}.sec-body.row .item{scroll-snap-align:start}
