@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=Noto+Sans+KR:wght@400;500;600;700;800&display=swap');
:root{--orange:#ff7900;--white:#f5f7fa;--muted:#a5a6ad;--bg:#090b10}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--white);font-family:'Noto Sans KR',Arial,sans-serif}body.intro-active{overflow:hidden}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}.site{opacity:1;transition:opacity .8s}.intro-active .site{opacity:0;pointer-events:none}.intro{position:fixed;z-index:99;inset:0;background:radial-gradient(ellipse at 50% 88%,#341409 0%,#0b0c12 39%,#050609 78%);display:grid;place-items:center;overflow:hidden;opacity:1;transition:opacity .8s,visibility .8s}.intro.done{opacity:0;visibility:hidden;pointer-events:none}.intro-atmosphere{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 80%,#ff680024,transparent 36%),linear-gradient(90deg,transparent 20%,#ffffff04 50%,transparent 80%);animation:atmo 4.7s ease-in-out both}.intro-ground{position:absolute;bottom:14%;height:2px;width:72%;background:linear-gradient(90deg,transparent,#ff6a00 35%,#ffc070 50%,#ff6a00 65%,transparent);filter:drop-shadow(0 0 18px #ff6400);transform:scaleX(0);animation:ground 1.2s .15s ease-out forwards}.intro-ground:after{content:'';position:absolute;inset:0;box-shadow:0 0 70px 22px #ff65004d}.intro-center{position:relative;display:flex;align-items:center;flex-direction:column;transform:translateY(-4%)}.intro-emblem{width:min(45vw,360px);height:auto;overflow:visible;filter:drop-shadow(0 0 0 transparent);animation:emblemGlow 4.7s both}.outline{fill:none;stroke:#ff8516;stroke-width:1.9;stroke-linejoin:round;stroke-dasharray:700;stroke-dashoffset:700;animation:draw .85s ease-out forwards}.outline-one{animation-delay:.35s}.outline-two{animation-delay:.78s}.outline-three{animation-delay:1.17s}.piece{opacity:0;transform:translateY(5px);transform-origin:center;animation:pieceReveal .55s ease-out forwards}.piece-one{animation-delay:1.65s}.piece-two{animation-delay:1.93s}.piece-three{animation-delay:2.2s}.intro-flash{position:absolute;top:30%;width:75vw;height:2px;transform:scaleX(0);background:linear-gradient(90deg,transparent,#fff,#ff7800,#fff,transparent);box-shadow:0 0 18px 5px #ff7200;animation:flash .65s 2.35s ease-out both;pointer-events:none}.intro-wordmark{font:900 clamp(50px,9vw,116px)/1 'Barlow Condensed',Arial,sans-serif;letter-spacing:.07em;transform:translateY(16px);opacity:0;animation:wordReveal .7s 2.85s forwards;text-shadow:0 2px 24px #ffffff1b}.intro-wordmark span,.brand-text>span{color:var(--orange)}.intro-games{margin-top:12px;display:flex;align-items:center;gap:25px;font:600 clamp(12px,2vw,22px) 'Barlow Condensed',sans-serif;letter-spacing:.7em;color:#b9b9bf;opacity:0;animation:wordReveal .6s 3.35s forwards}.intro-games i{display:block;width:65px;height:1px;background:linear-gradient(90deg,transparent,#c3c3ca)}.intro-games i:last-child{transform:rotate(180deg)}.skip-intro{position:absolute;right:clamp(20px,4vw,60px);top:36px;border:1px solid #ffffff44;border-radius:40px;padding:12px 18px;background:#11151baa;color:#fff;font:600 12px Arial;letter-spacing:.12em}.skip-intro:hover{border-color:var(--orange)}.skip-intro span{color:var(--orange);margin-left:8px}.intro-footnote{position:absolute;bottom:30px;color:#aaa5a0;font:500 11px Arial;letter-spacing:.3em}.intro-sparks{position:absolute;inset:0;pointer-events:none}.spark{position:absolute;bottom:12%;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;background:#ff7b13;box-shadow:0 0 12px #ff8c27;opacity:0;animation:sparkUp var(--d) var(--delay) ease-out infinite}
@keyframes draw{to{stroke-dashoffset:0}}@keyframes pieceReveal{0%{opacity:0;transform:translateY(7px);filter:brightness(3)}100%{opacity:1;transform:none;filter:brightness(1)}}@keyframes flash{0%{opacity:0;transform:scaleX(0)}45%{opacity:1;transform:scaleX(1)}100%{opacity:0;transform:scaleX(1.2)}}@keyframes wordReveal{to{opacity:1;transform:translateY(0)}}@keyframes emblemGlow{0%,50%{filter:drop-shadow(0 0 0 transparent)}55%{filter:drop-shadow(0 0 35px #ff7800)}75%,100%{filter:drop-shadow(0 0 8px #ff730050)}}@keyframes ground{to{transform:scaleX(1)}}@keyframes atmo{0%{opacity:0}35%,80%{opacity:1}100%{opacity:.7}}@keyframes sparkUp{0%{opacity:0;transform:translateY(0) scale(.4)}20%{opacity:.7}100%{opacity:0;transform:translateY(-50vh) translateX(30px) scale(.1)}}
.topbar{height:82px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 clamp(20px,5vw,85px);background:#08090ce8;border-bottom:1px solid #ffffff15;position:relative;z-index:3}.brand{display:flex;align-items:center;gap:8px}.brand svg{width:55px;height:48px}.brand-text{font:900 30px/.75 'Barlow Condensed',Arial,sans-serif;letter-spacing:.08em}.brand-text small{display:block;text-align:center;color:#bbb;font:600 9px/2 Arial;letter-spacing:.34em}.topbar nav{display:flex;gap:clamp(15px,3.4vw,55px);height:100%;align-items:center}.topbar nav a{font:700 13px Arial,sans-serif;letter-spacing:.06em;position:relative;padding:30px 0}.topbar nav a:hover,.topbar nav a.active{color:#fff}.topbar nav a.active:after,.topbar nav a:hover:after{content:'';position:absolute;bottom:13px;left:0;right:0;height:2px;background:var(--orange);box-shadow:0 0 14px var(--orange)}.replay{border:1px solid #343741;background:#14161d;border-radius:30px;color:#ddd;padding:10px 15px;font-size:12px;white-space:nowrap}.replay:hover{border-color:var(--orange)}.hero{position:relative;min-height:min(800px,calc(100svh - 82px));height:clamp(610px,72vw,820px);display:flex;flex-direction:column;justify-content:center;overflow:hidden}.hero-art{position:absolute;inset:0;background-image:url('little-big-crusher.webp');background-size:cover;background-position:62% center;transform:scale(1.015);animation:heroIn 1.6s ease-out both}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#080b14f5 0%,#080b14dc 23%,#080b1488 40%,transparent 75%),linear-gradient(0deg,#08090ff0 0%,transparent 27%,transparent 75%,#08090c60 100%)}@keyframes heroIn{from{opacity:.4;transform:scale(1.07)}to{opacity:1;transform:scale(1.015)}}.hero-copy{position:relative;z-index:1;margin-left:clamp(24px,7vw,120px);margin-top:-65px;max-width:550px}.eyebrow{color:var(--orange);font:800 14px Arial,sans-serif;letter-spacing:.12em}.eyebrow-line{display:inline-block;width:25px;height:2px;background:var(--orange);vertical-align:middle;margin-right:12px}.hero h1{font:italic 900 clamp(66px,7vw,112px)/.91 'Barlow Condensed',Arial,sans-serif;letter-spacing:.005em;margin:22px 0 26px;text-shadow:0 5px 25px #0008}.hero h1 em{font-style:italic}.lead{font-size:23px;font-weight:800;margin:0 0 8px}.sublead{font-size:15px;line-height:1.9;color:#e4e3e6;margin:0}.actions{display:flex;gap:13px;flex-wrap:wrap;margin-top:30px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:17px;border-radius:40px;padding:16px 24px;font-weight:700;font-size:14px}.btn.primary{background:linear-gradient(135deg,#ff9d00,#ff6500);box-shadow:0 5px 25px #ff6d0038}.btn.secondary{border:1px solid #ffffffb0;background:#07080b75}.btn:hover{transform:translateY(-2px)}.hero-bottom{position:absolute;z-index:1;bottom:30px;left:clamp(24px,5vw,85px);right:clamp(24px,5vw,85px);background:#0d0e14dc;border:1px solid #ffffff24;border-radius:18px;padding:22px 28px;display:flex;align-items:center;justify-content:space-between;gap:20px;backdrop-filter:blur(12px)}.feature-mini{display:flex;align-items:center;gap:13px}.feature-mini .mini-icon{font-size:30px;color:#ff9100}.feature-mini b{display:block;font-size:14px}.feature-mini small{display:block;color:#b3b4bb;font-size:11px;margin-top:4px}.soon{border-radius:40px;background:linear-gradient(120deg,#ff9e00,#ff6200);padding:12px 18px;white-space:nowrap;font:800 13px Arial;letter-spacing:.05em}.section{padding:110px clamp(24px,7vw,120px)}.games-section{background:linear-gradient(180deg,#0a0b10,#131720)}.section-heading h2,.about-section h2,.support-section h2{font:900 clamp(48px,6vw,88px)/.96 'Barlow Condensed',Arial,sans-serif;margin:15px 0 20px}.section h2 span{color:var(--orange)}.section-heading>p:last-child,.support-section p:not(.eyebrow){color:#b6b9c1;font-size:15px}.game-card{margin-top:45px;display:grid;grid-template-columns:1.3fr 1fr;background:#171a22;border:1px solid #ffffff19;border-radius:22px;overflow:hidden}.game-card img{width:100%;height:100%;min-height:360px;object-fit:cover}.game-details{padding:clamp(25px,4vw,60px);display:flex;flex-direction:column;justify-content:center}.tag{color:#ff9400;font:800 12px Arial;letter-spacing:.13em}.game-details h3{font:900 48px/.95 'Barlow Condensed',sans-serif;margin:22px 0}.game-details p{line-height:1.85;color:#c1c3ca;font-size:14px}.tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:20px}.tags span{border:1px solid #ffffff30;border-radius:30px;padding:8px 10px;font:700 10px Arial;letter-spacing:.06em}.game-details .availability{margin-top:28px;color:#ffad60}.about-section{display:grid;grid-template-columns:1fr 1fr;gap:70px;background:#0b0d13}.about-copy{padding-top:50px}.about-copy p{color:#c4c6ce;line-height:2;font-size:16px}.about-copy strong{color:#fff}.about-rule{border-top:1px solid #ffffff24;margin-top:40px;padding-top:18px;display:flex;justify-content:space-between;gap:10px;color:#888b95;font:600 11px Arial;letter-spacing:.07em}.support-section{background:#151923;display:flex;align-items:center;justify-content:space-between;gap:30px}.support-links{min-width:250px;display:grid;gap:10px}.support-links a{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid #ffffff33;padding:16px 5px;font-size:14px}.support-links a:hover{color:var(--orange)}footer{display:flex;justify-content:space-between;gap:20px;padding:30px clamp(24px,7vw,120px);color:#888c95;font:600 11px Arial;letter-spacing:.06em}
@media(max-width:850px){.topbar{height:72px}.topbar nav{gap:14px}.topbar nav a{font-size:11px}.replay span{display:none}.hero{height:720px;min-height:650px}.hero-art{background-position:60% 32%}.hero-shade{background:linear-gradient(90deg,#080b14f0,#080b1470 70%,#080b1433),linear-gradient(0deg,#08090ff5,transparent 42%)}.hero-copy{margin-top:-100px}.hero-bottom{flex-wrap:wrap}.feature-mini{flex:1 1 40%}.game-card{grid-template-columns:1fr}.game-card img{min-height:0;aspect-ratio:2/1}.about-section{grid-template-columns:1fr;gap:0}.about-copy{padding-top:0}}
@media(max-width:550px){.topbar{padding:0 16px}.brand svg{width:40px}.brand-text{font-size:22px}.brand-text small{font-size:7px}.topbar nav{gap:11px}.topbar nav a{font-size:10px}.topbar nav a:nth-child(3),.topbar nav a:nth-child(4){display:none}.replay{padding:7px 10px}.hero{height:790px}.hero-art{background-size:auto 65%;background-repeat:no-repeat;background-position:center top;background-color:#0b0c14}.hero-shade{background:linear-gradient(0deg,#08090f 15%,#08090fdd 39%,transparent 70%)}.hero-copy{margin:170px 22px 0;align-self:flex-start}.hero h1{font-size:68px}.lead{font-size:19px}.sublead{font-size:13px}.hero-bottom{left:14px;right:14px;bottom:18px;padding:14px}.feature-mini{flex:1 1 44%}.feature-mini:nth-child(3){display:none}.feature-mini .mini-icon{font-size:23px}.feature-mini b{font-size:12px}.feature-mini small{font-size:10px}.soon{font-size:10px;padding:10px}.section{padding:70px 20px}.section-heading h2{font-size:55px}.game-details h3{font-size:40px}.support-section{display:block}.support-links{margin-top:30px}footer{flex-direction:column}.intro-emblem{width:65vw}.intro-wordmark{font-size:65px}.intro-games{gap:12px;letter-spacing:.5em}.intro-games i{width:35px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-delay:0ms!important;transition-duration:.01ms!important}}


/* Clean single-source logo animation: JavaScript controls the drawing and fill. */
.intro-logo-asset{position:relative;width:min(48vw,430px);aspect-ratio:256/157;isolation:isolate}
.logo-trace,.intro-logo-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.logo-trace{z-index:2;overflow:visible;filter:drop-shadow(0 0 3px #ff7900)}
.trace-path{fill:none;stroke:#ff992c;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:butt;animation:none!important;transition:none!important}
.intro-logo-image{z-index:1;opacity:0;clip-path:circle(0% at 50% 50%);animation:none!important;transition:none!important}
.intro-wordmark,.intro-games,.intro-flash,.intro-ground{animation:none!important;transition:none!important}
.brand-logo-image{width:57px;height:42px;object-fit:contain}
@media(max-width:550px){.intro-logo-asset{width:78vw}.brand-logo-image{width:40px;height:32px}}

/* Reference-led vector intro: centered, crisp, with no screen-recording imagery. */
.intro{background:radial-gradient(ellipse 60% 23% at 50% 74%,#1c0b08 0%,#090a0e 58%,#050608 100%)}
.intro-center{width:100%;transform:translateY(-2%);z-index:2}
.intro-logo-asset{width:clamp(210px,29vw,385px);aspect-ratio:256/157}
.logo-trace{filter:drop-shadow(0 0 2px rgba(255,109,34,.75));z-index:3}
.trace-path{stroke:#ff8b43;stroke-width:1.05;stroke-linejoin:round;stroke-linecap:round;fill:none}
.intro-logo-image{z-index:2;object-fit:contain;image-rendering:auto}
.intro-ground{bottom:24%;width:min(72vw,920px);height:2px;background:linear-gradient(90deg,transparent 0%,#ff4900 34%,#ff9a50 50%,#ff4900 66%,transparent 100%);filter:drop-shadow(0 0 11px #ff5100)}
.intro-ground:after{box-shadow:0 0 35px 12px #ff49004a}
.intro-wordmark{font-family:Arial,Helvetica,sans-serif;font-size:clamp(37px,5.1vw,66px);font-weight:800;letter-spacing:.17em;margin-top:0;text-shadow:0 0 18px #ffffff18}
.intro-wordmark span{color:inherit}
.intro-games{font-family:Arial,Helvetica,sans-serif;font-size:clamp(9px,1vw,13px);letter-spacing:.55em;margin-top:7px;gap:15px}
.intro-games i{width:28px}
.intro-flash{top:31%;width:min(64vw,650px)}
.intro-atmosphere{animation:none}
@media(max-width:550px){
 .intro-logo-asset{width:min(72vw,340px)}
 .intro-wordmark{font-size:clamp(34px,9vw,52px)}
 .intro-ground{bottom:29%;width:90vw}
}

/* Geometrically straight, manually reconstructed polygon boundaries. */
.logo-trace .trace-path{stroke-linejoin:round;stroke-linecap:round;stroke-width:1.1;vector-effect:non-scaling-stroke}

/* Prevent CSS from animating the drawn stroke: only JS grows visible dash length. */
.logo-trace .trace-path{animation:none!important;transition:none!important;stroke-dashoffset:0}

/* Only the visible stroke grows; the gap is > entire path and never repeats. */
.logo-trace .trace-path{stroke-dashoffset:0!important;animation:none!important;transition:none!important}

/* Complete outlines, drawn by expanding each straight line segment; no dash pattern. */
.logo-trace .outline-edge{stroke:#ff8b43;stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;fill:none}
.logo-trace .outline-polygon{transition:none!important;animation:none!important}
