:root {
  --topbar-h:  48px;
  --sidebar-w: 220px;
  --sidebar-rail-w: 48px;

  --domain-core: #ca8a04;
  --domain-core-soft: rgba(202, 138, 4, 0.1);
  --domain-requests: #eab308;
  --domain-requests-soft: rgba(234, 179, 8, 0.12);
  --domain-config: #64748b;
  --domain-config-soft: rgba(100, 116, 139, 0.1);
  --domain-directory: #7c3aed;
  --domain-directory-soft: rgba(124, 58, 237, 0.1);
  --domain-treasury: #16a34a;
  --domain-treasury-soft: rgba(22, 163, 74, 0.1);
  --domain-faucet: #15803d;
  --domain-faucet-soft: rgba(21, 128, 61, 0.1);
  --domain-mail: #0284c7;
  --domain-mail-soft: rgba(2, 132, 199, 0.1);
  --domain-support: #2563eb;
  --domain-support-soft: rgba(37, 99, 235, 0.1);
  --domain-server: #dc2626;
  --domain-server-soft: rgba(220, 38, 38, 0.08);
  --domain-coming-soon: #db2777;
  --domain-coming-soon-soft: rgba(219, 39, 119, 0.1);
  --domain-vault: #9333ea;
  --domain-vault-soft: rgba(147, 51, 234, 0.1);
  --domain-exchange: #059669;
  --domain-exchange-soft: rgba(5, 150, 105, 0.1);
  --domain-dev: #0d9488;
  --domain-dev-soft: rgba(13, 148, 136, 0.1);
  --domain-moderate: #0891b2;
  --domain-moderate-soft: rgba(8, 145, 178, 0.1);

  --hub-main: #4f46e5;
  --hub-main-soft: rgba(79, 70, 229, 0.1);
  --hub-finance: #16a34a;
  --hub-finance-soft: rgba(22, 163, 74, 0.1);
  --hub-communication: #0284c7;
  --hub-communication-soft: rgba(2, 132, 199, 0.1);
  --hub-entities: #0d9488;
  --hub-entities-soft: rgba(13, 148, 136, 0.1);
  --hub-assets: #ca8a04;
  --hub-assets-soft: rgba(202, 138, 4, 0.1);

  --sidebar-top-accent: #71717a;
  --sidebar-top-accent-soft: rgba(113, 113, 122, 0.12);

  --bg:           #f4f4f5;
  --surface:      #ffffff;
  --border:       #e4e4e7;
  --border-input: #d4d4d8;
  --text:         #18181b;
  --text-muted:   #52525b;
  --text-dim:     #71717a;
  --hover:        #f4f4f5;
  --accent:       #18181b;
  --accent-hover: #3f3f46;
  --accent-text:  #ffffff;
  --topbar-bg:    #18181b;
  --topbar-text:  #ffffff;
}

[data-theme="dark"], [data-style="dark"], [data-accent="dark"] {
  --domain-core: #eab308;
  --domain-core-soft: rgba(234, 179, 8, 0.12);
  --domain-server: #f87171;
  --domain-server-soft: rgba(248, 113, 113, 0.1);
  --bg: #09090b; --surface: #18181b; --border: #27272a; --border-input: #3f3f46;
  --text: #fafafa; --text-muted: #a1a1aa; --text-dim: #71717a; --hover: #27272a;
  --accent: #e4e4e7; --accent-hover: #d4d4d8; --accent-text: #09090b;
  --topbar-bg: #09090b; --topbar-text: #fafafa;
}
[data-theme="dim"], [data-style="dim"], [data-accent="dim"] {
  --bg: #1c2128; --surface: #22272e; --border: #373e47; --border-input: #444c56;
  --text: #adbac7; --text-muted: #8b949e; --text-dim: #6e7681; --hover: #2d333b;
  --accent: #388bfd; --accent-hover: #1f6feb; --accent-text: #0d1117;
  --topbar-bg: #1c2128; --topbar-text: #adbac7;
}
[data-theme="sepia"], [data-style="sepia"], [data-accent="sepia"] {
  --bg: #f5f0e8; --surface: #fdf8f0; --border: #e0d5c0; --border-input: #c9b99a;
  --text: #3d2b1f; --text-muted: #6b5340; --text-dim: #8a7355; --hover: #ede5d8;
  --accent: #8b4513; --accent-hover: #6b3410; --accent-text: #fdf8f0;
  --topbar-bg: #3d2b1f; --topbar-text: #f5f0e8;
}
[data-theme="slate"], [data-style="slate"], [data-accent="slate"] {
  --bg: #f1f5f9; --surface: #ffffff; --border: #cbd5e1; --border-input: #94a3b8;
  --text: #0f172a; --text-muted: #475569; --text-dim: #64748b; --hover: #e2e8f0;
  --accent: #1d4ed8; --accent-hover: #1e40af; --accent-text: #ffffff;
  --topbar-bg: #1e293b; --topbar-text: #f8fafc;
}
[data-theme="terminal"], [data-style="terminal"], [data-accent="terminal"] {
  --bg: #0a0a0a; --surface: #111111; --border: #1f1f1f; --border-input: #2d2d2d;
  --text: #b8f5c8; --text-muted: #5fd97a; --text-dim: #3db85a; --hover: #0d1a0d;
  --accent: #00ff41; --accent-hover: #00cc33; --accent-text: #000000;
  --topbar-bg: #000000; --topbar-text: #00ff41;
}
[data-theme="retro"], [data-style="retro"], [data-accent="retro"] {
  --bg: #0d0221; --surface: #1a0535; --border: #4c1d7a; --border-input: #7c3aed;
  --text: #f5d0fe; --text-muted: #d8b4fe; --text-dim: #c084fc; --hover: #200840;
  --accent: #f472b6; --accent-hover: #ec4899; --accent-text: #1a0535;
  --topbar-bg: #0a0118; --topbar-text: #f0abfc;
}
[data-theme="classic"], [data-style="classic"], [data-accent="classic"] {
  --bg: #c0c0c0; --surface: #ffffff; --border: #808080; --border-input: #808080;
  --text: #000000; --text-muted: #444444; --text-dim: #808080; --hover: #d4d0c8;
  --accent: #000080; --accent-hover: #0000aa; --accent-text: #ffffff;
  --topbar-bg: #000080; --topbar-text: #ffffff;
}
[data-theme="classic-simple"], [data-style="classic-simple"], [data-accent="classic-simple"] {
  --bg: #f5f5f5; --surface: #ffffff; --border: #d9d9d9; --border-input: #bfbfbf;
  --text: #1a1a1a; --text-muted: #595959; --text-dim: #8c8c8c; --hover: #ececec;
  --accent: #404040; --accent-hover: #262626; --accent-text: #ffffff;
  --topbar-bg: #2b2b2b; --topbar-text: #f5f5f5;
}
[data-theme="classic-dark"], [data-style="classic-dark"], [data-accent="classic-dark"] {
  --bg: #2b2b2b; --surface: #383838; --border: #4d4d4d; --border-input: #5c5c5c;
  --text: #e6e6e6; --text-muted: #b3b3b3; --text-dim: #a3a3a3; --hover: #444444;
  --accent: #4169e1; --accent-hover: #3151b0; --accent-text: #ffffff;
  --topbar-bg: #1a1a2e; --topbar-text: #e6e6e6;
}
[data-theme="birdhouse"], [data-style="birdhouse"], [data-accent="birdhouse"] {
  --bg: #faf6f0; --surface: #ffffff; --border: #e8ddd0; --border-input: #d4c3a8;
  --text: #3e2f24; --text-muted: #5c4a3a; --text-dim: #7a6a58; --hover: #f0e8da;
  --accent: #557239; --accent-hover: #445c2e; --accent-text: #ffffff;
  --topbar-bg: #5c4632; --topbar-text: #faf6f0;
}
[data-theme="ocean"], [data-style="ocean"], [data-accent="ocean"] {
  --bg: #f0f9fb; --surface: #ffffff; --border: #c3e4ea; --border-input: #8fcdd9;
  --text: #0c4a5c; --text-muted: #0e7490; --text-dim: #155e75; --hover: #e0f2f6;
  --accent: #0e7490; --accent-hover: #155e75; --accent-text: #ffffff;
  --topbar-bg: #083344; --topbar-text: #e0f2f6;
}
[data-theme="ocean-deep"], [data-style="ocean-deep"], [data-accent="ocean-deep"] {
  --bg: #06141b; --surface: #0f2a35; --border: #1a3a47; --border-input: #2a4f5e;
  --text: #d6f0f5; --text-muted: #8fb8c4; --text-dim: #5d8a96; --hover: #14323d;
  --accent: #22d3ee; --accent-hover: #06b6d4; --accent-text: #06141b;
  --topbar-bg: #03090d; --topbar-text: #d6f0f5;
}
[data-theme="forest"], [data-style="forest"], [data-accent="forest"] {
  --bg: #f3f6f0; --surface: #ffffff; --border: #d4e0c8; --border-input: #b3c89e;
  --text: #1e3a1f; --text-muted: #4d6b4f; --text-dim: #7d9a7e; --hover: #e8efe0;
  --accent: #2f7d32; --accent-hover: #245f27; --accent-text: #ffffff;
  --topbar-bg: #1b3a1d; --topbar-text: #f3f6f0;
}
[data-theme="sunset"], [data-style="sunset"], [data-accent="sunset"] {
  --bg: #fff7ed; --surface: #ffffff; --border: #fed7aa; --border-input: #fdba74;
  --text: #7c2d12; --text-muted: #9a3412; --text-dim: #c2410c; --hover: #ffedd5;
  --accent: #c2410c; --accent-hover: #9a3412; --accent-text: #ffffff;
  --topbar-bg: #7c2d12; --topbar-text: #fff7ed;
}
[data-theme="dim-light"], [data-style="dim-light"], [data-accent="dim-light"] {
  --bg: #ffffff; --surface: #f6f8fa; --border: #d0d7de; --border-input: #afb8c1;
  --text: #1f2328; --text-muted: #57606a; --text-dim: #6e7781; --hover: #f3f4f6;
  --accent: #0969da; --accent-hover: #0550ae; --accent-text: #ffffff;
  --topbar-bg: #24292f; --topbar-text: #f6f8fa;
}
[data-theme="sepia-dark"], [data-style="sepia-dark"], [data-accent="sepia-dark"] {
  --bg: #2a1f14; --surface: #3d2e1f; --border: #5c4a38; --border-input: #6e5a45;
  --text: #f0e4d4; --text-muted: #b8a088; --text-dim: #8a7860; --hover: #352818;
  --accent: #c9a227; --accent-hover: #a8841f; --accent-text: #2a1f14;
  --topbar-bg: #1a1208; --topbar-text: #f0e4d4;
}
[data-theme="slate-dark"], [data-style="slate-dark"], [data-accent="slate-dark"] {
  --bg: #0f172a; --surface: #1e293b; --border: #334155; --border-input: #475569;
  --text: #f1f5f9; --text-muted: #94a3b8; --text-dim: #64748b; --hover: #1e293b;
  --accent: #60a5fa; --accent-hover: #3b82f6; --accent-text: #0f172a;
  --topbar-bg: #020617; --topbar-text: #f1f5f9;
}
[data-theme="terminal-light"], [data-style="terminal-light"], [data-accent="terminal-light"] {
  --bg: #f5f0e0; --surface: #fffef5; --border: #d4c9a8; --border-input: #b8a878;
  --text: #1f3d12; --text-muted: #3d6b20; --text-dim: #5a7d40; --hover: #ebe4d0;
  --accent: #1a6b1a; --accent-hover: #145214; --accent-text: #fffef5;
  --topbar-bg: #2d5016; --topbar-text: #f5f0e0;
}
[data-theme="retro-light"], [data-style="retro-light"], [data-accent="retro-light"] {
  --bg: #fdf4ff; --surface: #ffffff; --border: #e9d5ff; --border-input: #d8b4fe;
  --text: #4c1d6d; --text-muted: #6b21a8; --text-dim: #7e22ce; --hover: #fae8ff;
  --accent: #db2777; --accent-hover: #be185d; --accent-text: #ffffff;
  --topbar-bg: #581c87; --topbar-text: #fdf4ff;
}
[data-theme="classic-win95-dark"], [data-style="classic-win95-dark"], [data-accent="classic-win95-dark"] {
  --bg: #2d2d2d; --surface: #3a3a3a; --border: #606060; --border-input: #707070;
  --text: #e0e0e0; --text-muted: #a0a0a0; --text-dim: #8a8a8a; --hover: #404040;
  --accent: #4169e1; --accent-hover: #3151b0; --accent-text: #ffffff;
  --topbar-bg: #000080; --topbar-text: #ffffff;
}
[data-theme="birdhouse-dark"], [data-style="birdhouse-dark"], [data-accent="birdhouse-dark"] {
  --bg: #2a2218; --surface: #3a3028; --border: #524838; --border-input: #645848;
  --text: #f0e8da; --text-muted: #b8a898; --text-dim: #8a7a68; --hover: #342c20;
  --accent: #86b05a; --accent-hover: #6b8e4e; --accent-text: #1a140e;
  --topbar-bg: #1a140e; --topbar-text: #f0e8da;
}
[data-theme="forest-dark"], [data-style="forest-dark"], [data-accent="forest-dark"] {
  --bg: #0f1a10; --surface: #1b2e1c; --border: #2d4a30; --border-input: #3d5c40;
  --text: #e8efe0; --text-muted: #8aaa8c; --text-dim: #5c7a5e; --hover: #152418;
  --accent: #4caf50; --accent-hover: #388e3c; --accent-text: #0f1a10;
  --topbar-bg: #0a120a; --topbar-text: #e8efe0;
}
[data-theme="sunset-dark"], [data-style="sunset-dark"], [data-accent="sunset-dark"] {
  --bg: #2a1208; --surface: #3d1a0c; --border: #5c2a14; --border-input: #7a3818;
  --text: #ffedd5; --text-muted: #fdba74; --text-dim: #fb923c; --hover: #321408;
  --accent: #fb923c; --accent-hover: #ea580c; --accent-text: #2a1208;
  --topbar-bg: #1a0a04; --topbar-text: #ffedd5;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: system-ui, sans-serif;
  background: var(--bg);
  color: var(--text);
}

a { color: var(--text); text-decoration: none; }
h1 { font-size: 1.25rem; font-weight: 600; margin-bottom: 1.25rem; }
p  { font-size: 0.875rem; color: var(--text-muted); margin-top: 0.875rem; }

input {
  border: 1px solid var(--border-input);
  border-radius: 0.125rem;
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem;
  width: 100%;
  outline: none;
  background: var(--surface);
  color: var(--text);
}
input:focus { border-color: var(--accent); }

select {
  border: 1px solid var(--border-input);
  border-radius: 0.125rem;
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem;
  line-height: 1.35;
  width: 100%;
  max-width: 100%;
  outline: none;
  background: var(--surface);
  color: var(--text);
  font-family: inherit;
}
select:focus { border-color: var(--accent); }

button {
  background: var(--accent);
  color: var(--accent-text);
  border: none;
  border-radius: 0.125rem;
  padding: 0.55rem 1rem;
  font-size: 0.875rem;
  cursor: pointer;
  width: 100%;
}
button:hover { background: var(--accent-hover); }
button.ghost {
  background: transparent;
  color: var(--text);
  border: 1px solid var(--border-input);
}
button.ghost:hover { background: var(--hover); }
a.btn-xs.ghost {
  display: inline-block;
  background: transparent;
  color: var(--text);
  border: 1px solid var(--border-input);
  text-decoration: none;
}
a.btn-xs.ghost:hover { background: var(--hover); text-decoration: none; }

form { display: flex; flex-direction: column; gap: 0.625rem; }
.error   { color: #dc2626; font-size: 0.825rem; margin-bottom: 0.75rem; padding: 0.6rem 0.875rem; border: 1px solid color-mix(in srgb, #dc2626 40%, var(--border)); background: color-mix(in srgb, #dc2626 8%, var(--surface)); border-radius: var(--radius, 0.125rem); overflow-wrap: anywhere; }
.success { color: #16a34a; font-size: 0.825rem; margin-bottom: 0.75rem; padding: 0.6rem 0.875rem; border: 1px solid color-mix(in srgb, #16a34a 35%, var(--border)); background: color-mix(in srgb, #16a34a 8%, var(--surface)); border-radius: var(--radius, 0.125rem); overflow-wrap: anywhere; }

label { display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.8rem; color: var(--text-muted); }
label input { color: var(--text); }
input[readonly] { background: var(--hover); color: var(--text-muted); cursor: default; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0.625rem; }

body.bare {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.login-with-home {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 1.25rem;
  width: 100%;
  max-width: 380px;
}

.login-with-home > .card {
  max-width: none;
}

body.bare.public-surface {
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  padding: 0;
}

.public-chrome {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-shrink: 0;
  width: 100%;
  box-sizing: border-box;
  padding: 0.5rem 1.25rem;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
}

.public-chrome-brand {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 600;
  font-size: 0.95rem;
}
.public-chrome-icon {
  width: 1.25rem;
  height: 1.25rem;
  object-fit: contain;
  flex-shrink: 0;
}

.public-chrome-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}

.public-chrome a.btn-xs {
  display: inline-block;
  width: auto;
  text-decoration: none;
}

.public-chrome a.btn-xs:not(.ghost) {
  background: var(--accent);
  color: var(--accent-text);
  border: none;
}

.public-chrome a.btn-xs:not(.ghost):hover {
  background: var(--accent-hover);
}

body.bare.public-surface > .public-page-shell,
body.bare.public-surface > .site-destination {
  flex: 0 1 auto;
  width: 100%;
}

body.bare.public-surface:has(> .public-chrome) > .public-page-shell {
  min-height: 0;
  padding-top: 1.25rem;
}
body.bare.public-surface:has(> .public-chrome) > .public-page-shell--flush {
  padding: 0;
}

body.bare.public-surface > .site-destination {
  padding: 0;
  box-sizing: border-box;
}

body.bare:has(> .site-destination) {
  display: block;
  padding: 0;
}
body.bare:has(> .site-destination--center-content) {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

body.bare.public-surface:has(> .site-destination),
body.bare.public-surface:has(> .site-destination--center-content) {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  padding: 0;
}

html:has(body.bare.public-surface > .site-destination:not(.site-destination--center-content)) {
  height: 100%;
}
body.bare.public-surface:has(> .site-destination:not(.site-destination--center-content)) {
  height: 100dvh;
  max-height: 100dvh;
  overflow: hidden;
}
body.bare.public-surface:has(> .site-destination:not(.site-destination--center-content)) > .site-destination {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}

.card {
  background: var(--surface);
  border: 1px solid var(--border-input);
  padding: 2rem;
  width: 100%;
  max-width: 380px;
}

.panel { background: var(--surface); border: 1px solid var(--border); padding: 1.5rem; margin-bottom: 1.25rem; }
.panel h2 { font-size: 1rem; font-weight: 600; margin-bottom: 1rem; }

.notice { border: 1px solid var(--border-input); background: var(--hover); color: var(--text); padding: 0.6rem 0.875rem; font-size: 0.8rem; margin-bottom: 1rem; border-radius: var(--radius, 0.125rem); }

.wall-block + .wall-block { margin-top: 1.15rem; padding-top: 1.15rem; border-top: 1px solid var(--border); }
.wall-block-title {
  font-size: 0.95rem;
  font-weight: 600;
  margin: 0 0 0.4rem;
  line-height: 1.3;
}
.wall-content .wall-block p {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.45;
  color: var(--text-muted);
}
.wall-content .wall-block p + p { margin-top: 0.45rem; }
.wall-content-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  margin-bottom: 0.35rem;
}
.wall-block-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}
.wall-block-top-main { min-width: 0; flex: 1; }
.wall-block-delete { margin: 0; flex: 0 0 auto; }
.wall-block-delete .btn-xs { width: auto; }
.wall-block--accented {
  border-left: 3px solid var(--wall-accent, var(--border));
  padding-left: 0.75rem;
}
.wall-block-meta { font-size: 0.78rem; margin: 0.35rem 0 0.5rem; }
.wall-block-meta--poster {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.75rem;
}

.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }
.table-wrap table { max-width: 100%; }
.table-wrap--scroll table { max-width: none; }
.table-wrap td,
.table-wrap th { overflow-wrap: anywhere; word-break: break-word; }
.table-wrap td.num,
.table-wrap th.num,
.table-wrap td.actions-cell {
  overflow-wrap: normal;
  word-break: normal;
  white-space: nowrap;
}
table { width: 100%; border-collapse: collapse; font-size: 0.875rem; background: var(--surface); border: 1px solid var(--border); }
th { text-align: left; padding: 0.625rem 1rem; font-weight: 600; font-size: 0.8rem; color: var(--text-muted); border-bottom: 1px solid var(--border); }
td { padding: 0.625rem 1rem; border-bottom: 1px solid var(--bg); }
tr:last-child td { border-bottom: none; }

.stat-grid { display: flex; flex-wrap: wrap; gap: 1rem; margin-bottom: 1.5rem; }
.stat {
  background: var(--surface);
  border: 1px solid var(--border);
  padding: 1.25rem 1.75rem;
  min-width: 170px;
  container-type: inline-size;
}
a.stat--link {
  display: block;
  text-decoration: none;
  color: inherit;
  transition: border-color 0.15s, background 0.15s;
}
a.stat--link:hover {
  border-color: var(--accent);
  background: var(--hover);
}
.chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}
.chip-btn { min-width: 3rem; }
.vault-lock-chip { display: inline-flex; flex-direction: column; align-items: center; line-height: 1.2; padding: 0.35rem 0.5rem; }
.vault-lock-chip-meta { display: block; font-size: 0.65rem; font-weight: 400; opacity: 0.85; margin-top: 0.15rem; }
.vault-lock-card--focus { outline: 2px solid var(--accent); outline-offset: 2px; }
.vault-lock-panel { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.vault-lock-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem;
  align-items: flex-start;
}

body.app-modal-open { overflow: hidden; }
.app-modal {
  position: fixed;
  inset: 0;
  z-index: 300;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: max(1rem, env(safe-area-inset-top)) 1rem 1rem;
  box-sizing: border-box;
}
.app-modal[hidden] { display: none !important; }
.app-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
}
a.app-modal-backdrop {
  cursor: pointer;
  text-decoration: none;
  color: inherit;
}
.app-modal-panel {
  position: relative;
  z-index: 1;
  width: min(28rem, 100%);
  max-height: min(90vh, 920px);
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
  overflow: hidden;
  margin: 2rem auto;
}
.app-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.9rem 1rem;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.app-modal-title { margin: 0; font-size: 1.05rem; }
.app-modal-close { flex-shrink: 0; }
.app-modal-body {
  padding: 1.1rem;
  overflow-y: auto;
  flex: 1;
  min-height: 0;
}
.app-modal-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-top: 1rem;
}

.icon-grid-scroll {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding-right: 0.15rem;
}
.icon-grid-widget:not(.icon-grid-widget--picker) .icon-grid-scroll {
  overflow: visible;
}

.icon-pack-toolbar { display: flex; gap: 0.5rem; flex-wrap: wrap; align-items: center; margin-bottom: 0.75rem; }
.icon-pack-toolbar-spacer { flex: 1; min-width: 0.5rem; }
.icon-pack-filter-meta { font-size: 0.78rem; margin-left: 0.25rem; }
.icon-pack-stats {
  display: flex; flex-wrap: wrap; gap: 0.75rem 1.25rem; margin-bottom: 1rem;
  padding: 0.75rem 1rem; border-radius: var(--radius, 6px);
  background: var(--surface-2, rgba(255,255,255,0.03)); border: 1px solid var(--border);
}
.icon-pack-stat { display: flex; flex-direction: column; gap: 0.1rem; min-width: 4.5rem; }
.icon-pack-stat-value { font-size: 1.15rem; font-weight: 600; line-height: 1.1; font-variant-numeric: tabular-nums; }
.icon-pack-stat-label { font-size: 0.72rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: 0.04em; }
.icon-pack-filters {
  display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 0.75rem; align-items: center;
}
.icon-pack-search {
  flex: 1; min-width: 10rem; max-width: 18rem;
  padding: 0.35rem 0.6rem; font-size: 0.85rem;
}
.icon-pack-filter-select {
  padding: 0.35rem 0.5rem; font-size: 0.82rem; max-width: 14rem;
}
.icon-pack-table-head {
  display: grid; grid-template-columns: 1.5rem 1fr auto auto;
  gap: 0.75rem; padding: 0.25rem 0 0.35rem; font-size: 0.7rem;
  color: var(--text-dim); text-transform: uppercase; letter-spacing: 0.04em;
  border-bottom: 1px solid var(--border);
}
.icon-pack-list { display: flex; flex-direction: column; gap: 0; max-height: min(70vh, 42rem); overflow-y: auto; }
.icon-pack-empty { padding: 1.5rem 0; text-align: center; margin: 0; }
.icon-pack-row {
  display: flex; flex-direction: row; align-items: flex-start; gap: 0.75rem;
  padding: 0.5rem 0; border-bottom: 1px solid var(--border);
}
.icon-pack-row-compact {
  display: grid;
  grid-template-columns: 1.5rem 1fr auto auto;
  align-items: center;
  gap: 0.75rem;
  padding: 0.4rem 0;
}
.icon-pack-row-compact input[type=checkbox] { align-self: center; }
.icon-pack-row-compact .btn-xs { align-self: center; }
.icon-pack-row:last-child { border-bottom: none; }
.icon-pack-row input[type=checkbox] {
  width: auto; flex-shrink: 0; margin: 0; padding: 0; align-self: center;
}
.icon-pack-info { flex: 1; min-width: 0; }
.icon-pack-primary { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem 0.5rem; }
.icon-pack-info strong { font-size: 0.85rem; }
.icon-pack-id { font-size: 0.72rem; opacity: 0.65; }
.icon-pack-meta { font-size: 0.78rem; color: var(--text-dim); margin-left: 0.5rem; }
.icon-pack-repo { font-size: 0.75rem; color: var(--text-dim); margin-top: 0.15rem; }
.icon-pack-note { font-size: 0.75rem; color: var(--text-dim); margin-top: 0.15rem; }
.icon-pack-details { margin-top: 0.2rem; font-size: 0.75rem; }
.icon-pack-details summary { cursor: pointer; list-style: none; }
.icon-pack-details summary::-webkit-details-marker { display: none; }
.icon-pack-counts {
  font-size: 0.78rem; font-variant-numeric: tabular-nums; color: var(--text-dim);
  white-space: nowrap; text-align: right; min-width: 4.5rem;
}
.icon-pack-count-sep { opacity: 0.45; margin: 0 0.15rem; }
.icon-pack-row .btn-xs { flex-shrink: 0; min-width: 3.5rem; }
.icon-pack-pager {
  display: flex; align-items: center; justify-content: center; gap: 0.75rem;
  margin-top: 0.75rem; padding-top: 0.5rem; border-top: 1px solid var(--border);
}
.icon-pack-pager-label { font-size: 0.8rem; color: var(--text-dim); font-variant-numeric: tabular-nums; }
.icon-pack-hidden-inputs {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.icon-pack-group-header {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 0.5rem;
  margin: 1rem 0 0.35rem; padding-top: 0.5rem; border-top: 1px solid var(--border);
}
.icon-pack-group-header:first-of-type { border-top: none; padding-top: 0; margin-top: 0.5rem; }
.icon-pack-group-title { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; font-size: 0.9rem; }
.icon-grid-bulk-bar { display: flex; gap: 0.5rem; flex-wrap: wrap; align-items: center; margin-bottom: 0.75rem; }

.admin-job-banner { margin-bottom: 1rem; }
.admin-job-banner-running { border-color: #2563eb; }
.admin-job-banner-title { margin: 0 0 0.35rem; font-weight: 600; font-size: 0.9rem; }
.admin-job-banner-meta { margin: 0; font-size: 0.85rem; }
.admin-job-banner-hint { margin: 0.5rem 0 0; font-size: 0.78rem; }
.admin-job-log { margin-top: 1.5rem; }
.admin-job-log-compact .admin-job-log-entries { max-height: min(60vh, 28rem); overflow-y: auto; }
.admin-job-log-compact-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; margin: 0.5rem 0; }
.admin-job-log-entry-fail { border-left: 2px solid #dc2626; padding-left: 0.5rem; margin-left: -0.5rem; }
.admin-job-log-summary {
  font-weight: 600; font-size: 0.9rem; cursor: pointer; padding: 0.5rem 0;
  display: flex; align-items: center; gap: 0.5rem;
}
.admin-job-log-entry { margin-top: 0.875rem; }
.admin-job-log-entry-title { font-size: 0.8rem; font-weight: 600; margin: 0 0 0.375rem; }
.badge-xs { font-size: 0.65rem; padding: 0.1rem 0.35rem; }

.color-swatch {
  width: 24px; height: 24px; border-radius: 50%; border: 2px solid var(--border);
  cursor: pointer; padding: 0; flex-shrink: 0;
}
.color-swatch:hover    { border-color: var(--text-muted); }
.color-swatch.selected { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent) inset; }
#icon_color_custom { width: 32px; height: 24px; padding: 2px; cursor: pointer; }

.disclosure { border: 1px solid var(--border); }
.disclosure + .disclosure { margin-top: -1px; }
.disclosure summary {
  display: flex; align-items: center; justify-content: space-between; gap: 0.75rem;
  padding: 0.5rem 0.875rem; cursor: pointer; list-style: none; user-select: none;
  background: var(--surface); font-size: 0.8rem; font-weight: 600; color: var(--text);
}
.disclosure summary::-webkit-details-marker { display: none; }
.disclosure summary:hover { background: var(--hover); }
.disclosure-arrow {
  font-size: 0.9rem; color: var(--text-dim); flex-shrink: 0;
  display: inline-block; transition: transform 0.15s ease;
}
.disclosure[open] > summary .disclosure-arrow { transform: rotate(90deg); }
.disclosure-body { padding: 0.875rem; border-top: 1px solid var(--border); }

.panel-danger { background: var(--surface); border: 1px solid #dc2626; padding: 1.5rem; margin-bottom: 1.25rem; }
.panel-danger h2 { font-size: 1rem; font-weight: 600; margin-bottom: 0.25rem; color: #dc2626; }
.panel-danger p { margin-top: 0.375rem; margin-bottom: 1rem; }
button.danger     { background: #dc2626; color: #fff; }
button.danger:hover { background: #b91c1c; }
.danger-btn { color: #dc2626 !important; }

textarea { border: 1px solid var(--border-input); border-radius: 0.125rem; padding: 0.5rem 0.75rem; font-size: 0.875rem; width: 100%; outline: none; background: var(--surface); color: var(--text); resize: vertical; font-family: inherit; }
textarea:focus { border-color: var(--accent); }

.btn-xs { padding: 0.15rem 0.5rem; font-size: 0.72rem; width: auto; border-radius: 0.125rem; }
.select-xs { font-size: 0.72rem; padding: 0.15rem 0.25rem; border: 1px solid var(--border-input); background: var(--surface); color: var(--text); border-radius: 0.125rem; cursor: pointer; }
.actions-cell { white-space: nowrap; }
.actions-cell form { margin: 0 1px; }
.badge-sm { font-size: 0.68rem; padding: 0.15rem 0.4rem; border-radius: 0.125rem; color: #fff; }

.badge-muted { background: var(--text-muted); color: var(--on-muted, var(--bg)); }

.text-dim { color: var(--text-dim); font-size: 0.825rem; }
.accent-surface .text-dim,
.shell-chrome .text-dim {
  color: color-mix(in srgb, var(--text-muted) 55%, var(--text) 45%);
}

.profile-public-surface .text-dim {
  color: var(--text-dim);
}

.mt-0  { margin-top: 0; }
.mt-1  { margin-top: 0.25rem; }
.mt-2  { margin-top: 0.5rem; }
.mt-3  { margin-top: 0.75rem; }
.mt-4  { margin-top: 1rem; }
.mt-6  { margin-top: 1.5rem; }

.mb-0  { margin-bottom: 0; }
.mb-1  { margin-bottom: 0.25rem; }
.mb-2  { margin-bottom: 0.5rem; }
.mb-3  { margin-bottom: 0.75rem; }
.mb-4  { margin-bottom: 1rem; }
.mb-6  { margin-bottom: 1.5rem; }

.gap-sm  { gap: 0.5rem; }
.gap-md  { gap: 0.75rem; }
.gap-lg  { gap: 1rem; }

.text-sm   { font-size: 0.875rem; }
.text-xs   { font-size: 0.75rem; }
.flex-wrap { flex-wrap: wrap; }
.align-center { align-items: center; }

.back-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.875rem;
  color: var(--text-dim);
  text-decoration: none;
  margin-bottom: 0.75rem;
}
.back-link:hover { color: var(--text); }

.page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
}
.page-header h1 { margin: 0; }
.page-header-left  { display: flex; align-items: center; gap: 0.75rem; }
.page-header-right { display: flex; align-items: center; gap: 0.5rem; flex-shrink: 0; }