@font-face {
  font-family: "Passo";
  src: url("/fonts/Passo-Variable.woff") format("woff");
  font-style: normal;
  font-weight: 100 800;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("/fonts/Inter-Variable-Latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  color-scheme: light;
  --tp-text-primary: #25002d;
  --tp-text-secondary: #575757;
  --tp-overlay: rgb(37 0 45 / 55%);
  --tp-surface-page: #faf8fb;
  --tp-surface-card: #fff;
  --tp-border-default: #e5e5e5;
  --tp-action-primary: #6b0080;
  --tp-action-primary-hover: #4b005a;
  --tp-action-primary-foreground: #fff;
  --tp-action-accent: #fae4ff;
  --tp-gradient-deep: linear-gradient(135deg, #6b0080 0%, #4b005a 100%);
  --tp-status-success-foreground: #00664e;
  --tp-status-success-background: #ebfffa;
  --tp-status-warning-foreground: #765d00;
  --tp-status-warning-background: #fff4c8;
  --tp-status-danger-foreground: #b0003b;
  --tp-status-danger-background: #FFDBE7;
  --tp-purple: var(--tp-action-primary);
  --tp-russian-violet: #4b005a;
  --tp-mauveine: #81009b;
  --tp-phlox: #d500ff;
  --tp-pale-purple: var(--tp-action-accent);
  --tp-orange: #ff5900;
  --tp-folly: #ff0056;
  --tp-aquamarine: #00ecb5;
  --tp-sea-green: #009572;
  --tp-chart-1: #6b0080;
  --tp-chart-2: #d500ff;
  --tp-chart-3: #ff5900;
  --tp-chart-4: #ffce00;
  --tp-chart-5: #00aa83;
  --tp-chart-6: #009572;
  --tp-chart-text: #575757;
  --tp-chart-grid: #e5e5e5;
  --tp-success-text: var(--tp-status-success-foreground);
  --tp-battleship-gray: #9b9b9b;
  --tp-silver: #c6c6c6;
  --tp-platinum: var(--tp-border-default);
  --tp-white-smoke: var(--tp-surface-page);
  --tp-white: var(--tp-surface-card);
  --tp-ink: var(--tp-text-primary);
  --tp-davys-gray: var(--tp-text-secondary);
  --font-brand: "Passo", "Inter", "Segoe UI", system-ui, Arial, sans-serif;
  --font-ui: "Passo", "Inter", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 18px;
  --radius-full: 999px;
  --shadow-sm: 0 8px 24px color-mix(in srgb, var(--tp-russian-violet) 8%, transparent);
  --shadow-md: 0 20px 56px color-mix(in srgb, var(--tp-russian-violet) 18%, transparent);
  --line: var(--tp-border-default);
  --muted: var(--tp-text-secondary);
  --surface: var(--tp-surface-card);
  --focus: var(--tp-action-primary);
  --tp-control-height: 44px;
  --tp-space-1: 4px;
  --tp-space-2: 8px;
  --tp-space-3: 12px;
  --tp-space-4: 16px;
  --tp-space-5: 24px;
  --tp-space-6: 32px;
  --tp-cell-padding: 16px;
  --tp-duration-normal: 160ms;
  --tp-elevation-1: 0 8px 24px rgb(75 0 90 / 8%);
  --tp-elevation-menu: 0 12px 16px -4px rgb(16 24 40 / 8%), 0 4px 6px -2px rgb(16 24 40 / 3%);
  --tp-z-dropdown: 30;
  font-family: var(--font-ui);
}

[data-theme="dark"] {
  color-scheme: dark;
  --tp-text-primary: #f6f0f8;
  --tp-text-secondary: #d0c6d4;
  --tp-overlay: rgb(0 0 0 / 64%);
  --tp-surface-page: #19151c;
  --tp-surface-card: #251f29;
  --tp-border-default: #4d4153;
  --tp-action-primary: #edbaf7;
  --tp-action-primary-hover: #fae4ff;
  --tp-action-primary-foreground: #4b005a;
  --tp-action-accent: #39203f;
  --tp-status-success-foreground: #80e4cc;
  --tp-status-success-background: #123e33;
  --tp-status-warning-foreground: #ffdb49;
  --tp-status-warning-background: #423700;
  --tp-status-danger-foreground: #ffabc6;
  --tp-status-danger-background: #501b30;
  --tp-white-smoke: var(--tp-surface-page);
  --tp-platinum: var(--tp-border-default);
  --tp-silver: var(--tp-border-default);
  --tp-pale-purple: var(--tp-action-accent);
  --tp-chart-1: #edbaf7;
  --tp-chart-2: #d500ff;
  --tp-chart-3: #ff9c6b;
  --tp-chart-4: #ffdb49;
  --tp-chart-5: #80e4cc;
  --tp-chart-6: #35c6a1;
  --tp-chart-text: #d0c6d4;
  --tp-chart-grid: #4d4153;
  --tp-ink: var(--tp-text-primary);
  --tp-davys-gray: var(--tp-text-secondary);
  --tp-success-text: var(--tp-status-success-foreground);
  --muted: var(--tp-text-secondary);
  --surface: var(--tp-surface-card);
  --line: var(--tp-border-default);
  --focus: var(--tp-action-primary);
  --shadow-sm: 0 8px 24px rgb(0 0 0 / 24%);
  --shadow-md: 0 20px 56px rgb(0 0 0 / 36%);
  --tp-elevation-menu: 0 12px 32px rgb(0 0 0 / 55%);
}

* { box-sizing: border-box; }
body { min-width: 320px; margin: 0; color: var(--tp-text-primary); background: var(--tp-surface-card); font-family: var(--font-ui); line-height: 1.5; }
button, input { font: inherit; }
a { color: var(--tp-purple); }
p { line-height: 1.55; }
h1, h2, h3, h4 { color: var(--tp-text-primary); font-family: var(--font-brand); letter-spacing: -.035em; }

.skip-link { position: fixed; z-index: 100; top: 8px; left: 8px; padding: 10px 14px; transform: translateY(-160%); border-radius: var(--radius-md); color: var(--tp-action-primary-foreground); background: var(--tp-action-primary); font-weight: 700; }
.skip-link:focus { transform: translateY(0); }
.demo-body, .privacy-portal-body { display: flex; min-height: 100vh; flex-direction: column; background: var(--tp-surface-page); }
.demo-header { position: sticky; z-index: 8; top: 0; display: flex; min-height: 88px; justify-content: space-between; align-items: stretch; gap: 28px; padding: 0 max(28px, calc((100vw - 1180px) / 2)); border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--tp-surface-card) 94%, transparent); backdrop-filter: blur(14px); }
.demo-brand { display: flex; width: 226px; justify-content: center; align-items: center; padding: 18px 28px; background: var(--tp-gradient-deep); }
.demo-brand img { display: block; width: 170px; height: auto; }
.demo-nav { display: flex; align-items: center; gap: clamp(14px, 2.4vw, 30px); }
.demo-nav > a:not(.button) { color: var(--tp-text-secondary); font-size: .9rem; font-weight: 650; text-decoration: none; }
.demo-nav > a:not(.button):hover { color: var(--tp-action-primary); }
.demo-admin-link { min-height: 42px; padding-inline: 18px; }
.demo-theme-toggle { width: 42px; height: 42px; }
.demo-page { max-width: 1180px; margin: auto; padding: clamp(64px, 9vw, 112px) 28px 320px; }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; margin: 0 0 12px; color: var(--tp-purple); font-size: .74rem; font-weight: 800; letter-spacing: .1em; }
.eyebrow::before { width: 22px; height: 3px; border-radius: var(--radius-full); background: var(--tp-phlox); content: ""; }
.demo-hero { display: grid; min-height: min(660px, calc(100vh - 160px)); grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr); align-items: center; gap: clamp(42px, 7vw, 92px); }
.demo-hero-copy { min-width: 0; }
.demo-page h1 { max-width: 720px; margin: 0 0 26px; font-size: clamp(3rem, 6.5vw, 5.15rem); line-height: .98; }
h2 { margin: 0; font-size: clamp(1.55rem, 3vw, 2.1rem); line-height: 1.08; }
h3 { margin: 0 0 5px; font-size: 1rem; }
.lede { max-width: 650px; color: var(--tp-davys-gray); font-size: clamp(1rem, 1.6vw, 1.16rem); }
.demo-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.demo-disclaimer { margin: 22px 0 0; color: var(--tp-text-secondary); font-size: .78rem; }
.demo-journey-card { position: relative; overflow: hidden; padding: clamp(28px, 4vw, 44px); border-radius: 32px; color: #fff; background: linear-gradient(145deg, #4b005a, #6b0080 58%, #81009b); box-shadow: var(--shadow-md); isolation: isolate; }
.demo-journey-card::before { position: absolute; z-index: -1; top: -46%; right: -35%; width: 380px; aspect-ratio: 1; border: 1px solid rgb(255 255 255 / 18%); border-radius: 50%; content: ""; }
.demo-journey-card .eyebrow { color: #fff; }
.demo-journey-list { display: grid; gap: 16px; margin: 18px 0 0; padding: 0; list-style: none; }
.demo-journey-list li { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 14px; padding: 20px; border: 1px solid rgb(255 255 255 / 14%); border-radius: var(--radius-lg); background: rgb(37 0 45 / 72%); }
.demo-journey-list li > span { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 50%; color: #fff; background: rgb(213 0 255 / 24%); font-size: .75rem; font-weight: 800; }
.demo-journey-list strong { display: block; color: #fff; font-family: var(--font-brand); font-size: 1.05rem; }
.demo-journey-list p { margin: 4px 0 0; color: rgb(255 255 255 / 76%); font-size: .88rem; }
.demo-status-section { display: grid; grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr); align-items: center; gap: clamp(28px, 6vw, 72px); margin-top: 104px; padding: clamp(30px, 5vw, 52px); border: 1px solid var(--line); border-radius: 28px; background: var(--tp-surface-card); box-shadow: var(--shadow-sm); scroll-margin-top: 112px; }
.demo-status-section > div:first-child > p:last-child { margin: 14px 0 0; color: var(--tp-text-secondary); }
.status-card { display: flex; max-width: none; gap: 14px; margin: 0; padding: 22px; border: 1px solid var(--line); border-left: 4px solid var(--tp-status-warning-foreground); border-radius: var(--radius-lg); background: var(--tp-surface-page); }
.status-card p { margin: 4px 0 0; color: var(--muted); }
.status-dot { width: 12px; height: 12px; flex: 0 0 auto; margin-top: 5px; border-radius: 50%; background: var(--tp-status-warning-foreground); }
.status-dot.is-ready { background: var(--tp-status-success-foreground); }
.status-card:has(.status-dot.is-ready) { border-left-color: var(--tp-status-success-foreground); }
.demo-how { margin-top: 104px; scroll-margin-top: 112px; }
.demo-how > h2 { max-width: 720px; }
.demo-how-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 34px; }
.demo-how-grid article { min-width: 0; padding: 26px; border: 1px solid var(--line); border-radius: var(--radius-xl); background: var(--tp-surface-card); box-shadow: var(--shadow-sm); }
.demo-how-grid article > span { display: inline-grid; min-width: 38px; min-height: 30px; place-items: center; border-radius: var(--radius-full); color: var(--tp-action-primary); background: var(--tp-action-accent); font-size: .75rem; font-weight: 800; }
.demo-how-grid h3 { margin-top: 22px; font-size: 1.2rem; }
.demo-how-grid p { margin: 10px 0 0; color: var(--tp-text-secondary); }
.demo-page, .integration-main, .privacy-policy-main, .privacy-portal-main { flex: 1 0 auto; width: 100%; }
.demo-footer { display: flex; min-height: 132px; justify-content: space-between; align-items: center; gap: 24px; margin-top: auto; padding: 32px max(28px, calc((100vw - 1180px) / 2)); color: rgb(255 255 255 / 78%); background: var(--tp-russian-violet); }
.demo-footer img { width: 170px; height: auto; }
.demo-footer p { margin: 0; font-size: .85rem; }
.privacy-portal-header { display: flex; min-height: 88px; justify-content: space-between; align-items: center; padding: 18px max(28px, calc((100vw - 1120px) / 2)); background: var(--tp-gradient-deep); }
.privacy-portal-header a { display: inline-flex; align-items: center; }
.privacy-portal-header img { display: block; width: 170px; height: auto; }
.privacy-portal-header .admin-login-theme { color: #fff; border-color: rgb(255 255 255 / 45%); background: rgb(255 255 255 / 8%); }
.privacy-portal-main { display: grid; max-width: 1120px; grid-template-columns: minmax(0, .82fr) minmax(440px, 1.18fr); align-items: start; gap: clamp(38px, 7vw, 88px); margin: auto; padding: clamp(64px, 8vw, 100px) 28px 120px; }
.privacy-portal-intro { position: sticky; top: 36px; }
.privacy-portal-intro h1 { margin: 0 0 24px; font-size: clamp(2.8rem, 6vw, 4.7rem); line-height: .98; }
.privacy-portal-intro > p:not(.eyebrow) { color: var(--tp-text-secondary); font-size: 1.05rem; }
.privacy-portal-intro .notice { margin-top: 32px; }
.privacy-request-card { padding: clamp(24px, 4vw, 38px); }
.privacy-request-card h2 { margin-bottom: 24px; }
.privacy-request-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.privacy-request-form #privacy-request-type { max-width: 360px; }
.privacy-request-form textarea { width: 100%; resize: vertical; }
.privacy-request-form .checkbox-field { display: flex; flex-direction: row; align-items: flex-start; gap: 10px; font-weight: 500; }
.privacy-request-form .checkbox-field input { width: 18px; min-height: 18px; margin-top: 3px; }
.link-button, .details-button { padding: 0; border: 0; color: var(--tp-purple); background: transparent; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }

.consent-banner { position: fixed; z-index: 10; right: 20px; bottom: 20px; left: 20px; display: flex; max-width: 1080px; justify-content: space-between; align-items: flex-end; gap: 28px; margin: auto; padding: 28px; border: 1px solid var(--line); border-top: 4px solid var(--tp-purple); border-radius: var(--radius-lg); background: color-mix(in srgb, var(--tp-surface-card) 98%, transparent); box-shadow: var(--shadow-md); }
.banner-copy { max-width: 650px; }
.banner-copy h2 { margin-bottom: 8px; }
.banner-copy p { margin: 8px 0; color: var(--tp-davys-gray); }
.policy-links { font-size: .9rem; }
.policy-links a { font-weight: 700; text-underline-offset: 3px; }
.banner-actions, .dialog-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.button { display: inline-flex; min-height: var(--tp-control-height); justify-content: center; align-items: center; padding: 0 20px; border: 0; border-radius: var(--radius-md); cursor: pointer; font-family: var(--font-ui); font-size: .94rem; font-weight: 600; text-align: center; text-decoration: none; transition: background-color var(--tp-duration-normal) ease, color var(--tp-duration-normal) ease, transform var(--tp-duration-normal) ease; }
.button:hover { transform: translateY(-1px); }
.button-primary { color: var(--tp-action-primary-foreground); background: var(--tp-action-primary); box-shadow: 0 8px 20px rgb(107 0 128 / 18%); }
.button-primary:hover { background: var(--tp-action-primary-hover); }
.button-secondary { border: 2px solid var(--tp-purple); color: var(--tp-purple); background: var(--tp-surface-card); }
.button-secondary:hover { background: var(--tp-pale-purple); }

dialog { border: 0; }
.preferences { width: min(680px, calc(100vw - 28px)); max-height: min(760px, calc(100vh - 28px)); padding: 0; border: 1px solid var(--tp-border-default); border-radius: var(--radius-lg); color: var(--tp-ink); background: var(--tp-surface-card); box-shadow: var(--shadow-md); }
.preferences::backdrop { background: var(--tp-overlay); }
.preferences form { padding: 28px; }
.dialog-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; }
.icon-button { width: 40px; height: 40px; border: 0; border-radius: 50%; color: var(--tp-text-primary); background: var(--tp-pale-purple); font-size: 1.5rem; cursor: pointer; }
.dialog-intro { color: var(--tp-davys-gray); }
.category-list { display: grid; gap: 10px; margin: 24px 0; }
.category-row { display: flex; justify-content: space-between; gap: 20px; padding: 16px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--tp-surface-card); }
.category-row p { margin: 0 0 8px; color: var(--tp-davys-gray); font-size: .92rem; }
.category-details { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--tp-platinum); color: var(--tp-davys-gray); font-size: .85rem; }
.switch { flex: 0 0 auto; }
.switch input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.slider { display: block; width: 48px; height: 28px; padding: 3px; border-radius: var(--radius-full); background: var(--tp-silver); cursor: pointer; }
.slider::before { display: block; width: 22px; height: 22px; border-radius: 50%; background: var(--tp-surface-card); content: ""; transition: transform .2s ease; }
.switch input:checked + .slider { background: var(--tp-purple); }
.switch input:checked + .slider::before { transform: translateX(20px); }
.switch input:disabled + .slider { opacity: .72; cursor: not-allowed; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.admin-body { min-height: 100vh; background: var(--tp-surface-page); }
.admin-header { display: flex; min-height: 76px; justify-content: space-between; align-items: center; gap: 20px; padding: 12px max(24px, calc((100vw - 1500px) / 2)); border-bottom: 1px solid var(--line); color: var(--tp-text-primary); background: var(--tp-surface-card); }
.admin-header-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--tp-space-2); }
.admin-header .eyebrow, .admin-main .eyebrow { font-size: .75rem; font-weight: 700; letter-spacing: .04em; }
.admin-header .eyebrow { margin-bottom: 2px; }
.admin-header h1 { margin: 0; color: var(--tp-text-primary); font-size: 2rem; letter-spacing: -.03em; }
.admin-main { max-width: none; margin: 0; padding: 0; }
#admin-app { display: grid; grid-template-columns: 290px minmax(0, 1fr); min-height: 100vh; transition: grid-template-columns var(--tp-duration-slow, 220ms) cubic-bezier(.2,.7,.2,1); }
#admin-app[hidden] { display: none; }
#admin-app.admin-sidebar-collapsed { grid-template-columns: 76px minmax(0, 1fr); }
.admin-auth-pending #login-panel { visibility: hidden; }
.admin-sidebar { position: sticky; top: 0; display: flex; height: 100vh; flex-direction: column; gap: 12px; overflow-y: auto; padding: 20px; border-right: 1px solid var(--line); background: var(--tp-surface-card); }
.admin-sidebar-brand { position: relative; display: flex; width: 100%; min-height: 76px; justify-content: center; align-items: center; padding: 18px 12px; border-radius: var(--radius-md); background: var(--tp-surface-card); text-decoration: none; transition: width var(--tp-duration-slow, 220ms) cubic-bezier(.2,.7,.2,1), min-height var(--tp-duration-slow, 220ms) cubic-bezier(.2,.7,.2,1), padding var(--tp-duration-slow, 220ms) cubic-bezier(.2,.7,.2,1), background var(--tp-duration-normal, 160ms) ease; }
.admin-brand-wordmark { display: block; width: min(210px, 100%); height: auto; transform: scaleX(1); transform-origin: center; transition: opacity var(--tp-duration-fast, 120ms) ease, transform var(--tp-duration-slow, 220ms) cubic-bezier(.2,.7,.2,1), visibility var(--tp-duration-fast, 120ms) ease; }
.admin-brand-wordmark-positive { display: block; }
.admin-brand-wordmark-negative { display: none; }
.admin-brand-symbol { position: absolute; display: block; width: 52px; height: 52px; opacity: 0; visibility: hidden; transform: scale(.72); transform-origin: center; transition: opacity var(--tp-duration-fast, 120ms) ease, transform var(--tp-duration-slow, 220ms) cubic-bezier(.2,.7,.2,1), visibility var(--tp-duration-fast, 120ms) ease; }
.admin-sidebar-toggle { display: flex; width: 44px; min-height: var(--tp-control-height); justify-content: center; align-items: center; gap: 8px; padding: 8px; border: 1px solid transparent; border-radius: var(--radius-md); color: var(--tp-text-secondary); background: transparent; font: inherit; font-size: .82rem; font-weight: 600; cursor: pointer; }
.admin-sidebar-toggle:hover { color: var(--tp-action-primary); background: var(--tp-action-accent); }
.admin-sidebar-toggle:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.admin-sidebar-toggle svg { width: 20px; height: 20px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
[data-theme="dark"] .admin-sidebar { border-color: rgb(255 255 255 / 16%); background: var(--tp-surface-page); }
[data-theme="dark"] .admin-sidebar-brand { background: var(--tp-russian-violet); }
[data-theme="dark"] .admin-brand-wordmark-positive { display: none; }
[data-theme="dark"] .admin-brand-wordmark-negative { display: block; }
[data-theme="dark"] .admin-sidebar-label, [data-theme="dark"] .admin-sidebar-note { color: rgb(255 255 255 / 76%); }
[data-theme="dark"] .admin-sidebar-nav a { color: rgb(255 255 255 / 84%); }
[data-theme="dark"] .admin-sidebar-nav a:hover, [data-theme="dark"] .admin-sidebar-nav a[aria-current="page"] { color: var(--tp-action-primary); background: var(--tp-action-accent); }
[data-theme="dark"] .admin-sidebar-nav a[aria-current="page"]::before { background: var(--tp-action-primary); }
[data-theme="dark"] .admin-sidebar-toggle { color: rgb(255 255 255 / 84%); }
[data-theme="dark"] .admin-sidebar-toggle:hover { color: var(--tp-action-primary); background: var(--tp-action-accent); }
.admin-sidebar-note { color: var(--muted); font-size: .78rem; }
.admin-sidebar-label { margin: 10px 8px 0; color: var(--muted); font-size: .75rem; font-weight: 400; line-height: 1.25rem; letter-spacing: 0; }
.admin-sidebar-nav { display: grid; gap: 4px; }
.admin-nav-group-label { margin-top: 18px; }
.admin-sidebar-nav a { position: relative; display: flex; min-height: var(--tp-control-height); align-items: center; gap: 12px; padding: 8px 12px; border-radius: var(--radius-md); color: var(--tp-text-secondary); font-size: .9rem; font-weight: 600; text-decoration: none; transition: color var(--tp-duration-normal) ease, background var(--tp-duration-normal) ease; }
.admin-nav-icon { width: 20px; height: 20px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.admin-sidebar-nav a:hover { color: var(--tp-action-primary); background: color-mix(in srgb, var(--tp-action-accent) 52%, transparent); }
.admin-sidebar-nav a:focus-visible { z-index: 1; outline: 3px solid var(--focus); outline-offset: 2px; color: var(--tp-action-primary); }
.admin-sidebar-nav a[aria-current="page"] { color: var(--tp-action-primary); background: var(--tp-action-accent); font-weight: 700; }
.admin-sidebar-nav a[aria-current="page"]::before { position: absolute; top: 9px; bottom: 9px; left: 0; width: 3px; border-radius: 0 var(--radius-full) var(--radius-full) 0; background: var(--tp-action-primary); content: ""; }
.admin-sidebar-cta { display: flex; flex: 0 0 auto; flex-direction: column; align-items: center; gap: var(--tp-space-3); margin-top: auto; padding: var(--tp-space-5) var(--tp-space-4); border-radius: var(--radius-xl); color: #fff; background: var(--tp-gradient-deep); text-align: center; }
.admin-sidebar-cta[hidden], .admin-sidebar-collapsed .admin-sidebar-cta { display: none; }
.admin-sidebar-cta-dots { display: grid; grid-template-columns: repeat(3, 8px); gap: 8px; margin-bottom: var(--tp-space-2); }
.admin-sidebar-cta-dots i { width: 8px; height: 8px; border-radius: 50%; background: rgb(255 255 255 / 10%); }
.admin-sidebar-cta h2 { margin: 0; color: inherit; font-size: 1.08rem; line-height: 1.3; }
.admin-sidebar-cta p { margin: 0; color: rgb(255 255 255 / 84%); font-size: .86rem; line-height: 1.4; }
.admin-sidebar-cta a { display: flex; width: 100%; min-height: var(--tp-control-height); justify-content: center; align-items: center; padding: 8px 12px; border-radius: var(--radius-md); color: var(--tp-russian-violet); background: #fff; font-weight: 700; text-decoration: none; }
.admin-sidebar-cta a:hover { background: var(--tp-action-accent); }
.admin-sidebar-cta a:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.admin-sidebar-collapsed .admin-sidebar-brand { min-height: 52px; }
.admin-sidebar-collapsed .admin-sidebar { padding-inline: 12px; overflow-x: hidden; }
.admin-sidebar-collapsed .admin-sidebar-brand { width: 52px; padding: 0; background: transparent; }
.admin-sidebar-collapsed .admin-brand-wordmark { opacity: 0; visibility: hidden; transform: scale(.86); }
.admin-sidebar-collapsed .admin-brand-symbol { opacity: 1; visibility: visible; transform: scale(1); }
.admin-sidebar-collapsed .admin-sidebar-toggle { justify-content: center; padding-inline: 8px; }
.admin-sidebar-collapsed .admin-sidebar-toggle span, .admin-sidebar-collapsed .admin-sidebar-nav a span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.admin-sidebar-collapsed .admin-sidebar-label, .admin-sidebar-collapsed .admin-sidebar-note { display: none; }
.admin-sidebar-collapsed .admin-sidebar-nav { width: 52px; }
.admin-sidebar-collapsed .admin-sidebar-nav a { justify-content: center; padding-inline: 8px; font-size: 0; }
.admin-sidebar-collapsed .admin-sidebar-nav a::before { left: -8px; }
.admin-sidebar-collapsed .admin-sidebar-nav a .admin-nav-icon { width: 22px; height: 22px; }
.admin-sidebar-note { margin: 0 8px; padding-top: 16px; border-top: 1px solid var(--line); }
.admin-workspace { min-width: 0; }
.admin-environment-strip { min-height: 34px; margin: 0; padding: 8px clamp(20px, 3vw, 40px); color: var(--tp-text-secondary); background: color-mix(in srgb, var(--tp-action-accent) 58%, var(--tp-surface-card)); font-size: .75rem; text-align: center; }
.admin-topbar { position: sticky; z-index: 5; top: 0; display: flex; min-height: 72px; justify-content: space-between; align-items: center; gap: 18px; padding: 10px clamp(20px, 3vw, 40px); border-bottom: 1px solid var(--line); background: var(--tp-surface-card); }
.admin-topbar-start { display: flex; min-width: 0; align-items: center; gap: 18px; }
.admin-topbar .admin-sidebar-toggle span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.admin-topbar-context { display: flex; min-width: 0; align-items: center; gap: 10px; color: var(--tp-text-secondary); font-size: .9rem; font-weight: 600; }
.admin-topbar-dot { width: 10px; height: 10px; flex: 0 0 auto; border-radius: 50%; background: var(--tp-action-primary); box-shadow: 0 0 0 4px var(--tp-action-accent); }
.admin-command-search { position: relative; display: flex; width: min(430px, 38vw); min-width: 240px; align-items: center; }
.admin-command-search svg { position: absolute; z-index: 1; left: 14px; width: 20px; height: 20px; fill: none; stroke: var(--tp-text-secondary); stroke-width: 1.8; pointer-events: none; }
.admin-command-search input { box-sizing: border-box; width: 100%; min-height: var(--tp-control-height); padding: 9px 54px 9px 50px; border: 1px solid var(--line); border-radius: var(--radius-md); color: var(--tp-text-primary); background: var(--tp-surface-card); font: inherit; font-size: .88rem; }
#admin-command-search > svg { left: 16px; }
#admin-command-search > input { padding-left: 56px !important; }
.admin-command-search input:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; border-color: var(--tp-action-primary); }
.admin-command-search kbd { position: absolute; right: 10px; padding: 3px 6px; border: 1px solid var(--line); border-radius: var(--radius-sm); color: var(--tp-text-secondary); background: var(--tp-surface-page); font: inherit; font-size: .7rem; }
.admin-user-chip { display: flex; min-width: 0; align-items: center; gap: 9px; }
.admin-user-chip #admin-identity { display: grid; max-width: 230px; min-width: 0; gap: 1px; color: var(--tp-text-primary); text-align: left; }
.admin-avatar { display: grid; width: 36px; height: 36px; flex: 0 0 auto; place-items: center; border-radius: 50%; color: var(--tp-action-primary-foreground); background: var(--tp-action-primary); font-size: .8rem; font-weight: 750; }
.admin-toolbar { display: flex; justify-content: flex-end; align-items: center; gap: 8px; }
.admin-round-action { position: relative; display: grid; width: 64px; height: 64px; flex: 0 0 64px; place-items: center; padding: 0; border: 1px solid var(--line); border-radius: 50%; color: var(--tp-text-secondary); background: var(--tp-surface-card); cursor: pointer; }
.admin-round-action:hover { color: var(--tp-action-primary); background: var(--tp-action-accent); }
.admin-round-action:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.admin-round-action svg { display: block; width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.admin-unread-dot { position: absolute; top: 5px; right: 5px; width: 8px; height: 8px; border: 2px solid var(--tp-surface-card); border-radius: 50%; background: var(--tp-phlox); }
.admin-unread-dot[hidden] { display: none; }
.admin-dropdown-menu.admin-notice-menu { width: min(432px, calc(100vw - 24px)); gap: 8px; padding: 12px; }
.admin-notice-menu .admin-menu-label { margin: 3px 8px 7px; color: var(--tp-action-primary); font-size: .68rem; letter-spacing: .12em; }
.admin-notice-item { min-height: 70px; align-items: center; gap: 14px; padding: 8px 14px; border: 1px solid transparent; border-radius: var(--radius-md); }
.admin-notice-item:hover { border-color: color-mix(in srgb, var(--tp-action-primary) 22%, var(--line)); background: var(--tp-action-accent); }
.admin-notice-icon { display: grid; width: 52px; height: 52px; flex: 0 0 52px; place-items: center; border-radius: 16px; color: var(--tp-action-primary); background: var(--tp-action-accent); }
.admin-menu-item.admin-notice-item .admin-notice-icon svg { display: block; width: 24px; height: 24px; max-width: none; flex: 0 0 24px; margin: 0; overflow: visible; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.admin-notice-copy { display: grid; min-width: 0; flex: 1 1 auto; gap: 3px; }
.admin-notice-copy strong { overflow: hidden; color: var(--tp-text-primary); font-size: .9rem; text-overflow: ellipsis; white-space: nowrap; }
.admin-notice-copy small { overflow: hidden; color: var(--tp-text-secondary); font-size: .82rem; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.admin-notice-arrow { color: var(--tp-action-primary); font-size: 1.05rem; opacity: .72; transition: transform var(--tp-duration-fast, 120ms) ease; }
.admin-notice-item:hover .admin-notice-arrow { transform: translateX(2px); }
.admin-dropdown { position: relative; }
.admin-account-trigger { display: flex; min-height: 48px; justify-content: space-between; align-items: center; gap: 10px; padding: 4px 12px 4px 6px; border: 1px solid var(--line); border-radius: var(--radius-md); color: var(--tp-text-primary); background: var(--tp-surface-card); }
.admin-identity { display: grid; min-width: 0; gap: 1px; text-align: left; }
.admin-identity strong { overflow: hidden; font-size: .82rem; text-overflow: ellipsis; white-space: nowrap; }
.admin-identity small { overflow: hidden; color: var(--muted); font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }
.admin-account-trigger:hover { border-color: var(--tp-action-primary); background: var(--tp-action-accent); }
.admin-account-trigger:focus-visible, .admin-menu-item:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.admin-menu-chevron { width: 16px; height: 16px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; transition: transform var(--tp-duration-normal) ease; }
.admin-account-trigger[aria-expanded="true"] .admin-menu-chevron { transform: rotate(180deg); }
.admin-dropdown-menu { position: absolute; z-index: var(--tp-z-dropdown); top: calc(100% + 8px); right: 0; display: grid; width: min(288px, calc(100vw - 24px)); gap: 4px; padding: 8px; border: 1px solid var(--line); border-radius: var(--radius-md); color: var(--tp-text-primary); background: var(--tp-surface-card); box-shadow: var(--tp-elevation-menu); }
.admin-dropdown-menu[hidden] { display: none; }
.admin-menu-profile { display: grid; gap: 3px; min-width: 0; margin: 2px 4px 6px; padding: 10px 8px 12px; border-bottom: 1px solid var(--line); }
.admin-menu-profile strong, .admin-menu-profile small { overflow-wrap: anywhere; }
.admin-menu-profile strong { font-size: .9rem; }
.admin-menu-profile small { color: var(--muted); font-size: .75rem; }
.admin-profile-dialog { width: min(440px, calc(100vw - 28px)); max-height: calc(100vh - 28px); padding: 28px; border: 1px solid var(--line); border-radius: var(--radius-lg); color: var(--tp-text-primary); background: var(--tp-surface-card); box-shadow: var(--shadow-md); }
.admin-profile-dialog::backdrop { background: var(--tp-overlay); }
.admin-profile-dialog .admin-form { display: grid; gap: 14px; }
.admin-profile-dialog h2, .admin-profile-dialog p { margin: 0; }
.admin-profile-dialog form > p:not(.form-message) { color: var(--muted); }
.admin-menu-label { margin: 4px 10px; color: var(--muted); font-size: .68rem; font-weight: 700; letter-spacing: .08em; }
.admin-menu-item { display: flex; width: 100%; min-height: var(--tp-control-height); align-items: center; padding: 8px 10px; border: 0; border-radius: var(--radius-sm); color: var(--tp-text-primary); background: transparent; font: inherit; font-size: .88rem; text-align: left; text-decoration: none; cursor: pointer; }
.admin-menu-item svg { width: 18px; height: 18px; margin-right: 10px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.admin-menu-item span { min-width: 0; }
.admin-menu-item:hover { background: var(--tp-action-accent); }
.admin-menu-item:active { background: color-mix(in srgb, var(--tp-action-accent) 76%, var(--tp-action-primary)); }
.admin-menu-item-danger { color: var(--tp-status-danger-foreground); }
.admin-dropdown-menu hr { width: 100%; height: 1px; margin: 4px 0; border: 0; background: var(--line); }
.admin-app-content { min-width: 0; max-width: 1536px; margin: 0 auto; padding: 30px clamp(20px, 3vw, 40px) 72px; }
.admin-app-content > [id] { scroll-margin-top: 96px; }
.admin-page-head { margin: 0 0 20px; }
.admin-page-head h2 { margin: 0 0 6px; font-size: clamp(1.75rem, 3vw, 2.25rem); }
.admin-page-head > p:last-child { margin: 0; color: var(--muted); }
.admin-command-strip { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin: 0 0 22px; padding: 20px 22px; border: 1px solid var(--line); border-left: 4px solid var(--tp-action-primary); border-radius: var(--radius-lg); background: var(--tp-surface-card); box-shadow: var(--shadow-sm); }
.admin-command-strip > div:first-child { max-width: 660px; }
.admin-command-strip .eyebrow { margin-bottom: 7px; }
.admin-command-strip h3 { margin: 0 0 5px; font-family: var(--font-ui); font-size: 1.05rem; letter-spacing: 0; }
.admin-command-strip p:last-child { margin: 0; color: var(--muted); font-size: .9rem; }
.admin-command-actions { display: flex; flex-wrap: wrap; gap: var(--tp-space-2); }
.analytics-panel { margin: 0 0 24px; }
.analytics-header { display: grid; grid-template-columns: minmax(0, .82fr) minmax(520px, 1.18fr); align-items: start; gap: 32px; }
.analytics-header h2 { margin: 0 0 4px; }
.analytics-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 18px; }
.analytics-summary article, .analytics-card { min-width: 0; padding: 16px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--tp-surface-page); }
.analytics-summary span, .analytics-summary small { display: block; color: var(--muted); font-size: .8rem; }
.analytics-summary strong { display: block; margin: 7px 0 2px; color: var(--tp-purple); font-family: var(--font-brand); font-size: 1.8rem; }
.analytics-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.analytics-card-wide { grid-column: 1 / -1; }
.analytics-actions { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 14px; min-width: 0; }
.analytics-actions .button { min-height: 40px; padding-inline: 12px; border-width: 1px; border-radius: var(--radius-sm); font-size: .78rem; white-space: normal; line-height: 1.25; }
.analytics-site-control, .analytics-period-control { display: grid; align-content: start; gap: 4px; color: var(--muted); font-size: .76rem; font-weight: 650; }
.analytics-site-control select { width: 100%; min-width: 0; }
.analytics-period-options { display: flex; width: 100%; min-height: 40px; align-items: stretch; gap: 2px; padding: 3px; border: 1px solid var(--tp-border-default); border-radius: var(--radius-md); background: color-mix(in srgb, var(--tp-surface-page) 76%, var(--tp-surface-card)); }
.analytics-period-options button { flex: 1 1 0; min-height: 32px; padding: 0 10px; border: 0; border-radius: var(--radius-sm); color: var(--tp-text-secondary); background: transparent; font: inherit; font-size: .78rem; font-weight: 650; cursor: pointer; }
.analytics-period-options button:hover, .analytics-period-options button:focus-visible { color: var(--tp-action-primary); background: var(--tp-action-accent); outline: none; }
.analytics-period-options button[aria-pressed="true"] { color: var(--tp-action-primary-foreground); background: var(--tp-action-primary); box-shadow: var(--tp-elevation-1); }
.analytics-period-range { min-height: 16px; color: var(--muted); font-size: .7rem; }
.analytics-custom-period { display: flex; align-items: end; gap: var(--tp-space-2); }
.analytics-custom-period label { display: grid; gap: 4px; color: var(--muted); font-size: .7rem; font-weight: 650; }
.analytics-custom-period input { width: 132px; min-height: 40px !important; padding: 8px 10px !important; font-size: .78rem !important; }
.analytics-custom-period .button { min-height: 40px; }
.analytics-report-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; min-width: 0; }
.analytics-report-actions .button { width: 100%; }
.consent-logs-panel { margin: 0 0 24px; }
.consent-logs-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; }
.consent-logs-header h2 { margin: 0 0 4px; }
.consent-log-filters { margin: 0 0 18px; }
.consent-log-filters .form-actions { align-self: end; }
.consent-log-summary { margin: 0 0 12px; color: var(--muted); font-size: .86rem; }
.consent-log-preferences { display: grid; gap: 4px; min-width: 150px; }
.consent-log-preference { color: var(--tp-text-secondary); font-size: .78rem; }
.consent-log-preference strong { color: var(--tp-text-primary); }
.consent-log-detail { margin-top: 7px; font-size: .78rem; }
.consent-log-detail summary { color: var(--tp-action-primary); cursor: pointer; font-weight: 700; }
.consent-log-detail dl { display: grid; gap: 6px; min-width: 250px; margin: 8px 0 0; padding: 10px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--tp-surface-page); font-size: .76rem; }
.consent-log-detail dl div { display: grid; grid-template-columns: minmax(120px, .7fr) minmax(0, 1fr); gap: 8px; }
.consent-log-detail dt { color: var(--muted); }
.consent-log-detail dd { min-width: 0; margin: 0; overflow-wrap: anywhere; }
.consent-logs-panel > #consent-log-more { margin-top: 14px; }
.audit-panel { margin: 0 0 24px; }
.audit-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; }
.audit-header h2 { margin: 0 0 4px; }
.audit-filters { margin: 0 0 18px; }
.audit-summary { margin: 0 0 12px; color: var(--muted); font-size: .86rem; }
.audit-panel > #audit-more { margin-top: 14px; }
.audit-detail { min-width: 190px; font-size: .78rem; }
.audit-detail summary { color: var(--tp-action-primary); cursor: pointer; font-weight: 700; }
.audit-detail dl { display: grid; gap: 6px; min-width: 250px; margin: 8px 0 0; padding: 10px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--tp-surface-page); font-size: .76rem; }
.audit-detail dl div { display: grid; grid-template-columns: minmax(110px, .7fr) minmax(0, 1fr); gap: 8px; }
.audit-detail dt { color: var(--muted); }
.audit-detail dd { min-width: 0; margin: 0; overflow-wrap: anywhere; }
.analytics-card h3 { margin: 0 0 14px; font-size: 1rem; }
.analytics-bars { display: grid; gap: 10px; }
.analytics-bar-row { display: grid; grid-template-columns: minmax(110px, .8fr) minmax(80px, 1.5fr) 34px; gap: 10px; align-items: center; font-size: .8rem; }
.analytics-bar-row > span { overflow: hidden; color: var(--tp-text-secondary); text-overflow: ellipsis; white-space: nowrap; }
.analytics-bar-row strong { text-align: right; }
.analytics-bar-track { height: 9px; overflow: hidden; border-radius: 99px; background: color-mix(in srgb, var(--line) 65%, transparent); }
.analytics-bar-track i { display: block; height: 100%; border-radius: inherit; background: var(--tp-action-primary); }
.analytics-tone-1 { background: var(--tp-chart-1) !important; }.analytics-tone-2 { background: var(--tp-chart-2) !important; }.analytics-tone-3 { background: var(--tp-chart-3) !important; }.analytics-tone-4 { background: var(--tp-chart-4) !important; }.analytics-tone-5 { background: var(--tp-chart-5) !important; }.analytics-tone-6 { background: var(--tp-chart-6) !important; }
.analytics-sparkline { display: flex; min-height: 142px; align-items: end; gap: 8px; padding: 10px 2px 0; border-bottom: 1px solid var(--line); }
.analytics-day { display: grid; min-width: 26px; flex: 1; height: 120px; align-items: end; justify-items: center; gap: 7px; }
.analytics-day span { display: block; width: min(100%, 26px); min-height: 4px; border-radius: 5px 5px 0 0; background: linear-gradient(180deg, var(--tp-action-primary), #b06bdb); }
.analytics-day small { color: var(--muted); font-size: .68rem; }
.tp-pagination { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 18px 0 4px; }
.tp-pagination ol { display: flex; align-items: center; gap: 4px; margin: 0; padding: 0; list-style: none; }
.tp-pagination button { min-width: 36px; height: 36px; padding: 0 10px; border: 0; border-radius: 8px; color: var(--tp-text-secondary); background: transparent; font: inherit; font-size: .82rem; cursor: pointer; }
.tp-pagination button:hover:not(:disabled), .tp-pagination button:focus-visible { color: var(--tp-text); background: color-mix(in srgb, var(--tp-purple) 14%, transparent); outline: none; }
.tp-pagination .tp-pagination-button { min-width: 82px; background: color-mix(in srgb, var(--line) 72%, transparent); }
.tp-pagination button:disabled { color: var(--muted); background: color-mix(in srgb, var(--line) 36%, transparent); cursor: not-allowed; opacity: .72; }
.tp-pagination .tp-pagination-page.is-active { color: #fff; background: var(--tp-purple); box-shadow: 0 5px 14px color-mix(in srgb, var(--tp-purple) 25%, transparent); }
.tp-pagination-ellipsis { min-width: 28px; color: var(--muted); text-align: center; }
.analytics-period-control { display: grid; gap: 4px; color: var(--muted); font-size: .76rem; }
.analytics-period-control select { min-width: 112px; }
.analytics-period-summary, .analytics-data-note, .analytics-card-note { color: var(--muted); font-size: .8rem; }
.analytics-period-summary { display: flex; justify-content: space-between; gap: 12px; margin: -4px 0 14px; }
.analytics-period-summary small { color: var(--muted); }
.analytics-card-heading { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; }
.analytics-card-heading h3 { margin-bottom: 4px; }
.analytics-card-heading p { margin: 0; color: var(--muted); font-size: .8rem; }
.analytics-legend { display: flex; flex-wrap: wrap; gap: 10px; color: var(--muted); font-size: .75rem; }
.analytics-legend span { display: inline-flex; align-items: center; gap: 5px; }
.analytics-legend-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--tp-chart-1); }
.analytics-legend-dot.volume { background: var(--tp-chart-2); }
.analytics-trend { display: flex; min-height: 170px; align-items: stretch; gap: 5px; margin-top: 14px; padding: 12px 0 0; border-bottom: 1px solid var(--line); background: repeating-linear-gradient(to top, transparent 0, transparent calc(25% - 1px), color-mix(in srgb, var(--tp-chart-grid) 70%, transparent) calc(25% - 1px), color-mix(in srgb, var(--tp-chart-grid) 70%, transparent) 25%); overflow-x: auto; }
.analytics-trend-day { display: grid; min-width: 30px; flex: 1; align-items: end; justify-items: center; gap: 7px; }
.analytics-trend-bars { position: relative; display: block; width: 100%; height: 135px; }
.analytics-trend-bars i { position: absolute; bottom: 0; display: block; width: 9px; min-height: 4px; height: var(--trend-height, 8px) !important; border-radius: 5px 5px 0 0; }
.analytics-trend-bars .analytics-trend-consent { left: calc(50% - 11px); }
.analytics-trend-bars .analytics-trend-volume { left: calc(50% + 2px); }
.analytics-trend-bars i.analytics-trend-h-1 { height: 8px !important; }.analytics-trend-bars i.analytics-trend-h-2 { height: 16px !important; }.analytics-trend-bars i.analytics-trend-h-3 { height: 24px !important; }.analytics-trend-bars i.analytics-trend-h-4 { height: 32px !important; }.analytics-trend-bars i.analytics-trend-h-5 { height: 40px !important; }.analytics-trend-bars i.analytics-trend-h-6 { height: 48px !important; }.analytics-trend-bars i.analytics-trend-h-7 { height: 56px !important; }.analytics-trend-bars i.analytics-trend-h-8 { height: 64px !important; }.analytics-trend-bars i.analytics-trend-h-9 { height: 72px !important; }.analytics-trend-bars i.analytics-trend-h-10 { height: 80px !important; }.analytics-trend-bars i.analytics-trend-h-11 { height: 88px !important; }.analytics-trend-bars i.analytics-trend-h-12 { height: 96px !important; }.analytics-trend-bars i.analytics-trend-h-13 { height: 104px !important; }.analytics-trend-bars i.analytics-trend-h-14 { height: 112px !important; }
.analytics-trend-consent { background: var(--tp-chart-1); }
.analytics-trend-volume { background: var(--tp-chart-2); opacity: .72; }
.analytics-trend-day small { color: var(--muted); font-size: .67rem; }
.analytics-inline-total { color: var(--tp-purple); font-size: .82rem; white-space: nowrap; }
.analytics-table-wrap { margin-top: 12px; }
.analytics-table-wrap table { margin: 0; }
.analytics-chart-data { margin-top: 14px; border-top: 1px solid var(--tp-chart-grid); }
.analytics-chart-data summary { padding-top: 10px; color: var(--tp-action-primary); cursor: pointer; font-size: .78rem; font-weight: 700; }
.analytics-chart-data .table-wrap { margin-top: 10px; }
.analytics-chart-data table { width: 100%; min-width: 480px; }
.analytics-chart-data th, .analytics-chart-data td { padding: 9px 10px; }
.analytics-data-note { margin: 16px 0 0; }
.developer-shell { display: grid; min-height: 100vh; grid-template-columns: 290px minmax(0, 1fr); background: var(--tp-surface-page); transition: grid-template-columns var(--tp-duration-slow, 220ms) cubic-bezier(.2,.7,.2,1); }
.developer-shell.developer-sidebar-collapsed { grid-template-columns: 76px minmax(0, 1fr); }
.developer-sidebar-collapsed .developer-sidebar { padding-inline: 12px; }
.developer-sidebar-collapsed .developer-brand { min-height: 52px; width: 52px; padding: 0; background: transparent; }
.developer-sidebar-collapsed .developer-brand .admin-brand-wordmark { opacity: 0; visibility: hidden; transform: scale(.86); }
.developer-sidebar-collapsed .developer-brand .admin-brand-symbol { opacity: 1; visibility: visible; transform: scale(1); }
.developer-sidebar-collapsed .developer-sidebar-label, .developer-sidebar-collapsed .developer-sidebar-footer { display: none; }
.developer-sidebar-collapsed .developer-sidebar-nav { width: 52px; }
.developer-sidebar-collapsed .developer-sidebar-nav a { justify-content: center; padding-inline: 8px; font-size: 0; }
.developer-sidebar-collapsed .developer-sidebar-nav a .admin-nav-icon { width: 22px; height: 22px; }
.developer-sidebar-collapsed .developer-sidebar-nav a span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; font-size: .9rem; }
.developer-sidebar { min-width: 0; overflow-x: hidden; }
.developer-brand { box-sizing: border-box; min-width: 0; overflow: hidden; }
.developer-sidebar-nav a { min-width: 0; }
.developer-sidebar-nav a span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.developer-sidebar-footer { display: flex; min-height: 42px; align-items: center; margin: auto 8px 0; padding-top: 16px; border-top: 1px solid var(--line); color: var(--muted); font-size: .78rem; font-weight: 600; }
@media (min-width: 861px) {
  #admin-app.admin-sidebar-collapsed .admin-sidebar:is(:hover, :focus-within),
  .developer-shell.developer-sidebar-collapsed .developer-sidebar:is(:hover, :focus-within) { z-index: 10; width: 290px; padding-inline: 20px; box-shadow: var(--shadow-md); }
  #admin-app.admin-sidebar-collapsed .admin-sidebar:is(:hover, :focus-within) .admin-sidebar-brand,
  .developer-shell.developer-sidebar-collapsed .developer-sidebar:is(:hover, :focus-within) .developer-brand { width: 100%; min-height: 76px; padding: 18px 20px; background: var(--tp-surface-card); }
  [data-theme="dark"] #admin-app.admin-sidebar-collapsed .admin-sidebar:is(:hover, :focus-within) .admin-sidebar-brand,
  [data-theme="dark"] .developer-shell.developer-sidebar-collapsed .developer-sidebar:is(:hover, :focus-within) .developer-brand { background: var(--tp-russian-violet); }
  #admin-app.admin-sidebar-collapsed .admin-sidebar:is(:hover, :focus-within) .admin-brand-wordmark,
  .developer-shell.developer-sidebar-collapsed .developer-sidebar:is(:hover, :focus-within) .admin-brand-wordmark { display: block; }
  #admin-app.admin-sidebar-collapsed .admin-sidebar:is(:hover, :focus-within) .admin-brand-wordmark-negative,
  .developer-shell.developer-sidebar-collapsed .developer-sidebar:is(:hover, :focus-within) .admin-brand-wordmark-negative { display: none; }
  [data-theme="dark"] #admin-app.admin-sidebar-collapsed .admin-sidebar:is(:hover, :focus-within) .admin-brand-wordmark-positive,
  [data-theme="dark"] .developer-shell.developer-sidebar-collapsed .developer-sidebar:is(:hover, :focus-within) .admin-brand-wordmark-positive { display: none; }
  [data-theme="dark"] #admin-app.admin-sidebar-collapsed .admin-sidebar:is(:hover, :focus-within) .admin-brand-wordmark-negative,
  [data-theme="dark"] .developer-shell.developer-sidebar-collapsed .developer-sidebar:is(:hover, :focus-within) .admin-brand-wordmark-negative { display: block; }
  #admin-app.admin-sidebar-collapsed .admin-sidebar:is(:hover, :focus-within) .admin-brand-symbol,
  .developer-shell.developer-sidebar-collapsed .developer-sidebar:is(:hover, :focus-within) .admin-brand-symbol { display: none; }
  #admin-app.admin-sidebar-collapsed .admin-sidebar:is(:hover, :focus-within) .admin-brand-wordmark,
  .developer-shell.developer-sidebar-collapsed .developer-sidebar:is(:hover, :focus-within) .admin-brand-wordmark { opacity: 1; visibility: visible; transform: scaleX(1); }
  #admin-app.admin-sidebar-collapsed .admin-sidebar:is(:hover, :focus-within) .admin-brand-symbol,
  .developer-shell.developer-sidebar-collapsed .developer-sidebar:is(:hover, :focus-within) .admin-brand-symbol { opacity: 0; visibility: hidden; transform: scale(.72); }
  #admin-app.admin-sidebar-collapsed .admin-sidebar:is(:hover, :focus-within) .admin-sidebar-label,
  .developer-shell.developer-sidebar-collapsed .developer-sidebar:is(:hover, :focus-within) .developer-sidebar-label { display: block; }
  #admin-app.admin-sidebar-collapsed .admin-sidebar:is(:hover, :focus-within) .admin-sidebar-nav,
  .developer-shell.developer-sidebar-collapsed .developer-sidebar:is(:hover, :focus-within) .developer-sidebar-nav { width: 100%; }
  #admin-app.admin-sidebar-collapsed .admin-sidebar:is(:hover, :focus-within) .admin-sidebar-nav a,
  .developer-shell.developer-sidebar-collapsed .developer-sidebar:is(:hover, :focus-within) .developer-sidebar-nav a { justify-content: flex-start; padding-inline: 12px; font-size: .9rem; }
  #admin-app.admin-sidebar-collapsed .admin-sidebar:is(:hover, :focus-within) .admin-sidebar-nav a span,
  .developer-shell.developer-sidebar-collapsed .developer-sidebar:is(:hover, :focus-within) .developer-sidebar-nav a span { position: static; width: auto; height: auto; overflow: hidden; clip-path: none; text-overflow: ellipsis; white-space: nowrap; font-size: .9rem; }
  #admin-app.admin-sidebar-collapsed .admin-sidebar:is(:hover, :focus-within) .admin-sidebar-nav a[aria-current="page"]::before { left: 0; }
  #admin-app.admin-sidebar-collapsed .admin-sidebar:is(:hover, :focus-within) .admin-sidebar-cta:not([hidden]) { display: flex; }
}
.developer-workspace { min-width: 0; }
.developer-topbar [hidden] { display: none; }
.developer-page-head { display: flex; min-width: 0; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 16px; margin-bottom: 22px; }
.developer-page-head .developer-header-title h1 { margin: 0 0 6px; font-size: clamp(1.75rem, 3vw, 2.25rem); }
.developer-page-head .developer-header-title p:last-child { margin: 0; color: var(--tp-text-secondary); }
.developer-page-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.developer-topbar .admin-identity { max-width: 230px; }
.developer-header { position: sticky; top: 0; z-index: 2; min-height: 112px; padding: 22px clamp(24px, 4vw, 54px); }
.developer-header-title { min-width: 0; }
.developer-nav .admin-round-action { flex: 0 0 auto; }
.developer-nav .admin-round-action svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.admin-login-shell { display: grid; min-height: 100vh; grid-template-columns: repeat(2, minmax(0, 1fr)); background: var(--tp-surface-card); }
.admin-login-shell[hidden] { display: none; }
.admin-login-form-pane { display: grid; min-width: 0; min-height: 100vh; grid-template-rows: auto minmax(0, 1fr); padding: 0 clamp(28px, 7vw, 96px); background: var(--tp-surface-card); }
.admin-login-topbar { display: flex; width: 100%; max-width: 444px; justify-content: flex-start; align-items: center; gap: 16px; margin: 0 auto; padding: 38px 0 18px; }
.admin-login-back { display: inline-flex; align-items: center; gap: 5px; color: var(--tp-text-secondary); font-size: .875rem; text-decoration: none; transition: color var(--tp-duration-normal) ease; }
.admin-login-back:hover { color: var(--tp-text-primary); }
#login-panel .admin-login-theme { position: fixed; right: 24px; bottom: 24px; z-index: 20; display: inline-grid; width: 56px; height: 56px; place-items: center; border: 0; border-radius: 50%; color: var(--tp-action-primary-foreground); background: var(--tp-action-primary); box-shadow: 0 4px 14px rgb(37 0 45 / 18%); cursor: pointer; transition: color var(--tp-duration-normal) ease, background var(--tp-duration-normal) ease, box-shadow var(--tp-duration-normal) ease, transform var(--tp-duration-normal) ease; }
#login-panel .admin-login-theme svg { display: block; width: 20px; height: 20px; overflow: visible; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
#login-panel .admin-login-theme:hover { background: var(--tp-action-primary-hover); box-shadow: 0 6px 18px rgb(37 0 45 / 24%); transform: translateY(-1px); }
.admin-login-form-wrap { width: 100%; max-width: 448px; align-self: center; margin: 0 auto; padding: 34px 0 44px; }
.admin-login-mobile-brand { display: none; min-height: 52px; margin-bottom: 36px; align-items: center; }
.admin-login-mobile-logo { width: 170px; height: auto; }
.admin-login-mobile-logo-negative { display: none; }
[data-theme="dark"] .admin-login-mobile-logo-positive { display: none; }
[data-theme="dark"] .admin-login-mobile-logo-negative { display: block; }
.admin-login-heading { margin-bottom: 38px; }
.admin-login-heading h1 { margin: 0 0 10px; font-size: clamp(2rem, 4vw, 2.35rem); line-height: 1.1; }
.admin-login-heading > p:last-child { margin: 0; color: var(--tp-text-secondary); font-size: .9rem; }
.admin-login-form { display: grid; gap: 0; }
.admin-form.admin-login-form > label { display: flex; align-items: baseline; gap: 2px; margin: 0 0 7px; }
.admin-login-form > label:not(:first-child) { margin-top: 20px; }
.admin-form.admin-login-form > label span { display: inline; color: var(--tp-status-danger-foreground); line-height: 1; }
.admin-login-form > input, .admin-login-password-field > input { height: 44px; border-color: var(--tp-border-default); border-radius: var(--radius-md); background: transparent; box-shadow: 0 1px 2px rgb(37 0 45 / 4%); }
.admin-login-form input::placeholder { color: color-mix(in srgb, var(--tp-text-secondary) 68%, transparent); }
.admin-login-form input:hover { border-color: var(--tp-battleship-gray); }
.admin-login-form input:focus { border-color: var(--tp-action-primary); outline: 3px solid color-mix(in srgb, var(--tp-action-primary) 13%, transparent); outline-offset: 0; }
.admin-login-password-field { position: relative; }
.admin-login-password-field > input { padding-right: 48px; }
.admin-login-password-toggle { position: absolute; top: 50%; right: 5px; display: grid; width: 38px; height: 38px; padding: 0; transform: translateY(-50%); place-items: center; border: 0; border-radius: var(--radius-sm); color: var(--tp-text-secondary); background: transparent; cursor: pointer; }
.admin-login-password-toggle:hover { color: var(--tp-action-primary); background: var(--tp-action-accent); }
.admin-login-eye-hide { display: none; }
.admin-login-password-toggle[aria-pressed="true"] .admin-login-eye-show { display: none; }
.admin-login-password-toggle[aria-pressed="true"] .admin-login-eye-hide { display: block; }
.admin-login-options { display: flex; justify-content: flex-end; margin-top: 12px; }
.admin-login-submit { width: 100%; min-height: 44px; justify-self: stretch !important; margin-top: 20px; border-radius: var(--radius-md); }
.admin-login-forgot { padding: 4px 0; border: 0; color: var(--tp-action-primary); background: transparent; font: inherit; font-size: .875rem; text-align: right; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.admin-login-forgot:hover { color: var(--tp-text-primary); }
.admin-login-forgot:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.admin-login-error { margin: 14px 0 0; padding: 12px 14px; border: 1px solid var(--tp-status-danger-foreground); border-radius: var(--radius-md); color: var(--tp-status-danger-foreground); background: var(--tp-status-danger-background); }
.admin-login-access-note { margin: 20px 0 0; color: var(--tp-text-secondary); font-size: .875rem; line-height: 1.5; }
.admin-login-brand-panel { position: relative; display: grid; min-width: 0; min-height: 100vh; overflow: hidden; place-items: center; color: #fff; background: linear-gradient(135deg, #4b005a 0%, #6b0080 58%, #81009b 100%); isolation: isolate; }
.admin-login-brand-content { position: relative; z-index: 2; width: min(calc(100% - 48px), 448px); text-align: center; }
.admin-login-brand-safe-area { display: inline-flex; margin: 0 auto 36px; padding: 36px; }
.admin-login-brand-safe-area img { display: block; width: 220px; height: auto; }
.admin-login-brand-content h2 { margin: 0 0 16px; color: #fff; font-size: clamp(1.8rem, 3vw, 2.25rem); line-height: 1.15; letter-spacing: -.025em; }
.admin-login-brand-content p { max-width: 470px; margin: 0 auto; color: rgb(255 255 255 / 82%); font-size: clamp(1rem, 1.7vw, 1.18rem); }
.admin-login-orb { position: absolute; top: -240px; left: -130px; z-index: -1; width: 420px; height: 420px; border-radius: 50%; background: color-mix(in srgb, var(--tp-mauveine) 14%, transparent); }
.admin-login-arc { position: absolute; right: -120px; bottom: -330px; z-index: -1; width: 620px; height: 620px; border: 2px solid color-mix(in srgb, var(--tp-mauveine) 35%, transparent); border-radius: 50%; }
.admin-login-accent { position: absolute; top: 22%; right: 64px; width: 120px; height: 3px; transform: rotate(-18deg); border-radius: var(--radius-full); background: var(--tp-phlox); }
.admin-login-dots { position: absolute; bottom: 48px; left: 48px; z-index: -1; display: grid; grid-template-columns: repeat(3, 8px); gap: 8px; }
.admin-login-dots i { width: 8px; height: 8px; border-radius: 50%; background: color-mix(in srgb, #fff 45%, transparent); }
.admin-form { display: grid; gap: 14px; }
.admin-form label { display: grid; min-width: 0; gap: 6px; color: var(--tp-text-primary); font-size: .875rem; font-weight: 600; line-height: 1.35; }
.admin-form input, .admin-form select, .admin-form textarea { width: 100%; min-width: 0; max-width: 100%; min-height: var(--tp-control-height); padding: 10px 12px; border: 1px solid var(--tp-border-default); border-radius: var(--radius-sm); color: var(--tp-ink); background: var(--tp-surface-card); font: inherit; }
#admin-app input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="hidden"]), #admin-app select, #admin-app textarea { min-height: var(--tp-control-height); border: 1px solid var(--tp-border-default); border-radius: var(--radius-sm); color: var(--tp-text-primary); background-color: var(--tp-surface-card); font: inherit; transition: border-color var(--tp-duration-normal) ease, box-shadow var(--tp-duration-normal) ease, background-color var(--tp-duration-normal) ease; }
#admin-app input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="hidden"]), #admin-app select { padding: 10px 12px; }
#admin-app select { appearance: none; min-width: 0; padding-right: 38px; background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%); background-position: calc(100% - 17px) 18px, calc(100% - 12px) 18px; background-repeat: no-repeat; background-size: 5px 5px, 5px 5px; }
#admin-app textarea { padding: 10px 12px; resize: vertical; }
#admin-app :is(input, select, textarea):hover:not(:disabled):not([readonly]) { border-color: color-mix(in srgb, var(--tp-action-primary) 54%, var(--tp-border-default)); }
#admin-app :is(input, select, textarea):focus-visible { border-color: var(--tp-action-primary); outline: 3px solid color-mix(in srgb, var(--tp-action-primary) 18%, transparent); outline-offset: 0; box-shadow: 0 0 0 1px var(--tp-action-primary); }
#admin-app :is(input, select, textarea):disabled, #admin-app :is(input, select, textarea)[readonly] { color: var(--tp-text-secondary); background: color-mix(in srgb, var(--tp-surface-page) 72%, var(--tp-surface-card)); cursor: not-allowed; }
#admin-app :is(input, textarea)::placeholder { color: color-mix(in srgb, var(--tp-text-secondary) 72%, transparent); }
#admin-app input[type="date"] { color-scheme: light; }
[data-theme="dark"] #admin-app input[type="date"] { color-scheme: dark; }
#admin-app input[type="color"] { width: 44px; min-width: 44px; height: var(--tp-control-height); min-height: var(--tp-control-height); padding: 4px; border: 1px solid var(--tp-border-default); border-radius: var(--radius-sm); background: var(--tp-surface-card); cursor: pointer; }
#admin-app .admin-command-search input { padding: 9px 54px 9px 44px; }
.admin-form .wide-field, .admin-form .field-long { grid-column: 1 / -1; }
.admin-form .field-long > :is(input, select) { max-width: 820px; }
.admin-form .field-compact > :is(input, select) { max-width: 260px; }
.admin-form .checkbox-field { display: flex; grid-template-columns: none; align-items: center; gap: 10px; min-height: var(--tp-control-height); }
.admin-form .checkbox-field input[type="checkbox"] { width: 18px; min-width: 18px; min-height: 18px; height: 18px; margin: 0; padding: 0; accent-color: var(--tp-action-primary); }
.admin-form textarea { resize: vertical; }
.admin-form .button { justify-self: start; }
.admin-main > #admin-app > p { margin: 0 0 10px; }
.user-panel { margin-top: 20px; }
.members-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.members-header > div { min-width: 0; }
.members-header .button { flex: 0 0 auto; }
.webhook-panel { margin-top: 20px; scroll-margin-top: 118px; }
.webhook-panel-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; }
.webhook-panel-header > div { max-width: 780px; }
.privacy-requests-header > div { max-width: 780px; }
.privacy-request-action { display: grid; min-width: 210px; gap: 8px; }
.privacy-request-action select { width: 100%; min-height: var(--tp-control-height); padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--radius-sm); color: var(--tp-text-primary); background: var(--tp-surface-card); }
.privacy-requests-panel td small { max-width: 420px; overflow-wrap: anywhere; }
.documents-panel { margin-top: 20px; scroll-margin-top: 118px; }
.documents-header { align-items: flex-start; }
.documents-header > div { max-width: 780px; }
.document-form { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 18px 0 24px; padding: 18px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: color-mix(in srgb, var(--tp-action-accent) 34%, var(--tp-surface-card)); }
.document-form .wide-field { grid-column: 1 / -1; }
.document-actions { min-width: 220px; }
.document-actions .button { margin: 3px; }
.webhook-panel-header h2, .webhook-deliveries h3 { margin-bottom: 6px; }
.webhook-form { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 18px 0 24px; padding: 18px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: color-mix(in srgb, var(--tp-action-accent) 34%, var(--tp-surface-card)); }
.webhook-form .wide-field, .webhook-form .form-actions { grid-column: 1 / -1; }
.webhook-events { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; min-width: 0; margin: 0; padding: 16px; border: 1px solid var(--line); border-radius: var(--radius-md); }
.webhook-events legend { padding: 0 6px; color: var(--tp-text-primary); font-size: .875rem; font-weight: 700; }
.webhook-events label { display: flex; min-height: 36px; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 8px; font-weight: 500; }
.webhook-events input { width: 18px; min-height: 18px; margin: 0; }
.webhook-secret { justify-content: space-between; align-items: center; margin: 0 0 20px; border-color: var(--tp-status-warning-foreground); background: var(--tp-status-warning-background); }
.webhook-secret p { margin: 4px 0 10px; }
.webhook-secret code { display: block; max-width: 760px; overflow-wrap: anywhere; font-size: .82rem; }
.webhook-actions { min-width: 210px; }
.webhook-actions .button { margin: 3px; }
.webhook-deliveries { margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--line); }
.webhook-deliveries .panel-header { margin-bottom: 10px; }
.webhook-status { display: inline-flex; align-items: center; gap: 6px; }
.webhook-status::before { width: 8px; height: 8px; border-radius: 50%; background: var(--tp-status-warning-foreground); content: ""; }
.webhook-status[data-state="DELIVERED"]::before, .webhook-status[data-state="ACTIVE"]::before { background: var(--tp-status-success-foreground); }
.webhook-status[data-state="DEAD_LETTER"]::before, .webhook-status[data-state="INACTIVE"]::before { background: var(--tp-status-danger-foreground); }
.user-form { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; margin-bottom: 18px; padding: 18px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: color-mix(in srgb, var(--tp-action-accent) 34%, var(--tp-surface-card)); }
.user-form > label, .user-form > label :is(input, select) { min-width: 0; max-width: 100%; }
.user-form h3, .user-form .form-actions, .user-form .form-message, .user-form #user-edit-note { grid-column: 1 / -1; }
.user-form h3, .user-form #user-edit-note { margin: 0; }
.admin-data-table { border: 1px solid var(--tp-border-default); border-radius: var(--radius-lg); background: var(--tp-surface-card); }
.admin-data-table:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.members-table { min-width: 780px; }
.members-table :is(th, td) { padding: 14px 16px; border-color: var(--tp-border-default); vertical-align: middle; }
.members-table thead th { color: var(--tp-text-secondary); background: color-mix(in srgb, var(--tp-surface-page) 70%, var(--tp-surface-card)); font-size: .78rem; font-weight: 600; letter-spacing: 0; text-transform: none; }
.members-table tbody th { color: var(--tp-text-primary); font-size: .9rem; font-weight: 600; letter-spacing: 0; text-transform: none; }
.members-table tbody tr:last-child :is(th, td) { border-bottom: 0; }
.members-table tbody tr:hover { background: color-mix(in srgb, var(--tp-action-accent) 34%, var(--tp-surface-card)); }
.members-table th:first-child { width: 19%; }
.members-table th:nth-child(2) { width: 28%; }
.members-table th:nth-child(3) { width: 18%; }
.members-table th:nth-child(4) { width: 12%; }
.members-table th:last-child { min-width: 196px; }
.member-email { color: var(--tp-text-secondary); overflow-wrap: anywhere; }
.admin-table-status { display: inline-flex; align-items: center; gap: 7px; padding: 5px 10px; border: 1px solid var(--tp-status-success-foreground); border-radius: var(--radius-full); color: var(--tp-status-success-foreground); background: var(--tp-status-success-background); font-size: .78rem; font-weight: 600; white-space: nowrap; }
.admin-table-status::before { width: 7px; height: 7px; border-radius: 50%; background: currentColor; content: ""; }
.admin-table-status[data-state="inactive"], .admin-table-status[data-state="pending"] { border-color: var(--tp-status-warning-foreground); color: var(--tp-status-warning-foreground); background: var(--tp-status-warning-background); }
.user-actions { display: flex; flex-wrap: nowrap; gap: 7px; }
.user-action-button { display: inline-grid; width: 38px; height: 38px; flex: 0 0 38px; place-items: center; padding: 0; border: 1px solid var(--tp-border-default); border-radius: var(--radius-md); color: var(--tp-action-primary); background: var(--tp-surface-card); cursor: pointer; transition: border-color var(--tp-duration-normal), background-color var(--tp-duration-normal); }
.user-action-button:hover { border-color: var(--tp-action-primary); background: var(--tp-action-accent); }
.user-action-button:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.user-action-button svg { width: 19px; height: 19px; }
.user-action-button.user-delete { color: var(--tp-status-danger-foreground); }
.user-action-button.user-delete:hover { border-color: var(--tp-status-danger-foreground); background: var(--tp-status-danger-background); }
.user-delivery-note { margin: -4px 0 18px; }
@media (max-width: 680px) { .members-header { flex-direction: column; } }
.site-panel { margin-bottom: 20px; }
.admin-page-return { margin: 0 0 var(--tp-space-4); }
.panel-back { display: inline-flex; width: fit-content; min-height: var(--tp-control-height); max-width: 100%; align-items: center; gap: var(--tp-space-2); padding: 5px var(--tp-space-4) 5px 6px; border: 1px solid var(--line); border-radius: var(--radius-md); color: var(--tp-action-primary); background: var(--tp-surface-card); box-shadow: var(--shadow-sm); font-size: .9rem; font-weight: 700; line-height: 1.25; text-decoration: none; transition: border-color var(--tp-duration-normal) ease, background-color var(--tp-duration-normal) ease, box-shadow var(--tp-duration-normal) ease; }
.panel-back:hover { border-color: var(--tp-action-primary); color: var(--tp-action-primary-hover); background: var(--tp-action-accent); box-shadow: var(--tp-elevation-1); text-decoration: none; }
.panel-back:active { box-shadow: none; }
.panel-back:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.panel-back-icon { display: grid; width: 32px; height: 32px; flex: 0 0 auto; place-items: center; border-radius: var(--radius-sm); color: var(--tp-action-primary); background: var(--tp-action-accent); }
.panel-back:hover .panel-back-icon { color: var(--tp-action-primary-foreground); background: var(--tp-action-primary); }
.panel-back-icon svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.site-header { display: flex; justify-content: space-between; align-items: end; gap: 18px; }
.site-list-toolbar { display: grid; grid-template-columns: minmax(180px, 1fr) auto; align-items: end; gap: var(--tp-space-4); margin: 24px 0 20px; }
.site-list-toolbar h3 { margin: 0 0 2px; font-size: 1.25rem; }
.site-list-toolbar p { margin: 0; }
.site-total { color: var(--muted); font-size: .9rem; font-weight: 500; }
.site-list-controls { display: grid; grid-template-columns: auto auto minmax(220px, 1fr) minmax(180px, 220px); align-items: center; justify-content: end; gap: var(--tp-space-2); min-width: 0; }
.site-view-switch { display: inline-flex; gap: 4px; padding: 4px; border: 1px solid var(--line); border-radius: var(--radius-md); }
.site-view-switch button { width: 40px; height: 36px; border: 0; border-radius: var(--radius-sm); color: var(--tp-text-secondary); background: transparent; cursor: pointer; font-size: 1.1rem; }
.site-view-switch button[aria-pressed="true"] { color: var(--tp-action-primary); background: var(--tp-action-accent); }
.site-search-label { display: block; min-width: min(100%, 230px); }
.site-search-label input { width: 100%; min-height: var(--tp-control-height); padding: 8px 12px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); }
.site-status-label select { width: 100%; min-height: var(--tp-control-height); padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--radius-md); color: var(--tp-text-primary); background: var(--surface); }
.site-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--tp-space-4); }
.site-card { display: flex; min-width: 0; flex-direction: column; gap: var(--tp-space-3); padding: var(--tp-space-5); border: 1px solid var(--line); border-radius: var(--radius-xl); background: var(--surface); box-shadow: var(--shadow-sm); }
.site-card-head { display: flex; align-items: flex-start; gap: var(--tp-space-3); }
.site-card-symbol { display: grid; width: 44px; height: 44px; flex: 0 0 auto; place-items: center; border-radius: 50%; color: var(--tp-action-primary); background: var(--tp-action-accent); font-size: 1.25rem; }
.site-card-symbol svg { width: 22px; height: 22px; }
.site-card-identity { min-width: 0; flex: 1; }
.site-card-identity h4 { margin: 0 0 4px; color: var(--tp-action-primary); font-size: 1.1rem; overflow-wrap: anywhere; }
.site-card-identity p { margin: 0; color: var(--muted); font-size: .83rem; overflow-wrap: anywhere; }
.site-card-menu { position: relative; z-index: 2; flex: 0 0 auto; }
.site-card-menu summary { display: grid; width: 36px; height: 36px; place-items: center; border: 1px solid var(--line); border-radius: var(--radius-sm); cursor: pointer; font-size: 1.25rem; list-style: none; }
.site-card-menu summary::-webkit-details-marker { display: none; }
.site-card-menu[open] > div { position: absolute; right: 0; top: 42px; z-index: var(--tp-z-dropdown); min-width: 170px; padding: 5px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); box-shadow: var(--tp-elevation-menu); }
.site-menu-action { display: flex; width: 100%; min-height: 38px; align-items: center; gap: 10px; padding: 8px 10px; border: 0; border-radius: var(--radius-sm); color: var(--tp-text-primary); background: transparent; cursor: pointer; font: inherit; text-align: left; }
.site-menu-action svg { width: 18px; height: 18px; flex: 0 0 auto; color: var(--tp-action-primary); }
.site-menu-action:hover { background: var(--tp-action-accent); }
.site-card-state { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px; }
.site-card-state small { color: var(--muted); font-size: .74rem; overflow-wrap: anywhere; }
.site-state { display: inline-flex; align-items: center; padding: 5px 9px; border-radius: var(--radius-full); color: var(--tp-status-success-foreground); background: var(--tp-status-success-background); font-size: .76rem; font-weight: 700; }
.site-state[data-tone="draft"], .site-state[data-tone="warning"] { color: var(--tp-status-warning-foreground); background: var(--tp-status-warning-background); }
.site-shortcuts { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; padding: var(--tp-space-3) 0; border-block: 1px solid var(--line); }
.site-shortcut { display: flex; min-width: 0; min-height: 66px; flex-direction: column; align-items: center; justify-content: center; gap: 5px; padding: 4px 2px; border: 0; border-radius: var(--radius-sm); color: var(--tp-text-secondary); background: transparent; cursor: pointer; font: inherit; font-size: .72rem; line-height: 1.15; text-align: center; overflow-wrap: anywhere; }
.site-shortcut:hover { color: var(--tp-action-primary); background: var(--tp-action-accent); }
.site-shortcut-icon { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 50%; color: var(--tp-action-primary); background: var(--tp-action-accent); font-size: 1rem; }
.site-shortcut-icon svg { width: 17px; height: 17px; }
.site-counts { display: flex; flex-wrap: wrap; gap: 6px 18px; color: var(--muted); font-size: .81rem; }
.site-counts strong { color: var(--tp-status-success-foreground); font-size: 1rem; }
.site-counts > span:last-child strong { color: var(--tp-status-danger-foreground); }
.site-count-scope { margin: -8px 0 0; color: var(--muted); font-size: .72rem; }
.site-count-error { margin: 0; color: var(--tp-status-warning-foreground); font-size: .78rem; }
.site-card-open { align-self: flex-start; margin-top: auto; }
.site-empty { display: grid; justify-items: center; gap: 8px; padding: 50px 20px; border: 1px dashed var(--line); border-radius: var(--radius-xl); text-align: center; }
.site-empty > span { color: var(--tp-action-primary); font-size: 2rem; }
.site-empty p { margin: 0; color: var(--muted); }
.site-list-table table { min-width: 740px; }
.site-list-table th { text-align: left; }
.site-list-table .site-count-scope { margin: 8px 0 0; }
.site-detail-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(190px, 280px); gap: 8px 20px; margin-top: 20px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.site-back { grid-column: 1 / -1; }
.site-detail-head h3 { margin: 2px 0; font-size: 1.4rem; }
.site-detail-head .site-note { margin: 0; }
.site-detail-head label { display: grid; min-width: 0; gap: 5px; font-size: .82rem; font-weight: 700; }
.site-detail-head select { width: 100%; min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.site-detail-nav { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--tp-space-2); margin-top: var(--tp-space-4); padding: var(--tp-space-2); border: 1px solid var(--line); border-radius: var(--radius-md); }
.site-detail-nav .site-shortcut { min-height: 58px; }
.site-detail-actions { margin: 20px 0; }
.site-detail-actions .release-actions { display: flex; flex-wrap: wrap; align-items: start; gap: 10px; }
.site-detail-actions .rollback-form, .site-detail-actions .publish-form { width: min(100%, 260px); min-width: 0; max-width: 100%; }
.site-panel :is(button, a, input, select, summary):focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.site-header > label { display: grid; width: min(100%, 340px); min-width: 0; gap: 5px; color: var(--tp-text-primary); font-size: .85rem; font-weight: 600; }
.site-header select { width: 100%; min-height: var(--tp-control-height); padding: 8px 12px; border: 1px solid var(--tp-silver); border-radius: var(--radius-sm); color: var(--tp-ink); background: var(--tp-surface-card); }
.site-form { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 16px 0 24px; }
.site-form h3, .site-form .form-actions, .site-form .form-message, .site-form .site-note { grid-column: 1 / -1; }
.site-form .site-wizard-steps, .site-form .site-wizard-step, .site-form .site-wizard-actions { grid-column: 1 / -1; }
.site-form .field-compact small { max-width: 52ch; font-weight: 400; }
.site-wizard-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 16px 0 20px; padding: 0; list-style: none; }
.site-wizard-steps li { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 9px; align-items: center; min-width: 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--radius-md); color: var(--muted); background: var(--tp-surface-page); }
.site-wizard-steps li span { display: grid; width: 26px; height: 26px; grid-row: span 2; place-items: center; border-radius: 50%; color: var(--tp-action-primary); background: var(--tp-action-accent); font-size: .78rem; font-weight: 800; }
.site-wizard-steps li strong { min-width: 0; color: var(--tp-text-secondary); font-size: .82rem; }
.site-wizard-steps li small { min-width: 0; overflow-wrap: anywhere; font-size: .7rem; }
.site-wizard-steps li[aria-current="step"] { border-color: var(--tp-action-primary); box-shadow: 0 0 0 2px color-mix(in srgb, var(--tp-action-primary) 14%, transparent); }
.site-wizard-steps li[aria-current="step"] strong { color: var(--tp-action-primary); }
.site-wizard-step { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 18px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--tp-surface-page); }
.site-wizard-step h4, .site-wizard-step p, .site-wizard-step .wide-field { grid-column: 1 / -1; }
.site-wizard-step h4 { margin: 0; font-size: 1.08rem; }
.site-wizard-step p { margin: -5px 0 2px; color: var(--muted); font-size: .84rem; }
.site-wizard-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 14px; }
.site-wizard-actions .site-wizard-status { margin-right: auto; color: var(--muted); font-size: .8rem; font-weight: 650; }
.technology-form { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 12px 0 20px; padding: 14px; background: var(--tp-pale-purple); border-radius: var(--radius-xl); }
.technology-form h3, .technology-form .wide-field, .technology-form .form-actions, .technology-form button, .technology-form .form-message, .technology-form .site-note { grid-column: 1 / -1; }
.catalog-subsection { margin: 0 0 24px; padding-bottom: 24px; border-bottom: 1px solid var(--tp-silver); }
.catalog-subsection .panel-header { margin-bottom: 10px; }
.technology-technical-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; min-width: 0; margin: 0; padding: 14px; border: 1px solid var(--line); border-radius: 12px; }
.technology-technical-fields[hidden] { display: none; }
.technology-technical-fields legend { padding: 0 6px; font-weight: 700; }
.technology-legal-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; min-width: 0; margin: 0; padding: 14px; border: 1px solid var(--line); border-radius: 12px; }
.technology-legal-fields[hidden] { display: none; }
.technology-legal-fields legend { padding: 0 6px; font-weight: 700; }
.technology-legal-fields p { grid-column: 1 / -1; margin: 0; }
.form-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.site-actions { min-width: 250px; }
.site-actions > .button { margin-bottom: 10px; }
.technology-actions { min-width: 290px; }
.technology-actions .button { margin: 3px; }
.release-actions { display: grid; gap: 10px; min-width: 260px; }
.release-actions > .button { justify-self: start; }
.publish-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 7px; }
.publish-form label { display: grid; min-width: 0; gap: 3px; color: var(--muted); font-size: .75rem; }
.publish-form input, .rollback-form input, .rollback-form select { width: 100%; min-width: 0; max-width: 100%; min-height: 36px; padding: 6px 8px; border: 1px solid var(--tp-silver); border-radius: 8px; }
.publish-form .button { min-height: 38px; justify-self: start; font-size: .82rem; }
.rollback-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 7px; padding-top: 10px; border-top: 1px solid var(--tp-silver); }
.rollback-form label { display: grid; min-width: 0; gap: 3px; color: var(--muted); font-size: .75rem; }
.rollback-form .button { justify-self: start; }
.site-note, .muted { color: var(--muted); font-size: .85rem; }
@media (max-width: 1100px) { .site-card-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 1250px) { .site-list-toolbar { grid-template-columns: minmax(0, 1fr); } .site-list-controls { justify-content: start; } }
@media (max-width: 680px) { .site-list-controls { grid-template-columns: auto minmax(0, 1fr); } .site-list-controls #site-create { grid-column: 2; } .site-search-label { grid-column: 1 / -1; width: 100%; } .site-status-label { grid-column: 1 / -1; } .site-card { padding: var(--tp-space-4); } .site-shortcut { font-size: .65rem; } .site-detail-head { grid-template-columns: minmax(0, 1fr); } .site-wizard-steps { grid-template-columns: minmax(0, 1fr); } .site-wizard-step { grid-template-columns: minmax(0, 1fr); } .site-wizard-step h4, .site-wizard-step p, .site-wizard-step .wide-field { grid-column: auto; } .site-wizard-actions .site-wizard-status { width: 100%; margin-right: 0; } .site-wizard-actions .button { flex: 1 1 auto; } }
.install-card { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--tp-platinum); }
.install-card .panel-header { margin-bottom: 12px; }
.install-card h3 { margin: 0; }
.install-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.code-snippet { overflow-x: auto; padding: 14px; border-radius: var(--radius-sm); color: #fdf3ff; background: var(--tp-russian-violet); font-size: .85rem; white-space: pre-wrap; overflow-wrap: anywhere; }
#copy-message { margin-left: 10px; color: var(--tp-success-text); font-size: .85rem; }
.form-message { margin: 0; color: var(--tp-text-secondary); overflow-wrap: anywhere; }
.form-message:not(:empty) { padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--tp-surface-page); font-size: .84rem; line-height: 1.45; }
.form-message.error-text { color: var(--tp-status-danger-foreground); }
.form-message.success-text { color: var(--tp-success-text); }
.form-message.success-text:not(:empty) { border-color: color-mix(in srgb, var(--tp-success-text) 42%, var(--line)); background: color-mix(in srgb, var(--tp-success-text) 8%, var(--tp-surface-card)); }
.form-message.error-text:not(:empty) { border-color: color-mix(in srgb, var(--tp-status-danger-foreground) 48%, var(--line)); background: var(--tp-status-danger-background); }
[hidden] { display: none !important; }
.notice { display: flex; flex-wrap: wrap; gap: 10px; padding: 15px 18px; border: 1px solid var(--tp-action-primary); border-radius: var(--radius-md); color: var(--tp-text-primary); background: var(--tp-pale-purple); }
.notice span { color: var(--tp-davys-gray); }
.notice.error { border-color: var(--tp-status-danger-foreground); color: var(--tp-status-danger-foreground); background: var(--tp-status-danger-background); }
.admin-feedback { position: fixed; z-index: var(--tp-z-toast, 1200); top: max(20px, env(safe-area-inset-top)); right: max(20px, env(safe-area-inset-right)); display: grid; width: min(460px, calc(100vw - 40px)); gap: 12px; pointer-events: none; }
.admin-feedback-item { display: grid; min-height: 84px; grid-template-columns: 52px minmax(0, 1fr) 28px; align-items: center; gap: 16px; padding: 14px 14px 18px 16px; border: 1px solid var(--line); border-radius: var(--radius-md); color: var(--tp-text-primary); background: var(--tp-surface-card); box-shadow: inset 0 -4px 0 var(--tp-status-success-foreground), var(--tp-elevation-menu); pointer-events: auto; animation: admin-feedback-in var(--tp-duration-normal, 180ms) ease-out both; }
.admin-feedback-item.error { box-shadow: inset 0 -4px 0 var(--tp-status-danger-foreground), var(--tp-elevation-menu); }
.admin-feedback-item.warning { box-shadow: inset 0 -4px 0 var(--tp-status-warning-foreground), var(--tp-elevation-menu); }
.admin-feedback-item.info { box-shadow: inset 0 -4px 0 var(--tp-action-primary), var(--tp-elevation-menu); }
.admin-feedback-icon { display: grid; width: 52px; height: 52px; place-items: center; border-radius: 12px; color: var(--tp-status-success-foreground); background: var(--tp-status-success-background); font-size: 1.05rem; font-weight: 700; }
.admin-feedback-icon svg { display: block; width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.admin-feedback-item.error .admin-feedback-icon { color: var(--tp-status-danger-foreground); background: var(--tp-status-danger-background); }
.admin-feedback-item.warning .admin-feedback-icon { color: var(--tp-status-warning-foreground); background: var(--tp-status-warning-background); }
.admin-feedback-item.info .admin-feedback-icon { color: var(--tp-action-primary); background: var(--tp-action-accent); }
.admin-feedback-message { margin: 0; color: var(--tp-text-primary); font-size: .9rem; line-height: 1.4; }
.admin-feedback-close { display: grid; width: 28px; height: 28px; place-items: center; margin: -5px -5px 0 0; border: 0; border-radius: var(--radius-full); color: var(--tp-text-secondary); background: transparent; font-size: 1.2rem; cursor: pointer; }
.admin-feedback-close:hover { color: var(--tp-text-primary); background: var(--tp-surface-page); }
@keyframes admin-feedback-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
.metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 24px 0; }
.metric, .panel { border: 1px solid var(--line); border-radius: var(--radius-xl); background: var(--surface); box-shadow: var(--shadow-sm); }
.metric { position: relative; min-height: 150px; padding: 18px; }
.metric span, .metric small, table small, .audit-list small { display: block; color: var(--tp-davys-gray); }
.metric .metric-icon { display: grid; width: 48px; height: 48px; margin: 0 0 18px; place-items: center; border-radius: var(--radius-md); color: var(--tp-action-primary); background: var(--tp-action-accent); }
.metric .metric-icon::before { font-size: 1.1rem; font-weight: 750; content: "◆"; }
.metric:nth-child(2) .metric-icon::before { content: "✓"; }
.metric:nth-child(3) .metric-icon::before { content: "–"; }
.metric:nth-child(4) .metric-icon::before { content: "…"; }
.metric strong { display: block; margin: 8px 0 2px; color: var(--tp-purple); font-family: var(--font-brand); font-size: 2rem; }
.admin-onboarding { margin: 24px 0; padding: 24px; }
.admin-onboarding .panel-header { margin-bottom: 18px; }
.admin-onboarding-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.admin-onboarding-grid a { display: grid; min-height: 146px; gap: 9px; padding: 17px; border: 1px solid var(--line); border-radius: var(--radius-lg); color: var(--tp-text-primary); background: var(--tp-surface-page); text-decoration: none; transition: border-color var(--tp-duration-normal), transform var(--tp-duration-normal), box-shadow var(--tp-duration-normal); }
.admin-onboarding-grid a:hover { border-color: var(--tp-action-primary); box-shadow: var(--shadow-sm); transform: translateY(-2px); }
.admin-onboarding-grid span { display: grid; width: 30px; height: 26px; place-items: center; border-radius: var(--radius-full); color: var(--tp-action-primary); background: var(--tp-action-accent); font-size: .72rem; font-weight: 800; }
.admin-onboarding-grid strong { font-family: var(--font-brand); font-size: 1.03rem; line-height: 1.1; }
.admin-onboarding-grid small { color: var(--tp-text-secondary); line-height: 1.35; }
.panel { min-width: 0; padding: 22px; }
.panel-header { margin-bottom: 18px; }
.panel-header h2 { font-size: 1.55rem; }
.table-wrap { width: 100%; min-width: 0; max-width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 13px 8px; border-bottom: 1px solid var(--tp-platinum); font-size: .9rem; text-align: left; }
th { color: var(--tp-davys-gray); font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; }
.badge { display: inline-flex; padding: 5px 10px; border: 1px solid var(--tp-border-default); border-radius: var(--radius-full); color: var(--tp-text-primary); background: var(--tp-pale-purple); font-size: .72rem; font-weight: 700; }
.legal-review-badge { margin-top: 4px; border-color: var(--tp-status-warning-foreground); color: var(--tp-status-warning-foreground); background: var(--tp-status-warning-background); }
.audit-list { margin: 0; padding: 0; list-style: none; }
.audit-list li { display: flex; gap: 10px; padding: 12px 0; border-bottom: 1px solid var(--tp-platinum); }
.audit-icon { display: grid; width: 26px; height: 26px; flex: 0 0 auto; place-items: center; border-radius: 50%; color: var(--tp-status-success-foreground); background: var(--tp-status-success-background); }
.developer-body .admin-header p:not(.eyebrow) { max-width: 680px; margin: 8px 0 0; color: var(--muted); }
.developer-nav { display: flex; flex-wrap: wrap; gap: 10px; }
.developer-main { max-width: 1240px; margin: auto; padding: 24px clamp(24px, 4vw, 54px) 72px; }
.developer-toc { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0; }
.developer-toc a { padding: 8px 13px; border: 1px solid var(--line); border-radius: var(--radius-full); color: var(--tp-purple); background: var(--tp-surface-card); font-size: .87rem; font-weight: 700; text-decoration: none; }
.developer-section { margin: 18px 0; padding: 26px; scroll-margin-top: 16px; }
.developer-section h2 { margin-bottom: 16px; }
.developer-section h3 { margin-top: 24px; }
.developer-section li { margin: 8px 0; }
.developer-section .code-snippet { margin: 14px 0; }
.developer-section .notice { margin-bottom: 20px; }
.scanner-main { max-width: 1080px; }
.scanner-page-header { margin-bottom: var(--tp-space-5); }
.scanner-page-header .eyebrow { margin-bottom: var(--tp-space-2); }
.scanner-page-header h1 { margin: 0 0 var(--tp-space-2); font-family: var(--font-brand); font-size: clamp(1.8rem, 3vw, 2.5rem); line-height: 1.15; }
.scanner-page-header p:last-child { margin: 0; color: var(--tp-text-secondary); }
.scanner-privacy { margin: 18px 0; }
.scanner-form { max-width: 780px; margin-top: 22px; }
.scanner-form > label > select { max-width: 420px; }
#google-consent-transport { width: min(100%, 420px); }
.scanner-form input[type="file"] { padding: 7px; }
.scanner-custom { display: grid; gap: 12px; margin: 0; padding: 16px; border: 1px solid var(--line); border-radius: var(--radius-md); }
.scanner-custom[hidden] { display: none; }
.scanner-custom legend { padding: 0 7px; font-weight: 700; }
.scanner-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.scanner-choices label { display: grid; gap: 6px; }
.scanner-results { scroll-margin-top: 16px; }
.scanner-results .panel-header { display: flex; justify-content: space-between; align-items: center; gap: 14px; }
.scanner-results h2 { margin-bottom: 0; }
.scanner-results td { overflow-wrap: anywhere; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }

@media (max-width: 1023px) {
  .admin-login-shell { grid-template-columns: minmax(0, 1fr); }
  .admin-login-form-pane { padding-right: clamp(24px, 8vw, 72px); padding-left: clamp(24px, 8vw, 72px); }
  .admin-login-form-wrap { padding-bottom: 100px; }
  .admin-login-brand-panel { display: none; }
  .admin-login-mobile-brand { display: flex; }
  .demo-hero { min-height: 0; grid-template-columns: minmax(0, 1fr); }
  .demo-journey-card { max-width: 760px; }
  .demo-status-section { grid-template-columns: minmax(0, 1fr); }
  .privacy-portal-main { grid-template-columns: minmax(0, 1fr); }
  .privacy-portal-intro { position: static; }
  .admin-onboarding-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .analytics-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  .demo-header { min-height: 78px; padding-inline: 20px; }
  .demo-brand { width: 202px; margin-left: -20px; padding: 16px 24px; }
  .demo-brand img { width: 154px; }
  .demo-how-grid { grid-template-columns: minmax(0, 1fr); }
  #admin-app { grid-template-columns: minmax(0, 1fr); }
  #admin-app.admin-sidebar-collapsed { grid-template-columns: minmax(0, 1fr); }
  .developer-shell, .developer-shell.developer-sidebar-collapsed { display: grid; grid-template-columns: minmax(0, 1fr); }
  .admin-sidebar { position: static; width: 100%; min-width: 0; height: auto; overflow: hidden; gap: 10px; padding: 14px 20px; border-right: 0; border-bottom: 1px solid var(--line); }
  .developer-sidebar, .developer-sidebar-collapsed .developer-sidebar { position: static; width: 100%; height: auto; padding: 14px 20px; overflow: hidden; }
  .admin-sidebar-collapsed .admin-sidebar { padding: 14px 20px; }
  .admin-sidebar-brand { min-height: 52px; }
  .admin-sidebar-collapsed .admin-brand-wordmark, .developer-sidebar-collapsed .developer-brand .admin-brand-wordmark { display: block; opacity: 1; visibility: visible; transform: scaleX(1); }
  .admin-sidebar-collapsed .admin-brand-symbol, .developer-sidebar-collapsed .developer-brand .admin-brand-symbol { display: block; opacity: 0; visibility: hidden; transform: scale(.72); }
  .admin-sidebar-toggle { display: none; }
  .admin-sidebar-collapsed .admin-sidebar-label { display: block; }
  .developer-sidebar-collapsed .developer-sidebar-label { display: block; }
  .admin-sidebar-label { margin-top: 0; }
  .admin-sidebar-nav { display: flex; width: 100%; min-width: 0; max-width: 100%; flex-wrap: wrap; overflow: hidden; padding: 0 2px 4px; }
  .admin-nav-group-label { flex: 1 0 100%; }
  .admin-sidebar-collapsed .admin-sidebar-nav { width: 100%; }
  .developer-sidebar-collapsed .developer-sidebar-nav { width: 100%; }
  .admin-sidebar-nav a { min-width: 0; flex: 1 1 calc(50% - 4px); }
  .admin-sidebar-collapsed .admin-sidebar-nav a { justify-content: flex-start; padding: 8px 12px; font-size: .9rem; }
  .developer-sidebar-collapsed .developer-sidebar-nav a { justify-content: flex-start; padding: 8px 12px; font-size: .9rem; }
  .admin-sidebar-collapsed .admin-sidebar-nav a::before { left: 0; }
  .admin-sidebar-collapsed .admin-sidebar-nav a span { position: static; width: auto; height: auto; overflow: visible; clip-path: none; font-size: .9rem; white-space: normal; }
  .developer-sidebar-collapsed .developer-sidebar-nav a span { position: static; width: auto; height: auto; overflow: visible; clip-path: none; font-size: .9rem; white-space: normal; }
  .admin-sidebar-note { display: none; }
  .admin-sidebar-cta, .admin-sidebar-collapsed .admin-sidebar-cta { display: flex; margin-top: var(--tp-space-2); }
  .admin-sidebar-cta[hidden] { display: none; }
  .admin-topbar { position: static; }
  .admin-topbar-start { flex: 1 1 auto; }
  .admin-command-search { width: min(440px, 55vw); }
  .admin-app-content { padding: 20px 20px 56px; }
  .admin-command-strip { align-items: flex-start; flex-direction: column; }
  .admin-command-actions { justify-content: flex-start; }
  .webhook-panel-header { align-items: flex-start; flex-direction: column; }
  .privacy-requests-header { align-items: flex-start; flex-direction: column; }
  .documents-header { flex-direction: column; }
  .consent-banner { display: block; }
  .banner-actions { justify-content: flex-start; margin-top: 18px; }
  .metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .user-form { grid-template-columns: minmax(0, 1fr); }
  .site-form { grid-template-columns: minmax(0, 1fr); }
  .site-form h3, .site-form .form-actions, .site-form .form-message, .site-form .site-note, .site-form .site-wizard-steps, .site-form .site-wizard-step, .site-form .site-wizard-actions { grid-column: 1; }
  .technology-form { grid-template-columns: minmax(0, 1fr); }
  .technology-form h3, .technology-form .wide-field, .technology-form .form-actions, .technology-form button, .technology-form .form-message, .technology-form .site-note { grid-column: 1; }
  .technology-technical-fields, .technology-legal-fields { grid-template-columns: minmax(0, 1fr); }
  .site-header { align-items: stretch; flex-direction: column; }
  .scanner-choices { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 620px) {
  .demo-header { width: 100%; max-width: 100vw; min-height: 72px; gap: 12px; padding-right: 14px; padding-left: 14px; overflow: hidden; }
  .demo-brand { width: 184px; margin-left: -14px; padding: 14px 20px; }
  .demo-brand img { width: 144px; }
  .demo-nav { position: absolute; top: 14px; right: 14px; width: 44px; gap: 0; }
  .demo-nav > a { display: none; }
  .demo-page { padding: 52px 20px 380px; }
  .demo-page h1 { font-size: clamp(2.75rem, 14vw, 4rem); }
  .demo-hero { gap: 42px; }
  .demo-hero-actions { display: grid; grid-template-columns: minmax(0, 1fr); }
  .demo-hero-actions .button { width: 100%; }
  .demo-journey-card { padding: 24px 20px; border-radius: 22px; }
  .demo-journey-list li { grid-template-columns: 36px minmax(0, 1fr); padding: 17px 15px; }
  .demo-journey-list li > span { width: 34px; height: 34px; }
  .demo-status-section, .demo-how { margin-top: 72px; }
  .demo-status-section { padding: 22px 19px; border-radius: 20px; }
  .demo-footer { align-items: flex-start; flex-direction: column; padding: 34px 20px; }
  .privacy-portal-header { min-height: 72px; padding: 14px 20px; }
  .privacy-portal-header img { width: 144px; }
  .privacy-portal-main { padding: 52px 20px 88px; }
  .privacy-request-form { grid-template-columns: minmax(0, 1fr); }
  .consent-banner { right: 10px; bottom: 10px; left: 10px; max-height: min(78vh, 640px); overflow-y: auto; padding: 20px; }
  .banner-actions { display: grid; grid-template-columns: minmax(0, 1fr); }
  .banner-actions .button, .dialog-actions .button { width: 100%; }
  .preferences form { padding: 22px 18px; }
  .category-row { gap: 12px; padding: 14px; }
  .metrics { grid-template-columns: minmax(0, 1fr); }
  .admin-header { align-items: flex-start; flex-direction: column; padding: 24px 20px; }
  .admin-header { gap: 14px; }
  .admin-header-actions { justify-content: flex-start; }
  .admin-main { padding: 0; }
  .admin-login-form-pane { padding-right: 24px; padding-left: 24px; }
  .admin-login-topbar { padding-top: 22px; }
  .admin-login-form-wrap { padding-top: 22px; }
  .admin-login-mobile-brand { margin-bottom: 28px; }
  .admin-login-heading { margin-bottom: 30px; }
  .admin-sidebar { padding: 12px 14px; }
  .admin-topbar { align-items: flex-start; flex-direction: column; gap: 10px; padding: 14px; }
  .admin-topbar-start, .admin-command-search { width: 100%; min-width: 0; }
  .admin-command-search kbd { display: none; }
  .admin-toolbar { width: 100%; justify-content: flex-end; }
  .admin-account-trigger { max-width: calc(100vw - 28px); }
  .admin-user-chip { flex: 0 1 auto; margin: 0; }
  .admin-app-content { padding: 18px 14px 48px; }
  .admin-command-strip { padding: 18px; }
  .admin-command-actions { display: grid; width: 100%; grid-template-columns: minmax(0, 1fr); }
  .admin-command-actions .button { width: 100%; }
  .document-form { grid-template-columns: minmax(0, 1fr); }
  .document-form .wide-field { grid-column: auto; }
  .webhook-form, .webhook-events { grid-template-columns: minmax(0, 1fr); }
  .developer-sidebar, .developer-sidebar-collapsed .developer-sidebar { padding: 12px 14px; }
  .developer-sidebar-footer { display: none; }
  .developer-header { min-height: 0; }
  .developer-main { padding: 18px 14px 48px; }
  .developer-section { padding: 19px; }
  .admin-onboarding { padding: 19px; }
  .admin-onboarding-grid { grid-template-columns: minmax(0, 1fr); }
  .admin-onboarding-grid a { min-height: 0; }
  .scanner-results .panel-header { align-items: flex-start; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
@media (forced-colors: active) {
  :root { --line: CanvasText; --focus: Highlight; }
  .admin-sidebar, .admin-topbar, .panel, .metric-card, .admin-command-strip, .admin-dropdown-menu, .button, .admin-login-theme, input, select, textarea, table { border-color: CanvasText; box-shadow: none; }
  .button-primary, .admin-sidebar-nav a[aria-current="page"] { color: HighlightText; background: Highlight; forced-color-adjust: auto; }
  .admin-unread-dot { border: 1px solid CanvasText; background: Highlight; }
  .admin-nav-icon, .admin-round-action svg, .admin-sidebar-toggle svg { stroke: currentColor; }
  .admin-login-brand-panel { border-left: 1px solid CanvasText; color: CanvasText; background: Canvas; }
  .admin-login-brand-content h2, .admin-login-brand-content p { color: CanvasText; }
}

.content-card { margin-top: 28px; padding: 24px; border: 1px solid var(--line); border-radius: 18px; background: var(--tp-surface-card); }
.content-editor-header { display: flex; align-items: end; justify-content: space-between; gap: 18px; }
.content-editor-header > div { min-width: 0; }
.content-editor-header label { display: grid; min-width: min(100%, 220px); gap: 6px; color: var(--tp-text-primary); font-size: .875rem; font-weight: 600; }
.content-editor-header select { width: 100%; min-height: var(--tp-control-height); padding: 10px 12px; border: 1px solid var(--tp-silver); border-radius: var(--radius-sm); color: var(--tp-ink); background: var(--tp-surface-card); font: inherit; }
.content-form { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 18px; }
.content-field-group { grid-column: 1 / -1; min-width: 0; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--tp-surface-page); }
.content-field-group > summary { padding: 14px 16px; color: var(--tp-action-primary); cursor: pointer; font-weight: 700; list-style-position: inside; }
.content-field-group > summary::marker { color: var(--tp-action-primary); }
.content-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding: 0 16px 16px; }
.content-field-grid .wide-field { grid-column: 1 / -1; }
.content-category-section { padding-top: 22px; border-top: 1px solid var(--line); }
.content-category-section h4 { margin: 0 0 6px; font-size: 1.08rem; }
.content-category-section > p { margin: 0 0 18px; color: var(--muted); }
.content-category-fields { display: grid; gap: 14px; }
.content-category-row { border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--tp-surface-page); }
.content-category-row > summary { padding: 14px 16px; color: var(--tp-text-primary); cursor: pointer; font-weight: 700; list-style-position: inside; }
.content-category-row > summary::marker { color: var(--tp-action-primary); }
.content-category-row-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); gap: 14px; padding: 0 16px 16px; }
.style-workspace { margin-top: 24px; }
.style-controls, .style-preview-panel { min-width: 0; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--tp-surface-card); }
.style-site-context { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 18px; padding: 14px 18px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--tp-surface-card); }
.style-site-context-info { display: flex; min-width: 0; flex: 1 1 260px; flex-wrap: wrap; align-items: baseline; gap: 5px 12px; overflow-wrap: anywhere; }
.style-site-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.style-site-context-label { width: 100%; color: var(--muted); font-size: .75rem; }
.style-site-context strong { font-family: var(--font-brand); }
.style-site-context #style-site-domain { color: var(--muted); }
.style-site-context #style-site-status { padding: 3px 9px; border-radius: 999px; color: var(--tp-text-primary); background: var(--tp-action-accent); font-size: .8rem; }
.style-site-context .button { flex: none; }
#style-draft-message:empty { display: none; }
.style-controls .panel-header, .style-preview-panel .panel-header { margin-bottom: 4px; }
.style-controls .panel-header p, .style-preview-panel .panel-header p { margin: 4px 0; }
.style-theme-tabs { display: flex; gap: 8px; border-bottom: 1px solid var(--line); padding-bottom: 8px; }
.style-theme-tabs .button[aria-pressed="true"] { color: var(--tp-action-primary-foreground); background: var(--tp-action-primary); border-color: var(--tp-action-primary); }
.style-colors { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.style-colors label { display: grid; min-width: 0; gap: 6px; }
.style-color-control { display: grid; grid-template-columns: minmax(54px, 72px) minmax(0, 1fr); align-items: center; gap: 8px; min-width: 0; }
.admin-form .style-colors input[type="color"] { width: 100%; max-width: none; height: 46px; padding: 4px; cursor: pointer; }
.admin-form .style-color-hex { min-width: 0; width: 100%; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; text-transform: uppercase; }
.admin-form .style-color-hex[aria-invalid="true"] { border-color: var(--tp-danger, #b42318); box-shadow: 0 0 0 2px color-mix(in srgb, var(--tp-danger, #b42318) 16%, transparent); }
.style-options { display: flex; flex-wrap: wrap; gap: 10px 18px; min-width: 0; margin: 0; padding: 12px 0 0; border: 0; border-top: 1px solid var(--line); }
.style-options legend { padding: 0; color: var(--tp-text-primary); font-size: .875rem; font-weight: 600; }
.admin-form .style-options label { display: inline-flex; align-items: center; gap: 7px; font-weight: 400; }
.admin-form .style-options input[type="radio"] { width: 18px; min-width: 18px; height: 18px; min-height: 18px; margin: 0; padding: 0; accent-color: var(--tp-action-primary); }
.style-icon-options { gap: 12px; }
.admin-form .style-options .style-icon-option { position: relative; display: flex; width: 88px; min-width: 88px; flex: 0 0 88px; flex-direction: column; align-items: center; justify-content: flex-start; gap: 7px; cursor: pointer; text-align: center; font-size: .75rem; line-height: 1.2; }
.admin-form .style-icon-option input[type="radio"] { position: absolute; width: 100%; height: 100%; min-width: 0; min-height: 0; inset: 0; opacity: 0; cursor: pointer; }
.style-icon-circle { display: grid; width: 52px; height: 52px; min-width: 52px; min-height: 52px; flex: 0 0 52px; place-items: center; border: 2px solid var(--tp-action-primary); border-radius: 50%; color: var(--tp-action-primary); background: var(--tp-surface-card); overflow: hidden; transition: background .15s, color .15s; }
.style-icon-circle svg { width: 36px; height: 36px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.style-icon-circle.style-icon-brand { border: 0; background: transparent; overflow: visible; }
.style-icon-brand svg { display: block; width: 52px; height: 52px; stroke: none; }
.style-icon-option input:checked + .style-icon-circle { color: var(--tp-action-primary-foreground); background: var(--tp-action-primary); }
.style-icon-option input:checked + .style-icon-brand { outline: 3px solid var(--tp-action-primary); outline-offset: 3px; }
.style-icon-option input:focus-visible + .style-icon-circle { outline: 3px solid var(--tp-action-primary); outline-offset: 3px; }
.style-icon-option input:disabled + .style-icon-circle { opacity: .55; }
.style-icon-option input:disabled + .style-icon-brand { opacity: 1; }
.style-controls .form-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.style-controls .form-actions .button { width: 100%; min-width: 0; height: 100%; }
.style-preview-panel { margin-top: 20px; scroll-margin-top: 96px; }
.style-preview-badge { flex: none; color: var(--muted); font-size: .75rem; }
.style-preview-state { display: inline-flex; align-items: center; gap: 8px; margin: 6px 0 0; color: var(--tp-text-primary); font-size: .84rem; }
.style-preview-state input { width: 18px; height: 18px; accent-color: var(--preview-primary, #6b0080); }
.style-preview-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 16px; }
.style-preview-stage { --preview-primary: #6b0080; --preview-text: #25002d; --preview-bg: #fff; --preview-on-primary: #fff; position: relative; display: flex; min-width: 0; min-height: 440px; align-items: flex-end; justify-content: center; overflow: hidden; padding: 58px 16px 60px; border: 1px solid var(--line); border-radius: var(--radius-md); background: color-mix(in srgb, var(--preview-bg) 30%, var(--tp-surface-page)); }
.style-preview-top { position: absolute; z-index: 2; top: 0; right: 0; left: 0; padding: 12px 18px; border-bottom: 1px solid color-mix(in srgb, var(--preview-text) 12%, var(--preview-bg)); color: var(--muted); background: color-mix(in srgb, var(--preview-bg) 86%, var(--tp-surface-page)); font-size: .75rem; }
.style-preview-notice { position: relative; z-index: 1; width: min(100%, 420px); padding: 16px; border: 1px solid color-mix(in srgb, var(--preview-text) 20%, var(--preview-bg)); border-top: 4px solid var(--preview-primary); border-radius: 18px; color: var(--preview-text); background: var(--preview-bg); box-shadow: var(--shadow-sm); overflow-wrap: anywhere; }
.style-preview-notice strong, .style-preview-preferences strong { display: block; font-family: var(--font-brand); font-size: 1.12rem; }
.style-inline-edit-hint { margin: 8px 0; color: var(--tp-action-primary); font-size: .8rem; }
.style-preview-inline-editor { display: block; min-width: 0; }
.style-preview-inline-editor.is-editable { border-radius: 5px; }
.style-preview-character-count { display: none; width: fit-content; margin: 4px 0 2px auto; padding: 2px 7px; border-radius: 4px; color: var(--tp-action-primary); background: color-mix(in srgb, var(--tp-action-accent) 72%, var(--tp-surface-card)); font-size: .68rem; font-weight: 700; line-height: 1.25; white-space: nowrap; }
.style-preview-inline-editor.is-editing .style-preview-character-count, .style-preview-inline-editor:focus-within .style-preview-character-count { display: block; }
.style-preview-character-count.is-over-limit { color: var(--tp-status-danger-foreground); background: var(--tp-status-danger-surface); }
.style-preview-inline-editable { cursor: text; outline: 1px dashed transparent; outline-offset: 4px; transition: outline-color var(--tp-duration-fast, 120ms) ease, background-color var(--tp-duration-fast, 120ms) ease; }
.style-preview-inline-editable:hover, .style-preview-inline-editable:focus { outline-color: var(--preview-primary); background: color-mix(in srgb, var(--preview-primary) 8%, transparent); }
.style-preview-inline-editable:focus { border-radius: 4px; }
.style-preview-eyebrow { display: block; color: var(--preview-primary); font-size: .7rem; font-weight: 700; text-transform: uppercase; }
.style-preview-notice p { margin: 7px 0 15px; font-size: .82rem; }
.style-preview-notice .style-preview-expired { padding: 8px 10px; border-radius: 8px; background: color-mix(in srgb, var(--preview-primary) 12%, var(--preview-bg)); }
.style-preview-policy { display: inline-block; margin: 0 0 14px; color: var(--preview-primary); font-size: .78rem; text-decoration: underline; }
.style-preview-policy[hidden], .style-preview-expired[hidden] { display: none; }
.style-preview-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.style-preview-actions span, .style-preview-controller, .style-preview-preferences > span { display: inline-flex; min-height: 38px; align-items: center; justify-content: center; padding: 7px 9px; border: 1px solid var(--preview-primary); border-radius: 999px; color: var(--preview-primary); background: var(--preview-bg); font-size: .72rem; font-weight: 700; line-height: 1.25; text-align: center; }
.style-preview-actions span:first-child { grid-column: 1 / -1; }
.style-preview-actions .primary, .style-preview-preferences > span { color: var(--preview-on-primary); background: var(--preview-primary); }
.style-preview-stage[data-match-buttons="true"] #style-preview-reject { color: var(--preview-on-primary); background: var(--preview-primary); }
.style-preview-controller { position: absolute; right: 12px; bottom: 9px; gap: 9px; max-width: calc(100% - 24px); padding-inline: 13px; color: var(--preview-primary); white-space: nowrap; }
.style-preview-controller svg { width: 21px; height: 21px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.style-preview-controller.style-preview-icon-controller { width: 58px; height: 58px; min-height: 58px; padding: 2px; border-width: 2px; border-radius: 50%; line-height: 0; }
.style-preview-controller .style-preview-brand svg { width: 24px; height: 24px; stroke: none; fill: currentColor; }
.style-preview-controller.style-preview-icon-controller .style-preview-brand svg { width: 50px; height: 50px; }
.style-preview-controller .style-preview-brand svg path { fill: var(--preview-on-primary); }
.style-preview-controller.style-preview-icon-controller #style-preview-launcher { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.style-preview-controller.style-preview-icon-controller svg:not(.style-preview-brand) { width: 28px; height: 28px; }
.style-preview-stage[data-controller-side="left"] .style-preview-controller { right: auto; left: 12px; }
.style-preview-stage[data-notice-placement="controller"] .style-preview-notice { width: min(100%, 420px); margin-right: 0; margin-left: auto; }
.style-preview-stage[data-notice-placement="controller"][data-controller-side="left"] .style-preview-notice { margin-right: auto; margin-left: 0; }
.style-preview-stage[data-notice-placement="center-top"] { align-items: flex-start; padding-top: 42px; }
.style-preview-stage[data-layout="modern"] .style-preview-notice { border-top-width: 1px; border-radius: 10px; }
.style-preview-stage[data-layout="modern"] .style-preview-actions span, .style-preview-stage[data-layout="modern"] .style-preview-controller { border-radius: 8px; }
.style-preview-preferences { display: flex; min-width: 0; min-height: 440px; max-height: 440px; flex-direction: column; padding: 22px; border: 1px solid color-mix(in srgb, var(--preview-text) 20%, var(--preview-bg)); border-radius: var(--radius-md); color: var(--preview-text, var(--tp-text-primary)); background: var(--preview-bg, var(--tp-surface-card)); box-shadow: var(--shadow-sm); }
.style-preview-dialog-head { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; grid-template-areas: "eyebrow language close" "title title title"; align-items: center; gap: 6px 10px; }
.style-preview-dialog-head .style-preview-eyebrow { grid-area: eyebrow; }
.style-preview-dialog-head strong { grid-area: title; color: var(--preview-primary); line-height: 1.2; }
#style-preview-language { grid-area: language; color: var(--preview-text); font-size: .7rem; white-space: nowrap; }
.style-preview-close { display: inline-grid; grid-area: close; width: 28px; height: 28px; place-items: center; border: 1px solid currentColor; border-radius: 50%; font-size: 1.1rem; line-height: 1; }
.style-preview-preferences > p { margin: 8px 0 14px; font-size: .82rem; }
.style-preview-categories { min-height: 0; flex: 1; overflow-y: auto; padding-right: 8px; }
.style-preview-category { margin-bottom: 9px; padding: 12px; border: 1px solid color-mix(in srgb, var(--preview-text) 17%, var(--preview-bg)); border-radius: 12px; overflow-wrap: anywhere; }
.style-preview-category-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.style-preview-category-title { display: flex; align-items: center; gap: 9px; }
.style-preview-category-title svg { width: 21px; height: 21px; flex: none; fill: none; stroke: var(--preview-primary); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.style-preview-category strong { font-family: inherit; font-size: .88rem; }
.style-preview-category p { margin: 5px 0 0; font-size: .78rem; line-height: 1.45; }
.style-preview-category .style-preview-choice { font-weight: 700; }
.style-preview-category .style-preview-service-count { font-size: .7rem; }
.style-preview-toggle { position: relative; display: inline-flex; flex: none; width: 44px; height: 44px; align-items: center; justify-content: center; cursor: pointer; }
.style-preview-toggle input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: inherit; }
.style-preview-toggle input:disabled { cursor: not-allowed; }
.style-preview-toggle input:focus-visible + .style-preview-switch { outline: 3px solid var(--preview-primary); outline-offset: 3px; }
.style-preview-switch { display: block; flex: none; width: 37px; height: 22px; padding: 3px; border-radius: 999px; background: color-mix(in srgb, var(--preview-text) 34%, var(--preview-bg)); pointer-events: none; }
.style-preview-switch::before { display: block; width: 16px; height: 16px; border-radius: 50%; background: var(--preview-bg); content: ''; }
.style-preview-switch.is-on { background: var(--preview-primary); }
.style-preview-switch.is-on::before { transform: translateX(15px); }
.style-preview-details { display: inline-flex; min-height: 44px; align-items: center; margin: 4px 0 0; padding: 8px 4px; border: 0; border-radius: 6px; color: var(--preview-primary); background: transparent; cursor: pointer; font: inherit; font-size: .76rem; text-decoration: underline; }
.style-preview-details:focus-visible { outline: 3px solid var(--preview-primary); outline-offset: 2px; }
.style-preview-detail-copy { margin-top: 5px; font-size: .74rem; }
.style-preview-detail-copy[hidden] { display: none; }
.style-preview-detail-copy span { display: inline-block; margin: 5px 10px 0 0; color: var(--preview-primary); text-decoration: underline; }
.style-preview-service { margin: 8px 0; padding: 9px; border: 1px solid color-mix(in srgb, var(--preview-text) 17%, var(--preview-bg)); border-radius: 9px; }
.style-preview-service > strong { font-size: .8rem; }
.style-preview-service p { font-size: .7rem; }
.style-preview-service p strong { display: inline; font-size: inherit; }
.style-preview-dialog-actions { display: flex; gap: 8px; flex: none; margin-top: 16px; }
.style-preview-dialog-actions > span { display: inline-flex; flex: 1; min-height: 38px; align-items: center; justify-content: center; padding: 7px 9px; border: 1px solid var(--preview-primary); border-radius: 999px; color: var(--preview-primary); font-size: .72rem; font-weight: 700; text-align: center; }
.style-preview-dialog-actions > .primary { color: var(--preview-on-primary); background: var(--preview-primary); }
.style-preview-panel .site-note { margin: 8px 0; }
.style-preview-return-bar { position: sticky; z-index: 3; top: 8px; display: flex; justify-content: flex-end; padding: 4px; background: var(--tp-surface-card); }
.content-preview-toolbar { position: sticky; z-index: 3; top: 8px; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 18px; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--radius-md); color: var(--tp-text-primary); background: var(--tp-surface-card); box-shadow: var(--shadow-sm); font-size: .84rem; }
.style-preview-nav-button { display: inline-flex; flex: none; align-items: center; gap: 8px; }
.style-preview-nav-button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.style-controls .form-message { min-height: 1.4em; }
@media (max-width: 900px) { .style-preview-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) { .content-editor-header { align-items: stretch; flex-direction: column; } .content-editor-header label { width: 100%; max-width: 320px; } }
@media (max-width: 760px) { .content-category-row { grid-template-columns: minmax(0, 1fr); } #style-panel .style-preview-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 530px) { .style-controls, .style-preview-panel { padding: 16px; } .style-colors { grid-template-columns: repeat(2, minmax(0, 1fr)); } .style-preview-stage { min-height: 350px; } .style-preview-preferences { min-height: 350px; max-height: 400px; padding: 16px; } .style-preview-dialog-head { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "eyebrow close" "title title" "language language"; } #style-preview-language { justify-self: start; } .style-controls .form-actions { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 530px) {
  #style-panel { padding: 14px; }
  #style-panel .content-card { padding: 16px; }
  #style-panel .style-preview-panel { padding: 12px; }
  #style-panel .style-preview-stage { padding: 12px 10px 60px; }
  #style-panel .style-preview-notice { padding: 12px; }
  #style-panel .style-preview-actions { grid-template-columns: minmax(0, 1fr); }
  #style-panel .style-preview-actions span:first-child { grid-column: auto; }
  #style-panel .style-preview-preferences { min-height: 0; max-height: none; padding: 14px; }
  #style-panel .style-preview-categories { flex: none; overflow: visible; padding-right: 0; }
  #style-panel .content-preview-toolbar { flex-wrap: wrap; }
  #style-panel .content-preview-toolbar .button { width: 100%; justify-content: center; }
}
@media (max-width: 530px) { .style-site-context { align-items: stretch; flex-direction: column; } .style-site-actions { flex-direction: column; } .style-site-context .button { width: 100%; } }
@media (max-width: 760px) {
  .content-form { grid-template-columns: minmax(0, 1fr); }
  .content-field-grid, .content-category-row-fields { grid-template-columns: minmax(0, 1fr); }
  .content-field-grid .wide-field { grid-column: auto; }
  .content-form .wide-field, .content-form .form-actions, .content-form .form-message, .content-form .site-note { grid-column: 1; }
}

.integration-main, .privacy-policy-main { max-width: 1180px; margin: auto; padding: clamp(56px, 8vw, 104px) 28px 96px; }
.integration-hero { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr); align-items: center; gap: clamp(36px, 7vw, 88px); min-height: min(560px, calc(100vh - 240px)); }
.integration-hero h1, .privacy-policy-card h1 { max-width: 740px; margin: 0 0 22px; font-size: clamp(3rem, 6.3vw, 5rem); line-height: .98; }
.integration-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.integration-status-card { padding: clamp(28px, 4vw, 42px); border-radius: 28px; color: #fff; background: var(--tp-gradient-deep); box-shadow: var(--shadow-md); }
.integration-status-card .eyebrow { color: #fff; }
.integration-status-card strong { display: block; margin-top: 12px; font-family: var(--font-brand); font-size: clamp(1.55rem, 3vw, 2.25rem); line-height: 1.05; }
.integration-status-card p:not(.eyebrow) { color: rgb(255 255 255 / 82%); }
.integration-status-card .badge { display: inline-flex; margin-top: 12px; border: 1px solid rgb(255 255 255 / 30%); color: #fff; background: rgb(255 255 255 / 12%); }
.integration-steps { margin-top: 48px; padding: clamp(24px, 4vw, 42px); }
.integration-steps h2 { margin-bottom: 26px; }
.integration-steps ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin: 0; padding: 0; list-style: none; counter-reset: integration; }
.integration-steps li { display: grid; gap: 8px; min-width: 0; padding: 22px; border: 1px solid var(--line); border-radius: var(--radius-lg); counter-increment: integration; }
.integration-steps li::before { content: "0" counter(integration); color: var(--tp-action-primary); font-size: .78rem; font-weight: 800; }
.integration-steps span { color: var(--tp-text-secondary); }
.integration-hero-compact { min-height: min(480px, calc(100vh - 150px)); }
.privacy-policy-main { max-width: 900px; }
.privacy-policy-card { display: grid; gap: 18px; padding: clamp(28px, 5vw, 58px); }
.privacy-policy-card h2 { margin: 14px 0 0; font-size: 1.55rem; }
.privacy-policy-card p { max-width: 68ch; margin: 0; color: var(--tp-text-secondary); }
.privacy-policy-card .lede { color: var(--tp-text-primary); font-size: 1.18rem; }
.privacy-policy-card .notice { margin: 12px 0; }
.developer-document-main { max-width: 1040px; padding-bottom: 72px; }
.developer-document-content { max-width: 960px; padding: clamp(24px, 4vw, 48px); }
.developer-document-content > :first-child { margin-top: 0; }
.developer-document-content h2 { margin-top: 34px; font-size: clamp(1.55rem, 2.8vw, 2.15rem); }
.developer-document-content h3 { margin-top: 24px; font-size: 1.25rem; }
.developer-document-content h4, .developer-document-content h5 { margin-top: 24px; font-size: 1.1rem; }
.developer-document-content p, .developer-document-content li { max-width: 82ch; }
.developer-document-content li { margin: 9px 0; }
.developer-document-content hr { margin: 34px 0; border: 0; border-top: 1px solid var(--line); }
.developer-document-content .developer-table-row { max-width: none; margin: 0; padding: 12px 14px; border: 1px solid var(--line); border-bottom: 0; background: color-mix(in srgb, var(--tp-surface-page) 58%, transparent); font-size: .92rem; }
.developer-document-content .developer-table-row:last-of-type { border-bottom: 1px solid var(--line); }
.developer-openapi-intro { display: grid; gap: 14px; }
.developer-openapi-intro p { margin: 0; }
.developer-openapi-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.developer-openapi-source { max-height: 68vh; overflow: auto; white-space: pre; }
@media (max-width: 760px) {
  .integration-main, .privacy-policy-main { padding: 52px 20px 72px; }
  .integration-hero { min-height: 0; grid-template-columns: minmax(0, 1fr); }
  .integration-hero h1, .privacy-policy-card h1 { font-size: clamp(2.7rem, 13vw, 4rem); }
  .integration-steps ol { grid-template-columns: minmax(0, 1fr); }
  .integration-actions .button { width: 100%; }
  .developer-document-header { position: static; }
  .developer-document-content { padding: 24px 19px; }
  .analytics-header { display: flex; flex-direction: column; }
  .analytics-header .button { width: 100%; }
  .analytics-grid { grid-template-columns: minmax(0, 1fr); }
  .analytics-card-wide { grid-column: auto; }
  .analytics-actions { width: 100%; }
  .analytics-report-actions { grid-template-columns: minmax(0, 1fr); }
  .analytics-period-summary, .analytics-card-heading { flex-direction: column; }
  .consent-logs-header { flex-direction: column; }
  .consent-logs-header .button { width: 100%; }
  .consent-log-detail dl { min-width: 220px; }
  .audit-header { flex-direction: column; }
  .audit-header .button { width: 100%; }
  .audit-detail dl { min-width: 220px; }
}