/* Shared chrome: nav, mobile menu, search, login window, cookie banner, back-to-top, footer.
   Every class starts with x- so it cannot clash with the toolkit's own styles. */
:root{--x-bg:#fff;--x-bg2:#f6f6f4;--x-tx:#111;--x-mu:#6b6b6b;--x-bd:#e2e2de;--x-ac:#111;--x-on:#fff;--x-er:#c0362c;--x-ok:#1a7f4b}
[hidden]{display:none!important}
.x-nav,.x-nav *,.x-modal,.x-modal *,.x-cookie,.x-cookie *,.x-top,.x-foot,.x-foot *{box-sizing:border-box}
.x-nav{position:sticky;top:0;z-index:40;background:var(--x-navbg,rgba(255,255,255,.88));-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--x-bd);font:500 14px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--x-tx)}
.x-nav-in{max-width:1160px;margin:0 auto;padding:8px 14px;display:flex;align-items:center;gap:10px;min-height:56px}
.x-brand{display:inline-flex;align-items:center;gap:8px;color:var(--x-tx);text-decoration:none;font-weight:800;letter-spacing:-.01em;white-space:nowrap}
.x-brand img{width:28px;height:28px;border-radius:7px;display:block}
.x-links{display:flex;gap:2px;margin-left:12px}
.x-links a{color:var(--x-mu);text-decoration:none;padding:8px 11px;border-radius:10px;font-weight:600}
.x-links a:hover{color:var(--x-tx);background:var(--x-hover,rgba(0,0,0,.05))}
.x-actions{margin-left:auto;display:flex;align-items:center;gap:8px}
.x-ib{width:38px;height:38px;border-radius:11px;border:1px solid var(--x-bd);background:var(--x-bg);color:var(--x-tx);display:inline-grid;place-items:center;cursor:pointer;padding:0;font:inherit}
.x-ib svg,.x-top svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.x-ib:hover{background:var(--x-bg2)}
.x-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:9px 14px;border-radius:11px;border:1px solid var(--x-ac);background:var(--x-ac);color:var(--x-on);font:700 14px/1.2 inherit;font-family:inherit;cursor:pointer;text-decoration:none;white-space:nowrap}
.x-btn:hover{opacity:.9}
.x-btn.x-alt{background:var(--x-bg);color:var(--x-tx);border-color:var(--x-bd)}
.x-btn:disabled{opacity:.55;cursor:not-allowed}
.x-burger{display:none}
.x-menu{border-top:1px solid var(--x-bd);background:var(--x-bg);padding:8px 14px 14px}
.x-menu a,.x-menu button.x-mi{display:block;width:100%;text-align:left;padding:12px 6px;color:var(--x-tx);text-decoration:none;font:600 15px/1.3 inherit;font-family:inherit;background:none;border:0;border-bottom:1px solid var(--x-bd);cursor:pointer}
.x-menu .x-btn{margin-top:12px;width:100%}
@media(max-width:760px){.x-links{display:none}.x-burger{display:inline-grid}.x-nav-in{padding:8px 10px}}
@media(min-width:761px){.x-menu{display:none!important}}
@media(max-width:480px){.x-brand span{display:none}.x-btn{padding:9px 11px}}
:is(.x-nav,.x-modal,.x-cookie,.x-top) :focus-visible{outline:3px solid rgba(37,99,235,.55);outline-offset:2px}

/* modal (search + login) */
.x-modal{position:fixed;inset:0;z-index:70;background:rgba(10,10,15,.5);display:flex;align-items:flex-start;justify-content:center;padding:max(16px,env(safe-area-inset-top)) 14px 16px;overflow:auto;font:500 15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--x-tx)}
.x-card{width:100%;max-width:440px;margin-top:8vh;background:var(--x-bg);border:1px solid var(--x-bd);border-radius:18px;box-shadow:0 24px 60px -20px rgba(0,0,0,.45);padding:18px}
.x-card.x-wide{max-width:560px}
.x-h{font-size:19px;font-weight:800;letter-spacing:-.02em;margin:0 0 4px}
.x-sub{color:var(--x-mu);font-size:13.5px;margin:0 0 12px}
.x-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.x-x{margin-left:auto}
.x-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;background:var(--x-bg2);border:1px solid var(--x-bd);border-radius:12px;margin:10px 0 14px}
.x-tabs button{padding:9px;border:0;border-radius:9px;background:none;color:var(--x-mu);font:700 14px/1 inherit;font-family:inherit;cursor:pointer}
.x-tabs button[aria-selected=true]{background:var(--x-ac);color:var(--x-on)}
.x-field{display:block;margin:0 0 12px;font-size:13px;font-weight:700;color:var(--x-mu)}
.x-field input[type=text],.x-field input[type=password],.x-field input[type=search]{display:block;width:100%;margin-top:5px;padding:11px 12px;border:1px solid var(--x-bd);border-radius:11px;background:var(--x-bg);color:var(--x-tx);font:500 16px/1.2 inherit;font-family:inherit}
.x-field input:focus{outline:3px solid rgba(37,99,235,.35);border-color:#2563eb}
.x-pw{position:relative}
.x-pw input{padding-right:46px!important}
.x-eye{position:absolute;right:4px;top:5px;bottom:0;margin:auto 0;width:38px;height:38px;border:0;background:none;color:var(--x-mu);cursor:pointer;display:grid;place-items:center;border-radius:9px}
.x-eye svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.x-eye .x-off{display:none}.x-eye[aria-pressed=true] .x-on{display:none}.x-eye[aria-pressed=true] .x-off{display:block}
.x-hint{display:block;font-weight:500;font-size:12.5px;color:var(--x-mu);margin-top:5px}
.x-chk{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--x-mu);margin:2px 0 12px}
.x-chk input{margin-top:3px}
.x-chk a{color:var(--x-tx)}
.x-err{color:var(--x-er);font-weight:600;font-size:13.5px;margin:0 0 10px;min-height:0}
.x-ok{color:var(--x-ok);font-weight:600}
.x-full{width:100%;padding:12px}
.x-note{font-size:12.5px;color:var(--x-mu);margin:12px 0 0}
.x-res{list-style:none;margin:10px 0 0;padding:0;max-height:55vh;overflow:auto}
.x-res li{margin:0}
.x-res button{display:flex;width:100%;gap:10px;align-items:center;text-align:left;padding:10px;border:0;border-radius:11px;background:none;color:var(--x-tx);font:inherit;cursor:pointer}
.x-res button:hover,.x-res button[aria-selected=true]{background:var(--x-bg2)}
.x-res b{display:block;font-weight:700}
.x-res small{display:block;color:var(--x-mu);font-size:12.5px}
.x-tag{margin-left:auto;font-size:11px;font-weight:700;color:var(--x-mu);border:1px solid var(--x-bd);border-radius:99px;padding:2px 8px;white-space:nowrap}
.x-empty{color:var(--x-mu);padding:14px 6px;font-size:14px}

/* cookie banner */
.x-cookie{position:fixed;left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));z-index:60;max-width:760px;margin:0 auto;background:var(--x-bg);border:1px solid var(--x-bd);border-radius:16px;box-shadow:0 18px 50px -18px rgba(0,0,0,.45);padding:14px 16px;display:flex;gap:14px;align-items:center;flex-wrap:wrap;font:500 13.5px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--x-tx)}
.x-cookie p{margin:0;flex:1 1 280px}
.x-cookie a{color:var(--x-tx);font-weight:700}

/* back to top */
.x-top{position:fixed;right:16px;bottom:max(16px,env(safe-area-inset-bottom));z-index:45;width:46px;height:46px;border-radius:50%;border:1px solid var(--x-bd);background:var(--x-bg);color:var(--x-tx);display:grid;place-items:center;cursor:pointer;box-shadow:0 10px 26px -10px rgba(0,0,0,.4);padding:0}
.x-top:hover{background:var(--x-bg2)}
body.x-has-cookie .x-top{bottom:max(112px,calc(env(safe-area-inset-bottom) + 100px))}
@media(max-width:560px){body.x-has-cookie .x-top{bottom:max(176px,calc(env(safe-area-inset-bottom) + 164px))}}

/* footer */
.x-foot{border-top:1px solid var(--x-bd);margin-top:32px;padding:20px 14px calc(24px + env(safe-area-inset-bottom));text-align:center;color:var(--x-mu);font:500 13px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.x-foot a{color:var(--x-mu);margin:0 8px;text-decoration:underline;text-underline-offset:3px}
.x-foot a:hover{color:var(--x-tx)}
@media(prefers-reduced-motion:no-preference){.x-card{animation:x-pop .22s ease both}@keyframes x-pop{from{opacity:0;transform:translateY(8px)}}}
@media(max-width:760px){.x-actions [data-x-logout]{display:none}}
.x-field label{display:block}
.x-ft{max-width:760px;margin:0 auto}
/* follows the toolkit's dark mode toggle */
html[data-theme="dark"]{--x-bg:#151515;--x-bg2:#1f1f1f;--x-tx:#f2f2f2;--x-mu:#a0a0a0;--x-bd:#2f2f2f;--x-ac:#f2f2f2;--x-on:#0c0c0c;--x-er:#ff7a6e;--x-ok:#5cc98f;--x-navbg:rgba(21,21,21,.9);--x-hover:rgba(255,255,255,.08)}
@media (max-width:900px),(pointer:coarse){.x-nav{background:var(--x-bg)}.x-modal{background:rgba(10,10,15,.62)}}

.x-gate{width:calc(100% - 28px);max-width:1132px;margin:10px auto 0;padding:12px 16px;display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--x-bg);border:1px solid var(--x-bd);border-radius:14px;font:600 14px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--x-tx)}
.x-gate p{margin:0;flex:1 1 260px}
body.x-locked .w{pointer-events:none;opacity:.55;user-select:none}
.x-toast{position:fixed;top:68px;left:50%;transform:translateX(-50%);z-index:80;max-width:min(92vw,520px);background:var(--x-ac);color:var(--x-on);padding:11px 16px;border-radius:12px;font:600 14px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;box-shadow:0 14px 34px -12px rgba(0,0,0,.5)}
.x-toast.ok{background:var(--x-ok);color:#fff}.x-toast.er{background:var(--x-er);color:#fff}
.x-toast a{color:inherit;text-decoration:underline;margin-left:8px;font-weight:800}

.x-link{background:none;border:0;padding:2px 0 10px;color:var(--x-mu);text-decoration:underline;text-underline-offset:3px;cursor:pointer;font:600 13px/1.2 inherit;font-family:inherit}
.x-link:hover{color:var(--x-tx)}
.x-code{font:800 20px/1.4 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.06em;text-align:center;padding:14px 8px;border:1px dashed var(--x-bd);border-radius:12px;background:var(--x-bg2);user-select:all;word-break:break-all;margin:8px 0 12px}
.x-row2{display:flex;gap:8px;margin:0 0 12px;flex-wrap:wrap}.x-row2 .x-btn{flex:1}
