/* servers.9minecraft.net — Google-inspired minimalist floating UI (2026-09-27).
   File doc lap: render.js chi them 1 dong <link> SAU <style> noi tuyen -> cung do uu tien thi file nay thang.
   Go bo: xoa dong <link> trong render.js (hoac xoa file nay). Mau nhan (--acc xanh la) giu nguyen. */

:root {
    --bg: #f8f9fa; --card: #fff; --ink: #202124; --mut: #5f6368; --line: #e8eaed; --chip: #f1f3f4;
    --g-hover: rgba(60,64,67,.08);
    --shadow: 0 1px 2px rgba(60,64,67,.12), 0 1px 3px rgba(60,64,67,.08);
    --g-sh2: 0 1px 3px rgba(60,64,67,.15), 0 6px 16px rgba(60,64,67,.12);
    --g-sh3: 0 2px 6px rgba(60,64,67,.15), 0 12px 32px rgba(60,64,67,.20);
    --rad: 20px;
}
:root[data-theme=dark] {
    --bg: #0d1117; --card: #161b22; --ink: #e8eaed; --mut: #9aa0a6; --line: #262d36; --chip: #1f2630;
    --g-hover: rgba(255,255,255,.06);
    --shadow: 0 1px 2px rgba(0,0,0,.45);
    --g-sh2: 0 1px 3px rgba(0,0,0,.5), 0 6px 16px rgba(0,0,0,.4);
    --g-sh3: 0 2px 6px rgba(0,0,0,.5), 0 12px 32px rgba(0,0,0,.55);
}
@media (prefers-color-scheme: dark) {
    :root:not([data-theme=light]) {
        --bg: #0d1117; --card: #161b22; --ink: #e8eaed; --mut: #9aa0a6; --line: #262d36; --chip: #1f2630;
        --g-hover: rgba(255,255,255,.06);
        --shadow: 0 1px 2px rgba(0,0,0,.45);
        --g-sh2: 0 1px 3px rgba(0,0,0,.5), 0 6px 16px rgba(0,0,0,.4);
        --g-sh3: 0 2px 6px rgba(0,0,0,.5), 0 12px 32px rgba(0,0,0,.55);
    }
}
body { font-family: Roboto, system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; }

/* ── Thanh tren: vien thuoc noi, mo kinh ── */
header.top { background: transparent; border-bottom: 0; padding: 10px 0 0; pointer-events: none; }
header.top .nav {
    pointer-events: auto;
    height: 60px; padding: 0 10px 0 20px;
    background: color-mix(in srgb, var(--card) 88%, transparent);
    -webkit-backdrop-filter: saturate(1.4) blur(12px);
            backdrop-filter: saturate(1.4) blur(12px);
    border: 1px solid var(--line);
    border-radius: 999px;
    box-shadow: var(--g-sh2);
}
.nav a.link { padding: 8px 12px; border-radius: 999px; font-weight: 500; }
.nav a.link:hover { background: var(--g-hover); }
.btn { border-radius: 999px; padding: 10px 18px; font-weight: 600; box-shadow: 0 1px 2px rgba(60,64,67,.2); }
.btn.ghost { background: var(--chip); box-shadow: none; }
.btn.ghost:hover { background: var(--line); }
.icbtn { width: 40px; height: 40px; border-radius: 50%; border: 0; background: var(--chip); }
.icbtn:hover { background: var(--line); }
select.lang { border-radius: 999px; padding: 9px 12px; border: 0; background: var(--chip); }

/* ── Dau trang + tim kiem ── */
h1 { font-weight: 700; letter-spacing: -.02em; }
.search {
    height: 54px; padding: 0 20px 0 50px;
    border: 1px solid var(--line); border-radius: 999px;
    box-shadow: var(--g-sh2);
    background: var(--card) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%235f6368' stroke-width='2' stroke-linecap='round'><circle cx='11' cy='11' r='7'/><path d='m20 20-3.5-3.5'/></svg>") no-repeat 18px center;
    font-size: 16px;
}
.search:focus { outline: none; border-color: transparent; box-shadow: 0 0 0 2px var(--acc), var(--g-sh2); }

/* ── Chip loc: vien thuoc trang, hover nen xam nhat ── */
.chip { background: var(--card); border: 1px solid #dadce0; font-weight: 500; padding: 7px 14px; transition: background-color .15s, box-shadow .15s; }
:root[data-theme=dark] .chip { border-color: var(--line); }
.chip:hover { border-color: #dadce0; background: var(--chip); box-shadow: var(--shadow); }

/* ── Tieu de khoi + link "More servers" = vien thuoc ── */
.sec h2 { font-weight: 600; }
.sec a { padding: 7px 14px; border-radius: 999px; }
.sec a:hover { background: var(--g-hover); }

/* ── The server: noi bang bong, bo 20px, nhac len khi re chuot ── */
.grid { gap: 14px; }
.card {
    border: 1px solid var(--line); border-radius: var(--rad);
    padding: 16px; box-shadow: var(--shadow);
    transition: box-shadow .18s ease, transform .18s ease;
}
.card:hover { border-color: var(--line); box-shadow: var(--g-sh2); transform: translateY(-2px); }
.ico { border-radius: 14px; }
.card .nm { font-weight: 700; }
.card .ip { border-radius: 999px; padding: 4px 12px; border: 0; }
.card .ip:hover { background: var(--line); }
.tag { border-radius: 999px; padding: 3px 10px; background: var(--chip); }
.card .on { font-weight: 700; }

/* ── Trang chi tiet / form / binh chon: the noi bo 24px ── */
.dhead, .prose, form.add, .reviews, .chartwrap {
    border: 1px solid var(--line); border-radius: 24px; box-shadow: var(--g-sh2);
}
.dhead { padding: 24px; }
.dhead .ico { border-radius: 18px; }
.kpi { border-radius: 18px; border: 1px solid var(--line); box-shadow: var(--shadow); padding: 14px 16px; }
form.add input, form.add textarea, .rv-form input, .rv-form textarea { border-radius: 14px; padding: 11px 14px; }
form.add input:focus, form.add textarea:focus, .rv-form input:focus, .rv-form textarea:focus {
    outline: none; border-color: var(--acc); box-shadow: 0 0 0 2px color-mix(in srgb, var(--acc) 25%, transparent);
}
.ok { border-radius: 16px; }
.rv-bar i { border-radius: 999px; }

/* ── Chan trang: chip ngon ngu vien thuoc ── */
footer.ft { border-top: 1px solid var(--line); }
.langrow a { border-radius: 999px; padding: 4px 10px; }
.langrow a:hover { background: var(--line); }

@media (max-width: 640px) {
    header.top { padding: 8px 0 0; }
    header.top .nav { height: 56px; padding: 0 6px 0 14px; gap: 8px; }
    .btn { padding: 9px 14px; }
    .search { height: 50px; }
    .card { padding: 14px; }
}

/* Man nho: thanh tren tung tran ngang (loi co tu truoc, trang rong ~448px). An o chon ngon ngu
   o thanh tren — chan trang van co day du link doi ngon ngu (.langrow). */
@media (max-width: 480px) {
    header.top .nav select.lang { display: none; }
    header.top .nav { gap: 6px; }
    .logoimg { height: 24px; }
    .btn { white-space: nowrap; }
    .icbtn { flex: 0 0 auto; }
}

/* Thanh quay ve trang goc (user 02/10) — nho, dat tren header dinh nen cuon la mat. */
.bk9{background:var(--card);border-bottom:1px solid var(--line)}
.bk9>.wrap{display:flex}
.bk9 a{display:inline-flex;align-items:center;gap:7px;padding:7px 0;color:var(--ink);
 font-size:13px;font-weight:600;text-decoration:none}
.bk9 a:hover{color:var(--g-hover,#1a73e8);text-decoration:none}
.bk9 svg{width:15px;height:15px;stroke-width:2.4;flex:0 0 auto}

/* 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}
.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}
.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 ──
   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}
.n9-o:hover{background:rgba(127,127,127,.10)}
/* 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}

/* ───── 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}}
.n9-hang__mo{display:flex;align-items:center;gap:10px;cursor:pointer}
.n9-hang__cham{flex:none;width:17px;height:17px}
.n9-hang__mui{flex:none;width:15px;height:15px;margin-left:auto;opacity:.55;
 transition:transform .15s ease}
.n9-hang.mo .n9-hang__mui{transform:rotate(180deg)}
.n9-mob{display:none;padding:2px 0 8px}
.n9-hang.mo .n9-mob{display:block}
.n9-mob a{display:flex!important;align-items:center;gap:10px;padding:8px 10px;
 border-radius:10px;text-decoration:none;color:inherit;font-size:14px;line-height:1.3}
.n9-mob a:hover{background:rgba(127,127,127,.12)}
.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:11px;opacity:.5}

/* ───────────────────────── MEGA FOOTER ───────────────────────── */
/* Nen hoi dam hon than trang mot chut de chan trang tach ra — `rgba` trung tinh nen dung
   duoc tren ca 11 site, ca nen sang lan nen toi. */
.n9-ft{box-sizing:border-box;border-top:1px solid rgba(127,127,127,.2);margin-top:44px;
 padding:30px 0 26px;font-size:13.5px;line-height:1.6;background:rgba(127,127,127,.05)}
/* ⛔ `box-sizing` phai khai: site nao khong co luat `*{box-sizing:border-box}` thi 1180
      cong 32px dem thanh 1212 — rong hon cac site khac dung 32px. Do that tren tools. */
.n9-ft__in{box-sizing:border-box;max-width:1180px;margin:0 auto;padding:0 16px}
.n9-ft__luoi{display:grid;gap:22px 18px;
 grid-template-columns:repeat(auto-fit,minmax(min(190px,100%),1fr))}
.n9-ft__cot h3{margin:0 0 4px;font-size:13.5px;font-weight:700}
.n9-ft__cot h3 a{color:inherit;text-decoration:none}
.n9-ft__cot h3 a:hover{text-decoration:underline}
.n9-ft__host{display:block;font-size:11px;opacity:.5;margin:0 0 8px}
.n9-ft__cot ul{list-style:none;margin:0;padding:0}
.n9-ft__cot li{margin:0 0 3px}
.n9-ft__cot li a{color:inherit;text-decoration:none;opacity:.78;font-size:13px}
.n9-ft__cot li a:hover{opacity:1;text-decoration:underline}
.n9-ft__vach{height:1px;background:rgba(127,127,127,.2);margin:26px 0 18px}
.n9-ft__duoi{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
 gap:6px 18px;text-align:center}
.n9-ft__duoi a{color:inherit;text-decoration:none;font-weight:600;opacity:.82}
.n9-ft__duoi a:hover{opacity:1;text-decoration:underline}
.n9-ft__mt{margin:14px 0 0;font-size:11.5px;line-height:1.7;opacity:.72;text-align:center;
 max-width:80ch;margin-left:auto;margin-right:auto}
.n9-ft__mt b{opacity:.92}
.n9-ft__cpy{margin:10px 0 0;font-size:12.5px;text-align:center;opacity:.8}
@media(hover:none){.n9-ft__cot li a{display:inline-block;padding:4px 0}}
/* ⛔ Tren dien thoai 11 cot xep doc thanh ~2.200px chan trang — nguoi doc phai cuon mai moi
      het. `minmax(190px,1fr)` o khung 390px chi vua MOT cot. Ha nguong xuong de duoc HAI cot
      va nen khoang cach lai: 11 the thanh 6 hang, con khoang 900px. */
@media(max-width:640px){
 .n9-ft{padding:24px 0 22px}
 .n9-ft__luoi{gap:18px 14px;grid-template-columns:repeat(2,minmax(0,1fr))}
 .n9-ft__cot h3{font-size:13px}
 .n9-ft__cot li a{font-size:12.5px}
 .n9-ft__host{font-size:10.5px;margin-bottom:6px}
 .n9-ft__duoi{gap:4px 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}
