/* id="cm-kartya-avatar-egyseges" */ /* 2026-08-23: egyseges szerzo-avatar a mod-kartyakon (lasd zzzz-cm-kartya-avatar-egyseges.php) */ /* (0,3,2) specifikussag: veri a tema 3 osztalyos, !important szabalyat is (main.css:7394), ami a kaszkadban kesobb all — merve: a sima 3 osztalyos valtozat 21,6 px-en ragadt. */ html body .mod-card-row .mod-card-row__author-line .mod-card-row__author-avatar{ width:56px !important; height:56px !important; border-radius:0 !important; object-fit:cover; flex-shrink:0; } /* id="cm-kartya-filesize-css" */ /* 2026-08-23: "File Size:" + ertek egymas mellett (max 1 szokoz), ertek zold */ html body .mod-card-row--v2 .mod-card-row__side-foot .mod-card-row__stat-pair-text--file-size{column-gap:4px !important} html body .mod-card-row .mod-card-row__stat-pair-text--file-size .mod-card-row__file-size-label{margin-right:0 !important} html body .mod-card-row .mod-card-row__file-size-value{color:#16a34a !important} html body:not(.light-surface) .mod-card-row .mod-card-row__file-size-value{color:#4ade80 !important} /* id="cm-hide-hero-filter-button-css" */ @media (max-width:1399px){ body.tax-game .mpp-game-hero a[href*="filter"], body.tax-game .mpp-game-hero button, body.tax-game .mpp-game-hero .btn, body.tax-game .mpp-game-hero [data-mpp-open-game-filter], body.tax-game .mpp-game-hero #mpp-open-game-filters{ /* 2026-10-09: body[class*=game] helyett */ display:none!important; } .mpp-game-hero a.btn, .mpp-game-hero button.btn, .mpp-game-hero .mpp-game-hero__actions, .mpp-game-hero .mpp-hero-actions{ display:none!important; } } /* id="cm-badge-egy-sorban" */ .mod-card-row--v2 .mod-card-row__side-foot .mod-card-row__stat-pair-text--file-size{flex-wrap:nowrap!important}.mod-card-row--v2 .mod-card-row__side-foot .cmfs-pill{padding-left:7px!important;padding-right:7px!important} /* id="cm-mobil-szelig-css" */ @media (max-width:768px){ /* 1) A kulso burkolok nullara. env(safe-area-inset-*) es nem sima 0: ALLO modban ez pontosan 0 (megvan a kert szelig-eres), FEKVO modban viszont nem engedi a tartalmat a notch ala csuszni. A jelenlegi 768px-es felulras ezt elejtette. */ html body .container, html body .cm-nm, html body .cm-news-nav__inner, html body .mpp-single-mod__main, html body .cm-home-redesign__container{ padding-left:env(safe-area-inset-left,0px)!important; padding-right:env(safe-area-inset-right,0px)!important; } /* A fooldal DUPLAN kapott hezagot: a cm-phone-full-width.php width:calc(100% - 20px) szabalyat is fel kell oldani, kulonben marad 10-10px a ket szelen. */ html body .cm-home-redesign__container{ width:100%!important; max-width:none!important; } /* 2) Szovegvedelem. A mod-kartyaknak van sajat belso behuzasuk (.mod-card-row--modland = .64rem .765rem), azok rendben vannak. A .glass-panel alapszabalya viszont NEM tartalmaz paddinget — a benne levo sima szoveg 0px kulso hezagnal hozzaerne a kijelzo szelehez. */ html body .container > .glass-panel, html body .cm-nm .cm-nm-main, html body .entry-content{ padding-left:14px!important; padding-right:14px!important; } /* 2b) KIVETEL a szovegvedelem alol: a szuro-urlap NEM szoveges blokk — a benne levo gomboknak es mezoknek sajat behuzasuk van, ezert menjen szelrol szelig. (Tulaj 2026-08-21: A szuro nem szeltol szelig van, joval beljebb kezdodik.) A .mpp-archive-mod-hero KIMARAD: abban cim es leiro szoveg all, annak kell a hezag. */ html body .container > form.mpp-archive-mod-form, html body .container > .mpp-filter-panel--modern{ padding-left:0!important; padding-right:0!important; } /* 3) KIVETEL: fejlec es lablec behuzva marad (lasd a fejlec-megjegyzest). */ html body .container.top-row, html body .container.footer-premium{ padding-left:12px!important; padding-right:12px!important; } } /* id="cm-mobile-top-stats-final-css" */ @media (max-width:1399px){ .cm-modern-stat-box .cm-modern-stat:nth-child(2) > *, .cm-modern-stat-box .cm-modern-stat:nth-child(3) > *{ display:none!important; } .cm-modern-stat-box .cm-modern-stat:nth-child(2), .cm-modern-stat-box .cm-modern-stat:nth-child(3){ display:flex!important; align-items:center!important; justify-content:center!important; gap:6px!important; } .cm-modern-stat-box .cm-modern-stat:nth-child(2)::before, .cm-modern-stat-box .cm-modern-stat:nth-child(3)::before{ content:""!important; width:18px!important; height:18px!important; flex:0 0 18px!important; display:block!important; background:#334155!important; } .cm-modern-stat-box .cm-modern-stat:nth-child(2)::before{ -webkit-mask:url('data:image/svg+xml;utf8,') center/contain no-repeat!important; mask:url('data:image/svg+xml;utf8,') center/contain no-repeat!important; } .cm-modern-stat-box .cm-modern-stat:nth-child(3)::before{ -webkit-mask:url('data:image/svg+xml;utf8,') center/contain no-repeat!important; mask:url('data:image/svg+xml;utf8,') center/contain no-repeat!important; } .cm-modern-stat-box .cm-modern-stat:nth-child(2)::after, .cm-modern-stat-box .cm-modern-stat:nth-child(3)::after{ content:attr(data-cm-label) "\A" attr(data-cm-value)!important; white-space:pre!important; display:block!important; font-size:10px!important; line-height:1.12!important; font-weight:800!important; color:#0f172a!important; text-align:left!important; } } /* id="cm-mobile-top-stats-final-css" */ @media (max-width:1399px){ .cm-modern-stat-box .cm-modern-stat:nth-child(2) .cm-modern-stat-label, .cm-modern-stat-box .cm-modern-stat:nth-child(3) .cm-modern-stat-label{ font-size:0!important; line-height:0!important; } .cm-modern-stat-box .cm-modern-stat:nth-child(2) .cm-modern-stat-label::after{ content:"Like"!important; display:block!important; font-size:10px!important; line-height:1.05!important; } .cm-modern-stat-box .cm-modern-stat:nth-child(3) .cm-modern-stat-label::after{ content:"Comment"!important; display:block!important; font-size:10px!important; line-height:1.05!important; } body:not(.cm-top-stats-fixed) .cm-modern-stat-box .cm-modern-stat:nth-child(2) .cm-modern-stat-value, body:not(.cm-top-stats-fixed) .cm-modern-stat-box .cm-modern-stat:nth-child(3) .cm-modern-stat-value{ color:transparent!important; } } /* id="cm-kartya-jobb-oszlop-css" */ @media (min-width:1101px){ /* ---- ikon-csempék ---- */ .mod-card-row--v2 .mod-card-row__statcell{gap:8px;align-items:center;min-width:0} .mod-card-row--v2 .mod-card-row__statcell-ico{width:28px;height:28px;border-radius:9px;background:#e8effb;color:#2563eb;align-items:center;justify-content:center} .mod-card-row--v2 .mod-card-row__statcell-ico svg{width:15px;height:15px} .mod-card-row--v2 .mod-card-row__statcell[data-cm-stat="downloads"] .mod-card-row__statcell-ico{background:#dcfce7;color:#15803d} .mod-card-row--v2 .mod-card-row__statcell[data-cm-stat="dislikes"] .mod-card-row__statcell-ico{background:#fee2e2;color:#dc2626} .mod-card-row--v2 .mod-card-row__statcell-label{font-size:.7rem;line-height:1.25} .mod-card-row--v2 .mod-card-row__statcell-value{font-size:.82rem;font-weight:800;line-height:1.25} /* ---- rács: függőleges elválasztó a két oszlop között ---- */ .mod-card-row--v2 .mod-card-row__statgrid{grid-template-columns:1fr 1fr;column-gap:0;row-gap:13px} .mod-card-row--v2 .mod-card-row__statcell:nth-child(2n){padding-left:11px;border-left:1px solid #e6edf6} .mod-card-row--v2 .mod-card-row__statcell:nth-child(2n+1){padding-right:11px} /* ---- lábsor: vízszintes elválasztó, ikon-csempe, felirat a szám fölött, jobbra a jelvény ---- Rács: [csempe] [felirat / méret] [jelvény]. A méret-szöveg névtelen rács-elem (a value display:contents), ezért auto-elhelyezéssel a 2. sor 2. cellájába kerül. */ .mod-card-row--v2 .mod-card-row__side-foot{display:block;border-top:1px solid #e6edf6;padding-top:13px;min-height:0} .mod-card-row--v2 .mod-card-row__side-foot .mod-card-row__stat-pair-text--file-size{ display:grid !important;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto; column-gap:8px;row-gap:0;align-items:center;width:100%;min-width:0;white-space:normal; font-size:1.02rem;font-weight:800;color:#2563eb; } .mod-card-row--v2 .mod-card-row__side-foot .mod-card-row__stat-pair-text--file-size::before{ content:"";grid-column:1;grid-row:1 / span 2;width:34px;height:34px;border-radius:10px; background:#ede9fe url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%237c3aed%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z%22%2F%3E%3Cpolyline%20points%3D%2214%202%2014%208%2020%208%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2215%22%20r%3D%221.6%22%2F%3E%3C%2Fsvg%3E") center/18px no-repeat; } .mod-card-row--v2 .mod-card-row__side-foot .mod-card-row__file-size-label{ grid-column:2;grid-row:1;font-size:.73rem;font-weight:500;color:#8a98ab;margin:0;line-height:1.25; } .mod-card-row--v2 .mod-card-row__side-foot .cmfs-card-pill-wrap{ grid-column:3;grid-row:1 / span 2;margin:0 !important;align-self:center; padding-left:9px;border-left:1px solid #e6edf6; } .mod-card-row--v2 .mod-card-row__side-foot .cmfs-pill{font-size:.8rem !important;padding:6px 11px !important} /* 2026-09-14: biztonsági háló — a jelvény soha ne lógjon ki a kártyából, és ne tördelje a méretet. A 300px-es oszlopban a méret („999,9 MB") ~155px-es jelvényig marad egy sorban (mérve); a hosszabb felirat innentől „…"-ra vágódik, a teljes szöveg a title-tooltipben marad. A feliratok maguk rövidek (class-frontend.php szótár), ez csak a jövőbeli hosszú szövegek ellen véd. */ .mod-card-row--v2 .mod-card-row__side-foot .cmfs-card-pill-wrap{min-width:0;max-width:164px;box-sizing:border-box} .mod-card-row--v2 .mod-card-row__side-foot .cmfs-pill{max-width:100%;box-sizing:border-box;overflow:hidden} .mod-card-row--v2 .mod-card-row__side-foot .cmfs-pill__label{min-width:0;overflow:hidden;text-overflow:ellipsis} /* ---- funkció-pillek: mind a 14 látszódjon ---- A `.mod-list--game-wide .mod-card-row__pills` max-height:50px = PONTOSAN 2 sor, a többi pill overflow:hidden alá került. Mérve 2026-09-06: a /mods/-on a 14. pill, a hubokon 7-8 pill volt rejtve (a hub kozepso oszlopa keskenyebb). A korlat feloldva; a kartya ennyivel magasabb lesz: /mods/ 292 -> 313px, hub 287 -> 331px. (A profil-kartyakon mar korabban is feloldott volt.) */ .mod-list--game-wide .mod-card-row__pills{max-height:none;overflow:visible} /* ---- sötét mód ---- */ body:not(.light-surface) .mod-card-row--v2 .mod-card-row__statcell-ico{background:rgba(59,130,246,.16);color:#93b4f5} body:not(.light-surface) .mod-card-row--v2 .mod-card-row__statcell[data-cm-stat="downloads"] .mod-card-row__statcell-ico{background:rgba(34,197,94,.16);color:#86efac} body:not(.light-surface) .mod-card-row--v2 .mod-card-row__statcell[data-cm-stat="dislikes"] .mod-card-row__statcell-ico{background:rgba(239,68,68,.16);color:#fca5a5} body:not(.light-surface) .mod-card-row--v2 .mod-card-row__statcell:nth-child(2n){border-left-color:rgba(148,163,184,.18)} body:not(.light-surface) .mod-card-row--v2 .mod-card-row__side-foot{border-top-color:rgba(148,163,184,.18)} body:not(.light-surface) .mod-card-row--v2 .mod-card-row__side-foot .cmfs-card-pill-wrap{border-left-color:rgba(148,163,184,.18)} body:not(.light-surface) .mod-card-row--v2 .mod-card-row__side-foot .mod-card-row__stat-pair-text--file-size{color:#93b4f5} body:not(.light-surface) .mod-card-row--v2 .mod-card-row__side-foot .mod-card-row__stat-pair-text--file-size::before{background-color:rgba(124,58,237,.20)} } /* id="cm-mobil-jatekoldal-css" */ @media (max-width:768px){ /* --- 1) Felkapott-modok badge: kozepre, ket tuzzel, 10%-kal kisebben --- */ html body .mpp-trending-kicker{ /* A tema bal-huzasat semlegesitjuk; width:fit-content miatt az auto kozepre teszi. */ margin-left:auto!important; margin-right:auto!important; justify-content:center!important; text-align:center!important; font-size:.88rem!important; /* volt: .98rem — pontosan 10%-kal kisebb */ } /* A masodik tuz. A szulo -webkit-text-stroke/text-shadow-jat itt kikapcsoljuk, kulonben az emoji korvonalat kapna. A meretek a megleve jobb oldali span[aria-hidden] szabalyaval egyeznek (1.22em), hogy a ketto azonos legyen. */ html body .mpp-trending-kicker::before{ content:"🔥"; display:inline-flex; align-items:center; justify-content:center; width:1.22em; height:1.22em; flex:0 0 auto; color:#ff7a3f; -webkit-text-stroke:0; text-shadow:none; } } /* --- 2) Szuro-sav: szelrol szelig + a nyil ne logjon a szovegbe --- A megleve mobil szuro-bovitmeny (…cm-mobile-filter-like-target.php) 1399px-ig ervenyes, ezert itt is az a sav, kulonben tablet-meretben szetesne a ketto. */ @media (max-width:1399px){ html body #mpp-game-filter-form{ width:100%!important; /* volt: calc(100% - 28px) */ margin-left:0!important; margin-right:0!important; } /* FONTOS: a megleve mobil szuro-bovitmeny MINDEN nullazasa #mpp-game-filter-form-hoz van kotve — az viszont csak a JATEK-oldalon letezik, az ARCHIVUMON (/mods/) nem. Ezert ott sem a behuzas-nullazas, sem a nyil-javitas nem ervenyesult. Az alabbi ket szabaly NINCS formhoz kotve, igy mindket oldaltipuson hat. */ /* A pirula-konteiner sajat behuzasa tartotta beljebb a rendezes-gombokat es a "Mod-Filter verfeinern" savot (main.css 18318: padding .75rem, 640px alatt .6rem). Telefonon menjen szelrol szelig, ahogy a lapozo is. */ html body .mpp-gfc{ padding-left:0!important; padding-right:0!important; border-left:0!important; border-right:0!important; border-radius:0!important; } /* A legordulo nyila abszolut pozicionalt (main.css 18548: right:.6rem), tehat KIKERUL a sorbol — a szoveg szabadon alafut. A tema alapbol 1.9rem jobb behuzast ad ra, de a mobil szuro-bovitmeny ezt "padding:0 10px"-re irja at, es ezzel elveszi a nyil helyet. Vissza kell adni. SULY: a bovitmeny szabalya "#mpp-game-filter-form"-mal kezdodik, tehat egy ID-vel erosebb, mint egy form nelkuli szelektor — a JATEK-oldalon nyerne. Ezert a projektben mar hasznalt :not(#cmNope) trukkel emeljuk a sulyt (ket ID-ertek), es kulon adjuk meg a form nelkuli valtozatot az ARCHIVUM-hoz. */ html body #mpp-game-filter-form:not(#cmNope) .mpp-gfc__dropdown-btn, html body .mpp-gfc .mpp-gfc__dropdown-btn{ padding-right:28px!important; } } /* id="cm-mobil-fooldal-css" */ /* A gomb asztali nezetben soha nem latszik — ott a blokk teljes egeszeben all. */ .cm-seo-toggle{display:none} /* 2026-08-27 (tulaj: "tablet modban lehet csukva a leiras"). A toresponti ertek 768 -> 1023, hogy a TABLETEK is osszecsukva kapjak a blokkot. A tulaj 778 px szeles ablakban dolgozik — az eddigi 768-as hatar epp alatta zart. ⚠️ SZANDEKOSAN KETTEVALASZTVA. Ugyanez a media-lekerdezes rejtette el a "Platform updates" oldalsav-kartyat is (2. tetel), azt viszont a tulaj NEM kerte tabletre — az tovabbra is csak 768 alatt tunik el, lentebb, sajat blokkban. A blokk fuggoleges terkozet (padding) is a telefonos blokkban hagytam: az kozmetikai finomitas volt, nem az osszecsukas resze. */ @media (max-width:1023px){ /* --- 1) SEO-blokk: osszecsukva indul --- */ /* 2026-08-27 (tulaj: "de csunyan vagja el a szoveget, szebb design ja legyen"). KET BAJA VOLT a regi 186px-es vagasnak: 1) A vagas a MASODIK BEKEZDES ELSO SORANAK a KOZEPEBE esett. MERVE (778 px): H2 ....... 0 -> 27 (sormagassag 27) 1. bek. .. 43 -> 152 (4 sor, sormagassag 27,2) 2. bek. .. 168 -> 304 (5 sor) 186 px = a 2. bekezdes elso soraba 18 px -> a betuk fuggolegesen elvagva. 2) Eles vizszintes el: ugy nezett ki, mint egy hiba, nem mint "van meg tovabb". A JAVITAS: a vagas 232 px-re nott (cim + 1. bekezdes + a 2. bekezdes ~2,3 sora), es a szoveg alja nem ELVAGVA, hanem ELHALVANYULVA vegzodik: az utolso 48 px-en egy maszk atlatszova viszi. Igy a felbevagott sor TELJESEN az elhalvanyulo savba esik — nem lehet eles elt latni. ⚠️ MIERT MASZK ES NEM ATFEDO SZINATMENET: az oldal VILAGOS es SOTET modban is fut, ket kulonbozo hatterszinnel. Egy `linear-gradient` overlay-hez tudni kellene a hatter szinet (es a blokke `rgba(0,0,0,0)`, tehat oroklodik). A `mask-image` a hattertol FUGGETLENUL mukodik: magat az elemet teszi atlatszova. ⚠️ NYITOTT ALLAPOTBAN A MASZKOT LE KELL VENNI, kulonben a kinyitott szoveg alja is halvany maradna. MERVE: nyitva a mask-image erteke `none`. */ html body #cm-home-seo-content .cm-home-seo-content__inner{ max-height:232px; overflow:hidden; transition:max-height .28s ease; -webkit-mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - 48px),transparent 100%); mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - 48px),transparent 100%); } html body #cm-home-seo-content.cm-seo-open .cm-home-seo-content__inner{ max-height:none; -webkit-mask-image:none; mask-image:none; } html body .cm-seo-toggle{ display:inline-flex; align-items:center; gap:6px; margin:10px 0 0; padding:9px 16px; border:1px solid var(--border-strong,rgba(148,163,184,.35)); border-radius:999px; background:transparent; color:var(--cm-link,#2563eb); font:inherit; font-size:14px; font-weight:700; line-height:1; cursor:pointer; } html body .cm-seo-toggle::after{ content:""; width:7px;height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg) translateY(-1px); transition:transform .2s ease; } html body #cm-home-seo-content.cm-seo-open .cm-seo-toggle::after{ transform:rotate(-135deg) translateY(-1px); } } /* --- 2) "Platform updates" kartya elrejtese CSAK telefonon (valtozatlan hatar) --- */ @media (max-width:768px){ /* A blokk fuggoleges terkoze is kisebb telefonon. */ html body #cm-home-seo-content{padding:1.25rem 0 1.5rem} html body .cm-side-card--updates{display:none!important} } /* id="cm-sims-verzio-tiltas-css" */ .cm-verzio-tiltva{position:relative} /* A vezérlők látszanak, de nem használhatók — ez volt a kérés: ne tűnjön el. */ .cm-verzio-tiltva .mpp-vers-combo{ filter:blur(2.6px); opacity:.5; pointer-events:none; user-select:none; } /* A kötelező csillag félrevezető lenne, amíg a mező tiltva van. */ .cm-verzio-tiltva .mpp-field__required{display:none} /* A mező alatti segédszöveg ("Pick the game version… from the dropdowns") blokkolt állapotban ellentmond a jelvénynek — elrejtjük. */ .cm-verzio-tiltva > small.mpp-muted{display:none!important} /* Magyarázó kártya a homályos mező KÖZEPÉN. A szöveg a data attribútumból jön, így egy szabály kiszolgálja mind a 9 nyelvet. A +10px eltolás a fölötte álló címke magasságát egyenlíti ki, hogy a kártya ne a mező, hanem a VEZÉRLŐK közepére essen. Színek: a téma saját változóiból, tartalékkal — így sötét módban is helyes, és nem kell a dark-mode osztálynevet eltalálni. */ .cm-verzio-tiltva::after{ content:attr(data-cm-uzenet); position:absolute; left:50%; top:calc(50% + 10px); transform:translate(-50%,-50%); z-index:2; max-width:min(330px, calc(100% - 22px)); box-sizing:border-box; padding:11px 16px; border-radius:14px; background:var(--card,#fff); color:var(--text,#0f172a); border:1px solid var(--border,rgba(148,163,184,.3)); box-shadow:0 12px 30px rgba(15,23,42,.16), 0 2px 6px rgba(15,23,42,.06); font-size:12.5px; font-weight:600; line-height:1.45; letter-spacing:.01em; text-align:center; text-wrap:balance; white-space:normal; pointer-events:none; } @media (max-width:768px){ .cm-verzio-tiltva::after{ font-size:11.5px; padding:9px 13px; border-radius:12px; max-width:calc(100% - 16px); } } /* id="cm-pill-tobb-css" */ @media (min-width:1101px){ /* fix 2 sor; a chipnek fenntartott hely a jobb oldalon (felülírja a design-plugin max-height:none-ját, mert később jön ugyanabban a kötegben) */ .mod-list--game-wide:not(.mod-list--author-cards) .mod-card-row__pills{min-height:50px;max-height:50px;overflow:hidden;position:relative;padding-right:46px;align-content:flex-start} .mod-list--game-wide:not(.mod-list--author-cards) .mod-card-row__pill{transition:opacity .16s ease, transform .16s ease} /* FONTOS: a `hidden` attributum NEM eleg — a .mod-card-row__pill{display:inline-flex} SZERZOI szabaly eros ebb, mint a bongeszo [hidden]{display:none} szabalya (origo-precedencia). Ezert sajat osztaly. */ .mod-list--game-wide:not(.mod-list--author-cards) .mod-card-row__pill.cm-lap-rejt{display:none !important} .cm-pill-tobb[hidden]{display:none !important} .mod-list--game-wide:not(.mod-list--author-cards) .mod-card-row__pills.cm-lapoz .mod-card-row__pill{opacity:0;transform:translateY(-5px)} .cm-pill-tobb{position:absolute;right:0;bottom:0;display:inline-flex;align-items:center;justify-content:center; margin:0;padding:2px 8px;border:1px dashed rgba(37,99,235,.45);border-radius:999px; background:rgba(37,99,235,.06);color:#2563eb;font-size:.66rem;font-weight:800;line-height:1.55; cursor:pointer;font-family:inherit;letter-spacing:.02em;font-variant-numeric:tabular-nums; transition:background .15s ease, border-color .15s ease} .cm-pill-tobb:hover{background:rgba(37,99,235,.14);border-color:rgba(37,99,235,.7)} .cm-pill-tobb:focus-visible{outline:2px solid #2563eb;outline-offset:2px} body:not(.light-surface) .cm-pill-tobb{color:#93b4f5;border-color:rgba(147,180,245,.45);background:rgba(147,180,245,.10)} body:not(.light-surface) .cm-pill-tobb:hover{background:rgba(147,180,245,.18);border-color:rgba(147,180,245,.75)} } @media (max-width:1100px){ .cm-pill-tobb{display:none} } @media (prefers-reduced-motion:reduce){ .mod-list--game-wide:not(.mod-list--author-cards) .mod-card-row__pill{transition:none} .mod-list--game-wide:not(.mod-list--author-cards) .mod-card-row__pills.cm-lapoz .mod-card-row__pill{opacity:1;transform:none} } /* id="cm-kartya-cim-teljes" */ .mod-card-row__side a.mod-card-row__side-btn{display:flex;align-items:center;justify-content:center;gap:7px}.mod-card-row__side-btn .cm-le-ikon,.cm-nezet-gomb .cm-le-ikon{width:17px;height:17px;flex:0 0 auto;display:block}@media (min-width:1101px){.mod-card-row--v2.mod-card-row--modland .mod-card-row__title-row{grid-column:2 / span 2}.mod-card-row--v2.mod-card-row--modland .mod-card-row__actions.mod-card-row__side{grid-row:2}.mod-card-row--v2.mod-card-row--modland .mod-card-row__title-main > a{font-size:1.3rem;white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;text-overflow:ellipsis}.mod-card-row--v2.mod-card-row--modland .mod-card-row__side{gap:8px}.mod-card-row--v2.mod-card-row--modland .mod-card-row__side .mod-card-row__side-btn{padding-top:7px;padding-bottom:7px;min-height:0}.mod-card-row--v2.mod-card-row--modland .mod-card-row__statgrid{row-gap:7px}.mod-card-row--v2.mod-card-row--modland .mod-card-row__side-foot{padding-top:8px}} /* id="cm-lista-hirdetes-css" */ .mod-list>.cmaps-ag:has(ins[data-adsbygoogle-status]){min-height:110px!important} /* id="cm-hirdetes-lapozo-fole" */ .cmaps-slot:not(.cmaps-wait):has(+ [data-mpp-game-pagination="top"]),.cmaps-slot:not(.cmaps-wait):has(+ [data-mpp-archive-pagination="top"]){margin-bottom:36px!important}[data-mpp-game-pagination="top"] + .cmaps-slot:not(.cmaps-wait),[data-mpp-archive-pagination="top"] + .cmaps-slot:not(.cmaps-wait){margin-top:36px!important} /* id="cm-home-stats-icons-css" */ body.home .cm-home-stat__icon{font-size:0!important;width:46px!important;height:46px!important;border-radius:999px!important;display:flex!important;align-items:center!important;justify-content:center!important} body.home .cm-home-stat__icon:before{font-family:"Font Awesome 6 Free"!important;font-weight:900!important;font-size:22px!important;line-height:1!important} body.home .cm-home-stat:nth-child(1) .cm-home-stat__icon{color:#2d2bdd!important;background:#ece9ff!important} body.home .cm-home-stat:nth-child(2) .cm-home-stat__icon{color:#13b84f!important;background:#dcf8e8!important} body.home .cm-home-stat:nth-child(3) .cm-home-stat__icon{color:#2878ff!important;background:#e8f1ff!important} body.home .cm-home-stat:nth-child(4) .cm-home-stat__icon{color:#2d2bdd!important;background:#ece9ff!important} body.home .cm-home-stat:nth-child(1) .cm-home-stat__icon:before{content:"\f11b"!important} body.home .cm-home-stat:nth-child(2) .cm-home-stat__icon:before{content:"\f12e"!important} body.home .cm-home-stat:nth-child(3) .cm-home-stat__icon:before{content:"\f019"!important} body.home .cm-home-stat:nth-child(4) .cm-home-stat__icon:before{content:"\f0c0"!important} /* id="cm-tap-target-css" */ a.cmplz-link.cookie-statement,a.cmplz-link.privacy-statement,a.cm-fresh-card__by,a.cm-side-forum__all,a.cm-mgz__more,a.cm-stat-card__link,a.cm-featured__more,a.cm-upd-more{padding-top:4px;padding-bottom:4px;margin-top:-4px;margin-bottom:-4px;} /* id="cm-kartya-kivonat-nagyobb" */ @media (min-width:1024px){ /* 2026-08-27, OTODIK kor (tulaj: "de te a jatek oldalon is atallitottad, nem csak a mods oldalon — csak a mods oldalon kertem"). IGAZA VOLT. A `.mod-list--game-wide` osztaly NEM csak a /mods/ archivumon van rajta, hanem a JATEK-OLDALAKON is. MERVE a javitas elott: /mods/ body.post-type-archive-mod -> 15,70px / 600 / #000 /game/beamng.drive-mods/ body.tax-game.term-2 -> 15,70px / 600 / #000 (!) Ezert MINDEN itteni szabaly ele bekerult a `body.post-type-archive-mod` szukites. A jatek-oldalak igy visszakapjak a tema alapallapotat (12,716px, tema-szin, eredeti racs-hezagok). A cim/csillag-hezag igazitasa is ide tartozik: azt ugyanebben a kereskorben kerte a tulaj, a nagyobb leirasnak helyet csinalva — kulon hagyva a jatek-oldalon szukebb hezag + kicsi betu keveredne. */ /* 2026-08-27, harmadik kor (tulaj: "legyen 5%-kal kisebb es fekete szoveg"). 1.3 * 0.95 = 1.235 -> 15,70 px (az eredeti 12,716 px 123,5%-a). A szin FEKETE vilagos modban. Sotet modban ez olvashatatlan lenne, ezert ott valtozatlanul a lenti #cbd5e1 marad. */ /* 2026-08-27, negyedik kor (tulaj: "de felkover legyen"). A 600-as suly a "felkover" (semi-bold); a 700 mar kover. 600-at hasznalunk, mert a cim maga is vastag, es a 700 az egesz kartyat elnehezitene. MERVE: a suly a kapacitast is szukiti (197 -> 186 karakter ket sorban), ezert a szamlalo kuszobeit is igazitottam. */ html body.post-type-archive-mod .mod-list--game-wide .mod-card-row--modland .mod-card-row__excerpt{ font-size:calc(0.79475rem * 1.235); font-weight:600; color:#000; } /* A csillagsor feljebb kerul a cim ala — ez adja a helyet a nagyobb leirasnak. */ html body.post-type-archive-mod .mod-list--game-wide .mod-card-row--modland .mod-card-row__rating--always{ margin-top:0; margin-bottom:2px; } /* 2026-08-27, masodik kor (tulaj: "a cim es a csillag kozott meg mindig nagy a res"). MERVE: a 19px-es res NEM margobol jott, hanem KETTO forrasbol: 5,6px a .mod-card-row__title-row also margoja 12,9px a KARTYA RACS sor-hezaga (a kartya display:grid, gap:12.92px) Ezert a csillagsor sajat margojanak nullazasa onmagaban semmit nem valtoztatott. CSAK a SOR-hezagot szukitjuk (row-gap) — az oszlop-hezag marad 12,92px, kulonben a borito, a szoveg es a jobb oldali statisztika-oszlop osszecsuszna. MERVE utana: res 19 -> 4px, es a kartya 312 -> 297px, vagyis a 30%-kal nagyobb leiras ellenere is ALACSONYABB, mint az eredeti 305px. */ html body.post-type-archive-mod .mod-list--game-wide .mod-card-row--modland{ row-gap:4px; } html body.post-type-archive-mod .mod-list--game-wide .mod-card-row--modland .mod-card-row__title-row{ margin-bottom:0; } } /* Sotet modban a #1e293b olvashatatlan lenne — ott vilagositunk, nem sotetitunk. */ @media (min-width:1024px){ html body.post-type-archive-mod:not(.light-surface) .mod-list--game-wide .mod-card-row--modland .mod-card-row__excerpt{ color:#cbd5e1; } } /* id="cm-sotet-kontraszt" */ /* ── „Támogass minket" widget (cm-tamogatas-widget.php) ─────────────────────── */ body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-tam__ikon{ color:#052e16 !important; /* sötét zöld a világoszöld chipen */ } body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-tam__cimke--arany{ color:#b45309 !important; } body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-tam__cimke--lila{ color:#be185d !important; } body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-tam__cimke--piros{ color:#b91c1c !important; } /* ── „Közösségi galéria" blokk (002-cm-galeria-uj.css) ────────────────────────── Tulaj (2026-08-27): „a Közösségi galéria blockban is a szövegek legyenek fehérek, mert beleolvad a tartalomba a szöveg, a gomb is." UGYANAZ A GYÖKÉR, mint a „Támogass minket"-nél: a desktop-home.css:775 blanket `span{color:#a9bdd8!important}` szabálya. MÉRVE: a blokk MIND A 7 felirata pontosan #a9bdd8 — a hero cím, a kis kártyák címei, a jelvény, a gomb, a mód-pill, a meta sor. ⚠️ AMIT A PUSZTA SZÁM NEM MUTAT: ezek a feliratok FÉNYKÉPEN ülnek. A gépi kontraszt 9-10:1-et mér, mert a kártya sötét HÁTTERÉHEZ hasonlít — de a szem a fotót látja alattuk. Ezért „olvad bele" úgy, hogy közben a szám jónak tűnik. A megoldás nem új design: VILÁGOS módban ez a blokk MÁR MOST helyes — fehér cím, fehér gomb, fehér jelvény (mérve). Csak sötétben veri szét a blanket. Itt tehát a komponens SAJÁT, eredeti színeit adjuk vissza (002-cm-galeria-uj.css:104-176). MÉRVE javítás előtt / után: „Featured" jelvény #a9bdd8 a #7c3aed lilán ..... 3,0 -> 5,6 (fehér) „Megnézem" gomb #a9bdd8 a #7c3aed lilán ..... 3,0 -> 5,6 (fehér) hero cím, kis címek, mód-pill, meta ............. #a9bdd8 -> a saját fehér/világos A szelektor 5 osztály + 1 elem, a blanket 3 osztály + 2 elem — ezért nyer, `!important` ide is kell, mert a blanketen is az van. */ body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-gal2 .cm-gal2__hero-cim, body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-gal2 .cm-gal2__kis-cim, body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-gal2 .cm-gal2__jelvny, body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-gal2 .cm-gal2__gomb{ color:#fff !important; } body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-gal2 .cm-gal2__meta, body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-gal2 .cm-gal2__m{ color:#e3ebf7 !important; /* szerzo - datum - kedveles, a fotón */ } body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-gal2 .cm-gal2__tip{ color:#e9e2ff !important; /* „Photo Mode" pill a sajat lilas fehérjével */ } /* A blokk-fejléc: az ikon-chip VILÁGOS alapú marad sötét módban is (mérve #eff6ff), ezért oda a világos módi kék való — a #a9bdd8 ott 1,8:1 volt. A „galéria" akcentus- szónak VAN sajat sotet szabalya (desktop-home.css:1680, #60a5fa), csak a blanket `!important`-ja megolte; itt eloásuk. Az alcím egy fokkal vilagosabb lesz. */ body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-homegal .cm-categories__icon{ color:#2563eb !important; } body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-homegal .cm-h2a{ color:#60a5fa !important; } body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-gal2 .cm-gal2__sub{ color:#cbd5e1 !important; } /* ── „CrashMods Magazin" blokk (template-front-desktop.php + 001-cm-magazin-uj.css) ── Tulaj (2026-08-27): „a CrashMods Magazinban is van kontraszt baj, alul a jatekoknal is." UGYANAZ A BLANKET (desktop-home.css:775) festi at itt is a span-eket #a9bdd8-ra. MERVE (sotet mod, 1600px, ATMENETEK KIKAPCSOLVA — lasd lent, miert kell): .cm-mgz-fr__tag 20 db jatek-cimke ... 1,7 - 3,0 (vilagos modban feher volna) .cm-mgz-feat__badge „KIEMELT" ......... 3,0 .cm-mgz-k__ures a ▦ jel az aktiv chipen ... ~3,0 a lila szinatmeneten .cm-mgz-nep__n 1/2/3 sorszamok ..... 7,0 (atmegy, de lila helyett szurke) .cm-h2a „Magazin" ........... 9,5 (atmegy, de a sajat #60a5fa-ja helyett) ⚠️ AMI NEM VOLT HIBAS, pedig elsore annak tunt: az also jatek-chipek (.cm-mgz-k) es az „Osszes nepszeru cikk" gomb. Elso meresem 3,6 / 3,3-at mutatott — az HAMIS volt, lasd a meresi csapdat lent. Valodi ertekuk 7,1 / 6,6, tehat atmennek. A tulaj keresere megis vilagosabbra allitjuk oket (#94a3b8 -> #cbd5e1), mert halvanynak latszanak a feher cimek mellett. Az AKTIV chip (.is-on) kimarad — az feher marad. ⚠️⚠️ MERESI CSAPDA, amit itt tanultunk (fontos minden kesobbi kontraszt-merésnél): 1) A .cm-mgz-k-nak `transition: color .15s` van. Ha a bongeszo-panel NINCS megjelenitve, a lap nem kompozital kepkockakat, ezert az ATMENETEK SOHA NEM LEPNEK TOVABB — a getComputedStyle OROKRE a valtas ELOTTI szint adja vissza. Igy mertem 3,6-ot a valos 7,1 helyett. Merés elott: `*{transition:none!important;animation:none!important}`. 2) Az aktiv chip hattere linear-gradient. A backgroundColor-ra epulo kompozitalas ezt NEM latja, es feher hatteret szamol -> hamis 1,0 es 18,3 ertekek. VISSZAALLITAS: ez a szakasz torolheto; a hatterszinek a template 470. soraban. */ body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-mgz .cm-mgz-fr__tag, body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-mgz .cm-mgz-feat__badge, body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-mgz .cm-mgz-k__ures{ color:#fff !important; } body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-mgz .cm-mgz-nep__n{ color:#c4b5fd !important; /* a vilagos modi lila sotet-modi parja */ } body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-magazine .cm-h2a{ color:#60a5fa !important; /* a sajat, blanket altal megolt sotet szabalya */ } /* Az also jatek-chipek es a „Osszes nepszeru cikk" gomb — az AKTIV chip kivetel. */ body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-mgz .cm-mgz-k:not(.is-on), body.cm-home-redesigned:not(.light-surface) .cm-home-redesign .cm-mgz .cm-mgz-nep__all{ color:#cbd5e1 !important; } /* ── Fejléc- és promó-gombok sötét módban ─────────────────────────────────────── Tulaj (2026-08-27): „sötét módban tablet nézeten a szövegek beleolvadnak a gombba: Submit Mod, Discord, TikTok stb." MÁSIK GYÖKÉR, mint a span-blanket. A sötét mód design-rendszere (020-cm-dark-mode-design-system.php:40) beállít egy `--cm-link:#60a5fa` változót, és egy nagyon széles, `!important`-os szabály MINDEN linket erre fest: body:not(.light-surface) a:not(.button)…:not(.mpp-social-btn){ color:var(--cm-link)!important } Ez jó a sima szöveglinkekre — de kiüti azoknak a GOMBOKNAK a saját szövegszínét, amiknek SAJÁT HÁTTERÜK van. MÉRVE (sötét mód, 778 px): „Mods" (fehér hátterű fül) ....... #60a5fa a fehéren ........... 2,54 „Submit Mod" (kék gomb) .......... #60a5fa a #2563eb-en ........ 2,03 „Discord"/„TikTok" (promó gomb) .. #60a5fa a rgb(57,82,114)-en . 3,16 ⚠️ NEM SZELEKTOR-VERSENNYEL javítjuk. Az a szabály TIZENHÁROM osztályt számlál — a cm-game-accent.php fejléce ezt már megjárta, és a bevált fogást dokumentálja: „nem harcolunk vele: megadjuk, mit fessen" — vagyis magát a `--cm-link` változót állítjuk be az elemen. Ez öröklődik, egyszerű, és nem törik el, ha a szabály változik. Figyelni kell rá, hogy a két fül-típus ELLENTÉTES irányba szorul: fehér hátterű fülek -> SÖTÉT kék kell (#2563eb) = 5,17 kék hátterű Submit -> FEHÉR kell = 5,17 promó gomb -> FEHÉR kell = 8,03 MÉRVE a javítás után (a tulaj böngészőjében, élőben): 5,17 / 5,17 / 8,03. VILÁGOS mód változatlan (6,70 / 5,17 / 8,03) — a szabály `:not(.light-surface)` alatt van. */ body:not(.light-surface) header.top-head .cm-tabnav__a{ --cm-link:#2563eb; } body:not(.light-surface) header.top-head .cm-tabnav__a[href*="submit-mod"]{ --cm-link:#fff; } body:not(.light-surface) .promo-bar__btn{ --cm-link:#fff; } /* id="cm-hero-kozepre" */ /* 1) A hero tartalma középre — pontosan ott, ahol egyoszlopos (telefon is beleértve). A keresőt SZÁNDÉKOSAN nem piszkáljuk: az teljes szélességű, és annak is kell maradnia. */ @media (max-width:1023px){ html body .cm-hero__left{ text-align:center; } html body .cm-hero__title, html body .cm-hero__lead{ text-align:center; } html body .cm-hero__cta-row{ margin-left:auto; margin-right:auto; justify-content:center; } } /* 2) A konténer kapja meg a neki szánt 28 px-es margót a tablet-tartományban. A `.cm-home-redesign` ős azért kell, hogy specificitásban verje a 37. sort. */ @media (min-width:601px) and (max-width:1023px){ html body .cm-home-redesign .cm-home-redesign__container{ width:calc(100vw - 28px) !important; max-width:none !important; margin-left:auto !important; margin-right:auto !important; } } /* id="cm-game-oldalsav-szurke" */ html body.tax-game.light-surface .mpp-game-sidebar__panel{ background:rgb(240,244,250) !important; } /* id="cm-dark-mode-design-system-v2" */ /* 2026-08-18 (tulaj: "sotet modban a telefonos ui borzasztoan rossz, feher kartyak, a szovegek nem latszodnak"): a TELJES sotet dizajnrendszer eddig 601px ALATT NEM futott — telefonon csak a mod-kartya (.cm-modern-*) kapott sotet stilust a kulon mobil-pluginokbol, a fooldal szekcio-kartyai (.cm-side-card, .cm-stat-card, hero, magazin) feheren maradtak, mikozben a szovegszinek mar sotet-modusuak voltak -> halvanyszurke szoveg feher alapon. Kinyitva minden szelessegre. VILAGOS MODOT NEM ERINT: mind a 159 szelektor :not(.light-surface) / html.cm-dh-dark moge van kotve. */ @media all{ /* ========================================================== 1) GLOBÁLIS TOKENEK ========================================================== */ body:not(.light-surface), html.cm-dh-dark body{ --cm-bg: #050a11; --cm-bg-soft: #08111d; --cm-surface-1: #0f1724; --cm-surface-2: #111c2b; --cm-surface-3: #162235; --cm-border: rgba(148,163,184,.16); --cm-border-strong: rgba(148,163,184,.24); --cm-divider: rgba(148,163,184,.14); --cm-text: #f8fafc; --cm-text-secondary: #cbd5e1; --cm-text-muted: #94a3b8; --cm-link: #60a5fa; --cm-link-hover: #93c5fd; --cm-primary: #2f7df6; --cm-primary-hover: #4590ff; --cm-success: #22c55e; --cm-warning: #fbbf24; --cm-danger: #ef4444; } /* ========================================================== 2) BACKGROUND — minden oldalra ugyanaz a deep dark ========================================================== */ body:not(.light-surface), body:not(.light-surface) #page, body:not(.light-surface) .site, body:not(.light-surface) .site-content, body:not(.light-surface) .main-wrap, body:not(.light-surface) main, body:not(.light-surface) main#main-content, body:not(.light-surface) main.main-wrap, body:not(.light-surface) main#main-content.main-wrap, body:not(.light-surface) .cm-home-redesign, body:not(.light-surface) .cm-home-redesign__container, body:not(.light-surface) .entry-content, body:not(.light-surface) .page-content, body:not(.light-surface) .mpp-contact-page, body:not(.light-surface) .mpp-page-pricing, body:not(.light-surface) .messages-page, body:not(.light-surface) .single-mod{ background:var(--cm-bg) !important; background-color:var(--cm-bg) !important; color:var(--cm-text-secondary) !important; } /* ========================================================== 3) HEADER ========================================================== */ body:not(.light-surface) header.top-head{ background:var(--cm-bg) !important; background-color:var(--cm-bg) !important; border-bottom:1px solid var(--cm-border) !important; box-shadow:none !important; } /* ========================================================== 4) TIPOGRÁFIA — egyseges hierarchia minden oldalon ========================================================== */ body:not(.light-surface) h1, body:not(.light-surface) h2, body:not(.light-surface) h3, body:not(.light-surface) h4, body:not(.light-surface) .title, body:not(.light-surface) strong{ color:var(--cm-text) !important; } body:not(.light-surface) p, body:not(.light-surface) li, body:not(.light-surface) .description, body:not(.light-surface) .excerpt, body:not(.light-surface) .lead{ color:var(--cm-text-secondary) !important; } body:not(.light-surface) small, body:not(.light-surface) .meta, body:not(.light-surface) .muted, body:not(.light-surface) time, body:not(.light-surface) .post-meta, body:not(.light-surface) .label, body:not(.light-surface) .field-label{ color:var(--cm-text-muted) !important; } /* Linkek (kivéve gombok — a fejléc vendég Register/Login pill-jei is kivételek, különben a kék gradiensen sötétkék lenne a szöveg sötét módban) */ body:not(.light-surface) a:not(.button):not(.btn):not(.menu-cta):not(.cm-hero__cta):not(.cm-side-discord__btn):not(.cm-featured__btn):not(.cm-side-topdl__more):not(.um-button):not(.mpp-um-action):not(.cm-register-link):not(.account-actions__link):not(.mpp-social-btn):not(.cm-motd__btn):not(.cm-akt__nev):not(.cm-tam__btn):not(.cm-bev__link):not(.cm-nx-card__a):not(.cm-nx-top__a):not(.cm-nx-t__a):not(.cm-mgz-fr__t):not(.cm-mgz-nep__a):not(.cm-mgz-nep__all):not(.cm-mgz__more):not(.cm-mgz-feat){ color:var(--cm-link) !important; } body:not(.light-surface) a:not(.button):not(.cm-register-link):not(.account-actions__link):not(.mpp-social-btn):not(.cm-motd__btn):not(.cm-akt__nev):not(.cm-tam__btn):not(.cm-bev__link):not(.cm-nx-card__a):not(.cm-nx-top__a):not(.cm-nx-t__a):not(.cm-mgz-fr__t):not(.cm-mgz-nep__a):not(.cm-mgz-nep__all):not(.cm-mgz__more):not(.cm-mgz-feat):hover{ color:var(--cm-link-hover) !important; } /* ========================================================== 5) KÁRTYA RENDSZER — egyseges minden oldalon ========================================================== */ body:not(.light-surface) .glass-card, body:not(.light-surface) .cm-stat-card, body:not(.light-surface) .cm-stats-row, body:not(.light-surface) .cm-side-card, body:not(.light-surface) .cm-hero, body:not(.light-surface) .cm-stats, body:not(.light-surface) .cm-featured, body:not(.light-surface) .cm-categories, body:not(.light-surface) .mpp-card, body:not(.light-surface) .mod-card-row, body:not(.light-surface) .cm-modern-card-view, body:not(.light-surface) .mpp-game-tile, body:not(.light-surface) .mpp-um-profile-info-card, body:not(.light-surface) .mpp-auth-card, body:not(.light-surface) .mpp-form-card, body:not(.light-surface) .mpp-panel, body:not(.light-surface) .mpp-info-card, body:not(.light-surface) .mpp-game-hero, body:not(.light-surface) .mpp-pricing-card, body:not(.light-surface) .pricing-card, body:not(.light-surface) .mpp-contact-card, body:not(.light-surface) .contact-option-card, body:not(.light-surface) .mpp-contact-form, body:not(.light-surface) .mpp-contact-page__card, body:not(.light-surface) .mpp-tip-box, body:not(.light-surface) .mpp-tip, body:not(.light-surface) [class*="tip-box"]{ background:linear-gradient(180deg,var(--cm-surface-1),var(--cm-surface-2)) !important; background-color:var(--cm-surface-1) !important; border:1px solid var(--cm-border) !important; border-radius:18px !important; box-shadow:0 14px 32px rgba(0,0,0,.28) !important; color:var(--cm-text-secondary) !important; } /* Kontaktoldal — minden belso card a tartalomban */ body:not(.light-surface) .mpp-contact-page section, body:not(.light-surface) .mpp-contact-page article, body:not(.light-surface) .mpp-contact-page .glass-card, body:not(.light-surface) .mpp-contact-page > .container > div{ background:linear-gradient(180deg,var(--cm-surface-1),var(--cm-surface-2)) !important; background-color:var(--cm-surface-1) !important; border:1px solid var(--cm-border) !important; color:var(--cm-text-secondary) !important; } /* Sidebar wrapper transparent (nem keret) */ body:not(.light-surface) .cm-home-redesign__side{ background:transparent !important; background-color:transparent !important; border:0 !important; box-shadow:none !important; } /* ========================================================== 6) DIVIDER ========================================================== */ body:not(.light-surface) hr, body:not(.light-surface) .cm-featured__row + .cm-featured__row, body:not(.light-surface) .cm-side-topdl li + li, body:not(.light-surface) .cm-side-stats li + li, body:not(.light-surface) .mod-card-row + .mod-card-row, body:not(.light-surface) .cm-modern-card-view + .cm-modern-card-view{ border-color:var(--cm-divider) !important; border-top-color:var(--cm-divider) !important; border-bottom-color:var(--cm-divider) !important; } /* ========================================================== 7) FORMS — INPUT / SELECT / TEXTAREA / FILTEREK / MODAL ========================================================== */ body:not(.light-surface) input[type="text"], body:not(.light-surface) input[type="search"], body:not(.light-surface) input[type="email"], body:not(.light-surface) input[type="password"], body:not(.light-surface) input[type="url"], body:not(.light-surface) input[type="number"], body:not(.light-surface) input[type="tel"], body:not(.light-surface) textarea, body:not(.light-surface) select, body:not(.light-surface) .mpp-gfc__field, body:not(.light-surface) .mpp-gfc__pill, body:not(.light-surface) .mpp-gfc__dropdown-btn, body:not(.light-surface) .mpp-modal input, body:not(.light-surface) .mpp-modal select, body:not(.light-surface) .mpp-modal textarea, body:not(.light-surface) .um-form input, body:not(.light-surface) .um-form select{ background:var(--cm-bg-soft) !important; background-color:var(--cm-bg-soft) !important; border:1px solid var(--cm-border-strong) !important; color:var(--cm-text) !important; } body:not(.light-surface) input::placeholder, body:not(.light-surface) textarea::placeholder{ color:var(--cm-text-muted) !important; opacity:1 !important; } body:not(.light-surface) input:focus, body:not(.light-surface) textarea:focus, body:not(.light-surface) select:focus{ border-color:var(--cm-link) !important; box-shadow:0 0 0 3px rgba(96,165,250,.22) !important; outline:none !important; } /* Login / Auth Modal — Google gomb és modal sajátok */ body:not(.light-surface) .mpp-modal, body:not(.light-surface) .mpp-modal__panel, body:not(.light-surface) .mpp-modal__content, body:not(.light-surface) .mpp-auth-card{ background:linear-gradient(180deg,var(--cm-surface-1),var(--cm-surface-2)) !important; background-color:var(--cm-surface-1) !important; border:1px solid var(--cm-border) !important; color:var(--cm-text) !important; } body:not(.light-surface) .mpp-modal label, body:not(.light-surface) .mpp-auth-card label{ color:var(--cm-text-muted) !important; } /* ========================================================== 8) GOMBOK — egyseges rendszer ========================================================== */ body:not(.light-surface) .button, body:not(.light-surface) .btn, body:not(.light-surface) .menu-cta, body:not(.light-surface) a.cm-hero__cta, body:not(.light-surface) .cm-hero__cta{ color:#ffffff !important; -webkit-text-fill-color:#ffffff !important; } body:not(.light-surface) .cm-hero__cta *{ color:#ffffff !important; fill:#ffffff !important; } /* Outlined / secondary gombok */ body:not(.light-surface) .cm-featured__btn, body:not(.light-surface) .cm-side-topdl__more, body:not(.light-surface) .btn--ghost, body:not(.light-surface) .button--secondary{ background:rgba(15,23,42,.55) !important; border:1px solid var(--cm-border-strong) !important; color:var(--cm-link) !important; } body:not(.light-surface) .cm-featured__btn:hover, body:not(.light-surface) .cm-side-topdl__more:hover{ background:rgba(59,130,246,.12) !important; border-color:var(--cm-link) !important; color:var(--cm-link-hover) !important; } /* Disabled gomb */ body:not(.light-surface) [aria-disabled="true"], body:not(.light-surface) :disabled{ opacity:.65 !important; color:#dbeafe !important; } /* Header Regisztráció gomb (vendegnek) */ body:not(.light-surface) header.top-head .account-actions__link[href*="register"], body:not(.light-surface) header.top-head [data-mpp-open-register]{ background:linear-gradient(180deg,#3b82f6,#2563eb) !important; color:#ffffff !important; -webkit-text-fill-color:#ffffff !important; border:0 !important; opacity:1 !important; } /* ========================================================== 9) DISCORD KÁRTYA — saját identitás ========================================================== */ body:not(.light-surface) .cm-side-discord, body:not(.light-surface) .cm-side-card--discord{ background:linear-gradient(135deg,#5865F2 0%,#4752c4 100%) !important; background-color:#5865F2 !important; border:0 !important; color:#ffffff !important; } body:not(.light-surface) .cm-side-discord *{ color:#ffffff !important; } body:not(.light-surface) a.cm-side-discord__btn, body:not(.light-surface) .cm-side-discord__btn{ background:#ffffff !important; background-color:#ffffff !important; color:#1f2950 !important; border:0 !important; box-shadow:0 6px 14px rgba(0,0,0,.25) !important; } body:not(.light-surface) a.cm-side-discord__btn *, body:not(.light-surface) .cm-side-discord__btn *{ color:#1f2950 !important; -webkit-text-fill-color:#1f2950 !important; fill:#1f2950 !important; } body:not(.light-surface) .cm-side-discord__online, body:not(.light-surface) .cm-side-discord__total{ background:rgba(15,23,42,.72) !important; color:#f8fafc !important; border:1px solid rgba(255,255,255,.12) !important; } body:not(.light-surface) .cm-side-discord__online-dot{ background:var(--cm-success) !important; box-shadow:0 0 0 3px rgba(34,197,94,.22) !important; } /* ========================================================== 10) MOD/JATEK CARDS — meta szövegek tisztulnak ========================================================== */ body:not(.light-surface) .mod-card-row__title, body:not(.light-surface) .mod-card-row__title a, body:not(.light-surface) .cm-modern-title, body:not(.light-surface) .cm-modern-title a{ color:var(--cm-link) !important; } body:not(.light-surface) .mod-card-row__excerpt, body:not(.light-surface) .cm-modern-excerpt{ color:var(--cm-text-secondary) !important; } body:not(.light-surface) .mod-card-row__meta-line, body:not(.light-surface) .cm-modern-stat, body:not(.light-surface) .cm-modern-tax, body:not(.light-surface) .cm-modern-tax a, body:not(.light-surface) .cm-modern-author{ color:var(--cm-text-muted) !important; } /* ========================================================== 11) FOOTER ========================================================== */ body:not(.light-surface) .site-footer, body:not(.light-surface) .site-footer--premium, body:not(.light-surface) footer.site-footer{ background:linear-gradient(180deg,var(--cm-bg-soft) 0%,var(--cm-bg) 100%) !important; background-color:var(--cm-bg-soft) !important; border-top:1px solid var(--cm-border) !important; color:var(--cm-text-secondary) !important; } body:not(.light-surface) .site-footer h2, body:not(.light-surface) .site-footer h3, body:not(.light-surface) .site-footer h4, body:not(.light-surface) .site-footer strong{ color:var(--cm-text) !important; } body:not(.light-surface) .site-footer a{ color:var(--cm-text) !important; } body:not(.light-surface) .site-footer a:hover{ color:var(--cm-link-hover) !important; } body:not(.light-surface) .site-footer .copy, body:not(.light-surface) .site-footer .copy *, body:not(.light-surface) .site-footer__copy{ color:var(--cm-text-muted) !important; } /* ========================================================== 12) STAT CARDOK ========================================================== */ body:not(.light-surface) .cm-stat-card__num{ color:var(--cm-text) !important; } body:not(.light-surface) .cm-stat-card__lbl{ color:var(--cm-text-secondary) !important; } body:not(.light-surface) .cm-stat-card__link{ color:var(--cm-link) !important; } body:not(.light-surface) .cm-stat-card__ico{ background:var(--cm-surface-3) !important; color:#a9c8ff !important; } /* ========================================================== 13) SCROLLBAR / SELECTION ========================================================== */ body:not(.light-surface) ::selection{ background:rgba(59,130,246,.45); color:#fff; } } /* id="cm-dark-contact-cards-css" */ @media (min-width:1400px){ body:not(.light-surface) .cm-contact-wrap, body:not(.light-surface) .cm-contact-hero, body:not(.light-surface) .cm-contact-card, body:not(.light-surface) .cm-contact-note, body:not(.light-surface) .glass-card.mpp-contact-page{ background:linear-gradient(180deg,#0f1724,#111c2b) !important; background-color:#0f1724 !important; border:1px solid rgba(148,163,184,.18) !important; color:#cbd5e1 !important; border-radius:18px !important; box-shadow:0 14px 32px rgba(0,0,0,.28) !important; } /* A hero (felso kek banner) maradjon, csak finomitsuk */ body:not(.light-surface) .cm-contact-hero{ background:linear-gradient(135deg,#1e3a8a 0%,#2563eb 100%) !important; color:#f8fafc !important; } body:not(.light-surface) .cm-contact-hero h1, body:not(.light-surface) .cm-contact-hero h2, body:not(.light-surface) .cm-contact-hero p{ color:#f8fafc !important; } /* A 3 fo card (Tamogatas, DMCA, Kozosseg) */ body:not(.light-surface) .cm-contact-grid{ background:transparent !important; } body:not(.light-surface) .cm-contact-card h2, body:not(.light-surface) .cm-contact-card h3, body:not(.light-surface) .cm-contact-card strong{ color:#f8fafc !important; } body:not(.light-surface) .cm-contact-card p, body:not(.light-surface) .cm-contact-card{ color:#cbd5e1 !important; } body:not(.light-surface) .cm-contact-card small, body:not(.light-surface) .cm-contact-card .meta{ color:#94a3b8 !important; } /* "Tip" sav alul */ body:not(.light-surface) .cm-contact-note{ background:#0f172a !important; background-color:#0f172a !important; color:#cbd5e1 !important; } /* Contact button stilusok */ body:not(.light-surface) .cm-contact-btn{ background:linear-gradient(180deg,#3b82f6,#2563eb) !important; color:#ffffff !important; border:0 !important; } body:not(.light-surface) .cm-contact-btn.secondary, body:not(.light-surface) .cm-contact-btn.cm-ghost{ background:rgba(15,23,42,.55) !important; border:1px solid rgba(148,163,184,.24) !important; color:#f8fafc !important; } body:not(.light-surface) .cm-contact-btn:hover{ filter:brightness(1.10); } } /* id="cm-hero-live-search-dark-css" */ @media (min-width:1400px){ /* Pozicionalas: a hero search formhoz dropdown legyen alatta */ .cm-hero__search{position:relative !important;overflow:visible !important} /* DROPDOWN — sotet modra szabva */ body:not(.light-surface) .cm-home-live-results{ background:#0f1724 !important; border:1px solid rgba(148,163,184,.18) !important; box-shadow:0 22px 48px rgba(0,0,0,.50) !important; color:#cbd5e1 !important; } body:not(.light-surface) .cm-home-live-item{ color:#e2e8f0 !important; } body:not(.light-surface) .cm-home-live-item:hover, body:not(.light-surface) .cm-home-live-item:focus{ background:rgba(59,130,246,.16) !important; color:#93c5fd !important; } body:not(.light-surface) .cm-home-live-thumb{ background:#162235 !important; box-shadow:inset 0 0 0 1px rgba(148,163,184,.18) !important; } body:not(.light-surface) .cm-home-live-title{ color:#f8fafc !important; } body:not(.light-surface) .cm-home-live-meta{ color:#94a3b8 !important; } body:not(.light-surface) .cm-home-live-action{ color:#60a5fa !important; } body:not(.light-surface) .cm-home-live-empty, body:not(.light-surface) .cm-home-live-loading{ color:#94a3b8 !important; } /* Vilagos modban modern, tiszta */ body.light-surface .cm-home-live-results{ background:#ffffff !important; border:1px solid rgba(15,23,42,.10) !important; box-shadow:0 22px 48px rgba(15,23,42,.18) !important; } } /* id="cm-hero-live-search-fix-css" */ @media (min-width:1400px){ /* A dropdown szuloi NE vagjak el */ .cm-home-redesign, .cm-home-redesign__container, .cm-home-redesign__main, .cm-hero, .cm-hero__left, .cm-hero__copy, .cm-hero__search{ overflow:visible !important; } /* Dropdown maradjon a hero felett, ne legyen levagva, kepes a teljes 5 talalatot mutatni */ .cm-home-live-results{ z-index:200 !important; max-height:none !important; overflow:visible !important; } .cm-home-live-results .cm-home-live-item{ overflow:hidden !important; } } /* id="cm-promo-bar-discord-btn-css" */ @media (min-width:1400px){ header.top-head .promo-bar{ align-items:center !important; gap:12px !important; padding:6px 18px !important; font-size:13.5px !important; line-height:1.2 !important; } header.top-head .promo-bar__btn{ display:inline-flex !important; align-items:center !important; padding:3px 12px !important; height:22px !important; min-height:22px !important; font-size:12px !important; font-weight:800 !important; letter-spacing:.2px !important; line-height:1 !important; border-radius:999px !important; background:#ffffff !important; color:#1d2c63 !important; -webkit-text-fill-color:#1d2c63 !important; border:0 !important; box-shadow:0 2px 8px rgba(0,0,0,.18) !important; } header.top-head .promo-bar__btn:hover{ background:#eef2ff !important; color:#1d2c63 !important; } header.top-head .promo-bar__btn::before{ content:none !important; } } /* id="cm-hero-remove-white-filter-css" */ body.home .cm-home-hero__media{ opacity:.95!important; filter:none!important; mix-blend-mode:normal!important; } body.home .cm-home-hero__media--left{ mask-image:linear-gradient(90deg,#000 0%,#000 45%,rgba(0,0,0,.75) 58%,rgba(0,0,0,.38) 74%,rgba(0,0,0,.12) 88%,transparent 100%)!important; -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 45%,rgba(0,0,0,.75) 58%,rgba(0,0,0,.38) 74%,rgba(0,0,0,.12) 88%,transparent 100%)!important; } body.home .cm-home-hero__media--right{ mask-image:linear-gradient(270deg,#000 0%,#000 45%,rgba(0,0,0,.75) 58%,rgba(0,0,0,.38) 74%,rgba(0,0,0,.12) 88%,transparent 100%)!important; -webkit-mask-image:linear-gradient(270deg,#000 0%,#000 45%,rgba(0,0,0,.75) 58%,rgba(0,0,0,.38) 74%,rgba(0,0,0,.12) 88%,transparent 100%)!important; } body.home .cm-home-hero__media::before, body.home .cm-home-hero__media::after, body.home .cm-home-hero::before, body.home .cm-home-hero::after{ display:none!important; content:none!important; background:none!important; opacity:0!important; filter:none!important; } /* id="cm-mobile-home-fix-css" */ @media(max-width:1399px){ body.home .cm-home-hero{ min-height:auto!important; overflow:hidden!important; background:#eef5ff!important; } body.home .cm-home-hero__media{ width:100%!important; opacity:.22!important; filter:none!important; mask-image:none!important; -webkit-mask-image:none!important; } body.home .cm-home-hero__inner{ padding:34px 18px 28px!important; min-height:auto!important; } body.home .cm-home-hero__title{ max-width:100%!important; font-size:34px!important; line-height:1.08!important; margin:0 auto 16px!important; text-align:center!important; } body.home .cm-home-hero__lead{ max-width:92%!important; font-size:16px!important; line-height:1.45!important; margin:0 auto 22px!important; text-align:center!important; } body.home .cm-home-search-row{ display:flex!important; flex-direction:column!important; gap:14px!important; width:100%!important; max-width:100%!important; margin:0 auto!important; } body.home .cm-home-search-row .cm-home-search, body.home .cm-home-search{ width:100%!important; max-width:100%!important; height:58px!important; min-height:58px!important; aspect-ratio:auto!important; border-radius:18px!important; padding:5px!important; margin:0!important; display:flex!important; align-items:center!important; box-sizing:border-box!important; } body.home .cm-home-search input[type="search"], body.home .cm-home-search input[type="text"]{ height:48px!important; min-height:48px!important; font-size:16px!important; line-height:48px!important; padding:0 58px 0 16px!important; } body.home .cm-home-search button{ width:48px!important; height:48px!important; min-width:48px!important; border-radius:15px!important; } body.home .cm-home-browse-btn{ width:100%!important; height:52px!important; border-radius:12px!important; font-size:16px!important; padding:0 18px!important; } body.home .cm-home-stats__inner{ grid-template-columns:repeat(2,1fr)!important; padding:22px 18px!important; gap:22px 10px!important; } body.home .cm-home-stat{ justify-content:center!important; grid-template-columns:52px auto!important; column-gap:12px!important; } body.home .cm-home-stat__icon{ width:52px!important; height:52px!important; } body.home .cm-home-stat strong{ font-size:28px!important; } body.home .cm-home-stat span:last-child{ font-size:15px!important; } body.home .crashmod-home-games-head{ padding:24px 18px 12px!important; } body.home .mpp-games-title{ font-size:34px!important; line-height:1.05!important; } } /* id="cm-mobile-search-fix-css" */ @media(max-width:1399px){ body.home .cm-home-search-row{ width:calc(100% - 32px)!important; max-width:420px!important; margin:0 auto!important; gap:12px!important; } body.home form.cm-home-search, body.home .cm-home-search-row form.cm-home-search{ width:100%!important; max-width:100%!important; height:56px!important; min-height:56px!important; max-height:56px!important; aspect-ratio:auto!important; padding:0 6px 0 18px!important; margin:0!important; border-radius:999px!important; background:#fff!important; display:flex!important; align-items:center!important; overflow:hidden!important; box-sizing:border-box!important; } body.home form.cm-home-search input, body.home form.cm-home-search input[type="search"], body.home form.cm-home-search input[type="text"]{ flex:1 1 auto!important; width:auto!important; height:56px!important; min-height:0!important; padding:0 10px!important; margin:0!important; border:0!important; background:transparent!important; font-size:15px!important; line-height:56px!important; } body.home form.cm-home-search button, body.home form.cm-home-search .search-submit{ flex:0 0 46px!important; width:46px!important; height:46px!important; min-width:46px!important; min-height:46px!important; margin:0!important; padding:0!important; border-radius:999px!important; } body.home .cm-home-browse-btn{ width:calc(100% - 32px)!important; max-width:420px!important; height:52px!important; margin:0 auto!important; border-radius:12px!important; } } /* id="cm-profile-paid-inline" */ .mpp-author-main .mod-list.mod-list--author-cards .mpp-paid-badge{position:static!important;top:auto!important;right:auto!important;left:auto!important;margin:0!important;flex:0 0 auto!important}.mpp-author-main .mod-list.mod-list--author-cards .mod-card-row__title{gap:.3rem!important;align-items:center!important;flex-wrap:nowrap!important}.mpp-author-main.mpp-author-main .mod-list.mod-list--author-cards .mod-card-row--modland .mod-card-row__title-main{display:flex!important;flex-wrap:nowrap!important;align-items:baseline!important;gap:.34rem!important;min-width:0!important;flex:1 1 auto!important;overflow:hidden!important}.mpp-author-main.mpp-author-main .mod-list.mod-list--author-cards .mod-card-row--modland .mod-card-row__title--modland a{display:block!important;flex:0 1 auto!important;min-width:0!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;-webkit-line-clamp:unset!important}.mpp-author-main.mpp-author-main .mod-list.mod-list--author-cards .mod-card-row--modland .mod-card-row__title-version{flex:0 0 auto!important;white-space:nowrap!important}