/*! tailwindcss v4.1.10 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
      "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace;
    --color-amber-50: oklch(98.7% 0.022 95.277);
    --color-amber-400: oklch(82.8% 0.189 84.429);
    --color-amber-500: oklch(76.9% 0.188 70.08);
    --color-amber-600: oklch(66.6% 0.179 58.318);
    --color-amber-700: oklch(55.5% 0.163 48.998);
    --color-emerald-50: oklch(97.9% 0.021 166.113);
    --color-emerald-100: oklch(95% 0.052 163.051);
    --color-emerald-200: oklch(90.5% 0.093 164.15);
    --color-emerald-600: oklch(59.6% 0.145 163.225);
    --color-emerald-700: oklch(50.8% 0.118 165.612);
    --color-blue-50: oklch(97% 0.014 254.604);
    --color-blue-600: oklch(54.6% 0.245 262.881);
    --color-blue-700: oklch(48.8% 0.243 264.376);
    --color-rose-50: oklch(96.9% 0.015 12.422);
    --color-rose-100: oklch(94.1% 0.03 12.58);
    --color-rose-200: oklch(89.2% 0.058 10.001);
    --color-rose-500: oklch(64.5% 0.246 16.439);
    --color-rose-600: oklch(58.6% 0.253 17.585);
    --color-rose-700: oklch(51.4% 0.222 16.935);
    --color-slate-50: oklch(98.4% 0.003 247.858);
    --color-slate-100: oklch(96.8% 0.007 247.896);
    --color-slate-200: oklch(92.9% 0.013 255.508);
    --color-slate-300: oklch(86.9% 0.022 252.894);
    --color-slate-400: oklch(70.4% 0.04 256.788);
    --color-slate-500: oklch(55.4% 0.046 257.417);
    --color-slate-600: oklch(44.6% 0.043 257.281);
    --color-slate-700: oklch(37.2% 0.044 257.287);
    --color-slate-800: oklch(27.9% 0.041 260.031);
    --color-slate-900: oklch(20.8% 0.042 265.755);
    --color-slate-950: oklch(12.9% 0.042 264.695);
    --color-white: #fff;
    --spacing: 0.25rem;
    --container-md: 28rem;
    --container-lg: 32rem;
    --container-xl: 36rem;
    --container-2xl: 42rem;
    --container-3xl: 48rem;
    --container-4xl: 56rem;
    --text-xs: 0.75rem;
    --text-xs--line-height: calc(1 / 0.75);
    --text-sm: 0.875rem;
    --text-sm--line-height: calc(1.25 / 0.875);
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
    --text-3xl: 1.875rem;
    --text-3xl--line-height: calc(2.25 / 1.875);
    --text-5xl: 3rem;
    --text-5xl--line-height: 1;
    --text-6xl: 3.75rem;
    --text-6xl--line-height: 1;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-black: 900;
    --tracking-wide: 0.025em;
    --tracking-wider: 0.05em;
    --leading-tight: 1.25;
    --radius-lg: 0.5rem;
    --radius-xl: 0.75rem;
    --radius-2xl: 1rem;
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
  }
}
@layer base {
  *, ::after, ::before, ::backdrop, ::file-selector-button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
  }
  html, :host {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }
  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }
  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }
  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }
  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }
  b, strong {
    font-weight: bolder;
  }
  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }
  small {
    font-size: 80%;
  }
  sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }
  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }
  :-moz-focusring {
    outline: auto;
  }
  progress {
    vertical-align: baseline;
  }
  summary {
    display: list-item;
  }
  ol, ul, menu {
    list-style: none;
  }
  img, svg, video, canvas, audio, iframe, embed, object {
    display: block;
    vertical-align: middle;
  }
  img, video {
    max-width: 100%;
    height: auto;
  }
  button, input, select, optgroup, textarea, ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    border-radius: 0;
    background-color: transparent;
    opacity: 1;
  }
  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }
  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }
  ::file-selector-button {
    margin-inline-end: 4px;
  }
  ::placeholder {
    opacity: 1;
  }
  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentcolor;
      @supports (color: color-mix(in lab, red, red)) {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }
  textarea {
    resize: vertical;
  }
  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }
  ::-webkit-datetime-edit {
    display: inline-flex;
  }
  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }
  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }
  :-moz-ui-invalid {
    box-shadow: none;
  }
  button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
    appearance: button;
  }
  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto;
  }
  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }
}
@layer utilities {
  .fixed {
    position: fixed;
  }
  .relative {
    position: relative;
  }
  .sticky {
    position: sticky;
  }
  .inset-0 {
    inset: calc(var(--spacing) * 0);
  }
  .inset-y-0 {
    inset-block: calc(var(--spacing) * 0);
  }
  .top-0 {
    top: calc(var(--spacing) * 0);
  }
  .left-0 {
    left: calc(var(--spacing) * 0);
  }
  .z-20 {
    z-index: 20;
  }
  .z-30 {
    z-index: 30;
  }
  .z-40 {
    z-index: 40;
  }
  .mt-1 {
    margin-top: calc(var(--spacing) * 1);
  }
  .mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }
  .mt-3 {
    margin-top: calc(var(--spacing) * 3);
  }
  .mt-4 {
    margin-top: calc(var(--spacing) * 4);
  }
  .mt-5 {
    margin-top: calc(var(--spacing) * 5);
  }
  .mt-10 {
    margin-top: calc(var(--spacing) * 10);
  }
  .mb-2 {
    margin-bottom: calc(var(--spacing) * 2);
  }
  .mb-4 {
    margin-bottom: calc(var(--spacing) * 4);
  }
  .mb-6 {
    margin-bottom: calc(var(--spacing) * 6);
  }
  .ml-2 {
    margin-left: calc(var(--spacing) * 2);
  }
  .block {
    display: block;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .hidden {
    display: none;
  }
  .inline {
    display: inline;
  }
  .inline-flex {
    display: inline-flex;
  }
  .inline-grid {
    display: inline-grid;
  }
  .h-10 {
    height: calc(var(--spacing) * 10);
  }
  .h-14 {
    height: calc(var(--spacing) * 14);
  }
  .h-16 {
    height: calc(var(--spacing) * 16);
  }
  .h-20 {
    height: calc(var(--spacing) * 20);
  }
  .min-h-screen {
    min-height: 100vh;
  }
  .w-10 {
    width: calc(var(--spacing) * 10);
  }
  .w-14 {
    width: calc(var(--spacing) * 14);
  }
  .w-72 {
    width: calc(var(--spacing) * 72);
  }
  .w-auto {
    width: auto;
  }
  .w-full {
    width: 100%;
  }
  .max-w-2xl {
    max-width: var(--container-2xl);
  }
  .max-w-3xl {
    max-width: var(--container-3xl);
  }
  .max-w-4xl {
    max-width: var(--container-4xl);
  }
  .max-w-lg {
    max-width: var(--container-lg);
  }
  .max-w-md {
    max-width: var(--container-md);
  }
  .max-w-xl {
    max-width: var(--container-xl);
  }
  .min-w-0 {
    min-width: calc(var(--spacing) * 0);
  }
  .flex-1 {
    flex: 1;
  }
  .-translate-x-full {
    --tw-translate-x: -100%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .place-items-center {
    place-items: center;
  }
  .items-center {
    align-items: center;
  }
  .items-end {
    align-items: flex-end;
  }
  .items-start {
    align-items: flex-start;
  }
  .justify-between {
    justify-content: space-between;
  }
  .justify-center {
    justify-content: center;
  }
  .justify-end {
    justify-content: flex-end;
  }
  .gap-1 {
    gap: calc(var(--spacing) * 1);
  }
  .gap-2 {
    gap: calc(var(--spacing) * 2);
  }
  .gap-3 {
    gap: calc(var(--spacing) * 3);
  }
  .gap-4 {
    gap: calc(var(--spacing) * 4);
  }
  .gap-5 {
    gap: calc(var(--spacing) * 5);
  }
  .space-y-2 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-3 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-4 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-5 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-6 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .overflow-y-auto {
    overflow-y: auto;
  }
  .rounded-2xl {
    border-radius: var(--radius-2xl);
  }
  .rounded-lg {
    border-radius: var(--radius-lg);
  }
  .rounded-xl {
    border-radius: var(--radius-xl);
  }
  .border-b {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }
  .border-slate-200 {
    border-color: var(--color-slate-200);
  }
  .border-slate-800 {
    border-color: var(--color-slate-800);
  }
  .bg-amber-50 {
    background-color: var(--color-amber-50);
  }
  .bg-amber-400 {
    background-color: var(--color-amber-400);
  }
  .bg-rose-50 {
    background-color: var(--color-rose-50);
  }
  .bg-slate-50 {
    background-color: var(--color-slate-50);
  }
  .bg-slate-100 {
    background-color: var(--color-slate-100);
  }
  .bg-slate-800 {
    background-color: var(--color-slate-800);
  }
  .bg-slate-900 {
    background-color: var(--color-slate-900);
  }
  .bg-slate-950 {
    background-color: var(--color-slate-950);
  }
  .bg-slate-950\/50 {
    background-color: color-mix(in srgb, oklch(12.9% 0.042 264.695) 50%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-slate-950) 50%, transparent);
    }
  }
  .bg-white {
    background-color: var(--color-white);
  }
  .bg-white\/95 {
    background-color: color-mix(in srgb, #fff 95%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-white) 95%, transparent);
    }
  }
  .bg-gradient-to-br {
    --tw-gradient-position: to bottom right in oklab;
    background-image: linear-gradient(var(--tw-gradient-stops));
  }
  .from-slate-900 {
    --tw-gradient-from: var(--color-slate-900);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
  .to-slate-800 {
    --tw-gradient-to: var(--color-slate-800);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
  .object-contain {
    object-fit: contain;
  }
  .p-0 {
    padding: calc(var(--spacing) * 0);
  }
  .p-1 {
    padding: calc(var(--spacing) * 1);
  }
  .p-2 {
    padding: calc(var(--spacing) * 2);
  }
  .p-3 {
    padding: calc(var(--spacing) * 3);
  }
  .p-4 {
    padding: calc(var(--spacing) * 4);
  }
  .p-6 {
    padding: calc(var(--spacing) * 6);
  }
  .p-14 {
    padding: calc(var(--spacing) * 14);
  }
  .px-3 {
    padding-inline: calc(var(--spacing) * 3);
  }
  .px-4 {
    padding-inline: calc(var(--spacing) * 4);
  }
  .px-6 {
    padding-inline: calc(var(--spacing) * 6);
  }
  .pb-2 {
    padding-bottom: calc(var(--spacing) * 2);
  }
  .pb-8 {
    padding-bottom: calc(var(--spacing) * 8);
  }
  .text-center {
    text-align: center;
  }
  .text-right {
    text-align: right;
  }
  .text-2xl {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }
  .text-3xl {
    font-size: var(--text-3xl);
    line-height: var(--tw-leading, var(--text-3xl--line-height));
  }
  .text-5xl {
    font-size: var(--text-5xl);
    line-height: var(--tw-leading, var(--text-5xl--line-height));
  }
  .text-6xl {
    font-size: var(--text-6xl);
    line-height: var(--tw-leading, var(--text-6xl--line-height));
  }
  .text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
  .text-sm {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
  .text-xl {
    font-size: var(--text-xl);
    line-height: var(--tw-leading, var(--text-xl--line-height));
  }
  .text-xs {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }
  .leading-tight {
    --tw-leading: var(--leading-tight);
    line-height: var(--leading-tight);
  }
  .font-black {
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
  }
  .font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }
  .tracking-wide {
    --tw-tracking: var(--tracking-wide);
    letter-spacing: var(--tracking-wide);
  }
  .tracking-wider {
    --tw-tracking: var(--tracking-wider);
    letter-spacing: var(--tracking-wider);
  }
  .whitespace-nowrap {
    white-space: nowrap;
  }
  .text-amber-500 {
    color: var(--color-amber-500);
  }
  .text-amber-600 {
    color: var(--color-amber-600);
  }
  .text-amber-700 {
    color: var(--color-amber-700);
  }
  .text-emerald-600 {
    color: var(--color-emerald-600);
  }
  .text-emerald-700 {
    color: var(--color-emerald-700);
  }
  .text-rose-500 {
    color: var(--color-rose-500);
  }
  .text-rose-600 {
    color: var(--color-rose-600);
  }
  .text-rose-700 {
    color: var(--color-rose-700);
  }
  .text-slate-300 {
    color: var(--color-slate-300);
  }
  .text-slate-400 {
    color: var(--color-slate-400);
  }
  .text-slate-500 {
    color: var(--color-slate-500);
  }
  .text-slate-800 {
    color: var(--color-slate-800);
  }
  .text-slate-900 {
    color: var(--color-slate-900);
  }
  .text-white {
    color: var(--color-white);
  }
  .uppercase {
    text-transform: uppercase;
  }
  .line-through {
    text-decoration-line: line-through;
  }
  .antialiased {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  .backdrop-blur {
    --tw-backdrop-blur: blur(8px);
    -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
    backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
  }
  .transition-transform {
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .hover\:bg-slate-50 {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-slate-50);
      }
    }
  }
  .hover\:bg-slate-800 {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-slate-800);
      }
    }
  }
  .hover\:text-white {
    &:hover {
      @media (hover: hover) {
        color: var(--color-white);
      }
    }
  }
  .sm\:block {
    @media (width >= 40rem) {
      display: block;
    }
  }
  .sm\:grid-cols-2 {
    @media (width >= 40rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  .sm\:grid-cols-3 {
    @media (width >= 40rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  .md\:col-span-2 {
    @media (width >= 48rem) {
      grid-column: span 2 / span 2;
    }
  }
  .md\:grid-cols-2 {
    @media (width >= 48rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  .lg\:static {
    @media (width >= 64rem) {
      position: static;
    }
  }
  .lg\:flex {
    @media (width >= 64rem) {
      display: flex;
    }
  }
  .lg\:hidden {
    @media (width >= 64rem) {
      display: none;
    }
  }
  .lg\:translate-x-0 {
    @media (width >= 64rem) {
      --tw-translate-x: calc(var(--spacing) * 0);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  }
  .lg\:grid-cols-2 {
    @media (width >= 64rem) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  .lg\:flex-col {
    @media (width >= 64rem) {
      flex-direction: column;
    }
  }
  .lg\:justify-between {
    @media (width >= 64rem) {
      justify-content: space-between;
    }
  }
  .lg\:p-8 {
    @media (width >= 64rem) {
      padding: calc(var(--spacing) * 8);
    }
  }
  .lg\:px-8 {
    @media (width >= 64rem) {
      padding-inline: calc(var(--spacing) * 8);
    }
  }
  .xl\:grid-cols-4 {
    @media (width >= 80rem) {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
  }
}
@layer components {
  .nav-link {
    margin-bottom: calc(var(--spacing) * 1);
    display: block;
    border-radius: var(--radius-xl);
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 2.5);
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .card {
    border-radius: var(--radius-2xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-slate-200);
    background-color: var(--color-white);
    padding: calc(var(--spacing) * 5);
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .page-head {
    margin-bottom: calc(var(--spacing) * 5);
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: calc(var(--spacing) * 3);
  }
  .page-head h2 {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
    color: var(--color-slate-900);
  }
  .eyebrow {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    --tw-tracking: var(--tracking-wider);
    letter-spacing: var(--tracking-wider);
    color: var(--color-amber-600);
    text-transform: uppercase;
  }
  .btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-xl);
    background-color: var(--color-slate-900);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2.5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-white);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-slate-700);
      }
    }
    &:focus {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    &:focus {
      --tw-ring-color: var(--color-slate-400);
    }
    &:focus {
      --tw-outline-style: none;
      outline-style: none;
    }
  }
  .btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-slate-300);
    background-color: var(--color-white);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2.5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-slate-700);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-slate-50);
      }
    }
    &:focus {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    &:focus {
      --tw-ring-color: var(--color-slate-300);
    }
    &:focus {
      --tw-outline-style: none;
      outline-style: none;
    }
  }
  .btn-ghost {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-xl);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2.5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-slate-500);
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-slate-100);
      }
    }
  }
  .btn-small {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-lg);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-slate-200);
    background-color: var(--color-white);
    padding-inline: calc(var(--spacing) * 2.5);
    padding-block: calc(var(--spacing) * 1.5);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-slate-700);
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-slate-50);
      }
    }
  }
  .btn-danger-soft {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-xl);
    background-color: var(--color-rose-50);
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-rose-700);
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-rose-100);
      }
    }
  }
  .btn-success-soft {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-xl);
    background-color: var(--color-emerald-50);
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-emerald-700);
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-emerald-100);
      }
    }
  }
  .form-group {
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing) * 1.5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-slate-700);
  }
  .form-group small {
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
    color: var(--color-slate-400);
  }
  .form-group b {
    color: var(--color-rose-500);
  }
  .form-input, .form-select, .form-textarea {
    width: 100%;
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-slate-300);
    background-color: var(--color-white);
    padding-inline: calc(var(--spacing) * 3.5);
    padding-block: calc(var(--spacing) * 2.5);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
    color: var(--color-slate-800);
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
    --tw-outline-style: none;
    outline-style: none;
    &::placeholder {
      color: var(--color-slate-400);
    }
    &:focus {
      border-color: var(--color-slate-500);
    }
    &:focus {
      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
    &:focus {
      --tw-ring-color: var(--color-slate-200);
    }
  }
  .filter-bar {
    margin-bottom: calc(var(--spacing) * 4);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-radius: var(--radius-2xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-slate-200);
    background-color: var(--color-white);
    padding: calc(var(--spacing) * 3);
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .filter-bar .form-input {
    min-width: calc(var(--spacing) * 52);
    flex: 1;
  }
  .filter-bar .form-select {
    width: auto;
    min-width: calc(var(--spacing) * 40);
  }
  .table-wrap {
    overflow-x: auto;
  }
  .table {
    min-width: 100%;
    :where(& > :not(:last-child)) {
      --tw-divide-y-reverse: 0;
      border-bottom-style: var(--tw-border-style);
      border-top-style: var(--tw-border-style);
      border-top-width: calc(1px * var(--tw-divide-y-reverse));
      border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
    }
    :where(& > :not(:last-child)) {
      border-color: var(--color-slate-200);
    }
    text-align: left;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
  .table thead {
    background-color: var(--color-slate-50);
  }
  .table th {
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 3);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
    --tw-tracking: var(--tracking-wide);
    letter-spacing: var(--tracking-wide);
    white-space: nowrap;
    color: var(--color-slate-500);
    text-transform: uppercase;
  }
  .table td {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
    border-color: var(--color-slate-100);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 3);
    vertical-align: top;
  }
  .table tbody tr {
    &:hover {
      @media (hover: hover) {
        background-color: color-mix(in srgb, oklch(98.4% 0.003 247.858) 70%, transparent);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--color-slate-50) 70%, transparent);
        }
      }
    }
  }
  .actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
  }
  .badge {
    display: inline-flex;
    align-items: center;
    border-radius: calc(infinity * 1px);
    padding-inline: calc(var(--spacing) * 2.5);
    padding-block: calc(var(--spacing) * 1);
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .badge-neutral {
    background-color: var(--color-slate-100);
    color: var(--color-slate-600);
  }
  .badge-blue {
    background-color: var(--color-blue-50);
    color: var(--color-blue-700);
  }
  .badge-green {
    background-color: var(--color-emerald-50);
    color: var(--color-emerald-700);
  }
  .badge-yellow {
    background-color: var(--color-amber-50);
    color: var(--color-amber-700);
  }
  .badge-red {
    background-color: var(--color-rose-50);
    color: var(--color-rose-700);
  }
  .alert {
    margin-bottom: calc(var(--spacing) * 4);
    border-radius: var(--radius-xl);
    border-style: var(--tw-border-style);
    border-width: 1px;
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 3);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .alert-success {
    border-color: var(--color-emerald-200);
    background-color: var(--color-emerald-50);
    color: var(--color-emerald-700);
  }
  .alert-error {
    border-color: var(--color-rose-200);
    background-color: var(--color-rose-50);
    color: var(--color-rose-700);
  }
  .error-text {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
    color: var(--color-rose-600);
  }
  .empty {
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 10);
    text-align: center;
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    color: var(--color-slate-400);
  }
  .pagination-link {
    display: inline-flex;
    height: calc(var(--spacing) * 9);
    min-width: calc(var(--spacing) * 9);
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-lg);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-slate-200);
    background-color: var(--color-white);
    padding-inline: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-slate-600);
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-slate-50);
      }
    }
  }
  .pagination-link.active {
    border-color: var(--color-slate-900);
    background-color: var(--color-slate-900);
    color: var(--color-white);
  }
  .link {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
    color: var(--color-blue-600);
    &:hover {
      @media (hover: hover) {
        text-decoration-line: underline;
      }
    }
  }
  .kv {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: calc(var(--spacing) * 4);
    border-radius: var(--radius-xl);
    background-color: var(--color-slate-50);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 3);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
}
@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-gradient-position {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-from {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --tw-gradient-via {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --tw-gradient-to {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --tw-gradient-stops {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-via-stops {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-from-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 0%;
}
@property --tw-gradient-via-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 50%;
}
@property --tw-gradient-to-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}
@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-divide-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-space-y-reverse: 0;
      --tw-border-style: solid;
      --tw-gradient-position: initial;
      --tw-gradient-from: #0000;
      --tw-gradient-via: #0000;
      --tw-gradient-to: #0000;
      --tw-gradient-stops: initial;
      --tw-gradient-via-stops: initial;
      --tw-gradient-from-position: 0%;
      --tw-gradient-via-position: 50%;
      --tw-gradient-to-position: 100%;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-backdrop-blur: initial;
      --tw-backdrop-brightness: initial;
      --tw-backdrop-contrast: initial;
      --tw-backdrop-grayscale: initial;
      --tw-backdrop-hue-rotate: initial;
      --tw-backdrop-invert: initial;
      --tw-backdrop-opacity: initial;
      --tw-backdrop-saturate: initial;
      --tw-backdrop-sepia: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-divide-y-reverse: 0;
    }
  }
}

/* SINAGA Sidebar refinement - 2026-09-24 */
.sidebar-shell{position:fixed;inset-block:0;left:0;z-index:40;display:flex;width:18rem;transform:translateX(-100%);flex-direction:column;border-right:1px solid rgba(30,41,59,.8);background:#020617;box-shadow:0 20px 25px -5px rgba(0,0,0,.22),0 8px 10px -6px rgba(0,0,0,.22);transition:transform .2s ease-out}
.sidebar-brand{display:flex;height:5rem;flex:none;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(30,41,59,.8);padding:0 1.25rem}
.sidebar-brand-main{display:flex;min-width:0;align-items:center;gap:.75rem}
.sidebar-logo{height:2.75rem;width:2.75rem;flex:none;border-radius:.75rem;background:#fff;padding:.375rem;object-fit:contain;box-shadow:0 1px 2px rgba(0,0,0,.12)}
.sidebar-logo-fallback{display:grid;height:2.75rem;width:2.75rem;flex:none;place-items:center;border-radius:.75rem;background:#fbbf24;color:#020617;font-size:1.125rem;font-weight:900;box-shadow:0 1px 2px rgba(0,0,0,.12)}
.sidebar-brand-text{min-width:0}
.sidebar-brand-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#fff;font-size:1rem;font-weight:800;letter-spacing:.025em}
.sidebar-brand-subtitle{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#94a3b8;font-size:.72rem;font-weight:500}
.sidebar-close{display:grid;height:2.25rem;width:2.25rem;place-items:center;border:1px solid #334155;border-radius:.75rem;background:#0f172a;color:#cbd5e1;font-size:1.25rem;line-height:1;transition:.15s}
.sidebar-close:hover{border-color:#475569;background:#1e293b;color:#fff}
.sidebar-context{margin:.75rem .75rem 0;border:1px solid #1e293b;border-radius:.75rem;background:rgba(15,23,42,.72);padding:.75rem .875rem}
.sidebar-context-label{color:#64748b;font-size:.625rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.sidebar-context-name{display:-webkit-box;margin-top:.25rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;color:#cbd5e1;font-size:.75rem;font-weight:600;line-height:1.25rem}
.sidebar-nav{min-height:0;flex:1;overflow-y:auto;padding:.75rem .75rem 1.25rem;scrollbar-width:thin;scrollbar-color:#334155 transparent}
.sidebar-nav::-webkit-scrollbar{width:6px}.sidebar-nav::-webkit-scrollbar-track{background:transparent}.sidebar-nav::-webkit-scrollbar-thumb{border-radius:9999px;background:#334155}
.sidebar-footer{flex:none;border-top:1px solid rgba(30,41,59,.8);background:#020617;padding:1rem 1.25rem}
.sidebar-status-row{display:flex;align-items:center;gap:.5rem}.sidebar-status-dot{height:.5rem;width:.5rem;border-radius:9999px;background:#34d399;box-shadow:0 0 0 3px rgba(52,211,153,.12)}.sidebar-status-text{color:#cbd5e1;font-size:.75rem;font-weight:600}.sidebar-version{margin-top:.25rem;color:#64748b;font-size:.625rem}
.nav-section{border-bottom:1px solid rgba(30,41,59,.7);padding:.75rem 0}.nav-section:last-child{border-bottom:0}.nav-section-title{margin-bottom:.5rem;padding:0 .75rem;color:#94a3b8;font-size:.625rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.nav-link{position:relative;margin-bottom:.25rem;display:flex;min-height:2.75rem;align-items:center;gap:.75rem;border-radius:.75rem;padding:.625rem .75rem;color:#cbd5e1;font-size:.875rem;font-weight:600;outline:0;transition:background-color .15s,color .15s,box-shadow .15s}
.nav-link:hover{background:rgba(30,41,59,.82);color:#fff}.nav-link:focus-visible{box-shadow:0 0 0 2px rgba(251,191,36,.7)}
.nav-link.active{background:#1e293b;color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05),0 1px 2px rgba(0,0,0,.15)}
.nav-link.active:before{content:"";position:absolute;top:.625rem;bottom:.625rem;left:0;width:3px;border-radius:0 9999px 9999px 0;background:#fbbf24}
.nav-icon{display:grid;height:2rem;width:2rem;flex:none;place-items:center;border-radius:.5rem;background:#0f172a;color:#94a3b8;transition:background-color .15s,color .15s}.nav-icon svg{height:1.125rem;width:1.125rem}.nav-link:hover .nav-icon{background:#334155;color:#f8fafc}.nav-link.active .nav-icon{background:rgba(251,191,36,.15);color:#fcd34d}
.nav-label{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nav-active-dot{height:.375rem;width:.375rem;flex:none;border-radius:9999px;background:#fcd34d}
@media(min-width:1024px){.sidebar-shell{position:sticky;top:0;height:100vh;transform:translateX(0);box-shadow:none}.sidebar-close{display:none}}

/* SINAGA Sidebar refinement V3 - fixed desktop layout + compact navigation */
.sinaga-shell{
  min-height:100vh;
  min-height:100dvh;
}
.sidebar-shell{
  position:fixed !important;
  top:0 !important;
  bottom:0 !important;
  left:0 !important;
  height:100vh !important;
  height:100dvh !important;
  min-height:100vh;
  overflow:hidden;
  transform:translateX(-100%);
}
.content-shell{
  min-width:0;
  width:100%;
  min-height:100vh;
  min-height:100dvh;
}
.sidebar-brand{height:4.5rem;padding-inline:1rem}
.sidebar-logo,.sidebar-logo-fallback{height:2.5rem;width:2.5rem;border-radius:.7rem}
.sidebar-brand-title{font-size:.95rem}
.sidebar-brand-subtitle{font-size:.675rem}
.sidebar-context{margin:.6rem .65rem 0;padding:.625rem .75rem}
.sidebar-context-label{font-size:.575rem}
.sidebar-context-name{font-size:.7rem;line-height:1.05rem}
.sidebar-nav{overscroll-behavior:contain;padding:.55rem .65rem .75rem;scrollbar-gutter:stable}
.nav-section{padding:.55rem 0}
.nav-section-title{margin-bottom:.375rem;padding:0 .625rem;font-size:.575rem;letter-spacing:.14em}
.nav-link{min-height:2.45rem;gap:.625rem;margin-bottom:.15rem;border-radius:.65rem;padding:.5rem .625rem;font-size:.79rem}
.nav-link.active:before{top:.5rem;bottom:.5rem}
.nav-icon{height:1.75rem;width:1.75rem;border-radius:.45rem}
.nav-icon svg{height:1rem;width:1rem}
.sidebar-footer{padding:.7rem 1rem;background:#020617}
.sidebar-status-text{font-size:.7rem}
.sidebar-version{font-size:.575rem}
.sidebar-shell.sidebar-open{transform:translateX(0) !important}
@media (min-width:1024px){
  .sidebar-shell{
    transform:translateX(0) !important;
    box-shadow:none;
  }
  .content-shell{
    margin-left:18rem;
    width:calc(100% - 18rem);
  }
}
@media (max-width:1023.98px){
  .content-shell{
    margin-left:0;
    width:100%;
  }
}

/* SINAGA UI shell refinement V4 - final sidebar + topbar polish */
:root{
  --sinaga-sidebar-width:16.75rem;
  --sinaga-gold:#fbbf24;
  --sinaga-navy:#020617;
  --sinaga-navy-soft:#0f172a;
  --sinaga-line:rgba(51,65,85,.48);
}
.sidebar-shell{width:var(--sinaga-sidebar-width) !important;border-right-color:rgba(30,41,59,.72)}
.sidebar-brand{height:4.15rem;padding-inline:.875rem;border-bottom-color:rgba(51,65,85,.45)}
.sidebar-brand-main{gap:.65rem}
.sidebar-logo,.sidebar-logo-fallback{height:2.25rem;width:2.25rem;border-radius:.625rem}
.sidebar-brand-title{font-size:.875rem;letter-spacing:.035em}
.sidebar-brand-subtitle{font-size:.625rem;color:#8fa0b8}
.sidebar-context{margin:.5rem .575rem 0;border-color:rgba(51,65,85,.55);border-radius:.625rem;padding:.5rem .625rem;background:rgba(15,23,42,.58)}
.sidebar-context-label{font-size:.54rem;color:#7f91aa;letter-spacing:.14em}
.sidebar-context-name{margin-top:.18rem;font-size:.65rem;line-height:1rem;color:#cbd5e1}
.sidebar-nav{padding:.45rem .55rem .6rem;scrollbar-width:thin;scrollbar-color:transparent transparent}
.sidebar-nav:hover{scrollbar-color:#334155 transparent}
.sidebar-nav::-webkit-scrollbar{width:4px}
.sidebar-nav::-webkit-scrollbar-thumb{background:transparent}
.sidebar-nav:hover::-webkit-scrollbar-thumb{background:#334155}
.sidebar-nav::-webkit-scrollbar-thumb:hover{background:#475569}
.nav-section{padding:.48rem 0;border-bottom-color:rgba(51,65,85,.34)}
.nav-section-title{margin-bottom:.28rem;padding:0 .55rem;color:#8798af;font-size:.54rem;letter-spacing:.145em}
.nav-link{min-height:2.35rem;gap:.55rem;margin-bottom:.08rem;border-radius:.6rem;padding:.43rem .55rem;color:#c6d0dd;font-size:.755rem;font-weight:600}
.nav-link:hover{background:rgba(30,41,59,.68)}
.nav-link.active{background:#1b283c;box-shadow:inset 0 0 0 1px rgba(148,163,184,.08),0 1px 2px rgba(0,0,0,.12)}
.nav-link.active:before{top:.45rem;bottom:.45rem;width:2px;background:var(--sinaga-gold)}
.nav-icon{height:1.65rem;width:1.65rem;border-radius:.45rem;background:rgba(15,23,42,.92);color:#8698b2}
.nav-icon svg{height:.94rem;width:.94rem}
.nav-link.active .nav-icon{background:rgba(251,191,36,.13);color:#fcd34d}
.nav-active-dot{height:.3rem;width:.3rem}
.sidebar-footer{padding:.58rem .875rem;border-top-color:rgba(51,65,85,.42)}
.sidebar-status-row{gap:.42rem}
.sidebar-status-dot{height:.4rem;width:.4rem}
.sidebar-status-text{font-size:.64rem}
.sidebar-version{margin-top:.15rem;font-size:.525rem;color:#63748b}

.topbar-shell{position:sticky;top:0;z-index:20;display:flex;height:4.5rem;align-items:center;justify-content:space-between;gap:1rem;border-bottom:1px solid #e2e8f0;background:rgba(255,255,255,.96);padding:0 1rem;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 1px 2px rgba(15,23,42,.025)}
.topbar-left{display:flex;min-width:0;align-items:center;gap:.75rem}
.topbar-heading{min-width:0}
.topbar-kicker{max-width:36rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#94a3b8;font-size:.64rem;font-weight:650;letter-spacing:.055em;text-transform:uppercase}
.topbar-title{margin-top:.08rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#0f172a;font-size:1rem;font-weight:800;line-height:1.25rem}
.topbar-menu-button{display:grid;height:2.25rem;width:2.25rem;flex:none;place-items:center;border:1px solid #e2e8f0;border-radius:.65rem;background:#fff;color:#334155;font-size:1rem;box-shadow:0 1px 2px rgba(15,23,42,.04)}
.topbar-actions{display:flex;flex:none;align-items:center;gap:.45rem}
.topbar-profile{display:none;align-items:center;gap:.55rem;border-radius:.75rem;padding:.3rem .45rem .3rem .35rem;transition:background-color .15s}
.topbar-profile:hover{background:#f8fafc}
.topbar-avatar{display:grid;height:2rem;width:2rem;flex:none;place-items:center;border-radius:.625rem;background:#0f172a;color:#fbbf24;font-size:.68rem;font-weight:800;letter-spacing:.025em}
.topbar-user-copy{display:block;min-width:0;max-width:19rem;text-align:right}
.topbar-user-name{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#334155;font-size:.72rem;font-weight:700;line-height:1rem}
.topbar-user-role{display:block;margin-top:.06rem;color:#94a3b8;font-size:.6rem;line-height:.85rem}
.topbar-account-button,.topbar-logout-button{display:inline-flex;min-height:2.05rem;align-items:center;justify-content:center;border-radius:.625rem;padding:.4rem .7rem;font-size:.68rem;font-weight:700;transition:background-color .15s,border-color .15s,color .15s,box-shadow .15s}
.topbar-account-button{border:1px solid #dbe3ec;background:#fff;color:#475569}
.topbar-account-button:hover{border-color:#cbd5e1;background:#f8fafc;color:#0f172a}
.topbar-logout-form{display:flex}
.topbar-logout-button{border:1px solid #fee2e2;background:#fff7f7;color:#dc2626}
.topbar-logout-button:hover{border-color:#fecaca;background:#fee2e2}
.topbar-account-button:focus-visible,.topbar-logout-button:focus-visible,.topbar-profile:focus-visible,.topbar-menu-button:focus-visible{outline:2px solid rgba(251,191,36,.7);outline-offset:2px}

@media(min-width:640px){
  .topbar-shell{padding-inline:1.25rem}
  .topbar-profile{display:flex}
}
@media(min-width:1024px){
  .content-shell{margin-left:var(--sinaga-sidebar-width);width:calc(100% - var(--sinaga-sidebar-width))}
  .topbar-shell{padding-inline:1.5rem}
}
@media(max-width:639.98px){
  .topbar-account-button{display:none}
  .topbar-actions{gap:.35rem}
  .topbar-kicker{max-width:12rem}
}

/* SINAGA module polish - 2026-09-24 */
.page-context{margin-top:.35rem;font-size:.8rem;color:#64748b}.page-context strong{color:#334155}.pagination-shell{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap;margin-top:1rem;padding:.15rem .1rem}.pagination-summary{font-size:.78rem;color:#64748b}.pagination-pages{display:flex;align-items:center;gap:.25rem}.entity-summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-bottom:1rem}.entity-summary-card{border:1px solid #e2e8f0;border-radius:1rem;background:#fff;padding:1rem 1.1rem;box-shadow:0 1px 3px rgb(15 23 42 / .06)}.entity-summary-label{font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#64748b}.entity-summary-value{margin-top:.5rem}.entity-summary-number{margin-top:.35rem;font-size:1.6rem;line-height:1.1;font-weight:800;color:#0f172a}.entity-detail-card{max-width:64rem}.entity-detail-head{padding-bottom:1rem;margin-bottom:1rem;border-bottom:1px solid #e2e8f0}.entity-detail-title{font-size:1.2rem;font-weight:800;color:#0f172a}.entity-detail-subtitle{margin-top:.2rem;font-size:.8rem;color:#64748b}.entity-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border:1px solid #e2e8f0;border-radius:.9rem;overflow:hidden}.entity-detail-item{padding:.9rem 1rem;border-bottom:1px solid #e2e8f0;background:#fff}.entity-detail-item:nth-child(odd){border-right:1px solid #e2e8f0}.entity-detail-item-wide{grid-column:1/-1;border-right:0!important}.entity-detail-label{font-size:.7rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#94a3b8}.entity-detail-value{margin-top:.3rem;font-size:.88rem;line-height:1.5;color:#334155;word-break:break-word}.entity-detail-link{color:#2563eb;text-decoration:none}.entity-detail-link:hover{text-decoration:underline}
@media(max-width:767px){.entity-summary-grid{grid-template-columns:1fr}.entity-detail-grid{grid-template-columns:1fr}.entity-detail-item,.entity-detail-item:nth-child(odd){border-right:0}.entity-detail-item-wide{grid-column:auto}.pagination-shell{align-items:flex-start;flex-direction:column}.filter-bar .form-select{width:100%;min-width:0}.filter-bar .form-input{min-width:0;width:100%}}

/* SINAGA Kelembagaan V8 */
.topbar-search{display:none;min-width:18rem;max-width:34rem;flex:1;margin:0 1rem}.topbar-search form{position:relative}.topbar-search input{width:100%;height:2.35rem;border:1px solid #e2e8f0;border-radius:.7rem;background:#f8fafc;padding:0 .9rem 0 2.35rem;font-size:.78rem;color:#334155;outline:none}.topbar-search input:focus{border-color:#fbbf24;background:#fff;box-shadow:0 0 0 3px rgba(251,191,36,.12)}.topbar-search-icon{position:absolute;left:.75rem;top:50%;width:1rem;height:1rem;transform:translateY(-50%);color:#94a3b8}.topbar-search-icon svg{width:1rem;height:1rem}
@media(min-width:1180px){.topbar-search{display:block}}
.kpi-card{border:1px solid #e2e8f0;border-radius:1rem;background:#fff;padding:1rem 1.1rem;box-shadow:0 1px 3px rgb(15 23 42/.06)}.kpi-card>span{display:block;font-size:.72rem;font-weight:700;letter-spacing:.035em;text-transform:uppercase;color:#64748b}.kpi-card>strong{display:block;margin-top:.35rem;font-size:1.65rem;line-height:1.1;font-weight:850;color:#0f172a}.kpi-card>small{display:block;margin-top:.35rem;font-size:.7rem;color:#94a3b8}.dashboard-grid{display:grid;gap:1.25rem}@media(min-width:1100px){.dashboard-grid{grid-template-columns:minmax(0,1.25fr) minmax(340px,.75fr)}}
.section-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.1rem;border-bottom:1px solid #e2e8f0}.section-bar.no-pad{padding:0 0 .8rem}.section-bar h3,.section-title{font-size:.95rem;font-weight:800;color:#0f172a}.section-bar p{margin-top:.15rem;font-size:.72rem;color:#94a3b8}.text-link{color:#2563eb;font-size:.78rem;font-weight:700;text-decoration:none}.text-link:hover{text-decoration:underline}
.progress-row{display:block;color:inherit;text-decoration:none}.progress-row-head{display:flex;justify-content:space-between;gap:1rem;margin-bottom:.35rem;font-size:.76rem}.progress-row-head strong{color:#334155}.progress-row-head span{color:#64748b}.progress-track{height:.48rem;border-radius:999px;background:#e2e8f0;overflow:hidden}.progress-fill{display:block;height:100%;border-radius:999px;background:#2563eb;transition:width .2s}.progress-fill.tone-green{background:#16a34a}.progress-fill.tone-yellow{background:#d97706}.progress-fill.tone-red{background:#dc2626}.progress-fill.tone-gray{background:#94a3b8}
.attention-list{display:flex;flex-direction:column;gap:.65rem}.attention-item{display:flex;align-items:center;justify-content:space-between;gap:.8rem;border:1px solid #e2e8f0;border-left-width:4px;border-radius:.75rem;background:#fff;padding:.7rem .8rem;color:#334155;text-decoration:none}.attention-item>div{display:flex;min-width:0;flex-direction:column}.attention-item strong{font-size:.78rem}.attention-item span{font-size:.7rem;color:#64748b}.attention-red{border-left-color:#ef4444;background:#fffafa}.attention-yellow{border-left-color:#f59e0b;background:#fffdf5}.attention-gray{border-left-color:#94a3b8;background:#f8fafc}.empty-box{border:1px dashed #cbd5e1;border-radius:.75rem;background:#f8fafc;padding:1rem;text-align:center;font-size:.78rem;color:#64748b}
.badge-gray{background:#f1f5f9;color:#475569}.badge-red{background:#fff1f2;color:#be123c}.badge-yellow{background:#fffbeb;color:#b45309}.badge-green{background:#ecfdf5;color:#047857}.badge-blue{background:#eff6ff;color:#1d4ed8}.badge-neutral{background:#f1f5f9;color:#475569}
.table-sub{display:block;margin-top:.15rem;font-size:.65rem;color:#94a3b8}.action-row{display:flex;align-items:center;justify-content:flex-end;gap:.35rem;flex-wrap:wrap}.btn-ghost{display:inline-flex;align-items:center;justify-content:center;padding:.55rem .65rem;color:#64748b;font-size:.76rem;font-weight:700;text-decoration:none}.btn-danger-soft{display:inline-flex;align-items:center;justify-content:center;border:1px solid #fecdd3;border-radius:.6rem;background:#fff1f2;padding:.5rem .75rem;color:#be123c;font-size:.75rem;font-weight:700}.btn-small.danger{color:#be123c}.filter-year{max-width:7rem}
.document-detail-grid{display:grid;gap:1.25rem}.document-preview{min-height:34rem;overflow:hidden}.document-preview iframe{display:block;width:100%;height:68vh;min-height:34rem;border:0;background:#f8fafc}.preview-empty{margin:2rem}.meta-list{margin-top:1rem}.meta-list>div{display:grid;grid-template-columns:9rem 1fr;gap:1rem;border-top:1px solid #eef2f7;padding:.65rem 0}.meta-list dt{font-size:.68rem;font-weight:700;text-transform:uppercase;color:#94a3b8}.meta-list dd{font-size:.78rem;color:#334155;word-break:break-word}@media(min-width:1100px){.document-detail-grid{grid-template-columns:minmax(0,1.5fr) minmax(330px,.7fr)}}
.timeline{display:flex;flex-direction:column;gap:.65rem}.timeline-item,.related-item{display:flex;align-items:center;justify-content:space-between;gap:1rem;border:1px solid #e2e8f0;border-radius:.75rem;padding:.75rem}.timeline-item>div:first-child,.related-item>div:first-child{display:flex;flex-direction:column}.timeline-item strong,.related-item strong{font-size:.78rem}.timeline-item span,.related-item span,.timeline-item small{font-size:.68rem;color:#64748b}.subform{border-top:1px solid #e2e8f0;padding-top:1rem}.note-item{border:1px solid #e2e8f0;border-radius:.75rem;padding:.8rem}.note-item p{margin-top:.5rem;font-size:.78rem;color:#475569}.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid #e2e8f0;border-radius:.75rem;overflow:hidden}.detail-cell{padding:.8rem;border-bottom:1px solid #e2e8f0}.detail-cell:nth-child(odd){border-right:1px solid #e2e8f0}.detail-cell span{display:block;font-size:.65rem;text-transform:uppercase;font-weight:700;color:#94a3b8}.detail-cell strong{display:block;margin-top:.25rem;font-size:.8rem;color:#334155}.detail-cell small{display:block;margin-top:.15rem;font-size:.68rem;color:#64748b}
.tabs{display:flex;gap:.25rem;overflow-x:auto;border-bottom:1px solid #dbe3ec}.tab-link{white-space:nowrap;border-bottom:2px solid transparent;padding:.65rem .8rem;color:#64748b;font-size:.74rem;font-weight:700;text-decoration:none}.tab-link:hover{color:#0f172a}.tab-link.active{border-bottom-color:#fbbf24;color:#0f172a}.org-chart{display:grid;gap:1rem}.org-head{border-bottom:1px solid #e2e8f0;padding-bottom:.75rem;margin-bottom:1rem}.org-head h3{font-size:1rem;font-weight:800}.org-position-grid{display:grid;gap:.75rem}@media(min-width:900px){.org-position-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.org-position{border:1px solid #e2e8f0;border-radius:.8rem;padding:.8rem}.org-position>strong{font-size:.8rem;color:#334155}.official-chip{display:grid;grid-template-columns:1fr auto;gap:.15rem .5rem;border-top:1px solid #eef2f7;padding:.55rem 0;text-decoration:none;color:#334155}.official-chip span{font-size:.76rem;font-weight:700}.official-chip small{grid-column:1;font-size:.66rem;color:#64748b}.official-chip em{grid-row:1/3;grid-column:2;align-self:center;font-style:normal}
@media print{.sidebar-shell,.topbar-shell,.print-hide,.page-head .actions,footer{display:none!important}.content-shell{margin:0!important;width:100%!important}.report-area{box-shadow:none;border:0}.report-area .table{font-size:9pt}body{background:#fff}.p-4,.lg\:p-8{padding:0!important}}