:root[data-theme=light]{--bg:#fff;--surface:#fff;--surface-2:#f0f4f9;--ink:#202124;--muted:#596575;--line:#dfe3eb;--accent:#0b57d0;--accent-ink:#fff;--accent-soft:#e9eff9;--ok:#146c2e;--ok-soft:#e6f4ea;--warn:#8a5300;--warn-soft:#fdf1dc;--bad:#b3261e;--bad-soft:#fce8e6;color-scheme:light}
:root[data-theme=dark]{--bg:#111722;--surface:#1a2331;--surface-2:#202b3b;--ink:#e5eaf2;--muted:#b6c1d2;--line:#394455;--accent:#9dc1ff;--accent-ink:#102443;--accent-soft:#26364c;--ok:#8fdcaa;--ok-soft:#133321;--warn:#f3b85b;--warn-soft:#33260f;--bad:#ffb4ab;--bad-soft:#3a1519;color-scheme:dark}
.top>.wrap{gap:16px;position:relative}.selfhost-preferences{display:flex;gap:8px;margin-left:auto;flex-shrink:0}.selfhost-pref{position:relative;border:0;padding:0;margin:0}.selfhost-pref summary{display:flex;align-items:center;justify-content:center;list-style:none;width:44px;height:44px;border:1px solid var(--line);border-radius:12px;cursor:pointer;background:var(--surface);font:22px/1 Arial,sans-serif;padding:0}.selfhost-pref summary::-webkit-details-marker{display:none}.selfhost-pref>nav,.selfhost-pref>.theme-options{position:absolute;right:0;top:50px;display:flex!important;flex-direction:column;gap:3px;min-width:185px;padding:8px;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 24px #0002;z-index:25}.selfhost-pref:not([open])>nav,.selfhost-pref:not([open])>.theme-options{display:none!important}.selfhost-pref a,.selfhost-pref button{display:block;font:16px/1.4 Arial,sans-serif;text-align:left;white-space:nowrap;color:var(--ink);background:none;border:0;border-radius:7px;padding:10px 12px;text-decoration:none;cursor:pointer}.selfhost-pref [aria-current=true],.selfhost-pref [aria-pressed=true]{background:var(--accent-soft);color:var(--accent)}.selfhost-pref a:hover,.selfhost-pref button:hover{background:var(--surface-2)}.localized-guide{max-width:850px}.localized-guide pre{overflow:auto}.anchor-alias{scroll-margin-top:100px}.pool-footer .cols a{overflow-wrap:anywhere}html[data-theme=light] .pool-footer{background:#fff;color:#202124}html[data-theme=light] .pool-footer a{color:#0b57d0}
@media(max-width:1100px){.top>.wrap{flex-wrap:nowrap;min-height:72px;gap:10px}.top .brand{font-size:20px;white-space:nowrap}.top .navtoggle{display:flex;margin-left:auto;order:2;flex-shrink:0}.selfhost-preferences{margin-left:0;order:1}.top #nav{display:none;position:absolute;left:16px;right:16px;top:72px;padding:12px;background:var(--surface);border:1px solid var(--line);border-radius:12px;flex-direction:column;align-items:stretch;gap:4px}.top #nav.open{display:flex}.top #nav a{padding:10px}.selfhost-pref>nav{left:auto!important;right:0!important;top:50px!important}}
@media(max-width:380px){.top>.wrap{gap:6px;padding-left:12px;padding-right:12px}.top .brand{font-size:18px;gap:5px}.top .brand img{width:24px;height:24px}.selfhost-preferences{gap:5px}.top .navtoggle{width:38px;min-width:38px}.selfhost-pref summary{width:42px;height:42px}}

.top{position:relative;z-index:100;isolation:isolate}.localized-guide a{overflow-wrap:anywhere}.top #nav.open{max-height:calc(100dvh - 90px);overflow-y:auto;overscroll-behavior:contain}

.selfhost-pref[open]>nav{visibility:visible!important;max-height:none!important;overflow:visible!important;margin:0!important}.selfhost-pref[open]>.theme-options{visibility:visible!important}

/* Match the shared Weather / DNS / IP header controls. */
.top .selfhost-preferences{align-items:center;gap:2px}
.top .selfhost-pref{border:0;background:transparent}
.top .selfhost-pref>summary{display:flex;align-items:center;justify-content:center;gap:6px;box-sizing:border-box;width:64px;min-width:64px;height:44px;min-height:44px;padding:10px;border:0;border-radius:0;box-shadow:none;background:transparent;color:var(--accent);cursor:pointer}
.top .selfhost-pref>summary:hover{background:transparent}
.top .selfhost-pref svg{display:block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.top .selfhost-pref .pref-chevron{width:12px;height:12px;stroke-width:1.5}
.top .selfhost-pref .pref-flag{display:block;width:28px;height:20px;max-width:none;object-fit:cover;flex:none;border-radius:3px;box-shadow:0 0 0 1px #0000001f}
.top .selfhost-pref>nav,.top .selfhost-pref>.theme-options{top:calc(100% + 6px)!important;min-width:220px;padding:6px;border-radius:16px;gap:0}
.top .selfhost-pref nav a,.top .selfhost-pref .theme-options button{display:flex;align-items:center;gap:10px;width:100%;min-height:40px;margin:0;padding:10px 12px;border:0;border-radius:10px;background:transparent;color:var(--ink);font:400 14px/1.4 Arial,sans-serif;text-align:left;text-decoration:none;white-space:nowrap}
.top .selfhost-pref nav a:hover,.top .selfhost-pref .theme-options button:hover{background:var(--surface-2);color:var(--ink);filter:none}
.top .selfhost-pref nav a[aria-current=true],.top .selfhost-pref [aria-pressed=true]{color:var(--accent);font-weight:700}
.top .selfhost-pref nav a[aria-current=true]::after,.top .selfhost-pref [aria-pressed=true]::after{content:'✓';margin-left:auto}
.top .selfhost-pref>summary:focus-visible{outline:3px solid #f59e0b;outline-offset:2px;border-radius:8px}
@media(max-width:760px){.top .selfhost-pref>summary{width:44px;min-width:44px;padding:8px;gap:0}.top .selfhost-pref>summary .pref-chevron{display:none}}

/* Keep preferences beside the right-aligned mobile menu button. */
@media(max-width:1100px){.top .selfhost-preferences{margin-left:auto}.top .navtoggle{margin-left:0}}

/* Product links precede partners; copyright and policies are the final section. */
.selfhost-guide-directory{margin:36px auto 0;padding-top:24px;padding-bottom:8px;border-top:1px solid var(--line);font:400 14px/1.6 Arial,sans-serif;color:var(--muted)}
.selfhost-guide-directory .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:24px}
.selfhost-guide-directory h3{margin:0 0 10px;font-size:14px;font-weight:600}
.selfhost-guide-directory a{display:block;overflow-wrap:anywhere;text-decoration:none;padding:3px 0}
.selfhost-guide-directory a:hover{text-decoration:underline}
.selfhost-guide-directory .small a{display:inline}
.selfhost-guide-directory+.ukapp-partner-section{margin-top:24px}
