/* Lore — layout: header, nav, footer, tab bar. */

.lore-header {
	position: sticky; top: 0; z-index: 40;
	height: var(--header-h);
	background: var(--paper);
	border-bottom: 1px solid var(--line);
}
.lore-header__inner {
	max-width: var(--max-w); margin: 0 auto; height: 100%;
	display: flex; align-items: center; gap: var(--space-4);
	padding: 0 var(--space-4);
}
.lore-header__logo { color: var(--ember); flex: none; display: flex; align-items: center; }
.lore-logo { height: 26px; width: auto; }

.lore-header__nav { display: none; align-items: center; gap: var(--space-2); }
@media (min-width: 900px) { .lore-header__nav { display: flex; } }

.lore-nav-item { position: relative; }
.lore-nav-link {
	display: inline-flex; align-items: center; gap: 4px;
	background: none; border: 0; cursor: pointer; padding: var(--space-2) var(--space-3);
	border-radius: var(--radius-md); font-weight: 600; font-size: .9rem;
}
.lore-nav-link:hover { background: var(--paper-alt); }

.lore-mega-menu {
	position: absolute; top: calc(100% + 8px); left: 0;
	background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-lg);
	box-shadow: var(--shadow-lg); padding: var(--space-4); min-width: 260px; z-index: 50;
}
.lore-mega-menu[hidden] { display: none; }
.lore-menu { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 2px; }
.lore-menu li a { display: block; padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); font-size: .9rem; }
.lore-menu li a:hover { background: var(--paper-alt); color: var(--ember); }

.lore-header__search {
	flex: 1 1 auto; max-width: 420px; margin: 0 auto; position: relative; display: none;
}
@media (min-width: 700px) { .lore-header__search { display: block; } }
.lore-header__search-icon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); width: 18px; height: 18px; color: var(--ink-faint); pointer-events: none; }
.lore-header__search input {
	width: 100%; height: 40px; border-radius: var(--radius-pill); border: 1px solid var(--line);
	background: var(--paper-alt); padding: 0 var(--space-4) 0 40px; font-size: .9rem; color: var(--ink);
}
.lore-header__search input:focus { background: var(--white); border-color: var(--teal); }

.lore-header__actions { display: flex; align-items: center; gap: var(--space-1); flex: none; }
.lore-icon-btn--badge { position: relative; }
.lore-avatar-btn { background: none; border: 0; padding: 2px; border-radius: 50%; cursor: pointer; }
.lore-avatar-img { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; display: block; }

.lore-dropdown {
	position: absolute; top: calc(100% + 8px); right: 0;
	background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-lg);
	box-shadow: var(--shadow-lg); min-width: 220px; padding: var(--space-2); z-index: 50;
}
.lore-dropdown[hidden] { display: none; }
.lore-dropdown a, .lore-dropdown button {
	display: flex; align-items: center; gap: var(--space-3);
	width: 100%; padding: var(--space-3); border-radius: var(--radius-md);
	background: none; border: 0; cursor: pointer; text-align: left; font-size: .9rem;
}
.lore-dropdown a:hover, .lore-dropdown button:hover { background: var(--paper-alt); }
.lore-dropdown__notice { background: var(--ember-light); color: var(--ember-dark); border-radius: var(--radius-md); padding: var(--space-3); font-size: .8rem; margin-bottom: var(--space-2); }
.lore-dropdown__logout { color: var(--danger); }

.lore-toasts {
	position: fixed; left: 50%; bottom: calc(var(--tabbar-h) + 12px); transform: translateX(-50%);
	z-index: 200; display: flex; flex-direction: column; gap: 8px; width: min(92vw, 420px);
}
@media (min-width: 700px) { .lore-toasts { bottom: 24px; } }
.lore-toast {
	background: var(--ink); color: var(--paper); padding: 12px 16px; border-radius: var(--radius-md);
	box-shadow: var(--shadow-lg); font-size: .875rem; display: flex; align-items: center; gap: 8px;
	animation: lore-toast-in .18s ease;
}
.lore-toast--error { background: var(--danger); }
.lore-toast--success { background: var(--teal-dark); }
@keyframes lore-toast-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

.lore-unverified-banner {
	display: flex; align-items: center; justify-content: center; gap: var(--space-3);
	flex-wrap: wrap; background: var(--ember-light); color: var(--ember-dark);
	padding: var(--space-2) var(--space-4); font-size: .85rem; text-align: center;
}

.lore-main { min-height: 60vh; padding-bottom: calc(var(--tabbar-h) + var(--space-6)); }
@media (min-width: 900px) { .lore-main { padding-bottom: var(--space-10); } }

/* Footer */
.lore-footer { background: var(--paper-alt); border-top: 1px solid var(--line); padding: var(--space-10) var(--space-4) calc(var(--tabbar-h) + var(--space-6)); }
@media (min-width: 900px) { .lore-footer { padding-bottom: var(--space-10); } }
.lore-footer__inner { max-width: var(--max-w); margin: 0 auto; text-align: center; }
.lore-footer__logo { color: var(--ember); display: inline-flex; margin-bottom: var(--space-2); }
.lore-footer__tagline { color: var(--ink-faint); font-size: .9rem; }
.lore-footer__menu { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-4); padding: 0; margin: var(--space-4) 0; }
.lore-footer__menu a { font-size: .85rem; color: var(--ink-soft); }
.lore-footer__menu a:hover { color: var(--ember); }
.lore-footer__copy { font-size: .75rem; color: var(--ink-faint); }

/* Mobile bottom tab bar */
.lore-tabbar {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
	display: flex; height: var(--tabbar-h);
	background: var(--white); border-top: 1px solid var(--line);
	padding-bottom: env(safe-area-inset-bottom, 0);
}
@media (min-width: 900px) { .lore-tabbar { display: none; } }
.lore-tabbar__item {
	flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
	gap: 2px; color: var(--ink-faint); font-size: .65rem; font-weight: 600; min-height: 44px;
}
.lore-tabbar__item .lore-icon { width: 22px; height: 22px; }
.lore-tabbar__item.is-active { color: var(--ember); }
