/* Top bar bersama: logo, pemindah Lab, bar bahasa. Memakai token dari style.css. */
.lablink{display:none!important}
.on-d{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .on-l{display:none}:root:not([data-theme="light"]) .on-d{display:block}}
:root[data-theme="dark"] .on-l{display:none}
:root[data-theme="dark"] .on-d{display:block}
.dslogo{display:inline-flex;align-items:center;gap:9px;flex:none;text-decoration:none;color:var(--ink);border-radius:var(--r-ctl)}
.dslogo img{width:30px;height:30px;flex:none}
.dslogo .wm{font-family:var(--f-display);font-weight:800;font-size:var(--t-xl);letter-spacing:-.015em;white-space:nowrap;line-height:1}
.dslogo .wm i{font-style:normal;color:var(--accent-ink)}
.dslogo:hover .wm{color:var(--accent-ink)}
.labsw{position:relative;flex:none}
.labsw>summary{list-style:none;cursor:pointer}
.labsw>summary::-webkit-details-marker{display:none}
.labsw-btn{display:flex;align-items:center;gap:8px;min-height:36px;padding:3px 9px 3px 5px;border:1px solid var(--line);border-radius:var(--r-ctl);background:var(--surface);transition:border-color .15s,background .15s}
.top-home .labsw-btn{padding-left:11px}
.labsw-btn:hover,.labsw[open]>.labsw-btn{border-color:var(--accent);background:var(--accent-soft)}
.labic{display:block;width:26px;height:26px;flex:none}
.labic img{width:100%;height:100%}
.labsw .nm{font-family:var(--f-display);font-weight:700;font-size:var(--t-base);letter-spacing:-.01em;white-space:nowrap;line-height:1.1;color:var(--ink)}
.labsw .chev{flex:none;color:var(--muted);transition:transform .18s cubic-bezier(.22,1,.36,1)}
.labsw[open] .chev{transform:rotate(180deg)}
.labsw-menu{position:absolute;left:0;top:calc(100% + 8px);z-index:60;width:min(340px,calc(100vw - 24px));background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);box-shadow:0 14px 40px var(--sh-2);padding:8px}
.labsw-t{margin:4px 8px 6px;font-size:var(--t-xs);font-weight:700;color:var(--muted)}
.labsw-i{display:flex;align-items:center;gap:11px;padding:9px 10px;border-radius:var(--r-ctl);text-decoration:none;color:var(--ink)}
.labsw-i:hover{background:var(--bg)}
.labsw-i.cur{background:var(--accent-soft)}
.labsw-i .labic{width:32px;height:32px}
.labsw-i .tx{display:flex;flex-direction:column;min-width:0;flex:1}
.labsw-i b{font-family:var(--f-display);font-size:var(--t-base);line-height:1.25}
.labsw-i small{font-size:var(--t-xs);color:var(--muted);line-height:1.35}
.labsw-i em{flex:none;font-style:normal;font-size:var(--t-xs);font-weight:700;padding:1px 8px;border-radius:var(--r-pill)}
.labsw-i em.here{color:var(--accent-ink);background:var(--surface);border:1px solid var(--accent)}
.labsw-i em.soon{color:var(--warm-ink);background:var(--warm-soft)}
.labsw-o{margin:6px 8px 2px;font-size:var(--t-xs);color:var(--muted);border-top:1px solid var(--line);padding-top:8px}
.langbar{flex:none;display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;padding-block:6px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));background:var(--accent-soft);color:var(--ink);font-size:var(--t-sm)}
.langbar button{font:inherit;font-weight:600;border:0;background:none;cursor:pointer;padding:3px 0;color:var(--accent-ink);text-decoration:underline;text-underline-offset:3px}
.langbar .lb-x{color:var(--muted);margin-left:auto}
/* Wordmark tampil di semua lebar. Di bawah 1440px label kecil disembunyikan, di bawah 1320px tab mode turun ke baris kedua, supaya tidak terpotong. */
@media (max-width:1439px){.top:not(.top-home) .sel>span,.top:not(.top-home) .pchip{display:none}.top:not(.top-home) .pmenu summary{padding:3px}}
@media (max-width:1320px){.top:not(.top-home){flex-wrap:wrap}.top:not(.top-home) .modes{order:3;flex:1 0 100%}}
@media (max-width:640px){.labsw .nm{font-size:var(--t-sm)}.labsw-menu{position:fixed;left:12px;right:12px;top:58px;width:auto}}
/* Layar ponsel: dua baris. Baris 1 logo, Lab, bahasa, profil. Baris 2 tab mode dan industri. */
@media (max-width:640px){.top:not(.top-home) .dslogo .wm{font-size:var(--t-md)}.top:not(.top-home) .dslogo{gap:7px}.top:not(.top-home) .dslogo img{width:26px;height:26px}.top:not(.top-home) .tools{display:contents}.top:not(.top-home) .seg2{order:2;margin-left:auto}.top:not(.top-home) .pmenu{order:2}.top:not(.top-home) .modes{order:3;flex:1 1 60%}.top:not(.top-home) .sel{order:4}}
@media (max-width:350px){.top:not(.top-home) .dslogo .wm{font-size:var(--t-sm)}.top:not(.top-home) .labsw-btn{padding-right:5px}.top:not(.top-home){gap:8px 5px}}
@media (max-width:430px){.top:not(.top-home) .labsw .nm{display:none}.top:not(.top-home) #ind{max-width:96px}.top:not(.top-home) .tools{gap:6px;margin-left:auto}.top:not(.top-home){gap:8px}}