/* Ultimate Free Tools — User Panel (chromeless SPA) */
:root {
	--uft-bg: #F7F8FB;
	--uft-surface: #FFFFFF;
	--uft-surface-2: #F2F4F9;
	--uft-border: #E4E7EF;
	--uft-text: #101426;
	--uft-text-muted: #5B6376;
	--uft-brand: #4F46E5;
	--uft-brand-600: #4338CA;
	--uft-brand-soft: #EEF2FF;
	--uft-danger: #DC2626;
	--uft-success: #16A34A;
	--uft-warning: #D97706;
	--uft-radius: 14px;
	--uft-radius-sm: 10px;
	--uft-shadow: 0 1px 2px rgba(16,20,38,.04), 0 6px 20px -12px rgba(16,20,38,.18);
	--uft-shadow-lg: 0 10px 40px -12px rgba(16,20,38,.24);
	--uft-sidebar: 260px;
	--uft-topbar: 60px;
	color-scheme: light;
}
html.dark {
	--uft-bg: #0B0E1A;
	--uft-surface: #131829;
	--uft-surface-2: #1B2136;
	--uft-border: #262C42;
	--uft-text: #EAEDF7;
	--uft-text-muted: #94A0B8;
	--uft-brand: #818CF8;
	--uft-brand-600: #6366F1;
	--uft-brand-soft: #1E2340;
	color-scheme: dark;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; overflow-x: hidden; max-width: 100%; }
.uft-app *, .uft-app { min-width: 0; }
.uft-app img, .uft-app video, .uft-app iframe, .uft-app canvas { max-width: 100%; height: auto; }
.uft-app pre, .uft-app code { max-width: 100%; overflow-x: auto; white-space: pre-wrap; word-wrap: break-word; }
.uft-app h1, .uft-app h2, .uft-app h3, .uft-app h4, .uft-app p, .uft-app li, .uft-app span, .uft-app a { overflow-wrap: anywhere; }
.uft-app table { display: block; max-width: 100%; overflow-x: auto; }
body.uft-app-body {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, system-ui, sans-serif;
	background: var(--uft-bg);
	color: var(--uft-text);
	-webkit-font-smoothing: antialiased;
	min-height: 100dvh;
}
a { color: var(--uft-brand); text-decoration: none; }
a:hover { text-decoration: underline; }

/* --------- Sign-in ---------- */
.uft-app-signin { min-height: 100dvh; display: grid; place-items: center; padding: 2rem; }
.uft-app-signin__card {
	background: var(--uft-surface); border-radius: var(--uft-radius);
	padding: 2.5rem; max-width: 420px; width: 100%; text-align: center;
	box-shadow: var(--uft-shadow-lg); border: 1px solid var(--uft-border);
}
.uft-app-signin__brand { font-weight: 700; color: var(--uft-brand); margin-bottom: 1.5rem; }
.uft-app-signin h1 { margin: 0 0 .5rem; font-size: 1.5rem; }
.uft-app-signin p { color: var(--uft-text-muted); margin: 0 0 1.75rem; }
.uft-app-signin .uft-btn { display: block; margin: .5rem 0; }

/* --------- Buttons ---------- */
.uft-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
	padding: .625rem 1rem; border-radius: var(--uft-radius-sm);
	font-weight: 600; font-size: .9rem; border: 1px solid transparent;
	cursor: pointer; transition: transform .06s ease, background .15s ease, border-color .15s ease;
	text-decoration: none; white-space: nowrap;
}
.uft-btn:active { transform: translateY(1px); }
.uft-btn--primary { background: var(--uft-brand); color: #fff; }
.uft-btn--primary:hover { background: var(--uft-brand-600); text-decoration: none; color: #fff; }
.uft-btn--ghost { background: transparent; color: var(--uft-text); border-color: var(--uft-border); }
.uft-btn--ghost:hover { background: var(--uft-surface-2); text-decoration: none; }
.uft-btn--danger { background: var(--uft-danger); color: #fff; }
.uft-btn--danger:hover { background: #b91c1c; text-decoration: none; color: #fff; }
.uft-btn--sm { padding: .375rem .625rem; font-size: .8rem; }
.uft-btn[disabled] { opacity: .55; cursor: not-allowed; }
/* Constrain inline icons inside buttons — icon() SVGs ship with no width/height
   attribute so without this rule they render at the SVG default 300×150 and blow
   up buttons like the sidebar Sign out. */
.uft-btn > svg { width: 16px; height: 16px; flex: 0 0 auto; }
.uft-btn--sm > svg { width: 14px; height: 14px; }

/* --------- Shell ---------- */
.uft-app { display: grid; grid-template-columns: var(--uft-sidebar) 1fr; min-height: 100dvh; }
.uft-app__boot { display: grid; place-items: center; min-height: 100dvh; grid-column: 1 / -1; color: var(--uft-text-muted); text-align: center; }
.uft-spinner {
	width: 34px; height: 34px; border-radius: 50%;
	border: 3px solid var(--uft-border); border-top-color: var(--uft-brand);
	margin: 0 auto 1rem; animation: uft-spin .9s linear infinite;
}
@keyframes uft-spin { to { transform: rotate(360deg); } }

/* --------- Sidebar ---------- */
.uft-sidebar {
	background: var(--uft-surface); border-right: 1px solid var(--uft-border);
	padding: 1rem; display: flex; flex-direction: column; gap: 1rem;
	position: sticky; top: 0; height: 100dvh; overflow-y: auto;
}
.uft-brand { display: flex; align-items: center; gap: .625rem; padding: .5rem .75rem; }
.uft-brand__logo { width: 32px; height: 32px; border-radius: 8px; background: linear-gradient(135deg, var(--uft-brand), var(--uft-brand-600)); display: grid; place-items: center; color: #fff; font-weight: 800; }
.uft-brand__name { font-weight: 700; font-size: .95rem; }
.uft-nav { display: flex; flex-direction: column; gap: 2px; }
.uft-nav a {
	display: flex; align-items: center; gap: .625rem;
	padding: .625rem .75rem; border-radius: var(--uft-radius-sm);
	color: var(--uft-text); font-weight: 500; font-size: .9rem;
}
.uft-nav a:hover { background: var(--uft-surface-2); text-decoration: none; }
.uft-nav a.is-active { background: var(--uft-brand-soft); color: var(--uft-brand-600); }
html.dark .uft-nav a.is-active { color: var(--uft-brand); }
.uft-nav svg { width: 18px; height: 18px; flex-shrink: 0; }
.uft-sidebar__footer { margin-top: auto; border-top: 1px solid var(--uft-border); padding-top: 1rem; }
.uft-userchip { display: flex; align-items: center; gap: .625rem; padding: .5rem; border-radius: var(--uft-radius-sm); }
.uft-userchip img { width: 32px; height: 32px; border-radius: 50%; }
.uft-userchip__meta { min-width: 0; flex: 1; }
.uft-userchip__name { font-weight: 600; font-size: .85rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.uft-userchip__mail { font-size: .75rem; color: var(--uft-text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* --------- Main ---------- */
.uft-main { display: flex; flex-direction: column; min-width: 0; }
.uft-topbar {
	height: var(--uft-topbar); border-bottom: 1px solid var(--uft-border);
	background: var(--uft-surface); display: flex; align-items: center; gap: 1rem;
	padding: 0 1.25rem; position: sticky; top: 0; z-index: 20;
}
.uft-topbar__title { font-weight: 700; font-size: 1rem; margin: 0; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.uft-topbar__actions { display: flex; align-items: center; gap: .5rem; }
.uft-hamburger { display: none; }

.uft-content { padding: 1.5rem; max-width: 1200px; width: 100%; margin: 0 auto; }
.uft-content h1 { margin: 0 0 .25rem; font-size: 1.5rem; }
.uft-content h2 { font-size: 1.15rem; margin: 0 0 1rem; }
.uft-content__sub { color: var(--uft-text-muted); margin: 0 0 2rem; }

/* --------- Cards / grids ---------- */
.uft-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; margin-bottom: 2rem; }
.uft-stat {
	background: var(--uft-surface); border: 1px solid var(--uft-border);
	border-radius: var(--uft-radius); padding: 1.25rem;
}
.uft-stat__label { color: var(--uft-text-muted); font-size: .8rem; font-weight: 500; margin: 0 0 .5rem; text-transform: uppercase; letter-spacing: .04em; }
.uft-stat__value { font-size: 1.75rem; font-weight: 700; margin: 0; line-height: 1; }
.uft-stat__hint { color: var(--uft-text-muted); font-size: .8rem; margin: .5rem 0 0; }

.uft-card { background: var(--uft-surface); border: 1px solid var(--uft-border); border-radius: var(--uft-radius); }
.uft-card__head { padding: 1rem 1.25rem; border-bottom: 1px solid var(--uft-border); display: flex; align-items: center; gap: 1rem; }
.uft-card__head h2 { margin: 0; }
.uft-card__body { padding: 1.25rem; }

/* --------- Table ---------- */
.uft-toolbar { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1rem; }
.uft-toolbar input, .uft-toolbar select { flex: 1; min-width: 180px; }

.uft-input, .uft-select, .uft-textarea {
	width: 100%; padding: .625rem .75rem; border: 1px solid var(--uft-border);
	border-radius: var(--uft-radius-sm); background: var(--uft-surface); color: var(--uft-text);
	font: inherit; font-size: .9rem; transition: border-color .15s ease, box-shadow .15s ease;
}
.uft-input:focus, .uft-select:focus, .uft-textarea:focus {
	outline: none; border-color: var(--uft-brand);
	box-shadow: 0 0 0 3px color-mix(in oklab, var(--uft-brand) 20%, transparent);
}
.uft-textarea { min-height: 120px; resize: vertical; }

.uft-table { width: 100%; border-collapse: collapse; }
.uft-table th, .uft-table td { padding: .875rem 1rem; text-align: left; border-bottom: 1px solid var(--uft-border); font-size: .9rem; }
.uft-table th { font-weight: 600; color: var(--uft-text-muted); font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; background: var(--uft-surface-2); }
.uft-table tbody tr:hover { background: var(--uft-surface-2); }
.uft-table__title { display: flex; align-items: center; gap: .75rem; }
.uft-table__logo { width: 36px; height: 36px; border-radius: 8px; background: var(--uft-surface-2); object-fit: cover; }
.uft-table__logo--ph { display: grid; place-items: center; color: var(--uft-text-muted); font-weight: 700; font-size: .95rem; }
.uft-table__name { font-weight: 600; color: var(--uft-text); }
.uft-table__actions { display: flex; gap: .375rem; justify-content: flex-end; }

.uft-badge { display: inline-block; padding: .2rem .55rem; border-radius: 999px; font-size: .7rem; font-weight: 600; letter-spacing: .02em; text-transform: uppercase; }
.uft-badge--publish { background: #DCFCE7; color: #166534; }
.uft-badge--draft { background: var(--uft-surface-2); color: var(--uft-text-muted); }
.uft-badge--pending { background: #FEF3C7; color: #92400E; }
.uft-badge--private { background: #E0E7FF; color: #3730A3; }
.uft-badge--free { background: #DCFCE7; color: #166534; }
.uft-badge--freemium { background: #DBEAFE; color: #1E40AF; }
.uft-badge--paid { background: #FEF3C7; color: #92400E; }
html.dark .uft-badge--publish { background: rgba(22,163,74,.18); color: #86EFAC; }
html.dark .uft-badge--draft { background: var(--uft-surface-2); }
html.dark .uft-badge--pending { background: rgba(217,119,6,.2); color: #FCD34D; }
html.dark .uft-badge--private { background: rgba(99,102,241,.2); color: #C7D2FE; }
html.dark .uft-badge--free { background: rgba(22,163,74,.18); color: #86EFAC; }
html.dark .uft-badge--freemium { background: rgba(37,99,235,.22); color: #BFDBFE; }
html.dark .uft-badge--paid { background: rgba(217,119,6,.2); color: #FCD34D; }

/* --------- Forms ---------- */
.uft-form { display: grid; gap: 1.25rem; }
.uft-form__row { display: grid; gap: .375rem; }
.uft-form__row label { font-weight: 600; font-size: .85rem; }
.uft-form__hint { color: var(--uft-text-muted); font-size: .78rem; margin: 0; }
.uft-form__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.25rem; }
.uft-form__actions { display: flex; gap: .5rem; justify-content: flex-end; border-top: 1px solid var(--uft-border); padding-top: 1.25rem; }
.uft-checkbox { display: flex; align-items: center; gap: .5rem; font-size: .9rem; font-weight: 500; }

/* --------- Empty & error ---------- */
.uft-empty { text-align: center; padding: 3rem 1rem; color: var(--uft-text-muted); }
.uft-empty h3 { color: var(--uft-text); margin: 0 0 .5rem; font-size: 1.1rem; }
.uft-empty p { margin: 0 0 1.25rem; }

.uft-alert { padding: .875rem 1rem; border-radius: var(--uft-radius-sm); font-size: .88rem; margin-bottom: 1rem; }
.uft-alert--error { background: #FEF2F2; color: #991B1B; border: 1px solid #FECACA; }
.uft-alert--info  { background: var(--uft-brand-soft); color: var(--uft-brand-600); border: 1px solid color-mix(in oklab, var(--uft-brand) 25%, transparent); }
html.dark .uft-alert--error { background: rgba(220,38,38,.15); color: #FCA5A5; border-color: rgba(220,38,38,.35); }

/* --------- Toast ---------- */
.uft-toast-root { position: fixed; bottom: 1.25rem; right: 1.25rem; display: flex; flex-direction: column; gap: .5rem; z-index: 1000; pointer-events: none; }
.uft-toast {
	background: var(--uft-surface); border: 1px solid var(--uft-border);
	border-radius: var(--uft-radius-sm); padding: .75rem 1rem;
	box-shadow: var(--uft-shadow-lg); pointer-events: auto; min-width: 220px; max-width: 340px;
	font-size: .88rem; font-weight: 500;
	animation: uft-toast-in .2s ease;
}
.uft-toast--success { border-left: 3px solid var(--uft-success); }
.uft-toast--error { border-left: 3px solid var(--uft-danger); }
.uft-toast--info { border-left: 3px solid var(--uft-brand); }
@keyframes uft-toast-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* --------- Responsive ---------- */
@media (max-width: 900px) {
	.uft-app { grid-template-columns: 1fr; }
	.uft-sidebar {
		position: fixed; inset: 0 auto 0 0; width: 280px;
		transform: translateX(-100%); transition: transform .2s ease;
		z-index: 40; box-shadow: var(--uft-shadow-lg);
	}
	.uft-sidebar.is-open { transform: none; }
	.uft-hamburger { display: inline-flex; }
	.uft-content { padding: 1rem; }
	.uft-table th:nth-child(3), .uft-table td:nth-child(3),
	.uft-table th:nth-child(4), .uft-table td:nth-child(4) { display: none; }
}
.uft-scrim { position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 30; }
@media (min-width: 901px) { .uft-scrim { display: none; } }

@media (prefers-reduced-motion: reduce) {
	.uft-spinner, .uft-toast { animation: none; }
}

/* ---------------- Additions: a11y, fieldset, pagination, counter ---------------- */
.uft-visually-hidden {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.uft-skip-link {
	position: absolute; top: -100px; left: 0; z-index: 100;
	background: var(--uft-brand); color: #fff; padding: .75rem 1rem;
	text-decoration: none; font-weight: 600; border-radius: 0 0 var(--uft-radius-sm) 0;
}
.uft-skip-link:focus { top: 0; }

/* Explicit focus-visible on interactive elements */
.uft-btn:focus-visible,
.uft-nav a:focus-visible,
.uft-table__actions a:focus-visible,
.uft-table__actions button:focus-visible {
	outline: 2px solid var(--uft-brand); outline-offset: 2px;
}
.uft-input:focus-visible, .uft-select:focus-visible, .uft-textarea:focus-visible {
	outline: none; /* already handled via focus box-shadow */
}

/* Remove focus outline on scripted heading focus (screen-reader-only announcement) */
.uft-content h1:focus { outline: none; }

.uft-fieldset {
	border: 1px solid var(--uft-border); border-radius: var(--uft-radius);
	padding: 1rem 1.25rem 1.25rem; margin: 0;
}
.uft-fieldset + .uft-fieldset { margin-top: 1.25rem; }
.uft-fieldset legend {
	padding: 0 .5rem; font-weight: 700; font-size: .82rem;
	text-transform: uppercase; letter-spacing: .06em; color: var(--uft-text-muted);
}

.uft-form__counter {
	font-weight: 400; font-size: .75rem; color: var(--uft-text-muted); margin-left: .35rem;
}

.uft-pagination {
	display: flex; align-items: center; justify-content: center; gap: .375rem;
	padding: 1rem; border-top: 1px solid var(--uft-border);
}
.uft-pagination:empty { display: none; }

/* Fill hamburger icon color so it renders in dark mode */
.uft-hamburger svg { color: currentColor; }

/* Better sign-in button spacing */
.uft-app-signin .uft-btn + .uft-btn { margin-top: .5rem; }

/* WordPress classic editor overrides inside the SPA */
.wp-editor-wrap { border-radius: .5rem; overflow: hidden; }
.wp-editor-wrap .wp-editor-tabs { background: var(--uft-bg-alt); }
.wp-editor-wrap .wp-switch-editor {
	background: var(--uft-bg-alt); color: var(--uft-text); border-color: var(--uft-border);
}
.wp-editor-wrap .mce-toolbar-grp,
.wp-editor-wrap .mce-statusbar,
.wp-editor-wrap .mce-edit-area { background: var(--uft-bg) !important; }
.wp-editor-wrap textarea.wp-editor-area {
	background: var(--uft-bg); color: var(--uft-text);
	border: 1px solid var(--uft-border); font-family: ui-monospace, monospace; font-size: .9rem;
}
.mce-tinymce { box-shadow: none !important; }

/* WP media modal sits above panel */
.media-modal { z-index: 100200; }
.media-modal-backdrop { z-index: 100199; }

/* ---------------- Mobile bottom navigation (app-like) ---------------- */
.uft-bottomnav { display: none; }

@media (max-width: 900px) {
	.uft-bottomnav {
		display: grid !important;
		grid-template-columns: repeat(5, minmax(0, 1fr));
		position: fixed !important;
		left: 0 !important; right: 0 !important; bottom: 0 !important; top: auto !important;
		background: var(--uft-surface);
		border-top: 1px solid var(--uft-border);
		z-index: 9999;
		padding-bottom: env(safe-area-inset-bottom, 0);
		box-shadow: 0 -2px 12px rgba(0,0,0,.06);
		transform: translateZ(0);
		will-change: transform;
	}
	.uft-bottomnav__item {
		display: flex; flex-direction: column; align-items: center; justify-content: center;
		gap: 2px; padding: .5rem .15rem; min-height: 58px; min-width: 0;
		color: var(--uft-text-muted); text-decoration: none;
		font-size: .62rem; font-weight: 600; letter-spacing: .01em;
		-webkit-tap-highlight-color: transparent;
	}
	.uft-bottomnav__item:hover { text-decoration: none; color: var(--uft-text); }
	.uft-bottomnav__item.is-active { color: var(--uft-brand-600); }
	html.dark .uft-bottomnav__item.is-active { color: var(--uft-brand); }
	.uft-bottomnav__icon { display: grid; place-items: center; }
	.uft-bottomnav__icon svg { width: 20px; height: 20px; }
	.uft-bottomnav__label {
		line-height: 1; max-width: 100%;
		overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
	}

	/* Reserve room under content so bottom nav doesn't cover it. */
	.uft-content { padding-bottom: calc(72px + env(safe-area-inset-bottom, 0)); }
	/* Toasts should sit above the tab bar */
	.uft-toast-root { bottom: calc(80px + env(safe-area-inset-bottom, 0)); right: .75rem; left: .75rem; }
	.uft-toast { max-width: none; }
	/* Make the topbar title feel like a native app header */
	.uft-topbar__title { font-size: 1.05rem; text-align: center; }
	.uft-topbar { padding: 0 .75rem; }
}

/* ---------------- Welcome hero (empty dashboard) ---------------- */
.uft-welcome {
	position: relative; overflow: hidden;
	border-radius: var(--uft-radius);
	padding: 2rem 2rem 2.25rem;
	margin-bottom: 2rem;
	color: #fff;
	background:
		radial-gradient(1200px 300px at -10% -20%, rgba(255,255,255,.18), transparent 60%),
		radial-gradient(600px 240px at 110% 120%, rgba(255,255,255,.12), transparent 60%),
		linear-gradient(135deg, var(--uft-brand), var(--uft-brand-600));
	box-shadow: var(--uft-shadow-lg);
}
.uft-welcome__eyebrow { font-size:.72rem; text-transform:uppercase; letter-spacing:.14em; opacity:.85; font-weight:700; margin:0 0 .5rem; }
.uft-welcome__title { font-size: clamp(1.4rem, 3vw, 1.9rem); font-weight: 800; line-height:1.15; margin:0 0 .5rem; }
.uft-welcome__body { margin:0 0 1.25rem; max-width: 46ch; opacity:.92; line-height:1.55; }
.uft-welcome__ctas { display:flex; gap:.5rem; flex-wrap:wrap; }
.uft-welcome .uft-btn--primary { background:#fff; color: var(--uft-brand-600); }
.uft-welcome .uft-btn--primary:hover { background:#f3f4ff; color: var(--uft-brand-600); }
.uft-welcome .uft-btn--ghost { color:#fff; border-color: rgba(255,255,255,.4); background: transparent; }
.uft-welcome .uft-btn--ghost:hover { background: rgba(255,255,255,.12); color:#fff; }
.uft-welcome__steps { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap:.75rem; margin-top:1.5rem; }
.uft-welcome__step { background: rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.18); border-radius: var(--uft-radius-sm); padding:.75rem .875rem; font-size:.85rem; backdrop-filter: blur(4px); }
.uft-welcome__step b { display:block; margin-bottom:.15rem; font-size:.9rem; }

/* Editor status pill next to heading */
.uft-status-pill {
	display:inline-flex; align-items:center; gap:.35rem;
	padding:.28rem .6rem; border-radius:999px; font-size:.72rem;
	font-weight:700; text-transform:uppercase; letter-spacing:.05em;
	margin-left:.6rem; vertical-align: middle;
}
.uft-status-pill::before { content:""; width:.5rem; height:.5rem; border-radius:50%; background: currentColor; }
.uft-status-pill--publish { background:#DCFCE7; color:#166534; }
.uft-status-pill--pending { background:#FEF3C7; color:#92400E; }
.uft-status-pill--draft   { background: var(--uft-surface-2); color: var(--uft-text-muted); }
.uft-status-pill--private { background:#E0E7FF; color:#3730A3; }
html.dark .uft-status-pill--publish { background: rgba(22,163,74,.18); color:#86EFAC; }
html.dark .uft-status-pill--pending { background: rgba(217,119,6,.2); color:#FCD34D; }
html.dark .uft-status-pill--private { background: rgba(99,102,241,.2); color:#C7D2FE; }

/* Floating action button (mobile only) */
.uft-fab {
	display:none;
	position: fixed; right: 1rem; z-index: 44;
	bottom: calc(80px + env(safe-area-inset-bottom, 0));
	width: 56px; height: 56px; border-radius: 50%;
	background: linear-gradient(135deg, var(--uft-brand), var(--uft-brand-600));
	color:#fff; align-items:center; justify-content:center;
	box-shadow: 0 10px 28px -8px rgba(79,70,229,.55), 0 2px 6px rgba(0,0,0,.15);
	border: none; text-decoration: none;
}
.uft-fab:hover { color:#fff; text-decoration:none; filter: brightness(1.05); }
.uft-fab svg { width: 26px; height: 26px; }
@media (max-width: 900px) { .uft-fab { display: inline-flex; } }

/* Install banner (PWA hint) */
.uft-install {
	display:flex; align-items:center; gap:.75rem;
	background: var(--uft-brand-soft);
	border:1px solid color-mix(in oklab, var(--uft-brand) 25%, transparent);
	color: var(--uft-brand-600);
	padding:.75rem 1rem; border-radius: var(--uft-radius);
	margin-bottom:1.25rem;
}
html.dark .uft-install { color: var(--uft-brand); }
.uft-install__icon { width:36px; height:36px; border-radius:10px; background: var(--uft-brand); color:#fff; display:grid; place-items:center; flex-shrink:0; }
.uft-install__body { flex:1; min-width:0; font-size:.88rem; }
.uft-install__body b { display:block; color: var(--uft-text); margin-bottom:.1rem; }
.uft-install__body span { color: var(--uft-text-muted); }
.uft-install__actions { display:flex; gap:.375rem; flex-shrink:0; }

/* ============================================================================
 * v2 — dual-mode dashboard additions
 * ========================================================================= */

/* Mode-aware accent — brand for Explorer, mint for Publisher */
body[data-mode="publish"] {
	--uft-brand: #059669;
	--uft-brand-600: #047857;
	--uft-brand-soft: #ECFDF5;
}
html.dark body[data-mode="publish"] {
	--uft-brand: #34D399;
	--uft-brand-600: #10B981;
	--uft-brand-soft: #06231C;
}

/* Mode switcher */
.uft-modeswitch {
	display: inline-grid; grid-template-columns: 1fr 1fr;
	background: var(--uft-surface-2); border: 1px solid var(--uft-border);
	border-radius: 999px; padding: 3px; gap: 2px;
	width: 100%; margin: 0 .25rem;
}
.uft-modeswitch__btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .35rem;
	padding: .5rem .75rem; border-radius: 999px; border: 0;
	background: transparent; color: var(--uft-text-muted); font-weight: 600; font-size: .82rem;
	cursor: pointer; transition: background .18s ease, color .18s ease, box-shadow .18s ease;
}
.uft-modeswitch__btn svg { width: 15px; height: 15px; }
.uft-modeswitch__btn.is-active {
	background: var(--uft-surface); color: var(--uft-brand-600);
	box-shadow: 0 1px 2px rgba(16,20,38,.08);
}
html.dark .uft-modeswitch__btn.is-active { color: var(--uft-brand); background: var(--uft-surface); }
.uft-modeswitch--lg { max-width: 380px; }
.uft-modeswitch--lg .uft-modeswitch__btn { padding: .8rem 1rem; font-size: .95rem; }

/* Sidebar divider */
.uft-nav__divider { height: 1px; background: var(--uft-border); margin: .5rem .25rem; }

/* Topbar search + notification button */
.uft-topsearch {
	display: inline-flex; align-items: center; gap: .5rem;
	background: var(--uft-surface-2); border: 1px solid var(--uft-border);
	border-radius: 999px; padding: .3rem .75rem;
	color: var(--uft-text-muted);
}
.uft-topsearch svg { width: 15px; height: 15px; }
.uft-topsearch__input {
	border: 0; background: transparent; outline: none; color: var(--uft-text);
	font: inherit; font-size: .85rem; width: 200px;
}
.uft-topsearch__input:focus { width: 260px; }
@media (max-width: 900px) { .uft-topsearch { display: none; } }
.uft-hide-sm { display: inline-flex; }
@media (max-width: 700px) { .uft-hide-sm { display: none; } }

.uft-notif-btn { position: relative; }
.uft-notif__badge {
	position: absolute; top: -4px; right: -4px;
	background: var(--uft-danger); color: #fff; font-size: .62rem;
	line-height: 1; padding: 3px 5px; border-radius: 999px; font-weight: 700;
	min-width: 16px; text-align: center;
}

/* Hero */
.uft-hero {
	position: relative; overflow: hidden;
	border-radius: var(--uft-radius);
	padding: 2rem 2rem 2.25rem;
	margin-bottom: 2rem;
	color: #fff;
	background:
		radial-gradient(1200px 300px at -10% -20%, rgba(255,255,255,.18), transparent 60%),
		radial-gradient(600px 240px at 110% 120%, rgba(255,255,255,.12), transparent 60%),
		linear-gradient(135deg, var(--uft-brand), var(--uft-brand-600));
	box-shadow: var(--uft-shadow-lg);
}
.uft-hero__eyebrow { font-size: .72rem; text-transform: uppercase; letter-spacing: .14em; opacity: .85; font-weight: 700; margin: 0 0 .5rem; }
.uft-hero__title { font-size: clamp(1.4rem, 3vw, 2rem); font-weight: 800; line-height: 1.15; margin: 0 0 .5rem; }
.uft-hero__body { margin: 0 0 1.25rem; max-width: 52ch; opacity: .92; line-height: 1.55; }
.uft-hero__ctas { display: flex; gap: .5rem; flex-wrap: wrap; }
.uft-hero .uft-btn--primary { background: #fff; color: var(--uft-brand-600); }
.uft-hero .uft-btn--primary:hover { background: #f3f4ff; color: var(--uft-brand-600); }
.uft-hero .uft-btn--ghost { color: #fff; border-color: rgba(255,255,255,.4); background: transparent; }
.uft-hero .uft-btn--ghost:hover { background: rgba(255,255,255,.12); color: #fff; }

/* Sections */
.uft-section { margin-bottom: 2rem; }
.uft-section__head { display: flex; align-items: center; justify-content: space-between; margin: 0 0 .75rem; gap: 1rem; }
.uft-section__head h2 { margin: 0; font-size: 1.05rem; }

/* Tool grid + cards (Explorer) */
.uft-toolgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 1rem; }
.uft-toolcard {
	position: relative; background: var(--uft-surface); border: 1px solid var(--uft-border);
	border-radius: var(--uft-radius); overflow: hidden;
	transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.uft-toolcard:hover { transform: translateY(-2px); box-shadow: var(--uft-shadow); border-color: color-mix(in oklab, var(--uft-brand) 30%, var(--uft-border)); }
.uft-toolcard__body { display: block; padding: 1rem; color: inherit; text-decoration: none; }
.uft-toolcard__body:hover { text-decoration: none; color: inherit; }
.uft-toolcard__logo {
	width: 48px; height: 48px; border-radius: 12px; overflow: hidden;
	background: var(--uft-surface-2); display: grid; place-items: center;
	margin-bottom: .75rem; color: var(--uft-brand-600); font-weight: 800; font-size: 1.15rem;
}
.uft-toolcard__logo img { width: 100%; height: 100%; object-fit: cover; }
.uft-toolcard__title { margin: 0 0 .3rem; font-size: .95rem; font-weight: 700; line-height: 1.25; }
.uft-toolcard__short { margin: 0 0 .75rem; color: var(--uft-text-muted); font-size: .82rem; line-height: 1.45;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.uft-toolcard__foot { display: flex; align-items: center; gap: .5rem; font-size: .75rem; color: var(--uft-text-muted); flex-wrap: wrap; }
.uft-toolcard__rating, .uft-toolcard__fav { display: inline-flex; align-items: center; gap: .2rem; }
.uft-toolcard__rating svg, .uft-toolcard__fav svg { width: 12px; height: 12px; }

/* Horizontal rail (history) */
.uft-rail { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(220px, 260px); gap: .75rem; overflow-x: auto; padding-bottom: .5rem; scroll-snap-type: x proximity; }
.uft-rail > * { scroll-snap-align: start; }

/* Collections */
.uft-collections { display: grid; gap: .75rem; }
.uft-collection {
	display: flex; align-items: center; gap: .75rem;
	background: var(--uft-surface); border: 1px solid var(--uft-border);
	border-radius: var(--uft-radius); padding: .75rem 1rem;
}
.uft-collection__body { display: flex; align-items: center; gap: .75rem; flex: 1; color: inherit; }
.uft-collection__body:hover { text-decoration: none; color: inherit; }
.uft-collection__icon {
	width: 44px; height: 44px; border-radius: 12px; background: var(--uft-brand-soft);
	color: var(--uft-brand-600); display: grid; place-items: center; flex-shrink: 0;
}
.uft-collection__icon svg { width: 20px; height: 20px; }
.uft-collection h3 { margin: 0 0 .1rem; font-size: .95rem; }
.uft-collection p { margin: 0; color: var(--uft-text-muted); font-size: .8rem; }

/* Pills (Following selector) */
.uft-pills { display: flex; flex-wrap: wrap; gap: .4rem; }
.uft-pill {
	display: inline-flex; align-items: center; gap: .35rem;
	padding: .4rem .75rem; border-radius: 999px;
	background: var(--uft-surface-2); border: 1px solid var(--uft-border);
	color: var(--uft-text); font: inherit; font-size: .82rem; font-weight: 500;
	cursor: pointer; transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.uft-pill:hover { border-color: color-mix(in oklab, var(--uft-brand) 40%, var(--uft-border)); }
.uft-pill.is-on { background: var(--uft-brand); color: #fff; border-color: var(--uft-brand); }
.uft-pill.is-on svg { width: 12px; height: 12px; }

/* Tabs */
.uft-tabs { display: flex; gap: .25rem; margin-bottom: 1rem; overflow-x: auto; }
.uft-tab {
	background: transparent; border: 0; border-bottom: 2px solid transparent;
	padding: .5rem .875rem; font: inherit; font-weight: 600; font-size: .85rem;
	color: var(--uft-text-muted); cursor: pointer; white-space: nowrap;
}
.uft-tab:hover { color: var(--uft-text); }
.uft-tab.is-active { color: var(--uft-brand-600); border-bottom-color: var(--uft-brand); }
html.dark .uft-tab.is-active { color: var(--uft-brand); }

/* Charts */
.uft-card__body--chart { padding: .75rem 1rem 1rem; color: var(--uft-brand); }
.uft-chart { width: 100%; height: auto; display: block; }

/* Top list */
.uft-toplist { list-style: none; margin: 0; padding: 0; }
.uft-toplist li { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem 1.25rem; border-bottom: 1px solid var(--uft-border); font-size: .9rem; }
.uft-toplist li:last-child { border-bottom: 0; }
.uft-toplist a { color: var(--uft-text); font-weight: 600; text-decoration: none; }
.uft-toplist a:hover { color: var(--uft-brand-600); }
.uft-toplist__count { color: var(--uft-text-muted); font-size: .82rem; font-variant-numeric: tabular-nums; }

/* Notifications */
.uft-notifs { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.uft-notif {
	display: flex; align-items: center; gap: .75rem;
	background: var(--uft-surface); border: 1px solid var(--uft-border);
	border-radius: var(--uft-radius); padding: .75rem 1rem;
}
.uft-notif__icon {
	width: 34px; height: 34px; border-radius: 10px;
	background: var(--uft-surface-2); color: var(--uft-text-muted);
	display: grid; place-items: center; flex-shrink: 0;
}
.uft-notif__icon svg { width: 16px; height: 16px; }
.uft-notif__body { flex: 1; min-width: 0; }
.uft-notif__msg { margin: 0; font-size: .9rem; }
.uft-notif__meta { margin: .1rem 0 0; color: var(--uft-text-muted); font-size: .75rem; }
.uft-notif--unread { border-left: 3px solid var(--uft-brand); }
.uft-notif--unread .uft-notif__icon { background: var(--uft-brand-soft); color: var(--uft-brand-600); }

/* Two-column grid for dashboard */
.uft-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 900px) { .uft-grid-2 { grid-template-columns: 1fr; } }

/* Breadcrumb link */
.uft-breadcrumbs { margin-bottom: .5rem; font-size: .82rem; }
.uft-breadcrumbs a { color: var(--uft-text-muted); text-decoration: none; }
.uft-breadcrumbs a:hover { color: var(--uft-brand-600); }

/* Account head */
.uft-account__head { display: flex; align-items: center; gap: 1rem; }

/* Stats accent */
.uft-stat--accent { border-left: 3px solid var(--uft-brand); }

/* Empty state icon */
.uft-empty__icon {
	width: 56px; height: 56px; border-radius: 16px;
	background: var(--uft-brand-soft); color: var(--uft-brand-600);
	display: grid; place-items: center; margin: 0 auto 1rem;
}
.uft-empty__icon svg { width: 26px; height: 26px; }

/* Loading */
.uft-loading { padding: 3rem 1rem; text-align: center; color: var(--uft-text-muted); }

/* Hide topbar-title on mobile when a search field is available: cleaner nav */
@media (max-width: 700px) {
	.uft-modeswitch { grid-template-columns: 1fr 1fr; }
}

/* ============================================================================
 * v2.1 — Nav visibility & polish
 * ========================================================================= */

/* Richer sidebar (desktop + mobile drawer) */
.uft-sidebar {
	background:
		radial-gradient(700px 220px at -10% -20%, color-mix(in oklab, var(--uft-brand) 18%, transparent), transparent 60%),
		var(--uft-surface);
}
.uft-brand {
	padding: .5rem .75rem .75rem;
	border-bottom: 1px dashed var(--uft-border);
	margin-bottom: .25rem;
}
.uft-brand__logo {
	width: 36px; height: 36px; border-radius: 10px;
	box-shadow: 0 6px 16px -6px color-mix(in oklab, var(--uft-brand) 55%, transparent);
}
.uft-brand__name { font-size: 1rem; letter-spacing: -.01em; }
.uft-nav a {
	padding: .7rem .8rem; border-radius: 12px;
	border: 1px solid transparent;
}
.uft-nav a:hover { background: var(--uft-brand-soft); color: var(--uft-brand-600); }
.uft-nav a.is-active {
	background: var(--uft-brand-soft);
	color: var(--uft-brand-600);
	border-color: color-mix(in oklab, var(--uft-brand) 22%, transparent);
	box-shadow: 0 4px 14px -8px color-mix(in oklab, var(--uft-brand) 55%, transparent);
}

/* Loud, obvious top bar so users can find the menu on mobile */
.uft-topbar {
	background: linear-gradient(180deg, var(--uft-surface), color-mix(in oklab, var(--uft-surface) 88%, var(--uft-brand-soft)));
	backdrop-filter: saturate(1.2) blur(6px);
}
.uft-topbar__title {
	font-size: 1.02rem; font-weight: 800; letter-spacing: -.01em;
}

/* HAMBURGER — always visible & clickable on mobile */
@media (max-width: 900px) {
	.uft-hamburger {
		display: inline-flex !important;
		width: 42px; height: 42px; padding: 0;
		border-radius: 12px;
		background: linear-gradient(135deg, var(--uft-brand), var(--uft-brand-600)) !important;
		color: #fff !important; border-color: transparent !important;
		box-shadow: 0 6px 16px -8px color-mix(in oklab, var(--uft-brand) 65%, transparent);
	}
	.uft-hamburger svg { width: 20px; height: 20px; }
	.uft-hamburger:hover { filter: brightness(1.05); }
	.uft-topbar { height: 64px; padding: 0 .75rem; gap: .5rem; }
	.uft-topbar__title { font-size: 1rem; text-align: left; padding-left: .1rem; }
	.uft-topbar__actions .uft-btn--sm { width: 40px; height: 40px; padding: 0; border-radius: 12px; }
	.uft-topbar__actions .uft-btn--sm svg { width: 18px; height: 18px; }
	.uft-topbar__actions .uft-hide-sm { display: none !important; }
	/* Give the drawer a real header */
	.uft-sidebar { width: 300px; padding: 1.25rem 1rem 1rem; }
}

/* Bottom nav polish: taller, stronger active state */
@media (max-width: 900px) {
	.uft-bottomnav {
		box-shadow: 0 -6px 24px -12px rgba(0,0,0,.18);
		backdrop-filter: blur(10px);
		background: color-mix(in oklab, var(--uft-surface) 92%, transparent);
	}
	.uft-bottomnav__item { font-size: .7rem; }
	.uft-bottomnav__item.is-active .uft-bottomnav__icon {
		background: var(--uft-brand-soft);
		border-radius: 12px;
		padding: 4px 10px;
	}
}

/* Scrim above sidebar hover, softer color */
.uft-scrim { background: rgba(10,14,26,.5); backdrop-filter: blur(2px); }

/* Mode switcher — larger tap target on mobile */
@media (max-width: 900px) {
	.uft-modeswitch__btn { padding: .6rem .5rem; font-size: .85rem; }
}

/* Section head consistency */
.uft-section__head h2 { font-size: 1.1rem; font-weight: 800; letter-spacing: -.01em; }

/* ==========================================================================
 * Modal + tool-actions list
 * ======================================================================== */
.uft-modal__backdrop{
	position: fixed; inset: 0; z-index: 10000;
	background: rgba(15, 23, 42, .55);
	backdrop-filter: blur(6px);
	display: flex; align-items: center; justify-content: center;
	padding: 1rem;
	padding-bottom: calc(1rem + var(--uft-bottomnav-h, 0px) + env(safe-area-inset-bottom, 0px));
	opacity: 0; transition: opacity .16s ease;
}
.uft-modal__backdrop.is-open{ opacity: 1; }
.uft-modal__backdrop.is-closing{ opacity: 0; }
.uft-modal{
	width: 100%; max-width: 440px;
	background: var(--uft-surface, #fff);
	color: var(--uft-text, #0f172a);
	border-radius: 20px;
	box-shadow: 0 24px 64px -12px rgba(0,0,0,.35);
	overflow: hidden;
	transform: translateY(12px) scale(.98);
	transition: transform .18s cubic-bezier(.2,.9,.3,1);
	display: flex; flex-direction: column;
	max-height: calc(100dvh - 2rem - var(--uft-bottomnav-h, 0px) - env(safe-area-inset-bottom, 0px));
}
@media (max-width: 900px){
	:root{ --uft-bottomnav-h: 68px; }
}
.uft-modal__backdrop.is-open .uft-modal{ transform: translateY(0) scale(1); }
.uft-modal__head{
	display: flex; align-items: flex-start; gap: .75rem;
	padding: 1.1rem 1.15rem .75rem;
	border-bottom: 1px solid var(--uft-border, rgba(15,23,42,.08));
}
.uft-modal__titles{ flex: 1; min-width: 0; }
.uft-modal__title{
	font-size: 1.05rem; font-weight: 700; margin: 0;
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.uft-modal__sub{
	margin: .2rem 0 0; font-size: .78rem; color: var(--uft-text-muted, #64748b);
	text-transform: capitalize;
}
.uft-modal__close{
	appearance: none; border: 0; background: transparent;
	width: 34px; height: 34px; border-radius: 10px;
	display: inline-flex; align-items: center; justify-content: center;
	color: var(--uft-text-muted, #64748b); cursor: pointer;
	transition: background .15s, color .15s;
}
.uft-modal__close:hover{ background: rgba(15,23,42,.06); color: var(--uft-text, #0f172a); }
.uft-modal__close svg{ width: 18px; height: 18px; }
.uft-modal__body{ padding: .5rem .6rem 1rem; overflow: auto; }

.uft-actions-list{ list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.uft-actions-list__item{
	width: 100%; display: flex; align-items: center; gap: .85rem;
	padding: .8rem .75rem;
	border-radius: 12px;
	background: transparent; border: 0;
	color: inherit; text-align: left; text-decoration: none;
	font: inherit; cursor: pointer;
	transition: background .15s, transform .1s;
}
.uft-actions-list__item:hover{ background: rgba(15,23,42,.05); }
.uft-actions-list__item:active{ transform: scale(.99); }
.uft-actions-list__item.is-danger{ color: #dc2626; }
.uft-actions-list__item.is-danger:hover{ background: rgba(220,38,38,.08); }
.uft-actions-list__icon{
	width: 40px; height: 40px; flex-shrink: 0;
	border-radius: 11px;
	background: var(--uft-accent-soft, rgba(59,130,246,.1));
	color: var(--uft-accent, #3b82f6);
	display: inline-flex; align-items: center; justify-content: center;
}
.uft-actions-list__item.is-danger .uft-actions-list__icon{
	background: rgba(220,38,38,.1); color: #dc2626;
}
.uft-actions-list__icon svg{ width: 20px; height: 20px; }
.uft-actions-list__text{ flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.uft-actions-list__label{ font-size: .95rem; font-weight: 600; line-height: 1.2; }
.uft-actions-list__hint{ font-size: .78rem; color: var(--uft-text-muted, #64748b); }
.uft-actions-list__item.is-danger .uft-actions-list__hint{ color: rgba(220,38,38,.75); }
.uft-actions-list__chev{
	color: var(--uft-text-muted, #64748b); font-size: 1.35rem; line-height: 1;
	padding-right: .15rem;
}

.uft-table__more{
	width: 36px; height: 36px; padding: 0 !important;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 10px;
}
.uft-table__more svg{ width: 20px; height: 20px; }

/* Mobile: bottom-sheet style */
@media (max-width: 520px){
	.uft-modal__backdrop{ align-items: flex-end; padding: 0; }
	.uft-modal{
		max-width: 100%;
		border-radius: 20px 20px 0 0;
		transform: translateY(100%);
	}
	.uft-modal__backdrop.is-open .uft-modal{ transform: translateY(0); }
	.uft-modal__body{ padding-bottom: max(1rem, env(safe-area-inset-bottom)); }
}

html.dark .uft-modal,
[data-theme="dark"] .uft-modal{ background: #0f172a; color: #e5e7eb; }
html.dark .uft-modal__close:hover,
[data-theme="dark"] .uft-modal__close:hover{ background: rgba(255,255,255,.08); color: #fff; }
html.dark .uft-actions-list__item:hover,
[data-theme="dark"] .uft-actions-list__item:hover{ background: rgba(255,255,255,.06); }

/* ==========================================================================
 * Wave 1 additions — feed v2, analytics v2, reviews, prefs, wizard, cmdk, SEO
 * ======================================================================== */

/* Feed section — dismiss button on cards */
.uft-card__wrap{ position: relative; }
.uft-card__dismiss{
	position: absolute; top: 8px; right: 8px; z-index: 2;
	width: 28px; height: 28px; border: 0; border-radius: 8px;
	background: rgba(15,23,42,.06); color: var(--uft-text-muted, #64748b);
	display: inline-flex; align-items: center; justify-content: center;
	opacity: 0; cursor: pointer; transition: opacity .15s, background .15s;
}
.uft-card__wrap:hover .uft-card__dismiss,
.uft-card__dismiss:focus{ opacity: 1; }
.uft-card__dismiss:hover{ background: rgba(220,38,38,.12); color: #dc2626; }
.uft-card__dismiss svg{ width: 14px; height: 14px; }
.uft-section__sub{ margin: .15rem 0 0; color: var(--uft-text-muted, #64748b); font-size: .85rem; }

/* Nav badge */
.uft-nav a{ position: relative; }
.uft-nav__badge{
	position: absolute; right: .75rem; top: 50%; transform: translateY(-50%);
	min-width: 20px; height: 20px; padding: 0 .35rem;
	border-radius: 999px;
	background: #dc2626; color: #fff;
	font-size: .7rem; font-weight: 700; line-height: 20px; text-align: center;
}

/* Page head with actions */
.uft-page__head{ display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.uft-page__actions{ display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.uft-select--sm{ padding: .4rem .6rem; font-size: .85rem; height: 34px; border-radius: 8px; }
.uft-delta{ display: inline-flex; align-items: center; gap: .2rem; font-size: .78rem; font-weight: 600; padding: .1rem .45rem; border-radius: 999px; }
.uft-delta.is-up{ background: rgba(16,185,129,.14); color: #059669; }
.uft-delta.is-down{ background: rgba(220,38,38,.14); color: #dc2626; }
.uft-delta.is-flat{ background: rgba(100,116,139,.15); color: #475569; }

.uft-grid-2{ display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 720px){ .uft-grid-2{ grid-template-columns: 1fr; } }

/* Device bars */
.uft-devbars{ display: flex; flex-direction: column; gap: .75rem; }
.uft-devbar__label{ display: flex; justify-content: space-between; font-size: .85rem; margin-bottom: .25rem; text-transform: capitalize; }
.uft-devbar__count{ color: var(--uft-text-muted, #64748b); }
.uft-devbar__track{ height: 8px; background: rgba(15,23,42,.06); border-radius: 999px; overflow: hidden; }
.uft-devbar__fill{ height: 100%; background: linear-gradient(90deg, var(--uft-accent, #3b82f6), var(--uft-accent, #3b82f6)); border-radius: 999px; }

/* Reviews inbox */
.uft-tabs{ display: inline-flex; gap: 4px; padding: 4px; background: rgba(15,23,42,.05); border-radius: 12px; margin-bottom: 1rem; }
.uft-tabs__btn{ appearance: none; border: 0; background: transparent; padding: .5rem .95rem; border-radius: 9px; font: inherit; font-weight: 600; cursor: pointer; color: var(--uft-text-muted, #64748b); }
.uft-tabs__btn.is-active{ background: #fff; color: var(--uft-text, #0f172a); box-shadow: 0 1px 3px rgba(0,0,0,.06); }
html.dark .uft-tabs__btn.is-active,[data-theme="dark"] .uft-tabs__btn.is-active{ background: #1e293b; color: #f1f5f9; }

.uft-reviews{ display: flex; flex-direction: column; gap: 1rem; }
.uft-review{
	background: var(--uft-surface, #fff);
	border: 1px solid var(--uft-border, rgba(15,23,42,.08));
	border-radius: 14px; padding: 1rem 1.1rem;
}
.uft-review__head{ display: flex; align-items: center; gap: .75rem; margin-bottom: .5rem; }
.uft-review__avatar{ border-radius: 50%; width: 40px; height: 40px; }
.uft-review__meta{ flex: 1; min-width: 0; }
.uft-review__author{ font-weight: 700; }
.uft-review__sub{ font-size: .8rem; color: var(--uft-text-muted, #64748b); }
.uft-review__rating{ color: #f59e0b; font-weight: 600; }
.uft-review__body{ color: var(--uft-text, #0f172a); font-size: .95rem; line-height: 1.55; }
.uft-review__body p{ margin: .3rem 0; }
.uft-review__reply{ margin-top: .75rem; padding: .75rem .9rem; background: rgba(59,130,246,.06); border-radius: 10px; }
.uft-review__reply-head{ display: flex; align-items: center; gap: .35rem; font-size: .8rem; color: var(--uft-accent, #3b82f6); font-weight: 600; margin-bottom: .25rem; }
.uft-review__reply-head svg{ width: 14px; height: 14px; }
.uft-review__actions{ display: flex; gap: .5rem; margin-top: .5rem; flex-wrap: wrap; }
.uft-review__reply-form{ margin-top: .75rem; }

/* Preferences toggles */
.uft-table--prefs th, .uft-table--prefs td{ vertical-align: middle; padding: .85rem 1rem; }
.uft-switch{ position: relative; display: inline-block; width: 42px; height: 24px; cursor: pointer; }
.uft-switch input{ opacity: 0; width: 0; height: 0; }
.uft-switch__track{
	position: absolute; inset: 0; background: rgba(100,116,139,.35);
	border-radius: 999px; transition: background .15s;
}
.uft-switch__track::before{
	content: ""; position: absolute; top: 3px; left: 3px;
	width: 18px; height: 18px; background: #fff; border-radius: 50%;
	transition: transform .18s cubic-bezier(.4,.2,.2,1);
	box-shadow: 0 1px 3px rgba(0,0,0,.15);
}
.uft-switch input:checked + .uft-switch__track{ background: var(--uft-accent, #3b82f6); }
.uft-switch input:checked + .uft-switch__track::before{ transform: translateX(18px); }
.uft-switch input:focus-visible + .uft-switch__track{ outline: 2px solid var(--uft-accent, #3b82f6); outline-offset: 2px; }

/* Onboarding wizard */
.uft-wiz__intro{ margin: 0 0 1rem; color: var(--uft-text-muted, #64748b); }
.uft-wiz__dots{ display: flex; justify-content: center; gap: 6px; margin-top: 1rem; }
.uft-wiz__dot{ width: 8px; height: 8px; border-radius: 50%; background: rgba(15,23,42,.15); }
.uft-wiz__dot.is-active{ background: var(--uft-accent, #3b82f6); width: 22px; border-radius: 4px; }
.uft-chipset{ display: flex; flex-wrap: wrap; gap: .5rem; max-height: 40vh; overflow: auto; padding: .25rem; }
.uft-chip{
	appearance: none; border: 1.5px solid var(--uft-border, rgba(15,23,42,.12));
	background: transparent; color: inherit;
	padding: .45rem .85rem; border-radius: 999px; font: inherit; font-size: .85rem;
	cursor: pointer; transition: background .15s, border-color .15s, color .15s;
}
.uft-chip:hover{ border-color: var(--uft-accent, #3b82f6); }
.uft-chip.is-on{ background: var(--uft-accent, #3b82f6); color: #fff; border-color: var(--uft-accent, #3b82f6); }

/* Command palette */
.uft-cmdk{ display: flex; flex-direction: column; min-height: 320px; max-height: 60vh; }
.uft-cmdk__input{
	width: 100%; padding: .85rem 1rem; font: inherit; font-size: 1rem;
	border: 0; border-bottom: 1px solid var(--uft-border, rgba(15,23,42,.08));
	background: transparent; color: inherit; outline: none;
}
.uft-cmdk__list{ list-style: none; margin: 0; padding: .35rem; overflow-y: auto; flex: 1; }
.uft-cmdk__item{
	display: flex; align-items: center; gap: .75rem;
	padding: .6rem .75rem; border-radius: 10px; cursor: pointer;
	color: inherit;
}
.uft-cmdk__item.is-active{ background: rgba(59,130,246,.1); color: var(--uft-accent, #3b82f6); }
.uft-cmdk__icon{ display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; color: currentColor; }
.uft-cmdk__icon svg{ width: 16px; height: 16px; }
.uft-cmdk__empty{ padding: 2rem 1rem; text-align: center; color: var(--uft-text-muted, #64748b); }

/* SEO helper */
.uft-editor__grid{ display: grid; grid-template-columns: 1fr 380px; gap: 1rem; }
@media (max-width: 1080px){ .uft-editor__grid{ grid-template-columns: 1fr; } }
.uft-editor__side{ position: sticky; top: 90px; align-self: flex-start; }
.uft-seo{
	background: var(--uft-surface, #fff);
	border: 1px solid var(--uft-border, rgba(15,23,42,.08));
	border-radius: 14px; padding: 1rem;
}
.uft-seo__h{ margin: 0 0 .75rem; font-size: 1rem; font-weight: 700; }
.uft-seo__previews{ display: flex; flex-direction: column; gap: .75rem; margin-bottom: .75rem; }
.uft-seo__snip{ border: 1px solid var(--uft-border, rgba(15,23,42,.08)); border-radius: 10px; padding: .75rem; background: #fff; color: #0f172a; }
.uft-seo__site{ font-size: .78rem; color: #5f6368; margin-bottom: .1rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.uft-seo__title{ color: #1a0dab; font-size: 1.05rem; line-height: 1.3; font-weight: 500; margin-bottom: .15rem; }
.uft-seo__desc{ color: #4d5156; font-size: .82rem; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.uft-seo__snip--social{ padding: 0; overflow: hidden; }
.uft-seo__img{ height: 140px; background: #e5e7eb center / cover no-repeat; }
.uft-seo__img--ph{ display: flex; align-items: center; justify-content: center; color: #64748b; font-size: .8rem; }
.uft-seo__card{ padding: .65rem .8rem; background: #f8fafc; border-top: 1px solid rgba(15,23,42,.06); }
.uft-seo__meters{ display: flex; flex-direction: column; gap: .5rem; margin-bottom: .5rem; }
.uft-seo__meter-head{ display: flex; justify-content: space-between; font-size: .78rem; margin-bottom: .2rem; }
.uft-seo__meter-track{ height: 6px; border-radius: 999px; background: rgba(15,23,42,.06); overflow: hidden; }
.uft-seo__meter-fill{ height: 100%; border-radius: 999px; transition: width .2s; }
.uft-seo__meter.is-ok .uft-seo__meter-fill{ background: #10b981; }
.uft-seo__meter.is-warn .uft-seo__meter-fill{ background: #f59e0b; }
.uft-seo__meter.is-danger .uft-seo__meter-fill{ background: #dc2626; }
.uft-seo__meter-hint{ font-size: .7rem; color: var(--uft-text-muted, #64748b); margin-top: .2rem; }
.uft-seo__kw{ font-size: .8rem; margin: .5rem 0 .25rem; color: var(--uft-text-muted, #64748b); }
.uft-seo__checks{ list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .25rem; font-size: .82rem; }
.uft-seo__checks li{ display: flex; align-items: center; gap: .5rem; }
.uft-seo__check-mark{ display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; border-radius: 50%; font-size: .7rem; font-weight: 700; }
.uft-seo__checks li.is-ok .uft-seo__check-mark{ background: rgba(16,185,129,.15); color: #059669; }
.uft-seo__checks li.is-warn .uft-seo__check-mark{ background: rgba(245,158,11,.15); color: #d97706; }

html.dark .uft-seo__snip,[data-theme="dark"] .uft-seo__snip{ background: #1e293b; color: #e2e8f0; border-color: rgba(255,255,255,.08); }
html.dark .uft-seo__title,[data-theme="dark"] .uft-seo__title{ color: #93c5fd; }
html.dark .uft-seo__desc,[data-theme="dark"] .uft-seo__desc{ color: #cbd5e1; }
html.dark .uft-seo__site,[data-theme="dark"] .uft-seo__site{ color: #94a3b8; }
html.dark .uft-seo__card,[data-theme="dark"] .uft-seo__card{ background: #0f172a; border-color: rgba(255,255,255,.06); }
html.dark .uft-review,[data-theme="dark"] .uft-review{ background: #0f172a; border-color: rgba(255,255,255,.08); }
html.dark .uft-tabs,[data-theme="dark"] .uft-tabs{ background: rgba(255,255,255,.05); }

/* ============================================================ */
/* Wave 2 additions */
/* ============================================================ */

/* Bulk actions bar */
.uft-bulkbar{ display:flex; gap:.5rem; align-items:center; padding:.75rem 1rem; background:rgba(59,130,246,.08); border-bottom:1px solid var(--uft-border,rgba(15,23,42,.08)); flex-wrap:wrap; font-size:.85rem; }
.uft-bulkbar[hidden]{ display:none; }
.uft-table--bulk tr.is-selected{ background:rgba(59,130,246,.06); }
.uft-table__cbx{ width:16px; height:16px; cursor:pointer; }

/* Saved searches */
.uft-savedlist{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:.5rem; }
.uft-savedlist__item{ display:flex; align-items:center; gap:.75rem; background:var(--uft-surface,#fff); border:1px solid var(--uft-border,rgba(15,23,42,.08)); border-radius:.75rem; padding:.75rem 1rem; }
.uft-savedlist__link{ display:flex; align-items:center; justify-content:space-between; flex:1; gap:.75rem; text-decoration:none; color:inherit; }
.uft-savedlist__meta{ font-size:.8rem; color:var(--uft-text-muted,#64748b); margin-top:.15rem; }
.uft-savedlist__badge{ background:#3b82f6; color:#fff; font-size:.75rem; font-weight:700; border-radius:999px; padding:.15rem .6rem; }

/* Publisher public profile */
/* ============ Publisher Profile — v2 ============ */
.uft-pubprofile{ position:relative; max-width:1120px; margin:0 auto 4rem; padding:0 1rem; }
.uft-pubprofile__hero{ position:absolute; inset:0 0 auto 0; height:340px; overflow:hidden; z-index:0; border-bottom-left-radius:2rem; border-bottom-right-radius:2rem;
	background: radial-gradient(1200px 400px at 20% -10%, #7c5cfc 0%, transparent 60%),
		radial-gradient(900px 400px at 90% 0%, #10e0a0 0%, transparent 55%),
		linear-gradient(135deg,#0b0b14 0%,#1b1b2e 55%,#241a5c 100%);
}
.uft-pubprofile__hero-blob{ position:absolute; border-radius:50%; filter:blur(80px); opacity:.55; }
.uft-pubprofile__hero-blob--a{ width:420px; height:420px; background:#7c5cfc; top:-120px; left:10%; }
.uft-pubprofile__hero-blob--b{ width:360px; height:360px; background:#10e0a0; top:-80px; right:8%; opacity:.35; }
.uft-pubprofile__hero-grid{ position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px); background-size:40px 40px; mask-image:linear-gradient(180deg,rgba(0,0,0,.6),transparent 80%); }
.uft-pubprofile__wrap{ position:relative; z-index:1; padding-top:120px; display:flex; flex-direction:column; gap:1.5rem; }

.uft-pubprofile__card-head{
	position:relative;
	display:grid; grid-template-columns:auto 1fr auto; gap:1.75rem; align-items:center;
	padding:1.75rem; border-radius:1.5rem;
	background:rgba(255,255,255,.85); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
	border:1px solid rgba(255,255,255,.7);
	box-shadow:0 30px 80px -30px rgba(11,11,20,.35), 0 1px 0 rgba(255,255,255,.9) inset;
}
.uft-pubprofile__avatar-ring{ position:relative; width:148px; height:148px; border-radius:50%; padding:4px; background:linear-gradient(135deg,#7c5cfc,#10e0a0); box-shadow:0 20px 40px -15px rgba(124,92,252,.5); }
.uft-pubprofile__avatar{ display:block; width:100%; height:100%; border-radius:50%; object-fit:cover; background:#fff; border:4px solid #fff; }
.uft-pubprofile__avatar-fallback{ display:none; }

.uft-pubprofile__meta{ min-width:0; }
.uft-pubprofile__name{ margin:0 0 .35rem; font-size:2rem; font-weight:800; letter-spacing:-.02em; color:#0b0b14; display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; line-height:1.1; }
.uft-pubprofile__verified{ display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:50%; background:linear-gradient(135deg,#10e0a0,#0bb884); color:#fff; box-shadow:0 6px 16px -4px rgba(16,224,160,.55); }
.uft-pubprofile__tagline{ font-size:1.05rem; color:#4a4a6a; margin:.15rem 0 .5rem; font-weight:500; }
.uft-pubprofile__bio{ color:#5b5b74; margin:.5rem 0 .75rem; max-width:56ch; line-height:1.55; }
.uft-pubprofile__links{ list-style:none; padding:0; margin:.75rem 0 0; display:flex; gap:.5rem; flex-wrap:wrap; }
.uft-pubprofile__link{ display:inline-flex; align-items:center; gap:.4rem; padding:.4rem .75rem; border-radius:999px; background:#f4f3ff; color:#5b34d6; font-size:.82rem; font-weight:600; text-decoration:none; border:1px solid rgba(124,92,252,.15); transition:all .18s ease; }
.uft-pubprofile__link:hover{ background:#7c5cfc; color:#fff; border-color:#7c5cfc; transform:translateY(-1px); box-shadow:0 8px 20px -8px rgba(124,92,252,.6); }

.uft-pubprofile__statsgrid{ display:flex; gap:.5rem; flex-direction:column; align-items:stretch; }
.uft-pubprofile__stat{ display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:110px; padding:.75rem 1rem; border-radius:1rem; background:linear-gradient(135deg,#faf8ff,#f0ebff); border:1px solid rgba(124,92,252,.12); }
.uft-pubprofile__stat-num{ font-size:1.25rem; font-weight:800; color:#241a5c; letter-spacing:-.02em; line-height:1.1; }
.uft-pubprofile__stat-lbl{ font-size:.7rem; text-transform:uppercase; letter-spacing:.1em; color:#8b8ba8; margin-top:.15rem; font-weight:600; }

.uft-pubprofile__tags{ display:flex; flex-wrap:wrap; gap:.4rem; padding:0 .25rem; }
.uft-pubprofile__tag{ font-size:.75rem; padding:.3rem .7rem; border-radius:999px; background:rgba(255,255,255,.75); backdrop-filter:blur(10px); border:1px solid rgba(11,11,20,.06); color:#4a4a6a; font-weight:600; }

.uft-pubprofile__tools{ background:#fff; border-radius:1.5rem; padding:1.75rem; border:1px solid rgba(11,11,20,.05); box-shadow:0 20px 60px -30px rgba(11,11,20,.15); }
.uft-pubprofile__tools-head{ display:flex; align-items:baseline; justify-content:space-between; gap:1rem; margin-bottom:1.25rem; }
.uft-pubprofile__tools-head h2{ margin:0; font-size:1.35rem; font-weight:800; letter-spacing:-.01em; color:#0b0b14; }
.uft-pubprofile__count{ font-size:.8rem; color:#8b8ba8; font-weight:600; padding:.25rem .6rem; background:#f4f3ff; border-radius:999px; }

.uft-pubprofile__grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:.75rem; }
.uft-pubprofile__card{ position:relative; display:grid; grid-template-columns:auto 1fr auto; gap:.85rem; align-items:center; padding:.9rem; border:1px solid rgba(11,11,20,.07); border-radius:1rem; text-decoration:none; color:inherit; background:#fff; transition:all .2s ease; overflow:hidden; }
.uft-pubprofile__card::before{ content:""; position:absolute; inset:0; background:linear-gradient(135deg,rgba(124,92,252,.06),rgba(16,224,160,.05)); opacity:0; transition:opacity .2s ease; pointer-events:none; }
.uft-pubprofile__card:hover{ border-color:rgba(124,92,252,.3); transform:translateY(-3px); box-shadow:0 20px 40px -20px rgba(124,92,252,.25); }
.uft-pubprofile__card:hover::before{ opacity:1; }
.uft-pubprofile__card--t0{ --acc:#7c5cfc; }
.uft-pubprofile__card--t1{ --acc:#10e0a0; }
.uft-pubprofile__card--t2{ --acc:#f59e0b; }
.uft-pubprofile__card--t3{ --acc:#ef4444; }
.uft-pubprofile__card-logo{ position:relative; width:52px; height:52px; border-radius:.75rem; background:linear-gradient(135deg, color-mix(in oklab, var(--acc,#7c5cfc) 15%, #fff), color-mix(in oklab, var(--acc,#7c5cfc) 5%, #fff)); display:flex; align-items:center; justify-content:center; flex-shrink:0; border:1px solid color-mix(in oklab, var(--acc,#7c5cfc) 15%, transparent); }
.uft-pubprofile__card-logo img{ width:100%; height:100%; border-radius:.6rem; object-fit:cover; }
.uft-pubprofile__card-logo span{ font-weight:800; color:var(--acc,#7c5cfc); font-size:1.25rem; }
.uft-pubprofile__card-body{ min-width:0; display:flex; flex-direction:column; gap:.15rem; }
.uft-pubprofile__card-title{ font-size:.95rem; font-weight:700; color:#0b0b14; letter-spacing:-.01em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.uft-pubprofile__card-desc{ font-size:.8rem; color:#6b6b85; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.uft-pubprofile__card-cat{ margin-top:.35rem; font-size:.68rem; text-transform:uppercase; letter-spacing:.08em; font-weight:700; color:var(--acc,#7c5cfc); }
.uft-pubprofile__card-arrow{ display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; background:#f4f3ff; color:#5b34d6; opacity:0; transform:translateX(-4px); transition:all .2s ease; flex-shrink:0; position:relative; z-index:1; }
.uft-pubprofile__card:hover .uft-pubprofile__card-arrow{ opacity:1; transform:translateX(0); }

.uft-pubprofile__empty{ text-align:center; padding:3rem 1rem; color:#6b6b85; }
.uft-pubprofile__empty-icon{ font-size:3rem; margin-bottom:.5rem; }
.uft-pubprofile__empty p{ margin:.25rem 0; color:#0b0b14; }
.uft-pubprofile__empty span{ font-size:.9rem; }

.uft-pubprofile__urlpreview{ font-family:ui-monospace,monospace; font-size:.78rem; color:var(--uft-text-muted,#64748b); word-break:break-all; }

/* Responsive */
@media (max-width:820px){
	.uft-pubprofile__hero{ height:260px; }
	.uft-pubprofile__wrap{ padding-top:90px; gap:1rem; }
	.uft-pubprofile__card-head{ grid-template-columns:1fr; text-align:center; padding:1.5rem 1.25rem; gap:1.25rem; }
	.uft-pubprofile__avatar-ring{ margin:0 auto; width:120px; height:120px; }
	.uft-pubprofile__name{ font-size:1.6rem; justify-content:center; }
	.uft-pubprofile__bio{ margin-left:auto; margin-right:auto; }
	.uft-pubprofile__links{ justify-content:center; }
	.uft-pubprofile__statsgrid{ flex-direction:row; justify-content:center; }
	.uft-pubprofile__stat{ flex:1; min-width:0; }
	.uft-pubprofile__tools{ padding:1.25rem; }
}
@media (max-width:480px){
	.uft-pubprofile__grid{ grid-template-columns:1fr; }
}

/* Dark theme support */
.dark .uft-pubprofile__card-head,
[data-theme="dark"] .uft-pubprofile__card-head{ background:rgba(27,27,46,.85); border-color:rgba(255,255,255,.08); }
.dark .uft-pubprofile__name,
[data-theme="dark"] .uft-pubprofile__name{ color:#fff; }
.dark .uft-pubprofile__tagline{ color:#c7c7d9; }
.dark .uft-pubprofile__bio{ color:#a0a0b8; }
.dark .uft-pubprofile__tools{ background:#12121f; border-color:rgba(255,255,255,.06); }
.dark .uft-pubprofile__tools-head h2{ color:#fff; }
.dark .uft-pubprofile__card{ background:#1b1b2e; border-color:rgba(255,255,255,.06); }
.dark .uft-pubprofile__card-title{ color:#fff; }
.dark .uft-pubprofile__stat{ background:linear-gradient(135deg,#1b1b2e,#241a5c); border-color:rgba(124,92,252,.25); }
.dark .uft-pubprofile__stat-num{ color:#fff; }

/* Version history */
.uft-versions{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:.5rem; }
.uft-versions__item{ display:flex; justify-content:space-between; align-items:center; padding:.75rem 1rem; border:1px solid var(--uft-border,rgba(15,23,42,.08)); background:var(--uft-surface,#fff); border-radius:.5rem; gap:1rem; }
.uft-versions__meta{ display:flex; flex-direction:column; gap:.15rem; font-size:.85rem; color:var(--uft-text-muted,#64748b); }
.uft-versions__meta strong{ color:var(--uft-text,#0f172a); font-size:.95rem; }
.uft-versions__badge{ font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; background:#10b981; color:#fff; padding:.15rem .5rem; border-radius:.25rem; }

/* Editor sidebar actions & health report */
.uft-editor__aside-actions{ background:var(--uft-surface,#fff); border:1px solid var(--uft-border,rgba(15,23,42,.08)); border-radius:.75rem; padding:1rem; margin-bottom:1rem; }
.uft-editor__aside-h{ margin:0 0 .5rem; font-size:.9rem; }
.uft-editor__aside-btns{ display:flex; flex-direction:column; gap:.4rem; }
.uft-editor__aside-btns .uft-btn{ justify-content:flex-start; }
.uft-health{ margin-top:.75rem; padding:.75rem; background:rgba(15,23,42,.03); border-radius:.5rem; font-size:.85rem; }
.uft-health__head{ font-size:.75rem; text-transform:uppercase; letter-spacing:.05em; color:var(--uft-text-muted,#64748b); margin-bottom:.5rem; }
.uft-health__row{ padding:.4rem 0; border-top:1px solid rgba(15,23,42,.08); display:grid; grid-template-columns:110px 1fr; gap:.5rem; }
.uft-health__row:first-of-type{ border-top:none; }
.uft-health__label{ font-weight:600; }
.uft-health__val{ font-family:ui-monospace,monospace; font-size:.78rem; }
.uft-health__note{ grid-column:1/-1; font-size:.75rem; color:var(--uft-text-muted,#64748b); font-style:italic; }
.uft-health__row.is-up .uft-health__val{ color:#059669; }
.uft-health__row.is-down .uft-health__val{ color:#dc2626; }
.uft-health__row.is-flat .uft-health__val{ color:var(--uft-text-muted,#94a3b8); }

/* API tokens */
.uft-token__box{ background:#0f172a; color:#e2e8f0; padding:.75rem 1rem; border-radius:.5rem; overflow-x:auto; }
.uft-token__value{ font-family:ui-monospace,monospace; word-break:break-all; font-size:.85rem; }

/* Shortcuts help */
.uft-shortcuts{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:.5rem; }
.uft-shortcuts li{ display:flex; justify-content:space-between; align-items:center; padding:.5rem .75rem; border-radius:.35rem; background:rgba(15,23,42,.03); }
.uft-shortcuts kbd{ font-family:ui-monospace,monospace; font-size:.8rem; background:#fff; border:1px solid var(--uft-border,rgba(15,23,42,.15)); border-radius:.3rem; padding:.15rem .5rem; box-shadow:0 1px 0 rgba(15,23,42,.08); }

html.dark .uft-savedlist__item,[data-theme="dark"] .uft-savedlist__item,
html.dark .uft-versions__item,[data-theme="dark"] .uft-versions__item,
html.dark .uft-editor__aside-actions,[data-theme="dark"] .uft-editor__aside-actions{ background:#0f172a; border-color:rgba(255,255,255,.08); }
html.dark .uft-health,[data-theme="dark"] .uft-health{ background:rgba(255,255,255,.03); }
html.dark .uft-shortcuts li,[data-theme="dark"] .uft-shortcuts li{ background:rgba(255,255,255,.05); }
html.dark .uft-shortcuts kbd,[data-theme="dark"] .uft-shortcuts kbd{ background:#1e293b; color:#e2e8f0; }

/* Sign-out button — keep compact and self-sized in every context */
.uft-app .uft-btn--danger,
.uft-app a.uft-btn--danger {
	max-width: max-content;
	padding: .5rem .9rem;
	font-size: .85rem;
	line-height: 1.2;
	border-radius: 10px;
}
.uft-sidebar__footer .uft-btn {
	padding: .5rem .75rem;
	font-size: .8rem;
	border-radius: 10px;
}