@import "https://fonts.googleapis.com/css2?family=Anton&family=Plus+Jakarta+Sans:ital,wght@0,300..700;1,300..700&family=Syne:wght@400..800&display=swap";.game-hud-wrapper{flex-direction:column;align-items:center;width:100%;height:calc(100vh - 72px);padding:20px;display:flex;overflow-y:auto}.no-games-found{text-align:center;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:24px;width:100%;max-width:600px;margin:0 auto;padding:60px 24px;box-shadow:0 10px 30px #0f172a08}.no-games-found h3{color:var(--text-main);margin-bottom:12px;font-size:1.8rem}.no-games-found p{color:var(--text-muted);font-size:1.05rem}.game-layout-main{flex:1;width:100%;height:auto;min-height:calc(100vh - 54px);display:flex;position:relative}.game-side-ad{background:#0f172a66;flex-direction:column;justify-content:center;align-items:center;width:240px;min-width:240px;padding:16px;display:flex}.game-side-ad.left-ad{border-right:1px solid #ffffff14}.game-side-ad.right-ad{border-left:1px solid #ffffff14}.game-canvas-area{flex-direction:column;flex:1;justify-content:flex-start;align-items:center;padding:20px;display:flex;position:relative}@media (width<=1150px){.game-side-ad{display:none!important}}:root{--bg-deep:#f8fafc;--text-main:#0f172a;--text-muted:#475569;--accent:#ea580c;--accent-hover:#c2410c;--glass-bg:#ffffffc7;--glass-border:#0f172a14;--glass-highlight:#ea580c26;--font-primary-heading:"Syne", sans-serif;--font-primary-body:"Plus Jakarta Sans", sans-serif;--font-logo:"Syne", sans-serif;--font-anton:"Anton", sans-serif}*{box-sizing:border-box;scroll-behavior:smooth;margin:0;padding:0}body{font-family:var(--font-primary-body);background-color:var(--bg-deep);color:var(--text-main);-webkit-font-smoothing:antialiased;background-image:radial-gradient(circle at 15% 10%,#ea580c0f,#0000 40%),radial-gradient(circle at 85% 80%,#0f172a0a,#0000 45%);background-attachment:fixed;margin:0;padding:0;line-height:1.6;overflow-x:hidden}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-deep)}::-webkit-scrollbar-thumb{background:#0f172a33;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--accent)}h1{font-family:var(--font-primary-heading);letter-spacing:-.03em;text-transform:uppercase;color:var(--text-main);white-space:normal;word-break:keep-all;margin-bottom:1.5rem;font-size:clamp(2.2rem,4.8vw,4.2rem);font-weight:800;line-height:1.05}h2{font-family:var(--font-primary-heading);text-transform:uppercase;letter-spacing:-.02em;color:var(--text-main);border-bottom:1px solid #0f172a0f;margin-bottom:2.5rem;padding-bottom:.75rem;font-size:clamp(2rem,4vw,3.5rem);font-weight:700}h3{font-family:var(--font-primary-heading);text-transform:uppercase;letter-spacing:-.01em;color:var(--text-main);margin-bottom:.75rem;font-size:1.5rem;font-weight:700}p{font-family:var(--font-primary-body);color:var(--text-muted);font-size:1.05rem;font-weight:400}@media (pointer:fine){body,a,button,.bento-card,select{cursor:none!important}input,textarea{cursor:text!important}}.custom-cursor-dot{background-color:var(--accent);pointer-events:none;z-index:9999999;border-radius:50%;width:6px;height:6px;position:fixed;top:0;left:0;transform:translate(-50%,-50%)}.custom-cursor-circle{border:1.5px solid var(--accent);pointer-events:none;z-index:9999998;mix-blend-mode:difference;border-radius:50%;width:36px;height:36px;transition:width .3s cubic-bezier(.16,1,.3,1),height .3s cubic-bezier(.16,1,.3,1),background-color .3s,border-color .3s;position:fixed;top:0;left:0;transform:translate(-50%,-50%)}.custom-cursor-circle.cursor-hover-active{background-color:var(--glass-highlight);border-color:#0000;width:60px;height:60px}@media (pointer:coarse){.custom-cursor-dot,.custom-cursor-circle{display:none!important}body,a,button,.bento-card{cursor:auto!important}}.brand-logo-container{pointer-events:auto;flex-direction:column;align-items:flex-start;text-decoration:none;display:flex}.brand-logo-main{font-family:var(--font-primary-heading);text-transform:uppercase;letter-spacing:-.02em;color:var(--text-main);font-size:1.25rem;font-weight:800;line-height:.95;transition:color .3s}.brand-logo-sub{font-family:var(--font-primary-heading);text-transform:uppercase;letter-spacing:.14em;color:var(--accent);border-top:1px solid var(--glass-border);width:100%;margin-top:.12rem;padding-top:.12rem;font-size:.75rem;font-weight:300;line-height:1;transition:border-color .3s}.brand-logo-container:hover .brand-logo-main{color:var(--accent)}.brand-logo-container:hover .brand-logo-sub{color:var(--text-main);border-color:var(--accent)}.navbar{background:var(--glass-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--glass-border);z-index:1000;border-radius:50px;justify-content:space-between;align-items:center;width:90%;max-width:1100px;padding:.9rem 2.5rem;display:flex;position:fixed;top:1.5rem;left:50%;transform:translate(-50%);box-shadow:0 10px 40px #0f172a0a}.nav-links{align-items:center;gap:2.2rem;list-style:none;display:flex}.nav-links a,.nav-links button{color:var(--text-main);opacity:.75;text-transform:uppercase;letter-spacing:.05em;font-size:.92rem;font-weight:600;font-family:var(--font-primary-heading);background:0 0;border:none;align-items:center;gap:6px;text-decoration:none;transition:all .3s;display:flex}.nav-links a:hover,.nav-links button:hover{opacity:1;color:var(--accent)}.status-badge{font-family:var(--font-primary-heading);text-transform:uppercase;color:#10b981;letter-spacing:.04em;align-items:center;gap:8px;font-size:.82rem;font-weight:700;display:flex}.status-dot{background-color:#10b981;border-radius:50%;width:10px;height:10px;animation:2s infinite pulseStatus;box-shadow:0 0 12px #10b98199}@keyframes pulseStatus{0%{box-shadow:0 0 #10b98180}70%{box-shadow:0 0 0 10px #10b98100}to{box-shadow:0 0 #10b98100}}.landing-stage{z-index:10;justify-content:center;align-items:flex-end;min-height:85vh;padding-top:130px;padding-bottom:4vh;display:flex;position:relative}.hero-content{background:var(--glass-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--glass-border);text-align:center;border-radius:32px;flex-direction:column;align-items:center;width:100%;max-width:1000px;margin:0 auto;padding:4.5rem 4rem;display:flex;box-shadow:0 30px 60px #0f172a0d}.cta-btn{background:var(--text-main);color:#fff;font-family:var(--font-primary-heading);text-transform:uppercase;letter-spacing:.05em;cursor:pointer;border:none;border-radius:30px;align-items:center;gap:10px;padding:1.1rem 2.8rem;font-size:1rem;font-weight:700;text-decoration:none;transition:all .3s cubic-bezier(.16,1,.3,1);display:inline-flex}.cta-btn:hover{background:var(--accent);transform:scale(1.02);box-shadow:0 10px 25px #ea580c40}.scroll-indicator-hint{font-family:var(--font-primary-heading);text-transform:uppercase;letter-spacing:.2em;color:var(--accent);cursor:pointer;margin-top:2rem;font-size:.9rem;font-weight:700;animation:2s infinite bounceHint;display:block}@keyframes bounceHint{0%,to{opacity:.6;transform:translateY(0)}50%{opacity:1;transform:translateY(-8px)}}section{flex-direction:column;justify-content:center;padding:80px 5% 60px;display:flex;position:relative}.container{z-index:20;width:100%;max-width:1200px;margin:0 auto;position:relative}.bento-grid{grid-template-columns:repeat(3,1fr);grid-auto-rows:minmax(240px,auto);gap:1.75rem;width:100%;display:grid}.bento-card{background:var(--glass-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--glass-border);color:var(--text-main);border-radius:24px;flex-direction:column;justify-content:space-between;padding:2.4rem;text-decoration:none;transition:all .4s cubic-bezier(.16,1,.3,1);display:flex;position:relative;overflow:hidden;box-shadow:0 10px 30px #0f172a08}.bento-card:hover{background:#fffffff2;border-color:#ea580c59;transform:translateY(-6px);box-shadow:0 20px 40px #0f172a14}.bento-card .portfolio-badge{font-family:var(--font-primary-heading);background:var(--accent);color:#fff;text-transform:uppercase;letter-spacing:.05em;border-radius:20px;padding:.35rem 1.2rem;font-size:.78rem;font-weight:700;display:inline-block}.bento-card .classic-badge{font-family:var(--font-primary-heading);color:var(--text-main);text-transform:uppercase;letter-spacing:.05em;background:#0f172a14;border-radius:20px;padding:.35rem 1.2rem;font-size:.78rem;font-weight:700;display:inline-block}.bento-card .multiplayer-badge{font-family:var(--font-primary-heading);background:var(--text-main);color:#fff;text-transform:uppercase;letter-spacing:.05em;border-radius:20px;padding:.35rem 1.2rem;font-size:.78rem;font-weight:700;display:inline-block}.bento-card h3{margin-top:1rem;margin-bottom:.6rem;font-size:1.6rem;transition:color .25s}.bento-card:hover h3{color:var(--accent)}.bento-card p{color:var(--text-muted);flex-grow:1;margin-bottom:1.5rem;font-size:.98rem;line-height:1.55}.game-card-tags{flex-wrap:wrap;gap:8px;margin-top:auto;display:flex}.game-card-tag{font-family:var(--font-primary-heading);text-transform:uppercase;color:var(--text-main);letter-spacing:.04em;background:#0f172a0d;border:1px solid #0f172a0f;border-radius:8px;padding:5px 12px;font-size:.75rem;font-weight:700}.bento-card:hover .game-card-tag{color:var(--accent);background:#ea580c14;border-color:#ea580c33}.play-arrow-icon{color:var(--accent);opacity:0;transition:all .3s cubic-bezier(.16,1,.3,1);position:absolute;bottom:24px;right:24px;transform:translate(-12px)}.bento-card:hover .play-arrow-icon{opacity:1;transform:translate(0)}.search-filter-section{background:var(--glass-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--glass-border);border-radius:28px;margin-bottom:3rem;padding:2.5rem;box-shadow:0 15px 35px #0f172a0a}.search-input-wrapper{width:100%;max-width:700px;margin:0 auto 1.8rem;position:relative}.search-input-box{border:1.5px solid var(--glass-border);width:100%;color:var(--text-main);font-size:1.05rem;font-family:var(--font-primary-body);background:#fff;border-radius:50px;outline:none;padding:1.1rem 1.8rem 1.1rem 3.4rem;transition:all .3s;box-shadow:0 4px 20px #0f172a08}.search-input-box:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--glass-highlight)}.search-input-icon{color:var(--text-muted);position:absolute;top:50%;left:1.3rem;transform:translateY(-50%)}.category-filter-pills{flex-wrap:wrap;justify-content:center;gap:.75rem;display:flex}.ecstatic-pill{border:1px solid var(--glass-border);color:var(--text-muted);font-family:var(--font-primary-heading);text-transform:uppercase;letter-spacing:.04em;cursor:pointer;background:#fff;border-radius:50px;align-items:center;gap:8px;padding:.65rem 1.4rem;font-size:.88rem;font-weight:700;transition:all .3s cubic-bezier(.16,1,.3,1);display:flex;box-shadow:0 2px 8px #0f172a05}.ecstatic-pill:hover{background:var(--text-main);color:#fff;border-color:var(--text-main);transform:translateY(-2px)}.ecstatic-pill.active{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 6px 20px #ea580c4d}.minimal-footer{border-top:1px solid var(--glass-border);background:var(--glass-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:20;margin-top:4rem;padding:2.8rem 5%;position:relative}.footer-content{justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;display:flex}.footer-left p{font-family:var(--font-primary-body);color:var(--text-muted);margin:0;font-size:.9rem}.footer-right{gap:2.2rem;display:flex}.footer-right a{font-family:var(--font-primary-heading);text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);font-size:.8rem;font-weight:700;text-decoration:none;transition:color .3s}.footer-right a:hover{color:var(--accent)}.game-container{z-index:2000;background:#0f172a;flex-direction:column;width:100vw;height:100vh;display:flex;position:fixed;inset:0}.game-header-bar{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:2010;background:#0f172aeb;border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;padding:1rem 2.5rem;display:flex}.back-button{color:#fff;font-family:var(--font-primary-heading);text-transform:uppercase;letter-spacing:.05em;cursor:pointer;background:#ffffff14;border:1px solid #ffffff26;border-radius:50px;align-items:center;gap:8px;padding:.65rem 1.5rem;font-size:.9rem;font-weight:700;transition:all .3s;display:flex}.back-button:hover{background:var(--accent);color:#fff;border-color:var(--accent);transform:translate(-4px);box-shadow:0 0 20px #ea580c66}.game-title-badge{font-family:var(--font-primary-heading);color:#fff;letter-spacing:.04em;text-transform:uppercase;font-size:1.35rem;font-weight:800}html,body{max-width:100vw;overflow-x:hidden!important}@media (width<=900px){.navbar{width:95%;padding:.7rem 1.2rem;top:1rem}.nav-links{gap:.9rem}.nav-links a,.nav-links button{font-size:.82rem}.brand-logo-main{font-size:1.1rem}.brand-logo-sub{font-size:.68rem}.bento-grid{grid-template-columns:repeat(2,1fr)}.hero-content{padding:3rem 2rem}}@media (width<=650px){.navbar{border-radius:28px!important;width:96%!important;padding:.5rem .8rem!important;top:.5rem!important}.nav-links{gap:.5rem!important}.status-badge-text,.nav-btn-label{display:none!important}.nav-links a,.nav-links button{padding:6px!important;font-size:.78rem!important}.status-badge span{display:inline-block}.status-badge .status-badge-text{display:none!important}.landing-stage{min-height:auto!important;padding-top:95px!important}.hero-content{border-radius:24px!important;width:96%!important;padding:1.8rem 1.2rem!important}h1{margin-bottom:.8rem!important;font-size:clamp(1.8rem,7.5vw,2.6rem)!important}h2{margin-bottom:1.2rem!important;font-size:clamp(1.4rem,6vw,2rem)!important}.cta-btn{justify-content:center!important;width:100%!important;padding:.85rem 1.6rem!important;font-size:.9rem!important}.bento-grid{grid-template-columns:1fr!important;gap:1.25rem!important}.bento-card{border-radius:20px!important;padding:1.5rem 1.2rem!important}.bento-card h3{font-size:1.3rem!important}.search-filter-section{border-radius:20px!important;margin-bottom:1.5rem!important;padding:1.2rem .8rem!important}.search-input-box{padding:.8rem 1rem .8rem 2.6rem!important;font-size:.9rem!important}.search-input-icon{left:.9rem!important}.category-filter-pills{gap:.4rem!important}.ecstatic-pill{padding:.45rem .85rem!important;font-size:.74rem!important}.game-header-bar{flex-wrap:nowrap!important;justify-content:space-between!important;gap:4px!important;padding:.4rem .6rem!important}.header-btn-label{display:none!important}.game-title-badge{white-space:nowrap;text-overflow:ellipsis;max-width:150px;overflow:hidden;padding:.35rem .65rem!important;font-size:.85rem!important}.back-button{gap:4px!important;padding:.4rem .55rem!important;font-size:.75rem!important}.game-hud-wrapper{flex-shrink:0!important;width:100%!important;padding:6px 6px 0!important;overflow-x:hidden!important}.game-hud-wrapper>div:first-child{text-align:center!important;flex-flow:wrap!important;flex-shrink:0!important;justify-content:space-between!important;align-items:center!important;gap:4px!important;width:100%!important;height:auto!important;margin-bottom:8px!important;padding:6px 10px!important;font-size:.78rem!important;display:flex!important}.game-hud-wrapper>div:first-child>div{text-align:center!important;color:#e2e8f0!important;flex-wrap:wrap!important;flex:auto!important;justify-content:center!important;align-items:center!important;gap:4px!important;width:auto!important;font-size:.78rem!important;display:flex!important}.game-canvas-area{flex-direction:column!important;flex-shrink:0!important;align-items:center!important;width:100%!important;padding:6px 6px 230px!important;display:flex!important;overflow:hidden auto!important}.game-canvas-area>div,.game-hud-wrapper>div:nth-child(2){flex-shrink:0!important;width:calc(100vw - 16px)!important;max-width:700px!important;margin:0 auto!important}.game-canvas-area canvas,.game-hud-wrapper canvas{object-fit:contain!important;touch-action:none!important;border-radius:12px!important;width:100%!important;max-width:calc(100vw - 16px)!important;height:auto!important;min-height:280px!important;max-height:52vh!important;margin:0 auto!important;display:block!important}.game-hud-wrapper div[style*="position: absolute"],.game-canvas-area div[style*="position: absolute"]{flex-direction:column!important;justify-content:center!important;align-items:center!important;padding:8px!important;display:flex!important;inset:0!important;overflow:hidden!important}.game-hud-wrapper div[style*="position: absolute"] h2,.game-canvas-area div[style*="position: absolute"] h2{text-shadow:none!important;margin:0 0 4px!important;font-size:1.15rem!important;line-height:1.1!important}.game-hud-wrapper div[style*="position: absolute"] p,.game-canvas-area div[style*="position: absolute"] p{-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;max-width:95%!important;margin:2px 0!important;font-size:.72rem!important;line-height:1.2!important;display:-webkit-box!important;overflow:hidden!important}.game-hud-wrapper div[style*="position: absolute"]>div,.game-canvas-area div[style*="position: absolute"]>div{flex-wrap:wrap!important;justify-content:center!important;gap:6px!important;margin:4px 0!important;padding:2px!important;display:flex!important}.game-hud-wrapper div[style*="position: absolute"] button,.game-canvas-area div[style*="position: absolute"] button{box-shadow:none!important;border-radius:999px!important;margin:2px!important;padding:5px 12px!important;font-size:.78rem!important;line-height:1.2!important}.game-hud-wrapper div[style*="position: absolute"] button.neon-btn,.game-canvas-area div[style*="position: absolute"] button.neon-btn{margin-top:6px!important;padding:8px 22px!important;font-size:.95rem!important;box-shadow:0 0 15px #00f0ff!important}.virtual-controls-wrapper{bottom:8px!important;left:8px!important;right:8px!important}.touchpad-pads-container{gap:6px!important;max-width:100%!important;padding-bottom:4px!important}.touchpad-grid-pad{border-radius:16px!important;grid-template-rows:46px 46px 46px!important;grid-template-columns:46px 46px 46px!important;gap:4px!important;padding:6px!important}.touchpad-btn{border-radius:10px!important;font-size:.68rem!important;font-weight:700!important}.footer-content{text-align:center!important;flex-direction:column!important;gap:1.5rem!important}.online-modal-backdrop{padding:10px!important}.online-room-modal-box{border-radius:20px!important;max-height:94vh!important;padding:20px 16px!important}.online-modal-close-btn{width:32px!important;height:32px!important;top:12px!important;right:12px!important}.online-room-modal-header{margin-bottom:12px!important;padding-right:32px!important}.online-room-modal-title{font-size:1.15rem!important;line-height:1.25!important}.online-room-join-form{flex-direction:column!important;align-items:stretch!important;gap:8px!important}.online-room-join-form input{box-sizing:border-box!important;flex:none!important;width:100%!important}.online-room-join-form button{box-sizing:border-box!important;flex:none!important;width:100%!important;padding:12px!important}.online-room-code-display{letter-spacing:2px!important;font-size:1.7rem!important}}@media (width<=420px){.navbar{width:98%!important;padding:.45rem .65rem!important}.nav-links{gap:.35rem!important}.brand-logo-main{font-size:.94rem!important}.brand-logo-sub{font-size:.58rem!important}.hero-content{padding:1.4rem .8rem!important}h1{font-size:1.55rem!important}.bento-card{padding:1.2rem .9rem!important}.policy-container{padding:24px 10px!important}.policy-container>div:nth-child(2){padding:20px 14px!important}.policy-container h1{font-size:1.6rem!important}.touchpad-pads-container{gap:4px!important;max-width:100%!important}.touchpad-grid-pad{border-radius:14px!important;grid-template-rows:42px 42px 42px!important;grid-template-columns:42px 42px 42px!important;gap:4px!important;padding:5px!important}.touchpad-btn{border-radius:8px!important;font-size:.62rem!important}.cookie-banner-container{border-radius:16px!important;width:calc(100% - 20px)!important;padding:14px!important;bottom:10px!important}.cookie-banner-actions{flex-direction:column!important;align-items:stretch!important;gap:8px!important}.cookie-banner-actions button{justify-content:center!important;width:100%!important}.cookie-policy-link{justify-content:center!important;margin-right:0!important;padding-bottom:6px!important}.online-room-modal-box{padding:16px 12px!important}.online-room-modal-title{font-size:1.05rem!important}.online-room-code-display{letter-spacing:1px!important;font-size:1.5rem!important}}