/* Quy tac RIENG cua schematics.9minecraft.net. ⛔ KHONG sua `app.css` / `them.css`: hai tep do chep nguyen tu capes de giao dien khop tung chi tiet voi cac sub khac, va con duoc dung lai o noi khac. Sua tep dung chung la cai bay da ghi o [[reference_css_sua_tep_dung_chung]]. Moi thu rieng cua site nay o day. */ /* Hang nut hanh dong duoi hero. ⛔ KHONG dung `.phong-nut` cua app.css cho viec nay: do la thanh noi cua khung xem anh (`position:absolute; right:12px; top:12px`) — dat nut vao do la chung bay len goc tren cung va DE MAT LOGO. Phep do van bao dat (200, co H1, CSS nap, khong troi ngang); chi anh chup moi lo ra. */ .nut-hang { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0 0; } /* The trong luoi "What you can do": tieu de nho hon mot bac so voi h2 cua hero. */ .card h3 { margin: 0 0 8px; font-size: 16px; font-weight: 500; } .card p { margin: 0; color: var(--xam); font-size: 13.5px; line-height: 1.55; } /* Trang chu khong co anh nen o luoi: bo ti le 10/16 cua `.card .pv` khoi anh huong. */ .grid.van-ban { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); } /* ============================================================ CATALOG (Giai doan B) Trang chi tiet build + luoi danh muc/tag + materials. CHI dung bien cua them.css nen ca sang lan toi tu dong theo. KHONG dong vao app.css/them.css. */ /* Thumb build la ANH NGANG -> doi ti le 10/16 (doc) cua .card .pv sang 16/10. */ .grid.builds .card .pv { aspect-ratio: 16 / 10; } /* --- breadcrumb --- */ .crumb { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 2px 4px 12px; font-size: 12.5px; color: var(--xam); } .crumb a { color: var(--nhan-dam); } .crumb i { color: var(--xam-nhat); font-style: normal; } .crumb span { color: var(--chu); } /* --- the khung xem 3D (trai) --- */ .pv-card { padding: 12px; } .sanh.viewer { aspect-ratio: 4 / 3; cursor: pointer; perspective: none; } .sanh.viewer .poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; } .sanh.viewer .play { position: relative; z-index: 2; display: inline-flex; align-items: center; gap: 8px; border: 0; cursor: pointer; border-radius: 999px; padding: 11px 20px 11px 16px; font: inherit; font-size: 14px; font-weight: 500; background: rgba(17, 18, 20, .74); color: #fff; backdrop-filter: blur(2px); } .sanh.viewer .play svg { fill: #fff; } .sanh.viewer:hover .play { background: rgba(17, 18, 20, .9); } .sanh.viewer.on { aspect-ratio: auto; height: min(72vh, 620px); cursor: default; } .sanh.viewer.on iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; } /* --- cot phai: tieu de build --- */ .bld-h1 { margin: 0 0 4px; font-size: 22px; font-weight: 400; letter-spacing: -.2px; } .the .phu a { color: var(--nhan-dam); } .sum-card p { margin: 0; color: var(--xam); font-size: 13.5px; line-height: 1.6; } .chips.tags { margin-top: 4px; } /* --- materials --- */ .mats-card .nhan-muc { margin-top: 0; } .mat-g { font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: .9px; color: var(--xam); margin: 16px 0 8px; } .mat-g span { background: var(--bg); border-radius: 999px; padding: 2px 8px; margin-left: 4px; letter-spacing: 0; } .mats { display: grid; gap: 3px 18px; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); } .mat { display: flex; align-items: center; gap: 9px; font-size: 13px; padding: 3px 0; min-width: 0; } .mat .ic { flex: 0 0 24px; width: 24px; height: 24px; border-radius: 3px; image-rendering: pixelated; background-repeat: no-repeat; } .mat .ic-x { background: var(--bg); box-shadow: inset 0 0 0 1px rgba(127,127,127,.18); } .mat .mn { flex: 1 1 auto; color: var(--chu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .mat .mc { color: var(--xam); font-variant-numeric: tabular-nums; } /* --- tiles danh muc (trang chu) --- */ .tiles { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); } .tile { display: flex; flex-direction: column; gap: 3px; background: var(--the); box-shadow: var(--bong); border-radius: var(--r-vua); padding: 16px 18px; color: inherit; transition: box-shadow .15s, transform .15s; } .tile:hover { box-shadow: var(--bong-cao); transform: translateY(-1px); text-decoration: none; } .tile b { font-size: 15px; font-weight: 500; color: var(--chu); } .tile span { font-size: 12.5px; color: var(--xam); } /* --- hero search --- */ .hero-s { flex: none; margin: 18px 0 0; max-width: 520px; } .hero.mini .heroin { padding: 22px 26px; } /* --- pager --- */ .pager { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 22px; } .pg-no { color: var(--xam); font-size: 13px; } @media (max-width: 720px) { .mats { grid-template-columns: 1fr 1fr; gap: 2px 12px; } .sanh.viewer.on { height: min(64vh, 520px); } } /* ── sitemap HTML (12/10/2026) ── */ .smwrap h1{margin:18px 0 6px} .smlead{margin:0 0 4px;max-width:72ch;opacity:.78} .smnhan{margin:30px 0 12px;font-weight:700;font-size:11px;letter-spacing:.9px; text-transform:uppercase;opacity:.62} .smgrid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(min(330px,100%),1fr))} .smthe{background:rgba(127,127,127,.07);border:1px solid rgba(127,127,127,.2); border-radius:14px;padding:18px 20px 20px} .smthe h2{margin:0 0 4px;font-size:17px;display:flex;align-items:baseline;gap:8px} .smthe h2 a{text-decoration:none;color:inherit} .smso{font-weight:700;font-size:12px;opacity:.62} .smmo{margin:0 0 12px;font-size:13.5px;line-height:1.55;opacity:.8} .smds{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px} .smds a{display:inline-block;padding:6px 12px;border-radius:999px; background:rgba(127,127,127,.13);border:1px solid rgba(127,127,127,.18);font-size:13px; font-weight:600;text-decoration:none;line-height:1.3;color:inherit} .smds a:hover{background:rgba(127,127,127,.24)} .smtatca{display:inline-block;margin-top:12px;font-weight:700;font-size:13.5px} .smxml{margin:28px 0 0;padding:16px 18px;border-radius:14px;background:rgba(127,127,127,.1); border:1px solid rgba(127,127,127,.2);font-size:13.5px;line-height:1.6;opacity:.85} /* ── Menu phu "9Minecraft Network" + Mega Footer — dung chung 11 site ── ⛔⛔⛔ KHUNG DUNG CHUNG PHAI TU KHAI FONT, dung bao gio de no THUA KE. Do that 12/10: cung mot mega footer ma ra BA kieu chu khac nhau — wiki Roboto (dung) skins Google Sans Text (gan dung) tools **Times New Roman** ← body cua tools khong khai font nen roi ve serif mac dinh, va chan trang + bang Universal thua ke theo. Khong mot phep do kich thuoc nao bao duoc chuyen nay; chu site nhin ra. Chu site: *"Font o footer cung thiet ke cho dong bo"*. Lay dung chong font cua wiki lam chuan cho ca 11 site. Sinh boi C:\Son\9mc-chrome\mangluoi\_sinh.py tu mang.json. Dung sua tay. ⛔ Moi lop mang tien to `n9-`: bo nay nam tren 11 site voi 11 bo CSS khac nhau. ⛔ Mau theo `currentColor` + rgba xam trung tinh de chay duoc tren ca nen sang lan toi. */ .n9-nut{display:inline-flex;align-items:center;gap:8px;padding:7px 12px 7px 10px;border:0; border-radius:999px;background:rgba(127,127,127,.12);color:inherit;font:600 13.5px/1.2 inherit; cursor:pointer;white-space:nowrap} .n9-nut:hover{background:rgba(127,127,127,.22)} .n9-nut svg{flex:none} .n9-nut__luoi{width:18px;height:18px} .n9-nut__mui{width:14px;height:14px;opacity:.6;transition:transform .15s ease} .n9-nut[aria-expanded="true"] .n9-nut__mui{transform:rotate(180deg)} .n9-nut__chu{font-weight:700} .n9-nen{position:fixed;inset:0;z-index:2147483000;background:rgba(15,23,42,.38); opacity:0;pointer-events:none;transition:opacity .16s ease} body.n9-mo .n9-nen{opacity:1;pointer-events:auto} /* ⛔ `box-sizing:border-box` — 11 site, khong site nao chac co luat `*{box-sizing}`. Thieu no thi `width` chi tinh hop noi dung, cong 40px dem thanh 1020 thay vi 980, va JS neo theo 980 nen bang lech ra ngoai le phai. */ /* Google-inspired Minimalist Floating UI (chu site 12/10): the noi bo 28px, do bong hai lop kieu Google, be mat phang, nhan muc 11px IN HOA, nut hinh vien thuoc. ⛔ Bo goc 28/16/12 va cap do bong la quy uoc da chot cho ca mang ([[feedback_web_tool_google_floating_ui]]) — dung tu che so khac. */ .n9-bang{box-sizing:border-box;position:absolute;z-index:2147483001; width:min(980px,calc(100vw - 24px)); background:var(--n9-nen,#fff);color:var(--n9-chu,#1f1f1f);border-radius:28px; box-shadow:0 1px 3px rgba(60,64,67,.30),0 8px 24px 4px rgba(60,64,67,.15), 0 0 0 1px rgba(127,127,127,.14); padding:18px 20px 20px;opacity:0;visibility:hidden;transform:translateY(-6px); transition:opacity .16s ease,transform .16s ease,visibility .16s} body.n9-mo .n9-bang{opacity:1;visibility:visible;transform:translateY(0)} /* ⛔ Nen/chu cua bang phai tu dat: 11 site khac nhau, thua ke thi co site ra chu trang tren nen trang. Site nao co che do toi thi khai lai 2 bien nay. */ :root[data-theme="dark"] .n9-bang,html.dark .n9-bang{--n9-nen:#1f2430;--n9-chu:#e8eaed} @media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .n9-bang{--n9-nen:#1f2430;--n9-chu:#e8eaed}} .n9-bang__dau{display:flex;align-items:baseline;justify-content:space-between;gap:12px; margin:0 0 12px} .n9-bang__dau b{font-size:14px} .n9-bang__dau span{font-size:12.5px;opacity:.68} .n9-cot{display:grid;gap:18px;grid-template-columns:repeat(3,minmax(0,1fr))} @media(max-width:860px){.n9-cot{grid-template-columns:1fr}} .n9-nhan{margin:0 0 8px;font:700 11px/1.4 inherit;letter-spacing:.9px;text-transform:uppercase; opacity:.58} .n9-o{display:flex;gap:10px;align-items:flex-start;padding:9px 10px;margin:0 -10px; border-radius:12px;color:inherit;text-decoration:none} /* ⛔⛔ Mau do choi khi ro chuot KHONG phai cua bo nay — do la luat `a:hover{color:#c62828}` cua CHINH tung site ri vao, lam CA the (ten + mo ta + ten mien) do ruc. Chu site 12/10: *"doi mau do sang mau khac cho do choi ... chon mau nao diu hon 1 xiu"*. ⇒ khoa mau cho ca the, chi de TEN SUB doi mau, va dung xanh `#1a73e8` — cung mau voi nut Universal o header va nut mui ten o o tim kiem, nen nhin la mot bo. */ .n9-o:hover{background:rgba(127,127,127,.10)} .n9-o:hover,.n9-o:hover .n9-o__mo,.n9-o:hover .n9-o__host{color:inherit} .n9-o:hover .n9-o__ten{color:#1a73e8} [data-theme=dark] .n9-o:hover .n9-o__ten, :root[data-theme="dark"] .n9-o:hover .n9-o__ten{color:#8ab4f8} /* O icon mang MAU RIENG cua tung sub (bien `--n9-mau` dat ngay tren the). Glyph trang de noi bat tren nen mau, va giu nguyen do tuong phan o ca che do sang lan toi. */ .n9-o__ic{flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center; background:var(--n9-mau,rgba(127,127,127,.14));color:#fff; box-shadow:inset 0 0 0 1px rgba(0,0,0,.06)} .n9-o__ic svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9; stroke-linecap:round;stroke-linejoin:round} .n9-o__ten{display:block;font-weight:700;font-size:14px;line-height:1.25} .n9-o__mo{display:block;font-size:12.5px;line-height:1.45;opacity:.72;margin-top:1px} /* ⛔ Dong ten mien la thu CHONG HIEU NHAM — nguoi doc biet minh sap sang site anh em. Dung bo di cho gon. */ .n9-o__host{display:block;font-size:11.5px;line-height:1.4;opacity:.52;margin-top:2px; font-variant-numeric:tabular-nums} .n9-o--chinh{background:rgba(127,127,127,.07);margin:0 0 16px;padding:12px 14px; border-radius:16px} .n9-o--chinh:hover{background:rgba(127,127,127,.16)} .n9-o--day{outline:2px solid rgba(127,127,127,.32);outline-offset:-2px} .n9-o--day .n9-o__host::after{content:" · you are here";opacity:.8}.n9-home{display:inline-flex;align-items:center;justify-content:center;vertical-align:-.14em;margin-right:.34em;color:currentColor;opacity:.42}.n9-home svg{width:1.12em;height:1.12em;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.n9-o--chinh:hover .n9-home,.n9-ft__cot:hover .n9-home{opacity:.72} /* ───── MOBILE: khong dung nut rieng, chen MOT DONG vao menu san co ───── Chu site 12/10/2026: *"Tich hop vao Menu tren mobile luon thanh 1 dong giong 9minecraft Studios"*. Tren www dong do nam trong `ul#mm-list`, tren cac sub nam trong rail `.ylist`. ⛔ Duoi 992px AN han nut rieng: de ca hai la vua thua, vua day logo/o tim chat lai. */ @media(max-width:991px){.n9-nut{display:none}} /* ⛔ Tren cac sub, `.ylist` VUA la menu mobile VUA la rail mega menu cua DESKTOP. Chen dong vao do ma khong chan theo be ngang thi desktop co CA nut noi lan dong trong rail — trung nhau. Chu site 12/10: *"o desktop chi de 1 menu phu nay thoi"*. */ @media(min-width:992px){.n9-hang{display:none!important}} /* Chu site 12/10: *"9minecraft Universal o Menu Mobile trang tri cho no 1 card mau nhe giong 9minecraft Studios"*. Studios dung nen kem + vach ho phach trai; Universal dung cung KIEU nhung mau xanh — de nguoi dung thay hai cai la anh em chu khong phai mot. ⛔ `box-shadow: inset` lam vach trai chu khong phai `border-left`: them vien that la xe dich ca dong 3px so voi cac muc menu khac ([[reference_9mc_studios_menu_card_style]]). */ /* ⛔ Chu site 12/10 (lan 2): *"bo vien xanh o canh trai di"* — nen bo `inset 3px 0 0`, giu nen mo de van la mot the rieng. */ /* Chu site 13/10: *"cho gam mau xanh la cay nhe dep tuong duong mau hong cua 9minecraft Studios ben tren"* — Studios dung kem/hong rat nhat, nen o day cung phai NHAT tuong duong, dung xanh tuoi. */ .n9-hang{background:linear-gradient(90deg,#eef9f1,#fbfefc);border-radius:10px;margin:2px 0} .n9-hang>.n9-hang__mo{color:#1b6b3a;font-weight:700} [data-theme=dark] .n9-hang,:root[data-theme="dark"] .n9-hang{ background:linear-gradient(90deg,rgba(52,168,83,.16),rgba(52,168,83,.04))} [data-theme=dark] .n9-hang>.n9-hang__mo,:root[data-theme="dark"] .n9-hang>.n9-hang__mo{ color:#81c995} /* ⛔ `margin-left:auto` cua mui ten chi day duoc neu hang CHIEM HET be ngang. Do that: mui ten dang cach mep phai 321px, tuc no dinh ben trai — vi `.n9-hang__mo` co lai vua du noi dung. Phai ep `width:100%` va dat dem phai BANG cac muc menu anh em thi mui ten moi thang hang voi chung. */ /* ⛔⛔⛔ Moc cua mui ten phai la DONG TIEU DE (`.n9-hang__mo`), KHONG phai ca hang (`.n9-hang`). Khi xo xuong, `.n9-mob` nam TRONG `.n9-hang` nen hang cao len ~190px; `top:50%` cua hang roi vao GIUA LUOI THE — mui ten de len mot the site (chu site chup duoc canh no nam tren the "Java Servers"). Dong tieu de luon cao ~43px nen `top:50%` o day moi dung. `right:24px` khong doi vi the nay `width:100%`. */ /* ⛔⛔ Hai thu phai ep, do that 13/10 chu khong doan: 1. `justify-content:flex-start` — menu cua site dat `space-between` cho muc cua no, nen chu "9Minecraft Universal" bi day sang PHAI (do: cham o 38-55, chu bat dau tan 175). 2. Dem phai 47px = 24 (mui ten cach mep) + 15 (be ngang mui ten) + 8 (tho). Khong co no thi chu keo toi 316 trong khi mui ten o 293-308 => MUI TEN NAM DE LEN CHU. */ .n9-hang__mo{display:flex;align-items:center;gap:10px;cursor:pointer;position:relative; width:100%;box-sizing:border-box} /* ⛔⛔⛔ Hai thuoc tinh duoi day phai dat o DO MANH CAO HON luat menu cua site. Do that bang CDP tren skins: `.ylist > li > a{justify-content:space-between; padding:12px 16px}` = (0,1,2) — manh hon `.n9-hang__mo` = (0,1,0) nen de len. `html body .n9-hang>.n9-hang__mo` = (0,2,2), thang duoc ca cac bien the cua 11 site. ⛔ Viet rieng ra day chu khong gop vao luat tren: gop thi `display/position` cung bi nang do manh len, de dam vao cac luat khac ma khong ai ngo. */ html body .n9-hang>.n9-hang__mo{justify-content:flex-start; padding:10px 47px 10px 14px} .n9-hang__cham{flex:none;width:17px;height:17px} /* ⛔⛔ Mui ten cua CAC MUC MENU khac KHONG nam trong dong chay — no la `button.mm-sub-toggle`, `position:absolute`, cach mep phai man hinh dung 24px. Mui ten cua minh truoc day day bang `margin-left:auto` nen dung o MEP NOI DUNG, tuc 74px — lech 50px, nhin rat ro khi xep chong voi cac muc tren. Do that 13/10 chu khong doan: `phai` cua ho = 24, cua minh = 74. ⇒ Dinh vi tuyet doi y het ho. `.n9-hang` phai `position:relative` lam moc. */ .n9-hang{position:relative} .n9-hang__mui{position:absolute;right:24px;top:50%;margin:0; width:15px;height:15px;opacity:.55;transform:translateY(-50%); transition:transform .15s ease} /* ⛔ Giu nguyen `translateY(-50%)` khi xoay, bo di la mui ten nhay len mat tren hang. */ .n9-hang.mo .n9-hang__mui{transform:translateY(-50%) rotate(180deg)} /* Chu site 12/10: *"list xuong thi lam card 2 cot di"* — the nho hai cot, cung ngon ngu voi luoi the o mega footer. */ /* Chu site: *"cac card ben trong chu dam va thiet ke sao cho it khoang trong hon"* ⇒ icon va chu nam CUNG MOT HANG (truoc do xep doc nen the cao gap doi va thua cho), chu dam. */ .n9-mob{display:none;padding:2px 2px 8px} .n9-hang.mo .n9-mob{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px} .n9-mob a{display:flex!important;flex-direction:row;align-items:center;gap:8px; padding:7px 9px;border-radius:10px;text-decoration:none;color:inherit; font-size:12.5px;font-weight:600;line-height:1.2;background:rgba(127,127,127,.09); border:1px solid rgba(127,127,127,.14);min-height:0} .n9-mob a:hover{background:rgba(127,127,127,.16)} /* ⛔⛔ O icon PHAI bang o trong sprite. Sprite sinh ra voi o 26px (`background-size:286px 26px`, buoc `-26px`); de o 22px thi mot o 26px bi nhet vao khung 22px, neo goc trai-tren => icon bi CAT phai/duoi va nhin lech khoi nen trang. Chu site 13/10: *"cho icon moi link ra chinh giua khoang nen trang"*. */ .n9-mob .n9-mob__ic{width:26px;height:26px;border-radius:8px} .n9-mob .n9-mob__ic svg{width:15px;height:15px} /* ⛔ O rat hep (~160px): ten dai nhu "Bedrock Servers" phai duoc xuong dong, dung `nowrap` la tran ra ngoai the. Nhung `overflow-wrap:anywhere` + `min-width:0` thi NGUOC LAI qua tay: `anywhere` tinh ca diem be vao be rong toi thieu, `min-width:0` cho flex bop o nho hon ca tu dai nhat => "Schematics" bi be thanh "Schematic"/"s" tren the co nhan "here". Cap dung la `min-content` + `break-word`: xuong dong o DAU CACH, chi be giua tu khi tu do mot minh cung khong vua. Do bang `_thu_be_chu.py`. */ .n9-mob a>span{display:block;min-width:min-content;overflow-wrap:break-word} /* ⛔ Nhan "here" CUNG la `span` con truc tiep nen dinh luon `overflow-wrap:anywhere` o tren => bi be giua tu thanh "HER"/"E" (thay tren the "Java Servers" o servers). Go rieng cho no, va `flex:none` de no khong bi bop lai. */ .n9-mob a>span.n9-mob__host{flex:none;white-space:nowrap;overflow-wrap:normal}.n9-mob a>span.n9-home{flex:none;white-space:nowrap;overflow-wrap:normal;min-width:0} .n9-mob__ic{flex:none;width:26px;height:26px;border-radius:8px;display:grid;place-items:center; background:var(--n9-mau,#5f6368);color:#fff} .n9-mob__ic svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2; stroke-linecap:round;stroke-linejoin:round} .n9-mob__host{margin-left:auto;font-size:9.5px;font-weight:700;opacity:.55; text-transform:uppercase;letter-spacing:.04em} /* ──────────────── HEADER DUNG CHUNG — mau la TRANG CHU www ──────────────── Chu site 12/10: *"Thong nhat Header cua desktop va mobile la mang nen trang trai dai het va co vach ben duoi giong het trang chu 9minecraft. Trang chu se la thiet ke mau va moi trang sub se theo do. Thiet ke khung search cung giong trang chu"*. Moi con so duoi day DO THAT tu www (getComputedStyle), khong go theo cam tinh ([[feedback_giong_het_la_ca_kieu_dang]]): thanh nen #fff · cao 70px · bong 0 1px 4px rgba(0,0,0,.06) · ruot toi da 1280px o tim cao 46px · nen #f0f4f9 · bo 999px · dem 0 5px 0 12px input nen trong · chu 16px #1f1f1f nut 36x36 tron · nen #0b57d0 · mui ten trang Che do toi cua www: thanh #1a1f24 · o tim #232a35 · chu #e8eaed · nut #1a73e8. ⛔ Chu site: *"Bo het back to 9minecraft o tren top cua cac sub vi da co Menu Universal"*. An bang CSS o day de an NGAY tren moi trang da cache; dong thoi van go khoi ma nguon. */ .n9-nut,.n9-bang,.n9-nen,.n9-hang,.n9-mob,.n9-ft{ font-family:Roboto,system-ui,-apple-system,"Segoe UI",Arial,sans-serif} .n9-bang *,.n9-ft *,.n9-mob *{font-family:inherit} .bk9{display:none!important} /* ⛔ VI SAO `!important` o day — co chu y, khong phai luoi: Vai sub de header TRONG SUOT de nhin xuyen xuong anh hero, bang nhung luat nhu `body.co-hero header.top{background:transparent}` (0,2,2) va `body.co-hero .nav{background:rgba(22,27,34,.56);backdrop-filter:blur(14px)}`. Moi site mot ten lop khac nhau nen KHONG the viet mot bo chon du manh ma van tong quat. Day la quyet dinh cua chu site: *"Trang chu se la thiet ke mau va moi trang sub se theo do"*, nen bo chung PHAI thang. */ header.top{background:#fff!important;box-shadow:0 1px 4px rgba(0,0,0,.06)!important; border-bottom:0;padding:0!important} /* ⛔ Thanh nhin thay thuc ra la `.nav` ben trong (vai sub lam no thanh mot vien thuoc kinh mo mau toi). Phai go hieu ung do, neu khong se co mot the toi noi tren dai trang. */ /* ⛔ `border:0` KHONG duoc quen. `.nav` von la mot vien thuoc co vien 1px; toi go nen, bo goc va do bong nhung de lai VIEN — tren nen trang no ve thanh mot khung chu nhat ma mat chi bat duoc hai canh doc, trong nhu mot vach thang vo co canh menu. Chu site bat duoc o bedrock-servers; loi nay co tren MOI sub dung khuon `.nav`. */ header.top .nav{background:transparent!important;border:0!important;border-radius:0!important; box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important; min-height:70px} /* ⛔ capes va schematics boc noi dung trong ".topin" va bien no thanh mot THE NOI BO TRON (`border-radius:999px`, do bong, cao 90px) — khac han dai phang trai het cua www va cua 9 site con lai. Do that 13/10 o 1400px. Lam phang de ca 11 site giong nhau. */ /* ⛔ Bo CA DEM DOC, khong chi lam phang: ".topin" co `padding:10px 18px`, nen 70px noi dung + 20px dem = 90px — cao hon 9 site kia dung 20px. `min-height:70px` mot minh khong ha duoc vi chieu cao do NOI DUNG + DEM quyet dinh, khong do min-height. */ header.top .topin{background:transparent!important;border-radius:0!important; box-shadow:none!important;border:0!important;min-height:70px; padding-top:0!important;padding-bottom:0!important} /* ⛔ THU TU tren desktop phai la: … o tim › nut sang-toi (sang-toi NGOAI CUNG, nhu www). tools dang de sang-toi GIUA nut Universal va o tim — do that 13/10, chi rieng no lech. `order` sua duoc ma khong phai dong vao markup cua 11 bo nguon khac nhau. */ @media(min-width:992px){ header.top .nav form.hs{order:5} header.top .nav .icbtn{order:8} } /* ⛔ Tren DIEN THOAI www di thu tu KHAC desktop: menu › sang-toi › logo › tim (nut sang-toi nam BEN TRAI logo). Cac sub dang de no ben phai logo — do that 13/10 bang anh that. Chu site: *"bo tri vi tri dung, thu tu dung ... giong het site chinh"*. ⛔ Phai loai `.mcs-nut` ra: nut mo khay tim cua cac sub CUNG mang lop `.icbtn`, neu khong no se bi keo luon sang trai va o tim bien mat khoi goc phai. */ /* ⛔ PHAI `!important`: cac sub TU dat `order` cho tung phan tu (do that tren skins: mgb 1 · logo 2 · n9-nut 3 · mcs-nut 4 · icbtn 3). Khong co `!important` thi luat cua minh thua va thu tu khong nhuc nhich — ma CSS van nam trong trang, nen grep "co luat moi khong" se bao CO, bao dong gia. Phai do `getComputedStyle(...).order`. */ @media(max-width:991px){ header.top .nav .mgb{order:1!important} header.top .nav .icbtn:not(.mcs-nut){order:2!important} header.top .nav .logo,header.top .nav .brand{order:3!important} header.top .nav form.hs,header.top .nav .mcs-nut{order:9!important} } /* ⛔⛔ `min-height` co dinh CHAN hieu ung thu nho khi cuon. Do that 12/10: skins da duoc gan class `is-header-shrunk` nhung chieu cao van ket o 70px — dung thu pham la dong tren. Chu site: *"khi cuon trang thi ti le cac thanh phan tren header thu nho chua dong nhat va chieu cao header chua thu nho dang ke"*. ⇒ Ha min-height theo trang thai cuon, VA thu nho dong bo moi thanh phan ben trong (logo · nut Universal · o tim · nut tron) de khong cai nho cai khong. */ html.is-header-shrunk header.top,html.n9-cuon header.top,html.mcs-cuon header.top,html.is-header-shrunk header.top .nav,html.n9-cuon header.top .nav,html.mcs-cuon header.top .nav{min-height:52px} html.is-header-shrunk header.top .logo img,html.n9-cuon header.top .logo img,html.mcs-cuon header.top .logo img{max-height:30px;width:auto} html.is-header-shrunk form.hs,html.n9-cuon form.hs,html.mcs-cuon form.hs{height:38px} html.is-header-shrunk form.hs input,html.n9-cuon form.hs input,html.mcs-cuon form.hs input{height:36px;font-size:15px} html.is-header-shrunk .n9-go,html.n9-cuon .n9-go,html.mcs-cuon .n9-go{width:30px;height:30px} html.is-header-shrunk .n9-go svg,html.n9-cuon .n9-go svg,html.mcs-cuon .n9-go svg{width:17px;height:17px} html.is-header-shrunk .n9-nut,html.n9-cuon .n9-nut,html.mcs-cuon .n9-nut{padding-top:4px;padding-bottom:4px} /* ⛔ www dung bo chon RIENG cho o tim: ".h-bar-desktop__search .search-form", khong phai "form.hs" nhu cac sub. Theme cua no DA co san luat thu nho cho thanh, logo, nut sang-toi va avatar — nhung BO QUEN o tim, nen khi cuon thi thanh thap xuong ma o tim van 46px. Chu site 13/10: "khung search o site goc tren desktop chua thu nho lai khi cuon". */ html.is-header-shrunk .h-bar-desktop__search .search-form, html.n9-cuon .h-bar-desktop__search .search-form,html.mcs-cuon .h-bar-desktop__search .search-form{height:36px!important} html.is-header-shrunk .h-bar-desktop__search .search-input-wrapper, html.n9-cuon .h-bar-desktop__search .search-input-wrapper,html.mcs-cuon .h-bar-desktop__search .search-input-wrapper{height:34px!important} html.is-header-shrunk .h-bar-desktop__search .search-field, html.n9-cuon .h-bar-desktop__search .search-field,html.mcs-cuon .h-bar-desktop__search .search-field{height:34px!important;font-size:14px} html.is-header-shrunk .h-bar-desktop__search .search-submit, html.n9-cuon .h-bar-desktop__search .search-submit,html.mcs-cuon .h-bar-desktop__search .search-submit{width:28px!important;height:28px!important} html.is-header-shrunk .h-bar-desktop__search .search-submit svg, html.n9-cuon .h-bar-desktop__search .search-submit svg,html.mcs-cuon .h-bar-desktop__search .search-submit svg{width:16px;height:16px} html.is-header-shrunk .topbar,html.n9-cuon .topbar,html.mcs-cuon .topbar,html.is-header-shrunk .topbar .twrap,html.n9-cuon .topbar .twrap,html.mcs-cuon .topbar .twrap{min-height:52px} html.is-header-shrunk .topbar .search,html.n9-cuon .topbar .search,html.mcs-cuon .topbar .search{height:38px} html.is-header-shrunk .topbar .search input,html.n9-cuon .topbar .search input,html.mcs-cuon .topbar .search input{height:36px;font-size:15px} header.top .nav .mgb,header.top .nav .icbtn{color:#5f6368!important; background:transparent!important} header.top .nav .mgb:hover,header.top .nav .icbtn:hover{background:rgba(60,64,67,.08)!important} /* ⛔ Hero duoc keo len am (seeds: -111px) de chui DUOI thanh trong suot. Thanh gio duc, neu van keo thi dinh anh bi che mat. */ body.co-hero .hero9{margin-top:0!important} header.top .wrap{max-width:1280px} form.hs{box-sizing:border-box;display:flex;align-items:center;gap:8px;height:46px; padding:0 5px 0 12px;background:#f0f4f9;border:1px solid transparent;border-radius:999px; box-shadow:none;transition:background .15s ease,box-shadow .15s ease} form.hs:focus-within{background:#fff;border-color:transparent; box-shadow:0 1px 3px rgba(0,0,0,.08),0 4px 8px 3px rgba(0,0,0,.05)} /* ⛔⛔ Cac sub dat kinh lup bang `.hs svg{position:absolute;left:14px;top:50%}`. Hai hau qua, ca hai deu CAM: 1. Trong bo cuc flex moi, kinh lup khong chiem cho nen chu trong o tim nam DE LEN no. 2. Bo chon `.hs svg` bat CA cai svg mui ten ben trong `.n9-go` — mui ten bi nem ve mep trai cua o tim va khuat han, nhin ra chi la mot hinh tron xanh tron tron. => phai ep `position:static` cho CA HAI, khong chi cai dau. */ form.hs>svg{position:static!important;transform:none!important;flex:none;width:18px; height:18px;fill:none;stroke:#9ca3af;stroke-width:2;stroke-linecap:round; stroke-linejoin:round} /* ⛔ `!important` vi cung ly do: `body.co-hero .hs input{background:rgba(255,255,255,.1); color:#fff}` — chu trang tren o tim nen sang la khong doc duoc. */ form.hs input{flex:1 1 auto;min-width:0;height:44px;padding:0;border:0!important; outline:none;background:transparent!important;font-size:16px;color:#1f1f1f!important; box-shadow:none!important} form.hs input::placeholder{color:#9ca3af!important} form.hs>svg{stroke:#9ca3af!important} /* nut mui ten tron — chen bang JS cho moi site, xem `js_cho()` */ .n9-go{flex:none;display:grid;place-items:center;width:36px;height:36px;margin-left:auto; padding:0;border:0;border-radius:50%;background:#0b57d0;cursor:pointer; transition:background .15s ease} .n9-go:hover{background:#0847ab} .n9-go svg{position:static!important;transform:none!important;width:20px;height:20px; fill:none;stroke:#fff;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round} /* ⛔ Hai cach khai che do toi cung ton tai tren mang luoi: `[data-theme=dark]` (cac sub) va `:root[data-theme="dark"]` (theme www). Khai ca hai, neu khong se co site tut lai nen trang trong khi than trang da toi. */ /* ⛔⛔⛔ PHAI co `!important` o CA luat toi. Luat sang tren kia dung `!important` (de thang cac ban ghi de rieng cua tung sub), nen neu luat toi khong co thi `!important` luon thang va **thanh header KET CUNG MAU TRANG o che do toi** — trong khi o tim kiem lai doi mau dung (vi no khong dung `!important`), nen nhin qua tuong chi "hoi lech mau". Do that 12/10: body #0f1115, header van rgb(255,255,255). */ [data-theme=dark] header.top,:root[data-theme="dark"] header.top{background:#1a1f24!important; box-shadow:0 1px 4px rgba(0,0,0,.4)!important} [data-theme=dark] header.top .nav .mgb,[data-theme=dark] header.top .nav .icbtn, :root[data-theme="dark"] header.top .nav .mgb, :root[data-theme="dark"] header.top .nav .icbtn{color:#e8eaed!important} [data-theme=dark] header.top .nav .mgb:hover,[data-theme=dark] header.top .nav .icbtn:hover, :root[data-theme="dark"] header.top .nav .mgb:hover, :root[data-theme="dark"] header.top .nav .icbtn:hover{background:rgba(255,255,255,.12)!important} [data-theme=dark] form.hs,:root[data-theme="dark"] form.hs{background:#232a35!important} [data-theme=dark] form.hs:focus-within,:root[data-theme="dark"] form.hs:focus-within{ background:#2b3340!important;box-shadow:0 1px 3px rgba(0,0,0,.5)!important} [data-theme=dark] form.hs input,:root[data-theme="dark"] form.hs input{color:#e8eaed!important} [data-theme=dark] form.hs input::placeholder, :root[data-theme="dark"] form.hs input::placeholder{color:#9aa0a6!important} [data-theme=dark] form.hs>svg,:root[data-theme="dark"] form.hs>svg{stroke:#9aa0a6!important} [data-theme=dark] .n9-go,:root[data-theme="dark"] .n9-go{background:#1a73e8!important} /* ── wiki di mot khuon RIENG: khong co `
`, khong co `
` ── Cau truc that (do 12/10): `.topbar > .twrap > [.mw-burger · a.brand · span.search > button.kinh + input#q]`. Bo chon `header.top` / `form.hs` khong khop gi ca, nen neu chi viet cho cac sub thi wiki LANG LE giu nguyen giao dien cu — khong loi, khong canh bao. */ /* ⛔ `.topbar` co chieu cao RIENG + `padding:10px 0`. Nang `.twrap` len 70px ma de nguyen `.topbar` thi ruot CAO HON dai trang: o tim kiem thò han xuong vung toi ben duoi — nhin anh moi thay, khong phep do kich thuoc nao bao. ⇒ tra chieu cao ve `auto`. */ .topbar{background:#fff!important;box-shadow:0 1px 4px rgba(0,0,0,.06); height:auto!important;min-height:70px;padding:0!important} .topbar .twrap{max-width:1280px;background:transparent!important;border-radius:0!important; box-shadow:none!important;backdrop-filter:none!important;min-height:70px} .topbar .mw-burger,.topbar .brand{color:#5f6368!important} .topbar .search{box-sizing:border-box;display:flex;align-items:center;gap:8px;height:46px; padding:0 5px 0 12px;background:#f0f4f9;border:1px solid transparent;border-radius:999px; transition:background .15s ease,box-shadow .15s ease} .topbar .search:focus-within{background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.08),0 4px 8px 3px rgba(0,0,0,.05)} .topbar .search .kinh{flex:none;width:18px;height:18px;padding:0;border:0; background:transparent!important;color:#9ca3af!important;cursor:pointer} .topbar .search .kinh svg{width:18px;height:18px} .topbar .search input{flex:1 1 auto;min-width:0;height:44px;padding:0;border:0!important; outline:none;background:transparent!important;border-radius:0!important;font-size:16px; color:#1f1f1f!important;box-shadow:none!important} .topbar .search input::placeholder{color:#9ca3af!important} [data-theme=dark] .topbar,:root[data-theme="dark"] .topbar{background:#1a1f24!important; box-shadow:0 1px 4px rgba(0,0,0,.4)!important} [data-theme=dark] .topbar .search,:root[data-theme="dark"] .topbar .search{ background:#232a35!important} [data-theme=dark] .topbar .search input,:root[data-theme="dark"] .topbar .search input{ color:#e8eaed!important} [data-theme=dark] .topbar .search .kinh,:root[data-theme="dark"] .topbar .search .kinh{ color:#9aa0a6!important} [data-theme=dark] .topbar .mw-burger,[data-theme=dark] .topbar .brand, :root[data-theme="dark"] .topbar .mw-burger,:root[data-theme="dark"] .topbar .brand{ color:#e8eaed!important} @media(max-width:991px){ header.top .wrap{max-width:100%} /* ⛔ Tren dien thoai thanh phai GON hon, neu khong noi dung chen nhau roi xuong hang — capes va schematics ra header cao 151px (hai hang) o khung 390px. */ /* ⛔ capes va schematics boc them mot khung flex ".topin" giua ".wrap" va ".nav". Chinh no xuong hai hang nen header mobile cao 137px, trong khi ".nav" ben trong van 56px — do ".nav" roi ket luan "da mot hang" la SAI, phai do CA header. (Dong chu thich nay tung bi nuot chu: viet vi du trong dau huyen roi day qua bash thi bash CHAY no nhu lenh — xem reference_powershell_backtick_nuot_ky_tu.) */ header.top,header.top .nav,header.top .topin{min-height:56px} header.top .nav,header.top .topin{flex-wrap:nowrap!important} /* ⛔ ".topin" con co dem doc ~12px: con cao nhat ben trong chi 56px ma khung van 81px. Do con roi ket luan "da gon" la sai — phai do CHINH khung. */ header.top .topin{padding-top:2px!important;padding-bottom:2px!important} /* ⛔⛔ Tren capes va schematics, ".nav" KHONG phai thanh header — no la mot cum lien ket (Browse · Editor · About) NAM TRONG ".topin". O khung 390px no trai tu x=64 den 264 trong khi logo tu 118 den 272 => NUT "Browse" DE LEN LOGO. Do thuc te 13/10. Cac lien ket nay da co trong menu hamburger, nen tren dien thoai an di la dung. ⛔ Neo vao "header.top .topin>.nav" chu KHONG phai ".nav" tran: o moi sub khac ".nav" chinh la thanh header — an nham la mat ca header. */ header.top .topin>.nav{display:none!important} /* ⛔ Ti le logo phai KHOP www. Do that 13/10 o khung 390px: www logo cao 33px, con skins 22 · tools 26 · servers 29 · seeds 30 — moi sub mot co, nen nhin khong giong trang chinh. (Can hang thi VON DA dung: tam doc cua moi phan tu lech 0px, nen van de la TI LE chu khong phai can le — do chieu cao roi ket luan "lech hang" la sai.) */ /* ⛔ "max-height" chi CHAN TREN — nang no len khong lam logo to ra. Logo cac sub dang 22-30px vi chinh CSS cua ho dat vay. Phai dat "height" that, kem "width:auto" de khong meo ti le. */ header.top .logo img{height:33px;width:auto;max-height:none} /* ⛔ Tren mobile BO nut mui ten: www mobile khong he co nut nay (o tim cua no thu lai thanh mot nut mo khay). O tools, "form.hs" co lai con 69px ma van cong them nut xanh => ra mot hinh tron lac long ngay canh nut sang-toi. */ /* ⛔ PHAI ke ca `.topbar .search` (khuon cua wiki), khong chi `form.hs`: wiki khong dung `` nen luat chi viet cho `form.hs` bo sot no — nut mui ten xanh van hien va CHONG LEN kinh lup, dung loi chu site chup o header wiki tren dien thoai. */ form.hs .n9-go,.topbar .search .n9-go{display:none!important} /* ⛔ O tim cua wiki tren dien thoai phai co lai thanh NUT TRON nhu cac sub, khong thi no keo dai het thanh va de len logo. */ .topbar .search{flex:none!important;width:44px;min-width:44px;height:44px; padding:0!important;background:transparent!important;border:0!important; border-radius:999px;position:relative;overflow:hidden} .topbar .search .kinh{position:absolute;left:50%;top:50%; transform:translate(-50%,-50%);width:22px;height:22px} .topbar .search input{position:absolute;inset:0;width:100%;height:100%; padding:0!important;opacity:0;cursor:pointer} .topbar .twrap:has(.search:focus-within) .search{width:auto;flex:1 1 100%!important; height:40px;overflow:visible;background:#f0f4f9!important;padding:0 5px 0 12px!important} .topbar .twrap:has(.search:focus-within) .search .kinh{position:static;transform:none; width:18px;height:18px} .topbar .twrap:has(.search:focus-within) .search input{position:static;opacity:1; height:38px;flex:1 1 auto} /* Chuyen dong muot giong www (theme cua no dung transition .22s) de het cam giac giat */ header.top,header.top .nav,header.top .wrap,header.top .topin,.topbar,.topbar .twrap{ transition:height .2s ease,min-height .2s ease} header.top .logo img,form.hs,.topbar .search{ transition:max-height .2s ease,height .2s ease} /* ⛔ Chieu cao thanh do NOI DUNG quyet dinh, khong phai `min-height`: ha min-height xuong 48 ma o tim van cao 42 thi thanh van 60px. Do that tren skins/litematica: class `is-header-shrunk` CO duoc gan, min-height DA la 48, ma chieu cao van 60. ⇒ phai thu nho CHINH cac thanh phan, va khai o DAY (sau cac luat mobile co so) de chac chan ve thu tu. */ html.is-header-shrunk header.top,html.n9-cuon header.top,html.mcs-cuon header.top,html.is-header-shrunk header.top .nav,html.n9-cuon header.top .nav,html.mcs-cuon header.top .nav{min-height:46px} html.is-header-shrunk header.top .logo img,html.n9-cuon header.top .logo img,html.mcs-cuon header.top .logo img{max-height:24px} html.is-header-shrunk form.hs,html.n9-cuon form.hs,html.mcs-cuon form.hs{height:34px;padding:0 3px 0 9px} html.is-header-shrunk form.hs input,html.n9-cuon form.hs input,html.mcs-cuon form.hs input{height:32px;font-size:14px} html.is-header-shrunk form.hs>svg,html.n9-cuon form.hs>svg,html.mcs-cuon form.hs>svg{width:15px;height:15px} html.is-header-shrunk .n9-go,html.n9-cuon .n9-go,html.mcs-cuon .n9-go{width:28px;height:28px} html.is-header-shrunk .n9-go svg,html.n9-cuon .n9-go svg,html.mcs-cuon .n9-go svg{width:16px;height:16px} html.is-header-shrunk .topbar,html.n9-cuon .topbar,html.mcs-cuon .topbar,html.is-header-shrunk .topbar .twrap,html.n9-cuon .topbar .twrap,html.mcs-cuon .topbar .twrap{min-height:46px} html.is-header-shrunk .topbar .search,html.n9-cuon .topbar .search,html.mcs-cuon .topbar .search{height:34px} html.is-header-shrunk .topbar .search input,html.n9-cuon .topbar .search input,html.mcs-cuon .topbar .search input{height:32px;font-size:14px} /* ⛔⛔ Giua `header.top` va `.nav` con mot `DIV.wrap` co DEM DOC. Da thu nho MOI con cua `.nav` xuong 34px ma thanh van 59px — vi `.wrap` cong them ~13px. Thieu dong nay thi moi phep do con deu bao "dat" ma tong chieu cao khong doi mot pixel. */ html.is-header-shrunk header.top .wrap,html.n9-cuon header.top .wrap,html.mcs-cuon header.top .wrap{ padding-top:0!important;padding-bottom:0!important} /* ⛔⛔ Phai dat THANG `height`, `min-height` khong du. Do that tren skins sau khi cuon: moi con cua `.nav` deu <= 34px, khong con dem doc o bat ky cap nao, `min-height` da la 46 — ma `.nav` van bao `height: 59.0156px`. Con so le .0156 la dau hieu chieu cao do HOP DONG (line box) quyet dinh chu khong do noi dung, nen chi `min-height` thi khong bao gio keo xuong duoc. */ html.is-header-shrunk header.top .wrap,html.n9-cuon header.top .wrap,html.mcs-cuon header.top .wrap, html.is-header-shrunk header.top .nav,html.n9-cuon header.top .nav,html.mcs-cuon header.top .nav, html.is-header-shrunk header.top .topin,html.n9-cuon header.top .topin,html.mcs-cuon header.top .topin, html.is-header-shrunk header.top,html.n9-cuon header.top,html.mcs-cuon header.top{height:46px!important; line-height:normal} /* ⛔ Tren dien thoai o tim kiem KHONG nam trong thanh — no la mot NUT mo khay tim (`.mcs-nut.icbtn`), va chinh nut do cao 48px moi la thu giu thanh o 60px. Do that tren skins: con cua `.nav` la mgb 40 · logo 22 · mcs-nut **48** · icbtn 40. Thu nho moi o tim ma bo qua nut nay thi khong nhuc nhich mot pixel nao. */ html.is-header-shrunk header.top .nav .icbtn,html.n9-cuon header.top .nav .icbtn,html.mcs-cuon header.top .nav .icbtn, html.is-header-shrunk header.top .nav .mgb,html.n9-cuon header.top .nav .mgb,html.mcs-cuon header.top .nav .mgb, html.is-header-shrunk header.top .nav .mcs-nut,html.n9-cuon header.top .nav .mcs-nut,html.mcs-cuon header.top .nav .mcs-nut, html.is-header-shrunk .topbar .mw-burger,html.n9-cuon .topbar .mw-burger,html.mcs-cuon .topbar .mw-burger{width:34px!important;height:34px!important; min-width:0!important;min-height:0!important;padding:0!important} html.is-header-shrunk header.top .nav .icbtn svg,html.n9-cuon header.top .nav .icbtn svg,html.mcs-cuon header.top .nav .icbtn svg, html.is-header-shrunk header.top .nav .mgb svg,html.n9-cuon header.top .nav .mgb svg,html.mcs-cuon header.top .nav .mgb svg, html.is-header-shrunk .topbar .mw-burger svg,html.n9-cuon .topbar .mw-burger svg,html.mcs-cuon .topbar .mw-burger svg{width:18px;height:18px} .topbar .search{height:42px;padding:0 4px 0 10px} .topbar .search input{height:40px;font-size:15px} form.hs{height:42px;padding:0 4px 0 10px} form.hs input{height:40px;font-size:15px} .n9-go{width:32px;height:32px} .n9-go svg{width:18px;height:18px} } /* ── BREADCRUMB: giong het site goc 9minecraft ── Chu site 12/10: *"Thiet ke breadcrumb tat ca cac sub giong het site goc 9minecraft"*. Do that tu www (`#breadcrumbs`): nen #f8fafc · vien 1px #e2e8f0 · bo 8px · dem 10px 14px · chu Roboto 14px mau #64748b · lien ket #2563eb dam 500 · dau phan cach `»`. ⛔ Cac sub dung HAI khuon khac nhau: `#breadcrumbs` (p) — tools (giong www) `p.crumb,nav.crumb` — skins · bedrock-skins · litematica, dau phan cach `›`, khong nen, chu Google Sans Text 13.5px, lien ket mau XAM. Viet mot bo chon thoi la ba sub kia khong doi gi ma khong bao loi. */ #breadcrumbs,p.crumb,nav.crumb{box-sizing:border-box;display:flex;flex-wrap:wrap;align-items:center; /* chu site 13/10: *"nho cach header ben tren ra mot chut, co khoang tho"* */ gap:0 6px;margin:18px 0 16px;padding:10px 14px;background:#f8fafc; border:1px solid #e2e8f0;border-radius:8px; font-family:Roboto,system-ui,-apple-system,"Segoe UI",Arial,sans-serif; font-size:14px;line-height:1.5;color:#64748b} #breadcrumbs a,p.crumb a,nav.crumb a{color:#2563eb;font-weight:500;text-decoration:none} #breadcrumbs a:hover,p.crumb a:hover,nav.crumb a:hover{color:#1d4ed8;text-decoration:underline} #breadcrumbs .breadcrumb_last,p.crumb [aria-current],nav.crumb [aria-current], p.crumb span:last-child,nav.crumb span:last-child{color:#64748b;font-weight:400} /* ⛔ Dau phan cach cua `p.crumb,nav.crumb` la `›` (trong the ``), cua www la `»`. De nguyen thi hai site nhin van khac nhau du moi thu con lai da giong. An ky tu goc roi ve lai. Da kiem markup that: `Home›…` — the `` la DAU PHAN CACH, khong phai bieu tuong nha, nen de len duoc. */ p.crumb i,nav.crumb i{font-size:0;color:transparent;font-style:normal} /* ⛔⛔ PHAI viet hai gach cheo. Khoi CSS nay nam trong chuoi Python, ma trong Python mot gach cheo roi so khong la ky tu NUL — viet mot gach thi ra NUL + "0BB", trinh duyet ve `◆BB` thay vi `»`. Khong mot canh bao nao; chi nhin anh moi thay. (Ca DONG CHU THICH nay cung tung dinh: viet vi du co gach cheo la sinh NUL ngay trong tep CSS gui cho nguoi dung — nen o day dien ta bang loi, khong viet ky tu do ra.) */ p.crumb i::before,nav.crumb i::before{content:"\00BB";font-size:14px;color:#64748b} /* ⛔ `p.crumb,nav.crumb` KHONG co bieu tuong nha, www thi co (`span.mcseo-bc-home`). Them bang `::before` de khong phai sua markup cua ba kho ma khac nhau. Dung `mask` chu khong phai anh nen: ma mau nam trong chuoi SVG se khong theo mau lien ket duoc. */ p.crumb a:first-child,nav.crumb a:first-child{display:inline-flex;align-items:center;gap:5px} p.crumb a:first-child::before,nav.crumb a:first-child::before{content:"";width:14px;height:14px;flex:none; background:currentColor; -webkit-mask:url("data:image/svg+xml;utf8,") center/contain no-repeat; mask:url("data:image/svg+xml;utf8,") center/contain no-repeat} [data-theme=dark] #breadcrumbs,[data-theme=dark] p.crumb,[data-theme=dark] nav.crumb, :root[data-theme="dark"] #breadcrumbs,:root[data-theme="dark"] p.crumb, :root[data-theme="dark"] nav.crumb{ background:#1a1f24;border-color:#2a3038;color:#9aa0a6} [data-theme=dark] #breadcrumbs a,[data-theme=dark] p.crumb a,[data-theme=dark] nav.crumb a, :root[data-theme="dark"] #breadcrumbs a,:root[data-theme="dark"] p.crumb a, :root[data-theme="dark"] nav.crumb a{color:#8ab4f8} /* ── KHOI RELATED ("You May Also Like") tren MOBILE: the 2 cot ── Chu site 12/10: *"Phan related post cac sub 9minecraft o mobile >> Bo tri la card 2 cot"*. ⛔ Sau sub dung BA ten lop khac nhau cho cung mot luoi — do that 12/10: `.grid` servers · bedrock-servers · capes `.luoi` skins · bedrock-skins · seeds `.gguide` wiki Viet mot ten thoi la bo sot bon sub ma khong co dau hieu gi. (capes von da 2 cot.) ⛔ Khoi nay CHI co o trang chi tiet; do trang chu roi ket luan "khong co related" la sai. */ /* ⛔⛔ KHONG dong vao `.rl-p .grid` cua servers/bedrock-servers. The may chu chua nhieu thong tin mot dong (ten · so nguoi choi · dia chi · co · the loai) nen ep hai cot thi dia chi may chu xuong MOI DONG MOT KY TU va hang loi tung bac — chu site: *"Servers co cau truc thong tin khac nen related 2 cot bi xau va sai lech hang dong"*. capes cung dung `.grid` nhung VON DA hai cot theo CSS cua no, khong can minh ep. */ @media(max-width:640px){ .rl-p .luoi,.rl-p .gguide{ grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important} .rl-p .luoi>*,.rl-p .gguide>*{min-width:0} } /* ───────────────────────── MEGA FOOTER ───────────────────────── Khung lay tu chan trang GOC cua www ("Gradient Spotlight") theo yeu cau chu site: nen gach Minecraft toi + phu gradient + hao quang vang, logo, tagline, dong mien tru trach nhiem va copyright GIU NGUYEN. Rieng phan lien ket doi thanh luoi THE NOI kieu Google-inspired Minimalist Floating UI. ⛔ Anh nen 48x48 nhung HAN vao CSS bang data URI (391 byte). Neu tro URL sang www.9minecraft.net thi 10 sub phai goi them mot yeu cau sang ten mien khac, va mot lan www doi duong dan anh la 10 site mat nen cung luc. ⛔ `flex-shrink:0`: tren www than trang la flex column va luat cu `footer.f{flex-shrink:0}` KHONG con khop vi the chan trang gio la `.n9-ft` — thieu dong nay thi trang ngan bi co chan trang lai. */ /* ⛔ Chu site: *"Footer background phai keo dai het chieu rong man hinh. Cac sub khac cung vay"*. Tren wiki, `.n9-ft` la con truc tiep cua ma van chi rong 1180 — co mot luat cua site go bo chieu rong cho moi khoi cap mot. `width:100%;max-width:none` va bo moi le ngang thi nen trai het, con RUOT van duoc `.n9-ft__in` giu o 1180. */ .n9-ft{box-sizing:border-box;flex-shrink:0;position:relative;overflow:hidden; width:100%!important;max-width:none!important;margin-left:0!important; margin-right:0!important; margin-top:44px;padding:0;text-align:center;font-size:13.5px;line-height:1.6; color:#e8edf2;background-color:#141a1f; background-image:url(data:image/gif;base64,R0lGODlhMAAwAJEAABoaGiQkJCAgIB0dHSH5BAAAAAAALAAAAAAwADAAAAL/lIepaBIPgYRt2dHqVQ3G+Wgbkwlj0nmBBFDHiZWpSqtJ/bAyWuJ+cMPpSrzMDxesDTNFlsW5gRRlLpkAqsBapCRrVaZFhBXcmDdkdaCty+8L1p2lrxI5ER43uDPttQhOZYN3ceTR5zFIWJhTpyeYSLa4ImExN9Kw9CfWaLJguYHJqTmwVJl2aZD5lnC4J0IzN0PDAnuKUBvrQ6vyOYA7pyt6BzlmGjsKV+x5jAyjzJE2CwKUZySJK93yMNVzzetoOM1t7V0F2aXaqRiwcx4K0L4en/g+v+AKvvWI5cM8o49oE4Akv46VIbhNIEIPc9KJAPbtTDgW8GyZCcQwmgqKWMKYVJPlp9vEZnho0Bt2ztcjQCjPmRyEMUm6EVgwVinzoaLHCzVF3kyocpJOkj3J4VPH0ugaY72SgmS36mPLEzaXLkO6YVfGWKh20px2lKQ9nmBDWunaoAAAOw==)} .n9-ft::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none; background:linear-gradient(180deg,rgba(15,19,25,.60),rgba(12,16,21,.80))} .n9-ft::after{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%); width:1000px;max-width:130%;height:300px;z-index:0;pointer-events:none; background:radial-gradient(closest-side,rgba(251,191,36,.13),transparent 72%)} .n9-ft>*{position:relative;z-index:1} .n9-ft__in{box-sizing:border-box;max-width:1180px;margin:0 auto;padding:52px 24px 24px} .n9-ft__hieu{display:block;text-align:center;line-height:0} /* ⛔ PHAI khai `display` + `margin:auto`: nhieu sub co luat `img{display:block}`, ma `text-align:center` KHONG can duoc phan tu block => logo dat ve le trai. Da dinh that tren seeds/skins/... trong khi www/wiki/schematics (anh van inline) trong van dung, nen nhin mot site roi ket luan "xong" la sai. */ .n9-ft__logo{display:block;margin:0 auto;height:50px;width:auto;max-width:min(100%,340px); object-fit:contain;image-rendering:pixelated} .n9-ft__tag{margin:14px auto 32px;max-width:70ch;font-size:14px;color:#9aa5b1} /* ── luoi the noi ── */ /* ⛔ KHONG dung `auto-fit`: o 1180px no ra 5 cot, ma 11 the chia 5 thanh 5+5+1 — the cuoi (Capes) dung mot minh ca mot hang, nhin nhu bi sot. Chia 4 thanh 4+4+3, chi ho MOT o, va the rong ~280px nen ten mien dai nhat (bedrock-servers) van gon mot dong. */ .n9-ft__luoi{display:grid;gap:12px;margin:0 0 30px;text-align:left; grid-template-columns:repeat(4,minmax(0,1fr))} @media(max-width:1040px){.n9-ft__luoi{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(max-width:760px){.n9-ft__luoi{grid-template-columns:repeat(2,minmax(0,1fr))}} .n9-ft__cot{box-sizing:border-box;border-radius:16px;padding:14px 15px 12px; background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08); transition:background .15s ease,border-color .15s ease,transform .15s ease} .n9-ft__cot:hover{background:rgba(251,191,36,.07);border-color:rgba(251,191,36,.42); transform:translateY(-2px)} .n9-ft__cot h3{display:flex;align-items:center;gap:9px;margin:0;line-height:1.25; font-size:13.5px;font-weight:700} .n9-ft__cot h3 a{color:#fff;text-decoration:none} .n9-ft__cot:hover h3 a{color:#fbbf24}.n9-ft__cot h3 .n9-home{opacity:.5}.n9-ft__cot:hover h3 .n9-home{opacity:.85;color:#fbbf24} /* nhan 11px IN HOA — dung ngon ngu voi bang Universal o header */ .n9-ft__host{display:block;margin:8px 0 9px;font-size:10px;letter-spacing:.07em; text-transform:uppercase;color:#76828f} .n9-ft__day{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px; background:rgba(251,191,36,.16);color:#fbbf24;font-size:9.5px;font-weight:700; letter-spacing:.06em;text-transform:uppercase} .n9-ft__cot ul{list-style:none;margin:0;padding:0} .n9-ft__cot li{margin:0 0 2px} .n9-ft__cot li a{display:block;font-size:12.5px;line-height:1.5;color:#aab4bf; text-decoration:none;transition:color .12s ease} .n9-ft__cot li a:hover{color:#fbbf24} /* ── vach vang + nut vien thuoc + chu cuoi: giu nguyen tinh than ban goc ── */ .n9-ft__vach{height:2px;width:130px;margin:0 auto 22px; background:linear-gradient(90deg,transparent,#fbbf24,transparent)} .n9-ft__duoi{display:flex;flex-wrap:wrap;align-items:center;justify-content:center; gap:8px 10px;margin:0 0 18px} .n9-ft__duoi a{padding:6px 15px;border-radius:999px;font-size:12.5px;font-weight:600; color:#cdd6df;text-decoration:none;background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.09); transition:background .15s ease,border-color .15s ease,color .15s ease} .n9-ft__duoi a:hover{color:#fbbf24;background:rgba(251,191,36,.08); border-color:rgba(251,191,36,.45)} .n9-ft__mt{max-width:760px;margin:0 auto;font-size:12px;line-height:1.6;color:#93a0ad} .n9-ft__mt b{color:#e8edf2} .n9-ft__cpy{margin:12px 0 0;font-size:12.5px;color:#aeb8c2} .n9-ft__cpy a{color:#fff;font-weight:700;text-decoration:none} .n9-ft__cpy a:hover{color:#fbbf24} @media(hover:none){.n9-ft__cot li a{padding:3px 0}} /* ⛔ Tren dien thoai 11 the xep doc thanh mot cot rat dai. Ep HAI cot va thu nho dem lai. */ @media(max-width:640px){ .n9-ft__in{padding:38px 16px 20px} .n9-ft__logo{height:42px} .n9-ft__tag{font-size:13px;margin-bottom:24px} .n9-ft__luoi{gap:10px;grid-template-columns:repeat(2,minmax(0,1fr))} .n9-ft__cot{padding:12px 12px 10px;border-radius:14px} .n9-ft__cot h3{font-size:12.5px;gap:7px} .n9-ft__host{font-size:9.5px;margin:6px 0 7px} .n9-ft__cot li a{font-size:12px} .n9-ft__duoi a{padding:5px 12px;font-size:12px} } /* vi tri trong sprite — sinh boi _sprite.py, dung sua tay */ .n9-o__ic--anh,.n9-mob__ic--anh{background-color:#fff;background-repeat:no-repeat;background-image:url(https://tools.9minecraft.net/_g/mang-icons.png?v=850a30f7)} .n9-o__ic--anh{background-size:374px 34px} .n9-mob__ic--anh{background-size:286px 26px} .n9-ic-www.n9-o__ic--anh{background-position:-0px 0} .n9-ic-www.n9-mob__ic--anh{background-position:-0px 0} .n9-ic-tools.n9-o__ic--anh{background-position:-34px 0} .n9-ic-tools.n9-mob__ic--anh{background-position:-26px 0} .n9-ic-wiki.n9-o__ic--anh{background-position:-68px 0} .n9-ic-wiki.n9-mob__ic--anh{background-position:-52px 0} .n9-ic-schematics.n9-o__ic--anh{background-position:-102px 0} .n9-ic-schematics.n9-mob__ic--anh{background-position:-78px 0} .n9-ic-litematica.n9-o__ic--anh{background-position:-136px 0} .n9-ic-litematica.n9-mob__ic--anh{background-position:-104px 0} .n9-ic-servers.n9-o__ic--anh{background-position:-170px 0} .n9-ic-servers.n9-mob__ic--anh{background-position:-130px 0} .n9-ic-bedrock-servers.n9-o__ic--anh{background-position:-204px 0} .n9-ic-bedrock-servers.n9-mob__ic--anh{background-position:-156px 0} .n9-ic-seeds.n9-o__ic--anh{background-position:-238px 0} .n9-ic-seeds.n9-mob__ic--anh{background-position:-182px 0} .n9-ic-skins.n9-o__ic--anh{background-position:-272px 0} .n9-ic-skins.n9-mob__ic--anh{background-position:-208px 0} .n9-ic-bedrock-skins.n9-o__ic--anh{background-position:-306px 0} .n9-ic-bedrock-skins.n9-mob__ic--anh{background-position:-234px 0} .n9-ic-capes.n9-o__ic--anh{background-position:-340px 0} .n9-ic-capes.n9-mob__ic--anh{background-position:-260px 0} /* ── BANG GOI Y TIM KIEM (dung chung 11 site) ── Mau sac lay tu bo bien `--sx-*` cua www; o day khai lai voi tien to rieng de khong dung do voi bien cua tung sub. */ .n9-gy{--gy-nen:#fff;--gy-tonal:#f0f4f9;--gy-line:#e3e8ef;--gy-chu:#1f1f1f; --gy-chu2:#444746;--gy-mo:#5f6368;--gy-xanh:#0b57d0;--gy-chon:#e8f0fe; position:absolute;z-index:99999;display:none;margin:0;padding:6px 0;list-style:none; box-sizing:border-box;background:var(--gy-nen);border:1px solid transparent; border-radius:24px;overflow:hidden auto;max-height:min(440px,70vh); box-shadow:0 1px 3px rgba(60,64,67,.14),0 4px 12px 3px rgba(60,64,67,.09); font-family:Roboto,system-ui,-apple-system,"Segoe UI",Arial,sans-serif; font-size:15px;color:var(--gy-chu);text-align:left} .n9-gy.mo{display:block} .n9-gy__nhan{padding:10px 20px 6px;font-size:12.5px;font-weight:500;letter-spacing:.1px; color:var(--gy-mo)} .n9-gy__vach{height:1px;margin:6px 0;background:var(--gy-line)} .n9-gy__muc{display:flex;align-items:center;gap:14px;min-height:44px; padding:6px 18px 6px 20px;cursor:pointer;line-height:1.35; transition:background-color .12s ease} .n9-gy__muc:hover{background:var(--gy-tonal)} .n9-gy__muc.chon{background:var(--gy-chon)} /* ⛔ Dao nguoc so voi truc giac: phan KHOP voi cai nguoi dung vua go la phan NHAT, phan goi y THEM moi dam — dung cach Google va cach www lam. */ .n9-gy__hl{font-weight:400;color:var(--gy-chu2)} /* ⛔ PHAI loai tru `.n9-gy__the` va `.n9-gy__anh`: ca hai cung la `span` con truc tiep cua `.n9-gy__muc`, nen bo chon `>span` tran se cho CHUNG `flex:1` — the nhan bi keo dai het hang, nhin nhu mot thanh xam. Chup anh that moi thay. */ .n9-gy__muc>span:not(.n9-gy__the):not(.n9-gy__anh){flex:1;min-width:0;font-weight:500; overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .n9-gy__ic{flex:none;width:18px;height:18px;fill:none;stroke:var(--gy-mo);stroke-width:2; stroke-linecap:round;stroke-linejoin:round} .n9-gy__muc:hover .n9-gy__ic,.n9-gy__muc.chon .n9-gy__ic{stroke:var(--gy-xanh)} .n9-gy__mui{flex:none;width:16px;height:16px;fill:none;stroke:var(--gy-xanh); stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:.9} .n9-gy__anh{flex:none;width:40px;height:40px;border-radius:10px;object-fit:cover; background:var(--gy-tonal)} .n9-gy__the{flex:none;margin-left:auto;padding:2px 8px;border-radius:999px; background:var(--gy-tonal);color:var(--gy-mo);font-size:11px;font-weight:600; letter-spacing:.02em;white-space:nowrap} .n9-gy::-webkit-scrollbar{width:8px} .n9-gy::-webkit-scrollbar-thumb{background:#c4c7c5;border-radius:999px} [data-theme=dark] .n9-gy,:root[data-theme="dark"] .n9-gy{ --gy-nen:#1b212b;--gy-tonal:#232a35;--gy-line:#2f3741;--gy-chu:#e8eaed; --gy-chu2:#c4c7c5;--gy-mo:#9aa0a6;--gy-xanh:#8ab4f8;--gy-chon:#1f3052; border-color:#2f3741;box-shadow:0 1px 3px rgba(0,0,0,.5),0 4px 12px 3px rgba(0,0,0,.3)} @media(max-width:991px){ .n9-gy{border-radius:20px;font-size:16px} .n9-gy__muc{min-height:48px} } html body{--fb-tonal:#eef8f1;--fb-tonal2:#e2f3e8;--fb-line:#cfe9d9;--fb-card:#fff;--fb-ink:#1f2a24;--fb-mut:#5c6b62;--fb-acc:#1e8e3e;--fb-accink:#fff;--fb-accsoft:#e6f4ea;--fb-track:#f1f3f4;--fb-vien:#9aa0a6;--fb-do:#c62828;--fb-dosoft:#fef2f2;--fb-dovien:#fecaca;--fb-sh1:0 1px 2px rgba(60,64,67,.12), 0 1px 3px rgba(60,64,67,.08);--fb-sh2:0 1px 3px rgba(60,64,67,.15), 0 6px 16px rgba(60,64,67,.12);--fb-hov:rgba(60,64,67,.08);} html[data-theme="dark"] body{--fb-tonal:#14201a;--fb-tonal2:#1a2a21;--fb-line:#26392e;--fb-card:#1a1f24;--fb-ink:#e8eaed;--fb-mut:#9aa6a0;--fb-acc:#34a853;--fb-accink:#06220f;--fb-accsoft:rgba(52,168,83,.16);--fb-track:#283038;--fb-vien:#6b7a72;--fb-do:#f28b82;--fb-dosoft:rgba(242,139,130,.14);--fb-dovien:rgba(242,139,130,.42);--fb-sh1:0 1px 2px rgba(0,0,0,.45);--fb-sh2:0 1px 3px rgba(0,0,0,.5), 0 6px 16px rgba(0,0,0,.4);--fb-hov:rgba(255,255,255,.10);} @media(prefers-color-scheme:dark){html:not([data-theme="light"]) body{--fb-tonal:#14201a;--fb-tonal2:#1a2a21;--fb-line:#26392e;--fb-card:#1a1f24;--fb-ink:#e8eaed;--fb-mut:#9aa6a0;--fb-acc:#34a853;--fb-accink:#06220f;--fb-accsoft:rgba(52,168,83,.16);--fb-track:#283038;--fb-vien:#6b7a72;--fb-do:#f28b82;--fb-dosoft:rgba(242,139,130,.14);--fb-dovien:rgba(242,139,130,.42);--fb-sh1:0 1px 2px rgba(0,0,0,.45);--fb-sh2:0 1px 3px rgba(0,0,0,.5), 0 6px 16px rgba(0,0,0,.4);--fb-hov:rgba(255,255,255,.10);}} html body .n9-loc{margin:18px 0 14px;font-size:14px;line-height:1.5;color:var(--fb-ink)} html body .n9-loc *{box-sizing:border-box} html body .n9-loc:empty{min-height:116px} html body .loc--tim{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 10px;background:none;border:0;padding:0} html body .loc--tim input[type="search"]{flex:1 1 260px;min-width:0;height:44px;padding:0 16px 0 42px;border:1px solid var(--fb-line);border-radius:999px;background:var(--fb-card) url("data:image/svg+xml;utf8,") no-repeat 15px center;color:var(--fb-ink);font:inherit;font-size:15px;box-shadow:var(--fb-sh1)} html body .loc--tim input[type="search"]:focus{outline:none;border-color:var(--fb-acc);box-shadow:0 0 0 3px var(--fb-accsoft)} html body .loc--tim button{height:44px;padding:0 22px;border:0;border-radius:999px;background:var(--fb-acc);color:#fff;font:inherit;font-weight:600;cursor:pointer;box-shadow:0 1px 3px rgba(30,142,62,.35)} html body .loc--tim button:hover{filter:brightness(1.06)} @media(max-width:768px){html body .loc--tim input[type="search"]{flex:1 1 100%}html body .loc--tim button{flex:1 1 auto}} html body .mcf-sidebar{background:var(--fb-tonal);border:1px solid var(--fb-line);border-radius:28px;box-shadow:var(--fb-sh1);overflow:hidden;margin:0 0 12px;transition:border-radius .25s ease,box-shadow .2s ease} html body .mcf-sidebar.mcf-collapsed{border-radius:999px} html body .mcf-sidebar-header{appearance:none;-webkit-appearance:none;font:inherit;text-align:left;width:100%;display:flex;align-items:center;gap:10px;min-height:56px;padding:8px 10px 8px 8px;background:transparent;border:0;cursor:pointer;user-select:none;touch-action:manipulation;color:var(--fb-ink)} html body .mcf-sidebar-header:hover{background:var(--fb-tonal2)} html body .mcf-sidebar-header>*{pointer-events:none} html body .mcf-title{display:inline-flex;align-items:center;gap:12px;font-size:16px;font-weight:600;color:var(--fb-ink)} html body .mcf-title svg{box-sizing:content-box;width:20px;height:20px;padding:9px;border-radius:50%;background:var(--fb-acc);color:#fff;box-shadow:0 1px 3px rgba(30,142,62,.35)} html body .mcf-active-count{display:inline-flex;align-items:center;padding:2px 9px;border-radius:999px;background:var(--fb-acc);color:#fff;font-size:12px;font-weight:700;line-height:1.4} html body .mcf-active-count:empty{display:none} html body .mcf-pending-count{font-size:12px;font-weight:600;color:#b45309} html[data-theme="dark"] body .mcf-pending-count{color:#fbbc04} html body .mcf-toggle-icon{margin-left:auto;width:36px;height:36px;border-radius:50%;background:var(--fb-card);box-shadow:var(--fb-sh1);display:inline-grid;place-items:center;color:var(--fb-acc);transition:transform .2s ease} html body .mcf-sidebar:not(.mcf-collapsed) .mcf-toggle-icon{transform:rotate(180deg)} html body .mcf-sidebar.mcf-collapsed .mcf-body{display:none} html body .mcf-body{padding:4px 14px 14px;background:transparent} html body .mcf-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px} html body .mcf-facet{background:var(--fb-card);border:0;border-radius:22px;box-shadow:var(--fb-sh1);padding:14px 12px 12px;min-width:0;overflow:hidden} html body .mcf-facet-header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 4px 10px;border:0} html body .mcf-facet-header strong{display:inline-flex;align-items:center;gap:10px;flex:1;min-width:0;font-size:14px;font-weight:700;letter-spacing:.6px;color:var(--fb-ink)} html body .mcf-facet-header strong::before{content:"";flex:0 0 auto;width:28px;height:28px;border-radius:10px;background:var(--fb-tonal) var(--fb-ico) center/20px 20px no-repeat;image-rendering:pixelated} html body .mcf-facet-collapse{display:inline-flex;align-items:center;justify-content:center;min-width:32px;min-height:32px;padding:4px 6px;background:transparent;border:0;border-radius:50%;cursor:pointer;color:var(--fb-mut);line-height:0;flex-shrink:0;appearance:none;-webkit-appearance:none} html body .mcf-facet-collapse svg{transition:transform .2s ease} html body .mcf-facet[aria-collapsed="true"] .mcf-facet-collapse svg{transform:rotate(-90deg)} html body .mcf-facet[aria-collapsed="true"] .mcf-facet-body{display:none} html body .mcf-facet-search{display:block;width:100%;margin:0 0 8px;height:40px;padding:0 14px 0 38px;border:1px solid transparent;border-radius:999px;font:inherit;color:var(--fb-ink);background:var(--fb-track) url("data:image/svg+xml;utf8,") no-repeat 14px center} html body .mcf-facet-search:focus{outline:none;background-color:var(--fb-card);border-color:var(--fb-acc);box-shadow:0 0 0 3px var(--fb-accsoft)} html body .mcf-facet-list{list-style:none;margin:0;padding:0;overflow:visible} html body .mcf-facet-item{margin:2px 0;padding:0} html body .mcf-facet-item label{display:flex;align-items:center;gap:10px;min-height:40px;padding:6px 10px;border-radius:12px;cursor:pointer;color:var(--fb-ink);font-size:14px;font-weight:500;transition:background-color .15s ease} html body .mcf-facet-item input[type="checkbox"]{-webkit-appearance:none;appearance:none;flex:0 0 auto;width:20px;height:20px;margin:0;border:2px solid var(--fb-vien);border-radius:6px;background:var(--fb-card) center/14px 14px no-repeat;cursor:pointer;transition:background-color .15s ease,border-color .15s ease} html body .mcf-facet-item input[type="checkbox"]:checked{border-color:var(--fb-acc);background-color:var(--fb-acc);background-image:url("data:image/svg+xml;utf8,")} html body .mcf-facet-item input[type="checkbox"]:focus-visible{outline:2px solid var(--fb-acc);outline-offset:2px} html body .mcf-facet-item:has(input:checked)>label{background:var(--fb-accsoft)} html body .mcf-facet-item input:checked+.mcf-term-name{color:var(--fb-acc);font-weight:600} html body .mcf-term-name{flex:1;min-width:0;overflow-wrap:anywhere} html body .mcf-term-count{margin-left:auto;padding:1px 8px;border-radius:999px;background:var(--fb-track);color:var(--fb-mut);font-size:12px} @media(hover:hover){html body .mcf-facet-item label:hover{background:var(--fb-tonal)}} @media(hover:none){html body .mcf-facet-item label:hover{background:transparent}html body .mcf-facet-item:has(input:checked)>label:hover{background:var(--fb-accsoft)}html body .mcf-sidebar-header:hover{background:transparent}} html body .mcf-facet-item.n9-an{display:none} html body .mcf-show-more-li{margin-top:4px} html body .mcf-show-more{width:100%;padding:8px 10px;border:0;border-radius:12px;background:var(--fb-track);color:var(--fb-acc);font:inherit;font-weight:600;cursor:pointer} html body .mcf-show-more:hover{background:var(--fb-accsoft)} html body .mcf-footer{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:12px 4px 2px;background:transparent;border-top:0} html body .mcf-selected-chips{display:flex;flex-wrap:wrap;gap:5px;align-items:center;flex:1;min-width:0} html body .mcf-selected-chips:empty{display:none} html body .mcf-chip{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:999px;background:var(--fb-card);border:1px solid var(--fb-line);box-shadow:var(--fb-sh1);color:var(--fb-ink);font-size:12px;font-weight:500;line-height:1.4;white-space:nowrap} html body .mcf-chip-x{background:none;border:0;border-radius:50%;cursor:pointer;color:var(--fb-mut);opacity:.7;padding:0 0 0 2px;font-size:14px;line-height:1} html body .mcf-chip-x:hover{opacity:1;color:var(--fb-do)} html body .mcf-clear-all,html body .mcf-btn-apply{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 20px 0 14px;border-radius:999px;font:inherit;font-weight:600;cursor:pointer} html body .mcf-clear-all{background:transparent;border:1px solid var(--fb-line);color:var(--fb-mut)} html body .mcf-clear-all[hidden]{display:none} html body .mcf-clear-all:hover{color:var(--fb-do);border-color:var(--fb-dovien)} html body .mcf-clear-all::before,html body .mcf-btn-apply::before{content:"";width:20px;height:20px;flex:0 0 auto;background:center/contain no-repeat;image-rendering:pixelated} html body .mcf-clear-all::before{width:16px;height:16px;background-image:url("data:image/webp;base64,UklGRpYAAABXRUJQVlA4TIoAAAAvP8APEB8gEEjaH3oNIQHh/0XRBAcEBEX+jzb/AWTmB1e1bSvVhs8bhRLcCNjGItCHCN6HNq5PzgkQ0X8CSRvPIrwE0Jd8rPEABRK+bfIFjCkbg9sCctrkkcOjhE0lw3nJWE3IwUCQPXOhiCVHF4oErEdA0JkHTcjmUUAJ+n6AOfvwOwGYt5f5kAc=")} html body .mcf-btn-apply::before{background-image:url("data:image/webp;base64,UklGRuYAAABXRUJQVlA4TNkAAAAvP8APED+gqG0bONTXPTBT1LYRG+u4+Tsop6htIzbWcfN3UG7+A4D/7xmsQpt3ZcbdMUButr1tQ5cF+gAlOTNQuQdQGSBgcnf5M4Db/uiNPH9vRP8nwL3LcMeE8NlP0OyOQXXVj0HGyj5nkgY3StLSpgNSAFYGXPVdYUCZXYybkweoOF77b1QM+Mp6TjGQfEYQN5503MX4ScoI2hgQVFfAAHdjDIzD8exfqFNEytieGL9hMsDdMQYrOxwltdU4TSSfbY8Kmgw67s4psDIqxvGSfMaAjntg/F4SAA==")} html body .mcf-btn-apply{margin-left:auto;border:0;background:var(--fb-acc);color:#fff;box-shadow:0 1px 3px rgba(30,142,62,.35),0 4px 12px rgba(30,142,62,.22)} html body .mcf-btn-apply:disabled{background:var(--fb-track);color:var(--fb-mut);box-shadow:none;cursor:not-allowed} html body .mcf-btn-apply:disabled::before{filter:grayscale(1);opacity:.5} html body .mc-sortbar{padding:6px;background:var(--fb-track);border:0;border-radius:999px;box-shadow:inset 0 1px 2px rgba(60,64,67,.08)} html body .mc-sortbar:has(.mc-sortbar__row--range){border-radius:24px} html body .mc-sortbar__row{display:flex;align-items:center;flex-wrap:wrap;gap:4px} html body .mc-sortbar__label{display:inline-flex;align-items:center;gap:8px;padding:0 8px 0 6px;font-size:12.5px;font-weight:700;letter-spacing:.6px;color:var(--fb-mut)} html body .mc-sortbar__label::before{content:"";width:22px;height:22px;flex:0 0 auto;background:url("data:image/webp;base64,UklGRhQBAABXRUJQVlA4TAgBAAAvP8APEF+gNJKk6H7/g0KiyT850lDaSAp06izyB4mm/+ZQIklSc9lnUEg0//8c8x8A8P9vNHa2dTOaHZuLM5ozx93r3WOAatu26uaFPiAyNl/wxgjbssSgLmp6IKvq+TaqI+7+Qfs+Lwz36rUj+j8BgT93l3TMaRewkn4MEV8miegCJV8Iaw8Rhi6HB3MvIQJatYILanqI+l0O5lfZ08wuT1GrJh+46B4eLLqAdNltOOfqRlVeXk88Y2JHXWZJutHRwUz4MB0/eDOVsqQ5cwHub5qu+MuAsqRfqwwYGyJuJD8ICDWxymaODVZSGjHVrBUCXABhTZLV/0I1SYVgrvtm1pZkhbvPWwE=") center/contain no-repeat;image-rendering:pixelated} html body .mc-sortbar__row--range .mc-sortbar__label::before{background-image:url("data:image/webp;base64,UklGRi4BAABXRUJQVlA4TCEBAAAvP8APEIegKJKk5u7I4ZujBQQgBf8PTGBDaSRJ0f3u6jT6dWRAEQb5F44gQE0kSdH96UWHCpSgAJt4+iEmn/8AAP/DlBJpxu/pTLc7IQbNSTuPHcXiQK+66wuR8dy82xkcN5KkSHvM4L+7d9ULB/3NjOg/I7dtHElHTdm+fxgmuxt1mGw/5HFewnOYu/TGDjiqFxVgrd7Uo/pKqq/0/5nf1qW30jr1RN024b000xb4/0xrANkKRj2qmfphrT7VBzDOKrypPXEGnuob4VW9qCcgOQF9kc9t7pn/rVPpXu2HLZDHeA3zOPJbXh9HTxzUi3oufaM020Htg2lJdRyA8dYPO8DwUprHuwv7YH6qj3W8/X/mpXqX+niz9cByu4wfbzsAAA==")} html body .mc-sortbtn,html body .mc-rangebtn{display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:0 16px 0 12px;border:0;border-radius:999px;background:transparent;color:var(--fb-ink);font-size:13.5px;font-weight:600;text-decoration:none;transition:background-color .15s ease,box-shadow .15s ease,color .15s ease} html body .mc-rangebtn{min-height:34px;padding:0 14px} html body .mc-sortbtn__ico{width:17px;height:17px;flex:0 0 auto} html body .mc-sortbtn.is-active,html body .mc-sortbtn.is-active:hover,html body .mc-rangebtn.is-active,html body .mc-rangebtn.is-active:hover{background:var(--fb-card);color:var(--fb-acc);box-shadow:0 0 0 1.5px var(--fb-acc),var(--fb-sh2)} @media(hover:hover){html body .mc-sortbtn:not(.is-active):hover,html body .mc-rangebtn:not(.is-active):hover{background:var(--fb-hov);color:var(--fb-ink)}} html body .mc-sortbar__row--range{margin-top:6px;padding-top:6px;border-top:1px solid rgba(60,64,67,.12)} html[data-theme="dark"] body .mc-sortbar__row--range{border-top-color:rgba(255,255,255,.08)} @media(prefers-color-scheme:dark){html:not([data-theme="light"]) body .mc-sortbar__row--range{border-top-color:rgba(255,255,255,.08)}} html body .mcf-active-summary{position:relative;margin:14px 0 6px;padding:4px 0 4px 18px;display:flex;flex-wrap:wrap;align-items:baseline;column-gap:8px;row-gap:6px;font-size:16px;line-height:1.6;color:var(--fb-ink)} html body .mcf-active-summary::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:5px;height:70%;border-radius:999px;background:linear-gradient(180deg,#ef4444 0%,#c62828 50%,#991b1b 100%)} html body .mcf-summary-count{font-size:22px;font-weight:800;color:var(--fb-do);font-variant-numeric:tabular-nums;line-height:1.6} html body .mcf-summary-label,html body .mcf-summary-filter-label{color:var(--fb-mut);font-weight:500} html body .mcf-summary-filter-label{text-transform:lowercase} html body .mcf-summary-sep{color:var(--fb-line);margin:0 2px} html body .mcf-summary-chip{display:inline-block;position:relative;top:-1px;padding:3px 11px;border-radius:14px;background:var(--fb-dosoft);color:var(--fb-do);border:1px solid var(--fb-dovien);font-size:13px;font-weight:600;line-height:1.5;white-space:nowrap} @media(max-width:768px){html body .n9-loc:empty{min-height:150px}html body .mcf-sidebar.mcf-collapsed{border-radius:28px}html body .mcf-grid{grid-template-columns:1fr;gap:10px}html body .mcf-body{padding:4px 10px 12px}html body .mcf-facet{border-radius:20px;padding:12px 10px 10px}html body .mcf-facet-item label{min-height:44px}html body .mcf-footer{flex-wrap:wrap;padding-top:10px}html body .mcf-selected-chips{flex:1 1 100%;width:100%;margin-bottom:2px}html body .mcf-btn-apply{flex:1 1 auto;justify-content:center;margin-left:0}html body .mc-sortbar{border-radius:24px;padding:8px}html body .mc-sortbar__label{flex:1 1 100%;padding:4px 6px 2px}html body .mc-sortbtn{min-height:42px;padding:0 14px 0 10px}html body .mcf-active-summary{margin-top:12px;padding-left:16px;font-size:15px;column-gap:6px}html body .mcf-summary-count{font-size:19px}html body .mcf-summary-chip{font-size:12.5px;padding:2px 9px}} html body .mcf-facet[data-facet-key="versions"]{--fb-ico:url("data:image/webp;base64,UklGRi4BAABXRUJQVlA4TCEBAAAvP8APEIegKJKk5u7I4ZujBQQgBf8PTGBDaSRJ0f3u6jT6dWRAEQb5F44gQE0kSdH96UWHCpSgAJt4+iEmn/8AAP/DlBJpxu/pTLc7IQbNSTuPHcXiQK+66wuR8dy82xkcN5KkSHvM4L+7d9ULB/3NjOg/I7dtHElHTdm+fxgmuxt1mGw/5HFewnOYu/TGDjiqFxVgrd7Uo/pKqq/0/5nf1qW30jr1RN024b000xb4/0xrANkKRj2qmfphrT7VBzDOKrypPXEGnuob4VW9qCcgOQF9kc9t7pn/rVPpXu2HLZDHeA3zOPJbXh9HTxzUi3oufaM020Htg2lJdRyA8dYPO8DwUprHuwv7YH6qj3W8/X/mpXqX+niz9cByu4wfbzsAAA==")} html body .mcf-facet[data-facet-key="loader"]{--fb-ico:url("data:image/webp;base64,UklGRuoAAABXRUJQVlA4TN4AAAAvP8APAE+gqG0jNqj+xk0Ix+DUtI3EBnXrfUXwa1USAAiCe2IE/wcS5j/CrcQAqBuRpThQ735tlvdjcBXbVt1gAQtYuBawEAuxcC1cC9HbdwvT370j+j8B3QZoeD4dDhqD7voaFxAm9TSEF9DYg9Zbwz10w/Jgyl0fQhl21xcmN4keqE5LvUnC9Z2WN6rTpDxI7unpPmAKoAC6H1VQBdV/a94FVQDdT1JOS5iWuo8wKQ8e6RTuJeH6BnoDU14sw8H6Ghdabw2hsb7BBWjyHIQXMFhfFxqD8Hw67DZA1wc=")} html body .mcf-facet[data-facet-key="features"]{--fb-ico:url("data:image/webp;base64,UklGRi4BAABXRUJQVlA4TCEBAAAvP8APEJegJpKt5qf2ExzhEE/UmMgYoEo+1EaylXxBMneIyOi/BDqBHsjVRpLa4COGlP77IFIfvgalGs1/uKL9/CQaA+Ya4IipF1mD/x/d7qTk9bVWiKbbKAKVcrf6jnQaAyxJsts2gnKO9z8tHoIkG9DnTET/GbltG0k6qp3p9orXz2OqOlfKta6BbVATMD92QQ3rrVpPcyIF4RTUs5pZBbWdxk//+9wARyDzfpoH9Tfan9os1QSMn3Zaqe10UivrDeoTeAHz4K72pdwuQV2qD/WuPtQ5sADWwA0oU/t9Zq7AXS1bApbq+OmfsFTLezqpB6C9X4A50JfC+wzqIQh96x07n0lLNbNX6+sdO59Jy6AugNxeQRg7n03t9zlwfh0BAA==")} html body .mcf-facet[data-facet-key="addons"]{--fb-ico:url("data:image/webp;base64,UklGRgwBAABXRUJQVlA4TAABAAAvP8APEE9gNADZNEkiitLSlESyQr0HWBQS/ctB/ySkUNM2EnOH4OvUCDx/cD/OfwCwY7tQqGSqAevdlP36PQbIsW23bQB1AKkBCRVw9OWwTAwNKO3pATswK3AqwfUqB3D9bkT/J8AdWxgQJY3cmXNntOnRCMAsSgKfoc9exiQAJYaCHxRSYW2iV5cAIz8rff0+GyULA6IC3h2fuxJYrr5++dff73YlyZ14515KEr2kpuSX7aoqiQr4ofBSfiT6wzsPBgyTLgHrVVViRI2Dz0Nh7aG9XQJKBsV7SeI0Y5KLaZwbJenYusQYENI0SjLey70L2xvw7uD92xuPHQO4k7MF")} html body .mcf-facet[data-facet-key="themes"]{--fb-ico:url("data:image/webp;base64,UklGRvQAAABXRUJQVlA4TOgAAAAvP8APEGegtpGk5jNvQgc1UDJ1K5Ekqbl85wJB4ZF8mM8qCQC0waKuhghYdvqu1csxNf8BAO7FAi6T4Htof+9MzcnC8NySSu3w/2JwVdu2qiAJqEACq6AFngXQAEIBefKPNLACLgGI5XLv91kR/Z+A0qs3KX1YcdebtIGqqhptoCR1abWrWrGQ0AMMcQGM57sdVOARJ5P0rcOkrwvjFFizPzy5gRQYqMGQUbpcc3gZcp3YHt5aaFDgoYrlmtcgT21DdAFYs39mAykQeKghSibpW4eJrwed+4aIuB5giMvd6cIxRAW1D2sA")} html body .mcf-facet[data-facet-key="styles"]{--fb-ico:url("data:image/webp;base64,UklGRgIBAABXRUJQVlA4TPYAAAAvP8APEIegqJEkZXePXsxs/HydghOltpGkRp96A5EnpTxao0IFbSQp98zM4P0Nvaj5j3b0cw3tlElOIaaD+Rv4EYk/2erkVYUW+ZHtooBcD777HoPjRpIUaZnRf3Nnpvv4+lkZ0X9Fbts20jGz4xX3a5xtcYwPSu7ABrACck7x+3lNLgbOFrFBkqxNs1xHY9ZfI1twBSjA22QCCA0bQIYT2wD+GpIkI9f4/KsTM/IjwlCIVbZIsp66iBESBuBMHpKy1CX5yHH/EXWyl3QBjEC2gHfcsFDmqgG65AXchn+Nuoy1AJ2kKnkD0SJ7biP39/OOVOO5ggU=")} html body .mcf-facet[data-facet-key="resolutions"]{--fb-ico:url("data:image/webp;base64,UklGRi4BAABXRUJQVlA4TCEBAAAvP8APEG+gKLYN6oV4Ph2MlR5aiWxLDbWRpDYMPUDmM4hN//2oCCmKJKm5ICERHGTwr4Q3Lngx/wEA/38fQX8OMy1leVCCfVvd1VxMs6AqdzDAra09YSPbwdIb5JjqwAbUo6F0pQXCVFLpKucwozYITMDJABnGjFL9voj+M3DbSJGXeQ9eYVoKpSPWgEEDhEjp6PmVT/61U674yOrevVdrcf1VKgRG0eqIJ/dSs0zS2RFeKdrDI5yOKxVVK2+vJ4Exm71ziuuqUsFJOmbY4JEsuwePtdfZWAMmFDMERJYDSQU4qq8ZCIppVWsz05JSifFqzSujklWCyWotQdQAfmuhtrQGWGUSgAHPTGghu1Kt1f3n4ZFgPgvUnOonGElQrYUKAA==")} html body .mcf-facet[data-facet-key="gamemodes"]{--fb-ico:url("data:image/webp;base64,UklGRsgAAABXRUJQVlA4TLsAAAAvP8APEF+gppEU6GQ89QECqLGJdjVtJDlX5TsE+fnj+95IACRUGEBF/WD3vq/mPwBQXI0WipFxscKx//AJl/To8xlcRZJtNdfCtXAsXAtYiAUsYAELWIgF9KXCa/meiei/wrZtG6bDST5pJ6oAyFXsQDdVsfMhw3vtZ0/lh3iTfQE/idm/OcQQDqcIUEx2ZycPpRg6PJgiQDGEwynA6ka3OBgCrH5daHT1UHi4AjYWGgCgeYbddrQiqGYDAA==")} html body .mcf-facet[data-facet-key="platforms"]{--fb-ico:url("data:image/webp;base64,UklGRmwBAABXRUJQVlA4TGABAAAvP8APALfAJgCANFx8elkSQpMFUnC6M63BNgBANpMyMdkc5ku/+KF3pp6wjWQ7jZgyVqr+m9CoA8dugDlie/7DqfpzH///2/MQyyikWR07bxqOFtD3mj7t9NDE6OKDmKIQsYDGUAQOxWGCsWF4ZmXFADmSJEXSMjPpr+tuZx12fyMi+o/EbRulMAeKrnvDJeaqHtWrevmIjqvX1zs9gLbb+Hp9rdMdyN1Uv9er73yhU8wD2Ks7QDX3yqr/ZJfZAhNgps7VLXAHatV/TsBRvQHZTYFFzBLI6gao9p+LmlXtXiofgZW6BfKLMdCqvToBFl9KVnu1deNAdQfM1Ddn4M1GBXiqAGt1B1zUsXBV9+oHX07LXr2q4yBv1xZYAi0HNbstkHe//9S73f5dK3UB1O4G5N3vP/Vu12qtZlfvfv9pN+sO1CrfbR+uzFHtP3m3v3bTAOTbpn4xBurbJXcaXi8B")} html body .mcf-facet[data-facet-key="biome"]{--fb-ico:url("data:image/webp;base64,UklGRpQBAABXRUJQVlA4TIgBAAAvP8APAD/BJgCANHgChyBc9C/kDlsJBZFsJR8t4RCBNvRmKEAGV6WRbDXk5NA4HP3XQhF0kLn5F5ommGy7I8RW2wzvhHsH5MqJYofOJ2ndh3EHYQUiiVCDMiuW4XxEhv0+Vo/zcT7Ox37ff18/4QfUMbW5GCTZtq22kcLFEGaG+Y+xlr5UHaW7T0T/Gblt40g5zhZN2iNOcYyz6rGqusQbrqvfOMYtHqo7vFQfuKq2nxNcV1+qv9WfasJ99Yw3fK++4qx6qa6rh+qm2n6Oqgk/qyfc4R8XmHCKX/iGH9WEd7xWE7Yf2Mfc4bwyjDdMuKpgB3OnHWw/exVUHVYT5i5jx/n95o6fBzB3rRp7wbLfzjAOq+2nyjAOsM6rqmq51tvPsuP4n+MarvPZfta5wJwJ6+44dtp+1u8h2FmMdf37ebBuTuf3mfuM+3c+39vPulkc12UfVeNeHjtsP2OXFUf/EVRVbT/LvbdbwXKtDisY93TVtrPObbkf19fnc2FdLcd7qQrW1XPzAQ==")} html body .mcf-facet[data-facet-key="tags"]{--fb-ico:url("data:image/webp;base64,UklGRhgBAABXRUJQVlA4TAsBAAAvP8APEF+goI0k5XycwXONz/wv4HUoiiQ1QgZPNOITD/f1S0WB2khSGzqhKzq2dYCk0IV25j8AwNY+Z5OuYg1Vtknuw/fe4p8RE0RkgFtt25osOHSwAhtwsgAundsCPgAtZUoOXWidj55fvu3y4fCmfp6I/jNy28aRpnHLcV5hPTeSKTJjkwREliLJW/hWueLVEJjDNIzCFlDvgBSWQ0WbaazchMQWRho2yY1ae8gW2YH87ulXA5ijyOtqxbbxt/dQw6uhSK9BJ2Lh23uoawCeru4NpOR4mg0vejYkYOQa+0cOFf81jMhrWYCs9NXfAG4lLsX/K5yv9f09haOaDvdqbeRLAUsXuLrMEgMA")} html body .mcf-facet[data-facet-key="clients"]{--fb-ico:url("data:image/webp;base64,UklGRjIBAABXRUJQVlA4TCUBAAAvP8APEGegKJKk5s5AJuc/P/zbwZOiRpKUFcC7x+Th/Ps5B/dXEwCE5AvAZKaAkOrpYrxnmv8AAHdq/GGw6FHOTqUeiuO/711HYvysUpoBcrPtbRtBmiAbGIQGMNDtUwqRLCAiE4jewLJ9TdM9VSs4955zTt6qV56/N6L/ExCtfGppAIk2ftROLZC5ha0GkISFJXPyK1uaDYKhDk65Z6a/X1UqNPDApaVBEgye/5l+9T6lQcmokJ83ikOgwYXF8/GrKf0GJzS4KSk08FhSo0Ao5iv1jpdnWKiku+ixUjEfCJHqDZxyT6HXSg2mTAo55R6jOFIgWDInz7BQiXTtVOjKEgySjM4tbnnusaRG0YrHT6oZSed2YWokxdGax29hzSyMo40fJwA=")}