@layer properties;
:root, :host {
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  --color-red-50: #fef2f2;
  --color-red-200: #fecaca;
  --color-red-400: #f87171;
  --color-red-500: #ef4444;
  --color-red-600: #dc2626;
  --color-red-900: #7f1d1d;
  --color-amber-300: #fcd34d;
  --color-amber-500: #f59e0b;
  --color-green-500: #22c55e;
  --color-emerald-50: #ecfdf5;
  --color-emerald-200: #a7f3d0;
  --color-emerald-400: #34d399;
  --color-emerald-500: #10b981;
  --color-emerald-600: #059669;
  --color-emerald-900: #064e3b;
  --color-blue-400: #60a5fa;
  --color-blue-500: #3b82f6;
  --color-blue-600: #2563eb;
  --color-indigo-500: #6366f1;
  --color-purple-500: #a855f7;
  --color-slate-50: #f8fafc;
  --color-slate-100: #f1f5f9;
  --color-slate-200: #e2e8f0;
  --color-slate-300: #cbd5e1;
  --color-slate-400: #94a3b8;
  --color-slate-500: #64748b;
  --color-slate-600: #475569;
  --color-slate-700: #334155;
  --color-slate-800: #1e293b;
  --color-slate-900: #0f172a;
  --color-slate-950: #020617;
  --color-white: #fff;
  --spacing: 0.25rem;
  --container-md: 28rem;
  --container-xl: 36rem;
  --container-2xl: 42rem;
  --container-5xl: 64rem;
  --container-7xl: 80rem;
  --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-base: 1rem;
  --text-base--line-height: calc(1.5 / 1);
  --text-lg: 1.125rem;
  --text-lg--line-height: calc(1.75 / 1.125);
  --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-4xl: 2.25rem;
  --text-4xl--line-height: calc(2.5 / 2.25);
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-black: 900;
  --tracking-tight: -0.025em;
  --tracking-wider: 0.05em;
  --leading-tight: 1.25;
  --radius-md: 0.375rem;
  --radius-lg: 0.5rem;
  --radius-xl: 0.75rem;
  --blur-sm: 8px;
  --blur-xl: 24px;
  --blur-2xl: 40px;
  --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);
  --color-ink: #0f172a;
  --color-diber-50: #EFF6FF;
  --color-diber-500: #1e40af;
  --color-diber-900: #1e3a8a;
}
.v002 {
  position: absolute;
}
.v077 {
  position: fixed;
}
.v201 {
  position: relative;
}
.v125 {
  inset: calc(var(--spacing) * 0);
}
.v126 {
  inset-inline: calc(var(--spacing) * 0);
}
.v127 {
  inset-block: calc(var(--spacing) * 0);
}
.v261 {
  top: calc(var(--spacing) * 0);
}
.v132 {
  left: calc(var(--spacing) * 0);
}
.v280 {
  z-index: 40;
}
.v281 {
  z-index: 50;
}
.v170 {
  margin-inline: auto;
}
.v163 {
  margin-top: calc(var(--spacing) * 1);
}
.v164 {
  margin-top: calc(var(--spacing) * 1.5);
}
.v165 {
  margin-top: calc(var(--spacing) * 2);
}
.v166 {
  margin-top: calc(var(--spacing) * 3);
}
.v167 {
  margin-top: calc(var(--spacing) * 4);
}
.v168 {
  margin-top: calc(var(--spacing) * 5);
}
.v169 {
  margin-top: calc(var(--spacing) * 6);
}
.v149 {
  margin-bottom: calc(var(--spacing) * 1);
}
.v150 {
  margin-bottom: calc(var(--spacing) * 1.5);
}
.v152 {
  margin-bottom: calc(var(--spacing) * 2);
}
.v153 {
  margin-bottom: calc(var(--spacing) * 3);
}
.v154 {
  margin-bottom: calc(var(--spacing) * 4);
}
.v155 {
  margin-bottom: calc(var(--spacing) * 6);
}
.v156 {
  margin-bottom: calc(var(--spacing) * 8);
}
.v151 {
  margin-bottom: calc(var(--spacing) * 10);
}
.v162 {
  margin-left: calc(var(--spacing) * 11);
}
.v028 {
  display: block;
}
.v078 {
  display: flex;
}
.v108 {
  display: grid;
}
.v117 {
  display: none;
}
.v124 {
  display: inline-flex;
}
.v109 {
  height: calc(var(--spacing) * 1.5);
}
.v110 {
  height: calc(var(--spacing) * 3.5);
}
.v111 {
  height: calc(var(--spacing) * 4);
}
.v112 {
  height: calc(var(--spacing) * 6);
}
.v113 {
  height: calc(var(--spacing) * 7);
}
.v114 {
  height: calc(var(--spacing) * 8);
}
.v115 {
  height: calc(var(--spacing) * 9);
}
.v116 {
  height: 100%;
}
.v160 {
  min-height: 100vh;
}
.v270 {
  width: calc(var(--spacing) * 1.5);
}
.v271 {
  width: calc(var(--spacing) * 3.5);
}
.v272 {
  width: calc(var(--spacing) * 4);
}
.v273 {
  width: calc(var(--spacing) * 6);
}
.v274 {
  width: calc(var(--spacing) * 7);
}
.v276 {
  width: calc(var(--spacing) * 8);
}
.v277 {
  width: calc(var(--spacing) * 9);
}
.v275 {
  width: calc(var(--spacing) * 72);
}
.v278 {
  width: 100%;
}
.v143 {
  max-width: var(--container-2xl);
}
.v144 {
  max-width: var(--container-5xl);
}
.v145 {
  max-width: var(--container-7xl);
}
.v146 {
  max-width: 100%;
}
.v147 {
  max-width: var(--container-md);
}
.v148 {
  max-width: var(--container-xl);
}
.v161 {
  min-width: calc(var(--spacing) * 0);
}
.v079 {
  flex: 1;
}
.v081 {
  flex-shrink: 0;
}
.v210 {
  flex-shrink: 0;
}
.v001 {
  --v-translate-x: -100%;
  translate: var(--v-translate-x) var(--v-translate-y);
}
.v265 {
  transform: var(--v-rotate-x,) var(--v-rotate-y,) var(--v-rotate-z,) var(--v-skew-x,) var(--v-skew-y,);
}
.v080 {
  flex-direction: column;
}
.v082 {
  flex-wrap: wrap;
}
.v128 {
  align-items: center;
}
.v129 {
  justify-content: space-between;
}
.v130 {
  justify-content: center;
}
.v098 {
  gap: calc(var(--spacing) * 1.5);
}
.v100 {
  gap: calc(var(--spacing) * 2);
}
.v101 {
  gap: calc(var(--spacing) * 2.5);
}
.v102 {
  gap: calc(var(--spacing) * 3);
}
.v103 {
  gap: calc(var(--spacing) * 4);
}
.v104 {
  gap: calc(var(--spacing) * 6);
}
.v105 {
  gap: calc(var(--spacing) * 8);
}
.v099 {
  gap: calc(var(--spacing) * 10);
}







.v106 {
  column-gap: calc(var(--spacing) * 4);
}
.v107 {
  row-gap: calc(var(--spacing) * 2);
}
.v268 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.v171 {
  overflow: hidden;
}
.v172 {
  overflow-x: auto;
}
.v173 {
  overflow-y: auto;
}
.v207 {
  scroll-behavior: smooth;
}
.v202 {
  border-radius: 0.25rem;
}
.v203 {
  border-radius: calc(infinity * 1px);
}
.v204 {
  border-radius: var(--radius-lg);
}
.v205 {
  border-radius: var(--radius-md);
}
.v206 {
  border-radius: var(--radius-xl);
}
.v030 {
  border-style: var(--v-border-style);
  border-width: 1px;
}
.v041 {
  border-top-style: var(--v-border-style);
  border-top-width: 1px;
}
.v035 {
  border-right-style: var(--v-border-style);
  border-right-width: 1px;
}
.v031 {
  border-bottom-style: var(--v-border-style);
  border-bottom-width: 1px;
}
.v033 {
  border-color: var(--color-diber-50);
}
.v034 {
  border-color: var(--color-emerald-200);
}
.v036 {
  border-color: var(--color-red-200);
}
.v037 {
  border-color: var(--color-slate-200);
}
.v038 {
  border-color: var(--color-slate-300);
}
.v039 {
  border-color: var(--color-slate-400);
}
.v040 {
  border-color: var(--color-slate-700);
}
.v007 {
  background-color: var(--color-amber-500);
}
.v008 {
  background-color: var(--color-blue-500);
}
.v009 {
  background-color: var(--color-diber-50);
}
.v010 {
  background-color: var(--color-diber-500);
}
.v011 {
  background-color: var(--color-emerald-50);
}
.v012 {
  background-color: var(--color-emerald-500);
}
.v016 {
  background-color: var(--color-green-500);
}
.v017 {
  background-color: var(--color-indigo-500);
}
.v018 {
  background-color: var(--color-purple-500);
}
.v019 {
  background-color: var(--color-red-50);
}
.v020 {
  background-color: var(--color-red-500);
}
.v023 {
  background-color: var(--color-slate-50);
}
.v024 {
  background-color: color-mix(in srgb, #f8fafc 90%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-slate-50) 90%, transparent);
  }
}
.v021 {
  background-color: var(--color-slate-100);
}
.v022 {
  background-color: var(--color-slate-200);
}
.v025 {
  background-color: color-mix(in srgb, #0f172a 40%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-slate-900) 40%, transparent);
  }
}
.v026 {
  background-color: var(--color-slate-950);
}
.v027 {
  background-color: var(--color-white);
}
.v013 {
  --v-gradient-position: to bottom in oklab;
  background-image: linear-gradient(var(--v-gradient-stops));
}
.v014 {
  --v-gradient-position: to bottom right in oklab;
  background-image: linear-gradient(var(--v-gradient-stops));
}
.v015 {
  --v-gradient-position: to right in oklab;
  background-image: linear-gradient(var(--v-gradient-stops));
}
.v088 {
  --v-gradient-from: var(--color-blue-500);
  --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
}
.v089 {
  --v-gradient-from: var(--color-diber-50);
  --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
}
.v090 {
  --v-gradient-from: var(--color-diber-500);
  --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
}
.v091 {
  --v-gradient-from: color-mix(in srgb, #1e40af 15%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    --v-gradient-from: color-mix(in oklab, var(--color-diber-500) 15%, transparent);
  }
  --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
}
.v092 {
  --v-gradient-from: var(--color-diber-900);
  --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
}
.v093 {
  --v-gradient-from: var(--color-emerald-50);
  --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
}
.v094 {
  --v-gradient-from: var(--color-emerald-500);
  --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
}
.v095 {
  --v-gradient-from: var(--color-red-500);
  --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
}
.v096 {
  --v-gradient-from: var(--color-slate-50);
  --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
}
.v097 {
  --v-gradient-from: var(--color-slate-800);
  --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
}
.v253 {
  --v-gradient-to: var(--color-blue-600);
  --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
}
.v255 {
  --v-gradient-to: color-mix(in srgb, #10b981 15%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    --v-gradient-to: color-mix(in oklab, var(--color-emerald-500) 15%, transparent);
  }
  --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
}
.v256 {
  --v-gradient-to: var(--color-emerald-600);
  --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
}
.v257 {
  --v-gradient-to: var(--color-red-600);
  --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
}
.v259 {
  --v-gradient-to: var(--color-slate-50);
  --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
}
.v258 {
  --v-gradient-to: var(--color-slate-100);
  --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
}
.v260 {
  --v-gradient-to: var(--color-slate-900);
  --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
}
.v174 {
  padding: calc(var(--spacing) * 3);
}
.v175 {
  padding: calc(var(--spacing) * 3.5);
}
.v176 {
  padding: calc(var(--spacing) * 4);
}
.v177 {
  padding: calc(var(--spacing) * 5);
}
.v178 {
  padding: calc(var(--spacing) * 6);
}
.v179 {
  padding: calc(var(--spacing) * 8);
}
.v185 {
  padding-inline: calc(var(--spacing) * 1);
}
.v186 {
  padding-inline: calc(var(--spacing) * 1.5);
}
.v187 {
  padding-inline: calc(var(--spacing) * 2);
}
.v188 {
  padding-inline: calc(var(--spacing) * 2.5);
}
.v189 {
  padding-inline: calc(var(--spacing) * 3);
}
.v190 {
  padding-inline: calc(var(--spacing) * 4);
}
.v191 {
  padding-inline: calc(var(--spacing) * 5);
}
.v192 {
  padding-block: calc(var(--spacing) * 0.5);
}
.v193 {
  padding-block: calc(var(--spacing) * 1.5);
}
.v196 {
  padding-block: calc(var(--spacing) * 2);
}
.v197 {
  padding-block: calc(var(--spacing) * 2.5);
}
.v198 {
  padding-block: calc(var(--spacing) * 3);
}
.v199 {
  padding-block: calc(var(--spacing) * 4);
}
.v200 {
  padding-block: calc(var(--spacing) * 5);
}
.v194 {
  padding-block: calc(var(--spacing) * 10);
}
.v195 {
  padding-block: calc(var(--spacing) * 14);
}
.v183 {
  padding-top: calc(var(--spacing) * 4);
}
.v184 {
  padding-top: calc(var(--spacing) * 6);
}
.v181 {
  padding-top: calc(var(--spacing) * 10);
}
.v182 {
  padding-top: calc(var(--spacing) * 16);
}
.v180 {
  padding-bottom: calc(var(--spacing) * 16);
}
.v236 {
  text-align: center;
}
.v086 {
  font-family: var(--font-mono);
}
.v227 {
  font-size: var(--text-2xl);
  line-height: var(--v-leading, var(--text-2xl--line-height));
}
.v228 {
  font-size: var(--text-3xl);
  line-height: var(--v-leading, var(--text-3xl--line-height));
}
.v233 {
  font-size: var(--text-base);
  line-height: var(--v-leading, var(--text-base--line-height));
}
.v242 {
  font-size: var(--text-lg);
  line-height: var(--v-leading, var(--text-lg--line-height));
}
.v250 {
  font-size: var(--text-sm);
  line-height: var(--v-leading, var(--text-sm--line-height));
}
.v252 {
  font-size: var(--text-xs);
  line-height: var(--v-leading, var(--text-xs--line-height));
}
.v229 {
  font-size: 10px;
}
.v230 {
  font-size: 11px;
}
.v231 {
  font-size: 13px;
}
.v131 {
  --v-leading: var(--leading-tight);
  line-height: var(--leading-tight);
}
.v083 {
  --v-font-weight: var(--font-weight-black);
  font-weight: var(--font-weight-black);
}
.v084 {
  --v-font-weight: var(--font-weight-bold);
  font-weight: var(--font-weight-bold);
}
.v085 {
  --v-font-weight: var(--font-weight-medium);
  font-weight: var(--font-weight-medium);
}
.v087 {
  --v-font-weight: var(--font-weight-semibold);
  font-weight: var(--font-weight-semibold);
}
.v262 {
  --v-tracking: -0.04em;
  letter-spacing: -0.04em;
}
.v263 {
  --v-tracking: var(--tracking-tight);
  letter-spacing: var(--tracking-tight);
}
.v264 {
  --v-tracking: var(--tracking-wider);
  letter-spacing: var(--tracking-wider);
}
.v279 {
  white-space: pre;
}
.v232 {
  color: var(--color-amber-300);
}
.v234 {
  color: var(--color-blue-400);
}
.v235 {
  color: var(--color-blue-500);
}
.v237 {
  color: var(--color-diber-500);
}
.v238 {
  color: var(--color-emerald-400);
}
.v239 {
  color: var(--color-emerald-500);
}
.v240 {
  color: var(--color-emerald-600);
}
.v241 {
  color: var(--color-ink);
}
.v243 {
  color: var(--color-red-500);
}
.v244 {
  color: var(--color-red-600);
}
.v245 {
  color: var(--color-slate-300);
}
.v246 {
  color: var(--color-slate-400);
}
.v247 {
  color: var(--color-slate-500);
}
.v248 {
  color: var(--color-slate-600);
}
.v249 {
  color: var(--color-slate-700);
}
.v251 {
  color: var(--color-white);
}
.v269 {
  text-transform: uppercase;
}
.v004 {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.v208 {
  --v-shadow: 0 1px 2px 0 var(--v-shadow-color, rgb(0 0 0 / 0.05));
  box-shadow: var(--v-inset-shadow), var(--v-inset-ring-shadow), var(--v-ring-offset-shadow), var(--v-ring-shadow), var(--v-shadow);
}
.v209 {
  --v-shadow: 0 1px 3px var(--v-shadow-color, rgba(15, 23, 42, 0.08));
  box-shadow: var(--v-inset-shadow), var(--v-inset-ring-shadow), var(--v-ring-offset-shadow), var(--v-ring-shadow), var(--v-shadow);
}
.v029 {
  --v-blur: blur(var(--blur-2xl));
  filter: var(--v-blur,) var(--v-brightness,) var(--v-contrast,) var(--v-grayscale,) var(--v-hue-rotate,) var(--v-invert,) var(--v-saturate,) var(--v-sepia,) var(--v-drop-shadow,);
}
.v005 {
  --v-backdrop-blur: blur(var(--blur-sm));
  -webkit-backdrop-filter: var(--v-backdrop-blur,) var(--v-backdrop-brightness,) var(--v-backdrop-contrast,) var(--v-backdrop-grayscale,) var(--v-backdrop-hue-rotate,) var(--v-backdrop-invert,) var(--v-backdrop-opacity,) var(--v-backdrop-saturate,) var(--v-backdrop-sepia,);
  backdrop-filter: var(--v-backdrop-blur,) var(--v-backdrop-brightness,) var(--v-backdrop-contrast,) var(--v-backdrop-grayscale,) var(--v-backdrop-hue-rotate,) var(--v-backdrop-invert,) var(--v-backdrop-opacity,) var(--v-backdrop-saturate,) var(--v-backdrop-sepia,);
}
.v006 {
  --v-backdrop-blur: blur(var(--blur-xl));
  -webkit-backdrop-filter: var(--v-backdrop-blur,) var(--v-backdrop-brightness,) var(--v-backdrop-contrast,) var(--v-backdrop-grayscale,) var(--v-backdrop-hue-rotate,) var(--v-backdrop-invert,) var(--v-backdrop-opacity,) var(--v-backdrop-saturate,) var(--v-backdrop-sepia,);
  backdrop-filter: var(--v-backdrop-blur,) var(--v-backdrop-brightness,) var(--v-backdrop-contrast,) var(--v-backdrop-grayscale,) var(--v-backdrop-hue-rotate,) var(--v-backdrop-invert,) var(--v-backdrop-opacity,) var(--v-backdrop-saturate,) var(--v-backdrop-sepia,);
}
.v266 {
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --v-gradient-from, --v-gradient-via, --v-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(--v-ease, var(--default-transition-timing-function));
  transition-duration: var(--v-duration, var(--default-transition-duration));
}
.v267 {
  transition-property: transform, translate, scale, rotate;
  transition-timing-function: var(--v-ease, var(--default-transition-timing-function));
  transition-duration: var(--v-duration, var(--default-transition-duration));
}
.v076 {
  --v-duration: 200ms;
  transition-duration: 200ms;
}
.v122 {
  &:hover {
    @media (hover: hover) {
      border-color: var(--color-white);
    }
  }
}
.v118 {
  &:hover {
    @media (hover: hover) {
      background-color: var(--color-diber-900);
    }
  }
}
.v119 {
  &:hover {
    @media (hover: hover) {
      background-color: var(--color-slate-100);
    }
  }
}
.v120 {
  &:hover {
    @media (hover: hover) {
      background-color: var(--color-slate-800);
    }
  }
}
.v121 {
  &:hover {
    @media (hover: hover) {
      background-color: var(--color-white);
    }
  }
}
.v123 {
  &:hover {
    @media (hover: hover) {
      color: var(--color-ink);
    }
  }
}
.v003 {
  &:active {
    --v-scale-x: 95%;
    --v-scale-y: 95%;
    --v-scale-z: 95%;
    scale: var(--v-scale-x) var(--v-scale-y);
  }
}
.v214 {
  @media (width >= 40rem) {
    display: inline;
  }
}
.v212 {
  @media (width >= 40rem) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.v213 {
  @media (width >= 40rem) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.v211 {
  @media (width >= 40rem) {
    flex-direction: row;
  }
}
.v215 {
  @media (width >= 40rem) {
    padding: calc(var(--spacing) * 4);
  }
}
.v216 {
  @media (width >= 40rem) {
    font-size: var(--text-3xl);
    line-height: var(--v-leading, var(--text-3xl--line-height));
  }
}
.v217 {
  @media (width >= 40rem) {
    font-size: var(--text-4xl);
    line-height: var(--v-leading, var(--text-4xl--line-height));
  }
}
.v219 {
  @media (width >= 40rem) {
    font-size: var(--text-xs);
    line-height: var(--v-leading, var(--text-xs--line-height));
  }
}
.v218 {
  @media (width >= 40rem) {
    font-size: 11px;
  }
}
.v158 {
  @media (width >= 48rem) {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
.v157 {
  @media (width >= 48rem) {
    flex-direction: row;
  }
}
.v159 {
  @media (width >= 48rem) {
    align-items: flex-end;
  }
}
.v133 {
  @media (width >= 64rem) {
    display: block;
  }
}
.v134 {
  @media (width >= 64rem) {
    display: flex;
  }
}
.v138 {
  @media (width >= 64rem) {
    display: none;
  }
}
.v135 {
  @media (width >= 64rem) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.v136 {
  @media (width >= 64rem) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.v137 {
  @media (width >= 64rem) {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
.v139 {
  @media (width >= 64rem) {
    align-items: center;
  }
}
.v142 {
  @media (width >= 64rem) {
    padding-inline: calc(var(--spacing) * 8);
  }
}
.v140 {
  @media (width >= 64rem) {
    padding-top: calc(var(--spacing) * 0);
  }
}
.v141 {
  @media (width >= 64rem) {
    padding-top: calc(var(--spacing) * 16);
  }
}
.v060 {
  &:where(.dark, .dark *) {
    display: none;
  }
}
.v064 {
  &:where(.dark, .dark *) {
    display: inline;
  }
}
.v052 {
  &:where(.dark, .dark *) {
    border-color: color-mix(in srgb, #1e3a8a 30%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-diber-900) 30%, transparent);
    }
  }
}
.v053 {
  &:where(.dark, .dark *) {
    border-color: color-mix(in srgb, #064e3b 30%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-emerald-900) 30%, transparent);
    }
  }
}
.v054 {
  &:where(.dark, .dark *) {
    border-color: color-mix(in srgb, #7f1d1d 30%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-red-900) 30%, transparent);
    }
  }
}
.v055 {
  &:where(.dark, .dark *) {
    border-color: var(--color-slate-700);
  }
}
.v056 {
  &:where(.dark, .dark *) {
    border-color: var(--color-slate-800);
  }
}
.v057 {
  &:where(.dark, .dark *) {
    border-color: color-mix(in srgb, #1e293b 80%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-slate-800) 80%, transparent);
    }
  }
}
.v042 {
  &:where(.dark, .dark *) {
    background-color: color-mix(in srgb, #1e3a8a 20%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-diber-900) 20%, transparent);
    }
  }
}
.v043 {
  &:where(.dark, .dark *) {
    background-color: color-mix(in srgb, #064e3b 20%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-emerald-900) 20%, transparent);
    }
  }
}
.v044 {
  &:where(.dark, .dark *) {
    background-color: color-mix(in srgb, #7f1d1d 20%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-red-900) 20%, transparent);
    }
  }
}
.v045 {
  &:where(.dark, .dark *) {
    background-color: var(--color-slate-700);
  }
}
.v046 {
  &:where(.dark, .dark *) {
    background-color: var(--color-slate-800);
  }
}
.v047 {
  &:where(.dark, .dark *) {
    background-color: color-mix(in srgb, #1e293b 50%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-slate-800) 50%, transparent);
    }
  }
}
.v048 {
  &:where(.dark, .dark *) {
    background-color: var(--color-slate-900);
  }
}
.v049 {
  &:where(.dark, .dark *) {
    background-color: color-mix(in srgb, #0f172a 50%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-slate-900) 50%, transparent);
    }
  }
}
.v050 {
  &:where(.dark, .dark *) {
    background-color: var(--color-slate-950);
  }
}
.v051 {
  &:where(.dark, .dark *) {
    background-color: color-mix(in srgb, #020617 90%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-slate-950) 90%, transparent);
    }
  }
}
.v058 {
  &:where(.dark, .dark *) {
    --v-gradient-from: var(--color-slate-900);
    --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
  }
}
.v059 {
  &:where(.dark, .dark *) {
    --v-gradient-from: var(--color-slate-950);
    --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
  }
}
.v074 {
  &:where(.dark, .dark *) {
    --v-gradient-to: var(--color-slate-900);
    --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
  }
}
.v075 {
  &:where(.dark, .dark *) {
    --v-gradient-to: var(--color-slate-950);
    --v-gradient-stops: var(--v-gradient-via-stops, var(--v-gradient-position), var(--v-gradient-from) var(--v-gradient-from-position), var(--v-gradient-to) var(--v-gradient-to-position));
  }
}
.v066 {
  &:where(.dark, .dark *) {
    color: var(--color-emerald-400);
  }
}
.v067 {
  &:where(.dark, .dark *) {
    color: var(--color-red-400);
  }
}
.v071 {
  &:where(.dark, .dark *) {
    color: var(--color-slate-50);
  }
}
.v068 {
  &:where(.dark, .dark *) {
    color: var(--color-slate-200);
  }
}
.v069 {
  &:where(.dark, .dark *) {
    color: var(--color-slate-300);
  }
}
.v070 {
  &:where(.dark, .dark *) {
    color: var(--color-slate-400);
  }
}
.v072 {
  &:where(.dark, .dark *) {
    color: var(--color-slate-500);
  }
}
.v073 {
  &:where(.dark, .dark *) {
    color: var(--color-slate-700);
  }
}
.v061 {
  &:where(.dark, .dark *) {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-slate-800);
      }
    }
  }
}
.v062 {
  &:where(.dark, .dark *) {
    &:hover {
      @media (hover: hover) {
        background-color: color-mix(in srgb, #1e293b 80%, transparent);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--color-slate-800) 80%, transparent);
        }
      }
    }
  }
}
.v063 {
  &:where(.dark, .dark *) {
    &:hover {
      @media (hover: hover) {
        color: var(--color-slate-50);
      }
    }
  }
}
*, ::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;
}
@property --v-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --v-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --v-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --v-rotate-x {
  syntax: "*";
  inherits: false;
}
@property --v-rotate-y {
  syntax: "*";
  inherits: false;
}
@property --v-rotate-z {
  syntax: "*";
  inherits: false;
}
@property --v-skew-x {
  syntax: "*";
  inherits: false;
}
@property --v-skew-y {
  syntax: "*";
  inherits: false;
}
@property --v-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --v-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --v-gradient-position {
  syntax: "*";
  inherits: false;
}
@property --v-gradient-from {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --v-gradient-via {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --v-gradient-to {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --v-gradient-stops {
  syntax: "*";
  inherits: false;
}
@property --v-gradient-via-stops {
  syntax: "*";
  inherits: false;
}
@property --v-gradient-from-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 0%;
}
@property --v-gradient-via-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 50%;
}
@property --v-gradient-to-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --v-leading {
  syntax: "*";
  inherits: false;
}
@property --v-font-weight {
  syntax: "*";
  inherits: false;
}
@property --v-tracking {
  syntax: "*";
  inherits: false;
}
@property --v-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --v-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --v-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --v-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --v-inset-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --v-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --v-ring-color {
  syntax: "*";
  inherits: false;
}
@property --v-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --v-inset-ring-color {
  syntax: "*";
  inherits: false;
}
@property --v-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --v-ring-inset {
  syntax: "*";
  inherits: false;
}
@property --v-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}
@property --v-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}
@property --v-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --v-blur {
  syntax: "*";
  inherits: false;
}
@property --v-brightness {
  syntax: "*";
  inherits: false;
}
@property --v-contrast {
  syntax: "*";
  inherits: false;
}
@property --v-grayscale {
  syntax: "*";
  inherits: false;
}
@property --v-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --v-invert {
  syntax: "*";
  inherits: false;
}
@property --v-opacity {
  syntax: "*";
  inherits: false;
}
@property --v-saturate {
  syntax: "*";
  inherits: false;
}
@property --v-sepia {
  syntax: "*";
  inherits: false;
}
@property --v-drop-shadow {
  syntax: "*";
  inherits: false;
}
@property --v-drop-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --v-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --v-drop-shadow-size {
  syntax: "*";
  inherits: false;
}
@property --v-backdrop-blur {
  syntax: "*";
  inherits: false;
}
@property --v-backdrop-brightness {
  syntax: "*";
  inherits: false;
}
@property --v-backdrop-contrast {
  syntax: "*";
  inherits: false;
}
@property --v-backdrop-grayscale {
  syntax: "*";
  inherits: false;
}
@property --v-backdrop-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --v-backdrop-invert {
  syntax: "*";
  inherits: false;
}
@property --v-backdrop-opacity {
  syntax: "*";
  inherits: false;
}
@property --v-backdrop-saturate {
  syntax: "*";
  inherits: false;
}
@property --v-backdrop-sepia {
  syntax: "*";
  inherits: false;
}
@property --v-duration {
  syntax: "*";
  inherits: false;
}
@property --v-scale-x {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --v-scale-y {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@property --v-scale-z {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}
@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 {
      --v-translate-x: 0;
      --v-translate-y: 0;
      --v-translate-z: 0;
      --v-rotate-x: initial;
      --v-rotate-y: initial;
      --v-rotate-z: initial;
      --v-skew-x: initial;
      --v-skew-y: initial;
      --v-space-y-reverse: 0;
      --v-border-style: solid;
      --v-gradient-position: initial;
      --v-gradient-from: #0000;
      --v-gradient-via: #0000;
      --v-gradient-to: #0000;
      --v-gradient-stops: initial;
      --v-gradient-via-stops: initial;
      --v-gradient-from-position: 0%;
      --v-gradient-via-position: 50%;
      --v-gradient-to-position: 100%;
      --v-leading: initial;
      --v-font-weight: initial;
      --v-tracking: initial;
      --v-shadow: 0 0 #0000;
      --v-shadow-color: initial;
      --v-shadow-alpha: 100%;
      --v-inset-shadow: 0 0 #0000;
      --v-inset-shadow-color: initial;
      --v-inset-shadow-alpha: 100%;
      --v-ring-color: initial;
      --v-ring-shadow: 0 0 #0000;
      --v-inset-ring-color: initial;
      --v-inset-ring-shadow: 0 0 #0000;
      --v-ring-inset: initial;
      --v-ring-offset-width: 0px;
      --v-ring-offset-color: #fff;
      --v-ring-offset-shadow: 0 0 #0000;
      --v-blur: initial;
      --v-brightness: initial;
      --v-contrast: initial;
      --v-grayscale: initial;
      --v-hue-rotate: initial;
      --v-invert: initial;
      --v-opacity: initial;
      --v-saturate: initial;
      --v-sepia: initial;
      --v-drop-shadow: initial;
      --v-drop-shadow-color: initial;
      --v-drop-shadow-alpha: 100%;
      --v-drop-shadow-size: initial;
      --v-backdrop-blur: initial;
      --v-backdrop-brightness: initial;
      --v-backdrop-contrast: initial;
      --v-backdrop-grayscale: initial;
      --v-backdrop-hue-rotate: initial;
      --v-backdrop-invert: initial;
      --v-backdrop-opacity: initial;
      --v-backdrop-saturate: initial;
      --v-backdrop-sepia: initial;
      --v-duration: initial;
      --v-scale-x: 1;
      --v-scale-y: 1;
      --v-scale-z: 1;
    }
  }
}

body { font-family: Inter, ui-sans-serif, system-ui, sans-serif; }
    .theme-transition, .theme-transition * { transition-property: background-color, border-color, color; transition-duration: 200ms; }
    
    @keyframes metric-pulse {
      0%, 100% { opacity: 1; }
      50% { opacity: 0.8; }
    }

    .status-light {
      display: inline-block;
      width: 10px;
      height: 10px;
      border-radius: 9999px;
      transition: background-color 0.45s ease, box-shadow 0.45s ease;
      flex-shrink: 0;
    }
    .status-light.valid {
      background-color: #10b981;
      box-shadow: 0 0 12px 2px rgba(16, 185, 129, 0.55);
    }
    .status-light.invalid {
      background-color: #ef4444;
      box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.5);
      animation: pulse-invalid 1.4s infinite;
    }
    .status-light.processing {
      background-color: #f59e0b;
      box-shadow: 0 0 8px 1px rgba(245, 158, 11, 0.5);
      animation: pulse-amber 0.9s infinite;
    }
    @keyframes pulse-invalid {
      0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.5); }
      50% { box-shadow: 0 0 0 6px rgba(239, 68, 68, 0); }
    }
    @keyframes pulse-amber {
      0%, 100% { opacity: 1; }
      50% { opacity: 0.6; }
    }

    /* Sidebar layout */
    @media (min-width: 1024px) {
      .sidebar-offset {
        margin-left: 16rem; /* 256px */
      }
      .sidebar-fixed {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        width: 16rem;
        z-index: 40;
      }
    }

    /* Code blocks: allow horizontal scroll without breaking layout */
    pre {
      margin: 0;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
    }

/* Vertical stack spacing — flattened from Tailwind space-y-* utilities.
   Kept explicit to avoid relying on CSS nesting support. */
.v220 > :not(:last-child) { margin-bottom: 0.125rem; }
.v221 > :not(:last-child) { margin-bottom: 0.375rem; }
.v222 > :not(:last-child) { margin-bottom: 0.5rem; }
.v223 > :not(:last-child) { margin-bottom: 0.75rem; }
.v224 > :not(:last-child) { margin-bottom: 1rem; }
.v225 > :not(:last-child) { margin-bottom: 1.25rem; }
.v226 > :not(:last-child) { margin-bottom: 1.5rem; }


/* ============================================================
   DIBER site extensions — aligned with the original v### system
   Only components not present in the original stylesheet live here.
   ============================================================ */
.diber-hidden{display:none!important}
.diber-accent{color:var(--color-emerald-500)}
.diber-link{color:var(--color-diber-500);font-weight:600}
.diber-link:hover{text-decoration:underline}
.diber-badge{display:inline-flex;align-items:center;gap:.45rem;padding:.35rem .65rem;border:1px solid var(--color-slate-200);border-radius:9999px;background:var(--color-white);color:var(--color-slate-600);font-size:.75rem;font-weight:600}
.diber-badge.blue{border-color:color-mix(in srgb,var(--color-diber-500) 18%,transparent);background:var(--color-diber-50);color:var(--color-diber-500)}
.diber-badge.green{border-color:var(--color-emerald-200);background:var(--color-emerald-50);color:var(--color-emerald-600)}
.diber-badge.red{border-color:var(--color-red-200);background:var(--color-red-50);color:var(--color-red-600)}
.diber-btn-green{background:var(--color-emerald-500);color:white}
.diber-btn-green:hover{background:var(--color-emerald-600)}
.diber-btn-danger{border-color:var(--color-red-200)!important;color:var(--color-red-600)!important;background:var(--color-white)!important}
.diber-btn-danger:hover{background:var(--color-red-50)!important}
.diber-section-note{border-left:3px solid var(--color-diber-500);padding:.9rem 1rem;background:var(--color-diber-50);border-radius:0 var(--radius-md) var(--radius-md) 0;color:var(--color-slate-700)}
.diber-callout{background:linear-gradient(135deg,var(--color-diber-900),var(--color-slate-900));color:white;border:1px solid var(--color-slate-700);border-radius:var(--radius-xl);padding:2rem}
.diber-callout p{color:var(--color-slate-300)}
.diber-kpi-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.diber-kpi{background:var(--color-white);border:1px solid var(--color-slate-200);border-radius:var(--radius-lg);padding:1rem;box-shadow:0 1px 3px rgba(15,23,42,.06)}
.diber-kpi-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:var(--color-slate-500);font-weight:700}
.diber-kpi-value{margin-top:.25rem;font-size:1.65rem;line-height:1;font-weight:900;color:var(--color-ink)}
.diber-delta{margin-top:.4rem;font-size:.72rem;font-weight:700}.diber-delta.good{color:var(--color-emerald-600)}.diber-delta.bad{color:var(--color-red-600)}
.diber-metric-row{display:grid;grid-template-columns:minmax(7rem,1fr) minmax(8rem,2fr) 4.5rem;gap:.75rem;align-items:center;padding:.65rem 0;border-bottom:1px solid var(--color-slate-100)}
.diber-metric-row:last-child{border-bottom:0}
.diber-bar{height:.45rem;background:var(--color-slate-200);border-radius:9999px;overflow:hidden}.diber-bar>span{display:block;height:100%;background:var(--color-diber-500);border-radius:inherit}.diber-bar.green>span{background:var(--color-emerald-500)}.diber-bar.red>span{background:var(--color-red-500)}.diber-bar.amber>span{background:var(--color-amber-500)}
.diber-dashboard-grid{display:grid;gap:1rem}.diber-chart-card{background:var(--color-white);border:1px solid var(--color-slate-200);border-radius:var(--radius-lg);padding:1.25rem;box-shadow:0 1px 3px rgba(15,23,42,.06);min-width:0}.diber-chart-card svg{width:100%;height:auto;display:block}
.diber-chart-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.diber-scenario{display:grid;gap:1rem;background:var(--color-white);border:1px solid var(--color-slate-200);border-radius:var(--radius-lg);padding:1rem;box-shadow:0 1px 3px rgba(15,23,42,.06)}
.diber-field{display:flex;flex-direction:column;gap:.4rem}.diber-field label{font-size:.75rem;font-weight:700;color:var(--color-slate-700)}
.diber-input,.diber-select,.diber-textarea{width:100%;border:1px solid var(--color-slate-300);border-radius:var(--radius-md);background:var(--color-white);color:var(--color-ink);padding:.7rem .8rem;font-size:.875rem;outline:none}.diber-textarea{min-height:9rem;resize:vertical;line-height:1.55}.diber-input:focus,.diber-select:focus,.diber-textarea:focus{border-color:var(--color-blue-500);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-blue-500) 16%,transparent)}
.diber-code-editor{width:100%;min-height:17rem;padding:1rem;border:1px solid var(--color-slate-700);border-radius:var(--radius-md);background:var(--color-slate-950);color:var(--color-slate-300);font-family:var(--font-mono);font-size:.75rem;line-height:1.55;resize:vertical;white-space:pre;overflow:auto}.diber-code-editor.output{min-height:22rem}
.diber-editor-shell{border:1px solid var(--color-slate-200);border-radius:var(--radius-lg);overflow:hidden;background:var(--color-white)}.diber-editor-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.65rem .85rem;background:var(--color-slate-50);border-bottom:1px solid var(--color-slate-200)}.diber-editor-head strong{font-family:var(--font-mono);font-size:.72rem}
.diber-tabs{display:flex;gap:.25rem;border-bottom:1px solid var(--color-slate-200);padding:0 .6rem;background:var(--color-slate-50)}.diber-tab{padding:.75rem .8rem;border-bottom:2px solid transparent;font-size:.8rem;color:var(--color-slate-600);font-weight:600}.diber-tab.active{border-color:var(--color-diber-500);color:var(--color-diber-500)}
.diber-tab-panel{display:none}.diber-tab-panel.active{display:block}
.diber-table-wrap{overflow-x:auto;border:1px solid var(--color-slate-200);border-radius:var(--radius-lg);background:var(--color-white)}
.diber-table{width:100%;border-collapse:collapse;min-width:680px}.diber-table th{padding:.75rem;text-align:left;background:var(--color-slate-50);border-bottom:2px solid var(--color-slate-200);font-size:.75rem;color:var(--color-ink)}.diber-table td{padding:.75rem;border-bottom:1px solid var(--color-slate-200);font-size:.8rem;color:var(--color-slate-600);vertical-align:top}.diber-table tr:last-child td{border-bottom:0}
.diber-status{display:inline-flex;align-items:center;padding:.25rem .5rem;border-radius:9999px;font-family:var(--font-mono);font-size:.68rem;font-weight:700;background:var(--color-slate-100);color:var(--color-slate-700)}.diber-status.correct,.diber-status.missing{background:var(--color-emerald-50);color:var(--color-emerald-600)}.diber-status.hallu,.diber-status.error,.diber-status.math_error,.diber-status.omission{background:var(--color-red-50);color:var(--color-red-600)}.diber-status.partial,.diber-status.inference,.diber-status.over{background:#fffbeb;color:#b45309}
.diber-compare-grid{display:grid;grid-template-columns:minmax(9rem,1.4fr) repeat(3,minmax(5.5rem,.7fr));border:1px solid var(--color-slate-200);border-radius:var(--radius-lg);overflow:hidden}.diber-compare-grid>div{padding:.7rem .8rem;border-bottom:1px solid var(--color-slate-200);background:var(--color-white);font-size:.78rem}.diber-compare-grid>.head{background:var(--color-slate-50);font-size:.7rem;text-transform:uppercase;letter-spacing:.04em;font-weight:700;color:var(--color-slate-500)}
.diber-relations{display:flex;flex-direction:column;gap:.65rem}.diber-relation{display:grid;grid-template-columns:1fr auto 1fr auto;gap:.75rem;align-items:center;padding:.8rem;border:1px solid var(--color-slate-200);border-radius:var(--radius-md);background:var(--color-white)}
.diber-profile-row{display:grid;grid-template-columns:minmax(7rem,1fr) minmax(10rem,2fr) 4rem;gap:.7rem;align-items:center;padding:.65rem 0;border-bottom:1px solid var(--color-slate-100)}.diber-profile-row:last-child{border-bottom:0}
.diber-stepper{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem}.diber-step{padding:.65rem;border:1px solid var(--color-slate-200);border-radius:var(--radius-md);background:var(--color-white)}.diber-step strong{display:block;font-size:.72rem}.diber-step span{font-size:.68rem;color:var(--color-slate-500)}.diber-step.active{border-color:var(--color-diber-500);background:var(--color-diber-50)}.diber-step.done{border-color:var(--color-emerald-200);background:var(--color-emerald-50)}
.diber-point-card,.diber-audit-row{border:1px solid var(--color-slate-200);border-radius:var(--radius-lg);padding:1rem;background:var(--color-white)}.diber-point-row{display:grid;gap:.75rem}.diber-audit-grid{display:grid;gap:.75rem}
.diber-result-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.diber-result-card{border:1px solid var(--color-slate-200);border-radius:var(--radius-lg);padding:1rem;background:var(--color-white)}.diber-result-card .label{font-size:.7rem;text-transform:uppercase;letter-spacing:.04em;color:var(--color-slate-500);font-weight:700}.diber-result-card .value{font-size:1.5rem;font-weight:900;color:var(--color-ink);margin-top:.25rem}
.diber-mobile-links{padding:1rem}.diber-mobile-links a{display:block;padding:.65rem .2rem;border-bottom:1px solid var(--color-slate-200);font-size:.875rem;color:var(--color-slate-700)}
.diber-hero-visual{background:var(--color-white);border:1px solid var(--color-slate-200);border-radius:var(--radius-xl);padding:1.5rem;box-shadow:0 1px 3px rgba(15,23,42,.08)}
.diber-summary{padding:.9rem 1rem;border:1px solid var(--color-emerald-200);border-radius:var(--radius-md);background:var(--color-emerald-50);color:var(--color-slate-700)}
.diber-legend{display:flex;flex-wrap:wrap;gap:.85rem;margin-top:.65rem;font-size:.7rem;color:var(--color-slate-500)}.diber-legend i{display:inline-block;width:.6rem;height:.6rem;border-radius:9999px;margin-right:.25rem}
.diber-api-item{border:1px solid var(--color-slate-200);border-radius:var(--radius-lg);padding:1rem;background:var(--color-white)}.diber-api-signature{font-family:var(--font-mono);font-size:.78rem;color:var(--color-diber-500);font-weight:700;overflow-wrap:anywhere}

@media(min-width:640px){.diber-kpi-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.diber-scenario{grid-template-columns:minmax(14rem,.8fr) 2fr;align-items:end}.diber-result-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.diber-point-row{grid-template-columns:minmax(0,2fr) minmax(9rem,.7fr) auto;align-items:end}.diber-audit-grid{grid-template-columns:minmax(0,1.7fr) minmax(9rem,.7fr) minmax(9rem,.8fr);align-items:end}}
@media(min-width:1024px){.diber-dashboard-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.diber-dashboard-grid.wide{grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr)}}
@media(max-width:639px){.diber-metric-row,.diber-profile-row{grid-template-columns:1fr 4rem}.diber-metric-row .diber-bar,.diber-profile-row>div:nth-child(2){grid-column:1/-1}.diber-stepper{grid-template-columns:repeat(2,minmax(0,1fr))}.diber-compare-grid{grid-template-columns:1.25fr repeat(3,.75fr);font-size:.7rem}.diber-compare-grid>div{padding:.55rem .45rem}.diber-relation{grid-template-columns:1fr auto 1fr}.diber-relation .diber-status{grid-column:1/-1;justify-self:start}}
html.dark .diber-badge{background:var(--color-slate-900);border-color:var(--color-slate-700);color:var(--color-slate-300)}
html.dark .diber-badge.blue{background:color-mix(in srgb,var(--color-diber-900) 25%,transparent);color:var(--color-blue-400)}
html.dark .diber-badge.green{background:color-mix(in srgb,var(--color-emerald-900) 25%,transparent);border-color:color-mix(in srgb,var(--color-emerald-900) 55%,transparent);color:var(--color-emerald-400)}
html.dark .diber-section-note{background:var(--color-slate-900);color:var(--color-slate-300)}
html.dark .diber-kpi,html.dark .diber-chart-card,html.dark .diber-scenario,html.dark .diber-editor-shell,html.dark .diber-table-wrap,html.dark .diber-relation,html.dark .diber-step,html.dark .diber-point-card,html.dark .diber-audit-row,html.dark .diber-result-card,html.dark .diber-hero-visual,html.dark .diber-api-item{background:var(--color-slate-900);border-color:var(--color-slate-800)}
html.dark .diber-kpi-value,html.dark .diber-result-card .value{color:var(--color-slate-50)}
html.dark .diber-editor-head,html.dark .diber-tabs,html.dark .diber-table th,html.dark .diber-compare-grid>.head{background:var(--color-slate-800);border-color:var(--color-slate-700);color:var(--color-slate-300)}
html.dark .diber-table td,html.dark .diber-table th,html.dark .diber-compare-grid>div{border-color:var(--color-slate-700)}html.dark .diber-table td,html.dark .diber-compare-grid>div{background:var(--color-slate-900);color:var(--color-slate-300)}
html.dark .diber-input,html.dark .diber-select,html.dark .diber-textarea{background:var(--color-slate-900);border-color:var(--color-slate-700);color:var(--color-slate-100)}
html.dark .diber-field label{color:var(--color-slate-300)}html.dark .diber-summary{background:color-mix(in srgb,var(--color-emerald-900) 22%,transparent);border-color:color-mix(in srgb,var(--color-emerald-900) 55%,transparent);color:var(--color-slate-300)}
html.dark .diber-bar{background:var(--color-slate-700)}html.dark .diber-mobile-links a{border-color:var(--color-slate-800);color:var(--color-slate-300)}

.diber-status.good{background:var(--color-emerald-50);color:var(--color-emerald-600)}
.diber-status.bad{background:var(--color-red-50);color:var(--color-red-600)}
html.dark .diber-status.good{background:color-mix(in srgb,var(--color-emerald-900) 25%,transparent);color:var(--color-emerald-400)}
html.dark .diber-status.bad{background:color-mix(in srgb,var(--color-red-900) 25%,transparent);color:var(--color-red-400)}