@orangecatai/adgen-canvas 0.0.5 → 0.0.7

package/dist/dev/index.css

@@ -3312,6 +3312,7 @@
   display: flex;
   align-items: center;
   gap: 2px;
+  position: relative;
 }
 .excalidraw .frame-toolbar__divider {
   width: 1px;
@@ -3490,6 +3491,356 @@
   color: var(--color-primary, #4a90d9);
 }
 
+/* components/auto-resize/AutoResizePanel.scss */
+@keyframes ars-shimmer-sweep {
+  0% {
+    background-position: 200% 0;
+  }
+  100% {
+    background-position: -200% 0;
+  }
+}
+.ars-shimmer {
+  background: rgba(180, 200, 230, 0.12);
+}
+.ars-shimmer::after {
+  content: "";
+  display: block;
+  position: absolute;
+  inset: 0;
+  background:
+    linear-gradient(
+      90deg,
+      transparent 0%,
+      rgba(255, 255, 255, 0.45) 50%,
+      transparent 100%);
+  background-size: 200% 100%;
+  animation: ars-shimmer-sweep 1.6s ease-in-out infinite;
+}
+.excalidraw .arp {
+  position: absolute;
+  z-index: var(--zIndex-canvasButtons);
+  top: calc(100% + 6px);
+  left: 50%;
+  transform: translateX(-50%);
+  width: 296px;
+  background: var(--island-bg-color);
+  border-radius: 10px;
+  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.14), 0 0 0 1px rgba(0, 0, 0, 0.06);
+  font-size: 12px;
+  font-family:
+    "Assistant",
+    system-ui,
+    -apple-system,
+    sans-serif;
+  color: var(--text-primary-color, #333);
+  pointer-events: all;
+  overflow: hidden;
+}
+.excalidraw .arp-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 10px 12px 8px;
+  border-bottom: 1px solid var(--default-border-color, #e4e4e7);
+}
+.excalidraw .arp-header__title {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  font-weight: 600;
+  font-size: 13px;
+}
+.excalidraw .arp-header__title svg {
+  color: var(--color-primary, #4a90d9);
+}
+.excalidraw .arp-header__close {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 22px;
+  height: 22px;
+  border: none;
+  background: transparent;
+  border-radius: 4px;
+  cursor: pointer;
+  padding: 0;
+  color: var(--text-secondary-color, #888);
+  transition: background 0.12s ease;
+}
+.excalidraw .arp-header__close:hover {
+  background: var(--button-hover-bg, rgba(0, 0, 0, 0.06));
+  color: var(--text-primary-color, #333);
+}
+.excalidraw .arp-source {
+  padding: 5px 12px;
+  font-size: 11px;
+  color: var(--text-secondary-color, #888);
+  background: var(--default-bg-color, rgba(0, 0, 0, 0.02));
+  border-bottom: 1px solid var(--default-border-color, #e4e4e7);
+}
+.excalidraw .arp-section-label {
+  padding: 8px 12px 4px;
+  font-size: 10px;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  color: var(--text-secondary-color, #888);
+}
+.excalidraw .arp-presets {
+  padding: 0 8px 4px;
+  display: flex;
+  flex-direction: column;
+  gap: 1px;
+}
+.excalidraw .arp-preset {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 6px 8px;
+  border: none;
+  border-radius: 6px;
+  background: transparent;
+  cursor: pointer;
+  text-align: left;
+  font-size: 12px;
+  font-family: inherit;
+  color: var(--text-primary-color, #333);
+  transition: background 0.12s ease;
+  width: 100%;
+}
+.excalidraw .arp-preset:hover:not(.excalidraw .arp-preset--disabled) {
+  background: var(--button-hover-bg, rgba(0, 0, 0, 0.05));
+}
+.excalidraw .arp-preset--selected {
+  background: rgba(74, 144, 217, 0.08);
+  color: var(--text-primary-color, #333);
+}
+.excalidraw .arp-preset--disabled {
+  cursor: default;
+  opacity: 0.7;
+}
+.excalidraw .arp-preset__check {
+  width: 14px;
+  height: 14px;
+  border: 1.5px solid var(--default-border-color, #d0d0d0);
+  border-radius: 3px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  background: transparent;
+  transition: background 0.12s ease, border-color 0.12s ease;
+}
+.arp-preset--selected .excalidraw .arp-preset__check {
+  background: var(--color-primary, #4a90d9);
+  border-color: var(--color-primary, #4a90d9);
+  color: white;
+}
+.excalidraw .arp-preset__label {
+  font-weight: 500;
+  flex: 0 0 auto;
+  min-width: 80px;
+}
+.excalidraw .arp-preset__desc {
+  font-size: 11px;
+  color: var(--text-secondary-color, #999);
+  flex: 1;
+}
+.excalidraw .arp-preset__status {
+  flex-shrink: 0;
+  margin-left: auto;
+}
+.excalidraw .arp-extras {
+  padding: 4px 12px;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px;
+}
+.excalidraw .arp-extra-tag {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  padding: 3px 8px;
+  border-radius: 12px;
+  background: var(--color-primary-light, rgba(74, 144, 217, 0.1));
+  color: var(--color-primary, #4a90d9);
+  font-size: 11px;
+  font-weight: 500;
+}
+.excalidraw .arp-extra-tag__remove {
+  border: none;
+  background: transparent;
+  padding: 0;
+  cursor: pointer;
+  color: inherit;
+  opacity: 0.6;
+  font-size: 13px;
+  line-height: 1;
+  margin-left: 2px;
+}
+.excalidraw .arp-extra-tag__remove:hover {
+  opacity: 1;
+}
+.excalidraw .arp-custom-row {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 4px 12px 10px;
+}
+.excalidraw .arp-custom-input {
+  width: 56px;
+  padding: 5px 6px;
+  border: 1px solid var(--default-border-color, #e4e4e7);
+  border-radius: 5px;
+  font-size: 12px;
+  text-align: center;
+  font-family: inherit;
+  color: var(--text-primary-color, #333);
+  background: var(--input-bg-color, #fff);
+  outline: none;
+  transition: border-color 0.12s ease;
+  -moz-appearance: textfield;
+}
+.excalidraw .arp-custom-input:focus {
+  border-color: var(--color-primary, #4a90d9);
+}
+.excalidraw .arp-custom-input::-webkit-outer-spin-button,
+.excalidraw .arp-custom-input::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+.excalidraw .arp-custom-x {
+  font-size: 12px;
+  color: var(--text-secondary-color, #aaa);
+}
+.excalidraw .arp-custom-add {
+  flex: 1;
+  padding: 5px 8px;
+  border: 1px solid var(--default-border-color, #e4e4e7);
+  border-radius: 5px;
+  background: transparent;
+  font-size: 12px;
+  font-family: inherit;
+  cursor: pointer;
+  color: var(--color-primary, #4a90d9);
+  transition: background 0.12s ease, border-color 0.12s ease;
+  white-space: nowrap;
+}
+.excalidraw .arp-custom-add:hover:not(:disabled) {
+  background: rgba(74, 144, 217, 0.06);
+  border-color: var(--color-primary, #4a90d9);
+}
+.excalidraw .arp-custom-add:disabled {
+  opacity: 0.4;
+  cursor: default;
+}
+.excalidraw .arp-status {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 16px;
+  height: 16px;
+}
+.excalidraw .arp-status--waiting {
+  color: var(--text-secondary-color, #bbb);
+  font-size: 11px;
+}
+.excalidraw .arp-status--running {
+  color: var(--color-primary, #4a90d9);
+}
+.excalidraw .arp-status--done {
+  color: #22c55e;
+}
+.excalidraw .arp-status--error {
+  color: #ef4444;
+}
+.excalidraw .arp-spinner {
+  animation: arp-spin 0.9s linear infinite;
+}
+@keyframes arp-spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+.excalidraw .arp-progress {
+  padding: 8px 12px;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  border-top: 1px solid var(--default-border-color, #e4e4e7);
+}
+.excalidraw .arp-progress__bar-bg {
+  flex: 1;
+  height: 4px;
+  background: var(--default-border-color, #e8e8e8);
+  border-radius: 2px;
+  overflow: hidden;
+}
+.excalidraw .arp-progress__bar-fill {
+  height: 100%;
+  background: var(--color-primary, #4a90d9);
+  border-radius: 2px;
+  transition: width 0.3s ease;
+}
+.excalidraw .arp-progress__text {
+  font-size: 11px;
+  color: var(--text-secondary-color, #888);
+  white-space: nowrap;
+}
+.excalidraw .arp-error {
+  margin: 4px 12px;
+  padding: 8px 10px;
+  border-radius: 6px;
+  background: rgba(239, 68, 68, 0.08);
+  color: #ef4444;
+  font-size: 11px;
+  line-height: 1.4;
+}
+.excalidraw .arp-actions {
+  padding: 8px 12px 10px;
+  display: flex;
+  gap: 6px;
+  border-top: 1px solid var(--default-border-color, #e4e4e7);
+}
+.excalidraw .arp-btn {
+  flex: 1;
+  padding: 7px 12px;
+  border-radius: 6px;
+  border: none;
+  font-size: 12px;
+  font-family: inherit;
+  font-weight: 500;
+  cursor: pointer;
+  transition: background 0.12s ease, opacity 0.12s ease;
+}
+.excalidraw .arp-btn:disabled {
+  opacity: 0.45;
+  cursor: default;
+}
+.excalidraw .arp-btn--primary {
+  background: var(--color-primary, #4a90d9);
+  color: #fff;
+}
+.excalidraw .arp-btn--primary:hover:not(:disabled) {
+  background: var(--color-primary-darker, #3a7bc8);
+}
+.excalidraw .arp-btn--cancel {
+  background: rgba(239, 68, 68, 0.1);
+  color: #ef4444;
+}
+.excalidraw .arp-btn--cancel:hover {
+  background: rgba(239, 68, 68, 0.18);
+}
+.excalidraw .arp-btn--ghost {
+  background: transparent;
+  color: var(--text-secondary-color, #777);
+  border: 1px solid var(--default-border-color, #e4e4e7);
+}
+.excalidraw .arp-btn--ghost:hover {
+  background: var(--button-hover-bg, rgba(0, 0, 0, 0.04));
+}
+
 /* components/ImageGeneratorPanel.scss */
 .excalidraw .igp {
   position: absolute;
@@ -3508,11 +3859,25 @@
 .excalidraw .igp input[type=file] {
   display: none !important;
 }
-.excalidraw .igp textarea,
 .excalidraw .igp input[type=text] {
   all: unset !important;
   box-sizing: border-box !important;
 }
+.excalidraw .igp textarea {
+  margin: 0 !important;
+  padding: 0 !important;
+  border: none !important;
+  background: transparent !important;
+  font: inherit !important;
+  color: inherit !important;
+  letter-spacing: inherit !important;
+  word-spacing: inherit !important;
+  text-transform: none !important;
+  text-indent: 0 !important;
+  text-shadow: none !important;
+  text-align: start !important;
+  box-sizing: border-box !important;
+}
 .excalidraw .igp button {
   all: unset !important;
   box-sizing: border-box !important;
@@ -3530,9 +3895,7 @@
 .excalidraw .igp .igp-textarea {
   display: block !important;
   width: 100% !important;
-  min-height: 80px !important;
-  max-height: 180px !important;
-  overflow-y: auto !important;
+  min-height: 72px !important;
   resize: none !important;
   padding: 14px 16px 8px !important;
   font-family: inherit !important;
@@ -3544,6 +3907,7 @@
   outline: none !important;
   box-shadow: none !important;
   -webkit-appearance: none !important;
+  appearance: none !important;
 }
 .excalidraw .igp .igp-textarea::placeholder {
   color: #b8b8b8 !important;
@@ -3787,21 +4151,170 @@
 .excalidraw .iqep__trigger-btn svg {
   color: var(--color-primary, #4a90d9);
 }
-.excalidraw .iqep__trigger-btn:hover {
-  background: var(--button-hover-bg, rgba(74, 144, 217, 0.08));
+.excalidraw .iqep__trigger-btn:hover {
+  background: var(--button-hover-bg, rgba(74, 144, 217, 0.08));
+}
+.excalidraw .iqep__ref-chip {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 8px 14px 4px;
+  font-size: 11px;
+  font-weight: 500;
+  color: var(--text-secondary-color, #888);
+}
+.excalidraw .iqep__ref-chip svg {
+  flex-shrink: 0;
+  color: var(--text-secondary-color, #aaa);
+}
+
+/* components/ImageEditToolbar.scss */
+.excalidraw .iet {
+  position: absolute;
+  transform: translateX(-50%);
+  z-index: 10;
+  pointer-events: auto;
+}
+.excalidraw .iet__bar {
+  display: flex;
+  align-items: center;
+  gap: 2px;
+  background: var(--island-bg-color, #fff);
+  border-radius: 24px;
+  padding: 4px 6px;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12), 0 0 0 1px rgba(0, 0, 0, 0.06);
+  white-space: nowrap;
+}
+.excalidraw .iet__tool-btn {
+  display: flex;
+  align-items: center;
+  gap: 5px;
+  padding: 6px 10px;
+  border: none;
+  background: none;
+  cursor: pointer;
+  border-radius: 16px;
+  font-size: 12px;
+  font-weight: 500;
+  color: var(--text-primary-color, #333);
+  transition: background 0.12s;
+  white-space: nowrap;
+  font-family: inherit;
+  position: relative;
+}
+.excalidraw .iet__tool-btn svg {
+  flex-shrink: 0;
+  color: var(--icon-fill-color, #555);
+}
+.excalidraw .iet__tool-btn:hover {
+  background: var(--color-surface-low, #f0f0f0);
+}
+.excalidraw .iet__tool-btn:active {
+  background: var(--color-surface-mid, #e5e5e5);
+}
+.excalidraw .iet__tool-btn:disabled {
+  cursor: not-allowed;
+  opacity: 0.55;
+}
+.excalidraw .iet__tool-label {
+  font-size: 12px;
+  line-height: 1;
+}
+.excalidraw .iet__tool-badge {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 9px;
+  font-weight: 600;
+  padding: 1px 4px;
+  border-radius: 4px;
+  background: var(--color-surface-mid, #e8e8e8);
+  color: var(--text-primary-color, #555);
+  line-height: 1.2;
+}
+.excalidraw .iet__overflow-wrapper {
+  position: relative;
+}
+.excalidraw .iet__overflow-trigger {
+  padding: 6px 8px;
+}
+.excalidraw .iet__notification-dot {
+  position: absolute;
+  top: 4px;
+  right: 4px;
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: #ef4444;
+}
+.excalidraw .iet__overflow-menu {
+  position: absolute;
+  top: calc(100% + 6px);
+  right: 0;
+  background: var(--island-bg-color, #fff);
+  border-radius: 12px;
+  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.06);
+  padding: 6px;
+  min-width: 160px;
+  z-index: 100;
+}
+.excalidraw .iet__overflow-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  width: 100%;
+  padding: 8px 12px;
+  border: none;
+  background: none;
+  cursor: pointer;
+  border-radius: 8px;
+  font-size: 13px;
+  font-weight: 500;
+  color: var(--text-primary-color, #333);
+  font-family: inherit;
+  transition: background 0.1s;
+}
+.excalidraw .iet__overflow-item svg {
+  flex-shrink: 0;
+  color: var(--icon-fill-color, #555);
+}
+.excalidraw .iet__overflow-item:hover {
+  background: var(--color-surface-low, #f5f5f5);
 }
-.excalidraw .iqep__ref-chip {
+.excalidraw .iet__overflow-item span:first-of-type {
+  flex: 1;
+  text-align: left;
+}
+.excalidraw .iet__overflow-badge {
+  font-size: 11px;
+  color: var(--icon-fill-color, #999);
   display: flex;
   align-items: center;
-  gap: 6px;
-  padding: 8px 14px 4px;
-  font-size: 11px;
-  font-weight: 500;
-  color: var(--text-secondary-color, #888);
+  gap: 2px;
 }
-.excalidraw .iqep__ref-chip svg {
+.excalidraw .iet__divider {
+  width: 1px;
+  height: 20px;
+  background: var(--color-gray-30, #ddd);
+  margin: 0 4px;
   flex-shrink: 0;
-  color: var(--text-secondary-color, #aaa);
+}
+.excalidraw .iet__download-btn {
+  padding: 6px 8px;
+}
+.excalidraw .iet__status {
+  margin-top: 8px;
+  border-radius: 12px;
+  background: var(--island-bg-color, #fff);
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.05);
+  color: var(--text-primary-color, #333);
+  font-size: 12px;
+  line-height: 1.35;
+  padding: 8px 10px;
+  max-width: 320px;
+}
+.excalidraw .iet__status--error {
+  color: var(--color-danger, #c62828);
 }
 
 /* components/Popover.scss */
@@ -4234,6 +4747,314 @@
   max-height: 50vh;
 }
 
+/* components/ColorPicker/AdvancedColorPicker.scss */
+.excalidraw .adv-cp {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  user-select: none;
+  -webkit-user-select: none;
+}
+.excalidraw .adv-cp__saturation {
+  position: relative;
+  width: 100%;
+  aspect-ratio: 1.35/1;
+  border-radius: 10px;
+  overflow: hidden;
+  cursor: crosshair;
+  touch-action: none;
+}
+.excalidraw .adv-cp__saturation-white {
+  position: absolute;
+  inset: 0;
+  background:
+    linear-gradient(
+      to right,
+      #fff,
+      transparent);
+  border-radius: inherit;
+}
+.excalidraw .adv-cp__saturation-black {
+  position: absolute;
+  inset: 0;
+  background:
+    linear-gradient(
+      to bottom,
+      transparent,
+      #000);
+  border-radius: inherit;
+}
+.excalidraw .adv-cp__handle {
+  position: absolute;
+  width: 18px;
+  height: 18px;
+  border-radius: 50%;
+  border: 2.5px solid #fff;
+  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15), 0 2px 6px rgba(0, 0, 0, 0.18);
+  transform: translate(-50%, -50%);
+  pointer-events: none;
+  z-index: 2;
+}
+.excalidraw .adv-cp__slider {
+  position: relative;
+  width: 100%;
+  height: 14px;
+  border-radius: 7px;
+  cursor: pointer;
+  touch-action: none;
+}
+.excalidraw .adv-cp__slider-handle {
+  position: absolute;
+  top: 50%;
+  width: 18px;
+  height: 18px;
+  border-radius: 50%;
+  border: 2.5px solid #fff;
+  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12), 0 2px 6px rgba(0, 0, 0, 0.15);
+  transform: translate(-50%, -50%);
+  pointer-events: none;
+  z-index: 2;
+}
+.excalidraw .adv-cp__hue-slider {
+  background:
+    linear-gradient(
+      to right,
+      hsl(0, 100%, 50%),
+      hsl(30, 100%, 50%),
+      hsl(60, 100%, 50%),
+      hsl(90, 100%, 50%),
+      hsl(120, 100%, 50%),
+      hsl(150, 100%, 50%),
+      hsl(180, 100%, 50%),
+      hsl(210, 100%, 50%),
+      hsl(240, 100%, 50%),
+      hsl(270, 100%, 50%),
+      hsl(300, 100%, 50%),
+      hsl(330, 100%, 50%),
+      hsl(0, 100%, 50%));
+}
+.excalidraw .adv-cp__alpha-slider {
+  overflow: hidden;
+}
+.excalidraw .adv-cp__alpha-checker {
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  background-image: repeating-conic-gradient(#d0d0d0 0% 25%, #fff 0% 50%);
+  background-size: 10px 10px;
+}
+.excalidraw .adv-cp__alpha-gradient {
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+}
+.excalidraw .adv-cp__presets {
+  display: flex;
+  gap: 10px;
+  justify-content: flex-start;
+  flex-wrap: wrap;
+}
+.excalidraw .adv-cp__preset-btn {
+  position: relative;
+  width: 32px;
+  height: 32px;
+  border-radius: 50%;
+  border: 2px solid var(--color-gray-30, #d9d9d9);
+  cursor: pointer;
+  padding: 0;
+  box-sizing: border-box;
+  transition: box-shadow 0.15s, transform 0.1s;
+  overflow: hidden;
+  background: none;
+}
+.excalidraw .adv-cp__preset-btn:hover {
+  transform: scale(1.08);
+}
+.excalidraw .adv-cp__preset-btn.active {
+  box-shadow: 0 0 0 2px var(--color-primary, #6965db);
+}
+.excalidraw .adv-cp__preset-btn.is-transparent {
+  background-image: repeating-conic-gradient(#d0d0d0 0% 25%, #fff 0% 50%);
+  background-size: 8px 8px;
+}
+.excalidraw .adv-cp__preset-slash {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 130%;
+  height: 2px;
+  background: #e03131;
+  transform: translate(-50%, -50%) rotate(-45deg);
+  pointer-events: none;
+}
+.excalidraw .adv-cp__inputs {
+  display: flex;
+  gap: 8px;
+}
+.excalidraw .adv-cp__hex-input {
+  display: flex;
+  align-items: center;
+  flex: 1;
+  border: 1px solid var(--default-border-color, #e0e0e0);
+  border-radius: 8px;
+  padding: 0 10px;
+  height: 36px;
+  box-sizing: border-box;
+  background: var(--island-bg-color, #fff);
+}
+.excalidraw .adv-cp__hex-input:focus-within {
+  box-shadow: 0 0 0 1px var(--color-primary-darkest, #5b57d1);
+}
+.excalidraw .adv-cp__hex-input input {
+  flex: 1;
+  min-width: 0;
+  margin: 0;
+  padding: 0;
+  border: 0;
+  outline: none;
+  box-shadow: none;
+  appearance: none;
+  background: transparent;
+  font-size: 13px;
+  font-family: inherit;
+  color: var(--text-primary-color, #1b1b1f);
+  letter-spacing: 0.5px;
+  height: 100%;
+  box-sizing: border-box;
+}
+.excalidraw .adv-cp__hex-input input:focus,
+.excalidraw .adv-cp__hex-input input:focus-visible {
+  outline: none;
+  box-shadow: none;
+}
+.excalidraw .adv-cp__hash {
+  color: var(--input-label-color, #868e96);
+  font-size: 13px;
+  margin-right: 4px;
+  font-weight: 500;
+}
+.excalidraw .adv-cp__alpha-input {
+  display: flex;
+  align-items: center;
+  width: 72px;
+  flex-shrink: 0;
+  border: 1px solid var(--default-border-color, #e0e0e0);
+  border-radius: 8px;
+  padding: 0 8px;
+  height: 36px;
+  box-sizing: border-box;
+  background: var(--island-bg-color, #fff);
+}
+.excalidraw .adv-cp__alpha-input:focus-within {
+  box-shadow: 0 0 0 1px var(--color-primary-darkest, #5b57d1);
+}
+.excalidraw .adv-cp__alpha-input input {
+  flex: 1;
+  min-width: 0;
+  margin: 0;
+  padding: 0;
+  border: 0;
+  outline: none;
+  box-shadow: none;
+  appearance: none;
+  background: transparent;
+  font-size: 12px;
+  font-family: inherit;
+  color: var(--text-primary-color, #1b1b1f);
+  height: 100%;
+  text-align: right;
+  box-sizing: border-box;
+}
+.excalidraw .adv-cp__alpha-input input:focus,
+.excalidraw .adv-cp__alpha-input input:focus-visible {
+  outline: none;
+  box-shadow: none;
+}
+.excalidraw .adv-cp__percent {
+  color: var(--input-label-color, #868e96);
+  font-size: 12px;
+  margin-left: 3px;
+  font-weight: 500;
+  flex-shrink: 0;
+}
+
+/* components/CanvasBackgroundSwatch.scss */
+.excalidraw .canvas-bg-swatch-wrapper {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+}
+.excalidraw .canvas-bg-swatch {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 24px;
+  height: 24px;
+  padding: 0;
+  border: none;
+  background: none;
+  cursor: pointer;
+  border-radius: 50%;
+}
+.excalidraw .canvas-bg-swatch:hover .canvas-bg-swatch__color {
+  box-shadow: 0 0 0 2px var(--color-primary);
+}
+.excalidraw .canvas-bg-swatch__color {
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+  border: 1.5px solid var(--color-gray-40);
+  box-sizing: border-box;
+  overflow: hidden;
+  position: relative;
+  transition: box-shadow 0.12s;
+}
+.excalidraw .canvas-bg-swatch__transparent {
+  width: 100%;
+  height: 100%;
+  background-image: repeating-conic-gradient(#d0d0d0 0% 25%, #fff 0% 50%);
+  background-size: 8px 8px;
+}
+.excalidraw .canvas-bg-swatch__popover {
+  position: absolute;
+  bottom: calc(100% + 8px);
+  left: 0;
+  z-index: 100;
+  background: var(--island-bg-color);
+  border-radius: 12px;
+  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.15), 0 0 0 1px var(--color-surface-lowest);
+  padding: 16px;
+  min-width: 260px;
+}
+.excalidraw .canvas-bg-swatch__popover-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 12px;
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--text-primary-color);
+}
+.excalidraw .canvas-bg-swatch__close {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 24px;
+  height: 24px;
+  border: none;
+  background: none;
+  cursor: pointer;
+  color: var(--text-primary-color);
+  font-size: 14px;
+  border-radius: 4px;
+}
+.excalidraw .canvas-bg-swatch__close:hover {
+  background: var(--color-surface-mid);
+}
+.excalidraw .canvas-bg-swatch__picker-content .color-picker-content {
+  padding: 0;
+}
+
 /* components/Sidebar/SidebarTrigger.scss */
 .excalidraw .sidebar-trigger {
   display: flex;
@@ -8812,6 +9633,12 @@ body.excalidraw-cursor-resize * {
   .text-zinc-950 {
     color: var(--color-zinc-950);
   }
+  .capitalize {
+    text-transform: capitalize;
+  }
+  .lowercase {
+    text-transform: lowercase;
+  }
   .uppercase {
     text-transform: uppercase;
   }
@@ -8902,6 +9729,34 @@ body.excalidraw-cursor-resize * {
   .filter {
     filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
   }
+  .transition {
+    transition-property:
+      color,
+      background-color,
+      border-color,
+      outline-color,
+      text-decoration-color,
+      fill,
+      stroke,
+      --tw-gradient-from,
+      --tw-gradient-via,
+      --tw-gradient-to,
+      opacity,
+      box-shadow,
+      transform,
+      translate,
+      scale,
+      rotate,
+      filter,
+      -webkit-backdrop-filter,
+      backdrop-filter,
+      display,
+      content-visibility,
+      overlay,
+      pointer-events;
+    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+    transition-duration: var(--tw-duration, var(--default-transition-duration));
+  }
   .transition-all {
     transition-property: all;
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -9427,12 +10282,26 @@ body.excalidraw-cursor-resize * {
 .excalidraw .acp input[type=file] {
   display: none !important;
 }
-.excalidraw .acp textarea,
 .excalidraw .acp input[type=text],
 .excalidraw .acp input[type=search] {
   all: unset !important;
   box-sizing: border-box !important;
 }
+.excalidraw .acp textarea {
+  margin: 0 !important;
+  padding: 0 !important;
+  border: none !important;
+  background: transparent !important;
+  font: inherit !important;
+  color: inherit !important;
+  letter-spacing: inherit !important;
+  word-spacing: inherit !important;
+  text-transform: none !important;
+  text-indent: 0 !important;
+  text-shadow: none !important;
+  text-align: start !important;
+  box-sizing: border-box !important;
+}
 .excalidraw .acp button {
   all: unset !important;
   box-sizing: border-box !important;
@@ -9866,14 +10735,17 @@ body.excalidraw-cursor-resize * {
   box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06) !important;
   padding: 0 !important;
   cursor: text !important;
+  overflow: hidden !important;
 }
 .excalidraw .acp .acp-textarea {
   display: block !important;
   width: 100% !important;
-  min-height: 44px !important;
-  max-height: 160px !important;
-  overflow-y: auto !important;
+  box-sizing: border-box !important;
+  min-height: 56px !important;
   resize: none !important;
+  overflow-x: hidden !important;
+  word-wrap: break-word !important;
+  white-space: pre-wrap !important;
   padding: 14px 16px 6px !important;
   font-family: inherit !important;
   font-size: 14px !important;
@@ -9883,6 +10755,7 @@ body.excalidraw-cursor-resize * {
   border: none !important;
   outline: none !important;
   -webkit-appearance: none !important;
+  appearance: none !important;
 }
 .excalidraw .acp .acp-textarea::placeholder {
   color: #bbb !important;
@@ -10254,23 +11127,32 @@ body.excalidraw-cursor-resize * {
   display: flex !important;
   align-items: center !important;
   justify-content: center !important;
-  width: 36px !important;
+  gap: 6px !important;
   height: 36px !important;
-  border-radius: 50% !important;
-  background: #fff !important;
-  border: 1px solid rgba(0, 0, 0, 0.1) !important;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
-  color: #333 !important;
+  padding: 0 14px !important;
+  border-radius: 20px !important;
+  background: var(--island-bg-color, #fff) !important;
+  border: 1px solid var(--color-surface-lowest, rgba(0, 0, 0, 0.1)) !important;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
+  color: var(--text-primary-color, #333) !important;
   cursor: pointer !important;
   transition: background 0.12s, box-shadow 0.12s !important;
   box-sizing: border-box !important;
+  font-size: 13px !important;
+  font-weight: 500 !important;
+  font-family: inherit !important;
+  white-space: nowrap !important;
+}
+.excalidraw .acp-open-btn svg {
+  flex-shrink: 0;
+  color: var(--icon-fill-color, #666);
 }
 .excalidraw .acp-open-btn:hover {
-  background: #f5f5f5 !important;
-  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.14) !important;
+  background: var(--color-surface-low, #f5f5f5) !important;
+  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12) !important;
 }
 .excalidraw .acp-open-btn:active {
-  transform: scale(0.95) !important;
+  transform: scale(0.97) !important;
 }
 /*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
 /*# sourceMappingURL=index.css.map */