/* Tema 1: Soft Creative — krim, teal, peach dan bentuk organik. */
:root {
  --font-body: "Trebuchet MS", Inter, ui-sans-serif, system-ui, sans-serif;
  --font-display: Georgia, "Times New Roman", serif;
  --page-bg: #fbf1e8;
  --surface: #fffaf5;
  --surface-soft: #f6e9df;
  --surface-strong: #094e52;
  --ink: #0a4d52;
  --muted: #667573;
  --line: rgba(10,77,82,.15);
  --primary: #075e63;
  --primary-ink: #fffaf3;
  --secondary: #f5a889;
  --accent: #f7ca72;
  --accent-2: #5ab8b1;
  --success: #21835b;
  --warning: #d98b2e;
  --danger: #d14f4f;
  --info: #4a79a4;
  --sidebar-bg: #075358;
  --sidebar-ink: #fff8ef;
  --sidebar-muted: rgba(255,248,239,.70);
  --sidebar-hover: rgba(255,255,255,.09);
  --sidebar-active: #f6c671;
  --sidebar-active-ink: #083f43;
  --hero-bg: linear-gradient(128deg, #075358 0%, #0b6668 55%, #16474a 100%);
  --hero-ink: #fff8ef;
  --hero-muted: rgba(255,248,239,.78);
  --card-shadow: 0 18px 42px rgba(27,75,74,.10);
  --card-shadow-hover: 0 25px 58px rgba(27,75,74,.17);
  --hard-shadow: none;
  --radius-xs: 10px;
  --radius-sm: 15px;
  --radius-md: 22px;
  --radius-lg: 34px;
  --border-width: 1px;
  --chart-grid: rgba(10,77,82,.10);
  --chart-text: #6b7977;
  --chart-center: #0a4d52;
  --chart-point-bg: #fffaf5;
  --chart-palette: #075e63,#f5a889,#f7ca72,#5ab8b1,#9064a5,#21835b,#d98b2e,#d14f4f,#4a79a4;
  --table-head: #f4e5db;
  --table-hover: #fff1e6;
  --focus-ring: rgba(7,94,99,.17);
  --organic-opacity: .17;
}

html[data-theme="creative"] .hero h2::after {
  content: " ✦";
  color: var(--accent);
  font-family: var(--font-body);
  font-size: .45em;
  vertical-align: top;
}
html[data-theme="creative"] .panel:nth-of-type(odd) .panel-head { background: #f5e8df; }
html[data-theme="creative"] .kpi-card:nth-child(2n) { transform: translateY(4px); }
html[data-theme="creative"] .kpi-card:hover { transform: translateY(-3px) rotate(-.25deg); }