/* KM Studio — Holiday Island theme. Art: GPT-generated sprites in img/theme/s/ */
:root{--ink:#2a1407;--cream:#fff6dc;--sea:#16b3c8;--sun:#ffc93c;--coral:#cc2d4d;--leaf:#2f9e55;--wood:#6b3a1e;--night:#2b1b5a;--hs:5px 5px 0 var(--ink);--S:img/theme/s/;--bgimg:url(../img/theme/s/bg_beach.webp)}
@media(orientation:portrait){:root{--bgimg:url(../img/theme/s/bg_beach_p.webp)}}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Mali","Mitr",system-ui,sans-serif;font-weight:500;color:var(--ink);line-height:1.65;background:#0e7d97 var(--bgimg) center/cover fixed;overflow-x:hidden;min-height:100vh;
cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='34' viewBox='0 0 34 34'%3E%3Cg fill='%23ffc93c' stroke='%232a1407' stroke-width='2.2'%3E%3Cellipse cx='17' cy='22' rx='8' ry='6.5'/%3E%3Ccircle cx='7' cy='14' r='3.6'/%3E%3Ccircle cx='13' cy='8' r='3.6'/%3E%3Ccircle cx='21' cy='8' r='3.6'/%3E%3Ccircle cx='27' cy='14' r='3.6'/%3E%3C/g%3E%3C/svg%3E") 6 4,auto}
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:linear-gradient(rgba(6,50,72,.38),rgba(6,50,72,0) 28%,rgba(6,50,72,0) 70%,rgba(6,50,72,.3))}
h1,h2,h3{font-family:"Bagel Fat One","Mitr",sans-serif;font-weight:400;line-height:1.1;margin:0 0 12px}
a{color:inherit}img{max-width:100%;display:block}
:focus-visible{outline:4px solid var(--sun);outline-offset:3px;border-radius:8px}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px;position:relative}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
/* decor sprites */
.deco{position:fixed;z-index:1;pointer-events:none;background:center/contain no-repeat;filter:drop-shadow(0 8px 6px rgba(0,0,0,.25))}
.d-sun{top:84px;right:5vw;width:min(15vw,190px);aspect-ratio:1;background-image:url(../img/theme/s/sun.webp);animation:bob 6s ease-in-out infinite}
.d-cloud1{top:150px;left:-12vw;width:150px;aspect-ratio:1.46;background-image:url(../img/theme/s/cloud.webp);animation:drift 80s linear infinite}
.d-cloud2{top:300px;left:-12vw;width:110px;aspect-ratio:1.46;background-image:url(../img/theme/s/cloud.webp);animation:drift 120s linear -50s infinite;opacity:.9}
.d-umb{left:-14px;bottom:-10px;width:min(15vw,200px);aspect-ratio:1.05;background-image:url(../img/theme/s/umbrella.webp)}
.d-coral{right:-10px;bottom:-8px;width:min(12vw,170px);aspect-ratio:1.15;background-image:url(../img/theme/s/coral.webp)}
@keyframes bob{50%{transform:translateY(-12px) rotate(3deg)}}
@keyframes drift{to{transform:translateX(calc(100vw + 300px))}}
/* nav */
header.nav{position:fixed;top:0;left:0;right:0;z-index:40;padding:12px 0}
.nav .wrap{display:flex;align-items:center;gap:12px;background:var(--cream);border:4px solid var(--ink);border-radius:99px;box-shadow:var(--hs);padding:6px 10px 6px 12px;max-width:1100px}
.brand{display:flex;align-items:center;gap:10px;min-width:48px;min-height:48px;text-decoration:none;font:400 1.5rem "Bagel Fat One","Mitr"}
.brand img{width:46px;height:40px;object-fit:contain;transition:transform .3s}
.brand:hover img{transform:rotate(-12deg) scale(1.1)}
.nav nav{margin-left:auto;display:flex;gap:4px;align-items:center}
.nav nav a{white-space:nowrap;text-decoration:none;font:500 .95rem "Mitr";padding:6px 14px;border-radius:99px;border:3px solid transparent;transition:.15s}
.nav nav a:hover{border-color:var(--ink);background:var(--sun)}
.nav nav a.on{background:var(--ink);color:var(--cream)}
.nav nav a.lock::after{content:" \1F512";font-size:.8em}
.tool{font:600 .85rem "Mitr";background:#0b6b82;color:#fff;border:3px solid var(--ink);border-radius:99px;padding:3px 14px;cursor:inherit;box-shadow:2px 2px 0 var(--ink)}
.tool:active{transform:translate(2px,2px);box-shadow:none}
.tool.snd{background:var(--sun);color:var(--ink);min-width:44px;min-height:34px}.tool{min-height:34px}
/* deck */
html.deckroot,body.deck{height:100%;overflow:hidden;overscroll-behavior:none}
.stage{position:fixed;inset:0;z-index:2}
.scene{position:absolute;inset:0;padding:108px 0 96px;display:flex;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(40px) scale(.97);filter:blur(8px);transition:opacity .5s ease,transform .55s cubic-bezier(.2,.9,.25,1),filter .5s ease,visibility 0s .55s}
.scene::-webkit-scrollbar{display:none}
.scene.before{transform:translateY(-40px) scale(.97)}
.scene.active{opacity:1;visibility:visible;pointer-events:auto;transform:none;filter:none;transition:opacity .45s ease .05s,transform .55s cubic-bezier(.2,.9,.25,1) .05s,filter .45s ease .05s,visibility 0s}
.scene>.wrap{margin:auto;width:100%}
.st{opacity:0;transform:translateY(26px) scale(.97);transition:opacity .4s ease,transform .5s cubic-bezier(.2,1.3,.4,1)}
.scene.active .st{opacity:1;transform:none;transition-delay:calc(.1s + var(--d,0s)*.45)}
/* type */
.title{display:inline-block;position:relative;isolation:isolate;font-size:clamp(1.8rem,4.5vw,3rem);color:#fff;-webkit-text-stroke:7px var(--ink);paint-order:stroke fill;text-shadow:4px 5px 0 var(--ink);padding:2px 30px 2px 18px;margin-bottom:clamp(14px,3vh,28px);transform:rotate(-1.5deg)}
.title::before{content:"";position:absolute;inset:-4px -12px -6px -16px;z-index:-1;background:linear-gradient(90deg,var(--coral),#ff9a3d);border:5px solid var(--ink);transform:skewX(-12deg);box-shadow:6px 6px 0 var(--ink)}
.tag{display:inline-block;background:var(--leaf);color:#fff;font:500 .85rem "Mitr";border:3px solid var(--ink);border-radius:8px;padding:1px 14px;transform:rotate(-2deg);box-shadow:3px 3px 0 var(--ink);margin-bottom:14px}
.note{display:inline-block;background:var(--cream);border:3px solid var(--ink);border-radius:12px;padding:3px 16px;margin:0 0 22px;box-shadow:3px 3px 0 var(--ink)}
.panel{background:var(--cream);border:5px solid var(--ink);border-radius:22px;box-shadow:var(--hs);padding:28px;position:relative}
.panel h2{font-size:1.7rem;color:var(--coral);-webkit-text-stroke:4px var(--ink);paint-order:stroke fill}
.panel p{margin:0 0 12px}.panel p:last-child{margin-bottom:0}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.pill{display:inline-block;background:var(--sun);border:3px solid var(--ink);border-radius:99px;padding:0 14px;font:500 .85rem "Mitr";margin:4px 6px 4px 0}
.btns{display:flex;gap:14px;flex-wrap:wrap;margin-top:22px}
.btn{display:inline-block;text-decoration:none;font:600 1.05rem "Mitr";background:var(--cream);color:var(--ink);padding:12px 28px;border:4px solid var(--ink);border-radius:14px;box-shadow:var(--hs);transition:transform .12s,box-shadow .12s;cursor:inherit}
.btn:hover{transform:translate(-2px,-3px);box-shadow:7px 8px 0 var(--ink)}
.btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}
.btn.hot{background:var(--coral);color:#fff}
.btn.lockbtn{background:var(--night);color:#cdb8ff;box-shadow:var(--hs);opacity:.92}
.btn[disabled],.btn.off{pointer-events:none;filter:saturate(.6)}
/* hero */
.hero>.wrap{display:grid;grid-template-columns:1.05fr 1fr;gap:30px;align-items:center}
.hero h1{font-size:clamp(3.4rem,9.5vw,7rem);line-height:.92;margin:0 0 20px;color:#fff;-webkit-text-stroke:9px var(--ink);paint-order:stroke fill;text-shadow:7px 8px 0 var(--ink)}
.hero h1 span{display:block}.hero h1 .l2{color:var(--sun);font-size:.6em;margin-top:4px}
.lead{font-size:1.1rem;background:var(--cream);border:4px solid var(--ink);border-radius:16px;padding:12px 18px;box-shadow:var(--hs);max-width:30em;margin:0}
.hlogo{display:flex;justify-content:center}
.hlogo .logo{width:100%;max-width:520px;filter:drop-shadow(8px 10px 0 rgba(42,20,7,.9));animation:bob 5s ease-in-out infinite;touch-action:none;cursor:grab}
/* play */
.playgrid{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:34px;align-items:center}
.cabart{width:100%;aspect-ratio:3/4;background:center/contain no-repeat;filter:drop-shadow(0 12px 10px rgba(0,0,0,.32))}
.pbody h2.name{font-size:clamp(1.9rem,3.4vw,2.8rem);color:var(--coral);-webkit-text-stroke:5px var(--ink);paint-order:stroke fill}
.polas{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:20px}
.pola{aspect-ratio:450/316;background:center/contain no-repeat;filter:drop-shadow(0 6px 5px rgba(0,0,0,.3));transition:transform .2s}
.pola:hover{transform:rotate(-3deg) scale(1.06)}
.polacap{display:block;text-align:center;font:500 .75rem "Mitr";margin-top:2px}
/* arcade */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;align-items:start}
.cab{position:relative;display:block;width:100%;text-align:center;text-decoration:none;color:var(--ink);background:none;border:0;padding:0;font:inherit;cursor:inherit}
.cab .art{display:block;aspect-ratio:3/4;background:center/contain no-repeat;filter:drop-shadow(0 12px 10px rgba(0,0,0,.32));transition:transform .25s cubic-bezier(.2,1.6,.4,1)}
.cab:hover .art,.cab:focus-visible .art{transform:translateY(-10px) rotate(-2deg) scale(1.04)}
.cab .plate{display:inline-block;margin-top:6px;background:var(--cream);border:4px solid var(--ink);border-radius:99px;padding:2px 18px;font:400 1.05rem "Bagel Fat One","Mitr";box-shadow:3px 3px 0 var(--ink)}
.cab.live .plate{background:var(--coral);color:#fff}
.cab.soon .plate{background:var(--night);color:#cdb8ff}
.cab .stamp{position:absolute;top:2%;right:2%;z-index:2;background:var(--coral);color:#fff;font:400 .85rem "Bagel Fat One";border:3px solid var(--ink);border-radius:10px;padding:1px 10px;transform:rotate(9deg);box-shadow:3px 3px 0 var(--ink);animation:pop 1.6s ease-in-out infinite}
@keyframes pop{50%{transform:rotate(5deg) scale(1.1)}}
.cab.shake .art{animation:shk .5s}
@keyframes shk{20%{translate:-8px 0}40%{translate:8px 0}60%{translate:-6px 0}80%{translate:6px 0}}
/* about / passport */
.passport{position:absolute;right:-18px;top:-34px;width:96px;transform:rotate(10deg);filter:drop-shadow(3px 4px 0 rgba(0,0,0,.35))}
.ticket{width:150px;margin:8px 0 0;filter:drop-shadow(3px 4px 0 rgba(0,0,0,.3))}
.lockrow{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.lockchip{display:inline-flex;align-items:center;gap:6px;background:var(--night);color:#cdb8ff;border:3px solid var(--ink);border-radius:99px;padding:1px 14px;font:500 .85rem "Mitr"}
.copy{text-align:center;margin:22px 0 0;color:#fff;font:500 .9rem "Mitr";-webkit-text-stroke:3px var(--ink);paint-order:stroke fill}
.copy a{text-decoration:none;margin:0 8px}
/* dots, hint, waves */
.dots{position:fixed;right:18px;top:50%;transform:translateY(-50%);z-index:45;display:flex;flex-direction:column;gap:14px}
.dots a{position:relative;width:18px;height:18px;border-radius:50%;background:var(--cream);border:3px solid var(--ink);box-shadow:2px 2px 0 var(--ink);transition:.3s}
.dots a.on{background:var(--coral);transform:scale(1.45)}
.dots a span{position:absolute;right:30px;top:50%;transform:translateY(-50%) translateX(10px);opacity:0;white-space:nowrap;font:500 .85rem "Mitr";background:var(--cream);border:3px solid var(--ink);border-radius:8px;padding:0 10px;pointer-events:none;transition:.25s}
.dots a:hover span,.dots a:focus-visible span{opacity:1;transform:translateY(-50%)}
.hint{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:44;display:flex;flex-direction:column;align-items:center;font:600 .75rem "Mitr";letter-spacing:.2em;color:#fff;-webkit-text-stroke:3px var(--ink);paint-order:stroke fill;pointer-events:none;transition:opacity .5s}
.hint i{width:14px;height:14px;border-right:5px solid #fff;border-bottom:5px solid #fff;transform:rotate(45deg);filter:drop-shadow(2px 2px 0 var(--ink));animation:hnt 1.2s ease-in-out infinite}
@keyframes hnt{50%{translate:0 8px}}.hint.off{opacity:0}
#eggs{position:fixed;inset:0;z-index:3;pointer-events:none}
.toast{position:fixed;left:50%;bottom:80px;z-index:80;transform:translate(-50%,160px);background:var(--cream);border:4px solid var(--ink);border-radius:14px;box-shadow:var(--hs);padding:8px 20px;font:600 1rem "Mitr";transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.toast.on{transform:translate(-50%,0)}
/* intro + cut-in */
#intro{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;background:#0e7d97 var(--bgimg) center/cover;transition:opacity .5s,transform .5s}
#intro.go{opacity:0;transform:scale(1.08);pointer-events:none}
#intro img{width:min(46vw,240px);animation:ib .6s ease-in-out infinite alternate;filter:drop-shadow(6px 8px 0 rgba(42,20,7,.9))}
@keyframes ib{from{transform:translateY(0) rotate(-6deg)}to{transform:translateY(-22px) rotate(6deg)}}
#intro .nl{font:400 clamp(1.5rem,5vw,2.6rem) "Bagel Fat One","Mitr";color:#fff;-webkit-text-stroke:6px var(--ink);paint-order:stroke fill;text-shadow:4px 4px 0 var(--coral)}
#intro .bar{width:min(70vw,380px);height:20px;border:4px solid var(--ink);background:var(--cream);border-radius:99px;overflow:hidden;box-shadow:var(--hs)}
#intro .bar b{display:block;height:100%;width:0;background:repeating-linear-gradient(45deg,var(--sun) 0 10px,var(--coral) 10px 20px);transition:width .9s cubic-bezier(.2,.8,.2,1)}
#cutin{position:fixed;left:-5%;right:-5%;top:36%;height:26vh;min-height:140px;z-index:120;display:none;align-items:center;justify-content:center;transform:rotate(-4deg);background:linear-gradient(90deg,var(--night),var(--coral) 50%,var(--night));border-block:8px solid var(--cream);box-shadow:0 0 0 5px var(--ink)}
#cutin.on{display:flex;animation:ci 1.6s cubic-bezier(.2,1.2,.3,1) forwards}
#cutin span{font:400 clamp(2rem,8vw,5rem) "Bagel Fat One","Mitr";color:#fff;-webkit-text-stroke:9px var(--ink);paint-order:stroke fill;text-shadow:7px 7px 0 var(--sun);white-space:nowrap}
@keyframes ci{0%{transform:translateX(-120%) rotate(-4deg)}14%,84%{transform:translateX(0) rotate(-4deg)}100%{transform:translateX(130%) rotate(-4deg)}}
.sfx{position:fixed;z-index:90;pointer-events:none;font:400 clamp(1.6rem,5vw,3rem) "Bagel Fat One","Mitr";color:#fff;-webkit-text-stroke:7px var(--ink);paint-order:stroke fill;text-shadow:4px 5px 0 var(--coral);white-space:nowrap;animation:sfx .8s cubic-bezier(.2,1.8,.4,1) forwards}
@keyframes sfx{0%{opacity:0;transform:translate(-50%,-50%) scale(.2) rotate(var(--rot))}25%{opacity:1;transform:translate(-50%,-50%) scale(1.3) rotate(var(--rot))}70%{opacity:1;transform:translate(-50%,-70%) scale(1) rotate(var(--rot))}100%{opacity:0;transform:translate(-50%,-110%) rotate(var(--rot))}}
/* sub pages (account / legal / 404) */
.page{padding:112px 0 60px;position:relative;z-index:2}
.page .panel+.panel{margin-top:22px}
.tabs{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 22px}
.tab{display:inline-flex;align-items:center;gap:8px;text-decoration:none;background:var(--cream);border:4px solid var(--ink);border-radius:14px;padding:6px 18px;font:500 1rem "Mitr";box-shadow:3px 3px 0 var(--ink)}
.tab.on{background:var(--ink);color:var(--cream)}
.tab.locked{background:var(--night);color:#cdb8ff}
.row{display:flex;align-items:center;gap:16px;border:3px solid var(--ink);border-radius:14px;padding:10px 14px;background:#fffdf3;margin:10px 0}
.row .ic{width:56px;height:56px;border-radius:12px;border:3px solid var(--ink);background:#000 center/cover;flex:none}
.row .grow{flex:1}
.row small{display:block;color:#7a5a40}
.badge{display:inline-block;font:500 .75rem "Mitr";border:2px solid var(--ink);border-radius:99px;padding:0 10px;background:var(--sun)}
.badge.lock{background:var(--night);color:#cdb8ff}
.banner{background:var(--sun);border:4px solid var(--ink);border-radius:14px;padding:8px 16px;box-shadow:var(--hs);margin-bottom:22px;font-weight:600}
.legal h2{font-size:1.3rem;margin-top:20px}
.egg404{width:180px;margin:0 auto;animation:roll 3s ease-in-out infinite}
@keyframes roll{0%,100%{transform:translateX(-60px) rotate(-30deg)}50%{transform:translateX(60px) rotate(30deg)}}
@media(max-width:900px){.grid{grid-template-columns:repeat(2,1fr)}.hero>.wrap,.cols,.playgrid{grid-template-columns:1fr}.hlogo{order:-1}.hlogo .logo{max-width:280px}.playgrid .cabart{max-width:200px;margin:0 auto}.d-sun{opacity:.8}.dots{right:8px}}
@media(max-width:520px){.grid{grid-template-columns:repeat(2,1fr);gap:14px}.brand span{display:none}.nav nav a{padding:5px 8px;font-size:.82rem}.nav .wrap{padding:5px 8px;gap:4px}.scene{padding:92px 0 40px}.polas{grid-template-columns:repeat(2,1fr)}.hero h1{-webkit-text-stroke:6px var(--ink);text-shadow:5px 6px 0 var(--ink)}.cab .plate{font-size:.85rem;padding:1px 10px}.panel{padding:20px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.st{opacity:1;transform:none}}
@media(hover:none){body{cursor:auto}}
.qa{border:3px solid var(--ink);border-radius:14px;background:#fffdf3;margin:10px 0;padding:0 16px}
.qa summary{cursor:inherit;font:500 1.05rem "Mitr";padding:12px 0}
.qa p{margin:0 0 14px}
html.calm #eggs{display:none}html.calm .deco{animation:none}html.calm .hlogo .logo{animation:none}
@media(max-width:520px){.nav nav a[href="account.html"],#calmBtn{display:none}.nav nav a{padding:5px 7px;font-size:.8rem}.nav nav{gap:2px}.tool{padding:3px 9px}}
/* KM ID forms */
.frm{display:grid;gap:8px;max-width:420px;margin:12px 0}
.fld{font:500 .9rem "Mitr";margin-top:4px}
.inp{font:500 1rem "Mali","Mitr",sans-serif;padding:10px 14px;border:3px solid var(--ink);border-radius:12px;background:#fff;color:var(--ink);width:100%;min-height:44px}
.inp:focus-visible{outline:4px solid var(--sun);outline-offset:2px}
.chk{display:flex;gap:8px;align-items:flex-start;font-size:.9rem;margin:6px 0}.chk input{width:20px;height:20px;margin-top:3px}
.msg{min-height:1.4em;margin:10px 0 0;font:500 .95rem "Mitr"}.msg.bad{color:#a3122a}.msg.good{color:#146c3a}
.btn.danger{background:#a3122a;color:#fff}
.btn:disabled{opacity:.6;pointer-events:none}
button.tab{cursor:inherit;font-family:inherit}
[hidden]{display:none!important}

.linkbtn{background:none;border:0;color:#0b4a5c;text-decoration:underline;font:500 .95rem 'Mitr';cursor:inherit;padding:8px}
.rcode{font:700 1.6rem 'Mitr',monospace;letter-spacing:.12em;background:#fffdf3;border:4px dashed var(--ink);border-radius:14px;padding:14px;text-align:center;user-select:all;word-break:break-all}

/* ===== Now-playing "game window": the game's own dark-comic look inside the hub frame ===== */
.gamewin{background:#0b0608;border:5px solid var(--ink);border-radius:22px;box-shadow:0 0 0 4px var(--cream),8px 10px 0 4px var(--ink);overflow:hidden;color:#f3ece2}
.gw-media{position:relative;aspect-ratio:16/8.2;max-height:52vh;width:100%;background:#000 url(../video/pnf_trailer_poster.jpg) center/cover}
.gw-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gw-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,6,8,.92) 0,rgba(11,6,8,.55) 42%,rgba(11,6,8,0) 72%),linear-gradient(0deg,rgba(11,6,8,.75),rgba(11,6,8,0) 38%)}
.gw-info{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:clamp(14px,3vw,34px);max-width:min(52%,520px)}
.gw-logo{width:min(100%,440px);height:auto;filter:drop-shadow(0 8px 18px #000)}
.gw-tag{margin:0;font:500 clamp(.9rem,1.5vw,1.1rem) "Mitr";color:#f3ece2;text-shadow:0 2px 8px #000}
.gw-btns{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:4px}
.gw-play{display:inline-block;text-decoration:none;font:700 clamp(1.05rem,2vw,1.4rem) "Mitr";letter-spacing:.04em;color:#fff;background:linear-gradient(135deg,#e11d2e,#a3101e);padding:14px 34px;border:3px solid #fff;transform:skewX(-8deg);box-shadow:5px 5px 0 #000;animation:gwpulse 1.8s ease-in-out infinite;transition:transform .12s}
.gw-play:hover{transform:skewX(-8deg) translate(-2px,-3px)}
@keyframes gwpulse{50%{box-shadow:5px 5px 0 #000,0 0 28px 6px rgba(225,29,46,.75)}}
.gw-more{color:#f3ece2;font:500 1rem "Mitr";text-decoration:underline;padding:8px 6px}
.gw-meta{display:flex;gap:8px;flex-wrap:wrap;margin:0}
.gw-meta span{border:2px solid #e11d2e;padding:0 10px;font:500 .8rem "Mitr";background:rgba(11,6,8,.6)}
.gw-shots{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:12px;background:#140a0d}
.gw-shots img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border:2px solid #f3ece2;display:block}
@media(max-width:700px){.gw-media{aspect-ratio:auto;min-height:60vh;max-height:none}.gw-shade{background:linear-gradient(0deg,rgba(11,6,8,.95) 0,rgba(11,6,8,.55) 55%,rgba(11,6,8,.25))}.gw-info{max-width:none;justify-content:flex-end}.gw-shots{grid-template-columns:repeat(3,1fr);gap:6px;padding:8px}}
@media(prefers-reduced-motion:reduce){.gw-play{animation:none}}

/* ===== PATCH NOT FOUND arcade card: the game's own dark-comic theme, big wordmark ===== */
.cab.pnfcard{position:relative;display:block;aspect-ratio:3/4;border:5px solid var(--ink);border-radius:6px;overflow:hidden;background:#0b0608;box-shadow:0 0 0 3px #f3ece2,9px 11px 0 3px #e11d2e,0 22px 40px rgba(0,0,0,.45);transform:rotate(-1.5deg);transition:transform .25s cubic-bezier(.2,1.6,.4,1),box-shadow .25s}
.cab.pnfcard:hover,.cab.pnfcard:focus-visible{transform:rotate(0) translateY(-10px) scale(1.04);box-shadow:0 0 0 3px #f3ece2,12px 16px 0 3px #e11d2e,0 28px 50px rgba(0,0,0,.5)}
.pnfart{position:absolute;inset:0;background:center 30%/cover no-repeat;transition:transform .8s}
.cab.pnfcard:hover .pnfart{transform:scale(1.08)}
.cab.pnfcard::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(11,6,8,.95) 0,rgba(11,6,8,.5) 34%,rgba(11,6,8,0) 58%);pointer-events:none}
.pnfmark{position:absolute;left:50%;bottom:16%;width:96%;transform:translateX(-50%);z-index:2;height:auto;filter:drop-shadow(0 6px 14px #000)}
.pnfcta{position:absolute;left:50%;bottom:4%;transform:translateX(-50%) skewX(-8deg);z-index:3;white-space:nowrap;background:#d3182a;color:#fff;border:3px solid #fff;font:700 clamp(.85rem,1.3vw,1.1rem) "Mitr";padding:4px 20px;box-shadow:3px 3px 0 #000;animation:gwpulse 1.8s ease-in-out infinite}
.cab.pnfcard .stamp{z-index:4;top:8px;right:8px;background:#e11d2e;border-color:#fff}
@media(max-width:520px){.cab.pnfcard{transform:none}}
@media(prefers-reduced-motion:reduce){.pnfcta{animation:none}}

.pnfvid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .25s;pointer-events:none}.pnfvid.on{opacity:1}

/* trailer modal (hub) */
.gw-trailer{font:600 1rem "Mitr";color:#fff;background:rgba(10,5,8,.55);border:3px solid #f3ece2;padding:10px 22px;cursor:pointer;transform:skewX(-8deg);box-shadow:4px 4px 0 #e11d2e}
.gw-trailer:hover{transform:skewX(-8deg) translate(-2px,-2px);box-shadow:6px 6px 0 #e11d2e}
.trailer-dlg{border:3px solid #f3ece2;background:#000;padding:0;max-width:min(94vw,1100px);width:94vw;box-shadow:8px 8px 0 #e11d2e;overflow:visible}
.trailer-dlg::backdrop{background:rgba(5,2,4,.86)}
.trailer-dlg video,.trailer-dlg iframe{border:0;display:block;width:100%;aspect-ratio:16/9;background:#000}
.trailer-dlg .tr-x{position:absolute;top:-18px;right:-14px;z-index:3;width:40px;height:40px;border-radius:50%;border:3px solid #f3ece2;background:#e11d2e;color:#fff;font:700 1.4rem/1 "Mitr";cursor:pointer}

/* KM ID signed-in chip */
a.kmid-in{display:inline-flex;align-items:center;gap:7px;max-width:190px}
a.kmid-in span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kdot{width:9px;height:9px;border-radius:50%;background:#2ed573;box-shadow:0 0 0 3px rgba(46,213,115,.28);flex:none}
.kadm{font-style:normal;font:700 .62rem/1 "Mitr",sans-serif;letter-spacing:.06em;background:#e11d2e;color:#fff;padding:3px 6px;border-radius:5px;flex:none}