/* StreamAI reusable theme foundation. */
@font-face { font-family:"Roboto"; font-style:normal; font-weight:100 900; font-display:swap; src:url('./fonts/roboto-latin-ext.woff2') format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:"Roboto"; font-style:normal; font-weight:100 900; font-display:swap; src:url('./fonts/roboto-latin.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }

html[data-theme="classic-light"] { color-scheme:light; --surface-opaque:#f2f5f9; --surface-input:#ffffff; --surface-input-hover:#edf3fb; --surface-selected:#dbeafe; --text-primary:#16233a; --text-secondary:#5d6b80; --text-on-action:#ffffff; --border-subtle:#d6dfeb; --action-primary:#1769e0; --action-primary-hover:#1158bf; --action-soft:#e8f1ff; --status-positive:#14804a; --status-info:#0b78bd; --status-warning:#9a5a00; --status-critical:#c73d4b; --shadow-raised:0 8px 20px rgb(30 45 80 / .10),0 1px 3px rgb(30 45 80 / .06); --radius-sm:4px; --radius-md:6px; --type-size-current:14px; --type-weight-normal:400; --z-dropdown:20; --z-portal:40; --template-border-strong:#a9bdd6; --template-action-strong:#1769e0; --template-on-strong:#ffffff; --template-on-status:#ffffff; --template-soft-positive:#ddf3e7; --template-soft-warning:#fdf0d5; --template-soft-critical:#fbe3e6; --template-nav-bg:#12284a; --template-nav-raise:#1b3a63; --template-nav-line:#2f5583; --template-nav-fg:#ffffff; --template-nav-fg-muted:#c3d2e3; --template-nav-active-bg:#1769e0; --template-nav-active-fg:#ffffff; --template-hero-bg:#174a80; --template-hero-tile:#103866; --template-hero-line:#2f5f93; --template-hero-fg:#ffffff; --template-hero-fg-muted:#c3d2e3; --template-hero-accent:#6fdacb; --template-font:"Inter", "Roboto", Arial, sans-serif; --template-radius-xs:3px; --template-radius-lg:8px; --template-radius-button:4px; --template-radius-nav:4px; --template-card-line:var(--border-subtle); --template-elevation:none; --template-header-bg:var(--surface-input); --template-header-line:var(--border-subtle); }
html[data-theme="classic-dark"] { color-scheme:dark; --surface-opaque:#0f1722; --surface-input:#172231; --surface-input-hover:#1f2d40; --surface-selected:#1e3a5f; --text-primary:#e8eef6; --text-secondary:#9fb0c4; --text-on-action:#0f1722; --border-subtle:#2a3a50; --action-primary:#6aa8ff; --action-primary-hover:#93c0ff; --action-soft:#16304f; --status-positive:#79d7a0; --status-info:#8bb7ff; --status-warning:#f2c777; --status-critical:#ff9eaa; --shadow-raised:0 10px 24px rgb(0 0 0 / .30),0 2px 5px rgb(0 0 0 / .20); --radius-sm:4px; --radius-md:6px; --type-size-current:14px; --type-weight-normal:400; --z-dropdown:20; --z-portal:40; --template-border-strong:#41566f; --template-action-strong:#1f62c9; --template-on-strong:#ffffff; --template-on-status:#0f1722; --template-soft-positive:#173528; --template-soft-warning:#3a2e14; --template-soft-critical:#3d1c22; --template-nav-bg:#0a111b; --template-nav-raise:#16243a; --template-nav-line:#2a3a50; --template-nav-fg:#ffffff; --template-nav-fg-muted:#9fb0c4; --template-nav-active-bg:#1f62c9; --template-nav-active-fg:#ffffff; --template-hero-bg:#14335a; --template-hero-tile:#0e2644; --template-hero-line:#24476f; --template-hero-fg:#ffffff; --template-hero-fg-muted:#b3c4d8; --template-hero-accent:#6fdacb; --template-font:"Inter", "Roboto", Arial, sans-serif; --template-radius-xs:3px; --template-radius-lg:8px; --template-radius-button:4px; --template-radius-nav:4px; --template-card-line:var(--border-subtle); --template-elevation:none; --template-header-bg:var(--surface-input); --template-header-line:var(--border-subtle); }
html[data-theme="material-light"] { color-scheme:light; --surface-opaque:#f7f8ff; --surface-input:#ffffff; --surface-input-hover:#eef0fb; --surface-selected:#e3e8ff; --text-primary:#1a1b25; --text-secondary:#5f6274; --text-on-action:#ffffff; --border-subtle:#dce0f0; --action-primary:#4b5fc0; --action-primary-hover:#394ba5; --action-soft:#e9ebff; --status-positive:#14804a; --status-info:#0b78bd; --status-warning:#9a5a00; --status-critical:#c73d4b; --shadow-raised:0 8px 20px rgb(30 45 80 / .10),0 1px 3px rgb(30 45 80 / .06); --radius-sm:12px; --radius-md:16px; --type-size-current:14px; --type-weight-normal:400; --z-dropdown:20; --z-portal:40; --template-border-strong:#9aa0c4; --template-action-strong:#4b5fc0; --template-on-strong:#ffffff; --template-on-status:#ffffff; --template-soft-positive:#ddf3e7; --template-soft-warning:#fdf0d5; --template-soft-critical:#fbe3e6; --template-nav-bg:#eceefa; --template-nav-raise:#dfe2f5; --template-nav-line:#c7cbe6; --template-nav-fg:#1a1b25; --template-nav-fg-muted:#5f6274; --template-nav-active-bg:#d7dcff; --template-nav-active-fg:#17246b; --template-hero-bg:#dde1ff; --template-hero-tile:#f7f8ff; --template-hero-line:#c0c8f7; --template-hero-fg:#121c5c; --template-hero-fg-muted:#434a78; --template-hero-accent:#3a4bab; --template-font:"Roboto", Arial, sans-serif; --template-radius-xs:8px; --template-radius-lg:28px; --template-radius-button:999px; --template-radius-nav:999px; --template-card-line:transparent; --template-elevation:0 1px 2px rgb(0 0 0 / .10), 0 2px 6px 2px rgb(0 0 0 / .05); --template-header-bg:var(--surface-opaque); --template-header-line:transparent; }
html[data-theme="material-dark"],html:not([data-theme]) { color-scheme:dark; --surface-opaque:#121318; --surface-input:#1e1f27; --surface-input-hover:#292a33; --surface-selected:#3a4070; --text-primary:#e4e1ec; --text-secondary:#c6c5d0; --text-on-action:#121318; --border-subtle:#34353f; --action-primary:#b9c3ff; --action-primary-hover:#d4daff; --action-soft:#2f3768; --status-positive:#79d7a0; --status-info:#8bb7ff; --status-warning:#f2c777; --status-critical:#ff9eaa; --shadow-raised:0 10px 24px rgb(0 0 0 / .30),0 2px 5px rgb(0 0 0 / .20); --radius-sm:12px; --radius-md:16px; --type-size-current:14px; --type-weight-normal:400; --z-dropdown:20; --z-portal:40; --template-border-strong:#5b5d6e; --template-action-strong:#b9c3ff; --template-on-strong:#1a2463; --template-on-status:#121318; --template-soft-positive:#173528; --template-soft-warning:#3a2e14; --template-soft-critical:#3d1c22; --template-nav-bg:#1b1c24; --template-nav-raise:#2a2b35; --template-nav-line:#3a3b46; --template-nav-fg:#e4e1ec; --template-nav-fg-muted:#c6c5d0; --template-nav-active-bg:#3d4580; --template-nav-active-fg:#e0e2ff; --template-hero-bg:#2f3768; --template-hero-tile:#3d4580; --template-hero-line:#4c5596; --template-hero-fg:#e0e2ff; --template-hero-fg-muted:#c3c8f2; --template-hero-accent:#b9c3ff; --template-font:"Roboto", Arial, sans-serif; --template-radius-xs:8px; --template-radius-lg:28px; --template-radius-button:999px; --template-radius-nav:999px; --template-card-line:transparent; --template-elevation:0 1px 3px rgb(0 0 0 / .45); --template-header-bg:var(--surface-opaque); --template-header-line:transparent; }
html[data-theme="material-ocean"] { color-scheme:dark; --surface-opaque:#071a27; --surface-input:#102735; --surface-input-hover:#193846; --surface-selected:#215369; --text-primary:#e7f7fb; --text-secondary:#aec6cf; --text-on-action:#071a27; --border-subtle:#315363; --action-primary:#72d4e7; --action-primary-hover:#9ce9f4; --action-soft:#1b4757; --status-positive:#5bd7a1; --status-info:#62c8ff; --status-warning:#f4c36d; --status-critical:#ff98a3; --shadow-raised:0 10px 24px rgb(0 10 20 / .32),0 2px 5px rgb(0 10 20 / .20); --radius-sm:12px; --radius-md:16px; --type-size-current:14px; --type-weight-normal:400; --z-dropdown:20; --z-portal:40; --template-border-strong:#4d7383; --template-action-strong:#72d4e7; --template-on-strong:#06202e; --template-on-status:#071a27; --template-soft-positive:#0f3a2d; --template-soft-warning:#3a3016; --template-soft-critical:#3d1a24; --template-nav-bg:#0d2230; --template-nav-raise:#163646; --template-nav-line:#2b4d5c; --template-nav-fg:#e7f7fb; --template-nav-fg-muted:#aec6cf; --template-nav-active-bg:#1b4757; --template-nav-active-fg:#b8f0fb; --template-hero-bg:#1b4757; --template-hero-tile:#10303d; --template-hero-line:#2b5d70; --template-hero-fg:#e7f7fb; --template-hero-fg-muted:#aec6cf; --template-hero-accent:#72d4e7; --template-font:"Roboto", Arial, sans-serif; --template-radius-xs:8px; --template-radius-lg:28px; --template-radius-button:999px; --template-radius-nav:999px; --template-card-line:transparent; --template-elevation:0 1px 3px rgb(0 0 0 / .45); --template-header-bg:var(--surface-opaque); --template-header-line:transparent; }
html[data-theme="minimal-light"] { color-scheme:light; --surface-opaque:#fbfaf8; --surface-input:#fbfaf8; --surface-input-hover:#f3f1ec; --surface-selected:#ece8e0; --text-primary:#1c1a17; --text-secondary:#66615a; --text-on-action:#ffffff; --border-subtle:#e4e0d8; --action-primary:#0f5e5a; --action-primary-hover:#0a4643; --action-soft:#eef3f1; --status-positive:#14804a; --status-info:#0b78bd; --status-warning:#9a5a00; --status-critical:#c73d4b; --shadow-raised:0 6px 18px rgb(28 26 23 / .08),0 1px 2px rgb(28 26 23 / .05); --radius-sm:3px; --radius-md:4px; --type-size-current:14px; --type-weight-normal:400; --z-dropdown:20; --z-portal:40; --template-border-strong:#b9b3a8; --template-action-strong:#1c1a17; --template-on-strong:#fbfaf8; --template-on-status:#ffffff; --template-soft-positive:#ddf3e7; --template-soft-warning:#fdf0d5; --template-soft-critical:#fbe3e6; --template-nav-bg:#fbfaf8; --template-nav-raise:#f0ede7; --template-nav-line:#e4e0d8; --template-nav-fg:#1c1a17; --template-nav-fg-muted:#66615a; --template-nav-active-bg:#f0ede7; --template-nav-active-fg:#1c1a17; --template-hero-bg:transparent; --template-hero-tile:#f3f1ec; --template-hero-line:#b9b3a8; --template-hero-fg:#1c1a17; --template-hero-fg-muted:#66615a; --template-hero-accent:#0f5e5a; --template-font:"Inter", "Roboto", Arial, sans-serif; --template-font-heading:"Source Serif 4", Georgia, "Times New Roman", serif; --template-radius-xs:2px; --template-radius-lg:4px; --template-radius-button:2px; --template-radius-nav:2px; --template-card-line:var(--border-subtle); --template-elevation:none; --template-header-bg:var(--surface-opaque); --template-header-line:var(--border-subtle); }
html[data-theme="minimal-dark"] { color-scheme:dark; --surface-opaque:#141413; --surface-input:#141413; --surface-input-hover:#1d1c1a; --surface-selected:#2a2926; --text-primary:#ecebe6; --text-secondary:#a29f97; --text-on-action:#141413; --border-subtle:#2c2b28; --action-primary:#8fd1c9; --action-primary-hover:#b3e2dc; --action-soft:#1b2624; --status-positive:#79d7a0; --status-info:#8bb7ff; --status-warning:#f2c777; --status-critical:#ff9eaa; --shadow-raised:0 10px 24px rgb(0 0 0 / .30),0 2px 5px rgb(0 0 0 / .20); --radius-sm:3px; --radius-md:4px; --type-size-current:14px; --type-weight-normal:400; --z-dropdown:20; --z-portal:40; --template-border-strong:#4a4843; --template-action-strong:#ecebe6; --template-on-strong:#141413; --template-on-status:#141413; --template-soft-positive:#173528; --template-soft-warning:#3a2e14; --template-soft-critical:#3d1c22; --template-nav-bg:#141413; --template-nav-raise:#1f1e1c; --template-nav-line:#2c2b28; --template-nav-fg:#ecebe6; --template-nav-fg-muted:#a29f97; --template-nav-active-bg:#22211f; --template-nav-active-fg:#ffffff; --template-hero-bg:transparent; --template-hero-tile:#1d1c1a; --template-hero-line:#4a4843; --template-hero-fg:#ecebe6; --template-hero-fg-muted:#a29f97; --template-hero-accent:#8fd1c9; --template-font:"Inter", "Roboto", Arial, sans-serif; --template-font-heading:"Source Serif 4", Georgia, "Times New Roman", serif; --template-radius-xs:2px; --template-radius-lg:4px; --template-radius-button:2px; --template-radius-nav:2px; --template-card-line:var(--border-subtle); --template-elevation:none; --template-header-bg:var(--surface-opaque); --template-header-line:var(--border-subtle); }
html[data-theme="minimal-ocean"] { color-scheme:dark; --surface-opaque:#0d1a1f; --surface-input:#0d1a1f; --surface-input-hover:#132429; --surface-selected:#1c3239; --text-primary:#e6f0f2; --text-secondary:#9bb3ba; --text-on-action:#0d1a1f; --border-subtle:#21363e; --action-primary:#9fdad0; --action-primary-hover:#c0e9e2; --action-soft:#14292b; --status-positive:#5bd7a1; --status-info:#62c8ff; --status-warning:#f4c36d; --status-critical:#ff98a3; --shadow-raised:0 10px 24px rgb(0 10 20 / .32),0 2px 5px rgb(0 10 20 / .20); --radius-sm:3px; --radius-md:4px; --type-size-current:14px; --type-weight-normal:400; --z-dropdown:20; --z-portal:40; --template-border-strong:#3c5761; --template-action-strong:#e6f0f2; --template-on-strong:#0d1a1f; --template-on-status:#0d1a1f; --template-soft-positive:#0f3a2d; --template-soft-warning:#3a3016; --template-soft-critical:#3d1a24; --template-nav-bg:#0d1a1f; --template-nav-raise:#15272e; --template-nav-line:#21363e; --template-nav-fg:#e6f0f2; --template-nav-fg-muted:#9bb3ba; --template-nav-active-bg:#15272e; --template-nav-active-fg:#ffffff; --template-hero-bg:transparent; --template-hero-tile:#132429; --template-hero-line:#3c5761; --template-hero-fg:#e6f0f2; --template-hero-fg-muted:#9bb3ba; --template-hero-accent:#9fdad0; --template-font:"Inter", "Roboto", Arial, sans-serif; --template-font-heading:"Source Serif 4", Georgia, "Times New Roman", serif; --template-radius-xs:2px; --template-radius-lg:4px; --template-radius-button:2px; --template-radius-nav:2px; --template-card-line:var(--border-subtle); --template-elevation:none; --template-header-bg:var(--surface-opaque); --template-header-line:var(--border-subtle); }

html[data-theme="kontur-light"] { color-scheme:light; --surface-opaque:#f6f8fc; --surface-input:#ffffff; --surface-input-hover:#eef1f8; --surface-selected:#e3e7ff; --text-primary:#16233a; --text-secondary:#5b6478; --text-on-action:#ffffff; --border-subtle:#dbe1ec; --action-primary:#4b5fc0; --action-primary-hover:#394ba5; --action-soft:#e9ebff; --status-positive:#14804a; --status-info:#0b78bd; --status-warning:#9a5a00; --status-critical:#c73d4b; --shadow-raised:0 8px 20px rgb(30 45 80 / .10),0 1px 3px rgb(30 45 80 / .06); --radius-sm:8px; --radius-md:10px; --type-size-current:14px; --type-weight-normal:400; --z-dropdown:20; --z-portal:40; --template-border-strong:#a9b3c7; --template-action-strong:#e3e7ff; --template-on-strong:#2f3e9e; --template-on-status:#ffffff; --template-soft-positive:#ddf3e7; --template-soft-warning:#fdf0d5; --template-soft-critical:#fbe3e6; --template-nav-bg:#f6f8fc; --template-nav-raise:#eef1f8; --template-nav-line:#dbe1ec; --template-nav-fg:#16233a; --template-nav-fg-muted:#5b6478; --template-nav-active-bg:#e3e7ff; --template-nav-active-fg:#2f3e9e; --template-hero-bg:#ffffff; --template-hero-tile:#eef1f8; --template-hero-line:#dbe1ec; --template-hero-fg:#16233a; --template-hero-fg-muted:#5b6478; --template-hero-accent:#4b5fc0; --template-font:"Roboto", Arial, sans-serif; --template-radius-xs:6px; --template-radius-lg:14px; --template-radius-button:8px; --template-radius-nav:10px; --template-card-line:var(--border-subtle); --template-elevation:none; --template-header-bg:var(--surface-opaque); --template-header-line:var(--border-subtle); --template-grad-hero:linear-gradient(110deg,#dfe4ff 0%,#eef1ff 40%,#ffffff 72%); --template-grad-action:none; --template-grad-side:none; --template-grad-nav:none; }
html[data-theme="kontur-dark"] { color-scheme:dark; --surface-opaque:#1b1c26; --surface-input:#1f2130; --surface-input-hover:#272a3b; --surface-selected:#30365c; --text-primary:#f0f0fa; --text-secondary:#b4b7cc; --text-on-action:#12131c; --border-subtle:#363a4f; --action-primary:#aeb8ff; --action-primary-hover:#c7ceff; --action-soft:#2a2f52; --status-positive:#79d7a0; --status-info:#8bb7ff; --status-warning:#f2c777; --status-critical:#ff9eaa; --shadow-raised:0 10px 24px rgb(0 0 0 / .30),0 2px 5px rgb(0 0 0 / .20); --radius-sm:8px; --radius-md:10px; --type-size-current:14px; --type-weight-normal:400; --z-dropdown:20; --z-portal:40; --template-border-strong:#4d5270; --template-action-strong:#30365c; --template-on-strong:#c7ceff; --template-on-status:#12131c; --template-soft-positive:#173528; --template-soft-warning:#3a2e14; --template-soft-critical:#3d1c22; --template-nav-bg:#1b1c26; --template-nav-raise:#23253a; --template-nav-line:#363a4f; --template-nav-fg:#f0f0fa; --template-nav-fg-muted:#b4b7cc; --template-nav-active-bg:#30365c; --template-nav-active-fg:#c7ceff; --template-hero-bg:#1f2130; --template-hero-tile:#14151d; --template-hero-line:#363a4f; --template-hero-fg:#ffffff; --template-hero-fg-muted:#b4b7cc; --template-hero-accent:#aeb8ff; --template-font:"Roboto", Arial, sans-serif; --template-radius-xs:6px; --template-radius-lg:14px; --template-radius-button:8px; --template-radius-nav:10px; --template-card-line:var(--border-subtle); --template-elevation:none; --template-header-bg:var(--surface-opaque); --template-header-line:var(--border-subtle); --template-grad-hero:linear-gradient(110deg,#2f3566 0%,#262a45 40%,#1f2130 72%); --template-grad-action:none; --template-grad-side:none; --template-grad-nav:none; }
html[data-theme="kontur-ocean"] { color-scheme:dark; --surface-opaque:#071a27; --surface-input:#102735; --surface-input-hover:#193846; --surface-selected:#1b4757; --text-primary:#e7f7fb; --text-secondary:#aec6cf; --text-on-action:#071a27; --border-subtle:#315363; --action-primary:#72d4e7; --action-primary-hover:#9ce9f4; --action-soft:#14394a; --status-positive:#5bd7a1; --status-info:#62c8ff; --status-warning:#f4c36d; --status-critical:#ff98a3; --shadow-raised:0 10px 24px rgb(0 10 20 / .32),0 2px 5px rgb(0 10 20 / .20); --radius-sm:8px; --radius-md:10px; --type-size-current:14px; --type-weight-normal:400; --z-dropdown:20; --z-portal:40; --template-border-strong:#4d7383; --template-action-strong:#17495a; --template-on-strong:#a8ecf7; --template-on-status:#071a27; --template-soft-positive:#0f3a2d; --template-soft-warning:#3a3016; --template-soft-critical:#3d1a24; --template-nav-bg:#071a27; --template-nav-raise:#102735; --template-nav-line:#315363; --template-nav-fg:#e7f7fb; --template-nav-fg-muted:#aec6cf; --template-nav-active-bg:#17495a; --template-nav-active-fg:#a8ecf7; --template-hero-bg:#102735; --template-hero-tile:#0a1e2a; --template-hero-line:#315363; --template-hero-fg:#ffffff; --template-hero-fg-muted:#aec6cf; --template-hero-accent:#72d4e7; --template-font:"Roboto", Arial, sans-serif; --template-radius-xs:6px; --template-radius-lg:14px; --template-radius-button:8px; --template-radius-nav:10px; --template-card-line:var(--border-subtle); --template-elevation:none; --template-header-bg:var(--surface-opaque); --template-header-line:var(--border-subtle); --template-grad-hero:linear-gradient(110deg,#1a4a5c 0%,#14354a 40%,#102735 72%); --template-grad-action:none; --template-grad-side:none; --template-grad-nav:none; }

html[data-theme] { --template-icon:var(--action-primary); --template-nav-icon:var(--template-nav-fg-muted); }
html[data-theme="classic-light"] { --template-grad-hero:radial-gradient(520px circle at 92% -10%,rgb(111 218 203 / .45),transparent 60%),radial-gradient(420px circle at 10% 120%,rgb(31 116 232 / .55),transparent 60%),linear-gradient(135deg,#0d3263 0%,#174a80 50%,#1f74e8 100%); --template-grad-action:linear-gradient(135deg,#2a86ff,#0b4fb3); --template-grad-side:linear-gradient(180deg,#12284a 0%,#0b1a33 70%,#0d2a52 100%); --template-grad-nav:linear-gradient(135deg,#2a86ff,#0b4fb3); }
html[data-theme="classic-dark"] { --template-grad-hero:radial-gradient(520px circle at 92% -10%,rgb(111 218 203 / .30),transparent 60%),radial-gradient(420px circle at 10% 120%,rgb(42 114 219 / .55),transparent 60%),linear-gradient(135deg,#0c1b30 0%,#14335a 55%,#1f62c9 100%); --template-grad-action:linear-gradient(135deg,#3484f0,#1a56b0); --template-grad-side:linear-gradient(180deg,#0a111b 0%,#0d1828 100%); --template-grad-nav:linear-gradient(135deg,#3484f0,#1a56b0); }
html[data-theme="material-light"] { --template-grad-hero:radial-gradient(480px circle at 95% 0%,rgb(255 214 236 / .9),transparent 60%),radial-gradient(520px circle at 0% 100%,rgb(196 236 255 / .9),transparent 60%),linear-gradient(120deg,#dde1ff 0%,#e7dcff 100%); --template-grad-action:linear-gradient(120deg,#4b5fc0,#8a55cc); --template-grad-side:linear-gradient(180deg,#eceefa,#f3ecfb); --template-grad-nav:linear-gradient(120deg,#d7dcff,#eedcff); }
html[data-theme="material-dark"] { --template-grad-hero:radial-gradient(480px circle at 95% 0%,rgb(214 120 200 / .35),transparent 60%),radial-gradient(520px circle at 0% 100%,rgb(60 140 200 / .35),transparent 60%),linear-gradient(120deg,#2f3768 0%,#433a78 100%); --template-grad-action:linear-gradient(120deg,#b9c3ff,#e2c6ff); --template-grad-side:linear-gradient(180deg,#1b1c24,#1f1a2a); --template-grad-nav:linear-gradient(120deg,#3d4580,#55407f); }
html[data-theme="material-ocean"] { --template-grad-hero:radial-gradient(480px circle at 95% 0%,rgb(120 170 255 / .30),transparent 60%),radial-gradient(520px circle at 0% 100%,rgb(80 220 200 / .25),transparent 60%),linear-gradient(120deg,#1b4757 0%,#24466e 100%); --template-grad-action:linear-gradient(120deg,#72d4e7,#a9c4ff); --template-grad-side:linear-gradient(180deg,#0d2230,#0f2238); --template-grad-nav:linear-gradient(120deg,#1b4757,#23506e); }
html[data-theme="minimal-light"],html[data-theme="minimal-dark"],html[data-theme="minimal-ocean"] { --template-grad-hero:none; --template-grad-action:none; --template-grad-side:none; --template-grad-nav:none; }
html[data-template-gradient="off"] { --template-grad-hero:none; --template-grad-action:none; --template-grad-side:none; --template-grad-nav:none; }

.template-workspace { box-sizing:border-box; inline-size:100%; max-inline-size:100%; block-size:100%; min-block-size:0; padding:28px; overflow-x:hidden; overflow-y:auto; color:var(--text-primary); font-size:var(--type-size-current); scrollbar-color:var(--border-subtle) var(--surface-opaque); scrollbar-width:thin; }.template-workspace::-webkit-scrollbar { inline-size:12px; }.template-workspace::-webkit-scrollbar-track { background:var(--surface-opaque); }.template-workspace::-webkit-scrollbar-thumb { border:3px solid var(--surface-opaque); border-radius:999px; background:var(--border-subtle); }.template-workspace--dashboard { display:grid; align-content:start; gap:20px; }.template-dashboard-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-block:2px; }.template-dashboard-metric-card { padding:17px; border:1px solid var(--border-subtle); border-radius:var(--radius-md); background:var(--surface-input); box-shadow:var(--shadow-raised); }.template-dashboard-metric-card p { margin:0; }.template-dashboard-metric-card strong { display:block; margin-block:3px; font-size:25px; font-weight:720; letter-spacing:-.035em; }

footer:has(.template-footer) { border-block-start:1px solid var(--border-subtle); background:var(--surface-input); } [data-streamai-base] { display:block; min-block-size:100%; background:var(--surface-opaque); }
.template-brand,.template-footer,.template-workspace,[data-streamai-form-surface] { font-family:var(--template-font); }.template-brand { display:flex; align-items:center; min-inline-size:0; color:var(--text-primary); text-decoration:none; }.template-brand-mark { display:block; inline-size:34px; block-size:34px; flex:0 0 34px; background:var(--action-primary); mask:url('/Home/ProductLogo') center / contain no-repeat; -webkit-mask:url('/Home/ProductLogo') center / contain no-repeat; }.template-footer { padding:14px 20px; color:var(--text-secondary); font-size:13px; }[data-streamai-shell="header"] .template-header-actions { display:flex; flex-direction:row; align-items:center; gap:4px; }.template-header-action { display:grid; place-items:center; inline-size:38px; block-size:38px; flex:0 0 38px; padding:0; border:1px solid transparent; border-radius:var(--radius-sm); color:var(--text-secondary); background:transparent; cursor:pointer; }.template-header-action:hover { border-color:var(--border-subtle); color:var(--text-primary); background:var(--surface-input-hover); }.template-header-action svg { display:block; inline-size:19px; block-size:19px; }.template-map { inline-size:100%; min-block-size:320px; background:var(--surface-input); overflow:hidden; }

[data-streamai-form-surface] { --template-form-body-padding:28px; color:var(--text-primary); background:var(--surface-input); border:1px solid var(--border-subtle); border-radius:var(--radius-md); box-shadow:var(--shadow-raised); font-size:var(--type-size-current); line-height:1.5; } .template-form-density--compact { --template-form-body-padding:0px; } [data-streamai-form-surface] > header { display:flex; align-items:center; gap:12px; min-block-size:52px; padding:10px 16px; border-block-end:1px solid var(--border-subtle); } [data-streamai-form-surface] :is(h1,h2,h3,p) { color:inherit; } [data-streamai-form-surface] h1,[data-streamai-form-surface] h2 { margin:0; font-size:15px; font-weight:650; letter-spacing:-.01em; } [data-streamai-form-surface] > header > h1 { min-inline-size:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } [data-streamai-form-surface] > header > div { display:flex; align-items:center; gap:4px; margin-inline-start:auto; white-space:nowrap; }
[data-streamai-form-surface] :is(input,select,textarea,button:not(:where(.template-button))) { box-sizing:border-box; border:1px solid var(--border-subtle); border-radius:var(--radius-sm); color:var(--text-primary); background:var(--surface-input); font:inherit; } [data-streamai-form-surface] :is(input,select,textarea) { min-block-size:40px; padding:8px 11px; } [data-streamai-form-surface] :is(input,select,textarea):focus { border-color:var(--action-primary); outline:0; box-shadow:0 0 0 3px color-mix(in srgb,var(--action-primary) 16%,transparent); } [data-streamai-form-surface] button { min-block-size:36px; padding:7px 14px; cursor:pointer; font-size:13px; font-weight:650; } [data-streamai-form-surface] button:not(:where(.template-button)):hover { background:var(--surface-input-hover); } [data-streamai-form-surface] button[type="submit"] { border-color:var(--action-primary); color:var(--text-on-action); background:var(--action-primary); } [data-streamai-form-surface] button[type="submit"]:hover { background:var(--action-primary-hover); }
[data-streamai-form-surface] > header button { display:grid; place-items:center; inline-size:32px; block-size:32px; flex:0 0 32px; padding:0; } [data-streamai-form-surface] > header button svg { inline-size:18px; block-size:18px; } [data-streamai-form-surface] > div:first-of-type { flex:1 1 auto; min-block-size:0; overflow:auto; } [data-streamai-form-surface] > div:first-of-type > div { display:flex; flex-direction:column; gap:20px; padding:var(--template-form-body-padding); } [data-streamai-form-surface] [data-streamai-surface-layout="stack"],[data-streamai-form-surface] [data-streamai-surface-layout="section"] { gap:16px; } [data-streamai-form-surface] [data-streamai-surface-layout="row"] { gap:12px; } [data-streamai-form-surface] label { display:flex; flex-direction:column; gap:6px; min-inline-size:0; color:var(--text-secondary); font-size:13px; font-weight:550; } [data-streamai-form-surface] [data-streamai-surface-layout="row"] > label { flex:1 1 280px; } [data-streamai-form-surface] label:has(> input[type="checkbox"],> input[type="radio"]) { flex-direction:row; align-items:center; } [data-streamai-form-surface] :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea) { inline-size:100%; } [data-streamai-form-surface] :is(input[type="checkbox"],input[type="radio"]) { inline-size:18px; block-size:18px; margin:0; accent-color:var(--action-primary); } [data-streamai-form-surface] [data-surface-actions] { display:flex; flex-flow:row wrap; justify-content:flex-end; gap:10px; }
html[data-theme="dark"] [data-streamai-form-surface] > header { background:var(--surface-input-hover); }
#template-appearance-form label:has(> input[type="checkbox"]) { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px; }
#template-appearance-form input[type="checkbox"] { position:relative; appearance:none; box-sizing:border-box; inline-size:44px; min-inline-size:44px; block-size:24px; min-block-size:24px; padding:0; border:1px solid var(--template-border-strong); border-radius:999px; background:var(--surface-input-hover); box-shadow:inset 0 1px 2px rgb(0 0 0 / .12); cursor:pointer; transition:background-color .15s,border-color .15s; }
#template-appearance-form input[type="checkbox"]::before { content:""; position:absolute; inset-block-start:2px; inset-inline-start:2px; inline-size:18px; block-size:18px; border-radius:50%; background:var(--text-secondary); box-shadow:0 1px 2px rgb(0 0 0 / .24); transition:inset-inline-start .15s,background-color .15s; }
#template-appearance-form input[type="checkbox"]:checked { border-color:var(--action-primary); background:var(--action-primary); }
#template-appearance-form input[type="checkbox"]:checked::before { inset-inline-start:22px; background:var(--surface-input); }
#template-appearance-form input[type="checkbox"]:hover { border-color:var(--action-primary); }
#template-appearance-form input[type="checkbox"]:focus-visible { outline:2px solid var(--action-primary); outline-offset:2px; }


[data-streamai-shell="header"] { border-block-end:1px solid var(--template-header-line); background:var(--template-header-bg); font-family:var(--template-font); } [data-streamai-shell="ribbon"],[data-streamai-shell="side-navigation"] { border-color:var(--template-nav-line); background:var(--template-nav-bg); color:var(--template-nav-fg); font-family:var(--template-font); } [data-streamai-shell="side-navigation"] { border-inline-end:1px solid var(--template-nav-line); } [data-streamai-shell-navigation] { color:var(--text-primary); font-size:14px; } [data-streamai-shell-navigation] :is(a,button,summary,span[aria-disabled="true"]) { font:inherit; } [data-streamai-shell-navigation] :is(a,button,summary) { cursor:pointer; } [data-streamai-shell-navigation] a { color:inherit; text-decoration:none; }
[data-streamai-shell-navigation="side"] details > div { padding-inline-start:0; } [data-streamai-shell-navigation="side"] summary::after { content:"›"; margin-inline-start:auto; color:var(--text-secondary); font-size:1.25em; } [data-streamai-shell-navigation="side"] details[open] > summary::after { transform:rotate(90deg); }
[data-streamai-shell="side-navigation"] > button[aria-expanded] { display:grid; place-items:center; inline-size:32px; block-size:32px; padding:0; border:1px solid var(--border-subtle); border-radius:999px; color:var(--text-secondary); background:var(--surface-input); box-shadow:var(--shadow-raised); font-size:0; } [data-streamai-shell="side-navigation"] > button[aria-expanded]:hover { border-color:var(--action-primary); color:var(--text-primary); background:var(--surface-input-hover); } [data-streamai-shell="side-navigation"] > button[aria-expanded]::before { font-size:20px; font-weight:500; line-height:1; } [data-streamai-shell="side-navigation"] > button[aria-expanded="true"]::before { content:"‹"; } [data-streamai-shell="side-navigation"] > button[aria-expanded="false"]::before { content:"›"; }


/* Shared template UI primitives. */
.template-grid-icon-action { display:grid; place-items:center; inline-size:36px; block-size:36px; padding:0; border:1px solid var(--action-primary); border-radius:4px; color:var(--action-primary); background:var(--surface-input); }.template-grid-icon-action > span { display:block; inline-size:17px; block-size:17px; }.template-grid-icon-action svg { display:block; inline-size:100%; block-size:100%; }.template-grid-icon-action--delete { border-color:var(--action-primary); color:var(--action-primary); }.template-grid-icon-action:disabled { cursor:not-allowed; opacity:1; }.template-grid-toolbar { justify-content:flex-start !important; }.template-grid-row-actions { flex-wrap:nowrap !important; justify-content:flex-end; min-inline-size:84px !important; }.template-grid-row-actions { display:table-cell !important; white-space:nowrap; text-align:end; }.template-grid-row-actions .template-grid-icon-action { margin-inline-start:auto; }.template-grid-row-actions .template-grid-icon-action + .template-grid-icon-action { margin-block-start:4px; }.template-grid-actions-heading { inline-size:84px; }.template-client-grid th [data-template-icon] { display:none; flex:0 0 auto; inline-size:16px; block-size:16px; color:var(--text-secondary); }.template-client-grid th [data-template-icon] svg { display:block; inline-size:100%; block-size:100%; }.template-client-grid th button:not([data-streamai-grid-sort-direction]) [data-template-icon="sortNeutral"],.template-client-grid th button[data-streamai-grid-sort-direction="ascending"] [data-template-icon="sortAscending"],.template-client-grid th button[data-streamai-grid-sort-direction="descending"] [data-template-icon="sortDescending"] { display:block; }.template-client-grid th button[data-streamai-grid-sort-direction] [data-template-icon] { color:var(--action-primary); }
.template-button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-block-size:40px; padding:0 18px; border:1px solid transparent; border-radius:var(--template-radius-button); font:600 13px var(--template-font); text-decoration:none; cursor:pointer; transition:background-color .15s,border-color .15s,color .15s; }
.template-button svg { inline-size:16px; block-size:16px; flex:none; }
.template-button--primary { background:var(--template-action-strong); color:var(--template-on-strong); }
.template-button--primary:hover { filter:brightness(1.08); }
.template-button--tonal { background:var(--action-soft); color:var(--action-primary); }
.template-button--outline { background:transparent; border-color:var(--template-border-strong); color:var(--action-primary); }
.template-button--outline:hover,.template-button--text:hover { background:var(--surface-input-hover); }
.template-button--text { background:transparent; color:var(--action-primary); padding-inline:10px; }
.template-button--danger { background:var(--status-critical); color:var(--template-on-status); }
.template-button--on-hero { background:transparent; border-color:var(--template-hero-line); color:var(--template-hero-fg); }
.template-button--icon { inline-size:40px; padding:0; }
.template-button--small { min-block-size:32px; padding:0 12px; font-size:12px; }
.template-button--large { min-block-size:48px; padding:0 24px; font-size:15px; }
.template-button:disabled,.template-button[aria-disabled="true"] { opacity:.45; cursor:not-allowed; filter:none; }
.template-button:disabled { pointer-events:none; }
.template-button:focus-visible,.template-chip:focus-visible,.template-segmented button:focus-visible { outline:3px solid var(--action-primary); outline-offset:2px; }
.template-pill { display:inline-flex; align-items:center; gap:6px; min-block-size:24px; padding:0 10px; border-radius:999px; background:var(--surface-input-hover); color:var(--text-secondary); font-size:12px; font-weight:600; white-space:nowrap; }
.template-pill::before { content:""; inline-size:6px; block-size:6px; border-radius:50%; background:currentColor; }
.template-pill--positive { background:var(--template-soft-positive); color:var(--status-positive); }
.template-pill--warning { background:var(--template-soft-warning); color:var(--status-warning); }
.template-pill--critical { background:var(--template-soft-critical); color:var(--status-critical); }
.template-pill--info { background:var(--action-soft); color:var(--action-primary); }
.template-chip { display:inline-flex; align-items:center; gap:8px; min-block-size:36px; padding:0 14px; border:1px solid var(--template-border-strong); border-radius:var(--template-radius-button); background:var(--surface-input); color:var(--text-primary); font:600 13px var(--template-font); cursor:pointer; }
.template-chip[aria-pressed="true"] { border-color:var(--template-action-strong); background:var(--template-action-strong); color:var(--template-on-strong); }
.template-badge { display:inline-grid; place-items:center; min-inline-size:20px; block-size:20px; padding:0 6px; border-radius:999px; background:var(--status-critical); color:var(--template-on-status); font-size:11px; font-weight:700; }
.template-chip .template-badge { background:var(--surface-input-hover); color:var(--text-primary); }
.template-chip[aria-pressed="true"] .template-badge { background:color-mix(in srgb,var(--template-on-strong) 22%,transparent); color:var(--template-on-strong); }
.template-segmented { display:inline-flex; gap:4px; padding:4px; border:1px solid var(--template-border-strong); border-radius:var(--template-radius-button); background:var(--surface-input); }
.template-segmented button { display:inline-flex; align-items:center; gap:8px; min-block-size:36px; padding:0 16px; border:0; border-radius:var(--template-radius-button); background:transparent; color:var(--text-secondary); font:600 13px var(--template-font); cursor:pointer; }
.template-segmented button[aria-pressed="true"] { background:var(--template-action-strong); color:var(--template-on-strong); box-shadow:0 2px 6px rgb(0 0 0 / .18); }
.template-card-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; }
.template-card { display:grid; align-content:start; gap:8px; padding:20px; border:1px solid var(--template-card-line); border-radius:var(--radius-md); background:var(--surface-input); box-shadow:var(--template-elevation); color:var(--text-primary); text-decoration:none; }
.template-card:hover { border-color:var(--template-border-strong); }
.template-card-accent { inline-size:36px; block-size:4px; border-radius:2px; background:var(--template-action-strong); }
.template-card-accent--positive { background:var(--status-positive); } .template-card-accent--warning { background:var(--status-warning); } .template-card-accent--critical { background:var(--status-critical); }
.template-card-accent:not([class*="--"]) { background-image:var(--template-grad-action); }
.template-card-kicker { margin:6px 0 0; color:var(--text-secondary); font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.template-card h3 { margin:0; font-size:20px; letter-spacing:-.01em; }
.template-card p { margin:0; color:var(--text-secondary); font-size:13px; line-height:1.55; }
.template-grid-wrap { position:relative; min-inline-size:0; max-inline-size:100%; overflow-x:auto; border:1px solid var(--template-card-line); border-radius:var(--radius-md); background:var(--surface-input); box-shadow:var(--template-elevation); }
.template-grid { inline-size:100%; min-inline-size:640px; border-collapse:collapse; font-size:13px; }
.template-grid th { padding:12px 16px; border-block-end:1px solid var(--border-subtle); background:var(--surface-input-hover); color:var(--text-secondary); font-size:11px; font-weight:700; letter-spacing:.06em; text-align:start; text-transform:uppercase; }
.template-grid td { padding:12px 16px; border-block-end:1px solid var(--border-subtle); vertical-align:middle; }
.template-grid tbody tr:last-child td { border-block-end:0; }
.template-grid tbody tr:hover { background:var(--surface-input-hover); }
.template-grid tbody tr[aria-selected="true"] { background:var(--surface-selected); }
.template-grid-actions { display:flex; justify-content:flex-end; gap:4px; }
.template-grid-empty { padding:28px 16px; color:var(--text-secondary); text-align:center; }
.template-client-grid { border-color:var(--template-card-line); border-radius:var(--template-radius-lg); background:var(--surface-input); box-shadow:var(--template-elevation); }
.template-client-grid__filter { padding:12px; border-block-end-color:var(--template-card-line); background:var(--surface-input-hover); }
.template-client-grid__filter input { border-color:var(--template-border-strong); border-radius:var(--radius-sm); background:var(--surface-input); }
.template-client-grid__data th { border-block-end-color:var(--template-card-line); background:var(--surface-input-hover); color:var(--text-secondary); font-size:11px; letter-spacing:.06em; text-transform:uppercase; }
.template-client-grid__data td { border-block-end-color:var(--template-card-line); }
.template-client-grid__data tbody tr:hover { background:var(--surface-selected); }
.template-client-grid__row-action { border-color:var(--template-border-strong); border-radius:var(--radius-sm); color:var(--action-primary); background:var(--surface-input); }
.template-client-grid__row-action:hover:not(:disabled) { border-color:var(--action-primary); color:var(--text-on-action); background:var(--action-primary); }
.template-field-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; }
.template-field { display:grid; gap:6px; color:var(--text-secondary); font-size:13px; font-weight:600; }
.template-field :is(input,select,textarea) { inline-size:100%; min-block-size:40px; padding:8px 12px; border:1px solid var(--template-border-strong); border-radius:var(--radius-sm); background:var(--surface-input); color:var(--text-primary); font:400 14px var(--template-font); box-sizing:border-box; }
.template-field textarea { min-block-size:88px; resize:vertical; }
.template-field :is(input,select,textarea):focus { outline:none; border-color:var(--action-primary); box-shadow:0 0 0 3px var(--action-soft); }
.template-check { display:inline-flex; align-items:center; gap:8px; color:var(--text-primary); font-size:13px; }
.template-check input { inline-size:18px; block-size:18px; accent-color:var(--template-action-strong); }
.template-notice { display:flex; gap:12px; align-items:flex-start; padding:14px 16px; border-radius:var(--radius-md); background:var(--action-soft); color:var(--text-primary); font-size:13px; line-height:1.5; }
.template-notice--warning { background:var(--template-soft-warning); }
.template-notice--critical { background:var(--template-soft-critical); }
.template-notice strong { display:block; margin-block-end:2px; }
[data-template-icon] { display:inline-flex; inline-size:18px; block-size:18px; flex:none; }
[data-template-icon] svg { inline-size:100%; block-size:100%; }

.template-notice [data-template-icon] { margin-block-start:1px; color:var(--action-primary); }
.template-visually-hidden { position:absolute; inline-size:1px; block-size:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }

/* Classic top navigation: Shell creates nested Details elements for groups.
   Keep every menu level on the same compact row and size the icon wrapper. */
#workspace-top-navigation.streamai-navigation--top { display:flex; align-items:stretch; gap:0; color:var(--text-primary); font:14px var(--template-font); }
#workspace-top-navigation.streamai-navigation--top > details { position:relative; display:block; }
#workspace-top-navigation.streamai-navigation--top summary { list-style:none; cursor:pointer; }
#workspace-top-navigation.streamai-navigation--top summary::-webkit-details-marker { display:none; }
#workspace-top-navigation.streamai-navigation--top > details > summary { display:flex; align-items:center; min-block-size:56px; padding-inline:14px; }
#workspace-top-navigation.streamai-navigation--top > details > summary:hover,#workspace-top-navigation.streamai-navigation--top > details[open] > summary { color:var(--action-primary); background:var(--surface-input-hover); }
#workspace-top-navigation.streamai-navigation--top .streamai-navigation__menu-items,#workspace-top-navigation.streamai-navigation--top .streamai-navigation__submenu { display:grid; gap:2px; min-inline-size:230px; padding:6px; border:1px solid var(--border-subtle); border-radius:var(--radius-sm); background:var(--surface-input); box-shadow:var(--shadow-raised); }
#workspace-top-navigation.streamai-navigation--top > details > .streamai-navigation__menu-items { position:absolute; z-index:var(--z-portal); inset-block-start:calc(100% + 1px); inset-inline-start:0; }
#workspace-top-navigation.streamai-navigation--top .streamai-navigation__menu-branch { position:relative; }
#workspace-top-navigation.streamai-navigation--top .streamai-navigation__menu-branch > .streamai-navigation__submenu { position:absolute; z-index:calc(var(--z-portal) + 1); inset-block-start:-6px; inset-inline-start:calc(100% + 6px); }
#workspace-top-navigation.streamai-navigation--top .streamai-navigation__menu-branch > summary,#workspace-top-navigation.streamai-navigation--top .streamai-navigation__menu-item { display:flex; align-items:center; gap:9px; min-block-size:34px; padding:7px 10px; border-radius:var(--radius-sm); color:inherit; font:inherit; text-decoration:none; }
#workspace-top-navigation.streamai-navigation--top .streamai-navigation__menu-branch > summary:hover,#workspace-top-navigation.streamai-navigation--top .streamai-navigation__menu-item:hover { background:var(--surface-input-hover); }
#workspace-top-navigation.streamai-navigation--top .streamai-navigation__icon { display:inline-grid; place-items:center; inline-size:18px; block-size:18px; flex:0 0 18px; overflow:hidden; }
#workspace-top-navigation.streamai-navigation--top .streamai-navigation__icon > svg { display:block; inline-size:18px; block-size:18px; width:18px; height:18px; max-inline-size:18px; max-block-size:18px; }
#workspace-top-navigation.streamai-navigation--top .streamai-navigation__submenu-arrow { margin-inline-start:auto; }

/* Ribbon navigation. */
#workspace-top-navigation.streamai-navigation--ribbon-tabs { display:flex; align-items:stretch; min-inline-size:0; color:var(--template-nav-fg); font:14px var(--template-font); }
#workspace-top-navigation.streamai-navigation--ribbon-tabs .streamai-navigation__tabs { display:flex; min-inline-size:0; overflow-x:auto; }
#workspace-top-navigation.streamai-navigation--ribbon-tabs .streamai-navigation__tab { display:inline-flex; align-items:center; gap:8px; min-block-size:56px; padding:9px 16px; border:0; border-inline-end:1px solid var(--border-subtle); color:var(--text-secondary); background:var(--surface-input); font:inherit; cursor:pointer; white-space:nowrap; }
#workspace-top-navigation.streamai-navigation--ribbon-tabs .streamai-navigation__tab[aria-selected="true"] { color:var(--text-on-action); background:var(--action-primary); }
#workspace-ribbon-navigation.streamai-navigation--ribbon { color:var(--template-nav-fg); font:14px var(--template-font); }
#workspace-ribbon-navigation .streamai-navigation__ribbon-sections { display:flex; min-block-size:126px; overflow-x:auto; border:1px solid var(--border-subtle); border-radius:var(--radius-sm); background:var(--surface-input); }
#workspace-ribbon-navigation .streamai-navigation__ribbon-section { display:grid; grid-template-rows:minmax(0,1fr) auto; flex:0 0 auto; min-inline-size:176px; border-inline-end:1px solid var(--border-subtle); }
#workspace-ribbon-navigation .streamai-navigation__ribbon-section-items { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(10rem,max-content); grid-template-rows:repeat(var(--streamai-ribbon-rows,3),minmax(2.4rem,auto)); align-content:start; gap:4px; padding:10px; }
#workspace-ribbon-navigation .streamai-navigation__ribbon-item { display:inline-flex; align-items:center; gap:7px; min-inline-size:0; padding:6px 10px; border-radius:var(--radius-sm); color:inherit; font:inherit; text-decoration:none; }
#workspace-ribbon-navigation .streamai-navigation__ribbon-item:hover { background:var(--surface-input-hover); }
#workspace-ribbon-navigation .streamai-navigation__ribbon-section-label { margin:0; padding:7px 10px; border-block-start:1px solid var(--border-subtle); color:var(--text-secondary); font:inherit; font-weight:600; text-align:center; }
#workspace-top-navigation.streamai-navigation--ribbon-tabs .streamai-navigation__icon,#workspace-ribbon-navigation .streamai-navigation__icon { display:inline-grid; place-items:center; inline-size:18px; block-size:18px; flex:0 0 18px; overflow:hidden; }
#workspace-top-navigation.streamai-navigation--ribbon-tabs .streamai-navigation__icon > svg,#workspace-ribbon-navigation .streamai-navigation__icon > svg { display:block; inline-size:18px; block-size:18px; width:18px; height:18px; }

/* Side navigation. */
#workspace-side-navigation.streamai-navigation--side { color:var(--template-nav-fg); font:14px var(--template-font); }
#workspace-side-navigation .streamai-navigation__side-rail-item { display:grid; place-items:center; inline-size:40px; block-size:40px; padding:0; border:0; border-radius:var(--radius-sm); color:var(--text-secondary); background:transparent; cursor:pointer; }
#workspace-side-navigation .streamai-navigation__side-rail-item:hover,#workspace-side-navigation .streamai-navigation__side-rail-item[aria-selected="true"] { color:var(--text-primary); background:var(--surface-input-hover); }
#workspace-side-navigation .streamai-navigation__side-rail-item[aria-selected="true"] { box-shadow:inset 3px 0 0 var(--action-primary); }
#workspace-side-navigation .streamai-navigation__side-panel { display:grid; gap:8px; min-inline-size:0; }
#workspace-side-navigation .streamai-navigation__side-panel > h2 { margin:0; padding:8px 10px; color:var(--text-secondary); font:inherit; font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
#workspace-side-navigation .streamai-navigation__side-panel-items,#workspace-side-navigation .streamai-navigation__branch-items { display:grid; gap:4px; }
#workspace-side-navigation .streamai-navigation__branch { display:grid; gap:3px; }
#workspace-side-navigation .streamai-navigation__branch > summary,#workspace-side-navigation .streamai-navigation__item { display:flex; align-items:center; gap:8px; min-block-size:40px; padding-inline:10px; border-radius:var(--radius-sm); color:inherit; font:inherit; text-decoration:none; list-style:none; }
#workspace-side-navigation .streamai-navigation__branch > summary::-webkit-details-marker { display:none; }
#workspace-side-navigation .streamai-navigation__branch > summary::after { content:"›"; margin-inline-start:auto; color:var(--text-secondary); font-size:1.25em; }
#workspace-side-navigation .streamai-navigation__branch[open] > summary::after { transform:rotate(90deg); }
#workspace-side-navigation .streamai-navigation__branch > summary:hover,#workspace-side-navigation .streamai-navigation__item:hover { background:var(--surface-input-hover); }
#workspace-side-navigation .streamai-navigation__item[aria-current="page"] { border-inline-start:3px solid var(--action-primary); background:var(--surface-selected); color:var(--text-primary); }
#workspace-side-navigation .streamai-navigation__branch-items { padding-inline-start:12px; }
#workspace-side-navigation .streamai-navigation__icon { display:inline-grid; place-items:center; inline-size:18px; block-size:18px; flex:0 0 18px; overflow:hidden; }
#workspace-side-navigation .streamai-navigation__icon > svg { display:block; inline-size:18px; block-size:18px; width:18px; height:18px; }
@media (max-width:767px) {
  #workspace-side-navigation.streamai-navigation--side { display:grid; grid-template-columns:minmax(0,1fr) !important; grid-auto-flow:row; align-content:start; gap:4px; block-size:100%; overflow-y:auto; }
  #workspace-side-navigation.streamai-navigation--side > .streamai-navigation__branch { grid-column:1; min-inline-size:0; }
  #workspace-side-navigation.streamai-navigation--side > .streamai-navigation__branch > summary { min-block-size:48px; }
}
#template-settings-menu[data-streamai-form-surface] [data-surface-actions] { display:grid; grid-template-columns:1fr; gap:8px; }
#template-settings-menu[data-streamai-form-surface] [data-surface-actions] button { justify-content:flex-start; min-block-size:44px; padding-inline:16px; }
[data-streamai-form-surface].template-settings-menu > div:first-of-type { overflow:hidden; }
#template-units-form label { display:grid; grid-template-columns:minmax(150px,.65fr) minmax(0,1.35fr); align-items:center; gap:20px; }
#template-units-form label > span { color:var(--text-secondary); }
#template-units-form [data-streamai-surface-layout="section"] { padding:18px; border:1px solid var(--border-subtle); border-radius:var(--radius-sm); background:var(--surface-opaque); }
#template-units-form [data-streamai-surface-layout="section"] > h2 { color:var(--text-primary); }
@media (max-width:520px) { #template-units-form label { grid-template-columns:1fr; gap:6px; } }

/* Shared map layout and toolboxes. Product controls are supplied by the host. */
[data-streamai-form-surface] > div:first-of-type > div:has(.template-cesium-map) { block-size:100%; min-block-size:0; padding:0; }
[data-streamai-form-surface] [data-streamai-surface-layout="stack"]:has(.template-cesium-map) { flex:1 1 auto; min-block-size:0; }
.template-cesium-map { position:relative; isolation:isolate; display:flex; flex:1 1 auto; inline-size:100%; block-size:100%; min-block-size:320px; overflow:hidden; background:var(--surface-input); }
[data-streamai-form-surface] > div:first-of-type:has(.template-cesium-map) { overflow:hidden; }
[data-streamai-form-surface] > div:first-of-type > div > div:has(.template-cesium-map) { display:flex; flex:1 1 auto; min-block-size:0; }
[data-streamai-form-surface] .template-cesium-map { min-block-size:0; }
.template-cesium-map__canvas { flex:1 1 auto; min-inline-size:0; min-block-size:0; }
.template-map-toolbox-right,.template-map-actions-toolbox,.template-map-toolbox-left,.template-workspace-layer-toolbox,.template-workspace-toolbox,.template-workspace-center-toolbox { position:absolute; z-index:2; inset-inline-end:16px; display:flex; flex-direction:column; align-items:flex-end; gap:8px; }
.template-map-menu-toolbox { position:absolute; z-index:4; display:flex; flex-direction:column; min-inline-size:176px; padding:6px; border:1px solid color-mix(in srgb,var(--border-subtle) 72%,transparent); border-radius:var(--radius-md); background:color-mix(in srgb,var(--surface-opaque) 92%,transparent); box-shadow:var(--shadow-raised); backdrop-filter:blur(12px); }
.template-map-menu-toolbox[hidden] { display:none; }
.template-map-menu-toolbox button { display:grid; grid-template-columns:20px minmax(0,1fr); align-items:center; gap:10px; min-block-size:38px; padding:8px 10px; border:0; border-radius:var(--radius-sm); color:var(--text-primary); background:transparent; font:600 13px/1.2 "Roboto",Arial,sans-serif; text-align:start; cursor:pointer; }
.template-map-menu-toolbox button:hover,.template-map-menu-toolbox button:focus-visible { background:var(--surface-input-hover); outline:0; }
.template-map-menu-toolbox button svg { inline-size:19px; block-size:19px; color:var(--action-primary); }
.template-map-menu-toolbox__label { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.template-workspace-toolbox { inset-inline-start:16px; inset-inline-end:auto; inset-block-start:16px; flex-direction:row; align-items:center; }
.template-workspace-center-toolbox { inset-inline-start:50%; inset-inline-end:auto; inset-block-start:16px; max-inline-size:calc(100% - 32px); flex-direction:row; flex-wrap:wrap; justify-content:center; align-items:center; transform:translateX(-50%); }
[dir="rtl"] .template-workspace-center-toolbox { transform:translateX(50%); }
@media(max-width:700px){.template-workspace-center-toolbox{inset-inline-end:auto;inset-block-start:10px;gap:6px;max-inline-size:calc(100% - 20px)}}
.template-map-toolbox-right { inset-block-end:32px; }
.template-map-info-toolboxes { position:absolute; z-index:2; inset-inline:16px; inset-block-end:7px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:center; gap:12px; pointer-events:none; }
.template-map-info-toolbox-left,.template-map-info-toolbox-center,.template-map-info-toolbox-right { grid-row:1; min-inline-size:0; min-block-size:14px; overflow:hidden; box-sizing:border-box; color:var(--text-primary); font:600 10px/1.2 "Roboto",Arial,sans-serif; text-shadow:0 1px 3px rgb(0 0 0 / .55); text-overflow:ellipsis; white-space:nowrap; }
.template-map-info-toolbox-left { grid-column:1; text-align:start; }
.template-map-info-toolbox-center { grid-column:2; text-align:center; }
.template-map-info-toolbox-right { grid-column:3; text-align:end; }
.template-map-info-toolboxes:has(> .template-map-info-toolbox-center[hidden]) { grid-template-columns:minmax(0,1fr) minmax(0,max-content); }
.template-map-info-toolboxes:has(> .template-map-info-toolbox-center[hidden]) > .template-map-info-toolbox-right { grid-column:2; }
.template-workspace-toolbox[hidden],.template-workspace-center-toolbox[hidden],.template-workspace-layer-toolbox[hidden],.template-map-actions-toolbox[hidden],.template-map-toolbox-left[hidden],.template-map-toolbox-right[hidden],.template-map-info-toolbox-left[hidden],.template-map-info-toolbox-center[hidden],.template-map-info-toolbox-right[hidden],.template-map-menu-toolbox[hidden] { display:none; }
@media(max-width:700px){.template-map-info-toolboxes{inset-inline:10px;inset-block-end:4px;gap:8px}.template-map-info-toolbox-left,.template-map-info-toolbox-center,.template-map-info-toolbox-right{min-block-size:12px;font-size:9px}}
.template-map-point-tools [data-streamai-surface-layout="stack"] { gap:16px; padding:16px; }
.template-map-point-tools [data-streamai-surface-layout="stack"] > label { display:grid; grid-template-columns:82px minmax(0,1fr); align-items:center; gap:10px; min-block-size:40px; color:var(--text-secondary); }
.template-map-point-tools [data-streamai-surface-layout="stack"] > label > span { font-size:13px; font-weight:700; }
.template-map-point-tools [data-streamai-surface-layout="stack"] > label > input { min-inline-size:0; min-block-size:40px; padding:7px 10px; color:var(--text-primary); font-size:14px; font-weight:650; }
.template-map-point-tools [data-streamai-surface-layout="stack"] > label:has(input[type="number"]) { margin-block-start:4px; padding-block-start:16px; border-block-start:1px solid var(--border-subtle); }
.template-map-line-profile [data-streamai-surface-layout="stack"] { gap:8px; padding:0; }
.template-map-line-profile__chart { display:block; inline-size:min(100%,600px); block-size:auto; margin-inline:auto; }
.template-map-line-profile__selected-elevation { min-block-size:20px; color:var(--text-secondary); font-size:13px; font-weight:700; text-align:center; }
@media(max-width:700px){.template-map-point-tools [data-streamai-surface-layout="stack"]{padding:12px}.template-map-point-tools [data-streamai-surface-layout="stack"]>label{grid-template-columns:72px minmax(0,1fr);gap:8px}}
.template-map-actions-toolbox { inset-block-start:16px; }
.template-map-toolbox-left { inset-inline-start:16px; inset-inline-end:auto; inset-block-end:32px; align-items:flex-start; }
.template-map-toolbox-left__actions { display:flex; flex-direction:column; gap:8px; }
.template-map-toolbox-left__actions[hidden] { display:none; }
.template-map-attributions__content { padding:16px 20px; }
.template-map-view-settings.template-map-view-settings { inline-size:min(320px,calc(100vw - 32px))!important; min-inline-size:min(320px,calc(100vw - 32px))!important; block-size:auto!important; max-block-size:calc(100dvh - 32px); }
.template-map-view-settings__controls { display:flex!important; flex-direction:column!important; gap:0; padding:0 14px; }
.template-map-view-settings label { display:grid!important; grid-template-columns:minmax(0,1fr) 112px!important; flex-direction:row!important; align-items:center; gap:8px; min-block-size:36px; padding:3px 0; border-block-end:1px solid var(--border-subtle); color:var(--text-primary); }
.template-map-view-settings label span { color:var(--text-secondary); font-size:13px; font-weight:650; }
.template-map-view-settings :is(select,input[type="datetime-local"],input[type="number"]) { box-sizing:border-box; inline-size:100%; min-block-size:28px; padding:2px 6px; border:1px solid var(--border-subtle); border-radius:6px; color:var(--text-primary); background:var(--surface-input); font:inherit; font-size:12px; }
@media(max-width:767px){.template-map-view-settings.template-map-view-settings{inset-inline-start:50%!important;inset-inline-end:auto!important;inset-block-start:50%!important;inset-block-end:auto!important;inline-size:min(320px,calc(100vw - 32px))!important;block-size:auto!important;max-block-size:calc(100dvh - 32px)!important;transform:translate(-50%,-50%)!important}.template-map-view-settings__scroll{flex:0 1 auto!important}}@media(max-width:360px){.template-map-view-settings label{grid-template-columns:minmax(0,1fr) 104px!important;gap:6px}}
.template-workspace-layer-toolbox { inset-block-start:16px; inset-inline-end:66px; flex-direction:row-reverse; align-items:flex-start; }
.template-workspace-layer-toolbox__group { position:relative; }
.template-map-toolbox-right button,.template-map-actions-toolbox button,.template-map-toolbox-left button,.template-workspace-layer-toolbox button,.template-workspace-toolbox button,.template-workspace-center-toolbox button { border:1px solid color-mix(in srgb,var(--border-subtle) 62%,transparent); border-radius:var(--radius-sm); color:var(--text-primary); background:color-mix(in srgb,var(--surface-opaque) 30%,transparent); box-shadow:none; backdrop-filter:none; cursor:pointer; font:600 13px/1 "Roboto",Arial,sans-serif; opacity:1; transition:opacity .16s ease,background .16s ease,border-color .16s ease; }
.template-map-toolbox-right button,.template-map-actions-toolbox button,.template-map-toolbox-left button,.template-workspace-layer-toolbox button,.template-workspace-toolbox button,.template-workspace-center-toolbox button { display:grid; place-items:center; inline-size:42px; block-size:42px; padding:0; }
.template-map-toolbox-right button[hidden],.template-map-actions-toolbox button[hidden],.template-map-toolbox-left button[hidden],.template-workspace-layer-toolbox button[hidden],.template-workspace-toolbox button[hidden],.template-workspace-center-toolbox button[hidden] { display:none; }
.template-map-toolbox-right button svg,.template-map-actions-toolbox button svg,.template-map-toolbox-left button svg,.template-workspace-layer-toolbox button svg,.template-workspace-toolbox button svg,.template-workspace-center-toolbox button svg { inline-size:20px; block-size:20px; }
.template-map-toolbox-right button:hover,.template-map-toolbox-right button:focus-visible,.template-map-toolbox-right button[aria-pressed="true"],.template-map-actions-toolbox button:hover,.template-map-actions-toolbox button:focus-visible,.template-map-actions-toolbox button[aria-pressed="true"],.template-map-toolbox-left button:hover,.template-map-toolbox-left button:focus-visible,.template-map-toolbox-left button[aria-pressed="true"],.template-workspace-layer-toolbox button:hover,.template-workspace-layer-toolbox button:focus-visible,.template-workspace-layer-toolbox button[aria-pressed="true"],.template-workspace-toolbox button:hover,.template-workspace-center-toolbox button:hover,.template-workspace-toolbox button:focus-visible,.template-workspace-center-toolbox button:focus-visible,.template-workspace-toolbox button[aria-pressed="true"],.template-workspace-center-toolbox button[aria-pressed="true"] { border-color:var(--action-primary); background:color-mix(in srgb,var(--surface-input) 88%,transparent); opacity:1; outline:0; }
.template-map-toolbox-right__modes { position:absolute; inset-inline-end:calc(100% + 8px); inset-block-end:50px; display:flex; gap:8px; }
.template-map-toolbox-right__modes[hidden] { display:none; }
.template-map-toolbox-right__view-tools { display:flex; flex-direction:column; gap:8px; }
.template-workspace-layer-toolbox__layers { position:absolute; inset-inline-start:50%; inset-block-start:calc(100% + 8px); display:flex; flex-direction:column; gap:8px; transform:translateX(-50%); }
.template-workspace-layer-toolbox__layers--base-maps { inset-inline-start:50%; inset-inline-end:auto; transform:translateX(-50%); display:grid; grid-template-columns:repeat(3,auto); }
[dir="rtl"] :is(.template-workspace-layer-toolbox__layers--base-maps,.template-workspace-center-toolbox .template-workspace-layer-toolbox__layers) { transform:translateX(50%); }
.template-workspace-layer-toolbox__layers--base-maps [data-map-terrain="turkey"] { grid-column:1; }
:is(.template-workspace-layer-toolbox,.template-map-toolbox-right,.template-map-toolbox-left) button:has(>.template-workspace-layer-toolbox__label) { box-sizing:border-box; inline-size:42px; block-size:42px; align-content:center; gap:2px; padding:2px 1px; }
.template-workspace-layer-toolbox__label { max-inline-size:100%; color:inherit; font:500 8px/1.15 "Roboto",Arial,sans-serif; text-align:center; white-space:nowrap; }
@media(max-width:700px){:is(.template-workspace-layer-toolbox,.template-map-toolbox-right,.template-map-toolbox-left) button:has(>.template-workspace-layer-toolbox__label){inline-size:38px;block-size:38px;gap:1px}}
.template-workspace-layer-toolbox__layers[hidden] { display:none; }
.template-workspace-layer-toolbox__layers:not([hidden])::before { position:absolute; inset-inline-start:50%; inset-block-start:-7px; inline-size:0; block-size:0; border-inline:7px solid transparent; border-block-end:7px solid color-mix(in srgb,var(--surface-opaque) 92%,transparent); content:""; transform:translateX(-50%); }
:is(.template-workspace-layer-toolbox,.template-workspace-center-toolbox) [data-map-workspace-group][aria-expanded="true"] { border-color:var(--action-primary); background:color-mix(in srgb,var(--surface-input) 88%,transparent); }
@media(max-width:700px){.template-map-toolbox-right,.template-map-actions-toolbox,.template-map-toolbox-left,.template-workspace-layer-toolbox,.template-workspace-toolbox{inset-inline-end:10px;gap:6px}.template-map-toolbox-right{inset-block-end:28px}.template-map-toolbox-left{inset-inline-start:10px;inset-inline-end:auto;inset-block-end:28px}.template-map-actions-toolbox{inset-block-start:10px}.template-workspace-layer-toolbox{inset-block-start:10px;inset-inline-end:54px}.template-workspace-toolbox{inset-inline-start:10px;inset-inline-end:auto;inset-block-start:10px}.template-map-toolbox-right__modes{inset-inline-end:calc(100% + 6px);inset-block-end:44px;gap:6px}.template-map-toolbox-right__view-tools{gap:6px}.template-workspace-layer-toolbox__layers{gap:6px}.template-map-toolbox-right button,.template-map-actions-toolbox button,.template-map-toolbox-left button,.template-workspace-layer-toolbox button,.template-workspace-toolbox button,.template-workspace-center-toolbox button{inline-size:38px;block-size:38px}.template-map-toolbox-right button svg,.template-map-actions-toolbox button svg,.template-map-toolbox-left button svg,.template-workspace-layer-toolbox button svg,.template-workspace-toolbox button svg,.template-workspace-center-toolbox button svg{inline-size:18px;block-size:18px}}
:is(.template-workspace-layer-toolbox,.template-workspace-center-toolbox) [data-map-workspace-group][aria-expanded="true"] { border-color:var(--action-primary); background:color-mix(in srgb,var(--surface-input) 88%,transparent); }
.template-workspace-layer-toolbox__layers:not([hidden])::before { position:absolute; inset-inline-start:50%; inset-block-start:-7px; inline-size:0; block-size:0; border-inline:7px solid transparent; border-block-end:7px solid color-mix(in srgb,var(--surface-opaque) 92%,transparent); content:""; transform:translateX(-50%); }
.template-workspace-layer-toolbox__layers--base-maps [data-map-terrain="turkey"] { grid-column:1; }

/* Shared client grid: table, card, report, filters and settings. */
.template-client-grid__error{margin:auto;padding:16px;color:var(--status-critical);font-size:14px;font-weight:600;text-align:center}
.template-client-grid__data .template-client-grid__actions-cell{position:sticky;inset-inline-end:0;z-index:1;background:var(--surface-input);box-shadow:-1px 0 var(--border-subtle)}
.template-client-grid__data thead tr:first-child th.template-client-grid__actions-header{inset-inline-end:0;z-index:3}
.template-client-grid__data tbody tr:hover .template-client-grid__actions-cell{background:var(--surface-input-hover)}





.template-client-grid{display:grid;grid-template-rows:auto minmax(0,1fr) auto;block-size:100%;min-block-size:220px;border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--surface-input);color:var(--text-primary);font:var(--type-size-current)/1.45 "Roboto",Arial,sans-serif}.template-client-grid__filter{position:sticky;inset-block-start:0;z-index:3;flex:0 0 auto;padding:10px;border-block-end:1px solid var(--border-subtle);background:var(--surface-opaque)}.template-client-grid__filter input{box-sizing:border-box;inline-size:100%;min-block-size:36px;padding:7px 10px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);color:var(--text-primary);background:var(--surface-input);font:inherit}.template-client-grid__filter input:focus{border-color:var(--action-primary);outline:0;box-shadow:0 0 0 3px color-mix(in srgb,var(--action-primary) 16%,transparent)}.template-client-grid__column-filters{display:grid;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:8px}.template-client-grid__data{min-inline-size:0;min-block-size:0;overflow:auto}.template-client-grid__data table{inline-size:100%;table-layout:auto;border-collapse:collapse}.template-client-grid__data td:not(.template-client-grid__actions-cell){max-inline-size:0}.template-client-grid__data :is(th,td){padding:10px 12px;border-block-end:1px solid var(--border-subtle);text-align:start;vertical-align:top;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.template-client-grid__data th{background:var(--surface-opaque);color:var(--text-secondary);font-size:12px;font-weight:700}.template-client-grid__data tbody tr:hover{background:var(--surface-input-hover)}.template-client-grid__empty{text-align:center!important;color:var(--text-secondary)}.template-client-grid__toolbox{position:sticky;inset-block-end:0;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 10px;border-block-start:1px solid var(--border-subtle);background:var(--surface-opaque)}.template-client-grid__toolbox button,.template-client-grid__toolbox select{box-sizing:border-box;min-block-size:34px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);color:var(--text-primary);background:var(--surface-input);font:inherit}.template-client-grid__toolbox button{padding:5px 9px;cursor:pointer}.template-client-grid__toolbox button:hover:not(:disabled){border-color:var(--action-primary);background:var(--surface-input-hover)}.template-client-grid__toolbox button:disabled{opacity:.48;cursor:not-allowed}.template-client-grid__settings{display:grid;place-items:center;inline-size:34px;padding:0!important}.template-client-grid__settings svg{inline-size:18px;block-size:18px}.template-client-grid__pagination{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:6px}.template-client-grid__pagination label{display:flex;align-items:center;gap:6px;color:var(--text-secondary);font-size:12px;font-weight:650}.template-client-grid__pagination select{padding:4px 6px}@media(max-width:700px){.template-client-grid__toolbox{align-items:flex-start;flex-direction:column}.template-client-grid__pagination{justify-content:flex-start}.template-client-grid__data :is(th,td){padding:9px 10px}.template-client-grid__pagination span{inline-size:100%;order:-1}}
.template-client-grid-stack,.template-client-grid-host,.template-client-grid-host [data-streamai-client-grid-host]{display:flex;flex:1 1 0;min-inline-size:0;min-block-size:0}.template-client-grid-host .template-client-grid{inline-size:100%;min-inline-size:0;min-block-size:0}
[data-streamai-form-surface]:has(.template-client-grid-stack--flush){--template-form-body-padding:0px}.template-client-grid-stack--flush{box-sizing:border-box;align-self:stretch;margin:0!important;padding:0!important;inline-size:100%!important;block-size:100%!important;min-inline-size:0;gap:0!important}
.template-client-grid__data thead tr:first-child th{position:sticky;inset-block-start:0;z-index:2}.template-client-grid__data thead tr:nth-child(2) th{position:sticky;inset-block-start:57px;z-index:1}
.template-client-grid__data th.template-client-grid__filter-column{padding:8px}.template-client-grid__header-filter{box-sizing:border-box;inline-size:100%;min-block-size:36px;padding:7px 10px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);color:var(--text-primary);background:var(--surface-input);font:inherit}.template-client-grid__header-filter:focus{border-color:var(--action-primary);outline:0;box-shadow:0 0 0 3px color-mix(in srgb,var(--action-primary) 16%,transparent)}
.template-client-grid{box-sizing:border-box;display:flex;flex-direction:column;block-size:var(--template-client-grid-block-size,100%);min-block-size:0;overflow:hidden}.template-client-grid__filter,.template-client-grid__toolbox{flex:0 0 auto}.template-client-grid__toolbox{position:static}.template-client-grid__data{flex:1 1 0;block-size:0;min-block-size:0;overflow-y:auto}
.template-client-grid[data-density="compact"] .template-client-grid__data :is(th,td){padding-block:6px}.template-client-grid[data-density="spacious"] .template-client-grid__data :is(th,td){padding-block:16px}.template-client-grid[data-wrap="true"] .template-client-grid__data td{white-space:normal;overflow-wrap:anywhere}.template-client-grid__cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:12px;padding:12px}.template-client-grid__cards article{display:grid;gap:8px;padding:14px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--surface-input)}.template-client-grid__cards article div{display:grid;gap:2px}.template-client-grid__cards span{color:var(--text-secondary);font-size:12px}.template-client-grid__cards strong{font-weight:600;overflow-wrap:anywhere}.template-client-grid__settings-dialog{inline-size:min(680px,calc(100vw - 32px));max-block-size:calc(100dvh - 32px);padding:0;border:1px solid var(--border-subtle);border-radius:var(--radius-md);color:var(--text-primary);background:var(--surface-opaque);box-shadow:var(--shadow-raised)}.template-client-grid__settings-dialog::backdrop{background:rgb(0 0 0 / .46)}.template-client-grid__settings-dialog form{display:grid;gap:16px;padding:20px;overflow:auto}.template-client-grid__settings-dialog h2{margin:0;font-size:18px}.template-client-grid__settings-dialog fieldset{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:9px;margin:0;padding:12px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm)}.template-client-grid__settings-dialog legend{padding-inline:5px;color:var(--text-secondary);font-weight:650}.template-client-grid__settings-dialog label{display:flex;align-items:center;gap:8px;min-inline-size:0}.template-client-grid__settings-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.template-client-grid__settings-actions button{min-block-size:36px;padding:7px 12px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);color:var(--text-primary);background:var(--surface-input);font:inherit;cursor:pointer}.template-client-grid__settings-actions button:last-child{border-color:var(--action-primary);background:var(--action-primary);color:var(--text-on-action)}
.template-client-grid__settings-dialog{inline-size:min(540px,calc(100vw - 24px););border-radius:16px}.template-client-grid__settings-dialog form{gap:12px;padding:16px}.template-client-grid__settings-dialog h2{font-size:16px;letter-spacing:-.01em}.template-client-grid__settings-dialog fieldset{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:9px 10px 10px}.template-client-grid__settings-dialog legend{font-size:12px}.template-client-grid__settings-dialog label{min-block-size:32px;padding:6px 8px;border:1px solid transparent;border-radius:7px;color:var(--text-secondary);font-size:13px;cursor:pointer}.template-client-grid__settings-dialog label:hover{background:var(--surface-input-hover);color:var(--text-primary)}.template-client-grid__settings-dialog label:has(input:checked){border-color:color-mix(in srgb,var(--action-primary) 60%,var(--border-subtle));color:var(--text-primary);background:color-mix(in srgb,var(--action-primary) 12%,var(--surface-input))}.template-client-grid__settings-dialog input{accent-color:var(--action-primary)}.template-client-grid__settings-dialog fieldset:last-of-type{grid-template-columns:repeat(3,minmax(0,1fr));max-block-size:184px;overflow:auto}.template-client-grid__settings-actions{padding-block-start:10px;border-block-start:1px solid var(--border-subtle)}.template-client-grid__settings-actions button{min-block-size:32px;padding:5px 10px;font-size:13px}.template-client-grid__settings-actions button:first-child{margin-inline-end:auto}@media(max-width:520px){.template-client-grid__settings-dialog fieldset:last-of-type{grid-template-columns:repeat(2,minmax(0,1fr))}.template-client-grid__settings-actions button:first-child{margin-inline-end:0}.template-client-grid__settings-actions{justify-content:stretch}.template-client-grid__settings-actions button{flex:1 1 auto}}
.template-client-grid__settings-dialog{inline-size:min(540px,calc(100vw - 24px))}
.template-client-grid__settings-selects{grid-template-columns:repeat(2,minmax(0,1fr))}
.template-client-grid__settings-selects{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:520px){.template-client-grid__settings-selects{grid-template-columns:repeat(2,minmax(0,1fr))}}
.template-client-grid__settings-selects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.template-client-grid__settings-select{display:grid;gap:4px;padding:0!important;border:0!important;color:var(--text-secondary)!important;font-size:12px!important}.template-client-grid__settings-select select{box-sizing:border-box;inline-size:100%;min-block-size:34px;padding:5px 8px;border:1px solid var(--border-subtle);border-radius:7px;color:var(--text-primary);background:var(--surface-input);font:inherit}.template-client-grid__settings-toggle{min-block-size:34px!important;padding:6px 8px!important;border:1px solid var(--border-subtle)!important;color:var(--text-primary)!important;background:var(--surface-input)}@media(max-width:520px){.template-client-grid__settings-selects{grid-template-columns:1fr}}
.template-client-grid__settings-selects{grid-template-columns:repeat(4,minmax(0,1fr))}@media(max-width:520px){.template-client-grid__settings-selects{grid-template-columns:repeat(2,minmax(0,1fr))}}
.template-client-grid-host [data-streamai-client-grid-host]>.template-client-grid,.template-client-grid-host [data-streamai-client-grid-host]>.template-client-grid__loading{flex:1 1 0;inline-size:100%;min-inline-size:0}
.template-client-grid__settings-actions button:first-child{margin-inline-end:0}.template-client-grid__settings-actions button:nth-child(2){margin-inline-end:auto}@media(max-width:520px){.template-client-grid__settings-actions button:nth-child(2){margin-inline-end:0}}
.template-client-grid__filter{display:flex;align-items:center;gap:8px}.template-client-grid__filter>input,.template-client-grid__column-filters{flex:1 1 0;min-inline-size:0}.template-client-grid__header-filter-row{display:flex;align-items:center;gap:6px}.template-client-grid__header-filter-row .template-client-grid__header-filter{flex:1 1 0;min-inline-size:0}.template-client-grid__filter .template-client-grid__settings,.template-client-grid__header-filter-row .template-client-grid__settings{display:grid;place-items:center;flex:0 0 36px;inline-size:36px;block-size:36px;padding:0;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);color:var(--text-primary);background:var(--surface-input);cursor:pointer}.template-client-grid__filter .template-client-grid__settings:hover,.template-client-grid__header-filter-row .template-client-grid__settings:hover{border-color:var(--action-primary);background:var(--surface-input-hover)}
.template-client-grid__filter[hidden]{display:none!important}
.template-client-grid .template-client-grid__row-action--icon{display:grid;place-items:center;inline-size:30px;min-inline-size:30px;block-size:30px;min-block-size:30px;padding:0}
.template-client-grid__sort{display:inline-flex;align-items:center;gap:5px;max-inline-size:100%;padding:0;border:0;color:inherit;background:transparent;font:inherit;font-weight:inherit;text-align:inherit;cursor:pointer}.template-client-grid__sort:hover{color:var(--text-primary)}.template-client-grid__sort svg{flex:0 0 16px;inline-size:16px;block-size:16px}.template-client-grid__header-filter-row{display:flex;align-items:center;gap:6px}.template-client-grid__header-filter-control{position:relative;flex:1 1 0;min-inline-size:0}.template-client-grid__header-filter-control .template-client-grid__header-filter{padding-inline-end:30px}.template-client-grid__sort--icon{position:absolute;inset-block-start:50%;inset-inline-end:4px;display:grid;place-items:center;inline-size:24px;block-size:24px;max-inline-size:none;padding:0;border:0!important;border-radius:0!important;outline:0!important;box-shadow:none!important;appearance:none;color:var(--text-secondary);background:transparent!important;transform:translateY(-50%)}.template-client-grid__sort--icon svg{inline-size:16px;block-size:16px}.template-client-grid__sort--icon:hover{color:var(--text-primary)}.template-client-grid__sort--icon:focus-visible{outline:2px solid var(--action-primary)!important;outline-offset:1px!important;border-radius:3px!important}
@media(max-width:600px){.template-client-grid{min-block-size:0}.template-client-grid__filter{padding:8px}.template-client-grid__filter input{min-block-size:34px}.template-client-grid__cards{grid-template-columns:1fr;gap:8px;padding:8px}.template-client-grid__cards article{gap:7px;padding:12px}.template-client-grid__cards article div{grid-template-columns:minmax(110px,42%) minmax(0,1fr);align-items:baseline;gap:10px}.template-client-grid__cards strong{text-align:end}.template-client-grid__card-actions{justify-content:stretch}.template-client-grid__card-actions .template-client-grid__row-action{flex:1 1 auto;min-inline-size:0}.template-client-grid__settings-dialog{inline-size:calc(100vw - 16px)}}
.template-client-grid__settings-selects{grid-template-columns:1fr}
.template-client-grid__settings-dialog{inline-size:min(360px,calc(100vw - 24px))!important;width:min(360px,calc(100vw - 24px))!important;block-size:fit-content!important;height:auto!important;min-block-size:0!important;min-height:0!important;max-inline-size:calc(100vw - 24px);max-width:calc(100vw - 24px)}.template-client-grid__settings-dialog form{gap:10px;padding:12px}.template-client-grid__settings-dialog h2{font-size:16px}.template-client-grid__settings-selects{display:flex!important;flex-direction:column;align-items:flex-start;gap:6px}.template-client-grid__settings-dialog .template-client-grid__settings-select{display:flex!important;align-items:center;inline-size:300px;max-inline-size:100%;min-block-size:32px;margin:0;padding:0!important;border:0!important;background:transparent!important}.template-client-grid__settings-label{flex:0 0 92px!important;min-block-size:0!important;padding:0!important;border:0!important;border-radius:0!important;color:var(--text-secondary)!important;background:transparent!important;font-size:13px!important;cursor:default!important}.template-client-grid__settings-select select{flex:1 1 0;min-inline-size:0;inline-size:auto;min-block-size:32px;padding:3px 7px}.template-client-grid__settings-actions{gap:6px;padding-block-start:8px}.template-client-grid__settings-actions button{min-block-size:30px;padding:4px 8px;font-size:13px}@media(max-width:360px){.template-client-grid__settings-dialog .template-client-grid__settings-select{align-items:stretch;flex-direction:column;inline-size:100%;gap:3px}.template-client-grid__settings-label{flex-basis:auto!important}.template-client-grid__settings-select select{inline-size:100%}}
.template-client-grid__settings-dialog .template-client-grid__settings-actions{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:8px;margin:0;padding-block-start:10px;border-block-start:1px solid var(--border-subtle)}.template-client-grid__settings-dialog .template-client-grid__settings-actions button{display:grid;place-items:center;inline-size:32px;min-inline-size:32px;block-size:32px;min-block-size:32px;margin:0;padding:0;border:1px solid var(--border-subtle);border-radius:7px;color:var(--text-primary);background:var(--surface-input);cursor:pointer}.template-client-grid__settings-dialog .template-client-grid__settings-actions button:first-child{justify-self:start}.template-client-grid__settings-dialog .template-client-grid__settings-actions button:hover{border-color:var(--action-primary);background:var(--surface-input-hover)}.template-client-grid__settings-dialog .template-client-grid__settings-actions button:last-child{border-color:var(--action-primary);background:var(--action-primary);color:var(--text-on-action)}.template-client-grid__settings-dialog .template-client-grid__settings-actions svg{inline-size:16px;block-size:16px}
.template-client-grid{position:relative;min-inline-size:0}.template-client-grid__settings-panel{position:absolute;inset:0;z-index:5;display:grid;place-items:center;padding:12px;background:rgb(0 0 0 / .42)}.template-client-grid__settings-panel[hidden]{display:none}.template-client-grid__settings-panel form{box-sizing:border-box;display:grid;gap:10px;inline-size:min(360px,100%);margin:0;padding:14px;border:1px solid var(--border-subtle);border-radius:12px;color:var(--text-primary);background:var(--surface-opaque);box-shadow:var(--shadow-raised)}.template-client-grid__settings-panel h2{margin:0;font-size:16px}.template-client-grid__settings-panel .template-client-grid__settings-selects{display:grid!important;grid-template-columns:1fr;gap:7px}.template-client-grid__settings-panel .template-client-grid__settings-select{display:grid!important;grid-template-columns:92px minmax(0,1fr);align-items:center;gap:8px;min-block-size:32px;margin:0;padding:0!important;border:0!important;background:transparent!important}.template-client-grid__settings-panel .template-client-grid__settings-label{min-block-size:0!important;padding:0!important;border:0!important;border-radius:0!important;color:var(--text-secondary)!important;background:transparent!important;font-size:13px!important;cursor:default!important}.template-client-grid__settings-panel select{box-sizing:border-box;inline-size:100%;min-block-size:32px;padding:3px 7px;border:1px solid var(--border-subtle);border-radius:7px;color:var(--text-primary);background:var(--surface-input);font:inherit}.template-client-grid__settings-panel .template-client-grid__settings-actions{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:7px;margin:0;padding-block-start:10px;border-block-start:1px solid var(--border-subtle)}.template-client-grid__settings-panel .template-client-grid__settings-actions button{display:grid;place-items:center;inline-size:32px;block-size:32px;margin:0;padding:0;border:1px solid var(--border-subtle);border-radius:7px;color:var(--text-primary);background:var(--surface-input);cursor:pointer}.template-client-grid__settings-panel .template-client-grid__settings-actions button:first-child{justify-self:start}.template-client-grid__settings-panel .template-client-grid__settings-actions button:hover{border-color:var(--action-primary);background:var(--surface-input-hover)}.template-client-grid__settings-panel .template-client-grid__settings-actions button:last-child{border-color:var(--action-primary);background:var(--action-primary);color:var(--text-on-action)}.template-client-grid__settings-panel .template-client-grid__settings-actions svg{inline-size:16px;block-size:16px}@media(max-width:360px){.template-client-grid__settings-panel .template-client-grid__settings-select{grid-template-columns:1fr;gap:3px}}
.template-client-grid__actions-header,.template-client-grid__actions-cell{box-sizing:border-box;inline-size:calc(var(--template-client-grid-actions-width,36px) + 16px);min-inline-size:calc(var(--template-client-grid-actions-width,36px) + 16px);padding-inline:8px!important;white-space:nowrap;text-align:center!important}.template-client-grid__actions-header .template-client-grid__settings{display:grid;place-items:center;inline-size:36px;block-size:36px;margin:auto;padding:0;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);color:var(--text-primary);background:var(--surface-input);cursor:pointer}.template-client-grid__actions-header .template-client-grid__settings:hover{border-color:var(--action-primary);background:var(--surface-input-hover)}.template-client-grid__row-action{display:inline-grid;place-items:center;min-inline-size:30px;block-size:30px;margin-inline-start:5px;padding:0 8px;border:1px solid var(--border-subtle);border-radius:7px;color:var(--text-primary);background:var(--surface-input);font:inherit;cursor:pointer}.template-client-grid__row-action--icon{inline-size:30px;padding:0}.template-client-grid__actions-cell .template-client-grid__row-action--icon{display:inline-grid}.template-client-grid__row-action:first-child{margin-inline-start:0}.template-client-grid__row-action svg{inline-size:16px;block-size:16px}.template-client-grid__row-action:hover:not(:disabled){border-color:var(--action-primary);background:var(--surface-input-hover)}.template-client-grid__row-action:disabled{opacity:.48;cursor:not-allowed}.template-client-grid__card-actions{display:flex!important;flex-wrap:wrap;gap:6px;padding-block-start:8px;border-block-start:1px solid var(--border-subtle)}.template-client-grid__card-actions .template-client-grid__row-action{margin:0}
.template-client-grid__data{position:relative}.template-client-grid__loading{display:grid;place-items:center;min-block-size:180px;color:var(--text-secondary);font:inherit}.template-client-grid__loading--overlay{position:absolute;z-index:4;inset:0;min-block-size:0;background:color-mix(in srgb,var(--surface-opaque) 88%,transparent)}.template-client-grid__loading-indicator{inline-size:22px;block-size:22px;border:2px solid var(--border-subtle);border-inline-start-color:var(--action-primary);border-radius:50%;animation:template-client-grid-spin .7s linear infinite}
.template-client-grid__value{display:inline-flex;align-items:center;gap:8px;max-inline-size:100%;min-inline-size:0;padding:0;border:0;background:transparent;color:inherit;font:inherit;text-align:start}
button.template-client-grid__value{cursor:pointer;font-weight:600}
.template-client-grid__value svg{flex:0 0 19px;inline-size:19px;block-size:19px;color:var(--action-primary)}
.template-client-grid__value>span{min-inline-size:0;overflow-wrap:anywhere}
.template-client-grid [data-template-client-grid-row][data-selected=true]{background:var(--action-soft);box-shadow:inset 3px 0 var(--action-primary)}.template-client-grid__pagination{display:flex;align-items:center;justify-content:center;gap:12px;padding:6px}.template-client-grid:has(>.template-client-grid__pagination){grid-template-rows:auto minmax(0,1fr) auto}.template-client-grid__pagination button{min-block-size:36px;padding:6px 12px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--surface-input);color:var(--text-primary);font:inherit}.template-client-grid__pagination button:disabled{opacity:.5;cursor:not-allowed}
.template-client-grid__status{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:12px;padding:20px;white-space:normal;text-align:center;color:var(--text-secondary);font-size:13px;line-height:1.5}
.template-client-grid__status[role=alert]{color:var(--status-critical)}
.template-client-grid__report{display:grid;gap:16px;padding:16px;min-inline-size:0}
.template-client-grid__export{position:relative;justify-self:start}
.template-client-grid__export-menu{position:absolute;z-index:2;inset-block-start:calc(100% + 5px);inset-inline-start:0;display:grid;min-inline-size:96px;padding:4px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--surface-opaque);box-shadow:var(--shadow-raised)}
.template-client-grid__export-menu[hidden]{display:none}
.template-client-grid__settings-panel .template-client-grid__settings-actions .template-client-grid__export-menu button{justify-self:stretch;inline-size:100%;block-size:auto;min-block-size:32px;padding:6px 12px;border:0;border-radius:var(--radius-sm);background:transparent;color:var(--text-primary);text-align:start;font:inherit}
.template-client-grid__settings-panel .template-client-grid__settings-actions .template-client-grid__export-menu button:hover,.template-client-grid__settings-panel .template-client-grid__settings-actions .template-client-grid__export-menu button:focus-visible{color:var(--text-primary);background:var(--surface-input-hover)}
.template-client-grid[hidden]{display:none}
[data-template-client-grid-stack]{display:flex;flex:1 1 0;flex-direction:column;min-inline-size:0;min-block-size:0}
[data-streamai-form-surface]:has([data-template-client-grid-stack]){--template-form-body-padding:0px}
.template-client-grid__detail{display:flex;flex:1 1 0;min-inline-size:0;min-block-size:0;block-size:100%}
.template-client-grid__detail>.template-client-grid{flex:1;min-inline-size:0}
.template-client-grid__navigation{display:flex;align-items:center;gap:12px;padding:10px;border-block-end:1px solid var(--border-subtle);min-inline-size:0}
.template-client-grid__navigation strong{overflow-wrap:anywhere;min-inline-size:0}
.template-client-grid__navigation button{flex:none;min-block-size:36px;padding:6px 12px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);color:var(--text-primary);background:var(--surface-input);font:inherit;cursor:pointer}
.template-client-grid__json{color:var(--action-primary);text-decoration:underline;text-underline-offset:3px}
.template-client-grid__object-detail{padding:16px;min-inline-size:0}
.template-client-grid__object-detail dl{display:grid;gap:12px;margin:0}
.template-client-grid__object-detail dl>div{display:grid;grid-template-columns:minmax(100px,1fr) minmax(0,3fr);gap:12px;padding-block-end:10px;border-block-end:1px solid var(--border-subtle)}
.template-client-grid__object-detail dt{color:var(--text-secondary);font-weight:600;overflow-wrap:anywhere}
.template-client-grid__object-detail dd{margin:0;min-inline-size:0;white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:600px){.template-client-grid__object-detail dl>div{grid-template-columns:minmax(0,1fr);gap:4px}}
.template-client-grid[data-view=report] .template-client-grid__column-filters{grid-auto-flow:row;grid-template-columns:repeat(auto-fit,minmax(min(140px,100%),1fr))}
.template-client-grid__report-record{min-inline-size:0;padding:20px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--surface-input);break-inside:avoid}
.template-client-grid__report dl{display:grid;gap:12px;margin:0;min-inline-size:0}
.template-client-grid__report dl>div{display:grid;grid-template-columns:minmax(100px,1fr) minmax(0,3fr);gap:12px;min-inline-size:0;padding-block-end:10px;border-block-end:1px solid var(--border-subtle)}
.template-client-grid__report dt{color:var(--text-secondary);font-weight:600;overflow-wrap:anywhere}
.template-client-grid__report dl>div.template-client-grid__report-json-field{grid-template-columns:minmax(0,1fr)}
.template-client-grid__report-json-field>dd{grid-column:1/-1}
.template-client-grid__report dd{margin:0;min-inline-size:0;white-space:pre-wrap;overflow-wrap:anywhere}
.template-client-grid__report-value{min-inline-size:0;white-space:pre-wrap;overflow-wrap:anywhere}
.template-client-grid__report-group{min-inline-size:0;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);overflow:hidden}
.template-client-grid__report-group>summary{padding:10px 12px;background:var(--surface-input-hover);color:var(--text-primary);font-weight:600;cursor:pointer;overflow-wrap:anywhere;white-space:normal}
.template-client-grid__report-group>summary:focus-visible{outline:2px solid var(--action-primary);outline-offset:-2px}
.template-client-grid__report-group[open]>summary{border-block-end:1px solid var(--border-subtle)}
.template-client-grid__report-group>dl,.template-client-grid__report-entries{padding:12px}
.template-client-grid__report-entries{display:grid;gap:10px;min-inline-size:0}
.template-client-grid[data-density=compact] .template-client-grid__report-record{padding:12px}
.template-client-grid[data-density=spacious] .template-client-grid__report-record{padding:28px}
@media(max-width:600px){.template-client-grid__report{padding:10px;gap:10px}.template-client-grid__report dl>div{grid-template-columns:minmax(0,1fr);gap:4px}.template-client-grid__report-record{padding:12px}}
@media print{.template-client-grid[data-view=report]{block-size:auto;overflow:visible}.template-client-grid[data-view=report]>.template-client-grid__data{block-size:auto;overflow:visible;flex:auto}.template-client-grid[data-view=report]>:is(.template-client-grid__filter,.template-client-grid__pagination,.template-client-grid__settings-panel),.template-client-grid__report .template-client-grid__card-actions{display:none}.template-client-grid__report{padding:0}.template-client-grid__report-record{color:#000;background:#fff}}
.template-client-grid__status button{min-block-size:36px;padding:6px 14px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--surface-input);color:var(--text-primary);font:inherit;cursor:pointer}
.template-client-grid__card-headings{display:flex;flex-wrap:wrap;gap:8px 16px;padding:12px;border-block-end:1px solid var(--border-subtle);font-size:12px;font-weight:600;color:var(--text-secondary)}