@prokodo/ui 1.0.3 → 1.0.4

package/dist/theme.css

@@ -1068,7 +1068,7 @@ html[data-theme=dark],
   --pk-autocomplete-item-hover-bg: color-mix(in srgb, var(--pk-color-muted) 10%, var(--pk-autocomplete-bg));
   --pk-autocomplete-item-active-bg: color-mix(in srgb, var(--pk-color-muted) 18%, var(--pk-autocomplete-bg));
 }
-:global(html[data-theme="dark"]) .prokodo-Autocomplete, :global([data-theme="dark"]) .prokodo-Autocomplete, :global(.pk-theme-dark) .prokodo-Autocomplete {
+html[data-theme=dark] .prokodo-Autocomplete, [data-theme=dark] .prokodo-Autocomplete, .pk-theme-dark .prokodo-Autocomplete {
   --pk-autocomplete-state-fg: var(--pk-color-fg);
   --pk-autocomplete-fg-muted: var(--pk-palette-grey-200);
   --pk-autocomplete-item-hover-bg: color-mix(in srgb, var(--pk-autocomplete-gradient-from) 15%, var(--pk-autocomplete-bg));
@@ -1080,10 +1080,10 @@ html[data-theme=dark],
 .prokodo-Autocomplete__input--is-open {
   --pk-input-shadow-color-focus: var(--pk-autocomplete-shadow-color-focus);
 }
-.prokodo-Autocomplete__input--is-open :global(.prokodo-Input__field) {
+.prokodo-Autocomplete__input--is-open .prokodo-Input__field {
   border-radius: var(--pk-autocomplete-radius) var(--pk-autocomplete-radius) 0 0;
 }
-.prokodo-Autocomplete__input--is-open :global(.prokodo-Input__notch) {
+.prokodo-Autocomplete__input--is-open .prokodo-Input__notch {
   border-radius: var(--pk-autocomplete-radius) var(--pk-autocomplete-radius) 0 0;
   border-bottom-color: transparent;
 }
@@ -1326,7 +1326,7 @@ html[data-theme=dark],
   border-radius: 1.5rem;
   border-radius: var(--pk-button-radius);
 }
-.prokodo-Button--has-bg-info, .prokodo-Button--has-bg-error {
+.prokodo-Button--has-bg-primary, .prokodo-Button--has-bg-secondary, .prokodo-Button--has-bg-info, .prokodo-Button--has-bg-success, .prokodo-Button--has-bg-warning, .prokodo-Button--has-bg-error {
   color: var(--pk-palette-white);
 }
 .prokodo-Button--has-bg-primary {
@@ -1341,7 +1341,6 @@ html[data-theme=dark],
 }
 .prokodo-Button--has-bg-info {
   background: var(--gradient-background-info);
-  color: var(--pk-palette-white);
 }
 .prokodo-Button--has-bg-success {
   background: var(--gradient-background-success);
@@ -1351,7 +1350,6 @@ html[data-theme=dark],
 }
 .prokodo-Button--has-bg-error {
   background: var(--gradient-background-error);
-  color: var(--pk-palette-white);
 }
 .prokodo-Button--has-bg-primary, .prokodo-Button--has-text-primary, .prokodo-Button--has-variant-outlined--has-outline-primary {
   box-shadow: 0 4px 20px color-mix(in srgb, var(--pk-color-brand) 18%, transparent);
@@ -1545,6 +1543,13 @@ html[data-theme=dark],
   width: 100%;
 }
 
+.prokodo-Calendly__widget {
+  display: block;
+  min-width: 320px;
+  height: var(--pk-calendly-height, 700px);
+  width: 100%;
+}
+
 @keyframes Card_fadeInAnimation {
   0% {
     opacity: 0;
@@ -1855,7 +1860,7 @@ html[data-theme=dark],
   width: 100%;
   position: relative;
 }
-:global(html[data-theme="dark"]) .prokodo-Checkbox, :global([data-theme="dark"]) .prokodo-Checkbox, :global(.pk-theme-dark) .prokodo-Checkbox {
+html[data-theme=dark] .prokodo-Checkbox, [data-theme=dark] .prokodo-Checkbox, .pk-theme-dark .prokodo-Checkbox {
   --pk-checkbox-control-border: rgba(255, 255, 255, 0.18);
   --pk-checkbox-control-bg: rgba(255, 255, 255, 0.04);
   --pk-checkbox-card-bg: rgba(255, 255, 255, 0.03);
@@ -1891,7 +1896,7 @@ html[data-theme=dark],
   --pk-checkbox-gradient-to: var(--pk-color-border);
   --pk-checkbox-shadow-color: rgba(0, 0, 0, 0.1);
 }
-:global(html[data-theme="dark"]) .prokodo-Checkbox--info, :global([data-theme="dark"]) .prokodo-Checkbox--info, :global(.pk-theme-dark) .prokodo-Checkbox--info, :global(html[data-theme="dark"]) .prokodo-Checkbox--inherit, :global([data-theme="dark"]) .prokodo-Checkbox--inherit, :global(.pk-theme-dark) .prokodo-Checkbox--inherit, :global(html[data-theme="dark"]) .prokodo-Checkbox--white, :global([data-theme="dark"]) .prokodo-Checkbox--white, :global(.pk-theme-dark) .prokodo-Checkbox--white {
+html[data-theme=dark] .prokodo-Checkbox--info, [data-theme=dark] .prokodo-Checkbox--info, .pk-theme-dark .prokodo-Checkbox--info, html[data-theme=dark] .prokodo-Checkbox--inherit, [data-theme=dark] .prokodo-Checkbox--inherit, .pk-theme-dark .prokodo-Checkbox--inherit, html[data-theme=dark] .prokodo-Checkbox--white, [data-theme=dark] .prokodo-Checkbox--white, .pk-theme-dark .prokodo-Checkbox--white {
   --pk-checkbox-gradient-from: var(--pk-palette-grey-100);
   --pk-checkbox-gradient-to: var(--pk-palette-grey-200);
 }
@@ -2061,25 +2066,25 @@ html[data-theme=dark],
 .prokodo-CheckboxGroup--primary {
   --pk-cg-legend-color: color-mix(in srgb, var(--pk-color-brand) 80%, #000000);
 }
-:global(html[data-theme="dark"]) .prokodo-CheckboxGroup--primary, :global([data-theme="dark"]) .prokodo-CheckboxGroup--primary, :global(.pk-theme-dark) .prokodo-CheckboxGroup--primary {
+html[data-theme=dark] .prokodo-CheckboxGroup--primary, [data-theme=dark] .prokodo-CheckboxGroup--primary, .pk-theme-dark .prokodo-CheckboxGroup--primary {
   --pk-cg-legend-color: var(--pk-color-brand);
 }
 .prokodo-CheckboxGroup--secondary {
   --pk-cg-legend-color: color-mix(in srgb, var(--pk-color-accent) 80%, #000000);
 }
-:global(html[data-theme="dark"]) .prokodo-CheckboxGroup--secondary, :global([data-theme="dark"]) .prokodo-CheckboxGroup--secondary, :global(.pk-theme-dark) .prokodo-CheckboxGroup--secondary {
+html[data-theme=dark] .prokodo-CheckboxGroup--secondary, [data-theme=dark] .prokodo-CheckboxGroup--secondary, .pk-theme-dark .prokodo-CheckboxGroup--secondary {
   --pk-cg-legend-color: var(--pk-color-accent);
 }
 .prokodo-CheckboxGroup--success {
   --pk-cg-legend-color: color-mix(in srgb, var(--pk-color-success) 80%, #000000);
 }
-:global(html[data-theme="dark"]) .prokodo-CheckboxGroup--success, :global([data-theme="dark"]) .prokodo-CheckboxGroup--success, :global(.pk-theme-dark) .prokodo-CheckboxGroup--success {
+html[data-theme=dark] .prokodo-CheckboxGroup--success, [data-theme=dark] .prokodo-CheckboxGroup--success, .pk-theme-dark .prokodo-CheckboxGroup--success {
   --pk-cg-legend-color: var(--pk-color-success);
 }
 .prokodo-CheckboxGroup--warning {
   --pk-cg-legend-color: color-mix(in srgb, var(--pk-color-warning) 80%, #000000);
 }
-:global(html[data-theme="dark"]) .prokodo-CheckboxGroup--warning, :global([data-theme="dark"]) .prokodo-CheckboxGroup--warning, :global(.pk-theme-dark) .prokodo-CheckboxGroup--warning {
+html[data-theme=dark] .prokodo-CheckboxGroup--warning, [data-theme=dark] .prokodo-CheckboxGroup--warning, .pk-theme-dark .prokodo-CheckboxGroup--warning {
   --pk-cg-legend-color: var(--pk-color-warning);
 }
 .prokodo-CheckboxGroup--error {
@@ -2088,7 +2093,7 @@ html[data-theme=dark],
 .prokodo-CheckboxGroup--info, .prokodo-CheckboxGroup--inherit, .prokodo-CheckboxGroup--white {
   --pk-cg-legend-color: var(--pk-color-muted);
 }
-:global(html[data-theme="dark"]) .prokodo-CheckboxGroup--info, :global([data-theme="dark"]) .prokodo-CheckboxGroup--info, :global(.pk-theme-dark) .prokodo-CheckboxGroup--info, :global(html[data-theme="dark"]) .prokodo-CheckboxGroup--inherit, :global([data-theme="dark"]) .prokodo-CheckboxGroup--inherit, :global(.pk-theme-dark) .prokodo-CheckboxGroup--inherit, :global(html[data-theme="dark"]) .prokodo-CheckboxGroup--white, :global([data-theme="dark"]) .prokodo-CheckboxGroup--white, :global(.pk-theme-dark) .prokodo-CheckboxGroup--white {
+html[data-theme=dark] .prokodo-CheckboxGroup--info, [data-theme=dark] .prokodo-CheckboxGroup--info, .pk-theme-dark .prokodo-CheckboxGroup--info, html[data-theme=dark] .prokodo-CheckboxGroup--inherit, [data-theme=dark] .prokodo-CheckboxGroup--inherit, .pk-theme-dark .prokodo-CheckboxGroup--inherit, html[data-theme=dark] .prokodo-CheckboxGroup--white, [data-theme=dark] .prokodo-CheckboxGroup--white, .pk-theme-dark .prokodo-CheckboxGroup--white {
   --pk-cg-legend-color: var(--pk-palette-grey-200);
 }
 .prokodo-CheckboxGroup__legend {
@@ -2295,7 +2300,7 @@ html[data-theme=dark],
 .prokodo-Chip--filled--inherit {
   background: var(--gradient-background-inherit);
 }
-:global(html[data-theme="dark"]) .prokodo-Chip--filled--inherit, :global([data-theme="dark"]) .prokodo-Chip--filled--inherit {
+html[data-theme=dark] .prokodo-Chip--filled--inherit, [data-theme=dark] .prokodo-Chip--filled--inherit {
   background: var(--pk-color-surface-raised);
 }
 .prokodo-Chip--outlined {
@@ -2336,7 +2341,7 @@ html[data-theme=dark],
 .prokodo-Chip--outlined--white::before, .prokodo-Chip--outlined--inherit::before {
   background: linear-gradient(90deg, var(--pk-palette-grey-100) 0%, var(--pk-palette-grey-200) 100%);
 }
-:global(html[data-theme="dark"]) .prokodo-Chip--outlined--white::before, :global([data-theme="dark"]) .prokodo-Chip--outlined--white::before, :global(html[data-theme="dark"]) .prokodo-Chip--outlined--inherit::before, :global([data-theme="dark"]) .prokodo-Chip--outlined--inherit::before {
+html[data-theme=dark] .prokodo-Chip--outlined--white::before, [data-theme=dark] .prokodo-Chip--outlined--white::before, html[data-theme=dark] .prokodo-Chip--outlined--inherit::before, [data-theme=dark] .prokodo-Chip--outlined--inherit::before {
   background: linear-gradient(90deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.5) 100%);
 }
 .prokodo-Chip__delete {
@@ -2438,7 +2443,7 @@ html[data-theme=dark],
   background-clip: text;
   -webkit-text-fill-color: transparent;
 }
-:global(html[data-theme="dark"]) .prokodo-Chip--filled--white .prokodo-Chip__label, :global([data-theme="dark"]) .prokodo-Chip--filled--white .prokodo-Chip__label, :global(html[data-theme="dark"]) .prokodo-Chip--outlined--white .prokodo-Chip__label, :global([data-theme="dark"]) .prokodo-Chip--outlined--white .prokodo-Chip__label {
+html[data-theme=dark] .prokodo-Chip--filled--white .prokodo-Chip__label, [data-theme=dark] .prokodo-Chip--filled--white .prokodo-Chip__label, html[data-theme=dark] .prokodo-Chip--outlined--white .prokodo-Chip__label, [data-theme=dark] .prokodo-Chip--outlined--white .prokodo-Chip__label {
   background-image: linear-gradient(90deg, var(--pk-palette-grey-400) 0%, var(--pk-palette-grey-600) 100%);
 }
 .prokodo-Chip--filled--inherit .prokodo-Chip__label {
@@ -2453,7 +2458,7 @@ html[data-theme=dark],
   background-clip: text;
   -webkit-text-fill-color: transparent;
 }
-:global(html[data-theme="dark"]) .prokodo-Chip--filled--inherit .prokodo-Chip__label, :global([data-theme="dark"]) .prokodo-Chip--filled--inherit .prokodo-Chip__label, :global(html[data-theme="dark"]) .prokodo-Chip--outlined--inherit .prokodo-Chip__label, :global([data-theme="dark"]) .prokodo-Chip--outlined--inherit .prokodo-Chip__label {
+html[data-theme=dark] .prokodo-Chip--filled--inherit .prokodo-Chip__label, [data-theme=dark] .prokodo-Chip--filled--inherit .prokodo-Chip__label, html[data-theme=dark] .prokodo-Chip--outlined--inherit .prokodo-Chip__label, [data-theme=dark] .prokodo-Chip--outlined--inherit .prokodo-Chip__label {
   background-image: linear-gradient(90deg, var(--pk-palette-white) 0%, var(--pk-palette-grey-100) 100%);
 }
 .prokodo-Chip__label {
@@ -2461,184 +2466,999 @@ html[data-theme=dark],
   z-index: 1;
 }
 
-@keyframes Dialog_fadeIn {
+@keyframes dpDialogIn {
   from {
     opacity: 0;
-    transform: translateY(10px);
+    transform: translateY(-0.5rem) scale(0.98);
   }
   to {
     opacity: 1;
-    transform: translateY(0);
+    transform: translateY(0) scale(1);
   }
 }
-@keyframes Dialog_backdropFadeIn {
+@keyframes dpBorderShift {
+  from {
+    background-position: 0 0, 0 0;
+  }
+  to {
+    background-position: 200% 0, 0 0;
+  }
+}
+@keyframes dpSlideUp {
   from {
     opacity: 0;
+    transform: translateY(100%);
   }
   to {
     opacity: 1;
+    transform: translateY(0);
   }
 }
-.prokodo-Dialog {
-  display: none;
-  position: fixed;
-  inset: 0;
-  justify-content: center;
-  align-items: center;
-  z-index: var(--pk-z-modal);
+.prokodo-DatePicker {
+  position: relative;
+  display: inline-block;
+  width: 100%;
 }
-.prokodo-Dialog__backdrop {
-  display: none;
-  position: fixed;
-  inset: 0;
-  justify-content: center;
+.prokodo-DatePicker--primary {
+  --pk-dp-gradient-from: var(--pk-color-brand);
+  --pk-dp-gradient-to: var(--pk-color-accent);
+  --pk-dp-shadow-color: color-mix(in srgb, var(--pk-color-brand) 30%, transparent);
+  --pk-dp-trigger-label-float-fg: var(--pk-color-brand);
+  --pk-dp-day-today-ring: var(--pk-color-brand);
+}
+.prokodo-DatePicker--secondary {
+  --pk-dp-gradient-from: var(--pk-color-accent);
+  --pk-dp-gradient-to: var(--pk-color-brand);
+  --pk-dp-shadow-color: color-mix(in srgb, var(--pk-color-accent) 30%, transparent);
+  --pk-dp-trigger-label-float-fg: var(--pk-color-accent);
+  --pk-dp-day-today-ring: var(--pk-color-accent);
+}
+.prokodo-DatePicker--success {
+  --pk-dp-gradient-from: var(--pk-color-success);
+  --pk-dp-gradient-to: #10CCB8;
+  --pk-dp-shadow-color: color-mix(in srgb, var(--pk-color-success) 30%, transparent);
+  --pk-dp-trigger-label-float-fg: var(--pk-color-success);
+  --pk-dp-day-today-ring: var(--pk-color-success);
+}
+.prokodo-DatePicker--warning {
+  --pk-dp-gradient-from: var(--pk-color-warning);
+  --pk-dp-gradient-to: #f7cc6a;
+  --pk-dp-shadow-color: color-mix(in srgb, var(--pk-color-warning) 30%, transparent);
+  --pk-dp-trigger-label-float-fg: var(--pk-color-warning);
+  --pk-dp-day-today-ring: var(--pk-color-warning);
+}
+.prokodo-DatePicker--error {
+  --pk-dp-gradient-from: var(--pk-color-error);
+  --pk-dp-gradient-to: #ff6b6b;
+  --pk-dp-shadow-color: color-mix(in srgb, var(--pk-color-error) 30%, transparent);
+  --pk-dp-trigger-label-float-fg: var(--pk-color-error);
+  --pk-dp-day-today-ring: var(--pk-color-error);
+}
+.prokodo-DatePicker--info, .prokodo-DatePicker--inherit, .prokodo-DatePicker--white {
+  --pk-dp-gradient-from: var(--pk-color-muted);
+  --pk-dp-gradient-to: var(--pk-color-border);
+  --pk-dp-shadow-color: rgba(0, 0, 0, 0.1);
+  --pk-dp-trigger-label-float-fg: var(--pk-color-muted);
+  --pk-dp-day-today-ring: var(--pk-color-muted);
+}
+html[data-theme=dark] .prokodo-DatePicker--info, [data-theme=dark] .prokodo-DatePicker--info, html[data-theme=dark] .prokodo-DatePicker--inherit, [data-theme=dark] .prokodo-DatePicker--inherit, html[data-theme=dark] .prokodo-DatePicker--white, [data-theme=dark] .prokodo-DatePicker--white {
+  --pk-dp-gradient-from: var(--pk-palette-grey-100);
+  --pk-dp-gradient-to: var(--pk-palette-grey-200);
+}
+.prokodo-DatePicker__trigger {
+  position: relative;
+  display: flex;
   align-items: center;
-  z-index: var(--pk-z-modal);
-  background-color: rgb(var(--pk-color-overlay-rgb)/var(--pk-color-overlay-alpha));
+  width: 100%;
+  padding: var(--pk-dp-trigger-padding-y) calc(var(--pk-dp-trigger-padding-x) + 2rem) var(--pk-dp-trigger-padding-y) var(--pk-dp-trigger-padding-x);
+  background: var(--pk-dp-trigger-bg);
+  border: 1.5px solid var(--pk-dp-trigger-border);
+  border-radius: var(--pk-dp-trigger-radius);
+  cursor: pointer;
+  text-align: left;
+  transition: border-color var(--pk-timing-normal) ease, box-shadow var(--pk-timing-normal) ease;
+  box-shadow: 0 2px 8px var(--pk-dp-shadow-color), 0 1px 3px color-mix(in srgb, var(--pk-dp-shadow-color) 50%, transparent);
 }
-.prokodo-Dialog__backdrop {
-  animation: Dialog_backdropFadeIn var(--pk-timing-normal) ease;
+.prokodo-DatePicker__trigger:hover {
+  border-color: transparent;
+  box-shadow: 0 4px 12px var(--pk-dp-shadow-color), 0 0 5px var(--pk-dp-shadow-color);
 }
-.prokodo-Dialog__backdrop--is-visible {
-  display: flex;
+.prokodo-DatePicker__trigger--open {
+  border-color: transparent;
+  box-shadow: 0 4px 12px var(--pk-dp-shadow-color), 0 0 5px var(--pk-dp-shadow-color);
 }
-.prokodo-Dialog--is-visible {
-  display: flex;
+.prokodo-DatePicker__trigger--open::before {
+  content: "";
+  pointer-events: none;
+  position: absolute;
+  inset: -1.5px;
+  border-radius: var(--pk-dp-trigger-radius);
+  background: linear-gradient(90deg, var(--pk-dp-gradient-from), var(--pk-dp-gradient-to), var(--pk-dp-gradient-from));
+  background-size: 200% 100%;
+  animation: dpBorderShift 3s linear infinite;
+  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
+  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
+  -webkit-mask-composite: destination-out;
+  mask-composite: exclude;
+  padding: 1.5px;
 }
-.prokodo-Dialog__backdrop .prokodo-Dialog, .prokodo-Dialog__backdrop .prokodo-Dialog--is-visible {
-  position: static;
-  inset: auto;
-  z-index: auto;
-  display: contents;
+.prokodo-DatePicker__trigger__label {
+  position: absolute;
+  top: 50%;
+  left: var(--pk-dp-trigger-padding-x);
+  transform: translateY(-50%);
+  font-size: 1rem;
+  color: var(--pk-dp-trigger-label-fg);
+  pointer-events: none;
+  transition: transform var(--pk-timing-normal) ease, font-size var(--pk-timing-normal) ease, color var(--pk-timing-normal) ease;
 }
-.prokodo-Dialog__container {
-  position: relative;
-  background-color: var(--pk-dialog-bg);
-  color: var(--pk-dialog-fg);
-  border-radius: var(--pk-dialog-radius);
-  box-shadow: var(--pk-dialog-shadow);
-  animation: Dialog_fadeIn var(--pk-timing-normal) ease;
-  max-height: 90vh;
-  overflow-y: auto;
-  width: 100%;
-  box-sizing: border-box;
+.prokodo-DatePicker__trigger__label--float {
+  top: 0;
+  transform: translateY(-50%) scale(0.78);
+  transform-origin: top left;
+  font-size: 1rem;
+  color: var(--pk-dp-trigger-label-float-fg);
+  text-shadow: -3px 0 var(--pk-dp-trigger-bg), 3px 0 var(--pk-dp-trigger-bg), 0 -2px var(--pk-dp-trigger-bg), 0 2px var(--pk-dp-trigger-bg);
 }
-@media screen and (min-width: 960px) {
-  .prokodo-Dialog__container {
-    min-width: 520px;
-    width: auto;
-  }
+.prokodo-DatePicker__trigger__value {
+  font-size: 1rem;
+  color: var(--pk-dp-trigger-fg);
+  line-height: 1.4;
 }
-.prokodo-Dialog__container--fullScreen {
-  width: 100vw;
-  height: 100vh;
-  max-height: 100vh;
-  border-radius: 0;
+.prokodo-DatePicker__trigger__value--empty {
+  color: var(--pk-dp-trigger-fg-muted);
 }
-.prokodo-Dialog__container--scroll-paper {
-  overflow-y: auto;
+.prokodo-DatePicker__trigger__icon {
+  position: absolute;
+  right: var(--pk-dp-trigger-padding-x);
+  top: 50%;
+  transform: translateY(-50%);
+  display: flex;
+  align-items: center;
+  color: var(--pk-dp-nav-fg);
+  pointer-events: none;
 }
-.prokodo-Dialog__container--scroll-body {
-  overflow-y: visible;
+.prokodo-DatePicker__dialog {
+  position: absolute;
+  top: calc(100% + var(--pk-space-xs));
+  left: 0;
+  z-index: 200;
+  min-width: var(--pk-dp-dialog-min-width);
+  width: -moz-max-content;
+  width: max-content;
+  background: var(--pk-dp-dialog-bg);
+  border: 1px solid var(--pk-dp-dialog-border);
+  border-radius: var(--pk-dp-dialog-radius);
+  box-shadow: var(--pk-dp-dialog-shadow);
+  padding: var(--pk-dp-dialog-padding);
+  animation: dpDialogIn 180ms ease both;
+}
+html[data-theme=dark] .prokodo-DatePicker__dialog, [data-theme=dark] .prokodo-DatePicker__dialog, .pk-theme-dark .prokodo-DatePicker__dialog {
+  --pk-dp-header-fg: var(--pk-palette-grey-50);
+  --pk-dp-nav-fg: var(--pk-palette-grey-300);
+  --pk-dp-nav-hover-bg: rgba(255, 255, 255, 0.10);
+  --pk-dp-weekday-fg: var(--pk-palette-grey-400);
+  --pk-dp-footer-ghost-fg: var(--pk-palette-grey-300);
+  --pk-dp-footer-ghost-hover-fg: var(--pk-palette-grey-50);
+  --pk-dp-dialog-border: rgba(255, 255, 255, 0.10);
+  --pk-dp-dialog-bg: var(--pk-color-surface);
 }
-.prokodo-Dialog__header {
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__dialog {
+    position: fixed;
+    top: auto;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    width: 100%;
+    box-sizing: border-box;
+    min-width: 0;
+    max-height: 92dvh;
+    overflow-y: auto;
+    overscroll-behavior: contain;
+    -webkit-overflow-scrolling: touch;
+    border-radius: 1.25rem 1.25rem 0 0;
+    border-bottom: none;
+    padding: 0 1.25rem 2rem;
+    animation: dpSlideUp 260ms cubic-bezier(0.32, 0.72, 0, 1) both;
+    box-shadow: 0 -4px 40px rgba(0, 0, 0, 0.18), 0 -1px 0 var(--pk-dp-dialog-border);
+  }
+  .prokodo-DatePicker__dialog::before {
+    content: "";
+    display: block;
+    width: 2.5rem;
+    height: 0.25rem;
+    background: var(--pk-dp-gradient-from);
+    border-radius: 999px;
+    margin: 0.75rem auto 1.25rem;
+    flex-shrink: 0;
+  }
+}
+.prokodo-DatePicker__dialog__backdrop {
+  display: none;
+}
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__dialog__backdrop {
+    display: block;
+    position: fixed;
+    inset: 0;
+    z-index: 199;
+    background: rgba(0, 0, 0, 0.5);
+    backdrop-filter: blur(4px);
+    -webkit-backdrop-filter: blur(4px);
+    animation: dpDialogIn 200ms ease both;
+  }
+}
+.prokodo-DatePicker__dialog__close {
+  display: none;
+}
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__dialog__close {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 2.5rem;
+    height: 2.5rem;
+    border-radius: 100%;
+    background: transparent;
+    border: none;
+    cursor: pointer;
+    color: var(--pk-dp-nav-fg);
+    flex-shrink: 0;
+    transition: color var(--pk-timing-fast) ease, background var(--pk-timing-fast) ease;
+  }
+  .prokodo-DatePicker__dialog__close:hover {
+    background: color-mix(in srgb, var(--pk-dp-gradient-from) 10%, transparent);
+    color: var(--pk-dp-gradient-from);
+  }
+}
+.prokodo-DatePicker__dialog__header {
   display: flex;
+  align-items: center;
   justify-content: space-between;
-  align-items: flex-start;
-  padding: var(--pk-space-2xl) var(--pk-space-2xl) var(--pk-space-md);
-  gap: var(--pk-space-md);
+  margin-bottom: var(--pk-space-sm);
+  gap: var(--pk-space-xs);
 }
-.prokodo-Dialog__title {
-  color: var(--pk-dialog-fg);
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__dialog__header {
+    margin-bottom: 1.25rem;
+  }
+}
+.prokodo-DatePicker__month__label {
+  flex: 1 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0.25em;
+  white-space: nowrap;
+  color: var(--pk-dp-header-fg);
   font-weight: 400;
-  font-size: 1rem;
-  font-family: var(--font-primary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-size: 1.125rem;
+  font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
   font-style: normal;
-  line-height: 1.4;
+  line-height: 1.55;
   letter-spacing: 0.03em;
   text-transform: none;
   text-align: left;
   text-decoration: none;
 }
-.prokodo-Dialog__title--is-hidden {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  padding: 0;
-  margin: -1px;
-  overflow: hidden;
-  clip: rect(0, 0, 0, 0);
-  white-space: nowrap;
-  border: 0;
+@media screen and (min-width: 480px) {
+  .prokodo-DatePicker__month__label {
+    font-size: 1rem;
+  }
 }
-.prokodo-Dialog__header__button {
-  display: inline-flex;
-  align-items: center;
-  gap: var(--pk-space-xs);
-  flex-shrink: 0;
+@media screen and (min-width: 960px) {
+  .prokodo-DatePicker__month__label {
+    font-size: 1rem;
+  }
+}
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__month__label {
+    font-weight: 700;
+    font-size: 1.75rem;
+    font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+    font-style: normal;
+    line-height: 1.6;
+    letter-spacing: 0.03em;
+    text-transform: none;
+    text-align: left;
+    text-decoration: none;
+    font-weight: 700;
+  }
+}
+@media screen and (max-width: 480px) and (min-width: 480px) {
+  .prokodo-DatePicker__month__label {
+    font-size: 1.5rem;
+    line-height: 1.55;
+  }
+}
+@media screen and (max-width: 480px) and (min-width: 960px) {
+  .prokodo-DatePicker__month__label {
+    font-size: 1.5rem;
+    line-height: 1.55;
+  }
+}
+.prokodo-DatePicker__header-btn {
   background: none;
   border: none;
   cursor: pointer;
-  color: var(--pk-dialog-fg);
-  opacity: 0.5;
-  transition: opacity var(--pk-timing-fast) ease;
-  padding: var(--pk-space-xs);
-  border-radius: var(--pk-radius-sm);
-  margin-top: -2px;
+  font-weight: 700;
+  text-align: center;
+  padding: 0.15em 0.35em;
+  border-radius: var(--pk-radius-sm, 4px);
+  color: var(--pk-dp-header-fg);
+  transition: background var(--pk-timing-fast) ease, color var(--pk-timing-fast) ease;
   font-weight: 400;
-  font-size: 1rem;
+  font-size: 1.125rem;
   font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
   font-style: normal;
-  line-height: 1.45;
+  line-height: 1.55;
   letter-spacing: 0.03em;
   text-transform: none;
   text-align: left;
   text-decoration: none;
 }
 @media screen and (min-width: 480px) {
-  .prokodo-Dialog__header__button {
-    font-size: 0.875rem;
-    line-height: 1.4;
+  .prokodo-DatePicker__header-btn {
+    font-size: 1rem;
   }
 }
 @media screen and (min-width: 960px) {
-  .prokodo-Dialog__header__button {
-    font-size: 0.875rem;
-    line-height: 1.4;
+  .prokodo-DatePicker__header-btn {
+    font-size: 1rem;
   }
 }
-.prokodo-Dialog__header__button:hover {
-  opacity: 1;
+.prokodo-DatePicker__header-btn:hover {
+  background: color-mix(in srgb, var(--pk-dp-gradient-from) 10%, transparent);
+  color: var(--pk-dp-gradient-from);
 }
-.prokodo-Dialog__header__button__icon {
-  flex-shrink: 0;
+.prokodo-DatePicker__header-range {
+  flex: 1 1;
+  text-align: center;
+  font-weight: 700;
+  color: var(--pk-dp-header-fg);
+  font-weight: 400;
+  font-size: 1.125rem;
+  font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-style: normal;
+  line-height: 1.55;
+  letter-spacing: 0.03em;
+  text-transform: none;
+  text-align: left;
+  text-decoration: none;
 }
-.prokodo-Dialog__content {
-  padding: var(--pk-space-md) var(--pk-space-2xl);
+@media screen and (min-width: 480px) {
+  .prokodo-DatePicker__header-range {
+    font-size: 1rem;
+  }
 }
-.prokodo-Dialog__content--scroll-paper {
-  overflow-y: auto;
+@media screen and (min-width: 960px) {
+  .prokodo-DatePicker__header-range {
+    font-size: 1rem;
+  }
 }
-.prokodo-Dialog__actions {
+.prokodo-DatePicker__picker-grid {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  grid-gap: var(--pk-space-xs, 0.25rem);
+  gap: var(--pk-space-xs, 0.25rem);
+  padding-block: var(--pk-space-sm, 0.5rem);
+}
+.prokodo-DatePicker__picker-cell {
   display: flex;
-  justify-content: flex-end;
-  gap: var(--pk-space-md);
-  padding: var(--pk-space-md) var(--pk-space-2xl) var(--pk-space-2xl);
-  flex-wrap: wrap;
+  align-items: center;
+  justify-content: center;
+  border: none;
+  border-radius: var(--pk-radius-md, 6px);
+  cursor: pointer;
+  font-size: 0.9375rem;
+  font-weight: 500;
+  height: 2.75rem;
+  background: transparent;
+  color: var(--pk-dp-header-fg);
+  transition: background var(--pk-timing-fast) ease, color var(--pk-timing-fast) ease;
 }
-
-.prokodo-Drawer {
-  /* Backdrop (unchanged, fades in) */
-  /* Container (slide + fade via transitions) */
-  /* Header */
-  /* Content */
+.prokodo-DatePicker__picker-cell--today {
+  font-weight: 700;
+  color: var(--pk-dp-gradient-from);
 }
-.prokodo-Drawer__backdrop {
-  position: fixed;
-  inset: 0;
-  background-color: var(--pk-drawer-backdrop-bg);
-  opacity: 0;
-  pointer-events: none;
+.prokodo-DatePicker__picker-cell--selected {
+  background: var(--pk-dp-gradient-from);
+  color: #fff;
+  font-weight: 700;
+}
+.prokodo-DatePicker__picker-cell--disabled {
+  opacity: 0.35;
+  cursor: not-allowed;
+}
+.prokodo-DatePicker__picker-cell:hover:not([disabled]) {
+  background: color-mix(in srgb, var(--pk-dp-gradient-from) 10%, transparent);
+  color: var(--pk-dp-gradient-from);
+}
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__picker-cell {
+    height: 3.25rem;
+    font-size: 1rem;
+  }
+}
+.prokodo-DatePicker__nav__btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 2rem;
+  height: 2rem;
+  border-radius: var(--pk-dp-nav-radius);
+  background: transparent;
+  border: none;
+  cursor: pointer;
+  color: var(--pk-dp-nav-fg);
+  transition: color var(--pk-timing-fast) ease, background var(--pk-timing-fast) ease;
+}
+.prokodo-DatePicker__nav__btn:hover {
+  color: var(--pk-dp-gradient-from);
+}
+.prokodo-DatePicker__nav__btn--prev svg {
+  transform: rotate(180deg);
+}
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__nav__btn {
+    width: 2.75rem;
+    height: 2.75rem;
+    border-radius: 100%;
+    background: color-mix(in srgb, var(--pk-dp-nav-fg) 8%, transparent);
+  }
+  .prokodo-DatePicker__nav__btn:hover {
+    background: color-mix(in srgb, var(--pk-dp-gradient-from) 12%, transparent);
+    color: var(--pk-dp-gradient-from);
+  }
+}
+.prokodo-DatePicker__weekdays {
+  display: grid;
+  grid-template-columns: repeat(7, 1fr);
+  margin-bottom: var(--pk-space-xs);
+}
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__weekdays {
+    margin-bottom: var(--pk-space-sm);
+  }
+}
+.prokodo-DatePicker__weekday {
+  text-transform: uppercase;
+  color: var(--pk-dp-weekday-fg);
+  padding-block: var(--pk-space-xs);
+  font-weight: 400;
+  font-size: 1rem;
+  font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-style: normal;
+  line-height: 1.45;
+  letter-spacing: 0.03em;
+  text-transform: none;
+  text-align: left;
+  text-decoration: none;
+}
+@media screen and (min-width: 480px) {
+  .prokodo-DatePicker__weekday {
+    font-size: 0.875rem;
+    line-height: 1.4;
+  }
+}
+@media screen and (min-width: 960px) {
+  .prokodo-DatePicker__weekday {
+    font-size: 0.875rem;
+    line-height: 1.4;
+  }
+}
+.prokodo-DatePicker__weekday {
+  text-align: center;
+}
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__weekday {
+    font-weight: 400;
+    font-size: 1.125rem;
+    font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+    font-style: normal;
+    line-height: 1.55;
+    letter-spacing: 0.03em;
+    text-transform: none;
+    text-align: left;
+    text-decoration: none;
+    font-weight: 600;
+    padding-block: var(--pk-space-sm);
+  }
+}
+@media screen and (max-width: 480px) and (min-width: 480px) {
+  .prokodo-DatePicker__weekday {
+    font-size: 1rem;
+  }
+}
+@media screen and (max-width: 480px) and (min-width: 960px) {
+  .prokodo-DatePicker__weekday {
+    font-size: 1rem;
+  }
+}
+.prokodo-DatePicker__days {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+.prokodo-DatePicker__days > div {
+  display: grid;
+  grid-template-columns: repeat(7, 1fr);
+  grid-gap: 2px;
+  gap: 2px;
+}
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__days {
+    gap: var(--pk-space-xs);
+  }
+  .prokodo-DatePicker__days > div {
+    gap: var(--pk-space-xs);
+  }
+}
+.prokodo-DatePicker__day {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  aspect-ratio: 1;
+  border-radius: 100%;
+  border: none;
+  background: transparent;
+  color: var(--pk-dp-day-fg);
+  font-size: 0.875rem;
+  cursor: pointer;
+  transition: background var(--pk-timing-fast) ease, color var(--pk-timing-fast) ease;
+}
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__day {
+    font-size: 1rem;
+    min-height: 2.75rem;
+  }
+}
+.prokodo-DatePicker__day::before {
+  content: "";
+  pointer-events: none;
+  position: absolute;
+  inset: 0;
+  border-radius: 100%;
+  background: linear-gradient(135deg, var(--pk-dp-gradient-from), var(--pk-dp-gradient-to));
+  padding: 1.5px;
+  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
+  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
+  -webkit-mask-composite: destination-out;
+  mask-composite: exclude;
+  opacity: 0;
+  transition: opacity var(--pk-timing-fast) ease;
+}
+.prokodo-DatePicker__day:hover {
+  background: radial-gradient(100% 100% at 50% 50%, color-mix(in srgb, var(--pk-dp-gradient-from) 22%, transparent) 0%, transparent 100%);
+}
+.prokodo-DatePicker__day:hover::before {
+  opacity: 1;
+}
+.prokodo-DatePicker__day:active:not(.prokodo-DatePicker__day--disabled) {
+  background: radial-gradient(100% 100% at 50% 50%, var(--pk-dp-gradient-from) 0%, var(--pk-dp-gradient-to) 100%);
+  color: #fff;
+}
+.prokodo-DatePicker__day:active:not(.prokodo-DatePicker__day--disabled)::before {
+  opacity: 0;
+}
+.prokodo-DatePicker__day--today:not(.prokodo-DatePicker__day--selected) {
+  font-weight: 600;
+}
+.prokodo-DatePicker__day--today:not(.prokodo-DatePicker__day--selected)::before {
+  opacity: 1;
+}
+.prokodo-DatePicker__day--selected {
+  border-radius: 100%;
+  background: linear-gradient(135deg, var(--pk-dp-gradient-from), var(--pk-dp-gradient-to));
+  color: #fff;
+  font-weight: 600;
+  box-shadow: 0 2px 8px var(--pk-dp-shadow-color);
+}
+.prokodo-DatePicker__day--selected::before {
+  opacity: 0;
+}
+.prokodo-DatePicker__day--selected:hover {
+  filter: brightness(1.08);
+}
+.prokodo-DatePicker__day--selected:hover::before {
+  opacity: 0;
+}
+.prokodo-DatePicker__day--outside {
+  color: var(--pk-dp-day-outside-fg);
+}
+.prokodo-DatePicker__day--disabled {
+  color: var(--pk-dp-day-disabled-fg);
+  cursor: not-allowed;
+  pointer-events: none;
+}
+.prokodo-DatePicker__day--disabled:hover {
+  background: transparent;
+}
+.prokodo-DatePicker__time__row {
+  display: flex;
+  align-items: center;
+  gap: var(--pk-space-xs);
+  padding: var(--pk-space-sm) 0 var(--pk-space-xs);
+  margin-top: var(--pk-space-sm);
+  border-top: 1px solid var(--pk-dp-footer-border);
+}
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__time__row {
+    justify-content: center;
+    gap: var(--pk-space-md);
+    padding: var(--pk-space-md) 0;
+    margin-top: var(--pk-space-md);
+  }
+}
+.prokodo-DatePicker__time__label {
+  padding-left: var(--pk-space-sm);
+  text-transform: uppercase;
+  color: var(--pk-dp-time-label-fg);
+  flex: 1 1;
+  font-weight: 400;
+  font-size: 1rem;
+  font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-style: normal;
+  line-height: 1.45;
+  letter-spacing: 0.03em;
+  text-transform: none;
+  text-align: left;
+  text-decoration: none;
+}
+@media screen and (min-width: 480px) {
+  .prokodo-DatePicker__time__label {
+    font-size: 0.875rem;
+    line-height: 1.4;
+  }
+}
+@media screen and (min-width: 960px) {
+  .prokodo-DatePicker__time__label {
+    font-size: 0.875rem;
+    line-height: 1.4;
+  }
+}
+.prokodo-DatePicker__time__label {
+  font-weight: 600;
+}
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__time__label {
+    display: none;
+  }
+}
+.prokodo-DatePicker__time__select {
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  background: var(--pk-dp-time-select-bg);
+  color: var(--pk-dp-time-select-fg);
+  border: 1px solid var(--pk-dp-time-select-border);
+  border-radius: var(--pk-dp-time-select-radius);
+  padding: var(--pk-space-xs) var(--pk-space-sm);
+  cursor: pointer;
+  transition: border-color var(--pk-timing-fast) ease;
+  width: 3.5rem;
+  font-weight: 400;
+  font-size: 1rem;
+  font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-style: normal;
+  line-height: 1.45;
+  letter-spacing: 0.03em;
+  text-transform: none;
+  text-align: left;
+  text-decoration: none;
+}
+@media screen and (min-width: 480px) {
+  .prokodo-DatePicker__time__select {
+    font-size: 0.875rem;
+    line-height: 1.4;
+  }
+}
+@media screen and (min-width: 960px) {
+  .prokodo-DatePicker__time__select {
+    font-size: 0.875rem;
+    line-height: 1.4;
+  }
+}
+.prokodo-DatePicker__time__select {
+  text-align: center;
+}
+.prokodo-DatePicker__time__select:focus {
+  outline: none;
+  border-color: var(--pk-dp-gradient-from);
+}
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__time__select {
+    width: 5.5rem;
+    height: 3.25rem;
+    font-size: 1.75rem;
+    font-weight: 600;
+    border-radius: var(--pk-radius-lg);
+    text-align: center;
+    padding: 0;
+  }
+}
+.prokodo-DatePicker__time__sep {
+  font-size: 1rem;
+  font-weight: 700;
+  color: var(--pk-dp-time-sep-fg);
+  margin-inline: 2px;
+}
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__time__sep {
+    font-size: 1.75rem;
+    font-weight: 700;
+  }
+}
+.prokodo-DatePicker__footer {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  gap: var(--pk-space-xs);
+  padding-top: var(--pk-space-sm);
+  margin-top: var(--pk-space-sm);
+  border-top: 1px solid var(--pk-dp-footer-border);
+}
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__footer {
+    gap: var(--pk-space-sm);
+    padding-top: var(--pk-space-md);
+    margin-top: var(--pk-space-md);
+  }
+}
+.prokodo-DatePicker__footer__btn {
+  padding: var(--pk-space-xs) var(--pk-space-sm);
+  border-radius: var(--pk-radius-md);
+  border: none;
+  font-size: 0.8125rem;
+  font-weight: 500;
+  cursor: pointer;
+  transition: background var(--pk-timing-fast) ease, color var(--pk-timing-fast) ease, box-shadow var(--pk-timing-fast) ease;
+}
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__footer__btn {
+    flex: 1 1;
+    height: 3rem;
+    font-size: 0.9375rem;
+    font-weight: 600;
+    border-radius: var(--pk-radius-lg);
+  }
+}
+.prokodo-DatePicker__footer__btn--ghost {
+  background: transparent;
+  color: var(--pk-dp-footer-ghost-fg);
+}
+.prokodo-DatePicker__footer__btn--ghost:hover {
+  background: var(--pk-dp-nav-hover-bg);
+  color: var(--pk-dp-footer-ghost-hover-fg);
+}
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__footer__btn--ghost {
+    background: color-mix(in srgb, var(--pk-dp-nav-fg) 8%, transparent);
+  }
+}
+.prokodo-DatePicker__footer__btn--ghost:first-child {
+  color: var(--pk-dp-gradient-from);
+  margin-right: auto;
+}
+.prokodo-DatePicker__footer__btn--ghost:first-child:hover {
+  background: color-mix(in srgb, var(--pk-dp-gradient-from) 12%, transparent);
+  color: var(--pk-dp-gradient-from);
+}
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__footer__btn--ghost:first-child {
+    margin-right: 0;
+    background: color-mix(in srgb, var(--pk-dp-gradient-from) 10%, transparent);
+  }
+}
+.prokodo-DatePicker__footer__btn--filled {
+  background: linear-gradient(135deg, var(--pk-dp-gradient-from), var(--pk-dp-gradient-to));
+  color: #fff;
+  font-weight: 600;
+  box-shadow: 0 2px 6px var(--pk-dp-shadow-color);
+}
+.prokodo-DatePicker__footer__btn--filled:hover {
+  filter: brightness(1.08);
+  box-shadow: 0 3px 10px var(--pk-dp-shadow-color);
+}
+@media screen and (max-width: 480px) {
+  .prokodo-DatePicker__footer__btn--filled {
+    flex: 1.5 1;
+    box-shadow: 0 4px 16px var(--pk-dp-shadow-color);
+  }
+}
+.prokodo-DatePicker__helper {
+  margin-top: var(--pk-space-xs);
+  padding-inline: var(--pk-dp-trigger-padding-x);
+  font-size: 0.8125rem;
+  color: var(--pk-dp-trigger-fg-muted);
+}
+.prokodo-DatePicker__error {
+  margin-top: var(--pk-space-xs);
+  padding-inline: var(--pk-dp-trigger-padding-x);
+  font-size: 0.8125rem;
+  color: var(--pk-color-error);
+}
+
+@keyframes Dialog_fadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+@keyframes Dialog_backdropFadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+.prokodo-Dialog {
+  display: none;
+  position: fixed;
+  inset: 0;
+  justify-content: center;
+  align-items: center;
+  z-index: var(--pk-z-modal);
+}
+.prokodo-Dialog__backdrop {
+  display: none;
+  position: fixed;
+  inset: 0;
+  justify-content: center;
+  align-items: center;
+  z-index: var(--pk-z-modal);
+  background-color: rgb(var(--pk-color-overlay-rgb)/var(--pk-color-overlay-alpha));
+}
+.prokodo-Dialog__backdrop {
+  animation: Dialog_backdropFadeIn var(--pk-timing-normal) ease;
+}
+.prokodo-Dialog__backdrop--is-visible {
+  display: flex;
+}
+.prokodo-Dialog--is-visible {
+  display: flex;
+}
+.prokodo-Dialog__backdrop .prokodo-Dialog, .prokodo-Dialog__backdrop .prokodo-Dialog--is-visible {
+  position: static;
+  inset: auto;
+  z-index: auto;
+  display: contents;
+}
+.prokodo-Dialog__container {
+  position: relative;
+  background-color: var(--pk-dialog-bg);
+  color: var(--pk-dialog-fg);
+  border-radius: var(--pk-dialog-radius);
+  box-shadow: var(--pk-dialog-shadow);
+  animation: Dialog_fadeIn var(--pk-timing-normal) ease;
+  max-height: 90vh;
+  overflow-y: auto;
+  width: 100%;
+  box-sizing: border-box;
+}
+@media screen and (min-width: 960px) {
+  .prokodo-Dialog__container {
+    min-width: 520px;
+    width: auto;
+  }
+}
+.prokodo-Dialog__container--fullScreen {
+  width: 100vw;
+  height: 100vh;
+  max-height: 100vh;
+  border-radius: 0;
+}
+.prokodo-Dialog__container--scroll-paper {
+  overflow-y: auto;
+}
+.prokodo-Dialog__container--scroll-body {
+  overflow-y: visible;
+}
+.prokodo-Dialog__header {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  padding: var(--pk-space-2xl) var(--pk-space-2xl) var(--pk-space-md);
+  gap: var(--pk-space-md);
+}
+.prokodo-Dialog__title {
+  color: var(--pk-dialog-fg);
+  font-weight: 400;
+  font-size: 1rem;
+  font-family: var(--font-primary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-style: normal;
+  line-height: 1.4;
+  letter-spacing: 0.03em;
+  text-transform: none;
+  text-align: left;
+  text-decoration: none;
+}
+.prokodo-Dialog__title--is-hidden {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
+.prokodo-Dialog__header__button {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--pk-space-xs);
+  flex-shrink: 0;
+  background: none;
+  border: none;
+  cursor: pointer;
+  color: var(--pk-dialog-fg);
+  opacity: 0.5;
+  transition: opacity var(--pk-timing-fast) ease;
+  padding: var(--pk-space-xs);
+  border-radius: var(--pk-radius-sm);
+  margin-top: -2px;
+  font-weight: 400;
+  font-size: 1rem;
+  font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-style: normal;
+  line-height: 1.45;
+  letter-spacing: 0.03em;
+  text-transform: none;
+  text-align: left;
+  text-decoration: none;
+}
+@media screen and (min-width: 480px) {
+  .prokodo-Dialog__header__button {
+    font-size: 0.875rem;
+    line-height: 1.4;
+  }
+}
+@media screen and (min-width: 960px) {
+  .prokodo-Dialog__header__button {
+    font-size: 0.875rem;
+    line-height: 1.4;
+  }
+}
+.prokodo-Dialog__header__button:hover {
+  opacity: 1;
+}
+.prokodo-Dialog__header__button__icon {
+  flex-shrink: 0;
+}
+.prokodo-Dialog__content {
+  padding: var(--pk-space-md) var(--pk-space-2xl);
+}
+.prokodo-Dialog__content--scroll-paper {
+  overflow-y: auto;
+}
+.prokodo-Dialog__actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: var(--pk-space-md);
+  padding: var(--pk-space-md) var(--pk-space-2xl) var(--pk-space-2xl);
+  flex-wrap: wrap;
+}
+
+.prokodo-Drawer {
+  /* Backdrop (unchanged, fades in) */
+  /* Container (slide + fade via transitions) */
+  /* Header */
+  /* Content */
+}
+.prokodo-Drawer__backdrop {
+  position: fixed;
+  inset: 0;
+  background-color: var(--pk-drawer-backdrop-bg);
+  opacity: 0;
+  pointer-events: none;
   transition: opacity 0.3s ease;
   z-index: calc(var(--pk-drawer-z-index) - 1);
 }
@@ -2813,7 +3633,7 @@ html[data-theme=dark],
     line-height: 1.4;
   }
 }
-:global([data-theme="dark"]) .prokodo-DynamicList__helperText, :global(.pk-theme-dark) .prokodo-DynamicList__helperText {
+[data-theme=dark] .prokodo-DynamicList__helperText, .pk-theme-dark .prokodo-DynamicList__helperText {
   color: var(--pk-palette-grey-400);
 }
 .prokodo-DynamicList__helperText__content {
@@ -3553,7 +4373,7 @@ html[data-theme=dark],
   --pk-input-label-focused-fg: var(--pk-color-muted);
   --pk-input-border-focus: var(--pk-color-border);
 }
-:global(html[data-theme="dark"]) .prokodo-Input--info, :global([data-theme="dark"]) .prokodo-Input--info, :global(.pk-theme-dark) .prokodo-Input--info, :global(html[data-theme="dark"]) .prokodo-Input--inherit, :global([data-theme="dark"]) .prokodo-Input--inherit, :global(.pk-theme-dark) .prokodo-Input--inherit, :global(html[data-theme="dark"]) .prokodo-Input--white, :global([data-theme="dark"]) .prokodo-Input--white, :global(.pk-theme-dark) .prokodo-Input--white {
+html[data-theme=dark] .prokodo-Input--info, [data-theme=dark] .prokodo-Input--info, .pk-theme-dark .prokodo-Input--info, html[data-theme=dark] .prokodo-Input--inherit, [data-theme=dark] .prokodo-Input--inherit, .pk-theme-dark .prokodo-Input--inherit, html[data-theme=dark] .prokodo-Input--white, [data-theme=dark] .prokodo-Input--white, .pk-theme-dark .prokodo-Input--white {
   --pk-input-gradient-from: var(--pk-palette-grey-100);
   --pk-input-gradient-to: var(--pk-palette-grey-200);
 }
@@ -3772,7 +4592,7 @@ html[data-theme=dark],
   pointer-events: none;
   z-index: 2;
 }
-:global([data-theme="dark"]) .prokodo-Input__trailing, :global(.pk-theme-dark) .prokodo-Input__trailing {
+[data-theme=dark] .prokodo-Input__trailing, .pk-theme-dark .prokodo-Input__trailing {
   color: var(--pk-palette-grey-300);
 }
 .prokodo-Input__trailing--clickable {
@@ -4108,7 +4928,7 @@ html[data-theme=dark],
   -webkit-text-fill-color: transparent;
   color: var(--pk-label-gradient-from);
 }
-:global(html[data-theme="dark"]) .prokodo-Label__highlighted, :global([data-theme="dark"]) .prokodo-Label__highlighted, :global(.pk-theme-dark) .prokodo-Label__highlighted {
+html[data-theme=dark] .prokodo-Label__highlighted, [data-theme=dark] .prokodo-Label__highlighted, .pk-theme-dark .prokodo-Label__highlighted {
   background: linear-gradient(to right, var(--pk-label-gradient-from), var(--pk-label-gradient-to));
   background-clip: text;
   -webkit-background-clip: text;
@@ -4481,6 +5301,193 @@ html[data-theme=dark] .prokodo-List__item__icon {
   }
 }
 
+.prokodo-Map__container {
+  width: 100%;
+  height: var(--pk-map-height, 500px);
+}
+
+@keyframes pk-pagination-pulse {
+  0%, 100% {
+    opacity: 1;
+    transform: scale(1);
+  }
+  50% {
+    opacity: 0.4;
+    transform: scale(0.96);
+  }
+}
+.prokodo-Pagination {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--pk-pagination-gap);
+}
+.prokodo-Pagination--is-pending {
+  --pk-button-disabled-bg: transparent;
+  --pk-button-disabled-fg: var(--pk-pagination-fg);
+  pointer-events: none;
+}
+.prokodo-Pagination--is-pending .prokodo-Pagination__btn, .prokodo-Pagination--is-pending .prokodo-Pagination__page {
+  animation: pk-pagination-pulse 1.4s ease-in-out infinite;
+}
+.prokodo-Pagination--is-pending .prokodo-Pagination__page--active {
+  animation-duration: 2.4s;
+}
+.prokodo-Pagination--is-pending .prokodo-Pagination__item:nth-child(1) .prokodo-Pagination__page {
+  animation-delay: 0s;
+}
+.prokodo-Pagination--is-pending .prokodo-Pagination__item:nth-child(2) .prokodo-Pagination__page {
+  animation-delay: 0.065s;
+}
+.prokodo-Pagination--is-pending .prokodo-Pagination__item:nth-child(3) .prokodo-Pagination__page {
+  animation-delay: 0.13s;
+}
+.prokodo-Pagination--is-pending .prokodo-Pagination__item:nth-child(4) .prokodo-Pagination__page {
+  animation-delay: 0.195s;
+}
+.prokodo-Pagination--is-pending .prokodo-Pagination__item:nth-child(5) .prokodo-Pagination__page {
+  animation-delay: 0.26s;
+}
+.prokodo-Pagination--is-pending .prokodo-Pagination__item:nth-child(6) .prokodo-Pagination__page {
+  animation-delay: 0.325s;
+}
+.prokodo-Pagination--is-pending .prokodo-Pagination__item:nth-child(7) .prokodo-Pagination__page {
+  animation-delay: 0.39s;
+}
+.prokodo-Pagination--is-pending .prokodo-Pagination__item:nth-child(8) .prokodo-Pagination__page {
+  animation-delay: 0.455s;
+}
+.prokodo-Pagination--is-pending .prokodo-Pagination__item:nth-child(9) .prokodo-Pagination__page {
+  animation-delay: 0.52s;
+}
+.prokodo-Pagination--is-pending .prokodo-Pagination__item:nth-child(10) .prokodo-Pagination__page {
+  animation-delay: 0.585s;
+}
+.prokodo-Pagination--is-pending .prokodo-Pagination__item:nth-child(11) .prokodo-Pagination__page {
+  animation-delay: 0.65s;
+}
+.prokodo-Pagination--color-primary {
+  --pk-pagination-active-border: var(--pk-color-brand);
+  --pk-pagination-active-shadow: 0 4px 18px color-mix(in srgb, var(--pk-color-brand) 45%, transparent);
+  --pk-pagination-active-gradient: var(--gradient-border-4);
+}
+.prokodo-Pagination--color-secondary {
+  --pk-pagination-active-border: var(--pk-color-accent);
+  --pk-pagination-active-shadow: 0 4px 18px color-mix(in srgb, var(--pk-color-accent) 45%, transparent);
+  --pk-pagination-active-gradient: var(--gradient-border-2);
+}
+.prokodo-Pagination--color-success {
+  --pk-pagination-active-border: var(--pk-color-success);
+  --pk-pagination-active-shadow: 0 4px 18px color-mix(in srgb, var(--pk-color-success) 45%, transparent);
+  --pk-pagination-active-gradient: var(--gradient-border-success);
+}
+.prokodo-Pagination--color-error {
+  --pk-pagination-active-border: var(--pk-color-error);
+  --pk-pagination-active-shadow: 0 4px 18px color-mix(in srgb, var(--pk-color-error) 45%, transparent);
+  --pk-pagination-active-gradient: var(--gradient-border-error);
+}
+.prokodo-Pagination--color-warning {
+  --pk-pagination-active-border: var(--pk-color-warning);
+  --pk-pagination-active-shadow: 0 4px 18px color-mix(in srgb, var(--pk-color-warning) 45%, transparent);
+  --pk-pagination-active-gradient: var(--gradient-border-warning);
+}
+.prokodo-Pagination--color-info {
+  --pk-pagination-active-border: var(--pk-color-info);
+  --pk-pagination-active-shadow: 0 4px 18px color-mix(in srgb, var(--pk-color-info) 45%, transparent);
+  --pk-pagination-active-gradient: var(--gradient-border-info);
+}
+.prokodo-Pagination__list {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--pk-pagination-gap);
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+.prokodo-Pagination__item {
+  display: inline-flex;
+  align-items: center;
+}
+.prokodo-Pagination__ellipsis {
+  color: var(--pk-pagination-fg);
+  padding: 0 var(--pk-pagination-pad-x);
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+  font-weight: 400;
+  font-size: 1rem;
+  font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-style: normal;
+  line-height: 1.45;
+  letter-spacing: 0.03em;
+  text-transform: none;
+  text-align: left;
+  text-decoration: none;
+}
+@media screen and (min-width: 480px) {
+  .prokodo-Pagination__ellipsis {
+    font-size: 0.875rem;
+    line-height: 1.4;
+  }
+}
+@media screen and (min-width: 960px) {
+  .prokodo-Pagination__ellipsis {
+    font-size: 0.875rem;
+    line-height: 1.4;
+  }
+}
+.prokodo-Pagination__btn {
+  width: 40px;
+  height: 40px;
+  transition: box-shadow 140ms ease;
+}
+.prokodo-Pagination__btn:not(:disabled):hover {
+  box-shadow: 0 4px 14px color-mix(in srgb, var(--pk-pagination-active-border) 30%, transparent);
+}
+.prokodo-Pagination__page {
+  min-width: 36px;
+  height: 36px;
+  padding: 0 var(--pk-pagination-pad-x);
+  border-radius: var(--pk-pagination-page-radius);
+  color: var(--pk-pagination-fg);
+  border: none !important;
+  background: transparent !important;
+  background-color: transparent !important;
+  text-align: center !important;
+  transition: box-shadow 140ms ease, background 140ms ease, color 140ms ease, transform 140ms ease;
+}
+.prokodo-Pagination__page:not(:disabled):hover {
+  background: color-mix(in srgb, var(--pk-pagination-active-bg) 10%, transparent) !important;
+  background-color: color-mix(in srgb, var(--pk-pagination-active-bg) 10%, transparent) !important;
+  color: var(--pk-pagination-active-border) !important;
+  transform: scale(1.05);
+}
+.prokodo-Pagination__page--active {
+  pointer-events: none;
+  border-radius: calc(var(--pk-pagination-page-radius) + 2px);
+  box-shadow: var(--pk-pagination-active-shadow);
+  transform: scale(1.1);
+  font-weight: 600 !important;
+  letter-spacing: -0.01em;
+  transition: transform 140ms ease, box-shadow 140ms ease;
+  color: var(--pk-color-fg) !important;
+  background: transparent !important;
+  background-color: transparent !important;
+  --pk-button-disabled-bg: transparent;
+  --pk-button-disabled-fg: var(--pk-color-fg);
+}
+.prokodo-Pagination__page--active::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  padding: 2px;
+  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
+          mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
+  -webkit-mask-composite: xor;
+          mask-composite: exclude;
+  background: var(--pk-pagination-active-gradient) !important;
+}
+
 .prokodo-PostItem__grid {
   /* Mobile: stacked, image on top via order */
   display: flex;
@@ -5234,32 +6241,441 @@ html[data-theme=dark] .prokodo-List__item__icon {
   text-decoration: none;
 }
 @media screen and (min-width: 480px) {
-  .prokodo-Rating__helperText {
+  .prokodo-Rating__helperText {
+    font-size: 0.875rem;
+    line-height: 1.4;
+  }
+}
+@media screen and (min-width: 960px) {
+  .prokodo-Rating__helperText {
+    font-size: 0.875rem;
+    line-height: 1.4;
+  }
+}
+[data-theme=dark] .prokodo-Rating__helperText, .pk-theme-dark .prokodo-Rating__helperText {
+  color: var(--pk-palette-grey-400);
+}
+.prokodo-Rating__helperText__content {
+  width: 100%;
+}
+.prokodo-Rating__helperText__content--is-error {
+  color: var(--pk-rating-error-fg);
+}
+
+.prokodo-RichText__a {
+  color: var(--pk-color-brand);
+}
+.prokodo-RichText__p {
+  color: var(--pk-color-muted);
+  font-weight: 400;
+  font-size: 1.125rem;
+  font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-style: normal;
+  line-height: 1.55;
+  letter-spacing: 0.03em;
+  text-transform: none;
+  text-align: left;
+  text-decoration: none;
+}
+@media screen and (min-width: 480px) {
+  .prokodo-RichText__p {
+    font-size: 1rem;
+  }
+}
+@media screen and (min-width: 960px) {
+  .prokodo-RichText__p {
+    font-size: 1rem;
+  }
+}
+.prokodo-RichText__p {
+  text-align: inherit;
+}
+.prokodo-RichText__pre {
+  color: var(--pk-color-muted);
+  padding: 0;
+  border: 1px solid var(--pk-color-border);
+  border-radius: var(--pk-radius-sm);
+  background-color: var(--pk-color-surface-raised);
+  overflow-x: auto;
+  overflow-wrap: break-word;
+  font-weight: 400;
+  font-size: 1rem;
+  font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-style: normal;
+  line-height: 1.45;
+  letter-spacing: 0.03em;
+  text-transform: none;
+  text-align: left;
+  text-decoration: none;
+}
+@media screen and (min-width: 480px) {
+  .prokodo-RichText__pre {
+    font-size: 0.875rem;
+    line-height: 1.4;
+  }
+}
+@media screen and (min-width: 960px) {
+  .prokodo-RichText__pre {
+    font-size: 0.875rem;
+    line-height: 1.4;
+  }
+}
+.prokodo-RichText__pre {
+  text-align: inherit;
+}
+.prokodo-RichText__blockquote {
+  background-color: var(--pk-color-surface-raised);
+  border-left: 3px solid var(--pk-color-border);
+  padding: 1px var(--pk-space-lg);
+  margin: 0;
+}
+.prokodo-RichText__image {
+  -o-object-fit: cover;
+     object-fit: cover;
+  border-radius: var(--pk-radius-md);
+}
+.prokodo-RichText__image__wrapper {
+  position: relative;
+  display: block;
+  width: 100%;
+  height: 300px;
+  overflow: hidden;
+  border-radius: var(--pk-radius-md);
+}
+.prokodo-RichText__ul, .prokodo-RichText__ol {
+  padding: 0;
+  list-style-type: none;
+}
+.prokodo-RichText__li {
+  display: flex;
+  align-items: flex-start;
+  padding-bottom: var(--pk-space-xs);
+  margin-top: 2px;
+}
+.prokodo-RichText__li__icon {
+  flex: 0 0 20px;
+  width: 20px;
+  height: 20px;
+  margin-right: var(--pk-space-sm);
+  padding-top: 2px;
+  line-height: 1;
+}
+.prokodo-RichText__li__content {
+  flex: 1 1 auto;
+  min-width: 0;
+  overflow-wrap: anywhere;
+  display: inline;
+  font-weight: 400;
+  font-size: 1.125rem;
+  font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-style: normal;
+  line-height: 1.55;
+  letter-spacing: 0.03em;
+  text-transform: none;
+  text-align: left;
+  text-decoration: none;
+}
+@media screen and (min-width: 480px) {
+  .prokodo-RichText__li__content {
+    font-size: 1rem;
+  }
+}
+@media screen and (min-width: 960px) {
+  .prokodo-RichText__li__content {
+    font-size: 1rem;
+  }
+}
+.prokodo-RichText__li__content {
+  color: var(--pk-color-fg);
+}
+.prokodo-RichText__ol__decimal {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 19px;
+  height: 19px;
+  background-color: var(--pk-color-brand);
+  color: var(--pk-palette-white);
+  border: 1px solid var(--pk-color-brand);
+  border-radius: 200px;
+  margin-right: var(--pk-space-sm);
+  font-weight: 400;
+  font-size: 1rem;
+  font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-style: normal;
+  line-height: 1.45;
+  letter-spacing: 0.03em;
+  text-transform: none;
+  text-align: left;
+  text-decoration: none;
+}
+@media screen and (min-width: 480px) {
+  .prokodo-RichText__ol__decimal {
+    font-size: 0.875rem;
+    line-height: 1.4;
+  }
+}
+@media screen and (min-width: 960px) {
+  .prokodo-RichText__ol__decimal {
+    font-size: 0.875rem;
+    line-height: 1.4;
+  }
+}
+.prokodo-RichText__ol__decimal {
+  text-align: inherit;
+}
+.prokodo-RichText__ol > li {
+  display: -webkit-box;
+}
+.prokodo-RichText__ol > li icon--inherit {
+  color: var(--pk-color-fg);
+}
+.prokodo-RichText__ol > li icon--primary {
+  color: var(--pk-color-brand);
+}
+.prokodo-RichText__ol > li icon--secondary {
+  color: var(--pk-color-accent);
+}
+.prokodo-RichText__ol > li icon--info {
+  color: var(--pk-color-muted);
+}
+.prokodo-RichText__ol > li icon--success {
+  color: var(--pk-color-success);
+}
+.prokodo-RichText__ol > li icon--error {
+  color: var(--pk-color-error);
+}
+.prokodo-RichText__ol > li icon--warning {
+  color: var(--pk-color-warning);
+}
+.prokodo-RichText__ol > li icon--white {
+  color: var(--pk-palette-white);
+}
+
+.prokodo-RTE {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+}
+.prokodo-RTE__surface {
+  position: relative;
+  width: calc(100% - 4px);
+  padding: 0;
+  overflow: hidden;
+  background-color: var(--pk-rte-bg);
+}
+.prokodo-RTE__surface::after {
+  content: none;
+}
+.prokodo-RTE__surface .ql-toolbar,
+.prokodo-RTE__surface .ql-container {
+  border: none !important;
+}
+.prokodo-RTE__surface .ql-toolbar.ql-snow button:hover .ql-stroke,
+.prokodo-RTE__surface .ql-toolbar.ql-snow button.ql-active .ql-stroke {
+  stroke: var(--pk-rte-accent) !important;
+}
+.prokodo-RTE__surface .ql-toolbar.ql-snow button:hover .ql-fill,
+.prokodo-RTE__surface .ql-toolbar.ql-snow button.ql-active .ql-fill {
+  fill: var(--pk-rte-accent) !important;
+}
+.prokodo-RTE__surface .ql-toolbar.ql-snow .ql-picker-label:hover,
+.prokodo-RTE__surface .ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label {
+  color: var(--pk-rte-accent) !important;
+}
+.prokodo-RTE__surface .ql-toolbar.ql-snow .ql-picker-label:hover .ql-stroke,
+.prokodo-RTE__surface .ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
+  stroke: var(--pk-rte-accent) !important;
+}
+.prokodo-RTE__surface .ql-toolbar .ql-picker-options {
+  background: var(--pk-rte-picker-bg) !important;
+  border: var(--pk-border-width) solid color-mix(in srgb, var(--pk-rte-accent) 20%, var(--pk-color-border)) !important;
+  border-radius: var(--pk-rte-radius-lg) !important;
+  box-shadow: var(--pk-rte-picker-shadow) !important;
+  padding: var(--pk-space-xs) !important;
+  margin-top: var(--pk-space-xs) !important;
+  min-width: 200px !important;
+}
+.prokodo-RTE__toolbar {
+  border: none;
+  background-color: var(--pk-rte-toolbar-bg);
+}
+.prokodo-RTE__toolbar__icon__part__stroke, .prokodo-RTE__toolbar__icon__part__stroke__miter {
+  stroke: var(--pk-rte-icon-color);
+  opacity: var(--pk-rte-icon-opacity);
+  transition: stroke var(--pk-timing-fast) ease, opacity var(--pk-timing-fast) ease;
+}
+.prokodo-RTE__toolbar__icon__part__fill {
+  fill: var(--pk-rte-icon-color);
+  opacity: var(--pk-rte-icon-opacity);
+  transition: fill var(--pk-timing-fast) ease, opacity var(--pk-timing-fast) ease;
+}
+.prokodo-RTE__toolbar__button:hover .prokodo-RTE__toolbar__icon__part__stroke, .prokodo-RTE__toolbar__button:hover .prokodo-RTE__toolbar__icon__part__stroke__miter, .prokodo-RTE__toolbar__button.ql-active .prokodo-RTE__toolbar__icon__part__stroke, .prokodo-RTE__toolbar__button.ql-active .prokodo-RTE__toolbar__icon__part__stroke__miter {
+  stroke: var(--pk-rte-accent);
+  opacity: 1;
+}
+.prokodo-RTE__toolbar__button:hover .prokodo-RTE__toolbar__icon__part__fill, .prokodo-RTE__toolbar__button.ql-active .prokodo-RTE__toolbar__icon__part__fill {
+  fill: var(--pk-rte-accent);
+  opacity: 1;
+}
+.prokodo-RTE__toolbar__picker__label {
+  position: relative;
+  padding-right: calc(var(--pk-space-sm) + 18px);
+}
+.prokodo-RTE__toolbar__picker__label::before {
+  content: "Normal";
+  color: var(--pk-rte-icon-color);
+  opacity: 0.85;
+  margin-right: var(--pk-space-xs);
+  white-space: nowrap;
+  font-weight: 400;
+  font-size: 1rem;
+  font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-style: normal;
+  line-height: 1.45;
+  letter-spacing: 0.03em;
+  text-transform: none;
+  text-align: left;
+  text-decoration: none;
+}
+@media screen and (min-width: 480px) {
+  .prokodo-RTE__toolbar__picker__label::before {
     font-size: 0.875rem;
     line-height: 1.4;
   }
 }
 @media screen and (min-width: 960px) {
-  .prokodo-Rating__helperText {
+  .prokodo-RTE__toolbar__picker__label::before {
     font-size: 0.875rem;
     line-height: 1.4;
   }
 }
-:global([data-theme="dark"]) .prokodo-Rating__helperText, :global(.pk-theme-dark) .prokodo-Rating__helperText {
-  color: var(--pk-palette-grey-400);
+.prokodo-RTE__toolbar__picker__label[data-value="1"]::before {
+  content: "H1";
 }
-.prokodo-Rating__helperText__content {
+.prokodo-RTE__toolbar__picker__label[data-value="2"]::before {
+  content: "H2";
+}
+.prokodo-RTE__toolbar__picker__label[data-value="3"]::before {
+  content: "H3";
+}
+.prokodo-RTE__toolbar__picker__options {
+  margin-top: var(--pk-space-xs);
+  padding: var(--pk-space-xs);
+  border-radius: var(--pk-rte-radius-lg);
+  background: var(--pk-rte-picker-bg);
+  border: var(--pk-border-width) solid color-mix(in srgb, var(--pk-rte-accent) 20%, var(--pk-color-border)) !important;
+  box-shadow: var(--pk-rte-picker-shadow);
+  overflow: hidden;
+  min-width: 200px;
+  z-index: var(--pk-z-dropdown);
+}
+.prokodo-RTE__toolbar__picker__item {
+  border-radius: var(--pk-rte-radius);
+  padding: var(--pk-space-sm) var(--pk-space-md);
+  display: flex;
+  align-items: center;
+  gap: var(--pk-space-sm);
+  cursor: pointer;
+  transition: background var(--pk-timing-fast) ease, transform var(--pk-timing-fast) ease;
+  position: relative;
+}
+.prokodo-RTE__toolbar__picker__item::after {
+  content: "";
+  position: absolute;
+  left: 0;
+  top: 20%;
+  bottom: 20%;
+  width: 3px;
+  border-radius: 3px;
+  background: linear-gradient(to bottom, var(--pk-rte-accent), color-mix(in srgb, var(--pk-rte-accent) 60%, var(--pk-color-accent)));
+  opacity: 0;
+  transition: opacity var(--pk-timing-fast) ease;
+}
+.prokodo-RTE__toolbar__picker__item::before {
+  content: "Normal";
+  color: var(--pk-rte-icon-color);
+  font-weight: 400;
+  font-size: 0.875rem;
+  line-height: 1.2;
+}
+.prokodo-RTE__toolbar__picker__item:not([data-value])::before, .prokodo-RTE__toolbar__picker__item[data-value=""]::before {
+  content: "Normal";
+  font-size: 0.875rem;
+  font-weight: 400;
+  opacity: 0.75;
+}
+.prokodo-RTE__toolbar__picker__item[data-value="1"]::before {
+  content: "Heading 1";
+  font-size: 1.375rem;
+  font-weight: 700;
+  letter-spacing: -0.02em;
+}
+.prokodo-RTE__toolbar__picker__item[data-value="2"]::before {
+  content: "Heading 2";
+  font-size: 1.125rem;
+  font-weight: 700;
+  letter-spacing: -0.01em;
+}
+.prokodo-RTE__toolbar__picker__item[data-value="3"]::before {
+  content: "Heading 3";
+  font-size: 1rem;
+  font-weight: 600;
+}
+.prokodo-RTE__toolbar__picker__item:hover {
+  background: var(--pk-rte-picker-hover-bg);
+  transform: translateX(2px);
+}
+.prokodo-RTE__toolbar__picker__item[data-selected=true] {
+  background: var(--pk-rte-picker-active-bg);
+  padding-left: calc(var(--pk-space-md) + 6px);
+}
+.prokodo-RTE__toolbar__picker__item[data-selected=true]::after {
+  opacity: 1;
+}
+.prokodo-RTE__toolbar__picker__item[data-selected=true]::before {
+  color: var(--pk-rte-accent);
+  opacity: 1;
+}
+.prokodo-RTE__toolbar__picker__item:focus-visible {
+  outline: var(--pk-focus-ring-width) solid var(--pk-focus-ring-color);
+  outline-offset: var(--pk-focus-ring-offset);
+}
+.prokodo-RTE__resize {
+  position: absolute;
+  right: var(--pk-space-sm);
+  bottom: var(--pk-space-sm);
+  width: 18px;
+  height: 18px;
+  padding: 0;
+  border: none;
+  background: transparent;
+  color: var(--pk-rte-resize-color);
+  cursor: ns-resize;
+  opacity: var(--pk-rte-resize-opacity);
+}
+.prokodo-RTE__mount {
+  position: relative;
+  height: 200px;
+  border: none;
+  background: transparent;
   width: 100%;
 }
-.prokodo-Rating__helperText__content--is-error {
-  color: var(--pk-rating-error-fg);
+.prokodo-RTE__mount--disabled {
+  cursor: not-allowed;
+  opacity: 0.85;
 }
-
-.prokodo-RichText__a {
-  color: var(--pk-color-brand);
+.prokodo-RTE__tooltip {
+  max-width: calc(100% - var(--pk-space-md) * 2);
+  box-sizing: border-box;
+  border-radius: var(--pk-rte-radius-lg);
+  overflow: hidden;
 }
-.prokodo-RichText__p {
-  color: var(--pk-color-muted);
+.prokodo-RTE__editor {
+  height: 100%;
+  padding: var(--pk-space-md);
+  outline: none;
+  overflow-y: auto;
   font-weight: 400;
   font-size: 1.125rem;
   font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
@@ -5271,178 +6687,229 @@ html[data-theme=dark] .prokodo-List__item__icon {
   text-decoration: none;
 }
 @media screen and (min-width: 480px) {
-  .prokodo-RichText__p {
+  .prokodo-RTE__editor {
     font-size: 1rem;
   }
 }
 @media screen and (min-width: 960px) {
-  .prokodo-RichText__p {
+  .prokodo-RTE__editor {
     font-size: 1rem;
   }
 }
-.prokodo-RichText__p {
-  text-align: inherit;
+.prokodo-RTE__editor p {
+  margin: var(--pk-space-md) 0;
 }
-.prokodo-RichText__pre {
-  color: var(--pk-color-muted);
+.prokodo-RTE__editor p:last-child {
+  margin-bottom: 0;
+}
+.prokodo-RTE__editor ul,
+.prokodo-RTE__editor ol {
+  margin: 0 0 var(--pk-space-sm) 1.25rem;
   padding: 0;
-  border: 1px solid var(--pk-color-border);
-  border-radius: var(--pk-radius-sm);
-  background-color: var(--pk-color-surface-raised);
-  overflow-x: auto;
-  overflow-wrap: break-word;
-  font-weight: 400;
-  font-size: 1rem;
-  font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+}
+.prokodo-RTE__editor pre {
+  margin: var(--pk-space-sm) 0;
+  padding: var(--pk-space-sm);
+  border-radius: var(--pk-rte-radius-lg);
+  overflow: auto;
+  background: var(--pk-rte-code-bg);
+}
+.prokodo-RTE__editor code {
+  background: var(--pk-rte-code-bg);
+  padding: 0 6px;
+  border-radius: 8px;
+}
+.prokodo-RTE__editor img {
+  max-width: 100%;
+  height: auto;
+  border-radius: var(--pk-rte-radius-lg);
+  display: block;
+  margin: var(--pk-space-sm) 0;
+}
+.prokodo-RTE__editor h1,
+.prokodo-RTE__editor h2,
+.prokodo-RTE__editor h3,
+.prokodo-RTE__editor h4,
+.prokodo-RTE__editor h5,
+.prokodo-RTE__editor h6 {
+  margin: var(--pk-space-lg) 0 var(--pk-space-sm) 0;
+}
+.prokodo-RTE__editor > h1:first-child,
+.prokodo-RTE__editor > h2:first-child,
+.prokodo-RTE__editor > h3:first-child,
+.prokodo-RTE__editor > h4:first-child,
+.prokodo-RTE__editor > h5:first-child,
+.prokodo-RTE__editor > h6:first-child {
+  margin-top: 0;
+}
+.prokodo-RTE__editor h1 {
+  font-weight: 900;
+  font-size: 1.75rem;
+  font-family: var(--font-primary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
   font-style: normal;
-  line-height: 1.45;
+  line-height: 1.6;
   letter-spacing: 0.03em;
   text-transform: none;
   text-align: left;
   text-decoration: none;
 }
 @media screen and (min-width: 480px) {
-  .prokodo-RichText__pre {
-    font-size: 0.875rem;
-    line-height: 1.4;
+  .prokodo-RTE__editor h1 {
+    font-size: 2.25rem;
   }
 }
 @media screen and (min-width: 960px) {
-  .prokodo-RichText__pre {
-    font-size: 0.875rem;
-    line-height: 1.4;
+  .prokodo-RTE__editor h1 {
+    font-size: 2.75rem;
   }
 }
-.prokodo-RichText__pre {
-  text-align: inherit;
-}
-.prokodo-RichText__blockquote {
-  background-color: var(--pk-color-surface-raised);
-  border-left: 3px solid var(--pk-color-border);
-  padding: 1px var(--pk-space-lg);
-  margin: 0;
+.prokodo-RTE__editor h2 {
+  font-weight: 700;
+  font-size: 1.5rem;
+  font-family: var(--font-primary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-style: normal;
+  line-height: 1.55;
+  letter-spacing: 0.03em;
+  text-transform: none;
+  text-align: left;
+  text-decoration: none;
 }
-.prokodo-RichText__image {
-  -o-object-fit: cover;
-     object-fit: cover;
-  border-radius: var(--pk-radius-md);
+@media screen and (min-width: 480px) {
+  .prokodo-RTE__editor h2 {
+    font-size: 1.75rem;
+  }
 }
-.prokodo-RichText__image__wrapper {
-  position: relative;
-  display: block;
-  width: 100%;
-  height: 300px;
-  overflow: hidden;
-  border-radius: var(--pk-radius-md);
+@media screen and (min-width: 960px) {
+  .prokodo-RTE__editor h2 {
+    font-size: 2.25rem;
+  }
 }
-.prokodo-RichText__ul, .prokodo-RichText__ol {
-  padding: 0;
-  list-style-type: none;
+.prokodo-RTE__editor h3 {
+  font-weight: 500;
+  font-size: 1.5rem;
+  font-family: var(--font-primary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-style: normal;
+  line-height: 1.5;
+  letter-spacing: 0.03em;
+  text-transform: none;
+  text-align: left;
+  text-decoration: none;
 }
-.prokodo-RichText__li {
-  display: flex;
-  align-items: flex-start;
-  padding-bottom: var(--pk-space-xs);
-  margin-top: 2px;
+@media screen and (min-width: 480px) {
+  .prokodo-RTE__editor h3 {
+    font-size: 1.5rem;
+  }
 }
-.prokodo-RichText__li__icon {
-  flex: 0 0 20px;
-  width: 20px;
-  height: 20px;
-  margin-right: var(--pk-space-sm);
-  padding-top: 2px;
-  line-height: 1;
+@media screen and (min-width: 960px) {
+  .prokodo-RTE__editor h3 {
+    font-size: 1.75rem;
+  }
 }
-.prokodo-RichText__li__content {
-  flex: 1 1 auto;
-  min-width: 0;
-  overflow-wrap: anywhere;
-  display: inline;
+.prokodo-RTE__editor h4 {
   font-weight: 400;
   font-size: 1.125rem;
-  font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-family: var(--font-primary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
   font-style: normal;
-  line-height: 1.55;
+  line-height: 1.5;
   letter-spacing: 0.03em;
   text-transform: none;
   text-align: left;
   text-decoration: none;
 }
 @media screen and (min-width: 480px) {
-  .prokodo-RichText__li__content {
-    font-size: 1rem;
+  .prokodo-RTE__editor h4 {
+    font-size: 1.5rem;
   }
 }
 @media screen and (min-width: 960px) {
-  .prokodo-RichText__li__content {
-    font-size: 1rem;
+  .prokodo-RTE__editor h4 {
+    font-size: 1.5rem;
   }
 }
-.prokodo-RichText__li__content {
-  color: var(--pk-color-fg);
+.prokodo-RTE__editor h5 {
+  font-weight: 400;
+  font-size: 1.125rem;
+  font-family: var(--font-primary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-style: normal;
+  line-height: 1.45;
+  letter-spacing: 0.03em;
+  text-transform: none;
+  text-align: left;
+  text-decoration: none;
 }
-.prokodo-RichText__ol__decimal {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 19px;
-  height: 19px;
-  background-color: var(--pk-color-brand);
-  color: var(--pk-palette-white);
-  border: 1px solid var(--pk-color-brand);
-  border-radius: 200px;
-  margin-right: var(--pk-space-sm);
+.prokodo-RTE__editor h6 {
   font-weight: 400;
   font-size: 1rem;
-  font-family: var(--font-secondary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-family: var(--font-primary), -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
   font-style: normal;
-  line-height: 1.45;
+  line-height: 1.4;
   letter-spacing: 0.03em;
   text-transform: none;
   text-align: left;
   text-decoration: none;
 }
-@media screen and (min-width: 480px) {
-  .prokodo-RichText__ol__decimal {
-    font-size: 0.875rem;
-    line-height: 1.4;
-  }
+[data-theme=dark] .prokodo-RTE, .pk-theme-dark .prokodo-RTE {
+  --pk-rte-toolbar-bg: color-mix(in srgb, var(--pk-color-brand) 14%, var(--pk-palette-slate-950));
+  --pk-rte-icon-color: var(--pk-palette-white);
+  --pk-rte-picker-bg: var(--pk-palette-slate-950);
+  --pk-rte-picker-shadow: 0 10px 40px rgba(0, 0, 0, 0.7),
+                             0 2px 12px rgba(0, 0, 0, 0.4);
 }
-@media screen and (min-width: 960px) {
-  .prokodo-RichText__ol__decimal {
-    font-size: 0.875rem;
-    line-height: 1.4;
-  }
+[data-theme=dark] .prokodo-RTE .ql-snow .ql-stroke, .pk-theme-dark .prokodo-RTE .ql-snow .ql-stroke {
+  stroke: var(--pk-palette-white) !important;
 }
-.prokodo-RichText__ol__decimal {
-  text-align: inherit;
+[data-theme=dark] .prokodo-RTE .ql-snow .ql-fill,
+[data-theme=dark] .prokodo-RTE .ql-snow .ql-stroke.ql-fill, .pk-theme-dark .prokodo-RTE .ql-snow .ql-fill,
+.pk-theme-dark .prokodo-RTE .ql-snow .ql-stroke.ql-fill {
+  fill: var(--pk-palette-white) !important;
 }
-.prokodo-RichText__ol > li {
-  display: -webkit-box;
+[data-theme=dark] .prokodo-RTE .ql-snow .ql-picker, .pk-theme-dark .prokodo-RTE .ql-snow .ql-picker {
+  color: var(--pk-palette-white) !important;
 }
-.prokodo-RichText__ol > li icon--inherit {
-  color: var(--pk-color-fg);
+[data-theme=dark] .prokodo-RTE .ql-snow .ql-picker-label::before, .pk-theme-dark .prokodo-RTE .ql-snow .ql-picker-label::before {
+  color: var(--pk-palette-white) !important;
 }
-.prokodo-RichText__ol > li icon--primary {
-  color: var(--pk-color-brand);
+[data-theme=dark] .prokodo-RTE .ql-toolbar .ql-picker-options, .pk-theme-dark .prokodo-RTE .ql-toolbar .ql-picker-options {
+  background: var(--pk-palette-slate-950) !important;
+  border-color: color-mix(in srgb, var(--pk-color-brand) 30%, transparent) !important;
 }
-.prokodo-RichText__ol > li icon--secondary {
-  color: var(--pk-color-accent);
+[data-theme=dark] .prokodo-RTE .ql-toolbar .ql-picker-item, .pk-theme-dark .prokodo-RTE .ql-toolbar .ql-picker-item {
+  color: var(--pk-palette-white) !important;
 }
-.prokodo-RichText__ol > li icon--info {
-  color: var(--pk-color-muted);
+.prokodo-RTE--primary {
+  --pk-rte-accent: var(--pk-color-brand);
 }
-.prokodo-RichText__ol > li icon--success {
-  color: var(--pk-color-success);
+.prokodo-RTE--secondary {
+  --pk-rte-accent: var(--pk-color-accent);
 }
-.prokodo-RichText__ol > li icon--error {
-  color: var(--pk-color-error);
+.prokodo-RTE--success {
+  --pk-rte-accent: var(--pk-color-success);
 }
-.prokodo-RichText__ol > li icon--warning {
-  color: var(--pk-color-warning);
+.prokodo-RTE--warning {
+  --pk-rte-accent: var(--pk-color-warning);
 }
-.prokodo-RichText__ol > li icon--white {
-  color: var(--pk-palette-white);
+.prokodo-RTE--error {
+  --pk-rte-accent: var(--pk-color-error);
+}
+.prokodo-RTE--info, .prokodo-RTE--inherit, .prokodo-RTE--white {
+  --pk-rte-accent: var(--pk-color-muted);
+}
+[data-theme=dark] .prokodo-RTE--info, [data-theme=dark] .prokodo-RTE--inherit, [data-theme=dark] .prokodo-RTE--white, .pk-theme-dark .prokodo-RTE--info, .pk-theme-dark .prokodo-RTE--inherit, .pk-theme-dark .prokodo-RTE--white {
+  --pk-rte-accent: var(--pk-palette-grey-200);
+}
+.prokodo-RTE--disabled {
+  opacity: 0.9;
+}
+.prokodo-RTE--readonly {
+  opacity: 0.95;
+}
+.prokodo-RTE__hidden {
+  position: absolute;
+  top: auto;
+  left: -99999px;
+  width: 0;
+  height: 0;
+  text-indent: -99999px;
 }
 
 @keyframes selectBorderShift {
@@ -5532,12 +6999,12 @@ html[data-theme=dark] .prokodo-List__item__icon {
   --pk-select-item-hover-bg: color-mix(in srgb, var(--pk-color-muted) 10%, var(--pk-select-bg));
   --pk-select-item-active-bg: color-mix(in srgb, var(--pk-color-muted) 18%, var(--pk-select-bg));
 }
-:global(html[data-theme="dark"]) .prokodo-Select--info, :global([data-theme="dark"]) .prokodo-Select--info, :global(.pk-theme-dark) .prokodo-Select--info, :global(html[data-theme="dark"]) .prokodo-Select--inherit, :global([data-theme="dark"]) .prokodo-Select--inherit, :global(.pk-theme-dark) .prokodo-Select--inherit, :global(html[data-theme="dark"]) .prokodo-Select--white, :global([data-theme="dark"]) .prokodo-Select--white, :global(.pk-theme-dark) .prokodo-Select--white {
+html[data-theme=dark] .prokodo-Select--info, [data-theme=dark] .prokodo-Select--info, .pk-theme-dark .prokodo-Select--info, html[data-theme=dark] .prokodo-Select--inherit, [data-theme=dark] .prokodo-Select--inherit, .pk-theme-dark .prokodo-Select--inherit, html[data-theme=dark] .prokodo-Select--white, [data-theme=dark] .prokodo-Select--white, .pk-theme-dark .prokodo-Select--white {
   --pk-select-gradient-from: var(--pk-palette-grey-100);
   --pk-select-gradient-to: var(--pk-palette-grey-200);
   --pk-select-label-fg: var(--pk-palette-grey-200);
 }
-:global(html[data-theme="dark"]) .prokodo-Select, :global([data-theme="dark"]) .prokodo-Select, :global(.pk-theme-dark) .prokodo-Select {
+html[data-theme=dark] .prokodo-Select, [data-theme=dark] .prokodo-Select, .pk-theme-dark .prokodo-Select {
   --pk-select-item-hover-bg: color-mix(in srgb, var(--pk-select-gradient-from) 15%, var(--pk-select-bg));
   --pk-select-item-active-bg: color-mix(in srgb, var(--pk-select-gradient-from) 25%, var(--pk-select-bg));
   --pk-select-fg-placeholder: var(--pk-palette-grey-400);
@@ -5780,7 +7247,7 @@ html[data-theme=dark] .prokodo-List__item__icon {
   --pk-select-item-hover-bg: color-mix(in srgb, var(--pk-color-muted) 10%, var(--pk-select-bg));
   --pk-select-item-active-bg: color-mix(in srgb, var(--pk-color-muted) 18%, var(--pk-select-bg));
 }
-:global(html[data-theme="dark"]) .prokodo-Select__listbox, :global([data-theme="dark"]) .prokodo-Select__listbox, :global(.pk-theme-dark) .prokodo-Select__listbox {
+html[data-theme=dark] .prokodo-Select__listbox, [data-theme=dark] .prokodo-Select__listbox, .pk-theme-dark .prokodo-Select__listbox {
   --pk-select-item-hover-bg: color-mix(in srgb, var(--pk-select-gradient-from) 15%, var(--pk-select-bg));
   --pk-select-item-active-bg: color-mix(in srgb, var(--pk-select-gradient-from) 25%, var(--pk-select-bg));
   --pk-select-fg: var(--pk-color-fg);
@@ -5937,7 +7404,7 @@ html[data-theme=dark] .prokodo-List__item__icon {
   --pk-select-item-hover-bg: color-mix(in srgb, var(--pk-color-muted) 10%, var(--pk-select-bg));
   --pk-select-item-active-bg: color-mix(in srgb, var(--pk-color-muted) 18%, var(--pk-select-bg));
 }
-:global(html[data-theme="dark"]) .prokodo-Select__sheet, :global([data-theme="dark"]) .prokodo-Select__sheet, :global(.pk-theme-dark) .prokodo-Select__sheet {
+html[data-theme=dark] .prokodo-Select__sheet, [data-theme=dark] .prokodo-Select__sheet, .pk-theme-dark .prokodo-Select__sheet {
   --pk-select-item-hover-bg: color-mix(in srgb, var(--pk-select-gradient-from) 15%, var(--pk-select-bg));
   --pk-select-item-active-bg: color-mix(in srgb, var(--pk-select-gradient-from) 25%, var(--pk-select-bg));
   --pk-select-fg: var(--pk-color-fg);
@@ -7114,10 +8581,10 @@ html[data-theme=dark] .prokodo-Skeleton::after {
 .prokodo-Switch--inherit {
   --pk-switch-active: currentColor;
 }
-:global([data-theme="dark"]) .prokodo-Switch--info, :global(.pk-theme-dark) .prokodo-Switch--info {
+[data-theme=dark] .prokodo-Switch--info, .pk-theme-dark .prokodo-Switch--info {
   --pk-switch-active: var(--pk-palette-grey-300);
 }
-:global([data-theme="dark"]) .prokodo-Switch--inherit, :global(.pk-theme-dark) .prokodo-Switch--inherit {
+[data-theme=dark] .prokodo-Switch--inherit, .pk-theme-dark .prokodo-Switch--inherit {
   --pk-switch-active: var(--pk-color-fg);
 }
 .prokodo-Switch__label {
@@ -7219,17 +8686,17 @@ html[data-theme=dark] .prokodo-Skeleton::after {
 .prokodo-Switch__icon--isActive {
   color: var(--pk-color-fg);
 }
-:global([data-theme="dark"]) .prokodo-Switch__thumb, :global(.pk-theme-dark) .prokodo-Switch__thumb {
+[data-theme=dark] .prokodo-Switch__thumb, .pk-theme-dark .prokodo-Switch__thumb {
   --pk-switch-thumb-bg: #ffffff;
   --pk-switch-thumb-checked-bg: #ffffff;
 }
-:global([data-theme="dark"]) .prokodo-Switch__icon__wrapper, :global(.pk-theme-dark) .prokodo-Switch__icon__wrapper, :global([data-theme="dark"]) .prokodo-Switch__icon, :global(.pk-theme-dark) .prokodo-Switch__icon {
+[data-theme=dark] .prokodo-Switch__icon__wrapper, .pk-theme-dark .prokodo-Switch__icon__wrapper, [data-theme=dark] .prokodo-Switch__icon, .pk-theme-dark .prokodo-Switch__icon {
   color: #000000;
 }
-:global([data-theme="dark"]) .prokodo-Switch--inherit .prokodo-Switch__thumb--checked, :global(.pk-theme-dark) .prokodo-Switch--inherit .prokodo-Switch__thumb--checked {
+[data-theme=dark] .prokodo-Switch--inherit .prokodo-Switch__thumb--checked, .pk-theme-dark .prokodo-Switch--inherit .prokodo-Switch__thumb--checked {
   --pk-switch-thumb-checked-bg: #000000;
 }
-:global([data-theme="dark"]) .prokodo-Switch--inherit .prokodo-Switch__icon--isActive, :global(.pk-theme-dark) .prokodo-Switch--inherit .prokodo-Switch__icon--isActive {
+[data-theme=dark] .prokodo-Switch--inherit .prokodo-Switch__icon--isActive, .pk-theme-dark .prokodo-Switch--inherit .prokodo-Switch__icon--isActive {
   color: #ffffff;
 }
 .prokodo-Switch--disabled, .prokodo-Switch__control--disabled {
@@ -7370,7 +8837,7 @@ html[data-theme=dark] .prokodo-Skeleton::after {
 .prokodo-Tabs {
   width: 100%;
 }
-:global(.pk-theme-dark) .prokodo-Tabs {
+.pk-theme-dark .prokodo-Tabs {
   --pk-tabs-border: var(--pk-palette-grey-500);
 }
 .prokodo-Tabs--vertical {