export declare const controlsDockStyles = "\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: 4;\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/* hiddenSettings \u3067\u96A0\u3057\u305F\u30C4\u30FC\u30EB\u30D0\u30FC\u64CD\u4F5C\u3002\n   \u8981\u7D20\u306F DOM \u306B\u6B8B\u3057\u3066\u30B0\u30EA\u30C3\u30C9\u306E\u7BB1\u3092\u7DAD\u6301\u3057\u3001\u898B\u305F\u76EE\u3068\u64CD\u4F5C\u3060\u3051\u7121\u52B9\u5316\u3059\u308B\n   \uFF08\u4E38\u3054\u3068\u524A\u9664\u3059\u308B\u3068 space-between \u306E2\u30AB\u30E9\u30E0\u524D\u63D0\u304C\u5D29\u308C\u308B\u305F\u3081\uFF09\u3002 */\n.comimi-controls-dock [data-comimi-hidden=\"true\"] {\n  visibility: hidden;\n  pointer-events: none;\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.comimi-controls-dock[data-autoplay=\"true\"] .comimi-seek-bar {\n  pointer-events: none;\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: var(--comimi-fg);\n  font-size: 12px;\n  font-weight: 700;\n}\n\n.comimi-seek-total {\n  color: var(--comimi-soft);\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: var(--comimi-line);\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: var(--comimi-muted);\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: var(--comimi-muted);\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: var(--comimi-muted);\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: var(--comimi-panel);\n  border-radius: 6px;\n  overflow: hidden;\n  box-shadow: var(--comimi-shadow-pop);\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: var(--comimi-faint);\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: var(--comimi-fg);\n  background: var(--comimi-glass-soft);\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: var(--comimi-muted);\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: var(--comimi-line);\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: var(--comimi-muted);\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: var(--comimi-surface-2);\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: var(--comimi-muted);\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: var(--comimi-muted);\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/* --- Autoplay progress shown outside the dock (overlay closed) -------- */\n\n.comimi-autoplay-overlay-progress {\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  height: 5px;\n  z-index: 50;\n  pointer-events: none;\n  overflow: hidden;\n  background: var(--comimi-overlay-weak);\n  opacity: 0;\n  transition: opacity 0.16s linear;\n}\n\n.comimi-autoplay-overlay-progress[data-visible=\"true\"] {\n  opacity: 1;\n}\n\n.comimi-autoplay-overlay-progress-bar {\n  display: block;\n  position: absolute;\n  inset: 0;\n  background: var(--comimi-muted);\n  animation: comimi-autoplay-progress 3s linear 0s infinite;\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";
//# sourceMappingURL=controls-dock.styles.d.ts.map