@kywi-software/core 0.1.0

package/dist/admin/styles/admin.css

@@ -0,0 +1,2778 @@
+/* ==========================================================================
+   Kywi Admin — Design System Stylesheet
+   --------------------------------------------------------------------------
+   "Editorial Evergreen": a crisp, confident CMS surface built on warm-neutral
+   paper, near-black ink, and a single deep evergreen signature that ties back
+   to the Kywi (kiwi) name. Not enterprise gray soup — Linear/Sanity-tier
+   restraint with a distinctive, on-brand accent.
+
+   Architecture
+   ------------
+   1. Tokens          — semantic CSS custom properties (color/space/type/etc.)
+   2. Editor bridge   — remaps the pre-existing layout-editor / inline-editor
+                        accent onto the shared palette (continuity, cheap).
+   3. Base + reset    — scoped to `.kywi-admin-shell`.
+   4. Shell           — sidebar / nav / topbar / main / page header.
+   5. Primitives      — buttons, inputs, fields, badges, tables, tabs, …
+   6. Components       — toolbars, bulk bars, trees, cards, diffs, pickers,
+                        form builder, and the long-tail admin surfaces.
+   7. Utilities       — skeletons, spinners, muted text, code.
+
+   Tokens are structured so a dark theme is a re-map (see [data-theme="dark"]
+   at the end), not a rewrite. Light theme is primary.
+   ========================================================================== */
+
+/* ==========================================================================
+   1. TOKENS
+   ========================================================================== */
+:root {
+  /* ---- Type ------------------------------------------------------------- */
+  --kywi-font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
+    "Helvetica Neue", Arial, sans-serif;
+  --kywi-font-mono: ui-monospace, "SF Mono", "JetBrains Mono", "Fira Code",
+    Menlo, Consolas, "Liberation Mono", monospace;
+
+  --kywi-text-xs: 11.5px;
+  --kywi-text-sm: 12.5px;
+  --kywi-text-base: 13.5px;
+  --kywi-text-md: 15px;
+  --kywi-text-lg: 18px;
+  --kywi-text-xl: 22px;
+  --kywi-text-2xl: 28px;
+
+  --kywi-leading-tight: 1.2;
+  --kywi-leading-snug: 1.35;
+  --kywi-leading: 1.55;
+
+  --kywi-weight-normal: 400;
+  --kywi-weight-medium: 500;
+  --kywi-weight-semibold: 600;
+  --kywi-weight-bold: 700;
+
+  --kywi-tracking-tight: -0.014em;
+  --kywi-tracking-wide: 0.02em;
+  --kywi-tracking-caps: 0.06em;
+
+  /* ---- Space (4px base) ------------------------------------------------- */
+  --kywi-space-1: 4px;
+  --kywi-space-2: 8px;
+  --kywi-space-3: 12px;
+  --kywi-space-4: 16px;
+  --kywi-space-5: 20px;
+  --kywi-space-6: 24px;
+  --kywi-space-8: 32px;
+  --kywi-space-10: 40px;
+  --kywi-space-12: 48px;
+  --kywi-space-16: 64px;
+
+  /* ---- Radii ------------------------------------------------------------ */
+  --kywi-radius-sm: 5px;
+  --kywi-radius: 7px;
+  --kywi-radius-md: 9px;
+  --kywi-radius-lg: 12px;
+  --kywi-radius-xl: 16px;
+  --kywi-radius-pill: 999px;
+
+  /* ---- Motion ----------------------------------------------------------- */
+  --kywi-ease: cubic-bezier(0.2, 0, 0, 1);
+  --kywi-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
+  --kywi-dur-fast: 90ms;
+  --kywi-dur: 140ms;
+  --kywi-dur-slow: 240ms;
+
+  /* ---- Z-index ---------------------------------------------------------- */
+  --kywi-z-sticky: 20;
+  --kywi-z-bulkbar: 40;
+  --kywi-z-dropdown: 800;
+  --kywi-z-overlay: 1000;
+  --kywi-z-modal: 1010;
+  --kywi-z-toast: 1100;
+
+  /* ---- Raw evergreen ramp (brand / interactive) ------------------------- */
+  --kywi-green-50: #e9f5ef;
+  --kywi-green-100: #d0eadd;
+  --kywi-green-200: #a6d6c2;
+  --kywi-green-300: #6fbb9d;
+  --kywi-green-400: #33997a;
+  --kywi-green-500: #12805f;
+  --kywi-green-600: #0d6b4f;
+  --kywi-green-700: #0a5741;
+  --kywi-green-800: #084433;
+  --kywi-green-900: #06342780;
+
+  /* ---- Semantic: surfaces & ink (light) --------------------------------- */
+  --kywi-bg: #f6f5f1;            /* app canvas — warm paper */
+  --kywi-surface: #ffffff;       /* cards, tables, panels */
+  --kywi-surface-2: #fbfaf7;     /* subtle raised / striped */
+  --kywi-surface-sunken: #f1efe9;/* wells, inputs-on-white insets */
+  --kywi-surface-hover: #f4f2ec; /* row / item hover */
+
+  --kywi-text: #1c1b18;          /* primary ink (warm near-black) */
+  --kywi-text-muted: #67625a;    /* secondary — AA on surface */
+  --kywi-text-subtle: #8f897d;   /* placeholders, meta */
+  --kywi-text-on-accent: #ffffff;
+
+  --kywi-border: #e6e2da;        /* hairline */
+  --kywi-border-strong: #d5d0c6; /* input borders, dividers */
+  --kywi-border-input: #cdc7bb;
+  --kywi-scroll-shadow: rgba(28, 27, 24, 0.22); /* horizontal-scroll edge cue */
+
+  /* ---- Semantic: accent ------------------------------------------------- */
+  --kywi-accent: var(--kywi-green-500);
+  --kywi-accent-solid: var(--kywi-green-600);
+  --kywi-accent-hover: var(--kywi-green-700);
+  --kywi-accent-active: var(--kywi-green-800);
+  --kywi-accent-fg: #ffffff;
+  --kywi-accent-tint: var(--kywi-green-50);
+  --kywi-accent-tint-strong: var(--kywi-green-100);
+  --kywi-accent-tint-fg: var(--kywi-green-700);
+  --kywi-accent-border: var(--kywi-green-200);
+
+  /* ---- Semantic: status families (chip fg / bg / border) ---------------- */
+  --kywi-success-fg: #0a5741;
+  --kywi-success-bg: #e5f4ec;
+  --kywi-success-border: #b7e0cc;
+  --kywi-success-solid: #0d6b4f;
+
+  --kywi-warning-fg: #875206;
+  --kywi-warning-bg: #fbf1d6;
+  --kywi-warning-border: #efd89f;
+  --kywi-warning-solid: #b4770a;
+
+  --kywi-danger-fg: #a12a1e;
+  --kywi-danger-bg: #fbe9e6;
+  --kywi-danger-border: #f2c6bf;
+  --kywi-danger-solid: #b23a2e;
+  --kywi-danger-solid-hover: #992f25;
+  --kywi-danger-solid-active: #83271e;
+
+  --kywi-info-fg: #1e5a75;
+  --kywi-info-bg: #e4f0f5;
+  --kywi-info-border: #b6d8e4;
+  --kywi-info-solid: #1f6f8f;
+
+  --kywi-neutral-fg: #5c574e;
+  --kywi-neutral-bg: #eeebe4;
+  --kywi-neutral-border: #ddd8cf;
+
+  /* ---- Focus ring ------------------------------------------------------- */
+  --kywi-ring-color: rgba(18, 128, 95, 0.35);
+  --kywi-ring: 0 0 0 3px var(--kywi-ring-color);
+  --kywi-ring-danger: 0 0 0 3px rgba(178, 58, 46, 0.3);
+
+  /* ---- Shadows (soft, warm-tinted) -------------------------------------- */
+  --kywi-shadow-xs: 0 1px 1px rgba(28, 27, 24, 0.04);
+  --kywi-shadow-sm: 0 1px 2px rgba(28, 27, 24, 0.06), 0 1px 1px rgba(28, 27, 24, 0.04);
+  --kywi-shadow-md: 0 4px 14px -4px rgba(28, 27, 24, 0.12), 0 2px 5px -3px rgba(28, 27, 24, 0.08);
+  --kywi-shadow-lg: 0 18px 44px -12px rgba(24, 33, 28, 0.24), 0 6px 16px -8px rgba(28, 27, 24, 0.12);
+  --kywi-shadow-inset: inset 0 1px 2px rgba(28, 27, 24, 0.05);
+
+  /* ---- Sidebar (deep evergreen-charcoal) -------------------------------- */
+  --kywi-sidebar-bg: #16211c;
+  --kywi-sidebar-bg-2: #1c2a24;
+  --kywi-sidebar-border: #263832;
+  --kywi-sidebar-fg: #e8ede9;
+  --kywi-sidebar-fg-muted: #93a39b;
+  --kywi-sidebar-hover-bg: #21322b;
+  --kywi-sidebar-active-bg: #234d3d;
+  --kywi-sidebar-active-fg: #ffffff;
+  --kywi-sidebar-accent: #57c99c;
+}
+
+/* ==========================================================================
+   2. EDITOR BRIDGE — retheme existing styled areas via shared tokens.
+   Only accent/status vars are remapped; the editors' dark panels and layout
+   mechanics are untouched.
+   ========================================================================== */
+:root {
+  --kywi-editor-accent: var(--kywi-green-500);
+  --kywi-editor-accent-light: rgba(18, 128, 95, 0.14);
+  --kywi-editor-success: var(--kywi-green-400);
+  --kywi-editor-selected-border: var(--kywi-green-400);
+  --kywi-editor-drop-line: var(--kywi-green-500);
+  --kywi-editor-placeholder-bg: rgba(18, 128, 95, 0.1);
+  --kywi-editor-region-border: rgba(18, 128, 95, 0.32);
+}
+
+/* ==========================================================================
+   3. BASE + RESET (scoped to admin)
+   ========================================================================== */
+.kywi-admin-shell,
+.kywi-admin-shell *,
+.kywi-admin-shell *::before,
+.kywi-admin-shell *::after {
+  box-sizing: border-box;
+}
+
+.kywi-admin-shell {
+  display: flex;
+  min-height: 100vh;
+  margin: 0;
+  background: var(--kywi-bg);
+  color: var(--kywi-text);
+  font-family: var(--kywi-font-sans);
+  font-size: var(--kywi-text-base);
+  line-height: var(--kywi-leading);
+  font-feature-settings: "cv05" 1, "ss01" 1;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  text-rendering: optimizeLegibility;
+}
+
+.kywi-admin-shell h1,
+.kywi-admin-shell h2,
+.kywi-admin-shell h3,
+.kywi-admin-shell h4 {
+  margin: 0;
+  color: var(--kywi-text);
+  font-weight: var(--kywi-weight-semibold);
+  letter-spacing: var(--kywi-tracking-tight);
+  line-height: var(--kywi-leading-tight);
+}
+.kywi-admin-shell h1 { font-size: var(--kywi-text-xl); }
+.kywi-admin-shell h2 { font-size: var(--kywi-text-lg); }
+.kywi-admin-shell h3 { font-size: var(--kywi-text-md); }
+
+.kywi-admin-shell a {
+  color: var(--kywi-accent-hover);
+  text-decoration: none;
+}
+.kywi-admin-shell a:hover { text-decoration: underline; }
+
+.kywi-admin-shell :focus-visible {
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+  box-shadow: var(--kywi-ring);
+  border-radius: var(--kywi-radius-sm);
+}
+
+.kywi-admin-shell ::selection {
+  background: var(--kywi-accent-tint-strong);
+  color: var(--kywi-accent-hover);
+}
+
+/* thin, quiet scrollbars inside the admin */
+.kywi-admin-shell ::-webkit-scrollbar { width: 11px; height: 11px; }
+.kywi-admin-shell ::-webkit-scrollbar-thumb {
+  background: rgba(28, 27, 24, 0.18);
+  border: 3px solid transparent;
+  border-radius: var(--kywi-radius-pill);
+  background-clip: content-box;
+}
+.kywi-admin-shell ::-webkit-scrollbar-thumb:hover { background: rgba(28, 27, 24, 0.3); background-clip: content-box; }
+
+/* ==========================================================================
+   4. SHELL
+   ========================================================================== */
+
+/* ---- Sidebar ---------------------------------------------------------- */
+.kywi-admin-sidebar {
+  width: 248px;
+  flex-shrink: 0;
+  align-self: stretch;
+  /* Solid fill so the column stays dark for the full page height; the inner
+     rail carries the subtle top gradient and does the pinning/scrolling. */
+  background: var(--kywi-sidebar-bg);
+  color: var(--kywi-sidebar-fg);
+  border-right: 1px solid var(--kywi-sidebar-border);
+}
+.kywi-admin-sidebar-sticky {
+  position: sticky;
+  top: 0;
+  height: 100vh;
+  overflow-y: auto;
+  background:
+    linear-gradient(180deg, var(--kywi-sidebar-bg-2) 0%, var(--kywi-sidebar-bg) 220px);
+  padding: var(--kywi-space-4) 0 var(--kywi-space-8);
+}
+.kywi-admin-sidebar-sticky::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.16); background-clip: content-box; }
+
+.kywi-admin-logo {
+  padding: var(--kywi-space-2) var(--kywi-space-5) var(--kywi-space-5);
+  margin-bottom: var(--kywi-space-2);
+}
+.kywi-admin-logo a {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--kywi-space-2);
+  color: #fff;
+  font-size: var(--kywi-text-md);
+  font-weight: var(--kywi-weight-bold);
+  letter-spacing: var(--kywi-tracking-tight);
+  text-decoration: none;
+}
+.kywi-admin-logo a::before {
+  content: "";
+  width: 10px;
+  height: 10px;
+  border-radius: var(--kywi-radius-pill);
+  background: var(--kywi-sidebar-accent);
+  box-shadow: 0 0 0 3px rgba(87, 201, 156, 0.22);
+  flex-shrink: 0;
+}
+
+.kywi-admin-nav ul { list-style: none; margin: 0; padding: 0; }
+.kywi-admin-nav > ul { padding: 0 var(--kywi-space-3); }
+
+.kywi-nav-item { margin: 1px 0; }
+
+.kywi-admin-sidebar .kywi-nav-link {
+  position: relative;
+  display: block;
+  padding: 7px var(--kywi-space-3);
+  color: var(--kywi-sidebar-fg-muted);
+  font-size: var(--kywi-text-sm);
+  font-weight: var(--kywi-weight-medium);
+  text-decoration: none;
+  border-radius: var(--kywi-radius);
+  transition: background var(--kywi-dur) var(--kywi-ease),
+    color var(--kywi-dur) var(--kywi-ease);
+}
+.kywi-admin-sidebar .kywi-nav-link:hover {
+  background: var(--kywi-sidebar-hover-bg);
+  color: var(--kywi-sidebar-fg);
+  text-decoration: none;
+}
+.kywi-admin-sidebar .kywi-nav-active {
+  background: var(--kywi-sidebar-active-bg);
+  color: var(--kywi-sidebar-active-fg) !important;
+  font-weight: var(--kywi-weight-semibold);
+}
+.kywi-admin-sidebar .kywi-nav-active::before {
+  content: "";
+  position: absolute;
+  left: -3px;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 3px;
+  height: 16px;
+  border-radius: var(--kywi-radius-pill);
+  background: var(--kywi-sidebar-accent);
+}
+.kywi-admin-sidebar .kywi-nav-children { margin: 1px 0 var(--kywi-space-1); }
+.kywi-admin-sidebar .kywi-nav-children .kywi-nav-link { font-size: var(--kywi-text-xs); padding-top: 5px; padding-bottom: 5px; }
+.kywi-admin-sidebar :focus-visible { box-shadow: 0 0 0 2px var(--kywi-sidebar-accent); }
+
+/* ---- Main + topbar ---------------------------------------------------- */
+.kywi-admin-main {
+  flex: 1;
+  min-width: 0;
+  padding: var(--kywi-space-6) var(--kywi-space-8) var(--kywi-space-12);
+  background: var(--kywi-bg);
+}
+
+.kywi-admin-topbar {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  gap: var(--kywi-space-3);
+  padding-bottom: var(--kywi-space-5);
+  margin-bottom: var(--kywi-space-5);
+  border-bottom: 1px solid var(--kywi-border);
+  font-size: var(--kywi-text-sm);
+  color: var(--kywi-text-muted);
+}
+.kywi-admin-topbar > span {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--kywi-space-2);
+  padding: 3px 10px 3px 8px;
+  background: var(--kywi-accent-tint);
+  color: var(--kywi-accent-tint-fg);
+  border: 1px solid var(--kywi-accent-border);
+  border-radius: var(--kywi-radius-pill);
+  font-size: var(--kywi-text-xs);
+  font-weight: var(--kywi-weight-semibold);
+  letter-spacing: var(--kywi-tracking-wide);
+  text-transform: capitalize;
+}
+.kywi-admin-topbar > span::before {
+  content: "";
+  width: 6px;
+  height: 6px;
+  border-radius: var(--kywi-radius-pill);
+  background: var(--kywi-accent);
+}
+.kywi-admin-topbar button {
+  background: var(--kywi-surface);
+  border: 1px solid var(--kywi-border-strong);
+  padding: 5px 12px;
+  border-radius: var(--kywi-radius);
+  cursor: pointer;
+  font-size: var(--kywi-text-sm);
+  font-weight: var(--kywi-weight-medium);
+  color: var(--kywi-text-muted);
+  transition: background var(--kywi-dur) var(--kywi-ease),
+    border-color var(--kywi-dur) var(--kywi-ease), color var(--kywi-dur) var(--kywi-ease);
+}
+.kywi-admin-topbar button:hover {
+  background: var(--kywi-surface-hover);
+  border-color: var(--kywi-border-input);
+  color: var(--kywi-text);
+}
+
+/* ---- Mobile shell chrome — hidden on desktop, shown by the responsive block
+   at the end of this file (<1024px). Declared here so they never appear on
+   wide screens even before the media query is reached. */
+.kywi-admin-shell .kywi-admin-mobile-bar,
+.kywi-admin-shell .kywi-admin-hamburger,
+.kywi-admin-shell .kywi-admin-scrim { display: none; }
+
+/* ---- Login (standalone card page; reuses shell tokens + focus rings) --- */
+.kywi-admin-shell.kywi-admin-login {
+  align-items: center;
+  justify-content: center;
+  padding: var(--kywi-space-6);
+  background: radial-gradient(1200px 600px at 50% -10%, var(--kywi-accent-tint) 0%, var(--kywi-bg) 55%);
+}
+.kywi-admin-shell .kywi-admin-login-card {
+  width: 100%;
+  max-width: 400px;
+  display: flex;
+  flex-direction: column;
+  gap: var(--kywi-space-4);
+  padding: var(--kywi-space-8);
+  background: var(--kywi-surface);
+  border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-xl);
+  box-shadow: var(--kywi-shadow-lg);
+}
+.kywi-admin-shell .kywi-admin-login-brand {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--kywi-space-2);
+}
+.kywi-admin-shell .kywi-admin-login-dot {
+  width: 10px;
+  height: 10px;
+  border-radius: var(--kywi-radius-pill);
+  background: var(--kywi-accent);
+  box-shadow: 0 0 0 3px var(--kywi-ring-color);
+}
+.kywi-admin-shell .kywi-admin-login-subtitle {
+  margin: calc(var(--kywi-space-2) * -1) 0 var(--kywi-space-2);
+  text-align: center;
+  color: var(--kywi-text-muted);
+  font-size: var(--kywi-text-sm);
+}
+.kywi-admin-shell .kywi-admin-login-field {
+  display: flex;
+  flex-direction: column;
+  gap: var(--kywi-space-2);
+}
+.kywi-admin-shell .kywi-admin-login-label {
+  font-size: var(--kywi-text-sm);
+  font-weight: var(--kywi-weight-semibold);
+}
+.kywi-admin-shell .kywi-admin-login-submit {
+  width: 100%;
+  justify-content: center;
+  margin-top: var(--kywi-space-2);
+}
+
+/* ---- Page header (title + actions row) -------------------------------- */
+.kywi-admin-page-header,
+.kywi-content-list-header,
+.kywi-form-header,
+.kywi-user-list-header,
+.kywi-group-manager-header,
+.kywi-changeset-list-header,
+.kywi-approval-queue-header,
+.kywi-submission-header,
+.kywi-admin-extension-header,
+.kywi-admin-oauth-header,
+.kywi-admin-apikey-header,
+.kywi-form-builder-header,
+.kywi-feed-builder-actions,
+.kywi-changeset-detail-header,
+.kywi-variant-editor-header,
+.kywi-admin-plugin-manager-title {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--kywi-space-4);
+  flex-wrap: wrap;
+  margin-bottom: var(--kywi-space-5);
+}
+.kywi-admin-page-header h1,
+.kywi-content-list-header h1,
+.kywi-form-header h1,
+.kywi-user-list-header h1,
+.kywi-group-manager-header h1,
+.kywi-changeset-list-header h1,
+.kywi-approval-queue-header h1,
+.kywi-submission-header h1 {
+  font-size: var(--kywi-text-xl);
+  letter-spacing: var(--kywi-tracking-tight);
+}
+
+/* ==========================================================================
+   5. PRIMITIVES
+   ========================================================================== */
+
+/* ---- Buttons ---------------------------------------------------------- */
+/* Base selector intentionally kept at a single class of specificity so that
+   the colour variants below (also single-class) win by source order. Do NOT
+   qualify with `button`/`a` here — that would out-specify the variants. */
+.kywi-admin-shell .kywi-btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--kywi-space-2);
+  padding: 7px 14px;
+  font-family: inherit;
+  font-size: var(--kywi-text-sm);
+  font-weight: var(--kywi-weight-semibold);
+  line-height: 1.2;
+  letter-spacing: 0.005em;
+  color: var(--kywi-text);
+  background: var(--kywi-surface);
+  border: 1px solid var(--kywi-border-strong);
+  border-radius: var(--kywi-radius);
+  box-shadow: var(--kywi-shadow-xs);
+  cursor: pointer;
+  white-space: nowrap;
+  user-select: none;
+  text-decoration: none;
+  transition: background var(--kywi-dur) var(--kywi-ease),
+    border-color var(--kywi-dur) var(--kywi-ease),
+    color var(--kywi-dur) var(--kywi-ease),
+    box-shadow var(--kywi-dur) var(--kywi-ease),
+    transform var(--kywi-dur-fast) var(--kywi-ease);
+}
+.kywi-admin-shell .kywi-btn:hover {
+  background: var(--kywi-surface-hover);
+  border-color: var(--kywi-border-input);
+  text-decoration: none;
+}
+.kywi-admin-shell .kywi-btn:active { transform: translateY(0.5px); box-shadow: none; }
+.kywi-admin-shell .kywi-btn:focus-visible { box-shadow: var(--kywi-ring); }
+.kywi-admin-shell .kywi-btn:disabled,
+.kywi-admin-shell .kywi-btn[disabled],
+.kywi-admin-shell .kywi-btn[aria-disabled="true"] {
+  opacity: 0.5;
+  cursor: not-allowed;
+  box-shadow: none;
+  transform: none;
+}
+
+/* Primary — evergreen */
+.kywi-admin-shell .kywi-btn-primary,
+.kywi-admin-shell .kywi-changeset-publish-btn,
+.kywi-admin-shell .kywi-btn-restore {
+  background: var(--kywi-accent-solid);
+  border-color: var(--kywi-accent-solid);
+  color: var(--kywi-accent-fg);
+  box-shadow: var(--kywi-shadow-sm);
+}
+.kywi-admin-shell .kywi-btn-primary:hover,
+.kywi-admin-shell .kywi-changeset-publish-btn:hover,
+.kywi-admin-shell .kywi-btn-restore:hover {
+  background: var(--kywi-accent-hover);
+  border-color: var(--kywi-accent-hover);
+  color: var(--kywi-accent-fg);
+}
+.kywi-admin-shell .kywi-btn-primary:active { background: var(--kywi-accent-active); border-color: var(--kywi-accent-active); }
+
+/* Secondary — quiet outline (default look, made explicit) */
+.kywi-admin-shell .kywi-btn-secondary {
+  background: var(--kywi-surface);
+  border-color: var(--kywi-border-strong);
+  color: var(--kywi-text);
+}
+.kywi-admin-shell .kywi-btn-secondary:hover { background: var(--kywi-surface-hover); border-color: var(--kywi-border-input); }
+
+/* Ghost — no chrome until hover */
+.kywi-admin-shell .kywi-btn-ghost {
+  background: transparent;
+  border-color: transparent;
+  box-shadow: none;
+  color: var(--kywi-text-muted);
+}
+.kywi-admin-shell .kywi-btn-ghost:hover { background: var(--kywi-surface-sunken); border-color: transparent; color: var(--kywi-text); }
+
+/* Danger */
+.kywi-admin-shell .kywi-btn-danger,
+.kywi-admin-shell .kywi-btn-permanent-delete,
+.kywi-admin-shell .kywi-force-unlock-btn {
+  background: var(--kywi-danger-solid);
+  border-color: var(--kywi-danger-solid);
+  color: #fff;
+  box-shadow: var(--kywi-shadow-sm);
+}
+.kywi-admin-shell .kywi-btn-danger:hover,
+.kywi-admin-shell .kywi-btn-permanent-delete:hover,
+.kywi-admin-shell .kywi-force-unlock-btn:hover {
+  background: var(--kywi-danger-solid-hover);
+  border-color: var(--kywi-danger-solid-hover);
+  color: #fff;
+}
+.kywi-admin-shell .kywi-btn-danger:active { background: var(--kywi-danger-solid-active); }
+.kywi-admin-shell .kywi-btn-danger:focus-visible,
+.kywi-admin-shell .kywi-btn-permanent-delete:focus-visible { box-shadow: var(--kywi-ring-danger); }
+
+/* Warning */
+.kywi-admin-shell .kywi-btn-warning,
+.kywi-admin-shell .kywi-changeset-rollback-btn {
+  background: var(--kywi-warning-solid);
+  border-color: var(--kywi-warning-solid);
+  color: #fff;
+}
+.kywi-admin-shell .kywi-btn-warning:hover { background: #9a6408; border-color: #9a6408; color: #fff; }
+
+/* Sizes */
+.kywi-admin-shell .kywi-btn-sm { padding: 5px 10px; font-size: var(--kywi-text-xs); }
+.kywi-admin-shell .kywi-btn-xs { padding: 3px 8px; font-size: var(--kywi-text-xs); border-radius: var(--kywi-radius-sm); }
+
+/* ---- Form controls ---------------------------------------------------- */
+.kywi-admin-shell .kywi-input,
+.kywi-admin-shell .kywi-select,
+.kywi-admin-shell .kywi-textarea,
+.kywi-admin-shell .kywi-input-narrow,
+.kywi-admin-shell .kywi-editor-prop-input,
+.kywi-admin-shell .kywi-admin-settings-input,
+.kywi-admin-shell .kywi-token-raw-input,
+.kywi-admin-shell .kywi-token-color-input,
+.kywi-admin-shell .kywi-token-spacing-input,
+.kywi-admin-shell .kywi-token-typography-input,
+.kywi-admin-shell .kywi-token-typography-select,
+.kywi-admin-shell .kywi-admin-oauth-uri-input,
+.kywi-admin-shell .kywi-tag-field,
+.kywi-admin-shell .kywi-user-search,
+.kywi-admin-shell .kywi-tree-search,
+.kywi-admin-shell .kywi-admin-list-search,
+.kywi-admin-shell .kywi-admin-picker-search,
+.kywi-admin-shell .kywi-admin-filter-status,
+.kywi-admin-shell .kywi-admin-filter-locale,
+.kywi-admin-shell .kywi-tree-filter-status,
+.kywi-admin-shell .kywi-tree-filter-type,
+.kywi-admin-shell .kywi-user-filter-status,
+.kywi-admin-shell .kywi-user-filter-role,
+.kywi-admin-shell .kywi-user-role,
+.kywi-admin-shell .kywi-user-bulk-role,
+.kywi-admin-shell .kywi-relationship-display {
+  width: 100%;
+  padding: 7px 10px;
+  font-family: inherit;
+  font-size: var(--kywi-text-base);
+  line-height: 1.4;
+  color: var(--kywi-text);
+  background: var(--kywi-surface);
+  border: 1px solid var(--kywi-border-input);
+  border-radius: var(--kywi-radius);
+  box-shadow: var(--kywi-shadow-inset);
+  transition: border-color var(--kywi-dur) var(--kywi-ease),
+    box-shadow var(--kywi-dur) var(--kywi-ease), background var(--kywi-dur) var(--kywi-ease);
+  appearance: none;
+  -webkit-appearance: none;
+}
+.kywi-admin-shell .kywi-textarea,
+.kywi-admin-shell .kywi-json {
+  min-height: 96px;
+  line-height: var(--kywi-leading);
+  resize: vertical;
+}
+/* JSON custom field: a lightweight monospace code-editor surface + inline
+   parse validation (see .kywi-json-invalid / .kywi-field-error). */
+.kywi-admin-shell .kywi-json {
+  font-family: var(--kywi-font-mono);
+  font-size: var(--kywi-text-sm);
+  background: var(--kywi-surface-sunken);
+  tab-size: 2;
+  white-space: pre;
+  overflow-wrap: normal;
+  overflow-x: auto;
+}
+.kywi-admin-shell .kywi-json-invalid,
+.kywi-admin-shell .kywi-json-invalid:hover,
+.kywi-admin-shell .kywi-json-invalid:focus,
+.kywi-admin-shell .kywi-json-invalid:focus-visible {
+  border-color: var(--kywi-danger-solid);
+  box-shadow: var(--kywi-ring-danger);
+}
+.kywi-admin-shell .kywi-field-error {
+  display: block;
+  margin-top: var(--kywi-space-1);
+  font-size: var(--kywi-text-xs);
+  font-weight: var(--kywi-weight-semibold);
+  color: var(--kywi-danger-fg);
+}
+.kywi-admin-shell .kywi-input::placeholder,
+.kywi-admin-shell .kywi-textarea::placeholder,
+.kywi-admin-shell input::placeholder,
+.kywi-admin-shell textarea::placeholder { color: var(--kywi-text-subtle); }
+
+.kywi-admin-shell .kywi-input:hover,
+.kywi-admin-shell .kywi-select:hover,
+.kywi-admin-shell .kywi-textarea:hover { border-color: var(--kywi-border-strong); }
+
+.kywi-admin-shell .kywi-input:focus,
+.kywi-admin-shell .kywi-select:focus,
+.kywi-admin-shell .kywi-textarea:focus,
+.kywi-admin-shell .kywi-input:focus-visible,
+.kywi-admin-shell .kywi-select:focus-visible,
+.kywi-admin-shell .kywi-textarea:focus-visible,
+.kywi-admin-shell input:focus-visible,
+.kywi-admin-shell textarea:focus-visible,
+.kywi-admin-shell select:focus-visible {
+  outline: none;
+  border-color: var(--kywi-accent);
+  box-shadow: var(--kywi-ring);
+}
+.kywi-admin-shell .kywi-input:disabled,
+.kywi-admin-shell .kywi-select:disabled,
+.kywi-admin-shell .kywi-textarea:disabled,
+.kywi-admin-shell input:disabled,
+.kywi-admin-shell textarea:disabled {
+  background: var(--kywi-surface-sunken);
+  color: var(--kywi-text-subtle);
+  cursor: not-allowed;
+}
+.kywi-admin-shell .kywi-input[readonly],
+.kywi-admin-shell .kywi-relationship-display[readonly] { background: var(--kywi-surface-sunken); color: var(--kywi-text-muted); }
+.kywi-admin-shell .kywi-input-narrow { width: auto; min-width: 90px; }
+
+/* Native select caret */
+.kywi-admin-shell .kywi-select,
+.kywi-admin-shell .kywi-admin-filter-status,
+.kywi-admin-shell .kywi-admin-filter-locale,
+.kywi-admin-shell .kywi-tree-filter-status,
+.kywi-admin-shell .kywi-tree-filter-type,
+.kywi-admin-shell .kywi-user-filter-status,
+.kywi-admin-shell .kywi-user-filter-role,
+.kywi-admin-shell select.kywi-input {
+  padding-right: 30px;
+  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%2367625a' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='M4 6l4 4 4-4'/></svg>");
+  background-repeat: no-repeat;
+  background-position: right 9px center;
+  cursor: pointer;
+}
+.kywi-admin-shell select[multiple].kywi-multiselect { background-image: none; padding-right: 10px; min-height: 120px; }
+
+/* Color input */
+.kywi-admin-shell input[type="color"].kywi-input,
+.kywi-admin-shell .kywi-token-color-input[type="color"] {
+  width: 44px; height: 34px; padding: 3px; cursor: pointer;
+}
+
+/* Checkboxes & radios */
+.kywi-admin-shell input[type="checkbox"],
+.kywi-admin-shell input[type="radio"],
+.kywi-admin-shell .kywi-checkbox {
+  appearance: none;
+  -webkit-appearance: none;
+  width: 16px;
+  height: 16px;
+  margin: 0;
+  flex-shrink: 0;
+  background: var(--kywi-surface);
+  border: 1.5px solid var(--kywi-border-input);
+  border-radius: var(--kywi-radius-sm);
+  cursor: pointer;
+  display: inline-grid;
+  place-content: center;
+  transition: background var(--kywi-dur-fast) var(--kywi-ease), border-color var(--kywi-dur-fast) var(--kywi-ease);
+  vertical-align: -3px;
+}
+.kywi-admin-shell input[type="radio"],
+.kywi-admin-shell .kywi-checkbox[type="radio"] { border-radius: var(--kywi-radius-pill); }
+.kywi-admin-shell input[type="checkbox"]::before {
+  content: "";
+  width: 9px; height: 9px;
+  transform: scale(0);
+  transition: transform var(--kywi-dur-fast) var(--kywi-ease-out);
+  box-shadow: inset 1em 1em #fff;
+  clip-path: polygon(14% 44%, 0 65%, 43% 100%, 100% 16%, 80% 0%, 43% 62%);
+}
+.kywi-admin-shell input[type="radio"]::before {
+  content: ""; width: 8px; height: 8px; border-radius: 50%; transform: scale(0);
+  transition: transform var(--kywi-dur-fast) var(--kywi-ease-out); box-shadow: inset 1em 1em #fff;
+}
+.kywi-admin-shell input[type="checkbox"]:checked,
+.kywi-admin-shell input[type="radio"]:checked,
+.kywi-admin-shell .kywi-checkbox:checked {
+  background: var(--kywi-accent-solid);
+  border-color: var(--kywi-accent-solid);
+}
+.kywi-admin-shell input[type="checkbox"]:checked::before,
+.kywi-admin-shell input[type="radio"]:checked::before { transform: scale(1); }
+.kywi-admin-shell input[type="checkbox"]:focus-visible,
+.kywi-admin-shell input[type="radio"]:focus-visible { box-shadow: var(--kywi-ring); }
+.kywi-admin-shell input[type="checkbox"]:disabled { opacity: 0.5; cursor: not-allowed; }
+
+/* ---- Fields & labels -------------------------------------------------- */
+.kywi-admin-shell .kywi-field,
+.kywi-admin-shell .kywi-form-field,
+.kywi-admin-shell .kywi-admin-settings-field,
+.kywi-admin-shell .kywi-token-field { margin-bottom: var(--kywi-space-5); }
+
+.kywi-admin-shell .kywi-field-label,
+.kywi-admin-shell .kywi-label,
+.kywi-admin-shell .kywi-admin-settings-label,
+.kywi-admin-shell .kywi-editor-prop-label,
+.kywi-admin-shell .kywi-token-field-label,
+.kywi-admin-shell .kywi-checkbox-label {
+  display: block;
+  margin-bottom: var(--kywi-space-2);
+  font-size: var(--kywi-text-sm);
+  font-weight: var(--kywi-weight-semibold);
+  color: var(--kywi-text);
+  letter-spacing: 0.002em;
+}
+.kywi-admin-shell .kywi-required { color: var(--kywi-danger-fg); font-weight: var(--kywi-weight-bold); }
+.kywi-admin-shell .kywi-field-optional {
+  margin-left: var(--kywi-space-2);
+  font-size: var(--kywi-text-xs);
+  font-weight: var(--kywi-weight-normal);
+  color: var(--kywi-text-subtle);
+  text-transform: uppercase;
+  letter-spacing: var(--kywi-tracking-caps);
+}
+.kywi-admin-shell .kywi-field-hint,
+.kywi-admin-shell .kywi-admin-section-hint,
+.kywi-admin-shell .kywi-form-builder-skip-logic-help {
+  margin-top: var(--kywi-space-2);
+  font-size: var(--kywi-text-xs);
+  color: var(--kywi-text-muted);
+  line-height: var(--kywi-leading-snug);
+}
+
+/* Inline checkbox field: label + control on one row */
+.kywi-admin-shell .kywi-field-checkbox > .kywi-field-label,
+.kywi-admin-shell .kywi-checkbox-label,
+.kywi-admin-shell .kywi-group-vis-label,
+.kywi-admin-shell .kywi-admin-plugin-toggle-label,
+.kywi-admin-shell .kywi-category-label,
+.kywi-admin-shell .kywi-admin-settings-module-label {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--kywi-space-2);
+  margin-bottom: 0;
+  font-weight: var(--kywi-weight-medium);
+  cursor: pointer;
+}
+
+/* Multi-option checkbox group (e.g. Feed builder Status): each label+checkbox
+   pair is a self-contained bordered chip with generous spacing between pairs, so
+   a label can never read as attached to the neighbouring checkbox. */
+.kywi-admin-shell .kywi-checkbox-group {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--kywi-space-2) var(--kywi-space-3);
+}
+.kywi-admin-shell .kywi-checkbox-group .kywi-checkbox-label {
+  gap: var(--kywi-space-2);
+  padding: 5px 12px 5px 10px;
+  border: 1px solid var(--kywi-border-strong);
+  border-radius: var(--kywi-radius-pill);
+  background: var(--kywi-surface);
+  transition: border-color var(--kywi-dur) var(--kywi-ease), background var(--kywi-dur) var(--kywi-ease);
+}
+.kywi-admin-shell .kywi-checkbox-group .kywi-checkbox-label:hover {
+  border-color: var(--kywi-border-input);
+  background: var(--kywi-surface-hover);
+}
+.kywi-admin-shell .kywi-checkbox-group input:checked ~ .kywi-checkbox-text {
+  color: var(--kywi-accent-tint-fg);
+  font-weight: var(--kywi-weight-semibold);
+}
+.kywi-admin-shell .kywi-checkbox-text { line-height: 1; }
+
+/* Form sections & section headings */
+.kywi-admin-shell .kywi-admin-form-section,
+.kywi-admin-shell .kywi-admin-settings-section,
+.kywi-admin-shell .kywi-changeset-section,
+.kywi-admin-shell .kywi-approval-section,
+.kywi-admin-shell .kywi-editor-style-section,
+.kywi-admin-shell .kywi-form-builder-config,
+.kywi-admin-shell .kywi-admin-settings-general,
+.kywi-admin-shell .kywi-admin-settings-media,
+.kywi-admin-shell .kywi-admin-settings-email,
+.kywi-admin-shell .kywi-admin-settings-security,
+.kywi-admin-shell .kywi-admin-settings-modules {
+  padding: var(--kywi-space-5);
+  margin-bottom: var(--kywi-space-5);
+  background: var(--kywi-surface);
+  border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-md);
+  box-shadow: var(--kywi-shadow-sm);
+}
+.kywi-admin-shell .kywi-section-heading,
+.kywi-admin-shell .kywi-admin-settings-section-title,
+.kywi-admin-shell .kywi-form-builder-section-title,
+.kywi-admin-shell .kywi-admin-site-settings-title,
+.kywi-admin-shell .kywi-admin-extension-title,
+.kywi-admin-shell .kywi-admin-oauth-title,
+.kywi-admin-shell .kywi-admin-apikey-title,
+.kywi-admin-shell .kywi-form-builder-title,
+.kywi-admin-shell .kywi-feed-builder-title,
+.kywi-admin-shell .kywi-form-builder-palette-title,
+.kywi-admin-shell .kywi-form-builder-steps-title,
+.kywi-admin-shell .kywi-admin-audience-name,
+.kywi-admin-shell .kywi-admin-extension-group-title {
+  margin: 0 0 var(--kywi-space-3);
+  font-size: var(--kywi-text-xs);
+  font-weight: var(--kywi-weight-bold);
+  text-transform: uppercase;
+  letter-spacing: var(--kywi-tracking-caps);
+  color: var(--kywi-text-muted);
+}
+
+/* Form action rows */
+.kywi-admin-shell .kywi-form-actions,
+.kywi-admin-shell .kywi-admin-form-actions,
+.kywi-admin-shell .kywi-admin-oauth-form-actions,
+.kywi-admin-shell .kywi-admin-apikey-form-actions,
+.kywi-admin-shell .kywi-changeset-actions,
+.kywi-admin-shell .kywi-approval-actions,
+.kywi-admin-shell .kywi-approval-buttons,
+.kywi-admin-shell .kywi-version-actions,
+.kywi-admin-shell .kywi-admin-extension-actions,
+.kywi-admin-shell .kywi-related-actions,
+.kywi-admin-shell .kywi-admin-condition-add-actions,
+.kywi-admin-shell .kywi-form-builder-header-actions,
+.kywi-admin-shell .kywi-admin-rule-tester-actions {
+  display: flex;
+  align-items: center;
+  gap: var(--kywi-space-2);
+  flex-wrap: wrap;
+}
+.kywi-admin-shell .kywi-form-actions,
+.kywi-admin-shell .kywi-admin-form-actions {
+  margin-top: var(--kywi-space-6);
+  padding-top: var(--kywi-space-5);
+  border-top: 1px solid var(--kywi-border);
+}
+
+/* ---- Tables ----------------------------------------------------------- */
+.kywi-admin-shell .kywi-table,
+.kywi-admin-shell .kywi-admin-table,
+.kywi-admin-shell .kywi-content-table,
+.kywi-admin-shell .kywi-user-table,
+.kywi-admin-shell .kywi-trash-table,
+.kywi-admin-shell .kywi-changeset-table,
+.kywi-admin-shell .kywi-changeset-items-table,
+.kywi-admin-shell .kywi-approval-table,
+.kywi-admin-shell .kywi-submission-table,
+.kywi-admin-shell .kywi-version-table,
+.kywi-admin-shell .kywi-admin-oauth-table,
+.kywi-admin-shell .kywi-admin-apikey-table,
+.kywi-admin-shell .kywi-permissions-matrix,
+.kywi-admin-shell .kywi-site-tree-table {
+  width: 100%;
+  border-collapse: separate;
+  border-spacing: 0;
+  background: var(--kywi-surface);
+  border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-md);
+  box-shadow: var(--kywi-shadow-sm);
+  overflow: hidden;
+  font-size: var(--kywi-text-base);
+  font-variant-numeric: tabular-nums;
+}
+.kywi-admin-shell .kywi-table thead th,
+.kywi-admin-shell .kywi-admin-table thead th,
+.kywi-admin-shell .kywi-content-table thead th,
+.kywi-admin-shell .kywi-user-table thead th,
+.kywi-admin-shell .kywi-trash-table thead th,
+.kywi-admin-shell .kywi-changeset-table thead th,
+.kywi-admin-shell .kywi-approval-table thead th,
+.kywi-admin-shell .kywi-submission-table thead th,
+.kywi-admin-shell .kywi-version-table thead th,
+.kywi-admin-shell .kywi-admin-oauth-table thead th,
+.kywi-admin-shell .kywi-admin-apikey-table thead th {
+  padding: 10px var(--kywi-space-4);
+  text-align: left;
+  background: var(--kywi-surface-2);
+  border-bottom: 1px solid var(--kywi-border);
+  font-size: var(--kywi-text-xs);
+  font-weight: var(--kywi-weight-semibold);
+  text-transform: uppercase;
+  letter-spacing: var(--kywi-tracking-caps);
+  color: var(--kywi-text-muted);
+  white-space: nowrap;
+  user-select: none;
+}
+.kywi-admin-shell .kywi-content-table thead th { cursor: pointer; transition: color var(--kywi-dur) var(--kywi-ease); }
+.kywi-admin-shell .kywi-content-table thead th:hover { color: var(--kywi-text); }
+.kywi-admin-shell .kywi-content-table thead th.kywi-sorted { color: var(--kywi-accent-hover); }
+
+.kywi-admin-shell .kywi-table tbody td,
+.kywi-admin-shell .kywi-admin-table tbody td,
+.kywi-admin-shell .kywi-content-table tbody td,
+.kywi-admin-shell .kywi-user-table tbody td,
+.kywi-admin-shell .kywi-trash-table tbody td,
+.kywi-admin-shell .kywi-changeset-table tbody td,
+.kywi-admin-shell .kywi-approval-table tbody td,
+.kywi-admin-shell .kywi-submission-table tbody td,
+.kywi-admin-shell .kywi-version-table tbody td,
+.kywi-admin-shell .kywi-admin-oauth-table tbody td,
+.kywi-admin-shell .kywi-admin-apikey-table tbody td {
+  padding: 11px var(--kywi-space-4);
+  border-bottom: 1px solid var(--kywi-border);
+  color: var(--kywi-text);
+  vertical-align: middle;
+}
+.kywi-admin-shell tbody tr:last-child td { border-bottom: none; }
+.kywi-admin-shell .kywi-content-table tbody tr,
+.kywi-admin-shell .kywi-user-table tbody tr,
+.kywi-admin-shell .kywi-changeset-table tbody tr,
+.kywi-admin-shell .kywi-approval-table tbody tr,
+.kywi-admin-shell .kywi-submission-table tbody tr {
+  transition: background var(--kywi-dur) var(--kywi-ease);
+  cursor: pointer;
+}
+.kywi-admin-shell .kywi-content-table tbody tr:hover,
+.kywi-admin-shell .kywi-user-table tbody tr:hover,
+.kywi-admin-shell .kywi-changeset-table tbody tr:hover,
+.kywi-admin-shell .kywi-approval-table tbody tr:hover { background: var(--kywi-surface-hover); }
+.kywi-admin-shell .kywi-row-selected,
+.kywi-admin-shell .kywi-content-table tbody tr.kywi-row-selected { background: var(--kywi-accent-tint); }
+.kywi-admin-shell .kywi-content-table tbody tr.kywi-row-selected:hover { background: var(--kywi-accent-tint-strong); }
+.kywi-admin-shell .kywi-col-checkbox { width: 40px; text-align: center; cursor: default; }
+.kywi-admin-shell .kywi-col-actions { text-align: right; white-space: nowrap; }
+.kywi-admin-shell .kywi-content-table time,
+.kywi-admin-shell td time { color: var(--kywi-text-muted); font-variant-numeric: tabular-nums; }
+
+/* ---- Pagination ------------------------------------------------------- */
+.kywi-admin-shell .kywi-pagination {
+  display: flex;
+  gap: var(--kywi-space-1);
+  margin-top: var(--kywi-space-5);
+  flex-wrap: wrap;
+}
+.kywi-admin-shell .kywi-pagination button {
+  min-width: 32px;
+  padding: 6px 10px;
+  font-family: inherit;
+  font-size: var(--kywi-text-sm);
+  font-weight: var(--kywi-weight-medium);
+  font-variant-numeric: tabular-nums;
+  color: var(--kywi-text-muted);
+  background: var(--kywi-surface);
+  border: 1px solid var(--kywi-border-strong);
+  border-radius: var(--kywi-radius);
+  cursor: pointer;
+  transition: background var(--kywi-dur) var(--kywi-ease), color var(--kywi-dur) var(--kywi-ease), border-color var(--kywi-dur) var(--kywi-ease);
+}
+.kywi-admin-shell .kywi-pagination button:hover { background: var(--kywi-surface-hover); color: var(--kywi-text); }
+.kywi-admin-shell .kywi-pagination .kywi-page-active {
+  background: var(--kywi-accent-solid);
+  border-color: var(--kywi-accent-solid);
+  color: var(--kywi-accent-fg);
+  cursor: default;
+}
+
+/* ---- Tabs ------------------------------------------------------------- */
+.kywi-admin-shell .kywi-tab-bar {
+  display: flex;
+  gap: var(--kywi-space-1);
+  border-bottom: 1px solid var(--kywi-border);
+  margin-bottom: var(--kywi-space-6);
+  overflow-x: auto;
+  scrollbar-width: none;
+}
+.kywi-admin-shell .kywi-tab-bar::-webkit-scrollbar { display: none; }
+.kywi-admin-shell .kywi-tab {
+  position: relative;
+  padding: 9px 14px;
+  font-family: inherit;
+  font-size: var(--kywi-text-sm);
+  font-weight: var(--kywi-weight-medium);
+  color: var(--kywi-text-muted);
+  background: transparent;
+  border: none;
+  border-bottom: 2px solid transparent;
+  margin-bottom: -1px;
+  cursor: pointer;
+  white-space: nowrap;
+  transition: color var(--kywi-dur) var(--kywi-ease), border-color var(--kywi-dur) var(--kywi-ease), background var(--kywi-dur) var(--kywi-ease);
+  border-radius: var(--kywi-radius) var(--kywi-radius) 0 0;
+}
+.kywi-admin-shell .kywi-tab:hover { color: var(--kywi-text); background: var(--kywi-surface-sunken); }
+.kywi-admin-shell .kywi-tab-active {
+  color: var(--kywi-accent-hover);
+  border-bottom-color: var(--kywi-accent);
+  font-weight: var(--kywi-weight-semibold);
+}
+.kywi-admin-shell .kywi-tab:focus-visible { box-shadow: var(--kywi-ring); border-radius: var(--kywi-radius-sm); }
+.kywi-admin-shell .kywi-tab-content { }
+.kywi-admin-shell .kywi-tab-panel { animation: kywi-fade-in var(--kywi-dur-slow) var(--kywi-ease-out); }
+
+/* ---- Badges / status pills -------------------------------------------- */
+.kywi-admin-shell .kywi-status-badge,
+.kywi-admin-shell .kywi-admin-status-badge,
+.kywi-admin-shell .kywi-admin-status,
+.kywi-admin-shell .kywi-status,
+.kywi-admin-shell .kywi-type-badge,
+.kywi-admin-shell .kywi-role-badge,
+.kywi-admin-shell .kywi-role,
+.kywi-admin-shell .kywi-action-badge,
+.kywi-admin-shell .kywi-submission-status,
+.kywi-admin-shell .kywi-form-builder-step-skip-badge,
+.kywi-admin-shell .kywi-admin-priority,
+.kywi-admin-shell .kywi-admin-token-expired {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  padding: 2px 9px;
+  font-size: var(--kywi-text-xs);
+  font-weight: var(--kywi-weight-semibold);
+  line-height: 1.5;
+  letter-spacing: 0.01em;
+  text-transform: capitalize;
+  border-radius: var(--kywi-radius-pill);
+  border: 1px solid var(--kywi-neutral-border);
+  background: var(--kywi-neutral-bg);
+  color: var(--kywi-neutral-fg);
+  white-space: nowrap;
+}
+.kywi-admin-shell .kywi-status-badge::before,
+.kywi-admin-shell .kywi-admin-status-badge::before {
+  content: "";
+  width: 6px; height: 6px; border-radius: var(--kywi-radius-pill);
+  background: currentColor; opacity: 0.85;
+}
+/* status → semantic mapping (compound so it never collides with inline-editor) */
+.kywi-admin-shell .kywi-status-published,
+.kywi-admin-shell .kywi-status-active,
+.kywi-admin-shell .kywi-status-approved.kywi-status-badge { color: var(--kywi-success-fg); background: var(--kywi-success-bg); border-color: var(--kywi-success-border); }
+.kywi-admin-shell .kywi-status-draft,
+.kywi-admin-shell .kywi-status-pending { color: var(--kywi-warning-fg); background: var(--kywi-warning-bg); border-color: var(--kywi-warning-border); }
+.kywi-admin-shell .kywi-status-approved,
+.kywi-admin-shell .kywi-status-open { color: var(--kywi-info-fg); background: var(--kywi-info-bg); border-color: var(--kywi-info-border); }
+.kywi-admin-shell .kywi-status-archived,
+.kywi-admin-shell .kywi-status-inactive { color: var(--kywi-neutral-fg); background: var(--kywi-neutral-bg); border-color: var(--kywi-neutral-border); }
+.kywi-admin-shell .kywi-role-badge,
+.kywi-admin-shell .kywi-role,
+.kywi-admin-shell .kywi-type-badge { color: var(--kywi-accent-tint-fg); background: var(--kywi-accent-tint); border-color: var(--kywi-accent-border); text-transform: none; }
+.kywi-admin-shell .kywi-action-create { color: var(--kywi-success-fg); background: var(--kywi-success-bg); border-color: var(--kywi-success-border); }
+.kywi-admin-shell .kywi-action-update { color: var(--kywi-info-fg); background: var(--kywi-info-bg); border-color: var(--kywi-info-border); }
+.kywi-admin-shell .kywi-action-delete { color: var(--kywi-danger-fg); background: var(--kywi-danger-bg); border-color: var(--kywi-danger-border); }
+
+/* ==========================================================================
+   6. COMPONENTS
+   ========================================================================== */
+
+/* ---- List toolbar / filters ------------------------------------------- */
+.kywi-admin-shell .kywi-admin-toolbar,
+.kywi-admin-shell .kywi-tree-toolbar,
+.kywi-admin-shell .kywi-user-toolbar,
+.kywi-admin-shell .kywi-approval-filters {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--kywi-space-3);
+  flex-wrap: wrap;
+  margin-bottom: var(--kywi-space-4);
+}
+.kywi-admin-shell .kywi-admin-toolbar-filters,
+.kywi-admin-shell .kywi-tree-toolbar-filters,
+.kywi-admin-shell .kywi-user-toolbar-filters {
+  display: flex;
+  align-items: center;
+  gap: var(--kywi-space-2);
+  flex-wrap: wrap;
+}
+.kywi-admin-shell .kywi-tree-toolbar-actions,
+.kywi-admin-shell .kywi-user-list-actions { display: flex; align-items: center; gap: var(--kywi-space-2); flex-wrap: wrap; }
+.kywi-admin-shell .kywi-admin-list-search,
+.kywi-admin-shell .kywi-tree-search,
+.kywi-admin-shell .kywi-user-search { width: 240px; max-width: 100%; }
+.kywi-admin-shell .kywi-admin-filter-status,
+.kywi-admin-shell .kywi-admin-filter-locale,
+.kywi-admin-shell .kywi-tree-filter-status,
+.kywi-admin-shell .kywi-tree-filter-type,
+.kywi-admin-shell .kywi-user-filter-status,
+.kywi-admin-shell .kywi-user-filter-role { width: auto; min-width: 130px; }
+
+/* ---- Bulk action bar -------------------------------------------------- */
+.kywi-admin-shell .kywi-admin-bulk-bar,
+.kywi-admin-shell .kywi-tree-bulk-bar,
+.kywi-admin-shell .kywi-user-bulk-bar {
+  display: flex;
+  align-items: center;
+  gap: var(--kywi-space-2);
+  padding: 8px var(--kywi-space-3) 8px var(--kywi-space-4);
+  background: var(--kywi-text);
+  color: #fff;
+  border-radius: var(--kywi-radius-pill);
+  box-shadow: var(--kywi-shadow-md);
+}
+.kywi-admin-shell .kywi-admin-bulk-count,
+.kywi-admin-shell .kywi-tree-bulk-count,
+.kywi-admin-shell .kywi-user-bulk-count {
+  font-size: var(--kywi-text-sm);
+  font-weight: var(--kywi-weight-semibold);
+  margin-right: var(--kywi-space-2);
+  color: #fff;
+}
+.kywi-admin-shell .kywi-admin-bulk-bar .kywi-btn,
+.kywi-admin-shell .kywi-tree-bulk-bar .kywi-btn,
+.kywi-admin-shell .kywi-user-bulk-bar .kywi-btn {
+  background: rgba(255, 255, 255, 0.12);
+  border-color: rgba(255, 255, 255, 0.18);
+  color: #fff;
+  box-shadow: none;
+}
+.kywi-admin-shell .kywi-admin-bulk-bar .kywi-btn:hover,
+.kywi-admin-shell .kywi-tree-bulk-bar .kywi-btn:hover { background: rgba(255, 255, 255, 0.22); border-color: rgba(255, 255, 255, 0.28); }
+.kywi-admin-shell .kywi-admin-bulk-bar .kywi-btn-danger { background: rgba(224, 122, 95, 0.25); border-color: rgba(224, 122, 95, 0.45); color: #ffd9d0; }
+.kywi-admin-shell .kywi-admin-bulk-bar .kywi-btn-danger:hover { background: rgba(224, 122, 95, 0.4); }
+.kywi-admin-shell .kywi-admin-bulk-bar .kywi-btn-ghost { color: rgba(255, 255, 255, 0.72); }
+.kywi-admin-shell .kywi-admin-bulk-bar .kywi-btn-ghost:hover { background: rgba(255, 255, 255, 0.12); color: #fff; }
+
+/* ---- Empty states ----------------------------------------------------- */
+.kywi-admin-shell .kywi-empty-state,
+.kywi-admin-shell .kywi-admin-empty-state,
+.kywi-admin-shell .kywi-content-empty,
+.kywi-admin-shell .kywi-user-empty,
+.kywi-admin-shell .kywi-changeset-empty,
+.kywi-admin-shell .kywi-approval-empty,
+.kywi-admin-shell .kywi-submission-empty,
+.kywi-admin-shell .kywi-form-builder-empty,
+.kywi-admin-shell .kywi-admin-extension-empty,
+.kywi-admin-shell .kywi-admin-oauth-empty,
+.kywi-admin-shell .kywi-admin-apikey-empty,
+.kywi-admin-shell .kywi-admin-plugin-empty,
+.kywi-admin-shell .kywi-admin-picker-empty,
+.kywi-admin-shell .kywi-admin-empty-conditions,
+.kywi-admin-shell .kywi-trash-empty,
+.kywi-admin-shell .kywi-media-empty,
+.kywi-admin-shell .kywi-form-preview-empty {
+  padding: var(--kywi-space-10) var(--kywi-space-6);
+  text-align: center;
+  color: var(--kywi-text-muted);
+  font-size: var(--kywi-text-base);
+  background: var(--kywi-surface);
+  border: 1px dashed var(--kywi-border-strong);
+  border-radius: var(--kywi-radius-md);
+}
+/* empty row inside a table shouldn't get card chrome */
+.kywi-admin-shell td.kywi-content-empty,
+.kywi-admin-shell td.kywi-user-empty,
+.kywi-admin-shell td.kywi-changeset-empty {
+  border: none;
+  background: transparent;
+  border-radius: 0;
+}
+
+/* ---- Cards ------------------------------------------------------------ */
+.kywi-admin-shell .kywi-admin-metric-card,
+.kywi-admin-shell .kywi-admin-plugin-card,
+.kywi-admin-shell .kywi-admin-extension-subtype-card,
+.kywi-admin-shell .kywi-variant-entry,
+.kywi-admin-shell .kywi-admin-audience-row,
+.kywi-admin-shell .kywi-changeset-row,
+.kywi-admin-shell .kywi-approval-entry,
+.kywi-admin-shell .kywi-admin-condition-group,
+.kywi-admin-shell .kywi-admin-trace-group,
+.kywi-admin-shell .kywi-admin-token-row,
+.kywi-admin-shell .kywi-selfid-row,
+.kywi-admin-shell .kywi-admin-selfid-row,
+.kywi-admin-shell .kywi-form-builder-step-item,
+.kywi-admin-shell .kywi-form-builder-field-item,
+.kywi-admin-shell .kywi-related-item {
+  padding: var(--kywi-space-4);
+  background: var(--kywi-surface);
+  border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-md);
+  box-shadow: var(--kywi-shadow-xs);
+}
+
+/* Metrics grid */
+.kywi-admin-shell .kywi-admin-metrics-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
+  gap: var(--kywi-space-4);
+  margin-bottom: var(--kywi-space-6);
+}
+.kywi-admin-shell .kywi-admin-metric-card { display: flex; flex-direction: column; gap: var(--kywi-space-2); }
+/* Metric card that is also a link (e.g. dashboard → Pending Approvals). */
+.kywi-admin-shell a.kywi-admin-metric-card-link {
+  text-decoration: none; color: inherit;
+  transition: border-color var(--kywi-dur) var(--kywi-ease), box-shadow var(--kywi-dur) var(--kywi-ease);
+}
+.kywi-admin-shell a.kywi-admin-metric-card-link:hover {
+  border-color: var(--kywi-accent-border); box-shadow: var(--kywi-shadow-sm); text-decoration: none;
+}
+.kywi-admin-shell a.kywi-admin-metric-card-link:hover .kywi-admin-metric-label { color: var(--kywi-accent-tint-fg); }
+.kywi-admin-shell .kywi-admin-metric-value {
+  font-size: var(--kywi-text-2xl);
+  font-weight: var(--kywi-weight-bold);
+  letter-spacing: var(--kywi-tracking-tight);
+  font-variant-numeric: tabular-nums;
+  color: var(--kywi-text);
+  line-height: 1;
+}
+.kywi-admin-shell .kywi-admin-metric-label {
+  font-size: var(--kywi-text-xs);
+  font-weight: var(--kywi-weight-semibold);
+  text-transform: uppercase;
+  letter-spacing: var(--kywi-tracking-caps);
+  color: var(--kywi-text-muted);
+}
+
+/* selectable list items */
+.kywi-admin-shell .kywi-form-builder-step-item,
+.kywi-admin-shell .kywi-form-builder-field-item,
+.kywi-admin-shell .kywi-admin-condition-row {
+  cursor: pointer;
+  transition: border-color var(--kywi-dur) var(--kywi-ease), box-shadow var(--kywi-dur) var(--kywi-ease), background var(--kywi-dur) var(--kywi-ease);
+  margin-bottom: var(--kywi-space-2);
+}
+.kywi-admin-shell .kywi-form-builder-step-item:hover,
+.kywi-admin-shell .kywi-form-builder-field-item:hover { border-color: var(--kywi-border-strong); box-shadow: var(--kywi-shadow-sm); }
+.kywi-admin-shell .kywi-form-builder-step-item-selected,
+.kywi-admin-shell .kywi-form-builder-field-item-selected {
+  border-color: var(--kywi-accent);
+  box-shadow: 0 0 0 1px var(--kywi-accent);
+  background: var(--kywi-accent-tint);
+}
+
+/* ---- Diff view -------------------------------------------------------- */
+.kywi-admin-shell .kywi-admin-diff,
+.kywi-admin-shell .kywi-changeset-detail {
+  background: var(--kywi-surface);
+  border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-md);
+  box-shadow: var(--kywi-shadow-sm);
+  overflow: hidden;
+}
+.kywi-admin-shell .kywi-admin-diff-header,
+.kywi-admin-shell .kywi-admin-diff-version {
+  padding: var(--kywi-space-3) var(--kywi-space-4);
+  background: var(--kywi-surface-2);
+  border-bottom: 1px solid var(--kywi-border);
+  font-weight: var(--kywi-weight-semibold);
+  font-size: var(--kywi-text-sm);
+}
+.kywi-admin-shell .kywi-admin-diff-date { color: var(--kywi-text-muted); font-weight: var(--kywi-weight-normal); }
+.kywi-admin-shell .kywi-admin-diff-split { display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
+.kywi-admin-shell .kywi-admin-diff-left { border-right: 1px solid var(--kywi-border); }
+/* The fields wrapper stacks the rows vertically; each ROW is the 160px key +
+   1fr values grid. (Previously the wrapper ALSO carried the two-column grid,
+   which laid whole rows out side-by-side into its columns — garbling the diff
+   the first time it rendered.) */
+.kywi-admin-shell .kywi-admin-diff-fields { display: flex; flex-direction: column; }
+.kywi-admin-shell .kywi-admin-diff-row { display: grid; grid-template-columns: 160px 1fr; gap: var(--kywi-space-3); padding: var(--kywi-space-2) var(--kywi-space-4); border-bottom: 1px solid var(--kywi-border); align-items: start; }
+.kywi-admin-shell .kywi-admin-diff-key { font-family: var(--kywi-font-mono); font-size: var(--kywi-text-xs); color: var(--kywi-text-muted); }
+.kywi-admin-shell .kywi-admin-diff-value { font-family: var(--kywi-font-mono); font-size: var(--kywi-text-sm); word-break: break-word; }
+.kywi-admin-shell .kywi-admin-diff-added { background: var(--kywi-success-bg); color: var(--kywi-success-fg); }
+.kywi-admin-shell .kywi-admin-diff-removed { background: var(--kywi-danger-bg); color: var(--kywi-danger-fg); text-decoration: line-through; }
+.kywi-admin-shell .kywi-admin-diff-changed { background: var(--kywi-warning-bg); color: var(--kywi-warning-fg); }
+.kywi-admin-shell .kywi-admin-diff-unchanged { color: var(--kywi-text-subtle); }
+.kywi-admin-shell .kywi-admin-diff-note { padding: var(--kywi-space-3) var(--kywi-space-4); color: var(--kywi-text-muted); font-size: var(--kywi-text-sm); }
+
+/* ---- Tree ------------------------------------------------------------- */
+.kywi-admin-shell .kywi-site-tree,
+.kywi-admin-shell .kywi-site-tree-content { color: var(--kywi-text); }
+.kywi-admin-shell .kywi-tree-node,
+.kywi-admin-shell .kywi-tree-table-row {
+  transition: background var(--kywi-dur) var(--kywi-ease);
+}
+.kywi-admin-shell .kywi-tree-node:hover,
+.kywi-admin-shell .kywi-tree-table-row:hover { background: var(--kywi-surface-hover); }
+.kywi-admin-shell .kywi-tree-selected,
+.kywi-admin-shell .kywi-tree-node.kywi-tree-selected { background: var(--kywi-accent-tint); }
+.kywi-admin-shell .kywi-tree-toggle {
+  display: inline-flex; align-items: center; justify-content: center;
+  width: 20px; height: 20px; padding: 0;
+  border: none; background: transparent; color: var(--kywi-text-muted);
+  cursor: pointer; border-radius: var(--kywi-radius-sm);
+  transition: background var(--kywi-dur) var(--kywi-ease), color var(--kywi-dur) var(--kywi-ease);
+}
+.kywi-admin-shell .kywi-tree-toggle:hover { background: var(--kywi-surface-sunken); color: var(--kywi-text); }
+.kywi-admin-shell .kywi-tree-toggle-spacer { display: inline-block; width: 20px; }
+.kywi-admin-shell .kywi-tree-icon { color: var(--kywi-text-subtle); }
+.kywi-admin-shell .kywi-tree-title { font-weight: var(--kywi-weight-medium); }
+.kywi-admin-shell .kywi-tree-lock,
+.kywi-admin-shell .kywi-lock-icon,
+.kywi-admin-shell .kywi-icon-lock { color: var(--kywi-warning-fg); }
+.kywi-admin-shell .kywi-tree-ellipsis {
+  border: none; background: transparent; color: var(--kywi-text-muted);
+  cursor: pointer; padding: 2px 8px; border-radius: var(--kywi-radius-sm); font-weight: var(--kywi-weight-bold);
+}
+.kywi-admin-shell .kywi-tree-ellipsis:hover { background: var(--kywi-surface-sunken); color: var(--kywi-text); }
+.kywi-admin-shell .kywi-tree-dragging { opacity: 0.5; }
+.kywi-admin-shell .kywi-tree-drag-overlay {
+  background: var(--kywi-surface);
+  box-shadow: var(--kywi-shadow-lg);
+  border: 1px solid var(--kywi-accent-border);
+  border-radius: var(--kywi-radius);
+  padding: 6px 12px;
+}
+
+/* Category tree */
+.kywi-admin-shell .kywi-category-tree { border: 1px solid var(--kywi-border); border-radius: var(--kywi-radius-md); padding: var(--kywi-space-3); background: var(--kywi-surface); }
+.kywi-admin-shell .kywi-category-node { padding: 3px 0; }
+.kywi-admin-shell .kywi-category-children { margin-left: var(--kywi-space-5); border-left: 1px solid var(--kywi-border); padding-left: var(--kywi-space-3); }
+/* Category manager row: label + inline actions */
+.kywi-admin-shell .kywi-category-row {
+  display: flex; align-items: center; justify-content: space-between; gap: var(--kywi-space-3);
+  padding: 4px var(--kywi-space-2); border-radius: var(--kywi-radius-sm);
+}
+.kywi-admin-shell .kywi-category-row:hover { background: var(--kywi-surface-hover); }
+.kywi-admin-shell .kywi-category-row-main { display: inline-flex; align-items: baseline; gap: var(--kywi-space-2); min-width: 0; }
+.kywi-admin-shell .kywi-category-name { font-weight: var(--kywi-weight-medium); }
+.kywi-admin-shell .kywi-category-row-actions { display: inline-flex; gap: var(--kywi-space-1); flex-shrink: 0; }
+.kywi-admin-shell .kywi-category-slug { font-size: var(--kywi-text-xs); color: var(--kywi-text-muted); }
+
+/* ---- Context menu ----------------------------------------------------- */
+.kywi-admin-shell .kywi-tree-context-menu {
+  min-width: 170px;
+  padding: var(--kywi-space-1);
+  background: var(--kywi-surface);
+  border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-md);
+  box-shadow: var(--kywi-shadow-lg);
+  z-index: var(--kywi-z-dropdown);
+}
+.kywi-admin-shell .kywi-tree-ctx-item {
+  display: flex; align-items: center; gap: var(--kywi-space-2);
+  width: 100%; padding: 7px 10px;
+  font-family: inherit; font-size: var(--kywi-text-sm); text-align: left;
+  color: var(--kywi-text); background: transparent; border: none;
+  border-radius: var(--kywi-radius-sm); cursor: pointer;
+  transition: background var(--kywi-dur-fast) var(--kywi-ease);
+}
+.kywi-admin-shell .kywi-tree-ctx-item:hover { background: var(--kywi-surface-hover); }
+.kywi-admin-shell .kywi-ctx-danger { color: var(--kywi-danger-fg); }
+.kywi-admin-shell .kywi-ctx-danger:hover { background: var(--kywi-danger-bg); }
+
+/* ---- Modals / overlays / pickers -------------------------------------- */
+.kywi-admin-shell .kywi-admin-picker-overlay,
+.kywi-admin-shell .kywi-editor-template-overlay,
+.kywi-admin-shell .kywi-overlay-shell {
+  position: fixed;
+  inset: 0;
+  z-index: var(--kywi-z-overlay);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: var(--kywi-space-6);
+  background: rgba(24, 33, 28, 0.5);
+  backdrop-filter: blur(3px);
+  -webkit-backdrop-filter: blur(3px);
+  animation: kywi-fade-in var(--kywi-dur) var(--kywi-ease-out);
+}
+.kywi-admin-shell .kywi-admin-picker-modal,
+.kywi-admin-shell .kywi-editor-template-modal {
+  width: 100%;
+  max-width: 560px;
+  max-height: 82vh;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  background: var(--kywi-surface);
+  border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-lg);
+  box-shadow: var(--kywi-shadow-lg);
+  z-index: var(--kywi-z-modal);
+  animation: kywi-pop-in var(--kywi-dur-slow) var(--kywi-ease-out);
+}
+.kywi-admin-shell .kywi-admin-picker-header,
+.kywi-admin-shell .kywi-editor-template-modal-header {
+  display: flex; align-items: center; justify-content: space-between; gap: var(--kywi-space-3);
+  padding: var(--kywi-space-4) var(--kywi-space-5);
+  border-bottom: 1px solid var(--kywi-border);
+}
+.kywi-admin-shell .kywi-admin-picker-title,
+.kywi-admin-shell .kywi-editor-template-modal-title { font-size: var(--kywi-text-md); font-weight: var(--kywi-weight-semibold); }
+.kywi-admin-shell .kywi-admin-picker-close {
+  border: none; background: transparent; color: var(--kywi-text-muted);
+  width: 30px; height: 30px; border-radius: var(--kywi-radius); cursor: pointer; font-size: 18px; line-height: 1;
+  transition: background var(--kywi-dur) var(--kywi-ease), color var(--kywi-dur) var(--kywi-ease);
+}
+.kywi-admin-shell .kywi-admin-picker-close:hover { background: var(--kywi-surface-sunken); color: var(--kywi-text); }
+.kywi-admin-shell .kywi-admin-picker-search { margin: var(--kywi-space-4) var(--kywi-space-5) 0; width: auto; }
+.kywi-admin-shell .kywi-admin-picker-list { overflow-y: auto; padding: var(--kywi-space-3) var(--kywi-space-4) var(--kywi-space-4); }
+.kywi-admin-shell .kywi-admin-picker-item {
+  display: flex; align-items: center; gap: var(--kywi-space-3); justify-content: space-between;
+  width: 100%; padding: 9px var(--kywi-space-3); text-align: left;
+  background: transparent; border: 1px solid transparent; border-radius: var(--kywi-radius);
+  cursor: pointer; color: var(--kywi-text); font-family: inherit; font-size: var(--kywi-text-base);
+  transition: background var(--kywi-dur) var(--kywi-ease), border-color var(--kywi-dur) var(--kywi-ease);
+}
+.kywi-admin-shell .kywi-admin-picker-item:hover { background: var(--kywi-surface-hover); border-color: var(--kywi-border); }
+.kywi-admin-shell .kywi-admin-picker-item-title { font-weight: var(--kywi-weight-medium); }
+.kywi-admin-shell .kywi-admin-picker-item-id,
+.kywi-admin-shell .kywi-admin-picker-item-status { font-size: var(--kywi-text-xs); color: var(--kywi-text-muted); }
+
+/* Confirm dialog */
+.kywi-admin-shell .kywi-confirm {
+  max-width: 420px;
+  padding: var(--kywi-space-6);
+  background: var(--kywi-surface);
+  border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-lg);
+  box-shadow: var(--kywi-shadow-lg);
+}
+.kywi-admin-shell .kywi-admin-confirm-text { margin-bottom: var(--kywi-space-5); color: var(--kywi-text-muted); line-height: var(--kywi-leading); }
+
+/* Lock banner */
+.kywi-admin-shell .kywi-lock-banner {
+  display: flex; align-items: center; gap: var(--kywi-space-3);
+  padding: var(--kywi-space-3) var(--kywi-space-4);
+  margin-bottom: var(--kywi-space-4);
+  background: var(--kywi-warning-bg);
+  border: 1px solid var(--kywi-warning-border);
+  border-radius: var(--kywi-radius-md);
+  color: var(--kywi-warning-fg);
+  font-size: var(--kywi-text-sm);
+}
+.kywi-admin-shell .kywi-lock-banner-text { font-weight: var(--kywi-weight-medium); }
+
+/* ---- Tag input -------------------------------------------------------- */
+.kywi-admin-shell .kywi-tag-input { position: relative; }
+.kywi-admin-shell .kywi-tag-list { display: flex; flex-wrap: wrap; gap: var(--kywi-space-2); margin-bottom: var(--kywi-space-2); }
+.kywi-admin-shell .kywi-tag {
+  display: inline-flex; align-items: center; gap: 5px;
+  padding: 3px 4px 3px 10px;
+  background: var(--kywi-accent-tint); color: var(--kywi-accent-tint-fg);
+  border: 1px solid var(--kywi-accent-border); border-radius: var(--kywi-radius-pill);
+  font-size: var(--kywi-text-xs); font-weight: var(--kywi-weight-medium);
+}
+.kywi-admin-shell .kywi-tag-remove {
+  display: inline-grid; place-content: center; width: 16px; height: 16px;
+  border: none; background: rgba(10, 87, 65, 0.12); color: var(--kywi-accent-tint-fg);
+  border-radius: var(--kywi-radius-pill); cursor: pointer; font-size: 11px; line-height: 1;
+}
+.kywi-admin-shell .kywi-tag-remove:hover { background: rgba(10, 87, 65, 0.24); }
+.kywi-admin-shell .kywi-tag-suggestions {
+  list-style: none; margin: var(--kywi-space-1) 0 0; padding: var(--kywi-space-1);
+  position: absolute; left: 0; right: 0; z-index: var(--kywi-z-dropdown);
+  background: var(--kywi-surface); border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-md); box-shadow: var(--kywi-shadow-md); max-height: 200px; overflow-y: auto;
+}
+.kywi-admin-shell .kywi-tag-suggestion {
+  display: block; width: 100%; padding: 6px 10px; text-align: left;
+  background: transparent; border: none; border-radius: var(--kywi-radius-sm);
+  cursor: pointer; font-family: inherit; font-size: var(--kywi-text-sm); color: var(--kywi-text);
+}
+.kywi-admin-shell .kywi-tag-suggestion:hover { background: var(--kywi-surface-hover); }
+
+/* ---- Related / relationship / media fields ---------------------------- */
+.kywi-admin-shell .kywi-related-list { list-style: none; margin: var(--kywi-space-3) 0 0; padding: 0; display: flex; flex-direction: column; gap: var(--kywi-space-2); }
+.kywi-admin-shell .kywi-related-item { display: flex; align-items: center; justify-content: space-between; gap: var(--kywi-space-3); }
+.kywi-admin-shell .kywi-related-id { font-family: var(--kywi-font-mono); font-size: var(--kywi-text-sm); color: var(--kywi-text-muted); }
+.kywi-admin-shell .kywi-relationship-field,
+.kywi-admin-shell .kywi-media-field { display: flex; align-items: center; gap: var(--kywi-space-2); flex-wrap: wrap; }
+.kywi-admin-shell .kywi-relationship-field .kywi-relationship-display { flex: 1; min-width: 160px; }
+.kywi-admin-shell .kywi-relationship-title { font-size: var(--kywi-text-sm); color: var(--kywi-text-muted); }
+/* Raw id caption shown beside a resolved relationship label (the id is the stored value). */
+.kywi-admin-shell .kywi-relationship-id {
+  flex-basis: 100%;
+  font-family: var(--kywi-font-mono);
+  font-size: var(--kywi-text-xs);
+  color: var(--kywi-text-subtle);
+}
+.kywi-admin-shell .kywi-media-selected { display: inline-flex; align-items: center; gap: var(--kywi-space-2); }
+.kywi-admin-shell .kywi-media-preview { width: 40px; height: 40px; object-fit: cover; border-radius: var(--kywi-radius); border: 1px solid var(--kywi-border); }
+.kywi-admin-shell .kywi-media-filename { font-size: var(--kywi-text-sm); }
+.kywi-admin-shell .kywi-media-empty { font-size: var(--kywi-text-sm); color: var(--kywi-text-subtle); }
+
+/* Media grid */
+.kywi-admin-shell .kywi-admin-media-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: var(--kywi-space-4); }
+.kywi-admin-shell .kywi-admin-media-item {
+  border: 1px solid var(--kywi-border); border-radius: var(--kywi-radius-md); overflow: hidden;
+  background: var(--kywi-surface); box-shadow: var(--kywi-shadow-xs); cursor: pointer;
+  transition: box-shadow var(--kywi-dur) var(--kywi-ease), border-color var(--kywi-dur) var(--kywi-ease);
+}
+.kywi-admin-shell .kywi-admin-media-item:hover { box-shadow: var(--kywi-shadow-md); border-color: var(--kywi-border-strong); }
+.kywi-admin-shell .kywi-admin-media-thumb,
+.kywi-admin-shell .kywi-admin-media-preview { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: var(--kywi-surface-sunken); display: block; }
+.kywi-admin-shell .kywi-admin-media-icon { display: grid; place-content: center; aspect-ratio: 4 / 3; background: var(--kywi-surface-sunken); color: var(--kywi-text-subtle); font-size: 24px; }
+.kywi-admin-shell .kywi-admin-media-filename { padding: var(--kywi-space-2) var(--kywi-space-3); font-size: var(--kywi-text-xs); color: var(--kywi-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+.kywi-admin-shell .kywi-admin-media-item-selected { border-color: var(--kywi-accent); box-shadow: 0 0 0 2px var(--kywi-accent-tint-strong), var(--kywi-shadow-md); }
+
+/* ---- Media Library ---------------------------------------------------- */
+.kywi-admin-shell .kywi-media-library { display: flex; flex-direction: column; }
+.kywi-admin-shell .kywi-media-header {
+  display: flex; align-items: flex-start; justify-content: space-between;
+  gap: var(--kywi-space-3); flex-wrap: wrap; margin-bottom: var(--kywi-space-5);
+}
+.kywi-admin-shell .kywi-media-title { margin: 0; font-size: var(--kywi-text-xl); font-weight: var(--kywi-weight-semibold); letter-spacing: var(--kywi-tracking-tight); }
+.kywi-admin-shell .kywi-media-subtitle { margin: 2px 0 0; font-size: var(--kywi-text-sm); color: var(--kywi-text-muted); }
+
+/* Dropzone */
+.kywi-admin-shell .kywi-media-dropzone {
+  display: flex; align-items: center; justify-content: center; gap: var(--kywi-space-3);
+  padding: var(--kywi-space-6); margin-bottom: var(--kywi-space-5);
+  text-align: center; cursor: pointer; color: var(--kywi-text-muted);
+  background: var(--kywi-surface-2);
+  border: 1.5px dashed var(--kywi-border-strong); border-radius: var(--kywi-radius-md);
+  transition: background var(--kywi-dur) var(--kywi-ease), border-color var(--kywi-dur) var(--kywi-ease), color var(--kywi-dur) var(--kywi-ease);
+}
+.kywi-admin-shell .kywi-media-dropzone:hover,
+.kywi-admin-shell .kywi-media-dropzone-emphasis { border-color: var(--kywi-accent-border); background: var(--kywi-accent-tint); color: var(--kywi-accent-tint-fg); }
+.kywi-admin-shell .kywi-media-dropzone-active { border-color: var(--kywi-accent); background: var(--kywi-accent-tint-strong); color: var(--kywi-accent-tint-fg); }
+.kywi-admin-shell .kywi-media-dropzone:focus-visible { outline: none; box-shadow: var(--kywi-ring); }
+.kywi-admin-shell .kywi-media-dropzone-icon { font-size: 22px; line-height: 1; }
+.kywi-admin-shell .kywi-media-dropzone-text { font-size: var(--kywi-text-base); }
+.kywi-admin-shell .kywi-media-dropzone-text strong { color: var(--kywi-text); font-weight: var(--kywi-weight-semibold); }
+.kywi-admin-shell .kywi-media-file-input { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); border: 0; }
+
+/* Upload progress list */
+.kywi-admin-shell .kywi-media-uploads { list-style: none; margin: 0 0 var(--kywi-space-5); padding: 0; display: flex; flex-direction: column; gap: var(--kywi-space-2); }
+.kywi-admin-shell .kywi-media-upload-row {
+  display: grid; grid-template-columns: minmax(0, 1fr) 160px 64px; align-items: center; gap: var(--kywi-space-3);
+  padding: var(--kywi-space-2) var(--kywi-space-3);
+  background: var(--kywi-surface); border: 1px solid var(--kywi-border); border-radius: var(--kywi-radius); font-size: var(--kywi-text-sm);
+}
+.kywi-admin-shell .kywi-media-upload-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--kywi-text); }
+.kywi-admin-shell .kywi-media-upload-bar { display: block; height: 6px; border-radius: var(--kywi-radius-pill); background: var(--kywi-surface-sunken); overflow: hidden; }
+.kywi-admin-shell .kywi-media-upload-bar-fill { display: block; height: 100%; background: var(--kywi-accent-solid); border-radius: var(--kywi-radius-pill); transition: width var(--kywi-dur) var(--kywi-ease); }
+.kywi-admin-shell .kywi-media-upload-status { text-align: right; font-size: var(--kywi-text-xs); color: var(--kywi-text-muted); font-variant-numeric: tabular-nums; }
+.kywi-admin-shell .kywi-media-upload-done .kywi-media-upload-bar-fill { background: var(--kywi-success-solid); }
+.kywi-admin-shell .kywi-media-upload-done .kywi-media-upload-status { color: var(--kywi-success-fg); }
+.kywi-admin-shell .kywi-media-upload-error .kywi-media-upload-bar-fill { background: var(--kywi-danger-solid); }
+.kywi-admin-shell .kywi-media-upload-error .kywi-media-upload-status { color: var(--kywi-danger-fg); }
+
+/* Toolbar tweaks */
+.kywi-admin-shell .kywi-media-result-count { font-size: var(--kywi-text-sm); color: var(--kywi-text-muted); }
+
+/* Loading / error */
+.kywi-admin-shell .kywi-media-loading {
+  display: flex; align-items: center; justify-content: center; gap: var(--kywi-space-3);
+  padding: var(--kywi-space-12) var(--kywi-space-6); color: var(--kywi-text-muted); font-size: var(--kywi-text-base);
+}
+.kywi-admin-shell .kywi-media-spinner {
+  display: inline-block; width: 18px; height: 18px;
+  border: 2px solid var(--kywi-border-strong); border-top-color: var(--kywi-accent);
+  border-radius: var(--kywi-radius-pill); animation: kywi-spin 0.7s linear infinite;
+}
+.kywi-admin-shell .kywi-media-error {
+  padding: var(--kywi-space-8) var(--kywi-space-6); text-align: center;
+  background: var(--kywi-danger-bg); color: var(--kywi-danger-fg);
+  border: 1px solid var(--kywi-danger-border); border-radius: var(--kywi-radius-md);
+}
+.kywi-admin-shell .kywi-media-error p { margin: 0 0 var(--kywi-space-4); }
+
+/* Empty state (reuses the dashed-card look, adds an action button) */
+.kywi-admin-shell .kywi-media-empty {
+  padding: var(--kywi-space-12) var(--kywi-space-6); text-align: center;
+  color: var(--kywi-text-muted); font-size: var(--kywi-text-base);
+  background: var(--kywi-surface); border: 1px dashed var(--kywi-border-strong); border-radius: var(--kywi-radius-md);
+}
+.kywi-admin-shell .kywi-media-empty p { margin: 0 0 var(--kywi-space-4); }
+
+/* Pagination */
+.kywi-admin-shell .kywi-media-pagination { display: flex; align-items: center; justify-content: center; gap: var(--kywi-space-4); margin-top: var(--kywi-space-5); }
+.kywi-admin-shell .kywi-media-page-info { font-size: var(--kywi-text-sm); color: var(--kywi-text-muted); font-variant-numeric: tabular-nums; }
+
+/* Detail modal */
+.kywi-admin-shell .kywi-media-detail-modal { max-width: 820px; }
+.kywi-admin-shell .kywi-media-detail-body {
+  display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
+  gap: var(--kywi-space-5); padding: var(--kywi-space-5); overflow-y: auto;
+}
+.kywi-admin-shell .kywi-media-detail-preview {
+  display: flex; align-items: center; justify-content: center;
+  background: var(--kywi-surface-sunken); border: 1px solid var(--kywi-border); border-radius: var(--kywi-radius-md);
+  overflow: hidden; min-height: 220px;
+}
+.kywi-admin-shell .kywi-media-detail-preview img { max-width: 100%; max-height: 420px; object-fit: contain; display: block; }
+.kywi-admin-shell .kywi-media-detail-icon { font-size: 64px; color: var(--kywi-text-subtle); }
+.kywi-admin-shell .kywi-media-detail-meta { display: flex; flex-direction: column; gap: var(--kywi-space-4); min-width: 0; }
+.kywi-admin-shell .kywi-media-meta-list { margin: 0; display: flex; flex-direction: column; gap: var(--kywi-space-2); }
+.kywi-admin-shell .kywi-media-meta-row { display: grid; grid-template-columns: 96px minmax(0, 1fr); align-items: center; gap: var(--kywi-space-3); }
+.kywi-admin-shell .kywi-media-meta-row dt { font-size: var(--kywi-text-xs); font-weight: var(--kywi-weight-semibold); color: var(--kywi-text-subtle); text-transform: uppercase; letter-spacing: var(--kywi-tracking-caps); }
+.kywi-admin-shell .kywi-media-meta-row dd { margin: 0; font-size: var(--kywi-text-sm); color: var(--kywi-text); overflow: hidden; text-overflow: ellipsis; }
+
+/* URL / rendition rows */
+.kywi-admin-shell .kywi-media-urls { display: flex; flex-direction: column; gap: var(--kywi-space-2); }
+.kywi-admin-shell .kywi-media-url-row {
+  display: grid; grid-template-columns: minmax(0, auto) minmax(0, 1fr) auto; align-items: center; gap: var(--kywi-space-2);
+  padding: var(--kywi-space-2); background: var(--kywi-surface-sunken); border: 1px solid var(--kywi-border); border-radius: var(--kywi-radius-sm);
+}
+.kywi-admin-shell .kywi-media-url-label { font-size: var(--kywi-text-xs); font-weight: var(--kywi-weight-semibold); color: var(--kywi-text-muted); white-space: nowrap; }
+.kywi-admin-shell .kywi-media-url-value { font-family: var(--kywi-font-mono); font-size: var(--kywi-text-xs); color: var(--kywi-text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.kywi-admin-shell .kywi-media-copy-btn { white-space: nowrap; }
+.kywi-admin-shell .kywi-media-meta-edit { display: flex; flex-direction: column; gap: var(--kywi-space-2); padding-top: var(--kywi-space-2); border-top: 1px solid var(--kywi-border); }
+.kywi-admin-shell .kywi-media-meta-edit .kywi-field { margin-bottom: 0; }
+.kywi-admin-shell .kywi-media-detail-footer {
+  display: flex; align-items: center; justify-content: flex-end; gap: var(--kywi-space-2);
+  padding: var(--kywi-space-4) var(--kywi-space-5); border-top: 1px solid var(--kywi-border);
+}
+
+@media (max-width: 720px) {
+  .kywi-admin-shell .kywi-media-detail-body { grid-template-columns: 1fr; }
+  .kywi-admin-shell .kywi-media-upload-row { grid-template-columns: minmax(0, 1fr) 90px 56px; }
+}
+
+/* ---- Form builder ----------------------------------------------------- */
+.kywi-admin-shell .kywi-form-builder,
+.kywi-admin-shell .kywi-form-builder-body { display: grid; grid-template-columns: 220px 1fr 260px; gap: var(--kywi-space-4); align-items: start; }
+.kywi-admin-shell .kywi-form-builder-palette,
+.kywi-admin-shell .kywi-form-builder-canvas,
+.kywi-admin-shell .kywi-form-builder-settings,
+.kywi-admin-shell .kywi-form-builder-preview {
+  padding: var(--kywi-space-4); background: var(--kywi-surface);
+  border: 1px solid var(--kywi-border); border-radius: var(--kywi-radius-md); box-shadow: var(--kywi-shadow-sm);
+}
+.kywi-admin-shell .kywi-form-builder-palette-item {
+  display: flex; align-items: center; gap: var(--kywi-space-2);
+  padding: 7px 10px; margin-bottom: 4px; border-radius: var(--kywi-radius);
+  border: 1px solid var(--kywi-border); background: var(--kywi-surface-2);
+  cursor: grab; font-size: var(--kywi-text-sm); user-select: none;
+  transition: background var(--kywi-dur) var(--kywi-ease), border-color var(--kywi-dur) var(--kywi-ease);
+}
+.kywi-admin-shell .kywi-form-builder-palette-item:hover { background: var(--kywi-accent-tint); border-color: var(--kywi-accent-border); }
+.kywi-admin-shell .kywi-form-builder-palette-group-title { font-size: var(--kywi-text-xs); font-weight: var(--kywi-weight-bold); text-transform: uppercase; letter-spacing: var(--kywi-tracking-caps); color: var(--kywi-text-subtle); margin: var(--kywi-space-3) 0 var(--kywi-space-2); }
+.kywi-admin-shell .kywi-form-builder-field-drag-handle { color: var(--kywi-text-subtle); cursor: grab; }
+.kywi-admin-shell .kywi-form-builder-field-required { color: var(--kywi-danger-fg); }
+/* Canvas field row: separate the type from the label so they don't run together
+   ("emailEmail"). Type reads as a small badge; the label takes the middle. */
+.kywi-admin-shell .kywi-form-builder-field-item {
+  display: flex; align-items: center; gap: var(--kywi-space-3);
+}
+.kywi-admin-shell .kywi-form-builder-field-type {
+  flex-shrink: 0; padding: 2px 8px; border-radius: var(--kywi-radius-sm);
+  background: var(--kywi-accent-tint); color: var(--kywi-accent-tint-fg);
+  border: 1px solid var(--kywi-accent-border);
+  font-family: var(--kywi-font-mono); font-size: var(--kywi-text-xs);
+  font-weight: var(--kywi-weight-semibold);
+}
+.kywi-admin-shell .kywi-form-builder-field-label { flex: 1; min-width: 0; font-weight: var(--kywi-weight-medium); }
+
+/* ---- Rule tester / trace ---------------------------------------------- */
+.kywi-admin-shell .kywi-admin-rule-tester-layout { display: grid; grid-template-columns: 1fr 1fr; gap: var(--kywi-space-4); align-items: start; }
+.kywi-admin-shell .kywi-admin-trace-pass,
+.kywi-admin-shell .kywi-admin-trace-group-pass { color: var(--kywi-success-fg); }
+.kywi-admin-shell .kywi-admin-trace-fail,
+.kywi-admin-shell .kywi-admin-trace-group-fail { color: var(--kywi-danger-fg); }
+.kywi-admin-shell .kywi-admin-trace-indicator { display: inline-block; width: 8px; height: 8px; flex-shrink: 0; border-radius: var(--kywi-radius-pill); background: currentColor; overflow: hidden; text-indent: -9999px; }
+.kywi-admin-shell .kywi-admin-trace-score,
+.kywi-admin-shell .kywi-admin-trace-score-contrib { font-family: var(--kywi-font-mono); font-size: var(--kywi-text-sm); }
+/* Result panel layout — keep the "Matched" verdict and score from colliding,
+   and give each condition row breathing room. */
+.kywi-admin-shell .kywi-admin-trace { display: flex; flex-direction: column; gap: var(--kywi-space-3); }
+.kywi-admin-shell .kywi-admin-trace-header {
+  display: flex; align-items: baseline; gap: var(--kywi-space-3);
+  padding-bottom: var(--kywi-space-2); border-bottom: 1px solid var(--kywi-border);
+}
+.kywi-admin-shell .kywi-admin-trace-result { font-weight: var(--kywi-weight-semibold); }
+.kywi-admin-shell .kywi-admin-trace-matched .kywi-admin-trace-result { color: var(--kywi-success-fg); }
+.kywi-admin-shell .kywi-admin-trace-unmatched .kywi-admin-trace-result { color: var(--kywi-danger-fg); }
+.kywi-admin-shell .kywi-admin-trace-group h4 { margin: 0 0 var(--kywi-space-2); font-size: var(--kywi-text-sm); }
+.kywi-admin-shell .kywi-admin-trace-conditions {
+  list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--kywi-space-1);
+}
+.kywi-admin-shell .kywi-admin-trace-conditions li {
+  display: flex; align-items: center; gap: var(--kywi-space-2); font-size: var(--kywi-text-sm);
+}
+.kywi-admin-shell .kywi-admin-trace-condition-id { flex: 1; min-width: 0; word-break: break-word; }
+.kywi-admin-shell .kywi-admin-trace-score-contrib { margin-left: auto; white-space: nowrap; }
+.kywi-admin-shell .kywi-admin-rule-tester-signals,
+.kywi-admin-shell .kywi-admin-rule-tester-results { display: flex; flex-direction: column; gap: var(--kywi-space-4); }
+.kywi-admin-shell .kywi-admin-rule-tester-results { position: sticky; top: var(--kywi-space-4); }
+.kywi-admin-shell .kywi-admin-signal-group {
+  margin: 0;
+  padding: var(--kywi-space-4);
+  display: flex; flex-direction: column; gap: var(--kywi-space-3);
+  background: var(--kywi-surface);
+  border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-md);
+}
+.kywi-admin-shell .kywi-admin-signal-group legend {
+  padding: 0 var(--kywi-space-2);
+  font-size: var(--kywi-text-xs); font-weight: var(--kywi-weight-semibold);
+  text-transform: uppercase; letter-spacing: var(--kywi-tracking-caps);
+  color: var(--kywi-text-muted);
+}
+
+/* ---- Personalization surfaces: audiences / self-ID / preview (W3c) ---- */
+.kywi-admin-shell .kywi-admin-audience-editor,
+.kywi-admin-shell .kywi-admin-audience-detail,
+.kywi-admin-shell .kywi-admin-selfid-fields,
+.kywi-admin-shell .kywi-admin-selfid-widget-builder,
+.kywi-admin-shell .kywi-admin-preview-tokens { display: flex; flex-direction: column; gap: var(--kywi-space-6); }
+.kywi-admin-shell .kywi-admin-condition-builder { display: flex; flex-direction: column; gap: var(--kywi-space-4); }
+
+.kywi-admin-shell .kywi-selfid-editor { display: flex; flex-direction: column; gap: var(--kywi-space-2); }
+.kywi-admin-shell .kywi-selfid-row { display: flex; align-items: center; gap: var(--kywi-space-2); }
+
+.kywi-admin-shell .kywi-admin-widget-builder-layout {
+  display: grid; grid-template-columns: 1fr 1fr; gap: var(--kywi-space-6); align-items: start;
+}
+.kywi-admin-shell .kywi-admin-widget-builder-form { display: flex; flex-direction: column; gap: var(--kywi-space-6); }
+.kywi-admin-shell .kywi-admin-widget-builder-preview { position: sticky; top: var(--kywi-space-4); display: flex; flex-direction: column; gap: var(--kywi-space-3); }
+.kywi-admin-shell .kywi-admin-widget-field-list { display: flex; flex-direction: column; gap: var(--kywi-space-2); }
+.kywi-admin-shell .kywi-admin-widget-preview {
+  padding: var(--kywi-space-5);
+  background: var(--kywi-surface-sunken);
+  border: 1px dashed var(--kywi-border-strong);
+  border-radius: var(--kywi-radius-md);
+}
+.kywi-admin-shell .kywi-admin-widget-preview-inner { display: flex; flex-direction: column; gap: var(--kywi-space-3); }
+.kywi-admin-shell .kywi-admin-widget-preview-headline { margin: 0; font-size: var(--kywi-text-lg); font-weight: var(--kywi-weight-bold); color: var(--kywi-text); }
+.kywi-admin-shell .kywi-admin-widget-preview-subheadline { margin: 0; color: var(--kywi-text-muted); }
+.kywi-admin-shell .kywi-admin-widget-preview-fields { display: flex; flex-direction: column; gap: var(--kywi-space-3); }
+.kywi-admin-shell .kywi-admin-widget-preview-field { display: flex; flex-direction: column; gap: 4px; }
+.kywi-admin-shell .kywi-admin-widget-preview-actions { display: flex; gap: var(--kywi-space-2); }
+
+/* Freshly-issued preview link callout */
+.kywi-admin-shell .kywi-admin-preview-link {
+  display: flex; align-items: center; gap: var(--kywi-space-3); flex-wrap: wrap;
+  padding: var(--kywi-space-3) var(--kywi-space-4);
+  background: var(--kywi-accent-tint);
+  border: 1px solid var(--kywi-accent-border);
+  border-radius: var(--kywi-radius-md);
+}
+.kywi-admin-shell .kywi-admin-preview-link code {
+  flex: 1; min-width: 0; overflow-x: auto; white-space: nowrap;
+  font-family: var(--kywi-font-mono); font-size: var(--kywi-text-sm); color: var(--kywi-text);
+}
+
+/* Inline table action links + a flex row for grouped buttons */
+.kywi-admin-shell .kywi-admin-button-row { display: flex; align-items: center; gap: var(--kywi-space-2); flex-wrap: wrap; }
+.kywi-admin-shell .kywi-admin-action-link {
+  padding: 0; background: none; border: none; cursor: pointer; font-family: inherit;
+  font-size: var(--kywi-text-sm); font-weight: var(--kywi-weight-medium);
+  color: var(--kywi-accent); text-decoration: none;
+}
+.kywi-admin-shell .kywi-admin-action-link:hover { text-decoration: underline; }
+.kywi-admin-shell .kywi-admin-action-link + .kywi-admin-action-link { margin-left: var(--kywi-space-3); }
+.kywi-admin-shell .kywi-admin-action-danger { color: var(--kywi-danger-fg); }
+
+@media (max-width: 860px) {
+  .kywi-admin-shell .kywi-admin-rule-tester-layout,
+  .kywi-admin-shell .kywi-admin-widget-builder-layout { grid-template-columns: 1fr; }
+  .kywi-admin-shell .kywi-admin-rule-tester-results,
+  .kywi-admin-shell .kywi-admin-widget-builder-preview { position: static; }
+}
+
+/* ---- Rich text (tiptap) ----------------------------------------------- */
+.kywi-admin-shell .kywi-tiptap,
+.kywi-admin-shell .kywi-richtext {
+  background: var(--kywi-surface); border: 1px solid var(--kywi-border-input);
+  border-radius: var(--kywi-radius); overflow: hidden;
+}
+.kywi-admin-shell .kywi-tiptap:focus-within,
+.kywi-admin-shell .kywi-richtext:focus-within { border-color: var(--kywi-accent); box-shadow: var(--kywi-ring); }
+.kywi-admin-shell .kywi-tiptap-toolbar {
+  display: flex; flex-wrap: wrap; gap: 2px;
+  padding: 6px var(--kywi-space-2); background: var(--kywi-surface-2);
+  border-bottom: 1px solid var(--kywi-border);
+}
+.kywi-admin-shell .kywi-tiptap-toolbar button {
+  min-width: 28px; height: 28px; padding: 0 6px;
+  background: transparent; border: 1px solid transparent; border-radius: var(--kywi-radius-sm);
+  color: var(--kywi-text-muted); cursor: pointer; font-size: var(--kywi-text-sm); font-family: inherit;
+}
+.kywi-admin-shell .kywi-tiptap-toolbar button:hover { background: var(--kywi-surface-hover); color: var(--kywi-text); }
+.kywi-admin-shell .kywi-tiptap-toolbar button.is-active { background: var(--kywi-accent-tint); color: var(--kywi-accent-tint-fg); border-color: var(--kywi-accent-border); }
+.kywi-admin-shell .kywi-tiptap-content { padding: var(--kywi-space-3) var(--kywi-space-4); min-height: 160px; line-height: var(--kywi-leading); }
+.kywi-admin-shell .kywi-tiptap-content:focus { outline: none; }
+
+/* ---- Extension / plugin / settings meta bits -------------------------- */
+.kywi-admin-shell .kywi-admin-extension-groups,
+.kywi-admin-shell .kywi-admin-extension-subtype-list,
+.kywi-admin-shell .kywi-admin-extension-attribute-list,
+.kywi-admin-shell .kywi-admin-plugin-list,
+.kywi-admin-shell .kywi-admin-audience-list,
+.kywi-admin-shell .kywi-changeset-list,
+.kywi-admin-shell .kywi-approval-list,
+.kywi-admin-shell .kywi-trash-list,
+.kywi-admin-shell .kywi-user-list,
+.kywi-admin-shell .kywi-variant-list,
+.kywi-admin-shell .kywi-admin-oauth-uri-list { display: flex; flex-direction: column; gap: var(--kywi-space-2); }
+.kywi-admin-shell .kywi-admin-extension-attribute,
+.kywi-admin-shell .kywi-admin-extension-set,
+.kywi-admin-shell .kywi-admin-oauth-scope-label,
+.kywi-admin-shell .kywi-admin-apikey-scope-label {
+  display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px;
+  background: var(--kywi-surface-sunken); border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-sm); font-size: var(--kywi-text-xs); color: var(--kywi-text-muted);
+}
+.kywi-admin-shell .kywi-admin-plugin-toggle,
+.kywi-admin-shell .kywi-admin-settings-module-toggle { display: inline-flex; align-items: center; gap: var(--kywi-space-2); }
+.kywi-admin-shell .kywi-admin-plugin-meta,
+.kywi-admin-shell .kywi-admin-plugin-package,
+.kywi-admin-shell .kywi-admin-extension-subtype-meta,
+.kywi-admin-shell .kywi-admin-extension-subtype-base { font-size: var(--kywi-text-xs); color: var(--kywi-text-muted); }
+.kywi-admin-shell .kywi-admin-plugin-name,
+.kywi-admin-shell .kywi-admin-extension-subtype-name,
+.kywi-admin-shell .kywi-admin-audience-name,
+.kywi-admin-shell .kywi-admin-oauth-count,
+.kywi-admin-shell .kywi-admin-apikey-count { font-weight: var(--kywi-weight-semibold); }
+.kywi-admin-shell .kywi-admin-plugin-count,
+.kywi-admin-shell .kywi-admin-extension-count,
+.kywi-admin-shell .kywi-admin-condition-count { font-size: var(--kywi-text-xs); color: var(--kywi-text-muted); }
+/* Subtype header: name + base + status ran together
+   ("catalog_productcontentActive"). Lay them out with gaps and turn base/status
+   into distinct badges. */
+.kywi-admin-shell .kywi-admin-extension-subtype-meta {
+  display: flex; align-items: center; gap: var(--kywi-space-2); flex-wrap: wrap;
+}
+.kywi-admin-shell .kywi-admin-extension-subtype-name { color: var(--kywi-text); font-size: var(--kywi-text-base); }
+.kywi-admin-shell .kywi-admin-extension-subtype-base {
+  padding: 1px 7px; border-radius: var(--kywi-radius-sm);
+  background: var(--kywi-surface-sunken); border: 1px solid var(--kywi-border);
+  font-family: var(--kywi-font-mono); font-size: var(--kywi-text-xs); color: var(--kywi-text-muted);
+}
+.kywi-admin-shell .kywi-admin-extension-subtype-status {
+  padding: 1px 8px; border-radius: var(--kywi-radius-pill);
+  font-size: var(--kywi-text-xs); font-weight: var(--kywi-weight-semibold);
+  border: 1px solid transparent;
+}
+.kywi-admin-shell .kywi-admin-extension-subtype-status-active {
+  background: var(--kywi-success-bg); color: var(--kywi-success-fg); border-color: var(--kywi-success-border);
+}
+.kywi-admin-shell .kywi-admin-extension-subtype-status-inactive {
+  background: var(--kywi-neutral-bg); color: var(--kywi-neutral-fg); border-color: var(--kywi-neutral-border);
+}
+
+/* ---- Plugins: hooks + version (W4d) ----------------------------------- */
+.kywi-admin-shell .kywi-admin-plugin-name { display: inline-flex; align-items: baseline; gap: var(--kywi-space-2); }
+.kywi-admin-shell .kywi-admin-plugin-version {
+  font-size: var(--kywi-text-xs); font-weight: var(--kywi-weight-normal);
+  color: var(--kywi-text-muted); font-variant-numeric: tabular-nums;
+}
+.kywi-admin-shell .kywi-admin-plugin-hooks { margin-top: var(--kywi-space-3); }
+.kywi-admin-shell .kywi-admin-plugin-hooks-label,
+.kywi-admin-shell .kywi-admin-plugin-sites-label,
+.kywi-admin-shell .kywi-admin-plugin-config-label {
+  margin: 0 0 var(--kywi-space-2); font-size: var(--kywi-text-xs);
+  font-weight: var(--kywi-weight-semibold); text-transform: uppercase;
+  letter-spacing: var(--kywi-tracking-caps); color: var(--kywi-text-muted);
+}
+.kywi-admin-shell .kywi-admin-plugin-hooks-list {
+  list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--kywi-space-2);
+}
+.kywi-admin-shell .kywi-admin-plugin-hook code {
+  display: inline-block; padding: 2px 8px; font-size: var(--kywi-text-xs);
+  background: var(--kywi-accent-tint); color: var(--kywi-accent-tint-fg);
+  border: 1px solid var(--kywi-accent-border); border-radius: var(--kywi-radius-pill);
+}
+
+/* ---- Reveal-once secret modal (OAuth secret / API key) (W4d) ----------- */
+.kywi-admin-shell .kywi-admin-secret-modal {
+  width: 100%; max-width: 560px; max-height: 82vh; display: flex; flex-direction: column;
+  overflow: hidden; background: var(--kywi-surface); border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-lg); box-shadow: var(--kywi-shadow-lg); z-index: var(--kywi-z-modal);
+  animation: kywi-pop-in var(--kywi-dur-slow) var(--kywi-ease-out);
+}
+.kywi-admin-shell .kywi-admin-secret-modal-body { padding: var(--kywi-space-5); display: flex; flex-direction: column; gap: var(--kywi-space-4); overflow-y: auto; }
+.kywi-admin-shell .kywi-admin-secret-warning {
+  display: flex; gap: var(--kywi-space-2); padding: var(--kywi-space-3) var(--kywi-space-4);
+  background: var(--kywi-warning-bg); border: 1px solid var(--kywi-warning-border);
+  border-radius: var(--kywi-radius-md); color: var(--kywi-warning-fg); font-size: var(--kywi-text-sm);
+  line-height: var(--kywi-leading);
+}
+.kywi-admin-shell .kywi-admin-secret-field { display: flex; gap: var(--kywi-space-2); align-items: stretch; }
+.kywi-admin-shell .kywi-admin-secret-value {
+  flex: 1; padding: var(--kywi-space-3); font-family: var(--kywi-font-mono); font-size: var(--kywi-text-sm);
+  background: var(--kywi-surface-sunken); border: 1px solid var(--kywi-border); border-radius: var(--kywi-radius);
+  overflow-x: auto; white-space: nowrap; word-break: keep-all; user-select: all;
+}
+.kywi-admin-shell .kywi-admin-secret-actions { display: flex; justify-content: flex-end; gap: var(--kywi-space-2); }
+
+/* ---- Version history table row action --------------------------------- */
+.kywi-admin-shell .kywi-changeset-schedule { display: inline-flex; align-items: center; gap: var(--kywi-space-2); }
+
+/* ---- Site switcher / locale switcher ---------------------------------- */
+.kywi-admin-shell .kywi-admin-site-switcher,
+.kywi-admin-shell .kywi-admin-locale-switcher { display: inline-flex; align-items: center; gap: var(--kywi-space-2); }
+
+/* ==========================================================================
+   7. UTILITIES
+   ========================================================================== */
+.kywi-admin-shell .kywi-text-muted,
+.kywi-admin-shell .kywi-admin-field-id,
+.kywi-admin-shell .kywi-admin-token-jti,
+.kywi-admin-shell .kywi-admin-diff-note { color: var(--kywi-text-muted); }
+.kywi-admin-shell .kywi-admin-field-id,
+.kywi-admin-shell .kywi-admin-token-jti,
+.kywi-admin-shell .kywi-json,
+.kywi-admin-shell .kywi-submission-data-preview { font-family: var(--kywi-font-mono); font-size: var(--kywi-text-sm); }
+.kywi-admin-shell .kywi-submission-data-preview {
+  display: block; padding: var(--kywi-space-3); background: var(--kywi-surface-sunken);
+  border: 1px solid var(--kywi-border); border-radius: var(--kywi-radius); overflow-x: auto; white-space: pre-wrap; word-break: break-word;
+}
+
+/* Loading skeletons */
+.kywi-admin-shell .kywi-skeleton,
+.kywi-admin-shell .kywi-skeleton-text,
+.kywi-admin-shell .kywi-skeleton-row {
+  position: relative;
+  overflow: hidden;
+  background: var(--kywi-surface-sunken);
+  border-radius: var(--kywi-radius);
+}
+.kywi-admin-shell .kywi-skeleton-text { height: 12px; margin: 6px 0; }
+.kywi-admin-shell .kywi-skeleton-row { height: 44px; margin-bottom: 6px; }
+.kywi-admin-shell .kywi-skeleton::after,
+.kywi-admin-shell .kywi-skeleton-text::after,
+.kywi-admin-shell .kywi-skeleton-row::after {
+  content: "";
+  position: absolute; inset: 0;
+  transform: translateX(-100%);
+  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.65), transparent);
+  animation: kywi-shimmer 1.4s var(--kywi-ease) infinite;
+}
+
+/* Spinner */
+.kywi-admin-shell .kywi-spinner {
+  display: inline-block; width: 16px; height: 16px;
+  border: 2px solid var(--kywi-border-strong);
+  border-top-color: var(--kywi-accent);
+  border-radius: var(--kywi-radius-pill);
+  animation: kywi-spin 0.7s linear infinite;
+}
+
+/* ---- Async states: loading / error / callout -------------------------- */
+.kywi-admin-shell .kywi-admin-loading {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--kywi-space-3);
+  padding: var(--kywi-space-12) var(--kywi-space-6);
+  color: var(--kywi-text-muted);
+  font-size: var(--kywi-text-base);
+}
+.kywi-admin-shell .kywi-admin-error {
+  display: flex;
+  align-items: center;
+  gap: var(--kywi-space-4);
+  flex-wrap: wrap;
+  padding: var(--kywi-space-4) var(--kywi-space-5);
+  margin-bottom: var(--kywi-space-5);
+  background: var(--kywi-danger-bg);
+  border: 1px solid var(--kywi-danger-border);
+  border-radius: var(--kywi-radius-md);
+  color: var(--kywi-danger-fg);
+}
+.kywi-admin-shell .kywi-admin-error-message { margin: 0; font-weight: var(--kywi-weight-medium); }
+
+.kywi-admin-shell .kywi-admin-callout {
+  padding: var(--kywi-space-4) var(--kywi-space-5);
+  margin-bottom: var(--kywi-space-5);
+  border: 1px solid var(--kywi-border);
+  border-left-width: 3px;
+  border-radius: var(--kywi-radius-md);
+  background: var(--kywi-surface);
+  color: var(--kywi-text-muted);
+  font-size: var(--kywi-text-base);
+  line-height: var(--kywi-leading);
+}
+.kywi-admin-shell .kywi-admin-callout p { margin: 0; }
+.kywi-admin-shell .kywi-admin-callout strong { color: var(--kywi-text); }
+.kywi-admin-shell .kywi-admin-callout-info { border-left-color: var(--kywi-accent); background: var(--kywi-accent-tint); }
+.kywi-admin-shell .kywi-admin-callout-success { border-left-color: var(--kywi-success-border); background: var(--kywi-success-bg); color: var(--kywi-success-fg); }
+.kywi-admin-shell .kywi-admin-callout-danger { border-left-color: var(--kywi-danger-border); background: var(--kywi-danger-bg); color: var(--kywi-danger-fg); }
+
+/* ---- Group manager (master-detail) ------------------------------------ */
+.kywi-admin-shell .kywi-group-manager-body {
+  display: grid;
+  grid-template-columns: minmax(220px, 300px) 1fr;
+  gap: var(--kywi-space-6);
+  align-items: start;
+}
+@media (max-width: 860px) {
+  .kywi-admin-shell .kywi-group-manager-body { grid-template-columns: 1fr; }
+}
+.kywi-admin-shell .kywi-group-list-items { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--kywi-space-1); }
+.kywi-admin-shell .kywi-group-list-item {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  padding: var(--kywi-space-3) var(--kywi-space-4);
+  text-align: left;
+  background: var(--kywi-surface);
+  border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-md);
+  cursor: pointer;
+  transition: background var(--kywi-dur) var(--kywi-ease), border-color var(--kywi-dur) var(--kywi-ease);
+}
+.kywi-admin-shell .kywi-group-list-item:hover { background: var(--kywi-surface-hover); border-color: var(--kywi-border-strong); }
+.kywi-admin-shell .kywi-group-list-item-active {
+  background: var(--kywi-accent-tint);
+  border-color: var(--kywi-accent-border);
+}
+.kywi-admin-shell .kywi-group-list-name { font-weight: var(--kywi-weight-semibold); color: var(--kywi-text); }
+.kywi-admin-shell .kywi-group-list-meta { display: inline-flex; align-items: center; gap: var(--kywi-space-2); }
+.kywi-admin-shell .kywi-group-member-count { font-size: var(--kywi-text-xs); color: var(--kywi-text-muted); }
+
+.kywi-admin-shell .kywi-group-detail-inner { display: flex; flex-direction: column; gap: var(--kywi-space-5); }
+.kywi-admin-shell .kywi-group-member-list { list-style: none; margin: 0 0 var(--kywi-space-4); padding: 0; display: flex; flex-direction: column; gap: var(--kywi-space-1); }
+.kywi-admin-shell .kywi-group-member-row {
+  display: flex;
+  align-items: center;
+  gap: var(--kywi-space-3);
+  padding: var(--kywi-space-2) var(--kywi-space-3);
+  border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius);
+  background: var(--kywi-surface-2);
+}
+.kywi-admin-shell .kywi-group-member-name { font-weight: var(--kywi-weight-medium); }
+.kywi-admin-shell .kywi-group-member-email { font-size: var(--kywi-text-sm); }
+.kywi-admin-shell .kywi-group-member-row .kywi-btn { margin-left: auto; }
+.kywi-admin-shell .kywi-group-members-empty { margin: 0 0 var(--kywi-space-4); }
+.kywi-admin-shell .kywi-group-add-member { display: flex; align-items: center; gap: var(--kywi-space-2); }
+.kywi-admin-shell .kywi-group-add-member-select { flex: 1; min-width: 0; }
+
+/* ---- Permissions info ------------------------------------------------- */
+.kywi-admin-shell .kywi-role-glossary { margin: 0; display: flex; flex-direction: column; gap: var(--kywi-space-3); }
+.kywi-admin-shell .kywi-role-glossary-row { display: grid; grid-template-columns: 120px 1fr; align-items: baseline; gap: var(--kywi-space-4); }
+.kywi-admin-shell .kywi-role-glossary-row dt { margin: 0; }
+.kywi-admin-shell .kywi-role-glossary-row dd { margin: 0; color: var(--kywi-text-muted); }
+@media (max-width: 620px) {
+  .kywi-admin-shell .kywi-role-glossary-row { grid-template-columns: 1fr; gap: var(--kywi-space-1); }
+}
+/* `overflow-x: auto` alone is enough to make wide admin tables scrollable, but
+   many browsers (macOS overlay scrollbars in particular) render no visible
+   scrollbar at all until the user actively hovers/drags — on first load a
+   clipped column just reads as "cut off", not "scroll for more". Two cues,
+   layered:
+   1. A slim, always-rendered scrollbar track (where the platform allows it —
+      overlay-scrollbar platforms still fall back to the badge below).
+   2. A small "Scroll →" badge pinned to the top-right corner of the scroll
+      container on first render, so the affordance doesn't depend on the
+      scrollbar rendering at all. Shown wherever a table is *known* to run
+      wide: the `<1024px` admin breakpoint (every `kywi-table-scroll` table
+      gets a forced `min-width` there — see below) and any table explicitly
+      flagged `kywi-table-scroll--wide` (e.g. the permissions matrix, which
+      overflows even at desktop widths). */
+.kywi-admin-shell .kywi-table-scroll {
+  position: relative;
+  overflow-x: auto;
+  scrollbar-width: thin;
+  scrollbar-color: var(--kywi-border) transparent;
+}
+.kywi-admin-shell .kywi-table-scroll::-webkit-scrollbar {
+  height: 8px;
+}
+.kywi-admin-shell .kywi-table-scroll::-webkit-scrollbar-track {
+  background: transparent;
+}
+.kywi-admin-shell .kywi-table-scroll::-webkit-scrollbar-thumb {
+  background: var(--kywi-border);
+  border-radius: 4px;
+}
+.kywi-admin-shell .kywi-table-scroll::-webkit-scrollbar-thumb:hover {
+  background: var(--kywi-text-muted);
+}
+.kywi-admin-shell .kywi-table-scroll--wide::after {
+  content: "Scroll for more \2192";
+  position: absolute;
+  top: 8px;
+  right: 8px;
+  z-index: 1;
+  padding: 2px 9px;
+  border-radius: 999px;
+  background: var(--kywi-scroll-shadow);
+  color: #fff;
+  font-size: var(--kywi-text-xs);
+  font-weight: var(--kywi-weight-medium);
+  letter-spacing: 0.01em;
+  pointer-events: none;
+  white-space: nowrap;
+}
+.kywi-admin-shell .kywi-permissions-matrix .kywi-perm-col,
+.kywi-admin-shell .kywi-permissions-matrix .kywi-perm-cell { text-align: center; }
+.kywi-admin-shell .kywi-perm-yes { color: var(--kywi-success-fg); font-weight: var(--kywi-weight-bold); }
+.kywi-admin-shell .kywi-perm-no { color: var(--kywi-text-subtle); }
+
+/* Grouped (two-tier) capability-matrix header + row headers */
+.kywi-admin-shell .kywi-permissions-matrix .kywi-perm-group {
+  text-align: center;
+  font-size: var(--kywi-text-xs);
+  text-transform: uppercase;
+  letter-spacing: 0.04em;
+  color: var(--kywi-text-muted);
+  border-left: 1px solid var(--kywi-border);
+  border-right: 1px solid var(--kywi-border);
+}
+.kywi-admin-shell .kywi-permissions-matrix th[scope="row"] { text-align: left; white-space: nowrap; }
+.kywi-admin-shell .kywi-permissions-matrix .kywi-perm-col { vertical-align: bottom; white-space: nowrap; }
+
+/* Content-permission browser: add-entry form + ACL table affordances */
+.kywi-admin-shell .kywi-content-permission-browser .kywi-field { max-width: 420px; }
+.kywi-admin-shell .kywi-acl-add-form {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: flex-end;
+  gap: var(--kywi-space-3);
+  margin-top: var(--kywi-space-4);
+  padding-top: var(--kywi-space-4);
+  border-top: 1px solid var(--kywi-border);
+}
+.kywi-admin-shell .kywi-acl-add-form .kywi-field { margin: 0; min-width: 160px; max-width: none; }
+.kywi-admin-shell .kywi-table-actions { text-align: right; white-space: nowrap; }
+.kywi-admin-shell .kywi-table-empty { text-align: center; color: var(--kywi-text-muted); padding: var(--kywi-space-5) var(--kywi-space-3); }
+.kywi-admin-shell .kywi-chip {
+  display: inline-block;
+  padding: 2px 9px;
+  border-radius: var(--kywi-radius-pill);
+  background: var(--kywi-surface-sunken);
+  border: 1px solid var(--kywi-border);
+  font-size: var(--kywi-text-xs);
+  color: var(--kywi-text-muted);
+}
+
+/* ---- Keyframes -------------------------------------------------------- */
+@keyframes kywi-fade-in { from { opacity: 0; } to { opacity: 1; } }
+@keyframes kywi-pop-in { from { opacity: 0; transform: translateY(6px) scale(0.985); } to { opacity: 1; transform: none; } }
+@keyframes kywi-shimmer { to { transform: translateX(100%); } }
+@keyframes kywi-spin { to { transform: rotate(360deg); } }
+
+@media (prefers-reduced-motion: reduce) {
+  .kywi-admin-shell *,
+  .kywi-admin-shell *::before,
+  .kywi-admin-shell *::after {
+    animation-duration: 0.001ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.001ms !important;
+  }
+}
+
+/* ==========================================================================
+   8. DARK THEME — foundation (opt-in via [data-theme="dark"] or .kywi-theme-dark)
+   A token re-map only; component rules above are theme-agnostic. Light is the
+   supported primary; this scaffolds the follow-up without a rewrite.
+   ========================================================================== */
+:root[data-theme="dark"],
+.kywi-theme-dark {
+  --kywi-bg: #12100d;
+  --kywi-surface: #1b1916;
+  --kywi-surface-2: #211e1a;
+  --kywi-surface-sunken: #17150f;
+  --kywi-surface-hover: #24211c;
+
+  --kywi-text: #f0ede6;
+  --kywi-text-muted: #a8a297;
+  --kywi-text-subtle: #7c766a;
+
+  --kywi-border: #302c25;
+  --kywi-border-strong: #3c372f;
+  --kywi-border-input: #423c33;
+  --kywi-scroll-shadow: rgba(0, 0, 0, 0.45); /* horizontal-scroll edge cue */
+
+  --kywi-accent: var(--kywi-green-400);
+  --kywi-accent-solid: var(--kywi-green-500);
+  --kywi-accent-hover: var(--kywi-green-400);
+  --kywi-accent-active: var(--kywi-green-600);
+  --kywi-accent-tint: #12291f;
+  --kywi-accent-tint-strong: #163828;
+  --kywi-accent-tint-fg: #6fbb9d;
+  --kywi-accent-border: #235640;
+
+  --kywi-success-fg: #6fbb9d; --kywi-success-bg: #12291f; --kywi-success-border: #235640;
+  --kywi-warning-fg: #e0b24d; --kywi-warning-bg: #2c2410; --kywi-warning-border: #4d3f18;
+  --kywi-danger-fg: #e79488; --kywi-danger-bg: #2c1613; --kywi-danger-border: #543028;
+  --kywi-info-fg: #7fbcd6; --kywi-info-bg: #12262e; --kywi-info-border: #244651;
+  --kywi-neutral-fg: #b3ada2; --kywi-neutral-bg: #262019; --kywi-neutral-border: #3a342b;
+
+  --kywi-ring-color: rgba(51, 153, 122, 0.45);
+}
+
+/* ─── Forms surface (W3b) ──────────────────────────────────────────────────
+   The All Forms list, the form editor meta panel, and the submissions picker +
+   detail modal. Reuses shared tokens, buttons, tables and status badges. */
+.kywi-admin-shell .kywi-forms-header {
+  display: flex; align-items: flex-start; justify-content: space-between;
+  gap: var(--kywi-space-3); flex-wrap: wrap; margin-bottom: var(--kywi-space-5);
+}
+.kywi-admin-shell .kywi-forms-title {
+  margin: 0; font-size: var(--kywi-text-xl); font-weight: var(--kywi-weight-semibold);
+  letter-spacing: var(--kywi-tracking-tight);
+}
+.kywi-admin-shell .kywi-forms-subtitle {
+  margin: 2px 0 0; font-size: var(--kywi-text-sm); color: var(--kywi-text-muted);
+}
+.kywi-admin-shell .kywi-forms-actions { display: flex; gap: var(--kywi-space-2); flex-wrap: wrap; }
+.kywi-admin-shell .kywi-forms-table code {
+  font-size: var(--kywi-text-sm); color: var(--kywi-text-muted);
+}
+.kywi-admin-shell .kywi-link-button {
+  background: none; border: none; padding: 0; cursor: pointer; font: inherit;
+  font-weight: var(--kywi-weight-medium); color: var(--kywi-accent-solid); text-align: left;
+}
+.kywi-admin-shell .kywi-link-button:hover { text-decoration: underline; }
+
+/* Form editor: a "form details" meta panel above the drag-drop builder. */
+.kywi-admin-shell .kywi-form-meta-panel {
+  display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+  gap: var(--kywi-space-3); align-items: end;
+  margin-bottom: var(--kywi-space-4); padding: var(--kywi-space-4);
+  background: var(--kywi-surface-sunken); border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-md);
+}
+.kywi-admin-shell .kywi-form-editor-error {
+  margin-bottom: var(--kywi-space-3); color: var(--kywi-danger-fg);
+}
+
+/* Submissions surface: form picker + read-only detail modal. */
+.kywi-admin-shell .kywi-submissions-picker {
+  display: flex; align-items: center; gap: var(--kywi-space-2);
+  margin-bottom: var(--kywi-space-4); flex-wrap: wrap;
+}
+.kywi-admin-shell .kywi-submission-detail-backdrop {
+  position: fixed; inset: 0; z-index: 50; padding: var(--kywi-space-4);
+  display: flex; align-items: center; justify-content: center;
+  background: rgba(0, 0, 0, 0.42);
+}
+.kywi-admin-shell .kywi-submission-detail-modal {
+  width: 100%; max-width: 560px; max-height: 80vh; overflow: auto;
+  padding: var(--kywi-space-5);
+  background: var(--kywi-surface); border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-lg); box-shadow: var(--kywi-shadow-lg);
+}
+.kywi-admin-shell .kywi-submission-detail-header {
+  display: flex; align-items: center; justify-content: space-between;
+  gap: var(--kywi-space-3); margin-bottom: var(--kywi-space-4);
+}
+.kywi-admin-shell .kywi-submission-detail-title {
+  margin: 0; font-size: var(--kywi-text-lg); font-weight: var(--kywi-weight-semibold);
+}
+.kywi-admin-shell .kywi-submission-detail-row {
+  display: grid; grid-template-columns: 160px 1fr; gap: var(--kywi-space-3);
+  padding: var(--kywi-space-2) 0; border-bottom: 1px solid var(--kywi-border);
+}
+.kywi-admin-shell .kywi-submission-detail-row:last-child { border-bottom: none; }
+.kywi-admin-shell .kywi-submission-detail-key {
+  font-weight: var(--kywi-weight-semibold); color: var(--kywi-text-muted);
+  font-size: var(--kywi-text-sm);
+}
+.kywi-admin-shell .kywi-submission-detail-value { word-break: break-word; }
+
+/* ==========================================================================
+   Workflow surfaces (Phase B W4a): approvals, changesets, comments
+   ========================================================================== */
+
+/* ---- Additional status badges (comment moderation) -------------------- */
+.kywi-admin-shell .kywi-status-spam,
+.kywi-admin-shell .kywi-status-rejected { color: var(--kywi-danger-fg); background: var(--kywi-danger-bg); border-color: var(--kywi-danger-border); }
+.kywi-admin-shell .kywi-status-flagged { color: var(--kywi-warning-fg); background: var(--kywi-warning-bg); border-color: var(--kywi-warning-border); }
+.kywi-admin-shell .kywi-status-deleted { color: var(--kywi-neutral-fg); background: var(--kywi-neutral-bg); border-color: var(--kywi-neutral-border); }
+
+/* ---- Approvals queue: per-row comment input --------------------------- */
+.kywi-admin-shell .kywi-approval-actions {
+  display: flex; align-items: center; gap: var(--kywi-space-2); flex-wrap: wrap;
+}
+.kywi-admin-shell .kywi-approval-comment { min-width: 12rem; }
+
+/* ---- Changesets: add-item control ------------------------------------- */
+.kywi-admin-shell .kywi-changeset-add-item {
+  padding: var(--kywi-space-4) var(--kywi-space-5);
+  margin-bottom: var(--kywi-space-5);
+  border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-md);
+  background: var(--kywi-surface);
+}
+.kywi-admin-shell .kywi-changeset-add-item-row {
+  display: flex; align-items: flex-end; gap: var(--kywi-space-3); flex-wrap: wrap;
+}
+.kywi-admin-shell .kywi-changeset-add-item-row .kywi-form-field { margin-bottom: 0; }
+.kywi-admin-shell .kywi-changeset-add-item-row .kywi-form-field:first-child { flex: 1 1 20rem; }
+
+/* ---- Comments: filter toolbar + threaded moderation ------------------- */
+.kywi-admin-shell .kywi-comment-toolbar {
+  justify-content: flex-start; gap: var(--kywi-space-2);
+}
+.kywi-admin-shell .kywi-comment-thread {
+  display: flex; flex-direction: column; gap: var(--kywi-space-3);
+}
+.kywi-admin-shell .kywi-comment-card {
+  padding: var(--kywi-space-4) var(--kywi-space-5);
+  border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-md);
+  background: var(--kywi-surface);
+}
+.kywi-admin-shell .kywi-comment-meta {
+  display: flex; align-items: center; gap: var(--kywi-space-3); flex-wrap: wrap;
+  margin-bottom: var(--kywi-space-2); font-size: var(--kywi-text-sm);
+}
+.kywi-admin-shell .kywi-comment-author { font-weight: var(--kywi-weight-semibold); color: var(--kywi-text); }
+.kywi-admin-shell .kywi-comment-content-ref { font-style: italic; }
+.kywi-admin-shell .kywi-comment-body {
+  margin: 0 0 var(--kywi-space-3); color: var(--kywi-text); line-height: var(--kywi-leading);
+  white-space: pre-wrap; word-break: break-word;
+}
+.kywi-admin-shell .kywi-comment-actions { display: flex; gap: var(--kywi-space-2); flex-wrap: wrap; }
+.kywi-admin-shell .kywi-comment-children {
+  margin-top: var(--kywi-space-3);
+  margin-left: var(--kywi-space-5);
+  padding-left: var(--kywi-space-4);
+  border-left: 2px solid var(--kywi-border);
+  display: flex; flex-direction: column; gap: var(--kywi-space-3);
+}
+
+/* ============================================================================
+   W4b — Feeds editor + standalone Layouts manager
+   ============================================================================ */
+
+/* Feed editor: name/slug meta row, then builder + live preview side by side. */
+.kywi-admin-shell .kywi-feed-editor-meta,
+.kywi-admin-shell .kywi-layout-editor-meta {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+  gap: var(--kywi-space-4);
+  margin-bottom: var(--kywi-space-5);
+}
+.kywi-admin-shell .kywi-feed-editor-grid {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) minmax(280px, 22rem);
+  gap: var(--kywi-space-5);
+  align-items: start;
+}
+@media (max-width: 900px) {
+  .kywi-admin-shell .kywi-feed-editor-grid { grid-template-columns: 1fr; }
+}
+.kywi-admin-shell .kywi-feed-preview {
+  border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-md);
+  background: var(--kywi-surface-2);
+  padding: var(--kywi-space-4);
+  position: sticky;
+  top: var(--kywi-space-4);
+}
+.kywi-admin-shell .kywi-feed-preview-title {
+  font-size: var(--kywi-text-lg);
+  margin: 0 0 var(--kywi-space-3);
+}
+.kywi-admin-shell .kywi-feed-preview-count {
+  color: var(--kywi-text-muted);
+  font-size: var(--kywi-text-sm);
+  margin: 0 0 var(--kywi-space-3);
+}
+.kywi-admin-shell .kywi-feed-preview-list {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  gap: var(--kywi-space-2);
+}
+.kywi-admin-shell .kywi-feed-preview-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--kywi-space-2);
+  padding: var(--kywi-space-2) var(--kywi-space-3);
+  background: var(--kywi-surface);
+  border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-sm);
+}
+.kywi-admin-shell .kywi-feed-preview-item-title {
+  font-weight: var(--kywi-weight-medium);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+/* Standalone layout editor host: give the dnd editor a workable viewport. */
+.kywi-admin-shell .kywi-layout-editor-host {
+  border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius-md);
+  overflow: hidden;
+  min-height: 32rem;
+}
+/* ---- Settings suite (General / Site / Sites / Cache / Email) ----------- */
+/* Responsive card grid used by the settings pages. */
+.kywi-admin-shell .kywi-settings-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+  gap: var(--kywi-space-5);
+  align-items: start;
+}
+/* Config-as-code callout: signals a value is defined in kywi.config.ts and
+   read-only at runtime. */
+.kywi-admin-shell .kywi-settings-note {
+  display: flex;
+  gap: var(--kywi-space-2);
+  padding: var(--kywi-space-3) var(--kywi-space-4);
+  margin-bottom: var(--kywi-space-4);
+  font-size: var(--kywi-text-sm);
+  line-height: var(--kywi-leading-snug);
+  color: var(--kywi-info-fg);
+  background: var(--kywi-info-bg);
+  border: 1px solid var(--kywi-info-border);
+  border-radius: var(--kywi-radius-md);
+}
+.kywi-admin-shell .kywi-settings-note code {
+  font-family: var(--kywi-font-mono);
+  font-size: 0.92em;
+}
+/* Read-only definition list for config-as-code values. */
+.kywi-admin-shell .kywi-def-list { display: grid; gap: 0; }
+.kywi-admin-shell .kywi-def-row {
+  display: grid;
+  grid-template-columns: 180px 1fr;
+  gap: var(--kywi-space-3);
+  padding: var(--kywi-space-3) 0;
+  border-bottom: 1px solid var(--kywi-border);
+}
+.kywi-admin-shell .kywi-def-row:last-child { border-bottom: none; }
+.kywi-admin-shell .kywi-def-term {
+  font-size: var(--kywi-text-sm);
+  font-weight: var(--kywi-weight-semibold);
+  color: var(--kywi-text-muted);
+}
+.kywi-admin-shell .kywi-def-val {
+  font-size: var(--kywi-text-base);
+  color: var(--kywi-text);
+  word-break: break-word;
+}
+.kywi-admin-shell .kywi-def-val--mono { font-family: var(--kywi-font-mono); font-size: var(--kywi-text-sm); }
+.kywi-admin-shell .kywi-def-val--muted { color: var(--kywi-text-subtle); }
+/* Inline success flash (e.g. after saving settings / clearing cache). */
+.kywi-admin-shell .kywi-settings-success {
+  display: flex; gap: var(--kywi-space-2); align-items: center;
+  padding: var(--kywi-space-3) var(--kywi-space-4);
+  margin-bottom: var(--kywi-space-4);
+  font-size: var(--kywi-text-sm);
+  color: var(--kywi-success-fg);
+  background: var(--kywi-success-bg);
+  border: 1px solid var(--kywi-success-border);
+  border-radius: var(--kywi-radius-md);
+}
+/* Cache entry-count stat. */
+.kywi-admin-shell .kywi-cache-stat { display: flex; align-items: baseline; gap: var(--kywi-space-3); }
+.kywi-admin-shell .kywi-cache-stat-num {
+  font-size: var(--kywi-text-2xl);
+  font-weight: var(--kywi-weight-bold);
+  letter-spacing: var(--kywi-tracking-tight);
+  color: var(--kywi-text);
+}
+.kywi-admin-shell .kywi-cache-stat-label { font-size: var(--kywi-text-sm); color: var(--kywi-text-muted); }
+
+/* ==========================================================================
+   9. RESPONSIVE SHELL — collapsible sidebar drawer + fluid content (<1024px)
+   --------------------------------------------------------------------------
+   The fixed ~248px sidebar crushes the content column on small screens. Below
+   the breakpoint the sidebar becomes an off-canvas drawer opened by a topbar
+   hamburger; the main column takes the full width, stat grids reflow, and data
+   tables scroll horizontally inside their own container instead of crushing.
+   ========================================================================== */
+@media (max-width: 1023px) {
+  /* Sidebar → off-canvas drawer, slides in when the shell is marked open. */
+  .kywi-admin-shell .kywi-admin-sidebar {
+    position: fixed;
+    top: 0; left: 0; bottom: 0;
+    z-index: var(--kywi-z-overlay);
+    width: 264px;
+    max-width: 84vw;
+    transform: translateX(-100%);
+    transition: transform var(--kywi-dur-slow) var(--kywi-ease);
+    box-shadow: var(--kywi-shadow-lg);
+  }
+  .kywi-admin-shell .kywi-admin-sidebar-sticky { position: static; height: 100%; }
+  .kywi-admin-shell[data-sidebar-open="true"] .kywi-admin-sidebar { transform: translateX(0); }
+
+  /* Backdrop scrim under the open drawer. */
+  .kywi-admin-shell .kywi-admin-scrim {
+    display: block;
+    position: fixed;
+    inset: 0;
+    z-index: calc(var(--kywi-z-overlay) - 1);
+    margin: 0;
+    padding: 0;
+    border: 0;
+    background: rgba(10, 18, 14, 0.46);
+    opacity: 0;
+    visibility: hidden;
+    cursor: pointer;
+    transition: opacity var(--kywi-dur) var(--kywi-ease), visibility var(--kywi-dur) var(--kywi-ease);
+  }
+  .kywi-admin-shell[data-sidebar-open="true"] .kywi-admin-scrim { opacity: 1; visibility: visible; }
+
+  /* Mobile bar with the hamburger + wordmark, pinned to the top of the content. */
+  .kywi-admin-shell .kywi-admin-mobile-bar {
+    display: flex;
+    align-items: center;
+    gap: var(--kywi-space-3);
+    position: sticky;
+    top: 0;
+    z-index: var(--kywi-z-sticky);
+    margin: calc(-1 * var(--kywi-space-4)) calc(-1 * var(--kywi-space-4)) var(--kywi-space-4);
+    padding: var(--kywi-space-3) var(--kywi-space-4);
+    background: var(--kywi-surface);
+    border-bottom: 1px solid var(--kywi-border);
+  }
+  .kywi-admin-shell .kywi-admin-hamburger {
+    display: inline-flex;
+    flex-direction: column;
+    justify-content: center;
+    gap: 4px;
+    width: 38px;
+    height: 38px;
+    padding: 9px;
+    background: var(--kywi-surface);
+    border: 1px solid var(--kywi-border-strong);
+    border-radius: var(--kywi-radius);
+    cursor: pointer;
+  }
+  .kywi-admin-shell .kywi-admin-hamburger-bar {
+    display: block;
+    width: 100%;
+    height: 2px;
+    background: var(--kywi-text);
+    border-radius: 2px;
+  }
+  .kywi-admin-shell .kywi-admin-mobile-brand {
+    font-weight: var(--kywi-weight-bold);
+    color: var(--kywi-text);
+    letter-spacing: var(--kywi-tracking-tight);
+    text-decoration: none;
+  }
+
+  /* Full-width content column with tighter gutters. */
+  .kywi-admin-shell .kywi-admin-main {
+    padding: var(--kywi-space-4) var(--kywi-space-4) var(--kywi-space-10);
+  }
+
+  /* Topbar wraps rather than overflowing off-screen. */
+  .kywi-admin-shell .kywi-admin-topbar {
+    flex-wrap: wrap;
+    justify-content: flex-start;
+    row-gap: var(--kywi-space-2);
+  }
+
+  /* Stat-card grid reflows to two columns. */
+  .kywi-admin-shell .kywi-admin-metrics-grid {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+
+  /* Data tables scroll horizontally inside their container instead of crushing. */
+  .kywi-admin-shell .kywi-table-scroll {
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+  }
+  .kywi-admin-shell .kywi-table-scroll > table { min-width: 640px; }
+  /* Forcing a 640px min-width all but guarantees overflow at this breakpoint —
+     surface the same "Scroll for more" cue used for the wide-table opt-in. */
+  .kywi-admin-shell .kywi-table-scroll::after {
+    content: "Scroll for more \2192";
+    position: absolute;
+    top: 8px;
+    right: 8px;
+    z-index: 1;
+    padding: 2px 9px;
+    border-radius: 999px;
+    background: var(--kywi-scroll-shadow);
+    color: #fff;
+    font-size: var(--kywi-text-xs);
+    font-weight: var(--kywi-weight-medium);
+    letter-spacing: 0.01em;
+    pointer-events: none;
+    white-space: nowrap;
+  }
+
+  /* Site-tree table is a CSS-grid layout, not a <table>: let its container
+     scroll and keep the header + rows from crushing their columns. */
+  .kywi-admin-shell .kywi-site-tree-table { overflow-x: auto; }
+  .kywi-admin-shell .kywi-tree-table-header,
+  .kywi-admin-shell .kywi-tree-table-row { min-width: 560px; }
+}
+
+@media (max-width: 560px) {
+  /* Stat cards stack to a single column on small phones. */
+  .kywi-admin-shell .kywi-admin-metrics-grid { grid-template-columns: 1fr; }
+}
+
+/* ==========================================================================
+   A/B EXPERIMENTS
+   ========================================================================== */
+
+/* Experiment lifecycle status badges (draft/running/paused/completed). */
+.kywi-admin-shell .kywi-admin-status-running { color: var(--kywi-success-fg); background: var(--kywi-success-bg); border-color: var(--kywi-success-border); }
+.kywi-admin-shell .kywi-admin-status-draft { color: var(--kywi-warning-fg); background: var(--kywi-warning-bg); border-color: var(--kywi-warning-border); }
+.kywi-admin-shell .kywi-admin-status-paused { color: var(--kywi-neutral-fg); background: var(--kywi-neutral-bg); border-color: var(--kywi-neutral-border); }
+.kywi-admin-shell .kywi-admin-status-completed { color: var(--kywi-info-fg); background: var(--kywi-info-bg); border-color: var(--kywi-info-border); }
+
+.kywi-admin-shell .kywi-admin-experiment-description,
+.kywi-admin-shell .kywi-admin-experiment-goal {
+  margin: 2px 0 0;
+  font-size: var(--kywi-text-xs);
+  color: var(--kywi-neutral-fg);
+}
+.kywi-admin-shell .kywi-admin-experiment-subhead {
+  display: flex; align-items: center; gap: 8px; margin: 6px 0 0;
+}
+
+/* Variant editor table */
+.kywi-admin-shell .kywi-admin-variant-table td { vertical-align: middle; }
+.kywi-admin-shell .kywi-input-narrow { max-width: 96px; }
+.kywi-admin-shell .kywi-admin-variant-actions {
+  display: flex; align-items: center; gap: 14px; margin-top: 10px;
+}
+.kywi-admin-shell .kywi-admin-split-total {
+  font-size: var(--kywi-text-sm); font-weight: var(--kywi-weight-semibold);
+  padding: 2px 10px; border-radius: var(--kywi-radius-pill);
+}
+.kywi-admin-shell .kywi-admin-split-ok { color: var(--kywi-success-fg); background: var(--kywi-success-bg); }
+.kywi-admin-shell .kywi-admin-split-error { color: var(--kywi-danger-fg); background: var(--kywi-danger-bg); }
+
+/* Results table */
+.kywi-admin-shell .kywi-admin-results-summary {
+  margin: 0 0 12px; color: var(--kywi-neutral-fg); font-size: var(--kywi-text-sm);
+}
+.kywi-admin-shell .kywi-admin-results-table td { font-variant-numeric: tabular-nums; }
+.kywi-admin-shell .kywi-admin-variant-winner { background: var(--kywi-success-bg); }
+.kywi-admin-shell .kywi-admin-winner-star { color: var(--kywi-warning-fg); }
+.kywi-admin-shell .kywi-admin-control-tag { color: var(--kywi-neutral-fg); font-size: var(--kywi-text-xs); }
+.kywi-admin-shell .kywi-admin-complete-section .kywi-admin-form-actions { align-items: center; }
+
+/* ── Admin global search (/admin/search) ──────────────────────────────────── */
+.kywi-admin-shell .kywi-admin-search-form {
+  display: flex;
+  gap: var(--kywi-space-2);
+  align-items: center;
+  margin-bottom: var(--kywi-space-5);
+}
+.kywi-admin-shell .kywi-admin-search-form .kywi-input { flex: 1 1 auto; }
+.kywi-admin-shell .kywi-admin-search-results {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  gap: var(--kywi-space-2);
+}
+.kywi-admin-shell .kywi-admin-search-result {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  padding: var(--kywi-space-3) var(--kywi-space-4);
+  background: var(--kywi-surface);
+  border: 1px solid var(--kywi-border);
+  border-radius: var(--kywi-radius);
+}
+.kywi-admin-shell .kywi-admin-search-result-title {
+  font-weight: var(--kywi-weight-semibold);
+  color: var(--kywi-accent);
+  text-decoration: none;
+}
+.kywi-admin-shell .kywi-admin-search-result-title:hover { text-decoration: underline; }
+.kywi-admin-shell .kywi-admin-search-result-meta { font-size: var(--kywi-text-sm); }
+
+/* Header quick-search box (admin topbar). */
+.kywi-admin-shell .kywi-admin-topbar-search {
+  display: flex;
+  gap: var(--kywi-space-2);
+  align-items: center;
+  flex: 1 1 auto;
+  max-width: 420px;
+}
+.kywi-admin-shell .kywi-admin-topbar-search .kywi-input {
+  height: 32px;
+  padding-block: 0;
+}
+/* Audience list drag-to-reorder (F2a-J05-G5) */
+.kywi-admin-shell .kywi-admin-drag-handle {
+  background: none;
+  border: none;
+  padding: 0 6px 0 0;
+  cursor: grab;
+  color: var(--kywi-text-subtle);
+  font-size: var(--kywi-text-sm);
+  line-height: 1;
+  touch-action: none;
+}
+.kywi-admin-shell .kywi-admin-drag-handle:active { cursor: grabbing; }
+.kywi-admin-shell .kywi-admin-audience-row .kywi-admin-priority { cursor: default; }