/* Trol central theme engine: built 2026-06-16T06:15:37+00:00 */

/* --- engine layer: trol-theme-core.css --- */
/**
 * Trol theme core: shared invariants (@layer trol.core).
 * Import at top of theme-tokens.css / theme-wood.css in each app.
 * Shell-specific rules stay in app theme-tokens until a later pass.
 */
@layer trol.core, trol.shell, trol.app;

@layer trol.core {
  --trol-shell-backdrop-z: 0;
  --trol-content-z: 1;

  /* Busy organic skins: hard opacity cap (AA legibility). */
  html[data-trol-texture-busy="1"] {
    --trol-skin-opacity-cap: 0.34;
  }

  /* v213 invariant (Contactrol): wood cabinet ::before never zeroed when a non-wood skin is active. */
  html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .ctx-shell::before,
  html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .ctx-shell::before {
    content: "" !important;
    display: block !important;
    background-image: var(--et-wood-bezel-layer, var(--et-woodgrain-layer)) !important;
    opacity: var(--et-wood-bezel-opacity, var(--et-woodgrain-opacity, 0.72)) !important;
  }

  /* v213 invariant (Emailtrol mail): native wood ::before always on; skin stacks ::after. */
  html[data-et-app="mail"][data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .et-shell.et-mail-shell::before,
  html[data-et-app="mail"][data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .et-shell.et-mail-shell::before {
    content: "" !important;
    display: block !important;
    background-image: var(--et-wood-bezel-layer, var(--et-woodgrain-layer)) !important;
    opacity: var(--et-wood-bezel-opacity, var(--et-woodgrain-opacity, 0.72)) !important;
  }
}


/* --- engine layer: theme-tokens.css --- */
/**
 * Emailtrol: UI palettes copied from Jobtrol theme-tokens (standalone).
 * dark / sage / dusk / steelers = dark bases; cream / fog / light + sports = mostly light.
 */
@import url("trol-theme-core.css");
html[data-ui-theme="dark"] {
  color-scheme: dark;
  /* Neutral charcoal: no green or blue cast (vs Sage / Dusk) */
  --jt-bg-page: #1c1c1c;
  --jt-bg-elevated: #222222;
  --jt-bg-sidebar: #181818;
  --jt-bg-topbar: #181818;
  --jt-bg-card: #262626;
  --jt-bg-input: #1a1a1a;
  --jt-bg-table-head: #1a1a1a;
  --jt-bg-hover: #252525;
  --jt-bg-row-hover: #222;
  --jt-border: #333;
  --jt-border-soft: #2a2a2a;
  --jt-text: #eaeaea;
  --jt-text-muted: #b4b4b4;
  --jt-text-faint: #8e8e8e;
  --jt-text-heading: #e8eaed;
  --jt-link: #58a6ff;
  --jt-link-hover: #79b8ff;
  --jt-scroll-track: #1a1a1a;
  --jt-scroll-thumb1: #2a4a35;
  --jt-scroll-thumb2: #1e3528;
  --jt-badge-green-bg: #0d2e1a;
  --jt-badge-red-bg: #2e0d0d;
  --jt-badge-yellow-bg: #2e2a0d;
  --jt-badge-gray-bg: #252525;
  --jt-badge-blue-bg: #0d1e2e;
  --jt-badge-orange-bg: #2e1e0d;
  /* Profile pin grid / reorder chips (soft charcoal, not pure black) */
  --jt-pin-bg: #242424;
  --jt-pin-border: #383838;
  --jt-pin-hover-bg: #2c2c2c;
  --jt-pin-on-surface: #c8c8c8;
  --jt-pin-muted: rgba(255, 255, 255, 0.28);
  --jt-pin-checked-bg: #0d2818;
  --jt-pin-checked-label: #3fb950;
  --jt-pin-drag-bg: #0f2a16;
}

/* Soothing dark: forest sage (strong green cast; unmistakable vs neutral dark & dusk) */
html[data-ui-theme="sage"] {
  color-scheme: dark;
  --jt-bg-page: #0a1410;
  --jt-bg-elevated: #122219;
  --jt-bg-sidebar: #071510;
  --jt-bg-topbar: #071510;
  --jt-bg-card: #1a3328;
  --jt-bg-input: #142820;
  --jt-bg-table-head: #163024;
  --jt-bg-hover: #2a4a3a;
  --jt-bg-row-hover: #234236;
  --jt-border: #3d6b52;
  --jt-border-soft: #2d5240;
  --jt-text: #e5f2ea;
  --jt-text-muted: #8ec4a8;
  --jt-text-faint: #64a482;
  --jt-text-heading: #e9f2ed;
  --jt-link: #7dd6a8;
  --jt-link-hover: #b8f0d0;
  --jt-scroll-track: #152118;
  --jt-scroll-thumb1: #5a9070;
  --jt-scroll-thumb2: #3d664a;
  --jt-badge-green-bg: #153528;
  --jt-badge-red-bg: #331f1c;
  --jt-badge-yellow-bg: #33301a;
  --jt-badge-gray-bg: #2a3830;
  --jt-badge-blue-bg: #1a3028;
  --jt-badge-orange-bg: #332a1f;
  --jt-pin-bg: #1a3328;
  --jt-pin-border: #3d6b52;
  --jt-pin-hover-bg: #2a4a3a;
  --jt-pin-on-surface: #d8f0e4;
  --jt-pin-muted: rgba(255, 255, 255, 0.28);
  --jt-pin-checked-bg: #1a3d2e;
  --jt-pin-checked-label: #8fefb8;
  --jt-pin-drag-bg: #1e3328;
}

/* Soothing dark: twilight slate (cool blue/indigo; unmistakable vs sage’s green) */
html[data-ui-theme="dusk"] {
  color-scheme: dark;
  --jt-bg-page: #080c14;
  --jt-bg-elevated: #0f1524;
  --jt-bg-sidebar: #050810;
  --jt-bg-topbar: #050810;
  --jt-bg-card: #182238;
  --jt-bg-input: #121a2c;
  --jt-bg-table-head: #141f33;
  --jt-bg-hover: #2c3a58;
  --jt-bg-row-hover: #243250;
  --jt-border: #4a5f8c;
  --jt-border-soft: #303d5c;
  --jt-text: #e6ebfb;
  --jt-text-muted: #94a8d8;
  --jt-text-faint: #788bb7;
  --jt-text-heading: #e8ecf8;
  --jt-link: #7eb0ff;
  --jt-link-hover: #c5dcff;
  --jt-scroll-track: #0f1422;
  --jt-scroll-thumb1: #4a6a9e;
  --jt-scroll-thumb2: #35456a;
  --jt-badge-green-bg: #1a2e28;
  --jt-badge-red-bg: #301a28;
  --jt-badge-yellow-bg: #2e2a1a;
  --jt-badge-gray-bg: #2a3040;
  --jt-badge-blue-bg: #1a2840;
  --jt-badge-orange-bg: #30251a;
  --jt-pin-bg: #182238;
  --jt-pin-border: #4a5f8c;
  --jt-pin-hover-bg: #2c3a58;
  --jt-pin-on-surface: #dde6ff;
  --jt-pin-muted: rgba(255, 255, 255, 0.28);
  --jt-pin-checked-bg: #1e3050;
  --jt-pin-checked-label: #a8ccff;
  --jt-pin-drag-bg: #243050;
}

/* Light mist: pale green-gray haze (obviously light; not another dark gray) */
html[data-ui-theme="fog"] {
  color-scheme: light;
  /* Softer contrast: avoid pure white fields / ink-black type */
  --jt-bg-page: #c9d9d0;
  --jt-bg-elevated: #d6e5dc;
  --jt-bg-sidebar: #b0c9be;
  --jt-bg-topbar: #bdd5cb;
  --jt-bg-card: #e8f1ec;
  --jt-bg-input: #dde8e2;
  --jt-bg-table-head: #d2e0d8;
  --jt-bg-hover: #c8d9cf;
  --jt-bg-row-hover: #e0ebe5;
  --jt-border: #7a9488;
  --jt-border-soft: #a3b8ae;
  --jt-text: #2a3830;
  --jt-text-muted: #3d5248;
  --jt-text-faint: #5f6f66;
  --jt-text-heading: #2d3832;
  --jt-link: #0d5c36;
  --jt-link-hover: #084428;
  --jt-scroll-track: #b9cfc4;
  --jt-scroll-thumb1: #4a7a62;
  --jt-scroll-thumb2: #35604a;
  --jt-badge-green-bg: #bfe5d0;
  --jt-badge-red-bg: #f0d4d0;
  --jt-badge-yellow-bg: #e8e4c4;
  --jt-badge-gray-bg: #d8e2dc;
  --jt-badge-blue-bg: #c8dde8;
  --jt-badge-orange-bg: #e8ddd0;
  --jt-pin-bg: #4a5c54;
  --jt-pin-border: #5d7067;
  --jt-pin-hover-bg: #566860;
  --jt-pin-on-surface: #f0f7f3;
  --jt-pin-muted: rgba(255, 255, 255, 0.4);
  --jt-pin-checked-bg: #1a4d32;
  --jt-pin-checked-label: #c8f5dc;
  --jt-pin-drag-bg: #244a36;
}

html[data-ui-theme="cream"] {
  color-scheme: light;
  /* Golden sand / parchment: strong warm hue vs Light’s cool blue-gray (similar brightness, different color) */
  --jt-bg-page: #d2c2a4;
  --jt-bg-elevated: #d9c9ae;
  --jt-bg-sidebar: #c9b896;
  --jt-bg-topbar: #cfbf9f;
  --jt-bg-card: #faf6ed;
  --jt-bg-input: #fffdf8;
  --jt-bg-table-head: #e8dcc8;
  --jt-bg-hover: #e0d2bc;
  --jt-bg-row-hover: #efe4d4;
  --jt-border: #a08f6e;
  --jt-border-soft: #b8a88a;
  --jt-text: #1c1916;
  --jt-text-muted: #4a4036;
  --jt-text-faint: #6b5d48;
  --jt-text-heading: #252019;
  --jt-link: #0a4d26;
  --jt-link-hover: #156b36;
  --jt-scroll-track: #c9b896;
  --jt-scroll-thumb1: #5a7a62;
  --jt-scroll-thumb2: #3d5a45;
  --jt-badge-green-bg: #b8d9c4;
  --jt-badge-red-bg: #ecc8c4;
  --jt-badge-yellow-bg: #ead8a8;
  --jt-badge-gray-bg: #e0d4c4;
  --jt-badge-blue-bg: #c4d8e8;
  --jt-badge-orange-bg: #e8d0c0;
  /* Warm espresso chips */
  --jt-pin-bg: #453d35;
  --jt-pin-border: #5c5349;
  --jt-pin-hover-bg: #504840;
  --jt-pin-on-surface: #f2ece4;
  --jt-pin-muted: rgba(255, 255, 255, 0.4);
  --jt-pin-checked-bg: #1a3024;
  --jt-pin-checked-label: #9ed4ae;
  --jt-pin-drag-bg: #243529;
}

html[data-ui-theme="light"] {
  color-scheme: light;
  /* Cool gray: no pure white sheets; easier adjacent surfaces */
  --jt-bg-page: #d8dee8;
  --jt-bg-elevated: #e6ebf2;
  --jt-bg-sidebar: #e8edf4;
  --jt-bg-topbar: #e8edf4;
  --jt-bg-card: #eef2f7;
  --jt-bg-input: #e4e9f1;
  --jt-bg-table-head: #dfe5ee;
  --jt-bg-hover: #dde3ed;
  --jt-bg-row-hover: #e8edf5;
  --jt-border: #aab4c2;
  --jt-border-soft: #c5ceda;
  --jt-text: #2d333b;
  --jt-text-muted: #5a626d;
  --jt-text-faint: #656c76;
  --jt-text-heading: #323840;
  --jt-link: #0969da;
  --jt-link-hover: #0550ae;
  --jt-scroll-track: #e8ecf0;
  --jt-scroll-thumb1: #96c4a8;
  --jt-scroll-thumb2: #6ea37f;
  --jt-badge-green-bg: #dafbe1;
  --jt-badge-red-bg: #ffebe9;
  --jt-badge-yellow-bg: #fff8c5;
  --jt-badge-gray-bg: #f6f8fa;
  --jt-badge-blue-bg: #ddf4ff;
  --jt-badge-orange-bg: #fff1e5;
  /* Cool charcoal chips: clearly not #000 */
  --jt-pin-bg: #4a5563;
  --jt-pin-border: #5f6b7a;
  --jt-pin-hover-bg: #545f6e;
  --jt-pin-on-surface: #e8ecf1;
  --jt-pin-muted: rgba(255, 255, 255, 0.4);
  --jt-pin-checked-bg: #1e3a2d;
  --jt-pin-checked-label: #9ee6b4;
  --jt-pin-drag-bg: #243d30;
}

/* ----------------------------------------------------------------------
 * Sports palettes: light bases (4) + one dark.
 * Names are ID-only ("hawks", "viks" etc.); display labels can be renamed in
 * admin/profile.php without touching these tokens. Hex codes are official
 * team colors verified against published brand guides.
 * --------------------------------------------------------------------- */

/* Hawks: Seattle navy + action lime + wolf gray (light base) */
html[data-ui-theme="hawks"] {
  color-scheme: light;
  --jt-bg-page: #c7d7e6;
  --jt-bg-elevated: #d5e3f0;
  --jt-bg-sidebar: #b9cddd;
  --jt-bg-topbar: #c2d5e4;
  --jt-bg-card: #e5eef6;
  --jt-bg-input: #f1f6fb;
  --jt-bg-table-head: #d2e0ec;
  --jt-bg-hover: #c7d7e6;
  --jt-bg-row-hover: #dce8f2;
  --jt-border: #6f8da9;
  --jt-border-soft: #9eb5c9;
  --jt-text: #112030;
  --jt-text-muted: #2f4b67;
  --jt-text-faint: #506b85;
  --jt-text-heading: #002244;
  --jt-link: #005a8f;
  --jt-link-hover: #003f66;
  --jt-scroll-track: #b9cddd;
  --jt-scroll-thumb1: #002244;
  --jt-scroll-thumb2: #3a7e1f;
  --jt-badge-green-bg: #d1e9cf;
  --jt-badge-red-bg: #f0d4d0;
  --jt-badge-yellow-bg: #e8f0cc;
  --jt-badge-gray-bg: #cfdce8;
  --jt-badge-blue-bg: #c4d9ec;
  --jt-badge-orange-bg: #e3d8c8;
  --jt-pin-bg: #002244;
  --jt-pin-border: #1a3458;
  --jt-pin-hover-bg: #0d2e54;
  --jt-pin-on-surface: #eef3f9;
  --jt-pin-muted: rgba(255, 255, 255, 0.4);
  --jt-pin-checked-bg: #3a7e1f;
  --jt-pin-checked-label: #d6ebbf;
  --jt-pin-drag-bg: #2a5e16;
}

/* Viks: Vikings purple + gold (light base) */
html[data-ui-theme="viks"] {
  color-scheme: light;
  --jt-bg-page: #e6dff0;
  --jt-bg-elevated: #ede7f5;
  --jt-bg-sidebar: #d8cde8;
  --jt-bg-topbar: #e0d6ec;
  --jt-bg-card: #f4eefb;
  --jt-bg-input: #fbf8fe;
  --jt-bg-table-head: #e8def2;
  --jt-bg-hover: #ddd2ea;
  --jt-bg-row-hover: #ece4f4;
  --jt-border: #9778bd;
  --jt-border-soft: #bca5d6;
  --jt-text: #1c1226;
  --jt-text-muted: #4a3766;
  --jt-text-faint: #6b568a;
  --jt-text-heading: #4f2683;
  --jt-link: #4f2683;
  --jt-link-hover: #6b3aab;
  --jt-scroll-track: #d8cde8;
  --jt-scroll-thumb1: #4f2683;
  --jt-scroll-thumb2: #ffc62f;
  --jt-badge-green-bg: #d4ead4;
  --jt-badge-red-bg: #f0d4d4;
  --jt-badge-yellow-bg: #f8e8b0;
  --jt-badge-gray-bg: #ddd5e6;
  --jt-badge-blue-bg: #d0d8ec;
  --jt-badge-orange-bg: #f0d8c0;
  --jt-pin-bg: #4f2683;
  --jt-pin-border: #6b3aab;
  --jt-pin-hover-bg: #5a2e96;
  --jt-pin-on-surface: #f4ecfb;
  --jt-pin-muted: rgba(255, 255, 255, 0.4);
  --jt-pin-checked-bg: #c89800;
  --jt-pin-checked-label: #fff5d0;
  --jt-pin-drag-bg: #ffc62f;
}

/* Wazzu: WSU crimson + gray (light base) */
html[data-ui-theme="wazzu"] {
  color-scheme: light;
  --jt-bg-page: #ede0e3;
  --jt-bg-elevated: #f4eaec;
  --jt-bg-sidebar: #e0cdd1;
  --jt-bg-topbar: #e8d5d9;
  --jt-bg-card: #faf2f4;
  --jt-bg-input: #fdfafb;
  --jt-bg-table-head: #efdfe2;
  --jt-bg-hover: #e3d2d6;
  --jt-bg-row-hover: #f0e2e4;
  --jt-border: #b0808a;
  --jt-border-soft: #d2b3ba;
  --jt-text: #1f1416;
  --jt-text-muted: #5e4a4f;
  --jt-text-faint: #7e6a6f;
  --jt-text-heading: #981e32;
  --jt-link: #981e32;
  --jt-link-hover: #74161e;
  --jt-scroll-track: #e0cdd1;
  --jt-scroll-thumb1: #981e32;
  --jt-scroll-thumb2: #5e6a71;
  --jt-badge-green-bg: #d4e8d4;
  --jt-badge-red-bg: #ecc8cd;
  --jt-badge-yellow-bg: #efe2c0;
  --jt-badge-gray-bg: #e0d6d8;
  --jt-badge-blue-bg: #d0d8e0;
  --jt-badge-orange-bg: #ecd5c8;
  --jt-pin-bg: #5e6a71;
  --jt-pin-border: #76828a;
  --jt-pin-hover-bg: #6b7780;
  --jt-pin-on-surface: #f0f3f5;
  --jt-pin-muted: rgba(255, 255, 255, 0.4);
  --jt-pin-checked-bg: #981e32;
  --jt-pin-checked-label: #ffd8de;
  --jt-pin-drag-bg: #74161e;
}

/* Pack: Packers green + gold (light base, distinctly forest-saturated vs Fog's haze) */
html[data-ui-theme="pack"] {
  color-scheme: light;
  --jt-bg-page: #9bbaa6;
  --jt-bg-elevated: #abc7b4;
  --jt-bg-sidebar: #4f7a64;
  --jt-bg-topbar: #6a917b;
  --jt-bg-card: #eef5ec;
  --jt-bg-input: #faf6e0;
  --jt-bg-table-head: #b8d4c0;
  --jt-bg-hover: #8eaf9b;
  --jt-bg-row-hover: #dceadf;
  --jt-border: #2f5246;
  --jt-border-soft: #557b6b;
  --jt-text: #0e1a14;
  --jt-text-muted: #1e3830;
  --jt-text-faint: #44665a;
  --jt-text-heading: #203731;
  --jt-link: #203731;
  --jt-link-hover: #336049;
  --jt-scroll-track: #4f7a64;
  --jt-scroll-thumb1: #ffb612;
  --jt-scroll-thumb2: #b88600;
  --jt-badge-green-bg: #b6d4be;
  --jt-badge-red-bg: #ecd0cc;
  --jt-badge-yellow-bg: #f8e0a0;
  --jt-badge-gray-bg: #c5d6cc;
  --jt-badge-blue-bg: #c0d4cc;
  --jt-badge-orange-bg: #ecd0a8;
  --jt-pin-bg: #203731;
  --jt-pin-border: #336049;
  --jt-pin-hover-bg: #294540;
  --jt-pin-on-surface: #f3f8ef;
  --jt-pin-muted: rgba(255, 255, 255, 0.4);
  --jt-pin-checked-bg: #b88600;
  --jt-pin-checked-label: #fff5d0;
  --jt-pin-drag-bg: #ffb612;
}

/* Niners: 49ers cardinal red + gold (light base) */
html[data-ui-theme="niners"] {
  color-scheme: light;
  --jt-bg-page: #e8d8c4;
  --jt-bg-elevated: #efe2d0;
  --jt-bg-sidebar: #dec6ad;
  --jt-bg-topbar: #e3cfb6;
  --jt-bg-card: #f6ecdc;
  --jt-bg-input: #fbf6ec;
  --jt-bg-table-head: #ecdcc4;
  --jt-bg-hover: #ddccb2;
  --jt-bg-row-hover: #ede0c8;
  --jt-border: #b89a76;
  --jt-border-soft: #d2bc9c;
  --jt-text: #1a1612;
  --jt-text-muted: #4e3f30;
  --jt-text-faint: #6e5c48;
  --jt-text-heading: #aa0000;
  --jt-link: #aa0000;
  --jt-link-hover: #800000;
  --jt-scroll-track: #dec6ad;
  --jt-scroll-thumb1: #aa0000;
  --jt-scroll-thumb2: #b3995d;
  --jt-badge-green-bg: #d8e6c4;
  --jt-badge-red-bg: #f0c8c4;
  --jt-badge-yellow-bg: #ecdba0;
  --jt-badge-gray-bg: #e0d4bc;
  --jt-badge-blue-bg: #cdd8e0;
  --jt-badge-orange-bg: #ecd0a8;
  --jt-pin-bg: #aa0000;
  --jt-pin-border: #c41818;
  --jt-pin-hover-bg: #b81010;
  --jt-pin-on-surface: #fbe5e0;
  --jt-pin-muted: rgba(255, 255, 255, 0.4);
  --jt-pin-checked-bg: #b3995d;
  --jt-pin-checked-label: #fff5d8;
  --jt-pin-drag-bg: #8a7340;
}

/* EWU: Eastern Washington crimson on rose-tan (light base, Pack-level saturation) */
html[data-ui-theme="ewu"] {
  color-scheme: light;
  --jt-bg-page: #c4a0a8;
  --jt-bg-elevated: #d4b0b8;
  --jt-bg-sidebar: #8a2840;
  --jt-bg-topbar: #a85868;
  --jt-bg-card: #f5ecef;
  --jt-bg-input: #faf4f5;
  --jt-bg-table-head: #dcb8c0;
  --jt-bg-hover: #b8909a;
  --jt-bg-row-hover: #e8d4d8;
  --jt-border: #6e3848;
  --jt-border-soft: #946068;
  --jt-text: #1a0c10;
  --jt-text-muted: #4a2830;
  --jt-text-faint: #6e4850;
  --jt-text-heading: #a10022;
  --jt-link: #a10022;
  --jt-link-hover: #7a0018;
  --jt-scroll-track: #8a2840;
  --jt-scroll-thumb1: #ce1126;
  --jt-scroll-thumb2: #5c3038;
  --jt-badge-green-bg: #d4e8d4;
  --jt-badge-red-bg: #ecc8cc;
  --jt-badge-yellow-bg: #efe0c0;
  --jt-badge-gray-bg: #dcc8cc;
  --jt-badge-blue-bg: #ccd4e0;
  --jt-badge-orange-bg: #ecd0a8;
  --jt-pin-bg: #a10022;
  --jt-pin-border: #ce1126;
  --jt-pin-hover-bg: #8a001c;
  --jt-pin-on-surface: #f5ecef;
  --jt-pin-muted: rgba(255, 255, 255, 0.4);
  --jt-pin-checked-bg: #5c3038;
  --jt-pin-checked-label: #f0e0e4;
  --jt-pin-drag-bg: #ce1126;
}

/* BSU: Boise State orange + blue on warm bronze-tan (light base, not navy-black) */
html[data-ui-theme="bsu"] {
  color-scheme: light;
  --jt-bg-page: #d9b088;
  --jt-bg-elevated: #e6c49a;
  --jt-bg-sidebar: #4a6ea8;
  --jt-bg-topbar: #6a8ec4;
  --jt-bg-card: #faf3e8;
  --jt-bg-input: #fff9ee;
  --jt-bg-table-head: #e0c8a8;
  --jt-bg-hover: #ccb080;
  --jt-bg-row-hover: #eee0c8;
  --jt-border: #8a5a30;
  --jt-border-soft: #a87848;
  --jt-text: #1a1208;
  --jt-text-muted: #4a3828;
  --jt-text-faint: #6e5840;
  --jt-text-heading: #0033a0;
  --jt-link: #0033a0;
  --jt-link-hover: #002878;
  --jt-scroll-track: #4a6ea8;
  --jt-scroll-thumb1: #d64309;
  --jt-scroll-thumb2: #0033a0;
  --jt-badge-green-bg: #d4e8d4;
  --jt-badge-red-bg: #f0d0c8;
  --jt-badge-yellow-bg: #f8e0a0;
  --jt-badge-gray-bg: #dcc8b0;
  --jt-badge-blue-bg: #c8d8ec;
  --jt-badge-orange-bg: #f0c8a0;
  --jt-pin-bg: #0033a0;
  --jt-pin-border: #2858b8;
  --jt-pin-hover-bg: #002878;
  --jt-pin-on-surface: #f3f6fc;
  --jt-pin-muted: rgba(255, 255, 255, 0.4);
  --jt-pin-checked-bg: #d64309;
  --jt-pin-checked-label: #fff0e0;
  --jt-pin-drag-bg: #f0a060;
}

/* Zags: Gonzaga navy + cardinal on blue-gray (light pigmented base) */
html[data-ui-theme="zags"] {
  color-scheme: light;
  --jt-bg-page: #a8b6d0;
  --jt-bg-elevated: #b8c6dc;
  --jt-bg-sidebar: #3d5578;
  --jt-bg-topbar: #5a7296;
  --jt-bg-card: #eef2f8;
  --jt-bg-input: #f8fafc;
  --jt-bg-table-head: #c8d4e4;
  --jt-bg-hover: #98aac4;
  --jt-bg-row-hover: #dce4f0;
  --jt-border: #2e4060;
  --jt-border-soft: #506888;
  --jt-text: #0e1420;
  --jt-text-muted: #2c3a52;
  --jt-text-faint: #4a5a72;
  --jt-text-heading: #041e42;
  --jt-link: #041e42;
  --jt-link-hover: #c8102e;
  --jt-scroll-track: #3d5578;
  --jt-scroll-thumb1: #c8102e;
  --jt-scroll-thumb2: #041e42;
  --jt-badge-green-bg: #d4e8d4;
  --jt-badge-red-bg: #ecc8cc;
  --jt-badge-yellow-bg: #ece0b0;
  --jt-badge-gray-bg: #ccd4e0;
  --jt-badge-blue-bg: #c0d0e8;
  --jt-badge-orange-bg: #ecd0a8;
  --jt-pin-bg: #041e42;
  --jt-pin-border: #1a3458;
  --jt-pin-hover-bg: #021830;
  --jt-pin-on-surface: #eef2f8;
  --jt-pin-muted: rgba(255, 255, 255, 0.4);
  --jt-pin-checked-bg: #c8102e;
  --jt-pin-checked-label: #ffe0e4;
  --jt-pin-drag-bg: #8a2840;
}

/* Seafoam: vibrant aqua-green (light base, saturated mint chrome) */
html[data-ui-theme="seafoam"] {
  color-scheme: light;
  --jt-bg-page: #9ecec0;
  --jt-bg-elevated: #aed8cc;
  --jt-bg-sidebar: #1a7a68;
  --jt-bg-topbar: #6abaa8;
  --jt-bg-card: #e8faf4;
  --jt-bg-input: #f4fcfa;
  --jt-bg-table-head: #c0e4d8;
  --jt-bg-hover: #88c4b4;
  --jt-bg-row-hover: #d8f0e8;
  --jt-border: #1a6a58;
  --jt-border-soft: #4a9888;
  --jt-text: #0a2018;
  --jt-text-muted: #2a5048;
  --jt-text-faint: #4a7068;
  --jt-text-heading: #0d5a48;
  --jt-link: #0a7860;
  --jt-link-hover: #168a72;
  --jt-scroll-track: #1a7a68;
  --jt-scroll-thumb1: #2ec4a8;
  --jt-scroll-thumb2: #168a72;
  --jt-badge-green-bg: #b8e8d4;
  --jt-badge-red-bg: #f0d0cc;
  --jt-badge-yellow-bg: #e8e4b8;
  --jt-badge-gray-bg: #cce0d8;
  --jt-badge-blue-bg: #c0dce8;
  --jt-badge-orange-bg: #e8dcc0;
  --jt-pin-bg: #e8faf4;
  --jt-pin-border: #4a9888;
  --jt-pin-hover-bg: #d8f0e8;
  --jt-pin-on-surface: #0d5a48;
  --jt-pin-muted: rgba(13, 90, 72, 0.42);
  --jt-pin-checked-bg: #0d5a48;
  --jt-pin-checked-label: #e8faf4;
  --jt-pin-drag-bg: #168a72;
}

/* UPS: brown + gold on warm tan (light base, brand-inspired) */
html[data-ui-theme="ups"] {
  color-scheme: light;
  --jt-bg-page: #d8c498;
  --jt-bg-elevated: #e4d0a8;
  --jt-bg-sidebar: #5c3a18;
  --jt-bg-topbar: #8b6840;
  --jt-bg-card: #faf6ec;
  --jt-bg-input: #fffaf0;
  --jt-bg-table-head: #e8dcc0;
  --jt-bg-hover: #ccb888;
  --jt-bg-row-hover: #eee4cc;
  --jt-border: #6b4420;
  --jt-border-soft: #a07848;
  --jt-text: #1a1008;
  --jt-text-muted: #4a3828;
  --jt-text-faint: #6e5840;
  --jt-text-heading: #351c09;
  --jt-link: #8b5a00;
  --jt-link-hover: #b8860b;
  --jt-scroll-track: #5c3a18;
  --jt-scroll-thumb1: #ffc20e;
  --jt-scroll-thumb2: #8b5a28;
  --jt-badge-green-bg: #d4e8c8;
  --jt-badge-red-bg: #f0d0c8;
  --jt-badge-yellow-bg: #f8e8a8;
  --jt-badge-gray-bg: #e0d4c0;
  --jt-badge-blue-bg: #ccd8e8;
  --jt-badge-orange-bg: #ecd0a8;
  --jt-pin-bg: #faf6ec;
  --jt-pin-border: #a07848;
  --jt-pin-hover-bg: #eee4cc;
  --jt-pin-on-surface: #351c09;
  --jt-pin-muted: rgba(53, 28, 9, 0.42);
  --jt-pin-checked-bg: #351c09;
  --jt-pin-checked-label: #fff5d8;
  --jt-pin-drag-bg: #ffc20e;
}

/* Miami Vice: pink sunset + teal ocean + purple dusk (balanced 80s, light base) */
html[data-ui-theme="miami"] {
  color-scheme: light;
  --jt-bg-page: #d0b8dc;
  --jt-bg-elevated: #dcc8e8;
  --jt-bg-sidebar: #1a1848;
  --jt-bg-topbar: #a088c0;
  --jt-bg-card: #f4f0fc;
  --jt-bg-input: #faf6ff;
  --jt-bg-table-head: #dcd0f0;
  --jt-bg-hover: #c0a8d8;
  --jt-bg-row-hover: #e8e0f8;
  --jt-border: #5a4088;
  --jt-border-soft: #a898c8;
  --jt-text: #0a1420;
  --jt-text-muted: #3a2858;
  --jt-text-faint: #5a4878;
  --jt-text-heading: #cf1773;
  --jt-link: #00759e;
  --jt-link-hover: #00d4ff;
  --jt-scroll-track: #1a1848;
  --jt-scroll-thumb1: #ff40a0;
  --jt-scroll-thumb2: #00d4ff;
  --jt-badge-green-bg: #c8e8e0;
  --jt-badge-red-bg: #f8d0e8;
  --jt-badge-yellow-bg: #ece0d8;
  --jt-badge-gray-bg: #dcd4e8;
  --jt-badge-blue-bg: #c8daf8;
  --jt-badge-orange-bg: #ecd8e8;
  --jt-pin-bg: #f4f0fc;
  --jt-pin-border: #a898c8;
  --jt-pin-hover-bg: #f0d8f0;
  --jt-pin-on-surface: #cf1773;
  --jt-pin-muted: rgba(216, 24, 120, 0.42);
  --jt-pin-checked-bg: #ff40a0;
  --jt-pin-checked-label: #fff8fc;
  --jt-pin-drag-bg: #00d4ff;
  --jt-primary: #ff40a0;
  --jt-btn-primary-bg: #ff40a0;
  --jt-btn-primary-bg-hover: color-mix(in srgb, #ff40a0 82%, #fff);
  --jt-btn-primary-border: color-mix(in srgb, #ff40a0 72%, #000);
}

/* Irish: Notre Dame navy + gold + green accent (light full-color base) */
html[data-ui-theme="irish"] {
  color-scheme: light;
  --jt-bg-page: #d4c878;
  --jt-bg-elevated: #e0d48a;
  --jt-bg-sidebar: #0c2340;
  --jt-bg-topbar: #1a3858;
  --jt-bg-card: #faf6e8;
  --jt-bg-input: #fffdf5;
  --jt-bg-table-head: #e8dcb0;
  --jt-bg-hover: #c8b868;
  --jt-bg-row-hover: #eee4c8;
  --jt-border: #6a5830;
  --jt-border-soft: #9a8858;
  --jt-text: #0c1018;
  --jt-text-muted: #2a3848;
  --jt-text-faint: #4a5868;
  --jt-text-heading: #0c2340;
  --jt-link: #0c2340;
  --jt-link-hover: #00843d;
  --jt-scroll-track: #0c2340;
  --jt-scroll-thumb1: #c99700;
  --jt-scroll-thumb2: #00843d;
  --jt-badge-green-bg: #c8e8d0;
  --jt-badge-red-bg: #f0d0cc;
  --jt-badge-yellow-bg: #f8e8b0;
  --jt-badge-gray-bg: #e0dcc8;
  --jt-badge-blue-bg: #ccd8e8;
  --jt-badge-orange-bg: #ecd8b8;
  --jt-pin-bg: #faf6e8;
  --jt-pin-border: #9a8858;
  --jt-pin-hover-bg: #eee4c8;
  --jt-pin-on-surface: #0c2340;
  --jt-pin-muted: rgba(12, 35, 64, 0.42);
  --jt-pin-checked-bg: #0c2340;
  --jt-pin-checked-label: #f5e8b0;
  --jt-pin-drag-bg: #c99700;
  --jt-primary: #c99700;
  --jt-btn-primary-bg: #c99700;
  --jt-btn-primary-bg-hover: color-mix(in srgb, #c99700 82%, #fff);
  --jt-btn-primary-border: color-mix(in srgb, #c99700 72%, #000);
}

/* Dawgs: UW purple + gold (light full-color base) */
html[data-ui-theme="dawgs"] {
  color-scheme: light;
  --jt-bg-page: #c8bcd8;
  --jt-bg-elevated: #d8cce8;
  --jt-bg-sidebar: #4b2e83;
  --jt-bg-topbar: #6a5098;
  --jt-bg-card: #f4f0fa;
  --jt-bg-input: #faf8fe;
  --jt-bg-table-head: #e0d4ec;
  --jt-bg-hover: #b8a8cc;
  --jt-bg-row-hover: #e8e0f4;
  --jt-border: #4a3868;
  --jt-border-soft: #7868a0;
  --jt-text: #120c1a;
  --jt-text-muted: #3a2c52;
  --jt-text-faint: #5a4878;
  --jt-text-heading: #4b2e83;
  --jt-link: #4b2e83;
  --jt-link-hover: #85754d;
  --jt-scroll-track: #4b2e83;
  --jt-scroll-thumb1: #b7a57a;
  --jt-scroll-thumb2: #4b2e83;
  --jt-badge-green-bg: #d4e8d4;
  --jt-badge-red-bg: #ecc8cc;
  --jt-badge-yellow-bg: #f0e8c8;
  --jt-badge-gray-bg: #dcd4e8;
  --jt-badge-blue-bg: #ccd8ec;
  --jt-badge-orange-bg: #ecd8c8;
  --jt-pin-bg: #f4f0fa;
  --jt-pin-border: #7868a0;
  --jt-pin-hover-bg: #e8e0f4;
  --jt-pin-on-surface: #4b2e83;
  --jt-pin-muted: rgba(75, 46, 131, 0.42);
  --jt-pin-checked-bg: #4b2e83;
  --jt-pin-checked-label: #f5ecd8;
  --jt-pin-drag-bg: #b7a57a;
}

/* Chargers: powder blue + gold + navy (light full-color base) */
html[data-ui-theme="chargers"] {
  color-scheme: light;
  --jt-bg-page: #9cc8e0;
  --jt-bg-elevated: #acd4e8;
  --jt-bg-sidebar: #002a5c;
  --jt-bg-topbar: #0080c6;
  --jt-bg-card: #eef8fc;
  --jt-bg-input: #f8fcff;
  --jt-bg-table-head: #c8e0f0;
  --jt-bg-hover: #88b8d8;
  --jt-bg-row-hover: #dceef8;
  --jt-border: #1a5080;
  --jt-border-soft: #4a88b0;
  --jt-text: #0a1420;
  --jt-text-muted: #2a4058;
  --jt-text-faint: #4a6078;
  --jt-text-heading: #002a5c;
  --jt-link: #002a5c;
  --jt-link-hover: #0080c6;
  --jt-scroll-track: #002a5c;
  --jt-scroll-thumb1: #ffc20e;
  --jt-scroll-thumb2: #0080c6;
  --jt-badge-green-bg: #c8e8e0;
  --jt-badge-red-bg: #f0d0cc;
  --jt-badge-yellow-bg: #f8ecc0;
  --jt-badge-gray-bg: #ccd8e8;
  --jt-badge-blue-bg: #c0daf0;
  --jt-badge-orange-bg: #ecd8c0;
  --jt-pin-bg: #eef8fc;
  --jt-pin-border: #4a88b0;
  --jt-pin-hover-bg: #dceef8;
  --jt-pin-on-surface: #002a5c;
  --jt-pin-muted: rgba(0, 42, 92, 0.42);
  --jt-pin-checked-bg: #002a5c;
  --jt-pin-checked-label: #fff8d8;
  --jt-pin-drag-bg: #ffc20e;
  --jt-primary: #ffc20e;
  --jt-btn-primary-bg: #ffc20e;
  --jt-btn-primary-bg-hover: color-mix(in srgb, #ffc20e 82%, #fff);
  --jt-btn-primary-border: color-mix(in srgb, #ffc20e 65%, #002a5c);
}

/* Contactrol: warm bronze / copper brand (dark base; shared Trol palette) */
html[data-ui-theme="contactrol"] {
  color-scheme: dark;
  --jt-bg-page: #1a1410;
  --jt-bg-elevated: #241c16;
  --jt-bg-sidebar: #120e0a;
  --jt-bg-topbar: #120e0a;
  --jt-bg-card: #2e241c;
  --jt-bg-input: #1e1814;
  --jt-bg-table-head: #221c16;
  --jt-bg-hover: #3a3026;
  --jt-bg-row-hover: #322820;
  --jt-border: #6b5344;
  --jt-border-soft: #4a3d32;
  --jt-text: #f5ebe3;
  --jt-text-muted: #c9a88a;
  --jt-text-faint: #a38a76;
  --jt-text-heading: #e8c9a8;
  --jt-link: #d4a574;
  --jt-link-hover: #f0c898;
  --jt-scroll-track: #1a1410;
  --jt-scroll-thumb1: #b87333;
  --jt-scroll-thumb2: #8b5a2e;
  --jt-badge-green-bg: #2a3a28;
  --jt-badge-red-bg: #3a2020;
  --jt-badge-yellow-bg: #3a3220;
  --jt-badge-gray-bg: #2a2620;
  --jt-badge-blue-bg: #1a2830;
  --jt-badge-orange-bg: #3a2818;
  --jt-pin-bg: #2e241c;
  --jt-pin-border: #6b5344;
  --jt-pin-hover-bg: #3a3026;
  --jt-pin-on-surface: #f0dcc8;
  --jt-pin-muted: rgba(255, 255, 255, 0.28);
  --jt-pin-checked-bg: #8b5a2e;
  --jt-pin-checked-label: #f5d898;
  --jt-pin-drag-bg: #6b4428;
  --jt-primary: #cd7f32;
  --jt-btn-primary-bg: #cd7f32;
  --jt-btn-primary-bg-hover: color-mix(in srgb, #cd7f32 82%, #fff);
  --jt-btn-primary-border: color-mix(in srgb, #cd7f32 65%, #1a1410);
}

/* ----------------------------------------------------------------------
 * Metallic palettes: leathery brushed gold / copper / silver (2 light + 1 dark each).
 * Warm leather undertones on surfaces; metal sheen via link, border, and scroll accents.
 * --------------------------------------------------------------------- */

/* Gold: brushed antique gold + saddle leather (light) */
html[data-ui-theme="gold"] {
  color-scheme: light;
  --jt-bg-page: #d4c4a0;
  --jt-bg-elevated: #dcc8a8;
  --jt-bg-sidebar: #c4b088;
  --jt-bg-topbar: #d0bc98;
  --jt-bg-card: #f5eed8;
  --jt-bg-input: #faf6ec;
  --jt-bg-table-head: #e8dcc4;
  --jt-bg-hover: #e0d0b4;
  --jt-bg-row-hover: #efe6d0;
  --jt-border: #a89068;
  --jt-border-soft: #c4b090;
  --jt-text: #2a2010;
  --jt-text-muted: #5c4a30;
  --jt-text-faint: #7a6848;
  --jt-text-heading: #3a2e18;
  --jt-link: #7f6510;
  --jt-link-hover: #c9a020;
  --jt-scroll-track: #c8b488;
  --jt-scroll-thumb1: #c9a227;
  --jt-scroll-thumb2: #8b6914;
  --jt-badge-green-bg: #c8dcc0;
  --jt-badge-red-bg: #e8ccc4;
  --jt-badge-yellow-bg: #ead8a0;
  --jt-badge-gray-bg: #e0d4c0;
  --jt-badge-blue-bg: #c8d4e4;
  --jt-badge-orange-bg: #e8d4b8;
  --jt-pin-bg: #4a3c28;
  --jt-pin-border: #6a5840;
  --jt-pin-hover-bg: #564838;
  --jt-pin-on-surface: #f5ecd8;
  --jt-pin-muted: rgba(255, 255, 255, 0.38);
  --jt-pin-checked-bg: #6a5018;
  --jt-pin-checked-label: #f0d878;
  --jt-pin-drag-bg: #4a3810;
}

/* Gold soft: champagne parchment + pale brushed gold (light) */
html[data-ui-theme="gold-soft"] {
  color-scheme: light;
  --jt-bg-page: #e8dcc4;
  --jt-bg-elevated: #efe4d0;
  --jt-bg-sidebar: #ddd0b8;
  --jt-bg-topbar: #e4d8c4;
  --jt-bg-card: #faf6ee;
  --jt-bg-input: #fffcf6;
  --jt-bg-table-head: #f0e8d8;
  --jt-bg-hover: #e8dcc8;
  --jt-bg-row-hover: #f4ece0;
  --jt-border: #c4b498;
  --jt-border-soft: #d8ccb4;
  --jt-text: #2c2418;
  --jt-text-muted: #5e5040;
  --jt-text-faint: #7a6c58;
  --jt-text-heading: #342a1c;
  --jt-link: #846b13;
  --jt-link-hover: #d4af37;
  --jt-scroll-track: #ddd0b8;
  --jt-scroll-thumb1: #d4af37;
  --jt-scroll-thumb2: #a88818;
  --jt-badge-green-bg: #dce8d4;
  --jt-badge-red-bg: #f0dcd8;
  --jt-badge-yellow-bg: #f0e8c8;
  --jt-badge-gray-bg: #ebe4d8;
  --jt-badge-blue-bg: #d8e4f0;
  --jt-badge-orange-bg: #f0e4d4;
  --jt-pin-bg: #524838;
  --jt-pin-border: #6e6050;
  --jt-pin-hover-bg: #5e5444;
  --jt-pin-on-surface: #faf6ee;
  --jt-pin-muted: rgba(255, 255, 255, 0.4);
  --jt-pin-checked-bg: #7a6018;
  --jt-pin-checked-label: #f5e090;
  --jt-pin-drag-bg: #5a4818;
}

/* Gold dark: deep burnished gold + oiled leather (dark) */
html[data-ui-theme="gold-dark"] {
  color-scheme: dark;
  --jt-bg-page: #1a1408;
  --jt-bg-elevated: #241c10;
  --jt-bg-sidebar: #120e06;
  --jt-bg-topbar: #120e06;
  --jt-bg-card: #2e2414;
  --jt-bg-input: #1e1810;
  --jt-bg-table-head: #221c12;
  --jt-bg-hover: #3a3020;
  --jt-bg-row-hover: #322818;
  --jt-border: #6b5a38;
  --jt-border-soft: #4a4030;
  --jt-text: #f5ecd8;
  --jt-text-muted: #d4b878;
  --jt-text-faint: #a38c5e;
  --jt-text-heading: #f0d898;
  --jt-link: #d4af37;
  --jt-link-hover: #f0d878;
  --jt-scroll-track: #1a1408;
  --jt-scroll-thumb1: #c9a227;
  --jt-scroll-thumb2: #8b6914;
  --jt-badge-green-bg: #2a3420;
  --jt-badge-red-bg: #3a2420;
  --jt-badge-yellow-bg: #3a3218;
  --jt-badge-gray-bg: #2a2820;
  --jt-badge-blue-bg: #1a2830;
  --jt-badge-orange-bg: #3a2c18;
  --jt-pin-bg: #2e2414;
  --jt-pin-border: #6b5a38;
  --jt-pin-hover-bg: #3a3020;
  --jt-pin-on-surface: #f5ecd8;
  --jt-pin-muted: rgba(255, 255, 255, 0.28);
  --jt-pin-checked-bg: #8b6914;
  --jt-pin-checked-label: #f5e090;
  --jt-pin-drag-bg: #6a5018;
}

/* Copper: rose-copper tan + chestnut leather (light) */
html[data-ui-theme="copper"] {
  color-scheme: light;
  --jt-bg-page: #d8b8a0;
  --jt-bg-elevated: #e0c0a8;
  --jt-bg-sidebar: #c8a088;
  --jt-bg-topbar: #d4b498;
  --jt-bg-card: #f5ebe0;
  --jt-bg-input: #faf6f0;
  --jt-bg-table-head: #e8d4c4;
  --jt-bg-hover: #e0c8b8;
  --jt-bg-row-hover: #efe4d8;
  --jt-border: #a87858;
  --jt-border-soft: #c4a088;
  --jt-text: #2a1810;
  --jt-text-muted: #5c4030;
  --jt-text-faint: #7a5848;
  --jt-text-heading: #3a2218;
  --jt-link: #945d29;
  --jt-link-hover: #d48848;
  --jt-scroll-track: #c8a088;
  --jt-scroll-thumb1: #cd7f32;
  --jt-scroll-thumb2: #8b5a2e;
  --jt-badge-green-bg: #c8dcc8;
  --jt-badge-red-bg: #e8ccc4;
  --jt-badge-yellow-bg: #ead8b0;
  --jt-badge-gray-bg: #e0d4cc;
  --jt-badge-blue-bg: #c8d8e8;
  --jt-badge-orange-bg: #e8d0b8;
  --jt-pin-bg: #4a3028;
  --jt-pin-border: #6a4840;
  --jt-pin-hover-bg: #563c34;
  --jt-pin-on-surface: #f5ebe0;
  --jt-pin-muted: rgba(255, 255, 255, 0.38);
  --jt-pin-checked-bg: #8b5a2e;
  --jt-pin-checked-label: #f0d0a8;
  --jt-pin-drag-bg: #6b4428;
}

/* Copper soft: blush copper parchment (light) */
html[data-ui-theme="copper-soft"] {
  color-scheme: light;
  --jt-bg-page: #e8d0c0;
  --jt-bg-elevated: #f0dcd0;
  --jt-bg-sidebar: #dcc4b4;
  --jt-bg-topbar: #e4d0c4;
  --jt-bg-card: #faf4ee;
  --jt-bg-input: #fffcf8;
  --jt-bg-table-head: #f0e4dc;
  --jt-bg-hover: #e8d4c8;
  --jt-bg-row-hover: #f4ece6;
  --jt-border: #c4a898;
  --jt-border-soft: #d8c4b4;
  --jt-text: #2c1814;
  --jt-text-muted: #5e4438;
  --jt-text-faint: #7a6058;
  --jt-text-heading: #342018;
  --jt-link: #a25b31;
  --jt-link-hover: #e09060;
  --jt-scroll-track: #dcc4b4;
  --jt-scroll-thumb1: #d4a574;
  --jt-scroll-thumb2: #b87333;
  --jt-badge-green-bg: #dce8d8;
  --jt-badge-red-bg: #f0dcd8;
  --jt-badge-yellow-bg: #f0e8d0;
  --jt-badge-gray-bg: #ebe4dc;
  --jt-badge-blue-bg: #d8e4f0;
  --jt-badge-orange-bg: #f0e0d4;
  --jt-pin-bg: #544038;
  --jt-pin-border: #705850;
  --jt-pin-hover-bg: #604c44;
  --jt-pin-on-surface: #faf4ee;
  --jt-pin-muted: rgba(255, 255, 255, 0.4);
  --jt-pin-checked-bg: #8b5a2e;
  --jt-pin-checked-label: #f5dcc0;
  --jt-pin-drag-bg: #6b4428;
}

/* Copper dark: oxidized copper + dark saddle (dark) */
html[data-ui-theme="copper-dark"] {
  color-scheme: dark;
  --jt-bg-page: #1a100c;
  --jt-bg-elevated: #241814;
  --jt-bg-sidebar: #100a08;
  --jt-bg-topbar: #100a08;
  --jt-bg-card: #2e2018;
  --jt-bg-input: #1e1410;
  --jt-bg-table-head: #221814;
  --jt-bg-hover: #3a2820;
  --jt-bg-row-hover: #322420;
  --jt-border: #6b4a38;
  --jt-border-soft: #4a3830;
  --jt-text: #f5ebe3;
  --jt-text-muted: #d4a88a;
  --jt-text-faint: #ac856e;
  --jt-text-heading: #e8c0a0;
  --jt-link: #d4a574;
  --jt-link-hover: #f0c898;
  --jt-scroll-track: #1a100c;
  --jt-scroll-thumb1: #cd7f32;
  --jt-scroll-thumb2: #8b5a2e;
  --jt-badge-green-bg: #2a3428;
  --jt-badge-red-bg: #3a2020;
  --jt-badge-yellow-bg: #3a3020;
  --jt-badge-gray-bg: #2a2620;
  --jt-badge-blue-bg: #1a2830;
  --jt-badge-orange-bg: #3a2818;
  --jt-pin-bg: #2e2018;
  --jt-pin-border: #6b4a38;
  --jt-pin-hover-bg: #3a2820;
  --jt-pin-on-surface: #f0dcc8;
  --jt-pin-muted: rgba(255, 255, 255, 0.28);
  --jt-pin-checked-bg: #8b5a2e;
  --jt-pin-checked-label: #f5d898;
  --jt-pin-drag-bg: #6b4428;
}

/* Silver: cool gunmetal-taupe + gray leather (light) */
html[data-ui-theme="silver"] {
  color-scheme: light;
  --jt-bg-page: #d0d4d8;
  --jt-bg-elevated: #d8dce0;
  --jt-bg-sidebar: #bcc4cc;
  --jt-bg-topbar: #ccd0d8;
  --jt-bg-card: #f0f2f5;
  --jt-bg-input: #f6f8fa;
  --jt-bg-table-head: #e4e8ec;
  --jt-bg-hover: #d8dce4;
  --jt-bg-row-hover: #e8ecf2;
  --jt-border: #8898a8;
  --jt-border-soft: #a8b4c0;
  --jt-text: #1a1e24;
  --jt-text-muted: #3e4854;
  --jt-text-faint: #5a6674;
  --jt-text-heading: #222830;
  --jt-link: #5a6a78;
  --jt-link-hover: #788898;
  --jt-scroll-track: #bcc4cc;
  --jt-scroll-thumb1: #a8b8c8;
  --jt-scroll-thumb2: #788898;
  --jt-badge-green-bg: #c8dcd0;
  --jt-badge-red-bg: #e8d0d0;
  --jt-badge-yellow-bg: #e8e4c8;
  --jt-badge-gray-bg: #dce0e4;
  --jt-badge-blue-bg: #c8d8e8;
  --jt-badge-orange-bg: #e8dcd4;
  --jt-pin-bg: #404850;
  --jt-pin-border: #586068;
  --jt-pin-hover-bg: #4a545c;
  --jt-pin-on-surface: #f0f2f5;
  --jt-pin-muted: rgba(255, 255, 255, 0.4);
  --jt-pin-checked-bg: #3a4858;
  --jt-pin-checked-label: #c8d8e8;
  --jt-pin-drag-bg: #2a3848;
}

/* Silver soft: brushed platinum parchment (light) */
html[data-ui-theme="silver-soft"] {
  color-scheme: light;
  --jt-bg-page: #e4e8ec;
  --jt-bg-elevated: #eceef2;
  --jt-bg-sidebar: #d4d8dc;
  --jt-bg-topbar: #dce0e4;
  --jt-bg-card: #f8f9fb;
  --jt-bg-input: #fcfdfe;
  --jt-bg-table-head: #f0f2f5;
  --jt-bg-hover: #e4e8ee;
  --jt-bg-row-hover: #f2f4f8;
  --jt-border: #b8c0c8;
  --jt-border-soft: #ccd4dc;
  --jt-text: #1c2028;
  --jt-text-muted: #404850;
  --jt-text-faint: #5c646c;
  --jt-text-heading: #242830;
  --jt-link: #63727f;
  --jt-link-hover: #90a0b0;
  --jt-scroll-track: #d4d8dc;
  --jt-scroll-thumb1: #c0ccd8;
  --jt-scroll-thumb2: #90a0b0;
  --jt-badge-green-bg: #dce8e0;
  --jt-badge-red-bg: #f0dcd8;
  --jt-badge-yellow-bg: #f0f0d8;
  --jt-badge-gray-bg: #e8eaee;
  --jt-badge-blue-bg: #d8e4f0;
  --jt-badge-orange-bg: #f0e8e4;
  --jt-pin-bg: #485058;
  --jt-pin-border: #606870;
  --jt-pin-hover-bg: #545c64;
  --jt-pin-on-surface: #f8f9fb;
  --jt-pin-muted: rgba(255, 255, 255, 0.42);
  --jt-pin-checked-bg: #4a5868;
  --jt-pin-checked-label: #d8e8f8;
  --jt-pin-drag-bg: #3a4858;
}

/* Silver dark: gunmetal + charcoal leather (dark) */
html[data-ui-theme="silver-dark"] {
  color-scheme: dark;
  --jt-bg-page: #12141a;
  --jt-bg-elevated: #1a1e24;
  --jt-bg-sidebar: #0c0e12;
  --jt-bg-topbar: #0c0e12;
  --jt-bg-card: #222830;
  --jt-bg-input: #161a20;
  --jt-bg-table-head: #181c24;
  --jt-bg-hover: #2c3440;
  --jt-bg-row-hover: #262c38;
  --jt-border: #4a5a6c;
  --jt-border-soft: #343c48;
  --jt-text: #e8eaef;
  --jt-text-muted: #a8b4c0;
  --jt-text-faint: #8492a1;
  --jt-text-heading: #d0d8e0;
  --jt-link: #a8b8c8;
  --jt-link-hover: #d0dce8;
  --jt-scroll-track: #12141a;
  --jt-scroll-thumb1: #788898;
  --jt-scroll-thumb2: #4a5a6c;
  --jt-badge-green-bg: #1a2a24;
  --jt-badge-red-bg: #301a24;
  --jt-badge-yellow-bg: #2a2a1a;
  --jt-badge-gray-bg: #242830;
  --jt-badge-blue-bg: #1a2838;
  --jt-badge-orange-bg: #30241a;
  --jt-pin-bg: #222830;
  --jt-pin-border: #4a5a6c;
  --jt-pin-hover-bg: #2c3440;
  --jt-pin-on-surface: #e8ecf1;
  --jt-pin-muted: rgba(255, 255, 255, 0.28);
  --jt-pin-checked-bg: #4a5a6c;
  --jt-pin-checked-label: #d0dce8;
  --jt-pin-drag-bg: #3a4858;
}

/* Stealers (id: steelers): black + gold (dark base) */
html[data-ui-theme="steelers"] {
  color-scheme: dark;
  --jt-bg-page: #0c0c0e;
  --jt-bg-elevated: #161618;
  --jt-bg-sidebar: #08080a;
  --jt-bg-topbar: #08080a;
  --jt-bg-card: #1c1c20;
  --jt-bg-input: #121214;
  --jt-bg-table-head: #15151a;
  --jt-bg-hover: #22222a;
  --jt-bg-row-hover: #1d1d22;
  --jt-border: #4a4030;
  --jt-border-soft: #2e2820;
  --jt-text: #f5edd5;
  --jt-text-muted: #c8b888;
  --jt-text-faint: #928669;
  --jt-text-heading: #ffb612;
  --jt-link: #ffb612;
  --jt-link-hover: #ffd462;
  --jt-scroll-track: #15151a;
  --jt-scroll-thumb1: #b88600;
  --jt-scroll-thumb2: #6e5008;
  --jt-badge-green-bg: #2a3a1e;
  --jt-badge-red-bg: #3a1818;
  --jt-badge-yellow-bg: #3d2e0a;
  --jt-badge-gray-bg: #25252a;
  --jt-badge-blue-bg: #1a2540;
  --jt-badge-orange-bg: #3a2a0c;
  --jt-pin-bg: #1c1c20;
  --jt-pin-border: #4a4030;
  --jt-pin-hover-bg: #2a2620;
  --jt-pin-on-surface: #fce6a8;
  --jt-pin-muted: rgba(255, 255, 255, 0.3);
  --jt-pin-checked-bg: #b88600;
  --jt-pin-checked-label: #fff5d0;
  --jt-pin-drag-bg: #6e5008;
}

/* Auto: follows OS light/dark using the same token stacks as light / dark themes */
@media (prefers-color-scheme: dark) {
  html[data-ui-theme="auto"] {
    color-scheme: dark;
    /* Neutral charcoal: no green or blue cast (vs Sage / Dusk) */
    --jt-bg-page: #1c1c1c;
    --jt-bg-elevated: #222222;
    --jt-bg-sidebar: #181818;
    --jt-bg-topbar: #181818;
    --jt-bg-card: #262626;
    --jt-bg-input: #1a1a1a;
    --jt-bg-table-head: #1a1a1a;
    --jt-bg-hover: #252525;
    --jt-bg-row-hover: #222;
    --jt-border: #333;
    --jt-border-soft: #2a2a2a;
    --jt-text: #eaeaea;
    --jt-text-muted: #b4b4b4;
    --jt-text-faint: #8e8e8e;
    --jt-text-heading: #e8eaed;
    --jt-link: #58a6ff;
    --jt-link-hover: #79b8ff;
    --jt-scroll-track: #1a1a1a;
    --jt-scroll-thumb1: #2a4a35;
    --jt-scroll-thumb2: #1e3528;
    --jt-badge-green-bg: #0d2e1a;
    --jt-badge-red-bg: #2e0d0d;
    --jt-badge-yellow-bg: #2e2a0d;
    --jt-badge-gray-bg: #252525;
    --jt-badge-blue-bg: #0d1e2e;
    --jt-badge-orange-bg: #2e1e0d;
    --jt-pin-bg: #242424;
    --jt-pin-border: #383838;
    --jt-pin-hover-bg: #2c2c2c;
    --jt-pin-on-surface: #c8c8c8;
    --jt-pin-muted: rgba(255, 255, 255, 0.28);
    --jt-pin-checked-bg: #0d2818;
    --jt-pin-checked-label: #3fb950;
    --jt-pin-drag-bg: #0f2a16;
    --jt-list-bg: #242424;
    --jt-reader-bg: #1a1a1a;
    --jt-list-text: #f0f0f0;
    --jt-reader-text: #f5f5f5;
    --jt-list-muted: #d0d0d0;
    --jt-reader-muted: #d4d4d4;
  }
}

@media (prefers-color-scheme: light) {
  html[data-ui-theme="auto"] {
    color-scheme: light;
    /* Cool gray: no pure white sheets; easier adjacent surfaces */
    --jt-bg-page: #d8dee8;
    --jt-bg-elevated: #e6ebf2;
    --jt-bg-sidebar: #e8edf4;
    --jt-bg-topbar: #e8edf4;
    --jt-bg-card: #eef2f7;
    --jt-bg-input: #e4e9f1;
    --jt-bg-table-head: #dfe5ee;
    --jt-bg-hover: #dde3ed;
    --jt-bg-row-hover: #e8edf5;
    --jt-border: #aab4c2;
    --jt-border-soft: #c5ceda;
    --jt-text: #2d333b;
    --jt-text-muted: #5a626d;
    --jt-text-faint: #656c76;
    --jt-text-heading: #323840;
    --jt-link: #0969da;
    --jt-link-hover: #0550ae;
    --jt-scroll-track: #e8ecf0;
    --jt-scroll-thumb1: #96c4a8;
    --jt-scroll-thumb2: #6ea37f;
    --jt-badge-green-bg: #dafbe1;
    --jt-badge-red-bg: #ffebe9;
    --jt-badge-yellow-bg: #fff8c5;
    --jt-badge-gray-bg: #f6f8fa;
    --jt-badge-blue-bg: #ddf4ff;
    --jt-badge-orange-bg: #fff1e5;
    --jt-pin-bg: #4a5563;
    --jt-pin-border: #5f6b7a;
    --jt-pin-hover-bg: #545f6e;
    --jt-pin-on-surface: #e8ecf1;
    --jt-pin-muted: rgba(255, 255, 255, 0.4);
    --jt-pin-checked-bg: #1e3a2d;
    --jt-pin-checked-label: #9ee6b4;
    --jt-pin-drag-bg: #243d30;
    --jt-list-bg: #e8ecf2;
    --jt-reader-bg: #f2f5fa;
    --jt-list-text: #252930;
    --jt-reader-text: #1e242c;
    --jt-list-muted: #3e4652;
    --jt-reader-muted: #3a424e;
  }
}

/* ----------------------------------------------------------------------


html[data-ui-theme="contactrol"] {
  --jt-btn-primary-bg: #cd7f32;
  --jt-btn-primary-bg-hover: color-mix(in srgb, #cd7f32 82%, #fff);
  --jt-btn-primary-border: color-mix(in srgb, #cd7f32 65%, #1a1410);
}



@media (prefers-color-scheme: light) {
  html[data-ui-theme="auto"] {
    color-scheme: light;
    /* Cool gray: no pure white sheets; easier adjacent surfaces */
    --jt-bg-page: #d8dee8;
    --jt-bg-elevated: #e6ebf2;
    --jt-bg-sidebar: #e8edf4;
    --jt-bg-topbar: #e8edf4;
    --jt-bg-card: #eef2f7;
    --jt-bg-input: #e4e9f1;
    --jt-bg-table-head: #dfe5ee;
    --jt-bg-hover: #dde3ed;
    --jt-bg-row-hover: #e8edf5;
    --jt-border: #aab4c2;
    --jt-border-soft: #c5ceda;
    --jt-text: #2d333b;
    --jt-text-muted: #5a626d;
    --jt-text-faint: #656c76;
    --jt-text-heading: #323840;
    --jt-link: #0969da;
    --jt-link-hover: #0550ae;
    --jt-scroll-track: #e8ecf0;
    --jt-scroll-thumb1: #96c4a8;
    --jt-scroll-thumb2: #6ea37f;
    --jt-badge-green-bg: #dafbe1;
    --jt-badge-red-bg: #ffebe9;
    --jt-badge-yellow-bg: #fff8c5;
    --jt-badge-gray-bg: #f6f8fa;
    --jt-badge-blue-bg: #ddf4ff;
    --jt-badge-orange-bg: #fff1e5;
    --jt-pin-bg: #4a5563;
    --jt-pin-border: #5f6b7a;
    --jt-pin-hover-bg: #545f6e;
    --jt-pin-on-surface: #e8ecf1;
    --jt-pin-muted: rgba(255, 255, 255, 0.4);
    --jt-pin-checked-bg: #1e3a2d;
    --jt-pin-checked-label: #9ee6b4;
    --jt-pin-drag-bg: #243d30;
    --jt-list-bg: #e8ecf2;
    --jt-reader-bg: #f2f5fa;
    --jt-list-text: #252930;
    --jt-reader-text: #1e242c;
    --jt-list-muted: #3e4652;
    --jt-reader-muted: #3a424e;
  }
}


/* Geometry: all UI themes */
html[data-ui-theme] {
  --jt-radius-xs: 4px;
  --jt-radius-sm: 6px;
  --jt-radius-md: 10px;
  --jt-radius-lg: 12px;
  --jt-radius-pill: 9999px;
}

/* Default CTA fill = theme link (not tenant --primary). Brand themes override below. */
html[data-ui-theme] {
  --jt-btn-primary-bg: var(--jt-link);
  --jt-btn-primary-bg-hover: color-mix(in srgb, var(--jt-btn-primary-bg) 82%, #fff);
  --jt-btn-primary-border: color-mix(in srgb, var(--jt-btn-primary-bg) 72%, #000);
}

/* Seahawks: action green CTAs on light blue chrome */
html[data-ui-theme="hawks"] {
  --jt-btn-primary-bg: #3a7e1f;
  --jt-btn-primary-bg-hover: color-mix(in srgb, #3a7e1f 82%, #fff);
  --jt-btn-primary-border: color-mix(in srgb, #3a7e1f 72%, #000);
}

/* BSU / Miami CTA tokens live in palette blocks; repeat after defaults so source order wins. */
html[data-ui-theme="bsu"] {
  --jt-btn-primary-bg: #d64309;
  --jt-btn-primary-bg-hover: #e85a20;
  --jt-btn-primary-border: #9a3006;
}
html[data-ui-theme="miami"] {
  --jt-btn-primary-bg: #ff40a0;
  --jt-btn-primary-bg-hover: color-mix(in srgb, #ff40a0 82%, #fff);
  --jt-btn-primary-border: color-mix(in srgb, #ff40a0 72%, #000);
}
html[data-ui-theme="irish"] {
  --jt-btn-primary-bg: #c99700;
  --jt-btn-primary-bg-hover: color-mix(in srgb, #c99700 82%, #fff);
  --jt-btn-primary-border: color-mix(in srgb, #c99700 72%, #000);
}
html[data-ui-theme="dawgs"] {
  --jt-btn-primary-bg: #b7a57a;
  --jt-btn-primary-bg-hover: color-mix(in srgb, #b7a57a 82%, #fff);
  --jt-btn-primary-border: color-mix(in srgb, #b7a57a 65%, #4b2e83);
}
html[data-ui-theme="chargers"] {
  --jt-btn-primary-bg: #ffc20e;
  --jt-btn-primary-bg-hover: color-mix(in srgb, #ffc20e 82%, #fff);
  --jt-btn-primary-border: color-mix(in srgb, #ffc20e 65%, #002a5c);
}
html[data-ui-theme="contactrol"] {
  --jt-btn-primary-bg: #cd7f32;
  --jt-btn-primary-bg-hover: color-mix(in srgb, #cd7f32 82%, #fff);
  --jt-btn-primary-border: color-mix(in srgb, #cd7f32 65%, #1a1410);
}


/* --- engine layer: theme-wood.css --- */
/**
 * Jobtrol: Ron Burgundy + Royal Cream wood/leather stack (Contactrol v54 parity).
 * Surgical port: gutter grain cover/no-repeat, leather sidebar + content mats, leather topbar only.
 * Loaded after theme-tokens.css; style themes use :not([data-ui-theme]): palette mode unchanged.
 */
@import url("trol-theme-core.css");
@import url("ron-burgundy-tokens.css");
:root,
html {
  --et-woodgrain-teak: none;
  --et-woodgrain-burl: none;
  --et-woodgrain-exotic: none;
  --et-woodgrain-mahogany: none;
  --et-woodgrain-tigerwood: none;
  --et-woodgrain-walnut: none;
  --et-woodgrain-cherry: none;
  --et-woodgrain-rosewood: none;
  --et-woodgrain-layer: none;
  --et-wood-bezel-layer: none;
  --et-woodgrain-opacity: 0.55;
  --et-wood-bezel-opacity: 0.55;
  --et-wood-hue-rotate: -12deg;
  --et-wood-saturate: 1.14;
  --et-wood-sepia: 0.22;
  --et-wood-contrast: 1.18;
  --et-wood-filter: sepia(var(--et-wood-sepia, 0.22)) hue-rotate(var(--et-wood-hue-rotate, -12deg)) saturate(var(--et-wood-saturate, 1.14)) contrast(var(--et-wood-contrast, 1.18));
  --et-leather-layer: none;
  --et-leather-opacity: 1;
  --trol-panel-radius: 10px;
  --jt-shell-inset-pad: 14px;
}

/* --- Style axis (wood + flat styles for bundle import) --- */
html[data-style="ron-burgundy"] {
  color-scheme: dark;
  --surface-base: #261a14;
  --surface-card: linear-gradient(180deg, #302218 0%, #261a14 100%);
  --surface-elev: #342418;
  --text-strong: #f5e9d5;
  --text: #e8d9bf;
  --text-muted: #c9ad86;
  --border: rgba(212, 165, 116, 0.18);
  --border-soft: rgba(212, 165, 116, 0.12);
  --shadow-inset: inset 0 1px 0 rgba(255, 220, 170, 0.06);
  --shadow-elev: 0 4px 16px rgba(0, 0, 0, 0.5), 0 1px 2px rgba(0, 0, 0, 0.4);
  --row-hover: rgba(212, 165, 116, 0.08);
  --input-bg: rgba(0, 0, 0, 0.25);
  --surface-texture: var(--et-leather-layer);
  --et-leather-opacity: 1;
  --et-leather-grain-opacity: 0.62;
  --et-leather-layer:
    radial-gradient(ellipse 95% 70% at 12% 8%, color-mix(in srgb, #a07040 24%, transparent) 0%, transparent 58%),
    radial-gradient(ellipse 80% 65% at 88% 92%, color-mix(in srgb, #1a1008 14%, transparent) 0%, transparent 52%),
    radial-gradient(ellipse 55% 45% at 48% 42%, color-mix(in srgb, #4a3020 20%, transparent) 0%, transparent 68%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='256' height='256' viewBox='0 0 256 256'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.18' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.09 0 0 0 0 0.055 0 0 0 0 0.04 0 0 0 0.4 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --et-woodgrain-teak: url("https://thetrols.com/assets/textures/wood-teak.svg");
  --et-woodgrain-burl: url("https://thetrols.com/assets/textures/wood-burl.svg");
  --et-woodgrain-exotic: url("https://thetrols.com/assets/textures/wood-exotic.svg");
  --et-woodgrain-mahogany: url("https://thetrols.com/assets/textures/wood-mahogany.svg");
  --et-woodgrain-tigerwood: url("https://thetrols.com/assets/textures/wood-tigerwood.svg");
  --et-woodgrain-walnut: url("https://thetrols.com/assets/textures/wood-walnut.svg");
  --et-woodgrain-cherry: url("https://thetrols.com/assets/textures/wood-cherry.svg");
  --et-woodgrain-rosewood: url("https://thetrols.com/assets/textures/wood-rosewood.svg");
  --et-woodgrain-layer: var(--et-woodgrain-burl);
  --et-wood-bezel-layer: var(--et-woodgrain-layer);
}

html[data-style="ron-burgundy"][data-et-woodgrain-species="teak"]:not([data-ui-theme]) {
  --et-woodgrain-layer: var(--et-woodgrain-teak);
  --et-wood-bezel-layer: var(--et-woodgrain-teak);
}

html[data-style="ron-burgundy"][data-et-woodgrain-species="burl"]:not([data-ui-theme]) {
  --et-woodgrain-layer: var(--et-woodgrain-burl);
  --et-wood-bezel-layer: var(--et-woodgrain-burl);
}

html[data-style="ron-burgundy"][data-et-woodgrain-species="exotic"]:not([data-ui-theme]) {
  --et-woodgrain-layer: var(--et-woodgrain-exotic);
  --et-wood-bezel-layer: var(--et-woodgrain-exotic);
}

html[data-style="ron-burgundy"][data-et-woodgrain-species="mahogany"]:not([data-ui-theme]) {
  --et-woodgrain-layer: var(--et-woodgrain-mahogany);
  --et-wood-bezel-layer: var(--et-woodgrain-mahogany);
}

html[data-style="ron-burgundy"][data-et-woodgrain-species="tigerwood"]:not([data-ui-theme]) {
  --et-woodgrain-layer: var(--et-woodgrain-tigerwood);
  --et-wood-bezel-layer: var(--et-woodgrain-tigerwood);
}

html[data-style="ron-burgundy"][data-et-woodgrain-species="walnut"]:not([data-ui-theme]) {
  --et-woodgrain-layer: var(--et-woodgrain-walnut);
  --et-wood-bezel-layer: var(--et-woodgrain-walnut);
}

html[data-style="ron-burgundy"][data-et-woodgrain-species="cherry"]:not([data-ui-theme]) {
  --et-woodgrain-layer: var(--et-woodgrain-cherry);
  --et-wood-bezel-layer: var(--et-woodgrain-cherry);
}

html[data-style="ron-burgundy"][data-et-woodgrain-species="rosewood"]:not([data-ui-theme]) {
  --et-woodgrain-layer: var(--et-woodgrain-rosewood);
  --et-wood-bezel-layer: var(--et-woodgrain-rosewood);
}

html[data-style="royal-cream"] {
  color-scheme: dark;
  --surface-base: #322a22;
  --surface-card: linear-gradient(180deg, #443c32 0%, #322a22 100%);
  --surface-elev: #4e463a;
  --text-strong: #faf5e8;
  --text: #ede2cc;
  --text-muted: #d4c4a8;
  --border: rgba(139, 108, 72, 0.32);
  --border-soft: rgba(139, 108, 72, 0.2);
  --shadow-inset: inset 0 1px 0 rgba(255, 235, 200, 0.08);
  --shadow-elev: 0 4px 18px rgba(20, 14, 8, 0.45), 0 1px 2px rgba(0, 0, 0, 0.35);
  --row-hover: rgba(180, 145, 100, 0.1);
  --input-bg: rgba(0, 0, 0, 0.18);
  --surface-texture: var(--et-leather-layer);
  --et-leather-opacity: 1;
  --et-leather-grain-opacity: 0.58;
  --et-leather-layer:
    radial-gradient(ellipse 100% 75% at 14% 10%, color-mix(in srgb, #a88858 16%, transparent) 0%, transparent 56%),
    radial-gradient(ellipse 85% 70% at 86% 90%, color-mix(in srgb, #1e140c 18%, transparent) 0%, transparent 54%),
    radial-gradient(ellipse 50% 40% at 50% 48%, color-mix(in srgb, #4a3a2a 12%, transparent) 0%, transparent 70%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='256' height='256' viewBox='0 0 256 256'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.14' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.09 0 0 0 0 0.06 0 0 0 0 0.04 0 0 0 0.3 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --et-woodgrain-teak: url("https://thetrols.com/assets/textures/wood-teak.svg");
  --et-woodgrain-burl: url("https://thetrols.com/assets/textures/wood-burl.svg");
  --et-woodgrain-exotic: url("https://thetrols.com/assets/textures/wood-exotic.svg");
  --et-woodgrain-mahogany: url("https://thetrols.com/assets/textures/wood-mahogany.svg");
  --et-woodgrain-tigerwood: url("https://thetrols.com/assets/textures/wood-tigerwood.svg");
  --et-woodgrain-walnut: url("https://thetrols.com/assets/textures/wood-walnut.svg");
  --et-woodgrain-cherry: url("https://thetrols.com/assets/textures/wood-cherry.svg");
  --et-woodgrain-rosewood: url("https://thetrols.com/assets/textures/wood-rosewood.svg");
  --et-woodgrain-layer: var(--et-woodgrain-teak);
  --et-wood-bezel-layer: var(--et-woodgrain-layer);
}

html[data-style="royal-cream"][data-et-woodgrain-species="burl"]:not([data-ui-theme]) {
  --et-woodgrain-layer: var(--et-woodgrain-burl);
  --et-wood-bezel-layer: var(--et-woodgrain-burl);
}

html[data-style="royal-cream"][data-et-woodgrain-species="exotic"]:not([data-ui-theme]) {
  --et-woodgrain-layer: var(--et-woodgrain-exotic);
  --et-wood-bezel-layer: var(--et-woodgrain-exotic);
}

html[data-style="royal-cream"][data-et-woodgrain-species="mahogany"]:not([data-ui-theme]) {
  --et-woodgrain-layer: var(--et-woodgrain-mahogany);
  --et-wood-bezel-layer: var(--et-woodgrain-mahogany);
}

html[data-style="royal-cream"][data-et-woodgrain-species="tigerwood"]:not([data-ui-theme]) {
  --et-woodgrain-layer: var(--et-woodgrain-tigerwood);
  --et-wood-bezel-layer: var(--et-woodgrain-tigerwood);
}

html[data-style="royal-cream"][data-et-woodgrain-species="walnut"]:not([data-ui-theme]) {
  --et-woodgrain-layer: var(--et-woodgrain-walnut);
  --et-wood-bezel-layer: var(--et-woodgrain-walnut);
}

html[data-style="royal-cream"][data-et-woodgrain-species="cherry"]:not([data-ui-theme]) {
  --et-woodgrain-layer: var(--et-woodgrain-cherry);
  --et-wood-bezel-layer: var(--et-woodgrain-cherry);
}

html[data-style="royal-cream"][data-et-woodgrain-species="rosewood"]:not([data-ui-theme]) {
  --et-woodgrain-layer: var(--et-woodgrain-rosewood);
  --et-wood-bezel-layer: var(--et-woodgrain-rosewood);
}

html[data-style="modern-light"] {
  color-scheme: light;
  --surface-base: #f1f5f9;
  --surface-card: #ffffff;
  --surface-elev: #e8eef4;
  --text-strong: #0f172a;
  --text: #1e293b;
  --text-muted: #475569;
  --border: #cbd5e1;
  --border-soft: #e2e8f0;
  --row-hover: rgba(15, 23, 42, 0.04);
  --input-bg: #ffffff;
  --surface-texture: none;
}

html[data-style="soft-cream"] {
  color-scheme: light;
  --surface-base: #faf6ef;
  --surface-card: #fffaf0;
  --surface-elev: #ffffff;
  --text-strong: #2c1810;
  --text: #3d2817;
  --text-muted: #5c4a38;
  --border: #ebdfc8;
  --border-soft: #f4ead3;
  --row-hover: rgba(140, 115, 85, 0.06);
  --input-bg: #fffaf0;
  --surface-texture: none;
}

html[data-style="midnight"] {
  color-scheme: dark;
  --surface-base: #000000;
  --surface-card: #0a0a0a;
  --surface-elev: #141414;
  --text-strong: #fafafa;
  --text: #e5e5e5;
  --text-muted: #a3a3a3;
  --border: rgba(255, 255, 255, 0.1);
  --border-soft: rgba(255, 255, 255, 0.07);
  --row-hover: rgba(255, 255, 255, 0.04);
  --input-bg: #0a0a0a;
  --surface-texture: none;
}

html[data-style="slate"] {
  color-scheme: dark;
  --surface-base: #0f172a;
  --surface-card: #1e293b;
  --surface-elev: #334155;
  --text-strong: #f8fafc;
  --text: #cbd5e1;
  --text-muted: #b6c2d1;
  --border: rgba(148, 163, 184, 0.22);
  --border-soft: rgba(148, 163, 184, 0.12);
  --row-hover: rgba(148, 163, 184, 0.08);
  --input-bg: #0f172a;
  --surface-texture: none;
}

/* --- Family + font axes (style mode) --- */
html[data-family="green"]:not([data-ui-theme]) {
  --family: #0c8a62;
  --family-bright: #10966a;
  --family-soft: color-mix(in srgb, #0c8a62 14%, transparent);
  --family-on: #0a0d12;
}

html[data-family="amber"]:not([data-ui-theme]) {
  --family: #e06810;
  --family-bright: #f07828;
  --family-soft: color-mix(in srgb, #e06810 14%, transparent);
  --family-on: #0a0d12;
}

html[data-family="purple"]:not([data-ui-theme]) {
  --family: #9333ea;
  --family-bright: #a855f7;
  --family-soft: color-mix(in srgb, #9333ea 14%, transparent);
  --family-on: #0a0d12;
}

html[data-family="blue"]:not([data-ui-theme]) {
  --family: #2563eb;
  --family-bright: #3b82f6;
  --family-soft: color-mix(in srgb, #2563eb 14%, transparent);
  --family-on: #0a0d12;
}

html[data-family]:not([data-ui-theme]) {
  --jt-accent: var(--family);
  --jt-link: var(--family-bright);
  --jt-link-hover: color-mix(in srgb, var(--family-bright) 82%, #fff);
}

html[data-font="system"] {
  --font-body: -apple-system, system-ui, "Segoe UI", Roboto, sans-serif;
  --font-heading: -apple-system, system-ui, "Segoe UI", Roboto, sans-serif;
}

html[data-font="inter"] {
  --font-body: "Inter", -apple-system, system-ui, "Segoe UI", Roboto, sans-serif;
  --font-heading: "Inter", -apple-system, system-ui, "Segoe UI", Roboto, sans-serif;
}

html[data-font="playfair-lora"] {
  --font-heading: "Playfair Display", Georgia, "Times New Roman", serif;
  --font-body: "Lora", Georgia, "Times New Roman", serif;
}

html[data-font="oswald"] {
  --font-heading: "Oswald", -apple-system, system-ui, "Segoe UI", Roboto, sans-serif;
  --font-body: "Inter", -apple-system, system-ui, "Segoe UI", Roboto, sans-serif;
}

html[data-font="roboto"] {
  --font-heading: "Roboto", -apple-system, system-ui, "Segoe UI", sans-serif;
  --font-body: "Roboto", -apple-system, system-ui, "Segoe UI", sans-serif;
}
html[data-font="open-sans"] {
  --font-heading: "Open Sans", -apple-system, system-ui, "Segoe UI", sans-serif;
  --font-body: "Open Sans", -apple-system, system-ui, "Segoe UI", sans-serif;
}
html[data-font="poppins"] {
  --font-heading: "Poppins", -apple-system, system-ui, "Segoe UI", sans-serif;
  --font-body: "Poppins", -apple-system, system-ui, "Segoe UI", sans-serif;
}
html[data-font="montserrat"] {
  --font-heading: "Montserrat", -apple-system, system-ui, "Segoe UI", sans-serif;
  --font-body: "Montserrat", -apple-system, system-ui, "Segoe UI", sans-serif;
}
html[data-font="lato"] {
  --font-heading: "Lato", -apple-system, system-ui, "Segoe UI", sans-serif;
  --font-body: "Lato", -apple-system, system-ui, "Segoe UI", sans-serif;
}
html[data-font="nunito-sans"] {
  --font-heading: "Nunito Sans", -apple-system, system-ui, "Segoe UI", sans-serif;
  --font-body: "Nunito Sans", -apple-system, system-ui, "Segoe UI", sans-serif;
}

/* --- Wood geometry (Ron Burgundy / Royal Cream) --- */
html[data-style="ron-burgundy"],
html[data-style="royal-cream"] {
  --et-woodgrain-blend: normal;
}

html[data-style="ron-burgundy"]:not([data-ui-theme]) {
  --et-wood-bezel-opacity: 0.72;
  --et-woodgrain-opacity: var(--et-wood-bezel-opacity);
  --et-wood-hue-rotate: -12deg;
  --et-wood-saturate: 1.24;
  --et-wood-sepia: 0.24;
  --et-wood-contrast: 1.18;
  --et-wood-filter: sepia(var(--et-wood-sepia, 0.24)) hue-rotate(var(--et-wood-hue-rotate, -12deg)) saturate(var(--et-wood-saturate, 1.24)) contrast(var(--et-wood-contrast, 1.18));
  --et-wood-bezel-h: 22px;
  --et-wood-top-trim: var(--et-wood-bezel-h);
  --et-wood-right-trim: var(--et-wood-bezel-h);
  --et-wood-gutter-w: var(--et-wood-bezel-h);
  --et-reader-leather-bg: color-mix(in srgb, #2e1c12 46%, var(--surface-base, #261a14));
  --et-list-bg: color-mix(in srgb, var(--surface-elev) 84%, var(--text-strong) 16%);
  --et-wood-cabinet-base: color-mix(in srgb, #0e0804 90%, var(--surface-base, #120c08));
  --et-wood-mat-inset: inset 0 4px 22px rgba(0, 0, 0, 0.55), inset 0 0 0 1px color-mix(in srgb, var(--family-bright, #8a6040) 10%, transparent), inset 0 2px 6px rgba(0, 0, 0, 0.38);
  --jt-shell-inset-pad: var(--et-wood-bezel-h, 22px);
}

html[data-style="royal-cream"]:not([data-ui-theme]) {
  --et-wood-bezel-opacity: 0.75;
  --et-woodgrain-opacity: var(--et-wood-bezel-opacity);
  --et-wood-hue-rotate: -12deg;
  --et-wood-saturate: 1.22;
  --et-wood-sepia: 0.28;
  --et-wood-contrast: 1.16;
  --et-wood-filter: sepia(var(--et-wood-sepia, 0.28)) hue-rotate(var(--et-wood-hue-rotate, -12deg)) saturate(var(--et-wood-saturate, 1.22)) contrast(var(--et-wood-contrast, 1.16));
  --et-wood-bezel-h: 22px;
  --et-wood-top-trim: var(--et-wood-bezel-h);
  --et-wood-right-trim: var(--et-wood-bezel-h);
  --et-wood-gutter-w: var(--et-wood-bezel-h);
  --et-reader-leather-bg: color-mix(in srgb, #2a1e14 68%, var(--surface-base, #322a22));
  --et-list-bg: color-mix(in srgb, var(--surface-elev) 78%, var(--text-strong) 22%);
  --et-wood-cabinet-base: color-mix(in srgb, #120c08 88%, var(--surface-base, #322a22));
  --et-wood-mat-inset: inset 0 4px 22px rgba(0, 0, 0, 0.55), inset 0 0 0 1px color-mix(in srgb, var(--family-bright, #8a6040) 10%, transparent), inset 0 2px 6px rgba(0, 0, 0, 0.38);
  --jt-shell-inset-pad: var(--et-wood-bezel-h, 22px);
}

html[data-style="ron-burgundy"]:not([data-ui-theme])[data-et-woodgrain="off"],
html[data-style="royal-cream"]:not([data-ui-theme])[data-et-woodgrain="off"] {
  --jt-shell-inset-pad: 14px;
}

/* --- --jt-* bridge (style mode) --- */
html[data-style]:not([data-ui-theme]) {
  --jt-bg-page: var(--surface-base);
  --jt-bg-sidebar: var(--surface-base);
  --jt-bg-topbar: var(--surface-base);
  --jt-bg-elevated: var(--surface-elev);
  --jt-bg-card: var(--surface-elev);
  --jt-bg-input: var(--input-bg);
  --jt-bg-hover: var(--row-hover);
  --jt-bg-row-hover: var(--row-hover);
  --jt-border: var(--border);
  --jt-border-soft: var(--border-soft);
  --jt-text: var(--text);
  --jt-text-muted: var(--text-muted);
  --jt-text-faint: var(--text-muted);
  --jt-text-heading: var(--text-strong);
  --jt-btn-primary-bg: var(--family);
  --jt-btn-primary-bg-hover: var(--family-bright);
}

html[data-style]:not([data-ui-theme]) body {
  font-family: var(--font-body);
  background-color: var(--surface-base);
  color: var(--text);
}

html[data-style]:not([data-ui-theme]) .topbar h1 {
  font-family: var(--font-heading);
  color: var(--text-strong);
}

/* --- Wood cabinet: body surround --- */
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) body,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) body {
  background-color: var(--et-wood-cabinet-base, var(--surface-base));
}

/* --- Sidebar leather mat (flat nav: no wood desk between islands) --- */
/* Keep position:fixed from eom.css: position:relative here broke v17 (sidebar in flow → .main starts ~100vh down, black void above content). */
html[data-style="ron-burgundy"]:not([data-ui-theme]) aside.sidebar,
html[data-style="royal-cream"]:not([data-ui-theme]) aside.sidebar {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  z-index: 100;
  isolation: isolate;
  background-color: var(--jt-bg-sidebar, var(--surface-base));
  background-image: var(--et-leather-layer, none);
  background-repeat: no-repeat, repeat;
  background-size: cover, 256px 256px;
  background-blend-mode: overlay, normal;
  border-right-color: color-mix(in srgb, var(--family-bright, #c4a574) 16%, transparent);
}

html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) aside.sidebar::before,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) aside.sidebar::before,
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) aside.sidebar::after,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) aside.sidebar::after {
  content: none;
}

/* --- Topbar leather only (.et-statusrail / .ct-header parity) --- */
html[data-style="ron-burgundy"]:not([data-ui-theme]) div.main > div.topbar,
html[data-style="royal-cream"]:not([data-ui-theme]) div.main > div.topbar {
  position: relative;
  isolation: isolate;
  overflow: visible;
  background-color: var(--jt-bg-topbar, var(--surface-base));
  background-image: var(--et-leather-layer, none);
  background-repeat: no-repeat, repeat;
  background-size: cover, 256px 256px;
  background-blend-mode: overlay, normal;
  border-bottom-color: color-mix(in srgb, var(--family-bright, #c4a574) 28%, transparent);
  box-shadow: inset 0 -1px 0 color-mix(in srgb, var(--family-bright, #c4a574) 18%, transparent);
}

html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) div.main > div.topbar::before,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) div.main > div.topbar::before,
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) div.main > div.topbar::after,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) div.main > div.topbar::after {
  content: none;
}

html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) div.main > div.topbar > *,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) div.main > div.topbar > * {
  position: relative;
  z-index: 2;
}

/* --- Main column: wood cabinet behind topbar + shell (no black eom #0a0a0a strip beside sidebar) --- */
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) div.main,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) div.main {
  background-color: var(--et-wood-cabinet-base, var(--surface-base));
}

/* --- Content area: decorative wood bezel only (eom.css owns padding/flex: no flow hacks) --- */
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) div.main > div.content,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) div.main > div.content {
  position: relative;
  isolation: isolate;
  background-color: transparent;
  background-image: none;
}

html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) div.main > div.content::after,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) div.main > div.content::after {
  content: none;
}

html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) div.main > div.content::before,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) div.main > div.content::before {
  content: "";
  position: fixed;
  top: var(--trol-jt-backdrop-top, 52px);
  right: 0;
  bottom: 0;
  left: var(--trol-jt-backdrop-left, 200px);
  border-radius: calc(var(--trol-panel-radius, 10px) + 2px);
  pointer-events: none;
  z-index: 0;
  background-color: var(--et-wood-cabinet-base, color-mix(in srgb, #0e0804 90%, var(--surface-base)));
  background-image: var(--et-wood-bezel-layer, var(--et-woodgrain-layer));
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  /* Pinned via position:fixed (not bg-attachment:fixed): grain stays put while content scrolls. */
  background-attachment: scroll;
  contain: paint;
  transform: translateZ(0);
  backface-visibility: hidden;
  opacity: var(--et-wood-bezel-opacity, var(--et-woodgrain-opacity, 0.72));
  filter: var(--et-wood-filter);
  mix-blend-mode: var(--et-woodgrain-blend, normal);
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--family-bright, #8a6040) 10%, transparent),
    inset 0 4px 18px rgba(0, 0, 0, 0.48);
}

body.sidebar-collapsed {
  --trol-jt-backdrop-left: 52px;
}

html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) div.main > div.content > *,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) div.main > div.content > * {
  position: relative;
  z-index: 1;
}

/* Wood off: no content-shell padding override */
html[data-style="ron-burgundy"]:not([data-ui-theme])[data-et-woodgrain="off"] div.main > div.content,
html[data-style="royal-cream"]:not([data-ui-theme])[data-et-woodgrain="off"] div.main > div.content {
  background-color: transparent;
  background-image: none;
}

html[data-style="ron-burgundy"]:not([data-ui-theme])[data-et-woodgrain="off"] div.main > div.content::before,
html[data-style="royal-cream"]:not([data-ui-theme])[data-et-woodgrain="off"] div.main > div.content::before {
  content: none;
}

/* Leather mats on inner panels: not the whole .content direct-child shell */
html[data-style="ron-burgundy"]:not([data-ui-theme]) div.main > div.content .card,
html[data-style="royal-cream"]:not([data-ui-theme]) div.main > div.content .card,
html[data-style="ron-burgundy"]:not([data-ui-theme]) div.main > div.content .module,
html[data-style="royal-cream"]:not([data-ui-theme]) div.main > div.content .module,
html[data-style="ron-burgundy"]:not([data-ui-theme]) div.main > div.content .jt-dash-chips-toolbar,
html[data-style="royal-cream"]:not([data-ui-theme]) div.main > div.content .jt-dash-chips-toolbar,
html[data-style="ron-burgundy"]:not([data-ui-theme]) div.main > div.content .jt-dash-stat-rail,
html[data-style="royal-cream"]:not([data-ui-theme]) div.main > div.content .jt-dash-stat-rail {
  background-color: var(--et-reader-leather-bg, var(--surface-elev));
  background-image: var(--et-leather-layer, none);
  background-repeat: no-repeat, repeat;
  background-size: cover, 256px 256px;
  background-blend-mode: overlay, normal;
  box-shadow: var(--et-wood-mat-inset, inset 0 2px 12px rgba(0, 0, 0, 0.38));
}

/* Flat style themes: recessed content mat */
html[data-style="modern-light"]:not([data-ui-theme]) div.main > div.content,
html[data-style="soft-cream"]:not([data-ui-theme]) div.main > div.content,
html[data-style="midnight"]:not([data-ui-theme]) div.main > div.content,
html[data-style="slate"]:not([data-ui-theme]) div.main > div.content {
  background-color: var(--surface-elev);
  border-radius: var(--trol-panel-radius, 10px);
  box-shadow: inset 0 2px 10px color-mix(in srgb, var(--text-strong) 10%, transparent);
}

/* --- Job detail reader panel: leather mat only (v54: no internal wood trim) --- */
html[data-style="ron-burgundy"]:not([data-ui-theme]) .jd-project-shell,
html[data-style="royal-cream"]:not([data-ui-theme]) .jd-project-shell {
  position: relative;
  isolation: isolate;
  border-radius: var(--trol-panel-radius, 10px);
  background-color: var(--et-reader-leather-bg, color-mix(in srgb, #0e0806 72%, var(--surface-base)));
  background-image: var(--et-leather-layer, none);
  background-repeat: no-repeat, repeat;
  background-size: cover, 256px 256px;
  background-blend-mode: overlay, normal;
  box-shadow: var(--et-wood-mat-inset, inset 0 2px 12px rgba(0, 0, 0, 0.38));
}

html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .jd-project-shell::before,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .jd-project-shell::before,
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .jd-project-shell::after,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .jd-project-shell::after {
  content: none;
}

/* No wood on dashboard cards / generic panels */
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .card::before,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .card::after,
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .jt-dash-shell::before,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .jt-dash-shell::after {
  content: none;
}

/* ================================================================== *
 * TASK 1 (2026-05-30): theme-agnostic 3D raised islands
 * When 3D Effects is ON (data-trol-3d="on"), EVERY non-wood theme gets the
 * "floating island over a recessed backdrop" treatment: content panels get
 * an outer drop-shadow + radius so they read as raised above the page
 * backdrop. Wood styles (ron-burgundy/royal-cream) already own the recessed
 * leather treatment and are excluded via :not(). 3D defaults OFF for classic
 * themes (head_include.php), so turning it ON is what produces the islands;
 * OFF returns to flat eom.css panes. Shadows: soft on light themes, deeper
 * on dark themes (token swapped per color-scheme of the theme).
 * ================================================================== */
:root { --trol-island-shadow: 0 1px 3px rgba(0,0,0,0.10), 0 8px 22px rgba(0,0,0,0.14); }
html[data-ui-theme="dark"],
html[data-ui-theme="sage"],
html[data-ui-theme="dusk"],
html[data-ui-theme="contactrol"],
html[data-ui-theme="gold-dark"],
html[data-ui-theme="copper-dark"],
html[data-ui-theme="silver-dark"],
html[data-ui-theme="steelers"],
html[data-style="midnight"]:not([data-ui-theme]),
html[data-style="slate"]:not([data-ui-theme]) {
  --trol-island-shadow: 0 2px 6px rgba(0,0,0,0.5), 0 10px 28px rgba(0,0,0,0.42);
}

/* Recessed page/content backdrop */
html[data-trol-3d="on"]:not([data-style="ron-burgundy"]):not([data-style="royal-cream"]) div.main > div.content {
  background-color: color-mix(in srgb, var(--jt-bg-page, var(--surface-base, #1c1c1c)) 88%, var(--jt-text-heading, var(--text-strong, #000)) 12%);
  border-radius: calc(var(--trol-panel-radius, 10px) + 2px);
}

/* Raised island panels */
html[data-trol-3d="on"]:not([data-style="ron-burgundy"]):not([data-style="royal-cream"]) div.main > div.content .card,
html[data-trol-3d="on"]:not([data-style="ron-burgundy"]):not([data-style="royal-cream"]) div.main > div.content .module,
html[data-trol-3d="on"]:not([data-style="ron-burgundy"]):not([data-style="royal-cream"]) div.main > div.content .jt-dash-chips-toolbar,
html[data-trol-3d="on"]:not([data-style="ron-burgundy"]):not([data-style="royal-cream"]) div.main > div.content .jt-dash-stat-rail {
  border-radius: var(--trol-panel-radius, 10px);
  box-shadow: var(--trol-island-shadow);
}

/* ================================================================== *
 * TASK 2 / P2a (2026-05-30): texture / skins library: calm skins
 * STYLE THEMES ONLY (data-trol-texture set only in style mode). A skin
 * paints either the page BACKDROP (behind the islands) or the ISLAND
 * panels themselves. Texture always rides a ::before/::after layer or an
 * opaque panel fill: NEVER directly under body text (contrast safeguard
 * §P2.6). Island role falls back to backdrop when 3D is off. The two wood
 * styles keep their locked wood cabinet for the "wood" skin (no regression);
 * a non-wood skin on a wood style suppresses the cabinet and paints the skin.
 * ================================================================== */
:root {
  --trol-skin-texture: none;
  --trol-skin-opacity: 0.42;
  /* ── Picker strength knobs (v78): user-driven via the theme modal sliders ──────
     --trol-skin-amount   : opacity multiplier  (Texture amount).  1 = per-texture default.
     --trol-skin-saturate : saturate() factor   (Color amount).    1 = unchanged.
     --trol-skin-depth    : contrast() factor   (3D depth/relief). 1 = unchanged.
     --trol-skin-opacity-cap : hard ceiling on the effective backdrop opacity (busy scrim).
     All default to neutral so existing/auto textures reproduce their tuned defaults
     exactly (no regression); the sliders only ever scale away from these. */
  --trol-skin-amount: 1;
  --trol-skin-saturate: 1;
  --trol-skin-depth: 1;
  --trol-skin-sepia: 0;
  --trol-skin-hue: 0deg;
  --trol-skin-brightness: 1;
  --trol-skin-contrast: 1;
  --trol-skin-gloss: 0.35;
  --trol-skin-opacity-cap: 1;
  --trol-skin-filter: ;
  /* Pattern strength + backdrop readability scrim (Theme Studio textureTone). */
  --trol-texture-opacity: 1;
  /* Pattern size: 100% = default; lower = smaller pattern, higher = zoom in (Theme Studio). */
  --trol-texture-scale: 100;
  --trol-texture-bg-size: 100%;
  --trol-backdrop-scrim-opacity: 0;
  --trol-backdrop-scrim-grad: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  --trol-surface-light-angle: 315deg;
  --trol-surface-light-highlight: 0.5;
  --trol-surface-light-shadow: 0.5;
  --trol-surface-light-hi-grad: none;
  --trol-surface-light-sh-grad: none;
}
/* Photo backdrops (CC0): cover/no-repeat; procedural SVGs demoted to offline fallback only. */
html[data-trol-texture="wood"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-generic.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="leather"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-skin-opacity: 0.98; --trol-skin-filter: saturate(1.02); }
html[data-trol-texture="leather-tan"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-tan.jpg"); --trol-skin-opacity: 0.98; --trol-skin-filter: saturate(1.02); }
html[data-trol-texture="leather-camel"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-camel.jpg"); --trol-skin-opacity: 0.98; --trol-skin-filter: saturate(1.02); }
html[data-trol-texture="leather-saddle"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-saddle.jpg"); --trol-skin-opacity: 0.98; --trol-skin-filter: saturate(1.02); }
html[data-trol-texture="leather-cognac"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-cognac.jpg"); --trol-skin-opacity: 0.98; --trol-skin-filter: saturate(1.02); }
html[data-trol-texture="leather-espresso"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-skin-opacity: 0.98; --trol-skin-filter: saturate(1.02); }
html[data-trol-texture="leather-chocolate"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-chocolate.jpg"); --trol-skin-opacity: 0.98; --trol-skin-filter: saturate(1.02); }
html[data-trol-texture="leather-black"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-black.jpg"); --trol-skin-opacity: 0.98; --trol-skin-filter: saturate(1.02); }
html[data-trol-texture="leather-suede"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-cognac.jpg"); --trol-skin-opacity: 0.98; --trol-skin-filter: saturate(1.02); }
html[data-trol-texture="leather-suede-brown"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-brown.jpg"); --trol-skin-opacity: 0.98; --trol-skin-filter: saturate(1.02); }
html[data-trol-texture="leather-suede-draped"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-draped.jpg"); --trol-skin-opacity: 0.98; --trol-skin-filter: saturate(1.02); }
html[data-trol-texture="stone"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-slate.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="marble"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-classic.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="granite"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-granite.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="teak"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-teak.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="burl"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/wood-burl.svg"); --trol-skin-opacity: 0.5; }
html[data-trol-texture="exotic"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-exotic.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="mahogany"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-mahogany.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="tigerwood"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-tigerwood.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="walnut"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-walnut.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="cherry"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-cherry.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="rosewood"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-rosewood.jpg"); --trol-skin-opacity: 1; }
/* Football turf (natural family: fairly uniform, so NOT busy: no heavy organic
   scrim. Instead a modest opacity cap keeps a fully-saturated field from fighting
   body text on content pages while the mow stripes + fibers still read clearly). */
html[data-trol-texture="turf-green"] {
  --trol-skin-texture: url("https://thetrols.com/assets/textures/skin-turf-green.svg");
  --trol-skin-opacity: 0.5;
  --trol-skin-opacity-cap: 0.62;
}
html[data-trol-texture="turf-blue"] {
  --trol-skin-texture: url("https://thetrols.com/assets/textures/skin-turf-blue.svg");
  --trol-skin-opacity: 0.5;
  --trol-skin-opacity-cap: 0.62;
}
html[data-trol-texture="turf-red"] {
  --trol-skin-texture: url("https://thetrols.com/assets/textures/skin-turf-red.svg");
  --trol-skin-opacity: 0.5;
  --trol-skin-opacity-cap: 0.62;
}

/* Lift content children above the texture backdrop layer (texture sits behind). */
html[data-trol-texture]:not([data-ui-theme]) div.main > div.content { position: relative; isolation: isolate; }
html[data-trol-texture]:not([data-ui-theme]) div.main > div.content > * { position: relative; z-index: 1; }
html[data-trol-texture]:not([data-ui-theme]) div.main > div.topbar {
  position: relative;
  z-index: 2;
  isolation: isolate;
}

/* Sister app folder columns: backdrop skin in column gaps (Daytrol/Emailtrol).
   Contactrol .ctx-filters is a .ctx-shell grid column: NOT viewport-fixed (v278).
   Jobtrol admin uses aside.sidebar with flat .nav-item links (v166): excluded here. */
html[data-trol-texture]:not([data-ui-theme]) .day-sidebar,
html[data-trol-texture]:not([data-ui-theme]) .et-folders-panel {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  z-index: 100;
  isolation: isolate;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-trol-texture]:not([data-ui-theme]) .day-sidebar .day-sidebar-nav,
html[data-trol-texture]:not([data-ui-theme]) .day-sidebar .day-sidebar-foot,
html[data-trol-texture]:not([data-ui-theme]) .et-folders-panel .et-folders-nav,
html[data-trol-texture]:not([data-ui-theme]) .et-folders-panel .et-folders-footer {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-trol-texture][data-trol-texture-role="backdrop"]:not([data-ui-theme]) .day-sidebar::before,
html[data-trol-texture][data-trol-texture-role="island"]:not([data-trol-3d="on"]):not([data-ui-theme]) .day-sidebar::before,
html[data-trol-texture][data-trol-texture-role="backdrop"]:not([data-ui-theme]) .et-folders-panel::before,
html[data-trol-texture][data-trol-texture-role="island"]:not([data-trol-3d="on"]):not([data-ui-theme]) .et-folders-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  contain: paint;
  background-image:
    var(--trol-backdrop-scrim-grad),
    var(--trol-surface-light-sh-grad, none),
    var(--trol-surface-light-hi-grad, none),
    var(--trol-skin-texture, none);
  background-position: center;
  background-size: 100% 100%, 100% 100%, 100% 100%, var(--trol-texture-bg-size, 100%);
  background-repeat: no-repeat;
  background-attachment: scroll;
  opacity: min(var(--trol-skin-opacity-cap, 1), calc(var(--trol-skin-opacity, 0.42) * var(--trol-skin-amount, 1) * var(--trol-texture-opacity, 1) * var(--trol-texture-layer-opacity, 1)));
  filter: sepia(var(--trol-skin-sepia, 0)) hue-rotate(var(--trol-skin-hue, 0deg)) saturate(var(--trol-skin-saturate, 1)) brightness(var(--trol-skin-brightness, 1)) contrast(var(--trol-skin-contrast, var(--trol-skin-depth, 1))) grayscale(var(--trol-skin-grayscale, 0)) var(--trol-skin-filter, );
}

html[data-trol-texture]:not([data-ui-theme]) .day-sidebar > *,
html[data-trol-texture]:not([data-ui-theme]) .et-folders-panel > * {
  position: relative;
  z-index: 1;
}

/* Backdrop layer (role=backdrop, or island role while 3D is off → falls back). */
html[data-trol-texture][data-trol-texture-role="backdrop"]:not([data-ui-theme]) div.main > div.content::after,
html[data-trol-texture][data-trol-texture-role="island"]:not([data-trol-3d="on"]):not([data-ui-theme]) div.main > div.content::after {
  content: "";
  position: fixed;
  top: var(--trol-jt-backdrop-top, 52px);
  right: 0;
  bottom: 0;
  left: var(--trol-jt-backdrop-left, 200px);
  z-index: 0;
  pointer-events: none;
  contain: paint;
  transform: translateZ(0);
  backface-visibility: hidden;
  border-radius: calc(var(--trol-panel-radius, 10px) + 2px);
  background-image:
    var(--trol-backdrop-scrim-grad),
    var(--trol-surface-light-sh-grad, none),
    var(--trol-surface-light-hi-grad, none),
    var(--trol-skin-texture, none);
  background-position: center;
  background-size: 100% 100%, 100% 100%, 100% 100%, var(--trol-texture-bg-size, 100%);
  background-repeat: no-repeat;
  background-attachment: scroll;
  opacity: min(var(--trol-skin-opacity-cap, 1), calc(var(--trol-skin-opacity, 0.42) * var(--trol-skin-amount, 1) * var(--trol-texture-opacity, 1) * var(--trol-texture-layer-opacity, 1)));
  filter: sepia(var(--trol-skin-sepia, 0)) hue-rotate(var(--trol-skin-hue, 0deg)) saturate(var(--trol-skin-saturate, 1)) brightness(var(--trol-skin-brightness, 1)) contrast(var(--trol-skin-contrast, var(--trol-skin-depth, 1))) grayscale(var(--trol-skin-grayscale, 0)) var(--trol-skin-filter, );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, calc(var(--trol-skin-gloss, 0.35) * 0.1));
}
/* Backdrop-only readability scrim: dark wash over the pattern layer, not floating islands. */
html[data-trol-texture][data-trol-texture-role="backdrop"],
html[data-trol-texture][data-trol-texture-role="island"]:not([data-trol-3d="on"]) {
  --trol-backdrop-scrim-grad: linear-gradient(rgba(0, 0, 0, var(--trol-backdrop-scrim-opacity, 0)), rgba(0, 0, 0, var(--trol-backdrop-scrim-opacity, 0)));
}
/* Wood style + "wood" skin (auto default) keeps the locked cabinet: no extra layer. */
html[data-style="ron-burgundy"][data-trol-texture="wood"]:not([data-ui-theme]) div.main > div.content::after,
html[data-style="royal-cream"][data-trol-texture="wood"]:not([data-ui-theme]) div.main > div.content::after {
  background-image: none;
  opacity: 0;
}
/* Wood style + a NON-wood skin: suppress the wood cabinet so the chosen skin shows. */
html[data-style="ron-burgundy"][data-trol-texture]:not([data-trol-texture="wood"]):not([data-ui-theme]) div.main > div.content::before,
html[data-style="royal-cream"][data-trol-texture]:not([data-trol-texture="wood"]):not([data-ui-theme]) div.main > div.content::before {
  background-image: none;
  box-shadow: none;
  opacity: 0;
}

/* Island role + 3D on: texture rides the raised panels under their opaque fill
   (soft-light blend keeps body text legible). Wood styles keep their leather mats. */
html[data-trol-texture][data-trol-texture-role="island"][data-trol-3d="on"]:not([data-style="ron-burgundy"]):not([data-style="royal-cream"]):not([data-ui-theme]) div.main > div.content .card,
html[data-trol-texture][data-trol-texture-role="island"][data-trol-3d="on"]:not([data-style="ron-burgundy"]):not([data-style="royal-cream"]):not([data-ui-theme]) div.main > div.content .module,
html[data-trol-texture][data-trol-texture-role="island"][data-trol-3d="on"]:not([data-style="ron-burgundy"]):not([data-style="royal-cream"]):not([data-ui-theme]) div.main > div.content .jt-dash-chips-toolbar,
html[data-trol-texture][data-trol-texture-role="island"][data-trol-3d="on"]:not([data-style="ron-burgundy"]):not([data-style="royal-cream"]):not([data-ui-theme]) div.main > div.content .jt-dash-stat-rail {
  background-image:
    linear-gradient(rgba(0, 0, 0, var(--trol-backdrop-scrim-opacity, 0)), rgba(0, 0, 0, var(--trol-backdrop-scrim-opacity, 0))),
    var(--trol-skin-texture, none);
  background-position: center;
  background-size: 100% 100%, var(--trol-texture-bg-size, 100%);
  background-repeat: no-repeat;
  background-blend-mode: soft-light;
  opacity: min(var(--trol-skin-opacity-cap, 1), calc(var(--trol-skin-opacity, 0.42) * var(--trol-skin-amount, 1) * var(--trol-texture-opacity, 1) * var(--trol-texture-layer-opacity, 1)));
}

/* ================================================================== *
 * TASK 2 / P2b (2026-05-30): expanded catalog + textures on ALL themes
 * New calm stone skins (travertine, carrara) + busy organic skins
 * (tiger/leopard/zebra/alligator/lizard/ostrich). The style-only gate is
 * REMOVED: textures now paint on palette themes too (additive [data-ui-theme]
 * rules below). Busy organics get an opacity cap + light blur (scrim) and
 * always ride a ::after layer BEHIND opaque content / under a soft-light panel
 * fill, so text stays AA-legible on any theme. (Accent picker stays style-only.)
 * ================================================================== */
html[data-trol-texture="travertine"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-travertine.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="carrara"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="carrara-bold"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara-bold.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="calacatta"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-calacatta.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="marble-white"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-white.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="marble-light-grey"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-light-grey.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="marble-cloud"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-cloud.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="desert-eyes"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-desert-eyes.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="tiger"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-stripes.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="tiger-fur-gold"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur-gold.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="sawtooth-print"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="wrinkled-hide"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-wrinkled-hide.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="jaguar-rosettes"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-jaguar-rosettes.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="pebbled-leather"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-pebbled-leather.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="leopard"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-leopard.webp"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="zebra"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/fur-zebra.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="elephant"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-elephant.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="basket-weave"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/textile-basket-weave.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="linen"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/textile-linen.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="canvas"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/textile-canvas.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="tweed"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/textile-tweed.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="carpet"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/textile-carpet.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="denim"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/textile-denim.jpg"); --trol-skin-opacity: 1; }
html[data-trol-texture="alligator"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="alligator-cognac"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-cognac.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="alligator-black"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-black.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="alligator-teal"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-teal.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="alligator-white"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-white.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="alligator-ivory"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-ivory.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="croc"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-croc.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="lizard"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-lizard.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="ostrich"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="ostrich-navy"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-navy.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="ostrich-olive"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-olive.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="quill-dots"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-quill-dots.jpg"); --trol-skin-opacity: 0.92; }
html[data-trol-texture="snake"] { --trol-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-snake.jpg"); --trol-skin-opacity: 0.92; }

/* Busy organics: legibility scrim: hard opacity cap + slight blur + desat so a
   loud skin (leopard/tiger backdrop on a light theme, zebra on dark) never fights
   overlaid chrome. Placed AFTER the per-skin blocks so it wins on equal specificity. */
html[data-trol-texture-busy="1"] {
  --trol-skin-opacity: 0.58;
  /* User-driven pattern strength + backdrop dim replace the old hard ceiling for loud organics. */
  --trol-skin-opacity-cap: 0.92;
  --trol-skin-filter: saturate(1.02) blur(0.25px);
}

/* ── Textures on PALETTE themes (P2b: every theme coverage) ─────────────────── */
html[data-ui-theme][data-trol-texture] div.main > div.content { position: relative; isolation: isolate; }
html[data-ui-theme][data-trol-texture] div.main > div.content > * { position: relative; z-index: 1; }
html[data-ui-theme][data-trol-texture] div.main > div.topbar {
  position: relative;
  z-index: 2;
  isolation: isolate;
}
html[data-ui-theme][data-trol-texture][data-trol-texture-role="backdrop"] div.main > div.content::after,
html[data-ui-theme][data-trol-texture][data-trol-texture-role="island"]:not([data-trol-3d="on"]) div.main > div.content::after {
  content: "";
  position: fixed;
  top: var(--trol-jt-backdrop-top, 52px);
  right: 0;
  bottom: 0;
  left: var(--trol-jt-backdrop-left, 200px);
  z-index: 0;
  pointer-events: none;
  contain: paint;
  transform: translateZ(0);
  backface-visibility: hidden;
  border-radius: calc(var(--trol-panel-radius, 10px) + 2px);
  background-image:
    var(--trol-backdrop-scrim-grad),
    var(--trol-surface-light-sh-grad, none),
    var(--trol-surface-light-hi-grad, none),
    var(--trol-skin-texture, none);
  background-position: center;
  background-size: 100% 100%, 100% 100%, 100% 100%, var(--trol-texture-bg-size, 100%);
  background-repeat: no-repeat;
  background-attachment: scroll;
  opacity: min(var(--trol-skin-opacity-cap, 1), calc(var(--trol-skin-opacity, 0.42) * var(--trol-skin-amount, 1) * var(--trol-texture-opacity, 1) * var(--trol-texture-layer-opacity, 1)));
  filter: sepia(var(--trol-skin-sepia, 0)) hue-rotate(var(--trol-skin-hue, 0deg)) saturate(var(--trol-skin-saturate, 1)) brightness(var(--trol-skin-brightness, 1)) contrast(var(--trol-skin-contrast, var(--trol-skin-depth, 1))) grayscale(var(--trol-skin-grayscale, 0)) var(--trol-skin-filter, );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, calc(var(--trol-skin-gloss, 0.35) * 0.1));
}
html[data-ui-theme][data-trol-texture][data-trol-texture-role="backdrop"],
html[data-ui-theme][data-trol-texture][data-trol-texture-role="island"]:not([data-trol-3d="on"]) {
  --trol-backdrop-scrim-grad: linear-gradient(rgba(0, 0, 0, var(--trol-backdrop-scrim-opacity, 0)), rgba(0, 0, 0, var(--trol-backdrop-scrim-opacity, 0)));
}
/* Island role + 3D on (palette): texture rides the raised panels under their opaque
   fill (soft-light blend keeps body text legible). */
html[data-ui-theme][data-trol-texture][data-trol-texture-role="island"][data-trol-3d="on"] div.main > div.content .card,
html[data-ui-theme][data-trol-texture][data-trol-texture-role="island"][data-trol-3d="on"] div.main > div.content .module,
html[data-ui-theme][data-trol-texture][data-trol-texture-role="island"][data-trol-3d="on"] div.main > div.content .jt-dash-chips-toolbar,
html[data-ui-theme][data-trol-texture][data-trol-texture-role="island"][data-trol-3d="on"] div.main > div.content .jt-dash-stat-rail {
  background-image:
    linear-gradient(rgba(0, 0, 0, var(--trol-backdrop-scrim-opacity, 0)), rgba(0, 0, 0, var(--trol-backdrop-scrim-opacity, 0))),
    var(--trol-skin-texture, none);
  background-position: center;
  background-size: 100% 100%, var(--trol-texture-bg-size, 100%);
  background-repeat: no-repeat;
  background-blend-mode: soft-light;
  opacity: min(var(--trol-skin-opacity-cap, 1), calc(var(--trol-skin-opacity, 0.42) * var(--trol-skin-amount, 1) * var(--trol-texture-opacity, 1) * var(--trol-texture-layer-opacity, 1)));
}

/* ================================================================== *
 * Cross-app shell backdrops (Daytrol / Phototrol / Calendartrol / ET)
 * Curated photo/skins from applyCuratedVisualLayers: viewport-fixed layer
 * so sidebar/content gaps show texture, not floatingUi tray solids.
 * ================================================================== */

html[data-trol-texture]:not([data-ui-theme]) main.day-wrap,
html[data-trol-texture]:not([data-ui-theme]) .day-wrap,
html[data-trol-texture]:not([data-ui-theme]) main.pht-wrap,
html[data-trol-texture]:not([data-ui-theme]) .pht-wrap,
html[data-trol-texture]:not([data-ui-theme]) main.cal-wrap,
html[data-trol-texture]:not([data-ui-theme]) .cal-wrap {
  position: relative;
  isolation: isolate;
  background-color: transparent;
  background-image: none;
}

html[data-trol-texture]:not([data-ui-theme]) main.day-wrap > *,
html[data-trol-texture]:not([data-ui-theme]) .day-wrap > *,
html[data-trol-texture]:not([data-ui-theme]) main.pht-wrap > *,
html[data-trol-texture]:not([data-ui-theme]) .pht-wrap > *,
html[data-trol-texture]:not([data-ui-theme]) main.cal-wrap > *,
html[data-trol-texture]:not([data-ui-theme]) .cal-wrap > * {
  position: relative;
  z-index: 1;
}

html[data-trol-texture]:not([data-ui-theme]) .day-topbar,
html[data-trol-texture]:not([data-ui-theme]) .pht-topbar,
html[data-trol-texture]:not([data-ui-theme]) .cal-topbar {
  position: relative;
  z-index: 2;
  isolation: isolate;
}

html[data-trol-texture]:not([data-ui-theme]) .pht-sidebar,
html[data-trol-texture]:not([data-ui-theme]) .cal-sidebar {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  z-index: 100;
  isolation: isolate;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-trol-texture]:not([data-ui-theme]) .pht-sidebar-nav,
html[data-trol-texture]:not([data-ui-theme]) .pht-sidebar-foot,
html[data-trol-texture]:not([data-ui-theme]) .cal-sidebar-nav,
html[data-trol-texture]:not([data-ui-theme]) .cal-sidebar-foot {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html[data-trol-texture][data-trol-texture-role="backdrop"]:not([data-ui-theme]) .pht-sidebar::before,
html[data-trol-texture][data-trol-texture-role="backdrop"]:not([data-ui-theme]) .cal-sidebar::before,
html[data-trol-texture][data-trol-texture-role="island"]:not([data-trol-3d="on"]):not([data-ui-theme]) .pht-sidebar::before,
html[data-trol-texture][data-trol-texture-role="island"]:not([data-trol-3d="on"]):not([data-ui-theme]) .cal-sidebar::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  contain: paint;
  background-image:
    var(--trol-backdrop-scrim-grad),
    var(--trol-surface-light-sh-grad, none),
    var(--trol-surface-light-hi-grad, none),
    var(--trol-skin-texture, none);
  background-position: center;
  background-size: 100% 100%, 100% 100%, 100% 100%, var(--trol-texture-bg-size, 100%);
  background-repeat: no-repeat;
  background-attachment: scroll;
  opacity: min(var(--trol-skin-opacity-cap, 1), calc(var(--trol-skin-opacity, 0.42) * var(--trol-skin-amount, 1) * var(--trol-texture-opacity, 1) * var(--trol-texture-layer-opacity, 1)));
  filter: sepia(var(--trol-skin-sepia, 0)) hue-rotate(var(--trol-skin-hue, 0deg)) saturate(var(--trol-skin-saturate, 1)) brightness(var(--trol-skin-brightness, 1)) contrast(var(--trol-skin-contrast, var(--trol-skin-depth, 1))) grayscale(var(--trol-skin-grayscale, 0)) var(--trol-skin-filter, );
}

html[data-trol-texture][data-trol-texture-role="backdrop"]:not([data-ui-theme]) main.day-wrap::after,
html[data-trol-texture][data-trol-texture-role="backdrop"]:not([data-ui-theme]) .day-wrap::after,
html[data-trol-texture][data-trol-texture-role="backdrop"]:not([data-ui-theme]) main.pht-wrap::after,
html[data-trol-texture][data-trol-texture-role="backdrop"]:not([data-ui-theme]) .pht-wrap::after,
html[data-trol-texture][data-trol-texture-role="backdrop"]:not([data-ui-theme]) main.cal-wrap::after,
html[data-trol-texture][data-trol-texture-role="backdrop"]:not([data-ui-theme]) .cal-wrap::after,
html[data-trol-texture][data-trol-texture-role="island"]:not([data-trol-3d="on"]):not([data-ui-theme]) main.day-wrap::after,
html[data-trol-texture][data-trol-texture-role="island"]:not([data-trol-3d="on"]):not([data-ui-theme]) .day-wrap::after,
html[data-trol-texture][data-trol-texture-role="island"]:not([data-trol-3d="on"]):not([data-ui-theme]) main.pht-wrap::after,
html[data-trol-texture][data-trol-texture-role="island"]:not([data-trol-3d="on"]):not([data-ui-theme]) .pht-wrap::after,
html[data-trol-texture][data-trol-texture-role="island"]:not([data-trol-3d="on"]):not([data-ui-theme]) main.cal-wrap::after,
html[data-trol-texture][data-trol-texture-role="island"]:not([data-trol-3d="on"]):not([data-ui-theme]) .cal-wrap::after {
  content: "";
  position: fixed;
  top: var(--trol-wrap-backdrop-top, 52px);
  right: 0;
  bottom: 0;
  left: var(--trol-wrap-backdrop-left, 0);
  z-index: 0;
  pointer-events: none;
  contain: paint;
  transform: translateZ(0);
  backface-visibility: hidden;
  border-radius: calc(var(--trol-panel-radius, 10px) + 2px);
  background-image:
    var(--trol-backdrop-scrim-grad),
    var(--trol-surface-light-sh-grad, none),
    var(--trol-surface-light-hi-grad, none),
    var(--trol-skin-texture, none);
  background-position: center;
  background-size: 100% 100%, 100% 100%, 100% 100%, var(--trol-texture-bg-size, 100%);
  background-repeat: no-repeat;
  background-attachment: scroll;
  opacity: min(var(--trol-skin-opacity-cap, 1), calc(var(--trol-skin-opacity, 0.42) * var(--trol-skin-amount, 1) * var(--trol-texture-opacity, 1) * var(--trol-texture-layer-opacity, 1)));
  filter: sepia(var(--trol-skin-sepia, 0)) hue-rotate(var(--trol-skin-hue, 0deg)) saturate(var(--trol-skin-saturate, 1)) brightness(var(--trol-skin-brightness, 1)) contrast(var(--trol-skin-contrast, var(--trol-skin-depth, 1))) grayscale(var(--trol-skin-grayscale, 0)) var(--trol-skin-filter, );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, calc(var(--trol-skin-gloss, 0.35) * 0.1));
}

html[data-trol-texture]:not([data-ui-theme]) .day-shell,
html[data-trol-texture]:not([data-ui-theme]) .pht-shell,
html[data-trol-texture]:not([data-ui-theme]) .cal-shell,
html[data-trol-texture]:not([data-ui-theme]) .et-shell.et-mail-shell {
  flex: 1 1 auto;
  min-height: 100vh;
}

html[data-trol-texture][data-trol-texture-role="backdrop"]:not([data-ui-theme]) .day-shell::after,
html[data-trol-texture][data-trol-texture-role="backdrop"]:not([data-ui-theme]) .pht-shell::after,
html[data-trol-texture][data-trol-texture-role="backdrop"]:not([data-ui-theme]) .cal-shell::after,
html[data-trol-texture][data-trol-texture-role="backdrop"]:not([data-ui-theme]) .et-shell.et-mail-shell::after {
  content: "";
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  pointer-events: none;
  contain: paint;
  background-image:
    var(--trol-backdrop-scrim-grad),
    var(--trol-surface-light-sh-grad, none),
    var(--trol-surface-light-hi-grad, none),
    var(--trol-skin-texture, none);
  background-position: center;
  background-size: 100% 100%, 100% 100%, 100% 100%, var(--trol-texture-bg-size, 100%);
  background-repeat: no-repeat;
  background-attachment: scroll;
  opacity: min(var(--trol-skin-opacity-cap, 1), calc(var(--trol-skin-opacity, 0.42) * var(--trol-skin-amount, 1) * var(--trol-texture-opacity, 1) * var(--trol-texture-layer-opacity, 1)));
  filter: sepia(var(--trol-skin-sepia, 0)) hue-rotate(var(--trol-skin-hue, 0deg)) saturate(var(--trol-skin-saturate, 1)) brightness(var(--trol-skin-brightness, 1)) contrast(var(--trol-skin-contrast, var(--trol-skin-depth, 1))) grayscale(var(--trol-skin-grayscale, 0)) var(--trol-skin-filter, );
}

@media (min-width: 769px) {
  html[data-trol-texture][data-trol-texture-role="backdrop"]:not([data-ui-theme]) body.day-has-sidebar .day-shell::after,
  html[data-trol-texture][data-trol-texture-role="backdrop"]:not([data-ui-theme]) body.pht-has-sidebar .pht-shell::after,
  html[data-trol-texture][data-trol-texture-role="backdrop"]:not([data-ui-theme]) body.cal-has-sidebar .cal-shell::after {
    left: 220px;
  }
}

html[data-style="ron-burgundy"][data-trol-texture]:not([data-trol-texture="wood"]):not([data-ui-theme]) main.day-wrap::before,
html[data-style="royal-cream"][data-trol-texture]:not([data-trol-texture="wood"]):not([data-ui-theme]) main.day-wrap::before,
html[data-style="ron-burgundy"][data-trol-texture]:not([data-trol-texture="wood"]):not([data-ui-theme]) .day-wrap::before,
html[data-style="royal-cream"][data-trol-texture]:not([data-trol-texture="wood"]):not([data-ui-theme]) .day-wrap::before,
html[data-style="ron-burgundy"][data-trol-texture]:not([data-trol-texture="wood"]):not([data-ui-theme]) main.pht-wrap::before,
html[data-style="royal-cream"][data-trol-texture]:not([data-trol-texture="wood"]):not([data-ui-theme]) main.pht-wrap::before,
html[data-style="ron-burgundy"][data-trol-texture]:not([data-trol-texture="wood"]):not([data-ui-theme]) .pht-wrap::before,
html[data-style="royal-cream"][data-trol-texture]:not([data-trol-texture="wood"]):not([data-ui-theme]) .pht-wrap::before,
html[data-style="ron-burgundy"][data-trol-texture]:not([data-trol-texture="wood"]):not([data-ui-theme]) main.cal-wrap::before,
html[data-style="royal-cream"][data-trol-texture]:not([data-trol-texture="wood"]):not([data-ui-theme]) main.cal-wrap::before,
html[data-style="ron-burgundy"][data-trol-texture]:not([data-trol-texture="wood"]):not([data-ui-theme]) .cal-wrap::before,
html[data-style="royal-cream"][data-trol-texture]:not([data-trol-texture="wood"]):not([data-ui-theme]) .cal-wrap::before {
  background-image: none;
  box-shadow: none;
  opacity: 0;
}

/* --- Calendartrol main shell: wood desk (day-wrap parity, viewport-pinned) --- */
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .cal-shell,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .cal-shell {
  background-color: var(--et-wood-cabinet-base, var(--surface-base));
}

html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) main.cal-wrap,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) main.cal-wrap,
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .cal-wrap,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .cal-wrap {
  position: relative;
  isolation: isolate;
  background-color: transparent;
  background-image: none;
}

html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) main.cal-wrap::after,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) main.cal-wrap::after,
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .cal-wrap::after,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .cal-wrap::after {
  content: none;
}

html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) main.cal-wrap::before,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) main.cal-wrap::before,
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .cal-wrap::before,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .cal-wrap::before {
  content: "";
  position: fixed;
  top: var(--trol-wrap-backdrop-top, 52px);
  right: 0;
  bottom: 0;
  left: var(--trol-wrap-backdrop-left, 0);
  border-radius: calc(var(--trol-panel-radius, 10px) + 2px);
  pointer-events: none;
  z-index: 0;
  background-color: var(--et-wood-cabinet-base, color-mix(in srgb, #0e0804 90%, var(--surface-base)));
  background-image: var(--et-wood-bezel-layer, var(--et-woodgrain-layer));
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: scroll;
  contain: paint;
  transform: translateZ(0);
  backface-visibility: hidden;
  opacity: var(--et-wood-bezel-opacity, var(--et-woodgrain-opacity, 0.72));
  filter: var(--et-wood-filter);
  mix-blend-mode: var(--et-woodgrain-blend, normal);
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--family-bright, #8a6040) 10%, transparent),
    inset 0 4px 18px rgba(0, 0, 0, 0.48);
}

html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) main.cal-wrap > *,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) main.cal-wrap > *,
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .cal-wrap > *,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .cal-wrap > * {
  position: relative;
  z-index: 1;
}

body.cal-has-sidebar {
  --trol-wrap-backdrop-left: 220px;
}

@media (max-width: 768px) {
  body.cal-has-sidebar {
    --trol-wrap-backdrop-left: 0;
  }
}

body.day-has-sidebar,
body.pht-has-sidebar {
  --trol-wrap-backdrop-left: 220px;
}


/* --- engine layer: ron-burgundy-tokens.css --- */
/**
 * LOCKED Ron Burgundy: suite canonical surface + brass accent tokens.
 * Source of truth: jobtrol/theme/ron-burgundy-tokens.json
 * Deploy: copied to each app assets/ron-burgundy-tokens.css: do not edit per-app copies.
 */
html[data-style="ron-burgundy"] {
  color-scheme: dark;
  --surface-base: #261a14;
  --surface-card: linear-gradient(180deg, #302218 0%, #261a14 100%);
  --surface-elev: #342418;
  --text-strong: #f5e9d5;
  --text: #e8d9bf;
  --text-muted: #c9ad86;
  --border: rgba(212, 165, 116, 0.18);
  --border-soft: rgba(212, 165, 116, 0.12);
  --shadow-inset: inset 0 1px 0 rgba(255, 220, 170, 0.06);
  --shadow-elev: 0 4px 16px rgba(0, 0, 0, 0.5), 0 1px 2px rgba(0, 0, 0, 0.4);
  --row-hover: rgba(212, 165, 116, 0.08);
  --input-bg: rgba(0, 0, 0, 0.25);
  --surface-texture: var(--et-leather-layer);
  --et-leather-opacity: 1;
  --et-leather-grain-opacity: 0.62;
  --et-leather-layer:
    radial-gradient(ellipse 95% 70% at 12% 8%, color-mix(in srgb, #a07040 24%, transparent) 0%, transparent 58%),
    radial-gradient(ellipse 80% 65% at 88% 92%, color-mix(in srgb, #1a1008 14%, transparent) 0%, transparent 52%),
    radial-gradient(ellipse 55% 45% at 48% 42%, color-mix(in srgb, #4a3020 20%, transparent) 0%, transparent 68%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='256' height='256' viewBox='0 0 256 256'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.18' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.09 0 0 0 0 0.055 0 0 0 0 0.04 0 0 0 0.4 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --et-woodgrain-teak: url("https://thetrols.com/assets/textures/wood-teak.svg");
  --et-woodgrain-burl: url("https://thetrols.com/assets/textures/wood-burl.svg");
  --et-woodgrain-exotic: url("https://thetrols.com/assets/textures/wood-exotic.svg");
  --et-woodgrain-mahogany: url("https://thetrols.com/assets/textures/wood-mahogany.svg");
  --et-woodgrain-tigerwood: url("https://thetrols.com/assets/textures/wood-tigerwood.svg");
  --et-woodgrain-walnut: url("https://thetrols.com/assets/textures/wood-walnut.svg");
  --et-woodgrain-cherry: url("https://thetrols.com/assets/textures/wood-cherry.svg");
  --et-woodgrain-rosewood: url("https://thetrols.com/assets/textures/wood-rosewood.svg");
  --et-woodgrain-layer: var(--et-woodgrain-burl);
  --et-wood-bezel-layer: var(--et-woodgrain-layer);
}

/* Brass accent lock: overridden only by explicit data-trol-accent or pre-approved accent variant */
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-trol-accent]) {
  --family: #b8863f;
  --family-bright: #c59a5e;
  --family-soft: color-mix(in srgb, #c59a5e 14%, transparent);
  --family-on: #0a0d12;
}


/* --- engine layer: trol-island-overlay.css --- */
/**
 * Per-element dim + readability backdrop (Theme Studio Phase 2).
 * Vars: --trol-island-{role}-dim (0–100), -backdrop-strength, -backdrop-color, -text-shadow
 * Global: --trol-global-ui-dim on html[data-trol-global-ui-dim]
 */
:root {
  --trol-global-ui-dim: 0;
}

/* Global UI scrim over entire app chrome */
html[data-trol-global-ui-dim="1"]::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 2147483000;
  background: rgba(0, 0, 0, calc(var(--trol-global-ui-dim, 0) / 100 * 0.72));
}

/* Shared island targets (texture + overlay layers) */
.trol-island-overlay-target,
html[data-trol-island-texture] .ctx-shell .ctx-right,
html[data-trol-island-texture] .ctx-shell .ctx-pane,
html[data-trol-island-texture] .et-reader-panel,
html[data-trol-island-texture] #et-reader-panel.et-reader-panel,
html[data-trol-island-texture] .jd-project-shell,
html[data-trol-island-texture] .day-today-detail,
html[data-trol-island-texture] .day-item-hub,
html[data-trol-island-texture] .pht-photo-detail,
html[data-trol-island-texture] .cal-wrap,
html[data-trol-island-texture] .st-thread-panel,
html[data-trol-island-per-role="1"] .ctx-shell .ctx-right,
html[data-trol-island-per-role="1"] .ctx-shell .ctx-pane,
html[data-trol-island-per-role="1"] .et-reader-panel,
html[data-trol-island-per-role="1"] #et-reader-panel.et-reader-panel,
html[data-trol-island-per-role="1"] .jd-project-shell,
html[data-trol-island-per-role="1"] .day-today-detail,
html[data-trol-island-per-role="1"] .day-item-hub,
html[data-trol-island-per-role="1"] .pht-photo-detail,
html[data-trol-island-per-role="1"] .cal-wrap,
html[data-trol-island-per-role="1"] .st-thread-panel,
html[data-trol-island-per-role="1"] .et-btn-primary,
html[data-trol-island-per-role="1"] .btn-primary,
html[data-trol-island-per-role="1"] .day-btn:not(.day-btn-ghost):not(.day-btn-danger),
html[data-trol-island-per-role="1"] button[type="submit"].primary,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-reading,
.jt-ts-mock-reading[data-ts-island-texture] {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

/* Dim + readability pad between texture (::before) and content */
.trol-island-overlay-target::after,
html[data-trol-island-texture] .ctx-shell .ctx-left .ctx-row::after,
html[data-trol-island-texture] .day-scroll-list .day-item-card::after,
html[data-trol-island-texture] .et-messages-panel .et-stub-list li.et-msg-row::after,
html[data-trol-island-texture] .trol-island-folder__body::after,
html[data-trol-island-texture] .day-sidebar-island:not(.trol-island-folder)::after,
html[data-trol-island-texture] .day-list-head-island::after,
html[data-trol-island-texture] div.main > div.topbar::after,
html[data-trol-island-texture] .ctx-modal::after,
html[data-trol-island-texture] .ctrol-modal-card::after,
html[data-trol-island-texture] .et-statusrail::after,
html[data-trol-island-texture] .ctx-shell .ctx-right::after,
html[data-trol-island-texture] .ctx-shell .ctx-pane::after,
html[data-trol-island-texture] .et-reader-panel::after,
html[data-trol-island-texture] #et-reader-panel.et-reader-panel::after,
html[data-trol-island-texture] .jd-project-shell::after,
html[data-trol-island-texture] .day-today-detail::after,
html[data-trol-island-texture] .day-item-hub::after,
html[data-trol-island-texture] .pht-photo-detail::after,
html[data-trol-island-texture] .cal-wrap::after,
html[data-trol-island-texture] .st-thread-panel::after,
html[data-trol-island-texture] .et-btn-primary::after,
html[data-trol-island-texture] .btn-primary::after,
html[data-trol-island-texture] .day-btn:not(.day-btn-ghost):not(.day-btn-danger)::after,
html[data-trol-island-texture] button[type="submit"].primary::after,
html[data-trol-island-per-role="1"] .trol-island-folder__tab::after,
html[data-trol-island-per-role="1"] .trol-island-folder__body::after,
html[data-trol-island-per-role="1"] .day-sidebar-island:not(.trol-island-folder)::after,
html[data-trol-island-per-role="1"] .day-list-head-island::after,
html[data-trol-island-per-role="1"] div.main > div.topbar::after,
html[data-trol-island-per-role="1"] .ctx-modal::after,
html[data-trol-island-per-role="1"] .ctrol-modal-card::after,
html[data-trol-island-per-role="1"] .day-scroll-list .day-item-card::after,
html[data-trol-island-per-role="1"] .et-messages-panel .et-stub-list li.et-msg-row::after,
html[data-trol-island-per-role="1"] .ctx-shell .ctx-left .ctx-row::after,
html[data-trol-island-per-role="1"] .ctx-shell .ctx-right::after,
html[data-trol-island-per-role="1"] .ctx-shell .ctx-pane::after,
html[data-trol-island-per-role="1"] .et-reader-panel::after,
html[data-trol-island-per-role="1"] #et-reader-panel.et-reader-panel::after,
html[data-trol-island-per-role="1"] .jd-project-shell::after,
html[data-trol-island-per-role="1"] .day-today-detail::after,
html[data-trol-island-per-role="1"] .day-item-hub::after,
html[data-trol-island-per-role="1"] .pht-photo-detail::after,
html[data-trol-island-per-role="1"] .cal-wrap::after,
html[data-trol-island-per-role="1"] .st-thread-panel::after,
html[data-trol-island-per-role="1"] .et-statusrail::after,
html[data-trol-island-per-role="1"] .et-btn-primary::after,
html[data-trol-island-per-role="1"] .btn-primary::after,
html[data-trol-island-per-role="1"] .day-btn:not(.day-btn-ghost):not(.day-btn-danger)::after,
html[data-trol-island-per-role="1"] button[type="submit"].primary::after,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-sidebar .trol-island-folder__body::after,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-sidebar .trol-island-folder__tab::after,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-topbar::after,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-row::after,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-modal::after,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-tray::after,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-btn::after,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-reading::after,
.jt-ts-mock-sidebar[data-ts-island-texture] .trol-island-folder__body::after,
.jt-ts-mock-sidebar[data-ts-island-texture] .trol-island-folder__tab::after,
.jt-ts-mock-topbar[data-ts-island-texture]::after,
.jt-ts-mock-row[data-ts-island-texture]::after,
.jt-ts-mock-modal[data-ts-island-texture]::after,
.jt-ts-mock-tray[data-ts-island-texture]::after,
.jt-ts-mock-btn[data-ts-island-texture]::after,
.jt-ts-mock-reading[data-ts-island-texture]::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 1;
  background:
    linear-gradient(rgba(0, 0, 0, calc(var(--_trol-island-role-dim, var(--trol-island-listRow-dim, 0)) / 100 * 0.85)), rgba(0, 0, 0, calc(var(--_trol-island-role-dim, var(--trol-island-listRow-dim, 0)) / 100 * 0.85))),
    var(--_trol-island-role-backdrop-color, var(--trol-island-listRow-backdrop-color, transparent));
  opacity: 1;
}

/* Per-role dim/backdrop vars on published surfaces */
html[data-trol-island-per-role="1"] .trol-island-folder__body::after,
html[data-trol-island-per-role="1"] .day-sidebar-island:not(.trol-island-folder)::after {
  --_trol-island-role-dim: var(--trol-island-sidebar-dim, 0);
  --_trol-island-role-backdrop-color: var(--trol-island-sidebar-backdrop-color, transparent);
}
html[data-trol-island-per-role="1"] .trol-island-folder__tab::after {
  --_trol-island-role-dim: var(--trol-island-sidebar-dim, 0);
  --_trol-island-role-backdrop-color: var(--trol-island-sidebar-backdrop-color, transparent);
}
html[data-trol-island-per-role="1"] div.main > div.topbar::after,
html[data-trol-island-per-role="1"] .day-list-head-island::after {
  --_trol-island-role-dim: var(--trol-island-topBar-dim, 0);
  --_trol-island-role-backdrop-color: var(--trol-island-topBar-backdrop-color, transparent);
}
html[data-trol-island-per-role="1"] .ctx-modal::after,
html[data-trol-island-per-role="1"] .ctrol-modal-card::after {
  --_trol-island-role-dim: var(--trol-island-modal-dim, 0);
  --_trol-island-role-backdrop-color: var(--trol-island-modal-backdrop-color, transparent);
}
html[data-trol-island-per-role="1"] .day-scroll-list .day-item-card::after,
html[data-trol-island-per-role="1"] .et-messages-panel .et-stub-list li.et-msg-row::after,
html[data-trol-island-per-role="1"] .ctx-shell .ctx-left .ctx-row::after,
html[data-trol-island-per-role="1"] .st-thread-scroll .st-thread-card::after {
  --_trol-island-role-dim: var(--trol-island-listRow-dim, 0);
  --_trol-island-role-backdrop-color: var(--trol-island-listRow-backdrop-color, transparent);
}
html[data-trol-island-per-role="1"] .ctx-shell .ctx-right::after,
html[data-trol-island-per-role="1"] .ctx-shell .ctx-pane::after,
html[data-trol-island-per-role="1"] .et-reader-panel::after,
html[data-trol-island-per-role="1"] #et-reader-panel.et-reader-panel::after,
html[data-trol-island-per-role="1"] .jd-project-shell::after,
html[data-trol-island-per-role="1"] .day-today-detail::after,
html[data-trol-island-per-role="1"] .day-item-hub::after,
html[data-trol-island-per-role="1"] .pht-photo-detail::after,
html[data-trol-island-per-role="1"] .cal-wrap::after,
html[data-trol-island-per-role="1"] .st-thread-panel::after {
  --_trol-island-role-dim: var(--trol-island-readingPane-dim, 0);
  --_trol-island-role-backdrop-color: var(--trol-island-readingPane-backdrop-color, transparent);
}
html[data-trol-island-per-role="1"] .et-statusrail::after {
  --_trol-island-role-dim: var(--trol-island-tray-dim, 0);
  --_trol-island-role-backdrop-color: var(--trol-island-tray-backdrop-color, transparent);
}
html[data-trol-island-per-role="1"] .et-btn-primary::after,
html[data-trol-island-per-role="1"] .btn-primary::after,
html[data-trol-island-per-role="1"] .day-btn:not(.day-btn-ghost):not(.day-btn-danger)::after,
html[data-trol-island-per-role="1"] button[type="submit"].primary::after {
  --_trol-island-role-dim: var(--trol-island-buttonPrimary-dim, 0);
  --_trol-island-role-backdrop-color: var(--trol-island-buttonPrimary-backdrop-color, transparent);
}

/* Text legibility boost from readability backdrop strength */
html[data-trol-island-per-role="1"] .ctx-shell .ctx-left .ctx-row > *,
html[data-trol-island-per-role="1"] .day-scroll-list .day-item-card > *,
html[data-trol-island-per-role="1"] .et-messages-panel .et-stub-list li.et-msg-row > * {
  text-shadow: var(--trol-island-listRow-text-shadow, none);
}
html[data-trol-island-per-role="1"] .ctx-shell .ctx-right > *,
html[data-trol-island-per-role="1"] .ctx-shell .ctx-pane > *,
html[data-trol-island-per-role="1"] .et-reader-panel > *,
html[data-trol-island-per-role="1"] #et-reader-panel.et-reader-panel > *,
html[data-trol-island-per-role="1"] .jd-project-shell > *,
html[data-trol-island-per-role="1"] .day-today-detail > *,
html[data-trol-island-per-role="1"] .day-item-hub > *,
html[data-trol-island-per-role="1"] .pht-photo-detail > *,
html[data-trol-island-per-role="1"] .cal-wrap > *,
html[data-trol-island-per-role="1"] .st-thread-panel > * {
  text-shadow: var(--trol-island-readingPane-text-shadow, none);
}
html[data-trol-island-per-role="1"] .trol-island-folder__body > *,
html[data-trol-island-per-role="1"] .day-sidebar-island:not(.trol-island-folder) > * {
  text-shadow: var(--trol-island-sidebar-text-shadow, none);
}
html[data-trol-island-per-role="1"] div.main > div.topbar > *,
html[data-trol-island-per-role="1"] .day-list-head-island > * {
  text-shadow: var(--trol-island-topBar-text-shadow, none);
}
html[data-trol-island-per-role="1"] .ctx-modal > *,
html[data-trol-island-per-role="1"] .ctrol-modal-card > * {
  text-shadow: var(--trol-island-modal-text-shadow, none);
}
html[data-trol-island-per-role="1"] .et-statusrail > * {
  text-shadow: var(--trol-island-tray-text-shadow, none);
}
html[data-trol-island-per-role="1"] .et-btn-primary,
html[data-trol-island-per-role="1"] .btn-primary,
html[data-trol-island-per-role="1"] .day-btn:not(.day-btn-ghost):not(.day-btn-danger),
html[data-trol-island-per-role="1"] button[type="submit"].primary {
  text-shadow: var(--trol-island-buttonPrimary-text-shadow, none);
}

/* Theme Studio mock: per-element vars on selectable nodes */
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-sidebar .trol-island-folder__body::after,
.jt-ts-mock-sidebar[data-ts-island-texture] .trol-island-folder__body::after {
  --_trol-island-role-dim: var(--ts-element-island-dim, var(--trol-island-sidebar-dim, 0));
  --_trol-island-role-backdrop-color: var(--ts-element-island-backdrop-color, var(--trol-island-sidebar-backdrop-color, transparent));
}
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-topbar::after,
.jt-ts-mock-topbar[data-ts-island-texture]::after {
  --_trol-island-role-dim: var(--ts-element-island-dim, var(--trol-island-topBar-dim, 0));
  --_trol-island-role-backdrop-color: var(--ts-element-island-backdrop-color, var(--trol-island-topBar-backdrop-color, transparent));
}
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-row[data-ts-float-key="listRow"]::after,
.jt-ts-mock-row[data-ts-island-texture][data-ts-float-key="listRow"]::after {
  --_trol-island-role-dim: var(--ts-element-island-dim, var(--trol-island-listRow-dim, 0));
  --_trol-island-role-backdrop-color: var(--ts-element-island-backdrop-color, var(--trol-island-listRow-backdrop-color, transparent));
}
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-row[data-ts-float-key="listRowFollowUp"]::after,
.jt-ts-mock-row[data-ts-island-texture][data-ts-float-key="listRowFollowUp"]::after {
  --_trol-island-role-dim: var(--ts-element-island-dim, var(--trol-island-listRowFollowUp-dim, var(--trol-island-listRow-dim, 0)));
  --_trol-island-role-backdrop-color: var(--ts-element-island-backdrop-color, var(--trol-island-listRowFollowUp-backdrop-color, var(--trol-island-listRow-backdrop-color, transparent)));
}
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-modal::after,
.jt-ts-mock-modal[data-ts-island-texture]::after {
  --_trol-island-role-dim: var(--ts-element-island-dim, var(--trol-island-modal-dim, 0));
  --_trol-island-role-backdrop-color: var(--ts-element-island-backdrop-color, var(--trol-island-modal-backdrop-color, transparent));
}
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-tray::after,
.jt-ts-mock-tray[data-ts-island-texture]::after {
  --_trol-island-role-dim: var(--ts-element-island-dim, var(--trol-island-tray-dim, 0));
  --_trol-island-role-backdrop-color: var(--ts-element-island-backdrop-color, var(--trol-island-tray-backdrop-color, transparent));
}
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-btn::after,
.jt-ts-mock-btn[data-ts-island-texture]::after {
  --_trol-island-role-dim: var(--ts-element-island-dim, var(--trol-island-buttonPrimary-dim, 0));
  --_trol-island-role-backdrop-color: var(--ts-element-island-backdrop-color, var(--trol-island-buttonPrimary-backdrop-color, transparent));
}
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-reading::after,
.jt-ts-mock-reading[data-ts-island-texture]::after {
  --_trol-island-role-dim: var(--ts-element-island-dim, var(--trol-island-readingPane-dim, 0));
  --_trol-island-role-backdrop-color: var(--ts-element-island-backdrop-color, var(--trol-island-readingPane-backdrop-color, transparent));
}

.jt-ts-mock-row[data-ts-island-texture] .jt-ts-mock-row-title,
.jt-ts-mock-row[data-ts-island-texture] .jt-ts-mock-row-sub {
  text-shadow: var(--ts-element-island-text-shadow, var(--trol-island-listRow-text-shadow, none));
}
.jt-ts-mock-reading[data-ts-island-texture] .jt-ts-mock-reading-title,
.jt-ts-mock-reading[data-ts-island-texture] .jt-ts-mock-reading-sub {
  text-shadow: var(--ts-element-island-text-shadow, var(--trol-island-readingPane-text-shadow, none));
}
.jt-ts-mock-modal[data-ts-island-texture] .jt-ts-mock-modal-title,
.jt-ts-mock-modal[data-ts-island-texture] .jt-ts-mock-modal-body {
  text-shadow: var(--ts-element-island-text-shadow, var(--trol-island-modal-text-shadow, none));
}
.jt-ts-mock-topbar[data-ts-island-texture] .jt-ts-mock-topbar-inn {
  text-shadow: var(--ts-element-island-text-shadow, var(--trol-island-topBar-text-shadow, none));
}
.jt-ts-mock-btn[data-ts-island-texture] .jt-ts-mock-btn-label {
  text-shadow: var(--ts-element-island-text-shadow, var(--trol-island-buttonPrimary-text-shadow, none));
}

/**
 * Daytrol readingPane overlay targets (engine canonical).
 */
html[data-trol-island-texture] .day-card,
html[data-trol-island-texture] .day-item:not(.day-item-card),
html[data-trol-island-texture] .day-stat,
html[data-trol-island-texture] .day-signin-card,
html[data-trol-island-texture] .day-integration-card,
html[data-trol-island-per-role="1"] .day-card,
html[data-trol-island-per-role="1"] .day-item:not(.day-item-card),
html[data-trol-island-per-role="1"] .day-stat,
html[data-trol-island-per-role="1"] .day-signin-card,
html[data-trol-island-per-role="1"] .day-integration-card {
  position: relative;
}

html[data-trol-island-texture] .day-card::after,
html[data-trol-island-texture] .day-item:not(.day-item-card)::after,
html[data-trol-island-texture] .day-stat::after,
html[data-trol-island-texture] .day-signin-card::after,
html[data-trol-island-texture] .day-integration-card::after,
html[data-trol-island-per-role="1"] .day-card::after,
html[data-trol-island-per-role="1"] .day-item:not(.day-item-card)::after,
html[data-trol-island-per-role="1"] .day-stat::after,
html[data-trol-island-per-role="1"] .day-signin-card::after,
html[data-trol-island-per-role="1"] .day-integration-card::after {
  --_trol-island-role-dim: var(--trol-island-readingPane-dim, 0);
  --_trol-island-role-backdrop-color: var(--trol-island-readingPane-backdrop-color, transparent);
}

html[data-trol-island-per-role="1"] .day-card > *,
html[data-trol-island-per-role="1"] .day-item:not(.day-item-card) > *,
html[data-trol-island-per-role="1"] .day-stat > *,
html[data-trol-island-per-role="1"] .day-signin-card > *,
html[data-trol-island-per-role="1"] .day-integration-card > * {
  text-shadow: var(--trol-island-readingPane-text-shadow, none);
}


/* --- engine layer: trol-island-texture-registry.css --- */
/**
 * Island texture registry: generated from theme/island-texture-map.php
 * DO NOT hand-edit; run: php thetrols.com/tools/build-theme-artifacts.php
 * Universal attribute selectors (no html scope). One map → global + per-role vars.
 */

[data-trol-island-texture="wood"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-generic.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="leather"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-skin-opacity: 0.98; --trol-island-skin-filter: saturate(1.02); }
[data-trol-island-texture="leather-tan"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-tan.jpg"); --trol-island-skin-opacity: 0.98; --trol-island-skin-filter: saturate(1.02); }
[data-trol-island-texture="leather-camel"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-camel.jpg"); --trol-island-skin-opacity: 0.98; --trol-island-skin-filter: saturate(1.02); }
[data-trol-island-texture="leather-saddle"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-saddle.jpg"); --trol-island-skin-opacity: 0.98; --trol-island-skin-filter: saturate(1.02); }
[data-trol-island-texture="leather-cognac"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-cognac.jpg"); --trol-island-skin-opacity: 0.98; --trol-island-skin-filter: saturate(1.02); }
[data-trol-island-texture="leather-espresso"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-skin-opacity: 0.98; --trol-island-skin-filter: saturate(1.02); }
[data-trol-island-texture="leather-chocolate"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-chocolate.jpg"); --trol-island-skin-opacity: 0.98; --trol-island-skin-filter: saturate(1.02); }
[data-trol-island-texture="leather-black"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-black.jpg"); --trol-island-skin-opacity: 0.98; --trol-island-skin-filter: saturate(1.02); }
[data-trol-island-texture="leather-suede"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-cognac.jpg"); --trol-island-skin-opacity: 0.98; --trol-island-skin-filter: saturate(1.02); }
[data-trol-island-texture="leather-suede-brown"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-brown.jpg"); --trol-island-skin-opacity: 0.98; --trol-island-skin-filter: saturate(1.02); }
[data-trol-island-texture="leather-suede-draped"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-draped.jpg"); --trol-island-skin-opacity: 0.98; --trol-island-skin-filter: saturate(1.02); }
[data-trol-island-texture="stone"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-slate.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="marble"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-classic.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="granite"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-granite.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="travertine"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-travertine.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="carrara"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="carrara-bold"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara-bold.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="calacatta"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-calacatta.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="marble-white"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-white.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="marble-light-grey"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-light-grey.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="marble-cloud"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-cloud.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="teak"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-teak.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="burl"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/wood-burl.svg"); --trol-island-skin-opacity: 0.5; }
[data-trol-island-texture="exotic"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-exotic.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="mahogany"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-mahogany.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="tigerwood"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-tigerwood.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="walnut"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-walnut.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="cherry"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-cherry.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="rosewood"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-rosewood.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="elephant"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-elephant.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="zebra"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/fur-zebra.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="alligator"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="alligator-cognac"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-cognac.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="alligator-black"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-black.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="alligator-teal"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-teal.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="alligator-white"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-white.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="alligator-ivory"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-ivory.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="croc"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-croc.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="lizard"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-lizard.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="ostrich"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="ostrich-navy"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-navy.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="ostrich-olive"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-olive.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="quill-dots"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-quill-dots.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="snake"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-snake.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="tiger"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-stripes.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="tiger-fur-gold"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur-gold.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="sawtooth-print"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="wrinkled-hide"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-wrinkled-hide.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="jaguar-rosettes"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-jaguar-rosettes.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="pebbled-leather"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-pebbled-leather.jpg"); --trol-island-skin-opacity: 0.72; }
[data-trol-island-texture="desert-eyes"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-desert-eyes.jpg"); --trol-island-skin-opacity: 1; }
[data-trol-island-texture="leopard"] { --trol-island-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-leopard.webp"); --trol-island-skin-opacity: 0.72; }

[data-trol-island-sidebar-texture="wood"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-generic.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="wood"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-generic.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="wood"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-generic.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="wood"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-generic.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="wood"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-generic.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="wood"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-generic.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="wood"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-generic.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="wood"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-generic.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="wood"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-generic.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="leather"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-sidebar-skin-opacity: 0.98; --trol-island-sidebar-skin-filter: saturate(1.02); }
[data-trol-island-topBar-texture="leather"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-topBar-skin-opacity: 0.98; --trol-island-topBar-skin-filter: saturate(1.02); }
[data-trol-island-listRow-texture="leather"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-listRow-skin-opacity: 0.98; --trol-island-listRow-skin-filter: saturate(1.02); }
[data-trol-island-listRowFollowUp-texture="leather"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.98; --trol-island-listRowFollowUp-skin-filter: saturate(1.02); }
[data-trol-island-readingPane-texture="leather"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-readingPane-skin-opacity: 0.98; --trol-island-readingPane-skin-filter: saturate(1.02); }
[data-trol-island-modal-texture="leather"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-modal-skin-opacity: 0.98; --trol-island-modal-skin-filter: saturate(1.02); }
[data-trol-island-tray-texture="leather"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-tray-skin-opacity: 0.98; --trol-island-tray-skin-filter: saturate(1.02); }
[data-trol-island-buttonPrimary-texture="leather"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.98; --trol-island-buttonPrimary-skin-filter: saturate(1.02); }
[data-trol-island-tab-texture="leather"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.98; }
[data-trol-island-sidebar-texture="leather-tan"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-tan.jpg"); --trol-island-sidebar-skin-opacity: 0.98; --trol-island-sidebar-skin-filter: saturate(1.02); }
[data-trol-island-topBar-texture="leather-tan"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-tan.jpg"); --trol-island-topBar-skin-opacity: 0.98; --trol-island-topBar-skin-filter: saturate(1.02); }
[data-trol-island-listRow-texture="leather-tan"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-tan.jpg"); --trol-island-listRow-skin-opacity: 0.98; --trol-island-listRow-skin-filter: saturate(1.02); }
[data-trol-island-listRowFollowUp-texture="leather-tan"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-tan.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.98; --trol-island-listRowFollowUp-skin-filter: saturate(1.02); }
[data-trol-island-readingPane-texture="leather-tan"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-tan.jpg"); --trol-island-readingPane-skin-opacity: 0.98; --trol-island-readingPane-skin-filter: saturate(1.02); }
[data-trol-island-modal-texture="leather-tan"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-tan.jpg"); --trol-island-modal-skin-opacity: 0.98; --trol-island-modal-skin-filter: saturate(1.02); }
[data-trol-island-tray-texture="leather-tan"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-tan.jpg"); --trol-island-tray-skin-opacity: 0.98; --trol-island-tray-skin-filter: saturate(1.02); }
[data-trol-island-buttonPrimary-texture="leather-tan"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-tan.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.98; --trol-island-buttonPrimary-skin-filter: saturate(1.02); }
[data-trol-island-tab-texture="leather-tan"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-tan.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.98; }
[data-trol-island-sidebar-texture="leather-camel"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-camel.jpg"); --trol-island-sidebar-skin-opacity: 0.98; --trol-island-sidebar-skin-filter: saturate(1.02); }
[data-trol-island-topBar-texture="leather-camel"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-camel.jpg"); --trol-island-topBar-skin-opacity: 0.98; --trol-island-topBar-skin-filter: saturate(1.02); }
[data-trol-island-listRow-texture="leather-camel"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-camel.jpg"); --trol-island-listRow-skin-opacity: 0.98; --trol-island-listRow-skin-filter: saturate(1.02); }
[data-trol-island-listRowFollowUp-texture="leather-camel"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-camel.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.98; --trol-island-listRowFollowUp-skin-filter: saturate(1.02); }
[data-trol-island-readingPane-texture="leather-camel"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-camel.jpg"); --trol-island-readingPane-skin-opacity: 0.98; --trol-island-readingPane-skin-filter: saturate(1.02); }
[data-trol-island-modal-texture="leather-camel"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-camel.jpg"); --trol-island-modal-skin-opacity: 0.98; --trol-island-modal-skin-filter: saturate(1.02); }
[data-trol-island-tray-texture="leather-camel"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-camel.jpg"); --trol-island-tray-skin-opacity: 0.98; --trol-island-tray-skin-filter: saturate(1.02); }
[data-trol-island-buttonPrimary-texture="leather-camel"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-camel.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.98; --trol-island-buttonPrimary-skin-filter: saturate(1.02); }
[data-trol-island-tab-texture="leather-camel"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-camel.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.98; }
[data-trol-island-sidebar-texture="leather-saddle"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-saddle.jpg"); --trol-island-sidebar-skin-opacity: 0.98; --trol-island-sidebar-skin-filter: saturate(1.02); }
[data-trol-island-topBar-texture="leather-saddle"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-saddle.jpg"); --trol-island-topBar-skin-opacity: 0.98; --trol-island-topBar-skin-filter: saturate(1.02); }
[data-trol-island-listRow-texture="leather-saddle"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-saddle.jpg"); --trol-island-listRow-skin-opacity: 0.98; --trol-island-listRow-skin-filter: saturate(1.02); }
[data-trol-island-listRowFollowUp-texture="leather-saddle"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-saddle.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.98; --trol-island-listRowFollowUp-skin-filter: saturate(1.02); }
[data-trol-island-readingPane-texture="leather-saddle"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-saddle.jpg"); --trol-island-readingPane-skin-opacity: 0.98; --trol-island-readingPane-skin-filter: saturate(1.02); }
[data-trol-island-modal-texture="leather-saddle"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-saddle.jpg"); --trol-island-modal-skin-opacity: 0.98; --trol-island-modal-skin-filter: saturate(1.02); }
[data-trol-island-tray-texture="leather-saddle"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-saddle.jpg"); --trol-island-tray-skin-opacity: 0.98; --trol-island-tray-skin-filter: saturate(1.02); }
[data-trol-island-buttonPrimary-texture="leather-saddle"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-saddle.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.98; --trol-island-buttonPrimary-skin-filter: saturate(1.02); }
[data-trol-island-tab-texture="leather-saddle"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-saddle.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.98; }
[data-trol-island-sidebar-texture="leather-cognac"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-cognac.jpg"); --trol-island-sidebar-skin-opacity: 0.98; --trol-island-sidebar-skin-filter: saturate(1.02); }
[data-trol-island-topBar-texture="leather-cognac"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-cognac.jpg"); --trol-island-topBar-skin-opacity: 0.98; --trol-island-topBar-skin-filter: saturate(1.02); }
[data-trol-island-listRow-texture="leather-cognac"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-cognac.jpg"); --trol-island-listRow-skin-opacity: 0.98; --trol-island-listRow-skin-filter: saturate(1.02); }
[data-trol-island-listRowFollowUp-texture="leather-cognac"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-cognac.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.98; --trol-island-listRowFollowUp-skin-filter: saturate(1.02); }
[data-trol-island-readingPane-texture="leather-cognac"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-cognac.jpg"); --trol-island-readingPane-skin-opacity: 0.98; --trol-island-readingPane-skin-filter: saturate(1.02); }
[data-trol-island-modal-texture="leather-cognac"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-cognac.jpg"); --trol-island-modal-skin-opacity: 0.98; --trol-island-modal-skin-filter: saturate(1.02); }
[data-trol-island-tray-texture="leather-cognac"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-cognac.jpg"); --trol-island-tray-skin-opacity: 0.98; --trol-island-tray-skin-filter: saturate(1.02); }
[data-trol-island-buttonPrimary-texture="leather-cognac"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-cognac.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.98; --trol-island-buttonPrimary-skin-filter: saturate(1.02); }
[data-trol-island-tab-texture="leather-cognac"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-cognac.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.98; }
[data-trol-island-sidebar-texture="leather-espresso"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-sidebar-skin-opacity: 0.98; --trol-island-sidebar-skin-filter: saturate(1.02); }
[data-trol-island-topBar-texture="leather-espresso"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-topBar-skin-opacity: 0.98; --trol-island-topBar-skin-filter: saturate(1.02); }
[data-trol-island-listRow-texture="leather-espresso"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-listRow-skin-opacity: 0.98; --trol-island-listRow-skin-filter: saturate(1.02); }
[data-trol-island-listRowFollowUp-texture="leather-espresso"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.98; --trol-island-listRowFollowUp-skin-filter: saturate(1.02); }
[data-trol-island-readingPane-texture="leather-espresso"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-readingPane-skin-opacity: 0.98; --trol-island-readingPane-skin-filter: saturate(1.02); }
[data-trol-island-modal-texture="leather-espresso"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-modal-skin-opacity: 0.98; --trol-island-modal-skin-filter: saturate(1.02); }
[data-trol-island-tray-texture="leather-espresso"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-tray-skin-opacity: 0.98; --trol-island-tray-skin-filter: saturate(1.02); }
[data-trol-island-buttonPrimary-texture="leather-espresso"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.98; --trol-island-buttonPrimary-skin-filter: saturate(1.02); }
[data-trol-island-tab-texture="leather-espresso"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-espresso.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.98; }
[data-trol-island-sidebar-texture="leather-chocolate"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-chocolate.jpg"); --trol-island-sidebar-skin-opacity: 0.98; --trol-island-sidebar-skin-filter: saturate(1.02); }
[data-trol-island-topBar-texture="leather-chocolate"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-chocolate.jpg"); --trol-island-topBar-skin-opacity: 0.98; --trol-island-topBar-skin-filter: saturate(1.02); }
[data-trol-island-listRow-texture="leather-chocolate"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-chocolate.jpg"); --trol-island-listRow-skin-opacity: 0.98; --trol-island-listRow-skin-filter: saturate(1.02); }
[data-trol-island-listRowFollowUp-texture="leather-chocolate"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-chocolate.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.98; --trol-island-listRowFollowUp-skin-filter: saturate(1.02); }
[data-trol-island-readingPane-texture="leather-chocolate"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-chocolate.jpg"); --trol-island-readingPane-skin-opacity: 0.98; --trol-island-readingPane-skin-filter: saturate(1.02); }
[data-trol-island-modal-texture="leather-chocolate"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-chocolate.jpg"); --trol-island-modal-skin-opacity: 0.98; --trol-island-modal-skin-filter: saturate(1.02); }
[data-trol-island-tray-texture="leather-chocolate"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-chocolate.jpg"); --trol-island-tray-skin-opacity: 0.98; --trol-island-tray-skin-filter: saturate(1.02); }
[data-trol-island-buttonPrimary-texture="leather-chocolate"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-chocolate.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.98; --trol-island-buttonPrimary-skin-filter: saturate(1.02); }
[data-trol-island-tab-texture="leather-chocolate"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-chocolate.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.98; }
[data-trol-island-sidebar-texture="leather-black"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-black.jpg"); --trol-island-sidebar-skin-opacity: 0.98; --trol-island-sidebar-skin-filter: saturate(1.02); }
[data-trol-island-topBar-texture="leather-black"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-black.jpg"); --trol-island-topBar-skin-opacity: 0.98; --trol-island-topBar-skin-filter: saturate(1.02); }
[data-trol-island-listRow-texture="leather-black"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-black.jpg"); --trol-island-listRow-skin-opacity: 0.98; --trol-island-listRow-skin-filter: saturate(1.02); }
[data-trol-island-listRowFollowUp-texture="leather-black"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-black.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.98; --trol-island-listRowFollowUp-skin-filter: saturate(1.02); }
[data-trol-island-readingPane-texture="leather-black"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-black.jpg"); --trol-island-readingPane-skin-opacity: 0.98; --trol-island-readingPane-skin-filter: saturate(1.02); }
[data-trol-island-modal-texture="leather-black"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-black.jpg"); --trol-island-modal-skin-opacity: 0.98; --trol-island-modal-skin-filter: saturate(1.02); }
[data-trol-island-tray-texture="leather-black"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-black.jpg"); --trol-island-tray-skin-opacity: 0.98; --trol-island-tray-skin-filter: saturate(1.02); }
[data-trol-island-buttonPrimary-texture="leather-black"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-black.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.98; --trol-island-buttonPrimary-skin-filter: saturate(1.02); }
[data-trol-island-tab-texture="leather-black"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/leather-black.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.98; }
[data-trol-island-sidebar-texture="leather-suede"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-cognac.jpg"); --trol-island-sidebar-skin-opacity: 0.98; --trol-island-sidebar-skin-filter: saturate(1.02); }
[data-trol-island-topBar-texture="leather-suede"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-cognac.jpg"); --trol-island-topBar-skin-opacity: 0.98; --trol-island-topBar-skin-filter: saturate(1.02); }
[data-trol-island-listRow-texture="leather-suede"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-cognac.jpg"); --trol-island-listRow-skin-opacity: 0.98; --trol-island-listRow-skin-filter: saturate(1.02); }
[data-trol-island-listRowFollowUp-texture="leather-suede"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-cognac.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.98; --trol-island-listRowFollowUp-skin-filter: saturate(1.02); }
[data-trol-island-readingPane-texture="leather-suede"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-cognac.jpg"); --trol-island-readingPane-skin-opacity: 0.98; --trol-island-readingPane-skin-filter: saturate(1.02); }
[data-trol-island-modal-texture="leather-suede"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-cognac.jpg"); --trol-island-modal-skin-opacity: 0.98; --trol-island-modal-skin-filter: saturate(1.02); }
[data-trol-island-tray-texture="leather-suede"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-cognac.jpg"); --trol-island-tray-skin-opacity: 0.98; --trol-island-tray-skin-filter: saturate(1.02); }
[data-trol-island-buttonPrimary-texture="leather-suede"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-cognac.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.98; --trol-island-buttonPrimary-skin-filter: saturate(1.02); }
[data-trol-island-tab-texture="leather-suede"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-cognac.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.98; }
[data-trol-island-sidebar-texture="leather-suede-brown"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-brown.jpg"); --trol-island-sidebar-skin-opacity: 0.98; --trol-island-sidebar-skin-filter: saturate(1.02); }
[data-trol-island-topBar-texture="leather-suede-brown"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-brown.jpg"); --trol-island-topBar-skin-opacity: 0.98; --trol-island-topBar-skin-filter: saturate(1.02); }
[data-trol-island-listRow-texture="leather-suede-brown"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-brown.jpg"); --trol-island-listRow-skin-opacity: 0.98; --trol-island-listRow-skin-filter: saturate(1.02); }
[data-trol-island-listRowFollowUp-texture="leather-suede-brown"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-brown.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.98; --trol-island-listRowFollowUp-skin-filter: saturate(1.02); }
[data-trol-island-readingPane-texture="leather-suede-brown"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-brown.jpg"); --trol-island-readingPane-skin-opacity: 0.98; --trol-island-readingPane-skin-filter: saturate(1.02); }
[data-trol-island-modal-texture="leather-suede-brown"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-brown.jpg"); --trol-island-modal-skin-opacity: 0.98; --trol-island-modal-skin-filter: saturate(1.02); }
[data-trol-island-tray-texture="leather-suede-brown"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-brown.jpg"); --trol-island-tray-skin-opacity: 0.98; --trol-island-tray-skin-filter: saturate(1.02); }
[data-trol-island-buttonPrimary-texture="leather-suede-brown"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-brown.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.98; --trol-island-buttonPrimary-skin-filter: saturate(1.02); }
[data-trol-island-tab-texture="leather-suede-brown"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-brown.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.98; }
[data-trol-island-sidebar-texture="leather-suede-draped"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-draped.jpg"); --trol-island-sidebar-skin-opacity: 0.98; --trol-island-sidebar-skin-filter: saturate(1.02); }
[data-trol-island-topBar-texture="leather-suede-draped"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-draped.jpg"); --trol-island-topBar-skin-opacity: 0.98; --trol-island-topBar-skin-filter: saturate(1.02); }
[data-trol-island-listRow-texture="leather-suede-draped"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-draped.jpg"); --trol-island-listRow-skin-opacity: 0.98; --trol-island-listRow-skin-filter: saturate(1.02); }
[data-trol-island-listRowFollowUp-texture="leather-suede-draped"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-draped.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.98; --trol-island-listRowFollowUp-skin-filter: saturate(1.02); }
[data-trol-island-readingPane-texture="leather-suede-draped"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-draped.jpg"); --trol-island-readingPane-skin-opacity: 0.98; --trol-island-readingPane-skin-filter: saturate(1.02); }
[data-trol-island-modal-texture="leather-suede-draped"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-draped.jpg"); --trol-island-modal-skin-opacity: 0.98; --trol-island-modal-skin-filter: saturate(1.02); }
[data-trol-island-tray-texture="leather-suede-draped"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-draped.jpg"); --trol-island-tray-skin-opacity: 0.98; --trol-island-tray-skin-filter: saturate(1.02); }
[data-trol-island-buttonPrimary-texture="leather-suede-draped"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-draped.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.98; --trol-island-buttonPrimary-skin-filter: saturate(1.02); }
[data-trol-island-tab-texture="leather-suede-draped"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/suede-draped.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.98; }
[data-trol-island-sidebar-texture="stone"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-slate.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="stone"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-slate.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="stone"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-slate.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="stone"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-slate.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="stone"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-slate.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="stone"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-slate.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="stone"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-slate.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="stone"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-slate.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="stone"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-slate.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="marble"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-classic.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="marble"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-classic.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="marble"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-classic.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="marble"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-classic.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="marble"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-classic.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="marble"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-classic.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="marble"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-classic.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="marble"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-classic.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="marble"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-classic.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="granite"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-granite.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="granite"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-granite.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="granite"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-granite.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="granite"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-granite.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="granite"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-granite.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="granite"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-granite.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="granite"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-granite.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="granite"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-granite.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="granite"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-granite.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="travertine"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-travertine.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="travertine"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-travertine.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="travertine"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-travertine.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="travertine"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-travertine.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="travertine"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-travertine.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="travertine"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-travertine.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="travertine"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-travertine.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="travertine"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-travertine.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="travertine"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-travertine.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="carrara"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="carrara"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="carrara"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="carrara"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="carrara"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="carrara"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="carrara"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="carrara"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="carrara"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="carrara-bold"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara-bold.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="carrara-bold"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara-bold.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="carrara-bold"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara-bold.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="carrara-bold"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara-bold.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="carrara-bold"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara-bold.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="carrara-bold"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara-bold.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="carrara-bold"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara-bold.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="carrara-bold"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara-bold.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="carrara-bold"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-carrara-bold.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="calacatta"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-calacatta.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="calacatta"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-calacatta.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="calacatta"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-calacatta.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="calacatta"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-calacatta.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="calacatta"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-calacatta.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="calacatta"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-calacatta.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="calacatta"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-calacatta.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="calacatta"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-calacatta.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="calacatta"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-calacatta.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="marble-white"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-white.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="marble-white"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-white.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="marble-white"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-white.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="marble-white"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-white.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="marble-white"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-white.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="marble-white"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-white.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="marble-white"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-white.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="marble-white"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-white.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="marble-white"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-white.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="marble-light-grey"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-light-grey.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="marble-light-grey"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-light-grey.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="marble-light-grey"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-light-grey.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="marble-light-grey"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-light-grey.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="marble-light-grey"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-light-grey.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="marble-light-grey"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-light-grey.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="marble-light-grey"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-light-grey.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="marble-light-grey"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-light-grey.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="marble-light-grey"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-light-grey.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="marble-cloud"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-cloud.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="marble-cloud"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-cloud.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="marble-cloud"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-cloud.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="marble-cloud"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-cloud.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="marble-cloud"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-cloud.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="marble-cloud"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-cloud.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="marble-cloud"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-cloud.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="marble-cloud"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-cloud.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="marble-cloud"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/marble-cloud.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="teak"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-teak.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="teak"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-teak.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="teak"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-teak.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="teak"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-teak.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="teak"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-teak.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="teak"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-teak.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="teak"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-teak.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="teak"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-teak.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="teak"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-teak.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="burl"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/wood-burl.svg"); --trol-island-sidebar-skin-opacity: 0.5; }
[data-trol-island-topBar-texture="burl"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/wood-burl.svg"); --trol-island-topBar-skin-opacity: 0.5; }
[data-trol-island-listRow-texture="burl"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/wood-burl.svg"); --trol-island-listRow-skin-opacity: 0.5; }
[data-trol-island-listRowFollowUp-texture="burl"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/wood-burl.svg"); --trol-island-listRowFollowUp-skin-opacity: 0.5; }
[data-trol-island-readingPane-texture="burl"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/wood-burl.svg"); --trol-island-readingPane-skin-opacity: 0.5; }
[data-trol-island-modal-texture="burl"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/wood-burl.svg"); --trol-island-modal-skin-opacity: 0.5; }
[data-trol-island-tray-texture="burl"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/wood-burl.svg"); --trol-island-tray-skin-opacity: 0.5; }
[data-trol-island-buttonPrimary-texture="burl"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/wood-burl.svg"); --trol-island-buttonPrimary-skin-opacity: 0.5; }
[data-trol-island-tab-texture="burl"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/wood-burl.svg"); --trol-island-sidebar-tab-skin-opacity: 0.5; }
[data-trol-island-sidebar-texture="exotic"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-exotic.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="exotic"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-exotic.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="exotic"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-exotic.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="exotic"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-exotic.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="exotic"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-exotic.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="exotic"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-exotic.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="exotic"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-exotic.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="exotic"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-exotic.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="exotic"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-exotic.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="mahogany"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-mahogany.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="mahogany"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-mahogany.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="mahogany"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-mahogany.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="mahogany"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-mahogany.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="mahogany"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-mahogany.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="mahogany"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-mahogany.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="mahogany"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-mahogany.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="mahogany"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-mahogany.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="mahogany"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-mahogany.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="tigerwood"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-tigerwood.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="tigerwood"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-tigerwood.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="tigerwood"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-tigerwood.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="tigerwood"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-tigerwood.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="tigerwood"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-tigerwood.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="tigerwood"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-tigerwood.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="tigerwood"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-tigerwood.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="tigerwood"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-tigerwood.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="tigerwood"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-tigerwood.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="walnut"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-walnut.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="walnut"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-walnut.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="walnut"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-walnut.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="walnut"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-walnut.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="walnut"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-walnut.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="walnut"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-walnut.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="walnut"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-walnut.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="walnut"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-walnut.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="walnut"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-walnut.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="cherry"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-cherry.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="cherry"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-cherry.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="cherry"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-cherry.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="cherry"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-cherry.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="cherry"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-cherry.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="cherry"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-cherry.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="cherry"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-cherry.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="cherry"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-cherry.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="cherry"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-cherry.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="rosewood"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-rosewood.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="rosewood"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-rosewood.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="rosewood"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-rosewood.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="rosewood"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-rosewood.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="rosewood"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-rosewood.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="rosewood"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-rosewood.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="rosewood"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-rosewood.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="rosewood"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-rosewood.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="rosewood"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/wood-rosewood.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="elephant"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-elephant.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="elephant"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-elephant.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="elephant"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-elephant.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="elephant"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-elephant.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="elephant"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-elephant.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="elephant"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-elephant.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="elephant"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-elephant.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="elephant"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-elephant.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="elephant"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-elephant.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="zebra"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/fur-zebra.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="zebra"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/fur-zebra.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="zebra"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/fur-zebra.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="zebra"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/fur-zebra.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="zebra"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/fur-zebra.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="zebra"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/fur-zebra.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="zebra"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/fur-zebra.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="zebra"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/fur-zebra.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="zebra"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/fur-zebra.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="alligator"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="alligator"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="alligator"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="alligator"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="alligator"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="alligator"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="alligator"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="alligator"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="alligator"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="alligator-cognac"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-cognac.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="alligator-cognac"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-cognac.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="alligator-cognac"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-cognac.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="alligator-cognac"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-cognac.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="alligator-cognac"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-cognac.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="alligator-cognac"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-cognac.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="alligator-cognac"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-cognac.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="alligator-cognac"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-cognac.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="alligator-cognac"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-cognac.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="alligator-black"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-black.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="alligator-black"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-black.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="alligator-black"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-black.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="alligator-black"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-black.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="alligator-black"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-black.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="alligator-black"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-black.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="alligator-black"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-black.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="alligator-black"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-black.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="alligator-black"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-black.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="alligator-teal"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-teal.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="alligator-teal"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-teal.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="alligator-teal"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-teal.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="alligator-teal"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-teal.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="alligator-teal"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-teal.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="alligator-teal"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-teal.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="alligator-teal"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-teal.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="alligator-teal"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-teal.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="alligator-teal"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-teal.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="alligator-white"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-white.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="alligator-white"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-white.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="alligator-white"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-white.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="alligator-white"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-white.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="alligator-white"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-white.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="alligator-white"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-white.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="alligator-white"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-white.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="alligator-white"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-white.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="alligator-white"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-white.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="alligator-ivory"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-ivory.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="alligator-ivory"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-ivory.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="alligator-ivory"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-ivory.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="alligator-ivory"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-ivory.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="alligator-ivory"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-ivory.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="alligator-ivory"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-ivory.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="alligator-ivory"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-ivory.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="alligator-ivory"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-ivory.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="alligator-ivory"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-alligator-ivory.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="croc"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-croc.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="croc"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-croc.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="croc"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-croc.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="croc"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-croc.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="croc"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-croc.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="croc"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-croc.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="croc"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-croc.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="croc"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-croc.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="croc"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-croc.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="lizard"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-lizard.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="lizard"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-lizard.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="lizard"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-lizard.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="lizard"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-lizard.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="lizard"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-lizard.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="lizard"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-lizard.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="lizard"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-lizard.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="lizard"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-lizard.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="lizard"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-lizard.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="ostrich"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="ostrich"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="ostrich"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="ostrich"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="ostrich"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="ostrich"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="ostrich"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="ostrich"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="ostrich"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="ostrich-navy"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-navy.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="ostrich-navy"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-navy.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="ostrich-navy"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-navy.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="ostrich-navy"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-navy.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="ostrich-navy"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-navy.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="ostrich-navy"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-navy.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="ostrich-navy"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-navy.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="ostrich-navy"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-navy.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="ostrich-navy"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-navy.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="ostrich-olive"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-olive.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="ostrich-olive"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-olive.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="ostrich-olive"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-olive.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="ostrich-olive"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-olive.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="ostrich-olive"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-olive.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="ostrich-olive"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-olive.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="ostrich-olive"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-olive.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="ostrich-olive"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-olive.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="ostrich-olive"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-ostrich-olive.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="quill-dots"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-quill-dots.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="quill-dots"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-quill-dots.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="quill-dots"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-quill-dots.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="quill-dots"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-quill-dots.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="quill-dots"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-quill-dots.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="quill-dots"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-quill-dots.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="quill-dots"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-quill-dots.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="quill-dots"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-quill-dots.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="quill-dots"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-quill-dots.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="snake"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-snake.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="snake"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-snake.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="snake"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-snake.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="snake"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-snake.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="snake"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-snake.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="snake"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-snake.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="snake"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-snake.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="snake"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-snake.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="snake"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-snake.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="tiger"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-stripes.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="tiger"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-stripes.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="tiger"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-stripes.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="tiger"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-stripes.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="tiger"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-stripes.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="tiger"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-stripes.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="tiger"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-stripes.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="tiger"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-stripes.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="tiger"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-stripes.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="tiger-fur-gold"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur-gold.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="tiger-fur-gold"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur-gold.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="tiger-fur-gold"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur-gold.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="tiger-fur-gold"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur-gold.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="tiger-fur-gold"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur-gold.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="tiger-fur-gold"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur-gold.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="tiger-fur-gold"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur-gold.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="tiger-fur-gold"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur-gold.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="tiger-fur-gold"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur-gold.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="sawtooth-print"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="sawtooth-print"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="sawtooth-print"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="sawtooth-print"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="sawtooth-print"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="sawtooth-print"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="sawtooth-print"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="sawtooth-print"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="sawtooth-print"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-tiger-fur.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="wrinkled-hide"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-wrinkled-hide.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="wrinkled-hide"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-wrinkled-hide.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="wrinkled-hide"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-wrinkled-hide.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="wrinkled-hide"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-wrinkled-hide.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="wrinkled-hide"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-wrinkled-hide.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="wrinkled-hide"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-wrinkled-hide.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="wrinkled-hide"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-wrinkled-hide.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="wrinkled-hide"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-wrinkled-hide.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="wrinkled-hide"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-wrinkled-hide.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="jaguar-rosettes"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-jaguar-rosettes.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="jaguar-rosettes"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-jaguar-rosettes.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="jaguar-rosettes"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-jaguar-rosettes.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="jaguar-rosettes"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-jaguar-rosettes.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="jaguar-rosettes"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-jaguar-rosettes.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="jaguar-rosettes"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-jaguar-rosettes.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="jaguar-rosettes"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-jaguar-rosettes.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="jaguar-rosettes"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-jaguar-rosettes.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="jaguar-rosettes"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-jaguar-rosettes.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="pebbled-leather"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-pebbled-leather.jpg"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="pebbled-leather"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-pebbled-leather.jpg"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="pebbled-leather"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-pebbled-leather.jpg"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="pebbled-leather"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-pebbled-leather.jpg"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="pebbled-leather"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-pebbled-leather.jpg"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="pebbled-leather"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-pebbled-leather.jpg"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="pebbled-leather"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-pebbled-leather.jpg"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="pebbled-leather"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-pebbled-leather.jpg"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="pebbled-leather"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-pebbled-leather.jpg"); --trol-island-sidebar-tab-skin-opacity: 0.72; }
[data-trol-island-sidebar-texture="desert-eyes"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-desert-eyes.jpg"); --trol-island-sidebar-skin-opacity: 1; }
[data-trol-island-topBar-texture="desert-eyes"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-desert-eyes.jpg"); --trol-island-topBar-skin-opacity: 1; }
[data-trol-island-listRow-texture="desert-eyes"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-desert-eyes.jpg"); --trol-island-listRow-skin-opacity: 1; }
[data-trol-island-listRowFollowUp-texture="desert-eyes"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-desert-eyes.jpg"); --trol-island-listRowFollowUp-skin-opacity: 1; }
[data-trol-island-readingPane-texture="desert-eyes"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-desert-eyes.jpg"); --trol-island-readingPane-skin-opacity: 1; }
[data-trol-island-modal-texture="desert-eyes"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-desert-eyes.jpg"); --trol-island-modal-skin-opacity: 1; }
[data-trol-island-tray-texture="desert-eyes"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-desert-eyes.jpg"); --trol-island-tray-skin-opacity: 1; }
[data-trol-island-buttonPrimary-texture="desert-eyes"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-desert-eyes.jpg"); --trol-island-buttonPrimary-skin-opacity: 1; }
[data-trol-island-tab-texture="desert-eyes"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/stone-desert-eyes.jpg"); --trol-island-sidebar-tab-skin-opacity: 1; }
[data-trol-island-sidebar-texture="leopard"] { --trol-island-sidebar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-leopard.webp"); --trol-island-sidebar-skin-opacity: 0.72; }
[data-trol-island-topBar-texture="leopard"] { --trol-island-topBar-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-leopard.webp"); --trol-island-topBar-skin-opacity: 0.72; }
[data-trol-island-listRow-texture="leopard"] { --trol-island-listRow-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-leopard.webp"); --trol-island-listRow-skin-opacity: 0.72; }
[data-trol-island-listRowFollowUp-texture="leopard"] { --trol-island-listRowFollowUp-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-leopard.webp"); --trol-island-listRowFollowUp-skin-opacity: 0.72; }
[data-trol-island-readingPane-texture="leopard"] { --trol-island-readingPane-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-leopard.webp"); --trol-island-readingPane-skin-opacity: 0.72; }
[data-trol-island-modal-texture="leopard"] { --trol-island-modal-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-leopard.webp"); --trol-island-modal-skin-opacity: 0.72; }
[data-trol-island-tray-texture="leopard"] { --trol-island-tray-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-leopard.webp"); --trol-island-tray-skin-opacity: 0.72; }
[data-trol-island-buttonPrimary-texture="leopard"] { --trol-island-buttonPrimary-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-leopard.webp"); --trol-island-buttonPrimary-skin-opacity: 0.72; }
[data-trol-island-tab-texture="leopard"] { --trol-island-sidebar-tab-skin-texture: url("https://thetrols.com/assets/textures/photos/skin-leopard.webp"); --trol-island-sidebar-tab-skin-opacity: 0.72; }

[data-trol-island-texture-busy="1"] {
  --trol-island-skin-opacity: 0.22;
  --trol-island-skin-opacity-cap: 0.38;
  --trol-island-skin-filter: saturate(0.92) blur(0.4px);
}


/* --- engine layer: trol-island-surface.css --- */
/**
 * Floating island surface material: Theme Studio Phase 2.
 * Driven by floatingUi.surfaceTexture → html[data-trol-island-texture].
 * Tone vars: --trol-island-skin-* (set by trol-theme-bundle.js / theme-studio.js).
 */
:root {
  --trol-island-sidebar-tab-skin-texture: none;
  --trol-island-sidebar-tab-skin-sepia: var(--trol-island-skin-sepia, 0);
  --trol-island-sidebar-tab-skin-hue: var(--trol-island-skin-hue, 0deg);
  --trol-island-sidebar-tab-skin-saturate: var(--trol-island-skin-saturate, 1);
  --trol-island-sidebar-tab-skin-brightness: var(--trol-island-skin-brightness, 1);
  --trol-island-sidebar-tab-skin-contrast: var(--trol-island-skin-contrast, 1);
  --trol-island-sidebar-tab-skin-amount: var(--trol-island-skin-amount, 1);
  --trol-island-sidebar-tab-skin-hi-grad: var(--trol-island-surface-light-hi-grad, none);
  --trol-island-sidebar-tab-skin-sh-grad: var(--trol-island-surface-light-sh-grad, none);
  --trol-island-sidebar-tab-texture-scale: var(--trol-island-texture-scale, 100);
  --trol-island-sidebar-tab-texture-bg-size: var(--trol-island-texture-bg-size, 100%);
  --trol-island-skin-texture: none;
  --trol-island-skin-opacity: 0.64;
  --trol-island-skin-opacity-cap: 1;
  --trol-island-skin-amount: 1;
  --trol-island-skin-sepia: 0;
  --trol-island-skin-hue: 0deg;
  --trol-island-skin-saturate: 1;
  --trol-island-skin-brightness: 1;
  --trol-island-skin-contrast: 1;
  --trol-island-skin-gloss: 0.35;
  --trol-island-skin-filter: ;
  --trol-island-surface-light-angle: 315deg;
  --trol-island-surface-light-highlight: 0.5;
  --trol-island-surface-light-shadow: 0.5;
  --trol-island-surface-light-hi-grad: none;
  --trol-island-surface-light-sh-grad: none;
  --trol-island-gap: 12px;
  /* Pattern size for island surface materials (Theme Studio floatingUi.surfaceTone). */
  --trol-island-texture-scale: 100;
  --trol-island-texture-bg-size: 100%;
}

/* Texture id → image URLs: see engine layer trol-island-texture-registry.css (generated). */

html[data-trol-island-texture] .ctx-shell .ctx-left .ctx-row,
html[data-trol-island-texture] .day-scroll-list .day-item-card,
html[data-trol-island-texture] .et-messages-panel .et-stub-list li.et-msg-row,
html[data-trol-island-texture] .trol-island-folder__body,
html[data-trol-island-texture] .trol-island-folder__tab,
html[data-trol-island-tab-texture] .trol-island-folder__tab,
html[data-trol-island-texture] .day-sidebar-island,
html[data-trol-island-texture] .day-list-head-island,
html[data-trol-island-texture] div.main > div.topbar,
html[data-trol-island-texture] .ctx-modal,
html[data-trol-island-texture] .ctrol-modal-card,
html[data-trol-island-texture] .et-statusrail,
html[data-trol-island-texture] .ctx-shell .ctx-right,
html[data-trol-island-texture] .ctx-shell .ctx-pane,
html[data-trol-island-texture] .et-reader-panel,
html[data-trol-island-texture] #et-reader-panel.et-reader-panel,
html[data-trol-island-texture] .jd-project-shell,
html[data-trol-island-texture] .day-today-detail,
html[data-trol-island-texture] .day-item-hub,
html[data-trol-island-texture] .pht-photo-detail,
html[data-trol-island-texture] .cal-wrap,
html[data-trol-island-texture] .st-thread-panel {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
html[data-trol-island-texture] .ctx-shell .ctx-left .ctx-row::before,
html[data-trol-island-texture] .day-scroll-list .day-item-card::before,
html[data-trol-island-texture] .et-messages-panel .et-stub-list li.et-msg-row::before,
html[data-trol-island-texture] .trol-island-folder__body::before,
html[data-trol-island-texture] .day-sidebar-island:not(.trol-island-folder)::before,
html[data-trol-island-texture] .day-list-head-island::before,
html[data-trol-island-texture] div.main > div.topbar::before,
html[data-trol-island-texture] .ctx-modal::before,
html[data-trol-island-texture] .ctrol-modal-card::before,
html[data-trol-island-texture] .et-statusrail::before,
html[data-trol-island-texture] .ctx-shell .ctx-right::before,
html[data-trol-island-texture] .ctx-shell .ctx-pane::before,
html[data-trol-island-texture] .et-reader-panel::before,
html[data-trol-island-texture] #et-reader-panel.et-reader-panel::before,
html[data-trol-island-texture] .jd-project-shell::before,
html[data-trol-island-texture] .day-today-detail::before,
html[data-trol-island-texture] .day-item-hub::before,
html[data-trol-island-texture] .pht-photo-detail::before,
html[data-trol-island-texture] .cal-wrap::before,
html[data-trol-island-texture] .st-thread-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: -1; /* behind card text: z:0 paints over non-positioned in-flow content in isolation:isolate */
  background-image:
    var(--trol-island-surface-light-sh-grad, none),
    var(--trol-island-surface-light-hi-grad, none),
    var(--trol-island-skin-texture, none);
  background-repeat: no-repeat;
  background-size: 100% 100%, 100% 100%, var(--trol-island-texture-bg-size, 100%);
  background-position: center;
  opacity: min(var(--trol-island-skin-opacity-cap, 1), calc(var(--trol-island-skin-opacity, 0.64) * var(--trol-island-skin-amount, 1) * var(--trol-island-texture-layer-opacity, 1)));
  filter: sepia(var(--trol-island-skin-sepia, 0))
    hue-rotate(var(--trol-island-skin-hue, 0deg))
    saturate(var(--trol-island-skin-saturate, 1))
    brightness(var(--trol-island-skin-brightness, 1))
    contrast(var(--trol-island-skin-contrast, 1))
    var(--trol-island-skin-filter, );
  /* normal: soft-light blended strong backdrop vein/grain through island chrome */
  mix-blend-mode: normal;
}
html[data-trol-island-texture] .trol-island-folder__tab::before,
html[data-trol-island-tab-texture] .trol-island-folder__tab::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: -1;
  background-image:
    var(--trol-island-sidebar-tab-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none)),
    var(--trol-island-sidebar-tab-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none)),
    var(--trol-island-sidebar-tab-skin-texture, var(--trol-island-skin-texture, none));
  background-repeat: no-repeat;
  background-size: 100% 100%, 100% 100%, var(--trol-island-sidebar-tab-texture-bg-size, var(--trol-island-texture-bg-size, 100%));
  background-position: center;
  opacity: min(var(--trol-island-skin-opacity-cap, 1), calc(var(--trol-island-skin-opacity, 0.64) * var(--trol-island-sidebar-tab-skin-amount, var(--trol-island-skin-amount, 1)) * var(--trol-island-tab-texture-layer-opacity, var(--trol-island-texture-layer-opacity, 1))));
  filter: sepia(var(--trol-island-sidebar-tab-skin-sepia, var(--trol-island-skin-sepia, 0)))
    hue-rotate(var(--trol-island-sidebar-tab-skin-hue, var(--trol-island-skin-hue, 0deg)))
    saturate(var(--trol-island-sidebar-tab-skin-saturate, var(--trol-island-skin-saturate, 1)))
    brightness(var(--trol-island-sidebar-tab-skin-brightness, var(--trol-island-skin-brightness, 1)))
    contrast(var(--trol-island-sidebar-tab-skin-contrast, var(--trol-island-skin-contrast, 1)))
    var(--trol-island-skin-filter, );
  mix-blend-mode: normal;
}
html[data-trol-island-texture] .ctx-shell .ctx-left .ctx-row > *,
html[data-trol-island-texture] .day-scroll-list .day-item-card > *,
html[data-trol-island-texture] .et-messages-panel .et-stub-list li.et-msg-row > *,
html[data-trol-island-texture] .trol-island-folder__body > *,
html[data-trol-island-texture] .trol-island-folder__tab > *,
html[data-trol-island-tab-texture] .trol-island-folder__tab > *,
html[data-trol-island-texture] .day-sidebar-island:not(.trol-island-folder) > *,
html[data-trol-island-texture] .day-list-head-island > *,
html[data-trol-island-texture] div.main > div.topbar > *,
html[data-trol-island-texture] .ctx-modal > *,
html[data-trol-island-texture] .ctrol-modal-card > *,
html[data-trol-island-texture] .et-statusrail > * {
  position: relative;
  z-index: 2;
}

/* Theme Studio mock islands */
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-sidebar .trol-island-folder__body,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-sidebar .trol-island-folder__tab,
#ts-solo-root[data-trol-island-tab-texture] .jt-ts-mock-sidebar .trol-island-folder__tab,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-topbar,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-row,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-modal,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-tray,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-reading {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-sidebar .trol-island-folder__body::before,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-topbar::before,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-row::before,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-modal::before,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-tray::before,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-reading::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 0;
  background-image:
    var(--trol-island-surface-light-sh-grad, none),
    var(--trol-island-surface-light-hi-grad, none),
    var(--trol-island-skin-texture, none);
  background-repeat: no-repeat;
  background-size: 100% 100%, 100% 100%, var(--trol-island-texture-bg-size, 100%);
  background-position: center;
  opacity: min(var(--trol-island-skin-opacity-cap, 1), calc(var(--trol-island-skin-opacity, 0.64) * var(--trol-island-skin-amount, 1) * var(--trol-island-texture-layer-opacity, 1)));
  filter: sepia(var(--trol-island-skin-sepia, 0))
    hue-rotate(var(--trol-island-skin-hue, 0deg))
    saturate(var(--trol-island-skin-saturate, 1))
    brightness(var(--trol-island-skin-brightness, 1))
    contrast(var(--trol-island-skin-contrast, 1))
    var(--trol-island-skin-filter, );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, calc(var(--trol-island-skin-gloss, 0.35) * 0.1));
}
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-sidebar .trol-island-folder__tab::before,
#ts-solo-root[data-trol-island-tab-texture] .jt-ts-mock-sidebar .trol-island-folder__tab::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 0;
  background-image:
    var(--trol-island-sidebar-tab-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none)),
    var(--trol-island-sidebar-tab-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none)),
    var(--trol-island-sidebar-tab-skin-texture, var(--trol-island-skin-texture, none));
  background-repeat: no-repeat;
  background-size: 100% 100%, 100% 100%, var(--trol-island-sidebar-tab-texture-bg-size, var(--trol-island-texture-bg-size, 100%));
  background-position: center;
  opacity: min(var(--trol-island-skin-opacity-cap, 1), calc(var(--trol-island-skin-opacity, 0.64) * var(--trol-island-sidebar-tab-skin-amount, var(--trol-island-skin-amount, 1)) * var(--trol-island-tab-texture-layer-opacity, var(--trol-island-texture-layer-opacity, 1))));
  filter: sepia(var(--trol-island-sidebar-tab-skin-sepia, var(--trol-island-skin-sepia, 0)))
    hue-rotate(var(--trol-island-sidebar-tab-skin-hue, var(--trol-island-skin-hue, 0deg)))
    saturate(var(--trol-island-sidebar-tab-skin-saturate, var(--trol-island-skin-saturate, 1)))
    brightness(var(--trol-island-sidebar-tab-skin-brightness, var(--trol-island-skin-brightness, 1)))
    contrast(var(--trol-island-sidebar-tab-skin-contrast, var(--trol-island-skin-contrast, 1)))
    var(--trol-island-skin-filter, );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, calc(var(--trol-island-skin-gloss, 0.35) * 0.1));
}
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-sidebar .trol-island-folder__body > *,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-sidebar .trol-island-folder__tab > *,
#ts-solo-root[data-trol-island-tab-texture] .jt-ts-mock-sidebar .trol-island-folder__tab > *,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-topbar-inn,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-row > *,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-modal > *,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-tray > *,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-reading > *,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-btn,
#ts-solo-root[data-trol-island-texture] .jt-ts-mock-btn-label {
  position: relative;
  z-index: 2;
}

/* Per-element island surface (Theme Studio mock: click-select targets) */
.jt-ts-mock-sidebar[data-ts-island-texture] .trol-island-folder__body,
.jt-ts-mock-sidebar[data-ts-island-texture] .trol-island-folder__tab,
.jt-ts-mock-sidebar[data-ts-island-tab-texture] .trol-island-folder__tab,
.jt-ts-mock-topbar[data-ts-island-texture],
.jt-ts-mock-row[data-ts-island-texture],
.jt-ts-mock-modal[data-ts-island-texture],
.jt-ts-mock-tray[data-ts-island-texture],
.jt-ts-mock-reading[data-ts-island-texture],
.jt-ts-mock-btn[data-ts-island-texture] {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.jt-ts-mock-sidebar[data-ts-island-texture] .trol-island-folder__body > *,
.jt-ts-mock-sidebar[data-ts-island-texture] .trol-island-folder__tab > *,
.jt-ts-mock-sidebar[data-ts-island-tab-texture] .trol-island-folder__tab > *,
.jt-ts-mock-topbar[data-ts-island-texture] .jt-ts-mock-topbar-inn,
.jt-ts-mock-row[data-ts-island-texture] > *,
.jt-ts-mock-modal[data-ts-island-texture] > *,
.jt-ts-mock-tray[data-ts-island-texture] > *,
.jt-ts-mock-reading[data-ts-island-texture] > *,
.jt-ts-mock-btn[data-ts-island-texture],
.jt-ts-mock-btn[data-ts-island-texture] .jt-ts-mock-btn-label {
  position: relative;
  z-index: 2;
}
.jt-ts-mock-sidebar[data-ts-island-texture] .trol-island-folder__body::before,
.jt-ts-mock-topbar[data-ts-island-texture]::before,
.jt-ts-mock-row[data-ts-island-texture]::before,
.jt-ts-mock-modal[data-ts-island-texture]::before,
.jt-ts-mock-tray[data-ts-island-texture]::before,
.jt-ts-mock-reading[data-ts-island-texture]::before,
.jt-ts-mock-btn[data-ts-island-texture]::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 0;
  background-image:
    var(--ts-element-island-light-sh-grad, var(--trol-island-surface-light-sh-grad, none)),
    var(--ts-element-island-light-hi-grad, var(--trol-island-surface-light-hi-grad, none)),
    var(--ts-element-island-texture, var(--trol-island-skin-texture, none));
  background-repeat: no-repeat;
  background-size: 100% 100%, 100% 100%, var(--trol-island-texture-bg-size, 100%);
  background-position: center;
  opacity: min(var(--trol-island-skin-opacity-cap, 1), calc(var(--trol-island-skin-opacity, 0.64) * var(--ts-element-island-amount, var(--trol-island-skin-amount, 1)) * var(--ts-element-island-texture-layer-opacity, var(--trol-island-texture-layer-opacity, 1))));
  filter: sepia(var(--ts-element-island-sepia, var(--trol-island-skin-sepia, 0)))
    hue-rotate(var(--ts-element-island-hue, var(--trol-island-skin-hue, 0deg)))
    saturate(var(--ts-element-island-saturate, var(--trol-island-skin-saturate, 1)))
    brightness(var(--ts-element-island-brightness, var(--trol-island-skin-brightness, 1)))
    contrast(var(--ts-element-island-contrast, var(--trol-island-skin-contrast, 1)))
    var(--trol-island-skin-filter, );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, calc(var(--ts-element-island-gloss, var(--trol-island-skin-gloss, 0.35)) * 0.1));
}
.jt-ts-mock-sidebar[data-ts-island-texture] .trol-island-folder__tab::before,
.jt-ts-mock-sidebar[data-ts-island-tab-texture] .trol-island-folder__tab::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 0;
  background-image:
    var(--ts-element-island-tab-light-sh-grad, var(--ts-element-island-light-sh-grad, var(--trol-island-surface-light-sh-grad, none))),
    var(--ts-element-island-tab-light-hi-grad, var(--ts-element-island-light-hi-grad, var(--trol-island-surface-light-hi-grad, none))),
    var(--ts-element-island-tab-texture, var(--ts-element-island-texture, var(--trol-island-skin-texture, none)));
  background-repeat: no-repeat;
  background-size: 100% 100%, 100% 100%, var(--ts-element-island-tab-texture-bg-size, var(--trol-island-texture-bg-size, 100%));
  background-position: center;
  opacity: min(var(--trol-island-skin-opacity-cap, 1), calc(var(--trol-island-skin-opacity, 0.64) * var(--ts-element-island-tab-amount, var(--ts-element-island-amount, var(--trol-island-skin-amount, 1))) * var(--ts-element-island-tab-texture-layer-opacity, var(--trol-island-tab-texture-layer-opacity, var(--trol-island-texture-layer-opacity, 1)))));
  filter: sepia(var(--ts-element-island-tab-sepia, var(--ts-element-island-sepia, var(--trol-island-skin-sepia, 0))))
    hue-rotate(var(--ts-element-island-tab-hue, var(--ts-element-island-hue, var(--trol-island-skin-hue, 0deg))))
    saturate(var(--ts-element-island-tab-saturate, var(--ts-element-island-saturate, var(--trol-island-skin-saturate, 1))))
    brightness(var(--ts-element-island-tab-brightness, var(--ts-element-island-brightness, var(--trol-island-skin-brightness, 1))))
    contrast(var(--ts-element-island-tab-contrast, var(--ts-element-island-contrast, var(--trol-island-skin-contrast, 1))))
    var(--trol-island-skin-filter, );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, calc(var(--ts-element-island-tab-gloss, var(--ts-element-island-gloss, var(--trol-island-skin-gloss, 0.35))) * 0.1));
}

/* Per-role island surfaces (published floatingUi.elements: suite apps) */
/* Positioning context so the per-role ::before texture layer can render (global path gates this
   on data-trol-island-texture, which is null in per-role mode). */
html[data-trol-island-per-role="1"] .trol-island-folder__tab,
html[data-trol-island-per-role="1"] .trol-island-folder__body,
html[data-trol-island-per-role="1"] .day-sidebar-island:not(.trol-island-folder),
html[data-trol-island-per-role="1"] .day-list-head-island,
html[data-trol-island-per-role="1"] div.main > div.topbar,
html[data-trol-island-per-role="1"] .ctx-modal,
html[data-trol-island-per-role="1"] .ctrol-modal-card,
html[data-trol-island-per-role="1"] .day-scroll-list .day-item-card,
html[data-trol-island-per-role="1"] .et-messages-panel .et-stub-list li.et-msg-row,
html[data-trol-island-per-role="1"] .ctx-shell .ctx-left .ctx-row,
html[data-trol-island-per-role="1"] .et-statusrail,
html[data-trol-island-per-role="1"] .et-btn-primary,
html[data-trol-island-per-role="1"] .btn-primary,
html[data-trol-island-per-role="1"] .day-btn:not(.day-btn-ghost):not(.day-btn-danger),
html[data-trol-island-per-role="1"] button[type="submit"].primary {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
html[data-trol-island-per-role="1"] .ctx-shell .ctx-right,
html[data-trol-island-per-role="1"] .ctx-shell .ctx-pane,
html[data-trol-island-per-role="1"] .et-reader-panel,
html[data-trol-island-per-role="1"] #et-reader-panel.et-reader-panel,
html[data-trol-island-per-role="1"] .jd-project-shell,
html[data-trol-island-per-role="1"] .day-today-detail,
html[data-trol-island-per-role="1"] .day-item-hub,
html[data-trol-island-per-role="1"] .pht-photo-detail,
html[data-trol-island-per-role="1"] .cal-wrap,
html[data-trol-island-per-role="1"] .st-thread-panel {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
html[data-trol-island-per-role="1"] .trol-island-folder__tab::before,
html[data-trol-island-per-role="1"] .trol-island-folder__body::before,
html[data-trol-island-per-role="1"] .day-sidebar-island:not(.trol-island-folder)::before,
html[data-trol-island-per-role="1"] .day-list-head-island::before,
html[data-trol-island-per-role="1"] div.main > div.topbar::before,
html[data-trol-island-per-role="1"] .ctx-modal::before,
html[data-trol-island-per-role="1"] .ctrol-modal-card::before,
html[data-trol-island-per-role="1"] .day-scroll-list .day-item-card::before,
html[data-trol-island-per-role="1"] .et-messages-panel .et-stub-list li.et-msg-row::before,
html[data-trol-island-per-role="1"] .ctx-shell .ctx-left .ctx-row::before,
html[data-trol-island-per-role="1"] .ctx-shell .ctx-right::before,
html[data-trol-island-per-role="1"] .ctx-shell .ctx-pane::before,
html[data-trol-island-per-role="1"] .et-reader-panel::before,
html[data-trol-island-per-role="1"] #et-reader-panel.et-reader-panel::before,
html[data-trol-island-per-role="1"] .jd-project-shell::before,
html[data-trol-island-per-role="1"] .day-today-detail::before,
html[data-trol-island-per-role="1"] .day-item-hub::before,
html[data-trol-island-per-role="1"] .pht-photo-detail::before,
html[data-trol-island-per-role="1"] .cal-wrap::before,
html[data-trol-island-per-role="1"] .st-thread-panel::before,
html[data-trol-island-per-role="1"] .et-statusrail::before,
html[data-trol-island-per-role="1"] .et-btn-primary::before,
html[data-trol-island-per-role="1"] .btn-primary::before,
html[data-trol-island-per-role="1"] .day-btn:not(.day-btn-ghost):not(.day-btn-danger)::before,
html[data-trol-island-per-role="1"] button[type="submit"].primary::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: inherit;
  pointer-events: none;
  z-index: -1 !important; /* behind the card text: a z:0 positioned pseudo paints OVER non-positioned content */
  background-repeat: no-repeat;
  background-size: 100% 100%, 100% 100%, var(--trol-island-texture-bg-size, 100%);
  background-position: center;
  mix-blend-mode: normal;
  background-image:
    var(--_trol-island-role-sh-grad, var(--trol-island-surface-light-sh-grad, none)),
    var(--_trol-island-role-hi-grad, var(--trol-island-surface-light-hi-grad, none)),
    var(--_trol-island-role-texture, var(--trol-island-skin-texture, none)) !important;
  opacity: min(var(--trol-island-skin-opacity-cap, 1), calc(var(--trol-island-skin-opacity, 0.64) * var(--_trol-island-role-amount, var(--trol-island-skin-amount, 1)) * var(--_trol-island-role-layer-opacity, var(--trol-island-texture-layer-opacity, 1))));
  filter: sepia(var(--_trol-island-role-sepia, var(--trol-island-skin-sepia, 0)))
    hue-rotate(var(--_trol-island-role-hue, var(--trol-island-skin-hue, 0deg)))
    saturate(var(--_trol-island-role-saturate, var(--trol-island-skin-saturate, 1)))
    brightness(var(--_trol-island-role-brightness, var(--trol-island-skin-brightness, 1)))
    contrast(var(--_trol-island-role-contrast, var(--trol-island-skin-contrast, 1)))
    var(--trol-island-skin-filter, );
}
html[data-trol-island-per-role="1"] .trol-island-folder__body::before {
  --_trol-island-role-texture: var(--trol-island-sidebar-skin-texture, var(--trol-island-skin-texture, none));
  --_trol-island-role-sepia: var(--trol-island-sidebar-skin-sepia, var(--trol-island-skin-sepia, 0));
  --_trol-island-role-hue: var(--trol-island-sidebar-skin-hue, var(--trol-island-skin-hue, 0deg));
  --_trol-island-role-saturate: var(--trol-island-sidebar-skin-saturate, var(--trol-island-skin-saturate, 1));
  --_trol-island-role-brightness: var(--trol-island-sidebar-skin-brightness, var(--trol-island-skin-brightness, 1));
  --_trol-island-role-contrast: var(--trol-island-sidebar-skin-contrast, var(--trol-island-skin-contrast, 1));
  --_trol-island-role-amount: var(--trol-island-sidebar-skin-amount, var(--trol-island-skin-amount, 1));
  --_trol-island-role-hi-grad: var(--trol-island-sidebar-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none));
  --_trol-island-role-sh-grad: var(--trol-island-sidebar-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none));
  --_trol-island-role-layer-opacity: var(--trol-island-sidebar-texture-layer-opacity, var(--trol-island-texture-layer-opacity, 1));
}
html[data-trol-island-per-role="1"] .trol-island-folder__tab::before {
  --_trol-island-role-texture: var(--trol-island-sidebar-tab-skin-texture, var(--trol-island-sidebar-skin-texture, var(--trol-island-skin-texture, none)));
  --_trol-island-role-sepia: var(--trol-island-sidebar-tab-skin-sepia, var(--trol-island-sidebar-skin-sepia, var(--trol-island-skin-sepia, 0)));
  --_trol-island-role-hue: var(--trol-island-sidebar-tab-skin-hue, var(--trol-island-sidebar-skin-hue, var(--trol-island-skin-hue, 0deg)));
  --_trol-island-role-saturate: var(--trol-island-sidebar-tab-skin-saturate, var(--trol-island-sidebar-skin-saturate, var(--trol-island-skin-saturate, 1)));
  --_trol-island-role-brightness: var(--trol-island-sidebar-tab-skin-brightness, var(--trol-island-sidebar-skin-brightness, var(--trol-island-skin-brightness, 1)));
  --_trol-island-role-contrast: var(--trol-island-sidebar-tab-skin-contrast, var(--trol-island-sidebar-skin-contrast, var(--trol-island-skin-contrast, 1)));
  --_trol-island-role-amount: var(--trol-island-sidebar-tab-skin-amount, var(--trol-island-sidebar-skin-amount, var(--trol-island-skin-amount, 1)));
  --_trol-island-role-hi-grad: var(--trol-island-sidebar-tab-skin-hi-grad, var(--trol-island-sidebar-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none)));
  --_trol-island-role-sh-grad: var(--trol-island-sidebar-tab-skin-sh-grad, var(--trol-island-sidebar-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none)));
  --_trol-island-role-layer-opacity: var(--trol-island-sidebar-tab-texture-layer-opacity, var(--trol-island-tab-texture-layer-opacity, var(--trol-island-texture-layer-opacity, 1)));
}
html[data-trol-island-per-role="1"] .day-sidebar-island:not(.trol-island-folder)::before {
  --_trol-island-role-texture: var(--trol-island-sidebar-skin-texture, var(--trol-island-skin-texture, none));
  --_trol-island-role-sepia: var(--trol-island-sidebar-skin-sepia, var(--trol-island-skin-sepia, 0));
  --_trol-island-role-hue: var(--trol-island-sidebar-skin-hue, var(--trol-island-skin-hue, 0deg));
  --_trol-island-role-saturate: var(--trol-island-sidebar-skin-saturate, var(--trol-island-skin-saturate, 1));
  --_trol-island-role-brightness: var(--trol-island-sidebar-skin-brightness, var(--trol-island-skin-brightness, 1));
  --_trol-island-role-contrast: var(--trol-island-sidebar-skin-contrast, var(--trol-island-skin-contrast, 1));
  --_trol-island-role-amount: var(--trol-island-sidebar-skin-amount, var(--trol-island-skin-amount, 1));
  --_trol-island-role-hi-grad: var(--trol-island-sidebar-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none));
  --_trol-island-role-sh-grad: var(--trol-island-sidebar-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none));
}
html[data-trol-island-per-role="1"] div.main > div.topbar::before {
  --_trol-island-role-texture: var(--trol-island-topBar-skin-texture, var(--trol-island-skin-texture, none));
  --_trol-island-role-sepia: var(--trol-island-topBar-skin-sepia, var(--trol-island-skin-sepia, 0));
  --_trol-island-role-hue: var(--trol-island-topBar-skin-hue, var(--trol-island-skin-hue, 0deg));
  --_trol-island-role-saturate: var(--trol-island-topBar-skin-saturate, var(--trol-island-skin-saturate, 1));
  --_trol-island-role-brightness: var(--trol-island-topBar-skin-brightness, var(--trol-island-skin-brightness, 1));
  --_trol-island-role-contrast: var(--trol-island-topBar-skin-contrast, var(--trol-island-skin-contrast, 1));
  --_trol-island-role-amount: var(--trol-island-topBar-skin-amount, var(--trol-island-skin-amount, 1));
  --_trol-island-role-hi-grad: var(--trol-island-topBar-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none));
  --_trol-island-role-sh-grad: var(--trol-island-topBar-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none));
}
html[data-trol-island-per-role="1"] .ctx-modal::before,
html[data-trol-island-per-role="1"] .ctrol-modal-card::before {
  --_trol-island-role-texture: var(--trol-island-modal-skin-texture, var(--trol-island-skin-texture, none));
  --_trol-island-role-sepia: var(--trol-island-modal-skin-sepia, var(--trol-island-skin-sepia, 0));
  --_trol-island-role-hue: var(--trol-island-modal-skin-hue, var(--trol-island-skin-hue, 0deg));
  --_trol-island-role-saturate: var(--trol-island-modal-skin-saturate, var(--trol-island-skin-saturate, 1));
  --_trol-island-role-brightness: var(--trol-island-modal-skin-brightness, var(--trol-island-skin-brightness, 1));
  --_trol-island-role-contrast: var(--trol-island-modal-skin-contrast, var(--trol-island-skin-contrast, 1));
  --_trol-island-role-amount: var(--trol-island-modal-skin-amount, var(--trol-island-skin-amount, 1));
  --_trol-island-role-hi-grad: var(--trol-island-modal-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none));
  --_trol-island-role-sh-grad: var(--trol-island-modal-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none));
}
html[data-trol-island-per-role="1"] .day-list-head-island::before {
  --_trol-island-role-texture: var(--trol-island-topBar-skin-texture, var(--trol-island-skin-texture, none));
  --_trol-island-role-sepia: var(--trol-island-topBar-skin-sepia, var(--trol-island-skin-sepia, 0));
  --_trol-island-role-hue: var(--trol-island-topBar-skin-hue, var(--trol-island-skin-hue, 0deg));
  --_trol-island-role-saturate: var(--trol-island-topBar-skin-saturate, var(--trol-island-skin-saturate, 1));
  --_trol-island-role-brightness: var(--trol-island-topBar-skin-brightness, var(--trol-island-skin-brightness, 1));
  --_trol-island-role-contrast: var(--trol-island-topBar-skin-contrast, var(--trol-island-skin-contrast, 1));
  --_trol-island-role-amount: var(--trol-island-topBar-skin-amount, var(--trol-island-skin-amount, 1));
  --_trol-island-role-hi-grad: var(--trol-island-topBar-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none));
  --_trol-island-role-sh-grad: var(--trol-island-topBar-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none));
}
html[data-trol-island-per-role="1"] .day-scroll-list .day-item-card::before,
html[data-trol-island-per-role="1"] .et-messages-panel .et-stub-list li.et-msg-row::before {
  --_trol-island-role-texture: var(--trol-island-listRow-skin-texture, var(--trol-island-skin-texture, none));
  --_trol-island-role-sepia: var(--trol-island-listRow-skin-sepia, var(--trol-island-skin-sepia, 0));
  --_trol-island-role-hue: var(--trol-island-listRow-skin-hue, var(--trol-island-skin-hue, 0deg));
  --_trol-island-role-saturate: var(--trol-island-listRow-skin-saturate, var(--trol-island-skin-saturate, 1));
  --_trol-island-role-brightness: var(--trol-island-listRow-skin-brightness, var(--trol-island-skin-brightness, 1));
  --_trol-island-role-contrast: var(--trol-island-listRow-skin-contrast, var(--trol-island-skin-contrast, 1));
  --_trol-island-role-amount: var(--trol-island-listRow-skin-amount, var(--trol-island-skin-amount, 1));
  --_trol-island-role-hi-grad: var(--trol-island-listRow-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none));
  --_trol-island-role-sh-grad: var(--trol-island-listRow-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none));
}
html[data-trol-island-per-role="1"] .ctx-shell .ctx-left .ctx-row::before {
  --_trol-island-role-texture: var(--trol-island-listRow-skin-texture, var(--trol-island-skin-texture, none));
  --_trol-island-role-sepia: var(--trol-island-listRow-skin-sepia, var(--trol-island-skin-sepia, 0));
  --_trol-island-role-hue: var(--trol-island-listRow-skin-hue, var(--trol-island-skin-hue, 0deg));
  --_trol-island-role-saturate: var(--trol-island-listRow-skin-saturate, var(--trol-island-skin-saturate, 1));
  --_trol-island-role-brightness: var(--trol-island-listRow-skin-brightness, var(--trol-island-skin-brightness, 1));
  --_trol-island-role-contrast: var(--trol-island-listRow-skin-contrast, var(--trol-island-skin-contrast, 1));
  --_trol-island-role-amount: var(--trol-island-listRow-skin-amount, var(--trol-island-skin-amount, 1));
  --_trol-island-role-hi-grad: var(--trol-island-listRow-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none));
  --_trol-island-role-sh-grad: var(--trol-island-listRow-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none));
}
html[data-trol-island-per-role="1"] .ctx-shell .ctx-right::before,
html[data-trol-island-per-role="1"] .ctx-shell .ctx-pane::before,
html[data-trol-island-per-role="1"] .et-reader-panel::before,
html[data-trol-island-per-role="1"] #et-reader-panel.et-reader-panel::before,
html[data-trol-island-per-role="1"] .jd-project-shell::before,
html[data-trol-island-per-role="1"] .day-today-detail::before,
html[data-trol-island-per-role="1"] .day-item-hub::before,
html[data-trol-island-per-role="1"] .pht-photo-detail::before,
html[data-trol-island-per-role="1"] .cal-wrap::before,
html[data-trol-island-per-role="1"] .st-thread-panel::before {
  --_trol-island-role-texture: var(--trol-island-readingPane-skin-texture, var(--trol-island-skin-texture, none));
  --_trol-island-role-sepia: var(--trol-island-readingPane-skin-sepia, var(--trol-island-skin-sepia, 0));
  --_trol-island-role-hue: var(--trol-island-readingPane-skin-hue, var(--trol-island-skin-hue, 0deg));
  --_trol-island-role-saturate: var(--trol-island-readingPane-skin-saturate, var(--trol-island-skin-saturate, 1));
  --_trol-island-role-brightness: var(--trol-island-readingPane-skin-brightness, var(--trol-island-skin-brightness, 1));
  --_trol-island-role-contrast: var(--trol-island-readingPane-skin-contrast, var(--trol-island-skin-contrast, 1));
  --_trol-island-role-amount: var(--trol-island-readingPane-skin-amount, var(--trol-island-skin-amount, 1));
  --_trol-island-role-hi-grad: var(--trol-island-readingPane-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none));
  --_trol-island-role-sh-grad: var(--trol-island-readingPane-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none));
  --_trol-island-role-layer-opacity: var(--trol-island-readingPane-texture-layer-opacity, var(--trol-island-texture-layer-opacity, 1));
}
html[data-trol-island-per-role="1"] .et-statusrail::before {
  --_trol-island-role-texture: var(--trol-island-tray-skin-texture, var(--trol-island-skin-texture, none));
  --_trol-island-role-sepia: var(--trol-island-tray-skin-sepia, var(--trol-island-skin-sepia, 0));
  --_trol-island-role-hue: var(--trol-island-tray-skin-hue, var(--trol-island-skin-hue, 0deg));
  --_trol-island-role-saturate: var(--trol-island-tray-skin-saturate, var(--trol-island-skin-saturate, 1));
  --_trol-island-role-brightness: var(--trol-island-tray-skin-brightness, var(--trol-island-skin-brightness, 1));
  --_trol-island-role-contrast: var(--trol-island-tray-skin-contrast, var(--trol-island-skin-contrast, 1));
  --_trol-island-role-amount: var(--trol-island-tray-skin-amount, var(--trol-island-skin-amount, 1));
  --_trol-island-role-hi-grad: var(--trol-island-tray-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none));
  --_trol-island-role-sh-grad: var(--trol-island-tray-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none));
  --_trol-island-role-layer-opacity: var(--trol-island-tray-texture-layer-opacity, var(--trol-island-texture-layer-opacity, 1));
}
html[data-trol-island-per-role="1"] .et-btn-primary::before,
html[data-trol-island-per-role="1"] .btn-primary::before,
html[data-trol-island-per-role="1"] .day-btn:not(.day-btn-ghost):not(.day-btn-danger)::before,
html[data-trol-island-per-role="1"] button[type="submit"].primary::before {
  --_trol-island-role-texture: var(--trol-island-buttonPrimary-skin-texture, var(--trol-island-skin-texture, none));
  --_trol-island-role-sepia: var(--trol-island-buttonPrimary-skin-sepia, var(--trol-island-skin-sepia, 0));
  --_trol-island-role-hue: var(--trol-island-buttonPrimary-skin-hue, var(--trol-island-skin-hue, 0deg));
  --_trol-island-role-saturate: var(--trol-island-buttonPrimary-skin-saturate, var(--trol-island-skin-saturate, 1));
  --_trol-island-role-brightness: var(--trol-island-buttonPrimary-skin-brightness, var(--trol-island-skin-brightness, 1));
  --_trol-island-role-contrast: var(--trol-island-buttonPrimary-skin-contrast, var(--trol-island-skin-contrast, 1));
  --_trol-island-role-amount: var(--trol-island-buttonPrimary-skin-amount, var(--trol-island-skin-amount, 1));
  --_trol-island-role-hi-grad: var(--trol-island-buttonPrimary-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none));
  --_trol-island-role-sh-grad: var(--trol-island-buttonPrimary-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none));
  --_trol-island-role-layer-opacity: var(--trol-island-buttonPrimary-texture-layer-opacity, var(--trol-island-texture-layer-opacity, 1));
}

/* Theme Studio: per-role vars on #ts-solo-root beat html-scoped !important rules in the preview */
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-sidebar .trol-island-folder__body,
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-sidebar .trol-island-folder__tab,
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-topbar,
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-row,
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-modal,
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-tray,
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-reading,
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-btn {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-sidebar .trol-island-folder__body::before,
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-sidebar .trol-island-folder__tab::before,
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-topbar::before,
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-row::before,
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-modal::before,
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-tray::before,
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-reading::before,
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-btn::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: inherit;
  pointer-events: none;
  z-index: -1 !important;
  background-repeat: no-repeat;
  background-size: 100% 100%, 100% 100%, var(--trol-island-texture-bg-size, 100%);
  background-position: center;
  mix-blend-mode: normal;
  background-image:
    var(--_trol-island-role-sh-grad, var(--trol-island-surface-light-sh-grad, none)),
    var(--_trol-island-role-hi-grad, var(--trol-island-surface-light-hi-grad, none)),
    var(--_trol-island-role-texture, var(--trol-island-skin-texture, none)) !important;
  opacity: min(var(--trol-island-skin-opacity-cap, 1), calc(var(--trol-island-skin-opacity, 0.64) * var(--_trol-island-role-amount, var(--trol-island-skin-amount, 1)) * var(--_trol-island-role-layer-opacity, var(--trol-island-texture-layer-opacity, 1))));
  filter: sepia(var(--_trol-island-role-sepia, var(--trol-island-skin-sepia, 0)))
    hue-rotate(var(--_trol-island-role-hue, var(--trol-island-skin-hue, 0deg)))
    saturate(var(--_trol-island-role-saturate, var(--trol-island-skin-saturate, 1)))
    brightness(var(--_trol-island-role-brightness, var(--trol-island-skin-brightness, 1)))
    contrast(var(--_trol-island-role-contrast, var(--trol-island-skin-contrast, 1)))
    var(--trol-island-skin-filter, );
}
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-sidebar .trol-island-folder__body::before {
  --_trol-island-role-texture: var(--trol-island-sidebar-skin-texture, var(--trol-island-skin-texture, none));
  --_trol-island-role-sepia: var(--trol-island-sidebar-skin-sepia, var(--trol-island-skin-sepia, 0));
  --_trol-island-role-hue: var(--trol-island-sidebar-skin-hue, var(--trol-island-skin-hue, 0deg));
  --_trol-island-role-saturate: var(--trol-island-sidebar-skin-saturate, var(--trol-island-skin-saturate, 1));
  --_trol-island-role-brightness: var(--trol-island-sidebar-skin-brightness, var(--trol-island-skin-brightness, 1));
  --_trol-island-role-contrast: var(--trol-island-sidebar-skin-contrast, var(--trol-island-skin-contrast, 1));
  --_trol-island-role-amount: var(--trol-island-sidebar-skin-amount, var(--trol-island-skin-amount, 1));
  --_trol-island-role-hi-grad: var(--trol-island-sidebar-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none));
  --_trol-island-role-sh-grad: var(--trol-island-sidebar-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none));
  --_trol-island-role-layer-opacity: var(--trol-island-sidebar-texture-layer-opacity, var(--trol-island-texture-layer-opacity, 1));
}
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-sidebar .trol-island-folder__tab::before {
  --_trol-island-role-texture: var(--trol-island-sidebar-tab-skin-texture, var(--trol-island-sidebar-skin-texture, var(--trol-island-skin-texture, none)));
  --_trol-island-role-sepia: var(--trol-island-sidebar-tab-skin-sepia, var(--trol-island-sidebar-skin-sepia, var(--trol-island-skin-sepia, 0)));
  --_trol-island-role-hue: var(--trol-island-sidebar-tab-skin-hue, var(--trol-island-sidebar-skin-hue, var(--trol-island-skin-hue, 0deg)));
  --_trol-island-role-saturate: var(--trol-island-sidebar-tab-skin-saturate, var(--trol-island-sidebar-skin-saturate, var(--trol-island-skin-saturate, 1)));
  --_trol-island-role-brightness: var(--trol-island-sidebar-tab-skin-brightness, var(--trol-island-sidebar-skin-brightness, var(--trol-island-skin-brightness, 1)));
  --_trol-island-role-contrast: var(--trol-island-sidebar-tab-skin-contrast, var(--trol-island-sidebar-skin-contrast, var(--trol-island-skin-contrast, 1)));
  --_trol-island-role-amount: var(--trol-island-sidebar-tab-skin-amount, var(--trol-island-sidebar-skin-amount, var(--trol-island-skin-amount, 1)));
  --_trol-island-role-hi-grad: var(--trol-island-sidebar-tab-skin-hi-grad, var(--trol-island-sidebar-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none)));
  --_trol-island-role-sh-grad: var(--trol-island-sidebar-tab-skin-sh-grad, var(--trol-island-sidebar-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none)));
  --_trol-island-role-layer-opacity: var(--trol-island-sidebar-tab-texture-layer-opacity, var(--trol-island-tab-texture-layer-opacity, var(--trol-island-texture-layer-opacity, 1)));
}
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-topbar::before {
  --_trol-island-role-texture: var(--trol-island-topBar-skin-texture, var(--trol-island-skin-texture, none));
  --_trol-island-role-sepia: var(--trol-island-topBar-skin-sepia, var(--trol-island-skin-sepia, 0));
  --_trol-island-role-hue: var(--trol-island-topBar-skin-hue, var(--trol-island-skin-hue, 0deg));
  --_trol-island-role-saturate: var(--trol-island-topBar-skin-saturate, var(--trol-island-skin-saturate, 1));
  --_trol-island-role-brightness: var(--trol-island-topBar-skin-brightness, var(--trol-island-skin-brightness, 1));
  --_trol-island-role-contrast: var(--trol-island-topBar-skin-contrast, var(--trol-island-skin-contrast, 1));
  --_trol-island-role-amount: var(--trol-island-topBar-skin-amount, var(--trol-island-skin-amount, 1));
  --_trol-island-role-hi-grad: var(--trol-island-topBar-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none));
  --_trol-island-role-sh-grad: var(--trol-island-topBar-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none));
}
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-modal::before {
  --_trol-island-role-texture: var(--trol-island-modal-skin-texture, var(--trol-island-skin-texture, none));
  --_trol-island-role-sepia: var(--trol-island-modal-skin-sepia, var(--trol-island-skin-sepia, 0));
  --_trol-island-role-hue: var(--trol-island-modal-skin-hue, var(--trol-island-skin-hue, 0deg));
  --_trol-island-role-saturate: var(--trol-island-modal-skin-saturate, var(--trol-island-skin-saturate, 1));
  --_trol-island-role-brightness: var(--trol-island-modal-skin-brightness, var(--trol-island-skin-brightness, 1));
  --_trol-island-role-contrast: var(--trol-island-modal-skin-contrast, var(--trol-island-skin-contrast, 1));
  --_trol-island-role-amount: var(--trol-island-modal-skin-amount, var(--trol-island-skin-amount, 1));
  --_trol-island-role-hi-grad: var(--trol-island-modal-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none));
  --_trol-island-role-sh-grad: var(--trol-island-modal-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none));
}
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-row[data-ts-float-key="listRow"]::before {
  --_trol-island-role-texture: var(--trol-island-listRow-skin-texture, var(--trol-island-skin-texture, none));
  --_trol-island-role-sepia: var(--trol-island-listRow-skin-sepia, var(--trol-island-skin-sepia, 0));
  --_trol-island-role-hue: var(--trol-island-listRow-skin-hue, var(--trol-island-skin-hue, 0deg));
  --_trol-island-role-saturate: var(--trol-island-listRow-skin-saturate, var(--trol-island-skin-saturate, 1));
  --_trol-island-role-brightness: var(--trol-island-listRow-skin-brightness, var(--trol-island-skin-brightness, 1));
  --_trol-island-role-contrast: var(--trol-island-listRow-skin-contrast, var(--trol-island-skin-contrast, 1));
  --_trol-island-role-amount: var(--trol-island-listRow-skin-amount, var(--trol-island-skin-amount, 1));
  --_trol-island-role-hi-grad: var(--trol-island-listRow-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none));
  --_trol-island-role-sh-grad: var(--trol-island-listRow-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none));
}
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-row[data-ts-float-key="listRowFollowUp"]::before {
  --_trol-island-role-texture: var(--trol-island-listRowFollowUp-skin-texture, var(--trol-island-listRow-skin-texture, var(--trol-island-skin-texture, none)));
  --_trol-island-role-sepia: var(--trol-island-listRowFollowUp-skin-sepia, var(--trol-island-listRow-skin-sepia, var(--trol-island-skin-sepia, 0)));
  --_trol-island-role-hue: var(--trol-island-listRowFollowUp-skin-hue, var(--trol-island-listRow-skin-hue, var(--trol-island-skin-hue, 0deg)));
  --_trol-island-role-saturate: var(--trol-island-listRowFollowUp-skin-saturate, var(--trol-island-listRow-skin-saturate, var(--trol-island-skin-saturate, 1)));
  --_trol-island-role-brightness: var(--trol-island-listRowFollowUp-skin-brightness, var(--trol-island-listRow-skin-brightness, var(--trol-island-skin-brightness, 1)));
  --_trol-island-role-contrast: var(--trol-island-listRowFollowUp-skin-contrast, var(--trol-island-listRow-skin-contrast, var(--trol-island-skin-contrast, 1)));
  --_trol-island-role-amount: var(--trol-island-listRowFollowUp-skin-amount, var(--trol-island-listRow-skin-amount, var(--trol-island-skin-amount, 1)));
  --_trol-island-role-hi-grad: var(--trol-island-listRowFollowUp-skin-hi-grad, var(--trol-island-listRow-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none)));
  --_trol-island-role-sh-grad: var(--trol-island-listRowFollowUp-skin-sh-grad, var(--trol-island-listRow-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none)));
}
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-tray::before {
  --_trol-island-role-texture: var(--trol-island-tray-skin-texture, var(--trol-island-skin-texture, none));
  --_trol-island-role-sepia: var(--trol-island-tray-skin-sepia, var(--trol-island-skin-sepia, 0));
  --_trol-island-role-hue: var(--trol-island-tray-skin-hue, var(--trol-island-skin-hue, 0deg));
  --_trol-island-role-saturate: var(--trol-island-tray-skin-saturate, var(--trol-island-skin-saturate, 1));
  --_trol-island-role-brightness: var(--trol-island-tray-skin-brightness, var(--trol-island-skin-brightness, 1));
  --_trol-island-role-contrast: var(--trol-island-tray-skin-contrast, var(--trol-island-skin-contrast, 1));
  --_trol-island-role-amount: var(--trol-island-tray-skin-amount, var(--trol-island-skin-amount, 1));
  --_trol-island-role-hi-grad: var(--trol-island-tray-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none));
  --_trol-island-role-sh-grad: var(--trol-island-tray-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none));
  --_trol-island-role-layer-opacity: var(--trol-island-tray-texture-layer-opacity, var(--trol-island-texture-layer-opacity, 1));
}
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-btn::before {
  --_trol-island-role-texture: var(--trol-island-buttonPrimary-skin-texture, var(--trol-island-skin-texture, none));
  --_trol-island-role-sepia: var(--trol-island-buttonPrimary-skin-sepia, var(--trol-island-skin-sepia, 0));
  --_trol-island-role-hue: var(--trol-island-buttonPrimary-skin-hue, var(--trol-island-skin-hue, 0deg));
  --_trol-island-role-saturate: var(--trol-island-buttonPrimary-skin-saturate, var(--trol-island-skin-saturate, 1));
  --_trol-island-role-brightness: var(--trol-island-buttonPrimary-skin-brightness, var(--trol-island-skin-brightness, 1));
  --_trol-island-role-contrast: var(--trol-island-buttonPrimary-skin-contrast, var(--trol-island-skin-contrast, 1));
  --_trol-island-role-amount: var(--trol-island-buttonPrimary-skin-amount, var(--trol-island-skin-amount, 1));
  --_trol-island-role-hi-grad: var(--trol-island-buttonPrimary-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none));
  --_trol-island-role-sh-grad: var(--trol-island-buttonPrimary-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none));
  --_trol-island-role-layer-opacity: var(--trol-island-buttonPrimary-texture-layer-opacity, var(--trol-island-texture-layer-opacity, 1));
}
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-reading::before {
  --_trol-island-role-texture: var(--trol-island-readingPane-skin-texture, var(--trol-island-skin-texture, none));
  --_trol-island-role-sepia: var(--trol-island-readingPane-skin-sepia, var(--trol-island-skin-sepia, 0));
  --_trol-island-role-hue: var(--trol-island-readingPane-skin-hue, var(--trol-island-skin-hue, 0deg));
  --_trol-island-role-saturate: var(--trol-island-readingPane-skin-saturate, var(--trol-island-skin-saturate, 1));
  --_trol-island-role-brightness: var(--trol-island-readingPane-skin-brightness, var(--trol-island-skin-brightness, 1));
  --_trol-island-role-contrast: var(--trol-island-readingPane-skin-contrast, var(--trol-island-skin-contrast, 1));
  --_trol-island-role-amount: var(--trol-island-readingPane-skin-amount, var(--trol-island-skin-amount, 1));
  --_trol-island-role-hi-grad: var(--trol-island-readingPane-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none));
  --_trol-island-role-sh-grad: var(--trol-island-readingPane-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none));
  --_trol-island-role-layer-opacity: var(--trol-island-readingPane-texture-layer-opacity, var(--trol-island-texture-layer-opacity, 1));
}

/* Folder-tab sidebar: opaque fill hides ::before texture: go transparent when per-role skin is live */
html[data-trol-island-per-role="1"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .trol-island-folder__body,
html[data-trol-island-per-role="1"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .trol-island-folder__tab,
html[data-trol-island-sidebar-texture]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .trol-island-folder__body,
html[data-trol-island-sidebar-texture]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .trol-island-folder__tab,
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-sidebar .trol-island-folder__body,
#ts-solo-root[data-trol-island-per-role="1"] .jt-ts-mock-sidebar .trol-island-folder__tab,
.jt-ts-mock-sidebar[data-ts-island-texture] .trol-island-folder__body,
.jt-ts-mock-sidebar[data-ts-island-texture] .trol-island-folder__tab {
  background: transparent !important;
  background-color: transparent !important;
}

/* Per-folder-node texture (Theme Studio applies data-ts-island-* on each folder body/tab) */
.trol-island-folder__body[data-ts-island-texture],
.trol-island-folder__tab[data-ts-island-texture],
.trol-island-folder__tab[data-ts-island-tab-texture] {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.trol-island-folder__body[data-ts-island-texture]::before,
.trol-island-folder__tab[data-ts-island-texture]::before,
.trol-island-folder__tab[data-ts-island-tab-texture]::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 0;
  background-repeat: no-repeat;
  background-size: 100% 100%, 100% 100%, var(--trol-island-texture-bg-size, 100%);
  background-position: center;
  background-image:
    var(--ts-element-island-light-sh-grad, var(--trol-island-surface-light-sh-grad, none)),
    var(--ts-element-island-light-hi-grad, var(--trol-island-surface-light-hi-grad, none)),
    var(--ts-element-island-texture, var(--trol-island-sidebar-skin-texture, var(--trol-island-skin-texture, none)));
  opacity: min(var(--trol-island-skin-opacity-cap, 1), calc(var(--trol-island-skin-opacity, 0.64) * var(--ts-element-island-amount, var(--trol-island-skin-amount, 1)) * var(--ts-element-island-texture-layer-opacity, var(--trol-island-texture-layer-opacity, 1))));
  filter: sepia(var(--ts-element-island-sepia, var(--trol-island-skin-sepia, 0)))
    hue-rotate(var(--ts-element-island-hue, var(--trol-island-skin-hue, 0deg)))
    saturate(var(--ts-element-island-saturate, var(--trol-island-skin-saturate, 1)))
    brightness(var(--ts-element-island-brightness, var(--trol-island-skin-brightness, 1)))
    contrast(var(--ts-element-island-contrast, var(--trol-island-skin-contrast, 1)))
    var(--trol-island-skin-filter, );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, calc(var(--ts-element-island-gloss, var(--trol-island-skin-gloss, 0.35)) * 0.1));
}
.trol-island-folder__tab[data-ts-island-tab-texture]::before {
  background-image:
    var(--ts-element-island-tab-light-sh-grad, var(--trol-island-sidebar-tab-skin-sh-grad, var(--trol-island-surface-light-sh-grad, none))),
    var(--ts-element-island-tab-light-hi-grad, var(--trol-island-sidebar-tab-skin-hi-grad, var(--trol-island-surface-light-hi-grad, none))),
    var(--ts-element-island-tab-texture, var(--trol-island-sidebar-tab-skin-texture, var(--trol-island-sidebar-skin-texture, var(--trol-island-skin-texture, none)))));
  opacity: min(var(--trol-island-skin-opacity-cap, 1), calc(var(--trol-island-skin-opacity, 0.64) * var(--ts-element-island-tab-amount, var(--trol-island-sidebar-tab-skin-amount, var(--trol-island-skin-amount, 1))) * var(--ts-element-island-tab-texture-layer-opacity, var(--trol-island-tab-texture-layer-opacity, var(--trol-island-texture-layer-opacity, 1)))));
  filter: sepia(var(--ts-element-island-tab-sepia, var(--trol-island-sidebar-tab-skin-sepia, var(--trol-island-skin-sepia, 0))))
    hue-rotate(var(--ts-element-island-tab-hue, var(--trol-island-sidebar-tab-skin-hue, var(--trol-island-skin-hue, 0deg))))
    saturate(var(--ts-element-island-tab-saturate, var(--trol-island-sidebar-tab-skin-saturate, var(--trol-island-skin-saturate, 1))))
    brightness(var(--ts-element-island-tab-brightness, var(--trol-island-sidebar-tab-skin-brightness, var(--trol-island-skin-brightness, 1))))
    contrast(var(--ts-element-island-tab-contrast, var(--trol-island-sidebar-tab-skin-contrast, var(--trol-island-skin-contrast, 1))))
    var(--trol-island-skin-filter, );
}
.trol-island-folder__body[data-ts-island-texture] > *,
.trol-island-folder__tab[data-ts-island-texture] > *,
.trol-island-folder__tab[data-ts-island-tab-texture] > * {
  position: relative;
  z-index: 2;
}

/* Suede: matte velvet nap; no chrome specular on islands (photo suede: no blur) */
html[data-trol-leather-variant="suede"],
html[data-trol-leather-variant="suede-brown"],
html[data-trol-leather-variant="suede-draped"],
html[data-trol-leather-variant="tan"],
html[data-trol-leather-variant="camel"],
html[data-trol-leather-variant="saddle"],
html[data-trol-leather-variant="cognac"],
html[data-trol-leather-variant="espresso"],
html[data-trol-leather-variant="chocolate"],
html[data-trol-island-texture="leather-suede"],
html[data-trol-island-texture="leather-suede-brown"],
html[data-trol-island-texture="leather-suede-draped"],
html[data-trol-island-texture="leather-tan"],
html[data-trol-island-texture="leather-camel"],
html[data-trol-island-texture="leather-saddle"],
html[data-trol-island-texture="leather-cognac"],
html[data-trol-island-texture="leather-espresso"],
html[data-trol-island-texture="leather-chocolate"] {
  --trol-island-skin-gloss: 0.12;
}
html[data-trol-leather-variant="suede"] .ctx-shell .ctx-left .ctx-row::before,
html[data-trol-leather-variant="suede"] .day-scroll-list .day-item-card::before,
html[data-trol-leather-variant="suede"] .et-messages-panel .et-stub-list li.et-msg-row::before,
html[data-trol-island-texture="leather-suede"] .ctx-shell .ctx-left .ctx-row::before,
html[data-trol-island-texture="leather-suede"] .day-scroll-list .day-item-card::before,
html[data-trol-island-texture="leather-suede"] .et-messages-panel .et-stub-list li.et-msg-row::before {
  mix-blend-mode: normal;
}
html[data-trol-leather-variant="suede"] .ctx-shell .ctx-left .ctx-row::after,
html[data-trol-leather-variant="suede"] .day-scroll-list .day-item-card::after,
html[data-trol-leather-variant="suede"] .et-messages-panel .et-stub-list li.et-msg-row::after,
html[data-trol-island-texture="leather-suede"] .ctx-shell .ctx-left .ctx-row::after,
html[data-trol-island-texture="leather-suede"] .day-scroll-list .day-item-card::after,
html[data-trol-island-texture="leather-suede"] .et-messages-panel .et-stub-list li.et-msg-row::after {
  mix-blend-mode: multiply;
  opacity: 0.85;
}
#ts-solo-root[data-trol-leather-variant="suede"][data-trol-island-texture] .jt-ts-mock-sidebar .trol-island-folder__tab::before,
#ts-solo-root[data-trol-leather-variant="suede"][data-trol-island-texture] .jt-ts-mock-sidebar .trol-island-folder__body::before,
#ts-solo-root[data-trol-leather-variant="suede"][data-trol-island-texture] .jt-ts-mock-topbar::before,
#ts-solo-root[data-trol-leather-variant="suede"][data-trol-island-texture] .jt-ts-mock-row::before,
#ts-solo-root[data-trol-leather-variant="suede"][data-trol-island-texture] .jt-ts-mock-modal::before,
#ts-solo-root[data-trol-leather-variant="suede"][data-trol-island-texture] .jt-ts-mock-tray::before,
#ts-solo-root[data-trol-island-texture="leather-suede"] .jt-ts-mock-sidebar .trol-island-folder__tab::before,
#ts-solo-root[data-trol-island-texture="leather-suede"] .jt-ts-mock-sidebar .trol-island-folder__body::before,
#ts-solo-root[data-trol-island-texture="leather-suede"] .jt-ts-mock-topbar::before,
#ts-solo-root[data-trol-island-texture="leather-suede"] .jt-ts-mock-row::before,
#ts-solo-root[data-trol-island-texture="leather-suede"] .jt-ts-mock-modal::before,
#ts-solo-root[data-trol-island-texture="leather-suede"] .jt-ts-mock-tray::before {
  box-shadow: none;
  mix-blend-mode: normal;
}

/**
 * Promoted Contactrol/Daytrol skin-unify delta (engine canonical).
 * Appended to Jobtrol trol-island-surface.css in central engine build only.
 * Jobtrol live app assets/css/trol-island-surface.css stays untouched.
 */

:root {
  --trol-island-texture-bg-size: cover;
}

html[data-trol-island-per-role="1"] .day-card::before,
html[data-trol-island-per-role="1"] .day-item:not(.day-item-card)::before,
html[data-trol-island-per-role="1"] .day-stat::before,
html[data-trol-island-per-role="1"] .day-signin-card::before,
html[data-trol-island-per-role="1"] .day-integration-card::before {
  --_trol-island-role-texture: var(--trol-island-readingPane-skin-texture, var(--trol-island-skin-texture, none));
}

/* Woodgrain-capable reading/detail content surfaces: --et-wood-filter + cover (suite-wide). */
html:not([data-et-woodgrain="off"]) .ctx-shell .ctx-right::before,
html:not([data-et-woodgrain="off"]) .ctx-shell .ctx-pane::before,
html:not([data-et-woodgrain="off"]) .et-reader-panel::before,
html:not([data-et-woodgrain="off"]) #et-reader-panel.et-reader-panel::before,
html:not([data-et-woodgrain="off"]) .jd-project-shell::before,
html:not([data-et-woodgrain="off"]) .day-today-detail::before,
html:not([data-et-woodgrain="off"]) .day-item-hub::before,
html:not([data-et-woodgrain="off"]) .day-card::before,
html:not([data-et-woodgrain="off"]) .day-item:not(.day-item-card)::before,
html:not([data-et-woodgrain="off"]) .day-stat::before,
html:not([data-et-woodgrain="off"]) .day-signin-card::before,
html:not([data-et-woodgrain="off"]) .day-integration-card::before,
html:not([data-et-woodgrain="off"]) .pht-photo-detail::before,
html:not([data-et-woodgrain="off"]) .cal-wrap::before,
html:not([data-et-woodgrain="off"]) .st-thread-panel::before,
html[data-trol-island-per-role="1"][data-trol-island-readingPane-texture="burl"] .ctx-shell .ctx-right::before,
html[data-trol-island-per-role="1"][data-trol-island-readingPane-texture="burl"] .ctx-shell .ctx-pane::before,
html[data-trol-island-per-role="1"][data-trol-island-readingPane-texture="burl"] .et-reader-panel::before,
html[data-trol-island-per-role="1"][data-trol-island-readingPane-texture="burl"] #et-reader-panel.et-reader-panel::before,
html[data-trol-island-per-role="1"][data-trol-island-readingPane-texture="burl"] .jd-project-shell::before,
html[data-trol-island-per-role="1"][data-trol-island-readingPane-texture="burl"] .day-today-detail::before,
html[data-trol-island-per-role="1"][data-trol-island-readingPane-texture="burl"] .day-item-hub::before,
html[data-trol-island-per-role="1"][data-trol-island-readingPane-texture="burl"] .day-card::before,
html[data-trol-island-per-role="1"][data-trol-island-readingPane-texture="burl"] .day-item:not(.day-item-card)::before,
html[data-trol-island-per-role="1"][data-trol-island-readingPane-texture="burl"] .day-stat::before,
html[data-trol-island-per-role="1"][data-trol-island-readingPane-texture="burl"] .day-signin-card::before,
html[data-trol-island-per-role="1"][data-trol-island-readingPane-texture="burl"] .day-integration-card::before,
html[data-trol-island-per-role="1"][data-trol-island-readingPane-texture="burl"] .pht-photo-detail::before,
html[data-trol-island-per-role="1"][data-trol-island-readingPane-texture="burl"] .cal-wrap::before,
html[data-trol-island-per-role="1"][data-trol-island-readingPane-texture="burl"] .st-thread-panel::before,
html[data-trol-island-texture="burl"] .ctx-shell .ctx-right::before,
html[data-trol-island-texture="burl"] .ctx-shell .ctx-pane::before,
html[data-trol-island-texture="burl"] .et-reader-panel::before,
html[data-trol-island-texture="burl"] #et-reader-panel.et-reader-panel::before,
html[data-trol-island-texture="burl"] .jd-project-shell::before,
html[data-trol-island-texture="burl"] .day-today-detail::before,
html[data-trol-island-texture="burl"] .day-item-hub::before,
html[data-trol-island-texture="burl"] .day-card::before,
html[data-trol-island-texture="burl"] .day-item:not(.day-item-card)::before,
html[data-trol-island-texture="burl"] .day-stat::before,
html[data-trol-island-texture="burl"] .day-signin-card::before,
html[data-trol-island-texture="burl"] .day-integration-card::before,
html[data-trol-island-texture="burl"] .pht-photo-detail::before,
html[data-trol-island-texture="burl"] .cal-wrap::before,
html[data-trol-island-texture="burl"] .st-thread-panel::before {
  --_trol-island-role-texture: var(--et-wood-bezel-layer, var(--et-woodgrain-layer, var(--trol-island-readingPane-skin-texture, var(--trol-island-skin-texture, url("https://thetrols.com/assets/textures/wood-burl.svg")))));
  background-image:
    var(--_trol-island-role-sh-grad, var(--trol-island-surface-light-sh-grad, none)),
    var(--_trol-island-role-hi-grad, var(--trol-island-surface-light-hi-grad, none)),
    var(--et-wood-bezel-layer, var(--et-woodgrain-layer, var(--_trol-island-role-texture, var(--trol-island-skin-texture, none)))) !important;
  background-size: 100% 100%, 100% 100%, cover !important;
  background-repeat: no-repeat !important;
  background-attachment: scroll, scroll, scroll !important;
  opacity: var(--et-wood-bezel-opacity, var(--et-woodgrain-opacity, 0.72)) !important;
  filter: var(--et-wood-filter, sepia(var(--et-wood-sepia, 0.22)) hue-rotate(var(--et-wood-hue-rotate, -12deg)) saturate(var(--et-wood-saturate, 1.24)) contrast(var(--et-wood-contrast, 1.18))) !important;
  mix-blend-mode: normal !important;
}

/* Suite content-surface skin invariants: full-bleed hosts + cover scroll attachment */
html[data-trol-island-texture] .ctx-shell .ctx-right,
html[data-trol-island-texture] .ctx-shell .ctx-pane,
html[data-trol-island-texture] .et-reader-panel,
html[data-trol-island-texture] #et-reader-panel.et-reader-panel,
html[data-trol-island-texture] .jd-project-shell,
html[data-trol-island-texture] .day-today-detail,
html[data-trol-island-texture] .day-item-hub,
html[data-trol-island-texture] .day-card,
html[data-trol-island-texture] .day-item:not(.day-item-card),
html[data-trol-island-texture] .day-stat,
html[data-trol-island-texture] .day-signin-card,
html[data-trol-island-texture] .day-integration-card,
html[data-trol-island-texture] .pht-photo-detail,
html[data-trol-island-texture] .cal-wrap,
html[data-trol-island-texture] .st-thread-panel,
html[data-trol-island-per-role="1"] .ctx-shell .ctx-right,
html[data-trol-island-per-role="1"] .ctx-shell .ctx-pane,
html[data-trol-island-per-role="1"] .et-reader-panel,
html[data-trol-island-per-role="1"] #et-reader-panel.et-reader-panel,
html[data-trol-island-per-role="1"] .jd-project-shell,
html[data-trol-island-per-role="1"] .day-today-detail,
html[data-trol-island-per-role="1"] .day-item-hub,
html[data-trol-island-per-role="1"] .day-card,
html[data-trol-island-per-role="1"] .day-item:not(.day-item-card),
html[data-trol-island-per-role="1"] .day-stat,
html[data-trol-island-per-role="1"] .day-signin-card,
html[data-trol-island-per-role="1"] .day-integration-card,
html[data-trol-island-per-role="1"] .pht-photo-detail,
html[data-trol-island-per-role="1"] .cal-wrap,
html[data-trol-island-per-role="1"] .st-thread-panel {
  min-height: 100%;
  align-self: stretch;
}

html[data-trol-island-texture] .ctx-shell .ctx-right::before,
html[data-trol-island-texture] .ctx-shell .ctx-pane::before,
html[data-trol-island-texture] .et-reader-panel::before,
html[data-trol-island-texture] #et-reader-panel.et-reader-panel::before,
html[data-trol-island-texture] .jd-project-shell::before,
html[data-trol-island-texture] .day-today-detail::before,
html[data-trol-island-texture] .day-item-hub::before,
html[data-trol-island-texture] .day-card::before,
html[data-trol-island-texture] .day-item:not(.day-item-card)::before,
html[data-trol-island-texture] .day-stat::before,
html[data-trol-island-texture] .day-signin-card::before,
html[data-trol-island-texture] .day-integration-card::before,
html[data-trol-island-texture] .pht-photo-detail::before,
html[data-trol-island-texture] .cal-wrap::before,
html[data-trol-island-texture] .st-thread-panel::before,
html[data-trol-island-per-role="1"] .ctx-shell .ctx-right::before,
html[data-trol-island-per-role="1"] .ctx-shell .ctx-pane::before,
html[data-trol-island-per-role="1"] .et-reader-panel::before,
html[data-trol-island-per-role="1"] #et-reader-panel.et-reader-panel::before,
html[data-trol-island-per-role="1"] .jd-project-shell::before,
html[data-trol-island-per-role="1"] .day-today-detail::before,
html[data-trol-island-per-role="1"] .day-item-hub::before,
html[data-trol-island-per-role="1"] .day-card::before,
html[data-trol-island-per-role="1"] .day-item:not(.day-item-card)::before,
html[data-trol-island-per-role="1"] .day-stat::before,
html[data-trol-island-per-role="1"] .day-signin-card::before,
html[data-trol-island-per-role="1"] .day-integration-card::before,
html[data-trol-island-per-role="1"] .pht-photo-detail::before,
html[data-trol-island-per-role="1"] .cal-wrap::before,
html[data-trol-island-per-role="1"] .st-thread-panel::before {
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100% !important;
  min-height: 100% !important;
  height: 100% !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100%, 100% 100%, cover !important;
  background-position: center center, center center, center center !important;
  background-attachment: scroll, scroll, scroll !important;
}


/* --- engine layer: trol-island-rim.css --- */
/**
 * Trol floating-island metallic edge rims.
 * Driven by Theme Studio floatingUi.borderStyle → html[data-ts-{element}-border-style].
 * Custom rim tint: --ts-float-{element}-border (set by trol-theme-bundle.js).
 */
:root {
  --trol-island-border: none;
  --trol-island-rim-extra: ;
}

/* --- Shared metallic rim mixin (per preset × element) --- */
/* Brass piping */
#ts-solo-root[data-ts-listRow-border-style="brass"] .jt-ts-mock-row[data-ts-float-key="listRow"],
#ts-solo-root[data-ts-modal-border-style="brass"] .jt-ts-mock-modal,
#ts-solo-root[data-ts-sidebar-border-style="brass"] .jt-ts-mock-sidebar .trol-island-folder__tab,
#ts-solo-root[data-ts-sidebar-border-style="brass"] .jt-ts-mock-sidebar .trol-island-folder__body,
#ts-solo-root[data-ts-topBar-border-style="brass"] .jt-ts-mock-topbar,
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="brass"] .ctx-shell .ctx-left .ctx-row,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="brass"] .ctx-shell .ctx-left .ctx-row,
html[data-ts-listRow-border-style="brass"] .day-scroll-list .day-item-card,
html[data-et-app="mail"][data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="brass"] .et-messages-panel .et-stub-list li.et-msg-row,
html[data-et-app="mail"][data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="brass"] .et-messages-panel .et-stub-list li.et-msg-row,
html[data-ts-modal-border-style="brass"] .ctx-modal,
html[data-ts-sidebar-border-style="brass"] .trol-island-folder__tab,
html[data-ts-sidebar-border-style="brass"] .trol-island-folder__body,
html[data-ts-sidebar-border-style="brass"] .day-sidebar-island:not(.trol-island-folder),
html[data-ts-topBar-border-style="brass"] .day-list-head-island {
  --_rim-color: var(--ts-float-listRow-border, #c59a5e);
  border: var(--ts-float-listRow-border-width, 2px) solid color-mix(in srgb, var(--_rim-color) 86%, #fff 14%) !important;
  box-shadow:
    var(--ts-float-listRow-shadow, var(--trol-island-shadow)),
    0 0 0 1px color-mix(in srgb, #f0d080 48%, var(--_rim-color) 52%),
    inset 0 1px 0 rgba(255, 228, 180, 0.32),
    0 0 12px color-mix(in srgb, var(--_rim-color) 28%, transparent) !important;
}

#ts-solo-root[data-ts-modal-border-style="brass"] .jt-ts-mock-modal {
  --_rim-color: var(--ts-float-modal-border, #c59a5e);
  border-width: var(--ts-float-modal-border-width, 2px) !important;
  box-shadow:
    var(--ts-float-modal-shadow, var(--trol-island-shadow)),
    0 0 0 1px color-mix(in srgb, #f0d080 48%, var(--_rim-color) 52%),
    inset 0 1px 0 rgba(255, 228, 180, 0.32),
    0 0 14px color-mix(in srgb, var(--_rim-color) 30%, transparent) !important;
}
#ts-solo-root[data-ts-sidebar-border-style="brass"] .jt-ts-mock-sidebar .trol-island-folder__tab,
#ts-solo-root[data-ts-sidebar-border-style="brass"] .jt-ts-mock-sidebar .trol-island-folder__body {
  --_rim-color: var(--ts-float-sidebar-border, #c59a5e);
  border-width: var(--ts-float-sidebar-border-width, 1px) !important;
  box-shadow:
    var(--ts-float-sidebar-shadow, var(--trol-island-shadow)),
    0 0 0 1px color-mix(in srgb, #f0d080 48%, var(--_rim-color) 52%),
    inset 0 1px 0 rgba(255, 228, 180, 0.28),
    0 0 10px color-mix(in srgb, var(--_rim-color) 24%, transparent) !important;
}
#ts-solo-root[data-ts-topBar-border-style="brass"] .jt-ts-mock-topbar {
  --_rim-color: var(--ts-float-topBar-border, #c59a5e);
  border-width: var(--ts-float-topBar-border-width, 1px) !important;
  box-shadow:
    var(--ts-float-topBar-shadow, var(--trol-island-shadow)),
    0 0 0 1px color-mix(in srgb, #f0d080 48%, var(--_rim-color) 52%),
    inset 0 1px 0 rgba(255, 228, 180, 0.28),
    0 0 10px color-mix(in srgb, var(--_rim-color) 24%, transparent) !important;
}

/* Chrome lip */
#ts-solo-root[data-ts-listRow-border-style="chrome-lip"] .jt-ts-mock-row[data-ts-float-key="listRow"],
#ts-solo-root[data-ts-modal-border-style="chrome-lip"] .jt-ts-mock-modal,
#ts-solo-root[data-ts-sidebar-border-style="chrome-lip"] .jt-ts-mock-sidebar .trol-island-folder__tab,
#ts-solo-root[data-ts-sidebar-border-style="chrome-lip"] .jt-ts-mock-sidebar .trol-island-folder__body,
#ts-solo-root[data-ts-topBar-border-style="chrome-lip"] .jt-ts-mock-topbar,
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="chrome-lip"] .ctx-shell .ctx-left .ctx-row,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="chrome-lip"] .ctx-shell .ctx-left .ctx-row,
html[data-ts-listRow-border-style="chrome-lip"] .day-scroll-list .day-item-card,
html[data-et-app="mail"][data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="chrome-lip"] .et-messages-panel .et-stub-list li.et-msg-row,
html[data-et-app="mail"][data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="chrome-lip"] .et-messages-panel .et-stub-list li.et-msg-row {
  --_rim-color: var(--ts-float-listRow-border, #b8c0c8);
  border: var(--ts-float-listRow-border-width, 2px) solid color-mix(in srgb, #e8ecef 55%, var(--_rim-color) 45%) !important;
  box-shadow:
    var(--ts-float-listRow-shadow, var(--trol-island-shadow)),
    0 0 0 1px #f4f6f8,
    inset 0 2px 0 rgba(255, 255, 255, 0.55),
    inset 0 -1px 0 rgba(0, 0, 0, 0.22),
    0 0 10px rgba(180, 192, 204, 0.35) !important;
}

#ts-solo-root[data-ts-modal-border-style="chrome-lip"] .jt-ts-mock-modal {
  --_rim-color: var(--ts-float-modal-border, #b8c0c8);
  border-width: var(--ts-float-modal-border-width, 2px) !important;
  box-shadow:
    var(--ts-float-modal-shadow, var(--trol-island-shadow)),
    0 0 0 1px #f4f6f8,
    inset 0 2px 0 rgba(255, 255, 255, 0.55),
    inset 0 -1px 0 rgba(0, 0, 0, 0.22),
    0 0 12px rgba(180, 192, 204, 0.38) !important;
}
#ts-solo-root[data-ts-sidebar-border-style="chrome-lip"] .jt-ts-mock-sidebar .trol-island-folder__tab,
#ts-solo-root[data-ts-sidebar-border-style="chrome-lip"] .jt-ts-mock-sidebar .trol-island-folder__body,
#ts-solo-root[data-ts-topBar-border-style="chrome-lip"] .jt-ts-mock-topbar {
  border-width: var(--ts-float-sidebar-border-width, 1px) !important;
  box-shadow:
    var(--ts-float-sidebar-shadow, var(--trol-island-shadow)),
    0 0 0 1px #f4f6f8,
    inset 0 2px 0 rgba(255, 255, 255, 0.5),
    inset 0 -1px 0 rgba(0, 0, 0, 0.2),
    0 0 8px rgba(180, 192, 204, 0.3) !important;
}

/* Copper trim */
#ts-solo-root[data-ts-listRow-border-style="copper-trim"] .jt-ts-mock-row[data-ts-float-key="listRow"],
#ts-solo-root[data-ts-modal-border-style="copper-trim"] .jt-ts-mock-modal,
#ts-solo-root[data-ts-sidebar-border-style="copper-trim"] .jt-ts-mock-sidebar .trol-island-folder__tab,
#ts-solo-root[data-ts-sidebar-border-style="copper-trim"] .jt-ts-mock-sidebar .trol-island-folder__body,
#ts-solo-root[data-ts-topBar-border-style="copper-trim"] .jt-ts-mock-topbar,
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="copper-trim"] .ctx-shell .ctx-left .ctx-row,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="copper-trim"] .ctx-shell .ctx-left .ctx-row,
html[data-ts-listRow-border-style="copper-trim"] .day-scroll-list .day-item-card,
html[data-et-app="mail"][data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="copper-trim"] .et-messages-panel .et-stub-list li.et-msg-row,
html[data-et-app="mail"][data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="copper-trim"] .et-messages-panel .et-stub-list li.et-msg-row {
  --_rim-color: var(--ts-float-listRow-border, #b87333);
  border: var(--ts-float-listRow-border-width, 2px) solid color-mix(in srgb, #e8a878 42%, var(--_rim-color) 58%) !important;
  box-shadow:
    var(--ts-float-listRow-shadow, var(--trol-island-shadow)),
    0 0 0 1px color-mix(in srgb, #f0c090 50%, var(--_rim-color) 50%),
    inset 0 1px 0 rgba(255, 200, 150, 0.38),
    0 0 12px color-mix(in srgb, var(--_rim-color) 32%, transparent) !important;
}

/* Gunmetal bezel */
#ts-solo-root[data-ts-listRow-border-style="gunmetal-bezel"] .jt-ts-mock-row[data-ts-float-key="listRow"],
#ts-solo-root[data-ts-modal-border-style="gunmetal-bezel"] .jt-ts-mock-modal,
#ts-solo-root[data-ts-sidebar-border-style="gunmetal-bezel"] .jt-ts-mock-sidebar .trol-island-folder__tab,
#ts-solo-root[data-ts-sidebar-border-style="gunmetal-bezel"] .jt-ts-mock-sidebar .trol-island-folder__body,
#ts-solo-root[data-ts-topBar-border-style="gunmetal-bezel"] .jt-ts-mock-topbar,
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="gunmetal-bezel"] .ctx-shell .ctx-left .ctx-row,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="gunmetal-bezel"] .ctx-shell .ctx-left .ctx-row,
html[data-ts-listRow-border-style="gunmetal-bezel"] .day-scroll-list .day-item-card,
html[data-et-app="mail"][data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="gunmetal-bezel"] .et-messages-panel .et-stub-list li.et-msg-row,
html[data-et-app="mail"][data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="gunmetal-bezel"] .et-messages-panel .et-stub-list li.et-msg-row {
  --_rim-color: var(--ts-float-listRow-border, #4a5058);
  border: var(--ts-float-listRow-border-width, 2px) solid color-mix(in srgb, #6a7078 50%, var(--_rim-color) 50%) !important;
  box-shadow:
    var(--ts-float-listRow-shadow, var(--trol-island-shadow)),
    0 0 0 1px color-mix(in srgb, #8a929a 40%, #1a2028 60%),
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    inset 0 -2px 4px rgba(0, 0, 0, 0.42),
    0 0 8px rgba(0, 0, 0, 0.45) !important;
}

/* Gold leaf */
#ts-solo-root[data-ts-listRow-border-style="gold-leaf"] .jt-ts-mock-row[data-ts-float-key="listRow"],
#ts-solo-root[data-ts-modal-border-style="gold-leaf"] .jt-ts-mock-modal,
#ts-solo-root[data-ts-sidebar-border-style="gold-leaf"] .jt-ts-mock-sidebar .trol-island-folder__tab,
#ts-solo-root[data-ts-sidebar-border-style="gold-leaf"] .jt-ts-mock-sidebar .trol-island-folder__body,
#ts-solo-root[data-ts-topBar-border-style="gold-leaf"] .jt-ts-mock-topbar,
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="gold-leaf"] .ctx-shell .ctx-left .ctx-row,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="gold-leaf"] .ctx-shell .ctx-left .ctx-row,
html[data-ts-listRow-border-style="gold-leaf"] .day-scroll-list .day-item-card,
html[data-et-app="mail"][data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="gold-leaf"] .et-messages-panel .et-stub-list li.et-msg-row,
html[data-et-app="mail"][data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="gold-leaf"] .et-messages-panel .et-stub-list li.et-msg-row {
  --_rim-color: var(--ts-float-listRow-border, #d4af37);
  border: var(--ts-float-listRow-border-width, 2px) solid color-mix(in srgb, #fff0b0 45%, var(--_rim-color) 55%) !important;
  box-shadow:
    var(--ts-float-listRow-shadow, var(--trol-island-shadow)),
    0 0 0 1px #fff8d0,
    inset 0 2px 0 rgba(255, 255, 255, 0.62),
    0 0 14px color-mix(in srgb, var(--_rim-color) 38%, transparent) !important;
}

/* Inset chamfer (non-metallic recessed lip) */
#ts-solo-root[data-ts-listRow-border-style="inset"] .jt-ts-mock-row[data-ts-float-key="listRow"],
#ts-solo-root[data-ts-sidebar-border-style="inset"] .jt-ts-mock-sidebar .trol-island-folder__tab,
#ts-solo-root[data-ts-sidebar-border-style="inset"] .jt-ts-mock-sidebar .trol-island-folder__body,
#ts-solo-root[data-ts-modal-border-style="inset"] .jt-ts-mock-modal,
#ts-solo-root[data-ts-topBar-border-style="inset"] .jt-ts-mock-topbar,
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="inset"] .ctx-shell .ctx-left .ctx-row,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="inset"] .ctx-shell .ctx-left .ctx-row,
html[data-ts-listRow-border-style="inset"] .day-scroll-list .day-item-card,
html[data-et-app="mail"][data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="inset"] .et-messages-panel .et-stub-list li.et-msg-row,
html[data-et-app="mail"][data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"])[data-ts-listRow-border-style="inset"] .et-messages-panel .et-stub-list li.et-msg-row {
  border: var(--ts-float-listRow-border-width, 1px) solid color-mix(in srgb, var(--ts-float-listRow-border, rgba(255,255,255,0.08)) 100%, transparent) !important;
  box-shadow:
    var(--ts-float-listRow-shadow, var(--trol-island-shadow)),
    inset 0 2px 6px rgba(0, 0, 0, 0.38),
    inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

/* None / solid: rim off (leather + shadow only; production rows keep legacy stack) */
#ts-solo-root[data-ts-listRow-border-style="none"] .jt-ts-mock-row[data-ts-float-key="listRow"],
#ts-solo-root[data-ts-listRow-border-style="solid"] .jt-ts-mock-row[data-ts-float-key="listRow"],
#ts-solo-root[data-ts-modal-border-style="none"] .jt-ts-mock-modal,
#ts-solo-root[data-ts-modal-border-style="solid"] .jt-ts-mock-modal {
  border-color: color-mix(in srgb, var(--ts-float-listRow-border, rgba(255,255,255,0.06)) 100%, transparent);
}

/* Theme Studio follow-up list row mock (inherits listRow chrome until customized) */
#ts-solo-root[data-ts-listRowFollowUp-border-style="brass"] .jt-ts-mock-row[data-ts-float-key="listRowFollowUp"] {
  --_rim-color: var(--ts-float-listRowFollowUp-border, var(--ts-float-listRow-border, #c59a5e));
  border: var(--ts-float-listRowFollowUp-border-width, var(--ts-float-listRow-border-width, 2px)) solid color-mix(in srgb, var(--_rim-color) 86%, #fff 14%) !important;
  box-shadow:
    var(--ts-float-listRowFollowUp-shadow, var(--ts-float-listRow-shadow, var(--trol-island-shadow))),
    0 0 0 1px color-mix(in srgb, #f0d080 48%, var(--_rim-color) 52%),
    inset 0 1px 0 rgba(255, 228, 180, 0.32),
    0 0 12px color-mix(in srgb, var(--_rim-color) 28%, transparent) !important;
}
#ts-solo-root[data-ts-listRowFollowUp-border-style="chrome-lip"] .jt-ts-mock-row[data-ts-float-key="listRowFollowUp"] {
  --_rim-color: var(--ts-float-listRowFollowUp-border, var(--ts-float-listRow-border, #b8c0c8));
  border: var(--ts-float-listRowFollowUp-border-width, var(--ts-float-listRow-border-width, 2px)) solid color-mix(in srgb, #e8ecef 55%, var(--_rim-color) 45%) !important;
  box-shadow:
    var(--ts-float-listRowFollowUp-shadow, var(--ts-float-listRow-shadow, var(--trol-island-shadow))),
    0 0 0 1px #f4f6f8,
    inset 0 2px 0 rgba(255, 255, 255, 0.55),
    inset 0 -1px 0 rgba(0, 0, 0, 0.22),
    0 0 10px rgba(180, 192, 204, 0.35) !important;
}
#ts-solo-root[data-ts-listRowFollowUp-border-style="copper-trim"] .jt-ts-mock-row[data-ts-float-key="listRowFollowUp"] {
  --_rim-color: var(--ts-float-listRowFollowUp-border, var(--ts-float-listRow-border, #b87333));
  border: var(--ts-float-listRowFollowUp-border-width, var(--ts-float-listRow-border-width, 2px)) solid color-mix(in srgb, #e8a878 42%, var(--_rim-color) 58%) !important;
  box-shadow:
    var(--ts-float-listRowFollowUp-shadow, var(--ts-float-listRow-shadow, var(--trol-island-shadow))),
    0 0 0 1px color-mix(in srgb, #f0c090 50%, var(--_rim-color) 50%),
    inset 0 1px 0 rgba(255, 200, 150, 0.38),
    0 0 12px color-mix(in srgb, var(--_rim-color) 32%, transparent) !important;
}
#ts-solo-root[data-ts-listRowFollowUp-border-style="gunmetal-bezel"] .jt-ts-mock-row[data-ts-float-key="listRowFollowUp"] {
  --_rim-color: var(--ts-float-listRowFollowUp-border, var(--ts-float-listRow-border, #4a5058));
  border: var(--ts-float-listRowFollowUp-border-width, var(--ts-float-listRow-border-width, 2px)) solid color-mix(in srgb, #6a7078 50%, var(--_rim-color) 50%) !important;
  box-shadow:
    var(--ts-float-listRowFollowUp-shadow, var(--ts-float-listRow-shadow, var(--trol-island-shadow))),
    0 0 0 1px color-mix(in srgb, #8a929a 40%, #1a2028 60%),
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    inset 0 -2px 4px rgba(0, 0, 0, 0.42),
    0 0 8px rgba(0, 0, 0, 0.45) !important;
}
#ts-solo-root[data-ts-listRowFollowUp-border-style="gold-leaf"] .jt-ts-mock-row[data-ts-float-key="listRowFollowUp"] {
  --_rim-color: var(--ts-float-listRowFollowUp-border, var(--ts-float-listRow-border, #d4af37));
  border: var(--ts-float-listRowFollowUp-border-width, var(--ts-float-listRow-border-width, 2px)) solid color-mix(in srgb, #fff0b0 45%, var(--_rim-color) 55%) !important;
  box-shadow:
    var(--ts-float-listRowFollowUp-shadow, var(--ts-float-listRow-shadow, var(--trol-island-shadow))),
    0 0 0 1px #fff8d0,
    inset 0 2px 0 rgba(255, 255, 255, 0.62),
    0 0 14px color-mix(in srgb, var(--_rim-color) 38%, transparent) !important;
}
#ts-solo-root[data-ts-listRowFollowUp-border-style="inset"] .jt-ts-mock-row[data-ts-float-key="listRowFollowUp"] {
  border: var(--ts-float-listRowFollowUp-border-width, var(--ts-float-listRow-border-width, 1px)) solid color-mix(in srgb, var(--ts-float-listRowFollowUp-border, var(--ts-float-listRow-border, rgba(255,255,255,0.08))) 100%, transparent) !important;
  box-shadow:
    var(--ts-float-listRowFollowUp-shadow, var(--ts-float-listRow-shadow, var(--trol-island-shadow))),
    inset 0 2px 6px rgba(0, 0, 0, 0.38),
    inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}
#ts-solo-root[data-ts-listRowFollowUp-border-style="none"] .jt-ts-mock-row[data-ts-float-key="listRowFollowUp"],
#ts-solo-root[data-ts-listRowFollowUp-border-style="solid"] .jt-ts-mock-row[data-ts-float-key="listRowFollowUp"] {
  border-color: color-mix(in srgb, var(--ts-float-listRowFollowUp-border, var(--ts-float-listRow-border, rgba(255,255,255,0.06))) 100%, transparent);
}

/* Primary button typography from floatingUi.elements.buttonPrimary.typography */
.et-btn-primary,
.btn-primary,
.day-btn:not(.day-btn-ghost):not(.day-btn-danger),
button[type="submit"].primary {
  color: var(--ts-float-buttonPrimary-title-color, inherit);
  font-family: var(--ts-float-buttonPrimary-title-font, inherit);
  font-size: var(--ts-float-buttonPrimary-title-size, inherit);
  font-weight: var(--ts-float-buttonPrimary-title-weight, inherit);
  box-shadow: var(--ts-float-buttonPrimary-shadow, inherit);
}


/* --- engine layer: trol-island-folder.css --- */
/**
 * Folder-tab grouped sidebar islands: one solid fill, tab label top-left,
 * backdrop visible to the right of the tab and between islands.
 */
:root {
  --trol-island-folder-fill: var(
    --ts-float-sidebar-fill,
    var(--surface-elev, #342418)
  );
  --trol-island-folder-tab-h: 26px;
  --trol-island-folder-radius: var(--trol-panel-radius, 10px);
  --trol-island-folder-tab-radius: calc(var(--trol-island-folder-radius) - 2px);
  --trol-island-folder-link-fg: var(
    --ts-float-sidebar-subtitle-color,
    color-mix(in srgb, #fff 72%, transparent)
  );
  --trol-island-folder-link-active-fg: var(
    --ts-float-sidebar-title-color,
    var(--family-bright, #c59a5e)
  );
  --ts-sidebar-group-gap: var(--trol-island-gap, 12px);
  --day-sidebar-brand-gap: 16px;
}

/* Logo / brand island → first folder group: breathing room at top of nav column */
.day-sidebar-brand + .day-sidebar-nav,
aside.sidebar > .sidebar-brand + .sidebar-nav {
  margin-top: var(--day-sidebar-brand-gap, 16px);
}

/* Stacked folder islands: gap reveals wood/backdrop between groups */
.trol-island-folder + .trol-island-folder {
  margin-top: var(--ts-sidebar-group-gap, var(--trol-island-gap, 12px));
}

.trol-island-folder {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
  isolation: isolate;
}

.trol-island-folder__header {
  display: flex;
  align-items: flex-end;
  flex-shrink: 0;
  min-height: var(--trol-island-folder-tab-h);
}

.trol-island-folder__tab {
  flex: 0 0 auto;
  position: relative;
  z-index: 2;
  min-height: var(--trol-island-folder-tab-h);
  padding: 4px 12px 0;
  border-radius: var(--trol-island-folder-tab-radius) var(--trol-island-folder-tab-radius) 0 0;
  background: var(--trol-island-folder-fill);
  box-shadow: var(--ts-float-sidebar-shadow, var(--trol-island-shadow, 0 4px 18px rgba(0, 0, 0, 0.28)));
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1.35;
  color: var(--trol-island-folder-link-active-fg);
  text-transform: uppercase;
}

.trol-island-folder__tab::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2px;
  background: var(--trol-island-folder-fill);
}

.trol-island-folder__body {
  position: relative;
  z-index: 1;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 10px 10px 12px;
  background: var(--trol-island-folder-fill);
  border: var(--ts-float-sidebar-border-width, 1px) solid var(--ts-float-sidebar-border, rgba(255, 255, 255, 0.08));
  border-radius: 0 var(--trol-island-folder-radius) var(--trol-island-folder-radius) var(--trol-island-folder-radius);
  box-shadow: var(--ts-float-sidebar-shadow, var(--trol-island-shadow, 0 4px 18px rgba(0, 0, 0, 0.28)));
  overflow: hidden;
}

/* Sidebar nav columns scroll as a unit: do not clip long folder/filter lists inside bodies */
.day-sidebar-nav .trol-island-folder__body,
.et-folders-nav .trol-island-folder__body,
.ctx-filters .ctx-chips .trol-island-folder__body {
  overflow: visible;
  max-height: none;
}

/* Plain nav rows: no per-item boxes or divider lines */
.trol-island-folder__link,
.trol-island-folder__body > .jt-ts-mock-nav-item,
.trol-island-folder__body > .day-sidebar-link,
.trol-island-folder__body > .nav-item,
.trol-island-folder__body > .ct-nav-link,
.trol-island-folder__body > .ct-nav-more-toggle,
.trol-island-folder__body .ct-nav-more-link {
  display: block;
  margin: 0;
  padding: 6px 4px;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  text-decoration: none;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--trol-island-folder-link-fg);
  transition: color 0.12s ease, font-weight 0.12s ease;
}

.trol-island-folder__body > .jt-ts-mock-nav-item.is-active,
.trol-island-folder__body > .day-sidebar-link.is-active,
.trol-island-folder__body > .nav-item.active,
.trol-island-folder__body > .ct-nav-link.ct-nav-active,
.trol-island-folder__body > .ct-nav-more-toggle.ct-nav-active,
.trol-island-folder__body .ct-nav-more-link-active,
.trol-island-folder__link.is-active {
  background: transparent;
  box-shadow: none;
  color: var(--trol-island-folder-link-active-fg);
  font-weight: 700;
}

.trol-island-folder__body > .day-sidebar-link:hover,
.trol-island-folder__body > .nav-item:hover,
.trol-island-folder__body > .ct-nav-link:hover,
.trol-island-folder__body > .jt-ts-mock-nav-item:hover {
  background: transparent;
  box-shadow: none;
  color: var(--trol-island-folder-link-active-fg);
}

/* Sidebar column: stacks folder islands; backdrop visible in gaps (Daytrol / Theme Studio mock only) */
.jt-ts-mock-sidebar,
.day-sidebar-nav {
  display: flex;
  flex-direction: column;
  gap: var(--ts-sidebar-group-gap, var(--trol-island-gap, 12px));
}

.day-sidebar-nav .trol-island-folder + .trol-island-folder {
  margin-top: 0;
}

/* Daytrol: folder group wrapper is transparent; tab + body carry the island fill */
.trol-island-folder.day-sidebar-island,
.trol-island-folder.day-sidebar-folder-island {
  background: transparent;
  border: none;
  box-shadow: none;
  border-radius: 0;
}

/* Safety net for pre-v140 markup where each link had .day-sidebar-island */
.trol-island-folder__body > .day-sidebar-link.day-sidebar-island {
  border-radius: 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

/* Theme Studio mock sidebar: transparent shell; children are folder islands */
.jt-ts-mock-sidebar {
  border: none;
  background: transparent;
  box-shadow: none;
  padding: 0;
  min-height: 0;
  height: auto;
  align-self: start;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.jt-ts-mock-sidebar .trol-island-folder + .trol-island-folder {
  margin-top: 0;
}

/* Emailtrol: folder-tab groups (Inbox / Favorites / Folders); strip legacy per-row trays */
.trol-island-folder__body .et-folders-group-list,
.trol-island-folder__body #et-folders.et-stub-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.et-folders-nav {
  display: flex;
  flex-direction: column;
  gap: var(--ts-sidebar-group-gap, var(--trol-island-gap, 12px));
}

/* Emailtrol: islands are content-sized stacks inside scroll column (not flex-fill trays) */
.et-folders-nav .trol-island-folder {
  flex: 0 0 auto;
  align-self: stretch;
}

.et-folders-nav .trol-island-folder__body {
  flex: 0 0 auto;
  min-height: 0;
}

/* FOLDERS island: tab + New folder in one header row */
.et-folders-tree-island .trol-island-folder__header.et-folders-tree-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: nowrap;
}

.et-folders-tree-island .trol-island-folder__header .trol-island-folder__tab {
  flex: 0 1 auto;
  min-width: 0;
}

.et-folders-tree-island .et-folders-tree-new {
  flex: 0 0 auto;
  margin: 0 0 1px;
  max-width: 52%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

html .trol-island-folder__body .et-folders-group-list > li.et-folder-row,
html .trol-island-folder__body .et-folders-group-list > li.et-virtual-folder,
html .trol-island-folder__body .et-folders-group-list > li.et-folder-fav-hint,
html .trol-island-folder__body .et-folders-group-list > li.et-mail-folder-virtual,
html .trol-island-folder__body #et-folders > li.et-folder-row,
html .trol-island-folder__body #et-folders > li.et-virtual-folder,
html .trol-island-folder__body #et-folders > li.et-folder-fav-hint,
html .trol-island-folder__body #et-folders > li.et-mail-folder-virtual {
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  border-left: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 6px 4px !important;
}

html .trol-island-folder__body #et-folders > li.et-folder-section-head {
  margin: 8px 0 2px;
  padding: 0 2px 2px !important;
  background: transparent !important;
  border: none !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--trol-island-folder-link-active-fg) 72%, transparent) !important;
}

html .trol-island-folder__body #et-folders > li.et-folder-section-head:first-child {
  margin-top: 0;
}

html[data-et-app="mail"] .trol-island-folder__body .et-folders-group-list > li.et-folder-row.et-active,
html[data-et-app="mail"] .trol-island-folder__body .et-folders-group-list > li.et-folder-row.is-active,
html[data-et-app="mail"] .trol-island-folder__body .et-folders-group-list > li.et-folder-row[aria-selected="true"],
html[data-et-app="mail"] .trol-island-folder__body .et-folders-group-list > li.et-virtual-folder.et-active,
html[data-et-app="mail"] .trol-island-folder__body .et-folders-group-list > li.et-virtual-folder.is-active,
html[data-et-app="mail"] .trol-island-folder__body .et-folders-group-list > li.et-mail-folder-virtual.et-active,
html[data-et-app="mail"] .trol-island-folder__body #et-folders > li.et-folder-row.et-active,
html[data-et-app="mail"] .trol-island-folder__body #et-folders > li.et-folder-row.is-active,
html[data-et-app="mail"] .trol-island-folder__body #et-folders > li.et-folder-row[aria-selected="true"],
html[data-et-app="mail"] .trol-island-folder__body #et-folders > li.et-virtual-folder.et-active,
html[data-et-app="mail"] .trol-island-folder__body #et-folders > li.et-virtual-folder.is-active,
html[data-et-app="mail"] .trol-island-folder__body #et-folders > li.et-mail-folder-virtual.et-active {
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  border-left: none !important;
  box-shadow: none !important;
  padding-left: 4px !important;
  font-weight: 700;
  color: var(--trol-island-folder-link-active-fg);
}

html[data-et-app="mail"] .trol-island-folder__body .et-folders-group-list > li.et-folder-row:hover:not(.et-active):not([aria-selected="true"]),
html[data-et-app="mail"] .trol-island-folder__body .et-folders-group-list > li.et-virtual-folder:hover:not(.et-active),
html[data-et-app="mail"] .trol-island-folder__body #et-folders > li.et-folder-row:hover:not(.et-active):not([aria-selected="true"]),
html[data-et-app="mail"] .trol-island-folder__body #et-folders > li.et-virtual-folder:hover:not(.et-active),
html[data-et-app="mail"] .trol-island-folder__body #et-folders > li.et-mail-folder-virtual:hover:not(.et-active) {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html .trol-island-folder__body .et-folders-group-list > li.et-virtual-folder:not(.et-active),
html .trol-island-folder__body #et-folders > li.et-virtual-folder:not(.et-active),
html .trol-island-folder__body #et-folders > li.et-mail-folder-virtual:not(.et-active) {
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  border-left: none !important;
  box-shadow: none !important;
}

.trol-island-folder__body .et-folders-head {
  margin: 0 0 6px;
  padding: 0 2px;
}

.trol-island-folder__body .et-folders-head h2 {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

/* Contactrol: contacts filter sidebar folder-tab groups */
.ctx-filters .ctx-chips {
  display: flex;
  flex-direction: column;
  gap: var(--ts-sidebar-group-gap, var(--trol-island-gap, 12px));
}

.ctx-filters .ctx-chips .trol-island-folder + .trol-island-folder {
  margin-top: 0;
}

/* Contactrol: content-sized folder islands inside scroll column */
.ctx-filters .ctx-chips .trol-island-folder {
  flex: 0 0 auto;
  align-self: stretch;
}

.ctx-filters .ctx-chips .trol-island-folder__body {
  flex: 0 0 auto;
  min-height: 0;
}

.trol-island-folder__body > .ctx-chip,
.trol-island-folder__body .ctx-chip,
.trol-island-folder__body > a.ctx-chip-manage,
.trol-island-folder__body a.ctx-chip-manage {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin: 0;
  padding: 6px 4px;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  text-align: left;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--trol-island-folder-link-fg);
  cursor: pointer;
  font-family: inherit;
  text-decoration: none;
  white-space: normal;
}

.trol-island-folder__body > .ctx-chip:hover,
.trol-island-folder__body .ctx-chip:hover,
.trol-island-folder__body > a.ctx-chip-manage:hover,
.trol-island-folder__body a.ctx-chip-manage:hover {
  background: transparent;
  color: var(--trol-island-folder-link-active-fg);
}

.trol-island-folder__body > .ctx-chip.ctx-chip-active,
.trol-island-folder__body .ctx-chip.ctx-chip-active {
  background: transparent;
  box-shadow: none;
  color: var(--trol-island-folder-link-active-fg);
  font-weight: 700;
}

.trol-island-folder__body .ctx-chip .ctx-chip-count {
  border: none;
  border-left: none;
  margin-left: auto;
  padding-left: 8px;
  font-size: 11px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: color-mix(in srgb, var(--trol-island-folder-link-fg) 55%, transparent);
}

.trol-island-folder__body .ctx-chip.ctx-chip-active .ctx-chip-count {
  color: var(--trol-island-folder-link-active-fg);
}

/* Ron Burgundy / Royal Cream: opaque leather on tab + body; wood only in column gaps */
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]),
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) {
  --trol-island-folder-fill: var(--ts-float-sidebar-fill, var(--surface-elev, #342418));
}

html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .trol-island-folder__tab,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .trol-island-folder__tab,
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .trol-island-folder__tab::after,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .trol-island-folder__tab::after,
html[data-style="ron-burgundy"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .trol-island-folder__body,
html[data-style="royal-cream"]:not([data-ui-theme]):not([data-et-woodgrain="off"]) .trol-island-folder__body {
  background: var(--trol-island-folder-fill) !important;
  background-color: var(--trol-island-folder-fill) !important;
}

/* Contactrol: stacked header nav gap under logo when menu open */
.ct-header.ct-header-open .ct-brand-wrap + .ct-nav {
  margin-top: var(--day-sidebar-brand-gap, 16px);
}


/* --- engine layer: trol-suite-backdrop.css --- */
/* ================================================================== *
 * Suite backdrop: ONE continuous full-viewport layer (Phase 2 consolidate).
 * When SSR sets data-trol-suite-backdrop="1", the published backdrop paints
 * exactly once on <html>::before. Shell/sidebar/content duplicate backdrops
 * are suppressed; islands float translucent above.
 * ================================================================== */

html[data-trol-suite-backdrop="1"] {
  --trol-texture-hub: "https://thetrols.com";
  --trol-suite-backdrop-z: -1;

  /* Theme Studio layer contract (unset = per-app legacy fallbacks in *-one-backdrop.css)
   * --trol-layer-listrow-transparent
   * --trol-layer-listrow-transparent-hover
   * --trol-layer-listrow-transparent-active
   * --trol-layer-listrow-transparent-edge
   * --trol-layer-listrow-transparent-shadow
   * --trol-layer-topbar-material
   * --trol-layer-button-hardware-material
   * --trol-layer-button-hardware-bw  (0 = color, 1 = grayscale)
   * --trol-layer-modal-material
   * --trol-island-modal-dim  (0–100, island overlay on modal panel)
   * --trol-layer-nav-rail-transparent
   * --trol-layer-sidebar-island-transparent
   * --trol-layer-floating-island-material
   * --trol-layer-reading-pane-transparent
   * --trol-layer-cmdbar-material
   * --trol-layer-tray-material
   * --trol-layer-backdrop-material
   * --trol-layer-backdrop-pattern-scale
   */
}

html[data-trol-suite-backdrop="1"][data-trol-texture]:not([data-trol-texture="none"]):not([data-ui-theme])::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  margin: 0;
  padding: 0;
  right: auto;
  bottom: auto;
  z-index: var(--trol-suite-backdrop-z, -1);
  pointer-events: none;
  contain: paint;
  transform: translateZ(0);
  backface-visibility: hidden;
  background-image:
    var(--trol-backdrop-scrim-grad),
    var(--trol-surface-light-sh-grad, none),
    var(--trol-surface-light-hi-grad, none),
    var(--trol-skin-texture, none);
  background-position: center;
  background-size: cover, cover, cover, cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  opacity: min(var(--trol-skin-opacity-cap, 1), calc(var(--trol-skin-opacity, 0.42) * var(--trol-skin-amount, 1) * var(--trol-texture-opacity, 1) * var(--trol-texture-layer-opacity, 1)));
  filter: sepia(var(--trol-skin-sepia, 0)) hue-rotate(var(--trol-skin-hue, 0deg)) saturate(var(--trol-skin-saturate, 1)) brightness(var(--trol-skin-brightness, 1)) contrast(var(--trol-skin-contrast, var(--trol-skin-depth, 1))) grayscale(var(--trol-skin-grayscale, 0)) var(--trol-skin-filter, );
}

/* Suppress duplicate per-app shell backdrops only: island card ::before/::after stay live. */
html[data-trol-suite-backdrop="1"] .ctx-shell::before,
html[data-trol-suite-backdrop="1"] .et-shell.et-mail-shell::before,
html[data-trol-suite-backdrop="1"] .et-shell.et-mail-shell::after,
html[data-trol-suite-backdrop="1"] .day-wrap::before,
html[data-trol-suite-backdrop="1"] .day-wrap::after,
html[data-trol-suite-backdrop="1"] .day-shell::before,
html[data-trol-suite-backdrop="1"] .day-shell::after,
html[data-trol-suite-backdrop="1"] .cal-shell::after,
html[data-trol-suite-backdrop="1"] .pht-shell::after,
html[data-trol-suite-backdrop="1"] div.main > div.content::before,
html[data-trol-suite-backdrop="1"] div.main > div.content::after,
html[data-trol-suite-backdrop="1"] .day-sidebar::before,
html[data-trol-suite-backdrop="1"] .day-sidebar::after,
html[data-trol-suite-backdrop="1"] .et-folders-panel::before,
html[data-trol-suite-backdrop="1"] .et-folders-panel::after,
html[data-trol-suite-backdrop="1"] .et-messages-panel::before,
html[data-trol-suite-backdrop="1"] .et-messages-panel::after,
html[data-trol-suite-backdrop="1"] .et-reader-chrome::before,
html[data-trol-suite-backdrop="1"] .et-reader-chrome::after,
html[data-trol-suite-backdrop="1"] body > .et-toolbar::before,
html[data-trol-suite-backdrop="1"] body > .et-toolbar::after,
html[data-trol-suite-backdrop="1"] body > .et-cmdbar::before,
html[data-trol-suite-backdrop="1"] body > .et-cmdbar::after,
html[data-trol-suite-backdrop="1"] body > #et-cmdbar::before,
html[data-trol-suite-backdrop="1"] body > #et-cmdbar::after,
html[data-trol-suite-backdrop="1"] .cal-sidebar::before,
html[data-trol-suite-backdrop="1"] .pht-sidebar::before {
  background-image: none !important;
  opacity: 0 !important;
  content: none !important;
  box-shadow: none !important;
}

html[data-trol-suite-backdrop="1"],
html[data-trol-suite-backdrop="1"] body,
html[data-trol-suite-backdrop="1"] body.day-app {
  background-color: transparent !important;
  background-image: none !important;
}

/* Islands translucent: backdrop shows through list rows, reading panes, cards. */
html[data-trol-suite-backdrop="1"] .ctx-shell .ctx-left .ctx-row,
html[data-trol-suite-backdrop="1"] .et-messages-panel .et-stub-list li.et-msg-row,
html[data-trol-suite-backdrop="1"] .day-scroll-list .day-item-card,
html[data-trol-suite-backdrop="1"] .day-card,
html[data-trol-suite-backdrop="1"] .day-stat,
html[data-trol-suite-backdrop="1"] .day-item,
html[data-trol-suite-backdrop="1"] .day-list-head-island,
html[data-trol-suite-backdrop="1"] .day-app-header,
html[data-trol-suite-backdrop="1"] .day-topbar,
html[data-trol-suite-backdrop="1"] .day-sidebar,
html[data-trol-suite-backdrop="1"] .day-sidebar-island,
html[data-trol-suite-backdrop="1"] .day-wrap,
html[data-trol-suite-backdrop="1"] .day-shell,
html[data-trol-suite-backdrop="1"] .day-main,
html[data-trol-suite-backdrop="1"] .day-today-sticky,
html[data-trol-suite-backdrop="1"] .cal-card,
html[data-trol-suite-backdrop="1"] .pht-card,
html[data-trol-suite-backdrop="1"] .ctx-shell > .ctx-right,
html[data-trol-suite-backdrop="1"] .et-shell,
html[data-trol-suite-backdrop="1"] .et-shell.et-mail-shell,
html[data-trol-suite-backdrop="1"] #et-mail-main,
html[data-trol-suite-backdrop="1"] .et-folders-panel,
html[data-trol-suite-backdrop="1"] .et-messages-panel,
html[data-trol-suite-backdrop="1"] .et-statusrail,
html[data-trol-suite-backdrop="1"] body > .et-toolbar,
html[data-trol-suite-backdrop="1"] body > .et-cmdbar,
html[data-trol-suite-backdrop="1"] body > #et-cmdbar,
html[data-trol-suite-backdrop="1"] .et-reader-panel,
html[data-trol-suite-backdrop="1"] #et-reader-stage,
html[data-trol-suite-backdrop="1"] .et-reader-chrome,
html[data-trol-suite-backdrop="1"] .day-today-detail,
html[data-trol-suite-backdrop="1"] .day-item-hub,
html[data-trol-suite-backdrop="1"] .cal-wrap,
html[data-trol-suite-backdrop="1"] .pht-photo-detail {
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* CT reading-pane wood burl bezel only: Daytrol/Mailtrol use html::before exclusively under suite backdrop. */
html[data-trol-suite-backdrop="1"]:not([data-et-woodgrain="off"]) .ctx-shell .ctx-right::before,
html[data-trol-suite-backdrop="1"]:not([data-et-woodgrain="off"]) .cal-wrap::before,
html[data-trol-suite-backdrop="1"]:not([data-et-woodgrain="off"]) .pht-photo-detail::before {
  background-size: cover !important;
  background-repeat: no-repeat !important;
}

/* Theme Studio solo preview: mirror html suite backdrop on #ts-solo-root (a div, not <html>). */
#ts-solo-root[data-trol-suite-backdrop="1"] {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

#ts-solo-root[data-trol-suite-backdrop="1"][data-trol-texture]:not([data-trol-texture="none"]):not([data-ui-theme])::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  contain: paint;
  border-radius: inherit;
  background-image:
    var(--trol-backdrop-scrim-grad),
    var(--trol-surface-light-sh-grad, none),
    var(--trol-surface-light-hi-grad, none),
    var(--trol-skin-texture, none);
  background-position: center;
  background-size: cover, cover, cover, cover;
  background-repeat: no-repeat;
  background-attachment: scroll;
  opacity: min(var(--trol-skin-opacity-cap, 1), calc(var(--trol-skin-opacity, 0.42) * var(--trol-skin-amount, 1) * var(--trol-texture-opacity, 1) * var(--trol-texture-layer-opacity, 1)));
  filter: sepia(var(--trol-skin-sepia, 0)) hue-rotate(var(--trol-skin-hue, 0deg)) saturate(var(--trol-skin-saturate, 1)) brightness(var(--trol-skin-brightness, 1)) contrast(var(--trol-skin-contrast, var(--trol-skin-depth, 1))) grayscale(var(--trol-skin-grayscale, 0)) var(--trol-skin-filter, );
}

#ts-solo-root[data-trol-suite-backdrop="1"] .jt-theme-studio__solo-content::after {
  content: none !important;
  background-image: none !important;
  opacity: 0 !important;
}