@bluechaine/print-designer 0.1.0

package/dist/vue2/style.css

@@ -0,0 +1,2657 @@
+@charset "UTF-8";
+*, ::before, ::after{
+  --tw-border-spacing-x: 0;
+  --tw-border-spacing-y: 0;
+  --tw-translate-x: 0;
+  --tw-translate-y: 0;
+  --tw-rotate: 0;
+  --tw-skew-x: 0;
+  --tw-skew-y: 0;
+  --tw-scale-x: 1;
+  --tw-scale-y: 1;
+  --tw-pan-x:  ;
+  --tw-pan-y:  ;
+  --tw-pinch-zoom:  ;
+  --tw-scroll-snap-strictness: proximity;
+  --tw-gradient-from-position:  ;
+  --tw-gradient-via-position:  ;
+  --tw-gradient-to-position:  ;
+  --tw-ordinal:  ;
+  --tw-slashed-zero:  ;
+  --tw-numeric-figure:  ;
+  --tw-numeric-spacing:  ;
+  --tw-numeric-fraction:  ;
+  --tw-ring-inset:  ;
+  --tw-ring-offset-width: 0px;
+  --tw-ring-offset-color: #fff;
+  --tw-ring-color: rgb(59 130 246 / 0.5);
+  --tw-ring-offset-shadow: 0 0 #0000;
+  --tw-ring-shadow: 0 0 #0000;
+  --tw-shadow: 0 0 #0000;
+  --tw-shadow-colored: 0 0 #0000;
+  --tw-blur:  ;
+  --tw-brightness:  ;
+  --tw-contrast:  ;
+  --tw-grayscale:  ;
+  --tw-hue-rotate:  ;
+  --tw-invert:  ;
+  --tw-saturate:  ;
+  --tw-sepia:  ;
+  --tw-drop-shadow:  ;
+  --tw-backdrop-blur:  ;
+  --tw-backdrop-brightness:  ;
+  --tw-backdrop-contrast:  ;
+  --tw-backdrop-grayscale:  ;
+  --tw-backdrop-hue-rotate:  ;
+  --tw-backdrop-invert:  ;
+  --tw-backdrop-opacity:  ;
+  --tw-backdrop-saturate:  ;
+  --tw-backdrop-sepia:  ;
+  --tw-contain-size:  ;
+  --tw-contain-layout:  ;
+  --tw-contain-paint:  ;
+  --tw-contain-style:  ;
+}
+::backdrop{
+  --tw-border-spacing-x: 0;
+  --tw-border-spacing-y: 0;
+  --tw-translate-x: 0;
+  --tw-translate-y: 0;
+  --tw-rotate: 0;
+  --tw-skew-x: 0;
+  --tw-skew-y: 0;
+  --tw-scale-x: 1;
+  --tw-scale-y: 1;
+  --tw-pan-x:  ;
+  --tw-pan-y:  ;
+  --tw-pinch-zoom:  ;
+  --tw-scroll-snap-strictness: proximity;
+  --tw-gradient-from-position:  ;
+  --tw-gradient-via-position:  ;
+  --tw-gradient-to-position:  ;
+  --tw-ordinal:  ;
+  --tw-slashed-zero:  ;
+  --tw-numeric-figure:  ;
+  --tw-numeric-spacing:  ;
+  --tw-numeric-fraction:  ;
+  --tw-ring-inset:  ;
+  --tw-ring-offset-width: 0px;
+  --tw-ring-offset-color: #fff;
+  --tw-ring-color: rgb(59 130 246 / 0.5);
+  --tw-ring-offset-shadow: 0 0 #0000;
+  --tw-ring-shadow: 0 0 #0000;
+  --tw-shadow: 0 0 #0000;
+  --tw-shadow-colored: 0 0 #0000;
+  --tw-blur:  ;
+  --tw-brightness:  ;
+  --tw-contrast:  ;
+  --tw-grayscale:  ;
+  --tw-hue-rotate:  ;
+  --tw-invert:  ;
+  --tw-saturate:  ;
+  --tw-sepia:  ;
+  --tw-drop-shadow:  ;
+  --tw-backdrop-blur:  ;
+  --tw-backdrop-brightness:  ;
+  --tw-backdrop-contrast:  ;
+  --tw-backdrop-grayscale:  ;
+  --tw-backdrop-hue-rotate:  ;
+  --tw-backdrop-invert:  ;
+  --tw-backdrop-opacity:  ;
+  --tw-backdrop-saturate:  ;
+  --tw-backdrop-sepia:  ;
+  --tw-contain-size:  ;
+  --tw-contain-layout:  ;
+  --tw-contain-paint:  ;
+  --tw-contain-style:  ;
+}
+/*
+! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com
+*/
+/*
+1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
+2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
+*/
+*,
+::before,
+::after {
+  box-sizing: border-box; /* 1 */
+  border-width: 0; /* 2 */
+  border-style: solid; /* 2 */
+  border-color: #e5e7eb; /* 2 */
+}
+::before,
+::after {
+  --tw-content: '';
+}
+/*
+1. Use a consistent sensible line-height in all browsers.
+2. Prevent adjustments of font size after orientation changes in iOS.
+3. Use a more readable tab size.
+4. Use the user's configured `sans` font-family by default.
+5. Use the user's configured `sans` font-feature-settings by default.
+6. Use the user's configured `sans` font-variation-settings by default.
+7. Disable tap highlights on iOS
+*/
+html,
+:host {
+  line-height: 1.5; /* 1 */
+  -webkit-text-size-adjust: 100%; /* 2 */
+  -moz-tab-size: 4; /* 3 */
+  -o-tab-size: 4;
+     tab-size: 4; /* 3 */
+  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
+  font-feature-settings: normal; /* 5 */
+  font-variation-settings: normal; /* 6 */
+  -webkit-tap-highlight-color: transparent; /* 7 */
+}
+/*
+1. Remove the margin in all browsers.
+2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
+*/
+body {
+  margin: 0; /* 1 */
+  line-height: inherit; /* 2 */
+}
+/*
+1. Add the correct height in Firefox.
+2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
+3. Ensure horizontal rules are visible by default.
+*/
+hr {
+  height: 0; /* 1 */
+  color: inherit; /* 2 */
+  border-top-width: 1px; /* 3 */
+}
+/*
+Add the correct text decoration in Chrome, Edge, and Safari.
+*/
+abbr:where([title]) {
+  -webkit-text-decoration: underline dotted;
+          text-decoration: underline dotted;
+}
+/*
+Remove the default font size and weight for headings.
+*/
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-size: inherit;
+  font-weight: inherit;
+}
+/*
+Reset links to optimize for opt-in styling instead of opt-out.
+*/
+a {
+  color: inherit;
+  text-decoration: inherit;
+}
+/*
+Add the correct font weight in Edge and Safari.
+*/
+b,
+strong {
+  font-weight: bolder;
+}
+/*
+1. Use the user's configured `mono` font-family by default.
+2. Use the user's configured `mono` font-feature-settings by default.
+3. Use the user's configured `mono` font-variation-settings by default.
+4. Correct the odd `em` font sizing in all browsers.
+*/
+code,
+kbd,
+samp,
+pre {
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
+  font-feature-settings: normal; /* 2 */
+  font-variation-settings: normal; /* 3 */
+  font-size: 1em; /* 4 */
+}
+/*
+Add the correct font size in all browsers.
+*/
+small {
+  font-size: 80%;
+}
+/*
+Prevent `sub` and `sup` elements from affecting the line height in all browsers.
+*/
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+sub {
+  bottom: -0.25em;
+}
+sup {
+  top: -0.5em;
+}
+/*
+1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
+2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
+3. Remove gaps between table borders by default.
+*/
+table {
+  text-indent: 0; /* 1 */
+  border-color: inherit; /* 2 */
+  border-collapse: collapse; /* 3 */
+}
+/*
+1. Change the font styles in all browsers.
+2. Remove the margin in Firefox and Safari.
+3. Remove default padding in all browsers.
+*/
+button,
+input,
+optgroup,
+select,
+textarea {
+  font-family: inherit; /* 1 */
+  font-feature-settings: inherit; /* 1 */
+  font-variation-settings: inherit; /* 1 */
+  font-size: 100%; /* 1 */
+  font-weight: inherit; /* 1 */
+  line-height: inherit; /* 1 */
+  letter-spacing: inherit; /* 1 */
+  color: inherit; /* 1 */
+  margin: 0; /* 2 */
+  padding: 0; /* 3 */
+}
+/*
+Remove the inheritance of text transform in Edge and Firefox.
+*/
+button,
+select {
+  text-transform: none;
+}
+/*
+1. Correct the inability to style clickable types in iOS and Safari.
+2. Remove default button styles.
+*/
+button,
+input:where([type='button']),
+input:where([type='reset']),
+input:where([type='submit']) {
+  -webkit-appearance: button; /* 1 */
+  background-color: transparent; /* 2 */
+  background-image: none; /* 2 */
+}
+/*
+Use the modern Firefox focus style for all focusable elements.
+*/
+:-moz-focusring {
+  outline: auto;
+}
+/*
+Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
+*/
+:-moz-ui-invalid {
+  box-shadow: none;
+}
+/*
+Add the correct vertical alignment in Chrome and Firefox.
+*/
+progress {
+  vertical-align: baseline;
+}
+/*
+Correct the cursor style of increment and decrement buttons in Safari.
+*/
+::-webkit-inner-spin-button,
+::-webkit-outer-spin-button {
+  height: auto;
+}
+/*
+1. Correct the odd appearance in Chrome and Safari.
+2. Correct the outline style in Safari.
+*/
+[type='search'] {
+  -webkit-appearance: textfield; /* 1 */
+  outline-offset: -2px; /* 2 */
+}
+/*
+Remove the inner padding in Chrome and Safari on macOS.
+*/
+::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+/*
+1. Correct the inability to style clickable types in iOS and Safari.
+2. Change font properties to `inherit` in Safari.
+*/
+::-webkit-file-upload-button {
+  -webkit-appearance: button; /* 1 */
+  font: inherit; /* 2 */
+}
+/*
+Add the correct display in Chrome and Safari.
+*/
+summary {
+  display: list-item;
+}
+/*
+Removes the default spacing and border for appropriate elements.
+*/
+blockquote,
+dl,
+dd,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+hr,
+figure,
+p,
+pre {
+  margin: 0;
+}
+fieldset {
+  margin: 0;
+  padding: 0;
+}
+legend {
+  padding: 0;
+}
+ol,
+ul,
+menu {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+/*
+Reset default styling for dialogs.
+*/
+dialog {
+  padding: 0;
+}
+/*
+Prevent resizing textareas horizontally by default.
+*/
+textarea {
+  resize: vertical;
+}
+/*
+1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
+2. Set the default placeholder color to the user's configured gray 400 color.
+*/
+input::-moz-placeholder, textarea::-moz-placeholder {
+  opacity: 1; /* 1 */
+  color: #9ca3af; /* 2 */
+}
+input::placeholder,
+textarea::placeholder {
+  opacity: 1; /* 1 */
+  color: #9ca3af; /* 2 */
+}
+/*
+Set the default cursor for buttons.
+*/
+button,
+[role="button"] {
+  cursor: pointer;
+}
+/*
+Make sure disabled buttons don't get the pointer cursor.
+*/
+:disabled {
+  cursor: default;
+}
+/*
+1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
+2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
+   This can trigger a poorly considered lint error in some tools but is included by design.
+*/
+img,
+svg,
+video,
+canvas,
+audio,
+iframe,
+embed,
+object {
+  display: block; /* 1 */
+  vertical-align: middle; /* 2 */
+}
+/*
+Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
+*/
+img,
+video {
+  max-width: 100%;
+  height: auto;
+}
+/* Make elements with the HTML hidden attribute stay hidden by default */
+[hidden]:where(:not([hidden="until-found"])) {
+  display: none;
+}
+:root{
+  color-scheme: light;
+  --rounded-box: 1rem;
+  --rounded-btn: 0.5rem;
+  --rounded-badge: 1.9rem;
+  --animation-btn: 0.25s;
+  --animation-input: .2s;
+  --btn-focus-scale: 0.95;
+  --border-btn: 1px;
+  --tab-border: 1px;
+  --tab-radius: 0.5rem;
+  --p: 45% 0.24 277.023;
+  --pc: 100% 0 0;
+  --s: 64.0524% 0.27518 342.547599;
+  --sc: 100% 0 0;
+  --a: 76.4263% 0.131303 184.169154;
+  --ac: 29.1209% 0.046441 185.94429;
+  --n: 31.3815% 0.021108 254.139175;
+  --nc: 74.6146% 0.020272 262.984854;
+  --b1: 100% 0 0;
+  --b2: 96.1151% 0 0;
+  --b3: 92.4169% 0.00108 197.137559;
+  --bc: 27.8078% 0.029596 256.847952;
+  --in: 58.7617% 0.138868 241.966052;
+  --inc: 100% 0 0;
+  --su: 62.7052% 0.169912 149.213788;
+  --suc: 100% 0 0;
+  --wa: 76.859% 0.164659 70.08039;
+  --wac: 100% 0 0;
+  --er: 57.7099% 0.215157 27.325049;
+  --erc: 100% 0 0;
+}
+@media (prefers-color-scheme: dark){
+  :root{
+    color-scheme: dark;
+    --rounded-box: 1rem;
+    --rounded-btn: 0.5rem;
+    --rounded-badge: 1.9rem;
+    --animation-btn: 0.25s;
+    --animation-input: .2s;
+    --btn-focus-scale: 0.95;
+    --border-btn: 1px;
+    --tab-border: 1px;
+    --tab-radius: 0.5rem;
+    --p: 65% 0.24 277.023;
+    --pc: 100% 0 0;
+    --s: 53.5761% 0.230437 342.280684;
+    --sc: 100% 0 0;
+    --a: 65.723% 0.115976 181.513997;
+    --ac: 29.1209% 0.046441 185.94429;
+    --n: 25.3267% 0.015896 252.417568;
+    --nc: 74.6146% 0.020272 262.984854;
+    --b1: 25.3267% 0.015896 252.417568;
+    --b2: 23.2607% 0.013807 253.100675;
+    --b3: 21.1484% 0.01165 254.087939;
+    --bc: 74.6146% 0.020272 262.984854;
+    --in: 75.3513% 0.138989 232.66148;
+    --inc: 20.9255% 0.038109 251.480324;
+    --su: 72.2746% 0.192007 149.57933;
+    --suc: 20.6582% 0.034017 153.195404;
+    --wa: 83.6861% 0.164422 84.428628;
+    --wac: 19.9137% 0.036447 90.923129;
+    --er: 71.0627% 0.166148 22.216224;
+    --erc: 16.2247% 0.04013 22.615699;
+  }
+}
+[data-theme=svpLight]{
+  color-scheme: light;
+  --rounded-box: 1rem;
+  --rounded-btn: 0.5rem;
+  --rounded-badge: 1.9rem;
+  --animation-btn: 0.25s;
+  --animation-input: .2s;
+  --btn-focus-scale: 0.95;
+  --border-btn: 1px;
+  --tab-border: 1px;
+  --tab-radius: 0.5rem;
+  --p: 45% 0.24 277.023;
+  --pc: 100% 0 0;
+  --s: 64.0524% 0.27518 342.547599;
+  --sc: 100% 0 0;
+  --a: 76.4263% 0.131303 184.169154;
+  --ac: 29.1209% 0.046441 185.94429;
+  --n: 31.3815% 0.021108 254.139175;
+  --nc: 74.6146% 0.020272 262.984854;
+  --b1: 100% 0 0;
+  --b2: 96.1151% 0 0;
+  --b3: 92.4169% 0.00108 197.137559;
+  --bc: 27.8078% 0.029596 256.847952;
+  --in: 58.7617% 0.138868 241.966052;
+  --inc: 100% 0 0;
+  --su: 62.7052% 0.169912 149.213788;
+  --suc: 100% 0 0;
+  --wa: 76.859% 0.164659 70.08039;
+  --wac: 100% 0 0;
+  --er: 57.7099% 0.215157 27.325049;
+  --erc: 100% 0 0;
+}
+[data-theme=svpDark]{
+  color-scheme: dark;
+  --rounded-box: 1rem;
+  --rounded-btn: 0.5rem;
+  --rounded-badge: 1.9rem;
+  --animation-btn: 0.25s;
+  --animation-input: .2s;
+  --btn-focus-scale: 0.95;
+  --border-btn: 1px;
+  --tab-border: 1px;
+  --tab-radius: 0.5rem;
+  --p: 65% 0.24 277.023;
+  --pc: 100% 0 0;
+  --s: 53.5761% 0.230437 342.280684;
+  --sc: 100% 0 0;
+  --a: 65.723% 0.115976 181.513997;
+  --ac: 29.1209% 0.046441 185.94429;
+  --n: 25.3267% 0.015896 252.417568;
+  --nc: 74.6146% 0.020272 262.984854;
+  --b1: 25.3267% 0.015896 252.417568;
+  --b2: 23.2607% 0.013807 253.100675;
+  --b3: 21.1484% 0.01165 254.087939;
+  --bc: 74.6146% 0.020272 262.984854;
+  --in: 75.3513% 0.138989 232.66148;
+  --inc: 20.9255% 0.038109 251.480324;
+  --su: 72.2746% 0.192007 149.57933;
+  --suc: 20.6582% 0.034017 153.195404;
+  --wa: 83.6861% 0.164422 84.428628;
+  --wac: 19.9137% 0.036447 90.923129;
+  --er: 71.0627% 0.166148 22.216224;
+  --erc: 16.2247% 0.04013 22.615699;
+}
+.svp-btn{
+  display: inline-flex;
+  height: 3rem;
+  min-height: 3rem;
+  flex-shrink: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+  flex-wrap: wrap;
+  align-items: center;
+  justify-content: center;
+  border-radius: var(--rounded-btn, 0.5rem);
+  border-color: transparent;
+  border-color: oklch(var(--btn-color, var(--b2)) / var(--tw-border-opacity));
+  padding-left: 1rem;
+  padding-right: 1rem;
+  text-align: center;
+  font-size: 0.875rem;
+  line-height: 1em;
+  gap: 0.5rem;
+  font-weight: 600;
+  text-decoration-line: none;
+  transition-duration: 200ms;
+  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
+  border-width: var(--border-btn, 1px);
+  transition-property: color, background-color, border-color, opacity, box-shadow, transform;
+  --tw-text-opacity: 1;
+  color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));
+  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
+  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+  outline-color: var(--fallback-bc,oklch(var(--bc)/1));
+  background-color: oklch(var(--btn-color, var(--b2)) / var(--tw-bg-opacity));
+  --tw-bg-opacity: 1;
+  --tw-border-opacity: 1;
+}
+.svp-btn-disabled,
+  .svp-btn[disabled],
+  .svp-btn:disabled{
+  pointer-events: none;
+}
+:where(.svp-btn:is(input[type="checkbox"])),
+:where(.svp-btn:is(input[type="radio"])){
+  width: auto;
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+}
+.svp-btn:is(input[type="checkbox"]):after,
+.svp-btn:is(input[type="radio"]):after{
+  --tw-content: attr(aria-label);
+  content: var(--tw-content);
+}
+@media (hover: hover){
+  .svp-btn:hover{
+    --tw-border-opacity: 1;
+    border-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-border-opacity)));
+    --tw-bg-opacity: 1;
+    background-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-bg-opacity)));
+  }
+  @supports (color: color-mix(in oklab, black, black)){
+    .svp-btn:hover{
+      background-color: color-mix(
+            in oklab,
+            oklch(var(--btn-color, var(--b2)) / var(--tw-bg-opacity, 1)) 90%,
+            black
+          );
+      border-color: color-mix(
+            in oklab,
+            oklch(var(--btn-color, var(--b2)) / var(--tw-border-opacity, 1)) 90%,
+            black
+          );
+    }
+  }
+  @supports not (color: oklch(0% 0 0)){
+    .svp-btn:hover{
+      background-color: var(--btn-color, var(--fallback-b2));
+      border-color: var(--btn-color, var(--fallback-b2));
+    }
+  }
+  .svp-btn:hover{
+    --tw-border-opacity: 1;
+    border-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-border-opacity)));
+    --tw-bg-opacity: 1;
+    background-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-bg-opacity)));
+  }
+  @supports (color: color-mix(in oklab, black, black)){
+    .svp-btn:hover{
+      background-color: color-mix(
+            in oklab,
+            oklch(var(--btn-color, var(--b2)) / var(--tw-bg-opacity, 1)) 90%,
+            black
+          );
+      border-color: color-mix(
+            in oklab,
+            oklch(var(--btn-color, var(--b2)) / var(--tw-border-opacity, 1)) 90%,
+            black
+          );
+    }
+  }
+  @supports not (color: oklch(0% 0 0)){
+    .svp-btn:hover{
+      background-color: var(--btn-color, var(--fallback-b2));
+      border-color: var(--btn-color, var(--fallback-b2));
+    }
+  }
+  .svp-btn:hover{
+    --tw-border-opacity: 1;
+    border-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-border-opacity)));
+    --tw-bg-opacity: 1;
+    background-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-bg-opacity)));
+  }
+  @supports (color: color-mix(in oklab, black, black)){
+    .svp-btn:hover{
+      background-color: color-mix(
+            in oklab,
+            oklch(var(--btn-color, var(--b2)) / var(--tw-bg-opacity, 1)) 90%,
+            black
+          );
+      border-color: color-mix(
+            in oklab,
+            oklch(var(--btn-color, var(--b2)) / var(--tw-border-opacity, 1)) 90%,
+            black
+          );
+    }
+  }
+  @supports not (color: oklch(0% 0 0)){
+    .svp-btn:hover{
+      background-color: var(--btn-color, var(--fallback-b2));
+      border-color: var(--btn-color, var(--fallback-b2));
+    }
+  }
+  .svp-btn.svp-glass:hover{
+    --glass-opacity: 25%;
+    --glass-border-opacity: 15%;
+  }
+  .svp-btn-disabled:hover,
+    .svp-btn[disabled]:hover,
+    .svp-btn:disabled:hover{
+    --tw-border-opacity: 0;
+    background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));
+    --tw-bg-opacity: 0.2;
+    color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));
+    --tw-text-opacity: 0.2;
+  }
+  @supports (color: color-mix(in oklab, black, black)){
+    .svp-btn:is(input[type="checkbox"]:checked):hover, .svp-btn:is(input[type="radio"]:checked):hover{
+      background-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);
+      border-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black);
+    }
+  }
+}
+.svp-footer{
+  display: grid;
+  width: 100%;
+  grid-auto-flow: row;
+  place-items: start;
+  -moz-column-gap: 1rem;
+       column-gap: 1rem;
+  row-gap: 2.5rem;
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+}
+.svp-footer > *{
+  display: grid;
+  place-items: start;
+  gap: 0.5rem;
+}
+@media (min-width: 48rem){
+  .svp-footer{
+    grid-auto-flow: column;
+  }
+  .svp-footer-center{
+    grid-auto-flow: row dense;
+  }
+}
+.svp-modal{
+  pointer-events: none;
+  position: fixed;
+  inset: 0px;
+  margin: 0px;
+  display: grid;
+  height: 100%;
+  max-height: none;
+  width: 100%;
+  max-width: none;
+  justify-items: center;
+  padding: 0px;
+  opacity: 0;
+  overscroll-behavior: contain;
+  z-index: 999;
+  background-color: transparent;
+  color: inherit;
+  transition-duration: 200ms;
+  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
+  transition-property: transform, opacity, visibility;
+  overflow-y: hidden;
+}
+:where(.svp-modal){
+  align-items: center;
+}
+.svp-modal-open,
+.svp-modal:target,
+.svp-modal-toggle:checked + .svp-modal,
+.svp-modal[open]{
+  pointer-events: auto;
+  visibility: visible;
+  opacity: 1;
+}
+:root:has(:is(.svp-modal-open, .svp-modal:target, .svp-modal-toggle:checked + .svp-modal, .svp-modal[open])){
+  overflow: hidden;
+  scrollbar-gutter: stable;
+}
+@media (prefers-reduced-motion: no-preference){
+  .svp-btn{
+    animation: button-pop var(--animation-btn, 0.25s) ease-out;
+  }
+}
+.svp-btn:active:hover,
+  .svp-btn:active:focus{
+  animation: button-pop 0s ease-out;
+  transform: scale(var(--btn-focus-scale, 0.97));
+}
+@supports not (color: oklch(0% 0 0)){
+  .svp-btn{
+    background-color: var(--btn-color, var(--fallback-b2));
+    border-color: var(--btn-color, var(--fallback-b2));
+  }
+}
+.svp-btn:focus-visible{
+  outline-style: solid;
+  outline-width: 2px;
+  outline-offset: 2px;
+}
+.svp-btn.svp-glass{
+  --tw-shadow: 0 0 #0000;
+  --tw-shadow-colored: 0 0 #0000;
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+  outline-color: currentColor;
+}
+.svp-btn.svp-glass.svp-btn-active{
+  --glass-opacity: 25%;
+  --glass-border-opacity: 15%;
+}
+.svp-btn.svp-btn-disabled,
+  .svp-btn[disabled],
+  .svp-btn:disabled{
+  --tw-border-opacity: 0;
+  background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity)));
+  --tw-bg-opacity: 0.2;
+  color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));
+  --tw-text-opacity: 0.2;
+}
+.svp-btn:is(input[type="checkbox"]:checked),
+.svp-btn:is(input[type="radio"]:checked){
+  --tw-border-opacity: 1;
+  border-color: var(--fallback-p,oklch(var(--p)/var(--tw-border-opacity)));
+  --tw-bg-opacity: 1;
+  background-color: var(--fallback-p,oklch(var(--p)/var(--tw-bg-opacity)));
+  --tw-text-opacity: 1;
+  color: var(--fallback-pc,oklch(var(--pc)/var(--tw-text-opacity)));
+}
+.svp-btn:is(input[type="checkbox"]:checked):focus-visible, .svp-btn:is(input[type="radio"]:checked):focus-visible{
+  outline-color: var(--fallback-p,oklch(var(--p)/1));
+}
+@keyframes button-pop{
+  0%{
+    transform: scale(var(--btn-focus-scale, 0.98));
+  }
+  40%{
+    transform: scale(1.02);
+  }
+  100%{
+    transform: scale(1);
+  }
+}
+@keyframes checkmark{
+  0%{
+    background-position-y: 5px;
+  }
+  50%{
+    background-position-y: -2px;
+  }
+  100%{
+    background-position-y: 0;
+  }
+}
+.svp-join > :where(*:not(:first-child)):is(.svp-btn){
+  margin-inline-start: calc(var(--border-btn) * -1);
+}
+.svp-modal:not(dialog:not(.svp-modal-open)),
+  .svp-modal::backdrop{
+  background-color: #0006;
+  animation: modal-pop 0.2s ease-out;
+}
+.svp-modal-open .svp-modal-box,
+.svp-modal-toggle:checked + .svp-modal .svp-modal-box,
+.svp-modal:target .svp-modal-box,
+.svp-modal[open] .svp-modal-box{
+  --tw-translate-y: 0px;
+  --tw-scale-x: 1;
+  --tw-scale-y: 1;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+@keyframes modal-pop{
+  0%{
+    opacity: 0;
+  }
+}
+@keyframes progress-loading{
+  50%{
+    background-position-x: -115%;
+  }
+}
+@keyframes radiomark{
+  0%{
+    box-shadow: 0 0 0 12px var(--fallback-b1,oklch(var(--b1)/1)) inset,
+      0 0 0 12px var(--fallback-b1,oklch(var(--b1)/1)) inset;
+  }
+  50%{
+    box-shadow: 0 0 0 3px var(--fallback-b1,oklch(var(--b1)/1)) inset,
+      0 0 0 3px var(--fallback-b1,oklch(var(--b1)/1)) inset;
+  }
+  100%{
+    box-shadow: 0 0 0 4px var(--fallback-b1,oklch(var(--b1)/1)) inset,
+      0 0 0 4px var(--fallback-b1,oklch(var(--b1)/1)) inset;
+  }
+}
+@keyframes rating-pop{
+  0%{
+    transform: translateY(-0.125em);
+  }
+  40%{
+    transform: translateY(-0.125em);
+  }
+  100%{
+    transform: translateY(0);
+  }
+}
+@keyframes skeleton{
+  from{
+    background-position: 150%;
+  }
+  to{
+    background-position: -50%;
+  }
+}
+@keyframes toast-pop{
+  0%{
+    transform: scale(0.9);
+    opacity: 0;
+  }
+  100%{
+    transform: scale(1);
+    opacity: 1;
+  }
+}
+.svp-join.svp-join-vertical > :where(*:not(:first-child)):is(.svp-btn){
+  margin-top: calc(var(--border-btn) * -1);
+}
+.svp-join.svp-join-horizontal > :where(*:not(:first-child)):is(.svp-btn){
+  margin-inline-start: calc(var(--border-btn) * -1);
+  margin-top: 0px;
+}
+.svp-root {
+  --svp-header-height: 40px;
+  --svp-toolbar-height: 42px;
+  --svp-panel-header-height: 18px;
+  --svp-panel-radius: 0;
+  --svp-panel-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
+  --svp-z-toolbar: 30;
+  --svp-z-ruler: 25;
+  --svp-z-panel: 50;
+  --svp-z-modal: 1000;
+  --svp-z-tooltip: 2000;
+  --svp-side-w: 240px;
+  --svp-props-w: 270px;
+  --svp-minimap-w: 240px;
+  --svp-primary: oklch(45% 0.24 277.023);
+  --svp-primary-content: oklch(93% 0.034 272.788);
+  --svp-panel-header-bg: var(--svp-primary);
+  --svp-panel-header-fg: var(--svp-primary-content);
+  --svp-bg: #ffffff;
+  --svp-bg-soft: oklch(97% 0.001 286);
+  --svp-fg: oklch(21% 0.006 285.885);
+  --svp-fg-muted: oklch(76.3% 0.0018 285.885);
+  --svp-border: color-mix(in oklch, oklch(21% 0.006 285.885), white 70%);
+  --svp-border-strong: oklch(76.3% 0.0018 285.885);
+  --svp-ruler-size: 24px;
+  --svp-ruler-bg: #ffffff;
+  --svp-ruler-fg: #343a40;
+  --svp-ruler-tick: #343a40;
+  --svp-ruler-border: #cccccc;
+  --svp-ruler-paper: #f5f5f5;
+  --svp-scrollbar-size: 4px;
+  --svp-scrollbar-thumb: var(--svp-primary);
+  --svp-scrollbar-track: transparent;
+  --svp-scrollbar-radius: 2px;
+  /** Clip zone to hide horizontal scrollbar while keeping scroll. */
+  --svp-h-scrollbar-clip: 16px;
+}
+.svp-root[data-theme=svpLight] {
+  --svp-primary: oklch(45% 0.24 277.023);
+  --svp-primary-content: oklch(93% 0.034 272.788);
+  --svp-bg: #ffffff;
+  --svp-bg-soft: oklch(97% 0.001 286);
+  --svp-fg: oklch(21% 0.006 285.885);
+  --svp-fg-muted: oklch(76.3% 0.0018 285.885);
+  --svp-border: color-mix(in oklch, oklch(21% 0.006 285.885), white 70%);
+  --svp-border-strong: oklch(76.3% 0.0018 285.885);
+}
+.svp-root[data-theme=svpDark] {
+  --svp-primary: #818cf8;
+  --svp-primary-content: #0b1020;
+  --svp-bg: #1f2933;
+  --svp-bg-soft: #161b22;
+  --svp-fg: #e5e7eb;
+  --svp-fg-muted: rgba(229, 231, 235, 0.62);
+  --svp-border: #374151;
+  --svp-border-strong: rgba(229, 231, 235, 0.18);
+}
+.svp-root .hiprint-printPaper {
+  background: #fff;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), 0 4px 14px rgba(0, 0, 0, 0.04);
+  margin: 0;
+}
+.svp-root .hiprint-printPanel {
+  margin: 0;
+}
+.svp-root .hiprint_rul_wrapper {
+  display: none !important;
+}
+.svp-root .hiprint-pagination,
+.svp-root .hiprint-printPagination {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 4px 8px;
+  list-style: none;
+  margin: 0;
+}
+.svp-root .hiprint-pagination li,
+.svp-root .hiprint-pagination .hiprint-printPagination-item,
+.svp-root .hiprint-printPagination li,
+.svp-root .hiprint-printPagination .hiprint-printPagination-item {
+  min-width: 28px;
+  height: 24px;
+  padding: 0 8px;
+  border: 1px solid var(--svp-border);
+  border-radius: 0;
+  font-size: 12px;
+  cursor: pointer;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  background: var(--svp-bg);
+  color: var(--svp-fg);
+  transition: background 0.15s, color 0.15s, border-color 0.15s;
+}
+.svp-root .hiprint-pagination li:hover,
+.svp-root .hiprint-pagination .hiprint-printPagination-item:hover,
+.svp-root .hiprint-printPagination li:hover,
+.svp-root .hiprint-printPagination .hiprint-printPagination-item:hover {
+  border-color: var(--svp-panel-header-bg);
+}
+.svp-root .hiprint-pagination li.active, .svp-root .hiprint-pagination li.hiprint-printPagination-active,
+.svp-root .hiprint-pagination .hiprint-printPagination-item.active,
+.svp-root .hiprint-pagination .hiprint-printPagination-item.hiprint-printPagination-active,
+.svp-root .hiprint-printPagination li.active,
+.svp-root .hiprint-printPagination li.hiprint-printPagination-active,
+.svp-root .hiprint-printPagination .hiprint-printPagination-item.active,
+.svp-root .hiprint-printPagination .hiprint-printPagination-item.hiprint-printPagination-active {
+  background: var(--svp-panel-header-bg);
+  color: var(--svp-panel-header-fg);
+  border-color: var(--svp-panel-header-bg);
+}
+.svp-root #PrintElementOptionSetting {
+  padding: 8px 10px;
+  font-size: 12px;
+  color: var(--svp-fg);
+  overflow-x: hidden;
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+.svp-root #PrintElementOptionSetting .prop-tabs {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  width: 100%;
+}
+.svp-root #PrintElementOptionSetting .prop-tab-items {
+  display: flex;
+  align-items: flex-end;
+  gap: 0;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  border-bottom: 1px solid var(--svp-border);
+}
+.svp-root #PrintElementOptionSetting .prop-tab-items .prop-tab-item {
+  flex: 1;
+  min-width: 0;
+  margin: 0;
+  padding: 0;
+  height: 28px;
+  line-height: 28px;
+  font-size: 11px;
+  font-weight: 500;
+  color: var(--svp-fg-muted);
+  cursor: pointer;
+  border-bottom: 2px solid transparent;
+  text-align: center;
+  white-space: nowrap;
+}
+.svp-root #PrintElementOptionSetting .prop-tab-items .prop-tab-item .tab-title {
+  height: 28px;
+  line-height: 28px;
+  padding: 0 2px;
+  font-size: 11px;
+  font-weight: 500;
+}
+.svp-root #PrintElementOptionSetting .prop-tab-items .prop-tab-item.active {
+  color: var(--svp-primary);
+  border-bottom-color: var(--svp-primary);
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-items {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  width: 100%;
+  padding: 0;
+  margin: 0;
+  font-size: 12px;
+  flex-wrap: nowrap;
+  align-items: stretch;
+  float: none;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-items .svp-hiprint-paper-list,
+.svp-root #PrintElementOptionSetting .hiprint-option-items .svp-hiprint-orient,
+.svp-root #PrintElementOptionSetting .hiprint-option-items .svp-hiprint-watermark,
+.svp-root #PrintElementOptionSetting .hiprint-option-items .svp-hiprint-panel-layout {
+  display: contents;
+}
+.svp-root #PrintElementOptionSetting .prop-tabs .hiprint-option-items {
+  display: none;
+}
+.svp-root #PrintElementOptionSetting .prop-tabs .hiprint-option-items.active {
+  display: flex;
+}
+.svp-root #PrintElementOptionSetting .svp-panel-layout-hint {
+  margin-top: -2px;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-title {
+  margin-top: 6px;
+  padding-top: 6px;
+  border-top: 1px solid var(--svp-border);
+  font-weight: 600;
+  color: var(--svp-fg);
+  width: 100%;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-desc {
+  width: 100%;
+  margin: -2px 0 0;
+  padding-left: 70px;
+  font-size: 11px;
+  line-height: 1.4;
+  color: var(--svp-fg-muted);
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item {
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  width: 100% !important;
+  min-height: 26px;
+  margin: 0 !important;
+  padding: 0 !important;
+  float: none !important;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-row {
+  flex-wrap: nowrap;
+  align-items: center;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-row:has(textarea) {
+  align-items: flex-start;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-row:has(textarea) > .hiprint-option-item-label {
+  padding-top: 4px;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-row:has(> .hiprint-option-item-field ~ .hiprint-option-item-field) {
+  flex-wrap: wrap;
+  align-items: flex-start;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-row:has(> .hiprint-option-item-field ~ .hiprint-option-item-field) > .hiprint-option-item-label {
+  padding-top: 3px;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-row:has(> .hiprint-option-item-field ~ .hiprint-option-item-field) > .hiprint-option-item-field {
+  flex: 1 1 calc(100% - 70px);
+  min-width: 0;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-label {
+  flex: 0 0 64px;
+  width: auto !important;
+  margin: 0 !important;
+  text-align: right;
+  color: var(--svp-fg);
+  white-space: normal;
+  line-height: 1.2;
+  word-break: break-all;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-label::after {
+  content: ":";
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field {
+  flex: 1;
+  min-width: 0;
+  width: auto !important;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field > input[type=text],
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field > input:not([type]),
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field > input[type=number],
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field > input[type=color],
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field > select,
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field > textarea {
+  width: 100%;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field > textarea {
+  min-height: 60px;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> input ~ input), .svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> .hiprint-option-item-settingBtn), .svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> label), .svp-root #PrintElementOptionSetting .hiprint-option-item-field[style*="display: flex"], .svp-root #PrintElementOptionSetting .hiprint-option-item-field[style*="display:flex"] {
+  display: flex !important;
+  align-items: center;
+  gap: 4px;
+  flex-wrap: nowrap;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> input ~ input) > input[type=text],
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> input ~ input) > input:not([type]),
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> input ~ input) > input[type=number],
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> input ~ input) > input[type=color],
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> input ~ input) > select, .svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> .hiprint-option-item-settingBtn) > input[type=text],
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> .hiprint-option-item-settingBtn) > input:not([type]),
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> .hiprint-option-item-settingBtn) > input[type=number],
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> .hiprint-option-item-settingBtn) > input[type=color],
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> .hiprint-option-item-settingBtn) > select, .svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> label) > input[type=text],
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> label) > input:not([type]),
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> label) > input[type=number],
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> label) > input[type=color],
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> label) > select, .svp-root #PrintElementOptionSetting .hiprint-option-item-field[style*="display: flex"] > input[type=text],
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field[style*="display: flex"] > input:not([type]),
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field[style*="display: flex"] > input[type=number],
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field[style*="display: flex"] > input[type=color],
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field[style*="display: flex"] > select, .svp-root #PrintElementOptionSetting .hiprint-option-item-field[style*="display:flex"] > input[type=text],
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field[style*="display:flex"] > input:not([type]),
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field[style*="display:flex"] > input[type=number],
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field[style*="display:flex"] > input[type=color],
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field[style*="display:flex"] > select {
+  flex: 1 1 0;
+  width: auto !important;
+  min-width: 0;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> input ~ input) > label, .svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> .hiprint-option-item-settingBtn) > label, .svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> label) > label, .svp-root #PrintElementOptionSetting .hiprint-option-item-field[style*="display: flex"] > label, .svp-root #PrintElementOptionSetting .hiprint-option-item-field[style*="display:flex"] > label {
+  flex: 0 0 auto;
+  width: auto !important;
+  margin: 0;
+  font-size: 12px;
+  line-height: 1;
+  white-space: nowrap;
+  cursor: pointer;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> input ~ input) > .hiprint-option-item-settingBtn, .svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> .hiprint-option-item-settingBtn) > .hiprint-option-item-settingBtn, .svp-root #PrintElementOptionSetting .hiprint-option-item-field:has(> label) > .hiprint-option-item-settingBtn, .svp-root #PrintElementOptionSetting .hiprint-option-item-field[style*="display: flex"] > .hiprint-option-item-settingBtn, .svp-root #PrintElementOptionSetting .hiprint-option-item-field[style*="display:flex"] > .hiprint-option-item-settingBtn {
+  flex: 0 0 auto;
+  width: auto !important;
+  height: 24px;
+  line-height: 24px;
+  margin: 0 !important;
+  padding: 0 10px;
+  white-space: nowrap;
+}
+.svp-root #PrintElementOptionSetting input[type=text],
+.svp-root #PrintElementOptionSetting input:not([type]),
+.svp-root #PrintElementOptionSetting input[type=number],
+.svp-root #PrintElementOptionSetting input[type=color],
+.svp-root #PrintElementOptionSetting select,
+.svp-root #PrintElementOptionSetting textarea {
+  height: 24px;
+  padding: 0 6px;
+  border: 1px solid var(--svp-border);
+  border-radius: 0;
+  background: var(--svp-bg);
+  color: var(--svp-fg);
+  font-size: 12px;
+  outline: none;
+  box-sizing: border-box;
+}
+.svp-root #PrintElementOptionSetting input[type=text]:focus,
+.svp-root #PrintElementOptionSetting input:not([type]):focus,
+.svp-root #PrintElementOptionSetting input[type=number]:focus,
+.svp-root #PrintElementOptionSetting input[type=color]:focus,
+.svp-root #PrintElementOptionSetting select:focus,
+.svp-root #PrintElementOptionSetting textarea:focus {
+  border-color: var(--svp-primary);
+}
+.svp-root #PrintElementOptionSetting textarea {
+  height: auto;
+  min-height: 60px;
+  padding: 4px 6px;
+  resize: vertical;
+}
+.svp-root #PrintElementOptionSetting input[type=color] {
+  padding: 0;
+  cursor: pointer;
+}
+.svp-root #PrintElementOptionSetting input[type=range] {
+  flex: 1;
+  width: 100%;
+  height: auto;
+  padding: 0;
+  border: 0;
+  background: transparent;
+  accent-color: var(--svp-primary);
+}
+.svp-root #PrintElementOptionSetting input[type=checkbox],
+.svp-root #PrintElementOptionSetting input[type=radio] {
+  flex: 0 0 auto;
+  width: auto;
+  height: auto;
+  accent-color: var(--svp-primary);
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field.options {
+  display: flex;
+  gap: 0;
+  padding: 0;
+  border: 1px solid var(--svp-border);
+  border-radius: 0;
+  background: var(--svp-bg);
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field.options .option {
+  flex: 1;
+  height: 24px;
+  line-height: 24px;
+  padding: 0 8px;
+  text-align: center;
+  font-size: 12px;
+  color: var(--svp-fg);
+  border: 0;
+  border-radius: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field.options .option.checked {
+  background: var(--svp-primary);
+  color: var(--svp-primary-content);
+  font-weight: 600;
+  cursor: default;
+  box-shadow: none;
+}
+.svp-root #PrintElementOptionSetting .minicolors {
+  width: 100%;
+}
+.svp-root #PrintElementOptionSetting .minicolors .minicolors-input {
+  width: 100% !important;
+  height: 24px;
+  padding: 0 6px 0 28px;
+  border: 1px solid var(--svp-border);
+  border-radius: 0;
+  background: var(--svp-bg);
+  color: var(--svp-fg);
+  font-size: 12px;
+}
+.svp-root #PrintElementOptionSetting .minicolors .minicolors-input:focus {
+  border-color: var(--svp-primary);
+}
+.svp-root #PrintElementOptionSetting .minicolors .minicolors-swatch {
+  top: 3px;
+  left: 4px;
+  width: 18px;
+  height: 18px;
+  border: 1px solid var(--svp-border);
+  border-radius: 0;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-items > .hiprint-option-item-settingBtn,
+.svp-root #PrintElementOptionSetting .hiprint-option-items > .hiprint-option-item-submitBtn,
+.svp-root #PrintElementOptionSetting .hiprint-option-items > .hiprint-option-item-deleteBtn {
+  width: 100%;
+  height: 28px;
+  margin: 6px 0 0;
+  padding: 0 12px;
+  border: 1px solid var(--svp-primary);
+  border-radius: 0;
+  background: var(--svp-primary);
+  color: var(--svp-primary-content);
+  font-size: 12px;
+  font-weight: 400;
+  line-height: 28px;
+  cursor: pointer;
+  transition: opacity 0.15s;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-items > .hiprint-option-item-settingBtn:hover,
+.svp-root #PrintElementOptionSetting .hiprint-option-items > .hiprint-option-item-submitBtn:hover,
+.svp-root #PrintElementOptionSetting .hiprint-option-items > .hiprint-option-item-deleteBtn:hover {
+  opacity: 0.92;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field > .hiprint-option-item-settingBtn {
+  border: 1px solid var(--svp-primary);
+  border-radius: 0;
+  background: var(--svp-primary);
+  color: var(--svp-primary-content);
+  font-size: 12px;
+  cursor: pointer;
+  transition: opacity 0.15s;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-field > .hiprint-option-item-settingBtn:hover {
+  opacity: 0.92;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-items > .hiprint-option-item-deleteBtn {
+  background: #ef4444;
+  border-color: #ef4444;
+  color: #fff;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-row:has(.hiprint-option-table-selected-columns) {
+  flex-direction: column;
+  align-items: stretch;
+  gap: 4px;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-item-row:has(.hiprint-option-table-selected-columns) > div {
+  flex: 1 1 100%;
+  width: 100%;
+  min-width: 0;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-table-selected-columns {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  width: 100%;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-table-selected-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  width: 100%;
+  min-height: 30px;
+  margin: 0 !important;
+  padding: 5px 8px !important;
+  border: 1px solid var(--svp-border) !important;
+  border-radius: 0;
+  background: var(--svp-bg-soft);
+  line-height: 1.4 !important;
+  box-sizing: border-box;
+  transition: border-color 0.15s, background 0.15s;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-table-selected-item:hover {
+  border-color: color-mix(in srgb, var(--svp-primary) 35%, var(--svp-border));
+  background: var(--svp-bg);
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-table-selected-item .column-title {
+  flex: 1;
+  display: block !important;
+  min-width: 0 !important;
+  font-size: 12px;
+  color: var(--svp-fg);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-table-selected-item .column-title:empty::before {
+  content: "—";
+  color: var(--svp-fg-muted);
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-table-selected-item .hi-pretty {
+  flex: 0 0 auto;
+  margin: 0 !important;
+  line-height: 1;
+  position: relative;
+  width: 14px;
+  height: 14px;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-table-selected-item .hi-pretty input[type=checkbox] {
+  position: static;
+  opacity: 1;
+  width: 14px;
+  height: 14px;
+  margin: 0;
+  accent-color: var(--svp-primary);
+  cursor: pointer;
+}
+.svp-root #PrintElementOptionSetting .hiprint-option-table-selected-item .hi-pretty .state {
+  display: none;
+}
+.svp-root #PrintElementOptionSetting table {
+  width: 100%;
+  border-collapse: separate;
+  border-spacing: 0 6px;
+  table-layout: fixed;
+}
+.svp-root #PrintElementOptionSetting table tr td:first-child {
+  width: 64px;
+  color: var(--svp-fg);
+  padding-right: 6px;
+  text-align: right;
+  vertical-align: middle;
+  white-space: nowrap;
+}
+.svp-root .design-position-selected,
+.svp-root .hiprint-printElement-selected {
+  outline: 1px dashed var(--svp-panel-header-bg) !important;
+}
+.svp-root .draggable-source--is-dragging {
+  opacity: 0.55;
+}
+.svp-root {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
+  font-size: 12px;
+  color: var(--svp-fg);
+  background: var(--svp-bg-soft);
+}
+.svp-root *, .svp-root *::before, .svp-root *::after {
+  box-sizing: border-box;
+}
+.svp-root button {
+  font-family: inherit;
+}
+.svp-root {
+  scrollbar-width: thin;
+  scrollbar-color: var(--svp-scrollbar-thumb) var(--svp-scrollbar-track);
+}
+.svp-root::-webkit-scrollbar:vertical {
+  width: var(--svp-scrollbar-size);
+}
+.svp-root::-webkit-scrollbar:horizontal {
+  height: 0;
+}
+.svp-root::-webkit-scrollbar-corner {
+  background: transparent;
+}
+.svp-root::-webkit-scrollbar-thumb:vertical {
+  background: var(--svp-scrollbar-thumb);
+  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, transparent 75%, transparent);
+  border-radius: var(--svp-scrollbar-radius);
+}
+.svp-root::-webkit-scrollbar-thumb:vertical:hover {
+  background: var(--svp-scrollbar-thumb);
+}
+.svp-root * {
+  scrollbar-width: thin;
+  scrollbar-color: var(--svp-scrollbar-thumb) var(--svp-scrollbar-track);
+}
+.svp-root *::-webkit-scrollbar:vertical {
+  width: var(--svp-scrollbar-size);
+}
+.svp-root *::-webkit-scrollbar:horizontal {
+  height: 0;
+}
+.svp-root *::-webkit-scrollbar-corner {
+  background: transparent;
+}
+.svp-root *::-webkit-scrollbar-thumb:vertical {
+  background: var(--svp-scrollbar-thumb);
+  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, transparent 75%, transparent);
+  border-radius: var(--svp-scrollbar-radius);
+}
+.svp-root *::-webkit-scrollbar-thumb:vertical:hover {
+  background: var(--svp-scrollbar-thumb);
+}
+.svp-header {
+  flex: 0 0 var(--svp-header-height);
+  display: flex;
+  align-items: center;
+  padding: 0 8px;
+  gap: 8px;
+  line-height: var(--svp-header-height);
+  background: var(--svp-primary);
+  color: var(--svp-primary-content);
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+  z-index: var(--svp-z-toolbar);
+}
+.svp-header__aside {
+  flex: 1 1 0;
+  min-width: 0;
+}
+.svp-header__aside--left {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+.svp-header__aside--right {
+  flex: 1 1 0;
+  justify-content: flex-end;
+}
+.svp-header__center {
+  flex: 0 0 auto;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: 2px;
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+.svp-header__logo {
+  font-weight: 600;
+  font-size: 14px;
+  color: inherit;
+}
+.svp-header__title {
+  font-size: 14px;
+  color: inherit;
+  white-space: nowrap;
+}
+.svp-header__menu {
+  display: inline-flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  min-width: 56px;
+  padding: 0 6px;
+  border: 0;
+  background: transparent;
+  color: var(--svp-primary-content);
+  cursor: pointer;
+  font-size: 12px;
+  line-height: 12px;
+  flex-shrink: 0;
+}
+.svp-header__menu:hover {
+  opacity: 0.9;
+}
+.svp-header__menu svg {
+  display: block;
+}
+.svp-header__menu span {
+  margin-top: 2px;
+  white-space: nowrap;
+}
+.svp-header__divider {
+  flex: 0 0 1px;
+  align-self: stretch;
+  width: 1px;
+  margin: 8px 6px;
+  background: color-mix(in srgb, var(--svp-primary-content) 28%, transparent);
+}
+.svp-header__ele {
+  display: inline-flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  min-width: 48px;
+  padding: 0 4px;
+  border: 0;
+  background: transparent;
+  color: var(--svp-primary-content);
+  cursor: pointer;
+  font-size: 11px;
+  line-height: 12px;
+  flex-shrink: 0;
+}
+.svp-header__ele:hover {
+  opacity: 0.9;
+}
+.svp-header__ele span {
+  margin-top: 2px;
+  white-space: nowrap;
+}
+.svp-toolbar {
+  flex: 0 0 var(--svp-toolbar-height);
+  display: flex;
+  align-items: center;
+  gap: 0;
+  padding: 0 16px;
+  background: var(--svp-bg);
+  border-bottom: 1px solid var(--svp-border);
+  z-index: calc(var(--svp-z-toolbar) - 1);
+  overflow-x: auto;
+  overflow-y: hidden;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+.svp-toolbar__btn {
+  width: 26px;
+  height: 27px;
+  padding: 0 4px;
+  border: 1px solid transparent;
+  margin: 0 1px;
+  background: transparent;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 3px;
+  color: var(--svp-fg);
+  cursor: pointer;
+  flex-shrink: 0;
+}
+.svp-toolbar__btn:hover:not(.is-disabled):not(.is-active) {
+  background: var(--svp-bg-soft);
+}
+.svp-toolbar__btn.is-active {
+  color: var(--svp-primary);
+  background: color-mix(in srgb, var(--svp-primary) 12%, var(--svp-bg));
+  border-color: color-mix(in srgb, var(--svp-primary) 35%, var(--svp-border));
+}
+.svp-toolbar__btn.is-disabled {
+  color: var(--svp-fg-muted);
+  cursor: not-allowed;
+}
+.svp-toolbar__btn svg {
+  width: 18px;
+  height: 18px;
+  display: block;
+}
+.svp-toolbar__zoom {
+  min-width: 42px;
+  padding: 0 4px;
+  font-size: 12px;
+  line-height: 27px;
+  color: var(--svp-fg);
+  text-align: center;
+  flex-shrink: 0;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+.svp-toolbar__lang-select {
+  height: 24px;
+  margin: 0 1px;
+  padding: 0 6px;
+  border: 1px solid var(--svp-border);
+  border-radius: 3px;
+  background: var(--svp-bg);
+  color: var(--svp-fg);
+  font-size: 12px;
+  cursor: pointer;
+  flex-shrink: 0;
+}
+.svp-toolbar__lang-select:hover {
+  border-color: color-mix(in srgb, var(--svp-primary) 35%, var(--svp-border));
+}
+.svp-toolbar__lang-select:focus {
+  outline: none;
+  border-color: var(--svp-primary);
+}
+.svp-toolbar__sep {
+  width: 1px;
+  height: 20px;
+  background: var(--svp-border-strong);
+  margin: 0 8px;
+  flex-shrink: 0;
+}
+.svp-toolbar__spacer {
+  flex: 1;
+  min-width: 8px;
+}
+.svp-workspace {
+  position: relative;
+  flex: 1;
+  overflow: hidden;
+  background: #f0f0f0;
+}
+.svp-footer {
+  flex: 0 0 22px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0 8px;
+  font-size: 11px;
+  color: var(--svp-fg-muted);
+  background: var(--svp-bg);
+  border-top: 1px solid var(--svp-border);
+}
+.svp-canvas-scroller-wrap {
+  position: absolute;
+  left: var(--svp-ruler-size);
+  top: var(--svp-ruler-size);
+  right: 0;
+  bottom: 0;
+  overflow: hidden;
+}
+.svp-canvas-scroller {
+  width: 100%;
+  height: calc(100% + var(--svp-h-scrollbar-clip));
+  overflow-x: auto;
+  overflow-y: auto;
+  padding-bottom: var(--svp-h-scrollbar-clip);
+  margin-bottom: calc(-1 * var(--svp-h-scrollbar-clip));
+  box-sizing: border-box;
+  scrollbar-width: thin;
+  scrollbar-color: var(--svp-scrollbar-thumb) transparent;
+}
+.svp-canvas-scroller::-webkit-scrollbar {
+  width: var(--svp-scrollbar-size);
+  height: 0;
+}
+.svp-canvas-scroller::-webkit-scrollbar:horizontal {
+  height: 0 !important;
+  display: none !important;
+}
+.svp-canvas-scroller::-webkit-scrollbar-thumb:horizontal, .svp-canvas-scroller::-webkit-scrollbar-track:horizontal {
+  display: none !important;
+  height: 0 !important;
+  background: transparent !important;
+}
+.svp-canvas-scroller::-webkit-scrollbar:vertical {
+  width: var(--svp-scrollbar-size);
+}
+.svp-canvas-scroller::-webkit-scrollbar-thumb:vertical {
+  background: var(--svp-scrollbar-thumb);
+  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, transparent 75%, transparent);
+  border-radius: var(--svp-scrollbar-radius);
+}
+.svp-canvas-scroller::-webkit-scrollbar-thumb:vertical:hover {
+  background: var(--svp-scrollbar-thumb);
+}
+.svp-canvas-scroller::-webkit-scrollbar-corner {
+  display: none;
+  background: transparent;
+}
+.svp-design-host {
+  box-sizing: border-box;
+  min-width: -moz-max-content;
+  min-width: max-content;
+  min-height: -moz-max-content;
+  min-height: max-content;
+}
+.svp-dragbox {
+  position: absolute;
+  min-width: 140px;
+  min-height: 44px;
+  border: 0;
+  border-radius: var(--svp-panel-radius);
+  background: var(--svp-bg);
+  box-shadow: var(--svp-panel-shadow);
+  z-index: var(--svp-z-panel);
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+}
+.svp-dragbox.is-folded .svp-dragbox__body {
+  display: none;
+}
+.svp-dragbox.is-dragging {
+  cursor: grabbing;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+.svp-dragbox.is-fixed .svp-dragbox__title {
+  cursor: default;
+}
+.svp-dragbox__header {
+  flex: 0 0 var(--svp-panel-header-height);
+  height: var(--svp-panel-header-height);
+  line-height: var(--svp-panel-header-height);
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0;
+  background: var(--svp-panel-header-bg);
+  color: var(--svp-panel-header-fg);
+  border-bottom: 0;
+  font-size: 12px;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+}
+.svp-dragbox__title {
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  font-weight: 400;
+  padding: 0 4px;
+  cursor: move;
+}
+.svp-dragbox__menu {
+  display: inline-flex;
+  align-items: center;
+  color: inherit;
+  cursor: pointer;
+}
+.svp-dragbox__icon {
+  width: 20px;
+  height: var(--svp-panel-header-height);
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0 2px;
+  flex-shrink: 0;
+}
+.svp-dragbox__icon:hover {
+  opacity: 0.85;
+}
+.svp-dragbox__icon.is-min {
+  transform: rotate(180deg);
+}
+.svp-dragbox__body {
+  flex: 1;
+  contain: paint;
+  overflow-x: hidden;
+  overflow-y: auto;
+  padding: 0;
+  background: var(--svp-bg);
+  color: var(--svp-fg);
+  height: calc(100% - var(--svp-panel-header-height));
+}
+.svp-drag-els {
+  padding-bottom: 6px;
+}
+.svp-drag-els__group {
+  margin-bottom: 6px;
+}
+.svp-drag-els__group-title {
+  clear: both;
+  margin: 0 0 14px 14px;
+  font-size: 14px;
+  font-weight: 700;
+  color: var(--svp-fg);
+}
+.svp-drag-els__list {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-around;
+  align-items: center;
+  margin-top: 6px;
+  padding: 0 14px;
+  gap: 0;
+}
+.ep-draggable-item {
+  display: inline-flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  min-width: 50px;
+  width: calc(50% - 4px);
+  max-width: 86px;
+  margin-bottom: 6px;
+  padding: 0 4px;
+  border: 0;
+  border-radius: 0;
+  font-size: 14px;
+  line-height: 12px;
+  color: var(--svp-fg);
+  background: transparent;
+  cursor: grab;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+  text-align: center;
+}
+.ep-draggable-item:hover {
+  color: var(--svp-primary);
+}
+.ep-draggable-item:active {
+  cursor: grabbing;
+}
+.ep-draggable-item .svp-drag-els__icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 36px;
+  height: 36px;
+  font-size: 22px;
+  line-height: 36px;
+  color: var(--svp-fg);
+}
+.ep-draggable-item .svp-drag-els__icon svg {
+  width: 28px;
+  height: 28px;
+}
+.ep-draggable-item span:last-child {
+  margin-top: 2px;
+  font-size: 14px;
+  line-height: 12px;
+}
+.svp-minimap {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  min-height: 120px;
+  background: #cbd5e1;
+  overflow: hidden;
+}
+.svp-minimap__stage {
+  position: absolute;
+  pointer-events: none;
+}
+.svp-minimap__paper {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  background: #fff;
+  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.16);
+  overflow: hidden;
+  background-image: linear-gradient(to right, rgba(148, 163, 184, 0.18) 1px, transparent 1px), linear-gradient(to bottom, rgba(148, 163, 184, 0.18) 1px, transparent 1px);
+  background-size: 16px 16px;
+}
+.svp-minimap__guide {
+  position: absolute;
+  left: 0;
+  width: 100%;
+  border-top: 1px dashed rgba(100, 116, 139, 0.75);
+  pointer-events: none;
+}
+.svp-minimap__el {
+  position: absolute;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  border-radius: 1px;
+  background: color-mix(in srgb, var(--svp-primary) 88%, white);
+  color: var(--svp-primary-content);
+  overflow: hidden;
+  pointer-events: none;
+}
+.svp-minimap__el--hline, .svp-minimap__el--vline {
+  background: color-mix(in srgb, var(--svp-primary) 55%, white);
+  border-radius: 0;
+}
+.svp-minimap__el--hline {
+  min-height: 1px !important;
+}
+.svp-minimap__el--vline {
+  min-width: 1px !important;
+}
+.svp-minimap__viewport {
+  position: absolute;
+  z-index: 2;
+  box-sizing: border-box;
+  border: 1px solid var(--svp-panel-header-bg);
+  background: hsla(var(--p, 245 80% 50%)/0.08);
+  pointer-events: none;
+}
+.svp-page-tabs {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  flex-wrap: wrap;
+}
+.svp-page-tab {
+  min-width: 26px;
+  height: 22px;
+  padding: 0 10px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border: 1px solid color-mix(in srgb, var(--svp-primary) 28%, var(--svp-border));
+  border-radius: 0;
+  cursor: pointer;
+  font-size: 12px;
+  color: var(--svp-primary);
+  background: var(--svp-bg);
+}
+.svp-page-tab:hover {
+  background: color-mix(in srgb, var(--svp-primary) 10%, transparent);
+}
+.svp-page-tab.active {
+  background: var(--svp-primary);
+  color: var(--svp-primary-content);
+  border-color: var(--svp-primary);
+}
+.svp-page-tab__add {
+  min-width: 22px;
+  height: 22px;
+  padding: 0 8px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border: 1px dashed color-mix(in srgb, var(--svp-primary) 35%, var(--svp-border));
+  border-radius: 0;
+  cursor: pointer;
+  font-size: 13px;
+  color: var(--svp-fg-muted);
+}
+.svp-page-tab__add:hover {
+  color: var(--svp-primary);
+  border-color: var(--svp-primary);
+}
+.svp-list {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+.svp-list__item {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 3px 6px;
+  border-radius: 0;
+  font-size: 12px;
+  cursor: pointer;
+  color: var(--svp-fg);
+}
+.svp-list__item:hover {
+  background: var(--svp-bg-soft);
+}
+.svp-list__item.active {
+  background: var(--svp-panel-header-bg);
+  color: var(--svp-panel-header-fg);
+}
+.svp-list__item.is-disabled {
+  color: var(--svp-fg-muted);
+  cursor: not-allowed;
+}
+.svp-list__item-tag {
+  margin-left: auto;
+  font-size: 10px;
+  color: var(--svp-fg-muted);
+}
+.svp-list__item.active .svp-list__item-delete:hover {
+  color: #fecaca;
+}
+.svp-modal-mask {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.45);
+  z-index: 10000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  /* Override daisyUI `.svp-modal` utility (opacity:0 until `.svp-modal-open`). */
+  opacity: 1 !important;
+  pointer-events: auto !important;
+}
+.svp-modal {
+  width: min(960px, 90vw);
+  max-height: 85vh;
+  display: flex;
+  flex-direction: column;
+  background: var(--svp-bg);
+  border-radius: 0;
+  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18);
+  overflow: hidden;
+  opacity: 1 !important;
+  pointer-events: auto !important;
+}
+.svp-modal__header {
+  flex: 0 0 40px;
+  display: flex;
+  align-items: center;
+  padding: 0 12px;
+  background: var(--svp-panel-header-bg);
+  color: var(--svp-panel-header-fg);
+  font-size: 13px;
+}
+.svp-json-editor__error {
+  padding: 8px 12px;
+  font-size: 12px;
+  color: var(--svp-error, #dc2626);
+  background: color-mix(in srgb, var(--svp-error, #dc2626) 8%, var(--svp-bg));
+  border-top: 1px solid color-mix(in srgb, var(--svp-error, #dc2626) 25%, var(--svp-border));
+}
+.svp-dialog-mask {
+  position: fixed;
+  inset: 0;
+  z-index: 10000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 24px 16px;
+  background: rgba(15, 23, 42, 0.48);
+}
+.svp-dialog {
+  width: min(1080px, 96vw);
+  max-height: min(88vh, 820px);
+  display: flex;
+  flex-direction: column;
+  background: var(--svp-bg);
+  border: 1px solid var(--svp-border);
+  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.28);
+  overflow: hidden;
+}
+.svp-dialog__header {
+  flex: 0 0 44px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+  padding: 0 14px;
+  background: var(--svp-panel-header-bg);
+  color: var(--svp-panel-header-fg);
+}
+.svp-dialog__title {
+  font-size: 14px;
+  font-weight: 600;
+  line-height: 1.2;
+}
+.svp-dialog__close {
+  width: 30px;
+  height: 30px;
+  padding: 0;
+  border: 0;
+  border-radius: 4px;
+  background: transparent;
+  color: inherit;
+  font-size: 22px;
+  line-height: 1;
+  cursor: pointer;
+  opacity: 0.88;
+}
+.svp-dialog__close:hover {
+  opacity: 1;
+  background: color-mix(in srgb, var(--svp-panel-header-fg) 12%, transparent);
+}
+.svp-dialog__body {
+  flex: 1 1 auto;
+  min-height: 0;
+  display: flex;
+  flex-direction: column;
+  background: var(--svp-bg-soft);
+}
+.svp-dialog__footer {
+  flex: 0 0 auto;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+  padding: 10px 14px;
+  border-top: 1px solid var(--svp-border);
+  background: var(--svp-bg);
+}
+.svp-json-editor__body {
+  flex: 1 1 auto;
+  min-height: 0;
+  padding: 12px;
+  gap: 0;
+}
+.svp-json-editor__editor {
+  flex: 1 1 auto;
+  min-height: min(62vh, 560px);
+  display: grid;
+  grid-template-columns: auto 1fr;
+  grid-template-rows: minmax(0, 1fr);
+  overflow: hidden;
+  border: 1px solid var(--svp-border);
+  background: #fff;
+}
+.svp-json-editor__lines {
+  grid-column: 1;
+  grid-row: 1;
+  min-width: 52px;
+  min-height: 0;
+  margin: 0;
+  padding: 14px 10px 14px 14px;
+  border: 0;
+  border-right: 1px solid var(--svp-border);
+  background: #f8fafc;
+  color: #94a3b8;
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+  font-size: 13px;
+  line-height: 1.6;
+  text-align: right;
+  overflow: hidden;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+  white-space: pre;
+}
+.svp-json-editor__textarea {
+  grid-column: 2;
+  grid-row: 1;
+  display: block;
+  width: 100%;
+  min-width: 0;
+  min-height: 0;
+  height: 100%;
+  margin: 0;
+  padding: 14px 16px;
+  border: 0;
+  outline: none;
+  resize: none;
+  background: #fff;
+  color: #0f172a;
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+  font-size: 13px;
+  line-height: 1.6;
+  -moz-tab-size: 2;
+    -o-tab-size: 2;
+       tab-size: 2;
+  overflow: auto;
+  box-sizing: border-box;
+  scrollbar-width: thin;
+  scrollbar-color: #cbd5e1 #f8fafc;
+}
+.svp-json-editor__textarea::-webkit-scrollbar {
+  width: 10px;
+  height: 10px;
+}
+.svp-json-editor__textarea::-webkit-scrollbar-track {
+  background: #f8fafc;
+}
+.svp-json-editor__textarea::-webkit-scrollbar-thumb {
+  background: #cbd5e1;
+  border-radius: 5px;
+  border: 2px solid #f8fafc;
+}
+.svp-json-editor__textarea::-webkit-scrollbar-thumb:hover {
+  background: #94a3b8;
+}
+.svp-json-editor__footer {
+  flex-wrap: wrap;
+}
+.svp-json-editor__footer-left,
+.svp-json-editor__footer-right {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 8px;
+}
+.svp-json-editor__footer-right {
+  margin-left: auto;
+}
+.svp-print-data-editor {
+  width: min(920px, 96vw);
+}
+.svp-print-data-editor__body {
+  flex: 1 1 auto;
+  min-height: 0;
+  padding: 14px 16px;
+  overflow: auto;
+}
+.svp-print-data-editor__empty {
+  padding: 28px 12px;
+  text-align: center;
+  font-size: 13px;
+  color: var(--svp-fg-muted);
+}
+.svp-print-data-editor__section + .svp-print-data-editor__section {
+  margin-top: 16px;
+  padding-top: 16px;
+  border-top: 1px solid var(--svp-border);
+}
+.svp-print-data-editor__section-title {
+  margin-bottom: 10px;
+  font-size: 13px;
+  font-weight: 600;
+  color: var(--svp-fg);
+}
+.svp-print-data-editor__section-sub {
+  margin-left: 8px;
+  font-size: 12px;
+  font-weight: 400;
+  color: var(--svp-fg-muted);
+}
+.svp-print-data-editor__basic-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
+  gap: 10px 12px;
+}
+.svp-print-data-editor__field {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  min-width: 0;
+}
+.svp-print-data-editor__field-label {
+  font-size: 12px;
+  color: var(--svp-fg-muted);
+}
+.svp-print-data-editor__input {
+  width: 100%;
+  height: 28px;
+  padding: 0 8px;
+  border: 1px solid var(--svp-border);
+  border-radius: 0;
+  background: var(--svp-bg);
+  color: var(--svp-fg);
+  font-size: 12px;
+  box-sizing: border-box;
+  outline: none;
+}
+.svp-print-data-editor__input:focus {
+  border-color: var(--svp-primary);
+}
+.svp-print-data-editor__table-wrap {
+  overflow: auto;
+  border: 1px solid var(--svp-border);
+  background: var(--svp-bg);
+}
+.svp-print-data-editor__table {
+  width: 100%;
+  border-collapse: collapse;
+  table-layout: fixed;
+}
+.svp-print-data-editor__table th,
+.svp-print-data-editor__table td {
+  padding: 6px 8px;
+  border-bottom: 1px solid var(--svp-border);
+  vertical-align: middle;
+}
+.svp-print-data-editor__table th {
+  font-size: 12px;
+  font-weight: 600;
+  text-align: left;
+  color: var(--svp-fg);
+  background: var(--svp-bg-soft);
+  white-space: nowrap;
+}
+.svp-print-data-editor__table tbody tr:last-child td {
+  border-bottom: 0;
+}
+.svp-print-data-editor__actions-col {
+  width: 52px;
+  text-align: center;
+}
+.svp-print-data-editor__row-delete {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 28px;
+  height: 28px;
+  padding: 0;
+  border: 1px solid var(--svp-border);
+  border-radius: 0;
+  background: var(--svp-bg);
+  color: var(--svp-fg-muted);
+  cursor: pointer;
+}
+.svp-print-data-editor__row-delete:hover:not(:disabled) {
+  color: #ef4444;
+  border-color: color-mix(in srgb, #ef4444 35%, var(--svp-border));
+}
+.svp-print-data-editor__row-delete:disabled {
+  opacity: 0.45;
+  cursor: not-allowed;
+}
+.svp-print-data-editor__add-row {
+  margin-top: 8px;
+  height: 28px;
+  padding: 0 12px;
+  font-size: 12px;
+}
+.svp-print-data-editor__footer {
+  flex-wrap: wrap;
+}
+.svp-print-data-editor__footer-left,
+.svp-print-data-editor__footer-right {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 8px;
+}
+.svp-print-data-editor__footer-right {
+  margin-left: auto;
+}
+.svp-preview__body {
+  flex: 1 1 auto;
+  min-height: min(72vh, 640px);
+  padding: 16px;
+  overflow: auto;
+  background: #e2e8f0;
+}
+.svp-preview__content {
+  margin: 0 auto;
+  width: -moz-fit-content;
+  width: fit-content;
+  max-width: 100%;
+  background: #fff;
+  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
+}
+.svp-preview__empty {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-height: 240px;
+  color: var(--svp-fg-muted);
+  font-size: 14px;
+}
+.svp-preview__footer {
+  justify-content: flex-end;
+  flex-wrap: wrap;
+  gap: 8px;
+}
+.svp-btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  height: 32px;
+  min-height: 32px;
+  padding: 0 12px;
+  border-radius: 0;
+  border: 1px solid var(--svp-border);
+  background: var(--svp-bg);
+  color: var(--svp-fg);
+  font-size: 14px;
+  text-transform: none;
+  cursor: pointer;
+}
+.svp-btn:hover {
+  border-color: var(--svp-primary);
+  color: var(--svp-primary);
+}
+.svp-btn.is-primary {
+  background: var(--svp-primary);
+  color: var(--svp-primary-content);
+  border-color: var(--svp-primary);
+}
+.svp-btn.is-info {
+  background: color-mix(in srgb, var(--svp-info, #3b82f6) 92%, white);
+  color: var(--svp-info-content, #fff);
+  border-color: color-mix(in srgb, var(--svp-info, #3b82f6) 92%, white);
+}
+.svp-btn.is-info:hover {
+  opacity: 0.92;
+  color: var(--svp-info-content, #fff);
+}
+.svp-btn.is-danger {
+  background: color-mix(in srgb, var(--svp-error, #ef4444) 90%, white);
+  color: #fff;
+  border-color: color-mix(in srgb, var(--svp-error, #ef4444) 90%, white);
+}
+.svp-btn.is-danger:hover {
+  opacity: 0.92;
+  color: #fff;
+}
+.svp-btn.is-icon {
+  border: none;
+  padding: 0 6px;
+  background: transparent;
+}
+.svp-btn.is-icon:hover {
+  border: none;
+  color: var(--svp-primary);
+  background: color-mix(in srgb, var(--svp-primary) 8%, transparent);
+}
+.svp-ruler-corner {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: var(--svp-ruler-size);
+  height: var(--svp-ruler-size);
+  background: var(--svp-ruler-bg);
+  border-right: 1px solid var(--svp-ruler-border);
+  border-bottom: 1px solid var(--svp-ruler-border);
+  z-index: var(--svp-z-ruler);
+}
+.svp-ruler-x, .svp-ruler-y {
+  position: absolute;
+  background: var(--svp-ruler-bg);
+  z-index: var(--svp-z-ruler);
+  overflow: hidden;
+}
+.svp-ruler-x {
+  left: var(--svp-ruler-size);
+  top: 0;
+  right: 0;
+  height: var(--svp-ruler-size);
+  border-bottom: 1px solid var(--svp-ruler-border);
+}
+.svp-ruler-y {
+  left: 0;
+  top: var(--svp-ruler-size);
+  bottom: 0;
+  width: var(--svp-ruler-size);
+  border-right: 1px solid var(--svp-ruler-border);
+}.svp-icon[data-v-574dc42c] {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex: 0 0 auto;
+  line-height: 0;
+  color: inherit;
+  vertical-align: middle;
+}
+.svp-icon[data-v-574dc42c] svg {
+  display: block;
+}
+.svp-icon--svg[data-v-574dc42c] svg {
+  width: 100%;
+  height: 100%;
+}.svp-structure[data-v-de1f10ed] {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+.svp-structure__empty[data-v-de1f10ed] {
+  padding: 6px 8px;
+  font-size: 12px;
+  color: var(--svp-fg-muted);
+}
+.svp-structure__item[data-v-de1f10ed] {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  min-height: 24px;
+  padding: 2px 4px;
+  border-radius: 0;
+  cursor: pointer;
+  font-size: 12px;
+  color: var(--svp-fg);
+}
+.svp-structure__item[data-v-de1f10ed]:hover {
+  background: var(--svp-bg-soft);
+}
+.svp-structure__item.active[data-v-de1f10ed] {
+  background: var(--svp-primary);
+  color: var(--svp-primary-content);
+}
+.svp-structure__item.active[data-v-de1f10ed]:hover {
+  background: var(--svp-primary);
+}
+.svp-structure__icon[data-v-de1f10ed] {
+  flex: 0 0 18px;
+}
+.svp-structure__label[data-v-de1f10ed] {
+  flex: 1;
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.svp-structure__delete[data-v-de1f10ed] {
+  flex: 0 0 auto;
+  width: 20px;
+  height: 20px;
+  padding: 0;
+  border: 0;
+  border-radius: 0;
+  background: transparent;
+  color: inherit;
+  cursor: pointer;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  opacity: 0.75;
+}
+.svp-structure__delete[data-v-de1f10ed]:hover {
+  opacity: 1;
+  color: #ef4444;
+}.svp-history__meta[data-v-0e81a9ac] {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 4px;
+}
+.svp-history__counter[data-v-0e81a9ac] {
+  font-size: 11px;
+  color: var(--svp-fg-muted);
+}
+.svp-list__item-icon[data-v-0e81a9ac] {
+  flex: 0 0 16px;
+}
+.svp-list__item-label[data-v-0e81a9ac] {
+  flex: 1;
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.svp-list__item-delete[data-v-0e81a9ac] {
+  flex: 0 0 auto;
+  width: 20px;
+  height: 20px;
+  padding: 0;
+  border: 0;
+  border-radius: 0;
+  background: transparent;
+  color: inherit;
+  cursor: pointer;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  opacity: 0.75;
+}
+.svp-list__item-delete[data-v-0e81a9ac]:hover {
+  opacity: 1;
+  color: #ef4444;
+}
+.svp-properties-host[data-v-572557e5] {
+  height: 100%;
+  min-width: 0;
+  overflow-x: hidden;
+  overflow-y: auto;
+}