@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');

/* Shared catalog surface, with and without the optional glass treatment. */
:root{--sidebar-w:248px;--bg:#101512;--text:#eff3ee;--muted:#a4b0a7;--accent:#c4e78e}
body,body.ios-glass{--bg-glass:#151b17;--card-glass:#1a221c;--border-glass:#303a31;--border-hover:#79925f;--muted:#a4b0a7;background:#101512;color:#eff3ee;font-family:'DM Sans',sans-serif;background-image:none}
h1,h2,h3,.stat b{font-family:'Manrope',sans-serif}
button,input,select{font-family:inherit}
.bg-text,.bg-text-rocio,.blob{display:none}
.skip-link{position:fixed;left:16px;top:10px;z-index:3000;transform:translateY(-200%);background:var(--accent);color:#182014;padding:12px 20px;border-radius:8px}
.skip-link:focus{transform:translateY(0)}
body:is(.ios-glass, :not(.ios-glass)) .sidebar{background:var(--surface);box-shadow:none;border-right:1px solid #2a332c;padding-top:30px}
.brand{padding:0 22px 22px}
.brand h1{display:flex;align-items:center;gap:9px;font-size:29px;letter-spacing:-1.5px;text-shadow:none}
.brand-symbol{display:inline-grid;place-items:center;width:35px;height:35px;border-radius:9px;background:var(--accent);color:#22301b;font:700 16px monospace;letter-spacing:-2px}
.brand-dot{color:var(--accent);margin-left:-8px}
.brand small{letter-spacing:3px;font-size:9px;margin-top:10px}
.visitor-badge{top:0;right:18px;padding:6px;background:transparent;border:0;box-shadow:none}
.visitor-badge strong{font-size:13px}.visitor-badge span{font-size:8px}
body:is(.ios-glass, :not(.ios-glass)) .language-trigger,body:is(.ios-glass, :not(.ios-glass)) .language-panel{background:#1c251e;border:1px solid #354035;box-shadow:none;border-radius:9px;backdrop-filter:none}
.language-trigger{min-height:38px;padding:8px 12px;text-align:left;font-size:12px}
body:is(.ios-glass, :not(.ios-glass)) .appearance-toggle{margin-top:14px;font-size:12px;min-height:40px;border-radius:9px;background:var(--card-glass);box-shadow:none}
body:is(.ios-glass, :not(.ios-glass)) .device-toggle{margin:16px;padding:4px;border-radius:10px;background:var(--bg);box-shadow:none}
body:is(.ios-glass, :not(.ios-glass)) .dev-btn{font-size:11px;border-radius:7px;min-height:42px;gap:4px;box-shadow:none}
.dev-btn .ico{font-size:14px}
body:is(.ios-glass, :not(.ios-glass)) .dev-btn.active{background:#293625;color:#d5eebe;border:1px solid #435739;box-shadow:none}
body:is(.ios-glass, :not(.ios-glass)) .games-nav{padding:11px 13px;background:#202c20;border-radius:9px;color:var(--accent);font-size:13px;box-shadow:none}
.sidebar-section{padding:6px 12px}.sidebar-title{font-size:9px;letter-spacing:1.8px;padding-top:16px}
.nav-item{font-size:12px;padding:10px;border-radius:7px;min-height:39px;gap:8px}
.nav-item .ico{font-size:14px;width:20px}.nav-item .count{font-size:10px;border-radius:5px;background:#2b352c;color:#b7c4b5}
.nav-item.active{background:#263321;border-color:#3a4a32;color:#d5edc0}.nav-item.active::before{background:var(--accent);width:3px;left:0}
body header{background:var(--surface);box-shadow:none;border-color:#29322b;backdrop-filter:blur(16px)}
.topbar{padding:19px 36px;gap:20px}
.search-top{max-width:600px}
.search-top input{padding:12px 46px 12px 16px;background:#1a211b;border-color:var(--border-glass);border-radius:9px;font-size:13px;box-shadow:none!important}
.search-top input::placeholder{color:#95a193}.search-top svg{width:18px;height:18px}
.catalog-free{margin-left:auto;font-size:11px;color:#b6c4b1;display:flex;align-items:center;gap:8px;white-space:nowrap}
.catalog-free>span{height:6px;width:6px;border-radius:50%;background:var(--accent)}
.hero{padding:30px 36px 0}
body:is(.ios-glass, :not(.ios-glass)) .section-tabs{border:0;background:transparent;border-radius:0;padding:0;box-shadow:none;gap:24px;margin-bottom:34px}
body:is(.ios-glass, :not(.ios-glass)) .section-tabs button{padding:10px 0;background:transparent;border:0;border-bottom:2px solid transparent;border-radius:0;box-shadow:none;font-size:12px;color:#9ea99d}
body:is(.ios-glass, :not(.ios-glass)) .section-tabs button[aria-pressed="true"]{color:var(--accent);border-bottom-color:var(--accent);background:transparent}
.hero-intro{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:38px}
.eyebrow{display:block;color:#a9c78c;font-size:9px;font-weight:700;letter-spacing:2px;margin-bottom:16px}
.hero h2{font-size:clamp(30px,3.7vw,52px);letter-spacing:-2px;line-height:1.13;max-width:560px;text-shadow:none;color:var(--text)}
.hero p{font-size:14px;line-height:1.8;max-width:520px;margin-top:16px}
.code-preview{background:#161d18;border:1px solid #384432;border-radius:12px;overflow:hidden;transform:rotate(2deg);box-shadow:12px 12px 0 #1b2519}
.code-preview-bar{padding:13px 16px;display:flex;gap:5px;align-items:center;border-bottom:1px solid #2b362c}
.code-preview-bar>span{width:6px;height:6px;background:#58664f;border-radius:50%}.code-preview-bar>span:first-child{background:#b08b70}
.code-preview-bar small{margin-left:10px;font:10px monospace;color:#9aa793}
.code-preview pre{background:transparent;border:0;border-radius:0;padding:20px;font-size:12px;color:#c3cfbe;line-height:1.9}
.code-comment{color:#7f917a}.code-keyword{color:var(--accent)}.code-string{color:#dcb995}
.code-preview-foot{display:flex;justify-content:space-between;padding:10px 16px;border-top:1px solid #2b362c;font:9px monospace;color:#93a58a}
.discord-panel{margin-top:34px;background:#1b251a;border:1px solid #35452c;border-radius:10px;padding:18px 22px}
.discord-panel small{color:#b4cf95;font-size:8px;letter-spacing:1.5px}.discord-panel h3{font-size:15px;margin-top:4px}.discord-panel p{font-size:12px;margin-top:4px}
body:is(.ios-glass, :not(.ios-glass)) .discord-panel a{background:var(--accent);color:#22301b;border-radius:7px;padding:12px 16px;font-size:11px;box-shadow:none}
.stats{margin:28px 0 0;padding:0 0 26px;border-bottom:1px solid #2d382e;gap:0}
.stat{padding-right:38px;margin-right:38px;border-right:1px solid #303b2f}.stat:last-child{border:0;margin:0;padding:0}
.stat b{font-size:26px;letter-spacing:-1px;font-variant-numeric:tabular-nums}.stat small{font-size:9px;letter-spacing:1px;color:#97a58f}
.catalog-heading{max-width:1300px;margin:32px auto 0;padding:0 36px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.catalog-heading .eyebrow{font-size:8px;margin-bottom:8px}.catalog-heading h2{font-size:22px;letter-spacing:-.8px}.catalog-heading h2 span{color:var(--accent)}.catalog-heading a{color:#a6b59a;font-size:11px;text-underline-offset:4px}
.catalog-tools{max-width:1228px;margin:22px 36px 0;padding:16px;background:#171f19;border:1px solid #2d382e;border-radius:10px;gap:12px;align-items:end}
#resultCount{flex-basis:100%;font-size:12px;color:#c6d2bf;padding-bottom:2px}
.catalog-tools label{display:grid;gap:7px;font-size:10px;flex:1;min-width:110px}
.catalog-tools select,.catalog-tools button{background:#202a21;color:#d0dac9;border:1px solid #3b4837;border-radius:6px;font-size:11px;min-height:38px;padding:8px;max-width:100%;cursor:pointer}
.catalog-tools button{color:var(--accent);background:transparent;font-size:10px;min-height:38px}
.compat-note{margin:18px 36px;font-size:10px;line-height:1.8;border-color:#627e4e;padding:8px 14px;color:#9eac96}
.active-filters:empty{display:none}.chip{background:#293722;color:#d1e8bb;border-color:#425638}
body:is(.ios-glass, :not(.ios-glass)) .grid{padding:24px 36px;gap:16px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
body:is(.ios-glass, :not(.ios-glass)) .card{border-radius:12px;background:var(--card-glass);border:1px solid #303b30;backdrop-filter:none;box-shadow:none;padding:20px;display:flex;flex-direction:column;transition:transform .2s ease,opacity .3s ease,border-color .2s ease}
body:is(.ios-glass, :not(.ios-glass)) .card:hover{background:#1e281f;border-color:#78945f;transform:translateY(-4px);box-shadow:0 10px 25px #080d0a55}
.badge{border-radius:4px;font-size:8px;padding:4px 6px;letter-spacing:.4px}.badge.free{background:#2c3c23;color:var(--accent);border:1px solid #425734}.badge.pc,.badge.mobile,.badge.both,.badge.loadstring{background:#252e25;border-color:#3b4638;color:#b2c0a9}
.card h3{font-size:15px;line-height:1.5;color:var(--text);letter-spacing:-.3px}.card .desc{font-size:12px;line-height:1.8}.compat-status{font-size:10px;color:#a9bf9d;line-height:1.6;margin-top:12px}.tags{gap:5px;margin-top:12px;margin-bottom:8px}.tag,.tag.exec{font-size:9px;padding:4px 6px;border-radius:4px;background:#242e24;color:#b8c5ad;border-color:#344030}.meta{font-size:10px;margin-top:auto;padding-top:14px}.ver{color:#b2c4a5}
body:is(.ios-glass, :not(.ios-glass)) .card-action{margin-top:15px;min-height:40px;border-radius:7px;background:#293623;color:var(--accent);border:1px solid #415335;box-shadow:none;font-size:11px;font-weight:600}
body:is(.ios-glass, :not(.ios-glass)) .card-action:hover{background:var(--accent);color:#24301b;box-shadow:none}
.ad-banner{padding:0 36px;margin-top:16px}body:is(.ios-glass, :not(.ios-glass)) .ad-box{padding:23px 16px 12px;border:1px dashed #354131;background:#141c16;border-radius:7px;box-shadow:none;min-height:58px;font-size:10px;color:#99a78f;backdrop-filter:none}body:is(.ios-glass, :not(.ios-glass)) .ad-box::before{font-size:7px;color:#86977d;top:7px}
.empty,.loading,.error{grid-column:1/-1;padding:50px 20px;border:1px dashed #425039;border-radius:12px;background:#172019;line-height:1.8;font-size:14px}
body:is(.ios-glass, :not(.ios-glass)) .load-more{background:#263420;color:#cee6b6;border-color:#506541;border-radius:8px;font-size:12px;box-shadow:none}
body:is(.ios-glass, :not(.ios-glass)) .modal-box{background:#18211b;border-radius:16px;border-color:#4b5d40;box-shadow:0 25px 80px #080d0ad9}.modal-head h3{font-size:17px}.modal-body{line-height:1.7}.modal-body pre{background:#101712;border-color:#35432e;color:#d4e0cb}.btn-primary{background:var(--accent);color:#24301b}.toast{background:var(--accent);color:#24301b;box-shadow:0 10px 30px #080d0a66;font-size:13px}
body:is(.ios-glass, :not(.ios-glass)) :is(button,input,select,a,.card):focus-visible{outline:2px solid var(--accent);outline-offset:4px}
@media(min-width:1550px){.catalog-tools{margin-left:auto;margin-right:auto}}
@media(max-width:1100px){.hero-intro{grid-template-columns:1.2fr 1fr;gap:24px}.hero h2{font-size:38px}.code-preview pre{font-size:10px}.stat{margin-right:26px;padding-right:26px}}
@media(max-width:900px){.topbar{padding:16px 22px}.hero{padding:24px 22px 0}.catalog-heading{padding:0 22px}.catalog-tools,.compat-note{margin-left:22px;margin-right:22px}body:is(.ios-glass, :not(.ios-glass)) .grid{padding:22px}.ad-banner{padding:0 22px}.hamburger{border-radius:8px;flex-shrink:0}.mobile-visitors{margin-left:auto}.catalog-free{display:none}}
@media(max-width:600px){.hero-intro{grid-template-columns:1fr;gap:24px}.hero h2{font-size:36px;letter-spacing:-1.5px}.hero p{font-size:13px}.code-preview{transform:none;box-shadow:5px 5px 0 #1b2519}.code-preview pre{font-size:11px;padding:15px 20px}.code-preview-bar{padding:10px 16px}.section-tabs{margin-bottom:24px!important}.discord-panel{padding:17px;gap:14px}.discord-panel a{width:100%;text-align:center}.stats{gap:0}.stat{padding-right:22px;margin-right:22px}.stat b{font-size:24px}.catalog-heading{align-items:start;flex-direction:column;gap:12px}.catalog-heading h2{font-size:20px}.catalog-tools{gap:12px}.catalog-tools label{min-width:calc(50% - 12px)}.catalog-tools button{width:100%}body:is(.ios-glass, :not(.ios-glass)) .grid{grid-template-columns:minmax(0,1fr)}body:is(.ios-glass, :not(.ios-glass)) .card{border-radius:12px}.topbar{gap:10px}.mobile-visitors{font-size:9px}.search-top{min-width:140px}.search-top input{font-size:11px;padding-left:10px}.modal{padding:12px}.modal-body{padding:18px}.modal-head{padding:16px}}
@media(prefers-reduced-motion:reduce){body:is(.ios-glass, :not(.ios-glass)) .card,body button,body a{transition:none!important;animation:none!important}}