/* PT Putra Tunggal E-Anggaran - iOS design theme (light/dark tokens + iOS component layer).
   Token names stay Material-style (--m3-*) because every page's Tailwind config reads them;
   the values are Apple Human Interface system colors. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root {
  color-scheme: light;
  --pty-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Inter", "Segoe UI Variable Text", "Segoe UI", system-ui, sans-serif;
  /* iOS materials */
  --ios-bar: 249 249 251;          /* navigation / tab bar material */
  --ios-fill: 118 118 128;         /* system fill (used with alpha) */
  --ios-separator: 60 60 67;       /* separator (used with alpha) */
  --ios-shadow: 0 1px 2px rgba(0,0,0,.04), 0 1px 1px rgba(0,0,0,.02);
  --ios-shadow-float: 0 12px 32px -8px rgba(0,0,0,.18), 0 2px 6px rgba(0,0,0,.06);

  --m3-background: 242 242 247;
  --m3-surface: 242 242 247;
  --m3-surface-bright: 242 242 247;
  --m3-surface-dim: 229 229 234;
  --m3-surface-container-lowest: 255 255 255;
  --m3-surface-container-low: 242 242 247;
  --m3-surface-container: 235 235 240;
  --m3-surface-container-high: 229 229 234;
  --m3-surface-container-highest: 209 209 214;
  --m3-surface-variant: 229 229 234;
  --m3-surface-tint: 0 122 255;
  --m3-on-background: 28 28 30;
  --m3-on-surface: 28 28 30;
  --m3-on-surface-variant: 108 108 112;
  --m3-outline: 142 142 147;
  --m3-outline-variant: 209 209 214;
  --m3-primary: 0 122 255;
  --m3-on-primary: 255 255 255;
  --m3-primary-container: 0 122 255;
  --m3-on-primary-container: 214 232 255;
  --m3-primary-fixed: 229 241 255;
  --m3-primary-fixed-dim: 179 215 255;
  --m3-on-primary-fixed: 0 45 102;
  --m3-on-primary-fixed-variant: 0 86 179;
  --m3-inverse-primary: 100 168 255;
  --m3-secondary: 108 108 112;
  --m3-on-secondary: 255 255 255;
  --m3-secondary-container: 229 229 234;
  --m3-on-secondary-container: 58 58 60;
  --m3-secondary-fixed: 229 229 234;
  --m3-secondary-fixed-dim: 209 209 214;
  --m3-on-secondary-fixed: 28 28 30;
  --m3-on-secondary-fixed-variant: 72 72 74;
  --m3-tertiary: 36 138 61;
  --m3-on-tertiary: 255 255 255;
  --m3-tertiary-container: 30 127 58;
  --m3-on-tertiary-container: 212 245 220;
  --m3-tertiary-fixed: 212 245 220;
  --m3-tertiary-fixed-dim: 155 227 174;
  --m3-on-tertiary-fixed: 11 59 24;
  --m3-on-tertiary-fixed-variant: 30 107 51;
  --m3-error: 215 0 21;
  --m3-on-error: 255 255 255;
  --m3-error-container: 255 229 227;
  --m3-on-error-container: 138 0 16;
  --m3-inverse-surface: 28 28 30;
  --m3-inverse-on-surface: 242 242 247;
}
html.dark {
  color-scheme: dark;
  --ios-bar: 22 22 24;
  --ios-fill: 118 118 128;
  --ios-separator: 84 84 88;
  --ios-shadow: 0 0 0 1px rgba(255,255,255,.04);
  --ios-shadow-float: 0 16px 40px -8px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.06);

  --m3-background: 0 0 0;
  --m3-surface: 0 0 0;
  --m3-surface-bright: 44 44 46;
  --m3-surface-dim: 0 0 0;
  --m3-surface-container-lowest: 28 28 30;
  --m3-surface-container-low: 36 36 38;
  --m3-surface-container: 44 44 46;
  --m3-surface-container-high: 58 58 60;
  --m3-surface-container-highest: 72 72 74;
  --m3-surface-variant: 58 58 60;
  --m3-surface-tint: 10 132 255;
  --m3-on-background: 242 242 247;
  --m3-on-surface: 242 242 247;
  --m3-on-surface-variant: 174 174 178;
  --m3-outline: 142 142 147;
  --m3-outline-variant: 56 56 58;
  --m3-primary: 10 132 255;
  --m3-on-primary: 255 255 255;
  --m3-primary-container: 10 132 255;
  --m3-on-primary-container: 214 232 255;
  --m3-primary-fixed: 10 42 77;
  --m3-primary-fixed-dim: 26 74 128;
  --m3-on-primary-fixed: 214 232 255;
  --m3-on-primary-fixed-variant: 156 203 255;
  --m3-inverse-primary: 0 122 255;
  --m3-secondary: 174 174 178;
  --m3-on-secondary: 28 28 30;
  --m3-secondary-container: 58 58 60;
  --m3-on-secondary-container: 229 229 234;
  --m3-secondary-fixed: 58 58 60;
  --m3-secondary-fixed-dim: 72 72 74;
  --m3-on-secondary-fixed: 242 242 247;
  --m3-on-secondary-fixed-variant: 209 209 214;
  --m3-tertiary: 48 209 88;
  --m3-on-tertiary: 0 46 16;
  --m3-tertiary-container: 31 107 52;
  --m3-on-tertiary-container: 184 245 200;
  --m3-tertiary-fixed: 15 58 28;
  --m3-tertiary-fixed-dim: 31 107 52;
  --m3-on-tertiary-fixed: 184 245 200;
  --m3-on-tertiary-fixed-variant: 127 224 154;
  --m3-error: 255 69 58;
  --m3-on-error: 255 255 255;
  --m3-error-container: 77 21 18;
  --m3-on-error-container: 255 214 211;
  --m3-inverse-surface: 242 242 247;
  --m3-inverse-on-surface: 28 28 30;
}

/* ---- Chart (viz) tokens: validated status palette kept; neutrals follow iOS ---- */
:root {
  --viz-series-1: #2a78d6;
  --viz-good: #0ca30c;
  --viz-progress: #2a78d6;
  --viz-warning: #c98500;
  --viz-critical: #d03b3b;
  --viz-grid: #e5e5ea;
  --viz-axis: #c7c7cc;
  --viz-track: #f2f2f7;
  --viz-ink: #1c1c1e;
  --viz-ink-2: #3a3a3c;
  --viz-muted: #6c6c70;
  --viz-tooltip-bg: #1c1c1e;
  --viz-tooltip-ink: #ffffff;
}
html.dark {
  --viz-series-1: #3987e5;
  --viz-progress: #3987e5;
  --viz-grid: #2c2c2e;
  --viz-axis: #48484a;
  --viz-track: #2c2c2e;
  --viz-ink: #f2f2f7;
  --viz-ink-2: #d1d1d6;
  --viz-muted: #98989f;
  --viz-tooltip-bg: #f2f2f7;
  --viz-tooltip-ink: #1c1c1e;
}

/* ---- Smooth switch (only while toggling) ---- */
html.pty-theme-anim, html.pty-theme-anim *, html.pty-theme-anim *::before, html.pty-theme-anim *::after {
  transition: background-color .3s ease, color .3s ease, border-color .3s ease, fill .3s ease, stroke .3s ease !important;
}
@media (prefers-reduced-motion: reduce) {
  html.pty-theme-anim, html.pty-theme-anim * { transition: none !important; }
}

/* ---- Dark overrides for non-token Tailwind colors used in the mockups & engine ---- */
html.dark .bg-white { background-color: rgb(var(--m3-surface-container-lowest)) !important; }
html.dark .bg-slate-100, html.dark .bg-slate-200 { background-color: rgb(var(--m3-surface-container-high)) !important; }
html.dark .bg-slate-300 { background-color: rgb(var(--m3-outline-variant)) !important; }
html.dark .text-slate-500, html.dark .text-slate-600, html.dark .text-slate-700 { color: rgb(var(--m3-on-surface-variant)) !important; }
html.dark .text-slate-300 { color: rgb(var(--m3-outline)) !important; }

html.dark .bg-emerald-50, html.dark .bg-emerald-100 { background-color: rgb(48 209 88 / .16) !important; }
html.dark .text-emerald-600, html.dark .text-emerald-700, html.dark .text-emerald-800, html.dark .text-emerald-900 { color: #6ee7a0 !important; }

html.dark .bg-amber-50, html.dark .bg-amber-100 { background-color: rgb(255 159 10 / .16) !important; }
html.dark .hover\:bg-amber-100:hover, html.dark .hover\:bg-amber-200:hover { background-color: rgb(255 159 10 / .28) !important; }
html.dark .text-amber-600, html.dark .text-amber-700, html.dark .text-amber-800, html.dark .text-amber-900 { color: #ffd60a !important; }
html.dark .border-amber-200, html.dark .border-amber-300 { border-color: rgb(255 159 10 / .4) !important; }

html.dark .bg-red-50, html.dark .bg-red-100 { background-color: rgb(255 69 58 / .16) !important; }
html.dark .hover\:bg-red-50:hover, html.dark .hover\:bg-red-100:hover, html.dark .hover\:bg-red-200:hover { background-color: rgb(255 69 58 / .28) !important; }
html.dark .text-red-600, html.dark .text-red-700, html.dark .text-red-800 { color: #ff9f97 !important; }
html.dark .border-red-200 { border-color: rgb(255 69 58 / .4) !important; }

html.dark .bg-rose-50, html.dark .bg-rose-100, html.dark .bg-rose-50\/70 { background-color: rgb(255 55 95 / .14) !important; }
html.dark .hover\:bg-rose-100:hover, html.dark .hover\:bg-rose-200:hover { background-color: rgb(255 55 95 / .26) !important; }
html.dark .text-rose-600, html.dark .text-rose-700, html.dark .text-rose-800, html.dark .text-rose-900 { color: #ffa3b5 !important; }
html.dark .border-rose-100, html.dark .border-rose-200 { border-color: rgb(255 55 95 / .35) !important; }

html.dark .bg-blue-50, html.dark .bg-blue-100 { background-color: rgb(10 132 255 / .18) !important; }
html.dark .text-blue-700, html.dark .text-blue-800 { color: #7cc0ff !important; }
html.dark .ring-blue-200 { --tw-ring-color: rgb(10 132 255 / .4) !important; }

html.dark .bg-violet-50 { background-color: rgb(191 90 242 / .16) !important; }
html.dark .text-violet-700 { color: #da8fff !important; }

html.dark input, html.dark select, html.dark textarea { color-scheme: dark; }
html.dark img[src*="googleusercontent"] { filter: brightness(.88); }

/* =====================================================================
   iOS COMPONENT LAYER
   Purely visual: no element is added, removed or hidden here.
   Selectors start with `html` so they outrank Tailwind utilities and the
   engine stylesheet (both are injected later with equal specificity).
   ===================================================================== */

/* Typography: San Francisco on Apple devices, Inter elsewhere */
html body { font-family: var(--pty-font) !important; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; letter-spacing: -0.006em; }
html [class*="font-body"], html [class*="font-headline"], html [class*="font-label"], html [class*="font-display"],
html body button, html body input, html body select, html body textarea { font-family: var(--pty-font) !important; }
html h1, html [class*="text-headline-xl"], html [class*="text-headline-lg"] { letter-spacing: -0.022em; }
html h2, html h3, html [class*="text-headline-md"] { letter-spacing: -0.016em; }
html .uppercase { letter-spacing: .02em; }
html .tracking-wider, html .tracking-widest { letter-spacing: .03em !important; }

/* Continuous-corner radii */
html .rounded-sm { border-radius: 6px; }
html .rounded { border-radius: 8px; }
html .rounded-md { border-radius: 10px; }
html .rounded-lg { border-radius: 12px; }
html .rounded-xl { border-radius: 14px; }
html .rounded-2xl { border-radius: 18px; }
html .rounded-3xl { border-radius: 24px; }
html .rounded-full { border-radius: 9999px; }
html .rounded-t-lg { border-top-left-radius: 12px; border-top-right-radius: 12px; }
html .rounded-t-xl { border-top-left-radius: 14px; border-top-right-radius: 14px; }
html .rounded-b-lg { border-bottom-left-radius: 12px; border-bottom-right-radius: 12px; }
html .rounded-b-xl { border-bottom-left-radius: 14px; border-bottom-right-radius: 14px; }
html .rounded-l-lg { border-top-left-radius: 12px; border-bottom-left-radius: 12px; }
html .rounded-r-lg { border-top-right-radius: 12px; border-bottom-right-radius: 12px; }

/* Flat, soft elevation (iOS grouped cards) */
html .shadow-sm, html .shadow { box-shadow: var(--ios-shadow) !important; }
html .shadow-md, html .shadow-lg { box-shadow: 0 4px 16px -6px rgba(0,0,0,.12), var(--ios-shadow) !important; }
html .shadow-xl, html .shadow-2xl { box-shadow: var(--ios-shadow-float) !important; }
html [class*="shadow-[0_1px_8px"] { box-shadow: var(--ios-shadow) !important; }

/* Translucent navigation bars (header, bottom tab bar, sidebar) */
html body > header, html body header.fixed, html body header.sticky {
  background-color: rgb(var(--ios-bar) / .78) !important;
  -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px);
  box-shadow: 0 .5px 0 rgb(var(--ios-separator) / .29) !important;
}
html body nav.fixed.bottom-0 {
  background-color: rgb(var(--ios-bar) / .82) !important;
  -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px);
  box-shadow: 0 -.5px 0 rgb(var(--ios-separator) / .29) !important;
}
html body aside.fixed.left-0 {
  background-color: rgb(var(--ios-bar) / .92) !important;
  -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px);
  box-shadow: .5px 0 0 rgb(var(--ios-separator) / .29) !important;
}
html body aside#previewDrawer { box-shadow: var(--ios-shadow-float) !important; }
/* Sidebar rows: iPadOS style (rounded, filled accent when selected) */
html body aside nav a { border-radius: 10px !important; }
html body aside nav a.bg-primary-container, html body aside nav a[aria-current="page"] { box-shadow: 0 1px 2px rgb(0 122 255 / .25); }

/* Primary buttons: iOS filled style */
html body button.bg-primary, html body a.bg-primary, html body button.bg-primary-container, html body a.bg-primary-container { font-weight: 600; }
html body button, html body a { -webkit-tap-highlight-color: transparent; }

/* Form controls: iOS fields and tint color */
html body { accent-color: rgb(var(--m3-primary)); }
html body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):focus,
html body select:focus, html body textarea:focus {
  outline: none; box-shadow: 0 0 0 3.5px rgb(var(--m3-primary) / .28) !important; border-color: rgb(var(--m3-primary)) !important;
}
html body ::placeholder { color: rgb(var(--m3-outline)); opacity: 1; }

/* Hairline separators */
html body .divide-y > :not([hidden]) ~ :not([hidden]) { border-color: rgb(var(--ios-separator) / .18); }
html body hr { border-color: rgb(var(--ios-separator) / .2); }

/* Tables: grouped list look */
html body thead th { font-weight: 600; letter-spacing: .01em; }
html body tbody tr { transition: background-color .15s; }

/* Scrollbars: thin overlay style */
html ::-webkit-scrollbar { width: 8px; height: 8px; }
html ::-webkit-scrollbar-track { background: transparent !important; }
html ::-webkit-scrollbar-thumb { background: rgb(var(--ios-fill) / .35) !important; border-radius: 99px; border: 2px solid transparent !important; background-clip: padding-box !important; }

/* ---- Engine components ---- */
/* Sheets & alerts */
html .pty-overlay { background: rgba(0,0,0,.28); -webkit-backdrop-filter: blur(4px) saturate(120%); backdrop-filter: blur(4px) saturate(120%); font-family: var(--pty-font); }
html.dark .pty-overlay { background: rgba(0,0,0,.52); }
html .pty-panel { border-radius: 16px; box-shadow: var(--ios-shadow-float); background: rgb(var(--m3-surface-container-lowest) / .96);
  -webkit-backdrop-filter: saturate(180%) blur(30px); backdrop-filter: saturate(180%) blur(30px); }
html .pty-head { border-bottom: .5px solid rgb(var(--ios-separator) / .29); padding: 18px 20px 14px; }
html .pty-head h3 { font-size: 17px; font-weight: 700; letter-spacing: -0.02em; }
html .pty-head p { font-size: 13px; }
html .pty-close { width: 30px; height: 30px; border-radius: 999px; background: rgb(var(--ios-fill) / .12); color: rgb(var(--m3-on-surface-variant)); }
html .pty-close:hover { background: rgb(var(--ios-fill) / .2); transform: none; }
html .pty-close .material-symbols-outlined { font-size: 18px !important; font-variation-settings: 'wght' 600; }
html .pty-body { padding: 16px 20px; }
html .pty-foot { border-top: .5px solid rgb(var(--ios-separator) / .29); padding: 12px 20px 16px; }
@keyframes ptySheetUp { from { transform: translateY(100%); } to { transform: translateY(0); } }
@keyframes ptySheetDown { from { transform: translateY(0); } to { transform: translateY(100%); } }
@media (max-width: 640px) {
  html .pty-overlay { align-items: flex-end; padding: 0; }
  html .pty-panel, html .pty-panel.is-wide { max-width: none; max-height: 92vh; border-radius: 14px 14px 0 0; animation: ptySheetUp .38s cubic-bezier(.32,.72,0,1) both;
    padding-bottom: env(safe-area-inset-bottom); }
  html .pty-overlay.is-closing .pty-panel { animation: ptySheetDown .25s ease-in both; }
  html .pty-panel::before { content: ""; display: block; width: 36px; height: 5px; border-radius: 99px; background: rgb(var(--ios-fill) / .35); margin: 6px auto 0; }
}

/* Buttons */
html .pty-btn { border-radius: 12px; padding: 10px 18px; font: 600 14px var(--pty-font); letter-spacing: -0.01em; }
html .pty-btn.is-primary { background: rgb(var(--m3-primary)); color: #fff; }
html .pty-btn.is-ghost { background: rgb(var(--ios-fill) / .12); color: rgb(var(--m3-primary)); }
html .pty-btn:hover { filter: brightness(.96); }
html .pty-btn:active { transform: scale(.97); }

/* Fields inside sheets */
html .pty-field label { font-size: 13px; font-weight: 600; }
html .pty-field input, html .pty-field select, html .pty-field textarea { border: none; background: rgb(var(--ios-fill) / .12); border-radius: 10px; padding: 10px 12px; font: 400 15px var(--pty-font); }
html .pty-field input:focus, html .pty-field select:focus, html .pty-field textarea:focus { background: rgb(var(--ios-fill) / .08); }

/* Selectable cards (role picker, modules) */
html .pty-card { border: none; background: rgb(var(--ios-fill) / .08); border-radius: 14px; box-shadow: inset 0 0 0 .5px rgb(var(--ios-separator) / .18); }
html .pty-card:hover, html .pty-card:focus-visible { background: rgb(var(--m3-primary) / .08); box-shadow: inset 0 0 0 1.5px rgb(var(--m3-primary)); transform: none; }
html .pty-card.is-active { box-shadow: inset 0 0 0 2px rgb(var(--m3-primary)); background: rgb(var(--m3-primary) / .08); }
html .pty-card.is-picked { background: rgb(52 199 89 / .14); box-shadow: inset 0 0 0 2px #34c759; }
html .pty-card-icon { border-radius: 10px; }
html .pty-flow .step { background: rgb(var(--ios-fill) / .12); }

/* Segmented controls */
html .pty-tabs, html .pty-viz-toggle, html .pty-viz-period { background: rgb(var(--ios-fill) / .12); border-radius: 9px; padding: 2px; gap: 0; }
html .pty-tabs { width: fit-content; }
html .pty-tabs button, html .pty-viz-toggle button, html .pty-viz-period button { border-radius: 7px; font-family: var(--pty-font); font-weight: 500; color: rgb(var(--m3-on-surface)); }
html .pty-tabs button[aria-selected="true"], html .pty-viz-toggle button[aria-selected="true"], html .pty-viz-period button[aria-selected="true"] {
  background: rgb(var(--m3-surface-container-lowest)); color: rgb(var(--m3-on-surface)); font-weight: 600;
  box-shadow: 0 3px 8px rgba(0,0,0,.12), 0 3px 1px rgba(0,0,0,.04), 0 0 0 .5px rgba(0,0,0,.04); }
html.dark .pty-tabs button[aria-selected="true"], html.dark .pty-viz-toggle button[aria-selected="true"], html.dark .pty-viz-period button[aria-selected="true"] { background: #636366; }
html .pty-tab-count { background: rgb(var(--ios-fill) / .18); }
html .pty-tabs button[aria-selected="true"] .pty-tab-count { background: rgb(var(--m3-primary)); color: #fff; }

/* Drawer tabs: iOS underline-free segmented look */
html .pty-dtabs { background: rgb(var(--ios-bar) / .9); border-bottom: .5px solid rgb(var(--ios-separator) / .29); }
html .pty-dtabs button { font-family: var(--pty-font); }

/* Search field */
html .pty-search { background: rgb(var(--ios-fill) / .12); border-radius: 10px; }
html .pty-search input { font: 400 15px var(--pty-font); }
html .pty-search .material-symbols-outlined { color: rgb(var(--m3-outline)); }
html .pty-chip { font-family: var(--pty-font); background: rgb(var(--m3-primary) / .12); color: rgb(var(--m3-primary)); }

/* Grouped sections (collapsible) */
html .pty-group { border-radius: 14px; box-shadow: var(--ios-shadow); }
html .pty-group > summary { border-radius: 14px; font-weight: 600; }
html .pty-group-note { background: rgb(var(--ios-fill) / .12); }
html .pty-group-chev { color: rgb(var(--m3-outline)); }

/* Lists / tables in sheets */
html .pty-mtable th { background: transparent; font-weight: 600; color: rgb(var(--m3-on-surface-variant)); border-bottom: .5px solid rgb(var(--ios-separator) / .29); }
html .pty-mtable td { border-top: .5px solid rgb(var(--ios-separator) / .18); }
html .pty-pager { border-top: .5px solid rgb(var(--ios-separator) / .18); }
html .pty-pager button { background: rgb(var(--ios-fill) / .12); color: rgb(var(--m3-primary)); border-radius: 8px; font-family: var(--pty-font); }

/* Sidebar category captions: iOS section header */
html .pty-nav-cat, html .pty-nav-more > summary { font-size: 12px; font-weight: 600; letter-spacing: .01em; text-transform: none; color: rgb(var(--m3-on-surface-variant)); }

/* Popovers (notifications, search results) */
html .pty-popover { border: none; border-radius: 14px !important; box-shadow: var(--ios-shadow-float) !important; background: rgb(var(--m3-surface-container-lowest) / .94);
  -webkit-backdrop-filter: saturate(180%) blur(30px); backdrop-filter: saturate(180%) blur(30px); overflow: hidden; }
html .pty-popover-head { background: transparent; border-bottom: .5px solid rgb(var(--ios-separator) / .29); }
html .pty-popover-row { border-bottom: .5px solid rgb(var(--ios-separator) / .18); }

/* Theme toggle */
html .pty-theme-btn { border-radius: 999px; }
html .pty-theme-btn:hover { background: rgb(var(--ios-fill) / .12); }
html .pty-theme-btn.is-dock { color: rgb(var(--m3-on-surface-variant)); }
html .pty-theme-btn.is-dock:hover { background: rgb(var(--ios-fill) / .16); color: rgb(var(--m3-on-surface)); }
html .pty-theme-float { background: rgb(var(--ios-bar) / .8); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); box-shadow: var(--ios-shadow-float); }

/* Monitoring cards */
html .pty-viz-card { border: none; border-radius: 14px; box-shadow: var(--ios-shadow); }
html .pty-viz-title { font-weight: 600; font-size: 15px; letter-spacing: -0.01em; }
html .pty-viz-bar { border-radius: 0 6px 6px 0; }
html .pty-viz-stack { border-radius: 6px; }
html .pty-viz-col { border-radius: 6px 6px 2px 2px; }
html .pty-viz-anchor label { background: rgb(var(--ios-fill) / .12); }
html .pty-viz-anchor input, html .pty-viz-anchor select { border: none; background: rgb(var(--m3-surface-container-lowest)); border-radius: 7px; font-family: var(--pty-font); }
html .pty-viz-anchor button { background: rgb(var(--ios-fill) / .12); color: rgb(var(--m3-primary)); border-radius: 8px; font-family: var(--pty-font); }
html .pty-viz-tooltip { border-radius: 10px; font-family: var(--pty-font); }

/* Toast = iOS notification banner */
html #enterprise-toast-container .pty-toast { font-family: var(--pty-font); }

/* Quick dock = floating iOS material bar */
html #enterprise-quick-toolbar { font-family: var(--pty-font); }

@media (prefers-reduced-motion: reduce) {
  html .pty-panel, html .pty-overlay.is-closing .pty-panel { animation: none !important; }
  html .pty-btn:active { transform: none; }
}