/* Extracted global navigation, header, footer, drawer, banner styles */
:root {
	--top-nav-height: 64px;
	--ke-content-safe-top: var(--top-nav-height);
	--ke-content-safe-bottom: calc(var(--bottom-nav-height, 60px) + var(--footer-height, 42px));
}
body { margin:0; padding:0; }
html, body { scrollbar-width:none; -ms-overflow-style:none; overflow-x:hidden; }
html { min-height: 100%; }
html::-webkit-scrollbar, body::-webkit-scrollbar { width:0; height:0; display:none; }
nav { position:sticky !important; z-index:120000 !important; top:0; margin:0 !important; min-height:var(--top-nav-height); background:var(--ke-bg); color:var(--ke-text, #fff); display:grid; grid-template-columns:1fr auto; align-items:center; padding:0 16px; isolation:isolate; }
footer { position:relative; z-index:1000; }
.ke-layout-footer {
	position: fixed !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	width: 100% !important;
	height: 0 !important;
	overflow: visible !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	display: block !important;
}
.brand { display:inline-flex; align-items:center; min-height:var(--top-nav-height); gap:12px; padding:0 12px; color:#fff; text-decoration:none; font-weight:800; letter-spacing:.2px; border:none; border-radius:12px; background:none; position:relative; z-index:2; transform:none; transition:opacity 180ms ease; }
.brand::before { content:""; display:none; }
.brand:hover { opacity:0.85; }
.brand:active { opacity:0.7; }
.brand-logo { height:clamp(42px, 5.5vh, 52px); width:auto; object-fit:contain; }
.brand .wordmark { font-size:clamp(21px,2.6vw,29px); line-height:1.15; color:#f5f5f5; font-family:'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, system-ui, sans-serif; font-weight:600; letter-spacing:0.3px; position:relative; }
.nav-right { position:relative; display:flex; align-items:center; min-height:var(--top-nav-height); gap:8px; white-space:nowrap; z-index:3000; color:#eee; justify-self:end; }
.nav-right a { text-decoration:none; font-size:22px; line-height:1; display:inline-flex; align-items:center; color:inherit; padding:4px; border-radius:8px; -webkit-tap-highlight-color:transparent; position:relative; flex:0 0 auto; }
.nav-right a:hover, .nav-right a:focus-visible { background:rgba(255,255,255,0.12); outline:none; }
.nav-right button { text-decoration:none; font-size:22px; line-height:1; display:inline-flex; align-items:center; color:inherit; padding:4px; border-radius:8px; -webkit-tap-highlight-color:transparent; position:relative; flex:0 0 auto; background:none; border:none; cursor:pointer; }
#ke-theme-toggle { font-size:18px; width:28px; height:28px; padding:0; display:inline-flex; align-items:center; justify-content:center; background:none; border:none; border-radius:50%; }
.nav-right button:hover, .nav-right button:focus-visible { background:rgba(255,255,255,0.12); outline:none; }
.nav-right .badge {
	position:absolute;
	top:-7px;
	right:-6px;
	background:#e53935;
	color:#fff;
	font-weight:700;
	font-size:10px;
	line-height:1;
	height:18px;
	min-width:18px;
	padding:0 5px;
	border-radius:999px;
	text-align:center;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	box-shadow:0 0 0 2px #000;
}
.nav-right .avatar-thumb{display:none}
.nav-right .avatar-thumb .avatar-fallback{display:none}
.nav-right .avatar_toggle{display:inline-flex; flex-direction:column; align-items:center; gap:2px}
.toggle_button .nav-menu-icon,
.nav-right .nav-menu-icon{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;color:#fff;font-size:24px;line-height:1;font-weight:700}
.nav-right .mode-under-avatar{ position:static; font-size:11px; line-height:1; color:#bbb; margin-top:2px }
@media (max-width:480px){ nav{ padding:0 10px; } .nav-right{ gap:2px; } .nav-right a{ padding:1px; font-size:18px; } .nav-right button{ padding:1px; font-size:18px; } .nav-right .toggle_button{ width:30px; height:30px; padding:1px; } #ke-theme-toggle { width:24px; height:24px; font-size:15px; } }
#toggle_button { display:none; }
.toggle_button, .nav-right .toggle_button { display:inline-flex; align-items:center; justify-content:center; padding:4px; cursor:pointer; position:static !important; margin:0; color:#fff; min-width:38px; min-height:38px; width:auto; height:auto; border-radius:8px; }
.toggle_button:hover, .nav-right .toggle_button:hover, .nav-right .toggle_button:focus-visible { background:rgba(255,255,255,0.12); }
.nav-drawer { position:fixed; top:0; right:-110vw; bottom:0; width:86%; max-width:380px; height:100dvh; min-height:100dvh; max-height:100dvh; background:var(--ke-bg); color:var(--ke-text, #fff); transform:translateX(110%); opacity:0; visibility:hidden; pointer-events:none; transition:transform .2s ease, opacity .2s ease, visibility .2s ease; box-shadow:-8px 0 20px rgba(0,0,0,.4); overflow:hidden; overscroll-behavior:contain; touch-action:pan-y; -webkit-overflow-scrolling:touch; z-index:2147483647 !important; display:none; flex-direction:column; }
.nav-overlay { position:fixed; inset:0; background:rgba(0,0,0,.45); backdrop-filter:blur(2px); opacity:0; visibility:hidden; transition:opacity .2s ease; z-index:2147483646 !important; pointer-events:none; touch-action:none; display:none; }
body.drawer-open { overflow:hidden; overscroll-behavior:none; }
body.drawer-open .nav-drawer { right:0; transform:translateX(0); opacity:1; visibility:visible; pointer-events:auto; display:flex; }
body.drawer-open .nav-overlay { opacity:1; visibility:visible; pointer-events:auto; display:block; }
.nav-drawer .nav-drawer-header{position:sticky;top:0;z-index:1;background:rgba(0,0,0,.95);backdrop-filter:saturate(120%) blur(6px);border-bottom:1px solid var(--ke-border);padding:12px 14px 10px}
.nav-drawer .nav-drawer-header .row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.nav-drawer .nav-drawer-header .who{display:flex;align-items:center;gap:0;min-width:0;flex:1 1 auto;color:var(--ke-text);text-decoration:none;border-radius:8px;transition:background .15s}
.nav-drawer .nav-drawer-header .who:hover{background:var(--ke-surface-2)}
.nav-drawer .nav-drawer-header .meta{display:flex;flex-direction:column;min-width:0;gap:2px}
.nav-drawer .nav-drawer-header .drawer-greeting{font-size:33px;line-height:1.05;font-weight:700;letter-spacing:.15px;color:var(--ke-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-drawer .nav-drawer-header .drawer-network-name{font-size:15px;line-height:1.2;font-weight:500;color:var(--ke-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-drawer .nav-drawer-header .drawer-close-avatar{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;cursor:pointer;width:40px;height:40px;border-radius:8px;border:1px solid var(--ke-border);background:var(--ke-surface);color:var(--ke-text);box-shadow:none}
.nav-drawer .nav-drawer-header .drawer-close-avatar .avatar-thumb{display:none}
.nav-drawer .nav-drawer-header .drawer-close-avatar .avatar-fallback{display:none}
.nav-drawer .nav-drawer-header .drawer-close-avatar .nav-close-icon{font-size:28px;line-height:1;font-weight:500}
.nav-drawer .nav-drawer-header .drawer-close-avatar:hover{background:var(--ke-surface-2);border-color:var(--ke-text-muted)}
.nav-drawer .menu{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;scrollbar-width:none;-ms-overflow-style:none;padding-bottom:calc(env(safe-area-inset-bottom,0px) + var(--bottom-nav-height) + var(--footer-height) + 24px);}
.nav-drawer .menu::-webkit-scrollbar{width:0;height:0;display:none}
.nav-drawer .menu h3{
  font-size:20px !important;
  line-height:1.2 !important;
  font-weight:800 !important;
  margin:14px 14px 8px !important;
}
.nav-drawer .menu > a { display:block; padding:10px 12px; color:#fff; text-decoration:none; border-radius:12px; border:1px solid #1f1f1f; margin:10px 14px; font-size:15px; line-height:1.25; }
.nav-drawer .menu > a + a { margin-top:2px; }
.nav-drawer .menu a:hover { background:rgba(255,255,255,.08); }
.nav-drawer .sep { height:1px; background:#1f1f1f; margin:12px 14px; border-radius:1px; }
.nav-drawer details { border:1px solid #1f1f1f; border-radius:12px; margin:10px 14px; overflow:hidden; background:var(--ke-surface, #000); }
.nav-drawer summary { cursor:pointer; position:relative; padding:10px 36px 10px 12px; font-weight:600; list-style:none; display:block; font-size:15px; line-height:1.25; }
.nav-drawer summary::-webkit-details-marker { display:none; }
.nav-drawer summary::marker { content:''; }
.nav-drawer summary::after{ content:'›'; position:absolute; right:12px; top:50%; transform:translateY(-50%); transition:transform .2s ease; color:#888; }
.nav-drawer details[open] summary::after { transform:translateY(-50%) rotate(90deg); }
.nav-drawer .submenu { padding:6px 8px 12px; background:var(--ke-surface, #000); }
.nav-drawer .submenu a { display:block; padding:8px 12px; font-size:15px; line-height:1.25; border-radius:10px; color:#fff; text-decoration:none; }
.nav-drawer .menu > a,
.nav-drawer .logout-link {
	font-size:17px !important;
	line-height:1.3 !important;
	font-weight:700 !important;
}
.nav-drawer summary {
	font-size:16px !important;
	line-height:1.3 !important;
	font-weight:700 !important;
}
.nav-drawer .submenu a {
	font-size:15px !important;
	line-height:1.35 !important;
	font-weight:500 !important;
	color:#e7e7e7 !important;
}
@media (max-width:480px){
	.nav-drawer .menu h3{ font-size:19px !important; }
	.nav-drawer .menu > a,
	.nav-drawer .logout-link{ font-size:16px !important; }
	.nav-drawer summary{ font-size:15.5px !important; }
	.nav-drawer .submenu a{ font-size:14.5px !important; }
}
.mode-chip{display:inline-block;padding:4px 8px;border-radius:999px;border:1px solid #2a2a2a;background:var(--ke-surface, #000);color:var(--ke-text, #ddd);font-size:12px;margin-left:8px}
.global-footer{position:fixed;bottom:var(--bottom-nav-height,60px);left:0;right:0;background:var(--ke-bg) !important;color:var(--ke-text, #ddd);border-top:0 !important;z-index:2500}
.global-footer .gf-inner{max-width:960px;margin:0 auto;padding:10px 14px;display:flex;align-items:center;justify-content:center;gap:10px;font-size:13px}
.global-footer .gf-inner.legal-links{gap:0;flex-wrap:wrap;row-gap:6px;column-gap:0}
.legal-link{color:#FFA726;text-decoration:none;font-weight:600}
.legal-links .legal-link{position:relative;display:inline-flex;align-items:center;justify-content:center;padding:0 12px;line-height:1.2}
.legal-links .legal-link:not(:last-child)::after{content:'·';position:absolute;right:-2px;color:rgba(255,255,255,.6);pointer-events:none}
.legal-links .legal-link + .legal-link{margin-left:0}
.legal-link:hover{color:#FFB347;text-decoration:underline}
@media (max-width: 640px){
	.global-footer .gf-inner{
		padding:10px 12px;
		flex-wrap:wrap;
		row-gap:6px;
		column-gap:0;
	}
	.global-footer .legal-link{
		display:inline-flex;
		align-items:center;
		justify-content:center;
		min-height:24px;
		line-height:1.2;
		padding:0 10px;
	}
	.global-footer .legal-links .legal-link:not(:last-child)::after{right:-1px}
}
.navbar{position:fixed;left:0;right:0;bottom:0;z-index:2400}
.navbar-ghost{position:fixed;left:0;right:0;bottom:0;height:var(--bottom-nav-height,60px);background:var(--ke-bg);z-index:2300}
.ke-page-content {
  padding-bottom: calc(var(--bottom-nav-height,60px) + var(--footer-height,42px) + 20px);
  min-height: calc(100vh - var(--ke-content-safe-top) - var(--ke-content-safe-bottom));
  box-sizing: border-box;
  max-width: var(--layout-max-width);
  width: 95%;
  margin: 0 auto;
  padding-left: var(--spacing-md);
  padding-right: var(--spacing-md);
  overflow-x: hidden;
}
.ke-page-content--wide {
  max-width: 1300px;
}
.ke-page-content--full {
  max-width: none;
  width: 100%;
}

/* ============ GLOBAL MOBILE SAFETY ============ */
/* Prevent any grid child from expanding beyond its container */
.ke-page-content [style*="display: grid"],
.ke-page-content .eis-grid,
.ke-page-content [class*="grid"] {
  min-width: 0;
}
.ke-page-content [style*="display: grid"] > *,
.ke-page-content .eis-grid > *,
.ke-page-content [class*="grid"] > * {
  min-width: 0;
  overflow-wrap: break-word;
}
/* Prevent select dropdowns from pushing page wider */
.ke-page-content select {
  min-width: 0;
  max-width: 100%;
}
.ke-page-content select option {
  overflow-wrap: break-word;
  word-wrap: break-word;
}

.ke-safe-frame-overlay {
	position: fixed;
	top: var(--ke-content-safe-top, var(--top-nav-height, 64px)) !important;
	right: 0 !important;
	bottom: 0 !important;
	left: 0 !important;
}

.ke-safe-frame-overlay--pad {
	--ke-safe-frame-overlay-gap: 12px;
	padding: var(--ke-safe-frame-overlay-gap) !important;
	padding-bottom: calc(var(--ke-content-safe-bottom, calc(var(--bottom-nav-height, 60px) + var(--footer-height, 42px))) + var(--ke-safe-frame-overlay-gap)) !important;
	box-sizing: border-box !important;
}

.ke-safe-frame-overlay--scroll {
	overflow-y: auto !important;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
}

.ke-safe-frame-modal {
	--ke-safe-frame-modal-gap: 24px;
	max-height: calc(100vh - var(--ke-content-safe-top, var(--top-nav-height, 64px)) - var(--ke-content-safe-bottom, calc(var(--bottom-nav-height, 60px) + var(--footer-height, 42px))) - var(--ke-safe-frame-modal-gap)) !important;
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
}

.ke-safe-frame-lightbox-media {
	max-height: calc(100vh - var(--ke-content-safe-top, var(--top-nav-height, 64px)) - var(--ke-content-safe-bottom, calc(var(--bottom-nav-height, 60px) + var(--footer-height, 42px))) - 24px) !important;
	max-width: calc(100vw - 24px) !important;
}

@supports (height: 100dvh) {
	.ke-page-content {
		min-height: calc(100dvh - var(--ke-content-safe-top) - var(--ke-content-safe-bottom));
	}

	.ke-safe-frame-modal {
		max-height: calc(100dvh - var(--ke-content-safe-top, var(--top-nav-height, 64px)) - var(--ke-content-safe-bottom, calc(var(--bottom-nav-height, 60px) + var(--footer-height, 42px))) - var(--ke-safe-frame-modal-gap)) !important;
	}

	.ke-safe-frame-lightbox-media {
		max-height: calc(100dvh - var(--ke-content-safe-top, var(--top-nav-height, 64px)) - var(--ke-content-safe-bottom, calc(var(--bottom-nav-height, 60px) + var(--footer-height, 42px))) - 24px) !important;
	}
}
.ke-global-banner{position:fixed;top:56px;left:50%;transform:translateX(-50%);background:var(--ke-bg);color:var(--ke-text, #fff);border:1px solid #2b3a50;padding:10px 14px;border-radius:8px;z-index:3500;box-shadow:0 6px 18px rgba(0,0,0,.25)}

/* ============================================
   LIGHT MODE OVERRIDES for Nav/Drawer/Footer
   ============================================ */
[data-theme="light"] nav { background:#fff; color:#111; }
[data-theme="light"] .brand { color:#111; }
[data-theme="light"] .brand .wordmark { color:#111; }
[data-theme="light"] .nav-right { color:#444; }
[data-theme="light"] .nav-right a:hover, [data-theme="light"] .nav-right a:focus-visible { background:rgba(0,0,0,0.06); }
[data-theme="light"] .nav-right button:hover, [data-theme="light"] .nav-right button:focus-visible { background:rgba(0,0,0,0.06); }
[data-theme="light"] .nav-right .nav-menu-icon { color:#111; }
[data-theme="light"] .nav-right .badge { background: #2563eb !important; color: #fff !important; box-shadow:0 0 0 2px #fff !important; }
[data-theme="light"] .toggle_button, [data-theme="light"] .nav-right .toggle_button { color:#111; }
[data-theme="light"] .toggle_button:hover, [data-theme="light"] .nav-right .toggle_button:hover, [data-theme="light"] .nav-right .toggle_button:focus-visible { background:rgba(0,0,0,0.06); }
[data-theme="light"] .nav-drawer { background:#fff; color:#111; }
[data-theme="light"] .nav-drawer .nav-drawer-header { background:rgba(255,255,255,.95); border-bottom-color:#ddd; }
[data-theme="light"] .nav-drawer .nav-drawer-header .who { color:#111; }
[data-theme="light"] .nav-drawer .nav-drawer-header .who:hover { background:rgba(0,0,0,0.04); }
[data-theme="light"] .nav-drawer .nav-drawer-header .drawer-greeting { color:#111; }
[data-theme="light"] .nav-drawer .nav-drawer-header .drawer-network-name { color:#555; }
[data-theme="light"] .nav-drawer .nav-drawer-header .drawer-close-avatar { border-color:#ccc; background:#f0f0f0; color:#333; }
[data-theme="light"] .nav-drawer .nav-drawer-header .drawer-close-avatar:hover { background:#e5e5e5; border-color:#aaa; }
[data-theme="light"] .nav-drawer .menu h3 { color:#111; }
[data-theme="light"] .nav-drawer .menu > a { color:#111; border-color:#ddd; }
[data-theme="light"] .nav-drawer .menu a:hover { background:rgba(0,0,0,0.04); }
[data-theme="light"] .nav-drawer .sep { background:#ddd; }
[data-theme="light"] .nav-drawer details { border-color:#ddd; background:#fff; }
[data-theme="light"] .nav-drawer summary { color:#111; }
[data-theme="light"] .nav-drawer summary::after { color:#888; }
[data-theme="light"] .nav-drawer .submenu { background:#fff; }
[data-theme="light"] .nav-drawer .submenu a { color:#111 !important; }
[data-theme="light"] .nav-drawer .submenu a:hover { background:rgba(0,0,0,0.04); }
[data-theme="light"] .mode-chip { border-color:#ccc; background:#fff; color:#333; }
[data-theme="light"] .global-footer { background:#fff !important; color:#444; }
[data-theme="light"] .navbar-ghost { background:#fff; }
[data-theme="light"] .ke-global-banner { background:#fff; color:#111; border-color:#ccc; }
/* Footer legal links: keep orange accent, fix white separator dot on light bg */
[data-theme="light"] .legal-link { color:#c8741a !important; }
[data-theme="light"] .legal-link:hover { color:#e08a2a !important; }
[data-theme="light"] .legal-links .legal-link:not(:last-child)::after { color: rgba(0,0,0,.4) !important; }
@media (prefers-color-scheme: light) {
  :root:not([data-theme]) nav { background:#fff; color:#111; }
  :root:not([data-theme]) .brand { color:#111; }
  :root:not([data-theme]) .brand .wordmark { color:#111; }
  :root:not([data-theme]) .nav-right { color:#444; }
  :root:not([data-theme]) .nav-right a:hover, :root:not([data-theme]) .nav-right a:focus-visible { background:rgba(0,0,0,0.06); }
  :root:not([data-theme]) .nav-right button:hover, :root:not([data-theme]) .nav-right button:focus-visible { background:rgba(0,0,0,0.06); }
  :root:not([data-theme]) .nav-right .nav-menu-icon { color:#111; }
  :root:not([data-theme]) .nav-right .badge { box-shadow:0 0 0 2px #fff; }
  :root:not([data-theme]) .toggle_button, :root:not([data-theme]) .nav-right .toggle_button { color:#111; }
  :root:not([data-theme]) .toggle_button:hover, :root:not([data-theme]) .nav-right .toggle_button:hover, :root:not([data-theme]) .nav-right .toggle_button:focus-visible { background:rgba(0,0,0,0.06); }
  :root:not([data-theme]) .nav-drawer { background:#fff; color:#111; }
  :root:not([data-theme]) .nav-drawer .nav-drawer-header { background:rgba(255,255,255,.95); border-bottom-color:#ddd; }
  :root:not([data-theme]) .nav-drawer .nav-drawer-header .who { color:#111; }
  :root:not([data-theme]) .nav-drawer .nav-drawer-header .who:hover { background:rgba(0,0,0,0.04); }
  :root:not([data-theme]) .nav-drawer .nav-drawer-header .drawer-greeting { color:#111; }
  :root:not([data-theme]) .nav-drawer .nav-drawer-header .drawer-network-name { color:#555; }
  :root:not([data-theme]) .nav-drawer .nav-drawer-header .drawer-close-avatar { border-color:#ccc; background:#f0f0f0; color:#333; }
  :root:not([data-theme]) .nav-drawer .nav-drawer-header .drawer-close-avatar:hover { background:#e5e5e5; border-color:#aaa; }
  :root:not([data-theme]) .nav-drawer .menu h3 { color:#111; }
  :root:not([data-theme]) .nav-drawer .menu > a { color:#111; border-color:#ddd; }
  :root:not([data-theme]) .nav-drawer .menu a:hover { background:rgba(0,0,0,0.04); }
  :root:not([data-theme]) .nav-drawer .sep { background:#ddd; }
  :root:not([data-theme]) .nav-drawer details { border-color:#ddd; background:#fff; }
  :root:not([data-theme]) .nav-drawer summary { color:#111; }
  :root:not([data-theme]) .nav-drawer summary::after { color:#888; }
  :root:not([data-theme]) .nav-drawer .submenu { background:#fff; }
  :root:not([data-theme]) .nav-drawer .submenu a { color:#111 !important; }
  :root:not([data-theme]) .nav-drawer .submenu a:hover { background:rgba(0,0,0,0.04); }
  :root:not([data-theme]) .mode-chip { border-color:#ccc; background:#fff; color:#333; }
  :root:not([data-theme]) .global-footer { background:#fff !important; color:#444; }
  :root:not([data-theme]) .navbar-ghost { background:#fff; }
  :root:not([data-theme]) .ke-global-banner { background:#fff; color:#111; border-color:#ccc; }
}