@yui540/comimi 0.2.0 → 0.2.1

package/dist/components/inputs.styles.d.ts

@@ -1,2 +1,2 @@
-export declare const inputsStyles = "\n.comimi-selectbox {\n  position: relative;\n  display: inline-block;\n  width: 100%;\n}\n\n.comimi-selectbox-bg {\n  position: absolute;\n  inset: 0;\n  border-radius: 8px;\n  background: #eeeeee;\n  transition: inset 0.36s var(--comimi-spring);\n}\n\n@media (hover: hover) {\n  .comimi-selectbox:hover .comimi-selectbox-bg {\n    inset: -3px;\n  }\n}\n\n.comimi-selectbox-select {\n  position: absolute;\n  inset: 0;\n  z-index: 2;\n  width: 100%;\n  height: 100%;\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  appearance: none;\n  -webkit-appearance: none;\n  color: transparent;\n  font: inherit;\n  cursor: pointer;\n  opacity: 0;\n}\n\n.comimi-selectbox-select:disabled {\n  cursor: not-allowed;\n}\n\n.comimi-selectbox-label {\n  position: relative;\n  display: block;\n  box-sizing: border-box;\n  width: 100%;\n  padding: 8px 32px 8px 12px;\n  color: #333;\n  font-size: 12px;\n  font-weight: 400;\n  line-height: 1.45;\n  cursor: pointer;\n  pointer-events: none;\n}\n\n.comimi-selectbox-arrow {\n  position: absolute;\n  top: 50%;\n  right: 12px;\n  z-index: 1;\n  width: 16px;\n  height: 16px;\n  color: #aaa;\n  transform: translateY(-50%) rotate(90deg);\n  pointer-events: none;\n}\n\n@media (hover: hover) {\n  .comimi-selectbox:hover .comimi-selectbox-arrow {\n    animation: comimi-selectbox-arrow 0.5s ease-in-out 0s both;\n  }\n}\n\n@keyframes comimi-selectbox-arrow {\n  from, to {\n    transform: translateY(-50%) rotate(90deg);\n  }\n  40% {\n    transform: translateY(calc(-50% + 3px)) rotate(90deg);\n  }\n  70% {\n    transform: translateY(calc(-50% - 1.5px)) rotate(90deg);\n  }\n}\n\n.comimi-toggle-switch {\n  display: grid;\n  grid-template-columns: repeat(2, auto);\n  column-gap: 6px;\n  justify-content: start;\n  align-items: center;\n  width: 100%;\n  padding: 2px;\n  border: 0;\n  background: transparent;\n  cursor: pointer;\n}\n\n.comimi-toggle-track {\n  position: relative;\n  width: 32px;\n  height: 18px;\n  border-radius: 999px;\n  background: #eeeeee;\n  transition: background-color 0.2s linear;\n}\n\n.comimi-toggle-switch[data-checked=\"true\"] .comimi-toggle-track {\n  background: #666;\n}\n\n.comimi-toggle-knob {\n  position: absolute;\n  top: 2px;\n  left: 2px;\n  width: 14px;\n  height: 14px;\n  border-radius: 50%;\n  background: #666;\n  transition:\n    transform 0.36s var(--comimi-spring),\n    background-color 0.2s linear;\n}\n\n.comimi-toggle-switch[data-checked=\"true\"] .comimi-toggle-knob {\n  background: #fff;\n  transform: translateX(100%);\n}\n\n.comimi-toggle-label-wrap {\n  position: relative;\n  width: 22px;\n  height: 12px;\n  overflow: hidden;\n}\n\n.comimi-toggle-label-inner {\n  position: absolute;\n  inset: 0;\n  transition: transform 0.36s var(--comimi-spring);\n}\n\n.comimi-toggle-switch[data-checked=\"false\"] .comimi-toggle-label-inner {\n  transform: translateX(-100%);\n}\n\n.comimi-toggle-label {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  font-size: 11px;\n  font-weight: 400;\n  line-height: 12px;\n  text-align: center;\n}\n\n.comimi-toggle-label-on {\n  color: #333;\n}\n\n.comimi-toggle-label-off {\n  color: #aaa;\n  transform: translateX(100%);\n}\n\n.comimi-range-slider {\n  display: grid;\n  grid-template-columns: 1fr auto;\n  column-gap: 8px;\n  align-items: center;\n  width: 100%;\n}\n\n.comimi-range-slider[data-disabled=\"true\"] {\n  opacity: 0.6;\n}\n\n.comimi-range-slider-wrap {\n  position: relative;\n  display: grid;\n  align-items: center;\n  min-width: 0;\n  height: 18px;\n}\n\n.comimi-range-slider-track {\n  position: absolute;\n  top: 50%;\n  left: 0;\n  right: 0;\n  height: 6px;\n  border-radius: 999px;\n  background: #eeeeee;\n  overflow: hidden;\n  transform: translateY(-50%);\n  transition: height 0.36s var(--comimi-spring);\n}\n\n@media (hover: hover) {\n  .comimi-range-slider-wrap:hover .comimi-range-slider-track {\n    height: 10px;\n  }\n}\n\n.comimi-range-slider-fill {\n  display: block;\n  height: 100%;\n  background: #666;\n  border-radius: inherit;\n}\n\n.comimi-range-slider-input {\n  position: relative;\n  z-index: 1;\n  width: 100%;\n  height: 18px;\n  margin: 0;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  appearance: none;\n  -webkit-appearance: none;\n  cursor: pointer;\n}\n\n.comimi-range-slider-input::-webkit-slider-runnable-track {\n  height: 6px;\n  background: transparent;\n  border: 0;\n}\n\n.comimi-range-slider-input::-webkit-slider-thumb {\n  appearance: none;\n  -webkit-appearance: none;\n  width: 18px;\n  height: 18px;\n  margin-top: -6px;\n  border: 0;\n  border-radius: 50%;\n  background: #666;\n  box-shadow: none;\n  transition:\n    transform 0.36s var(--comimi-spring),\n    background-color 0.2s ease-in-out;\n}\n\n.comimi-range-slider-input:hover:not(:disabled)::-webkit-slider-thumb {\n  transform: scale(1.15);\n}\n\n.comimi-range-slider-input::-moz-range-track {\n  height: 6px;\n  background: transparent;\n  border: 0;\n}\n\n.comimi-range-slider-input::-moz-range-thumb {\n  width: 18px;\n  height: 18px;\n  border: 0;\n  border-radius: 50%;\n  background: #666;\n  box-shadow: none;\n  transition:\n    transform 0.36s var(--comimi-spring),\n    background-color 0.2s ease-in-out;\n}\n\n.comimi-range-slider-input:hover:not(:disabled)::-moz-range-thumb {\n  transform: scale(1.15);\n}\n\n.comimi-range-slider-input:focus-visible {\n  outline: none;\n}\n\n.comimi-range-slider-input:focus-visible::-webkit-slider-thumb {\n  box-shadow: none;\n}\n\n.comimi-range-slider-input:focus-visible::-moz-range-thumb {\n  box-shadow: none;\n}\n\n.comimi-range-slider-value {\n  width: 36px;\n  color: #666;\n  font-size: 11px;\n  font-weight: 400;\n  line-height: 1;\n  text-align: right;\n  white-space: nowrap;\n}\n";
+export declare const inputsStyles = "\n.comimi-selectbox {\n  position: relative;\n  display: inline-block;\n  width: 100%;\n}\n\n.comimi-selectbox-bg {\n  position: absolute;\n  inset: 0;\n  border-radius: 8px;\n  background: #eeeeee;\n  transition: inset 0.36s var(--comimi-spring);\n}\n\n@media (hover: hover) {\n  .comimi-selectbox:hover .comimi-selectbox-bg {\n    inset: -3px;\n  }\n}\n\n.comimi-selectbox-select {\n  position: absolute;\n  inset: 0;\n  z-index: 2;\n  width: 100%;\n  height: 100%;\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  appearance: none;\n  -webkit-appearance: none;\n  color: transparent;\n  font: inherit;\n  cursor: pointer;\n  opacity: 0;\n}\n\n.comimi-selectbox-select:disabled {\n  cursor: not-allowed;\n}\n\n.comimi-selectbox-select option {\n  color: #333;\n  background-color: #fff;\n}\n\n.comimi-selectbox-label {\n  position: relative;\n  display: block;\n  box-sizing: border-box;\n  width: 100%;\n  padding: 8px 32px 8px 12px;\n  color: #333;\n  font-size: 12px;\n  font-weight: 400;\n  line-height: 1.45;\n  cursor: pointer;\n  pointer-events: none;\n}\n\n.comimi-selectbox-arrow {\n  position: absolute;\n  top: 50%;\n  right: 12px;\n  z-index: 1;\n  width: 16px;\n  height: 16px;\n  color: #aaa;\n  transform: translateY(-50%) rotate(90deg);\n  pointer-events: none;\n}\n\n@media (hover: hover) {\n  .comimi-selectbox:hover .comimi-selectbox-arrow {\n    animation: comimi-selectbox-arrow 0.5s ease-in-out 0s both;\n  }\n}\n\n@keyframes comimi-selectbox-arrow {\n  from, to {\n    transform: translateY(-50%) rotate(90deg);\n  }\n  40% {\n    transform: translateY(calc(-50% + 3px)) rotate(90deg);\n  }\n  70% {\n    transform: translateY(calc(-50% - 1.5px)) rotate(90deg);\n  }\n}\n\n.comimi-toggle-switch {\n  display: grid;\n  grid-template-columns: repeat(2, auto);\n  column-gap: 6px;\n  justify-content: start;\n  align-items: center;\n  width: 100%;\n  padding: 2px;\n  border: 0;\n  background: transparent;\n  cursor: pointer;\n}\n\n.comimi-toggle-track {\n  position: relative;\n  width: 32px;\n  height: 18px;\n  border-radius: 999px;\n  background: #eeeeee;\n  transition: background-color 0.2s linear;\n}\n\n.comimi-toggle-switch[data-checked=\"true\"] .comimi-toggle-track {\n  background: #666;\n}\n\n.comimi-toggle-knob {\n  position: absolute;\n  top: 2px;\n  left: 2px;\n  width: 14px;\n  height: 14px;\n  border-radius: 50%;\n  background: #666;\n  transition:\n    transform 0.36s var(--comimi-spring),\n    background-color 0.2s linear;\n}\n\n.comimi-toggle-switch[data-checked=\"true\"] .comimi-toggle-knob {\n  background: #fff;\n  transform: translateX(100%);\n}\n\n.comimi-toggle-label-wrap {\n  position: relative;\n  width: 22px;\n  height: 12px;\n  overflow: hidden;\n}\n\n.comimi-toggle-label-inner {\n  position: absolute;\n  inset: 0;\n  transition: transform 0.36s var(--comimi-spring);\n}\n\n.comimi-toggle-switch[data-checked=\"false\"] .comimi-toggle-label-inner {\n  transform: translateX(-100%);\n}\n\n.comimi-toggle-label {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  font-size: 11px;\n  font-weight: 400;\n  line-height: 12px;\n  text-align: center;\n}\n\n.comimi-toggle-label-on {\n  color: #333;\n}\n\n.comimi-toggle-label-off {\n  color: #aaa;\n  transform: translateX(100%);\n}\n\n.comimi-range-slider {\n  display: grid;\n  grid-template-columns: 1fr auto;\n  column-gap: 8px;\n  align-items: center;\n  width: 100%;\n}\n\n.comimi-range-slider[data-disabled=\"true\"] {\n  opacity: 0.6;\n}\n\n.comimi-range-slider-wrap {\n  position: relative;\n  display: grid;\n  align-items: center;\n  min-width: 0;\n  height: 18px;\n}\n\n.comimi-range-slider-track {\n  position: absolute;\n  top: 50%;\n  left: 0;\n  right: 0;\n  height: 6px;\n  border-radius: 999px;\n  background: #eeeeee;\n  overflow: hidden;\n  transform: translateY(-50%);\n  transition: height 0.36s var(--comimi-spring);\n}\n\n@media (hover: hover) {\n  .comimi-range-slider-wrap:hover .comimi-range-slider-track {\n    height: 10px;\n  }\n}\n\n.comimi-range-slider-fill {\n  display: block;\n  height: 100%;\n  background: #666;\n  border-radius: inherit;\n}\n\n.comimi-range-slider-input {\n  position: relative;\n  z-index: 1;\n  width: 100%;\n  height: 18px;\n  margin: 0;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  appearance: none;\n  -webkit-appearance: none;\n  cursor: pointer;\n}\n\n.comimi-range-slider-input::-webkit-slider-runnable-track {\n  height: 6px;\n  background: transparent;\n  border: 0;\n}\n\n.comimi-range-slider-input::-webkit-slider-thumb {\n  appearance: none;\n  -webkit-appearance: none;\n  width: 18px;\n  height: 18px;\n  margin-top: -6px;\n  border: 0;\n  border-radius: 50%;\n  background: #666;\n  box-shadow: none;\n  transition:\n    transform 0.36s var(--comimi-spring),\n    background-color 0.2s ease-in-out;\n}\n\n.comimi-range-slider-input:hover:not(:disabled)::-webkit-slider-thumb {\n  transform: scale(1.15);\n}\n\n.comimi-range-slider-input::-moz-range-track {\n  height: 6px;\n  background: transparent;\n  border: 0;\n}\n\n.comimi-range-slider-input::-moz-range-thumb {\n  width: 18px;\n  height: 18px;\n  border: 0;\n  border-radius: 50%;\n  background: #666;\n  box-shadow: none;\n  transition:\n    transform 0.36s var(--comimi-spring),\n    background-color 0.2s ease-in-out;\n}\n\n.comimi-range-slider-input:hover:not(:disabled)::-moz-range-thumb {\n  transform: scale(1.15);\n}\n\n.comimi-range-slider-input:focus-visible {\n  outline: none;\n}\n\n.comimi-range-slider-input:focus-visible::-webkit-slider-thumb {\n  box-shadow: none;\n}\n\n.comimi-range-slider-input:focus-visible::-moz-range-thumb {\n  box-shadow: none;\n}\n\n.comimi-range-slider-value {\n  width: 36px;\n  color: #666;\n  font-size: 11px;\n  font-weight: 400;\n  line-height: 1;\n  text-align: right;\n  white-space: nowrap;\n}\n";
 //# sourceMappingURL=inputs.styles.d.ts.map

package/dist/components/inputs.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"inputs.styles.d.ts","sourceRoot":"","sources":["../../src/components/inputs.styles.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,YAAY,ypLAySxB,CAAC"}
+{"version":3,"file":"inputs.styles.d.ts","sourceRoot":"","sources":["../../src/components/inputs.styles.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,YAAY,4uLA8SxB,CAAC"}

package/dist/components/page-stage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"page-stage.d.ts","sourceRoot":"","sources":["../../src/components/page-stage.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AACpC,OAAO,KAAK,EAGV,eAAe,EACf,WAAW,EACZ,MAAM,UAAU,CAAC;AASlB,MAAM,WAAW,gBAAgB;IAC/B,WAAW,EAAE,WAAW,CAAC;IACzB,IAAI,EAAE,IAAI,CAAC;IACX,gBAAgB,EAAE,MAAM,OAAO,CAAC;IAChC,cAAc,CAAC,EAAE,eAAe,CAAC;CAClC;AAOD,qBAAa,SAAS;IAMR,OAAO,CAAC,OAAO;IAL3B,OAAO,CAAC,IAAI,CAAiB;IAC7B,OAAO,CAAC,YAAY,CAA6B;IACjD,OAAO,CAAC,eAAe,CAAsC;IAC7D,OAAO,CAAC,KAAK,CAAiC;gBAE1B,OAAO,EAAE,gBAAgB;IAK7C,UAAU,IAAI,cAAc;IAI5B,aAAa,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,UAAQ,GAAG,IAAI;IAKrD;;;;OAIG;IACH,aAAa,IAAI,IAAI;IAarB,MAAM,CAAC,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,OAAO,GAAG,IAAI;IAqCnD,OAAO,CAAC,cAAc;IAetB,OAAO,CAAC,SAAS;CA2ElB"}
+{"version":3,"file":"page-stage.d.ts","sourceRoot":"","sources":["../../src/components/page-stage.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AACpC,OAAO,KAAK,EAGV,eAAe,EACf,WAAW,EACZ,MAAM,UAAU,CAAC;AASlB,MAAM,WAAW,gBAAgB;IAC/B,WAAW,EAAE,WAAW,CAAC;IACzB,IAAI,EAAE,IAAI,CAAC;IACX,gBAAgB,EAAE,MAAM,OAAO,CAAC;IAChC,cAAc,CAAC,EAAE,eAAe,CAAC;CAClC;AAOD,qBAAa,SAAS;IAMR,OAAO,CAAC,OAAO;IAL3B,OAAO,CAAC,IAAI,CAAiB;IAC7B,OAAO,CAAC,YAAY,CAA6B;IACjD,OAAO,CAAC,eAAe,CAAsC;IAC7D,OAAO,CAAC,KAAK,CAAiC;gBAE1B,OAAO,EAAE,gBAAgB;IAK7C,UAAU,IAAI,cAAc;IAI5B,aAAa,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,UAAQ,GAAG,IAAI;IAKrD;;;;OAIG;IACH,aAAa,IAAI,IAAI;IAkBrB,MAAM,CAAC,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,OAAO,GAAG,IAAI;IAqCnD,OAAO,CAAC,cAAc;IAetB,OAAO,CAAC,SAAS;CA4ElB"}

package/dist/components/page-stage.styles.d.ts

@@ -1,2 +1,2 @@
-export declare const pageStageStyles = "\n.comimi-stage {\n  position: absolute;\n  inset: 0;\n  will-change: transform;\n  transition: transform .18s ease;\n}\n\n.comimi-stage[data-dragging=\"true\"] {\n  transition: none;\n}\n\n.comimi-page-group {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 0;\n  box-sizing: border-box;\n}\n\n.comimi-page {\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  max-width: 100%;\n  max-height: 100%;\n  min-width: 0;\n  min-height: 0;\n  background: transparent;\n  overflow: hidden;\n  flex: 0 0 auto;\n}\n\n.comimi-page[data-spread=\"true\"] {\n  width: 50%;\n  height: 100%;\n}\n\n.comimi-page[data-spread=\"false\"] {\n  width: 100%;\n  height: 100%;\n}\n\n.comimi-page[data-position=\"left\"] {\n  justify-content: flex-end;\n}\n\n.comimi-page[data-position=\"right\"] {\n  justify-content: flex-start;\n}\n\n.comimi-page img,\n.comimi-html-page {\n  display: block;\n  max-width: 100%;\n  max-height: 100%;\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n  transform-origin: center center;\n  user-select: none;\n  -webkit-user-select: none;\n  -webkit-user-drag: none;\n  -webkit-touch-callout: none;\n}\n\n.comimi-page[data-spread=\"true\"] img,\n.comimi-page[data-spread=\"true\"] .comimi-html-page {\n  width: 100%;\n  height: 100%;\n}\n\n.comimi-page[data-position=\"left\"] img,\n.comimi-page[data-position=\"left\"] .comimi-html-page {\n  object-position: right center;\n}\n\n.comimi-page[data-position=\"right\"] img,\n.comimi-page[data-position=\"right\"] .comimi-html-page {\n  object-position: left center;\n}\n\n.comimi-html-page {\n  width: min(100%, 960px);\n  height: min(100%, 680px);\n  background: #fff;\n  color: #111;\n  overflow: auto;\n}\n\n";
+export declare const pageStageStyles = "\n.comimi-stage {\n  position: absolute;\n  inset: 0;\n  will-change: transform;\n  transition: transform .18s ease;\n}\n\n.comimi-stage[data-dragging=\"true\"] {\n  transition: none;\n}\n\n.comimi-page-group {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 0;\n  box-sizing: border-box;\n}\n\n.comimi-page {\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  max-width: 100%;\n  max-height: 100%;\n  min-width: 0;\n  min-height: 0;\n  background: transparent;\n  overflow: hidden;\n  flex: 0 0 auto;\n}\n\n.comimi-page[data-spread=\"true\"] {\n  width: 50%;\n  height: 100%;\n}\n\n.comimi-page[data-spread=\"false\"] {\n  width: 100%;\n  height: 100%;\n}\n\n.comimi-page[data-position=\"left\"] {\n  justify-content: flex-end;\n}\n\n.comimi-page[data-position=\"right\"] {\n  justify-content: flex-start;\n}\n\n.comimi-page img,\n.comimi-html-page {\n  display: block;\n  max-width: 100%;\n  max-height: 100%;\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n  transform-origin: center center;\n  user-select: none;\n  -webkit-user-select: none;\n  -webkit-user-drag: none;\n  -webkit-touch-callout: none;\n}\n\n.comimi-page img {\n  pointer-events: none;\n}\n\n.comimi-page[data-spread=\"true\"] img,\n.comimi-page[data-spread=\"true\"] .comimi-html-page {\n  width: 100%;\n  height: 100%;\n}\n\n.comimi-page[data-position=\"left\"] img,\n.comimi-page[data-position=\"left\"] .comimi-html-page {\n  object-position: right center;\n}\n\n.comimi-page[data-position=\"right\"] img,\n.comimi-page[data-position=\"right\"] .comimi-html-page {\n  object-position: left center;\n}\n\n.comimi-html-page {\n  width: min(100%, 960px);\n  height: min(100%, 680px);\n  background: #fff;\n  color: #111;\n  overflow: auto;\n}\n\n";
 //# sourceMappingURL=page-stage.styles.d.ts.map

package/dist/components/page-stage.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"page-stage.styles.d.ts","sourceRoot":"","sources":["../../src/components/page-stage.styles.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe,myDA+F3B,CAAC"}
+{"version":3,"file":"page-stage.styles.d.ts","sourceRoot":"","sources":["../../src/components/page-stage.styles.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe,q1DAmG3B,CAAC"}

package/dist/components/scroll-fade.styles.d.ts

@@ -1,2 +1,2 @@
-export declare const scrollFadeStyles = "\n.comimi-scrollfade {\n  position: relative;\n}\n\n.comimi-scrollfade::before,\n.comimi-scrollfade::after {\n  content: \"\";\n  position: sticky;\n  display: block;\n  left: 0;\n  width: 100%;\n  height: 32px;\n  z-index: 2;\n  pointer-events: none;\n  opacity: 0;\n  transition: opacity 0.16s linear;\n}\n\n.comimi-scrollfade::before {\n  top: 0;\n  background: linear-gradient(to bottom, var(--comimi-bg), transparent);\n}\n\n.comimi-scrollfade::after {\n  bottom: 0;\n  background: linear-gradient(to top, var(--comimi-bg), transparent);\n}\n\n.comimi-scrollfade[data-scroll-up=\"true\"]::before {\n  opacity: 1;\n}\n\n.comimi-scrollfade[data-scroll-down=\"true\"]::after {\n  opacity: 1;\n}\n";
+export declare const scrollFadeStyles = "\n.comimi-scrollfade {\n  position: relative;\n  overscroll-behavior: contain;\n}\n\n.comimi-scrollfade::before,\n.comimi-scrollfade::after {\n  content: \"\";\n  position: sticky;\n  display: block;\n  left: 0;\n  width: 100%;\n  height: 32px;\n  z-index: 2;\n  pointer-events: none;\n  opacity: 0;\n  transition: opacity 0.16s linear;\n}\n\n.comimi-scrollfade::before {\n  top: 0;\n  background: linear-gradient(to bottom, #fff, transparent);\n}\n\n.comimi-scrollfade::after {\n  bottom: 0;\n  background: linear-gradient(to top, #fff, transparent);\n}\n\n.comimi-scrollfade[data-scroll-up=\"true\"]::before {\n  opacity: 1;\n}\n\n.comimi-scrollfade[data-scroll-down=\"true\"]::after {\n  opacity: 1;\n}\n";
 //# sourceMappingURL=scroll-fade.styles.d.ts.map

package/dist/components/scroll-fade.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"scroll-fade.styles.d.ts","sourceRoot":"","sources":["../../src/components/scroll-fade.styles.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,gBAAgB,+rBAoC5B,CAAC"}
+{"version":3,"file":"scroll-fade.styles.d.ts","sourceRoot":"","sources":["../../src/components/scroll-fade.styles.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,gBAAgB,wsBAqC5B,CAAC"}

package/dist/index.js

@@ -1114,7 +1114,7 @@ var B = class {
 		this.root.dataset.dragging = t ? "false" : String(e !== 0), this.root.style.transform = e === 0 ? "" : `translateX(${e}px)`;
 	}
 	snapTransform() {
-		this.root.dataset.dragging = "false", this.root.style.transition = "none", this.root.style.transform = "", typeof requestAnimationFrame == "function" ? requestAnimationFrame(() => {
+		this.root.dataset.dragging = "false", this.root.style.transition = "none", this.root.style.transform = "", this.root.offsetWidth, typeof requestAnimationFrame == "function" ? requestAnimationFrame(() => {
 			this.root.style.transition = "";
 		}) : this.root.style.transition = "";
 	}
@@ -1152,7 +1152,7 @@ var B = class {
 		let a = document.createElement("img");
 		a.alt = t.alt ?? t.label ?? `${n + 1}`, a.draggable = !1, a.style.transform = V(e), a.addEventListener("error", () => {
 			i.replaceChildren(I(this.options.i18n, n + 1));
-		}), i.append(a);
+		}), a.addEventListener("contextmenu", (e) => e.preventDefault()), i.append(a);
 		let o = `${e.manga.id}:${t.id}`, s = this.imageSources.get(o);
 		if (s) return a.src = s, {
 			slot: i,
@@ -1282,7 +1282,7 @@ function de({ className: e } = {}) {
 }
 //#endregion
 //#region src/components/arrow-buttons.styles.ts
-var fe = "\n.comimi-arrows {\n  position: absolute;\n  inset: 0;\n  pointer-events: none;\n  z-index: 30;\n}\n\n.comimi-arrow-button {\n  position: absolute;\n  top: 50%;\n  width: 46px;\n  height: 46px;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  cursor: pointer;\n  pointer-events: auto;\n  transform: translateY(-50%);\n}\n\n.comimi-arrow-next {\n  right: 24px;\n}\n\n.comimi-arrow-prev {\n  left: 24px;\n}\n\n.comimi-arrow-inner {\n  position: absolute;\n  inset: 0;\n  transition:\n    transform 0.6s var(--comimi-spring),\n    opacity 0.3s linear;\n}\n\n.comimi-arrows[data-overlay=\"false\"] .comimi-arrow-next .comimi-arrow-inner {\n  transform: translateX(35px);\n  opacity: 0;\n  transition:\n    transform 0.3s var(--comimi-spring),\n    opacity 0.15s linear;\n}\n\n.comimi-arrows[data-overlay=\"false\"] .comimi-arrow-prev .comimi-arrow-inner {\n  transform: translateX(-35px);\n  opacity: 0;\n  transition:\n    transform 0.3s var(--comimi-spring),\n    opacity 0.15s linear;\n}\n\n.comimi-arrows[data-overlay=\"false\"] {\n  pointer-events: none;\n}\n\n.comimi-arrow-bg {\n  position: absolute;\n  inset: 0;\n  border-radius: 16px;\n  background: var(--comimi-glass);\n  box-shadow: var(--comimi-shadow);\n  backdrop-filter: blur(5px);\n  transition: inset 0.36s var(--comimi-spring), border-radius 0.36s var(--comimi-spring);\n}\n\n.comimi-arrow-icon {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  width: 20px;\n  height: 20px;\n  color: #666;\n  transform: translate(-50%, -50%);\n  pointer-events: none;\n}\n\n.comimi-arrow-prev .comimi-arrow-icon {\n  transform: translate(-50%, -50%) scaleX(-1);\n}\n\n@keyframes comimi-arrow-bounce {\n  from, to {\n    transform: translate(-50%, -50%);\n  }\n  40% {\n    transform: translate(calc(-50% + 3px), -50%);\n  }\n  70% {\n    transform: translate(calc(-50% - 1.5px), -50%);\n  }\n}\n\n@keyframes comimi-arrow-bounce-prev {\n  from, to {\n    transform: translate(-50%, -50%) scaleX(-1);\n  }\n  40% {\n    transform: translate(calc(-50% - 3px), -50%) scaleX(-1);\n  }\n  70% {\n    transform: translate(calc(-50% + 1.5px), -50%) scaleX(-1);\n  }\n}\n\n@media (hover: hover) {\n  .comimi-arrow-button:hover .comimi-arrow-bg {\n    inset: -3px;\n    border-radius: 20px;\n  }\n\n  .comimi-arrow-next:hover .comimi-arrow-icon {\n    animation: comimi-arrow-bounce 0.5s ease-in-out 0.1s both;\n  }\n\n  .comimi-arrow-prev:hover .comimi-arrow-icon {\n    animation: comimi-arrow-bounce-prev 0.5s ease-in-out 0.1s both;\n  }\n}\n\n@media (max-width: 767px) {\n  .comimi-arrow-button {\n    width: 36px;\n    height: 50px;\n  }\n\n  .comimi-arrow-next {\n    right: 0;\n  }\n\n  .comimi-arrow-prev {\n    left: 0;\n  }\n\n  .comimi-arrow-next .comimi-arrow-bg {\n    border-radius: 16px 0 0 16px;\n  }\n\n  .comimi-arrow-prev .comimi-arrow-bg {\n    border-radius: 0 16px 16px 0;\n  }\n}\n", pe = "\n.comimi-center-message {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  pointer-events: none;\n  z-index: 20;\n  transition: opacity 0.3s linear;\n}\n\n.comimi-center-message[data-overlay=\"false\"] {\n  opacity: 0;\n  transition: opacity 0.15s linear;\n}\n\n.comimi-center-message-text {\n  box-sizing: border-box;\n  padding: 6px 12px;\n  border-radius: 8px;\n  background: rgba(255, 255, 255, 0.5);\n  box-shadow: var(--comimi-shadow);\n  backdrop-filter: blur(5px);\n  color: #bbb;\n  font-size: 12px;\n  font-weight: 400;\n  line-height: 1.45;\n  text-align: center;\n  white-space: nowrap;\n}\n\n.comimi-center-message-mobile {\n  display: none;\n}\n\n@media (max-width: 767px) {\n  .comimi-center-message {\n    width: calc(100% - 60px * 2);\n    max-width: max-content;\n  }\n\n  .comimi-center-message-desktop {\n    display: none;\n  }\n\n  .comimi-center-message-mobile {\n    display: block;\n  }\n}\n", me = "\n/* --- Controls dock (bottom) ------------------------------------------- */\n\n.comimi-controls-dock {\n  box-sizing: border-box;\n  position: absolute;\n  bottom: 24px;\n  left: 24px;\n  width: calc(100% - 48px);\n  padding: 20px 24px;\n  z-index: 40;\n  pointer-events: auto;\n  transition:\n    transform 0.6s var(--comimi-spring),\n    opacity 0.3s linear;\n}\n\n.comimi-controls-dock[data-overlay=\"false\"] {\n  transform: translateY(35px);\n  opacity: 0;\n  pointer-events: none;\n  transition:\n    transform 0.3s var(--comimi-spring),\n    opacity 0.15s linear;\n}\n\n.comimi-controls-bg {\n  position: absolute;\n  inset: 0;\n  border-radius: 20px;\n  background: var(--comimi-glass);\n  box-shadow: var(--comimi-shadow);\n  backdrop-filter: blur(5px);\n  transition: inset 0.36s var(--comimi-spring), border-radius 0.36s var(--comimi-spring);\n}\n\n@media (hover: hover) {\n  .comimi-controls-dock:hover > .comimi-controls-bg {\n    inset: -4px -4px 0 -4px;\n    border-radius: 20px;\n  }\n}\n\n.comimi-controls-row {\n  position: relative;\n  display: grid;\n  grid-template-columns: auto auto;\n  justify-content: space-between;\n  align-items: center;\n}\n\n.comimi-controls-side {\n  display: grid;\n  grid-auto-flow: column;\n  column-gap: 16px;\n  justify-content: end;\n  align-items: center;\n  transition:\n    opacity 0.2s ease-in-out,\n    visibility 0.2s ease-in-out;\n}\n\n.comimi-controls-dock[data-autoplay=\"true\"] .comimi-controls-side {\n  opacity: 0;\n  visibility: hidden;\n}\n\n/* --- Seek bar --------------------------------------------------------- */\n\n.comimi-seek {\n  position: relative;\n  display: grid;\n  grid-template-columns: auto 1fr;\n  column-gap: 10px;\n  align-items: center;\n  margin-bottom: 10px;\n}\n\n.comimi-seek-text {\n  display: grid;\n  grid-template-columns: repeat(2, auto);\n  justify-content: start;\n  align-items: end;\n  line-height: 14px;\n}\n\n.comimi-seek-current {\n  color: #333;\n  font-size: 12px;\n  font-weight: 700;\n}\n\n.comimi-seek-total {\n  color: #999;\n  font-size: 12px;\n  font-weight: 400;\n  margin-left: 0.4em;\n}\n\n.comimi-seek-bar {\n  position: relative;\n  width: 100%;\n  height: 18px;\n}\n\n.comimi-seek-track {\n  position: absolute;\n  top: 50%;\n  left: 0;\n  right: 0;\n  height: 8px;\n  border-radius: 999px;\n  background: #e0e0e0;\n  overflow: hidden;\n  transform: translateY(-50%);\n  transition: height 0.36s var(--comimi-spring);\n}\n\n@media (hover: hover) {\n  .comimi-seek-bar:hover .comimi-seek-track {\n    height: 12px;\n  }\n}\n\n.comimi-seek-fill {\n  position: absolute;\n  top: 0;\n  height: 100%;\n  border-radius: 999px;\n  background: #666;\n}\n\n.comimi-seek-bar[data-direction=\"rtl\"] .comimi-seek-fill {\n  right: 0;\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n}\n\n.comimi-seek-bar[data-direction=\"ltr\"] .comimi-seek-fill {\n  left: 0;\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n}\n\n.comimi-seek-input {\n  position: absolute;\n  inset: 0;\n  z-index: 1;\n  width: 100%;\n  height: 18px;\n  margin: 0;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  appearance: none;\n  -webkit-appearance: none;\n  cursor: pointer;\n}\n\n.comimi-seek-input::-webkit-slider-runnable-track {\n  height: 8px;\n  background: transparent;\n  border: 0;\n}\n\n.comimi-seek-input::-webkit-slider-thumb {\n  appearance: none;\n  -webkit-appearance: none;\n  width: 18px;\n  height: 18px;\n  margin-top: -5px;\n  border: 0;\n  border-radius: 50%;\n  background: #666;\n  box-shadow: none;\n  transition:\n    transform 0.36s var(--comimi-spring),\n    background-color 0.2s ease-in-out;\n}\n\n.comimi-seek-input:hover::-webkit-slider-thumb {\n  transform: scale(1.15);\n}\n\n.comimi-seek-input::-moz-range-track {\n  height: 8px;\n  background: transparent;\n  border: 0;\n}\n\n.comimi-seek-input::-moz-range-thumb {\n  width: 18px;\n  height: 18px;\n  border: 0;\n  border-radius: 50%;\n  background: #666;\n  box-shadow: none;\n  transition:\n    transform 0.36s var(--comimi-spring),\n    background-color 0.2s ease-in-out;\n}\n\n.comimi-seek-input:hover::-moz-range-thumb {\n  transform: scale(1.15);\n}\n\n.comimi-seek-input:focus-visible {\n  outline: none;\n}\n\n.comimi-seek-input:focus-visible::-webkit-slider-thumb {\n  box-shadow: none;\n}\n\n.comimi-seek-input:focus-visible::-moz-range-thumb {\n  box-shadow: none;\n}\n\n.comimi-seek-input[data-direction=\"rtl\"] {\n  direction: rtl;\n}\n\n/* --- Seek preview ---------------------------------------------------- */\n\n.comimi-seek-preview {\n  position: absolute;\n  bottom: 100%;\n  left: 0;\n  margin-bottom: 14px;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 6px;\n  pointer-events: none;\n  opacity: 0;\n  transform: translateX(-50%);\n  transition: opacity 0.16s linear;\n  z-index: 5;\n}\n\n.comimi-seek-preview[data-show=\"true\"] {\n  opacity: 1;\n}\n\n.comimi-seek-preview-thumbs {\n  display: flex;\n  flex-direction: row;\n  gap: 4px;\n}\n\n.comimi-seek-preview-thumb {\n  position: relative;\n  width: 80px;\n  aspect-ratio: 100 / 141;\n  background: #fff;\n  border-radius: 6px;\n  overflow: hidden;\n  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);\n}\n\n.comimi-seek-preview-thumb img {\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n  user-select: none;\n  -webkit-user-drag: none;\n}\n\n.comimi-seek-preview-thumb[data-kind=\"html\"] {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  padding: 8px;\n  color: #aaa;\n  font-size: 11px;\n  font-weight: 700;\n  line-height: 1.4;\n  text-align: center;\n}\n\n.comimi-seek-preview-label {\n  color: #333;\n  background: rgba(255, 255, 255, 0.5);\n  backdrop-filter: blur(5px);\n  box-shadow: var(--comimi-shadow);\n  border-radius: 8px;\n  padding: 4px 10px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n@media (hover: none) {\n  .comimi-seek-preview {\n    display: none;\n  }\n}\n\n/* --- Auto Play -------------------------------------------------------- */\n\n.comimi-autoplay {\n  position: relative;\n  display: grid;\n  grid-template-columns: auto auto;\n  column-gap: 12px;\n  justify-content: start;\n  align-items: center;\n}\n\n.comimi-autoplay-button {\n  position: relative;\n  width: 24px;\n  height: 24px;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  color: #666;\n  cursor: pointer;\n}\n\n.comimi-autoplay-window {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  width: 20px;\n  height: 20px;\n  overflow: hidden;\n  transform: translate(-50%, -50%);\n}\n\n.comimi-autoplay-slider {\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 200%;\n  height: 100%;\n  transition: transform 0.36s var(--comimi-spring);\n}\n\n.comimi-autoplay-slider[data-active=\"true\"] {\n  transform: translateX(50%);\n}\n\n.comimi-autoplay-icon {\n  position: absolute;\n  top: 0;\n  width: 50%;\n  height: 100%;\n  display: block;\n}\n\n.comimi-autoplay-icon-play {\n  right: 0;\n}\n\n.comimi-autoplay-icon-pause {\n  left: 0;\n}\n\n.comimi-autoplay-progress {\n  position: relative;\n  width: 140px;\n  height: 6px;\n  border-radius: 999px;\n  background: #e0e0e0;\n  overflow: hidden;\n}\n\n.comimi-autoplay-progress-bar {\n  display: block;\n  position: absolute;\n  inset: 0;\n  border-radius: 999px;\n  background: #666;\n  animation: comimi-autoplay-progress 3s linear 0s infinite;\n}\n\n/* --- Page Mode Toggle (single / spread) ------------------------------ */\n\n.comimi-page-mode {\n  position: relative;\n  width: 80px;\n  height: 30px;\n}\n\n.comimi-page-mode-wrapper {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  width: 80px;\n  height: 30px;\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  background: #eeeeee;\n  border-radius: 8px;\n  transform: translate(-50%, -50%);\n  transition: width 0.36s var(--comimi-spring);\n}\n\n@media (hover: hover) {\n  .comimi-page-mode-wrapper:hover {\n    width: 95px;\n  }\n}\n\n.comimi-page-mode-button {\n  position: relative;\n  display: grid;\n  place-content: center;\n  width: 100%;\n  height: 100%;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  color: #666;\n  cursor: pointer;\n}\n\n.comimi-page-mode-icon {\n  display: block;\n  width: 20px;\n  opacity: 0.3;\n  transform-origin: center bottom;\n  transition: opacity 0.2s ease-in-out;\n}\n\n.comimi-page-mode-button[data-selected=\"true\"] .comimi-page-mode-icon {\n  opacity: 1;\n}\n\n.comimi-page-mode-icon.comimi-pop-animate {\n  animation: comimi-pop 0.5s ease-in-out 0s both;\n}\n\n/* --- Settings (button + popover panel) ------------------------------- */\n\n.comimi-settings {\n  position: relative;\n  width: 24px;\n  height: 24px;\n}\n\n.comimi-settings-button {\n  position: absolute;\n  inset: 0;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  cursor: pointer;\n}\n\n.comimi-settings-icon {\n  display: block;\n  width: 100%;\n  height: 100%;\n  color: #666;\n  transition: transform 0.36s var(--comimi-spring);\n}\n\n.comimi-settings[data-open=\"true\"] .comimi-settings-icon {\n  transform: rotate(30deg);\n}\n\n@keyframes comimi-pop {\n  from, to {\n    transform: scale(1, 1);\n  }\n  50% {\n    transform: scale(0.95, 1.15);\n  }\n  75% {\n    transform: scale(1.15, 0.95);\n  }\n}\n\n@keyframes comimi-autoplay-progress {\n  from {\n    transform: translateX(-100%);\n  }\n  to {\n    transform: translateX(0);\n  }\n}\n\n@media (max-width: 767px) {\n  .comimi-controls-dock {\n    bottom: 0;\n    left: 0;\n    width: 100%;\n    padding: 20px 16px calc(20px + env(safe-area-inset-bottom, 0px));\n  }\n\n  .comimi-controls-bg {\n    border-radius: 20px 20px 0 0;\n  }\n}\n", he = "\n.comimi-error-icon {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  display: grid;\n  gap: 10px;\n  justify-items: center;\n  width: 80px;\n}\n\n.comimi-error-icon-svg {\n  width: 80px;\n}\n\n.comimi-error-svg {\n  display: block;\n  width: 100%;\n  transform-origin: center bottom;\n  animation: comimi-error-fall 0.8s ease-in-out 0s both;\n}\n\n.comimi-error-stroke {\n  fill: none;\n  stroke: #ccc;\n  stroke-linecap: round;\n  stroke-linejoin: round;\n  stroke-width: 10px;\n}\n\n.comimi-error-mimi {\n  transform-origin: 56px 43px;\n}\n\n.comimi-error-mimi-left {\n  animation:\n    comimi-error-mimi-left-intro 0.8s ease-in-out 0s both,\n    comimi-error-mimi-left-loop 1.5s ease-in-out 0.8s infinite forwards;\n}\n\n.comimi-error-mimi-right {\n  animation:\n    comimi-error-mimi-right-intro 0.8s ease-in-out 0s both,\n    comimi-error-mimi-right-loop 1.5s ease-in-out 0.8s infinite forwards;\n}\n\n.comimi-error-eye {\n  fill: #ccc;\n  transform-origin: center;\n  transform-box: fill-box;\n  animation: comimi-error-eye 1.5s ease-in-out 0.8s infinite forwards;\n}\n\n.comimi-error-icon-text {\n  color: #aaa;\n  font-size: 12px;\n  font-weight: 700;\n  line-height: 1.45;\n  text-align: center;\n}\n\n@keyframes comimi-error-fall {\n  from {\n    opacity: 0;\n    transform: translateY(-40%) rotate(10deg);\n  }\n  20% {\n    opacity: 1;\n  }\n  40% {\n    transform: translateY(0) rotate(0);\n  }\n  60% {\n    transform: translateY(0) scale(1.1, 0.95);\n  }\n  80% {\n    transform: translateY(0) scale(0.95, 1.1);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes comimi-error-mimi-left-intro {\n  from {\n    transform: rotate(0deg);\n  }\n  60% {\n    transform: rotate(20deg);\n  }\n  to {\n    transform: rotate(10deg);\n  }\n}\n\n@keyframes comimi-error-mimi-left-loop {\n  from, to {\n    transform: rotate(10deg);\n  }\n  50% {\n    transform: rotate(30deg);\n  }\n}\n\n@keyframes comimi-error-mimi-right-intro {\n  from {\n    transform: rotate(0deg);\n  }\n  60% {\n    transform: rotate(-20deg);\n  }\n  to {\n    transform: rotate(-10deg);\n  }\n}\n\n@keyframes comimi-error-mimi-right-loop {\n  from, to {\n    transform: rotate(-10deg);\n  }\n  50% {\n    transform: rotate(-30deg);\n  }\n}\n\n@keyframes comimi-error-eye {\n  from, to {\n    transform: translateY(0);\n  }\n  50% {\n    transform: translateY(4px);\n  }\n}\n", ge = "\n.comimi-icon {\n  display: block;\n  width: 100%;\n  height: 100%;\n}\n\n.comimi-icon-fill {\n  fill: currentColor;\n  transition: fill .2s linear;\n}\n\n.comimi-icon-stroke {\n  fill: none;\n  stroke: currentColor;\n  stroke-width: 1.6;\n  transition: stroke .2s linear;\n}\n\n.comimi-menu-svg,\n.comimi-close-svg {\n  display: block;\n  position: relative;\n  width: 34px;\n  height: 34px;\n}\n\n.comimi-menu-svg span,\n.comimi-close-svg span {\n  position: absolute;\n  left: 50%;\n  width: 17px;\n  height: 3px;\n  border-radius: 999px;\n  background: #666;\n}\n\n.comimi-menu-svg span:nth-child(1) {\n  top: 9px;\n  transform: translateX(-50%);\n}\n\n.comimi-menu-svg span:nth-child(2) {\n  top: 50%;\n  transform: translate(-50%, -50%);\n}\n\n.comimi-menu-svg span:nth-child(3) {\n  bottom: 9px;\n  transform: translateX(-50%);\n}\n\n.comimi-close-svg span {\n  top: 50%;\n}\n\n.comimi-close-svg span:nth-child(1) {\n  transform: translate(-50%, -50%) rotate(45deg);\n}\n\n.comimi-close-svg span:nth-child(2) {\n  transform: translate(-50%, -50%) rotate(-45deg);\n}\n", _e = "\n.comimi-selectbox {\n  position: relative;\n  display: inline-block;\n  width: 100%;\n}\n\n.comimi-selectbox-bg {\n  position: absolute;\n  inset: 0;\n  border-radius: 8px;\n  background: #eeeeee;\n  transition: inset 0.36s var(--comimi-spring);\n}\n\n@media (hover: hover) {\n  .comimi-selectbox:hover .comimi-selectbox-bg {\n    inset: -3px;\n  }\n}\n\n.comimi-selectbox-select {\n  position: absolute;\n  inset: 0;\n  z-index: 2;\n  width: 100%;\n  height: 100%;\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  appearance: none;\n  -webkit-appearance: none;\n  color: transparent;\n  font: inherit;\n  cursor: pointer;\n  opacity: 0;\n}\n\n.comimi-selectbox-select:disabled {\n  cursor: not-allowed;\n}\n\n.comimi-selectbox-label {\n  position: relative;\n  display: block;\n  box-sizing: border-box;\n  width: 100%;\n  padding: 8px 32px 8px 12px;\n  color: #333;\n  font-size: 12px;\n  font-weight: 400;\n  line-height: 1.45;\n  cursor: pointer;\n  pointer-events: none;\n}\n\n.comimi-selectbox-arrow {\n  position: absolute;\n  top: 50%;\n  right: 12px;\n  z-index: 1;\n  width: 16px;\n  height: 16px;\n  color: #aaa;\n  transform: translateY(-50%) rotate(90deg);\n  pointer-events: none;\n}\n\n@media (hover: hover) {\n  .comimi-selectbox:hover .comimi-selectbox-arrow {\n    animation: comimi-selectbox-arrow 0.5s ease-in-out 0s both;\n  }\n}\n\n@keyframes comimi-selectbox-arrow {\n  from, to {\n    transform: translateY(-50%) rotate(90deg);\n  }\n  40% {\n    transform: translateY(calc(-50% + 3px)) rotate(90deg);\n  }\n  70% {\n    transform: translateY(calc(-50% - 1.5px)) rotate(90deg);\n  }\n}\n\n.comimi-toggle-switch {\n  display: grid;\n  grid-template-columns: repeat(2, auto);\n  column-gap: 6px;\n  justify-content: start;\n  align-items: center;\n  width: 100%;\n  padding: 2px;\n  border: 0;\n  background: transparent;\n  cursor: pointer;\n}\n\n.comimi-toggle-track {\n  position: relative;\n  width: 32px;\n  height: 18px;\n  border-radius: 999px;\n  background: #eeeeee;\n  transition: background-color 0.2s linear;\n}\n\n.comimi-toggle-switch[data-checked=\"true\"] .comimi-toggle-track {\n  background: #666;\n}\n\n.comimi-toggle-knob {\n  position: absolute;\n  top: 2px;\n  left: 2px;\n  width: 14px;\n  height: 14px;\n  border-radius: 50%;\n  background: #666;\n  transition:\n    transform 0.36s var(--comimi-spring),\n    background-color 0.2s linear;\n}\n\n.comimi-toggle-switch[data-checked=\"true\"] .comimi-toggle-knob {\n  background: #fff;\n  transform: translateX(100%);\n}\n\n.comimi-toggle-label-wrap {\n  position: relative;\n  width: 22px;\n  height: 12px;\n  overflow: hidden;\n}\n\n.comimi-toggle-label-inner {\n  position: absolute;\n  inset: 0;\n  transition: transform 0.36s var(--comimi-spring);\n}\n\n.comimi-toggle-switch[data-checked=\"false\"] .comimi-toggle-label-inner {\n  transform: translateX(-100%);\n}\n\n.comimi-toggle-label {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  font-size: 11px;\n  font-weight: 400;\n  line-height: 12px;\n  text-align: center;\n}\n\n.comimi-toggle-label-on {\n  color: #333;\n}\n\n.comimi-toggle-label-off {\n  color: #aaa;\n  transform: translateX(100%);\n}\n\n.comimi-range-slider {\n  display: grid;\n  grid-template-columns: 1fr auto;\n  column-gap: 8px;\n  align-items: center;\n  width: 100%;\n}\n\n.comimi-range-slider[data-disabled=\"true\"] {\n  opacity: 0.6;\n}\n\n.comimi-range-slider-wrap {\n  position: relative;\n  display: grid;\n  align-items: center;\n  min-width: 0;\n  height: 18px;\n}\n\n.comimi-range-slider-track {\n  position: absolute;\n  top: 50%;\n  left: 0;\n  right: 0;\n  height: 6px;\n  border-radius: 999px;\n  background: #eeeeee;\n  overflow: hidden;\n  transform: translateY(-50%);\n  transition: height 0.36s var(--comimi-spring);\n}\n\n@media (hover: hover) {\n  .comimi-range-slider-wrap:hover .comimi-range-slider-track {\n    height: 10px;\n  }\n}\n\n.comimi-range-slider-fill {\n  display: block;\n  height: 100%;\n  background: #666;\n  border-radius: inherit;\n}\n\n.comimi-range-slider-input {\n  position: relative;\n  z-index: 1;\n  width: 100%;\n  height: 18px;\n  margin: 0;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  appearance: none;\n  -webkit-appearance: none;\n  cursor: pointer;\n}\n\n.comimi-range-slider-input::-webkit-slider-runnable-track {\n  height: 6px;\n  background: transparent;\n  border: 0;\n}\n\n.comimi-range-slider-input::-webkit-slider-thumb {\n  appearance: none;\n  -webkit-appearance: none;\n  width: 18px;\n  height: 18px;\n  margin-top: -6px;\n  border: 0;\n  border-radius: 50%;\n  background: #666;\n  box-shadow: none;\n  transition:\n    transform 0.36s var(--comimi-spring),\n    background-color 0.2s ease-in-out;\n}\n\n.comimi-range-slider-input:hover:not(:disabled)::-webkit-slider-thumb {\n  transform: scale(1.15);\n}\n\n.comimi-range-slider-input::-moz-range-track {\n  height: 6px;\n  background: transparent;\n  border: 0;\n}\n\n.comimi-range-slider-input::-moz-range-thumb {\n  width: 18px;\n  height: 18px;\n  border: 0;\n  border-radius: 50%;\n  background: #666;\n  box-shadow: none;\n  transition:\n    transform 0.36s var(--comimi-spring),\n    background-color 0.2s ease-in-out;\n}\n\n.comimi-range-slider-input:hover:not(:disabled)::-moz-range-thumb {\n  transform: scale(1.15);\n}\n\n.comimi-range-slider-input:focus-visible {\n  outline: none;\n}\n\n.comimi-range-slider-input:focus-visible::-webkit-slider-thumb {\n  box-shadow: none;\n}\n\n.comimi-range-slider-input:focus-visible::-moz-range-thumb {\n  box-shadow: none;\n}\n\n.comimi-range-slider-value {\n  width: 36px;\n  color: #666;\n  font-size: 11px;\n  font-weight: 400;\n  line-height: 1;\n  text-align: right;\n  white-space: nowrap;\n}\n", ve = "\n.comimi-loading-icon {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  display: grid;\n  gap: 10px;\n  justify-items: center;\n  width: 80px;\n}\n\n.comimi-loading-icon-svg {\n  width: 80px;\n}\n\n.comimi-loading-svg {\n  display: block;\n  width: 100%;\n  transform-origin: center bottom;\n}\n\n.comimi-loading-stroke {\n  fill: none;\n  stroke: #ccc;\n  stroke-linecap: round;\n  stroke-linejoin: round;\n  stroke-width: 10px;\n}\n\n.comimi-loading-mimi {\n  transform-origin: 56px 43px;\n}\n\n.comimi-loading-mimi-left {\n  animation:\n    comimi-loading-mimi-left 0.4s ease-in-out 0.1s 2 forwards,\n    comimi-loading-mimi-left 0.4s ease-in-out 1.7s 2 forwards;\n}\n\n.comimi-loading-mimi-right {\n  animation:\n    comimi-loading-mimi-right 0.4s ease-in-out 0.1s 2 forwards,\n    comimi-loading-mimi-right 0.4s ease-in-out 1.7s 2 forwards;\n}\n\n.comimi-loading-eyes {\n  transform: translateX(-7px);\n  animation:\n    comimi-loading-eyes-move 0.4s ease-in-out 1.2s both,\n    comimi-loading-eyes-move 0.4s ease-in-out 2.6s reverse forwards;\n}\n\n.comimi-loading-eye {\n  fill: #ccc;\n  transform-origin: center;\n  transform-box: fill-box;\n  animation:\n    comimi-loading-eye 0.4s ease-in-out 0s forwards,\n    comimi-loading-eye 0.4s ease-in-out 1.6s forwards;\n}\n\n.comimi-loading-icon-text {\n  color: #aaa;\n  font-size: 12px;\n  font-weight: 700;\n  line-height: 1.45;\n  text-align: center;\n}\n\n.comimi-loading-icon-text span {\n  display: inline-block;\n  animation: comimi-loading-dot 0.8s ease-in-out 0s infinite both;\n}\n\n.comimi-loading-icon-text span:nth-child(1) {\n  animation-delay: 0s;\n}\n\n.comimi-loading-icon-text span:nth-child(2) {\n  animation-delay: 0.15s;\n}\n\n.comimi-loading-icon-text span:nth-child(3) {\n  animation-delay: 0.3s;\n}\n\n@keyframes comimi-loading-mimi-left {\n  from, to {\n    transform: rotate(0deg);\n  }\n  50% {\n    transform: rotate(20deg);\n  }\n}\n\n@keyframes comimi-loading-mimi-right {\n  from, to {\n    transform: rotate(0deg);\n  }\n  50% {\n    transform: rotate(-20deg);\n  }\n}\n\n@keyframes comimi-loading-eyes-move {\n  from {\n    transform: translateX(-7px);\n  }\n  to {\n    transform: translateX(7px);\n  }\n}\n\n@keyframes comimi-loading-eye {\n  from, to {\n    transform: scaleY(1);\n  }\n  50% {\n    transform: scaleY(0.2);\n  }\n}\n\n@keyframes comimi-loading-dot {\n  from, 50%, to {\n    opacity: 1;\n  }\n  25% {\n    opacity: 0;\n  }\n}\n", ye = "\n.comimi-menu-panel {\n  position: absolute;\n  top: 24px;\n  left: 24px;\n  width: 420px;\n  z-index: 45;\n  pointer-events: auto;\n  transition:\n    transform 0.6s var(--comimi-spring),\n    opacity 0.3s linear;\n}\n\n.comimi-menu-panel[data-overlay=\"false\"] {\n  transform: translateY(-35px);\n  opacity: 0;\n  pointer-events: none;\n  transition:\n    transform 0.3s var(--comimi-spring),\n    opacity 0.15s linear;\n}\n\n.comimi-menu-bg {\n  position: absolute;\n  inset: 0;\n  border-radius: 16px;\n  background: var(--comimi-glass);\n  box-shadow: var(--comimi-shadow);\n  backdrop-filter: blur(5px);\n  transition: inset 0.36s var(--comimi-spring);\n}\n\n@media (hover: hover) {\n  .comimi-menu-panel:hover > .comimi-menu-bg {\n    inset: -5px;\n  }\n}\n\n.comimi-menu-top {\n  position: relative;\n  display: grid;\n  grid-template-columns: auto 1fr;\n  column-gap: 13px;\n  align-items: center;\n  box-sizing: border-box;\n  width: 100%;\n  height: 62px;\n  padding: 0 13px;\n  border: 0;\n  background: transparent;\n  color: inherit;\n  text-align: left;\n  cursor: pointer;\n}\n\n.comimi-menu-button {\n  position: relative;\n  width: 34px;\n  height: 34px;\n  overflow: hidden;\n}\n\n.comimi-menu-button-inner {\n  display: block;\n  position: absolute;\n  inset: 0;\n  transition: transform 0.4s var(--comimi-spring);\n}\n\n.comimi-menu-panel[data-open=\"true\"] .comimi-menu-button-inner {\n  transform: translateY(100%);\n}\n\n.comimi-menu-button-inner > * {\n  position: absolute;\n  inset: 0;\n}\n\n.comimi-menu-button-inner > *:nth-child(2) {\n  transform: translateY(-100%);\n}\n\n.comimi-menu-title-wrap {\n  min-width: 0;\n}\n\n.comimi-menu-title {\n  display: block;\n  width: 100%;\n  color: #333;\n  font-size: 15px;\n  font-weight: 700;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.comimi-menu-author {\n  display: block;\n  width: 100%;\n  color: #666;\n  font-size: 12px;\n  font-weight: 400;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.comimi-menu-bottom {\n  position: relative;\n  width: 100%;\n  overflow: hidden;\n  transition: height 0.24s ease-in-out;\n}\n\n.comimi-menu-border {\n  width: 100%;\n  height: 1px;\n  background: #e0e0e0;\n}\n\n.comimi-menu-view {\n  position: absolute;\n  top: 1px;\n  left: 0;\n  width: 100%;\n  transition: all 0.28s ease-in-out;\n  opacity: 0;\n  visibility: hidden;\n  transform: scale(0.92);\n  filter: blur(5px);\n}\n\n.comimi-menu-view-menu {\n  position: relative;\n}\n\n.comimi-menu-panel[data-view=\"menu\"] .comimi-menu-view-menu,\n.comimi-menu-panel[data-view=\"shortcut\"] .comimi-menu-view-shortcut,\n.comimi-menu-panel[data-view=\"pageList\"] .comimi-menu-view-page-list {\n  opacity: 1;\n  visibility: visible;\n  transform: scale(1);\n  filter: blur(0);\n}\n\n.comimi-menu-list {\n  position: relative;\n  width: 100%;\n  padding: 10px 0;\n}\n\n.comimi-menu-link {\n  box-sizing: border-box;\n  display: grid;\n  grid-template-columns: 1fr auto;\n  column-gap: 8px;\n  align-items: center;\n  width: 100%;\n  padding: 10px 16px 10px 22px;\n  border: 0;\n  border-radius: 10px;\n  background: transparent;\n  color: #666;\n  cursor: pointer;\n  transition: background-color 0.24s linear;\n}\n\n.comimi-menu-link:hover {\n  background: #f1f1f1;\n}\n\n.comimi-menu-link-text {\n  color: #666;\n  font-size: 14px;\n  font-weight: 700;\n  line-height: 1.45;\n  text-align: left;\n}\n\n.comimi-menu-link-arrow {\n  display: block;\n  width: 20px;\n  height: 20px;\n  color: #aaa;\n}\n\n.comimi-menu-link-arrow > svg {\n  display: block;\n  width: 100%;\n  height: 100%;\n}\n\n.comimi-page-list-inner {\n  box-sizing: border-box;\n  padding: 0 22px;\n  max-height: 315px;\n  overflow-y: auto;\n  -webkit-overflow-scrolling: touch;\n}\n\n.comimi-page-list-grid {\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 20px;\n}\n\n.comimi-page-list-item {\n  display: grid;\n  row-gap: 4px;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  color: #666;\n  cursor: pointer;\n  text-align: center;\n}\n\n.comimi-page-list-thumb {\n  position: relative;\n  display: block;\n  width: 100%;\n  aspect-ratio: 100 / 141;\n  background: #fff;\n  border-radius: 6px;\n  outline: 3px solid #e0e0e0;\n}\n\n.comimi-page-list-thumb-html {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  padding: 8px;\n  text-align: center;\n  color: #aaa;\n  font-size: 11px;\n  font-weight: 700;\n  line-height: 1.4;\n}\n\n.comimi-page-list-thumb img {\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n  border-radius: 4px;\n  user-select: none;\n  -webkit-user-drag: none;\n}\n\n.comimi-page-list-text {\n  color: #666;\n  font-size: 14px;\n  font-weight: 700;\n}\n\n.comimi-shortcut-inner {\n  box-sizing: border-box;\n  padding: 0 22px;\n  max-height: 315px;\n  overflow-y: auto;\n  -webkit-overflow-scrolling: touch;\n}\n\n.comimi-shortcut-grid {\n  display: grid;\n  row-gap: 22px;\n}\n\n.comimi-shortcut-section {\n  display: grid;\n  row-gap: 8px;\n}\n\n.comimi-shortcut-heading {\n  color: #666;\n  font-size: 12px;\n  font-weight: 700;\n  line-height: 1.45;\n}\n\n.comimi-shortcut-list {\n  display: grid;\n  row-gap: 8px;\n  justify-items: start;\n}\n\n.comimi-shortcut-column {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px 16px;\n  align-items: center;\n}\n\n.comimi-shortcut-item {\n  display: grid;\n  grid-template-columns: repeat(2, auto);\n  column-gap: 8px;\n  align-items: center;\n  width: fit-content;\n}\n\n.comimi-shortcut-badge {\n  display: grid;\n  grid-auto-flow: column;\n  column-gap: 6px;\n  align-items: center;\n  padding: 4px 8px;\n  border-radius: 7px;\n  background: #eeeeee;\n}\n\n.comimi-shortcut-key {\n  color: #666;\n  font-size: 13px;\n  font-weight: 700;\n  line-height: 1.45;\n}\n\n.comimi-shortcut-or::before {\n  content: \"or\";\n  display: block;\n  color: #666;\n  font-size: 11px;\n  font-weight: 400;\n  line-height: 1.45;\n}\n\n.comimi-shortcut-label {\n  color: #666;\n  font-size: 13px;\n  font-weight: 400;\n  line-height: 1.45;\n}\n\n.comimi-back-button {\n  position: relative;\n  width: 100%;\n  height: 56px;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  cursor: pointer;\n}\n\n.comimi-back-inner {\n  position: absolute;\n  inset: 8px;\n}\n\n.comimi-back-bg {\n  position: absolute;\n  inset: 0;\n  border-radius: 8px;\n  background: #eeeeee;\n  transition: inset 0.36s var(--comimi-spring), border-radius 0.36s var(--comimi-spring);\n}\n\n.comimi-back-button:hover .comimi-back-bg {\n  inset: -4px;\n  border-radius: 10px;\n}\n\n.comimi-back-text {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  color: #666;\n  font-size: 14px;\n  font-weight: 700;\n  line-height: 1.45;\n  pointer-events: none;\n}\n\n.comimi-back-arrow {\n  position: absolute;\n  top: 50%;\n  left: 8px;\n  width: 22px;\n  height: 22px;\n  color: #aaa;\n  transform: translateY(-50%) scaleX(-1);\n  pointer-events: none;\n}\n\n.comimi-back-arrow > svg {\n  display: block;\n  width: 100%;\n  height: 100%;\n}\n\n@media (max-width: 767px) {\n  .comimi-menu-panel {\n    top: 0;\n    left: 0;\n    width: 100%;\n  }\n\n  .comimi-menu-bg {\n    border-radius: 0 0 16px 16px;\n  }\n\n  .comimi-menu-top {\n    width: 100%;\n  }\n\n  .comimi-page-list-inner,\n  .comimi-shortcut-inner {\n    max-height: calc(var(--view-height, 100vh) - 62px - 56px);\n  }\n}\n", be = "\n.comimi-notifications {\n  position: absolute;\n  bottom: 140px;\n  left: 50%;\n  transform: translateX(-50%);\n  display: grid;\n  row-gap: 8px;\n  justify-items: center;\n  pointer-events: none;\n  z-index: 35;\n}\n\n.comimi-toast {\n  display: grid;\n  grid-template-columns: auto auto;\n  gap: 5px;\n  align-items: center;\n  justify-content: center;\n  width: fit-content;\n  padding: 6px 13px 6px 8px;\n  border-radius: 999px;\n  background-color: #666;\n  animation: comimi-toast-popup 0.37s ease-in-out 0s both;\n}\n\n.comimi-toast-dot {\n  display: block;\n  width: 10px;\n  height: 10px;\n  border-radius: 50%;\n  background: #888;\n}\n\n.comimi-toast-text {\n  color: #fff;\n  font-size: 12px;\n  font-weight: 700;\n  line-height: 1.45;\n}\n\n@keyframes comimi-toast-popup {\n  from {\n    transform: translateY(6px) scale(0.2, 0.8);\n    opacity: 0;\n  }\n  60% {\n    transform: translateY(-1px) scale(1.1, 1.05);\n    opacity: 1;\n  }\n  to {\n    transform: scale(1, 1);\n    opacity: 1;\n  }\n}\n\n@media (max-width: 767px) {\n  .comimi-notifications {\n    bottom: calc(120px + env(safe-area-inset-bottom, 0px));\n  }\n}\n", xe = "\n.comimi-stage {\n  position: absolute;\n  inset: 0;\n  will-change: transform;\n  transition: transform .18s ease;\n}\n\n.comimi-stage[data-dragging=\"true\"] {\n  transition: none;\n}\n\n.comimi-page-group {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 0;\n  box-sizing: border-box;\n}\n\n.comimi-page {\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  max-width: 100%;\n  max-height: 100%;\n  min-width: 0;\n  min-height: 0;\n  background: transparent;\n  overflow: hidden;\n  flex: 0 0 auto;\n}\n\n.comimi-page[data-spread=\"true\"] {\n  width: 50%;\n  height: 100%;\n}\n\n.comimi-page[data-spread=\"false\"] {\n  width: 100%;\n  height: 100%;\n}\n\n.comimi-page[data-position=\"left\"] {\n  justify-content: flex-end;\n}\n\n.comimi-page[data-position=\"right\"] {\n  justify-content: flex-start;\n}\n\n.comimi-page img,\n.comimi-html-page {\n  display: block;\n  max-width: 100%;\n  max-height: 100%;\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n  transform-origin: center center;\n  user-select: none;\n  -webkit-user-select: none;\n  -webkit-user-drag: none;\n  -webkit-touch-callout: none;\n}\n\n.comimi-page[data-spread=\"true\"] img,\n.comimi-page[data-spread=\"true\"] .comimi-html-page {\n  width: 100%;\n  height: 100%;\n}\n\n.comimi-page[data-position=\"left\"] img,\n.comimi-page[data-position=\"left\"] .comimi-html-page {\n  object-position: right center;\n}\n\n.comimi-page[data-position=\"right\"] img,\n.comimi-page[data-position=\"right\"] .comimi-html-page {\n  object-position: left center;\n}\n\n.comimi-html-page {\n  width: min(100%, 960px);\n  height: min(100%, 680px);\n  background: #fff;\n  color: #111;\n  overflow: auto;\n}\n\n", Se = "\n.comimi-rabbit {\n  position: absolute;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 50px;\n  aspect-ratio: 1 / 1;\n  z-index: 0;\n  pointer-events: none;\n}\n\n.comimi-rabbit > * {\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n}\n\n.comimi-controls-dock > .comimi-rabbit {\n  bottom: 0;\n  left: 50%;\n  transform: translateX(-50%);\n}\n\n.comimi-menu-panel > .comimi-rabbit {\n  top: 12px;\n  right: 20px;\n}\n\n@media (max-width: 767px) {\n  .comimi-controls-dock > .comimi-rabbit {\n    display: none;\n  }\n}\n\n@media (min-width: 768px) {\n  .comimi-menu-panel > .comimi-rabbit {\n    display: none;\n  }\n}\n", Ce = "\n.comimi-scrollfade {\n  position: relative;\n}\n\n.comimi-scrollfade::before,\n.comimi-scrollfade::after {\n  content: \"\";\n  position: sticky;\n  display: block;\n  left: 0;\n  width: 100%;\n  height: 32px;\n  z-index: 2;\n  pointer-events: none;\n  opacity: 0;\n  transition: opacity 0.16s linear;\n}\n\n.comimi-scrollfade::before {\n  top: 0;\n  background: linear-gradient(to bottom, var(--comimi-bg), transparent);\n}\n\n.comimi-scrollfade::after {\n  bottom: 0;\n  background: linear-gradient(to top, var(--comimi-bg), transparent);\n}\n\n.comimi-scrollfade[data-scroll-up=\"true\"]::before {\n  opacity: 1;\n}\n\n.comimi-scrollfade[data-scroll-down=\"true\"]::after {\n  opacity: 1;\n}\n", we = "\n.comimi-settings-panel {\n  position: absolute;\n  top: 0;\n  right: -16px;\n  width: 250px;\n  height: 0;\n  border-radius: 20px;\n  overflow: hidden;\n  background: var(--comimi-glass-strong);\n  box-shadow: var(--comimi-shadow);\n  backdrop-filter: blur(5px);\n  opacity: 0;\n  transform: translateY(calc(-100% - 8px));\n  transition:\n    height 0.38s cubic-bezier(0.12, 1.06, 0.56, 1.02),\n    opacity 0.38s cubic-bezier(0.12, 1.06, 0.56, 1.02);\n  z-index: 10;\n}\n\n.comimi-settings-panel[data-open=\"true\"] {\n  opacity: 1;\n  height: var(--comimi-settings-height, 460px);\n}\n\n.comimi-settings-panel-body {\n  position: relative;\n  width: 100%;\n  max-height: calc(var(--view-height, 100vh) - 62px - 56px);\n  overflow-y: auto;\n  -webkit-overflow-scrolling: touch;\n}\n\n.comimi-settings-panel-inner {\n  box-sizing: border-box;\n  position: relative;\n  padding: 0 20px;\n}\n\n.comimi-settings-panel-title {\n  color: #333;\n  font-size: 14px;\n  font-weight: 700;\n  text-align: center;\n}\n\n.comimi-settings-section {\n  display: grid;\n  row-gap: 8px;\n  margin-top: 18px;\n}\n\n.comimi-settings-label {\n  color: #333;\n  font-size: 12px;\n  font-weight: 400;\n}\n\n", Te = "\n.comimi-splash {\n  position: absolute;\n  inset: 0;\n  z-index: 100;\n  background-color: #e0e0e0;\n  overflow: hidden;\n  animation: comimi-splash-clip 1s cubic-bezier(0.82, 0.01, 0.48, 1.02) 1s both;\n  pointer-events: none;\n}\n\n.comimi-splash-logo-wrap {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -60%);\n  width: 260px;\n  aspect-ratio: 290 / 99;\n}\n\n.comimi-splash-logo {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%) scale(0.72);\n  width: 360px;\n  aspect-ratio: 360 / 99;\n}\n\n.comimi-splash-symbol {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 113px;\n  display: block;\n  transform-origin: center bottom;\n}\n\n.comimi-splash-logo-wrap-custom {\n  width: 120px;\n  aspect-ratio: 1 / 1;\n}\n\n.comimi-splash-logo-wrap-custom .comimi-splash-text {\n  transform: translate(-50%, calc(100% + 16px));\n}\n\n.comimi-splash-custom-logo {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 120px;\n  aspect-ratio: 1 / 1;\n}\n\n.comimi-splash-custom-logo > * {\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n}\n\n.comimi-splash-typo-wrap {\n  position: absolute;\n  right: 7px;\n  bottom: 11px;\n  width: 229.5px;\n}\n\n.comimi-splash-typo {\n  display: block;\n  width: 100%;\n  overflow: visible;\n}\n\n.comimi-splash-stroke {\n  fill: none;\n  stroke: #fff;\n  stroke-linecap: round;\n  stroke-linejoin: round;\n  stroke-width: 10px;\n}\n\n.comimi-splash-mimi {\n  transform-origin: 56px 43px;\n}\n\n.comimi-splash-mimi-left {\n  animation: comimi-splash-mimi-left 0.4s ease-in-out 0.3s 2 forwards;\n}\n\n.comimi-splash-mimi-right {\n  animation: comimi-splash-mimi-right 0.4s ease-in-out 0.3s 2 forwards;\n}\n\n.comimi-splash-eyes {\n  transform: translateX(-7px);\n}\n\n.comimi-splash-eye {\n  transform-origin: center;\n  transform-box: fill-box;\n  animation: comimi-splash-eye 0.4s ease-in-out 0.2s forwards;\n}\n\n.comimi-splash-heart {\n  --size: 14px;\n  position: absolute;\n  top: -20px;\n  width: var(--size);\n  height: var(--size);\n}\n\n.comimi-splash-heart::before,\n.comimi-splash-heart::after {\n  content: \"\";\n  display: block;\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  height: 150%;\n  border-radius: 999px;\n  transform-origin: center bottom;\n}\n\n.comimi-splash-heart::before {\n  transform: translateX(-32%) rotate(45deg);\n  background-color: #eee;\n}\n\n.comimi-splash-heart::after {\n  transform: translateX(32%) rotate(-45deg);\n  background-color: #fff;\n}\n\n.comimi-splash-heart-1 {\n  right: -2px;\n}\n\n.comimi-splash-heart-2 {\n  right: 76px;\n}\n\n.comimi-splash-text {\n  position: absolute;\n  bottom: 0;\n  left: 50%;\n  transform: translate(-50%, 120%);\n  color: #fff;\n  font-size: 16px;\n  font-weight: 700;\n  line-height: 1.45;\n  text-align: center;\n  white-space: nowrap;\n}\n\n.comimi-splash-text span {\n  display: inline-block;\n  animation: comimi-splash-dot 0.8s ease-in-out 0s infinite both;\n}\n\n.comimi-splash-text span:nth-child(1) {\n  animation-delay: 0s;\n}\n\n.comimi-splash-text span:nth-child(2) {\n  animation-delay: 0.15s;\n}\n\n.comimi-splash-text span:nth-child(3) {\n  animation-delay: 0.3s;\n}\n\n@keyframes comimi-splash-clip {\n  from {\n    clip-path: circle(70%);\n  }\n  to {\n    clip-path: circle(0%);\n  }\n}\n\n@keyframes comimi-splash-mimi-left {\n  from, to {\n    transform: rotate(0deg);\n  }\n  50% {\n    transform: rotate(20deg);\n  }\n}\n\n@keyframes comimi-splash-mimi-right {\n  from, to {\n    transform: rotate(0deg);\n  }\n  50% {\n    transform: rotate(-20deg);\n  }\n}\n\n@keyframes comimi-splash-eye {\n  from, to {\n    transform: scaleY(1);\n  }\n  50% {\n    transform: scaleY(0.2);\n  }\n}\n\n@keyframes comimi-splash-dot {\n  from, 50%, to {\n    opacity: 1;\n  }\n  25% {\n    opacity: 0;\n  }\n}\n", Ee = "\n.comimi-tooltip {\n  position: absolute;\n  bottom: 0;\n  left: 50%;\n  padding: 6px 10px;\n  border-radius: 8px;\n  background: rgba(255, 255, 255, 0.5);\n  box-shadow: var(--comimi-shadow);\n  backdrop-filter: blur(5px);\n  color: #333;\n  font-size: 12px;\n  font-weight: 600;\n  line-height: 1.45;\n  white-space: nowrap;\n  pointer-events: none;\n  user-select: none;\n  opacity: 0;\n  transform: translate(-50%, calc(100% + 6px)) scale(0.88);\n  transform-origin: center top;\n  transition:\n    opacity 0.1s ease-in-out,\n    transform 0.16s ease-in-out;\n  z-index: 5;\n}\n\n@media (hover: hover) {\n  .comimi-has-tooltip:hover > .comimi-tooltip {\n    opacity: 1;\n    transform: translate(-50%, calc(100% + 6px)) scale(1);\n  }\n}\n", De = "\n.comimi-root {\n  --comimi-bg: #fff;\n  --comimi-surface: #f7f7f7;\n  --comimi-surface-2: #eeeeee;\n  --comimi-fg: #333;\n  --comimi-muted: #666;\n  --comimi-soft: #999;\n  --comimi-line: #e0e0e0;\n  --comimi-shadow: 0 0 8px rgba(0, 0, 0, 0.1);\n  --comimi-glass: rgba(255, 255, 255, 0.8);\n  --comimi-glass-strong: rgba(255, 255, 255, 0.8);\n  --comimi-spring: cubic-bezier(0.34, 1.56, 0.64, 1);\n  background: var(--comimi-bg);\n  color: var(--comimi-fg);\n  font-family: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\n  position: relative;\n  width: calc(100% - 24px * 2);\n  max-width: 900px;\n  aspect-ratio: 900 / 636;\n  margin: 0 auto;\n  border-radius: 16px;\n  box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.06);\n  overflow: hidden;\n  user-select: none;\n  -webkit-tap-highlight-color: transparent;\n  touch-action: none;\n  transition:\n    box-shadow 0.24s ease-out,\n    background-color 0.16s linear;\n}\n\n.comimi-root:focus {\n  outline: none;\n  box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.14);\n}\n\n@media (max-width: 767px) {\n  .comimi-root {\n    max-width: 500px;\n    aspect-ratio: 390 / 490;\n  }\n}\n\n.comimi-root[data-bg=\"black\"] {\n  --comimi-bg: #000;\n}\n\n.comimi-root[data-layout=\"wide\"] {\n  width: 100%;\n  max-width: none;\n  aspect-ratio: auto;\n  min-height: 320px;\n  margin: 0;\n  border-radius: 0;\n  box-shadow: none;\n}\n\n.comimi-root[data-layout=\"browserFullscreen\"],\n.comimi-root[data-layout=\"nativeFullscreen\"] {\n  position: fixed;\n  inset: 0;\n  z-index: 999;\n  width: 100vw;\n  height: 100dvh;\n  max-width: none;\n  aspect-ratio: auto;\n  margin: 0;\n  border-radius: 0;\n  box-shadow: none;\n}\n\n.comimi-resize-handle {\n  position: relative;\n  width: 100%;\n  height: 20px;\n  background: #fff;\n  cursor: ns-resize;\n  touch-action: none;\n}\n\n.comimi-resize-handle::after {\n  content: \"\";\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 40px;\n  height: 3px;\n  border-radius: 999px;\n  background: #bbb;\n  transition:\n    width 0.36s cubic-bezier(0.34, 1.56, 0.64, 1),\n    height 0.36s cubic-bezier(0.34, 1.56, 0.64, 1),\n    background-color 0.2s linear;\n}\n\n@media (hover: hover) {\n  .comimi-resize-handle:hover::after {\n    width: 52px;\n    height: 5px;\n    background: #888;\n  }\n}\n\n", Oe = "\n.comimi-view-switcher {\n  position: absolute;\n  top: 20px;\n  right: 20px;\n  display: grid;\n  grid-template-columns: repeat(3, 60px);\n  width: 180px;\n  border-radius: 16px;\n  background: var(--comimi-glass);\n  box-shadow: var(--comimi-shadow);\n  backdrop-filter: blur(5px);\n  pointer-events: auto;\n  transition:\n    transform 0.6s var(--comimi-spring),\n    opacity 0.3s linear;\n}\n\n.comimi-view-switcher[data-overlay=\"false\"] {\n  transform: translateY(-35px);\n  opacity: 0;\n  pointer-events: none;\n  transition:\n    transform 0.3s var(--comimi-spring),\n    opacity 0.15s linear;\n}\n\n@media (hover: hover) {\n  .comimi-view-switcher:hover {\n    transform: scaleX(1.03);\n  }\n}\n\n.comimi-view-switcher-indicator {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 60px;\n  height: 100%;\n  border-radius: 16px;\n  background: #666;\n  transition: transform 0.36s var(--comimi-spring);\n}\n\n.comimi-view-switcher-button {\n  position: relative;\n  display: grid;\n  row-gap: 5px;\n  justify-items: center;\n  align-content: center;\n  height: 58px;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  color: #666;\n  cursor: pointer;\n  transition: color 0.2s linear;\n}\n\n.comimi-view-switcher-button[data-selected=\"true\"] {\n  color: #fff;\n}\n\n.comimi-view-switcher-icon-wrap {\n  width: 20px;\n  height: 20px;\n  transform-origin: center bottom;\n}\n\n.comimi-view-switcher-icon {\n  display: block;\n  width: 100%;\n  height: 100%;\n  color: currentColor;\n}\n\n.comimi-view-switcher-icon-wrap.comimi-pop-animate {\n  animation: comimi-pop 0.5s ease-in-out 0.1s both;\n}\n\n.comimi-view-switcher-label {\n  color: currentColor;\n  font-size: 10px;\n  font-weight: 500;\n  text-align: center;\n  transition: color 0.2s linear;\n}\n\n@media (max-width: 767px) {\n  .comimi-view-switcher {\n    top: 70px;\n    right: auto;\n    left: calc(50% - 90px);\n  }\n}\n", q = !1, ke = [
+var fe = "\n.comimi-arrows {\n  position: absolute;\n  inset: 0;\n  pointer-events: none;\n  z-index: 30;\n}\n\n.comimi-arrow-button {\n  position: absolute;\n  top: 50%;\n  width: 46px;\n  height: 46px;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  cursor: pointer;\n  pointer-events: auto;\n  transform: translateY(-50%);\n}\n\n.comimi-arrow-next {\n  right: 24px;\n}\n\n.comimi-arrow-prev {\n  left: 24px;\n}\n\n.comimi-arrow-inner {\n  position: absolute;\n  inset: 0;\n  transition:\n    transform 0.6s var(--comimi-spring),\n    opacity 0.3s linear;\n}\n\n.comimi-arrows[data-overlay=\"false\"] .comimi-arrow-next .comimi-arrow-inner {\n  transform: translateX(35px);\n  opacity: 0;\n  transition:\n    transform 0.3s var(--comimi-spring),\n    opacity 0.15s linear;\n}\n\n.comimi-arrows[data-overlay=\"false\"] .comimi-arrow-prev .comimi-arrow-inner {\n  transform: translateX(-35px);\n  opacity: 0;\n  transition:\n    transform 0.3s var(--comimi-spring),\n    opacity 0.15s linear;\n}\n\n.comimi-arrows[data-overlay=\"false\"] {\n  pointer-events: none;\n}\n\n.comimi-arrow-bg {\n  position: absolute;\n  inset: 0;\n  border-radius: 16px;\n  background: var(--comimi-glass);\n  box-shadow: var(--comimi-shadow);\n  backdrop-filter: blur(5px);\n  transition: inset 0.36s var(--comimi-spring), border-radius 0.36s var(--comimi-spring);\n}\n\n.comimi-arrow-icon {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  width: 20px;\n  height: 20px;\n  color: #666;\n  transform: translate(-50%, -50%);\n  pointer-events: none;\n}\n\n.comimi-arrow-prev .comimi-arrow-icon {\n  transform: translate(-50%, -50%) scaleX(-1);\n}\n\n@keyframes comimi-arrow-bounce {\n  from, to {\n    transform: translate(-50%, -50%);\n  }\n  40% {\n    transform: translate(calc(-50% + 3px), -50%);\n  }\n  70% {\n    transform: translate(calc(-50% - 1.5px), -50%);\n  }\n}\n\n@keyframes comimi-arrow-bounce-prev {\n  from, to {\n    transform: translate(-50%, -50%) scaleX(-1);\n  }\n  40% {\n    transform: translate(calc(-50% - 3px), -50%) scaleX(-1);\n  }\n  70% {\n    transform: translate(calc(-50% + 1.5px), -50%) scaleX(-1);\n  }\n}\n\n@media (hover: hover) {\n  .comimi-arrow-button:hover .comimi-arrow-bg {\n    inset: -3px;\n    border-radius: 20px;\n  }\n\n  .comimi-arrow-next:hover .comimi-arrow-icon {\n    animation: comimi-arrow-bounce 0.5s ease-in-out 0.1s both;\n  }\n\n  .comimi-arrow-prev:hover .comimi-arrow-icon {\n    animation: comimi-arrow-bounce-prev 0.5s ease-in-out 0.1s both;\n  }\n}\n\n@media (max-width: 767px) {\n  .comimi-arrow-button {\n    width: 36px;\n    height: 50px;\n  }\n\n  .comimi-arrow-next {\n    right: 0;\n  }\n\n  .comimi-arrow-prev {\n    left: 0;\n  }\n\n  .comimi-arrow-next .comimi-arrow-bg {\n    border-radius: 16px 0 0 16px;\n  }\n\n  .comimi-arrow-prev .comimi-arrow-bg {\n    border-radius: 0 16px 16px 0;\n  }\n}\n", pe = "\n.comimi-center-message {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  pointer-events: none;\n  z-index: 20;\n  transition: opacity 0.3s linear;\n}\n\n.comimi-center-message[data-overlay=\"false\"] {\n  opacity: 0;\n  transition: opacity 0.15s linear;\n}\n\n.comimi-center-message-text {\n  box-sizing: border-box;\n  padding: 6px 12px;\n  border-radius: 8px;\n  background: rgba(255, 255, 255, 0.5);\n  box-shadow: var(--comimi-shadow);\n  backdrop-filter: blur(5px);\n  color: #bbb;\n  font-size: 12px;\n  font-weight: 400;\n  line-height: 1.45;\n  text-align: center;\n  white-space: nowrap;\n}\n\n.comimi-center-message-mobile {\n  display: none;\n}\n\n@media (max-width: 767px) {\n  .comimi-center-message {\n    width: calc(100% - 60px * 2);\n    max-width: max-content;\n  }\n\n  .comimi-center-message-desktop {\n    display: none;\n  }\n\n  .comimi-center-message-mobile {\n    display: block;\n  }\n}\n", me = "\n/* --- Controls dock (bottom) ------------------------------------------- */\n\n.comimi-controls-dock {\n  box-sizing: border-box;\n  position: absolute;\n  bottom: 24px;\n  left: 24px;\n  width: calc(100% - 48px);\n  padding: 20px 24px;\n  z-index: 40;\n  pointer-events: auto;\n  transition:\n    transform 0.6s var(--comimi-spring),\n    opacity 0.3s linear;\n}\n\n.comimi-controls-dock[data-overlay=\"false\"] {\n  transform: translateY(35px);\n  opacity: 0;\n  pointer-events: none;\n  transition:\n    transform 0.3s var(--comimi-spring),\n    opacity 0.15s linear;\n}\n\n.comimi-controls-bg {\n  position: absolute;\n  inset: 0;\n  border-radius: 20px;\n  background: var(--comimi-glass);\n  box-shadow: var(--comimi-shadow);\n  backdrop-filter: blur(5px);\n  transition: inset 0.36s var(--comimi-spring), border-radius 0.36s var(--comimi-spring);\n}\n\n@media (hover: hover) {\n  .comimi-controls-dock:hover > .comimi-controls-bg {\n    inset: -4px -4px 0 -4px;\n    border-radius: 20px;\n  }\n}\n\n.comimi-controls-row {\n  position: relative;\n  display: grid;\n  grid-template-columns: auto auto;\n  justify-content: space-between;\n  align-items: center;\n}\n\n.comimi-controls-side {\n  display: grid;\n  grid-auto-flow: column;\n  column-gap: 16px;\n  justify-content: end;\n  align-items: center;\n  transition:\n    opacity 0.2s ease-in-out,\n    visibility 0.2s ease-in-out;\n}\n\n.comimi-controls-dock[data-autoplay=\"true\"] .comimi-controls-side {\n  opacity: 0;\n  visibility: hidden;\n}\n\n/* --- Seek bar --------------------------------------------------------- */\n\n.comimi-seek {\n  position: relative;\n  display: grid;\n  grid-template-columns: auto 1fr;\n  column-gap: 10px;\n  align-items: center;\n  margin-bottom: 10px;\n}\n\n.comimi-seek-text {\n  display: grid;\n  grid-template-columns: repeat(2, auto);\n  justify-content: start;\n  align-items: end;\n  line-height: 14px;\n}\n\n.comimi-seek-current {\n  color: #333;\n  font-size: 12px;\n  font-weight: 700;\n}\n\n.comimi-seek-total {\n  color: #999;\n  font-size: 12px;\n  font-weight: 400;\n  margin-left: 0.4em;\n}\n\n.comimi-seek-bar {\n  position: relative;\n  width: 100%;\n  height: 18px;\n}\n\n.comimi-seek-track {\n  position: absolute;\n  top: 50%;\n  left: 0;\n  right: 0;\n  height: 8px;\n  border-radius: 999px;\n  background: #e0e0e0;\n  overflow: hidden;\n  transform: translateY(-50%);\n  transition: height 0.36s var(--comimi-spring);\n}\n\n@media (hover: hover) {\n  .comimi-seek-bar:hover .comimi-seek-track {\n    height: 12px;\n  }\n}\n\n.comimi-seek-fill {\n  position: absolute;\n  top: 0;\n  height: 100%;\n  border-radius: 999px;\n  background: #666;\n}\n\n.comimi-seek-bar[data-direction=\"rtl\"] .comimi-seek-fill {\n  right: 0;\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n}\n\n.comimi-seek-bar[data-direction=\"ltr\"] .comimi-seek-fill {\n  left: 0;\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n}\n\n.comimi-seek-input {\n  position: absolute;\n  inset: 0;\n  z-index: 1;\n  width: 100%;\n  height: 18px;\n  margin: 0;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  appearance: none;\n  -webkit-appearance: none;\n  cursor: pointer;\n}\n\n.comimi-seek-input::-webkit-slider-runnable-track {\n  height: 8px;\n  background: transparent;\n  border: 0;\n}\n\n.comimi-seek-input::-webkit-slider-thumb {\n  appearance: none;\n  -webkit-appearance: none;\n  width: 18px;\n  height: 18px;\n  margin-top: -5px;\n  border: 0;\n  border-radius: 50%;\n  background: #666;\n  box-shadow: none;\n  transition:\n    transform 0.36s var(--comimi-spring),\n    background-color 0.2s ease-in-out;\n}\n\n.comimi-seek-input:hover::-webkit-slider-thumb {\n  transform: scale(1.15);\n}\n\n.comimi-seek-input::-moz-range-track {\n  height: 8px;\n  background: transparent;\n  border: 0;\n}\n\n.comimi-seek-input::-moz-range-thumb {\n  width: 18px;\n  height: 18px;\n  border: 0;\n  border-radius: 50%;\n  background: #666;\n  box-shadow: none;\n  transition:\n    transform 0.36s var(--comimi-spring),\n    background-color 0.2s ease-in-out;\n}\n\n.comimi-seek-input:hover::-moz-range-thumb {\n  transform: scale(1.15);\n}\n\n.comimi-seek-input:focus-visible {\n  outline: none;\n}\n\n.comimi-seek-input:focus-visible::-webkit-slider-thumb {\n  box-shadow: none;\n}\n\n.comimi-seek-input:focus-visible::-moz-range-thumb {\n  box-shadow: none;\n}\n\n.comimi-seek-input[data-direction=\"rtl\"] {\n  direction: rtl;\n}\n\n/* --- Seek preview ---------------------------------------------------- */\n\n.comimi-seek-preview {\n  position: absolute;\n  bottom: 100%;\n  left: 0;\n  margin-bottom: 14px;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 6px;\n  pointer-events: none;\n  opacity: 0;\n  transform: translateX(-50%);\n  transition: opacity 0.16s linear;\n  z-index: 5;\n}\n\n.comimi-seek-preview[data-show=\"true\"] {\n  opacity: 1;\n}\n\n.comimi-seek-preview-thumbs {\n  display: flex;\n  flex-direction: row;\n  gap: 4px;\n}\n\n.comimi-seek-preview-thumb {\n  position: relative;\n  width: 80px;\n  aspect-ratio: 100 / 141;\n  background: #fff;\n  border-radius: 6px;\n  overflow: hidden;\n  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);\n}\n\n.comimi-seek-preview-thumb img {\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n  user-select: none;\n  -webkit-user-drag: none;\n}\n\n.comimi-seek-preview-thumb[data-kind=\"html\"] {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  padding: 8px;\n  color: #aaa;\n  font-size: 11px;\n  font-weight: 700;\n  line-height: 1.4;\n  text-align: center;\n}\n\n.comimi-seek-preview-label {\n  color: #333;\n  background: rgba(255, 255, 255, 0.5);\n  backdrop-filter: blur(5px);\n  box-shadow: var(--comimi-shadow);\n  border-radius: 8px;\n  padding: 4px 10px;\n  font-size: 12px;\n  font-weight: 600;\n}\n\n@media (hover: none) {\n  .comimi-seek-preview {\n    display: none;\n  }\n}\n\n/* --- Auto Play -------------------------------------------------------- */\n\n.comimi-autoplay {\n  position: relative;\n  display: grid;\n  grid-template-columns: auto auto;\n  column-gap: 12px;\n  justify-content: start;\n  align-items: center;\n}\n\n.comimi-autoplay-button {\n  position: relative;\n  width: 24px;\n  height: 24px;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  color: #666;\n  cursor: pointer;\n}\n\n.comimi-autoplay-window {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  width: 20px;\n  height: 20px;\n  overflow: hidden;\n  transform: translate(-50%, -50%);\n}\n\n.comimi-autoplay-slider {\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 200%;\n  height: 100%;\n  transition: transform 0.36s var(--comimi-spring);\n}\n\n.comimi-autoplay-slider[data-active=\"true\"] {\n  transform: translateX(50%);\n}\n\n.comimi-autoplay-icon {\n  position: absolute;\n  top: 0;\n  width: 50%;\n  height: 100%;\n  display: block;\n}\n\n.comimi-autoplay-icon-play {\n  right: 0;\n}\n\n.comimi-autoplay-icon-pause {\n  left: 0;\n}\n\n.comimi-autoplay-progress {\n  position: relative;\n  width: 140px;\n  height: 6px;\n  border-radius: 999px;\n  background: #e0e0e0;\n  overflow: hidden;\n}\n\n.comimi-autoplay-progress-bar {\n  display: block;\n  position: absolute;\n  inset: 0;\n  border-radius: 999px;\n  background: #666;\n  animation: comimi-autoplay-progress 3s linear 0s infinite;\n}\n\n/* --- Page Mode Toggle (single / spread) ------------------------------ */\n\n.comimi-page-mode {\n  position: relative;\n  width: 80px;\n  height: 30px;\n}\n\n.comimi-page-mode-wrapper {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  width: 80px;\n  height: 30px;\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  background: #eeeeee;\n  border-radius: 8px;\n  transform: translate(-50%, -50%);\n  transition: width 0.36s var(--comimi-spring);\n}\n\n@media (hover: hover) {\n  .comimi-page-mode-wrapper:hover {\n    width: 95px;\n  }\n}\n\n.comimi-page-mode-button {\n  position: relative;\n  display: grid;\n  place-content: center;\n  width: 100%;\n  height: 100%;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  color: #666;\n  cursor: pointer;\n}\n\n.comimi-page-mode-icon {\n  display: block;\n  width: 20px;\n  opacity: 0.3;\n  transform-origin: center bottom;\n  transition: opacity 0.2s ease-in-out;\n}\n\n.comimi-page-mode-button[data-selected=\"true\"] .comimi-page-mode-icon {\n  opacity: 1;\n}\n\n.comimi-page-mode-icon.comimi-pop-animate {\n  animation: comimi-pop 0.5s ease-in-out 0s both;\n}\n\n/* --- Settings (button + popover panel) ------------------------------- */\n\n.comimi-settings {\n  position: relative;\n  width: 24px;\n  height: 24px;\n}\n\n.comimi-settings-button {\n  position: absolute;\n  inset: 0;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  cursor: pointer;\n}\n\n.comimi-settings-icon {\n  display: block;\n  width: 100%;\n  height: 100%;\n  color: #666;\n  transition: transform 0.36s var(--comimi-spring);\n}\n\n.comimi-settings[data-open=\"true\"] .comimi-settings-icon {\n  transform: rotate(30deg);\n}\n\n@keyframes comimi-pop {\n  from, to {\n    transform: scale(1, 1);\n  }\n  50% {\n    transform: scale(0.95, 1.15);\n  }\n  75% {\n    transform: scale(1.15, 0.95);\n  }\n}\n\n@keyframes comimi-autoplay-progress {\n  from {\n    transform: translateX(-100%);\n  }\n  to {\n    transform: translateX(0);\n  }\n}\n\n@media (max-width: 767px) {\n  .comimi-controls-dock {\n    bottom: 0;\n    left: 0;\n    width: 100%;\n    padding: 20px 16px calc(20px + env(safe-area-inset-bottom, 0px));\n  }\n\n  .comimi-controls-bg {\n    border-radius: 20px 20px 0 0;\n  }\n}\n", he = "\n.comimi-error-icon {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  display: grid;\n  gap: 10px;\n  justify-items: center;\n  width: 80px;\n}\n\n.comimi-error-icon-svg {\n  width: 80px;\n}\n\n.comimi-error-svg {\n  display: block;\n  width: 100%;\n  transform-origin: center bottom;\n  animation: comimi-error-fall 0.8s ease-in-out 0s both;\n}\n\n.comimi-error-stroke {\n  fill: none;\n  stroke: #ccc;\n  stroke-linecap: round;\n  stroke-linejoin: round;\n  stroke-width: 10px;\n}\n\n.comimi-error-mimi {\n  transform-origin: 56px 43px;\n}\n\n.comimi-error-mimi-left {\n  animation:\n    comimi-error-mimi-left-intro 0.8s ease-in-out 0s both,\n    comimi-error-mimi-left-loop 1.5s ease-in-out 0.8s infinite forwards;\n}\n\n.comimi-error-mimi-right {\n  animation:\n    comimi-error-mimi-right-intro 0.8s ease-in-out 0s both,\n    comimi-error-mimi-right-loop 1.5s ease-in-out 0.8s infinite forwards;\n}\n\n.comimi-error-eye {\n  fill: #ccc;\n  transform-origin: center;\n  transform-box: fill-box;\n  animation: comimi-error-eye 1.5s ease-in-out 0.8s infinite forwards;\n}\n\n.comimi-error-icon-text {\n  color: #aaa;\n  font-size: 12px;\n  font-weight: 700;\n  line-height: 1.45;\n  text-align: center;\n}\n\n@keyframes comimi-error-fall {\n  from {\n    opacity: 0;\n    transform: translateY(-40%) rotate(10deg);\n  }\n  20% {\n    opacity: 1;\n  }\n  40% {\n    transform: translateY(0) rotate(0);\n  }\n  60% {\n    transform: translateY(0) scale(1.1, 0.95);\n  }\n  80% {\n    transform: translateY(0) scale(0.95, 1.1);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes comimi-error-mimi-left-intro {\n  from {\n    transform: rotate(0deg);\n  }\n  60% {\n    transform: rotate(20deg);\n  }\n  to {\n    transform: rotate(10deg);\n  }\n}\n\n@keyframes comimi-error-mimi-left-loop {\n  from, to {\n    transform: rotate(10deg);\n  }\n  50% {\n    transform: rotate(30deg);\n  }\n}\n\n@keyframes comimi-error-mimi-right-intro {\n  from {\n    transform: rotate(0deg);\n  }\n  60% {\n    transform: rotate(-20deg);\n  }\n  to {\n    transform: rotate(-10deg);\n  }\n}\n\n@keyframes comimi-error-mimi-right-loop {\n  from, to {\n    transform: rotate(-10deg);\n  }\n  50% {\n    transform: rotate(-30deg);\n  }\n}\n\n@keyframes comimi-error-eye {\n  from, to {\n    transform: translateY(0);\n  }\n  50% {\n    transform: translateY(4px);\n  }\n}\n", ge = "\n.comimi-icon {\n  display: block;\n  width: 100%;\n  height: 100%;\n}\n\n.comimi-icon-fill {\n  fill: currentColor;\n  transition: fill .2s linear;\n}\n\n.comimi-icon-stroke {\n  fill: none;\n  stroke: currentColor;\n  stroke-width: 1.6;\n  transition: stroke .2s linear;\n}\n\n.comimi-menu-svg,\n.comimi-close-svg {\n  display: block;\n  position: relative;\n  width: 34px;\n  height: 34px;\n}\n\n.comimi-menu-svg span,\n.comimi-close-svg span {\n  position: absolute;\n  left: 50%;\n  width: 17px;\n  height: 3px;\n  border-radius: 999px;\n  background: #666;\n}\n\n.comimi-menu-svg span:nth-child(1) {\n  top: 9px;\n  transform: translateX(-50%);\n}\n\n.comimi-menu-svg span:nth-child(2) {\n  top: 50%;\n  transform: translate(-50%, -50%);\n}\n\n.comimi-menu-svg span:nth-child(3) {\n  bottom: 9px;\n  transform: translateX(-50%);\n}\n\n.comimi-close-svg span {\n  top: 50%;\n}\n\n.comimi-close-svg span:nth-child(1) {\n  transform: translate(-50%, -50%) rotate(45deg);\n}\n\n.comimi-close-svg span:nth-child(2) {\n  transform: translate(-50%, -50%) rotate(-45deg);\n}\n", _e = "\n.comimi-selectbox {\n  position: relative;\n  display: inline-block;\n  width: 100%;\n}\n\n.comimi-selectbox-bg {\n  position: absolute;\n  inset: 0;\n  border-radius: 8px;\n  background: #eeeeee;\n  transition: inset 0.36s var(--comimi-spring);\n}\n\n@media (hover: hover) {\n  .comimi-selectbox:hover .comimi-selectbox-bg {\n    inset: -3px;\n  }\n}\n\n.comimi-selectbox-select {\n  position: absolute;\n  inset: 0;\n  z-index: 2;\n  width: 100%;\n  height: 100%;\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  appearance: none;\n  -webkit-appearance: none;\n  color: transparent;\n  font: inherit;\n  cursor: pointer;\n  opacity: 0;\n}\n\n.comimi-selectbox-select:disabled {\n  cursor: not-allowed;\n}\n\n.comimi-selectbox-select option {\n  color: #333;\n  background-color: #fff;\n}\n\n.comimi-selectbox-label {\n  position: relative;\n  display: block;\n  box-sizing: border-box;\n  width: 100%;\n  padding: 8px 32px 8px 12px;\n  color: #333;\n  font-size: 12px;\n  font-weight: 400;\n  line-height: 1.45;\n  cursor: pointer;\n  pointer-events: none;\n}\n\n.comimi-selectbox-arrow {\n  position: absolute;\n  top: 50%;\n  right: 12px;\n  z-index: 1;\n  width: 16px;\n  height: 16px;\n  color: #aaa;\n  transform: translateY(-50%) rotate(90deg);\n  pointer-events: none;\n}\n\n@media (hover: hover) {\n  .comimi-selectbox:hover .comimi-selectbox-arrow {\n    animation: comimi-selectbox-arrow 0.5s ease-in-out 0s both;\n  }\n}\n\n@keyframes comimi-selectbox-arrow {\n  from, to {\n    transform: translateY(-50%) rotate(90deg);\n  }\n  40% {\n    transform: translateY(calc(-50% + 3px)) rotate(90deg);\n  }\n  70% {\n    transform: translateY(calc(-50% - 1.5px)) rotate(90deg);\n  }\n}\n\n.comimi-toggle-switch {\n  display: grid;\n  grid-template-columns: repeat(2, auto);\n  column-gap: 6px;\n  justify-content: start;\n  align-items: center;\n  width: 100%;\n  padding: 2px;\n  border: 0;\n  background: transparent;\n  cursor: pointer;\n}\n\n.comimi-toggle-track {\n  position: relative;\n  width: 32px;\n  height: 18px;\n  border-radius: 999px;\n  background: #eeeeee;\n  transition: background-color 0.2s linear;\n}\n\n.comimi-toggle-switch[data-checked=\"true\"] .comimi-toggle-track {\n  background: #666;\n}\n\n.comimi-toggle-knob {\n  position: absolute;\n  top: 2px;\n  left: 2px;\n  width: 14px;\n  height: 14px;\n  border-radius: 50%;\n  background: #666;\n  transition:\n    transform 0.36s var(--comimi-spring),\n    background-color 0.2s linear;\n}\n\n.comimi-toggle-switch[data-checked=\"true\"] .comimi-toggle-knob {\n  background: #fff;\n  transform: translateX(100%);\n}\n\n.comimi-toggle-label-wrap {\n  position: relative;\n  width: 22px;\n  height: 12px;\n  overflow: hidden;\n}\n\n.comimi-toggle-label-inner {\n  position: absolute;\n  inset: 0;\n  transition: transform 0.36s var(--comimi-spring);\n}\n\n.comimi-toggle-switch[data-checked=\"false\"] .comimi-toggle-label-inner {\n  transform: translateX(-100%);\n}\n\n.comimi-toggle-label {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  font-size: 11px;\n  font-weight: 400;\n  line-height: 12px;\n  text-align: center;\n}\n\n.comimi-toggle-label-on {\n  color: #333;\n}\n\n.comimi-toggle-label-off {\n  color: #aaa;\n  transform: translateX(100%);\n}\n\n.comimi-range-slider {\n  display: grid;\n  grid-template-columns: 1fr auto;\n  column-gap: 8px;\n  align-items: center;\n  width: 100%;\n}\n\n.comimi-range-slider[data-disabled=\"true\"] {\n  opacity: 0.6;\n}\n\n.comimi-range-slider-wrap {\n  position: relative;\n  display: grid;\n  align-items: center;\n  min-width: 0;\n  height: 18px;\n}\n\n.comimi-range-slider-track {\n  position: absolute;\n  top: 50%;\n  left: 0;\n  right: 0;\n  height: 6px;\n  border-radius: 999px;\n  background: #eeeeee;\n  overflow: hidden;\n  transform: translateY(-50%);\n  transition: height 0.36s var(--comimi-spring);\n}\n\n@media (hover: hover) {\n  .comimi-range-slider-wrap:hover .comimi-range-slider-track {\n    height: 10px;\n  }\n}\n\n.comimi-range-slider-fill {\n  display: block;\n  height: 100%;\n  background: #666;\n  border-radius: inherit;\n}\n\n.comimi-range-slider-input {\n  position: relative;\n  z-index: 1;\n  width: 100%;\n  height: 18px;\n  margin: 0;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  appearance: none;\n  -webkit-appearance: none;\n  cursor: pointer;\n}\n\n.comimi-range-slider-input::-webkit-slider-runnable-track {\n  height: 6px;\n  background: transparent;\n  border: 0;\n}\n\n.comimi-range-slider-input::-webkit-slider-thumb {\n  appearance: none;\n  -webkit-appearance: none;\n  width: 18px;\n  height: 18px;\n  margin-top: -6px;\n  border: 0;\n  border-radius: 50%;\n  background: #666;\n  box-shadow: none;\n  transition:\n    transform 0.36s var(--comimi-spring),\n    background-color 0.2s ease-in-out;\n}\n\n.comimi-range-slider-input:hover:not(:disabled)::-webkit-slider-thumb {\n  transform: scale(1.15);\n}\n\n.comimi-range-slider-input::-moz-range-track {\n  height: 6px;\n  background: transparent;\n  border: 0;\n}\n\n.comimi-range-slider-input::-moz-range-thumb {\n  width: 18px;\n  height: 18px;\n  border: 0;\n  border-radius: 50%;\n  background: #666;\n  box-shadow: none;\n  transition:\n    transform 0.36s var(--comimi-spring),\n    background-color 0.2s ease-in-out;\n}\n\n.comimi-range-slider-input:hover:not(:disabled)::-moz-range-thumb {\n  transform: scale(1.15);\n}\n\n.comimi-range-slider-input:focus-visible {\n  outline: none;\n}\n\n.comimi-range-slider-input:focus-visible::-webkit-slider-thumb {\n  box-shadow: none;\n}\n\n.comimi-range-slider-input:focus-visible::-moz-range-thumb {\n  box-shadow: none;\n}\n\n.comimi-range-slider-value {\n  width: 36px;\n  color: #666;\n  font-size: 11px;\n  font-weight: 400;\n  line-height: 1;\n  text-align: right;\n  white-space: nowrap;\n}\n", ve = "\n.comimi-loading-icon {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  display: grid;\n  gap: 10px;\n  justify-items: center;\n  width: 80px;\n}\n\n.comimi-loading-icon-svg {\n  width: 80px;\n}\n\n.comimi-loading-svg {\n  display: block;\n  width: 100%;\n  transform-origin: center bottom;\n}\n\n.comimi-loading-stroke {\n  fill: none;\n  stroke: #ccc;\n  stroke-linecap: round;\n  stroke-linejoin: round;\n  stroke-width: 10px;\n}\n\n.comimi-loading-mimi {\n  transform-origin: 56px 43px;\n}\n\n.comimi-loading-mimi-left {\n  animation:\n    comimi-loading-mimi-left 0.4s ease-in-out 0.1s 2 forwards,\n    comimi-loading-mimi-left 0.4s ease-in-out 1.7s 2 forwards;\n}\n\n.comimi-loading-mimi-right {\n  animation:\n    comimi-loading-mimi-right 0.4s ease-in-out 0.1s 2 forwards,\n    comimi-loading-mimi-right 0.4s ease-in-out 1.7s 2 forwards;\n}\n\n.comimi-loading-eyes {\n  transform: translateX(-7px);\n  animation:\n    comimi-loading-eyes-move 0.4s ease-in-out 1.2s both,\n    comimi-loading-eyes-move 0.4s ease-in-out 2.6s reverse forwards;\n}\n\n.comimi-loading-eye {\n  fill: #ccc;\n  transform-origin: center;\n  transform-box: fill-box;\n  animation:\n    comimi-loading-eye 0.4s ease-in-out 0s forwards,\n    comimi-loading-eye 0.4s ease-in-out 1.6s forwards;\n}\n\n.comimi-loading-icon-text {\n  color: #aaa;\n  font-size: 12px;\n  font-weight: 700;\n  line-height: 1.45;\n  text-align: center;\n}\n\n.comimi-loading-icon-text span {\n  display: inline-block;\n  animation: comimi-loading-dot 0.8s ease-in-out 0s infinite both;\n}\n\n.comimi-loading-icon-text span:nth-child(1) {\n  animation-delay: 0s;\n}\n\n.comimi-loading-icon-text span:nth-child(2) {\n  animation-delay: 0.15s;\n}\n\n.comimi-loading-icon-text span:nth-child(3) {\n  animation-delay: 0.3s;\n}\n\n@keyframes comimi-loading-mimi-left {\n  from, to {\n    transform: rotate(0deg);\n  }\n  50% {\n    transform: rotate(20deg);\n  }\n}\n\n@keyframes comimi-loading-mimi-right {\n  from, to {\n    transform: rotate(0deg);\n  }\n  50% {\n    transform: rotate(-20deg);\n  }\n}\n\n@keyframes comimi-loading-eyes-move {\n  from {\n    transform: translateX(-7px);\n  }\n  to {\n    transform: translateX(7px);\n  }\n}\n\n@keyframes comimi-loading-eye {\n  from, to {\n    transform: scaleY(1);\n  }\n  50% {\n    transform: scaleY(0.2);\n  }\n}\n\n@keyframes comimi-loading-dot {\n  from, 50%, to {\n    opacity: 1;\n  }\n  25% {\n    opacity: 0;\n  }\n}\n", ye = "\n.comimi-menu-panel {\n  position: absolute;\n  top: 24px;\n  left: 24px;\n  width: 420px;\n  z-index: 45;\n  pointer-events: auto;\n  transition:\n    transform 0.6s var(--comimi-spring),\n    opacity 0.3s linear;\n}\n\n.comimi-menu-panel[data-overlay=\"false\"] {\n  transform: translateY(-35px);\n  opacity: 0;\n  pointer-events: none;\n  transition:\n    transform 0.3s var(--comimi-spring),\n    opacity 0.15s linear;\n}\n\n.comimi-menu-bg {\n  position: absolute;\n  inset: 0;\n  border-radius: 16px;\n  background: var(--comimi-glass);\n  box-shadow: var(--comimi-shadow);\n  backdrop-filter: blur(5px);\n  transition: inset 0.36s var(--comimi-spring);\n}\n\n@media (hover: hover) {\n  .comimi-menu-panel:hover > .comimi-menu-bg {\n    inset: -5px;\n  }\n}\n\n.comimi-menu-top {\n  position: relative;\n  display: grid;\n  grid-template-columns: auto 1fr;\n  column-gap: 13px;\n  align-items: center;\n  box-sizing: border-box;\n  width: 100%;\n  height: 62px;\n  padding: 0 13px;\n  border: 0;\n  background: transparent;\n  color: inherit;\n  text-align: left;\n  cursor: pointer;\n}\n\n.comimi-menu-button {\n  position: relative;\n  width: 34px;\n  height: 34px;\n  overflow: hidden;\n}\n\n.comimi-menu-button-inner {\n  display: block;\n  position: absolute;\n  inset: 0;\n  transition: transform 0.4s var(--comimi-spring);\n}\n\n.comimi-menu-panel[data-open=\"true\"] .comimi-menu-button-inner {\n  transform: translateY(100%);\n}\n\n.comimi-menu-button-inner > * {\n  position: absolute;\n  inset: 0;\n}\n\n.comimi-menu-button-inner > *:nth-child(2) {\n  transform: translateY(-100%);\n}\n\n.comimi-menu-title-wrap {\n  min-width: 0;\n}\n\n.comimi-menu-title {\n  display: block;\n  width: 100%;\n  color: #333;\n  font-size: 15px;\n  font-weight: 700;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.comimi-menu-author {\n  display: block;\n  width: 100%;\n  color: #666;\n  font-size: 12px;\n  font-weight: 400;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.comimi-menu-bottom {\n  position: relative;\n  width: 100%;\n  overflow: hidden;\n  transition: height 0.24s ease-in-out;\n}\n\n.comimi-menu-border {\n  width: 100%;\n  height: 1px;\n  background: #e0e0e0;\n}\n\n.comimi-menu-view {\n  position: absolute;\n  top: 1px;\n  left: 0;\n  width: 100%;\n  transition: all 0.28s ease-in-out;\n  opacity: 0;\n  visibility: hidden;\n  transform: scale(0.92);\n  filter: blur(5px);\n}\n\n.comimi-menu-view-menu {\n  position: relative;\n}\n\n.comimi-menu-panel[data-view=\"menu\"] .comimi-menu-view-menu,\n.comimi-menu-panel[data-view=\"shortcut\"] .comimi-menu-view-shortcut,\n.comimi-menu-panel[data-view=\"pageList\"] .comimi-menu-view-page-list {\n  opacity: 1;\n  visibility: visible;\n  transform: scale(1);\n  filter: blur(0);\n}\n\n.comimi-menu-list {\n  position: relative;\n  width: 100%;\n  padding: 10px 0;\n}\n\n.comimi-menu-link {\n  box-sizing: border-box;\n  display: grid;\n  grid-template-columns: 1fr auto;\n  column-gap: 8px;\n  align-items: center;\n  width: 100%;\n  padding: 10px 16px 10px 22px;\n  border: 0;\n  border-radius: 10px;\n  background: transparent;\n  color: #666;\n  cursor: pointer;\n  transition: background-color 0.24s linear;\n}\n\n.comimi-menu-link:hover {\n  background: #f1f1f1;\n}\n\n.comimi-menu-link-text {\n  color: #666;\n  font-size: 14px;\n  font-weight: 700;\n  line-height: 1.45;\n  text-align: left;\n}\n\n.comimi-menu-link-arrow {\n  display: block;\n  width: 20px;\n  height: 20px;\n  color: #aaa;\n}\n\n.comimi-menu-link-arrow > svg {\n  display: block;\n  width: 100%;\n  height: 100%;\n}\n\n.comimi-page-list-inner {\n  box-sizing: border-box;\n  padding: 0 22px;\n  max-height: 315px;\n  overflow-y: auto;\n  -webkit-overflow-scrolling: touch;\n}\n\n.comimi-page-list-grid {\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 20px;\n}\n\n.comimi-page-list-item {\n  display: grid;\n  row-gap: 4px;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  color: #666;\n  cursor: pointer;\n  text-align: center;\n}\n\n.comimi-page-list-thumb {\n  position: relative;\n  display: block;\n  width: 100%;\n  aspect-ratio: 100 / 141;\n  background: #fff;\n  border-radius: 6px;\n  outline: 3px solid #e0e0e0;\n}\n\n.comimi-page-list-thumb-html {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  padding: 8px;\n  text-align: center;\n  color: #aaa;\n  font-size: 11px;\n  font-weight: 700;\n  line-height: 1.4;\n}\n\n.comimi-page-list-thumb img {\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n  border-radius: 4px;\n  user-select: none;\n  -webkit-user-drag: none;\n}\n\n.comimi-page-list-text {\n  color: #666;\n  font-size: 14px;\n  font-weight: 700;\n}\n\n.comimi-shortcut-inner {\n  box-sizing: border-box;\n  padding: 0 22px;\n  max-height: 315px;\n  overflow-y: auto;\n  -webkit-overflow-scrolling: touch;\n}\n\n.comimi-shortcut-grid {\n  display: grid;\n  row-gap: 22px;\n}\n\n.comimi-shortcut-section {\n  display: grid;\n  row-gap: 8px;\n}\n\n.comimi-shortcut-heading {\n  color: #666;\n  font-size: 12px;\n  font-weight: 700;\n  line-height: 1.45;\n}\n\n.comimi-shortcut-list {\n  display: grid;\n  row-gap: 8px;\n  justify-items: start;\n}\n\n.comimi-shortcut-column {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px 16px;\n  align-items: center;\n}\n\n.comimi-shortcut-item {\n  display: grid;\n  grid-template-columns: repeat(2, auto);\n  column-gap: 8px;\n  align-items: center;\n  width: fit-content;\n}\n\n.comimi-shortcut-badge {\n  display: grid;\n  grid-auto-flow: column;\n  column-gap: 6px;\n  align-items: center;\n  padding: 4px 8px;\n  border-radius: 7px;\n  background: #eeeeee;\n}\n\n.comimi-shortcut-key {\n  color: #666;\n  font-size: 13px;\n  font-weight: 700;\n  line-height: 1.45;\n}\n\n.comimi-shortcut-or::before {\n  content: \"or\";\n  display: block;\n  color: #666;\n  font-size: 11px;\n  font-weight: 400;\n  line-height: 1.45;\n}\n\n.comimi-shortcut-label {\n  color: #666;\n  font-size: 13px;\n  font-weight: 400;\n  line-height: 1.45;\n}\n\n.comimi-back-button {\n  position: relative;\n  width: 100%;\n  height: 56px;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  cursor: pointer;\n}\n\n.comimi-back-inner {\n  position: absolute;\n  inset: 8px;\n}\n\n.comimi-back-bg {\n  position: absolute;\n  inset: 0;\n  border-radius: 8px;\n  background: #eeeeee;\n  transition: inset 0.36s var(--comimi-spring), border-radius 0.36s var(--comimi-spring);\n}\n\n.comimi-back-button:hover .comimi-back-bg {\n  inset: -4px;\n  border-radius: 10px;\n}\n\n.comimi-back-text {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  color: #666;\n  font-size: 14px;\n  font-weight: 700;\n  line-height: 1.45;\n  pointer-events: none;\n}\n\n.comimi-back-arrow {\n  position: absolute;\n  top: 50%;\n  left: 8px;\n  width: 22px;\n  height: 22px;\n  color: #aaa;\n  transform: translateY(-50%) scaleX(-1);\n  pointer-events: none;\n}\n\n.comimi-back-arrow > svg {\n  display: block;\n  width: 100%;\n  height: 100%;\n}\n\n@media (max-width: 767px) {\n  .comimi-menu-panel {\n    top: 0;\n    left: 0;\n    width: 100%;\n  }\n\n  .comimi-menu-bg {\n    border-radius: 0 0 16px 16px;\n  }\n\n  .comimi-menu-top {\n    width: 100%;\n  }\n\n  .comimi-page-list-inner,\n  .comimi-shortcut-inner {\n    max-height: calc(var(--view-height, 100vh) - 62px - 56px);\n  }\n}\n", be = "\n.comimi-notifications {\n  position: absolute;\n  bottom: 140px;\n  left: 50%;\n  transform: translateX(-50%);\n  display: grid;\n  row-gap: 8px;\n  justify-items: center;\n  pointer-events: none;\n  z-index: 35;\n}\n\n.comimi-toast {\n  display: grid;\n  grid-template-columns: auto auto;\n  gap: 5px;\n  align-items: center;\n  justify-content: center;\n  width: fit-content;\n  padding: 6px 13px 6px 8px;\n  border-radius: 999px;\n  background-color: #666;\n  animation: comimi-toast-popup 0.37s ease-in-out 0s both;\n}\n\n.comimi-toast-dot {\n  display: block;\n  width: 10px;\n  height: 10px;\n  border-radius: 50%;\n  background: #888;\n}\n\n.comimi-toast-text {\n  color: #fff;\n  font-size: 12px;\n  font-weight: 700;\n  line-height: 1.45;\n}\n\n@keyframes comimi-toast-popup {\n  from {\n    transform: translateY(6px) scale(0.2, 0.8);\n    opacity: 0;\n  }\n  60% {\n    transform: translateY(-1px) scale(1.1, 1.05);\n    opacity: 1;\n  }\n  to {\n    transform: scale(1, 1);\n    opacity: 1;\n  }\n}\n\n@media (max-width: 767px) {\n  .comimi-notifications {\n    bottom: calc(120px + env(safe-area-inset-bottom, 0px));\n  }\n}\n", xe = "\n.comimi-stage {\n  position: absolute;\n  inset: 0;\n  will-change: transform;\n  transition: transform .18s ease;\n}\n\n.comimi-stage[data-dragging=\"true\"] {\n  transition: none;\n}\n\n.comimi-page-group {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 0;\n  box-sizing: border-box;\n}\n\n.comimi-page {\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  max-width: 100%;\n  max-height: 100%;\n  min-width: 0;\n  min-height: 0;\n  background: transparent;\n  overflow: hidden;\n  flex: 0 0 auto;\n}\n\n.comimi-page[data-spread=\"true\"] {\n  width: 50%;\n  height: 100%;\n}\n\n.comimi-page[data-spread=\"false\"] {\n  width: 100%;\n  height: 100%;\n}\n\n.comimi-page[data-position=\"left\"] {\n  justify-content: flex-end;\n}\n\n.comimi-page[data-position=\"right\"] {\n  justify-content: flex-start;\n}\n\n.comimi-page img,\n.comimi-html-page {\n  display: block;\n  max-width: 100%;\n  max-height: 100%;\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n  transform-origin: center center;\n  user-select: none;\n  -webkit-user-select: none;\n  -webkit-user-drag: none;\n  -webkit-touch-callout: none;\n}\n\n.comimi-page img {\n  pointer-events: none;\n}\n\n.comimi-page[data-spread=\"true\"] img,\n.comimi-page[data-spread=\"true\"] .comimi-html-page {\n  width: 100%;\n  height: 100%;\n}\n\n.comimi-page[data-position=\"left\"] img,\n.comimi-page[data-position=\"left\"] .comimi-html-page {\n  object-position: right center;\n}\n\n.comimi-page[data-position=\"right\"] img,\n.comimi-page[data-position=\"right\"] .comimi-html-page {\n  object-position: left center;\n}\n\n.comimi-html-page {\n  width: min(100%, 960px);\n  height: min(100%, 680px);\n  background: #fff;\n  color: #111;\n  overflow: auto;\n}\n\n", Se = "\n.comimi-rabbit {\n  position: absolute;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 50px;\n  aspect-ratio: 1 / 1;\n  z-index: 0;\n  pointer-events: none;\n}\n\n.comimi-rabbit > * {\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n}\n\n.comimi-controls-dock > .comimi-rabbit {\n  bottom: 0;\n  left: 50%;\n  transform: translateX(-50%);\n}\n\n.comimi-menu-panel > .comimi-rabbit {\n  top: 12px;\n  right: 20px;\n}\n\n@media (max-width: 767px) {\n  .comimi-controls-dock > .comimi-rabbit {\n    display: none;\n  }\n}\n\n@media (min-width: 768px) {\n  .comimi-menu-panel > .comimi-rabbit {\n    display: none;\n  }\n}\n", Ce = "\n.comimi-scrollfade {\n  position: relative;\n  overscroll-behavior: contain;\n}\n\n.comimi-scrollfade::before,\n.comimi-scrollfade::after {\n  content: \"\";\n  position: sticky;\n  display: block;\n  left: 0;\n  width: 100%;\n  height: 32px;\n  z-index: 2;\n  pointer-events: none;\n  opacity: 0;\n  transition: opacity 0.16s linear;\n}\n\n.comimi-scrollfade::before {\n  top: 0;\n  background: linear-gradient(to bottom, #fff, transparent);\n}\n\n.comimi-scrollfade::after {\n  bottom: 0;\n  background: linear-gradient(to top, #fff, transparent);\n}\n\n.comimi-scrollfade[data-scroll-up=\"true\"]::before {\n  opacity: 1;\n}\n\n.comimi-scrollfade[data-scroll-down=\"true\"]::after {\n  opacity: 1;\n}\n", we = "\n.comimi-settings-panel {\n  position: absolute;\n  top: 0;\n  right: -16px;\n  width: 250px;\n  height: 0;\n  border-radius: 20px;\n  overflow: hidden;\n  background: var(--comimi-glass-strong);\n  box-shadow: var(--comimi-shadow);\n  backdrop-filter: blur(5px);\n  opacity: 0;\n  transform: translateY(calc(-100% - 8px));\n  transition:\n    height 0.38s cubic-bezier(0.12, 1.06, 0.56, 1.02),\n    opacity 0.38s cubic-bezier(0.12, 1.06, 0.56, 1.02);\n  z-index: 10;\n}\n\n.comimi-settings-panel[data-open=\"true\"] {\n  opacity: 1;\n  height: var(--comimi-settings-height, 460px);\n}\n\n.comimi-settings-panel-body {\n  position: relative;\n  width: 100%;\n  max-height: calc(var(--view-height, 100vh) - 62px - 56px);\n  overflow-y: auto;\n  -webkit-overflow-scrolling: touch;\n}\n\n.comimi-settings-panel-inner {\n  box-sizing: border-box;\n  position: relative;\n  padding: 0 20px;\n}\n\n.comimi-settings-panel-title {\n  color: #333;\n  font-size: 14px;\n  font-weight: 700;\n  text-align: center;\n}\n\n.comimi-settings-section {\n  display: grid;\n  row-gap: 8px;\n  margin-top: 18px;\n}\n\n.comimi-settings-label {\n  color: #333;\n  font-size: 12px;\n  font-weight: 400;\n}\n\n", Te = "\n.comimi-splash {\n  position: absolute;\n  inset: 0;\n  z-index: 100;\n  background-color: #e0e0e0;\n  overflow: hidden;\n  animation: comimi-splash-clip 1s cubic-bezier(0.82, 0.01, 0.48, 1.02) 1s both;\n  pointer-events: none;\n}\n\n.comimi-splash-logo-wrap {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -60%);\n  width: 260px;\n  aspect-ratio: 290 / 99;\n}\n\n.comimi-splash-logo {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%) scale(0.72);\n  width: 360px;\n  aspect-ratio: 360 / 99;\n}\n\n.comimi-splash-symbol {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 113px;\n  display: block;\n  transform-origin: center bottom;\n}\n\n.comimi-splash-logo-wrap-custom {\n  width: 120px;\n  aspect-ratio: 1 / 1;\n}\n\n.comimi-splash-logo-wrap-custom .comimi-splash-text {\n  transform: translate(-50%, calc(100% + 16px));\n}\n\n.comimi-splash-custom-logo {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 120px;\n  aspect-ratio: 1 / 1;\n}\n\n.comimi-splash-custom-logo > * {\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n}\n\n.comimi-splash-typo-wrap {\n  position: absolute;\n  right: 7px;\n  bottom: 11px;\n  width: 229.5px;\n}\n\n.comimi-splash-typo {\n  display: block;\n  width: 100%;\n  overflow: visible;\n}\n\n.comimi-splash-stroke {\n  fill: none;\n  stroke: #fff;\n  stroke-linecap: round;\n  stroke-linejoin: round;\n  stroke-width: 10px;\n}\n\n.comimi-splash-mimi {\n  transform-origin: 56px 43px;\n}\n\n.comimi-splash-mimi-left {\n  animation: comimi-splash-mimi-left 0.4s ease-in-out 0.3s 2 forwards;\n}\n\n.comimi-splash-mimi-right {\n  animation: comimi-splash-mimi-right 0.4s ease-in-out 0.3s 2 forwards;\n}\n\n.comimi-splash-eyes {\n  transform: translateX(-7px);\n}\n\n.comimi-splash-eye {\n  transform-origin: center;\n  transform-box: fill-box;\n  animation: comimi-splash-eye 0.4s ease-in-out 0.2s forwards;\n}\n\n.comimi-splash-heart {\n  --size: 14px;\n  position: absolute;\n  top: -20px;\n  width: var(--size);\n  height: var(--size);\n}\n\n.comimi-splash-heart::before,\n.comimi-splash-heart::after {\n  content: \"\";\n  display: block;\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  height: 150%;\n  border-radius: 999px;\n  transform-origin: center bottom;\n}\n\n.comimi-splash-heart::before {\n  transform: translateX(-32%) rotate(45deg);\n  background-color: #eee;\n}\n\n.comimi-splash-heart::after {\n  transform: translateX(32%) rotate(-45deg);\n  background-color: #fff;\n}\n\n.comimi-splash-heart-1 {\n  right: -2px;\n}\n\n.comimi-splash-heart-2 {\n  right: 76px;\n}\n\n.comimi-splash-text {\n  position: absolute;\n  bottom: 0;\n  left: 50%;\n  transform: translate(-50%, 120%);\n  color: #fff;\n  font-size: 16px;\n  font-weight: 700;\n  line-height: 1.45;\n  text-align: center;\n  white-space: nowrap;\n}\n\n.comimi-splash-text span {\n  display: inline-block;\n  animation: comimi-splash-dot 0.8s ease-in-out 0s infinite both;\n}\n\n.comimi-splash-text span:nth-child(1) {\n  animation-delay: 0s;\n}\n\n.comimi-splash-text span:nth-child(2) {\n  animation-delay: 0.15s;\n}\n\n.comimi-splash-text span:nth-child(3) {\n  animation-delay: 0.3s;\n}\n\n@keyframes comimi-splash-clip {\n  from {\n    clip-path: circle(70%);\n  }\n  to {\n    clip-path: circle(0%);\n  }\n}\n\n@keyframes comimi-splash-mimi-left {\n  from, to {\n    transform: rotate(0deg);\n  }\n  50% {\n    transform: rotate(20deg);\n  }\n}\n\n@keyframes comimi-splash-mimi-right {\n  from, to {\n    transform: rotate(0deg);\n  }\n  50% {\n    transform: rotate(-20deg);\n  }\n}\n\n@keyframes comimi-splash-eye {\n  from, to {\n    transform: scaleY(1);\n  }\n  50% {\n    transform: scaleY(0.2);\n  }\n}\n\n@keyframes comimi-splash-dot {\n  from, 50%, to {\n    opacity: 1;\n  }\n  25% {\n    opacity: 0;\n  }\n}\n", Ee = "\n.comimi-tooltip {\n  position: absolute;\n  bottom: 0;\n  left: 50%;\n  padding: 6px 10px;\n  border-radius: 8px;\n  background: rgba(255, 255, 255, 0.5);\n  box-shadow: var(--comimi-shadow);\n  backdrop-filter: blur(5px);\n  color: #333;\n  font-size: 12px;\n  font-weight: 600;\n  line-height: 1.45;\n  white-space: nowrap;\n  pointer-events: none;\n  user-select: none;\n  opacity: 0;\n  transform: translate(-50%, calc(100% + 6px)) scale(0.88);\n  transform-origin: center top;\n  transition:\n    opacity 0.1s ease-in-out,\n    transform 0.16s ease-in-out;\n  z-index: 5;\n}\n\n@media (hover: hover) {\n  .comimi-has-tooltip:hover > .comimi-tooltip {\n    opacity: 1;\n    transform: translate(-50%, calc(100% + 6px)) scale(1);\n  }\n}\n", De = "\n.comimi-root {\n  --comimi-bg: #fff;\n  --comimi-surface: #f7f7f7;\n  --comimi-surface-2: #eeeeee;\n  --comimi-fg: #333;\n  --comimi-muted: #666;\n  --comimi-soft: #999;\n  --comimi-line: #e0e0e0;\n  --comimi-shadow: 0 0 8px rgba(0, 0, 0, 0.1);\n  --comimi-glass: rgba(255, 255, 255, 0.8);\n  --comimi-glass-strong: rgba(255, 255, 255, 0.8);\n  --comimi-spring: cubic-bezier(0.34, 1.56, 0.64, 1);\n  background: var(--comimi-bg);\n  color: var(--comimi-fg);\n  font-family: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\n  position: relative;\n  width: calc(100% - 24px * 2);\n  max-width: 900px;\n  aspect-ratio: 900 / 636;\n  margin: 0 auto;\n  border-radius: 16px;\n  box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.06);\n  overflow: hidden;\n  user-select: none;\n  -webkit-tap-highlight-color: transparent;\n  touch-action: none;\n  transition:\n    box-shadow 0.24s ease-out,\n    background-color 0.16s linear;\n}\n\n.comimi-root:focus {\n  outline: none;\n  box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.14);\n}\n\n@media (max-width: 767px) {\n  .comimi-root {\n    max-width: 500px;\n    aspect-ratio: 390 / 490;\n  }\n}\n\n.comimi-root[data-bg=\"black\"] {\n  --comimi-bg: #000;\n}\n\n.comimi-root[data-layout=\"wide\"] {\n  width: 100%;\n  max-width: none;\n  aspect-ratio: auto;\n  min-height: 320px;\n  margin: 0;\n  border-radius: 0;\n  box-shadow: none;\n}\n\n.comimi-root[data-layout=\"browserFullscreen\"],\n.comimi-root[data-layout=\"nativeFullscreen\"] {\n  position: fixed;\n  inset: 0;\n  z-index: 999;\n  width: 100vw;\n  height: 100dvh;\n  max-width: none;\n  aspect-ratio: auto;\n  margin: 0;\n  border-radius: 0;\n  box-shadow: none;\n}\n\n.comimi-resize-handle {\n  position: relative;\n  width: 100%;\n  height: 20px;\n  background: #fff;\n  cursor: ns-resize;\n  touch-action: none;\n}\n\n.comimi-resize-handle::after {\n  content: \"\";\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 40px;\n  height: 3px;\n  border-radius: 999px;\n  background: #bbb;\n  transition:\n    width 0.36s cubic-bezier(0.34, 1.56, 0.64, 1),\n    height 0.36s cubic-bezier(0.34, 1.56, 0.64, 1),\n    background-color 0.2s linear;\n}\n\n@media (hover: hover) {\n  .comimi-resize-handle:hover::after {\n    width: 52px;\n    height: 5px;\n    background: #888;\n  }\n}\n\n", Oe = "\n.comimi-view-switcher {\n  position: absolute;\n  top: 20px;\n  right: 20px;\n  display: grid;\n  grid-template-columns: repeat(3, 60px);\n  width: 180px;\n  border-radius: 16px;\n  background: var(--comimi-glass);\n  box-shadow: var(--comimi-shadow);\n  backdrop-filter: blur(5px);\n  pointer-events: auto;\n  transition:\n    transform 0.6s var(--comimi-spring),\n    opacity 0.3s linear;\n}\n\n.comimi-view-switcher[data-overlay=\"false\"] {\n  transform: translateY(-35px);\n  opacity: 0;\n  pointer-events: none;\n  transition:\n    transform 0.3s var(--comimi-spring),\n    opacity 0.15s linear;\n}\n\n@media (hover: hover) {\n  .comimi-view-switcher:hover {\n    transform: scaleX(1.03);\n  }\n}\n\n.comimi-view-switcher-indicator {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 60px;\n  height: 100%;\n  border-radius: 16px;\n  background: #666;\n  transition: transform 0.36s var(--comimi-spring);\n}\n\n.comimi-view-switcher-button {\n  position: relative;\n  display: grid;\n  row-gap: 5px;\n  justify-items: center;\n  align-content: center;\n  height: 58px;\n  padding: 0;\n  border: 0;\n  background: transparent;\n  color: #666;\n  cursor: pointer;\n  transition: color 0.2s linear;\n}\n\n.comimi-view-switcher-button[data-selected=\"true\"] {\n  color: #fff;\n}\n\n.comimi-view-switcher-icon-wrap {\n  width: 20px;\n  height: 20px;\n  transform-origin: center bottom;\n}\n\n.comimi-view-switcher-icon {\n  display: block;\n  width: 100%;\n  height: 100%;\n  color: currentColor;\n}\n\n.comimi-view-switcher-icon-wrap.comimi-pop-animate {\n  animation: comimi-pop 0.5s ease-in-out 0.1s both;\n}\n\n.comimi-view-switcher-label {\n  color: currentColor;\n  font-size: 10px;\n  font-weight: 500;\n  text-align: center;\n  transition: color 0.2s linear;\n}\n\n@media (max-width: 767px) {\n  .comimi-view-switcher {\n    top: 70px;\n    right: auto;\n    left: calc(50% - 90px);\n  }\n}\n", q = !1, ke = [
 	De,
 	ge,
 	Ee,

package/dist/manga-viewer.global.js

@@ -36,7 +36,7 @@ var MangaViewer=(function(e){Object.defineProperty(e,Symbol.toStringTag,{value:`
     </g>
   </g>
 </svg>
-`,z=3e3;function B(e){let t=document.createElement(`div`);t.className=`comimi-loading-icon`;let n=document.createElement(`div`);n.className=`comimi-loading-icon-svg`,n.innerHTML=R;let r=document.createElement(`div`);r.className=`comimi-loading-icon-text`,r.append(document.createTextNode(e.t(`loading`)));for(let e=0;e<3;e+=1){let e=document.createElement(`span`);e.textContent=`.`,r.append(e)}t.append(n,r);let i=window.setInterval(()=>{if(!t.isConnected){window.clearInterval(i);return}n.innerHTML=R},z);return t}var V=class{options;root;imageSources=new Map;resolvePromises=new Map;slots=new Map;constructor(e){this.options=e,this.root=document.createElement(`div`),this.root.className=`comimi-stage`}getElement(){return this.root}setDragOffset(e,t=!1){this.root.dataset.dragging=t?`false`:String(e!==0),this.root.style.transform=e===0?``:`translateX(${e}px)`}snapTransform(){this.root.dataset.dragging=`false`,this.root.style.transition=`none`,this.root.style.transform=``,typeof requestAnimationFrame==`function`?requestAnimationFrame(()=>{this.root.style.transition=``}):this.root.style.transition=``}update(e,t){let n=S(e,t),r=[];for(let t of n){let n=document.createElement(`div`);n.className=`comimi-page-group`,n.dataset.placement=t.placement,n.dataset.side=w(e,t.placement),n.style.transform=`translateX(${t.offset*100}%)`;let i=t.indexes.length>1;for(let[r,a]of t.indexes.entries()){let t=e.manga.pages[a];if(!t)continue;let o=this.getOrBuildSlot(e,t,a,i);o.slot.dataset.spread=String(i),o.slot.dataset.position=i?r===0?`left`:`right`:`single`,o.slot.dataset.pageIndex=String(a),o.img&&(o.img.style.transform=H(e)),n.append(o.slot)}r.push(n)}this.root.replaceChildren(...r)}getOrBuildSlot(e,t,n,r){let i=this.slots.get(t.id);if(i)return i;let a=this.buildSlot(e,t,n,r);return this.slots.set(t.id,a),a}buildSlot(e,t,n,r){let i=document.createElement(`div`);if(i.className=`comimi-page`,t.type===`html`){let n=document.createElement(`div`);return n.className=`comimi-html-page`,n.innerHTML=t.html,n.style.transform=H(e),i.append(n),{slot:i,img:null}}let a=document.createElement(`img`);a.alt=t.alt??t.label??`${n+1}`,a.draggable=!1,a.style.transform=H(e),a.addEventListener(`error`,()=>{i.replaceChildren(L(this.options.i18n,n+1))}),i.append(a);let o=`${e.manga.id}:${t.id}`,s=this.imageSources.get(o);if(s)return a.src=s,{slot:i,img:a};let c=B(this.options.i18n);i.append(c),a.style.visibility=`hidden`;let l=this.resolvePromises.get(o);if(!l){let i=this.options.resolvePageSrc;l=i?Promise.resolve(i({page:t,pageIndex:n,isSpread:r})):this.options.assetLoader.resolveImageSource(e.manga.id,t),this.resolvePromises.set(o,l),l.then(e=>{this.imageSources.set(o,e)}).finally(()=>{this.resolvePromises.delete(o)})}return l.then(e=>{a.addEventListener(`load`,()=>{a.style.visibility=``,c.remove()},{once:!0}),a.src=e}).catch(()=>{c.remove(),i.replaceChildren(L(this.options.i18n,n+1))}),{slot:i,img:a}}};function H(e){return`translate(${e.panX}px, ${e.panY}px) scale(${e.zoomScale})`}function U(e){let t=document.createElement(`div`);t.className=`comimi-notifications`;for(let n of e.notifications){let e=document.createElement(`div`);e.className=`comimi-toast`,e.dataset.tone=n.tone??`info`;let r=document.createElement(`span`);r.className=`comimi-toast-dot`;let i=document.createElement(`span`);i.className=`comimi-toast-text`,i.textContent=n.message,e.append(r,i),t.append(e)}return t}var W=`http://www.w3.org/2000/svg`;function G(e,t){let n=document.createElement(`div`);n.className=`comimi-splash`;let r=document.createElement(`div`);r.className=`comimi-splash-logo-wrap`,t&&r.classList.add(`comimi-splash-logo-wrap-custom`);let i=le(t);i&&r.append(i);let a=document.createElement(`div`);a.className=`comimi-splash-text`,a.append(document.createTextNode(e.t(`splash.loading`)));for(let e=0;e<3;e+=1){let e=document.createElement(`span`);e.textContent=`.`,a.append(e)}return r.append(a),n.append(r),n}function le(e){if(e===!1)return null;if(e){let t=document.createElement(`div`);if(t.className=`comimi-splash-custom-logo`,`render`in e)t.append(e.render());else{let n=document.createElement(`img`);n.src=e.src,n.alt=e.alt??``,n.draggable=!1,t.append(n)}return t}let t=document.createElement(`div`);return t.className=`comimi-splash-logo`,t.append(ue(),de()),t}function ue(){let e=document.createElementNS(W,`svg`);e.setAttribute(`viewBox`,`0 0 112.19 99.01`),e.setAttribute(`class`,`comimi-splash-symbol`),K(e,`M17.43,53.54c-7.74,7.51-12.43,17.29-12.43,27.99,0,4.34.78,8.53,2.21,12.48`),K(e,`M104.98,94.01c1.43-3.95,2.21-8.14,2.21-12.48,0-10.91-4.87-20.85-12.87-28.42`),K(e,`M55.79,43.81v-24.02c3.43-9.18,9.81-15.08,20.52-14.52,16.12.84,20.31,15.9,19.35,34.15-.25,4.75-.69,9.25-1.51,13.3`,`comimi-splash-mimi comimi-splash-mimi-left`),K(e,`M55.79,43.62v-24.02c-3.25-9.2-9.34-15.11-19.78-14.56-16.53.87-21.21,15.95-20.25,34.2.26,4.91.67,9.56,1.51,13.72`,`comimi-splash-mimi comimi-splash-mimi-right`);let t=document.createElementNS(W,`path`);t.setAttribute(`d`,`M80.44,49.41H31.46c-12.97,6.71-21.6,18.57-21.6,32.1,0,5.8,1.59,11.3,4.43,16.21h83.34c2.83-4.92,4.43-10.41,4.43-16.21,0-13.53-8.63-25.4-21.6-32.1Z`),t.setAttribute(`fill`,`#e0e0e0`),e.append(t);let n=document.createElementNS(W,`g`);n.setAttribute(`class`,`comimi-splash-eyes`);for(let e of[`40.17`,`71.58`]){let t=document.createElementNS(W,`circle`);t.setAttribute(`class`,`comimi-splash-eye`),t.setAttribute(`cx`,e),t.setAttribute(`cy`,`78.21`),t.setAttribute(`r`,`6`),t.setAttribute(`fill`,`#fff`),n.append(t)}return e.append(n),e}function de(){let e=document.createElement(`div`);e.className=`comimi-splash-typo-wrap`;let t=document.createElementNS(W,`svg`);t.setAttribute(`viewBox`,`0 0 227.74 38.52`),t.setAttribute(`class`,`comimi-splash-typo`);for(let e of[`M12.53,14.42c-3.15,3.27-3.15,8.45,0,11.6,1.58,1.58,3.6,2.36,5.74,2.36,2.25,0,4.28-.79,5.86-2.36,1.91-1.91,5.18-1.91,7.21,0,1.91,2.03,1.91,5.18,0,7.21-3.49,3.49-8.11,5.29-13.07,5.29s-9.46-1.8-12.95-5.29C-1.77,26.02-1.77,14.42,5.32,7.32,12.53.11,24.13.11,31.34,7.32c1.91,1.91,1.91,5.18,0,7.1-2.03,2.03-5.29,2.03-7.21,0-3.15-3.15-8.45-3.15-11.6,0Z`,`M76.15,20.27c0,10.02-8.22,18.25-18.36,18.25-4.96,0-9.57-1.8-12.95-5.29-3.49-3.49-5.41-8.11-5.41-12.95,0-10.14,8.22-18.36,18.36-18.36s18.36,8.22,18.36,18.36ZM66.01,20.27c0-4.5-3.72-8.22-8.22-8.22s-8.22,3.72-8.22,8.22c0,2.14.9,4.17,2.36,5.74,1.58,1.58,3.6,2.36,5.86,2.36,4.5,0,8.22-3.6,8.22-8.11Z`,`M131.42,15.88v17.57c0,2.82-2.25,5.07-5.07,5.07s-5.07-2.25-5.07-5.07V15.88c0-2.36-2.03-4.39-4.51-4.39-1.13,0-2.25.45-3.15,1.24-.79.9-1.24,2.03-1.24,3.15v14.57c0,2.82-2.25,5.07-5.07,5.07s-5.07-2.25-5.07-5.07v-14.57c0-2.36-2.03-4.39-4.5-4.39s-4.39,1.92-4.39,4.39v17.68c0,2.7-2.25,4.96-5.07,4.96s-5.07-2.25-5.07-5.07V15.88c0-8,6.53-14.53,14.53-14.53,3.72,0,6.98,1.35,9.57,3.49,2.59-2.25,5.97-3.49,9.46-3.49,8.11,0,14.64,6.53,14.64,14.53Z`,`M150.98,5.07v28.38c0,2.82-2.25,5.07-5.07,5.07s-5.07-2.25-5.07-5.07V5.07c0-2.7,2.25-5.07,5.07-5.07s5.07,2.36,5.07,5.07Z`,`M208.61,15.88v17.57c0,2.82-2.25,5.07-5.07,5.07s-5.07-2.25-5.07-5.07V15.88c0-2.36-2.03-4.39-4.51-4.39-1.13,0-2.25.45-3.15,1.24-.79.9-1.24,2.03-1.24,3.15v14.57c0,2.82-2.25,5.07-5.07,5.07s-5.07-2.25-5.07-5.07v-14.57c0-2.36-2.03-4.39-4.5-4.39s-4.39,1.92-4.39,4.39v17.68c0,2.7-2.25,4.96-5.07,4.96s-5.07-2.25-5.07-5.07V15.88c0-8,6.53-14.53,14.53-14.53,3.72,0,6.98,1.35,9.57,3.49,2.59-2.25,5.97-3.49,9.46-3.49,8.11,0,14.64,6.53,14.64,14.53Z`,`M227.74,5.07v28.38c0,2.82-2.25,5.07-5.07,5.07s-5.07-2.25-5.07-5.07V5.07c0-2.7,2.25-5.07,5.07-5.07s5.07,2.36,5.07,5.07Z`]){let n=document.createElementNS(W,`path`);n.setAttribute(`d`,e),n.setAttribute(`fill`,`#fff`),t.append(n)}e.append(t);let n=document.createElement(`div`);n.className=`comimi-splash-heart comimi-splash-heart-1`;let r=document.createElement(`div`);return r.className=`comimi-splash-heart comimi-splash-heart-2`,e.append(n,r),e}function K(e,t,n){let r=document.createElementNS(W,`path`);r.setAttribute(`d`,t),r.setAttribute(`class`,`comimi-splash-stroke ${n??``}`.trim()),e.append(r)}function fe({className:e}={}){let t=document.createElement(`div`);return t.className=e?`comimi-root ${e}`:`comimi-root`,t.tabIndex=0,t.setAttribute(`role`,`region`),t.setAttribute(`aria-label`,`Manga viewer`),t}var pe=`
+`,z=3e3;function B(e){let t=document.createElement(`div`);t.className=`comimi-loading-icon`;let n=document.createElement(`div`);n.className=`comimi-loading-icon-svg`,n.innerHTML=R;let r=document.createElement(`div`);r.className=`comimi-loading-icon-text`,r.append(document.createTextNode(e.t(`loading`)));for(let e=0;e<3;e+=1){let e=document.createElement(`span`);e.textContent=`.`,r.append(e)}t.append(n,r);let i=window.setInterval(()=>{if(!t.isConnected){window.clearInterval(i);return}n.innerHTML=R},z);return t}var V=class{options;root;imageSources=new Map;resolvePromises=new Map;slots=new Map;constructor(e){this.options=e,this.root=document.createElement(`div`),this.root.className=`comimi-stage`}getElement(){return this.root}setDragOffset(e,t=!1){this.root.dataset.dragging=t?`false`:String(e!==0),this.root.style.transform=e===0?``:`translateX(${e}px)`}snapTransform(){this.root.dataset.dragging=`false`,this.root.style.transition=`none`,this.root.style.transform=``,this.root.offsetWidth,typeof requestAnimationFrame==`function`?requestAnimationFrame(()=>{this.root.style.transition=``}):this.root.style.transition=``}update(e,t){let n=S(e,t),r=[];for(let t of n){let n=document.createElement(`div`);n.className=`comimi-page-group`,n.dataset.placement=t.placement,n.dataset.side=w(e,t.placement),n.style.transform=`translateX(${t.offset*100}%)`;let i=t.indexes.length>1;for(let[r,a]of t.indexes.entries()){let t=e.manga.pages[a];if(!t)continue;let o=this.getOrBuildSlot(e,t,a,i);o.slot.dataset.spread=String(i),o.slot.dataset.position=i?r===0?`left`:`right`:`single`,o.slot.dataset.pageIndex=String(a),o.img&&(o.img.style.transform=H(e)),n.append(o.slot)}r.push(n)}this.root.replaceChildren(...r)}getOrBuildSlot(e,t,n,r){let i=this.slots.get(t.id);if(i)return i;let a=this.buildSlot(e,t,n,r);return this.slots.set(t.id,a),a}buildSlot(e,t,n,r){let i=document.createElement(`div`);if(i.className=`comimi-page`,t.type===`html`){let n=document.createElement(`div`);return n.className=`comimi-html-page`,n.innerHTML=t.html,n.style.transform=H(e),i.append(n),{slot:i,img:null}}let a=document.createElement(`img`);a.alt=t.alt??t.label??`${n+1}`,a.draggable=!1,a.style.transform=H(e),a.addEventListener(`error`,()=>{i.replaceChildren(L(this.options.i18n,n+1))}),a.addEventListener(`contextmenu`,e=>e.preventDefault()),i.append(a);let o=`${e.manga.id}:${t.id}`,s=this.imageSources.get(o);if(s)return a.src=s,{slot:i,img:a};let c=B(this.options.i18n);i.append(c),a.style.visibility=`hidden`;let l=this.resolvePromises.get(o);if(!l){let i=this.options.resolvePageSrc;l=i?Promise.resolve(i({page:t,pageIndex:n,isSpread:r})):this.options.assetLoader.resolveImageSource(e.manga.id,t),this.resolvePromises.set(o,l),l.then(e=>{this.imageSources.set(o,e)}).finally(()=>{this.resolvePromises.delete(o)})}return l.then(e=>{a.addEventListener(`load`,()=>{a.style.visibility=``,c.remove()},{once:!0}),a.src=e}).catch(()=>{c.remove(),i.replaceChildren(L(this.options.i18n,n+1))}),{slot:i,img:a}}};function H(e){return`translate(${e.panX}px, ${e.panY}px) scale(${e.zoomScale})`}function U(e){let t=document.createElement(`div`);t.className=`comimi-notifications`;for(let n of e.notifications){let e=document.createElement(`div`);e.className=`comimi-toast`,e.dataset.tone=n.tone??`info`;let r=document.createElement(`span`);r.className=`comimi-toast-dot`;let i=document.createElement(`span`);i.className=`comimi-toast-text`,i.textContent=n.message,e.append(r,i),t.append(e)}return t}var W=`http://www.w3.org/2000/svg`;function G(e,t){let n=document.createElement(`div`);n.className=`comimi-splash`;let r=document.createElement(`div`);r.className=`comimi-splash-logo-wrap`,t&&r.classList.add(`comimi-splash-logo-wrap-custom`);let i=le(t);i&&r.append(i);let a=document.createElement(`div`);a.className=`comimi-splash-text`,a.append(document.createTextNode(e.t(`splash.loading`)));for(let e=0;e<3;e+=1){let e=document.createElement(`span`);e.textContent=`.`,a.append(e)}return r.append(a),n.append(r),n}function le(e){if(e===!1)return null;if(e){let t=document.createElement(`div`);if(t.className=`comimi-splash-custom-logo`,`render`in e)t.append(e.render());else{let n=document.createElement(`img`);n.src=e.src,n.alt=e.alt??``,n.draggable=!1,t.append(n)}return t}let t=document.createElement(`div`);return t.className=`comimi-splash-logo`,t.append(ue(),de()),t}function ue(){let e=document.createElementNS(W,`svg`);e.setAttribute(`viewBox`,`0 0 112.19 99.01`),e.setAttribute(`class`,`comimi-splash-symbol`),K(e,`M17.43,53.54c-7.74,7.51-12.43,17.29-12.43,27.99,0,4.34.78,8.53,2.21,12.48`),K(e,`M104.98,94.01c1.43-3.95,2.21-8.14,2.21-12.48,0-10.91-4.87-20.85-12.87-28.42`),K(e,`M55.79,43.81v-24.02c3.43-9.18,9.81-15.08,20.52-14.52,16.12.84,20.31,15.9,19.35,34.15-.25,4.75-.69,9.25-1.51,13.3`,`comimi-splash-mimi comimi-splash-mimi-left`),K(e,`M55.79,43.62v-24.02c-3.25-9.2-9.34-15.11-19.78-14.56-16.53.87-21.21,15.95-20.25,34.2.26,4.91.67,9.56,1.51,13.72`,`comimi-splash-mimi comimi-splash-mimi-right`);let t=document.createElementNS(W,`path`);t.setAttribute(`d`,`M80.44,49.41H31.46c-12.97,6.71-21.6,18.57-21.6,32.1,0,5.8,1.59,11.3,4.43,16.21h83.34c2.83-4.92,4.43-10.41,4.43-16.21,0-13.53-8.63-25.4-21.6-32.1Z`),t.setAttribute(`fill`,`#e0e0e0`),e.append(t);let n=document.createElementNS(W,`g`);n.setAttribute(`class`,`comimi-splash-eyes`);for(let e of[`40.17`,`71.58`]){let t=document.createElementNS(W,`circle`);t.setAttribute(`class`,`comimi-splash-eye`),t.setAttribute(`cx`,e),t.setAttribute(`cy`,`78.21`),t.setAttribute(`r`,`6`),t.setAttribute(`fill`,`#fff`),n.append(t)}return e.append(n),e}function de(){let e=document.createElement(`div`);e.className=`comimi-splash-typo-wrap`;let t=document.createElementNS(W,`svg`);t.setAttribute(`viewBox`,`0 0 227.74 38.52`),t.setAttribute(`class`,`comimi-splash-typo`);for(let e of[`M12.53,14.42c-3.15,3.27-3.15,8.45,0,11.6,1.58,1.58,3.6,2.36,5.74,2.36,2.25,0,4.28-.79,5.86-2.36,1.91-1.91,5.18-1.91,7.21,0,1.91,2.03,1.91,5.18,0,7.21-3.49,3.49-8.11,5.29-13.07,5.29s-9.46-1.8-12.95-5.29C-1.77,26.02-1.77,14.42,5.32,7.32,12.53.11,24.13.11,31.34,7.32c1.91,1.91,1.91,5.18,0,7.1-2.03,2.03-5.29,2.03-7.21,0-3.15-3.15-8.45-3.15-11.6,0Z`,`M76.15,20.27c0,10.02-8.22,18.25-18.36,18.25-4.96,0-9.57-1.8-12.95-5.29-3.49-3.49-5.41-8.11-5.41-12.95,0-10.14,8.22-18.36,18.36-18.36s18.36,8.22,18.36,18.36ZM66.01,20.27c0-4.5-3.72-8.22-8.22-8.22s-8.22,3.72-8.22,8.22c0,2.14.9,4.17,2.36,5.74,1.58,1.58,3.6,2.36,5.86,2.36,4.5,0,8.22-3.6,8.22-8.11Z`,`M131.42,15.88v17.57c0,2.82-2.25,5.07-5.07,5.07s-5.07-2.25-5.07-5.07V15.88c0-2.36-2.03-4.39-4.51-4.39-1.13,0-2.25.45-3.15,1.24-.79.9-1.24,2.03-1.24,3.15v14.57c0,2.82-2.25,5.07-5.07,5.07s-5.07-2.25-5.07-5.07v-14.57c0-2.36-2.03-4.39-4.5-4.39s-4.39,1.92-4.39,4.39v17.68c0,2.7-2.25,4.96-5.07,4.96s-5.07-2.25-5.07-5.07V15.88c0-8,6.53-14.53,14.53-14.53,3.72,0,6.98,1.35,9.57,3.49,2.59-2.25,5.97-3.49,9.46-3.49,8.11,0,14.64,6.53,14.64,14.53Z`,`M150.98,5.07v28.38c0,2.82-2.25,5.07-5.07,5.07s-5.07-2.25-5.07-5.07V5.07c0-2.7,2.25-5.07,5.07-5.07s5.07,2.36,5.07,5.07Z`,`M208.61,15.88v17.57c0,2.82-2.25,5.07-5.07,5.07s-5.07-2.25-5.07-5.07V15.88c0-2.36-2.03-4.39-4.51-4.39-1.13,0-2.25.45-3.15,1.24-.79.9-1.24,2.03-1.24,3.15v14.57c0,2.82-2.25,5.07-5.07,5.07s-5.07-2.25-5.07-5.07v-14.57c0-2.36-2.03-4.39-4.5-4.39s-4.39,1.92-4.39,4.39v17.68c0,2.7-2.25,4.96-5.07,4.96s-5.07-2.25-5.07-5.07V15.88c0-8,6.53-14.53,14.53-14.53,3.72,0,6.98,1.35,9.57,3.49,2.59-2.25,5.97-3.49,9.46-3.49,8.11,0,14.64,6.53,14.64,14.53Z`,`M227.74,5.07v28.38c0,2.82-2.25,5.07-5.07,5.07s-5.07-2.25-5.07-5.07V5.07c0-2.7,2.25-5.07,5.07-5.07s5.07,2.36,5.07,5.07Z`]){let n=document.createElementNS(W,`path`);n.setAttribute(`d`,e),n.setAttribute(`fill`,`#fff`),t.append(n)}e.append(t);let n=document.createElement(`div`);n.className=`comimi-splash-heart comimi-splash-heart-1`;let r=document.createElement(`div`);return r.className=`comimi-splash-heart comimi-splash-heart-2`,e.append(n,r),e}function K(e,t,n){let r=document.createElementNS(W,`path`);r.setAttribute(`d`,t),r.setAttribute(`class`,`comimi-splash-stroke ${n??``}`.trim()),e.append(r)}function fe({className:e}={}){let t=document.createElement(`div`);return t.className=e?`comimi-root ${e}`:`comimi-root`,t.tabIndex=0,t.setAttribute(`role`,`region`),t.setAttribute(`aria-label`,`Manga viewer`),t}var pe=`
 .comimi-arrows {
   position: absolute;
   inset: 0;
@@ -967,6 +967,11 @@ var MangaViewer=(function(e){Object.defineProperty(e,Symbol.toStringTag,{value:`
   cursor: not-allowed;
 }
 
+.comimi-selectbox-select option {
+  color: #333;
+  background-color: #fff;
+}
+
 .comimi-selectbox-label {
   position: relative;
   display: block;
@@ -1898,6 +1903,10 @@ var MangaViewer=(function(e){Object.defineProperty(e,Symbol.toStringTag,{value:`
   -webkit-touch-callout: none;
 }
 
+.comimi-page img {
+  pointer-events: none;
+}
+
 .comimi-page[data-spread="true"] img,
 .comimi-page[data-spread="true"] .comimi-html-page {
   width: 100%;
@@ -1966,6 +1975,7 @@ var MangaViewer=(function(e){Object.defineProperty(e,Symbol.toStringTag,{value:`
 `,we=`
 .comimi-scrollfade {
   position: relative;
+  overscroll-behavior: contain;
 }
 
 .comimi-scrollfade::before,
@@ -1984,12 +1994,12 @@ var MangaViewer=(function(e){Object.defineProperty(e,Symbol.toStringTag,{value:`
 
 .comimi-scrollfade::before {
   top: 0;
-  background: linear-gradient(to bottom, var(--comimi-bg), transparent);
+  background: linear-gradient(to bottom, #fff, transparent);
 }
 
 .comimi-scrollfade::after {
   bottom: 0;
-  background: linear-gradient(to top, var(--comimi-bg), transparent);
+  background: linear-gradient(to top, #fff, transparent);
 }
 
 .comimi-scrollfade[data-scroll-up="true"]::before {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yui540/comimi",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "description": "Open-source comic reader library for JS/TS",
   "keywords": [
     "manga",