/* 00-foundation.css */
:root {
  color-scheme: dark;
  font-family: Pretendard, Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: rgb(0, 0, 0);
  color: rgba(255, 255, 255, 0.86);
  --bg: #0f0f0f;
  --bg-soft: #181818;
  --panel: rgba(24, 24, 24, 0.66);
  --panel-strong: rgba(32, 32, 32, 0.78);
  --glass: rgba(255, 255, 255, 0.12);
  --line: rgba(255, 255, 255, 0.16);
  --line-soft: rgba(255, 255, 255, 0.12);
  --line-strong: rgba(255, 255, 255, 0.25);
  --text: rgba(255, 255, 255, 0.86);
  --muted: rgba(255, 255, 255, 0.64);
  --text-soft: rgba(255, 255, 255, 0.64);
  --accent: #34d399;
  --emerald: #34d399;
  --yellow: #f6ce69;
  --blue: #93c5fd;
  --pink: #ffd6ff;
  --rose: #fb7185;
  --ink: #0f0f0f;
  --shadow: 0 22px 44px rgba(0, 0, 0, 0.28);
  --sidebar-width: 300px;
  --sidebar-overlay-width: min(300px, calc(100vw - 28px));
  --sidebar-toggle-offset: 28px;
  --bunny-emboss-border: rgba(255, 255, 255, 0.24);
  --bunny-emboss-border-dark: rgba(0, 0, 0, 0.5);
  --bunny-emboss-border-shadow:
    inset 0 1px rgba(255, 255, 255, 0.28),
    inset 1px 0 rgba(255, 255, 255, 0.12),
    inset 0 -1px rgba(0, 0, 0, 0.48),
    inset -1px 0 rgba(0, 0, 0, 0.3);
  --bunny-emboss-window-shadow:
    rgba(0, 0, 0, 0.48) 0 22px 66px,
    inset 0 1px rgba(255, 255, 255, 0.16),
    inset 0 -1px rgba(0, 0, 0, 0.44);
  --bunny-dim-overlay: rgba(0, 0, 0, 0.8);
  --bunny-lightbox-dim-overlay: rgb(0, 0, 0);
}

html { min-height: 100%; overflow-x: clip; scrollbar-gutter: stable; background: rgb(0, 0, 0); }

html.media-modal-scroll-locked,
html.thumbnail-work-overlay-open { scrollbar-gutter: stable; }

body { margin: 0px; min-height: 100vh; overflow-x: hidden; background: rgb(0, 0, 0); color: var(--text); font-family: Pretendard, Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }

body::before { content: ""; position: fixed; inset: 0px; pointer-events: none; background: linear-gradient(120deg, rgba(255, 255, 255, 0.04), transparent 32%), linear-gradient(240deg, rgba(52, 211, 153, 0.08), transparent 42%), linear-gradient(0deg, rgba(251, 113, 133, 0.06), transparent 48%); opacity: 0.78; }

.liquid-glass-defs { position: fixed; width: 0; height: 0; overflow: hidden; pointer-events: none; }

.material-symbols-outlined { font-family: "Material Symbols Outlined"; font-weight: normal; font-style: normal; font-size: 22px; line-height: 1; letter-spacing: 0px; text-transform: none; display: inline-block; white-space: nowrap; direction: ltr; -webkit-font-smoothing: antialiased; -webkit-font-feature-settings: "liga"; font-feature-settings: "liga"; font-variation-settings: "FILL" 0, "wght" 330, "GRAD" 0, "opsz" 24; }

body:not([data-page="feed"]) .app-main { padding-top: 80px; }

@keyframes spin {
  100% { transform: rotate(360deg); }
}

.media-cache-source-row span .material-symbols-outlined { color: var(--accent); font-size: 17px; }

.collector-source-switches .material-symbols-outlined { font-size: 17px; }

.status-detail-head .material-symbols-outlined { color: var(--accent); }

.bot-guard-list .material-symbols-outlined { color: var(--yellow); font-size: 18px; }

.bot-guard-list.ok .material-symbols-outlined { color: var(--accent); }

@keyframes card-in {
  0% { opacity: 0; transform: translateY(22px); }
  100% { opacity: 1; transform: none; }
}

.card-author .material-symbols-outlined { flex: 0 0 auto; font-size: 17px; font-variation-settings: "FILL" 0, "wght" 280, "GRAD" 0, "opsz" 20; }


.unified-media-nav .material-symbols-outlined { font-size: 42px; font-variation-settings: "FILL" 0, "wght" 240, "GRAD" 0, "opsz" 48; }

@keyframes bunny-spin {
  100% { transform: rotate(360deg); }
}

@keyframes bunny-media-slide-next {
  0% { opacity: 0; transform: translateX(13%); }
  100% { opacity: 1; transform: translateX(0px); }
}

@keyframes bunny-media-slide-prev {
  0% { opacity: 0; transform: translateX(-13%); }
  100% { opacity: 1; transform: translateX(0px); }
}

.local-svg-icon { display: inline-grid; width: 1em; height: 1em; flex: 0 0 auto; place-items: center; line-height: 1; vertical-align: -0.14em; pointer-events: none; }

@property --database-spinner-angle { syntax: "<angle>"; inherits: false; initial-value: 0deg; }

@keyframes databaseSpinnerSpin {
  0% { --database-spinner-angle: 0deg; }
  100% { --database-spinner-angle: 360deg; }
}

@keyframes bunnyStableSpinner {
  100% { transform: rotate(360deg); }
}

@keyframes bunnyCenteredSpinner {
  0% { transform: translate(-50%, -50%) rotate(0deg); }
  100% { transform: translate(-50%, -50%) rotate(360deg); }
}

.namoo-section-title .material-symbols-outlined { color: rgb(141, 247, 174); font-size: 24px; line-height: 1; }

.namoo-primary-button .material-symbols-outlined, .namoo-secondary-button .material-symbols-outlined { font-size: 18px; }

@keyframes scrape-progress-wave {
  100% { transform: translateX(24%); }
}

@keyframes scrape-status-spin {
  100% { transform: rotate(360deg); }
}

@keyframes bunnySpinInPlace {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@keyframes bunnySpinCentered {
  0% { transform: translate(-50%, -50%) rotate(0deg); }
  100% { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes bunnyVideoPlaySpinner {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* 05-shared-controls.css */
* { box-sizing: border-box; }
[hidden] { display: none; }
button, a, input, textarea, select { font: inherit; letter-spacing: 0px; -webkit-tap-highlight-color: transparent; }
[role="button"] { -webkit-tap-highlight-color: transparent; }
.unified-media-modal[hidden],
.central-edit-modal[hidden],
.scrape-modal[hidden] { display: none; }

.page { width: 100%; }
.empty-state { grid-column: 1 / -1; min-height: 260px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 8px; background: rgba(255, 255, 255, 0.06); color: var(--muted); font-size: 15px; }

.liquid-glass-btn { position: relative; isolation: isolate; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.22); border-radius: 999px; background: rgba(255, 255, 255, 0.01); box-shadow: rgba(0, 0, 0, 0.1) 0px 8px 32px, rgba(255, 255, 255, 0.14) 0px 1px 0px inset, rgba(255, 255, 255, 0.03) 0px -1px 0px inset; backdrop-filter: blur(2px); }
.liquid-glass-btn::before { content: ""; position: absolute; inset: 1px; top: 0px; left: 0px; right: 0px; width: auto; height: 1px; border-radius: inherit; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.42), transparent); opacity: 0.74; pointer-events: none; z-index: -1; }
.liquid-glass-btn::after { content: ""; position: absolute; top: 0px; left: 0px; width: 1px; height: 100%; background: linear-gradient(rgba(255, 255, 255, 0.42), transparent, rgba(255, 255, 255, 0.15)); pointer-events: none; }
.liquid-glass-btn-cta { border-color: rgba(117, 226, 168, 0.28); background: linear-gradient(140deg, rgba(52, 211, 153, 0.2), rgba(52, 211, 153, 0.1)), rgba(255, 255, 255, 0.12); box-shadow: rgba(6, 95, 70, 0.2) 0px 10px 24px, rgba(255, 255, 255, 0.45) 0px 1px 0px inset, rgba(16, 185, 129, 0.16) 0px -1px 0px inset, rgba(52, 211, 153, 0.14) 0px 0px 0px 1px inset; }

.unified-media-modal:not(.lightbox-mode) .modal-close,
.unified-media-modal:not(.lightbox-mode) .unified-media-head .modal-close,
#central-edit-modal .modal-close,
.unified-media-modal.thumbnail-editor-modal:not(.lightbox-mode) .modal-close,
.thumbnail-work-close {
  overflow: hidden;
  isolation: isolate;
  border: 1px solid rgba(255, 255, 255, 0.22);
  background: rgba(255, 255, 255, 0.14);
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.4),
    inset 0 -1px 0 rgba(255, 255, 255, 0.06),
    inset 0 0 2px 1px rgba(255, 255, 255, 0.1);
  clip-path: inset(0 round 999px);
  contain: paint;
  backdrop-filter: blur(14px) saturate(1.2);
  -webkit-backdrop-filter: blur(14px) saturate(1.2);
}

#unified-media-modal:not(.lightbox-mode):not(.youtube-player-mode) #unified-media-close {
  backdrop-filter: blur(14px) saturate(1.2);
  -webkit-backdrop-filter: blur(14px) saturate(1.2);
}

.status-pill { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 54px; min-height: 22px; padding: 0px 9px; border-radius: 999px; color: rgba(16, 185, 129, 0.96); background: rgba(52, 211, 153, 0.12); font-size: 11px; font-weight: 700; line-height: 1; white-space: nowrap; }
.status-pill.muted { color: rgba(255, 255, 255, 0.58); background: rgba(255, 255, 255, 0.09); }
.status-pill.ok { color: rgba(188, 255, 220, 0.96); background: rgba(34, 197, 94, 0.18); }
.status-pill.error { color: rgba(255, 190, 190, 0.96); background: rgba(239, 68, 68, 0.18); }
.status-pill::before { content: ""; width: 7px; height: 7px; flex: 0 0 7px; border-radius: 999px; background: currentcolor; box-shadow: currentcolor 0px 0px 9px; }

.loading-svg-icon,
.download-spinner {
  box-sizing: border-box;
  display: block;
  width: 24px;
  min-width: 24px;
  max-width: 24px;
  height: 24px;
  min-height: 24px;
  max-height: 24px;
  border: 3px solid rgba(255, 255, 255, 0.28);
  border-top-color: rgb(255, 255, 255);
  border-radius: 50%;
  color: transparent;
  font-size: 0;
  line-height: 0;
  text-indent: -9999px;
  transform: none;
  transform-origin: 50% 50%;
  animation: 720ms linear infinite bunnySpinInPlace;
}

.icon-button { position: relative; display: grid; place-items: center; width: 36px; height: 36px; border: 0px; border-radius: 50%; color: rgb(255, 255, 255); background: transparent; cursor: pointer; text-decoration: none; text-shadow: rgba(0, 0, 0, 0.66) 0px 2px 12px; }
.icon-button:hover { color: var(--accent); }
.icon-button.downloading,
.media-download-icon-button.downloading { pointer-events: none; }
.icon-button > .card-action-icon,
.media-download-icon-button > .card-action-icon {
  grid-area: 1 / 1;
}
.icon-button > .download-spinner,
.media-download-icon-button > .download-spinner {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: 0;
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, -50%);
  animation: 720ms linear infinite bunnySpinCentered;
}
.icon-button.downloading > .card-action-icon,
.media-download-icon-button.downloading > .card-action-icon {
  opacity: 0;
  visibility: hidden;
}
.icon-button.downloading > .download-spinner,
.media-download-icon-button.downloading > .download-spinner {
  opacity: 1;
  visibility: visible;
}
.media-download-icon-button {
  position: relative;
  display: grid;
  place-items: center;
}
.icon-button[data-tooltip]::after { content: attr(data-tooltip); position: absolute; z-index: 20; right: calc(100% + 8px); top: 50%; width: max-content; max-width: 180px; padding: 6px 9px; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 999px; color: var(--text); background: rgba(13, 18, 17, 0.9); box-shadow: rgba(0, 0, 0, 0.42) 0px 18px 42px, rgba(255, 255, 255, 0.1) 0px 1px inset; font-size: 12px; font-weight: 430; line-height: 1.2; opacity: 0; pointer-events: none; text-shadow: none; transform: translate(4px, -50%); transition: opacity 140ms, transform 140ms; white-space: nowrap; backdrop-filter: blur(14px) saturate(1.2); }
.icon-button[data-tooltip]:hover::after, .icon-button[data-tooltip]:focus-visible::after { opacity: 1; transform: translate(0px, -50%); }
.icon-button:disabled { cursor: default; }

/* 10-shell-layout.css */
.app-shell {
  min-height: 100vh;
}

.app-main {
  position: relative;
  z-index: 1;
  min-height: 100vh;
  margin-left: var(--sidebar-width);
  padding: 148px 160px 80px;
  overflow-x: clip;
  background: rgb(0, 0, 0);
}

body.public-shell .app-sidebar {
  display: none;
}

body.public-shell .app-main {
  margin-left: 0;
}

body:not(.public-shell) {
  --sidebar-width: 0px;
}

body:not(.public-shell) .app-main,
body.sidebar-collapsed:not(.public-shell) .app-main {
  width: 100%;
  margin-left: 0;
  transition: none;
}

.app-sidebar {
  position: fixed;
  z-index: 90;
  left: 0;
  top: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: var(--sidebar-width);
  overflow-y: auto;
  padding: 24px;
  border-right: 1px solid transparent;
  color: rgb(238, 242, 247);
  background: linear-gradient(145deg, rgba(24, 24, 24, 0.62), rgba(38, 38, 38, 0.78));
  box-shadow:
    rgba(255, 255, 255, 0.08) 0 0 0 1px inset,
    rgba(0, 0, 0, 0.32) 0 0 34px inset,
    rgba(0, 0, 0, 0.35) 0 20px 40px;
  backdrop-filter: blur(16px) saturate(130%);
}

.app-sidebar::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.03)),
    radial-gradient(circle at 12% 8%, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0));
  opacity: 0.18;
  mix-blend-mode: screen;
}

.app-sidebar > * {
  position: relative;
  z-index: 1;
}

body:not(.public-shell) .app-sidebar,
body.sidebar-collapsed:not(.public-shell) .app-sidebar {
  width: var(--sidebar-overlay-width);
  min-width: var(--sidebar-overlay-width);
  max-width: var(--sidebar-overlay-width);
  transform-origin: left center;
  transition: transform 170ms cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform;
  contain: layout style paint;
}

body:not(.public-shell) .app-sidebar {
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(0, 0, 0);
  box-shadow:
    rgba(0, 0, 0, 0.42) 24px 0 64px,
    rgba(255, 255, 255, 0.1) -1px 0 inset;
}

body.sidebar-collapsed:not(.public-shell) .app-sidebar {
  opacity: 1;
  pointer-events: none;
  overflow: hidden;
  transform: translate3d(calc(-1 * var(--sidebar-overlay-width) - 28px), 0, 0);
}

body[data-page="feed"] .app-shell {
  position: relative;
  z-index: 1;
}

/* 11-sidebar-brand-nav.css */
.brand-block {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  padding: 4px 8px 24px 17px;
}

.brand-mark {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border: 0;
  border-radius: 0;
  color: rgb(255, 255, 255);
  background: transparent;
  box-shadow: none;
  font-size: 22px;
  font-weight: 800;
}

.brand-mark .local-svg-icon {
  width: 30px;
  height: 30px;
}

.brand-mark .material-symbols-outlined {
  color: rgb(255, 255, 255);
  font-size: 30px;
  font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24;
}

.brand-block strong,
.brand-block small {
  display: block;
}

.brand-block strong {
  color: rgb(255, 255, 255);
  font-size: 20px;
  font-weight: 800;
  line-height: 1.1;
}

.brand-block small {
  margin-top: 3px;
  color: var(--emerald);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.side-nav {
  display: grid;
  gap: 8px;
  margin-bottom: auto;
  padding-right: 4px;
}

.side-nav a {
  display: flex;
  min-height: 48px;
  align-items: center;
  gap: 12px;
  padding: 0 16px 0 21px;
  border: 0;
  border-radius: 12px;
  color: rgb(156, 163, 175);
  background: transparent;
  font-size: 15px;
  font-weight: 400;
  text-decoration: none;
  transition: color 180ms, background 180ms, box-shadow 180ms, transform 180ms;
}

.side-nav a:hover {
  color: rgb(255, 255, 255);
  background: rgba(255, 255, 255, 0.05);
}

.side-nav a:active {
  transform: scale(0.98);
}

.side-nav a.active {
  color: rgb(255, 255, 255);
  border-color: var(--line);
  background: rgba(64, 64, 64, 0.5);
  box-shadow: rgba(0, 0, 0, 0.22) 0 8px 18px;
  font-weight: 500;
}

.side-nav .material-symbols-outlined {
  color: currentcolor;
  font-size: 23px;
  font-variation-settings: "FILL" 0, "wght" 350, "GRAD" 0, "opsz" 24;
}

.side-nav .local-svg-icon {
  width: 23px;
  height: 23px;
  opacity: 0.86;
}

/* 12-sidebar-cards-actions.css */
.sidebar-card {
  display: grid;
  gap: 12px;
  margin-bottom: 0;
  padding: 12px;
  border: 0;
  border-radius: 12px;
  background-color: rgba(64, 64, 64, 0.5);
  box-shadow: rgba(0, 0, 0, 0.35) 0 12px 24px;
}

.sidebar-card-title,
.sidebar-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.sidebar-card-title {
  justify-content: flex-start;
  margin-bottom: 0;
  color: rgb(255, 255, 255);
  font-size: 14px;
  font-weight: 700;
}

.sidebar-card-title .material-symbols-outlined {
  color: var(--emerald);
  font-size: 17px;
}

.sidebar-card-title .local-svg-icon {
  width: 17px;
  height: 17px;
  opacity: 0.94;
}

.sidebar-row {
  color: rgba(255, 255, 255, 0.58);
  font-size: 12px;
}

.sidebar-row b {
  color: rgba(255, 255, 255, 0.82);
  font-size: 12px;
  font-weight: 700;
}

.sidebar-row b.ok {
  color: var(--accent);
}

.sidebar-action {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin-top: 2px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.88);
  background: rgba(255, 255, 255, 0.14);
  box-shadow:
    rgba(255, 255, 255, 0.32) 0 1px inset,
    rgba(0, 0, 0, 0.14) 0 8px 22px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 700;
  backdrop-filter: blur(13px) saturate(1.25);
}

.sidebar-action:hover {
  background: rgba(255, 255, 255, 0.18);
}

.sidebar-action:disabled {
  cursor: default;
  opacity: 0.46;
}

.backfill-actions .sidebar-action {
  min-width: 138px;
  margin: 0;
  padding: 0 15px;
}

.backfill-actions .sidebar-action .material-symbols-outlined {
  font-size: 19px;
}

.backfill-actions .sidebar-action:disabled .material-symbols-outlined {
  animation: none;
}

.backfill-actions .sidebar-action:not(:disabled) .material-symbols-outlined:first-child,
.source-backfill-card .sidebar-action:not(:disabled) .material-symbols-outlined {
  color: var(--accent);
}

.collector-control-row .sidebar-action,
.collector-config-grid .sidebar-action {
  min-width: 144px;
  margin: 0;
}

.media-cache-preset-row .sidebar-action {
  min-width: 132px;
  margin: 0;
}

.source-backfill-card .sidebar-action .material-symbols-outlined {
  pointer-events: none;
  color: currentcolor;
}

.source-backfill-card .sidebar-action.busy .material-symbols-outlined {
  animation: 820ms linear infinite spin;
}

/* 13-sidebar-monitoring.css */
.sidebar-monitor-card {
  display: grid;
}

.sidebar-monitor-list {
  display: grid;
  gap: 8px;
}

.sidebar-monitor-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
}

.sidebar-monitor-row > span {
  min-width: 0;
  overflow: hidden;
  color: rgba(255, 255, 255, 0.7);
  font-size: 11px;
  font-weight: 620;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sidebar-monitor-row > span.ok {
  color: rgba(255, 255, 255, 0.7);
}

.sidebar-monitor-row b {
  min-width: 0;
  overflow: hidden;
  color: rgba(255, 255, 255, 0.78);
  font-size: 11px;
  line-height: 1.35;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sidebar-monitor-row b.ok {
  color: rgba(220, 255, 236, 0.94);
}

.sidebar-monitor-row > .status-pill {
  min-width: 54px;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
}

.sidebar-monitor-row .sidebar-monitor-icon {
  display: inline-flex;
  width: 18px;
  height: 18px;
  align-items: center;
  justify-content: center;
}

.sidebar-monitor-row .sidebar-monitor-icon .local-svg-icon {
  width: 16px;
  height: 16px;
  opacity: 0.88;
}

.sidebar-monitor-footer {
  justify-content: flex-end;
  padding-top: 2px;
}

.sidebar-meter {
  display: grid;
  gap: 7px;
}

.sidebar-meter-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: rgba(255, 255, 255, 0.62);
  font-size: 11px;
}

.sidebar-meter-head span {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sidebar-meter-head b {
  flex: 0 0 auto;
  color: rgba(255, 255, 255, 0.82);
  font-size: 11px;
  font-weight: 700;
}

.sidebar-meter-head .material-symbols-outlined {
  color: var(--emerald);
  font-size: 14px;
}

.sidebar-meter-head .local-svg-icon {
  width: 14px;
  height: 14px;
  opacity: 0.92;
}

.sidebar-meter-track {
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.11);
  box-shadow: rgba(0, 0, 0, 0.28) 0 1px 2px inset;
}

.sidebar-meter-track i {
  display: block;
  width: 0%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(52, 211, 153, 0.58), rgba(110, 231, 183, 0.94));
  transition: width 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

.sidebar-meter-track.api i {
  background: linear-gradient(90deg, rgba(16, 185, 129, 0.48), rgba(52, 211, 153, 0.92));
}

/* 14-sidebar-toggle-responsive.css */
.sidebar-collapse-toggle,
.sidebar-floating-toggle {
  z-index: 110;
  display: inline-grid;
  width: 42px;
  height: 42px;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.9);
  background: transparent;
  box-shadow: none;
  cursor: pointer;
  transition: transform 160ms cubic-bezier(0.22, 1, 0.36, 1);
}

.sidebar-collapse-toggle {
  position: absolute;
  top: 26px;
  right: 20px;
}

.sidebar-floating-toggle {
  position: fixed;
  top: max(26px, env(safe-area-inset-top));
  bottom: auto;
  left: max(18px, env(safe-area-inset-left));
}

.sidebar-collapse-toggle:hover {
  transform: scale(1.06);
}

.sidebar-floating-toggle:hover,
body.sidebar-collapsed:not(.public-shell) .sidebar-floating-toggle:hover {
  transform: scale(1.08);
}

.sidebar-collapse-toggle .sidebar-toggle-icon,
.sidebar-floating-toggle .sidebar-toggle-icon {
  width: 20px;
  height: 20px;
  opacity: 0.94;
}

.sidebar-collapse-toggle .material-symbols-outlined,
.sidebar-floating-toggle .material-symbols-outlined {
  display: none;
}

body:not(.public-shell) .sidebar-collapse-toggle {
  display: none;
}

@media (min-width: 768px) {
  body:not(.public-shell) .sidebar-floating-toggle {
    display: none;
  }
}

@media (max-width: 767px) {
  :root {
    --sidebar-width: min(300px, 86vw);
  }

  body:not(.public-shell) {
    --sidebar-overlay-width: min(300px, calc(100vw - 18px));
    --sidebar-toggle-offset: 14px;
  }

  body:not(.public-shell) .app-sidebar,
  body.sidebar-collapsed:not(.public-shell) .app-sidebar {
    padding: 22px 20px;
  }

  .app-sidebar {
    z-index: 104;
  }

  .sidebar-collapse-toggle,
  .sidebar-floating-toggle {
    z-index: 120;
  }

  .sidebar-collapse-toggle {
    top: max(18px, env(safe-area-inset-top));
    right: 18px;
  }

  .sidebar-floating-toggle {
    top: max(18px, env(safe-area-inset-top));
    left: max(14px, env(safe-area-inset-left));
  }

  .app-main {
    margin-left: 0;
    padding: 136px 16px 64px;
  }
}

/* 15-admin-required-modal.css */
.admin-required-modal {
  position: fixed;
  inset: 0;
  z-index: 260;
  display: grid;
  place-items: center;
  padding: 18px;
  opacity: 0;
  pointer-events: none;
  background: rgba(0, 0, 0, 0);
  transition: opacity 220ms, background-color 220ms;
}

.admin-required-modal.active {
  opacity: 1;
  pointer-events: auto;
  background: var(--bunny-dim-overlay);
}

.admin-required-modal.closing {
  opacity: 0;
  pointer-events: none;
  background: rgba(0, 0, 0, 0);
}

.admin-required-panel {
  width: min(430px, calc(100vw - 36px));
  padding: 22px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 22px;
  color: rgba(255, 255, 255, 0.94);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.04)),
    rgba(18, 18, 18, 0.94);
  box-shadow:
    rgba(255, 255, 255, 0.2) 0 1px inset,
    rgba(0, 0, 0, 0.54) 0 30px 84px;
  transform: translate3d(0, 14px, 0) scale(0.96);
  transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.admin-required-modal.active .admin-required-panel {
  transform: translate3d(0, 0, 0) scale(1);
}

.admin-required-panel strong {
  display: block;
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 650;
}

.admin-required-panel p {
  margin: 0 0 18px;
  color: rgba(255, 255, 255, 0.7);
  font-size: 14px;
  line-height: 1.55;
}

/* 15-public-main.css */
body[data-page="feed"] {
  --active-feed-bg: var(--feed-bg, none);
}

body[data-page="feed"]::before,
body[data-page="feed"]::after {
  content: "";
  position: fixed;
  z-index: 0;
  pointer-events: none;
  background-position: center center;
  background-repeat: no-repeat;
}

body[data-page="feed"]::before {
  inset: -12%;
  transform: scale(1.08);
  background-color: rgb(6, 6, 6);
  background-image:
    var(--active-feed-bg, none),
    radial-gradient(circle at 50% 30%, rgba(255, 255, 255, 0.16), transparent 54%),
    linear-gradient(145deg, rgba(255, 214, 255, 0.18), rgba(224, 255, 139, 0.10) 46%, rgba(60, 160, 255, 0.14));
  background-size: cover, cover, cover;
  filter: blur(18px) saturate(0.82) contrast(0.95) brightness(calc(1.14 * var(--feed-bg-brightness-factor, 1)));
  opacity: 1;
}

body[data-page="feed"]::after {
  inset: -36px 0px 0px;
  background-color: rgba(0, 0, 0, 0.8);
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.24) 0%, rgba(0, 0, 0, 0.07) 30%, rgba(0, 0, 0, 0.12) 66%, rgba(0, 0, 0, 0.34) 100%),
    radial-gradient(at 50% 22%, rgba(255, 255, 255, 0.13), transparent 48%);
  opacity: 1;
}

body[data-page="feed"] .app-main,
body.public-shell[data-page="feed"] .app-main {
  --feed-heading-top-gap: 40px;
  --feed-heading-content-gap: 16px;
  padding-top: var(--feed-heading-top-gap);
  padding-right: 60px;
  padding-left: 60px;
  background: transparent;
}

body[data-page="feed"] .page-feed {
  padding-top: 24px;
  padding-bottom: 124px;
}

body[data-page="feed"] .feed-grid[hidden],
body[data-page="feed"] .calendar-view[hidden],
body[data-page="feed"] .gallery-view[hidden],
body[data-page="feed"] .evidence-package-view[hidden] {
  display: none;
}

@media (min-width: 768px) {
  body[data-page="feed"][data-feed-view="calendar"],
  body[data-page="feed"][data-feed-view="calendar"] .app-main,
  body[data-page="feed"][data-feed-view="calendar"] #page-feed {
    overflow: hidden;
  }
}

body[data-page="feed"][data-feed-view="gallery"] #page-feed,
body[data-page="feed"][data-feed-view="calendar"] #page-feed {
  overflow: visible;
}

@media (min-width: 768px) and (max-width: 1279px) {
  body[data-page="feed"] .app-main,
  body.public-shell[data-page="feed"] .app-main {
    padding-right: 24px;
    padding-left: 24px;
  }
}

@media (max-width: 767px) {
  body[data-page="feed"] {
    --mobile-feed-edge: 16px;
    --mobile-feed-row-gap: 16px;
    --mobile-feed-gap: var(--mobile-feed-edge);
  }

  body[data-page="feed"] .app-main,
  body.public-shell[data-page="feed"] .app-main {
    --feed-heading-top-gap: 36px;
    box-sizing: border-box;
    width: 100vw;
    padding: var(--feed-heading-top-gap) var(--mobile-feed-edge) 64px;
    overflow-x: hidden;
  }

  body[data-page="feed"] #page-feed {
    position: relative;
    overflow-x: hidden;
  }

  body[data-page="feed"] .page-feed,
  body[data-page="feed"] .feed-grid {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    margin-right: 0;
    margin-left: 0;
    overflow: visible;
  }

  body[data-page="feed"] .page-feed {
    display: block;
    padding-top: 24px;
    padding-bottom: 118px;
  }

}

body[data-page="feed"] :is(#page-feed, .feed-grid, .calendar-view, .gallery-view, .evidence-package-view) {
  touch-action: pan-y;
}

body[data-page="feed"] .feed-view-enter-left {
  animation: 40ms cubic-bezier(0.16, 1, 0.3, 1) 0s 1 normal both running feedViewEnterLeft;
  will-change: transform;
}

body[data-page="feed"] .feed-view-enter-right {
  animation: 40ms cubic-bezier(0.16, 1, 0.3, 1) 0s 1 normal both running feedViewEnterRight;
  will-change: transform;
}

body[data-page="feed"] .feed-view-swap-in {
  will-change: opacity, transform, filter;
}

body[data-page="feed"] .feed-view-swap-in-from-left {
  animation: 56ms cubic-bezier(0.2, 0.82, 0.18, 1) 0s 1 normal both running feedViewSwapInFromLeft;
}

body[data-page="feed"] .feed-view-swap-in-from-right {
  animation: 56ms cubic-bezier(0.2, 0.82, 0.18, 1) 0s 1 normal both running feedViewSwapInFromRight;
}

body[data-page="feed"] .feed-view-swap-ghost {
  position: absolute;
  z-index: 45;
  overflow: hidden;
  pointer-events: none;
  opacity: 1;
  transform: translate3d(0px, 0px, 0px);
  will-change: opacity, transform, filter;
}

body[data-page="feed"] .feed-view-swap-ghost.active.feed-view-swap-out-to-left {
  animation: 56ms cubic-bezier(0.2, 0.82, 0.18, 1) 0s 1 normal both running feedViewSwapOutToLeft;
}

body[data-page="feed"] .feed-view-swap-ghost.active.feed-view-swap-out-to-right {
  animation: 56ms cubic-bezier(0.2, 0.82, 0.18, 1) 0s 1 normal both running feedViewSwapOutToRight;
}

@keyframes feedViewEnterLeft {
  0% { transform: translate3d(-100vw, 0px, 0px); }
  100% { transform: translate3d(0px, 0px, 0px); }
}

@keyframes feedViewEnterRight {
  0% { transform: translate3d(100vw, 0px, 0px); }
  100% { transform: translate3d(0px, 0px, 0px); }
}

@keyframes feedViewSwapInFromLeft {
  0% { opacity: 0.15; filter: brightness(0.88); transform: translate3d(-18vw, 0px, 0px); }
  100% { opacity: 1; filter: brightness(1); transform: translate3d(0px, 0px, 0px); }
}

@keyframes feedViewSwapInFromRight {
  0% { opacity: 0.15; filter: brightness(0.88); transform: translate3d(18vw, 0px, 0px); }
  100% { opacity: 1; filter: brightness(1); transform: translate3d(0px, 0px, 0px); }
}

@keyframes feedViewSwapOutToLeft {
  0% { opacity: 1; filter: brightness(1); transform: translate3d(0px, 0px, 0px); }
  100% { opacity: 0; filter: brightness(0.72); transform: translate3d(-22vw, 0px, 0px); }
}

@keyframes feedViewSwapOutToRight {
  0% { opacity: 1; filter: brightness(1); transform: translate3d(0px, 0px, 0px); }
  100% { opacity: 0; filter: brightness(0.72); transform: translate3d(22vw, 0px, 0px); }
}

/* 16-evidence-package.css */
body[data-page="feed"][data-feed-view="evidence"] #page-feed {
  min-height: calc(100dvh - 180px);
}

.evidence-package-view {
  position: relative;
  z-index: 1;
  display: flex;
  width: 100%;
  min-height: calc(100dvh - 220px);
  align-items: center;
  justify-content: center;
  color: #eee;
}

.evidence-package-shell {
  box-sizing: border-box;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: min(800px, 100%);
  padding: 26px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 18px;
  background: rgba(12, 12, 12, 0.46);
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.4),
    inset 0 -1px 0 rgba(255, 255, 255, 0.06),
    inset 0 0 2px 1px rgba(255, 255, 255, 0.1),
    0 24px 80px rgba(0, 0, 0, 0.34);
  backdrop-filter: blur(24px) saturate(1.18);
  -webkit-backdrop-filter: blur(24px) saturate(1.18);
  color: #ddd;
  font-size: 16px;
  font-weight: 500;
}

.evidence-package-header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 0 0 34px;
  text-align: center;
}

.evidence-package-header > .material-symbols-outlined {
  font-size: 30px;
  font-variation-settings: "wght" 300;
  color: #ddd;
}

.evidence-package-header p {
  margin: 0;
  color: #ddd;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.45;
  white-space: nowrap;
}

.evidence-package-form {
  display: grid;
  gap: 14px;
}

.evidence-package-form label {
  padding-left: 8px;
  color: #ddd;
  font-size: 16px;
  font-weight: 500;
}

.evidence-package-url-field {
  position: relative;
  width: 100%;
}

.evidence-package-form textarea {
  box-sizing: border-box;
  --evidence-textarea-height: 200px;
  width: 100%;
  height: var(--evidence-textarea-height);
  min-height: var(--evidence-textarea-height);
  padding: 16px;
  resize: vertical;
  overflow-y: auto;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 14px;
  outline: 0;
  color: #eee;
  background: rgba(255, 255, 255, 0.08);
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.4),
    inset 0 -1px 0 rgba(255, 255, 255, 0.06),
    inset 0 0 2px 1px rgba(255, 255, 255, 0.1);
  font-family: Pretendard, system-ui, sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.45;
}

.evidence-package-form textarea::placeholder {
  color: transparent;
}

.evidence-package-form textarea:placeholder-shown {
  overflow-y: hidden;
}

.evidence-package-form textarea:focus {
  border-color: rgba(155, 220, 255, 0.72);
}

.evidence-package-placeholder {
  position: absolute;
  inset: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  color: rgba(255, 255, 255, 0.48);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.45;
  text-align: center;
  white-space: pre-line;
  pointer-events: none;
}

.evidence-package-form textarea:not(:placeholder-shown) + .evidence-package-placeholder,
.evidence-package-form textarea:focus + .evidence-package-placeholder {
  display: none;
}

.evidence-package-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 4px;
}

.evidence-package-action-buttons {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.evidence-package-action-buttons button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 42px;
  padding: 0 18px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  color: #ddd;
  background: rgba(255, 255, 255, 0.14);
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.4),
    inset 0 -1px 0 rgba(255, 255, 255, 0.06),
    inset 0 0 2px 1px rgba(255, 255, 255, 0.1);
  font-family: Pretendard, system-ui, sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  backface-visibility: hidden;
  transform: translateZ(0);
  transform-origin: center;
  transition: transform 160ms ease, background 160ms ease;
  will-change: transform;
}

.evidence-package-action-buttons button[hidden] {
  display: none;
}

.evidence-package-action-buttons button:hover {
  background: rgba(255, 255, 255, 0.14);
  transform: translateZ(0) scale(1.04);
}

.evidence-package-action-buttons button.is-loading {
  color: transparent;
  pointer-events: none;
}

.evidence-package-action-buttons button.is-loading::after {
  content: "";
  position: absolute;
  inset: 50% auto auto 50%;
  box-sizing: border-box;
  width: 20px;
  height: 20px;
  margin: -10px 0 0 -10px;
  border: 2px solid rgba(255, 255, 255, 0.26);
  border-top-color: #eee;
  border-radius: 50%;
  animation: spin 720ms linear infinite;
}

.evidence-package-status {
  flex: 0 1 auto;
  min-width: 0;
  min-height: 0;
  margin: 0;
  color: #ddd;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.4;
  text-align: left;
  align-self: center;
}

.evidence-package-status[data-tone="warning"] {
  color: #ff9200;
}

.evidence-package-status[data-tone="ok"] {
  color: #34d399;
}

.evidence-package-status[data-tone="alert"] {
  color: #e35656;
}

.evidence-package-result {
  margin: 4px 0 0;
  padding: 18px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  color: #ddd;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.55;
}

.evidence-package-result h3 {
  margin: 0 0 10px;
  color: #ddd;
  font-size: 20px;
  font-weight: 600;
}

.evidence-package-result[data-decision="approved"] h3 {
  color: #e35656;
}

.evidence-package-result[data-decision="rejected"] h3 {
  color: #ff9200;
}

.evidence-package-result p {
  margin: 0 0 10px;
  color: #ddd;
}

.evidence-package-result ol {
  margin: 0;
  padding-left: 22px;
}

.evidence-package-result ul {
  margin: 0 0 10px;
  padding-left: 22px;
}

.evidence-package-result li {
  overflow-wrap: anywhere;
}

@media (max-width: 767px) {
  .evidence-package-view {
    min-height: calc(100dvh - 184px);
    align-items: flex-start;
  }

  .evidence-package-shell {
    width: 100%;
    padding: 22px 18px;
    border-radius: 18px;
  }

  .evidence-package-header {
    justify-content: flex-start;
    gap: 10px;
    text-align: left;
  }

  .evidence-package-header p {
    text-align: left;
    white-space: normal;
  }

  .evidence-package-form textarea {
    --evidence-textarea-height: 200px;
  }

  .evidence-package-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .evidence-package-action-buttons {
    order: 1;
    width: 100%;
  }

  .evidence-package-action-buttons button {
    flex: 1 1 0;
    min-width: 0;
  }

  .evidence-package-status {
    order: 2;
    flex: 0 0 auto;
    align-self: stretch;
    min-width: 0;
    margin: 0;
    font-size: 16px;
    text-align: center;
  }

  .evidence-package-result h3 {
    text-align: center;
  }

  .evidence-package-result {
    font-size: 16px;
  }
}

/* 20-feed-card-layout.css */
.feed-grid {
  position: relative;
  display: block;
  width: 100%;
  max-width: none;
  margin: 0 auto;
  gap: var(--feed-card-gap, 16px);
}

.feed-grid.feed-critical-pending::before {
  content: "";
  position: fixed;
  z-index: 120;
  top: 50dvh;
  left: 50vw;
  display: block;
  width: 42px;
  height: 42px;
  box-sizing: border-box;
  border: 4px solid rgba(255, 255, 255, 0.28);
  border-top-color: rgba(255, 255, 255, 0.98);
  border-radius: 50%;
  pointer-events: none;
  animation: 620ms linear infinite bunnySpinCentered;
}

.feed-search-empty-state {
  position: fixed;
  inset: 0;
  z-index: 2;
  display: grid;
  place-items: center;
  color: #bbb;
  font-size: 24px;
  font-weight: 500;
  line-height: 24px;
  pointer-events: none;
}

.feed-grid.masonry-preparing .feed-card {
  visibility: visible;
  opacity: 0;
  pointer-events: none;
  transform: translate3d(0, 18px, 0);
  will-change: opacity, transform;
}

.feed-grid.masonry-ready .feed-card,
.feed-grid.masonry-ready .feed-load-more {
  position: absolute;
  top: 0;
  left: 0;
  margin: 0;
  visibility: visible;
  transition:
    opacity 360ms cubic-bezier(0.22, 1, 0.36, 1) var(--card-delay, 0ms),
    transform 360ms cubic-bezier(0.22, 1, 0.36, 1) var(--card-delay, 0ms),
    filter 140ms,
    box-shadow 140ms;
}

.feed-card {
  position: relative;
  width: 360px;
  height: 360px;
  overflow: hidden;
  border: 0;
  border-radius: 20px;
  color: rgb(238, 248, 242);
  background: rgb(20, 20, 20);
  box-shadow: none;
  opacity: 0;
  visibility: hidden;
  transform: translate3d(0, 18px, 0);
  will-change: opacity, transform;
}

.feed-card.scrape-scroll-target {
  outline: 2px solid rgba(255, 185, 92, 0.72);
  outline-offset: 6px;
  transition: outline-color 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.feed-card,
.feed-card a {
  font-size: 13px;
  letter-spacing: 0;
}

.feed-card.source-binstagram {
  height: 450px;
}

.feed-card.source-magazine {
  height: 450px;
}

.feed-card.source-drama_still {
  height: 360px;
}

.feed-card.source-binxrchive {
  height: 360px;
}

.feed-card.source-youtube {
  height: 270px;
  aspect-ratio: auto;
}

.feed-card.source-youtube.item-shorts {
  height: 450px;
  aspect-ratio: auto;
}

.feed-card.has-detail {
  cursor: pointer;
}

.feed-card.has-detail:focus-visible {
  outline: rgba(117, 226, 168, 0.76) solid 1px;
  outline-offset: 4px;
}

.feed-card.is-nonpublic {
  outline: 0;
  outline-offset: 0;
}

.feed-card.is-nonpublic::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
  background:
    linear-gradient(rgba(40, 0, 0, 0.34), rgba(10, 0, 0, 0.5)),
    rgba(227, 86, 86, 0.16);
}

.feed-card[data-card-state="planned"],
.feed-card[data-card-state="dom-ready"],
.feed-card[data-card-state="media-requested"],
.feed-card[data-card-state="reveal-ready"],
.feed-card.is-media-pending:not([data-card-state="revealing"]):not([data-card-state="revealed"]) {
  visibility: visible;
  opacity: 0;
  pointer-events: none;
  transform: translate3d(0, 18px, 0);
  will-change: opacity, transform;
}

.feed-card[data-card-state="revealing"],
.feed-card[data-card-state="revealed"] {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(0, 0, 0);
}

.feed-card[data-card-state="revealed"] {
  will-change: auto;
}

/* 21-feed-card-media.css */
.feed-card .card-media,
.feed-card .card-media-img {
  border-radius: 20px;
}

.card-media {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: rgb(20, 20, 20);
  filter: brightness(0.7);
  transition: filter 500ms cubic-bezier(0.22, 1, 0.36, 1);
}

.feed-card:hover .card-media {
  filter: brightness(1);
}

.feed-card.text-expanded .card-media,
.feed-card.text-expanded:hover .card-media {
  filter: brightness(0.3);
}

.card-media::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  background:
    linear-gradient(rgba(0, 0, 0, 0.1), transparent 28%, rgba(0, 0, 0, 0.66)),
    radial-gradient(circle at 50% 30%, transparent, rgba(0, 0, 0, 0.22));
  pointer-events: none;
}

.card-media-symbol {
  position: relative;
  z-index: 1;
  color: rgba(255, 255, 255, 0.7);
  font-size: 84px;
  font-variation-settings: "FILL" 0, "wght" 230, "GRAD" 0, "opsz" 48;
}

.card-media-symbol[hidden] {
  display: none;
}

.card-media-img,
.card-media-video,
.card-media .youtube-player-embed,
.card-media .youtube-player-iframe {
  position: absolute;
  z-index: 1;
  inset: -1px;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  border: 0;
  object-fit: cover;
}

.card-media .youtube-player-embed,
.card-media .youtube-player-iframe {
  display: block;
  overflow: hidden;
  pointer-events: none;
}

.card-media-count,
.card-source-filter {
  position: absolute;
  z-index: 5;
  top: 20px;
  box-sizing: border-box;
  height: 26px;
  min-height: 26px;
  color: #ddd;
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  text-shadow: none;
}

.card-media-count {
  left: 20px;
  display: inline-flex;
  align-items: center;
  line-height: 1;
}

.card-source-filter {
  right: 20px;
  top: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 16px;
  border: 1px solid rgba(238, 238, 238, 0.5);
  border-radius: 20px;
  color: #ddd;
  font-size: 14px;
  height: 30px;
  min-height: 30px;
  line-height: 1;
  background: rgba(187, 187, 187, 0.25);
  box-shadow: var(--bunny-emboss-border-shadow);
  filter: none;
  backdrop-filter: none;
  cursor: pointer;
  transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.card-source-filter:hover {
  transform: scale(1.05);
}

.feed-card.source-youtube:not(.item-shorts):has(.card-actions-admin) .card-source-filter {
  right: 68px;
}

/* 22-feed-card-body-actions.css */
.card-body {
  position: absolute;
  z-index: 2;
  right: 72px;
  bottom: 20px;
  left: 20px;
  display: grid;
  gap: 0;
  color: rgba(255, 255, 255, 0.8);
}

.card-meta {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
  color: rgba(255, 255, 255, 0.8);
}

.feed-card .card-author {
  display: inline-flex;
  flex: 0 1 auto;
  min-width: 0;
  max-width: 100%;
  align-items: center;
  gap: 6px;
  overflow: hidden;
  color: #ddd;
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
  text-shadow: none;
}

.card-author-name {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.card-author-link {
  color: #ddd;
  text-decoration: none;
}

.card-time-link {
  color: inherit;
  text-decoration: none;
}

.feed-card .card-time-link,
.feed-card .card-meta time {
  flex: 0 0 auto;
  min-width: max-content;
  color: #bbb;
  font-size: 14px;
  font-weight: 500;
  text-shadow: none;
}

.card-author-avatar-wrap {
  display: inline-grid;
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  place-items: center;
  overflow: hidden;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.12);
  box-shadow: rgba(255, 255, 255, 0.2) 0 0 0 1px inset;
}

.card-author-avatar {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
}

.card-author-avatar-wrap.is-fallback::before {
  content: "";
  width: 42%;
  height: 42%;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.42);
}

.card-text {
  position: relative;
  display: -webkit-box;
  max-height: var(--card-text-collapsed-height, 44px);
  margin: 0;
  padding-right: 0;
  overflow: hidden;
  color: #ddd;
  font-size: 16px;
  font-weight: 500;
  line-height: 22px;
  text-shadow: none;
  white-space: pre-wrap;
  word-break: keep-all;
  overflow-wrap: break-word;
  scrollbar-width: none;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  transform: scaleY(var(--card-text-band-scale, 1));
  transform-origin: 50% var(--card-text-band-origin, 50%);
  transition:
    max-height 500ms cubic-bezier(0.22, 1, 0.36, 1),
    background-color 360ms,
    transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.card-text:focus,
.card-text:focus-visible {
  outline: none;
}

.card-text-full {
  display: inline;
}

.card-text a {
  color: rgb(155, 220, 255);
  font: inherit;
  text-decoration: none;
  overflow-wrap: anywhere;
  pointer-events: none;
  word-break: break-word;
}

.card-text.expanded a {
  pointer-events: auto;
}

.card-text:not(.expanded):not(.collapsing) {
  cursor: default;
}

.card-text.expanding,
.card-text.expanded,
.card-text.collapsing {
  cursor: pointer;
}

.card-text.expanding {
  display: block;
  max-height: var(--card-text-collapsed-height, 44px);
  overflow: hidden;
  -webkit-line-clamp: unset;
}

.card-text.collapsing {
  display: block;
  max-height: var(--card-text-collapsed-height, 44px);
  overflow: hidden;
  -webkit-line-clamp: unset;
}

.card-text.expanded {
  display: block;
  max-height: var(--card-text-expanded-height, 176px);
  padding-right: 0;
  overflow: hidden;
  overscroll-behavior: contain;
  -webkit-line-clamp: unset;
}

.card-text.expanded.scroll-ready {
  overflow-y: auto;
}

.card-text::-webkit-scrollbar {
  display: none;
}

.card-actions {
  position: absolute;
  z-index: 3;
  right: 20px;
  bottom: 16px;
  display: grid;
  gap: 12px;
}

.card-actions.card-actions-admin {
  gap: 8px;
}

.feed-card .icon-button {
  box-sizing: border-box;
  display: grid;
  width: 40px;
  min-width: 40px;
  max-width: 40px;
  height: 40px;
  min-height: 40px;
  max-height: 40px;
  place-items: center;
  padding: 0;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 50%;
  color: #ddd;
  border-color: rgba(238, 238, 238, 0.5);
  background: rgba(187, 187, 187, 0.25);
  box-shadow: var(--bunny-emboss-border-shadow);
  filter: none;
  backdrop-filter: none;
  text-shadow: none;
  transform-origin: 50% 50%;
  backface-visibility: hidden;
  transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.feed-card .icon-button:hover {
  transform: scale(1.05);
}

.feed-card .icon-button .material-symbols-outlined {
  color: #ddd;
  font-size: 24px;
  font-weight: 400;
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 20;
}

.feed-card .icon-button .local-svg-icon,
.feed-card .card-action-icon {
  color: #ddd;
}

.card-action-icon {
  box-sizing: border-box;
  display: inline-grid;
  flex: 0 0 24px;
  width: 24px;
  min-width: 24px;
  max-width: 24px;
  height: 24px;
  min-height: 24px;
  max-height: 24px;
  color: #ddd;
  background-color: transparent;
  pointer-events: none;
  place-items: center;
  transform: none;
  backface-visibility: hidden;
  font-size: 24px;
  font-weight: 400;
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
  line-height: 24px;
}

.card-delete-button:hover {
  color: rgba(255, 150, 164, 0.96);
}

.feed-load-more {
  display: flex;
  width: 360px;
  min-height: 86px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  background: rgba(255, 255, 255, 0.06);
  box-shadow: rgba(255, 255, 255, 0.09) 0 1px inset;
  font-size: 13px;
  font-weight: 440;
  cursor: pointer;
  backdrop-filter: blur(16px) saturate(1.25);
}

.feed-load-more .material-symbols-outlined {
  color: var(--accent);
  font-size: 20px;
}

.feed-load-sentinel,
.feed-load-sentinel.feed-load-more {
  display: block;
  width: 1px;
  height: 1px;
  min-height: 1px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  opacity: 0;
  pointer-events: none;
}

/* 23-feed-delete-modal.css */
.archive-delete-modal {
  position: fixed;
  z-index: 240;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(0, 0, 0, 0);
  opacity: 0;
  pointer-events: none;
  transition:
    opacity 220ms,
    background-color 220ms;
}

.archive-delete-modal.active {
  background: var(--bunny-dim-overlay);
  opacity: 1;
  pointer-events: auto;
}

.archive-delete-modal.closing {
  background: rgba(0, 0, 0, 0);
  opacity: 0;
  pointer-events: none;
}

.archive-delete-panel {
  width: min(440px, calc(100vw - 36px));
  padding: 22px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 20px;
  color: rgba(255, 255, 255, 0.94);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.04)),
    rgba(18, 18, 18, 0.92);
  box-shadow:
    rgba(255, 255, 255, 0.2) 0 1px inset,
    rgba(0, 0, 0, 0.52) 0 28px 80px;
  transform: translate3d(0, 14px, 0) scale(0.96);
  transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.archive-delete-modal.active .archive-delete-panel {
  transform: translate3d(0, 0, 0) scale(1);
}

.archive-delete-panel strong {
  display: block;
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 650;
}

.archive-delete-panel p {
  margin: 0 0 14px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 14px;
  line-height: 1.55;
}

.archive-delete-panel b {
  display: block;
  max-height: 4.5em;
  margin: 0 0 18px;
  overflow: hidden;
  color: rgba(255, 255, 255, 0.9);
  font-size: 14px;
  font-weight: 540;
  line-height: 1.5;
}

.archive-delete-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.archive-delete-actions button {
  min-width: 84px;
  min-height: 42px;
  padding: 0 18px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.9);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.04)),
    rgba(255, 255, 255, 0.06);
  font-family: Pretendard, system-ui, sans-serif;
  font-size: 14px;
  font-weight: 560;
  cursor: pointer;
}

.archive-delete-actions button[data-delete-confirm="ok"] {
  border-color: rgba(255, 120, 140, 0.34);
  color: rgba(255, 220, 226, 0.98);
  background:
    linear-gradient(135deg, rgba(255, 120, 140, 0.28), rgba(255, 255, 255, 0.05)),
    rgba(255, 120, 140, 0.1);
}

/* 24-feed-card-responsive.css */
@media (max-width: 767px) {
  .feed-grid {
    display: flex;
    height: auto;
    min-height: 0;
    flex-direction: column;
    align-items: stretch;
    gap: var(--mobile-feed-row-gap);
  }

  .feed-grid.masonry-ready .feed-card,
  .feed-grid.masonry-ready .feed-load-more,
  .feed-grid.masonry-preparing .feed-card,
  .feed-card,
  .feed-load-more {
    position: relative;
    top: auto;
    right: auto;
    left: auto;
    width: 100%;
    max-width: calc(100vw - (var(--mobile-feed-edge) * 2));
    margin: 0;
  }

  .feed-card {
    height: auto;
    aspect-ratio: 1 / 1;
  }

  .feed-card.source-binstagram {
    aspect-ratio: 4 / 5;
  }

  .feed-card.source-magazine,
  .feed-card.source-drama_still {
    aspect-ratio: 1 / 1;
  }

  .feed-card.source-binxrchive {
    aspect-ratio: 1 / 1;
  }

  .feed-card.source-youtube {
    height: auto;
    padding-top: 0;
    aspect-ratio: 4 / 3;
  }

  .feed-card.source-youtube.item-shorts {
    height: auto;
    padding-top: 0;
    aspect-ratio: 4 / 5;
  }

  .feed-grid:not(.masonry-ready) .feed-card {
    margin-bottom: var(--mobile-feed-row-gap);
  }

  .feed-grid:not(.masonry-ready) .feed-card:last-child {
    margin-bottom: 0;
  }

  .feed-grid.masonry-ready .feed-card,
  .feed-grid.masonry-ready .feed-load-more {
    transition:
      opacity 420ms cubic-bezier(0.22, 1, 0.36, 1) var(--card-delay, 0ms),
      filter 180ms,
      box-shadow 180ms;
  }

}

@supports (content-visibility: auto) {
  @media (min-width: 768px) {
    .feed-card {
      content-visibility: auto;
      contain: layout style paint;
      contain-intrinsic-size: 360px;
    }

    .feed-card.source-binstagram {
      contain-intrinsic-size: 360px 450px;
    }

    .feed-card.source-magazine,
    .feed-card.source-drama_still {
      contain-intrinsic-size: 360px 360px;
    }

    .feed-card.source-binxrchive {
      contain-intrinsic-size: 360px 360px;
    }

    .feed-card.source-youtube {
      contain-intrinsic-size: 360px 270px;
    }

    .feed-card.source-youtube.item-shorts {
      contain-intrinsic-size: 360px 450px;
    }
  }
}

/* 30-gallery.css */
.gallery-view {
  box-sizing: border-box;
  width: 100vw;
  max-width: 100vw;
  min-width: 0;
  margin-inline: calc(50% - 50vw);
  padding: 0 0 150px;
  overflow: visible;
}

.gallery-shell {
  box-sizing: border-box;
  display: grid;
  width: 100%;
  max-width: none;
  min-width: 0;
  gap: 36px;
  margin-inline: 0;
  padding-inline: 0;
  overflow: visible;
}

.gallery-group {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  min-width: 0;
  margin-inline: 0;
  padding-inline: 0;
  overflow: visible;
  content-visibility: visible;
  contain-intrinsic-size: none;
}

.gallery-group h2 {
  box-sizing: border-box;
  width: var(--gallery-grid-width, 72px);
  max-width: 100%;
  margin: 0 auto 16px;
  padding: 0 0 0 8px;
  color: #ddd;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0;
  text-align: left;
}

.gallery-media-grid {
  box-sizing: border-box;
  display: grid;
  grid-template-columns: repeat(var(--gallery-grid-columns, 1), var(--gallery-thumb-size, 72px));
  width: var(--gallery-grid-width, 72px);
  max-width: 100%;
  margin-inline: auto;
  padding: 0;
  gap: 0;
  align-items: start;
  justify-content: start;
  overflow: visible;
}

.gallery-view,
.gallery-shell,
.gallery-group,
.gallery-media-grid,
.gallery-thumb,
.gallery-thumb img {
  overflow-anchor: none;
}

.gallery-thumb {
  position: relative;
  box-sizing: border-box;
  display: block;
  width: var(--gallery-thumb-size, 72px);
  height: var(--gallery-thumb-size, 72px);
  min-width: 0;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  overflow: hidden;
  color: #fff;
  background: transparent;
  cursor: pointer;
  aspect-ratio: 1 / 1;
  contain: layout paint;
  transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1), filter 180ms;
}

@media (hover: hover) and (pointer: fine) {
  .gallery-thumb:hover {
    z-index: 20;
    transform: scale(1.25);
    filter: brightness(1.08);
  }
}

.gallery-thumb.is-touch-active {
  z-index: 24;
  transform: scale(1.1);
  filter: brightness(1.04);
}

.gallery-thumb.is-nonpublic {
  outline: 0;
  outline-offset: 0;
}

.gallery-thumb.is-nonpublic::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: rgba(70, 0, 0, 0.46);
}

.gallery-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  object-fit: cover;
  object-position: center;
  aspect-ratio: 1 / 1;
  opacity: 1;
  transition: opacity 160ms;
}

.gallery-thumb img[hidden] {
  display: none;
}

.gallery-thumb.is-loading img {
  opacity: 0;
}

.gallery-thumb.is-placeholder,
.gallery-thumb:disabled.is-placeholder {
  opacity: 1;
  cursor: wait;
  pointer-events: none;
  color: transparent;
  background: rgba(255, 255, 255, 0.043);
  border: 0;
  appearance: none;
}

.gallery-thumb.is-loading::before {
  content: "";
  position: absolute;
  z-index: 6;
  top: 50%;
  left: 50%;
  box-sizing: border-box;
  width: 30px;
  height: 30px;
  min-width: 30px;
  min-height: 30px;
  max-width: 30px;
  max-height: 30px;
  margin: 0;
  border: 3px solid rgba(255, 255, 255, 0.28);
  border-top-color: #fff;
  border-radius: 50%;
  background: transparent;
  transform-origin: 50% 50%;
  animation: 620ms linear infinite bunnySpinCentered;
}

.gallery-thumb-fallback {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: rgba(255, 255, 255, 0.42);
  background: rgba(255, 255, 255, 0.043);
}

.gallery-thumb-fallback[hidden] {
  display: none;
}

.gallery-thumb .gallery-video-badge,
.gallery-thumb .gallery-video-badge.local-svg-icon {
  position: absolute;
  z-index: 12;
  inset: auto 3px 3px auto;
  width: clamp(16px, calc(var(--gallery-thumb-size, 72px) * 0.34), 22px);
  height: clamp(16px, calc(var(--gallery-thumb-size, 72px) * 0.34), 22px);
  min-width: 0;
  min-height: 0;
  max-width: 22px;
  max-height: 22px;
  color: rgba(255, 255, 255, 0.98);
  object-fit: contain;
  opacity: 0.96;
  filter: drop-shadow(0 1px 5px rgba(0, 0, 0, 0.88));
  text-shadow: none;
  transform: none;
  pointer-events: none;
}

.gallery-thumb .gallery-video-badge.material-symbols-outlined {
  display: grid;
  place-items: center;
  font-size: clamp(16px, calc(var(--gallery-thumb-size, 72px) * 0.34), 22px);
  line-height: 1;
}

.gallery-thumb.is-loading .gallery-video-badge,
.gallery-thumb.is-loading .gallery-video-badge.local-svg-icon {
  opacity: 0;
}

.gallery-empty {
  margin: 120px auto;
  color: rgba(255, 255, 255, 0.58);
  font-size: 16px;
}

.gallery-loading-sentinel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  width: fit-content;
  min-height: 38px;
  margin: 24px auto 8px;
  padding: 0 14px;
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.82);
  background: rgba(255, 255, 255, 0.07);
  font-size: 13px;
  font-weight: 450;
}

.gallery-loading-dot,
.gallery-loading-sentinel .material-symbols-outlined,
.gallery-loading-sentinel .loading-svg-icon {
  box-sizing: border-box;
  display: block;
  width: 24px;
  height: 24px;
  min-width: 24px;
  min-height: 24px;
  max-width: 24px;
  max-height: 24px;
  border: 3px solid rgba(255, 255, 255, 0.28);
  border-top-color: #fff;
  border-radius: 50%;
  color: transparent;
  font-size: 0;
  line-height: 0;
  text-indent: -9999px;
  transform-origin: 50% 50%;
  animation: 720ms linear infinite bunnySpinInPlace;
}

@media (max-width: 767px) {
  .gallery-view {
    width: 100vw;
    max-width: none;
    padding: 0 0 154px;
  }

  .gallery-shell {
    gap: 30px;
  }

  .gallery-group h2 {
    width: 100vw;
    max-width: 100vw;
    margin: 0 0 16px;
    padding-left: 8px;
    font-size: 20px;
    font-weight: 500;
  }

  .gallery-media-grid {
    grid-template-columns: repeat(var(--gallery-grid-columns, 6), var(--gallery-thumb-size, 56px));
    width: 100vw;
    max-width: 100vw;
    margin: 0;
  }

  .gallery-thumb,
  .gallery-thumb img {
    width: var(--gallery-thumb-size, 56px);
    height: var(--gallery-thumb-size, 56px);
    min-width: 40px;
    min-height: 40px;
  }

  body[data-page="feed"] .gallery-view,
  body[data-page="feed"] .gallery-shell,
  body[data-page="feed"] .gallery-group,
  body[data-page="feed"] .gallery-media-grid,
  body[data-page="feed"] .gallery-thumb,
  body[data-page="feed"] .gallery-thumb img {
    touch-action: pan-y;
  }
}

/* 40-calendar-picker.css */
/* Calendar picker */

.calendar-picker {
  position: fixed;
  z-index: 430;
  inset: 0;
  display: grid;
  place-items: center;
  background: rgba(0, 0, 0, 0.42);
}

.calendar-picker-panel {
  width: min(360px, calc(100vw - 36px));
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 22px;
  color: #fff;
  background: rgba(28, 28, 28, 0.92);
  box-shadow: rgba(0, 0, 0, 0.44) 0 24px 70px;
  backdrop-filter: blur(18px) saturate(1.25);
}

.calendar-picker-panel header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}

.calendar-picker-panel header button,
.calendar-picker-months button,
.calendar-picker-close {
  border: 0;
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.82);
  background: rgba(255, 255, 255, 0.08);
  cursor: pointer;
}

.calendar-picker-panel header button {
  width: 40px;
  height: 40px;
}

.calendar-picker-panel strong {
  font-size: 22px;
  font-weight: 700;
}

.calendar-picker-months {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.calendar-picker-months button {
  min-height: 42px;
  font-size: 13px;
  font-weight: 620;
}

.calendar-picker-months button.active {
  color: rgb(7, 20, 15);
  background: rgba(52, 211, 153, 0.88);
}

.calendar-picker-close {
  width: 100%;
  min-height: 42px;
  margin-top: 14px;
  font-size: 14px;
  font-weight: 620;
}

/* 41-calendar-grid.css */
/* Calendar shell */

body[data-page="feed"] .calendar-view {
  --calendar-day-min-width: 84px;
  width: min(100%, 1360px);
  max-width: 1360px;
  margin: 0 auto;
  padding: 0 24px 120px;
}

body[data-page="feed"] .calendar-stack-shell {
  width: 100%;
}

body[data-page="feed"] .calendar-stack-main {
  display: flex;
  width: 100%;
  min-width: 0;
  align-items: flex-start;
  justify-content: center;
  gap: 24px;
}

body[data-page="feed"] .calendar-month-stack {
  display: grid;
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  max-width: calc(100% - 384px);
  gap: 34px;
}

body[data-page="feed"] .calendar-month-block {
  position: relative;
  width: 100%;
  min-width: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  transition: opacity 260ms, filter 260ms;
}

body[data-page="feed"] .calendar-month-block h2,
body[data-page="feed"] .calendar-month-block.active-month h2,
body[data-page="feed"] .calendar-month-block:not(.active-month) h2 {
  margin: 0;
  padding: 0 0 20px;
  color: #ddd;
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  text-align: center;
  letter-spacing: 0;
  text-shadow: rgba(0, 0, 0, 0.45) 0 1px 14px;
  transition: color 260ms;
}

body[data-page="feed"] .calendar-month-block.active-month h2 {
  color: #ddd;
}

body[data-page="feed"] .calendar-month-block .calendar-weekdays {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 4px;
  align-items: center;
  border: 0;
  padding: 0 6px 7px;
  background: transparent;
}

body[data-page="feed"] .calendar-month-block .calendar-weekdays span {
  display: grid;
  padding: 5px 0;
  place-items: center;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  text-align: center;
  color: #ddd;
}

body[data-page="feed"] .calendar-weekdays span.sunday,
body[data-page="feed"] .calendar-weekdays span:first-child {
  color: #ff7678;
}

body[data-page="feed"] .calendar-weekdays span.saturday,
body[data-page="feed"] .calendar-weekdays span:last-child {
  color: #5da9ff;
}

body[data-page="feed"] .calendar-month-block .calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(var(--calendar-day-min-width, 0px), 1fr));
  grid-auto-rows: var(--calendar-day-height, auto);
  align-content: start;
  min-height: 0;
  height: auto;
  gap: 0;
  overflow: visible;
  padding: 0 6px 6px;
  background: transparent;
}

body[data-page="feed"] .calendar-month-block .calendar-day {
  position: relative;
  box-sizing: border-box;
  display: grid;
  grid-template-rows: 22px var(--calendar-day-event-area-height, minmax(0, 1fr));
  gap: 2px;
  width: 100%;
  min-height: var(--calendar-day-height, 72px);
  height: var(--calendar-day-height, auto);
  overflow: visible;
  padding: 5px 1px 6px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 0;
  background: rgba(20, 20, 20, 0.62);
  box-shadow: none;
  aspect-ratio: auto;
  cursor: pointer;
}

body[data-page="feed"] .calendar-month-block .calendar-day-empty {
  visibility: hidden;
  pointer-events: none;
  cursor: default;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

body[data-page="feed"] .calendar-month-block .calendar-day.outside {
  opacity: 0.32;
  background: rgba(8, 8, 8, 0.36);
}

body[data-page="feed"] .calendar-month-block .calendar-day.today,
body[data-page="feed"] .calendar-month-block .calendar-day.selected {
  border-color: rgba(255, 255, 255, 0.08);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.063)), rgba(32, 32, 32, 0.82);
  box-shadow: none;
}

body[data-page="feed"] .calendar-month-block .calendar-day-number {
  display: flex;
  min-height: 22px;
  align-items: flex-start;
  justify-content: center;
}

body[data-page="feed"] .calendar-month-block .calendar-day-number span,
body[data-page="feed"] .calendar-month-block .calendar-day.today .calendar-day-number span,
body[data-page="feed"] .calendar-month-block .calendar-day.selected .calendar-day-number span {
  display: grid;
  width: auto;
  min-width: 22px;
  height: 20px;
  place-items: center;
  padding: 0 3px;
  border-radius: 0;
  color: #ddd;
  background: transparent;
  box-shadow: none;
  font-size: 12px;
  font-weight: 500;
  line-height: 20px;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
  transition: color 260ms, font-weight 260ms;
}

body[data-page="feed"] .calendar-month-block.active-month .calendar-day-number span,
body[data-page="feed"] .calendar-month-block.active-month .calendar-day.today .calendar-day-number span,
body[data-page="feed"] .calendar-month-block.active-month .calendar-day.selected .calendar-day-number span {
  color: #ddd;
  font-weight: 500;
}

body[data-page="feed"] .calendar-month-block .calendar-day:nth-child(7n+1) .calendar-day-number span {
  color: #ddd;
}

body[data-page="feed"] .calendar-month-block .calendar-day:nth-child(7n) .calendar-day-number span {
  color: #ddd;
}

body[data-page="feed"] .calendar-month-block.active-month .calendar-day:nth-child(7n+1) .calendar-day-number span {
  color: #ddd;
}

body[data-page="feed"] .calendar-month-block.active-month .calendar-day:nth-child(7n) .calendar-day-number span {
  color: #ddd;
}

body[data-page="feed"] .calendar-month-load-more {
  display: grid;
  width: 44px;
  min-width: 44px;
  height: 44px;
  min-height: 44px;
  margin: 12px auto 4px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: transparent;
  background: transparent;
  box-shadow: none;
  text-indent: -9999px;
}

body[data-page="feed"] .calendar-month-load-more .material-symbols-outlined {
  box-sizing: border-box;
  display: block;
  width: 24px;
  height: 24px;
  min-width: 24px;
  min-height: 24px;
  border: 3px solid rgba(255, 255, 255, 0.26);
  border-top-color: #fff;
  border-radius: 50%;
  color: transparent;
  font-size: 0;
  line-height: 0;
  text-indent: -9999px;
  transform-origin: 50% 50%;
  animation: bunnyStableSpinner 780ms linear infinite;
}

/* 41-calendar-day-thumbnails.css */
/* Calendar day event bar ownership: date-cell source stripes only. */

body[data-page="feed"] .calendar-events,
body[data-page="feed"] .calendar-month-block .calendar-events {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: var(--calendar-day-bar-gap, 2px);
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  padding: 0 var(--calendar-day-event-inset-x, 6px);
  box-sizing: border-box;
}

body[data-page="feed"] .calendar-day-event-bar,
body[data-page="feed"] .calendar-month-block .calendar-day-event-bar {
  display: block;
  width: 100%;
  height: var(--calendar-day-bar-height, 6px);
  min-height: var(--calendar-day-bar-height, 6px);
  overflow: hidden;
  padding: 0;
  border: 0;
  border-radius: 999px;
  color: #eee;
  background: rgba(255, 255, 255, 0.4);
  box-shadow:
    inset 0 1px rgba(255, 255, 255, 0.22),
    inset 0 -1px rgba(0, 0, 0, 0.28);
  pointer-events: none;
}

body[data-page="feed"] .calendar-day-event-bar.source-namookkun {
  background: rgba(3, 199, 90, 0.88);
}

body[data-page="feed"] .calendar-day-event-bar.source-binstagram {
  background: rgba(168, 85, 247, 0.88);
}

body[data-page="feed"] .calendar-day-event-bar.source-binxrchive {
  background: rgba(29, 155, 240, 0.88);
}

body[data-page="feed"] .calendar-day-event-bar.source-youtube {
  background: rgba(255, 65, 65, 0.9);
}

body[data-page="feed"] .calendar-day-event-bar.source-magazine {
  background: rgba(218, 183, 32, 0.92);
}

body[data-page="feed"] .calendar-day-event-bar.source-drama_still {
  background: rgba(246, 196, 84, 0.92);
}

body[data-page="feed"] .calendar-day-event-bar.source-schedule {
  background: rgba(245, 145, 35, 0.9);
}

body[data-page="feed"] .calendar-day-event-bar.source-birthday {
  background: #ff69b4;
}

/* 42-calendar-agenda.css */
/* Calendar agenda */

body[data-page="feed"] .calendar-agenda-sticky {
  display: block;
  flex: 0 0 360px;
  width: 360px;
  min-width: 360px;
  max-width: 360px;
  max-height: calc(100vh - 150px);
  overflow: auto;
  border: 0;
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.086), rgba(255, 255, 255, 0.03)), rgba(18, 18, 18, 0.78);
  box-shadow: rgba(0, 0, 0, 0.3) 0 24px 64px, rgba(255, 255, 255, 0.12) 0 1px inset;
  opacity: 1;
  visibility: visible;
  backdrop-filter: blur(14px) saturate(1.18);
}

.calendar-agenda header,
body[data-page="feed"] .calendar-agenda header {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  box-sizing: border-box;
}

.calendar-agenda header span {
  color: #eee;
  font-size: 16px;
  font-weight: 500;
}

.calendar-agenda header b {
  color: #ccc;
  font-size: 16px;
  font-weight: 500;
}

.calendar-agenda-list,
body[data-page="feed"] .calendar-agenda-list {
  display: grid;
  gap: 8px;
}

.calendar-agenda-item,
body[data-page="feed"] .calendar-agenda-item {
  display: grid;
  grid-template-columns: 54px 78px minmax(72px, 0.36fr) minmax(0, 1fr);
  min-height: 60px;
  height: 60px;
  align-items: center;
  align-content: center;
  gap: 20px;
  padding: 8px 14px;
  border: 0;
  border-radius: 18px;
  color: #ddd;
  background: rgba(255, 255, 255, 0.07);
  cursor: pointer;
  text-align: left;
  text-decoration: none;
}

.calendar-agenda-item time,
.calendar-agenda-item span,
body[data-page="feed"] .calendar-agenda-item time,
body[data-page="feed"] .calendar-agenda-item span {
  color: #ddd;
  font-size: 14px;
  font-weight: 500;
  line-height: 15.4px;
}

.calendar-agenda-item .calendar-agenda-author,
body[data-page="feed"] .calendar-agenda-item .calendar-agenda-author {
  display: block;
  min-width: 0;
  overflow: hidden;
  color: #ddd;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.calendar-agenda-item b,
body[data-page="feed"] .calendar-agenda-item b {
  overflow: hidden;
  color: #ddd;
  font-size: 14px;
  font-weight: 500;
  line-height: 18.2px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.calendar-agenda-empty {
  margin: 0;
  color: #bbb;
  font-size: 18px;
  font-weight: 500;
  line-height: 1;
  text-align: center;
}

.calendar-agenda-schedule {
  border-color: rgba(138, 255, 180, 0.22);
  background: linear-gradient(135deg, rgba(138, 255, 180, 0.13), rgba(255, 255, 255, 0.035)), rgba(255, 255, 255, 0.04);
}

.calendar-agenda-birthday {
  border-color: rgba(255, 105, 180, 0.58);
  background: #ff69b4;
}

.calendar-agenda-schedule time {
  color: rgba(138, 255, 180, 0.9);
}

/* 42-calendar-tooltip.css */
/* Calendar date tooltip */

body[data-page="feed"] .calendar-date-tooltip {
  --calendar-tooltip-list-gap: 8px;

  position: absolute;
  z-index: 80;
  top: calc(100% + 8px);
  left: var(--calendar-tooltip-left, 50%);
  width: var(--calendar-tooltip-width, min(318px, calc(100vw - 24px)));
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 18px;
  color: rgba(255, 255, 255, 0.92);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0.04)), rgba(22, 22, 22, 0.97);
  box-shadow:
    rgba(0, 0, 0, 0.5) 0 22px 52px,
    rgba(255, 255, 255, 0.24) 0 1px inset,
    rgba(0, 0, 0, 0.38) 0 -1px inset;
  transform: translateX(var(--calendar-tooltip-shift, -50%));
  backdrop-filter: blur(18px) saturate(1.18);
  pointer-events: auto;
}

body[data-page="feed"] .calendar-date-tooltip::before {
  content: "";
  position: absolute;
  top: -7px;
  left: var(--calendar-tooltip-arrow-left, 50%);
  width: 14px;
  height: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.16);
  border-left: 1px solid rgba(255, 255, 255, 0.16);
  background: linear-gradient(145deg, rgba(48, 48, 48, 0.98), rgba(28, 28, 28, 0.98)), rgba(22, 22, 22, 0.98);
  transform: translateX(-50%) rotate(45deg);
}

body[data-page="feed"] .calendar-date-tooltip header {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
  padding: 0 14px;
}

body[data-page="feed"] .calendar-date-tooltip header span,
body[data-page="feed"] .calendar-date-tooltip header b {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.2;
}

body[data-page="feed"] .calendar-date-tooltip header span {
  color: #eee;
}

body[data-page="feed"] .calendar-date-tooltip header b {
  color: #ccc;
}

body[data-page="feed"] .calendar-date-tooltip-list {
  position: relative;
  z-index: 1;
  display: grid;
  gap: var(--calendar-tooltip-list-gap);
}

body[data-page="feed"] .calendar-tooltip-item {
  display: grid;
  grid-template-columns: 34px 42px 104px minmax(0, 1fr);
  min-width: 0;
  min-height: 40px;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  border: 0;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.08);
  box-sizing: border-box;
  box-shadow: none;
  cursor: default;
  text-align: left;
  text-decoration: none;
}

body[data-page="feed"] .calendar-tooltip-item[data-open-media] {
  cursor: pointer;
}

body[data-page="feed"] .calendar-tooltip-item .calendar-agenda-thumb {
  display: grid;
  width: 30px;
  min-width: 30px;
  height: 30px;
  overflow: hidden;
  place-items: center;
  border-radius: 6px;
  background: rgba(0, 0, 0, 0.18);
}

body[data-page="feed"] .calendar-tooltip-item .calendar-agenda-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body[data-page="feed"] .calendar-tooltip-item .calendar-agenda-thumb .material-symbols-outlined {
  display: grid;
  place-items: center;
  color: rgba(255, 255, 255, 0.86);
  font-size: 20px;
  line-height: 1;
}

body[data-page="feed"] .calendar-tooltip-item .calendar-agenda-thumb .material-symbols-outlined[hidden] {
  display: none;
}

body[data-page="feed"] .calendar-tooltip-item.source-namookkun {
  background: rgba(3, 199, 90, 0.82);
}

body[data-page="feed"] .calendar-tooltip-item.source-binstagram {
  background: rgba(168, 85, 247, 0.82);
}

body[data-page="feed"] .calendar-tooltip-item.source-binxrchive {
  background: rgba(29, 155, 240, 0.82);
}

body[data-page="feed"] .calendar-tooltip-item.source-youtube {
  background: rgba(255, 65, 65, 0.82);
}

body[data-page="feed"] .calendar-tooltip-item.source-magazine {
  background: rgba(218, 183, 32, 0.88);
}

body[data-page="feed"] .calendar-tooltip-item.source-drama_still {
  background: rgba(246, 196, 84, 0.88);
}

body[data-page="feed"] .calendar-tooltip-item.calendar-tooltip-schedule {
  background: rgba(245, 145, 35, 0.88);
}

body[data-page="feed"] .calendar-tooltip-item.calendar-tooltip-birthday,
body[data-page="feed"] .calendar-tooltip-item.source-birthday {
  background: #ff69b4;
}

body[data-page="feed"] .calendar-tooltip-item time {
  display: block;
  width: 100%;
  min-width: 0;
  justify-self: stretch;
  overflow: hidden;
  color: #ddd;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

body[data-page="feed"] .calendar-tooltip-item span {
  display: block;
  width: 100%;
  min-width: 0;
  overflow: hidden;
  color: #ddd;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body[data-page="feed"] .calendar-tooltip-item b {
  min-width: 0;
  overflow: hidden;
  color: #ddd;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 43-calendar-desktop.css */
/* Desktop calendar layout */

@media (min-width: 768px) {
  body[data-page="feed"] .calendar-view {
    width: min(100%, 1360px);
    max-width: 1360px;
  }

  body[data-page="feed"] .calendar-stack-shell {
    height: calc(100svh - 164px);
    max-height: calc(100svh - 164px);
    overflow: hidden;
  }

  body[data-page="feed"] .calendar-stack-main {
    width: min(100%, 1560px);
    max-width: calc(100vw - clamp(24px, 6vw, 120px));
    height: 100%;
    max-height: 100%;
    margin: 0 auto;
    align-items: stretch;
    justify-content: center;
    gap: clamp(12px, 2.2vw, 34px);
    overflow: hidden;
  }

  body[data-page="feed"] .calendar-month-stack {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
    max-width: 640px;
    height: 100%;
    max-height: 100%;
    gap: 28px;
    overflow: hidden auto;
    overscroll-behavior: contain;
    padding-right: 0;
    scrollbar-gutter: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  body[data-page="feed"] .calendar-month-stack::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
  }

  body[data-page="feed"] .calendar-month-block {
    --calendar-day-min-width: clamp(52px, 6.4vw, 84px);

    max-width: 640px;
  }

  body[data-page="feed"] .calendar-agenda-sticky {
    position: sticky;
    top: 0;
    align-self: stretch;
    flex: 1 1 0;
    width: auto;
    min-width: 0;
    max-width: 648px;
    height: 100%;
    max-height: 100%;
    overflow: hidden;
    box-sizing: border-box;
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow:
      rgba(0, 0, 0, 0.3) 0 24px 64px,
      rgba(255, 255, 255, 0.22) 0 1px inset,
      rgba(0, 0, 0, 0.36) 0 -1px inset;
  }

  body[data-page="feed"] .calendar-agenda {
    display: flex;
    box-sizing: border-box;
    flex-direction: column;
    justify-content: flex-start;
    width: 100%;
    height: 100%;
    max-height: 100%;
    padding: 22px 23px 28px;
  }

  body[data-page="feed"] .calendar-agenda header {
    width: 100%;
    padding: 0 14px;
  }

  body[data-page="feed"] .calendar-agenda-list {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    align-items: stretch;
    place-content: flex-start;
    width: 100%;
    min-height: 0;
    height: auto;
    max-height: none;
    gap: 10px;
    overflow-y: auto;
    padding-right: 0;
    padding-bottom: 18px;
  }

  body[data-page="feed"] .calendar-agenda-list.is-empty {
    display: grid;
    place-items: center;
    place-content: center;
    align-content: center;
    justify-content: center;
    padding-bottom: 0;
  }

  body[data-page="feed"] .calendar-agenda-empty {
    margin: 0;
    align-self: center;
    justify-self: center;
  }

  body[data-page="feed"] .calendar-agenda-item {
    grid-template-columns: 48px 38px minmax(82px, 126px) minmax(0, 1fr);
    min-height: 60px;
    height: 60px;
    align-items: center;
    align-content: center;
    gap: clamp(10px, 1.35vw, 20px);
    padding: 8px 14px;
    border: 0;
    border-radius: 18px;
    color: rgba(255, 255, 255, 0.96);
    background: rgba(255, 255, 255, 0.075);
    box-shadow: none;
    backdrop-filter: none;
  }

  body[data-page="feed"] .calendar-agenda-item.source-namookkun {
    background: rgba(3, 199, 90, 0.82);
  }

  body[data-page="feed"] .calendar-agenda-item.source-binstagram {
    background: rgba(168, 85, 247, 0.82);
  }

  body[data-page="feed"] .calendar-agenda-item.source-binxrchive {
    background: rgba(29, 155, 240, 0.82);
  }

  body[data-page="feed"] .calendar-agenda-item.source-youtube {
    background: rgba(255, 65, 65, 0.82);
  }

  body[data-page="feed"] .calendar-agenda-item.source-magazine {
    background: rgba(218, 183, 32, 0.88);
  }

  body[data-page="feed"] .calendar-agenda-schedule {
    background: rgba(245, 145, 35, 0.88);
  }

  body[data-page="feed"] .calendar-agenda-birthday {
    background: #ff69b4;
  }

  body[data-page="feed"] .calendar-agenda-item .calendar-agenda-thumb {
    display: grid;
    width: 48px;
    min-width: 48px;
    height: 48px;
    overflow: hidden;
    place-items: center;
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.18);
  }

  body[data-page="feed"] .calendar-agenda-item .calendar-agenda-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  body[data-page="feed"] .calendar-agenda-item .calendar-agenda-thumb .material-symbols-outlined {
    display: grid;
    place-items: center;
    color: rgba(255, 255, 255, 0.86);
    font-size: 26px;
    line-height: 1;
  }

  body[data-page="feed"] .calendar-agenda-item .calendar-agenda-thumb .material-symbols-outlined[hidden],
  body[data-page="feed"] .calendar-agenda-link,
  body[data-page="feed"] .calendar-agenda-item .calendar-agenda-link,
  body[data-page="feed"] .calendar-agenda-item span.calendar-agenda-link {
    display: none;
  }

  body[data-page="feed"] .calendar-agenda-item time {
    display: block;
    width: 100%;
    min-width: 0;
    justify-self: stretch;
    color: #ddd;
    font-size: 14px;
    font-weight: 500;
    line-height: 15.4px;
    text-align: center;
    white-space: nowrap;
  }

  body[data-page="feed"] .calendar-agenda-item b,
  body[data-page="feed"] .calendar-agenda-schedule b {
    display: -webkit-box;
    min-width: 0;
    overflow: hidden;
    padding-right: 0;
    color: #ddd;
    font-size: 14px;
    font-weight: 500;
    line-height: 18.2px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
    white-space: normal;
  }

  body[data-page="feed"] .calendar-agenda-item .calendar-agenda-author {
    width: 100%;
    justify-self: stretch;
    color: #ddd;
    font-size: 14px;
    font-weight: 500;
    line-height: 15.4px;
    text-align: center;
  }

  @media (max-width: 1100px) {
    body[data-page="feed"] .calendar-view {
      width: 100%;
      max-width: calc(100vw - 20px);
      padding-right: 10px;
      padding-left: 10px;
    }

    body[data-page="feed"] .calendar-stack-shell {
      height: calc(100svh - 150px);
      max-height: calc(100svh - 150px);
    }

    body[data-page="feed"] .calendar-stack-main {
      max-width: calc(100vw - 20px);
      gap: 12px;
    }

    body[data-page="feed"] .calendar-month-stack {
      flex: 0 1 min(51vw, 500px);
      max-width: min(51vw, 500px);
      gap: 22px;
    }

    body[data-page="feed"] .calendar-month-block {
      --calendar-day-min-width: 0px;

      max-width: 500px;
    }

    body[data-page="feed"] .calendar-month-block h2,
    body[data-page="feed"] .calendar-month-block.active-month h2,
    body[data-page="feed"] .calendar-month-block:not(.active-month) h2 {
      padding-bottom: 16px;
    }

    body[data-page="feed"] .calendar-month-block .calendar-weekdays {
      padding-right: 4px;
      padding-left: 4px;
    }

    body[data-page="feed"] .calendar-month-block .calendar-grid {
      padding-right: 4px;
      padding-left: 4px;
    }

    body[data-page="feed"] .calendar-agenda-sticky {
      flex: 1 1 0;
      max-width: none;
      border-radius: 16px;
    }

    body[data-page="feed"] .calendar-agenda {
      padding: 16px 12px 20px;
    }

    body[data-page="feed"] .calendar-agenda header {
      padding: 0 8px;
    }

    body[data-page="feed"] .calendar-agenda-list {
      gap: 8px;
      padding-bottom: 12px;
    }

    body[data-page="feed"] .calendar-agenda-item {
      grid-template-columns: 40px 34px minmax(66px, 0.82fr) minmax(0, 1fr);
      gap: 8px;
      padding: 8px;
      border-radius: 14px;
    }

    body[data-page="feed"] .calendar-agenda-item .calendar-agenda-thumb {
      width: 40px;
      min-width: 40px;
      height: 40px;
    }
  }
}

/* 44-calendar-mobile.css */
/* Mobile calendar layout */

@media (max-width: 767px) {
  body[data-page="feed"] .calendar-view {
    width: 100vw;
    max-width: none;
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
    padding: 0 0 104px;
  }

  body[data-page="feed"] .calendar-stack-shell,
  body[data-page="feed"] .calendar-stack-main,
  body[data-page="feed"] .calendar-month-stack,
  body[data-page="feed"] .calendar-month-block,
  body[data-page="feed"] .calendar-month-block .calendar-grid,
  body[data-page="feed"] .calendar-month-block .calendar-day {
    overflow: visible;
  }

  body[data-page="feed"] .calendar-stack-main {
    display: block;
    width: 100%;
  }

  body[data-page="feed"] .calendar-month-stack {
    width: 100%;
    max-width: none;
    gap: 28px;
  }

  body[data-page="feed"] .calendar-agenda-sticky {
    display: none;
  }

  body[data-page="feed"] .calendar-month-block {
    border-radius: 0;
    background: rgba(12, 12, 12, 0.42);
  }

  body[data-page="feed"] .calendar-month-block h2,
  body[data-page="feed"] .calendar-month-block.active-month h2,
  body[data-page="feed"] .calendar-month-block:not(.active-month) h2 {
    padding: 4px 0 16px;
    font-size: 16px;
    font-weight: 500;
  }

  body[data-page="feed"] .calendar-month-block .calendar-weekdays {
    padding: 0 5px 5px;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 4px;
  }

  body[data-page="feed"] .calendar-month-block .calendar-grid {
    grid-template-columns: repeat(7, minmax(0, 1fr));
    grid-auto-rows: var(--calendar-day-mobile-height, auto);
    gap: 0;
    padding: 0 5px 7px;
  }

  body[data-page="feed"] .calendar-month-block .calendar-day {
    grid-template-rows: 17px var(--calendar-day-mobile-event-area-height, minmax(0, 1fr));
    min-height: var(--calendar-day-mobile-height, 50px);
    height: var(--calendar-day-mobile-height, auto);
    gap: 1px;
    padding: 2px 1px 3px;
    border-radius: 0;
    aspect-ratio: auto;
  }

  body[data-page="feed"] .calendar-month-block .calendar-day-number {
    min-height: 17px;
  }

  body[data-page="feed"] .calendar-month-block .calendar-day-number span,
  body[data-page="feed"] .calendar-month-block .calendar-day.today .calendar-day-number span,
  body[data-page="feed"] .calendar-month-block .calendar-day.selected .calendar-day-number span {
    min-width: 16px;
    height: 16px;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
  }

  body[data-page="feed"] .calendar-month-block .calendar-events {
    gap: var(--calendar-day-mobile-bar-gap, 1px);
    padding: 0 var(--calendar-day-mobile-event-inset-x, 4px);
  }

  body[data-page="feed"] .calendar-month-block .calendar-day-event-bar {
    height: var(--calendar-day-mobile-bar-height, 5px);
    min-height: var(--calendar-day-mobile-bar-height, 5px);
  }

  body[data-page="feed"] .calendar-month-block:has(.calendar-date-tooltip) {
    contain: none;
    position: relative;
    z-index: 90;
  }

  body[data-page="feed"] .calendar-date-tooltip {
    box-sizing: border-box;
    width: var(--calendar-tooltip-width, min(374px, calc(100vw - 4px)));
    max-width: none;
    padding-right: var(--calendar-tooltip-list-gap);
    padding-bottom: var(--calendar-tooltip-list-gap);
    padding-left: var(--calendar-tooltip-list-gap);
  }

  body[data-page="feed"] .calendar-tooltip-item {
    width: 100%;
    justify-self: stretch;
    grid-template-columns: 30px 36px 108px minmax(0, 1fr);
    gap: 12px;
    padding-right: 12px;
    padding-left: 12px;
    border-radius: 12px;
  }

  body[data-page="feed"] .calendar-tooltip-item span {
    text-align: center;
    text-overflow: clip;
  }

  body[data-page="feed"] .calendar-date-tooltip::before {
    content: none;
    display: none;
  }
}

/* 45-calendar-state.css */
/* Calendar scroll lock */

html.calendar-scroll-lock,
html.calendar-scroll-lock body {
  height: 100svh;
  max-height: 100svh;
  overflow: hidden;
}

html.calendar-scroll-lock body[data-page="feed"][data-feed-view="calendar"] .calendar-view {
  height: 100svh;
  max-height: 100svh;
  overflow: hidden;
}

html.calendar-scroll-lock body[data-page="feed"][data-feed-view="calendar"] .app-main,
html.calendar-scroll-lock body[data-page="feed"][data-feed-view="calendar"] #page-feed {
  overflow: hidden;
}

html.calendar-scroll-lock body[data-page="feed"][data-feed-view="calendar"] .calendar-stack-shell {
  height: calc(100svh - 164px);
  max-height: calc(100svh - 164px);
  overflow: hidden;
}

html.calendar-scroll-lock body[data-page="feed"][data-feed-view="calendar"] .calendar-stack-main,
html.calendar-scroll-lock body[data-page="feed"][data-feed-view="calendar"] .calendar-month-stack {
  height: 100%;
  max-height: 100%;
}

html.calendar-scroll-lock body[data-page="feed"][data-feed-view="calendar"] .calendar-stack-main {
  overflow: hidden;
}

html.calendar-scroll-lock body[data-page="feed"][data-feed-view="calendar"] .calendar-month-stack {
  overflow: hidden auto;
  overscroll-behavior: contain;
}

@media (max-width: 767px) {
  html.calendar-scroll-lock,
  html.calendar-scroll-lock body,
  html.calendar-scroll-lock body[data-page="feed"][data-feed-view="calendar"] .calendar-view,
  html.calendar-scroll-lock body[data-page="feed"][data-feed-view="calendar"] .app-main,
  html.calendar-scroll-lock body[data-page="feed"][data-feed-view="calendar"] #page-feed,
  html.calendar-scroll-lock body[data-page="feed"][data-feed-view="calendar"] .calendar-stack-shell,
  html.calendar-scroll-lock body[data-page="feed"][data-feed-view="calendar"] .calendar-stack-main,
  html.calendar-scroll-lock body[data-page="feed"][data-feed-view="calendar"] .calendar-month-stack {
    height: auto;
    max-height: none;
    overflow: visible;
  }
}

/* Calendar active-view glass tuning */

body[data-page="feed"][data-feed-view="calendar"] .calendar-month-block {
  border: 0;
  background: transparent;
  box-shadow: none;
}

body[data-page="feed"][data-feed-view="calendar"] .calendar-month-block .calendar-day {
  border-color: rgba(255, 255, 255, 0.08);
  background: rgba(18, 18, 18, 0.24);
  box-shadow: none;
}

body[data-page="feed"][data-feed-view="calendar"] .calendar-month-block .calendar-day-empty {
  visibility: hidden;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  cursor: default;
}

body[data-page="feed"][data-feed-view="calendar"] .calendar-month-block .calendar-day.outside {
  background: rgba(8, 8, 8, 0.15);
}

body[data-page="feed"][data-feed-view="calendar"] .calendar-month-block .calendar-day.today,
body[data-page="feed"][data-feed-view="calendar"] .calendar-month-block .calendar-day.selected {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.05)), rgba(30, 30, 30, 0.34);
}

body[data-page="feed"][data-feed-view="calendar"] .calendar-agenda-sticky,
body[data-page="feed"][data-feed-view="calendar"] .calendar-agenda {
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.063), rgba(255, 255, 255, 0.024)), rgba(14, 14, 14, 0.28);
  box-shadow:
    rgba(0, 0, 0, 0.26) 0 22px 56px,
    rgba(255, 255, 255, 0.22) 0 1px inset,
    rgba(0, 0, 0, 0.36) 0 -1px inset;
  backdrop-filter: none;
}

body[data-page="feed"][data-feed-view="calendar"] .calendar-agenda-item {
  border: 0;
  background: rgba(255, 255, 255, 0.05);
  box-shadow: none;
}

body[data-page="feed"][data-feed-view="calendar"] .calendar-agenda-item.source-namookkun {
  background: rgba(3, 199, 90, 0.82);
}

body[data-page="feed"][data-feed-view="calendar"] .calendar-agenda-item.source-binstagram {
  background: rgba(168, 85, 247, 0.82);
}

body[data-page="feed"][data-feed-view="calendar"] .calendar-agenda-item.source-binxrchive {
  background: rgba(29, 155, 240, 0.82);
}

body[data-page="feed"][data-feed-view="calendar"] .calendar-agenda-item.source-youtube {
  background: rgba(255, 65, 65, 0.82);
}

body[data-page="feed"][data-feed-view="calendar"] .calendar-agenda-item.source-magazine {
  background: rgba(218, 183, 32, 0.88);
}

body[data-page="feed"][data-feed-view="calendar"] .calendar-agenda-item.source-drama_still {
  background: rgba(246, 196, 84, 0.88);
}

body[data-page="feed"][data-feed-view="calendar"] .calendar-agenda-schedule {
  background: rgba(245, 145, 35, 0.88);
}

body[data-page="feed"][data-feed-view="calendar"] .calendar-agenda-birthday {
  background: #ff69b4;
}

/* 49-media-modal-base.css */
.unified-media-modal {
  position: fixed;
  z-index: 420;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 22px;
  background-color: rgba(0, 0, 0, 0);
  opacity: 0;
  pointer-events: none;
  transition:
    opacity 320ms cubic-bezier(0.22, 1, 0.36, 1),
    background-color 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.unified-media-modal.active {
  opacity: 1;
  pointer-events: auto;
}

.unified-media-modal.closing {
  opacity: 0;
  pointer-events: none;
  background-color: rgba(0, 0, 0, 0);
}

.unified-media-panel {
  position: relative;
  z-index: 2;
  overflow: hidden;
  width: min(calc(var(--modal-gallery-width, 360px) + 65px), calc(100vw - 48px));
  height: auto;
  max-width: none;
  max-height: calc(100vh - 48px);
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(18, 18, 18, 0.94);
  box-shadow: var(--shadow);
  opacity: 0;
  transform: translateY(20px) scale(0.97);
  transition:
    opacity 260ms cubic-bezier(0.22, 1, 0.36, 1),
    transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
  backdrop-filter: blur(22px) saturate(1.25);
}

.unified-media-modal.active .unified-media-panel {
  opacity: 1;
  transform: none;
}

.unified-media-modal.closing .unified-media-panel {
  opacity: 0;
  transform: translateY(18px) scale(0.97);
}

.unified-media-head {
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 62px;
  padding: 12px 16px 10px 20px;
  border-color: rgba(255, 255, 255, 0.12);
  border-bottom: 0;
}

.unified-media-head h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 560;
}

.unified-media-head p {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.unified-media-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  justify-content: flex-end;
  padding: 18px 20px;
  border-color: rgba(255, 255, 255, 0.12);
  border-top: 1px solid var(--line-soft);
  border-bottom: 0;
}

.modal-close {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 50%;
  color: var(--text);
  background: transparent;
  cursor: pointer;
}

.modal-close:hover {
  background: rgba(255, 255, 255, 0.08);
}

.modal-close .local-svg-icon {
  width: 1.35em;
  height: 1.35em;
}

.unified-media-grid {
  display: block;
}

.unified-media-modal img[hidden] {
  display: none;
}

.unified-media-body {
  overflow: auto;
  height: auto;
  max-height: calc(100vh - 110px);
  padding: 24px;
}

.unified-media-only {
  width: 100%;
}

.unified-media-dim {
  position: fixed;
  z-index: 0;
  inset: 0;
  background-color: var(--bunny-dim-overlay);
  opacity: 0;
  pointer-events: none;
  transition:
    opacity 400ms cubic-bezier(0.22, 1, 0.36, 1),
    background-color 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.unified-media-modal.active .unified-media-dim {
  opacity: 1;
}

.unified-media-modal.lightbox-mode .unified-media-dim {
  background-color: var(--bunny-lightbox-dim-overlay);
}

.unified-media-modal.popup-backgrounded {
  pointer-events: none;
}

/* 50-media-popup-base.css */
.unified-media-modal:not(.lightbox-mode) {
  --media-family-body-padding: 24px;
  --media-family-close-size: 44px;
  --media-family-gap: 24px;
  --media-family-panel-extra: 50px;
  --media-family-panel-radius: 12px;
  --media-family-scrollbar-width: 8px;
  --media-family-tile-radius: 8px;
  --media-vignette-gradient: linear-gradient(
    rgba(0, 0, 0, 0.44) 0%,
    rgba(0, 0, 0, 0.18) 24%,
    rgba(0, 0, 0, 0) 42%,
    rgba(0, 0, 0, 0) 58%,
    rgba(0, 0, 0, 0.34) 78%,
    rgba(0, 0, 0, 0.62) 100%
  );
}

.unified-media-tile { position: relative; isolation: isolate; overflow: hidden; min-height: 260px; aspect-ratio: 3 / 4; border-radius: 8px; }

.unified-media-gallery .unified-media-tile.is-empty { display: grid; min-height: 340px; place-items: center; color: var(--muted); }

.unified-media-modal:not(.lightbox-mode) .unified-media-gallery { position: relative; display: block; width: var(--modal-gallery-width, 640px); height: var(--modal-gallery-height, 640px); max-width: 100%; gap: 0px; align-items: flex-start; justify-content: center; column-count: auto; column-width: auto; }

.unified-media-gallery .unified-media-tile.is-placeholder { display: grid; place-items: center; color: rgba(255, 255, 255, 0.58); background: transparent; }

/* 50-media-popup-detail.css */
@media (max-width: 767px) {
.unified-media-modal:not(.lightbox-mode) { padding: 0px; background: rgba(0, 0, 0, 0); }

.unified-media-modal:not(.lightbox-mode) .unified-media-panel, body .unified-media-modal:not(.lightbox-mode) .unified-media-panel { border: 0px; background: transparent; box-shadow: none; backdrop-filter: none; }

.unified-media-modal:not(.lightbox-mode) .unified-media-head { position: absolute; z-index: 30; top: max(12px, env(safe-area-inset-top)); right: 12px; display: block; min-height: 0px; padding: 0px; border: 0px; }

.unified-media-modal:not(.lightbox-mode) .unified-media-head > div { display: none; }

.unified-media-modal:not(.lightbox-mode) .unified-media-head .modal-close { width: 42px; height: 42px; color: rgb(255, 255, 255); background: rgba(0, 0, 0, 0.18); backdrop-filter: blur(14px) saturate(1.2); }

.unified-media-modal:not(.lightbox-mode) .unified-media-body { overflow: hidden; }

.unified-media-modal:not(.lightbox-mode) .unified-media-grid, .unified-media-modal:not(.lightbox-mode) .unified-media-only { height: 100%; }

.unified-media-modal:not(.lightbox-mode) .unified-media-gallery { display: none; }

.unified-media-modal:not(.lightbox-mode).closing { background: rgba(0, 0, 0, 0); }

.unified-media-modal:not(.lightbox-mode) .unified-media-panel, body .unified-media-modal:not(.lightbox-mode) .unified-media-panel { width: 100vw; height: 100svh; max-width: 100vw; max-height: 100svh; border-radius: 0px; transform: none; }

.unified-media-modal:not(.lightbox-mode) .unified-media-body { height: 100svh; max-height: 100svh; padding: 0px; }
}

.unified-media-modal:not(.lightbox-mode) .unified-media-panel { width: min(calc(var(--modal-gallery-width, 640px) + var(--modal-panel-extra, var(--media-family-panel-extra))), calc(100vw - 160px)); box-sizing: border-box; }

  .unified-media-modal:not(.lightbox-mode).active { background: transparent; }

.unified-subtitle-pill { display: inline-flex; align-items: center; gap: 5px; min-height: 24px; padding: 0px 8px; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 999px; background: rgba(255, 255, 255, 0.043); color: rgba(238, 248, 242, 0.78); font-size: 12px; font-weight: 390; }

.unified-subtitle-pill i { color: var(--accent); font-size: 15px; }

.unified-subtitle-pill.source-binstagram i { color: rgb(255, 214, 255); }

.unified-subtitle-pill.source-namookkun i { color: rgb(246, 206, 105); }

.unified-subtitle-pill.source-binxrchive i { color: rgb(154, 194, 255); }

.unified-subtitle-pill.source-youtube i { color: rgb(255, 105, 105); }

.unified-subtitle-pill.source-magazine i { color: rgb(255, 180, 132); }

.unified-subtitle-pill.source-drama_still i { color: rgb(255, 214, 128); }

.unified-media-text { max-width: 1120px; margin: 0px 0px 18px; color: rgba(238, 248, 242, 0.82); font-size: 14px; line-height: 1.58; white-space: pre-wrap; }

.unified-detail-layout { display: grid; grid-template-columns: minmax(0px, 1.45fr) minmax(280px, 0.72fr); gap: 20px; align-items: start; }

.unified-detail-viewer, .unified-detail-info { min-width: 0px; }

.unified-detail-info { display: grid; gap: 14px; }

.unified-detail-text-block { display: grid; gap: 10px; padding: 16px; border: 1px solid var(--line-soft); border-radius: 8px; background: rgba(255, 255, 255, 0.055); }

.unified-detail-text-block strong { color: var(--text); font-size: 13px; font-weight: 520; }

.unified-detail-text-block p { overflow: auto; max-height: 34vh; margin: 0px; color: rgba(238, 248, 242, 0.84); font-size: 13px; font-weight: 380; line-height: 1.58; white-space: pre-wrap; }

.unified-media-modal:not(.lightbox-mode) .unified-media-video { position: absolute; inset: 0px; z-index: 1; width: 100%; height: 100%; object-fit: contain; background: transparent; }

.unified-media-modal:not(.lightbox-mode) .unified-media-kind, .unified-media-modal:not(.lightbox-mode) .unified-media-file, .unified-media-modal:not(.lightbox-mode) .unified-media-resolution, .unified-media-modal:not(.lightbox-mode) .unified-media-download { position: absolute; }

.unified-media-modal:not(.lightbox-mode) .unified-media-kind { top: 14px; left: 14px; display: none; }

.unified-media-modal:not(.lightbox-mode) .unified-media-file, .unified-media-modal:not(.lightbox-mode) .unified-media-resolution { z-index: 5; right: 80px; max-width: calc(100% - 104px); overflow: visible; text-overflow: clip; white-space: nowrap; word-break: normal; color: rgb(238, 238, 238); font-size: 16px; font-weight: 600; line-height: 16px; text-shadow: none; }

.unified-media-modal:not(.lightbox-mode) .unified-media-file { top: 16px; bottom: auto; left: 16px; }

.unified-media-modal:not(.lightbox-mode) .unified-media-resolution { top: auto; bottom: 16px; left: 16px; height: auto; min-height: 0; }

.unified-media-modal:not(.lightbox-mode) .unified-media-download { z-index: 6; right: 16px; bottom: 16px; width: 40px; min-width: 40px; max-width: 40px; height: 40px; min-height: 40px; max-height: 40px; padding: 0px; border: 1px solid var(--bunny-emboss-border); border-radius: 50%; color: rgb(238, 238, 238); background: linear-gradient(135deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.06)), rgba(10, 14, 13, 0.22); box-shadow: var(--bunny-emboss-border-shadow); backdrop-filter: blur(14px) saturate(1.35); font-size: 12px; font-weight: 520; text-decoration: none; transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1), border-color 180ms, background 180ms, box-shadow 180ms, opacity 260ms cubic-bezier(0.22, 1, 0.36, 1); }

.unified-media-modal:not(.lightbox-mode) .unified-media-tile.has-download .unified-media-file { right: 104px; }

.unified-media-modal:not(.lightbox-mode) .unified-media-download:hover { transform: scale(1.08); }

.unified-media-modal:not(.lightbox-mode) .unified-media-nav { position: absolute; z-index: 4; top: 50%; display: grid; place-items: center; width: 44px; height: 58px; border: 0px; color: rgb(255, 255, 255); background: transparent; text-shadow: rgba(0, 0, 0, 0.72) 0px 2px 12px; transform: translateY(-50%); cursor: pointer; }

.unified-media-modal:not(.lightbox-mode) .unified-media-nav.prev { left: 8px; }

.unified-media-modal:not(.lightbox-mode) .unified-media-nav.next { right: 8px; }

.unified-detail-meta { display: grid; grid-template-columns: max-content minmax(0px, 1fr); gap: 10px 14px; padding: 16px; border: 1px solid var(--line-soft); border-radius: 8px; background: rgba(255, 255, 255, 0.055); }

.unified-detail-meta span { color: var(--muted); font-size: 13px; }

.unified-detail-meta b { min-width: 0px; overflow-wrap: anywhere; color: var(--text); font-size: 13px; font-weight: 450; }

.unified-source-posts { display: grid; gap: 10px; padding: 16px; border: 1px solid var(--line-soft); border-radius: 8px; background: rgba(255, 255, 255, 0.043); }

.unified-source-posts > strong { font-size: 13px; font-weight: 520; }

.unified-source-posts p { display: grid; grid-template-columns: 24px minmax(72px, max-content) minmax(0px, 1fr); gap: 8px; margin: 0px; color: var(--muted); font-size: 12px; line-height: 1.45; }

.unified-source-posts p b, .unified-source-posts p span, .unified-source-posts p em { min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-style: normal; font-weight: 360; }

.unified-source-posts p b { color: var(--accent); }

.unified-media-link { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0px 16px; color: var(--text); text-decoration: none; }

.unified-media-column { display: flex; min-width: 0px; flex-direction: column; gap: 24px; }

.unified-media-modal:not(.lightbox-mode) .unified-media-carousel { display: none; }

@media (max-width: 1023px) {
.unified-detail-layout { grid-template-columns: 1fr; }
}

@media (max-width: 767px) {
.unified-media-modal:not(.lightbox-mode) .unified-media-carousel { display: grid; height: 100%; overflow: hidden; grid-template-rows: minmax(0px, 1fr) 112px; }
.unified-media-modal:not(.lightbox-mode) .unified-media-resolution { top: auto; left: 14px; right: 108px; bottom: 14px; max-width: calc(100% - 122px); }
.unified-media-modal:not(.lightbox-mode) .unified-media-nav { display: none; width: 54px; height: 72px; }
.unified-media-modal:not(.lightbox-mode) .unified-media-nav.prev { left: 2px; }
.unified-media-modal:not(.lightbox-mode) .unified-media-nav.next { right: 2px; }
.unified-media-modal:not(.lightbox-mode) .unified-media-track { display: grid; grid-template-columns: repeat(3, 100vw); width: 300vw; height: 100%; transform: translate3d(calc(-100vw + var(--swipe-x, 0px)), 0, 0); transition: transform 250ms cubic-bezier(0.22, 1, 0.36, 1); will-change: transform; }
.unified-media-modal:not(.lightbox-mode) .unified-media-track.single { grid-template-columns: 100vw; width: 100vw; transform: translate3d(var(--swipe-x, 0px), 0, 0); }
.unified-media-modal:not(.lightbox-mode) .unified-media-file { inset: 14px 14px auto; max-width: calc(100% - 28px); }
.unified-media-modal:not(.lightbox-mode) .unified-media-download { right: 14px; bottom: 12px; }
}

/* 50-media-popup-shell.css */
.unified-media-modal:not(.lightbox-mode) .unified-media-gallery .unified-media-tile.is-animation { min-height: 0px; aspect-ratio: var(--media-aspect, 1 / 1); }

.unified-media-modal:not(.lightbox-mode) { padding: 54px 72px 92px; }

.unified-media-modal:not(.lightbox-mode) .unified-media-panel { position: relative; max-height: calc(-156px + 100dvh); overflow: visible; border: 1px solid var(--bunny-emboss-border); border-radius: var(--media-family-panel-radius); background: rgba(18, 18, 18, 0.96); box-shadow: var(--bunny-emboss-window-shadow); transition: opacity 360ms cubic-bezier(0.22, 1, 0.36, 1), transform 360ms cubic-bezier(0.22, 1, 0.36, 1); }

.unified-media-modal:not(.lightbox-mode) .unified-media-head { height: 0px; min-height: 0px; padding: 0px; border: 0px; }

.unified-media-modal:not(.lightbox-mode) .unified-media-head > div { display: none; }

.unified-media-modal:not(.lightbox-mode) .modal-close { position: absolute; z-index: 24; top: calc(var(--media-family-close-size) / -2); right: calc(var(--media-family-close-size) / -2); bottom: auto; left: auto; display: grid; width: var(--media-family-close-size); height: var(--media-family-close-size); min-width: var(--media-family-close-size); min-height: var(--media-family-close-size); place-items: center; border: 1px solid var(--bunny-emboss-border); border-radius: 999px; color: rgba(255, 255, 255, 0.94); background: rgba(255, 255, 255, 0.08); box-shadow: var(--bunny-emboss-border-shadow); transform: none; }

.unified-media-modal:not(.lightbox-mode) .modal-close:hover { transform: scale(1.06); }

.unified-media-modal:not(.lightbox-mode) .unified-media-actions { display: none; }

.unified-media-modal:not(.lightbox-mode) .unified-media-body { height: auto; max-height: calc(-156px + 100dvh); overflow: auto; padding: var(--media-family-body-padding); scrollbar-color: rgba(255, 255, 255, 0.36) transparent; scrollbar-width: thin; }

.unified-media-modal:not(.lightbox-mode) .unified-media-body::-webkit-scrollbar {
  width: var(--media-family-scrollbar-width);
  height: var(--media-family-scrollbar-width);
}

.unified-media-modal:not(.lightbox-mode) .unified-media-body::-webkit-scrollbar-track {
  background: transparent;
}

.unified-media-modal:not(.lightbox-mode) .unified-media-body::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.38);
  background-clip: content-box;
}

.unified-media-modal:not(.lightbox-mode) .unified-media-body::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.54);
  background-clip: content-box;
}

.unified-media-modal:not(.lightbox-mode) .unified-media-column { display: grid; width: var(--modal-tile-width, 320px); min-width: 0px; gap: 24px; }

.unified-media-modal:not(.lightbox-mode) .unified-media-column + .unified-media-column { margin-left: 24px; }

.unified-media-modal:not(.lightbox-mode) .unified-media-gallery .unified-media-tile { display: block; position: absolute; box-sizing: border-box; top: 0px; left: 0px; width: var(--popup-tile-width, var(--modal-tile-width, 320px)); height: var(--popup-tile-height, auto); max-width: 100%; min-height: 0px; margin: 0px; overflow: hidden; aspect-ratio: var(--media-aspect, 1 / 1); border-radius: var(--media-family-tile-radius); background: transparent; cursor: zoom-in; transform: translate3d(var(--popup-tile-x, 0), var(--popup-tile-y, 0), 0); }

.unified-media-modal:not(.lightbox-mode) .unified-media-gallery .unified-media-tile::after { content: ""; position: absolute; z-index: 2; inset: 0px; opacity: 1; pointer-events: none; background: var(--media-vignette-gradient); }

.unified-media-modal:not(.lightbox-mode) .unified-media-gallery .unified-media-tile.is-loading::after,
.unified-media-modal:not(.lightbox-mode) .unified-media-gallery .unified-media-tile.is-media-error::after {
  opacity: 0;
}

.unified-media-modal:not(.lightbox-mode) .unified-media-gallery .unified-media-tile > img, .unified-media-modal:not(.lightbox-mode) .unified-media-gallery .unified-media-tile > video, .unified-media-modal:not(.lightbox-mode) .unified-media-gallery .unified-media-tile .unified-media-video { position: absolute; z-index: 1; inset: 0px; display: block; width: 100%; height: 100%; min-height: 100%; max-height: none; object-fit: cover; object-position: center center; }

.unified-media-modal:not(.lightbox-mode) .unified-media-gallery .unified-media-tile.is-loading::before, .unified-media-modal:not(.lightbox-mode) .unified-media-stage.is-loading::before { top: 50%; left: 50%; margin: 0px; animation: 780ms linear 0s infinite normal none running bunnyCenteredSpinner; transform-origin: 50% 50%; }

@media (max-width: 767px) {
.unified-media-modal:not(.lightbox-mode) .modal-close { top: max(12px, env(safe-area-inset-top)); right: 12px; }
.unified-media-modal:not(.lightbox-mode) .modal-close:hover { transform: scale(1.06); }
}

/* 50-youtube-player-mobile-reset.css */
@media (max-width: 767px) {
  .unified-media-modal:not(.lightbox-mode):not(.youtube-player-mode):not(.thumbnail-editor-modal) {
    padding: 0;
    background: rgba(0, 0, 0, 0);
  }

  .unified-media-modal:not(.lightbox-mode):not(.youtube-player-mode):not(.thumbnail-editor-modal).active {
    background: rgb(0, 0, 0);
  }

  .unified-media-modal:not(.lightbox-mode):not(.youtube-player-mode):not(.thumbnail-editor-modal) .unified-media-panel {
    width: 100vw;
    height: 100svh;
    max-width: 100vw;
    max-height: 100svh;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .unified-media-modal:not(.lightbox-mode):not(.youtube-player-mode):not(.thumbnail-editor-modal) .unified-media-body {
    height: 100svh;
    max-height: 100svh;
    overflow: hidden;
    padding: 0;
  }
}

/* 50-youtube-player-shell.css */
.unified-media-modal.youtube-player-mode:not(.lightbox-mode) {
  padding: 0;
}

.unified-media-modal.youtube-player-mode:not(.lightbox-mode) .unified-media-panel {
  display: grid;
  width: min(calc(100vw - 64px), calc((100svh - 64px) * 16 / 9));
  height: 100svh;
  max-height: 100svh;
  max-width: 1280px;
  place-items: center;
  border: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.unified-media-modal.youtube-player-mode:not(.lightbox-mode) .unified-media-head {
  position: fixed;
  z-index: 30;
  top: max(18px, env(safe-area-inset-top));
  right: max(18px, env(safe-area-inset-right));
  display: grid;
  width: 44px;
  height: 44px;
  min-height: 44px;
  place-items: center;
  overflow: visible;
  padding: 0;
  border: 0;
}

.unified-media-modal.youtube-player-mode:not(.lightbox-mode) .unified-media-head > div {
  display: none;
}

.unified-media-modal.youtube-player-mode:not(.lightbox-mode) .modal-close {
  position: static;
  inset: auto;
  display: grid;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  place-items: center;
  transform: none;
}

.unified-media-modal.youtube-player-mode:not(.lightbox-mode) .modal-close:hover {
  transform: scale(1.06);
}

.unified-media-modal.youtube-player-mode:not(.lightbox-mode) .unified-media-body {
  display: grid;
  width: 100%;
  height: 100svh;
  max-height: 100svh;
  place-items: center;
  overflow: visible;
  padding: 0;
}

.unified-media-modal.youtube-player-mode:not(.lightbox-mode) .unified-media-grid {
  display: grid;
  width: 100%;
  height: 100svh;
  max-height: 100svh;
  place-items: center;
}

.youtube-player-shell {
  position: relative;
  isolation: isolate;
  --youtube-player-control-top: 76px;
  --youtube-player-control-inline: 24px;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 18px;
  background: rgb(8, 8, 8);
}

.youtube-player-frame,
.youtube-player-unavailable {
  width: 100%;
  height: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border: 0;
  border-radius: 18px;
  background: rgb(8, 8, 8);
}

.youtube-player-frame {
  display: block;
  pointer-events: none;
}

.youtube-player-embed,
.youtube-player-iframe {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: inherit;
  overflow: hidden;
  pointer-events: none;
}

.youtube-player-poster {
  position: absolute;
  z-index: 2;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  opacity: 1;
  transition: opacity 180ms ease;
}

.youtube-player-shell.video-loaded:not(.video-paused) .youtube-player-poster {
  opacity: 0;
  pointer-events: none;
}

.youtube-player-unavailable {
  display: grid;
  place-items: center;
  color: rgb(238, 238, 238);
}

.youtube-player-shell .unified-video-play {
  z-index: 6;
}

.youtube-player-shell .unified-video-play > .video-control-icon,
.youtube-player-shell .unified-video-mute > .video-control-icon {
  position: static;
  inset: auto;
  margin: auto;
  transform: none;
}

.youtube-player-shell .unified-video-mute {
  z-index: 7;
  top: calc(var(--youtube-player-control-top) + 12px);
  right: auto;
  bottom: auto;
  left: var(--youtube-player-control-inline);
  opacity: 0;
  pointer-events: none;
}

.youtube-player-shell .unified-video-progress {
  z-index: 7;
  inset: var(--youtube-player-control-top) var(--youtube-player-control-inline) auto var(--youtube-player-control-inline);
  opacity: 0;
  pointer-events: none;
}

.youtube-player-shell.video-loaded .unified-video-mute,
.youtube-player-shell.video-paused .unified-video-mute,
.youtube-player-shell.video-loaded .unified-video-progress,
.youtube-player-shell.video-paused .unified-video-progress {
  opacity: 1;
  pointer-events: auto;
}

.youtube-player-shell.video-loaded:not(.video-paused) .unified-video-play {
  opacity: 0;
  pointer-events: none;
}

.youtube-player-shell.video-loaded:not(.video-paused):hover .unified-video-play,
.youtube-player-shell.video-loaded:not(.video-paused) .unified-video-play:focus-visible {
  opacity: 1;
  pointer-events: auto;
}

.youtube-player-shell.video-loading .unified-video-play {
  opacity: 1;
  pointer-events: auto;
}

/* 50-youtube-player-responsive.css */
@media (max-width: 767px) {
.unified-media-modal:not(.lightbox-mode) { padding: 0px; }

.unified-media-modal.youtube-player-mode:not(.lightbox-mode) .unified-media-panel {
  width: min(100vw, calc(100svh * 16 / 9));
  height: 100svh;
  max-height: 100svh;
  place-items: center;
}

.unified-media-modal.youtube-player-mode:not(.lightbox-mode) .unified-media-head {
  top: max(14px, calc(env(safe-area-inset-top) + 14px));
  right: max(20px, calc(env(safe-area-inset-right) + 20px));
}

.unified-media-modal.youtube-player-mode:not(.lightbox-mode) .unified-media-body {
  display: grid;
  width: 100%;
  height: 100svh;
  max-height: 100svh;
  place-items: center;
  padding: 0;
}

.unified-media-modal.youtube-player-mode:not(.lightbox-mode) .unified-media-grid {
  display: grid;
  width: 100%;
  height: 100svh;
  max-height: 100svh;
  place-items: center;
}

.unified-media-modal.youtube-player-mode:not(.lightbox-mode) .youtube-player-shell {
  width: min(100vw, calc(100svh * 16 / 9));
  max-height: 100svh;
}

.youtube-player-frame,
.youtube-player-unavailable {
  border-radius: 12px;
}

.youtube-player-shell {
  --youtube-player-control-top: 64px;
  --youtube-player-control-inline: 16px;
  border-radius: 12px;
}

.youtube-player-shell .unified-video-mute {
  top: calc(var(--youtube-player-control-top) + 12px);
  bottom: auto;
  left: var(--youtube-player-control-inline);
}

.youtube-player-shell .unified-video-progress {
  top: var(--youtube-player-control-top);
  right: var(--youtube-player-control-inline);
  bottom: auto;
  left: var(--youtube-player-control-inline);
}
}

@media (max-width: 1024px) and (max-height: 520px) {
.unified-media-modal.youtube-player-mode:not(.lightbox-mode) {
  padding: 0;
}

.unified-media-modal.youtube-player-mode:not(.lightbox-mode) .unified-media-panel {
  width: min(calc(100vw - 96px), calc(100svh * 16 / 9));
  height: 100svh;
  max-height: 100svh;
  place-items: center;
}

.unified-media-modal.youtube-player-mode:not(.lightbox-mode) .unified-media-body,
.unified-media-modal.youtube-player-mode:not(.lightbox-mode) .unified-media-grid {
  display: grid;
  width: 100%;
  height: 100svh;
  max-height: 100svh;
  place-items: center;
  padding: 0;
}

.unified-media-modal.youtube-player-mode:not(.lightbox-mode) .youtube-player-shell {
  width: min(calc(100vw - 96px), calc(100svh * 16 / 9));
  max-height: 100svh;
}
}

/* 50-media-popup-motion.css */
@media (min-width: 768px) {
.unified-media-modal:not(.lightbox-mode) { transition: opacity 220ms cubic-bezier(0.22, 1, 0.36, 1), background 220ms cubic-bezier(0.22, 1, 0.36, 1); }

.unified-media-modal:not(.lightbox-mode) .unified-media-panel { transform: translate3d(0, 16px, 0) scale(0.985); transition: opacity 240ms cubic-bezier(0.22, 1, 0.36, 1), transform 280ms cubic-bezier(0.22, 1, 0.36, 1); will-change: opacity, transform; }

.unified-media-modal:not(.lightbox-mode).active:not(.closing) .unified-media-panel { transform: translate3d(0, 0, 0) scale(1); }

.unified-media-modal:not(.lightbox-mode).closing .unified-media-panel { transform: translate3d(0, 14px, 0) scale(0.985); }
}

/* 51-lightbox-base.css */
/* Lightbox base */

.unified-media-modal.lightbox-mode {
  --lightbox-vh: 100dvh;
  --lightbox-vw: 100vw;
  --lightbox-control-button-size: 44px;
  --lightbox-control-icon-size: 28px;
  --lightbox-nav-button-size: 56px;
  --lightbox-nav-icon-size: 32px;
  --lightbox-control-inset: 80px;
  --lightbox-download-button-size: 40px;
  --lightbox-download-icon-size: 28px;
  --lightbox-action-icon-gap: 10px;
  --lightbox-edge-inset: 36px;
  --lightbox-overlay-inset: 16px;
  --lightbox-text-overlay-inset: 24px;
  --lightbox-overlay-line-height: 16px;
  --lightbox-close-centerline-adjust-y: -6.5px;
  --lightbox-download-centerline-adjust-y: -5.5px;
  --lightbox-thumb-size: 48px;
  --lightbox-thumb-active-extra: 9.6px;
  --lightbox-thumb-active-size: 57.6px;
  --lightbox-thumb-active-scale: 1.2;
  --lightbox-index-gap: 20px;
  --lightbox-index-height: 16px;
  --media-vignette-gradient: linear-gradient(
    rgba(0, 0, 0, 0.64) 0%,
    rgba(0, 0, 0, 0.3) 18%,
    rgba(0, 0, 0, 0) 42%,
    rgba(0, 0, 0, 0) 58%,
    rgba(0, 0, 0, 0.42) 82%,
    rgba(0, 0, 0, 0.7) 100%
  );
  --dismiss-y: 0px;
  --dismiss-scale: 1;
  --dismiss-opacity: 1;
  padding: 0px;
  background: transparent;
  opacity: 1;
  pointer-events: auto;
}

.unified-media-modal.lightbox-mode .unified-media-panel,
body .unified-media-modal.lightbox-mode .unified-media-panel {
  width: var(--lightbox-vw);
  height: var(--lightbox-vh);
  max-width: var(--lightbox-vw);
  max-height: var(--lightbox-vh);
  border: 0px;
  border-radius: 0px;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  transform: none;
}

.unified-media-modal.lightbox-mode .unified-media-head {
  position: absolute;
  z-index: 30;
  display: block;
  min-height: 0px;
  border: 0px;
  opacity: 0;
  pointer-events: none;
  transform: none;
  transition: opacity 340ms cubic-bezier(0.22, 1, 0.36, 1);
}

.unified-media-modal.lightbox-mode .unified-media-head > div,
.unified-media-modal.lightbox-mode .unified-media-gallery {
  display: none;
}

.unified-media-modal.lightbox-mode .unified-media-body,
.unified-media-modal.lightbox-mode .unified-media-grid,
.unified-media-modal.lightbox-mode .unified-media-only,
.unified-media-modal.lightbox-mode .unified-media-carousel,
.unified-media-modal.lightbox-mode .unified-media-track,
.unified-media-modal.lightbox-mode .unified-media-stage {
  height: var(--lightbox-vh);
  max-height: var(--lightbox-vh);
}

.unified-media-modal.lightbox-mode .unified-media-body,
.unified-media-modal.lightbox-mode .unified-media-grid,
.unified-media-modal.lightbox-mode .unified-media-only {
  overflow: hidden;
  padding: 0px;
}

.unified-media-modal.lightbox-mode .unified-media-carousel {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-rows: minmax(0px, 1fr);
  overflow: hidden;
}

.unified-media-modal.lightbox-mode .unified-media-track {
  display: grid;
  grid-auto-rows: var(--lightbox-vh);
  grid-template-columns: repeat(3, var(--lightbox-vw));
  width: calc(3 * var(--lightbox-vw));
  transform: translate3d(calc(-1 * var(--lightbox-vw) + var(--swipe-x, 0px)), 0, 0);
  transition: transform 360ms cubic-bezier(0.2, 0.86, 0.24, 1);
  will-change: transform;
}

.unified-media-modal.lightbox-mode .unified-media-track.single {
  grid-template-columns: var(--lightbox-vw);
  width: var(--lightbox-vw);
  transform: translate3d(var(--swipe-x, 0px), 0, 0);
}

.unified-media-modal.lightbox-mode .unified-media-stage {
  position: relative;
  display: grid;
  width: var(--lightbox-vw);
  min-height: 0px;
  place-items: center;
  place-content: center;
  padding: 0px;
  aspect-ratio: auto;
  border-radius: 0px;
  background: transparent;
  transform: none;
  animation: none;
  touch-action: none;
}

.unified-media-modal.lightbox-mode .unified-media-stage :is(img, video) {
  user-select: none;
  -webkit-user-drag: none;
}

/* 51-lightbox-frame-youtube.css */
.unified-media-modal.lightbox-mode .unified-media-frame {
  position: relative;
  z-index: 2;
  isolation: isolate;
  overflow: hidden;
  --lightbox-frame-max-width: max(0px, calc(var(--lightbox-vw, 100vw) - var(--lightbox-pc-side-limit, var(--lightbox-pc-edge-limit, 100px)) - var(--lightbox-pc-side-limit, var(--lightbox-pc-edge-limit, 100px))));
  --lightbox-frame-max-height: max(0px, calc(var(--lightbox-vh, 100dvh) - var(--lightbox-pc-edge-limit, 100px) - var(--lightbox-pc-bottom-limit, 100px)));
  width: min(
    var(--lightbox-frame-max-width),
    calc(var(--lightbox-frame-max-height) * var(--media-ratio, 0.75))
  );
  max-width: var(--lightbox-frame-max-width);
  max-height: none;
  height: auto;
  aspect-ratio: var(--media-aspect, 3/4);
  border-radius: 0px;
  background: transparent;
  opacity: 0;
  transform: translateY(14px) scale(0.985);
  transition: opacity 340ms cubic-bezier(0.22, 1, 0.36, 1), transform 340ms cubic-bezier(0.22, 1, 0.36, 1);
}

.unified-media-modal.lightbox-mode .unified-media-frame > img,
.unified-media-modal.lightbox-mode .unified-media-frame > video {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
  opacity: 1;
  visibility: visible;
  backface-visibility: hidden;
}

.unified-media-modal.lightbox-mode .unified-media-stage.is-youtube-general .youtube-player-embed,
.unified-media-modal.lightbox-mode .unified-media-stage.is-youtube-general .youtube-player-iframe,
.unified-media-modal.lightbox-mode .unified-media-stage.is-youtube-general .youtube-player-poster,
.unified-media-modal.lightbox-mode .unified-media-stage.is-youtube-general .youtube-player-unavailable {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 0;
  overflow: hidden;
}

.unified-media-modal.lightbox-mode .unified-media-stage.is-youtube-general .youtube-player-embed,
.unified-media-modal.lightbox-mode .unified-media-stage.is-youtube-general .youtube-player-iframe {
  z-index: 1;
  display: block;
  pointer-events: none;
}

.unified-media-modal.lightbox-mode .unified-media-stage.is-youtube-general .youtube-player-poster {
  z-index: 2;
  display: block;
  object-fit: cover;
  object-position: center center;
  opacity: 1;
  transition: opacity 180ms ease;
}

.unified-media-modal.lightbox-mode .unified-media-stage.is-youtube-general.video-loaded:not(.video-paused) .youtube-player-poster {
  opacity: 0;
  pointer-events: none;
}

.unified-media-modal.lightbox-mode .unified-media-stage.is-youtube-general .youtube-player-unavailable {
  z-index: 3;
  display: grid;
  place-items: center;
  color: rgb(238, 238, 238);
  background: rgb(8, 8, 8);
}

.unified-media-modal.lightbox-mode .unified-media-frame::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  opacity: 1;
  pointer-events: none;
  background: var(--media-vignette-gradient);
}

/* 51-lightbox-controls.css */
.unified-media-modal.lightbox-mode .unified-media-nav {
  z-index: 24;
  opacity: 0;
  pointer-events: none;
  transition: opacity 340ms cubic-bezier(0.22, 1, 0.36, 1);
}

.unified-media-modal.lightbox-mode.active:not(.closing) .unified-media-nav {
  opacity: 1;
  pointer-events: auto;
}

.unified-media-modal.lightbox-mode.active:not(.lightbox-controls-positioned) .unified-media-nav {
  opacity: 0;
  pointer-events: none;
}

.unified-media-modal.lightbox-mode.active:has(.unified-media-stage.video-loading) .unified-media-nav {
  opacity: 0;
  pointer-events: none;
}

.unified-media-modal.lightbox-mode.closing .unified-media-nav,
.unified-media-modal.lightbox-mode.return-closing.closing .unified-media-nav,
.unified-media-modal.lightbox-mode.vertical-dismiss-close.closing .unified-media-nav {
  opacity: 0;
  pointer-events: none;
}

.unified-media-modal.lightbox-mode .unified-lightbox-close,
.unified-media-modal.lightbox-mode .unified-media-nav {
  display: grid;
  width: var(--lightbox-control-button-size);
  min-width: var(--lightbox-control-button-size);
  height: var(--lightbox-control-button-size);
  min-height: var(--lightbox-control-button-size);
  place-items: center;
  border: 0px;
  border-radius: 999px;
  color: rgb(255, 255, 255);
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  text-shadow: rgba(0, 0, 0, 0.78) 0px 2px 16px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.unified-media-modal.lightbox-mode .unified-media-nav {
  width: var(--lightbox-nav-button-size, var(--lightbox-control-button-size));
  min-width: var(--lightbox-nav-button-size, var(--lightbox-control-button-size));
  height: var(--lightbox-nav-button-size, var(--lightbox-control-button-size));
  min-height: var(--lightbox-nav-button-size, var(--lightbox-control-button-size));
}

.unified-media-modal.lightbox-mode .unified-media-head {
  display: none;
  pointer-events: none;
}

.unified-media-modal.lightbox-mode .unified-lightbox-close {
  position: absolute;
  z-index: 8;
  top: calc(
    var(--lightbox-text-overlay-inset)
    + var(--lightbox-mobile-visible-frame-offset, 0px)
    + var(--lightbox-close-centerline-adjust-y, 0px)
  );
  right: var(--lightbox-text-overlay-inset);
  width: var(--lightbox-control-icon-size);
  min-width: var(--lightbox-control-icon-size);
  height: var(--lightbox-control-icon-size);
  min-height: var(--lightbox-control-icon-size);
  padding: 0;
  cursor: pointer;
  opacity: 1;
  pointer-events: auto;
  transition:
    opacity 220ms cubic-bezier(0.22, 1, 0.36, 1),
    transform 160ms cubic-bezier(0.22, 1, 0.36, 1);
}

.unified-media-modal.lightbox-mode .unified-lightbox-close:hover {
  transform: scale(1.08);
}

.unified-media-modal.lightbox-mode .unified-lightbox-close .material-symbols-outlined,
.unified-media-modal.lightbox-mode .unified-lightbox-close .local-svg-icon,
.unified-media-modal.lightbox-mode .unified-media-nav .material-symbols-outlined,
.unified-media-modal.lightbox-mode .unified-media-nav .local-svg-icon {
  display: grid;
  place-items: center;
  width: var(--lightbox-control-icon-size);
  height: var(--lightbox-control-icon-size);
  font-size: var(--lightbox-control-icon-size);
  line-height: 1;
  font-variation-settings: "FILL" 0, "wght" 320, "GRAD" 0, "opsz" 40;
}

.unified-media-modal.lightbox-mode .unified-media-nav .material-symbols-outlined,
.unified-media-modal.lightbox-mode .unified-media-nav .local-svg-icon {
  width: var(--lightbox-nav-icon-size, var(--lightbox-control-icon-size));
  height: var(--lightbox-nav-icon-size, var(--lightbox-control-icon-size));
  font-size: var(--lightbox-nav-icon-size, var(--lightbox-control-icon-size));
  font-variation-settings: "FILL" 0, "wght" 460, "GRAD" 0, "opsz" 48;
}

/* 51-lightbox-strip-base.css */
.unified-media-modal.lightbox-mode .unified-media-strip {
  box-sizing: border-box;
  position: absolute;
  z-index: 25;
  right: 0px;
  bottom: 0px;
  left: 0px;
  display: flex;
  flex-wrap: nowrap;
  grid-auto-flow: column;
  grid-auto-columns: var(--lightbox-thumb-size, 64px);
  align-content: center;
  align-items: center;
  justify-content: safe center;
  justify-items: center;
  gap: 1px;
  height: calc(var(--lightbox-thumb-active-size, 64px) + env(safe-area-inset-bottom));
  padding: 0 12px env(safe-area-inset-bottom);
  overflow-x: auto;
  overflow-y: visible;
  scroll-padding-inline: 50%;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.44));
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
  transform: translateY(16px);
  transition: opacity 340ms cubic-bezier(0.22, 1, 0.36, 1), transform 340ms cubic-bezier(0.22, 1, 0.36, 1);
}

.unified-media-modal.lightbox-mode .unified-media-strip::-webkit-scrollbar {
  display: none;
}

.unified-media-modal.lightbox-mode .unified-media-thumb,
.unified-media-modal.lightbox-mode .unified-media-thumb img {
  --gallery-thumb-size: var(--lightbox-thumb-size, 64px);
  width: var(--lightbox-thumb-size, 64px);
  min-width: var(--lightbox-thumb-size, 64px);
  height: var(--lightbox-thumb-size, 64px);
  min-height: var(--lightbox-thumb-size, 64px);
}

.unified-media-modal.lightbox-mode .unified-media-thumb {
  appearance: none;
  position: relative;
  flex: 0 0 var(--lightbox-thumb-size, 64px);
  z-index: 1;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  margin: 0;
  padding: 0;
  border: 0px;
  border-radius: 0;
  outline: 0px;
  color: inherit;
  background: transparent;
  cursor: pointer;
  filter: brightness(0.7);
  box-shadow: none;
  scroll-snap-align: center;
  transform-origin: center center;
  transition:
    width 260ms cubic-bezier(0.2, 0.86, 0.24, 1),
    height 260ms cubic-bezier(0.2, 0.86, 0.24, 1),
    min-width 260ms cubic-bezier(0.2, 0.86, 0.24, 1),
    min-height 260ms cubic-bezier(0.2, 0.86, 0.24, 1),
    flex-basis 260ms cubic-bezier(0.2, 0.86, 0.24, 1),
    filter 210ms,
    opacity 210ms;
}

.unified-media-modal.lightbox-mode .unified-media-thumb img {
  display: block;
  border: 0;
  border-radius: 0;
  object-fit: cover;
  object-position: center center;
}

.unified-media-modal.lightbox-mode .unified-media-thumb img[hidden] {
  display: none;
}

/* 51-lightbox-thumbs.css */
/* Lightbox strip and thumb badges */

.unified-media-modal.lightbox-mode .unified-media-thumb.active {
  --gallery-thumb-size: var(--lightbox-thumb-active-size, 57.6px);
  flex-basis: var(--lightbox-thumb-active-size, 57.6px);
  width: var(--lightbox-thumb-active-size, 57.6px);
  min-width: var(--lightbox-thumb-active-size, 57.6px);
  height: var(--lightbox-thumb-active-size, 57.6px);
  min-height: var(--lightbox-thumb-active-size, 57.6px);
  z-index: 20;
  filter: brightness(1);
  transform: none;
  transform-origin: center center;
}

.unified-media-modal.lightbox-mode .unified-media-thumb.active img {
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  height: 100%;
  min-height: 100%;
  max-height: 100%;
  transform: none;
}

.unified-media-modal.lightbox-mode .unified-media-thumb .gallery-video-badge.material-symbols-outlined {
  display: grid;
  place-items: center;
  font-size: clamp(16px, calc(var(--gallery-thumb-size, 64px) * 0.34), 22px);
  line-height: 1;
}

.unified-media-modal.lightbox-mode .unified-media-thumb img.gallery-video-badge,
.unified-media-modal.lightbox-mode .unified-media-thumb img.local-svg-icon.gallery-video-badge,
.unified-media-modal.lightbox-mode .unified-media-thumb .gallery-video-badge,
.unified-media-modal.lightbox-mode .unified-media-thumb .local-svg-icon.gallery-video-badge {
  position: absolute;
  z-index: 24;
  inset: auto 3px 3px auto;
  width: clamp(16px, calc(var(--gallery-thumb-size, 64px) * 0.34), 22px);
  min-width: 0;
  max-width: 22px;
  height: clamp(16px, calc(var(--gallery-thumb-size, 64px) * 0.34), 22px);
  min-height: 0;
  max-height: 22px;
  object-fit: contain;
  color: rgba(255, 255, 255, 0.98);
  filter: drop-shadow(rgba(0, 0, 0, 0.88) 0 1px 5px);
  opacity: 0.96;
  transform: none;
  pointer-events: none;
}

@media (max-width: 1100px), (hover: none) and (pointer: coarse) {
  .unified-media-modal.lightbox-mode .unified-media-track {
    grid-template-columns: repeat(var(--media-count, 1), var(--lightbox-vw));
    width: calc(var(--media-count, 1) * var(--lightbox-vw));
    transform: translate3d(calc((var(--media-index, 0) * -1 * var(--lightbox-vw)) + var(--swipe-x, 0px)), 0, 0);
  }

  .unified-media-modal.lightbox-mode .unified-media-track.single {
    grid-template-columns: var(--lightbox-vw);
    width: var(--lightbox-vw);
  }

  .unified-media-modal.lightbox-mode .unified-media-strip {
    --lightbox-thumb-size: 48px;
    --lightbox-thumb-active-extra: 9.6px;
    --lightbox-thumb-active-size: 57.6px;
    grid-auto-columns: var(--lightbox-thumb-size);
    height: calc(var(--lightbox-thumb-active-size) + env(safe-area-inset-bottom));
    padding: 0 8px env(safe-area-inset-bottom);
  }

  .unified-media-modal.lightbox-mode .unified-media-thumb,
  .unified-media-modal.lightbox-mode .unified-media-thumb img {
    --gallery-thumb-size: var(--lightbox-thumb-size);
    width: var(--lightbox-thumb-size);
    min-width: var(--lightbox-thumb-size);
    height: var(--lightbox-thumb-size);
    min-height: var(--lightbox-thumb-size);
  }

  .unified-media-modal.lightbox-mode .unified-media-thumb {
    border-radius: 0;
  }

  .unified-media-modal.lightbox-mode .unified-media-thumb.active {
    --gallery-thumb-size: var(--lightbox-thumb-active-size);
    flex-basis: var(--lightbox-thumb-active-size);
    width: var(--lightbox-thumb-active-size);
    min-width: var(--lightbox-thumb-active-size);
    height: var(--lightbox-thumb-active-size);
    min-height: var(--lightbox-thumb-active-size);
  }

  .unified-media-modal.lightbox-mode .unified-media-thumb.active img {
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    height: 100%;
    min-height: 100%;
    max-height: 100%;
  }

  .unified-media-modal.lightbox-mode .unified-media-thumb img.gallery-video-badge,
  .unified-media-modal.lightbox-mode .unified-media-thumb img.local-svg-icon.gallery-video-badge,
  .unified-media-modal.lightbox-mode .unified-media-thumb .gallery-video-badge,
  .unified-media-modal.lightbox-mode .unified-media-thumb .local-svg-icon.gallery-video-badge {
    width: clamp(16px, calc(var(--gallery-thumb-size, 48px) * 0.38), 20px);
    max-width: 20px;
    height: clamp(16px, calc(var(--gallery-thumb-size, 48px) * 0.38), 20px);
    max-height: 20px;
  }
}

@media (min-width: 1101px) and (max-width: 1600px) and (max-height: 1100px) {
  .unified-media-modal.lightbox-mode {
    --lightbox-strip-size: var(--lightbox-thumb-active-size, 57.6px);
    --lightbox-strip-bottom: 0px;
    --lightbox-active-strip-size: var(--lightbox-strip-size);
    --lightbox-active-strip-bottom: 0px;
    --lightbox-thumb-size: 48px;
    --lightbox-thumb-active-extra: 9.6px;
    --lightbox-thumb-active-size: 57.6px;
  }

  .unified-media-modal.lightbox-mode .unified-media-strip {
    grid-auto-columns: var(--lightbox-thumb-size);
    height: calc(var(--lightbox-thumb-active-size) + env(safe-area-inset-bottom));
    padding: 0 8px env(safe-area-inset-bottom);
  }

  .unified-media-modal.lightbox-mode .unified-media-thumb,
  .unified-media-modal.lightbox-mode .unified-media-thumb img {
    --gallery-thumb-size: var(--lightbox-thumb-size);
    width: var(--lightbox-thumb-size);
    min-width: var(--lightbox-thumb-size);
    height: var(--lightbox-thumb-size);
    min-height: var(--lightbox-thumb-size);
  }

  .unified-media-modal.lightbox-mode .unified-media-thumb.active {
    --gallery-thumb-size: var(--lightbox-thumb-active-size);
    flex-basis: var(--lightbox-thumb-active-size);
    width: var(--lightbox-thumb-active-size);
    min-width: var(--lightbox-thumb-active-size);
    height: var(--lightbox-thumb-active-size);
    min-height: var(--lightbox-thumb-active-size);
  }

  .unified-media-modal.lightbox-mode .unified-media-thumb.active img {
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    height: 100%;
    min-height: 100%;
    max-height: 100%;
  }
}

/* 51-lightbox-motion.css */
/* Lightbox generic motion and loading states */

.unified-media-modal.lightbox-mode.active .unified-media-frame { opacity: 1; transform: none; }

.unified-media-modal.lightbox-mode.closing .unified-media-frame { opacity: 0; transform: translateY(12px) scale(0.985); }

.unified-media-modal.lightbox-mode.active .unified-media-strip { opacity: 1; transform: none; }

.unified-media-modal.lightbox-mode.closing .unified-media-strip { opacity: 0; transform: translateY(16px); }

.unified-media-modal.lightbox-mode .unified-media-track.all { grid-template-columns: repeat(var(--track-count, var(--media-count, 1)), var(--lightbox-vw, 100vw)); width: calc(var(--track-count, var(--media-count, 1)) * var(--lightbox-vw, 100vw)); transform: translate3d(calc((var(--media-index, 0) * -1 * var(--lightbox-vw, 100vw)) + var(--swipe-x, 0px)), 0, 0); transition: transform 360ms cubic-bezier(0.2, 0.86, 0.24, 1); animation: auto ease 0s 1 normal none running none; }

.unified-media-modal.lightbox-mode .unified-media-track.no-transition { transition: none; }

.unified-media-modal.lightbox-mode.swiping .unified-media-track { transition: none; }

.unified-media-modal.lightbox-mode.is-media-switching .unified-media-nav,
.unified-media-modal.lightbox-mode.is-media-switching .unified-media-frame > :is(.unified-media-file, .unified-media-resolution, .unified-media-download, .unified-media-original-link, .unified-lightbox-close) {
  transition: none;
}

.unified-media-modal.lightbox-mode.vertical-dismissing .unified-media-frame { opacity: var(--dismiss-opacity, 1); transform: translate3d(0, var(--dismiss-y, 0px), 0) scale(var(--dismiss-scale, 1)); transition: none; }

.unified-media-modal.lightbox-mode.vertical-dismiss-close .unified-media-frame, .unified-media-modal.lightbox-mode.vertical-dismiss-close.closing .unified-media-frame { opacity: var(--dismiss-opacity, 0); transform: translate3d(0, var(--dismiss-y, 0px), 0) scale(var(--dismiss-scale, 0.72)); }

.unified-media-modal.lightbox-mode .unified-media-stage:not(.is-current) .unified-media-frame > .unified-media-file, .unified-media-modal.lightbox-mode .unified-media-stage:not(.is-current) .unified-media-frame > .unified-media-resolution, .unified-media-modal.lightbox-mode .unified-media-stage:not(.is-current) .unified-media-frame > .unified-media-download, .unified-media-modal.lightbox-mode .unified-media-stage:not(.is-current) .unified-media-frame > .unified-media-original-link, .unified-media-modal.lightbox-mode .unified-media-stage:not(.is-current) .unified-media-frame > .unified-lightbox-close { opacity: 0; pointer-events: none; }

.unified-media-modal.lightbox-mode .unified-media-frame::before { content: ""; position: absolute; z-index: 0; inset: 0px; opacity: 0; background-image: var(--media-preview); background-position: center center; background-repeat: no-repeat; background-size: contain; transition: opacity 180ms; pointer-events: none; }

.unified-media-modal.lightbox-mode .unified-media-stage.is-loading .unified-media-frame::before { opacity: 1; }

.unified-media-modal.lightbox-mode .unified-media-stage.is-current .unified-media-frame > .unified-media-file, .unified-media-modal.lightbox-mode .unified-media-stage.is-current .unified-media-frame > .unified-media-resolution, .unified-media-modal.lightbox-mode .unified-media-stage.is-current .unified-media-frame > .unified-media-download, .unified-media-modal.lightbox-mode .unified-media-stage.is-current .unified-media-frame > .unified-media-original-link, .unified-media-modal.lightbox-mode .unified-media-stage.is-current .unified-media-frame > .unified-lightbox-close { pointer-events: auto; }

/* 51-lightbox-responsive.css */
/* Lightbox responsive layout and controls */

.unified-media-modal.lightbox-mode .unified-media-head {
  top: var(--lightbox-close-top, var(--lightbox-control-inset, 200px));
  right: var(--lightbox-close-right, var(--lightbox-control-inset, 200px));
  width: var(--lightbox-control-button-size);
  height: var(--lightbox-control-button-size);
  padding: 0;
}

.unified-media-modal.lightbox-mode .modal-close {
  position: absolute;
  inset: 0;
}

.unified-media-modal.lightbox-mode .unified-media-nav.prev {
  right: auto;
  left: calc(var(--lightbox-control-inset, 200px) - (var(--lightbox-nav-button-size, 56px) / 2));
}

.unified-media-modal.lightbox-mode .unified-media-nav.next {
  right: calc(var(--lightbox-control-inset, 200px) - (var(--lightbox-nav-button-size, 56px) / 2));
  left: auto;
}

.unified-media-modal.lightbox-mode .unified-media-nav {
  position: absolute;
  --lightbox-control-center: calc(var(--lightbox-vh, 100dvh) / 2);
  top: var(--lightbox-control-center);
  transform: translateY(-50%);
}

@media (max-width: 1100px), (hover: none) and (pointer: coarse) {
  .unified-media-modal.lightbox-mode {
    --lightbox-control-button-size: 32px;
    --lightbox-control-icon-size: 28px;
    --lightbox-nav-button-size: 44px;
    --lightbox-nav-icon-size: 32px;
    --lightbox-control-inset: 18px;
    --lightbox-mobile-control-top: calc(env(safe-area-inset-top) + 12px);
    --lightbox-mobile-control-side: calc(env(safe-area-inset-right) + 12px);
    --lightbox-mobile-control-bottom: calc(env(safe-area-inset-bottom) + 12px);
    --lightbox-mobile-control-gap: 12px;
    --lightbox-mobile-origin-link-height: 0px;
    --lightbox-mobile-control-height: max(var(--lightbox-control-button-size), var(--lightbox-mobile-origin-link-height));
    --lightbox-mobile-frame-safe-top: 0px;
    --lightbox-mobile-frame-safe-bottom: 0px;
    --lightbox-edge-inset: max(18px, env(safe-area-inset-right));
    --lightbox-thumb-size: 48px;
    --lightbox-thumb-active-extra: 9.6px;
    --lightbox-thumb-active-size: 57.6px;
    --lightbox-strip-size: var(--lightbox-thumb-active-size, 57.6px);
    --lightbox-strip-bottom: 0px;
    --lightbox-active-strip-size: 0px;
    --lightbox-active-strip-bottom: 0px;
    --lightbox-active-index-space: 0px;
    --lightbox-media-zone-height: calc(var(--lightbox-vh, 100dvh) - var(--lightbox-active-strip-size) - var(--lightbox-active-strip-bottom) - var(--lightbox-active-index-space));
    --lightbox-control-center: calc(var(--lightbox-media-zone-height) / 2);
    place-items: stretch;
    padding: 0;
  }

  .unified-media-modal.lightbox-mode.has-lightbox-strip {
    --lightbox-active-strip-size: var(--lightbox-strip-size);
    --lightbox-active-strip-bottom: var(--lightbox-strip-bottom);
    --lightbox-active-index-space: 32px;
  }

  .unified-media-modal.lightbox-mode .unified-media-panel {
    width: var(--lightbox-vw, 100vw);
    height: var(--lightbox-vh, 100dvh);
    max-width: none;
    max-height: none;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .unified-media-modal.lightbox-mode .unified-media-body,
  .unified-media-modal.lightbox-mode .unified-media-grid,
  .unified-media-modal.lightbox-mode .unified-media-only,
  .unified-media-modal.lightbox-mode .unified-media-carousel {
    width: var(--lightbox-vw, 100vw);
    height: var(--lightbox-vh, 100dvh);
    max-width: none;
    max-height: none;
    overflow: hidden;
    padding: 0;
  }

  .unified-media-modal.lightbox-mode .unified-media-stage {
    box-sizing: border-box;
    position: relative;
    display: block;
    width: var(--lightbox-vw, 100vw);
    min-width: var(--lightbox-vw, 100vw);
    height: var(--lightbox-media-zone-height);
    min-height: var(--lightbox-media-zone-height);
    max-height: var(--lightbox-media-zone-height);
    padding: 0;
    overflow: hidden;
    clip-path: inset(var(--lightbox-mobile-frame-safe-top) 0 var(--lightbox-mobile-frame-safe-bottom) 0);
  }

  .unified-media-modal.lightbox-mode .unified-media-frame {
    --lightbox-mobile-frame-height: calc(var(--lightbox-vw, 100vw) / var(--media-ratio, 0.75));
    --lightbox-mobile-frame-centered-top: calc((var(--lightbox-media-zone-height) - var(--lightbox-mobile-frame-height)) / 2);
    --lightbox-mobile-frame-top: var(--lightbox-mobile-frame-centered-top);
    --lightbox-mobile-visible-frame-offset: max(0px, calc(var(--lightbox-mobile-frame-safe-top) - var(--lightbox-mobile-frame-top)));
    position: absolute;
    top: var(--lightbox-mobile-frame-top);
    left: 0;
    width: var(--lightbox-vw, 100vw);
    height: var(--lightbox-mobile-frame-height);
    max-width: var(--lightbox-vw, 100vw);
    max-height: none;
    margin: 0;
    overflow: hidden;
  }

  .unified-media-modal.lightbox-mode:not(.vertical-dismissing):not(.vertical-dismiss-close):not(.origin-enter):not(.origin-close) .unified-media-frame {
    opacity: 1;
    transform: none;
  }

  .unified-media-modal.lightbox-mode .unified-media-frame > img,
  .unified-media-modal.lightbox-mode .unified-media-frame > video {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center center;
  }

  .unified-media-modal.lightbox-mode .unified-media-head {
    display: none;
    opacity: 0;
    pointer-events: none;
  }

  .unified-media-modal.lightbox-mode .unified-media-nav {
    width: var(--lightbox-nav-button-size);
    min-width: var(--lightbox-nav-button-size);
    height: var(--lightbox-nav-button-size);
    min-height: var(--lightbox-nav-button-size);
  }

  .unified-media-modal.lightbox-mode .unified-media-nav .material-symbols-outlined,
  .unified-media-modal.lightbox-mode .unified-media-nav .local-svg-icon {
    width: var(--lightbox-nav-icon-size);
    height: var(--lightbox-nav-icon-size);
    font-size: var(--lightbox-nav-icon-size);
  }

  .unified-media-modal.lightbox-mode .unified-media-nav {
    position: absolute;
    top: var(--lightbox-control-center);
    transform: translateY(-50%);
  }

  .unified-media-modal.lightbox-mode .unified-media-nav.prev {
    left: calc(var(--lightbox-text-overlay-inset) + (var(--lightbox-download-icon-size) / 2) - (var(--lightbox-nav-button-size) / 2));
  }

  .unified-media-modal.lightbox-mode .unified-media-nav.next {
    right: calc(var(--lightbox-text-overlay-inset) + (var(--lightbox-download-icon-size) / 2) - (var(--lightbox-nav-button-size) / 2));
  }

  .unified-media-modal.lightbox-mode .unified-media-strip {
    position: fixed;
    z-index: 40;
    right: auto;
    bottom: var(--lightbox-strip-bottom);
    left: 0;
    width: var(--lightbox-vw, 100vw);
    padding-bottom: 0;
  }
}

@media (min-width: 768px) and (hover: none) and (pointer: coarse) {
  .unified-media-modal.lightbox-mode {
    --lightbox-tablet-frame-gap: 20px;
  }

  .unified-media-modal.lightbox-mode .unified-media-stage {
    display: grid;
    place-items: center;
    place-content: center;
    overflow: hidden;
    clip-path: none;
  }

  .unified-media-modal.lightbox-mode .unified-media-frame {
    --lightbox-tablet-frame-max-width: calc(var(--lightbox-vw, 100vw) - (var(--lightbox-tablet-frame-gap) * 2));
    --lightbox-tablet-frame-max-height: calc(var(--lightbox-media-zone-height) - (var(--lightbox-tablet-frame-gap) * 2));
    --lightbox-mobile-visible-frame-offset: 0px;
    position: relative;
    top: auto;
    left: auto;
    width: min(
      var(--lightbox-tablet-frame-max-width),
      calc(var(--lightbox-tablet-frame-max-height) * var(--media-ratio, 0.75))
    );
    max-width: var(--lightbox-tablet-frame-max-width);
    height: auto;
    max-height: var(--lightbox-tablet-frame-max-height);
    margin: 0;
    aspect-ratio: var(--media-aspect, 3/4);
  }
}

@media (max-width: 767px), ((max-height: 767px) and (hover: none) and (pointer: coarse)) {
  .unified-media-modal.lightbox-mode {
    --lightbox-mobile-frame-limit: 0px;
    --lightbox-mobile-frame-available-height: max(1px, calc(var(--lightbox-vh, 100dvh) - var(--lightbox-mobile-frame-limit) - var(--lightbox-mobile-frame-limit)));
    --lightbox-media-zone-height: var(--lightbox-vh, 100dvh);
    --lightbox-control-center: calc(var(--lightbox-vh, 100dvh) / 2);
  }

  .unified-media-modal.lightbox-mode.has-lightbox-strip {
    --lightbox-mobile-frame-limit: calc(env(safe-area-inset-bottom) + var(--lightbox-thumb-active-size, 57.6px) + var(--lightbox-index-gap, 20px) + var(--lightbox-index-height, 16px) + var(--lightbox-index-gap, 20px));
    --lightbox-active-strip-size: 0px;
    --lightbox-active-strip-bottom: 0px;
    --lightbox-active-index-space: 0px;
  }

  .unified-media-modal.lightbox-mode .unified-media-stage {
    display: grid;
    height: var(--lightbox-vh, 100dvh);
    min-height: var(--lightbox-vh, 100dvh);
    max-height: var(--lightbox-vh, 100dvh);
    padding: var(--lightbox-mobile-frame-limit) 0;
    place-items: center;
    place-content: center;
    clip-path: none;
  }

  .unified-media-modal.lightbox-mode .unified-media-frame {
    --lightbox-mobile-frame-height: min(
      calc(var(--lightbox-vw, 100vw) / var(--media-ratio, 0.75)),
      var(--lightbox-mobile-frame-available-height)
    );
    --lightbox-mobile-visible-frame-offset: 0px;
    position: relative;
    top: auto;
    left: auto;
    width: var(--lightbox-vw, 100vw);
    height: var(--lightbox-mobile-frame-height);
    max-width: var(--lightbox-vw, 100vw);
    max-height: var(--lightbox-mobile-frame-available-height);
    margin: 0;
    aspect-ratio: auto;
  }

  .unified-media-modal.lightbox-mode .unified-media-frame > img,
  .unified-media-modal.lightbox-mode .unified-media-frame > video {
    object-fit: cover;
    object-position: center center;
  }
}

/* 51-lightbox-origin.css */
/* Lightbox desktop origin transitions */

.unified-media-modal.lightbox-mode.active .unified-media-dim {
  opacity: 1;
}

.unified-media-modal.lightbox-mode.direct-origin-close.closing .unified-media-dim,
.unified-media-modal.lightbox-mode.vertical-dismiss-close.closing .unified-media-dim {
  opacity: 0;
}

.unified-media-modal,
.unified-media-modal.lightbox-mode,
.unified-media-modal.lightbox-mode.active,
.unified-media-modal.lightbox-mode.closing,
.unified-media-modal.lightbox-mode.active.return-closing.closing {
  background: transparent;
}

@media (min-width: 1101px) and (hover: hover) and (pointer: fine) {
  .unified-media-modal.lightbox-mode {
    --lightbox-pc-strip-space: 0px;
    --lightbox-pc-media-zone-height: var(--lightbox-vh, 100svh);
    --lightbox-pc-edge-limit: 120px;
    --lightbox-pc-side-limit: 240px;
    --lightbox-control-inset: 200px;
    --lightbox-pc-bottom-limit: calc(var(--lightbox-thumb-active-size, 52.8px) + var(--lightbox-index-gap, 20px) + var(--lightbox-index-gap, 20px) + var(--lightbox-index-height, 16px));
    --lightbox-frame-max-width: max(0px, calc(var(--lightbox-vw, 100vw) - var(--lightbox-pc-side-limit) - var(--lightbox-pc-side-limit)));
    --lightbox-frame-max-height: max(0px, calc(var(--lightbox-vh, 100svh) - var(--lightbox-pc-edge-limit) - var(--lightbox-pc-bottom-limit)));
    --lightbox-overlay-inset: 16px;
    opacity: 1;
    pointer-events: auto;
  }

  .unified-media-modal.lightbox-mode .unified-media-panel,
  body .unified-media-modal.lightbox-mode .unified-media-panel,
  .unified-media-modal.lightbox-mode.return-closing .unified-media-panel,
  .unified-media-modal.lightbox-mode.return-closing.closing .unified-media-panel,
  .unified-media-modal.lightbox-mode.origin-enter .unified-media-panel,
  .unified-media-modal.lightbox-mode.origin-close .unified-media-panel {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .unified-media-modal.lightbox-mode .unified-media-carousel {
    display: grid;
    height: 100svh;
    max-height: 100svh;
    grid-template-rows: minmax(0, var(--lightbox-pc-media-zone-height)) var(--lightbox-pc-strip-space);
    align-items: stretch;
  }

  .unified-media-modal.lightbox-mode .unified-media-track {
    height: var(--lightbox-pc-media-zone-height);
    max-height: var(--lightbox-pc-media-zone-height);
    grid-auto-rows: var(--lightbox-pc-media-zone-height);
    align-self: stretch;
  }

  .unified-media-modal.lightbox-mode .unified-media-stage {
    display: grid;
    height: var(--lightbox-pc-media-zone-height);
    min-height: 0;
    max-height: var(--lightbox-pc-media-zone-height);
    box-sizing: border-box;
    padding: var(--lightbox-pc-edge-limit) var(--lightbox-pc-side-limit) var(--lightbox-pc-bottom-limit);
    place-items: center;
  }

  .unified-media-modal.lightbox-mode:not(.has-lightbox-strip) {
    --lightbox-pc-edge-limit: 60px;
    --lightbox-pc-side-limit: 60px;
    --lightbox-pc-bottom-limit: 60px;
  }

  .unified-media-modal.lightbox-mode .unified-media-stage::after {
    display: none;
    content: none;
  }

  .unified-media-modal.lightbox-mode .unified-media-stage.is-current .unified-media-frame,
  .unified-media-modal.lightbox-mode .unified-media-stage .unified-media-frame {
    position: relative;
    overflow: hidden;
    --lightbox-frame-max-width: max(0px, calc(var(--lightbox-vw, 100vw) - var(--lightbox-pc-side-limit) - var(--lightbox-pc-side-limit)));
    --lightbox-frame-max-height: max(0px, calc(var(--lightbox-vh, 100svh) - var(--lightbox-pc-edge-limit) - var(--lightbox-pc-bottom-limit)));
    max-height: none;
    place-self: center;
    isolation: isolate;
    opacity: 1;
    visibility: visible;
    transform-origin: center center;
    will-change: transform, opacity;
  }

  .unified-media-modal.lightbox-mode .unified-media-stage.is-current .unified-media-frame > img,
  .unified-media-modal.lightbox-mode .unified-media-stage.is-current .unified-media-frame > video,
  .unified-media-modal.lightbox-mode .unified-media-stage .unified-media-frame > img,
  .unified-media-modal.lightbox-mode .unified-media-stage .unified-media-frame > video {
    position: absolute;
    z-index: 1;
    inset: 0;
    opacity: 1;
    visibility: visible;
    filter: none;
    transform: none;
    backface-visibility: hidden;
  }

  .unified-media-modal.lightbox-mode .unified-media-stage.is-current .unified-media-frame::after,
  .unified-media-modal.lightbox-mode .unified-media-stage .unified-media-frame::after {
    content: "";
    position: absolute;
    z-index: 2;
    inset: 0;
    opacity: 1;
    pointer-events: none;
    background: linear-gradient(rgba(0, 0, 0, 0.64) 0%, rgba(0, 0, 0, 0.3) 18%, rgba(0, 0, 0, 0) 42%, rgba(0, 0, 0, 0) 58%, rgba(0, 0, 0, 0.42) 82%, rgba(0, 0, 0, 0.7) 100%);
    transition: none;
  }

  .unified-media-modal.lightbox-mode.origin-enter,
  .unified-media-modal.lightbox-mode.origin-close {
    opacity: 1;
    pointer-events: auto;
  }

  .unified-media-modal.lightbox-mode.origin-enter .unified-media-stage.is-current.is-loading::before {
    opacity: 0;
    visibility: hidden;
  }

  .unified-media-modal.lightbox-mode.origin-enter .unified-media-stage.is-current .unified-media-frame {
    opacity: 1;
    visibility: visible;
    transform: translate3d(var(--lightbox-origin-dx, 0px), var(--lightbox-origin-dy, 0px), 0) scale(var(--lightbox-origin-scale, 1));
    transform-origin: center center;
    transition: transform 430ms cubic-bezier(0.18, 0.86, 0.24, 1), opacity 430ms cubic-bezier(0.22, 1, 0.36, 1);
    will-change: transform;
  }

  .unified-media-modal.lightbox-mode.origin-enter.active .unified-media-stage.is-current .unified-media-frame {
    transform: translate3d(0, 0, 0) scale(1);
  }

  .unified-media-modal.lightbox-mode.origin-close.closing .unified-media-stage.is-current .unified-media-frame {
    opacity: 1;
    visibility: visible;
    transform: translate3d(var(--lightbox-origin-dx, 0px), var(--lightbox-origin-dy, 0px), 0) scale(var(--lightbox-origin-scale, 1));
    transform-origin: center center;
    transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1), opacity 180ms linear;
  }

  .unified-media-modal.lightbox-mode.return-closing.origin-close.closing .unified-media-stage.is-current .unified-media-frame {
    opacity: 0;
    transform: translate3d(var(--lightbox-origin-dx, 0px), var(--lightbox-origin-dy, 0px), 0) scale(var(--lightbox-origin-scale, 1));
    transition: transform 400ms cubic-bezier(0.22, 1, 0.36, 1), opacity 400ms cubic-bezier(0.22, 1, 0.36, 1);
  }

  .unified-media-modal.lightbox-mode:not(.origin-enter):not(.origin-close) .unified-media-stage.is-current .unified-media-frame {
    opacity: 1;
    visibility: visible;
    transform: translate3d(0, 0, 0) scale(1);
    transform-origin: center center;
    transition: none;
    will-change: transform;
  }

  .unified-media-modal.lightbox-mode.origin-enter .unified-media-stage.is-current .unified-media-frame > .unified-media-file,
  .unified-media-modal.lightbox-mode.origin-enter .unified-media-stage.is-current .unified-media-frame > .unified-media-resolution,
  .unified-media-modal.lightbox-mode.origin-enter .unified-media-stage.is-current .unified-media-frame > .unified-media-download,
  .unified-media-modal.lightbox-mode.origin-enter .unified-media-stage.is-current .unified-media-frame > .unified-lightbox-close,
  .unified-media-modal.lightbox-mode.origin-close .unified-media-stage.is-current .unified-media-frame > .unified-media-file,
  .unified-media-modal.lightbox-mode.origin-close .unified-media-stage.is-current .unified-media-frame > .unified-media-resolution,
  .unified-media-modal.lightbox-mode.origin-close .unified-media-stage.is-current .unified-media-frame > .unified-media-download,
  .unified-media-modal.lightbox-mode.origin-close .unified-media-stage.is-current .unified-media-frame > .unified-lightbox-close {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: none;
  }

  .unified-media-modal.lightbox-mode.return-closing.closing .unified-media-strip,
  .unified-media-modal.lightbox-mode.vertical-dismiss-close.closing .unified-media-strip {
    opacity: 0;
    transform: translate3d(0, 28px, 0);
    transition: opacity 400ms cubic-bezier(0.22, 1, 0.36, 1), transform 400ms cubic-bezier(0.22, 1, 0.36, 1);
  }
}

/* 51-lightbox-overlay.css */
/* Lightbox dimming and media overlays */

.unified-media-index {
  position: fixed;
  z-index: 42;
  top: auto;
  left: calc(var(--lightbox-vw, 100vw) / 2);
  color: #fff;
  font-size: 16px;
  font-weight: 680;
  line-height: 1;
  text-shadow: none;
  transform: translateX(-50%);
  pointer-events: none;
}

.unified-media-modal.lightbox-mode .unified-media-index {
  z-index: 42;
  opacity: 0;
  transition: opacity 400ms cubic-bezier(0.22, 1, 0.36, 1), transform 400ms cubic-bezier(0.22, 1, 0.36, 1);
  will-change: opacity, transform;
}

.unified-media-modal.lightbox-mode .unified-media-original-link {
  position: absolute;
  z-index: 6;
  top: auto;
  right: calc(var(--lightbox-text-overlay-inset) + var(--lightbox-download-icon-size) + var(--lightbox-action-icon-gap, 10px));
  bottom: calc(var(--lightbox-text-overlay-inset) + var(--lightbox-download-centerline-adjust-y, 0px));
  left: auto;
  display: inline-flex;
  width: var(--lightbox-download-icon-size);
  min-width: var(--lightbox-download-icon-size);
  max-width: var(--lightbox-download-icon-size);
  height: var(--lightbox-download-icon-size);
  min-height: var(--lightbox-download-icon-size);
  max-height: var(--lightbox-download-icon-size);
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: rgb(238, 238, 238);
  background: transparent;
  box-shadow: none;
  font-size: var(--lightbox-download-icon-size);
  line-height: var(--lightbox-download-icon-size);
  text-decoration: none;
  opacity: 0;
  pointer-events: none;
  transform: none;
  transition: opacity 340ms cubic-bezier(0.22, 1, 0.36, 1), transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.unified-media-modal.lightbox-mode.closing:not(.origin-close) {
  opacity: 0;
  pointer-events: none;
}

.unified-media-modal.lightbox-mode.closing:not(.origin-close) .unified-media-dim {
  opacity: 0;
}

.unified-media-modal.lightbox-mode.active:not(.closing) .unified-media-original-link:not([hidden]):hover {
  transform: scale(1.08);
}

.unified-media-modal.lightbox-mode .unified-media-original-link .card-action-icon,
.unified-media-modal.lightbox-mode .unified-media-original-link .material-symbols-outlined,
.unified-media-modal.lightbox-mode .unified-media-original-link .local-svg-icon {
  display: grid;
  width: var(--lightbox-download-icon-size);
  min-width: var(--lightbox-download-icon-size);
  max-width: var(--lightbox-download-icon-size);
  height: var(--lightbox-download-icon-size);
  min-height: var(--lightbox-download-icon-size);
  max-height: var(--lightbox-download-icon-size);
  place-items: center;
  color: currentColor;
  font-size: var(--lightbox-download-icon-size);
  line-height: var(--lightbox-download-icon-size);
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 28;
  transform: none;
}

.unified-media-modal.lightbox-mode .unified-media-original-link > span:not(.material-symbols-outlined):not(.local-svg-icon) {
  display: none;
}

.unified-media-modal.lightbox-mode .unified-media-frame > .unified-media-original-link {
  width: var(--lightbox-download-icon-size);
  min-width: var(--lightbox-download-icon-size);
  max-width: var(--lightbox-download-icon-size);
  height: var(--lightbox-download-icon-size);
  min-height: var(--lightbox-download-icon-size);
  max-height: var(--lightbox-download-icon-size);
}

.unified-media-modal.lightbox-mode.active .unified-media-index {
  opacity: 1;
}

.unified-media-modal.lightbox-mode.active:not(.closing) .unified-media-original-link:not([hidden]) {
  opacity: 1;
  pointer-events: auto;
}

.unified-media-modal.lightbox-mode.return-closing.closing .unified-media-index,
.unified-media-modal.lightbox-mode.vertical-dismiss-close.closing .unified-media-index {
  opacity: 0;
  transform: translateX(-50%) translateY(8px);
}

.unified-media-modal.lightbox-mode.closing .unified-media-original-link,
.unified-media-modal.lightbox-mode.return-closing.closing .unified-media-original-link,
.unified-media-modal.lightbox-mode.vertical-dismiss-close.closing .unified-media-original-link {
  opacity: 0;
  pointer-events: none;
}

.unified-media-modal.lightbox-mode .unified-media-frame > :is(.unified-media-file, .unified-media-resolution, .unified-media-download, .unified-media-original-link) {
  position: absolute;
  z-index: 5;
  box-sizing: border-box;
  color: rgb(238, 238, 238);
  height: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
  filter: none;
  text-shadow: none;
  mix-blend-mode: normal;
  transform: none;
  transition: opacity 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.unified-media-modal.lightbox-mode .unified-media-frame > :is(.unified-media-file, .unified-media-resolution) {
  display: block;
  font-size: 16px;
  font-weight: 600;
  line-height: var(--lightbox-overlay-line-height);
}

.unified-media-modal.lightbox-mode .unified-media-frame > .unified-media-file {
  top: var(--lightbox-text-overlay-inset);
  right: var(--lightbox-text-overlay-inset);
  bottom: auto;
  left: var(--lightbox-text-overlay-inset);
  max-width: calc(100% - (var(--lightbox-text-overlay-inset) * 2));
}

.unified-media-modal.lightbox-mode .unified-media-frame > .unified-media-resolution {
  top: auto;
  right: calc(var(--lightbox-overlay-inset) + 56px + var(--lightbox-download-icon-size) + var(--lightbox-action-icon-gap, 10px));
  bottom: var(--lightbox-text-overlay-inset);
  left: var(--lightbox-text-overlay-inset);
  display: block;
  height: auto;
  min-height: 0;
  max-width: calc(100% - (var(--lightbox-overlay-inset) * 2) - 56px - var(--lightbox-download-icon-size) - var(--lightbox-action-icon-gap, 10px));
}

.unified-media-modal.lightbox-mode .unified-media-frame > .unified-media-download.media-download-icon-button {
  top: auto;
  right: var(--lightbox-text-overlay-inset);
  bottom: calc(var(--lightbox-text-overlay-inset) + var(--lightbox-download-centerline-adjust-y, 0px));
  left: auto;
  display: inline-flex;
  width: var(--lightbox-download-icon-size);
  min-width: var(--lightbox-download-icon-size);
  max-width: var(--lightbox-download-icon-size);
  height: var(--lightbox-download-icon-size);
  min-height: var(--lightbox-download-icon-size);
  max-height: var(--lightbox-download-icon-size);
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: rgb(238, 238, 238);
  background: transparent;
  box-shadow: none;
  text-decoration: none;
}

.unified-media-modal.lightbox-mode .unified-media-frame > .unified-media-download.media-download-icon-button .card-action-icon,
.unified-media-modal.lightbox-mode .unified-media-frame > .unified-media-download.media-download-icon-button .material-symbols-outlined,
.unified-media-modal.lightbox-mode .unified-media-frame > .unified-media-download.media-download-icon-button .local-svg-icon {
  flex: 0 0 var(--lightbox-download-icon-size);
  width: var(--lightbox-download-icon-size);
  min-width: var(--lightbox-download-icon-size);
  max-width: var(--lightbox-download-icon-size);
  height: var(--lightbox-download-icon-size);
  min-height: var(--lightbox-download-icon-size);
  max-height: var(--lightbox-download-icon-size);
  font-size: var(--lightbox-download-icon-size);
  line-height: var(--lightbox-download-icon-size);
}

.unified-media-modal.lightbox-mode.lightbox-video-chrome-hidden
  :is(
    .unified-media-strip,
    .unified-media-nav
  ),
.unified-media-modal.lightbox-mode .unified-media-stage.lightbox-video-chrome-hidden
  .unified-media-frame
  > :is(.unified-media-file, .unified-media-resolution, .unified-media-download, .unified-media-original-link, .unified-lightbox-close, .unified-video-play, .unified-video-mute, .unified-video-progress, .unified-video-fullscreen) {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 220ms cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear 220ms;
}

@media (min-width: 768px) {
  .unified-media-index {
    top: auto;
    bottom: calc(80px + 8px);
  }
}

@media (max-width: 1100px), (hover: none) and (pointer: coarse) {
  .unified-media-modal.lightbox-mode {
    --lightbox-overlay-inset: 12px;
    --lightbox-text-overlay-inset: 18px;
  }

  .unified-media-modal.lightbox-mode .unified-media-frame > .unified-media-file {
    top: calc(var(--lightbox-text-overlay-inset) + var(--lightbox-mobile-visible-frame-offset, 0px));
  }

  .unified-media-index {
    top: auto;
    bottom: calc(env(safe-area-inset-bottom) + var(--lightbox-thumb-active-size, 57.6px) + var(--lightbox-index-gap, 20px));
  }
}

@media (min-width: 1101px) and (max-width: 1600px) and (max-height: 1100px) {
  .unified-media-index {
    top: auto;
    bottom: calc(env(safe-area-inset-bottom) + var(--lightbox-thumb-active-size, 57.6px) + var(--lightbox-index-gap, 20px));
  }
}

.unified-media-modal.lightbox-mode .unified-media-index {
  bottom: calc(env(safe-area-inset-bottom) + var(--lightbox-thumb-active-size, 57.6px) + var(--lightbox-index-gap, 20px));
  left: calc(var(--lightbox-vw, 100vw) / 2);
}

.unified-media-modal.lightbox-mode .unified-media-frame > .unified-media-original-link {
  display: inline-flex;
  width: var(--lightbox-download-icon-size);
  min-width: var(--lightbox-download-icon-size);
  max-width: var(--lightbox-download-icon-size);
  height: var(--lightbox-download-icon-size);
  min-height: var(--lightbox-download-icon-size);
  max-height: var(--lightbox-download-icon-size);
  align-items: center;
  justify-content: center;
}

/* 52-media-loading-spinners.css */
.feed-loading-state {
  min-height: 260px;
  display: grid;
  place-items: center;
}

.feed-loading-state .material-symbols-outlined {
  color: rgba(224, 255, 139, 0.86);
  font-size: 34px;
  font-variation-settings: "FILL" 0, "wght" 260, "GRAD" 0, "opsz" 32;
  animation: 860ms linear infinite bunny-spin;
}

body[data-page="feed"] .feed-loading-state {
  position: fixed;
  z-index: 120;
  inset: 0;
  display: grid;
  place-items: center;
  width: 100vw;
  height: 100dvh;
  min-height: 100dvh;
  margin: 0;
  pointer-events: none;
  background: transparent;
}

body[data-page="feed"] .feed-loading-state .material-symbols-outlined,
body[data-page="feed"] .feed-loading-state .loading-svg-icon {
  box-sizing: border-box;
  display: block;
  width: 38px;
  min-width: 38px;
  max-width: 38px;
  height: 38px;
  min-height: 38px;
  max-height: 38px;
  border: 4px solid rgba(255, 255, 255, 0.28);
  border-top-color: rgba(255, 255, 255, 0.98);
  border-radius: 50%;
  color: transparent;
  font-size: 0;
  line-height: 0;
  text-indent: -9999px;
  transform-origin: 50% 50%;
  animation: 620ms linear infinite bunnySpinInPlace;
}

.scrape-status-spinner {
  display: none;
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  border: 2px solid rgba(255, 255, 255, 0.24);
  border-top-color: rgba(255, 255, 255, 0.98);
  border-radius: 50%;
  animation: 720ms linear infinite scrape-status-spin;
}

.scrape-progress[data-state="running"] + .scrape-request-status .scrape-status-spinner {
  display: inline-block;
}

/* Unified media loading ownership: popup, lightbox, editor, and thumbnail editor. */
.unified-media-modal .unified-media-stage.is-loading,
.unified-media-modal .unified-media-tile.is-loading {
  background: transparent;
}

.unified-media-modal .unified-media-stage.is-loading::before,
.unified-media-modal .unified-media-tile.is-loading::before {
  content: "";
  box-sizing: border-box;
  position: absolute;
  z-index: 6;
  top: 50%;
  left: 50%;
  width: 24px;
  height: 24px;
  margin: 0;
  border: 3px solid rgba(255, 255, 255, 0.28);
  border-top-color: rgb(255, 255, 255);
  border-radius: 50%;
  background: transparent;
  transform-origin: 50% 50%;
  animation: 720ms linear infinite bunnySpinCentered;
}

.unified-media-modal .unified-media-stage.is-loading::after,
.unified-media-modal .unified-media-tile.is-loading::after,
.unified-media-modal .unified-media-stage.is-loading img,
.unified-media-modal .unified-media-tile.is-loading img,
.unified-media-modal .unified-media-stage.is-loading .unified-media-file,
.unified-media-modal .unified-media-tile.is-loading .unified-media-file,
.unified-media-modal .unified-media-stage.is-loading .unified-media-resolution,
.unified-media-modal .unified-media-tile.is-loading .unified-media-resolution,
.unified-media-modal .unified-media-stage.is-loading .unified-media-download,
.unified-media-modal .unified-media-tile.is-loading .unified-media-download,
.unified-media-modal .unified-media-stage.is-media-error::after,
.unified-media-modal .unified-media-tile.is-media-error::after {
  opacity: 0;
}

.unified-media-modal.lightbox-mode .unified-media-stage.is-current.is-loading .unified-media-frame > :is(.unified-media-file, .unified-media-resolution, .unified-media-download, .unified-media-original-link, .unified-lightbox-close) {
  opacity: 1;
}

.unified-media-modal.lightbox-mode .unified-media-stage.video-seeking::before {
  content: none;
  display: none;
}

.unified-media-modal.lightbox-mode .unified-media-stage.video-seeking .unified-video-play {
  display: grid;
  opacity: 1;
  visibility: visible;
  pointer-events: none;
}

.unified-media-modal.lightbox-mode .unified-media-stage.video-seeking .unified-video-play::before {
  content: "";
  grid-area: 1 / 1;
  place-self: center;
  box-sizing: border-box;
  width: calc(var(--video-play-button-size, 58px) * var(--video-play-spinner-ratio, 0.6));
  height: calc(var(--video-play-button-size, 58px) * var(--video-play-spinner-ratio, 0.6));
  border: max(3px, calc(var(--video-play-button-size, 58px) * 0.075)) solid rgba(255, 255, 255, 0.26);
  border-top-color: rgba(255, 255, 255, 0.98);
  border-radius: 50%;
  background: transparent;
  pointer-events: none;
  transform-origin: 50% 50%;
  animation: 720ms linear infinite bunnyVideoPlaySpinner;
}

.unified-media-modal.lightbox-mode .unified-media-stage.video-seeking .unified-video-play > .video-control-icon,
.unified-media-modal.lightbox-mode .unified-media-stage.video-seeking .unified-video-play > .loading-svg-icon,
.unified-media-modal.lightbox-mode .unified-media-stage.video-seeking .unified-video-play > .material-symbols-outlined,
.unified-media-modal.lightbox-mode .unified-media-stage.video-seeking .unified-video-play > svg,
.unified-media-modal.lightbox-mode .unified-media-stage.video-seeking .unified-video-play .video-control-icon,
.unified-media-modal.lightbox-mode .unified-media-stage.video-seeking .unified-video-play .loading-svg-icon,
.unified-media-modal.lightbox-mode .unified-media-stage.video-seeking .unified-video-play .material-symbols-outlined,
.unified-media-modal.lightbox-mode .unified-media-stage.video-seeking .unified-video-play svg,
.unified-media-modal.lightbox-mode .unified-media-stage.video-seeking .unified-video-play > img.local-svg-icon {
  opacity: 0;
  visibility: hidden;
}

/* 52-video-play-button.css */
.card-media .card-media-video,
.unified-media-video {
  pointer-events: none;
}

.card-media.video-loaded .card-media-img,
.unified-media-stage.video-loaded > img,
.unified-media-tile.video-loaded > img,
.unified-media-stage.video-loaded .unified-media-frame > img,
.unified-media-tile.video-loaded .unified-media-frame > img {
  opacity: 0;
}

.card-video-play,
.unified-video-play {
  --video-play-button-size: 58px;
  --video-play-spinner-ratio: 0.6;
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  width: var(--video-play-button-size);
  height: var(--video-play-button-size);
  place-items: center;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.94);
  background: rgba(0, 0, 0, 0.18);
  box-shadow: var(--bunny-emboss-border-shadow);
  cursor: pointer;
  visibility: visible;
  transform: translate(-50%, -50%);
  transition:
    opacity 180ms,
    transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
  backdrop-filter: blur(14px) saturate(1.25);
}

.card-video-play {
  z-index: 7;
}

.unified-video-play {
  z-index: 3;
}

.card-video-play:hover,
.unified-video-play:hover {
  transform: translate(-50%, -50%) scale(1.06);
}

.card-video-play > .video-control-icon,
.unified-video-play > .video-control-icon,
.card-video-play:not(.loading) > img.local-svg-icon.video-control-icon,
.unified-video-play:not(.loading) > img.local-svg-icon.video-control-icon {
  position: absolute;
  inset: 50% auto auto 50%;
  display: block;
  width: 42px;
  min-width: 42px;
  max-width: 42px;
  height: 42px;
  min-height: 42px;
  max-height: 42px;
  margin: 0;
  object-fit: contain;
  pointer-events: none;
  transform: translate(-50%, -50%);
  transform-origin: center center;
}

.card-video-play > .material-symbols-outlined.video-control-icon,
.unified-video-play > .material-symbols-outlined.video-control-icon,
.card-video-play .material-symbols-outlined,
.unified-video-play .material-symbols-outlined {
  display: grid;
  place-items: center;
  color: rgba(255, 255, 255, 0.96);
  font-size: 42px;
  line-height: 1;
  text-align: center;
  text-indent: 0;
  font-variation-settings: "FILL" 1, "wght" 520, "GRAD" 0, "opsz" 48;
}

.card-video-play > .material-symbols-outlined.video-control-icon[data-symbol-name="pause"],
.unified-video-play > .material-symbols-outlined.video-control-icon[data-symbol-name="pause"],
.card-video-play .material-symbols-outlined[data-symbol-name="pause"],
.unified-video-play .material-symbols-outlined[data-symbol-name="pause"] {
  font-variation-settings: "FILL" 1, "wght" 430, "GRAD" 0, "opsz" 48;
}

.card-video-play.loading,
.unified-video-play.loading,
.unified-media-modal .unified-video-play.loading {
  display: grid;
  place-items: center;
  overflow: visible;
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}

.card-video-play.loading > .video-control-icon,
.card-video-play.loading > .loading-svg-icon,
.card-video-play.loading > .material-symbols-outlined,
.unified-video-play.loading > .video-control-icon,
.unified-video-play.loading > .loading-svg-icon,
.unified-video-play.loading > .material-symbols-outlined,
.unified-media-modal .unified-video-play.loading > .video-control-icon,
.unified-media-modal .unified-video-play.loading > .loading-svg-icon,
.unified-media-modal .unified-video-play.loading > .material-symbols-outlined {
  display: none;
}

.card-video-play.loading::before,
.unified-video-play.loading::before,
.unified-media-modal .unified-video-play.loading::before {
  content: "";
  grid-area: 1 / 1;
  place-self: center;
  box-sizing: border-box;
  width: calc(var(--video-play-button-size) * var(--video-play-spinner-ratio));
  height: calc(var(--video-play-button-size) * var(--video-play-spinner-ratio));
  border: max(3px, calc(var(--video-play-button-size) * 0.075)) solid rgba(255, 255, 255, 0.28);
  border-top-color: rgb(255, 255, 255);
  border-radius: 50%;
  background: transparent;
  transform-origin: 50% 50%;
  animation: 720ms linear infinite bunnyVideoPlaySpinner;
  pointer-events: none;
}

.unified-media-stage:has(.unified-video-play.loading)::before,
.unified-media-tile:has(.unified-video-play.loading)::before {
  content: none;
  display: none;
  animation: none;
}

.unified-media-stage.video-loading::before,
.unified-media-tile.video-loading::before {
  content: none;
  display: none;
  animation: none;
}

.unified-media-stage.is-loading .unified-video-play,
.unified-media-tile.is-loading .unified-video-play {
  opacity: 0;
  pointer-events: none;
}

/* 52-video-progress-mute.css */
.card-video-progress,
.unified-video-progress {
  position: absolute;
  z-index: 7;
  inset: 58px 18px auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
  color: rgba(255, 255, 255, 0.92);
  font-size: 14px;
  font-weight: 520;
  text-shadow: none;
  transition: opacity 220ms;
  opacity: 0;
  pointer-events: none;
}

.card-video-progress[hidden],
.unified-video-progress[hidden] {
  display: none;
}

.card-video-scrub,
.unified-video-scrub {
  grid-column: 1 / -1;
  width: 100%;
  height: 6px;
  margin: 0;
  appearance: none;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.98) 0 var(--video-progress, 0%), rgba(255, 255, 255, 0.28) var(--video-progress, 0%) 100%);
  cursor: pointer;
}

.card-video-scrub::-webkit-slider-thumb,
.unified-video-scrub::-webkit-slider-thumb {
  width: 14px;
  height: 14px;
  appearance: none;
  border: 1px solid rgba(255, 255, 255, 0.66);
  border-radius: 50%;
  background: rgb(255, 255, 255);
  box-shadow: rgba(0, 0, 0, 0.35) 0 2px 10px;
}

.card-video-time,
.unified-video-time {
  justify-self: end;
  min-height: 0;
  padding-top: 10px;
  padding-left: 36px;
  line-height: 1;
  text-align: right;
  transform: none;
}

.card-video-mute,
.unified-video-mute {
  position: absolute;
  top: 78px;
  right: auto;
  bottom: auto;
  left: 14px;
  display: grid;
  width: 28px;
  min-width: 28px;
  height: 28px;
  min-height: 28px;
  place-items: center;
  border: 0;
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.94);
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  opacity: 0;
  visibility: visible;
  cursor: pointer;
  pointer-events: none;
  touch-action: manipulation;
  text-shadow: none;
  transition:
    opacity 220ms,
    transform 160ms cubic-bezier(0.22, 1, 0.36, 1),
    color 160ms;
  -webkit-tap-highlight-color: transparent;
}

.card-video-mute {
  z-index: 32;
}

.unified-video-mute {
  z-index: 7;
}

.card-video-mute:hover,
.unified-video-mute:hover {
  color: rgb(255, 255, 255);
  transform: scale(1.08);
}

.card-video-mute .video-control-icon,
.card-video-mute .material-symbols-outlined,
.unified-video-mute .video-control-icon,
.unified-video-mute .material-symbols-outlined {
  width: 24px;
  max-width: 24px;
  height: 24px;
  max-height: 24px;
  margin: auto;
  object-fit: contain;
  font-size: 21px;
  line-height: 21px;
  pointer-events: none;
  font-variation-settings: "FILL" 0, "wght" 430, "GRAD" 0, "opsz" 24;
}

.unified-media-modal .unified-video-mute .video-control-icon,
.unified-media-modal .unified-video-mute .material-symbols-outlined {
  width: 26px;
  max-width: 26px;
  height: 26px;
  max-height: 26px;
  font-size: 26px;
  line-height: 26px;
  opacity: 1;
  visibility: visible;
  transform: none;
}

.card-media.video-loaded .card-video-mute,
.card-media.video-paused .card-video-mute,
.card-media.video-loaded .card-video-progress,
.card-media.video-paused .card-video-progress,
.unified-media-stage.video-loaded .unified-video-mute,
.unified-media-stage.video-paused .unified-video-mute,
.unified-media-tile.video-loaded .unified-video-mute,
.unified-media-tile.video-paused .unified-video-mute,
.unified-media-stage.video-loaded .unified-video-progress,
.unified-media-stage.video-paused .unified-video-progress,
.unified-media-tile.video-loaded .unified-video-progress,
.unified-media-tile.video-paused .unified-video-progress {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.card-media.video-loaded:not(.video-paused) .card-video-play,
.unified-media-stage.video-loaded:not(.video-paused) .unified-video-play,
.unified-media-tile.video-loaded:not(.video-paused) .unified-video-play {
  opacity: 0;
  pointer-events: none;
}

.card-media.video-loaded.video-paused .card-video-play,
.unified-media-stage.video-loaded.video-paused .unified-video-play,
.unified-media-tile.video-loaded.video-paused .unified-video-play {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.card-media.video-loaded:not(.video-paused):hover .card-video-play,
.card-media.video-loaded:not(.video-paused) .card-video-play:focus-visible,
.unified-media-stage.video-loaded:not(.video-paused):hover .unified-video-play,
.unified-media-stage.video-loaded:not(.video-paused) .unified-video-play:focus-visible,
.unified-media-tile.video-loaded:not(.video-paused):hover .unified-video-play,
.unified-media-tile.video-loaded:not(.video-paused) .unified-video-play:focus-visible {
  opacity: 1;
  pointer-events: auto;
}

.unified-media-modal.lightbox-mode .unified-media-stage.video-loaded:not(.video-paused):hover .unified-video-play {
  opacity: 0;
  pointer-events: none;
}

.unified-media-modal.lightbox-mode .unified-media-stage.video-loaded:not(.video-paused).lightbox-video-controls-visible .unified-video-play,
.unified-media-modal.lightbox-mode .unified-media-stage.video-loaded:not(.video-paused) .unified-video-play:focus-visible {
  opacity: 1;
  pointer-events: auto;
}

.unified-media-modal.lightbox-mode .unified-media-stage.video-loaded:not(.video-paused):not(.video-loading):not(.lightbox-video-controls-visible) .unified-video-mute,
.unified-media-modal.lightbox-mode .unified-media-stage.video-loaded:not(.video-paused):not(.video-loading):not(.lightbox-video-controls-visible) .unified-video-progress {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.card-video-mute.is-audio-disabled,
.card-video-mute[data-video-has-audio="0"],
.card-video-mute[disabled],
.unified-video-mute.is-audio-disabled,
.unified-video-mute[data-video-has-audio="0"],
.unified-video-mute[disabled] {
  color: rgba(255, 255, 255, 0.42);
  opacity: 0.48;
  cursor: default;
  filter: grayscale(1) brightness(0.72);
  pointer-events: none;
  transform: none;
}

.card-video-mute.is-audio-disabled:hover,
.card-video-mute[data-video-has-audio="0"]:hover,
.card-video-mute[disabled]:hover,
.unified-video-mute.is-audio-disabled:hover,
.unified-video-mute[data-video-has-audio="0"]:hover,
.unified-video-mute[disabled]:hover {
  color: rgba(255, 255, 255, 0.42);
  transform: none;
}

.card-video-mute.is-audio-disabled .video-control-icon,
.card-video-mute[data-video-has-audio="0"] .video-control-icon,
.unified-video-mute.is-audio-disabled .video-control-icon,
.unified-video-mute[data-video-has-audio="0"] .video-control-icon {
  opacity: 0.72;
  filter: grayscale(1) brightness(0.72);
}

.unified-media-modal .unified-media-stage:not(.video-loaded):not(.video-paused) .unified-video-mute,
.unified-media-modal .unified-media-tile:not(.video-loaded):not(.video-paused) .unified-video-mute {
  display: grid;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.unified-media-modal .unified-media-stage.video-loaded .unified-video-mute,
.unified-media-modal .unified-media-stage.video-paused .unified-video-mute,
.unified-media-modal .unified-media-tile.video-loaded .unified-video-mute,
.unified-media-modal .unified-media-tile.video-paused .unified-video-mute {
  display: grid;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.unified-media-modal .unified-media-stage.video-loaded .unified-video-mute.is-audio-disabled,
.unified-media-modal .unified-media-stage.video-paused .unified-video-mute.is-audio-disabled,
.unified-media-modal .unified-media-tile.video-loaded .unified-video-mute.is-audio-disabled,
.unified-media-modal .unified-media-tile.video-paused .unified-video-mute.is-audio-disabled,
.unified-media-modal .unified-media-stage.video-loaded .unified-video-mute[disabled],
.unified-media-modal .unified-media-stage.video-paused .unified-video-mute[disabled],
.unified-media-modal .unified-media-tile.video-loaded .unified-video-mute[disabled],
.unified-media-modal .unified-media-tile.video-paused .unified-video-mute[disabled] {
  opacity: 0.5;
  visibility: visible;
  pointer-events: none;
}

.unified-media-modal.lightbox-mode .unified-media-stage:not(.is-current) .unified-video-mute,
.unified-media-modal.lightbox-mode .unified-media-stage:not(.is-current) .unified-video-progress {
  opacity: 0;
  pointer-events: none;
}

/* 52-lightbox-video-controls.css */
.unified-media-modal.lightbox-mode .unified-media-stage {
  --lightbox-video-control-gap: 28px;
  --lightbox-video-progress-bottom: calc(var(--lightbox-overlay-inset) + 52px);
  --lightbox-video-control-row-bottom: calc(var(--lightbox-video-progress-bottom) + 6px + var(--lightbox-video-control-gap));
  --lightbox-video-button-row-bottom: calc(var(--lightbox-video-control-row-bottom) - 8px);
  --lightbox-video-control-edge: calc(var(--lightbox-overlay-inset) + 8px);
}

.unified-media-modal.lightbox-mode .unified-media-stage.is-video.video-loading .unified-media-frame,
.unified-media-modal.lightbox-mode .unified-media-stage.is-youtube-general.video-loading .unified-media-frame {
  background: rgb(0, 0, 0);
}

.unified-media-modal.lightbox-mode .unified-media-stage.is-video.video-loading .unified-media-frame > img,
.unified-media-modal.lightbox-mode .unified-media-stage.is-youtube-general.video-loading .youtube-player-poster {
  opacity: 0;
}

.unified-media-modal.lightbox-mode .unified-media-stage .unified-media-frame > video.unified-media-video.is-pending-first-frame {
  opacity: 0;
}

.unified-media-modal.lightbox-mode .unified-media-stage.video-loading .unified-video-play.loading {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.unified-media-modal.lightbox-mode .unified-video-progress {
  inset: auto var(--lightbox-video-control-edge) var(--lightbox-video-progress-bottom) var(--lightbox-text-overlay-inset);
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: var(--lightbox-overlay-line-height) 6px;
  gap: var(--lightbox-video-control-gap) 0;
  color: rgb(238, 238, 238);
  font-size: 16px;
  font-weight: 600;
  line-height: var(--lightbox-overlay-line-height);
  pointer-events: none;
}

.unified-media-modal.lightbox-mode .unified-video-time {
  display: flex;
  grid-column: 1;
  grid-row: 1;
  min-height: var(--lightbox-overlay-line-height);
  align-items: center;
  justify-content: flex-start;
  padding-top: 0;
  padding-left: 0;
  color: rgb(238, 238, 238);
  font-size: 16px;
  font-weight: 600;
  line-height: var(--lightbox-overlay-line-height);
}

.unified-media-modal.lightbox-mode .unified-video-scrub {
  grid-column: 1 / -1;
  grid-row: 2;
  align-self: center;
  pointer-events: auto;
}

.unified-media-modal.lightbox-mode .unified-video-mute {
  z-index: 9;
  inset: auto calc(var(--lightbox-video-control-edge) + var(--lightbox-video-fullscreen-size, 32px) + 8px) var(--lightbox-video-button-row-bottom) auto;
  display: grid;
  width: 32px;
  min-width: 32px;
  height: 32px;
  min-height: 32px;
  place-items: center;
  color: rgb(238, 238, 238);
}

.unified-media-modal.lightbox-mode .unified-video-fullscreen {
  --lightbox-video-fullscreen-size: 32px;
  --lightbox-video-fullscreen-icon-size: 24px;
  position: absolute;
  z-index: 9;
  top: auto;
  right: var(--lightbox-video-control-edge);
  bottom: var(--lightbox-video-button-row-bottom);
  display: none;
  width: var(--lightbox-video-fullscreen-size);
  min-width: var(--lightbox-video-fullscreen-size);
  height: var(--lightbox-video-fullscreen-size);
  min-height: var(--lightbox-video-fullscreen-size);
  place-items: center;
  border: 0;
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.94);
  background: transparent;
  box-shadow: none;
  opacity: 0;
  cursor: pointer;
  pointer-events: none;
  text-shadow: rgba(0, 0, 0, 0.72) 0 2px 14px;
  transition:
    opacity 220ms cubic-bezier(0.22, 1, 0.36, 1),
    transform 180ms cubic-bezier(0.22, 1, 0.36, 1),
    color 160ms;
  -webkit-tap-highlight-color: transparent;
}

.unified-media-modal.lightbox-mode .unified-media-stage.is-video .unified-media-frame > .unified-media-file {
  right: calc(var(--lightbox-text-overlay-inset) + var(--lightbox-video-fullscreen-size) + 8px);
  max-width: calc(100% - (var(--lightbox-text-overlay-inset) * 2) - var(--lightbox-video-fullscreen-size) - 8px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.unified-media-modal.lightbox-mode .unified-video-fullscreen:hover {
  color: rgb(255, 255, 255);
  transform: scale(1.08);
}

.unified-media-modal.lightbox-mode .unified-video-mute .video-control-icon,
.unified-media-modal.lightbox-mode .unified-video-mute .material-symbols-outlined {
  width: 24px;
  max-width: 24px;
  height: 24px;
  max-height: 24px;
  margin: auto;
  color: rgb(238, 238, 238);
  font-size: 24px;
  line-height: 24px;
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
}

.unified-media-modal.lightbox-mode .unified-video-fullscreen .video-control-icon,
.unified-media-modal.lightbox-mode .unified-video-fullscreen .material-symbols-outlined {
  width: var(--lightbox-video-fullscreen-icon-size);
  max-width: var(--lightbox-video-fullscreen-icon-size);
  height: var(--lightbox-video-fullscreen-icon-size);
  max-height: var(--lightbox-video-fullscreen-icon-size);
  margin: auto;
  font-size: var(--lightbox-video-fullscreen-icon-size);
  line-height: var(--lightbox-video-fullscreen-icon-size);
}

.unified-media-modal.lightbox-mode .unified-media-stage.is-fullscreen-supported:not(.video-loading).lightbox-video-controls-visible .unified-video-fullscreen,
.unified-media-modal.lightbox-mode .unified-media-stage.is-fullscreen-supported:not(.video-loading).video-paused .unified-video-fullscreen {
  display: grid;
  opacity: 1;
  pointer-events: auto;
}

.unified-media-modal.lightbox-mode .unified-media-stage.is-fullscreen-unsupported .unified-video-fullscreen {
  display: grid;
  opacity: 0.42;
  pointer-events: none;
}

.unified-media-modal.lightbox-mode .unified-media-stage.lightbox-video-chrome-hidden .unified-video-fullscreen {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.unified-media-modal.lightbox-mode.has-lightbox-native-fullscreen .unified-media-strip,
.unified-media-modal.lightbox-mode.has-lightbox-native-fullscreen .unified-media-nav,
.unified-media-modal.lightbox-mode .unified-media-stage.is-lightbox-native-fullscreen .unified-media-frame > :is(.unified-media-file, .unified-media-resolution, .unified-media-download, .unified-media-original-link, .unified-lightbox-close) {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

@media (max-width: 767px) {
  .unified-media-modal.lightbox-mode .unified-media-stage {
    --lightbox-video-control-gap: 16px;
    --lightbox-video-progress-bottom: calc(var(--lightbox-text-overlay-inset) + var(--lightbox-overlay-line-height) + var(--lightbox-video-control-gap));
    --lightbox-video-control-row-bottom: calc(var(--lightbox-video-progress-bottom) + 6px + var(--lightbox-video-control-gap));
    --lightbox-video-button-row-bottom: calc(var(--lightbox-video-control-row-bottom) - 8px);
    --lightbox-video-control-edge: calc(var(--lightbox-overlay-inset) + 8px);
  }

  .unified-media-modal.lightbox-mode .unified-video-progress {
    top: auto;
    right: var(--lightbox-video-control-edge);
    bottom: var(--lightbox-video-progress-bottom);
    left: var(--lightbox-text-overlay-inset);
  }

  .unified-media-modal.lightbox-mode .unified-video-mute {
    top: auto;
    right: calc(var(--lightbox-video-control-edge) + var(--lightbox-video-fullscreen-size, 32px) + 8px);
    bottom: var(--lightbox-video-button-row-bottom);
    left: auto;
  }

  .unified-media-modal.lightbox-mode .unified-video-fullscreen {
    top: auto;
    right: var(--lightbox-video-control-edge);
    bottom: var(--lightbox-video-button-row-bottom);
  }
  .unified-media-modal.lightbox-mode .unified-media-stage.is-lightbox-native-fullscreen .unified-video-fullscreen {
    top: auto;
    right: var(--lightbox-video-control-edge);
    bottom: var(--lightbox-video-button-row-bottom);
  }
}

/* 52-lightbox-video-fullscreen.css */
/* Lightbox video native fullscreen containment */

.unified-media-modal.lightbox-mode.has-lightbox-native-fullscreen .unified-media-track {
  transform: none;
  transition: none;
}

.unified-media-modal.lightbox-mode .unified-media-stage.is-lightbox-native-fullscreen:fullscreen,
.unified-media-modal.lightbox-mode .unified-media-stage.is-lightbox-native-fullscreen:-webkit-full-screen,
.unified-media-modal.lightbox-mode .unified-media-stage.is-lightbox-native-fullscreen .unified-media-frame:fullscreen,
.unified-media-modal.lightbox-mode .unified-media-stage.is-lightbox-native-fullscreen .unified-media-frame:-webkit-full-screen {
  position: fixed;
  inset: 0;
  display: block;
  width: 100vw;
  min-width: 100vw;
  height: 100vh;
  min-height: 100vh;
  margin: 0;
  padding: 0;
  overflow: hidden;
  clip-path: none;
  background: rgb(0, 0, 0);
  transform: none;
  transition: none;
}

.unified-media-modal.lightbox-mode .unified-media-stage.is-lightbox-native-fullscreen:fullscreen .unified-media-frame,
.unified-media-modal.lightbox-mode .unified-media-stage.is-lightbox-native-fullscreen:-webkit-full-screen .unified-media-frame,
.unified-media-modal.lightbox-mode .unified-media-stage.is-lightbox-native-fullscreen .unified-media-frame:fullscreen,
.unified-media-modal.lightbox-mode .unified-media-stage.is-lightbox-native-fullscreen .unified-media-frame:-webkit-full-screen {
  position: absolute;
  inset: 0;
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  margin: 0;
  aspect-ratio: auto;
  border-radius: 0;
  background: rgb(0, 0, 0);
  opacity: 1;
  transform: none;
  transition: none;
}

.unified-media-modal.lightbox-mode
  .unified-media-stage.is-lightbox-native-fullscreen:fullscreen
  .unified-media-frame
  > :is(video, .youtube-player-embed, .youtube-player-iframe, .youtube-player-poster, .youtube-player-unavailable, img),
.unified-media-modal.lightbox-mode
  .unified-media-stage.is-lightbox-native-fullscreen:-webkit-full-screen
  .unified-media-frame
  > :is(video, .youtube-player-embed, .youtube-player-iframe, .youtube-player-poster, .youtube-player-unavailable, img),
.unified-media-modal.lightbox-mode
  .unified-media-stage.is-lightbox-native-fullscreen
  .unified-media-frame:fullscreen
  > :is(video, .youtube-player-embed, .youtube-player-iframe, .youtube-player-poster, .youtube-player-unavailable, img),
.unified-media-modal.lightbox-mode
  .unified-media-stage.is-lightbox-native-fullscreen
  .unified-media-frame:-webkit-full-screen
  > :is(video, .youtube-player-embed, .youtube-player-iframe, .youtube-player-poster, .youtube-player-unavailable, img) {
  position: absolute;
  inset: 0;
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  object-fit: contain;
  object-position: center center;
  transform: none;
  transform-origin: center center;
}

.unified-media-modal.lightbox-mode
  .unified-media-stage.is-lightbox-native-fullscreen:fullscreen
  .youtube-player-iframe,
.unified-media-modal.lightbox-mode
  .unified-media-stage.is-lightbox-native-fullscreen:-webkit-full-screen
  .youtube-player-iframe,
.unified-media-modal.lightbox-mode
  .unified-media-stage.is-lightbox-native-fullscreen
  .unified-media-frame:fullscreen
  .youtube-player-iframe,
.unified-media-modal.lightbox-mode
  .unified-media-stage.is-lightbox-native-fullscreen
  .unified-media-frame:-webkit-full-screen
  .youtube-player-iframe {
  width: 100%;
  height: 100%;
  border: 0;
}

@media (max-width: 767px) {
  .unified-media-modal.lightbox-mode
    .unified-media-stage.is-lightbox-native-fullscreen:is(.video-loaded, .video-loading):not(.is-youtube-general)
    .unified-media-frame::before,
  .unified-media-modal.lightbox-mode
    .unified-media-stage.is-lightbox-native-fullscreen:is(.video-loaded, .video-loading):not(.is-youtube-general)
    .unified-media-frame::after {
    opacity: 0;
    background: none;
    background-image: none;
    transition: none;
  }

  .unified-media-modal.lightbox-mode
    .unified-media-stage.is-lightbox-native-fullscreen:is(.video-loaded, .video-loading):not(.is-youtube-general)
    .unified-media-frame
    > img {
    opacity: 0;
    visibility: hidden;
  }

  .unified-media-modal.lightbox-mode
    .unified-media-stage.is-lightbox-native-fullscreen:is(.video-loaded, .video-loading):not(.is-youtube-general)
    .unified-media-frame
    > video.unified-media-video {
    z-index: 3;
    background: rgb(0, 0, 0);
    transform: none;
    transition: none;
    backface-visibility: hidden;
  }
}

/* 52-lightbox-video-fullscreen-scrub.css */
/* Lightbox video scrub preview and mobile fullscreen scrub ownership. */

.unified-media-modal.lightbox-mode .unified-video-touch-scrub {
  position: relative;
  grid-column: 1 / -1;
  grid-row: 2;
  display: none;
  width: 100%;
  height: 28px;
  align-self: center;
  cursor: pointer;
  pointer-events: auto;
  touch-action: none;
  -webkit-tap-highlight-color: transparent;
}

.unified-media-modal.lightbox-mode .unified-video-touch-track {
  position: absolute;
  top: 50%;
  right: 0;
  left: 0;
  display: block;
  height: 6px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.28);
  transform: translateY(-50%);
}

.unified-media-modal.lightbox-mode .unified-video-touch-fill {
  position: absolute;
  inset: 0 auto 0 0;
  display: block;
  width: var(--video-progress, 0%);
  border-radius: inherit;
  background: rgba(255, 255, 255, 0.98);
}

.unified-media-modal.lightbox-mode .unified-video-touch-thumb {
  position: absolute;
  top: 50%;
  left: var(--video-progress, 0%);
  display: block;
  width: 14px;
  height: 14px;
  border: 1px solid rgba(255, 255, 255, 0.66);
  border-radius: 50%;
  background: rgb(255, 255, 255);
  box-shadow: rgba(0, 0, 0, 0.35) 0 2px 10px;
  transform: translate(-50%, -50%);
}

.unified-media-modal.lightbox-mode
  .unified-media-stage.is-current
  .unified-media-frame
  > img.unified-video-scrub-preview,
.unified-media-modal.lightbox-mode
  .unified-media-stage
  .unified-media-frame
  > img.unified-video-scrub-preview {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: block;
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  border-radius: inherit;
  object-fit: contain;
  object-position: center center;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  background: rgb(0, 0, 0);
  box-shadow: none;
  transform: none;
  transition: opacity 120ms ease;
}

.unified-media-modal.lightbox-mode
  .unified-media-stage.is-video-scrubbing.is-scrub-preview-visible
  .unified-media-frame
  > img.unified-video-scrub-preview {
  opacity: 1;
  visibility: visible;
}

@media (max-width: 767px) {
  .unified-media-modal.lightbox-mode
    .unified-media-stage.is-current
    .unified-media-frame
    > img.unified-video-scrub-preview,
  .unified-media-modal.lightbox-mode
    .unified-media-stage
    .unified-media-frame
    > img.unified-video-scrub-preview {
    position: absolute;
    inset: 0;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 4;
    width: 100%;
    max-width: none;
    height: 100%;
    max-height: none;
    object-fit: cover;
    object-position: center center;
    background: rgb(0, 0, 0);
    transform: none;
    transition: none;
  }

  .unified-media-modal.lightbox-mode
    .unified-media-stage.is-lightbox-native-fullscreen
    .unified-video-scrub,
  .unified-media-stage.is-lightbox-native-fullscreen
    .unified-video-scrub,
  .unified-media-stage:fullscreen
    .unified-video-scrub,
  .unified-media-stage:-webkit-full-screen
    .unified-video-scrub {
    display: none;
    pointer-events: none;
  }

  .unified-media-modal.lightbox-mode
    .unified-media-stage.is-lightbox-native-fullscreen
    .unified-video-touch-scrub,
  .unified-media-stage.is-lightbox-native-fullscreen
    .unified-video-touch-scrub,
  .unified-media-stage:fullscreen
    .unified-video-touch-scrub,
  .unified-media-stage:-webkit-full-screen
    .unified-video-touch-scrub {
    display: block;
  }

  .unified-media-modal.lightbox-mode
    .unified-media-stage.is-current.is-lightbox-native-fullscreen
    .unified-media-frame
    > img.unified-video-scrub-preview,
  .unified-media-modal.lightbox-mode
    .unified-media-stage.is-lightbox-native-fullscreen
    .unified-media-frame
    > img.unified-video-scrub-preview,
  .unified-media-stage:fullscreen
    .unified-media-frame
    > img.unified-video-scrub-preview,
  .unified-media-stage:-webkit-full-screen
    .unified-media-frame
    > img.unified-video-scrub-preview {
    position: absolute;
    inset: 0;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 4;
    width: 100%;
    max-width: none;
    height: 100%;
    max-height: none;
    object-fit: contain;
    object-position: center center;
    background: rgb(0, 0, 0);
    transform: none;
    transition: none;
  }

  .unified-media-modal.lightbox-mode
    .unified-media-stage.is-lightbox-native-fullscreen.is-video-scrubbing.is-scrub-preview-visible
    .unified-media-frame
    > img.unified-video-scrub-preview,
  .unified-media-stage.is-video-scrubbing.is-scrub-preview-visible:fullscreen
    .unified-media-frame
    > img.unified-video-scrub-preview,
  .unified-media-stage.is-video-scrubbing.is-scrub-preview-visible:-webkit-full-screen
    .unified-media-frame
    > img.unified-video-scrub-preview {
    display: block;
    opacity: 1;
    visibility: visible;
  }
}

/* 55-public-modals.css */
.scrape-modal { position: fixed; inset: 0px; z-index: 180; display: flex; align-items: center; justify-content: center; padding: 18px; visibility: hidden; opacity: 0; pointer-events: none; background-color: rgba(0, 0, 0, 0); transition: opacity 240ms, background-color 240ms, visibility linear 240ms; }
.scrape-modal.active { visibility: visible; opacity: 1; pointer-events: auto; background-color: var(--bunny-dim-overlay); transition: opacity 240ms, background-color 240ms, visibility; }
.scrape-modal.closing { visibility: visible; opacity: 0; pointer-events: none; background-color: rgba(0, 0, 0, 0); }
.scrape-modal-panel { width: min(560px, 100%); padding: 22px; border: 1px solid rgba(255, 255, 255, 0.15); border-radius: 18px; background: rgb(23, 23, 23); color: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.5) 0px 24px 80px; opacity: 0; transform: translate3d(var(--scrape-modal-origin-x, 0px), var(--scrape-modal-origin-y, 0px), 0) scale(0.08); transform-origin: center center; transition: transform 320ms cubic-bezier(0.18, 0.86, 0.24, 1), opacity 220ms; will-change: transform, opacity; }
.scrape-modal.active .scrape-modal-panel { opacity: 1; transform: translate3d(0px, 0px, 0px) scale(1); }
.scrape-modal.closing .scrape-modal-panel { opacity: 0; transform: translate3d(var(--scrape-modal-origin-x, 0px), var(--scrape-modal-origin-y, 0px), 0) scale(0.08); }
.scrape-modal-head { display: grid; grid-template-columns: auto minmax(0px, 1fr) auto; gap: 12px; align-items: center; margin-bottom: 16px; }
.scrape-modal-icon { display: grid; width: 40px; height: 40px; place-items: center; border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 999px; color: rgba(255, 255, 255, 0.94); background: rgba(255, 255, 255, 0.08); }
.scrape-modal-head h3 { margin: 0px; font-size: 18px; font-weight: 620; line-height: 1.2; }
.scrape-modal-action { flex: 0 0 auto; border-radius: 26px; transition: transform 260ms cubic-bezier(0.34, 1.56, 0.64, 1); }
.scrape-modal-action:hover { transform: scale(1.1); }
.scrape-modal-action button { min-width: 112px; min-height: 48px; padding: 12px 22px; border: 0px; background: transparent; color: rgba(255, 255, 255, 0.92); font-family: Pretendard, system-ui, sans-serif; font-size: 15px; font-weight: 520; cursor: pointer; }

.scrape-form { display: grid; gap: 12px; }
.scrape-form label { display: grid; gap: 8px; color: rgba(255, 255, 255, 0.74); font-size: 13px; font-weight: 520; }
.scrape-form input { width: 100%; box-sizing: border-box; min-height: 48px; padding: 0px 15px; border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 14px; outline: 0px; color: rgba(255, 255, 255, 0.94); background: rgba(255, 255, 255, 0.075); font-family: Pretendard, system-ui, sans-serif; font-size: 15px; }
.scrape-progress { display: none; }
.scrape-progress:not([data-state="idle"]) { display: block; }
.scrape-progress-track { position: relative; height: 13px; overflow: hidden; border-radius: 999px; background: rgba(255, 255, 255, 0.13); }
.scrape-progress-track span { position: absolute; inset: 0px auto 0px 0px; width: 0%; border-radius: inherit; background: linear-gradient(90deg, rgb(52, 211, 153), rgb(139, 255, 210)); box-shadow: rgba(52, 211, 153, 0.34) 0px 0px 18px; overflow: hidden; transition: width 280ms; }
.scrape-progress-track span::after { content: ""; position: absolute; inset: 0px; width: 180%; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.36), transparent); opacity: 0; transform: translateX(-60%); }
.scrape-progress[data-state="running"] .scrape-progress-track span::after { opacity: 0.62; animation: 960ms linear 0s infinite normal none running scrape-progress-wave; }
.scrape-progress[data-state="failed"] .scrape-progress-track span { background: linear-gradient(90deg, rgb(251, 113, 133), rgb(253, 164, 175)); box-shadow: rgba(251, 113, 133, 0.3) 0px 0px 18px; }
.scrape-request-status { min-height: 26px; display: inline-flex; align-items: center; gap: 8px; margin: 0px; color: rgba(255, 255, 255, 0.78); font-size: 15px; line-height: 1.45; }
.scrape-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.admin-required-actions { display: flex; justify-content: flex-end; gap: 10px; }
.admin-required-actions button { min-width: 84px; min-height: 42px; padding: 0px 18px; border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 999px; color: rgba(255, 255, 255, 0.9); background: linear-gradient(135deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.04)), rgba(255, 255, 255, 0.06); font-family: Pretendard, system-ui, sans-serif; font-size: 14px; font-weight: 560; cursor: pointer; }
.admin-required-actions button[data-admin-required-login] { color: rgba(255, 246, 255, 0.98); border-color: rgba(255, 214, 255, 0.3); background: linear-gradient(135deg, rgba(255, 214, 255, 0.24), rgba(255, 255, 255, 0.05)), rgba(255, 214, 255, 0.08); }

@media (max-width: 767px) {
.scrape-modal-panel { padding: 18px; }
.scrape-modal-action button { min-width: 88px; min-height: 44px; padding: 10px 16px; }
.scrape-actions { justify-content: flex-end; }
}

/* 56-manual-registration-shell.css */
.manual-registration-modal { position: fixed; inset: 0; z-index: 182; display: flex; align-items: center; justify-content: center; padding: 10px; visibility: hidden; opacity: 0; pointer-events: none; background: rgba(0, 0, 0, 0); transition: opacity 240ms, background-color 240ms, visibility linear 240ms; }
.manual-registration-modal.active { visibility: visible; opacity: 1; pointer-events: auto; background: var(--bunny-dim-overlay); transition: opacity 240ms, background-color 240ms, visibility; }
.manual-registration-modal.closing { visibility: visible; opacity: 0; pointer-events: none; background: rgba(0, 0, 0, 0); }
.manual-registration-panel { width: min(920px, 100%); max-height: min(820px, calc(100dvh - 20px)); display: grid; grid-template-rows: auto minmax(0, 1fr); overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 22px; color: rgba(255, 255, 255, 0.92); background: rgb(22, 22, 22); box-shadow: rgba(0, 0, 0, 0.48) 0 28px 88px; transform: translate3d(0, 24px, 0) scale(0.96); opacity: 0; transition: transform 280ms cubic-bezier(0.22, 1, 0.36, 1), opacity 220ms; }
.manual-registration-modal.active .manual-registration-panel { transform: translate3d(0, 0, 0) scale(1); opacity: 1; }
.manual-registration-head { display: flex; align-items: center; justify-content: space-between; padding: 22px 24px 14px; }
.manual-registration-head h3 { margin: 0; font-size: 26px; font-weight: 650; line-height: 1; }
.manual-registration-form { min-height: 0; display: grid; grid-template-rows: minmax(0, 1fr) auto auto; gap: 16px; padding: 0 24px; overflow: visible; }
.manual-registration-grid { min-height: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; gap: 14px; overflow: visible; padding: 0 4px 0 0; }
.manual-registration-grid label,
.manual-registration-field { position: relative; display: grid; gap: 8px; color: rgba(255, 255, 255, 0.76); font-size: 15px; font-weight: 560; }
.manual-registration-grid label.wide,
.manual-registration-field.wide { grid-column: 1 / -1; }
.manual-registration-field.manual-file-field.wide { grid-column: auto; }
.manual-registration-grid :is(input:not([type="file"]):not([type="checkbox"]), select, textarea) { box-sizing: border-box; width: 100%; min-height: 48px; padding: 0 15px; border: 1px solid var(--bunny-emboss-border); border-radius: 16px; outline: 0; color: rgba(255, 255, 255, 0.94); background: rgba(255, 255, 255, 0.095); box-shadow: var(--bunny-emboss-border-shadow); font: 500 16px/1.45 Pretendard, system-ui, sans-serif; }
.manual-registration-grid :is(input:not([type="file"]):not([type="checkbox"]), select, textarea):focus { border-color: rgba(184, 255, 225, 0.36); background: rgba(255, 255, 255, 0.13); }

/* 56-manual-registration-select.css */
.manual-registration-grid select {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 42px;
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(255, 255, 255, 0.72) 50%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.72) 50%, transparent 50%);
  background-position:
    calc(100% - 24px) 50%,
    calc(100% - 17px) 50%;
  background-size: 7px 7px, 7px 7px;
  background-repeat: no-repeat;
}
.manual-registration-grid select option { color: rgba(255, 255, 255, 0.94); background: rgb(24, 24, 24); }
.manual-registration-grid select.manual-native-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  min-height: 1px;
  padding: 0;
  border: 0;
  opacity: 0;
  pointer-events: none;
}
.manual-select {
  position: relative;
  width: 100%;
}
.manual-select-button {
  position: relative;
  display: flex;
  width: 100%;
  min-height: 48px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 14px 0 16px;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 16px;
  color: rgba(255, 255, 255, 0.94);
  background: rgba(255, 255, 255, 0.095);
  box-shadow: var(--bunny-emboss-border-shadow);
  font: 500 16px/1 Pretendard, system-ui, sans-serif;
  cursor: pointer;
}
.manual-control-icon { position: relative; flex: 0 0 auto; display: block; width: 22px; height: 22px; color: rgba(255, 255, 255, 0.72); }
.manual-control-chevron::before { content: ""; position: absolute; left: 50%; top: 50%; width: 9px; height: 9px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translate(-50%, -62%) rotate(45deg); }
.manual-control-calendar { border: 1.8px solid currentColor; border-radius: 6px; }
.manual-control-calendar::before { content: ""; position: absolute; left: 3px; right: 3px; top: 6px; height: 1.8px; background: currentColor; }
.manual-control-calendar::after { content: ""; position: absolute; left: 5px; top: 10px; width: 3px; height: 3px; border-radius: 50%; background: currentColor; box-shadow: 5px 0 0 currentColor, 10px 0 0 currentColor, 0 5px 0 currentColor, 5px 5px 0 currentColor; opacity: 0.86; }
.manual-select.open .manual-select-button {
  border-color: rgba(184, 255, 225, 0.36);
  background: rgba(255, 255, 255, 0.13);
}
.manual-select-menu {
  position: absolute;
  z-index: 5;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  display: none;
  gap: 4px;
  max-height: 260px;
  overflow: auto;
  padding: 8px;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 18px;
  background: rgb(24, 24, 24);
  box-shadow:
    rgba(0, 0, 0, 0.36) 0 18px 42px,
    var(--bunny-emboss-border-shadow);
  opacity: 0;
  pointer-events: none;
  transform: translate3d(0, -8px, 0) scale(0.98);
  transform-origin: 50% 0;
  transition:
    opacity 170ms,
    transform 220ms cubic-bezier(0.16, 1, 0.24, 1),
    visibility linear 220ms;
  visibility: hidden;
}
.manual-select.open .manual-select-menu {
  display: grid;
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(0, 0, 0) scale(1);
  transition:
    opacity 170ms,
    transform 220ms cubic-bezier(0.16, 1, 0.24, 1),
    visibility linear 0ms;
  visibility: visible;
}
.manual-select-option {
  min-height: 38px;
  padding: 0 12px;
  border: 0;
  border-radius: 12px;
  color: rgba(255, 255, 255, 0.76);
  background: transparent;
  font: 520 15px/1 Pretendard, system-ui, sans-serif;
  text-align: left;
  cursor: pointer;
}
.manual-select-option:hover,
.manual-select-option:focus-visible,
.manual-select-option.active {
  color: rgba(255, 255, 255, 0.98);
  background: rgba(255, 255, 255, 0.12);
}

/* 56-manual-registration-datetime.css */
.manual-registration-grid input[type="datetime-local"] {
  color-scheme: dark;
  border-radius: 18px;
}
.manual-registration-grid input[type="datetime-local"]::-webkit-calendar-picker-indicator {
  width: 24px;
  height: 24px;
  margin-left: 8px;
  cursor: pointer;
  filter: invert(1);
  opacity: 0.76;
}
.manual-registration-grid input.manual-datetime-native {
  position: absolute;
  width: 1px;
  height: 1px;
  min-height: 1px;
  padding: 0;
  border: 0;
  opacity: 0;
  pointer-events: none;
}
.manual-datetime {
  position: relative;
  width: 100%;
}
.manual-datetime-button {
  position: relative;
  display: flex;
  width: 100%;
  min-height: 48px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 14px 0 16px;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 18px;
  color: rgba(255, 255, 255, 0.94);
  background: rgba(255, 255, 255, 0.095);
  box-shadow: var(--bunny-emboss-border-shadow);
  font: 500 16px/1 Pretendard, system-ui, sans-serif;
  cursor: pointer;
}
.manual-datetime.open .manual-datetime-button {
  border-color: rgba(184, 255, 225, 0.36);
  background: rgba(255, 255, 255, 0.13);
}
.manual-datetime-menu {
  position: absolute;
  z-index: 6;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  display: none;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 20px;
  background: rgb(24, 24, 24);
  box-shadow:
    rgba(0, 0, 0, 0.36) 0 18px 42px,
    var(--bunny-emboss-border-shadow);
  opacity: 0;
  pointer-events: none;
  transform: translate3d(0, -8px, 0) scale(0.98);
  transform-origin: 50% 0;
  transition:
    opacity 170ms,
    transform 220ms cubic-bezier(0.16, 1, 0.24, 1),
    visibility linear 220ms;
  visibility: hidden;
}
.manual-datetime.open .manual-datetime-menu {
  display: grid;
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(0, 0, 0) scale(1);
  transition:
    opacity 170ms,
    transform 220ms cubic-bezier(0.16, 1, 0.24, 1),
    visibility linear 0ms;
  visibility: visible;
}
.manual-calendar-head {
  display: grid;
  grid-template-columns: 72px 36px minmax(0, 1fr) 36px 72px;
  align-items: center;
  gap: 6px;
}
.manual-calendar-head strong {
  color: rgba(255, 255, 255, 0.92);
  font-size: 16px;
  font-weight: 620;
  text-align: center;
}
.manual-calendar-head button,
.manual-calendar-time button {
  display: grid;
  min-height: 36px;
  place-items: center;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.9);
  background: rgba(255, 255, 255, 0.09);
  box-shadow: var(--bunny-emboss-border-shadow);
  cursor: pointer;
}
.manual-calendar-head button { min-height: 34px; padding: 0 10px; font: 600 13px/1 Pretendard, system-ui, sans-serif; }
.manual-calendar-year-link.prev-year { justify-content: start; }
.manual-calendar-year-link.next-year { justify-content: end; }
.manual-calendar-month-arrow::before { content: ""; display: block; width: 8px; height: 8px; border-top: 2px solid currentColor; border-left: 2px solid currentColor; }
.manual-calendar-month-arrow.prev::before { transform: rotate(-45deg); }
.manual-calendar-month-arrow.next::before { transform: rotate(135deg); }
.manual-calendar-weekdays,
.manual-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 5px;
}
.manual-calendar-weekdays span {
  color: rgba(255, 255, 255, 0.46);
  font-size: 12px;
  font-weight: 560;
  text-align: center;
}
.manual-calendar-day,
.manual-calendar-empty {
  display: grid;
  min-width: 0;
  min-height: 34px;
  place-items: center;
}
.manual-calendar-day {
  border: 0;
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.78);
  background: transparent;
  font: 560 14px/1 Pretendard, system-ui, sans-serif;
  cursor: pointer;
}
.manual-calendar-day:hover,
.manual-calendar-day:focus-visible {
  color: rgba(255, 255, 255, 0.98);
  background: rgba(255, 255, 255, 0.1);
}
.manual-calendar-day.active {
  color: rgba(16, 28, 24, 0.96);
  background: rgba(184, 255, 225, 0.9);
  box-shadow: rgba(184, 255, 225, 0.24) 0 0 0 4px;
}
.manual-calendar-time {
  display: grid;
  grid-template-columns: 132px auto;
  justify-content: end;
  gap: 8px;
}
.manual-registration-grid .manual-datetime-menu .manual-calendar-time input[data-manual-calendar-time] {
  width: 100%;
  min-height: 38px;
  height: 38px;
  padding: 0 14px;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.94);
  background: rgba(255, 255, 255, 0.095);
  box-shadow: var(--bunny-emboss-border-shadow);
  font: 560 15px/1 Pretendard, system-ui, sans-serif;
  text-align: center;
}
.manual-calendar-time button {
  min-width: 64px;
  padding: 0 14px;
  font: 560 14px/1 Pretendard, system-ui, sans-serif;
}

/* 56-manual-registration-files-actions.css */
.manual-file-control {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  min-height: 52px;
  box-sizing: border-box;
  padding: 7px 10px;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.095);
  box-shadow: var(--bunny-emboss-border-shadow);
}
.manual-file-native {
  position: absolute;
  width: 1px;
  height: 1px;
  min-height: 1px;
  padding: 0;
  border: 0;
  opacity: 0;
  pointer-events: none;
}
.manual-file-pick {
  min-height: 36px;
  padding: 0 16px;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.94);
  background: rgba(255, 255, 255, 0.14);
  box-shadow: var(--bunny-emboss-border-shadow);
  font: 560 14px/1 Pretendard, system-ui, sans-serif;
  cursor: pointer;
}
.manual-file-name { min-width: 0; overflow: hidden; color: rgba(255, 255, 255, 0.72); font: 500 15px/1.35 Pretendard, system-ui, sans-serif; text-overflow: ellipsis; white-space: nowrap; }
.manual-registration-grid textarea { height: 120px; min-height: 112px; padding: 13px 15px; resize: vertical; }
.manual-registration-checkbox { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 10px; min-height: 40px; color: rgba(255, 255, 255, 0.78); font-size: 15px; font-weight: 560; white-space: nowrap; }
.manual-registration-checkbox input { flex: 0 0 20px; width: 20px; min-width: 20px; min-height: 20px; height: 20px; margin: 0; accent-color: rgba(184, 255, 225, 0.9); }
.manual-registration-checkbox span { white-space: nowrap; }
.manual-registration-status { min-height: 24px; margin: 0; color: rgba(255, 255, 255, 0.72); font-size: 15px; font-weight: 500; }
.manual-registration-status[hidden] { display: none; }
.manual-registration-actions { position: relative; z-index: 2; display: flex; min-height: 46px; align-items: center; justify-content: space-between; gap: 16px; padding: 24px 0 8px; border-top: 1px solid rgba(255, 255, 255, 0.1); background: rgb(22, 22, 22); }
.manual-registration-action-buttons { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.manual-registration-actions button { min-width: 98px; min-height: 46px; padding: 0 20px; border: 1px solid var(--bunny-emboss-border); border-radius: 999px; color: rgba(255, 255, 255, 0.92); background: rgba(255, 255, 255, 0.09); box-shadow: var(--bunny-emboss-border-shadow); font: 560 15px/1 Pretendard, system-ui, sans-serif; cursor: pointer; }
.manual-registration-actions button.primary { border-color: rgba(184, 255, 225, 0.28); background: rgba(52, 211, 153, 0.16); }
.manual-registration-actions button:disabled { cursor: default; opacity: 0.55; }

/* 56-manual-registration-responsive.css */
@media (max-width: 767px) {
  .manual-registration-modal { padding: 0; }
  .manual-registration-panel { width: 100vw; height: 100dvh; max-height: none; border-radius: 0; border: 0; }
  .manual-registration-form { overflow: hidden; }
  .manual-registration-grid { grid-template-columns: 1fr; overflow: auto; }
  .manual-registration-field.manual-file-field.wide { grid-column: 1 / -1; }
  .manual-registration-head { padding: 20px 18px 12px; }
  .manual-registration-form { padding: 0 18px 18px; }
  .manual-calendar-head { grid-template-columns: 64px 32px minmax(0, 1fr) 32px 64px; gap: 4px; }
  .manual-calendar-head button { padding: 0 5px; font-size: 11px; }
  .manual-calendar-time { grid-template-columns: 116px auto; }
  .manual-registration-actions { gap: 10px; }
}

/* 58-media-editor-shell.css */
.central-edit-modal {
  position: fixed;
  z-index: 9500;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 22px;
  opacity: 0;
  pointer-events: none;
  background: rgba(0, 0, 0, 0);
  transition: opacity 180ms, background 180ms;
  --media-family-body-padding: 24px;
  --media-family-close-size: 44px;
  --media-family-footer-height: 78px;
  --media-family-gap: 24px;
  --media-family-panel-radius: 12px;
  --media-family-scrollbar-width: 8px;
  --media-family-tile-radius: 8px;
  --media-vignette-gradient: linear-gradient(
    rgba(0, 0, 0, 0.44) 0%,
    rgba(0, 0, 0, 0.18) 24%,
    rgba(0, 0, 0, 0) 42%,
    rgba(0, 0, 0, 0) 58%,
    rgba(0, 0, 0, 0.34) 78%,
    rgba(0, 0, 0, 0.62) 100%
  );
}

.central-edit-modal.active {
  opacity: 1;
  pointer-events: auto;
  background: var(--bunny-dim-overlay);
}

.central-edit-panel {
  display: flex;
  position: relative;
  width: min(calc(var(--edit-gallery-width, 960px) + var(--modal-panel-extra, 50px)), calc(100vw - 160px));
  max-height: calc(-156px + 100dvh);
  flex-direction: column;
  overflow: visible;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: var(--media-family-panel-radius);
  background: rgba(18, 18, 18, 0.96);
  box-shadow: var(--bunny-emboss-window-shadow);
  transform: scale(0.96) translateY(12px);
  transition: transform 180ms;
}

.central-edit-modal.active .central-edit-panel {
  transform: none;
}

#central-edit-modal .unified-media-head {
  position: absolute;
  z-index: 26;
  inset: 0;
  display: block;
  width: auto;
  height: auto;
  min-height: 0;
  align-items: center;
  padding: 0;
  border: 0;
  pointer-events: none;
}

#central-edit-modal .unified-media-head h3 {
  position: absolute;
  bottom: 24px;
  left: 24px;
  color: rgb(221, 221, 221);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.2;
}

#central-edit-modal .unified-media-head p,
.thumbnail-editor-modal .unified-media-head p {
  display: none;
}

#central-edit-modal .modal-close {
  position: absolute;
  z-index: 24;
  top: calc(var(--media-family-close-size) / -2);
  right: calc(var(--media-family-close-size) / -2);
  display: grid;
  width: var(--media-family-close-size);
  height: var(--media-family-close-size);
  min-width: var(--media-family-close-size);
  min-height: var(--media-family-close-size);
  place-items: center;
  margin: 0;
  padding: 0;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.94);
  background: rgba(255, 255, 255, 0.08);
  box-shadow: var(--bunny-emboss-border-shadow);
  pointer-events: auto;
  transform: none;
}

#central-edit-modal .modal-close .local-svg-icon {
  position: static;
  display: inline-grid;
  width: 22px;
  height: 22px;
  min-width: 22px;
  min-height: 22px;
  place-items: center;
  margin: 0;
  font-size: 22px;
  line-height: 1;
}

#central-edit-modal .modal-close::after {
  content: none;
}

#central-edit-modal .modal-close:hover {
  transform: scale(1.06);
}

.central-edit-body {
  display: block;
  min-height: 0;
  max-height: calc(-236px + 100dvh);
  flex: 1 1 auto;
  overflow: hidden auto;
  padding: var(--media-family-body-padding);
  scrollbar-color: rgba(255, 255, 255, 0.36) transparent;
  scrollbar-width: thin;
}

.central-edit-body::-webkit-scrollbar,
.thumbnail-crop-stage::-webkit-scrollbar,
.thumbnail-frame-stage::-webkit-scrollbar {
  width: var(--media-family-scrollbar-width);
  height: var(--media-family-scrollbar-width);
}

.central-edit-body::-webkit-scrollbar-track,
.thumbnail-crop-stage::-webkit-scrollbar-track,
.thumbnail-frame-stage::-webkit-scrollbar-track {
  background: transparent;
}

.central-edit-body::-webkit-scrollbar-thumb,
.thumbnail-crop-stage::-webkit-scrollbar-thumb,
.thumbnail-frame-stage::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.38);
  background-clip: content-box;
}

.central-edit-body::-webkit-scrollbar-thumb:hover,
.thumbnail-crop-stage::-webkit-scrollbar-thumb:hover,
.thumbnail-frame-stage::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.54);
  background-clip: content-box;
}

.central-edit-body > label {
  display: none;
}

.central-edit-body input:not([type="range"]),
.central-edit-body select,
.central-edit-body textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  color: var(--text);
  background: rgba(255, 255, 255, 0.07);
  outline: none;
  font-size: 13px;
  font-weight: 380;
}

.central-edit-body input:not([type="range"]):focus,
.central-edit-body select:focus,
.central-edit-body textarea:focus {
  border-color: rgba(46, 150, 113, 0.72);
  box-shadow: rgba(46, 150, 113, 0.18) 0 0 0 2px;
  outline: none;
}

.central-edit-body input:not([type="range"]),
.central-edit-body select {
  min-height: 42px;
  padding: 0 12px;
}

.central-edit-body textarea {
  min-height: 180px;
  padding: 12px;
  resize: vertical;
  line-height: 1.55;
}

/* 58-media-editor-grid.css */
.central-media-editor {
  width: var(--edit-gallery-width, 100%);
  margin: 0 auto;
  overflow: visible;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.central-media-editor-grid {
  position: relative;
  display: block;
  width: var(--edit-gallery-width, 100%);
  height: var(--edit-gallery-height, auto);
  min-height: var(--edit-gallery-height, var(--edit-tile-width, 320px));
  margin: 0 auto;
  padding: 0;
}

.central-media-empty {
  grid-column: 1 / -1;
  min-height: 132px;
}

.central-media-edit-item.unified-media-tile {
  position: absolute;
  display: block;
  left: var(--popup-tile-x, 0);
  top: var(--popup-tile-y, 0);
  width: var(--popup-tile-width, var(--edit-tile-width, 320px));
  height: var(--popup-tile-height, var(--edit-tile-width, 320px));
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  aspect-ratio: auto;
  border: 0;
  border-radius: var(--media-family-tile-radius);
  background: transparent;
  box-shadow: none;
  cursor: grab;
  will-change: transform, opacity;
  transition: opacity 180ms, outline-color 180ms, transform 280ms cubic-bezier(0.22, 1, 0.36, 1);
}

.central-media-edit-item.unified-media-tile:active,
.central-media-edit-item.unified-media-tile.dragging {
  cursor: grabbing;
}

.central-media-edit-item.unified-media-tile.dragging {
  z-index: 20;
  opacity: 0.56;
  outline: 2px solid rgba(255, 160, 122, 0.72);
  outline-offset: -2px;
  transform: translate(var(--edit-drag-x, 0), var(--edit-drag-y, 0));
  transition: none;
}

.central-media-edit-item.unified-media-tile.is-reflowing {
  z-index: 12;
  pointer-events: none;
}

.central-media-edit-item.unified-media-tile.marked-delete {
  opacity: 0.32;
  outline: 2px solid rgba(255, 112, 112, 0.58);
  outline-offset: -2px;
}

.central-media-edit-item.unified-media-tile.marked-hidden {
  outline: 3px solid rgba(227, 46, 46, 0.92);
  outline-offset: -3px;
}

.central-media-edit-item.unified-media-tile.marked-hidden::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background:
    linear-gradient(rgba(20, 0, 0, 0.36), rgba(0, 0, 0, 0.52)),
    rgba(227, 46, 46, 0.26);
}

.central-media-edit-item.unified-media-tile.is-loading::before {
  content: "";
  position: absolute;
  z-index: 6;
  top: 50%;
  left: 50%;
  box-sizing: border-box;
  width: 24px;
  height: 24px;
  border: 3px solid rgba(255, 255, 255, 0.28);
  border-top-color: rgb(255, 255, 255);
  border-radius: 50%;
  background: transparent;
  transform-origin: 50% 50%;
  animation: 720ms linear infinite bunnySpinCentered;
}

.central-media-edit-item .unified-media-frame {
  position: absolute;
  inset: 0;
  overflow: hidden;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  background: transparent;
}

.central-media-edit-item::after,
.central-media-edit-item .unified-media-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: var(--media-vignette-gradient);
}

.central-media-edit-item > img,
.central-media-edit-item > video,
.central-media-edit-item .unified-media-video,
.central-media-edit-item .unified-media-frame > img,
.central-media-edit-item .unified-media-frame > video,
.central-media-edit-item .unified-media-frame > .material-symbols-outlined {
  position: absolute;
  z-index: 1;
  inset: 0;
}

.central-media-edit-item > img,
.central-media-edit-item > video,
.central-media-edit-item .unified-media-video,
.central-media-edit-item .unified-media-frame > img,
.central-media-edit-item .unified-media-frame > video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

.central-media-edit-item .unified-media-frame > .material-symbols-outlined {
  display: grid;
  place-items: center;
  color: rgba(255, 255, 255, 0.7);
  font-size: 46px;
}

.central-media-edit-item.is-loading > img,
.central-media-edit-item.is-loading > video,
.central-media-edit-item.is-loading .unified-media-file,
.central-media-edit-item.is-loading .unified-media-resolution,
.central-media-edit-item.is-loading .central-media-edit-order-label,
.central-media-edit-item.is-loading .central-media-edit-order,
.central-media-edit-item.is-loading .central-media-edit-thumbnail,
.central-media-edit-item.is-loading .central-media-edit-visible,
.central-media-edit-item.is-loading .central-media-edit-delete {
  opacity: 0;
}

.central-media-edit-item .unified-media-file,
.central-media-edit-item .unified-media-resolution,
.central-media-edit-item .central-media-edit-order-label,
.central-media-edit-item .central-media-edit-order,
.central-media-edit-item .central-media-edit-thumbnail,
.central-media-edit-item .central-media-edit-visible,
.central-media-edit-item .central-media-edit-delete {
  z-index: 5;
}

.central-media-edit-item .unified-media-file,
.central-media-edit-item .unified-media-resolution {
  position: absolute;
  right: 80px;
  max-width: calc(100% - 152px);
  overflow: visible;
  color: rgb(238, 238, 238);
  font-size: 16px;
  font-weight: 600;
  line-height: 16px;
  text-overflow: clip;
  text-shadow: none;
  white-space: nowrap;
  word-break: normal;
}

.central-media-edit-item .unified-media-file {
  top: 16px;
  bottom: auto;
  left: 16px;
}

.central-media-edit-item .unified-media-resolution {
  top: auto;
  bottom: 16px;
  left: 16px;
  height: auto;
  min-height: 0;
}

/* 58-media-editor-actions.css */
.central-edit-panel > .unified-media-actions {
  display: none;
}

.central-media-editor-footer {
  display: flex;
  flex: 0 0 auto;
  min-height: var(--media-family-footer-height);
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  padding: 0 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  background: transparent;
}

.central-media-editor-footer .liquid-glass-btn {
  position: relative;
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 16px;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 999px;
  color: rgb(221, 221, 221);
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  box-shadow: var(--bunny-emboss-border-shadow);
  transform-origin: center center;
  transition: transform 160ms, border-color 160ms, background 160ms, opacity 160ms;
}

.central-media-editor-footer .liquid-glass-btn:hover:not(:disabled) {
  transform: scale(1.05);
}

.central-media-editor-footer .liquid-glass-btn:disabled {
  cursor: default;
  opacity: 0.72;
  transform: none;
}

.central-media-editor-footer .liquid-glass-btn .material-symbols-outlined,
.central-media-editor-footer .liquid-glass-btn .local-svg-icon {
  position: static;
  display: inline-grid;
  width: 22px;
  height: 22px;
  min-width: 22px;
  min-height: 22px;
  flex: 0 0 auto;
  place-items: center;
  margin: 0;
  padding: 0;
  font-size: 22px;
  line-height: 1;
  transform: none;
}

.central-media-edit-thumbnail,
.central-media-edit-order,
.central-media-edit-visible,
.central-media-edit-delete {
  position: absolute;
  bottom: 16px;
  z-index: 6;
  display: grid;
  width: 40px;
  height: 40px;
  min-width: 40px;
  min-height: 40px;
  place-items: center;
  padding: 0;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 50%;
  color: rgba(255, 255, 255, 0.92);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.06)), rgba(9, 16, 13, 0.2);
  box-shadow: var(--bunny-emboss-border-shadow);
  font-size: 0;
  line-height: 1;
  cursor: pointer;
}

.central-media-edit-order-label {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 6;
  display: inline-flex;
  min-width: 0;
  max-width: calc(100% - 32px);
  align-items: center;
  justify-content: flex-end;
  color: rgb(238, 238, 238);
  font-size: 16px;
  font-weight: 600;
  line-height: 16px;
  text-align: right;
  text-shadow: none;
  white-space: nowrap;
  pointer-events: none;
}

.central-media-edit-order-prev {
  right: 16px;
  bottom: 112px;
}

.central-media-edit-order-next {
  right: 16px;
  bottom: 64px;
}

.central-media-edit-thumbnail {
  right: 112px;
}

.central-media-edit-visible {
  right: 64px;
}

.central-media-edit-delete {
  right: 16px;
}

.central-media-edit-thumbnail .local-svg-icon,
.central-media-edit-order .local-svg-icon,
.central-media-edit-visible .local-svg-icon,
.central-media-edit-delete .local-svg-icon {
  position: static;
  display: inline-grid;
  width: 24px;
  height: 24px;
  min-width: 24px;
  min-height: 24px;
  place-items: center;
  margin: 0;
  color: inherit;
  font-size: 24px;
  line-height: 1;
  transform: none;
  filter: none;
}

.central-media-edit-order:disabled {
  opacity: 0.38;
  cursor: default;
}

.central-media-edit-item.marked-hidden .central-media-edit-visible {
  border-color: rgba(227, 46, 46, 0.92);
  background: rgba(120, 0, 0, 0.52);
}

.central-media-edit-item.marked-delete .central-media-edit-delete {
  border-color: rgba(248, 113, 113, 0.72);
  background: rgba(248, 113, 113, 0.18);
}

.central-media-edit-thumbnail:hover,
.central-media-edit-visible:hover,
.central-media-edit-delete:hover {
  border-color: rgba(255, 255, 255, 0.2);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.06)), rgba(9, 16, 13, 0.2);
  transform: scale(1.06);
}

.central-media-edit-item.marked-hidden .central-media-edit-visible:hover,
.central-media-edit-item.marked-delete .central-media-edit-delete:hover {
  border-color: rgba(227, 46, 46, 0.92);
  background: rgba(120, 0, 0, 0.62);
}

.central-media-editor-footer .liquid-glass-btn .loading-svg-icon {
  box-sizing: border-box;
  display: block;
  width: 22px;
  height: 22px;
  min-width: 22px;
  min-height: 22px;
  border: 3px solid rgba(255, 255, 255, 0.28);
  border-top-color: rgb(255, 255, 255);
  border-radius: 50%;
  color: transparent;
  font-size: 0;
  line-height: 0;
  text-indent: -9999px;
  animation: 720ms linear infinite bunnySpinInPlace;
}

.central-edit-cancel,
.central-edit-save {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 16px;
  border: 1px solid var(--bunny-emboss-border);
  box-shadow: var(--bunny-emboss-border-shadow);
  color: var(--text);
  cursor: pointer;
}

.central-edit-save.busy .material-symbols-outlined {
  animation: 820ms linear infinite spin;
}

/* 59-thumbnail-editor-modal.css */
.thumbnail-editor-modal {
  z-index: 9500;
  --media-family-footer-height: 78px;
}

.unified-media-modal.thumbnail-editor-modal:not(.lightbox-mode) .unified-media-panel {
  display: flex;
  flex-direction: column;
}

.unified-media-modal.thumbnail-editor-modal:not(.lightbox-mode) .unified-media-head {
  position: absolute;
  z-index: 26;
  inset: 0;
  display: block;
  width: auto;
  height: auto;
  min-height: 0;
  padding: 0;
  border: 0;
  pointer-events: none;
}

.unified-media-modal.thumbnail-editor-modal:not(.lightbox-mode) .modal-close {
  pointer-events: auto;
}

.unified-media-modal.thumbnail-editor-modal:not(.lightbox-mode) .unified-media-head > div {
  display: none;
}

.unified-media-modal.thumbnail-editor-modal:not(.lightbox-mode) .unified-media-head h3 {
  position: absolute;
  bottom: 22px;
  left: 24px;
  margin: 0;
  color: rgb(221, 221, 221);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.2;
}

.unified-media-modal.thumbnail-editor-modal:not(.lightbox-mode) .unified-media-body {
  flex: 1 1 auto;
  max-height: calc(-236px + 100dvh);
  padding: var(--media-family-body-padding);
}

.thumbnail-editor-footer {
  justify-content: space-between;
}

.thumbnail-editor-footer h3 {
  margin: 0;
  color: rgb(221, 221, 221);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.2;
}

.unified-media-modal.thumbnail-editor-modal:not(.lightbox-mode) .unified-media-gallery .thumbnail-editor-media-tile {
  cursor: pointer;
}

/* 59-thumbnail-work-shell.css */
.thumbnail-work-modal {
  position: fixed;
  z-index: 9700;
  inset: 0;
  --thumbnail-work-close-size: 44px;
  --thumbnail-work-panel-height: min(720px, calc(100dvh - 84px));
  display: grid;
  place-items: center;
  padding: 42px;
  visibility: hidden;
  opacity: 0;
  background: var(--bunny-dim-overlay);
  transition: opacity 180ms ease, visibility 0s linear 180ms;
}

.thumbnail-work-modal.active {
  visibility: visible;
  opacity: 1;
  transition-delay: 0s;
}

.thumbnail-work-panel {
  position: relative;
  display: grid;
  width: min(1280px, calc(100vw - 84px));
  height: var(--thumbnail-work-panel-height);
  max-height: calc(100dvh - 84px);
  grid-template-rows: minmax(0, 1fr) auto;
  overflow: visible;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 20px;
  background: rgb(18, 18, 18);
  box-shadow: var(--bunny-emboss-window-shadow);
  transform: translateY(14px) scale(0.985);
  transition: transform 180ms ease;
}

.thumbnail-frame-modal .thumbnail-work-panel {
  width: var(--thumbnail-frame-panel-width, min(1280px, calc(100vw - 84px)));
  height: var(--thumbnail-frame-panel-height, var(--thumbnail-work-panel-height));
  max-width: 90vw;
  max-height: 90dvh;
}

.thumbnail-crop-modal .thumbnail-work-panel {
  width: var(--thumbnail-crop-panel-width, min(1280px, calc(100vw - 84px)));
  height: var(--thumbnail-crop-panel-height, var(--thumbnail-work-panel-height));
  max-width: calc(100vw - 84px);
  max-height: calc(100dvh - 84px);
}

.thumbnail-work-modal.active .thumbnail-work-panel {
  transform: translateY(0) scale(1);
}

.thumbnail-work-close {
  position: absolute;
  z-index: 4;
  top: calc(var(--thumbnail-work-close-size) / -2);
  right: calc(var(--thumbnail-work-close-size) / -2);
  left: auto;
  display: grid;
  width: var(--thumbnail-work-close-size);
  height: var(--thumbnail-work-close-size);
  place-items: center;
  padding: 0;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 50%;
  color: rgba(255, 255, 255, 0.94);
  background: rgba(255, 255, 255, 0.14);
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.4),
    inset 0 -1px 0 rgba(255, 255, 255, 0.06),
    inset 0 0 2px 1px rgba(255, 255, 255, 0.1);
  clip-path: inset(0 round 999px);
  contain: paint;
  backdrop-filter: blur(14px) saturate(1.2);
  -webkit-backdrop-filter: blur(14px) saturate(1.2);
  cursor: pointer;
  transition: transform 160ms cubic-bezier(0.22, 1, 0.36, 1);
}

.thumbnail-work-close:hover {
  transform: scale(1.06);
}

.thumbnail-work-close .material-symbols-outlined {
  font-size: 24px;
}

html.thumbnail-work-overlay-open #thumbnail-editor-modal.active .unified-media-dim {
  opacity: 0;
}

.thumbnail-work-modal .loading-svg-icon {
  width: 40px;
  min-width: 40px;
  max-width: 40px;
  height: 40px;
  min-height: 40px;
  max-height: 40px;
  border-width: 4px;
}

/* 59-thumbnail-crop.css */
.thumbnail-crop-stage {
  display: grid;
  min-height: 0;
  place-items: center;
  overflow: hidden;
  padding: 20px;
  border-radius: 20px 20px 0 0;
  background: rgb(18, 18, 18);
}

.thumbnail-crop-image-wrap {
  position: relative;
  display: grid;
  width: var(--thumbnail-crop-media-width, auto);
  height: var(--thumbnail-crop-media-height, auto);
  max-width: 100%;
  max-height: 100%;
  place-items: center;
  line-height: 0;
  user-select: none;
}

.thumbnail-crop-modal.is-loading .thumbnail-crop-stage::before {
  content: "";
  box-sizing: border-box;
  display: block;
  width: 40px;
  height: 40px;
  border: 4px solid rgba(255, 255, 255, 0.28);
  border-top-color: rgb(255, 255, 255);
  border-radius: 50%;
  background: transparent;
  animation: 720ms linear infinite bunnySpinInPlace;
}

.thumbnail-crop-modal.is-loading .thumbnail-crop-image-wrap {
  visibility: hidden;
}

.thumbnail-crop-image-wrap > img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  border-radius: 12px;
  object-fit: contain;
}

.thumbnail-crop-box {
  position: absolute;
  z-index: 2;
  box-sizing: border-box;
  min-width: 24px;
  min-height: 24px;
  border: 2px solid rgb(74, 222, 128);
  background: rgba(74, 222, 128, 0.08);
  box-shadow: rgba(0, 0, 0, 0.62) 0 0 0 9999px;
  cursor: move;
  touch-action: none;
}

.thumbnail-crop-box [data-crop-handle] {
  position: absolute;
  width: 14px;
  height: 14px;
  border: 2px solid rgb(255, 255, 255);
  border-radius: 50%;
  background: rgb(74, 222, 128);
  box-shadow: rgba(0, 0, 0, 0.5) 0 2px 8px;
  transform: translate(-50%, -50%);
}

.thumbnail-crop-box [data-crop-handle="nw"] { left: 0; top: 0; cursor: nwse-resize; }
.thumbnail-crop-box [data-crop-handle="n"] { left: 50%; top: 0; cursor: ns-resize; }
.thumbnail-crop-box [data-crop-handle="ne"] { left: 100%; top: 0; cursor: nesw-resize; }
.thumbnail-crop-box [data-crop-handle="e"] { left: 100%; top: 50%; cursor: ew-resize; }
.thumbnail-crop-box [data-crop-handle="se"] { left: 100%; top: 100%; cursor: nwse-resize; }
.thumbnail-crop-box [data-crop-handle="s"] { left: 50%; top: 100%; cursor: ns-resize; }
.thumbnail-crop-box [data-crop-handle="sw"] { left: 0; top: 100%; cursor: nesw-resize; }
.thumbnail-crop-box [data-crop-handle="w"] { left: 0; top: 50%; cursor: ew-resize; }

.thumbnail-work-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 18px 22px 22px;
  border-radius: 0 0 20px 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  background: rgb(16, 16, 16);
}

.thumbnail-work-title {
  margin: 0;
  color: rgb(221, 221, 221);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.2;
}

.thumbnail-work-action-group {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.thumbnail-crop-action,
.thumbnail-crop-ratio-label,
.thumbnail-action-primary {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 999px;
  color: rgb(221, 221, 221);
  background: rgba(255, 255, 255, 0.07);
  box-shadow: var(--bunny-emboss-border-shadow);
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
  transform-origin: center center;
  transition:
    transform 160ms cubic-bezier(0.22, 1, 0.36, 1),
    border-color 160ms,
    background 160ms,
    opacity 160ms;
}

.thumbnail-crop-action:hover,
.thumbnail-action-primary:hover {
  transform: scale(1.05);
}

.thumbnail-crop-ratio-label {
  cursor: default;
  opacity: 0.82;
  user-select: none;
}

.thumbnail-crop-action.active {
  border-color: rgb(74, 222, 128);
  color: rgb(221, 221, 221);
  background: rgba(74, 222, 128, 0.16);
}

.thumbnail-action-primary {
  gap: 7px;
  border-color: rgba(134, 239, 172, 0.52);
  background: rgba(34, 197, 94, 0.18);
}

.thumbnail-action-primary .material-symbols-outlined {
  font-size: 20px;
}

.thumbnail-action-primary.busy {
  cursor: wait;
  opacity: 0.72;
}

/* 59-thumbnail-frame.css */
.thumbnail-frame-stage {
  min-height: 0;
  overflow: auto;
  padding: 20px;
  border-radius: 20px 20px 0 0;
  background: rgb(18, 18, 18);
}

.thumbnail-frame-stage.is-loading {
  overflow: hidden;
}

.thumbnail-frame-grid {
  position: relative;
  display: grid;
  align-content: flex-start;
  grid-template-columns: repeat(var(--thumbnail-frame-columns, 1), var(--thumbnail-frame-option-width, 360px));
  gap: 20px;
  justify-content: center;
}

.thumbnail-frame-grid.is-loading {
  height: 100%;
  min-height: 100%;
  max-height: 100%;
  align-content: center;
  grid-template-columns: minmax(0, 1fr);
  overflow: hidden;
  place-items: center;
}

.thumbnail-frame-option {
  position: relative;
  display: grid;
  box-sizing: border-box;
  width: var(--thumbnail-frame-option-width, 360px);
  height: var(--thumbnail-frame-option-height, 360px);
  min-height: 0;
  overflow: hidden;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 16px;
  background: rgb(12, 12, 12);
  cursor: pointer;
}

.thumbnail-frame-option img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: contain;
}

.thumbnail-frame-option.landscape img {
  width: 100%;
  height: 100%;
}

.thumbnail-frame-option.portrait img {
  width: 100%;
  height: 100%;
}

.thumbnail-frame-option span {
  position: absolute;
  left: 12px;
  bottom: 12px;
  padding: 5px 9px;
  border-radius: 999px;
  color: rgb(255, 255, 255);
  background: rgba(0, 0, 0, 0.62);
  font-size: 13px;
  font-weight: 600;
}

.thumbnail-frame-option.selected {
  border-color: rgb(74, 222, 128);
  box-shadow: rgba(74, 222, 128, 0.28) 0 0 0 2px inset;
}

.thumbnail-frame-loading {
  display: grid;
  min-height: 320px;
  place-items: center;
  color: rgb(238, 238, 238);
}

.thumbnail-frame-grid.is-loading .thumbnail-frame-loading {
  width: 100%;
  height: 100%;
  min-height: 0;
}

.thumbnail-frame-loading .material-symbols-outlined {
  width: 40px;
  min-width: 40px;
  max-width: 40px;
  height: 40px;
  min-height: 40px;
  max-height: 40px;
  border-width: 4px;
}

.thumbnail-frame-action-group {
  align-items: center;
}

.thumbnail-frame-window-label {
  display: inline-flex;
  min-width: 70px;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  border: 0;
  color: rgb(221, 221, 221);
  background: transparent;
  box-shadow: none;
  font-size: 16px;
  font-weight: 500;
  text-align: center;
  cursor: pointer;
}

.thumbnail-frame-notice {
  position: fixed;
  z-index: 8;
  top: 50%;
  left: 50%;
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
  border-radius: 999px;
  color: rgb(238, 238, 238);
  background: rgba(0, 0, 0, 0.72);
  box-shadow: var(--bunny-emboss-border-shadow);
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  pointer-events: none;
  transform: translate(-50%, -50%);
  animation: thumbnailFrameNoticeBlink 620ms ease-in-out 2;
}

@keyframes thumbnailFrameNoticeBlink {
  0%, 100% { opacity: 0; }
  35%, 65% { opacity: 1; }
}

/* 59-media-editor-responsive.css */
@media (max-width: 767px) {
  html.thumbnail-work-overlay-open,
  html.media-modal-scroll-locked.thumbnail-work-overlay-open {
    overflow: hidden;
    scrollbar-gutter: auto;
  }

  .central-edit-modal {
    place-items: stretch;
    padding: 0;
    --media-family-body-padding: 14px;
    --media-family-close-size: 44px;
    --media-family-footer-height: 72px;
  }

  .central-edit-panel {
    width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    border: 0;
    border-radius: 0;
    background: rgb(18, 18, 18);
  }

  #central-edit-modal .modal-close {
    top: max(12px, env(safe-area-inset-top));
    right: max(12px, env(safe-area-inset-right));
  }

  #central-edit-modal .unified-media-head h3 {
    bottom: 24px;
    left: 14px;
    font-size: 20px;
  }

  .central-edit-body {
    display: grid;
    flex: 1 1 auto;
    max-height: none;
    align-items: center;
    overflow: auto;
    padding: var(--media-family-body-padding);
  }

  .central-media-editor {
    width: 100%;
    max-width: 100%;
  }

  .central-media-editor-grid {
    display: grid;
    width: 100%;
    height: auto;
    min-height: calc(100dvh - var(--media-family-footer-height) - 28px);
    align-content: center;
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
  }

  .central-media-edit-item.unified-media-tile {
    position: relative;
    left: auto;
    top: auto;
    width: 100%;
    max-width: 100%;
    height: auto;
    aspect-ratio: var(--media-aspect, 1 / 1);
    transform: none;
  }

  .central-media-editor-footer {
    min-height: var(--media-family-footer-height);
    align-items: center;
    padding: 0 14px;
  }

  .unified-media-modal.thumbnail-editor-modal:not(.lightbox-mode) {
    padding: 0;
    --media-family-body-padding: 14px;
    --media-family-close-size: 44px;
    --media-family-footer-height: 72px;
  }

  .unified-media-modal.thumbnail-editor-modal:not(.lightbox-mode) .unified-media-panel {
    width: 100vw;
    height: 100dvh;
    max-width: 100vw;
    max-height: 100dvh;
    border: 0;
    border-radius: 0;
    background: rgb(18, 18, 18);
    box-shadow: none;
  }

  .unified-media-modal.thumbnail-editor-modal:not(.lightbox-mode) .modal-close {
    top: max(12px, env(safe-area-inset-top));
    right: max(12px, env(safe-area-inset-right));
  }

  .unified-media-modal.thumbnail-editor-modal:not(.lightbox-mode) .unified-media-body {
    display: grid;
    flex: 1 1 auto;
    max-height: none;
    align-items: center;
    overflow: auto;
    padding: var(--media-family-body-padding);
  }

  .unified-media-modal.thumbnail-editor-modal:not(.lightbox-mode) .unified-media-grid,
  .unified-media-modal.thumbnail-editor-modal:not(.lightbox-mode) .unified-media-only {
    width: 100%;
    height: auto;
    max-height: none;
  }

  .unified-media-modal.thumbnail-editor-modal:not(.lightbox-mode) .unified-media-gallery {
    display: grid;
    width: 100%;
    height: auto;
    min-height: calc(100dvh - var(--media-family-footer-height) - 28px);
    align-content: center;
    max-width: 100%;
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
  }

  .unified-media-modal.thumbnail-editor-modal:not(.lightbox-mode) .unified-media-gallery .thumbnail-editor-media-tile {
    position: relative;
    left: auto;
    top: auto;
    width: 100%;
    max-width: 100%;
    height: auto;
    aspect-ratio: var(--media-aspect, 1 / 1);
    transform: none;
  }

  .thumbnail-editor-footer {
    min-height: var(--media-family-footer-height);
    align-items: center;
    padding: 0 14px;
  }

  .thumbnail-editor-footer h3 {
    font-size: 20px;
  }

  .thumbnail-crop-modal.thumbnail-work-modal,
  .thumbnail-frame-modal.thumbnail-work-modal {
    inset: 0;
    display: grid;
    place-items: stretch;
    width: 100vw;
    width: 100dvw;
    height: 100vh;
    height: 100dvh;
    max-width: none;
    max-height: none;
    padding: 0;
    overflow: hidden;
    --thumbnail-work-panel-height: 100dvh;
    background: var(--bunny-dim-overlay);
  }

  .thumbnail-crop-modal .thumbnail-work-panel,
  .thumbnail-frame-modal .thumbnail-work-panel {
    width: 100vw;
    width: 100dvw;
    min-width: 100vw;
    min-width: 100dvw;
    height: 100vh;
    height: 100dvh;
    min-height: 100dvh;
    max-width: none;
    max-height: 100dvh;
    grid-template-rows: minmax(0, 1fr) auto;
    border: 0;
    border-radius: 0;
    background: rgb(18, 18, 18);
    box-shadow: none;
    transform: none;
  }

  .thumbnail-crop-modal.active .thumbnail-work-panel,
  .thumbnail-frame-modal.active .thumbnail-work-panel {
    transform: none;
  }

  .thumbnail-crop-modal .thumbnail-work-close,
  .thumbnail-frame-modal .thumbnail-work-close {
    top: max(12px, env(safe-area-inset-top));
    right: max(12px, env(safe-area-inset-right));
    left: auto;
    width: 44px;
    height: 44px;
    border: 1px solid var(--bunny-emboss-border);
    background: rgba(255, 255, 255, 0.14);
    box-shadow: var(--bunny-emboss-border-shadow);
  }

  .thumbnail-crop-modal .thumbnail-crop-stage,
  .thumbnail-frame-modal .thumbnail-frame-stage {
    width: 100vw;
    width: 100dvw;
    min-height: 0;
    place-items: center;
    padding: calc(max(12px, env(safe-area-inset-top)) + 58px) 12px 16px;
  }

  .thumbnail-crop-modal .thumbnail-crop-stage {
    overflow: hidden;
  }

  .thumbnail-frame-modal .thumbnail-frame-stage {
    overflow: auto;
  }

  .thumbnail-frame-modal .thumbnail-frame-stage.is-loading {
    overflow: hidden;
  }

  .thumbnail-crop-modal .thumbnail-crop-image-wrap {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
  }

  .thumbnail-crop-modal .thumbnail-crop-image-wrap > img {
    max-width: calc(100vw - 24px);
    max-width: calc(100dvw - 24px);
    max-height: calc(100dvh - 176px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    border-radius: 0;
  }

  .thumbnail-crop-modal .thumbnail-work-actions,
  .thumbnail-frame-modal .thumbnail-work-actions {
    position: relative;
    z-index: 3;
    width: 100vw;
    width: 100dvw;
    justify-content: space-between;
    gap: 8px;
    padding: 12px 12px max(12px, env(safe-area-inset-bottom));
    background: rgb(18, 18, 18);
  }

  .thumbnail-crop-modal .thumbnail-crop-action,
  .thumbnail-crop-modal .thumbnail-crop-ratio-label,
  .thumbnail-crop-modal .thumbnail-action-primary,
  .thumbnail-frame-modal .thumbnail-crop-action,
  .thumbnail-frame-modal .thumbnail-action-primary {
    min-height: 40px;
    padding: 0 12px;
    font-size: 16px;
  }

  .thumbnail-frame-grid {
    display: grid;
    grid-template-columns: minmax(0, calc(100dvw - 40px));
    gap: 20px;
    justify-content: center;
  }

  .thumbnail-frame-option {
    width: calc(100dvw - 40px);
    max-width: calc(100dvw - 40px);
    height: auto;
    aspect-ratio: auto;
    background: transparent;
  }

  .thumbnail-frame-option img {
    width: 100%;
    height: auto;
    object-fit: contain;
  }

  .thumbnail-frame-option.landscape img,
  .thumbnail-frame-option.portrait img {
    width: 100%;
    height: auto;
  }
}

/* 60-database-actions.css */
.db-inline-action {
  display: inline-flex;
  height: 32px;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  border: 0;
  color: var(--text);
  background: transparent;
  cursor: pointer;
  font-size: 12px;
  font-weight: 430;
  text-align: left;
}

.db-inline-action .material-symbols-outlined {
  font-size: 16px;
}

.db-inline-action.busy .material-symbols-outlined {
  animation: 820ms linear infinite spin;
}

.db-inline-action:disabled {
  cursor: default;
  color: var(--muted);
}

.db-inline-action:not(:disabled):hover {
  color: var(--accent);
}

.db-cache-state {
  overflow: hidden;
  color: rgba(238, 248, 242, 0.62);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.db-cache-state.ready {
  color: var(--accent);
}

.db-cache-state.missing {
  color: var(--yellow);
}

.db-cache-state.partial,
.db-cache-state.pending {
  color: rgba(238, 248, 242, 0.56);
}

.db-icon-link,
.db-icon-empty {
  display: grid;
  place-items: center;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-decoration: none;
}

.db-icon-link .material-symbols-outlined {
  font-size: 20px;
}

.db-icon-link.busy .material-symbols-outlined {
  animation: 820ms linear infinite spin;
}

/* 61-database-inline-edit.css */
@media (max-width: 767px) {
  body[data-page="database"] .page-database .admin-page-title,
  .central-db-panel {
    max-width: 100%;
  }
}

body[data-page="database"] {
  --db-table-width: 3070px;
}

body[data-page="database"] .page-database .admin-page-title p { max-width: none; }

body[data-page="database"] .db-thumb { padding: 8px; text-align: center; vertical-align: middle; }

body[data-page="database"] .db-thumb img, body[data-page="database"] .db-thumb > .material-symbols-outlined { width: 84px; aspect-ratio: 16 / 9; margin: 0px auto; border-radius: 0px; }

body[data-page="database"] .db-thumb img { display: block; object-fit: cover; background: rgba(255, 255, 255, 0.05); }

body[data-page="database"] .db-thumb > .material-symbols-outlined { display: grid; place-items: center; color: rgba(255, 255, 255, 0.72); background: rgba(255, 255, 255, 0.06); font-size: 24px; }

body[data-page="database"] .central-db-row.source-schedule .db-thumb { background: transparent; }

body[data-page="database"] .central-db-row.source-schedule .db-thumb > .material-symbols-outlined { background: transparent; }

body[data-page="database"] .db-thumb > .material-symbols-outlined[hidden] { display: none; }

body[data-page="database"] .db-thumbnail-change {
  position: relative;
  display: grid;
  place-items: center;
  width: 84px;
  height: auto;
  aspect-ratio: 16 / 9;
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  overflow: hidden;
  color: rgb(255, 255, 255);
  background: transparent;
  cursor: pointer;
}

body[data-page="database"] .db-thumbnail-change img,
body[data-page="database"] .db-thumbnail-change > .material-symbols-outlined {
  width: 84px;
  height: 100%;
  margin: 0;
  border-radius: 0;
}

body[data-page="database"] .db-thumbnail-change > .material-symbols-outlined {
  display: grid;
  place-items: center;
  color: rgba(255, 255, 255, 0.72);
  background: rgba(255, 255, 255, 0.06);
  font-size: 24px;
}

body[data-page="database"] .db-thumbnail-change > .material-symbols-outlined[hidden] { display: none; }

body[data-page="database"] .db-thumbnail-change::after {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0;
  background: rgba(0, 0, 0, 0.64);
  transition: opacity 140ms ease;
}

body[data-page="database"] .db-thumbnail-change-label {
  position: absolute;
  z-index: 2;
  opacity: 0;
  color: rgb(255, 255, 255);
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  pointer-events: none;
  transition: opacity 140ms ease;
}

body[data-page="database"] .db-thumbnail-change:hover::after,
body[data-page="database"] .db-thumbnail-change:focus-visible::after,
body[data-page="database"] .db-thumbnail-change:hover .db-thumbnail-change-label,
body[data-page="database"] .db-thumbnail-change:focus-visible .db-thumbnail-change-label {
  opacity: 1;
}

body[data-page="database"] .db-title,
body[data-page="database"] .db-content { align-items: center; align-self: stretch; justify-content: flex-start; height: 100%; min-height: 80px; max-height: none; padding: 0px 14px; color: rgb(209, 213, 219); line-height: 1.42; text-align: left; word-break: keep-all; overflow-wrap: anywhere; overflow: hidden; }

body[data-page="database"] .db-title-text,
body[data-page="database"] .db-content-text { display: -webkit-box; width: 100%; max-height: calc(4.26em); overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }

body[data-page="database"] .db-inline-edit { position: relative; isolation: isolate; cursor: text; border-radius: 0px; transition: outline-color 140ms, box-shadow 140ms; }

body[data-page="database"] .db-inline-edit:not(.editing) { cursor: default; }

body[data-page="database"] .db-inline-edit:hover, body[data-page="database"] .db-inline-edit:focus { background: transparent; box-shadow: none; }

body[data-page="database"] .db-inline-edit.editing { z-index: 140; align-self: stretch; height: 100%; min-height: 74px; max-height: none; overflow: visible; border-right-color: transparent; border-radius: 0px; -webkit-line-clamp: unset; }

body[data-page="database"] .db-inline-edit.editing::after { content: ""; position: absolute; top: 0px; right: -1px; bottom: 0px; z-index: 80; width: 1px; background: rgba(75, 85, 99, 0.66); pointer-events: none; }

body[data-page="database"] .db-title.editing,
body[data-page="database"] .db-content.editing { align-items: stretch; min-height: 112px; padding: 8px 10px; }

body[data-page="database"] .db-title.editing .db-title-text,
body[data-page="database"] .db-content.editing .db-content-text { display: none; }

body[data-page="database"] .db-inline-edit.saving { opacity: 0.58; }

body[data-page="database"] .db-inline-control { width: 100%; min-width: 0px; border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 8px; color: rgb(255, 255, 255); background: rgba(0, 0, 0, 0.34); outline: none; font: inherit; text-align: inherit; }

body[data-page="database"] .db-inline-choice { position: absolute; top: calc(100% + 7px); left: 50%; z-index: 120; width: max-content; min-width: 132px; max-width: 220px; margin: 0px; border-radius: 0px; overflow: visible; transform: translateX(-50%); }

body[data-page="database"] .db-inline-choice-option { color: rgba(255, 255, 255, 0.94); font: inherit; white-space: nowrap; word-break: keep-all; }

body[data-page="database"] .db-inline-choice-menu { position: static; display: grid; width: max-content; min-width: 132px; max-width: 220px; gap: 2px; padding: 7px; border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 16px; background: linear-gradient(145deg, rgba(24, 24, 24, 0.99), rgba(7, 7, 7, 0.98)); box-shadow: rgba(0, 0, 0, 0.42) 0px 18px 44px, rgba(255, 255, 255, 0.1) 0px 1px inset; backdrop-filter: blur(22px) saturate(1.25); }

body[data-page="database"] .db-inline-choice-option { display: flex; width: 100%; min-height: 34px; align-items: center; justify-content: center; padding: 0px 14px; border: 0px; border-radius: 11px; text-align: center; cursor: pointer; background: transparent; box-shadow: none; }

body[data-page="database"] .db-inline-choice-option:hover, body[data-page="database"] .db-inline-choice-option.active { color: rgb(255, 255, 255); background: rgba(255, 255, 255, 0.11); }

body[data-page="database"] select.db-inline-control { appearance: none; min-height: 38px; padding: 0px 30px 0px 12px; border-color: rgba(255, 255, 255, 0.22); border-radius: 12px; color: rgba(255, 255, 255, 0.94); background: linear-gradient(135deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.043)), linear-gradient(45deg, transparent 50%, rgba(255, 255, 255, 0.78) 50%) right 15px center / 7px 7px no-repeat, linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(0, 0, 0, 0.34)); box-shadow: rgba(0, 0, 0, 0.22) 0px 10px 24px, rgba(255, 255, 255, 0.12) 0px 1px inset; backdrop-filter: blur(16px) saturate(1.35); }

body[data-page="database"] select.db-inline-control, body[data-page="database"] input.db-inline-control { min-height: 32px; padding: 0px 8px; }

body[data-page="database"] textarea.db-inline-control { min-height: 112px; max-height: 380px; padding: 8px; line-height: 1.42; resize: vertical; text-align: left; }

body[data-page="database"] .db-icon-link:hover, body[data-page="database"] .db-icon-link:focus { color: rgb(96, 165, 250); }

body[data-page="database"] .db-delete-link:hover, body[data-page="database"] .db-delete-link:focus { color: rgb(248, 113, 113); }

body[data-page="database"] .db-edit-link:hover, body[data-page="database"] .db-edit-link:focus { color: rgb(134, 239, 172); }

body[data-page="database"] .db-open-link:hover, body[data-page="database"] .db-open-link:focus { color: rgb(96, 165, 250); }

@media (max-width: 1180px) {
body[data-page="database"] .page-database .admin-page-title { grid-template-columns: auto 1fr; }
}

body[data-page="database"] .db-file-cell { position: relative; line-height: 1.25; cursor: default; overflow: visible; }

body[data-page="database"] .db-file-cell::after { content: none; }

body[data-page="database"] .db-file-cell::before { content: none; }

.db-file-tooltip { position: fixed; z-index: 9999; width: max-content; min-width: 280px; max-width: min(620px, -24px + 100vw); max-height: min(704px, -24px + 100vh); padding: 14px 16px; overflow: auto; color: rgb(221, 221, 221); font-size: 15px; font-weight: 400; line-height: 1.45; text-align: left; white-space: pre-line; pointer-events: auto; opacity: 0; transform: translateY(4px) scale(0.99); border: 1px solid rgb(255, 160, 122); border-radius: 8px; background: rgba(26, 26, 26, 0.98); box-shadow: rgba(0, 0, 0, 0.42) 0px 18px 48px; backdrop-filter: none; transition: opacity 140ms, transform 140ms; }

.db-file-tooltip.active { opacity: 1; transform: translateY(0px) scale(1); }

.db-file-tooltip a { color: inherit; font: inherit; text-decoration: underline; text-underline-offset: 3px; }

body[data-page="database"] .db-bot-state.posted { color: rgb(125, 211, 252); text-decoration: none; }

body[data-page="database"] .db-bot-state.pending { color: rgba(255, 255, 255, 0.46); }

body[data-page="database"]::before, body[data-page="sources"]::before, body[data-page="settings"]::before { opacity: 0; }

.db-icon-link .local-svg-icon { width: 20px; height: 20px; opacity: 0.9; }

body[data-page="database"] .db-icon-link:hover .local-svg-icon, body[data-page="database"] .db-icon-link:focus .local-svg-icon { opacity: 1; }

body[data-page="database"] .db-edit-link:hover .local-svg-icon, body[data-page="database"] .db-edit-link:focus .local-svg-icon { color: rgb(134, 239, 172); filter: drop-shadow(rgba(134, 239, 172, 0.36) 0px 0px 8px); }

body[data-page="database"] .db-open-link:hover .local-svg-icon, body[data-page="database"] .db-open-link:focus .local-svg-icon { color: rgb(96, 165, 250); filter: drop-shadow(rgba(96, 165, 250, 0.36) 0px 0px 8px); }

body[data-page="database"] .db-delete-link:hover .local-svg-icon, body[data-page="database"] .db-delete-link:focus .local-svg-icon { color: rgb(248, 113, 113); filter: drop-shadow(rgba(248, 113, 113, 0.36) 0px 0px 8px); }

/* 62-database-table.css */
body[data-page="database"] .central-db-floating-controls {
  --database-floating-total-width: min(370px, calc(100vw - 20px));
  --database-floating-height: 54px;
  --database-floating-gap: 8px;
  position: fixed;
  left: 50%;
  bottom: max(18px, env(safe-area-inset-bottom));
  z-index: 282;
  box-sizing: border-box;
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--database-floating-height);
  width: var(--database-floating-total-width);
  height: var(--database-floating-height);
  min-height: var(--database-floating-height);
  align-items: center;
  gap: var(--database-floating-gap);
  transform: translateX(-50%);
  pointer-events: auto;
}

body[data-page="database"] .central-db-search {
  position: relative;
  left: auto;
  bottom: auto;
  z-index: 0;
  isolation: isolate;
  box-sizing: border-box;
  display: grid;
  grid-template-columns: minmax(0px, 1fr) 34px;
  width: 100%;
  height: 100%;
  min-height: 100%;
  align-items: center;
  gap: 8px;
  padding: 0 22px;
  overflow: hidden;
  border: 0;
  border-radius: 999px;
  background: transparent;
  transform: none;
}

body[data-page="database"] .central-db-search::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: inherit;
  background: rgba(22, 22, 22, 0.88);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
  pointer-events: none;
}

body[data-page="database"] .central-db-search::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  border-radius: inherit;
  background:
    linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.62), transparent) top / 100% 1px no-repeat,
    linear-gradient(180deg, rgba(255, 255, 255, 0.62), transparent, rgba(255, 255, 255, 0.22)) left / 1px 100% no-repeat;
  pointer-events: none;
}

body[data-page="database"] .central-db-search .local-svg-icon {
  position: relative;
  z-index: 1;
  grid-column: 2;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  color: rgb(238, 238, 238);
  font-size: 30px;
  line-height: 30px;
}

body[data-page="database"] .central-db-search input {
  position: relative;
  z-index: 1;
  grid-column: 1;
  box-sizing: border-box;
  display: block;
  width: 100%;
  height: 100%;
  min-width: 0px;
  padding: 0;
  border: 0;
  outline: 0;
  color: rgb(238, 238, 238);
  background: transparent;
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
}

body[data-page="database"] .central-db-search input::placeholder {
  color: rgb(187, 187, 187);
  opacity: 1;
}

body[data-page="database"] .central-db-panel.is-loading { display: grid; min-height: 360px; place-items: center; border-color: transparent; background: transparent; }

body[data-page="database"] .central-db-panel.is-loading .central-db-mount { display: grid; min-height: 360px; place-items: center; }

body[data-page="database"] .database-loading-state { display: grid; position: fixed; inset: 0px; z-index: 30; width: 100vw; height: 100svh; min-height: 100svh; place-items: center; pointer-events: none; }

body[data-page="database"] .database-loading-spinner { --database-spinner-angle: 0deg; box-sizing: border-box; display: block; position: fixed; top: 50svh; left: 50vw; width: 56px; height: 56px; min-width: 56px; min-height: 56px; max-width: 56px; max-height: 56px; margin: 0px; padding: 0px; overflow: hidden; contain: layout paint; border: 0px; border-radius: 50%; background: transparent; transform: translate(-50%, -50%); }

body[data-page="database"] .database-loading-spinner::before { content: ""; position: absolute; inset: 0px; border-radius: 50%; background: conic-gradient(
    from var(--database-spinner-angle),
    rgba(255, 255, 255, 0.96) 0deg 78deg,
    rgba(255, 255, 255, 0.22) 78deg 360deg
  ); mask: radial-gradient(farthest-side, transparent calc(100% - 5px), rgb(0, 0, 0) calc(100% - 4px)); animation: 760ms linear 0s infinite normal none running databaseSpinnerSpin; }

body[data-page="database"] .central-db-table { display: table; width: var(--db-table-width); min-width: var(--db-table-width); margin: 0px; border: 0px; border-collapse: separate; border-spacing: 0px; table-layout: fixed; border-radius: 4px; background: rgb(26, 26, 26); color: rgb(221, 221, 221); font-size: 15px; font-weight: 400; line-height: 1.35; }

body[data-page="database"] .central-db-head th, body[data-page="database"] .central-db-row > td, body[data-page="database"] .central-db-row > td *, body[data-page="database"] .db-source, body[data-page="database"] .db-account, body[data-page="database"] .db-type, body[data-page="database"] .db-row-order, body[data-page="database"] .db-count, body[data-page="database"] .db-media-count, body[data-page="database"] .db-file-cell, body[data-page="database"] .db-bot-state, body[data-page="database"] .db-title, body[data-page="database"] .db-title-text, body[data-page="database"] .db-content, body[data-page="database"] .db-content-text { color: rgb(221, 221, 221); font-size: 15px; font-weight: 400; line-height: 1.35; }

body[data-page="database"] .central-db-head th:first-child { border-top-left-radius: 4px; }

body[data-page="database"] .central-db-head th:last-child { border-top-right-radius: 4px; }

body[data-page="database"] .db-sortable-head {
  cursor: pointer;
}

body[data-page="database"] .db-filterable-head {
  cursor: pointer;
}

body[data-page="database"] .db-sort-header,
body[data-page="database"] .db-filter-header {
  display: inline-flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  color: inherit;
  background: transparent;
  font: inherit;
  cursor: pointer;
}

body[data-page="database"] .db-sortable-head.sorted .db-sort-header,
body[data-page="database"] .db-filterable-head.filtered .db-filter-header,
body[data-page="database"] .db-filterable-head.menu-open .db-filter-header {
  color: rgb(255, 255, 255);
}

body[data-page="database"] .db-filter-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 50%;
  z-index: 220;
  display: grid;
  width: max-content;
  min-width: 144px;
  max-width: 260px;
  gap: 2px;
  padding: 7px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 16px;
  background: rgb(18, 18, 18);
  box-shadow: rgba(0, 0, 0, 0.42) 0 18px 44px, rgba(255, 255, 255, 0.1) 0 1px inset;
  transform: translateX(-50%);
}

body[data-page="database"] .db-filter-option {
  display: flex;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  border: 0;
  border-radius: 11px;
  color: rgb(221, 221, 221);
  background: transparent;
  font: inherit;
  white-space: nowrap;
  cursor: pointer;
}

body[data-page="database"] .db-filter-option:hover,
body[data-page="database"] .db-filter-option.active {
  color: rgb(255, 255, 255);
  background: rgba(255, 255, 255, 0.11);
}

body[data-page="database"] .central-db-row { height: 80px; }

body[data-page="database"] .central-db-row > td, body[data-page="database"] .central-db-row.source-namookkun > td, body[data-page="database"] .central-db-row.source-binstagram > td, body[data-page="database"] .central-db-row.source-binxrchive > td { display: table-cell; height: 80px; border-width: 0px 1px 1px 0px; border-style: none solid solid none; border-color: currentcolor rgb(85, 85, 85) rgb(85, 85, 85) currentcolor; border-image: initial; background: none rgb(26, 26, 26); }

body[data-page="database"] .central-db-row.is-nonpublic > td {
  background: rgb(55, 31, 31);
}

body[data-page="database"] .central-db-row.is-nonpublic > td:first-child {
  box-shadow: none;
}

body[data-page="database"] .central-db-head th:nth-last-child(-n+3), body[data-page="database"] .central-db-row > td:nth-last-child(-n+3) { padding-right: 0px; padding-left: 0px; }

body[data-page="database"] .db-account, body[data-page="database"] .db-display-name { justify-content: center; padding-right: 8px; padding-left: 8px; text-align: center; white-space: nowrap; }

body[data-page="database"] .db-row-order,
body[data-page="database"] .db-source,
body[data-page="database"] .db-type,
body[data-page="database"] .db-profile,
body[data-page="database"] .db-published-at,
body[data-page="database"] .db-processed-at,
body[data-page="database"] .db-processing-method,
body[data-page="database"] .db-count,
body[data-page="database"] .db-download-count,
body[data-page="database"] .db-bot-cell,
body[data-page="database"] .db-file-cell {
  text-align: center;
  vertical-align: middle;
}

body[data-page="database"] .db-profile {
  padding: 8px;
}

body[data-page="database"] .db-profile-avatar,
body[data-page="database"] .db-profile-change {
  position: relative;
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  margin: 0 auto;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 50%;
  color: rgba(255, 255, 255, 0.78);
  background: rgba(255, 255, 255, 0.06);
}

body[data-page="database"] .db-profile-change {
  cursor: pointer;
}

body[data-page="database"] .db-profile-avatar img,
body[data-page="database"] .db-profile-change img,
body[data-page="database"] .db-profile-avatar > .material-symbols-outlined,
body[data-page="database"] .db-profile-change > .material-symbols-outlined {
  width: 42px;
  height: 42px;
  border-radius: 50%;
}

body[data-page="database"] .db-profile-avatar img,
body[data-page="database"] .db-profile-change img {
  display: block;
  object-fit: cover;
}

body[data-page="database"] .db-profile-avatar > .material-symbols-outlined,
body[data-page="database"] .db-profile-change > .material-symbols-outlined {
  display: grid;
  place-items: center;
  font-size: 22px;
}

body[data-page="database"] .db-profile-change::after {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0;
  background: rgba(0, 0, 0, 0.64);
  transition: opacity 140ms ease;
}

body[data-page="database"] .db-profile-change-label {
  position: absolute;
  z-index: 2;
  opacity: 0;
  color: rgb(255, 255, 255);
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  pointer-events: none;
  transition: opacity 140ms ease;
}

body[data-page="database"] .db-profile-change:hover::after,
body[data-page="database"] .db-profile-change:focus-visible::after,
body[data-page="database"] .db-profile-change:hover .db-profile-change-label,
body[data-page="database"] .db-profile-change:focus-visible .db-profile-change-label {
  opacity: 1;
}

body[data-page="database"] .db-bot-cell,
body[data-page="database"] .db-file-cell {
  padding-right: 8px;
  padding-left: 8px;
}

body[data-page="database"] .central-db-row > td:nth-last-child(-n+3) .db-icon-link { display: grid; width: 100%; height: 100%; place-items: center; }

body[data-page="database"] .central-db-head th:last-child, body[data-page="database"] .central-db-row > td:last-child { border-right: 0px; }

body[data-page="database"] .central-db-row:last-child > td { border-bottom: 0px; }

body[data-page="database"] .central-db-row:hover, body[data-page="database"] .central-db-row:hover > td { background: none rgb(36, 36, 36); }

body[data-page="database"] .central-db-row.is-nonpublic:hover,
body[data-page="database"] .central-db-row.is-nonpublic:hover > td {
  background: none rgb(62, 35, 35);
}

body[data-page="database"] .db-icon-link:hover, body[data-page="database"] .db-icon-link:focus, body[data-page="database"] .db-delete-link:hover, body[data-page="database"] .db-delete-link:focus, body[data-page="database"] .db-edit-link:hover, body[data-page="database"] .db-edit-link:focus, body[data-page="database"] .db-open-link:hover, body[data-page="database"] .db-open-link:focus { background: transparent; box-shadow: none; transform: none; }

body[data-page="database"] .db-icon-link .local-svg-icon, body[data-page="database"] .db-icon-link:hover .local-svg-icon, body[data-page="database"] .db-icon-link:focus .local-svg-icon { width: 24px; height: 24px; place-items: center; font-size: 24px; line-height: 1; transform: none; transition: color 160ms, filter 160ms, opacity 160ms; }

body[data-page="database"] .db-inline-choice { box-sizing: border-box; min-height: 0px; height: auto; padding: 0px; border: 0px; background: transparent; box-shadow: none; }

body[data-page="database"] .db-inline-choice-current { display: none; }

/* 62-database-scroll-shell.css */
html:has(body[data-page="database"]) { overflow: hidden; }

body[data-page="database"] {
  width: 100vw;
  min-width: 0;
  height: 100svh;
  overflow: hidden;
}

body[data-page="database"] .app-main {
  box-sizing: border-box;
  width: 100vw;
  min-height: 100svh;
  height: 100svh;
  padding: 22px 18px 0;
  margin-left: 0;
  overflow: hidden;
}

body[data-page="database"] .page-database {
  box-sizing: border-box;
  display: grid;
  width: 100%;
  max-width: none;
  height: calc(100svh - 22px);
  min-height: 0;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 12px;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

body[data-page="database"] .page-database .admin-page-title {
  box-sizing: border-box;
  position: relative;
  top: auto;
  z-index: 180;
  display: grid;
  width: 100%;
  max-width: none;
  margin: 0;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  column-gap: 18px;
  padding: 0 0 8px;
  background: rgb(0, 0, 0);
}

body[data-page="database"] .page-database .admin-page-title::after { content: none; }

body[data-page="database"] .page-database .admin-page-title > .local-svg-icon {
  position: static;
  grid-column: 1;
  justify-self: start;
  width: 24px;
  height: 24px;
  transform: none;
}

body[data-page="database"] .page-database .admin-page-title > div:not(.central-db-summary) {
  grid-column: 2;
  min-width: 0;
}

body[data-page="database"] .central-db-panel {
  box-sizing: border-box;
  display: block;
  justify-self: center;
  width: min(calc(var(--db-table-width, 3090px) + 2px), calc(100vw - 36px));
  max-width: none;
  min-height: 0;
  height: 100%;
  margin: 0 auto;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgb(85, 85, 85);
  border-radius: 4px;
  background: rgb(26, 26, 26);
  box-shadow: none;
}

body[data-page="database"] .central-db-mount {
  display: block;
  width: 100%;
  min-height: 0;
  height: 100%;
  overflow: hidden;
}

body[data-page="database"] .central-db-table-shell {
  --db-scroll-left: 0px;
  position: relative;
  box-sizing: border-box;
  display: grid;
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
  grid-template-rows: 46px minmax(0, 1fr);
  overflow: hidden;
  background: rgb(26, 26, 26);
}

body[data-page="database"] .central-db-head-scroll {
  position: relative;
  z-index: 5;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  height: 46px;
  min-height: 46px;
  overflow: visible;
  border-top: 0;
  background: rgb(37, 37, 37);
}

body[data-page="database"] .central-db-head-table {
  transform: translateX(calc(-1 * var(--db-scroll-left)));
  will-change: transform;
}

body[data-page="database"] .central-db-scroll {
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: auto;
  overscroll-behavior: contain;
  background: rgb(26, 26, 26);
  scrollbar-width: none;
}

body[data-page="database"] .central-db-scroll::-webkit-scrollbar {
  width: 0;
  height: 0;
  background: transparent;
}

body[data-page="database"] .central-db-scrollbar {
  position: absolute;
  z-index: 8;
  opacity: 0;
  pointer-events: none;
  transition: opacity 140ms ease;
}

body[data-page="database"] .central-db-table-shell.is-scrolling .central-db-scrollbar {
  opacity: 1;
  pointer-events: auto;
}

body[data-page="database"] .central-db-scrollbar-y {
  top: 48px;
  right: 0;
  bottom: 3px;
  width: 14px;
}

body[data-page="database"] .central-db-scrollbar-x {
  right: 3px;
  bottom: 0;
  left: 2px;
  height: 14px;
}

body[data-page="database"] .central-db-scrollbar i {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.34);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18);
  cursor: grab;
  touch-action: none;
}

body[data-page="database"] .central-db-scrollbar-y i {
  left: 4px;
  width: 6px;
  height: 34px;
}

body[data-page="database"] .central-db-scrollbar-x i {
  width: 42px;
  top: 4px;
  height: 6px;
}

body[data-page="database"] .central-db-table-shell.is-dragging .central-db-scrollbar i {
  cursor: grabbing;
}

body[data-page="database"] .central-db-head th {
  position: static;
  z-index: auto;
  height: 46px;
  min-height: 46px;
  padding: 12px 14px;
  border-width: 0 1px 1px 0;
  border-style: solid;
  border-color: rgb(85, 85, 85);
  color: rgb(221, 221, 221);
  background: rgb(37, 37, 37);
  box-shadow: none;
  font-size: 15px;
  font-weight: 500;
  text-transform: none;
}

/* 62-database-smart-select.css */
body[data-page="database"] .db-smart-select {
  text-align: center;
  white-space: nowrap;
}

body[data-page="database"] .db-smart-select-state,
body[data-page="database"] .db-smart-select-button {
  box-sizing: border-box;
  display: inline-grid;
  width: 72px;
  min-height: 28px;
  place-items: center;
  padding: 4px 8px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: rgb(221, 221, 221);
  font: inherit;
  line-height: 1.2;
}

body[data-page="database"] .db-smart-select-state.complete {
  color: rgb(52, 211, 153);
}

body[data-page="database"] .db-smart-select-state.pending,
body[data-page="database"] .db-smart-select-button.pending {
  color: rgb(255, 146, 0);
}

body[data-page="database"] .db-smart-select-state.not-supported {
  color: rgb(136, 136, 136);
}

body[data-page="database"] .db-smart-select-button {
  cursor: pointer;
}

body[data-page="database"] .db-smart-select-button:hover,
body[data-page="database"] .db-smart-select-button:focus-visible {
  color: rgb(255, 178, 76);
  outline: none;
}

body[data-page="database"] .db-visibility-cell {
  text-align: center;
  white-space: nowrap;
}

body[data-page="database"] .db-visibility-toggle,
body[data-page="database"] .db-visibility-state {
  box-sizing: border-box;
  display: inline-grid;
  width: 100%;
  min-height: 32px;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: rgb(52, 211, 153);
  font: inherit;
  line-height: 1.2;
}

body[data-page="database"] .db-visibility-toggle .local-svg-icon,
body[data-page="database"] .db-visibility-state .local-svg-icon {
  width: 24px;
  height: 24px;
  place-items: center;
  color: currentColor;
  font-size: 24px;
  line-height: 1;
}

body[data-page="database"] .db-visibility-toggle {
  cursor: pointer;
}

body[data-page="database"] .db-visibility-toggle.hidden,
body[data-page="database"] .db-visibility-state.hidden {
  color: rgb(227, 86, 86);
}

body[data-page="database"] .db-visibility-toggle:hover,
body[data-page="database"] .db-visibility-toggle:focus-visible {
  color: rgb(255, 255, 255);
  outline: none;
}

/* 62-database-download-map.css */
body[data-page="database"] .database-download-map-trigger,
body[data-page="database"] .database-stats-trigger {
  position: relative;
  right: auto;
  bottom: auto;
  z-index: 282;
  display: grid;
  width: var(--database-floating-height, 54px);
  height: var(--database-floating-height, 54px);
  place-items: center;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 50%;
  color: rgb(238, 238, 238);
  background: rgba(22, 22, 22, 0.88);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
  cursor: pointer;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body[data-page="database"] .database-download-map-trigger {
  right: 18px;
}

body[data-page="database"] .database-stats-trigger {
  right: auto;
}

body[data-page="database"] .database-download-map-trigger .material-symbols-outlined,
body[data-page="database"] .database-stats-trigger .material-symbols-outlined {
  font-size: 28px;
  line-height: 28px;
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 28;
}

.database-download-map-modal {
  position: fixed;
  top: 0;
  right: auto;
  bottom: auto;
  left: 0;
  z-index: 1500;
  box-sizing: border-box;
  display: grid;
  width: 100dvw;
  height: 100dvh;
  place-items: center;
  padding: 26px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.database-download-map-modal[hidden] {
  display: none;
}

.database-download-map-modal.is-open {
  opacity: 1;
  pointer-events: auto;
}

.database-download-map-modal.is-closing {
  opacity: 0;
  pointer-events: none;
}

.database-download-map-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(0, 0, 0, 0.8);
}

.database-download-map-panel {
  position: relative;
  box-sizing: border-box;
  display: grid;
  width: min(1840px, calc(100vw - 56px));
  height: min(1010px, calc(100svh - 56px));
  max-height: none;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 18px;
  padding: 24px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 18px;
  background: rgba(15, 15, 15, 0.92);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    inset 0 -1px 0 rgba(0, 0, 0, 0.48),
    0 24px 70px rgba(0, 0, 0, 0.42);
  opacity: 0;
  transform: translate(var(--database-download-map-origin-x, 28px), var(--database-download-map-origin-y, 28px)) scale(0.08);
  transform-origin: center center;
  transition:
    opacity 260ms cubic-bezier(0.22, 1, 0.36, 1),
    transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
}

.database-download-map-modal.is-open .database-download-map-panel {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.database-download-map-modal.is-closing .database-download-map-panel {
  opacity: 0;
  transform: translate(var(--database-download-map-origin-x, 28px), var(--database-download-map-origin-y, 28px)) scale(0.08);
}

.database-download-map-close {
  position: absolute;
  top: -18px;
  right: -18px;
  z-index: 2;
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  color: rgb(238, 238, 238);
  background: rgba(255, 255, 255, 0.12);
  cursor: pointer;
}

.database-download-map-head {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  justify-self: center;
  gap: 10px;
  padding: 0 48px;
  color: rgb(238, 238, 238);
}

.database-download-map-head h3 {
  margin: 0;
  color: inherit;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.2;
}

.database-download-map-head .material-symbols-outlined {
  font-size: 26px;
  line-height: 26px;
}

.database-download-map-scroll {
  min-width: 0;
  min-height: 0;
  overflow: auto;
}

.database-download-map-stage {
  position: relative;
  height: 100%;
  min-height: 0;
}

.database-download-map-loading,
.database-download-map-empty {
  display: grid;
  min-height: min(520px, calc(100svh - 180px));
  place-items: center;
  color: rgb(221, 221, 221);
  font-size: 16px;
  font-weight: 500;
}

.database-download-map-loading span {
  box-sizing: border-box;
  display: block;
  width: 40px;
  height: 40px;
  border: 4px solid rgba(255, 255, 255, 0.24);
  border-top-color: rgba(255, 255, 255, 0.94);
  border-radius: 50%;
  animation: spin 760ms linear infinite;
}

.database-download-map-svg {
  display: block;
  width: 100%;
  height: 90%;
  align-self: center;
  overflow: visible;
}

.download-map-country,
.download-map-country-shape,
.download-map-region {
  vector-effect: non-scaling-stroke;
  stroke: rgba(255, 255, 255, 0.34);
  stroke-width: 1;
  stroke-dasharray: none;
  fill-rule: evenodd;
  shape-rendering: geometricPrecision;
}

.download-map-region {
  fill: rgba(255, 255, 255, 0.035);
}

.download-map-country,
.download-map-country-shape {
  fill: rgba(255, 255, 255, 0.045);
  cursor: default;
  transition: fill 160ms, stroke 160ms;
}

.download-map-country-shape {
  pointer-events: none;
}

.download-map-marker {
  vector-effect: non-scaling-stroke;
  fill: rgba(52, 211, 153, var(--download-map-alpha, 0.45));
  stroke: rgba(52, 211, 153, 0.92);
  stroke-width: 1.6;
  cursor: pointer;
}

.download-map-country[data-has-downloads="true"] {
  fill: rgba(52, 211, 153, var(--download-map-alpha, 0.45));
  cursor: pointer;
  stroke: rgba(52, 211, 153, 0.8);
}

.download-map-country[data-has-downloads="true"]:hover,
.download-map-marker[data-has-downloads="true"]:hover {
  fill: rgba(52, 211, 153, 0.86);
  stroke: rgba(187, 247, 208, 0.96);
}

.database-download-map-note {
  min-height: 20px;
  color: rgb(221, 221, 221);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.45;
  text-align: center;
}

#database-download-map-note:empty,
#database-download-map-note[hidden] {
  display: none;
}

.database-download-map-tooltip {
  position: fixed;
  z-index: 1510;
  width: max-content;
  min-width: 220px;
  max-width: min(360px, calc(100vw - 28px));
  padding: 12px 14px;
  border: 1px solid rgba(52, 211, 153, 0.52);
  border-radius: 12px;
  color: rgb(221, 221, 221);
  background: rgba(10, 10, 10, 0.96);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.36);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.45;
  white-space: pre-line;
  pointer-events: none;
}

.database-download-map-tooltip-country {
  display: block;
  margin-bottom: 6px;
  color: rgb(238, 238, 238);
  font-size: 17px;
  font-weight: 700;
  line-height: 1.25;
}

@media (max-width: 700px) {
  body[data-page="database"] .central-db-search {
    width: 100%;
    height: 100%;
    min-height: 100%;
    grid-template-columns: minmax(0px, 1fr) 28px;
    padding: 0 18px;
  }

  body[data-page="database"] .database-download-map-trigger,
  body[data-page="database"] .database-stats-trigger {
    bottom: auto;
    width: var(--database-floating-height, 54px);
    height: var(--database-floating-height, 54px);
  }

  body[data-page="database"] .database-download-map-trigger {
    right: 16px;
  }

  body[data-page="database"] .database-stats-trigger {
    right: auto;
  }

  .database-download-map-modal {
    padding: 14px;
  }

  .database-download-map-panel {
    width: calc(100vw - 28px);
    height: calc(100svh - 28px);
    max-height: calc(100svh - 28px);
    padding: 18px 14px;
  }

  .database-download-map-scroll {
    overflow: auto;
  }

  .database-download-map-stage {
    height: 100%;
  }

  .database-download-map-svg {
    width: auto;
    min-width: 980px;
    height: 100%;
  }

}

/* 62-database-stats-popover.css */
body[data-page="database"] .central-db-summary {
  position: fixed;
  right: 32px;
  bottom: 84px;
  z-index: 284;
  box-sizing: border-box;
  display: block;
  width: min(1720px, calc(100vw - 64px));
  max-height: min(760px, calc(100svh - 116px));
  margin: 0;
  padding: 0;
  border: 0;
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px) scale(0.965);
  transform-origin: right bottom;
  transition:
    opacity 180ms cubic-bezier(0.22, 1, 0.36, 1),
    transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

body[data-page="database"] .central-db-summary.is-open {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}

body[data-page="database"] .central-db-summary::before {
  content: none;
}

body[data-page="database"] .db-stats-popover-card {
  box-sizing: border-box;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 22px;
  width: 100%;
  max-height: inherit;
  padding: 22px;
  overflow: auto;
  border: 0;
  border-radius: 18px;
  color: rgb(221, 221, 221);
  background: rgb(12, 12, 12);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.34);
}

body[data-page="database"] .db-stats-popover-main {
  display: grid;
  min-width: 0;
  align-content: start;
  gap: 18px;
}

body[data-page="database"] .db-stats-chart-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

body[data-page="database"] .db-stats-chart-panel {
  display: grid;
  gap: 12px;
  min-width: 0;
}

body[data-page="database"] .db-stats-chart-panel h3,
body[data-page="database"] .db-stats-timeline-panel h3 {
  margin: 0;
  color: rgb(238, 238, 238);
  font-size: 17px;
  font-weight: 600;
  line-height: 1.2;
}

body[data-page="database"] .db-stats-graph-row {
  display: grid;
  grid-template-columns: 204px minmax(0, 260px);
  align-items: center;
  justify-content: start;
  gap: 24px;
}

body[data-page="database"] .db-source-donut {
  position: relative;
  display: grid;
  width: 204px;
  height: 204px;
  place-items: center;
  border-radius: 50%;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.24);
}

body[data-page="database"] .db-source-donut svg { display: block; width: 100%; height: 100%; overflow: visible; }
body[data-page="database"] .db-stats-donut-slice { cursor: pointer; transition: opacity 140ms ease; }
body[data-page="database"] .db-stats-donut-slice:hover { opacity: 0.82; }
body[data-page="database"] .db-stats-donut-hole { fill: rgb(12, 12, 12); stroke: rgba(255, 255, 255, 0.1); stroke-width: 1; }
body[data-page="database"] .db-stats-donut-empty-ring { fill: rgba(255, 255, 255, 0.12); }
body[data-page="database"] .db-stats-donut-total { fill: rgb(238, 238, 238); font-size: 8px; font-weight: 700; line-height: 1; }

body[data-page="database"] .db-source-legend {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  width: min(100%, 260px);
}

body[data-page="database"] .db-source-legend span {
  display: grid;
  grid-template-columns: 10px minmax(136px, 1fr) minmax(74px, max-content);
  align-items: center;
  gap: 20px;
  min-width: 0;
  white-space: nowrap;
}

body[data-page="database"] .db-source-legend i {
  display: block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
}

body[data-page="database"] .db-source-legend b,
body[data-page="database"] .db-source-legend em {
  color: rgb(221, 221, 221);
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  line-height: 1.2;
}

body[data-page="database"] .db-source-legend b {
  min-width: 0;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body[data-page="database"] .db-source-legend em {
  justify-self: end;
  text-align: right;
}

body[data-page="database"] .db-stats-popover-card footer {
  color: rgb(221, 221, 221);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.2;
}

body[data-page="database"] .db-stats-popover-card footer {
  text-align: right;
  color: rgb(187, 187, 187);
}

body[data-page="database"] .db-stats-timeline-panel {
  display: grid;
  min-width: 0;
  align-content: start;
  gap: 14px;
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

body[data-page="database"] .db-stats-timeline-panel header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

body[data-page="database"] .db-stats-timeline-chart {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 150px;
  align-items: stretch;
  gap: 16px;
}

body[data-page="database"] .db-stats-timeline-chart svg {
  display: block;
  width: auto;
  height: auto;
  overflow: visible;
}

body[data-page="database"] .db-timeline-grid { stroke: rgba(255, 255, 255, 0.1); stroke-width: 1; }

body[data-page="database"] .db-timeline-axis { stroke: rgba(255, 255, 255, 0.22); stroke-width: 1.2; }

body[data-page="database"] .db-timeline-year-boundary {
  stroke: rgba(255, 255, 255, 0.22);
  stroke-width: 1.2;
  stroke-dasharray: none;
}

body[data-page="database"] .db-timeline-hover-zone {
  fill: transparent;
  pointer-events: all;
}

body[data-page="database"] .db-timeline-line {
  fill: none;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.95;
}

body[data-page="database"] .db-timeline-x,
body[data-page="database"] .db-timeline-y {
  fill: rgb(187, 187, 187);
  font-size: 13px;
  font-weight: 500;
}

body[data-page="database"] .db-timeline-side {
  display: grid;
  min-width: 0;
  align-content: start;
  gap: 14px;
  padding-top: 54px;
}

.db-stats-hover-tooltip {
  position: fixed;
  z-index: 1512;
  width: max-content;
  min-width: 140px;
  max-width: min(340px, calc(100vw - 28px));
  padding: 10px 12px;
  border: 1px solid rgba(56, 189, 248, 0.52);
  border-radius: 12px;
  color: rgb(221, 221, 221);
  background: rgba(10, 10, 10, 0.96);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.36);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.45;
  white-space: pre-line;
  pointer-events: none;
}

body[data-page="database"] .db-timeline-visible-range {
  color: rgb(187, 187, 187);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.2;
  white-space: nowrap;
}

body[data-page="database"] .db-timeline-legend {
  display: grid;
  align-content: center;
  gap: 10px;
}

body[data-page="database"] .db-timeline-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: rgb(221, 221, 221);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.2;
}

body[data-page="database"] .db-timeline-legend i {
  display: block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
}

body[data-page="database"] .db-stats-timeline-empty {
  display: grid;
  min-height: 280px;
  place-items: center;
  color: rgb(187, 187, 187);
  font-size: 15px;
  font-weight: 500;
}

@media (max-width: 700px) {
  body[data-page="database"] .central-db-summary {
    right: 16px;
    bottom: 74px;
    width: min(420px, calc(100vw - 32px));
  }

  body[data-page="database"] .db-stats-popover-card {
    grid-template-columns: 1fr;
    padding: 15px;
  }

  body[data-page="database"] .db-stats-chart-grid,
  body[data-page="database"] .db-stats-timeline-chart {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-page="database"] .db-stats-graph-row {
    grid-template-columns: 140px minmax(0, 1fr);
    gap: 13px;
  }

  body[data-page="database"] .db-source-donut {
    width: 140px;
    height: 140px;
  }

  body[data-page="database"] .db-source-donut::after {
    inset: 30px;
  }

  body[data-page="database"] .db-source-legend {
    grid-template-columns: 1fr;
  }

}

@media (min-width: 701px) and (max-width: 1400px) {
  body[data-page="database"] .central-db-summary {
    right: 32px;
    width: min(1216px, calc(100vw - 64px));
  }

  body[data-page="database"] .db-stats-graph-row {
    grid-template-columns: 148px minmax(0, 200px);
    gap: 20px;
  }

  body[data-page="database"] .db-source-donut {
    width: 148px;
    height: 148px;
  }

  body[data-page="database"] .db-source-legend {
    width: min(100%, 200px);
  }

  body[data-page="database"] .db-source-legend span {
    grid-template-columns: 10px minmax(90px, 1fr) minmax(60px, max-content);
    gap: 20px;
  }
}

/* 62-database-unified-stats.css */
body[data-page="database"] .database-unified-stats-content {
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-rows: auto auto;
  gap: 18px;
}

body[data-page="database"] .database-download-map-section {
  display: grid;
  min-width: 0;
  gap: 14px;
}

body[data-page="database"] .database-download-map-section {
  padding-top: 18px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

body[data-page="database"] .database-download-map-section-title {
  margin: 0;
  color: rgb(238, 238, 238);
  font-size: 20px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
}

body[data-page="database"] .database-download-map-row {
  display: grid;
  grid-template-columns: minmax(470px, 1.18fr) minmax(0, 1.82fr);
  gap: 18px;
  min-width: 0;
}

body[data-page="database"] .database-unified-stats-content .db-stats-popover-card {
  max-height: none;
  overflow: visible;
}

body[data-page="database"] .db-cache-section-title {
  margin: 0;
  color: rgb(238, 238, 238);
  font-size: 17px;
  font-weight: 600;
  line-height: 1.2;
}

body[data-page="database"] .database-download-map-card {
  box-sizing: border-box;
  display: grid;
  min-width: 0;
  min-height: 520px;
  grid-template-columns: minmax(0, 1fr) 280px;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 12px 16px;
  padding: 18px;
  border: 0;
  border-radius: 18px;
  background: rgb(12, 12, 12);
  box-shadow: none;
}

body[data-page="database"] .database-download-map-card-head {
  grid-column: 1;
  grid-row: 1;
  align-self: start;
  padding-top: 0;
}

body[data-page="database"] .database-download-map-card-head h3 {
  margin: 0;
  color: rgb(238, 238, 238);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.2;
}

body[data-page="database"] .database-download-map-map-wrap {
  grid-column: 1;
  grid-row: 2;
  position: relative;
  display: grid;
  align-items: center;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

body[data-page="database"] .database-korea-map-card {
  min-height: 520px;
  grid-template-columns: 340px 240px;
  gap: 28px;
  padding: 16px 14px;
}

body[data-page="database"] .database-global-map-card {
  grid-template-columns: minmax(0, 1fr) 260px;
}

body[data-page="database"] .database-global-map-card .database-download-map-map-wrap { align-items: center; }

body[data-page="database"] .database-global-map-card .database-download-map-svg { width: 100%; height: auto; aspect-ratio: var(--download-map-aspect, 2 / 1); }

body[data-page="database"] .database-korea-map-wrap {
  justify-items: center;
}

body[data-page="database"] .database-korea-map-svg {
  display: block;
  width: min(100%, 340px);
  height: 100%;
  max-height: 540px;
  align-self: center;
  overflow: visible;
}

body[data-page="database"] .database-korea-map-card .database-download-country-rank {
  gap: 8px;
  padding-left: 2px;
}

body[data-page="database"] .database-korea-map-card .database-download-country-rank li {
  grid-template-columns: 22px minmax(128px, 1fr) 58px;
  gap: 8px;
}

body[data-page="database"] .download-korea-outline {
  fill: rgba(255, 255, 255, 0.026);
  stroke: rgba(255, 255, 255, 0.18);
  stroke-width: 1.1;
  vector-effect: non-scaling-stroke;
}

body[data-page="database"] .download-korea-region {
  fill: rgba(255, 255, 255, 0.052);
  stroke: rgba(255, 255, 255, 0.34);
  stroke-width: 1.15;
  cursor: default;
  shape-rendering: geometricPrecision;
  transition: fill 160ms ease, stroke 160ms ease;
  vector-effect: non-scaling-stroke;
}

body[data-page="database"] .download-korea-region[data-has-downloads="true"] {
  fill: rgba(52, 211, 153, var(--download-map-alpha, 0.45));
  stroke: rgba(52, 211, 153, 0.82);
  cursor: pointer;
}

body[data-page="database"] .download-korea-region[data-has-downloads="true"]:hover {
  fill: rgba(52, 211, 153, 0.86);
  stroke: rgba(187, 247, 208, 0.96);
}

body[data-page="database"] .download-korea-region[data-download-korea-region="KR-JEJU"],
body[data-page="database"] .download-korea-region[data-download-korea-region="KR-JEJU"][data-has-downloads="true"],
body[data-page="database"] .download-korea-region[data-download-korea-region="KR-JEJU"][data-has-downloads="true"]:hover {
  stroke: transparent;
}

body[data-page="database"] .database-download-country-donut {
  display: none;
}

body[data-page="database"] .database-download-country-donut-svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

body[data-page="database"] .database-download-country-donut-slice {
  cursor: pointer;
  transition: opacity 140ms ease;
}

body[data-page="database"] .database-download-country-donut-slice:hover {
  opacity: 0.82;
}

body[data-page="database"] .database-download-country-donut-hole {
  fill: rgba(12, 12, 12, 0.96);
}

body[data-page="database"] .database-download-country-donut-total {
  fill: rgb(238, 238, 238);
  font-size: 12px;
  font-weight: 700;
}

body[data-page="database"] .database-download-country-rank {
  grid-column: 2;
  grid-row: 1 / 4;
  display: grid;
  min-width: 0;
  min-height: 0;
  align-content: start;
  gap: 12px;
  padding-left: 18px;
  border-left: 0;
}

body[data-page="database"] .database-download-map-note-inline {
  grid-column: 1;
  grid-row: 3;
  align-self: start;
}

body[data-page="database"] .database-download-country-rank h3 {
  margin: 0;
  color: rgb(238, 238, 238);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.2;
}

body[data-page="database"] .database-download-country-rank ol {
  display: grid;
  grid-auto-rows: 24px;
  gap: 7px;
  margin: 0;
  padding: 0;
  overflow: visible;
  list-style: none;
}

body[data-page="database"] .database-download-country-rank li {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) minmax(54px, max-content);
  align-items: center;
  gap: 9px;
  height: 24px;
  min-width: 0;
  color: rgb(221, 221, 221);
  font-size: 15px;
  font-weight: 500;
}

body[data-page="database"] .database-download-country-flag {
  display: grid;
  width: 28px;
  height: 20px;
  place-items: center;
}

body[data-page="database"] .database-download-korea-swatch {
  display: block;
  width: 18px;
  height: 18px;
  justify-self: center;
  border: 1px solid rgba(187, 247, 208, 0.78);
  border-radius: 50%;
  background: rgba(52, 211, 153, 0.72);
}

body[data-page="database"] .database-download-country-flag img {
  display: block;
  width: 24px;
  height: 18px;
  object-fit: cover;
  border-radius: 3px;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.16);
}

body[data-page="database"] .database-download-country-flag-text {
  color: rgb(221, 221, 221);
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
}

body[data-page="database"] .database-download-country-rank b,
body[data-page="database"] .database-download-country-rank em {
  min-width: 0;
  overflow: hidden;
  color: inherit;
  font: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body[data-page="database"] .database-download-country-rank em {
  justify-self: end;
  min-width: 54px;
  color: rgb(52, 211, 153);
  text-align: right;
}

body[data-page="database"] .database-download-rank-empty {
  color: rgb(187, 187, 187);
  font-size: 15px;
  font-weight: 500;
}

body[data-page="database"] .db-stats-timeline-chart {
  min-width: 0;
  overflow: visible;
}

body[data-page="database"] .db-timeline-graph-scroll {
  min-width: 0;
  overflow-x: hidden;
  overflow-y: hidden;
}

body[data-page="database"] .db-stats-timeline-chart svg {
  width: auto;
  max-width: none;
}

body[data-page="database"] .db-timeline-line {
  stroke-width: 1.6;
}

body[data-page="database"] .db-timeline-year-boundary {
  stroke: rgba(255, 255, 255, 0.22);
  stroke-width: 1.2;
  stroke-dasharray: none;
}

body[data-page="database"] .db-timeline-x,
body[data-page="database"] .db-timeline-y,
body[data-page="database"] .db-timeline-year-label {
  fill: rgb(187, 187, 187);
  font-size: 12px;
  font-weight: 500;
}

/* 62-database-unified-stats-responsive.css */
@media (max-width: 700px) {
  body[data-page="database"] .database-download-map-row {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-page="database"] .database-download-map-card {
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
  }

  body[data-page="database"] .database-download-map-card-head,
  body[data-page="database"] .database-download-map-map-wrap,
  body[data-page="database"] .database-download-country-rank {
    grid-column: 1;
    grid-row: auto;
  }

  body[data-page="database"] .database-download-country-rank {
    padding-left: 0;
    border-left: 0;
  }

  body[data-page="database"] .database-download-country-donut {
    right: 18px;
    bottom: 18px;
    width: 96px;
    height: 96px;
  }
}

/* 62-database-user-stats.css */
body[data-page="database"] .database-post-stats-section,
body[data-page="database"] .database-user-stats-row,
body[data-page="database"] .database-global-stats-row {
  display: grid;
  min-width: 0;
  gap: 18px;
}

body[data-page="database"] .database-post-stats-section {
  gap: 14px;
}

body[data-page="database"] .database-user-stats-row {
  grid-template-columns: minmax(300px, 0.78fr) minmax(300px, 0.78fr) minmax(620px, 660px);
  align-items: stretch;
}

body[data-page="database"] .database-os-stats-card {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  align-content: stretch;
  gap: 18px;
}

body[data-page="database"] .database-client-stats-block,
body[data-page="database"] .database-os-stats-body,
body[data-page="database"] .database-os-note {
  grid-column: 1;
  grid-row: auto;
}

body[data-page="database"] .database-client-stats-block {
  display: grid;
  min-width: 0;
  align-content: start;
  gap: 10px;
}

body[data-page="database"] .database-os-stats-card .database-client-stats-block:last-child {
  align-self: end;
}

body[data-page="database"] .database-os-stats-body {
  display: grid;
  min-width: 0;
  min-height: 0;
  align-content: center;
}

body[data-page="database"] .database-os-stats-graph {
  grid-template-columns: 204px minmax(0, 260px);
  justify-content: start;
  gap: 24px;
}

body[data-page="database"] .database-os-stats-card .db-source-donut {
  width: 204px;
  height: 204px;
}

body[data-page="database"] .database-os-legend span,
body[data-page="database"] .database-browser-legend span {
  grid-template-columns: 10px minmax(136px, 1fr) minmax(74px, max-content);
  gap: 20px;
}

body[data-page="database"] .database-os-empty {
  display: block;
  color: rgb(187, 187, 187);
  font-size: 15px;
  font-weight: 500;
}

body[data-page="database"] .database-global-stats-row .database-global-map-card {
  grid-template-columns: minmax(0, 1fr) 260px;
}

body[data-page="database"] .database-global-stats-row {
  padding-top: 18px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

body[data-page="database"] .database-top-downloads-card {
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  min-height: 560px;
}

body[data-page="database"] .database-download-post-rank {
  display: grid;
  grid-auto-rows: 24px;
  gap: 7px;
  margin: 0;
  padding: 0;
  overflow: visible;
  list-style: none;
}

body[data-page="database"] .database-download-post-rank li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(42px, max-content);
  align-items: center;
  gap: 12px;
  height: 24px;
  min-width: 0;
  color: rgb(221, 221, 221);
  font-size: 15px;
  font-weight: 500;
}

body[data-page="database"] .database-download-post-rank span {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  min-width: 0;
}

body[data-page="database"] .database-download-post-rank b,
body[data-page="database"] .database-download-post-rank small,
body[data-page="database"] .database-download-post-rank em {
  min-width: 0;
  overflow: hidden;
  color: inherit;
  font: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body[data-page="database"] .database-download-post-rank b {
  color: rgb(238, 238, 238);
}

body[data-page="database"] .database-download-post-rank small {
  color: rgb(221, 221, 221);
}

body[data-page="database"] .database-download-post-rank em {
  justify-self: end;
  color: rgb(52, 211, 153);
  text-align: right;
}

@media (max-width: 1180px) {
  body[data-page="database"] .database-user-stats-row,
  body[data-page="database"] .database-global-stats-row .database-global-map-card {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-page="database"] .database-os-stats-card,
  body[data-page="database"] .database-global-stats-row .database-global-map-card {
    min-height: 0;
  }

  body[data-page="database"] .database-os-stats-graph {
    grid-template-columns: minmax(140px, 180px) minmax(0, 1fr);
  }

  body[data-page="database"] .database-os-stats-card .db-source-donut {
    width: 180px;
    height: 180px;
  }
}

/* 63-database-profile-editor.css */
.account-profile-editor-modal {
  position: fixed;
  z-index: 9800;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  opacity: 0;
  pointer-events: none;
  background: rgba(0, 0, 0, 0);
  transition: opacity 180ms ease, background 180ms ease;
}

.account-profile-editor-modal.active {
  opacity: 1;
  pointer-events: auto;
  background: var(--bunny-dim-overlay);
}

.account-profile-editor-panel {
  position: relative;
  display: flex;
  width: min(720px, calc(100vw - 48px));
  max-height: calc(100dvh - 48px);
  flex-direction: column;
  overflow: visible;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 20px;
  background: rgb(18, 18, 18);
  box-shadow: var(--bunny-emboss-window-shadow);
  transform: translateY(12px) scale(0.97);
  transition: transform 180ms ease;
}

.account-profile-editor-modal.active .account-profile-editor-panel {
  transform: none;
}

.account-profile-editor-close {
  position: absolute;
  z-index: 4;
  top: -22px;
  right: -22px;
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.94);
  background: rgba(255, 255, 255, 0.08);
  box-shadow: var(--bunny-emboss-border-shadow);
  cursor: pointer;
}

.account-profile-crop-stage {
  display: grid;
  min-height: 420px;
  place-items: center;
  padding: 28px;
  overflow: hidden;
}

.account-profile-crop-wrap {
  position: relative;
  display: inline-block;
  overflow: hidden;
  border-radius: 18px;
  background: rgb(10, 10, 10);
}

.account-profile-crop-wrap img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: initial;
}

.account-profile-crop-wrap img[hidden],
.account-profile-empty[hidden],
.account-profile-crop-box[hidden] {
  display: none;
}

.account-profile-empty {
  display: grid;
  min-height: 320px;
  place-items: center;
  color: rgba(255, 255, 255, 0.62);
  font-size: 15px;
  font-weight: 500;
}

.account-profile-crop-box {
  position: absolute;
  z-index: 3;
  border: 2px solid rgb(255, 160, 122);
  border-radius: 50%;
  box-shadow:
    rgba(0, 0, 0, 0.62) 0 0 0 9999px,
    rgba(255, 255, 255, 0.42) 0 0 0 1px inset;
  cursor: move;
}

.account-profile-crop-box > span {
  position: absolute;
  width: 16px;
  height: 16px;
  border: 2px solid rgb(255, 160, 122);
  border-radius: 50%;
  background: rgb(18, 18, 18);
}

.account-profile-crop-box > [data-account-profile-crop-handle="nw"] { top: -8px; left: -8px; cursor: nwse-resize; }
.account-profile-crop-box > [data-account-profile-crop-handle="n"] { top: -8px; left: calc(50% - 8px); cursor: ns-resize; }
.account-profile-crop-box > [data-account-profile-crop-handle="ne"] { top: -8px; right: -8px; cursor: nesw-resize; }
.account-profile-crop-box > [data-account-profile-crop-handle="e"] { top: calc(50% - 8px); right: -8px; cursor: ew-resize; }
.account-profile-crop-box > [data-account-profile-crop-handle="se"] { right: -8px; bottom: -8px; cursor: nwse-resize; }
.account-profile-crop-box > [data-account-profile-crop-handle="s"] { bottom: -8px; left: calc(50% - 8px); cursor: ns-resize; }
.account-profile-crop-box > [data-account-profile-crop-handle="sw"] { bottom: -8px; left: -8px; cursor: nesw-resize; }
.account-profile-crop-box > [data-account-profile-crop-handle="w"] { top: calc(50% - 8px); left: -8px; cursor: ew-resize; }

.account-profile-editor-actions {
  display: flex;
  min-height: 78px;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 16px 22px;
  border-top: 1px solid var(--bunny-emboss-border);
  background: rgb(18, 18, 18);
  box-shadow: rgba(255, 255, 255, 0.08) 0 1px 0 inset;
}

.account-profile-editor-actions h3 {
  margin: 0;
  color: rgba(255, 255, 255, 0.92);
  font-size: 20px;
  font-weight: 650;
  line-height: 1.2;
}

.account-profile-action-buttons {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.account-profile-action {
  display: inline-flex;
  height: 42px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 14px;
  border: 1px solid var(--bunny-emboss-border);
  border-radius: 20px;
  color: rgba(255, 255, 255, 0.94);
  background: rgb(36, 36, 36);
  box-shadow: var(--bunny-emboss-border-shadow);
  font-size: 15px;
  font-weight: 620;
  cursor: pointer;
}

.account-profile-action.primary {
  background: rgb(28, 68, 45);
}

.account-profile-editor-modal.saving .account-profile-action {
  opacity: 0.55;
  pointer-events: none;
}

/* 70-admin-core.css */
.page-database,
.page-sources,
.page-automation-management,
.page-auth-management,
.page-settings {
  max-width: 1184px;
  margin: 0 auto;
  padding-bottom: 34px;
}

body[data-page="database"] .page-database {
  padding-bottom: 0;
}

.admin-page-title {
  display: flex;
  max-width: 1200px;
  align-items: center;
  gap: 14px;
  margin: 0 auto 18px;
}

.admin-page-title > .local-svg-icon {
  width: 24px;
  height: 24px;
  opacity: 0.94;
}

.admin-page-title .material-symbols-outlined {
  color: var(--accent);
  font-size: 30px;
}

.admin-page-title h2 {
  margin: 0;
  color: rgb(255, 255, 255);
  font-size: 24px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0;
}

.admin-page-title p {
  margin: 6px 0 0;
  color: rgba(255, 255, 255, 0.56);
  font-size: 15px;
  line-height: 1.5;
}

body[data-page="automation-management"] .admin-page-title,
body[data-page="api-management"] .admin-page-title,
body[data-page="auth-management"] .admin-page-title {
  width: min(1120px, calc(100vw - var(--sidebar-width, 280px) - 96px));
  margin-inline: auto;
}

body.sidebar-collapsed[data-page="automation-management"] .admin-page-title,
body.sidebar-collapsed[data-page="api-management"] .admin-page-title,
body.sidebar-collapsed[data-page="auth-management"] .admin-page-title {
  width: min(1120px, -96px + 100vw);
}

body[data-page="scraper-management"]::before { opacity: 0; }

body[data-page="api-management"]::before { opacity: 0; }

body[data-page="scraper-management"] .namoo-settings-card, body[data-page="automation-management"] .namoo-settings-card, body[data-page="api-management"] .namoo-settings-card, body[data-page="auth-management"] .namoo-settings-card, body[data-page="settings"] .namoo-settings-card { width: min(1120px, calc(100vw - var(--sidebar-width, 280px) - 96px)); margin: 0px auto 24px; padding: 32px; border-radius: 24px; border: 1px solid rgba(255, 255, 255, 0.05); background: rgb(21, 21, 21); box-shadow: rgba(0, 0, 0, 0.34) 0px 24px 64px; color: rgb(255, 255, 255); }

body.sidebar-collapsed[data-page="automation-management"] .namoo-settings-card, body.sidebar-collapsed[data-page="api-management"] .namoo-settings-card, body.sidebar-collapsed[data-page="auth-management"] .namoo-settings-card, body.sidebar-collapsed[data-page="settings"] .namoo-settings-card { width: min(1120px, -96px + 100vw); }

.namoo-primary-button,
.namoo-secondary-button {
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0px 24px;
  border: 0px;
  border-radius: 12px;
  color: rgb(255, 255, 255);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0px;
  cursor: pointer;
  transition: transform 160ms, opacity 160ms, background 160ms;
}

.namoo-primary-button { background: rgb(22, 163, 74); }

.namoo-primary-button.danger { background: rgb(220, 38, 38); }

.namoo-secondary-button { background: rgba(31, 41, 55, 0.95); }

.namoo-primary-button:hover,
.namoo-secondary-button:hover { transform: translateY(-1px); }

.namoo-primary-button:disabled,
.namoo-secondary-button:disabled {
  cursor: not-allowed;
  opacity: 0.48;
  transform: none;
}

@media (max-width: 900px) {
body[data-page="settings"] .namoo-settings-card, body[data-page="automation-management"] .namoo-settings-card, body[data-page="auth-management"] .namoo-settings-card, body.sidebar-collapsed[data-page="automation-management"] .namoo-settings-card, body.sidebar-collapsed[data-page="auth-management"] .namoo-settings-card, body.sidebar-collapsed[data-page="settings"] .namoo-settings-card { width: calc(-32px + 100vw); padding: 24px; }

.namoo-primary-button,
.namoo-secondary-button { width: 100%; }
}

/* 70-admin-liquid-glass.css */
:is(body[data-page="scraper-management"], body[data-page="automation-management"]) {
  --admin-liquid-text: rgba(255, 255, 255, 0.94);
  --admin-liquid-muted: rgba(255, 255, 255, 0.58);
  --admin-liquid-border: rgba(255, 255, 255, 0.18);
  --admin-liquid-border-soft: rgba(255, 255, 255, 0.105);
  --admin-liquid-fill: rgba(255, 255, 255, 0.082);
  --admin-liquid-fill-strong: rgba(255, 255, 255, 0.12);
  --admin-liquid-surface-bg: rgb(18, 18, 18);
  --admin-liquid-card-bg: rgb(21, 21, 21);
  --admin-liquid-panel-bg: rgb(16, 16, 16);
  --admin-liquid-button-bg: rgb(36, 36, 36);
  --admin-liquid-green: rgb(141, 247, 174);
  --admin-liquid-green-fill: rgb(28, 68, 45);
  --admin-liquid-red: rgb(255, 159, 159);
  --admin-liquid-red-fill: rgb(72, 34, 34);
  --admin-liquid-radius-xl: 20px;
  --admin-liquid-radius-lg: 20px;
  --admin-liquid-radius-md: 20px;
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-surface,
:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-card,
:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-panel {
  position: relative;
  isolation: isolate;
  color: var(--admin-liquid-text);
  border: 1px solid var(--admin-liquid-border-soft);
  background: var(--admin-liquid-surface-bg);
  box-shadow:
    rgba(255, 255, 255, 0.14) 0 1px 0 inset,
    rgba(0, 0, 0, 0.44) 0 -1px 0 inset;
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-surface {
  border-radius: var(--admin-liquid-radius-xl);
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-card {
  border-radius: var(--admin-liquid-radius-lg);
  background: var(--admin-liquid-card-bg);
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-panel {
  border-radius: var(--admin-liquid-radius-md);
  background: var(--admin-liquid-panel-bg);
  box-shadow:
    rgba(255, 255, 255, 0.11) 0 1px 0 inset,
    rgba(0, 0, 0, 0.38) 0 -1px 0 inset;
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-button {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: inline-flex;
  height: 48px;
  min-width: 112px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 18px;
  border: 1px solid var(--admin-liquid-border);
  border-radius: 20px;
  outline: 0;
  color: var(--admin-liquid-text);
  background: var(--admin-liquid-button-bg);
  box-shadow:
    rgba(255, 255, 255, 0.18) 0 1px 0 inset,
    rgba(0, 0, 0, 0.42) 0 -1px 0 inset;
  font-size: 15px;
  font-weight: 620;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  transform: translateZ(0);
  transition:
    transform 160ms ease,
    border-color 160ms ease,
    background-color 160ms ease,
    box-shadow 160ms ease,
    opacity 160ms ease;
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-button::before {
  display: none;
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-button.primary {
  border-color: rgba(141, 247, 174, 0.34);
  background: var(--admin-liquid-green-fill);
  box-shadow:
    rgba(255, 255, 255, 0.18) 0 1px 0 inset,
    rgba(0, 0, 0, 0.42) 0 -1px 0 inset;
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-button.danger {
  border-color: rgba(255, 159, 159, 0.34);
  background: var(--admin-liquid-red-fill);
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-button:hover:not(:disabled) {
  transform: translate3d(0, -1px, 0);
  border-color: rgba(255, 255, 255, 0.3);
  background: rgb(44, 44, 44);
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-button.primary:hover:not(:disabled) {
  border-color: rgba(141, 247, 174, 0.48);
  background: rgb(32, 78, 51);
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-button.danger:hover:not(:disabled) {
  border-color: rgba(255, 159, 159, 0.5);
  background: rgb(84, 40, 40);
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
  transform: none;
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-button .local-svg-icon,
:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-button .material-symbols-outlined,
:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-button .loading-svg-icon {
  width: 21px;
  min-width: 21px;
  height: 21px;
  min-height: 21px;
  display: inline-grid;
  place-items: center;
  margin: 0;
  line-height: 1;
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-button .loading-svg-icon {
  width: 20px;
  min-width: 20px;
  height: 20px;
  min-height: 20px;
  border-width: 2.5px;
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-chip {
  min-height: 30px;
  padding: 0 12px;
  border: 1px solid var(--admin-liquid-border-soft);
  border-radius: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.78);
  background: rgba(255, 255, 255, 0.076);
  box-shadow: rgba(255, 255, 255, 0.11) 0 1px 0 inset;
  font-size: 13px;
  font-weight: 620;
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-surface,
:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-card,
:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-panel,
:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-button,
:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-chip,
:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .liquid-glass-btn,
:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .app-sidebar,
:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .sidebar-action,
:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .unified-media-panel {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .app-sidebar,
:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .liquid-glass-btn {
  background: rgb(18, 18, 18);
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .liquid-glass-btn-cta {
  background: rgb(28, 68, 45);
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-chip.ready {
  color: rgba(177, 255, 199, 0.96);
  border-color: rgba(141, 247, 174, 0.24);
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-chip.waiting {
  color: rgba(255, 225, 148, 0.96);
  border-color: rgba(245, 158, 11, 0.24);
}

:is(body[data-page="scraper-management"], body[data-page="automation-management"]) .admin-liquid-chip.failed {
  color: rgb(252, 165, 165);
  border-color: rgba(239, 68, 68, 0.32);
  background: rgba(239, 68, 68, 0.12);
}

/* 71-admin-monitoring-layout.css */
body[data-page="scraper-management"] .page-scraper-management {
  --scraper-content-width: 100%;
  box-sizing: border-box;
  width: var(--scraper-content-width);
  max-width: var(--scraper-content-width);
  margin-inline: auto;
}

.scraper-management-stack { display: grid; gap: 28px; padding-bottom: 96px; }

.monitoring-source-stack {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 520px), 1fr));
  align-items: start;
  gap: 24px;
  padding-bottom: 16px;
}

.scraper-page-loading {
  grid-column: 1 / -1;
  min-height: calc(100svh - 220px);
  display: grid;
  place-items: center;
}

.scraper-page-loading-spinner {
  --scraper-spinner-angle: 0deg;
  position: relative;
  display: block;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: conic-gradient(from var(--scraper-spinner-angle), rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0.95));
  animation: scraper-page-spin 860ms linear infinite;
}

.scraper-page-loading-spinner::after {
  content: "";
  position: absolute;
  inset: 6px;
  border-radius: 50%;
  background: rgb(10, 10, 10);
}

@keyframes scraper-page-spin {
  to { transform: rotate(360deg); }
}

.monitoring-loading-note { margin: 0px auto; display: flex; align-items: center; gap: 10px; padding: 14px 18px; border-radius: 18px; color: rgba(255, 255, 255, 0.82); font-size: 14px; font-weight: 500; background: rgba(255, 255, 255, 0.075); border: 1px solid rgba(255, 255, 255, 0.14); box-shadow: rgba(255, 255, 255, 0.12) 0px 1px 0px inset; }

.monitoring-loading-note .material-symbols-outlined { font-size: 18px; animation: 900ms linear 0s infinite normal none running spin; }

.monitoring-source-card { display: grid; gap: 0px; }

.namoo-monitor-canvas-wrap {
  position: relative;
}

.namoo-monitor-update-tooltip {
  position: absolute;
  z-index: 8;
  min-width: 210px;
  max-width: min(320px, calc(100% - 16px));
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(14, 14, 14, 0.92);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.1);
  color: #ddd;
  pointer-events: none;
}

.namoo-monitor-update-tooltip[hidden] {
  display: none;
}

.namoo-monitor-update-tooltip span,
.namoo-monitor-update-tooltip time {
  display: block;
  font-size: 12px;
  font-weight: 500;
  color: rgba(221, 221, 221, 0.78);
  line-height: 1.35;
}

.namoo-monitor-update-tooltip strong {
  display: block;
  margin: 4px 0;
  font-size: 13px;
  font-weight: 700;
  color: #fff;
  line-height: 1.35;
}

body[data-page="scraper-management"] .monitoring-source-card.is-active {
  border-color: rgba(52, 211, 153, 0.56);
  background: rgba(18, 42, 32, 0.72);
}

body[data-page="scraper-management"] .monitoring-source-card.is-stopped {
  border-color: rgba(239, 68, 68, 0.5);
  background: rgba(42, 22, 22, 0.72);
}

body[data-page="scraper-management"] .admin-page-title,
body[data-page="scraper-management"] .monitoring-loading-note {
  box-sizing: border-box;
  width: var(--scraper-content-width);
  max-width: var(--scraper-content-width);
}

body[data-page="scraper-management"] .monitoring-source-card {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  margin: 0px;
}

@media (max-width: 900px) {
  body[data-page="scraper-management"] .namoo-settings-card,
  body[data-page="scraper-management"] .admin-page-title {
    width: calc(-32px + 100vw);
  }

  body[data-page="scraper-management"] .namoo-settings-card {
    padding: 24px;
  }
}

@media (max-width: 767px) {
  body[data-page="scraper-management"] .page-scraper-management {
    --scraper-content-width: calc(100vw - 32px);
  }
}

@media (min-width: 901px) {
  body[data-page="scraper-management"] .app-main {
    padding-left: 40px;
    padding-right: 40px;
  }

  body[data-page="scraper-management"] .page-scraper-management {
    --scraper-content-width: 100%;
  }
}

@media (min-width: 1600px) {
  body[data-page="scraper-management"] .page-scraper-management {
    --scraper-content-width: 100%;
  }

  body[data-page="scraper-management"] .monitoring-source-stack {
    grid-template-columns: repeat(3, minmax(0px, 1fr));
    align-items: start;
    gap: 18px;
  }

  body[data-page="scraper-management"] .monitoring-source-card {
    padding: 24px;
  }

  body[data-page="scraper-management"] .namoo-form-grid {
    grid-template-columns: repeat(2, minmax(0px, 1fr));
    gap: 16px;
  }

  body[data-page="scraper-management"] .monitoring-card-title {
    margin-bottom: 22px;
  }

  body[data-page="scraper-management"] .monitoring-card-title h3 {
    font-size: 21px;
  }

  body[data-page="scraper-management"] .monitoring-card-subtitle {
    margin-bottom: 16px;
  }

  body[data-page="scraper-management"] .namoo-monitor-actions {
    gap: 10px;
  }

  body[data-page="scraper-management"] .monitoring-control-actions {
    grid-template-columns: repeat(2, minmax(0px, 1fr));
    gap: 10px;
  }

  body[data-page="scraper-management"] .monitoring-control-actions > span {
    grid-column: 1 / -1;
    min-width: 0px;
  }

  body[data-page="scraper-management"] .monitoring-control-actions > .admin-liquid-button {
    min-width: 0px;
    padding-inline: 12px;
    font-size: 13px;
  }

  body[data-page="scraper-management"] .namoo-runtime-grid {
    grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
  }

  body[data-page="scraper-management"] .monitoring-schedule-chart {
    min-height: 286px;
    padding: 30px 14px 16px;
  }

  body[data-page="scraper-management"] .monitoring-schedule-grid {
    inset: 40px 14px 70px;
  }

  body[data-page="scraper-management"] .monitoring-schedule-bars {
    --schedule-plot-height: 184px;
    gap: 3px;
  }

  body[data-page="scraper-management"] .monitoring-schedule-bar {
    width: min(9px, 54%);
  }

  body[data-page="scraper-management"] .monitoring-schedule-hour-label {
    font-size: 10px;
  }

  body[data-page="scraper-management"] .monitoring-schedule-count {
    font-size: 12px;
  }
}

@media (min-width: 2400px) {
  body[data-page="scraper-management"] .monitoring-source-stack {
    grid-template-columns: repeat(4, minmax(0px, 1fr));
    gap: 20px;
  }

  body[data-page="scraper-management"] .monitoring-source-card {
    padding: 32px;
  }

  body[data-page="scraper-management"] .namoo-form-grid {
    gap: 18px;
  }

  body[data-page="scraper-management"] .monitoring-control-actions {
    grid-template-columns: minmax(0px, 1fr) auto auto;
  }

  body[data-page="scraper-management"] .monitoring-control-actions > span {
    grid-column: auto;
  }

  body[data-page="scraper-management"] .monitoring-control-actions > .admin-liquid-button {
    min-width: 112px;
    padding-inline: 18px;
    font-size: 15px;
  }

  body[data-page="scraper-management"] .monitoring-schedule-chart {
    min-height: 300px;
    padding: 30px 18px 16px;
  }

  body[data-page="scraper-management"] .monitoring-schedule-grid {
    inset: 40px 18px 70px;
  }

  body[data-page="scraper-management"] .monitoring-schedule-bars {
    --schedule-plot-height: 196px;
    gap: 4px;
  }

  body[data-page="scraper-management"] .monitoring-schedule-bar {
    width: min(10px, 54%);
  }
}

@media (min-width: 2561px) {
  body[data-page="scraper-management"] .page-scraper-management {
    --scraper-content-width: 100%;
  }
}

/* 71-admin-monitoring-wide.css */
@media (min-width: 3200px) {
  body[data-page="scraper-management"] .app-main {
    padding-left: 24px;
    padding-right: 24px;
  }

  body[data-page="scraper-management"] .monitoring-source-stack {
    grid-template-columns: repeat(8, minmax(0px, 1fr));
    gap: 10px;
  }

  body[data-page="scraper-management"] .monitoring-source-card {
    padding: 16px 14px;
    border-radius: 18px;
  }

  body[data-page="scraper-management"] .monitoring-card-title {
    margin-bottom: 14px;
  }

  body[data-page="scraper-management"] .monitoring-card-title h3 {
    font-size: 18px;
  }

  body[data-page="scraper-management"] .monitoring-card-subtitle {
    margin-bottom: 10px;
  }

  body[data-page="scraper-management"] .monitoring-card-subtitle h2,
  body[data-page="scraper-management"] .namoo-monitor-status-head strong {
    font-size: 14px;
  }

  body[data-page="scraper-management"] .namoo-form-grid {
    gap: 10px;
  }

  body[data-page="scraper-management"] .monitoring-frequency-field {
    padding: 10px;
    gap: 8px;
    border-radius: 14px;
  }

  body[data-page="scraper-management"] .monitoring-frequency-head,
  body[data-page="scraper-management"] .monitoring-frequency-row {
    grid-template-columns: 52px 76px minmax(0px, 1fr);
    gap: 6px;
  }

  body[data-page="scraper-management"] .monitoring-frequency-head span,
  body[data-page="scraper-management"] .namoo-field span {
    font-size: 13px;
  }

  body[data-page="scraper-management"] .monitoring-frequency-head em,
  body[data-page="scraper-management"] .monitoring-frequency-row em {
    font-size: 11px;
  }

  body[data-page="scraper-management"] .monitoring-frequency-row span {
    font-size: 12px;
  }

  body[data-page="scraper-management"] .monitoring-frequency-row input,
  body[data-page="scraper-management"] .namoo-field input {
    height: 34px;
    padding-inline: 8px;
    border-radius: 10px;
    font-size: 12px;
  }

  body[data-page="scraper-management"] .monitoring-control-actions {
    gap: 6px;
    margin: 14px 0px 16px;
  }

  body[data-page="scraper-management"] .monitoring-control-actions > span {
    font-size: 12px;
  }

  body[data-page="scraper-management"] .monitoring-control-actions > .admin-liquid-button {
    min-width: 0px;
    min-height: 34px;
    padding-inline: 8px;
    font-size: 11px;
  }

  body[data-page="scraper-management"] .monitoring-card-subtitle-stats {
    margin-top: 10px;
  }

  body[data-page="scraper-management"] .namoo-monitor-status-head {
    margin-bottom: 8px;
  }

  body[data-page="scraper-management"] .namoo-monitor-legend {
    gap: 8px;
  }

  body[data-page="scraper-management"] .namoo-monitor-legend span {
    font-size: 10px;
  }

  body[data-page="scraper-management"] .monitoring-schedule-chart {
    min-height: 258px;
    padding: 34px 8px 12px;
    border-radius: 14px;
  }

  body[data-page="scraper-management"] .monitoring-schedule-grid {
    inset: 44px 8px 56px;
  }

  body[data-page="scraper-management"] .monitoring-schedule-bars {
    --schedule-plot-height: 168px;
    gap: 2px;
  }

  body[data-page="scraper-management"] .monitoring-schedule-bar {
    width: min(8px, 54%);
  }
}

/* 71-admin-monitoring-settings.css */
.monitoring-card-title { margin: 0px 0px 24px; text-align: center; }

.monitoring-card-title h3 { margin: 0px; color: rgba(255, 255, 255, 0.96); font-size: 22px; font-weight: 760; letter-spacing: 0px; }

.monitoring-card-title p { margin: 6px 0px 0px; color: rgba(255, 255, 255, 0.54); font-size: 14px; font-weight: 470; line-height: 1.48; }

.monitoring-card-subtitle { display: flex; align-items: center; gap: 10px; margin: 0px 0px 20px; }

.monitoring-card-subtitle h2 { margin: 0px; color: rgb(255, 255, 255); font-size: 19px; font-weight: 700; letter-spacing: 0px; }

.monitoring-card-subtitle b { margin-left: auto; color: rgba(255, 255, 255, 0.58); font-size: 13px; font-weight: 650; }

.monitoring-card-subtitle-stats { margin-top: 24px; }

body[data-page="scraper-management"] .monitoring-source-card > .namoo-post-stats-card {
  width: 100%;
  max-width: 100%;
  margin: 32px 0px 0px;
  padding: 0px;
  border: 0px;
  border-radius: 0px;
  background: transparent;
  box-shadow: none;
}

.monitoring-source-card > .monitoring-policy-field {
  margin-top: 22px;
}

.monitoring-dynamic-summary-panel {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0px, 1fr) auto;
  align-items: center;
  gap: 14px;
  margin-top: 22px;
  padding: 16px 18px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.045);
  box-shadow: rgba(255, 255, 255, 0.08) 0px 1px 0px inset;
}

.monitoring-dynamic-open-button {
  width: auto;
  min-width: 190px;
  padding-inline: 18px;
  white-space: nowrap;
}

.monitoring-api-panel { margin-top: 18px; }

.monitoring-api-note { margin-top: 18px; min-height: 42px; padding: 0px 16px; border-radius: 14px; display: flex; align-items: center; justify-content: space-between; gap: 16px; background: rgba(255, 255, 255, 0.065); border: 1px solid rgba(255, 255, 255, 0.12); box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 0px inset; color: rgba(255, 255, 255, 0.58); font-size: 13px; font-weight: 560; }

.monitoring-api-note b { color: rgba(255, 255, 255, 0.82); font-weight: 660; }

.monitoring-policy-field { grid-column: 1 / -1; }

.monitoring-form-grid {
  align-items: start;
}

.monitoring-form-grid .namoo-field {
  align-content: start;
}

.monitoring-form-grid .monitoring-target-field { grid-column: 1 / -1; }

.monitoring-form-grid .monitoring-frequency-field,
.monitoring-form-grid .monitoring-keyword-field {
  grid-column: 1 / -1;
  min-width: 0px;
}

.monitoring-frequency-field {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 18px;
  background: rgba(0, 0, 0, 0.18);
  box-shadow: rgba(255, 255, 255, 0.08) 0px 1px 0px inset;
}

.monitoring-frequency-head,
.monitoring-frequency-row {
  display: grid;
  grid-template-columns: 72px 116px minmax(0px, 1fr);
  align-items: center;
  gap: 10px;
}

.monitoring-frequency-head span {
  color: rgba(229, 231, 235, 0.92);
  font-size: 16px;
  font-weight: 600;
}

.monitoring-frequency-head em {
  grid-column: 2 / -1;
  justify-self: end;
  max-width: 100%;
  color: rgba(255, 255, 255, 0.56);
  font-size: 13px;
  font-style: normal;
  font-weight: 560;
  overflow: hidden;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.monitoring-frequency-rows {
  display: grid;
  gap: 8px;
}

.monitoring-frequency-row span {
  color: rgba(255, 255, 255, 0.82);
  font-size: 14px;
  font-weight: 650;
}

.monitoring-frequency-row input {
  width: 100%;
  height: 40px;
  padding: 0px 12px;
  border: 1px solid rgba(255, 255, 255, 0.145);
  border-radius: 12px;
  outline: 0px;
  color: rgb(255, 255, 255);
  background: rgba(0, 0, 0, 0.28);
  box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 0px inset;
  font-size: 15px;
  font-weight: 500;
}

.monitoring-frequency-row input:disabled {
  cursor: not-allowed;
  opacity: 0.52;
}

.monitoring-frequency-row em {
  justify-self: end;
  max-width: 100%;
  color: rgba(255, 255, 255, 0.52);
  font-size: 13px;
  font-style: normal;
  font-weight: 520;
  line-height: 1.3;
  overflow: hidden;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.monitoring-policy-toggle { min-height: 70px; padding: 16px 18px; border-radius: 16px; display: grid; grid-template-columns: 22px minmax(0px, 1fr); gap: 6px 12px; align-items: start; background: rgba(255, 255, 255, 0.065); border: 1px solid rgba(255, 255, 255, 0.12); box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 0px inset; }

.monitoring-policy-toggle input { width: 18px; height: 18px; margin-top: 2px; accent-color: rgb(141, 247, 174); }

.monitoring-policy-toggle b { color: rgba(255, 255, 255, 0.9); font-size: 15px; font-weight: 650; }

.monitoring-policy-toggle em { grid-column: 2; margin: 0px; color: rgba(255, 255, 255, 0.52); font-size: 14px; line-height: 1.45; }

.monitoring-policy-note {
  min-height: 0px;
  padding: 0px;
}

.monitoring-policy-note span {
  display: block;
  margin-bottom: 4px;
  color: rgba(255, 255, 255, 0.9);
  font-size: 15px;
  font-weight: 700;
}

.monitoring-policy-note em {
  display: block;
  margin: 0px;
  color: rgba(255, 255, 255, 0.52);
  font-size: 14px;
  line-height: 1.45;
}

.monitoring-policy-summary { min-height: 40px; padding: 0px 14px; border-radius: 14px; display: flex; align-items: center; gap: 12px; background: rgba(141, 247, 174, 0.08); border: 1px solid rgba(141, 247, 174, 0.18); box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 0px inset; }

.monitoring-policy-summary span, .monitoring-policy-summary small { color: rgba(255, 255, 255, 0.54); font-size: 13px; font-weight: 560; }

.monitoring-policy-summary strong { color: rgba(255, 255, 255, 0.9); font-size: 15px; font-weight: 700; }

.monitoring-inline-button { margin-left: auto; height: 40px; padding: 0px 16px; font-size: 13px; }

.monitoring-namoo-schedule-field .monitoring-policy-summary {
  flex-wrap: wrap;
  min-height: 48px;
}

.namoo-log-modal.monitoring-dynamic-modal {
  width: min(920px, -64px + 100vw);
  grid-template-rows: auto auto auto auto;
}

.monitoring-dynamic-modal header div {
  display: grid;
  gap: 5px;
}

.monitoring-dynamic-modal header small {
  color: rgba(255, 255, 255, 0.54);
  font-size: 13px;
  font-weight: 500;
}

.monitoring-dynamic-modal-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0px, 1fr));
  gap: 10px;
  padding: 18px 24px 0px;
}

.monitoring-dynamic-modal-summary span {
  display: flex;
  min-height: 42px;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 0px 14px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.055);
  color: rgba(255, 255, 255, 0.58);
  font-size: 13px;
  font-weight: 600;
}

.monitoring-dynamic-modal-summary b {
  color: rgba(255, 255, 255, 0.9);
  font-weight: 700;
}

.monitoring-dynamic-fields-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0px, 1fr));
  gap: 14px;
  padding: 18px 24px 22px;
}

.monitoring-dynamic-fields-grid .monitoring-dynamic-toggle {
  grid-column: span 2;
  min-height: 48px;
  align-content: center;
}

.monitoring-dynamic-fields-grid .namoo-field {
  min-width: 0px;
}

.monitoring-dynamic-fields-grid .namoo-field span {
  font-size: 13px;
}

.monitoring-dynamic-fields-grid .namoo-field input,
.monitoring-dynamic-fields-grid .namoo-field select {
  width: 100%;
  height: 44px;
  padding: 0px 13px;
  border: 1px solid rgba(255, 255, 255, 0.145);
  border-radius: 14px;
  outline: 0px;
  color: rgb(255, 255, 255);
  background: rgba(0, 0, 0, 0.28);
  box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 0px inset;
  font-size: 15px;
  font-weight: 500;
}

.monitoring-dynamic-fields-grid .namoo-field select {
  color-scheme: dark;
}

.monitoring-dynamic-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 0px 24px 24px;
}

.monitoring-dynamic-modal-actions .admin-liquid-button {
  width: auto;
  min-width: 118px;
}

@media (max-width: 900px) {
  .monitoring-dynamic-summary-panel {
    grid-template-columns: 1fr;
  }

  .monitoring-dynamic-open-button {
    width: 100%;
  }

  .monitoring-dynamic-modal-summary,
  .monitoring-dynamic-fields-grid {
    grid-template-columns: 1fr;
  }

  .monitoring-dynamic-fields-grid .monitoring-dynamic-toggle {
    grid-column: auto;
  }
}

/* 71-admin-monitoring-schedule.css */
.monitoring-schedule-chart { position: relative; min-height: 350px; display: grid; grid-template-rows: 1fr auto; gap: 10px; padding: 44px 20px 18px; border: 1px solid rgba(255, 255, 255, 0.095); border-radius: 20px; background: rgba(0, 0, 0, 0.22); box-shadow: rgba(255, 255, 255, 0.08) 0px 1px 0px inset; overflow: hidden; }

.monitoring-schedule-grid { position: absolute; inset: 54px 20px 74px; pointer-events: none; }

.monitoring-schedule-grid span { position: absolute; left: 0px; right: 0px; top: var(--grid-y); display: block; transform: translateY(-50%); }

.monitoring-schedule-grid span::after { content: ""; position: absolute; left: 0px; right: 0px; top: 50%; height: 1px; background: rgba(255, 255, 255, 0.1); }

.monitoring-schedule-bars { position: relative; z-index: 1; --schedule-plot-height: 236px; --schedule-axis-height: 33px; height: calc(var(--schedule-plot-height) + var(--schedule-axis-height)); display: grid; grid-template-columns: repeat(24, minmax(0px, 1fr)); align-items: end; gap: 5px; }

.monitoring-schedule-hour { position: relative; height: 100%; min-width: 0px; display: grid; grid-template-rows: var(--schedule-plot-height) 24px; align-items: end; gap: 9px; }

.monitoring-schedule-bar-slot { position: relative; height: var(--schedule-plot-height); display: flex; align-items: flex-end; justify-content: center; }

.monitoring-schedule-bar { position: relative; z-index: 2; width: min(12px, 52%); min-height: 6px; border-radius: 20px; transform-origin: bottom; transition: filter 160ms, transform 160ms; }

.monitoring-schedule-hour:hover .monitoring-schedule-bar { filter: brightness(1.08); }

.monitoring-schedule-hour[data-interval="1"] .monitoring-schedule-bar { background: rgba(52, 211, 153, 0.92); box-shadow: rgba(52, 211, 153, 0.18) 0px 0px 18px; }

.monitoring-schedule-hour[data-interval="2"] .monitoring-schedule-bar { background: rgba(52, 211, 153, 0.58); }

.monitoring-schedule-hour[data-interval="3"] .monitoring-schedule-bar { background: rgba(52, 211, 153, 0.26); }

.monitoring-schedule-hour[data-interval="0"] .monitoring-schedule-bar { background: rgba(255, 255, 255, 0.14); }

.monitoring-schedule-count { position: absolute; left: 50%; top: -22px; color: rgba(255, 255, 255, 0.88); font-size: 12px; font-weight: 500; transform: translateX(-50%); }

.monitoring-schedule-hour-label { justify-self: center; width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; border-radius: 20px; color: rgba(255, 255, 255, 0.46); font-size: 12px; font-weight: 700; white-space: nowrap; }

.monitoring-schedule-hour.current .monitoring-schedule-hour-label { color: rgba(255, 255, 255, 0.96); background: rgba(249, 115, 22, 0.92); }

.monitoring-schedule-legend { display: flex; align-items: center; justify-content: flex-end; gap: 18px; margin-top: 2px; color: rgba(255, 255, 255, 0.58); font-size: 13px; }

.monitoring-schedule-legend span { display: inline-flex; align-items: center; gap: 7px; }

.monitoring-schedule-legend i { width: 14px; height: 14px; border-radius: 20px; }

.monitoring-schedule-legend i[data-interval="1"] { background: rgba(52, 211, 153, 0.92); }

.monitoring-schedule-legend i[data-interval="2"] { background: rgba(52, 211, 153, 0.58); }

.monitoring-schedule-legend i[data-interval="3"] { background: rgba(52, 211, 153, 0.26); }

.monitoring-schedule-legend i[data-interval="0"] { background: rgba(255, 255, 255, 0.16); border: 1px solid rgba(255, 255, 255, 0.16); }

/* 71-admin-monitoring-scrape-livebin.css */
.monitoring-scrape-panel { display: grid; gap: 14px; padding: 18px; border-radius: 18px; background: rgba(255, 255, 255, 0.065); border: 1px solid rgba(255, 255, 255, 0.12); box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 0px inset; }

.monitoring-scrape-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }

.monitoring-scrape-head strong { display: block; color: rgba(255, 255, 255, 0.92); font-size: 16px; font-weight: 680; }

.monitoring-scrape-head p { margin: 5px 0px 0px; color: rgba(255, 255, 255, 0.54); font-size: 13px; line-height: 1.45; }

.monitoring-scrape-head > b { flex: 0 0 auto; }

.monitoring-scrape-head > b.ready { color: rgba(177, 255, 199, 0.95); }

.monitoring-scrape-head > b.waiting { color: rgba(255, 225, 148, 0.95); }

.monitoring-scrape-form { display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 10px; align-items: center; }

.monitoring-scrape-form input { width: 100%; height: 42px; border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 14px; padding: 0px 14px; color: rgba(255, 255, 255, 0.9); background: rgba(0, 0, 0, 0.22); box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 0px inset; outline: none; }

.monitoring-scrape-status { display: grid; gap: 8px; min-height: 22px; color: rgba(255, 255, 255, 0.55); font-size: 13px; font-weight: 560; }

.monitoring-scrape-status.done { color: rgba(177, 255, 199, 0.95); }

.monitoring-scrape-status.failed { color: rgba(255, 153, 153, 0.95); }

.monitoring-scrape-progress { height: 6px; overflow: hidden; border-radius: 999px; background: rgba(255, 255, 255, 0.08); }

.monitoring-scrape-progress i { display: block; height: 100%; border-radius: inherit; background: rgba(141, 247, 174, 0.72); transition: width 240ms; }

.monitoring-scrape-keyword-panel {
  display: grid;
  gap: 14px;
  margin-top: 22px;
  padding: 0px;
  border: 0px;
  background: transparent;
  box-shadow: none;
}

.monitoring-scrape-keyword-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.monitoring-scrape-keyword-head strong {
  color: rgba(255, 255, 255, 0.94);
  font-size: 16px;
  font-weight: 680;
}

.monitoring-scrape-keyword-actions {
  margin: 0px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 10px;
}

.monitoring-scrape-keyword-actions .admin-liquid-button {
  width: auto;
  min-width: 112px;
  min-height: 40px;
  padding-inline: 14px;
  font-size: 13px;
}

.scrape-request-history-modal {
  width: min(1180px, -64px + 100vw);
  grid-template-rows: auto minmax(0px, 1fr);
}

.scrape-request-history-modal .scrape-request-history-table {
  margin: 24px;
  min-height: 0px;
}

.scrape-request-history-modal .scrape-request-history-body {
  max-height: min(580px, -180px + 100vh);
}

/* 71-admin-monitoring-forms-logs.css */
.namoo-section-title { display: flex; align-items: center; gap: 12px; margin: 0px 0px 24px; }

.namoo-section-title h2 { margin: 0px; color: rgb(255, 255, 255); font-size: 20px; font-weight: 700; letter-spacing: 0px; }

.namoo-section-title b { margin-left: auto; color: rgba(255, 255, 255, 0.6); font-size: 13px; font-weight: 650; }

.namoo-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 24px; }

.namoo-field { display: grid; gap: 8px; }

.namoo-field-wide { grid-column: 1 / -1; }

.namoo-field span { color: rgba(229, 231, 235, 0.92); font-size: 16px; font-weight: 500; }

.namoo-field input { width: 100%; height: 48px; padding: 0px 16px; border-radius: 14px; border: 1px solid rgba(255, 255, 255, 0.145); outline: 0px; background: rgba(0, 0, 0, 0.28); box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 0px inset; color: rgb(255, 255, 255); font-size: 16px; font-weight: 450; transition: border-color 160ms, box-shadow 160ms, opacity 160ms, background 160ms; }

.namoo-field input:focus { border-color: rgba(141, 247, 174, 0.7); background: rgba(0, 0, 0, 0.22); box-shadow: rgba(141, 247, 174, 0.25) 0px 0px 0px 2px, rgba(255, 255, 255, 0.12) 0px 1px 0px inset; }

.namoo-field input:disabled { cursor: not-allowed; opacity: 0.52; }

.namoo-field em { color: rgb(107, 114, 128); font-size: 15px; font-style: normal; line-height: 1.5; }

.namoo-monitor-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 12px; margin: 22px 0px 0px; }

.monitoring-control-actions {
  display: grid;
  grid-template-columns: minmax(0px, 1fr) auto auto;
  align-items: center;
  gap: 10px;
  margin: 22px 0px 24px;
}

.namoo-monitor-actions > span { flex: 1 1 260px; min-width: 220px; color: rgba(156, 163, 175, 0.95); font-size: 15px; font-weight: 500; }

.namoo-monitor-actions > span.active { color: rgb(141, 247, 174); font-weight: 700; }

.monitoring-control-actions > span {
  width: auto;
  min-width: 0px;
  flex: none;
}

.monitoring-control-actions > .admin-liquid-button {
  width: auto;
  min-width: 112px;
  padding-inline: 18px;
  white-space: nowrap;
}

.namoo-runtime-grid { display: grid; grid-template-columns: repeat(5, minmax(0px, 1fr)); gap: 10px; margin: 20px 0px 0px; }

.namoo-runtime-grid span, .namoo-log-summary span { display: grid; gap: 5px; min-width: 0px; padding: 13px 14px; border-radius: 14px; background: rgba(255, 255, 255, 0.065); border: 1px solid rgba(255, 255, 255, 0.1); box-shadow: rgba(255, 255, 255, 0.08) 0px 1px 0px inset; color: rgba(255, 255, 255, 0.58); font-size: 12px; font-weight: 550; }

.namoo-runtime-grid b, .namoo-log-summary b { overflow: hidden; color: rgba(255, 255, 255, 0.9); font-size: 13px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }

.namoo-error { display: block; margin-top: 14px; color: rgb(252, 165, 165); font-size: 13px; }

.namoo-monitor-status-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }

.namoo-monitor-status-head strong { color: rgba(255, 255, 255, 0.9); font-size: 16px; font-weight: 650; }

.namoo-monitor-canvas-wrap { width: 100%; height: 58px; border-radius: 20px; }

.namoo-monitor-canvas-wrap canvas { display: block; width: 100%; height: 58px; }

.namoo-monitor-legend { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 14px; margin-top: 12px; }

.namoo-monitor-legend span { display: inline-flex; align-items: center; gap: 6px; color: rgba(255, 255, 255, 0.58); font-size: 12px; font-weight: 600; }

.namoo-monitor-legend i { width: 9px; height: 9px; border-radius: 20px; }

.namoo-monitor-legend i.success { background: rgb(16, 185, 129); }

.namoo-monitor-legend i.waiting { background: rgb(245, 158, 11); }

.namoo-monitor-legend i.failed { background: rgb(239, 68, 68); }

.namoo-monitor-legend i.stopped { background: rgb(107, 114, 128); }

.namoo-muted { margin: -8px 0px 18px; color: rgba(156, 163, 175, 0.9); font-size: 15px; line-height: 1.5; }

.namoo-post-chart { position: relative; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.09); border-radius: 20px; background: rgba(0, 0, 0, 0.18); box-shadow: rgba(255, 255, 255, 0.08) 0px 1px 0px inset; }

.namoo-post-chart svg { display: block; width: 100%; height: auto; }

.namoo-post-chart line { stroke: rgba(255, 255, 255, 0.08); stroke-width: 1; }

.namoo-post-chart .namoo-post-chart-axis { stroke: rgba(255, 255, 255, 0.25); stroke-width: 1.2; }

.namoo-post-chart .namoo-post-chart-inactive rect { fill: rgba(244, 63, 94, 0.22); }

.namoo-post-chart .namoo-post-chart-inactive text { fill: rgba(251, 113, 133, 0.95); font-size: 12px; font-weight: 800; text-anchor: middle; }

.namoo-post-chart .namoo-post-chart-year line { stroke: rgba(16, 185, 129, 0.22); stroke-dasharray: 3 3; stroke-width: 1; }

.namoo-post-chart text { fill: rgba(255, 255, 255, 0.55); font-size: 10px; font-weight: 700; }

.namoo-post-chart circle { fill: rgba(34, 197, 94, 0.92); }

.namoo-post-chart-hotspots { position: absolute; inset: 0px; pointer-events: none; }

.namoo-post-chart-hotspot { position: absolute; width: 24px; height: 24px; transform: translate(-50%, -50%); pointer-events: auto; }

.namoo-post-chart-tooltip { position: absolute; left: 18px; top: -76px; z-index: 2; width: max-content; max-width: 280px; display: none; gap: 4px; padding: 10px 12px; border: 1px solid rgba(52, 211, 153, 0.3); border-radius: 12px; background: rgba(18, 18, 18, 0.96); box-shadow: rgba(0, 0, 0, 0.36) 0px 18px 40px; }

.namoo-post-chart-hotspot:hover .namoo-post-chart-tooltip { display: grid; }

.namoo-post-chart-tooltip b { color: rgb(110, 231, 183); font-size: 12px; font-weight: 700; }

.namoo-post-chart-tooltip em { color: rgba(255, 255, 255, 0.72); font-size: 12px; font-style: normal; font-weight: 500; }

.namoo-post-chart-tooltip strong { color: rgba(255, 255, 255, 0.9); font-size: 14px; font-weight: 600; line-height: 1.28; }

.namoo-log-modal-backdrop { position: fixed; inset: 0px; z-index: 1200; display: grid; place-items: center; padding: 32px; background: var(--bunny-dim-overlay); }

.namoo-log-modal { width: min(1050px, -64px + 100vw); max-height: min(760px, -64px + 100vh); display: grid; grid-template-rows: auto auto auto 1fr; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 24px; background: rgb(21, 21, 21); box-shadow: rgba(0, 0, 0, 0.62) 0px 30px 120px; overflow: hidden; }

.namoo-log-modal header { display: flex; align-items: center; justify-content: space-between; padding: 22px 24px; border-bottom: 1px solid rgba(255, 255, 255, 0.08); }

.namoo-log-modal header strong { color: rgb(255, 255, 255); font-size: 20px; font-weight: 700; }

.namoo-log-modal header button { width: 38px; height: 38px; display: grid; place-items: center; border: 0px; border-radius: 20px; background: rgba(255, 255, 255, 0.08); color: rgb(255, 255, 255); cursor: pointer; }

.namoo-log-summary { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 10px; padding: 18px 24px 0px; }

.namoo-log-summary small { color: rgba(255, 255, 255, 0.48); font-size: 12px; }

.namoo-log-last { margin: 14px 24px 10px; color: rgba(255, 255, 255, 0.58); font-size: 13px; }

.namoo-log-list { display: grid; gap: 8px; padding: 0px 24px 24px; overflow: auto; }

.namoo-log-list article { display: grid; grid-template-columns: minmax(180px, 1fr) 190px 110px 120px; align-items: center; gap: 16px; padding: 12px 14px; border-radius: 14px; background: rgba(255, 255, 255, 0.043); color: rgba(255, 255, 255, 0.84); font-size: 14px; font-weight: 600; }

.namoo-log-list article.success { background: rgba(16, 185, 129, 0.11); }

.namoo-log-list article.updated { background: rgba(59, 130, 246, 0.14); }

.namoo-log-list article.stopped { background: rgba(107, 114, 128, 0.16); }

.namoo-log-list article.failed { background: rgba(239, 68, 68, 0.14); }

.namoo-log-event-meta { display: none; }

.namoo-log-list time, .namoo-log-list strong, .namoo-log-list article > span { min-width: 0px; color: rgba(255, 255, 255, 0.88); font-size: 14px; font-weight: 600; white-space: nowrap; }

.namoo-log-list p { display: none; }

@media (max-width: 900px) {

.namoo-form-grid, .namoo-runtime-grid, .namoo-log-summary { grid-template-columns: 1fr; }

.namoo-monitor-actions { justify-content: stretch; }

.monitoring-control-actions {
  grid-template-columns: 1fr;
}

.monitoring-frequency-head,
.monitoring-frequency-row {
  grid-template-columns: 1fr;
}

.monitoring-frequency-head em {
  grid-column: auto;
}

.namoo-monitor-actions > span, .admin-liquid-button { width: 100%; }

.namoo-log-list article { grid-template-columns: 1fr; }

}

/* 72-admin-ops.css */
.media-cache-source-row, .bot-queue-row, .bot-guard-list span, .collector-source-switches button, .media-cache-worker-grid label, .source-collector-grid label, .media-cache-preset-row, .backfill-result, .bot-process-result, .bot-queue-summary span { border-color: rgba(255, 255, 255, 0.09); }

.bot-queue-row { box-shadow: rgba(255, 255, 255, 0.08) 0px 1px inset; }

.settings-card-copy, .backfill-note { margin: 0px; color: var(--muted); font-size: 12px; line-height: 1.55; }

.bot-queue-panel { margin-top: 16px; }

.bot-queue-card { gap: 16px; }

.bot-queue-summary { display: flex; flex-wrap: wrap; gap: 8px; }

.bot-queue-summary span { display: inline-flex; align-items: center; gap: 7px; min-height: 30px; padding: 0px 11px; border: 1px solid var(--line-soft); border-radius: 999px; background: rgba(255, 255, 255, 0.05); color: var(--muted); font-size: 12px; font-weight: 430; }

.bot-queue-summary b { color: var(--accent); font-weight: 560; }

.bot-queue-list { display: grid; gap: 10px; }

.bot-queue-row { display: grid; grid-template-columns: minmax(0px, 1fr) 36px; align-items: center; gap: 12px; min-height: 48px; padding: 0px 14px; border: 1px solid var(--line-soft); border-radius: 8px; background: rgba(255, 255, 255, 0.047); color: var(--text); text-decoration: none; }

.bot-queue-row-main { display: grid; grid-template-columns: 104px minmax(0px, 1.25fr) minmax(0px, 0.9fr) minmax(0px, 1fr) 136px 72px; align-items: center; gap: 12px; min-width: 0px; color: inherit; text-decoration: none; }

.bot-queue-row strong, .bot-queue-row small, .bot-queue-row time, .bot-queue-row b, .bot-queue-preview, .bot-queue-error { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.bot-queue-row strong { font-size: 13px; font-weight: 520; }

.bot-queue-row small, .bot-queue-row time { color: var(--muted); font-size: 12px; font-weight: 390; }

.bot-queue-row b { color: var(--accent); font-size: 12px; font-weight: 520; text-align: right; }

.bot-queue-preview { grid-column: 2 / -1; color: var(--muted); font-size: 12px; font-style: normal; font-weight: 360; }

.bot-queue-error { grid-column: 2 / -1; color: rgb(255, 177, 153); font-size: 12px; font-style: normal; font-weight: 420; }

.bot-queue-source { color: var(--yellow); font-size: 12px; font-weight: 520; }

.bot-queue-empty { min-height: 120px; }

.bot-queue-remove { color: var(--muted); }

.icon-button.bot-queue-add.queued { color: var(--yellow); }

.icon-button.bot-queue-add.busy .material-symbols-outlined, .icon-button.bot-queue-remove.busy .material-symbols-outlined { animation: 820ms linear 0s infinite normal none running spin; }

@media (max-width: 767px) {
.bot-queue-row { grid-template-columns: 1fr; align-items: start; min-height: 0px; padding: 12px; }

.bot-queue-row-main { grid-template-columns: 1fr; }

.bot-queue-row b { text-align: left; }
}

.status-detail-card, .settings-detail-card { display: grid; gap: 14px; padding: 32px; border: 1px solid rgba(255, 255, 255, 0.05); border-radius: 16px; background: rgb(34, 34, 34); box-shadow: rgba(255, 255, 255, 0.1) 0px 1px inset; }

.source-status-grid, .settings-status-grid { display: grid; grid-template-columns: 1fr; gap: 32px; }

.sidebar-container-summary { align-items: center; gap: 12px; }

.sidebar-container-summary span { min-width: 0px; overflow: hidden; color: rgba(255, 255, 255, 0.7); font-size: 11px; font-weight: 620; text-overflow: ellipsis; white-space: nowrap; }

.sidebar-meter-card { display: grid; gap: 12px; }

.sidebar-meter-card .sidebar-card-title { margin-bottom: 0px; }

.backfill-actions { display: flex; flex-wrap: wrap; gap: 10px; }

.media-cache-actions { margin-top: 2px; }

.media-cache-card { overflow: hidden; }

.media-cache-grid { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 10px; }

.media-cache-row { display: grid; gap: 5px; min-height: 74px; padding: 12px; border: 1px solid var(--line-soft); border-radius: 8px; background: rgba(255, 255, 255, 0.043); }

.media-cache-row span, .media-cache-row small, .media-cache-footer { color: var(--muted); font-size: 12px; font-weight: 390; }

.media-cache-row strong { color: var(--text); font-size: 18px; font-weight: 610; }

.media-cache-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-width: 0px; }

.media-cache-footer small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.media-cache-source-grid { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 10px; }

.media-cache-source-row { position: relative; display: grid; gap: 7px; overflow: hidden; min-height: 92px; padding: 12px; border: 1px solid var(--line-soft); border-radius: 8px; background: rgba(255, 255, 255, 0.043); }

.media-cache-source-row span { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font-size: 12px; font-weight: 430; }

.media-cache-source-row strong { color: var(--text); font-size: 16px; font-weight: 610; }

.media-cache-source-row small { color: var(--muted); font-size: 12px; font-weight: 390; }

.media-cache-source-row em { color: rgba(255, 223, 151, 0.82); font-size: 11px; font-style: normal; font-weight: 390; }

.media-cache-source-row b { display: block; overflow: hidden; height: 5px; border-radius: 999px; background: rgba(255, 255, 255, 0.07); }

.media-cache-source-row b::before { display: block; width: var(--cache-source-percent, 0%); height: 100%; border-radius: inherit; background: linear-gradient(90deg, rgba(117, 226, 168, 0.48), rgba(117, 226, 168, 0.96)); content: ""; }

.media-cache-worker-panel { display: grid; gap: 12px; padding: 14px; border: 1px solid rgba(117, 226, 168, 0.16); border-radius: 8px; background: rgba(117, 226, 168, 0.043); }

.status-detail-head.compact strong { font-size: 14px; }

.collector-result-list { display: grid; gap: 8px; }

.collector-control-row { display: flex; flex-wrap: wrap; gap: 10px; }

.collector-admin-note { color: var(--yellow); }

.media-cache-preset-row { display: grid; grid-template-columns: auto minmax(0px, 1fr) auto minmax(0px, 1fr); align-items: stretch; gap: 10px; }

.media-cache-preset-row > span { display: grid; align-content: center; gap: 3px; min-height: 42px; padding: 9px 12px; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 8px; background: rgba(255, 255, 255, 0.035); color: var(--muted); font-size: 11px; font-weight: 390; }

.media-cache-preset-row > span b { color: var(--text); font-size: 11px; font-weight: 520; }

.media-cache-worker-history { display: grid; gap: 8px; }

.media-cache-worker-history.empty { min-height: 44px; place-items: center; border: 1px solid var(--line-soft); border-radius: 8px; color: var(--muted); background: rgba(255, 255, 255, 0.035); font-size: 12px; }

.media-cache-worker-history > strong { color: var(--text); font-size: 13px; font-weight: 520; }

.media-cache-worker-history article { display: grid; grid-template-columns: minmax(150px, 0.7fr) minmax(120px, 0.55fr) minmax(0px, 1fr); align-items: center; gap: 10px; min-height: 38px; padding: 8px 10px; border: 1px solid rgba(255, 255, 255, 0.075); border-radius: 8px; background: rgba(255, 255, 255, 0.035); }

.media-cache-worker-history article span { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 12px; }

.media-cache-worker-history article i { color: var(--accent); font-size: 16px; }

.media-cache-worker-history article.warn i { color: var(--yellow); }

.media-cache-worker-history article b { color: var(--text); font-size: 12px; font-weight: 520; }

.media-cache-worker-history article em { min-width: 0px; overflow: hidden; color: rgba(238, 248, 242, 0.68); font-size: 12px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }

.collector-config-grid { display: grid; grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr) auto; gap: 10px; }

.collector-config-grid.media-cache-worker-config { grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr) minmax(0px, 1fr) auto; }

.collector-config-grid label { display: grid; grid-template-columns: auto minmax(0px, 1fr) auto; align-items: center; gap: 10px; min-height: 42px; padding: 0px 12px; border: 1px solid var(--line-soft); border-radius: 8px; background: rgba(255, 255, 255, 0.043); color: var(--muted); font-size: 12px; }

.collector-config-grid input, .collector-config-grid select { width: 100%; border: 0px; outline: 0px; color: var(--text); background: transparent; font-style: inherit; font-variant: inherit; font-stretch: inherit; font-size: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-weight: 560; text-align: right; }

.collector-config-grid select { color-scheme: dark; }

.collector-config-grid em { font-style: normal; }

.collector-source-switches { display: flex; flex-wrap: wrap; gap: 8px; }

.collector-source-switches button { display: inline-flex; align-items: center; gap: 7px; min-height: 34px; padding: 0px 12px; border: 1px solid var(--line-soft); border-radius: 999px; color: var(--muted); background: rgba(255, 255, 255, 0.043); font-size: 12px; font-weight: 470; }

.collector-source-switches button.active { border-color: rgba(117, 226, 168, 0.34); color: var(--accent); background: rgba(117, 226, 168, 0.08); }

.collector-result-list span { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 38px; padding: 0px 12px; border: 1px solid var(--line-soft); border-radius: 8px; background: rgba(255, 255, 255, 0.043); color: var(--muted); font-size: 12px; }

.collector-result-list b { color: var(--text); font-weight: 560; }

.collector-result-list em { overflow: hidden; text-align: right; text-overflow: ellipsis; white-space: nowrap; font-style: normal; font-weight: 390; }

.collector-result-list .error em { color: var(--yellow); }

.backfill-result { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; min-height: 40px; padding: 10px 12px; border: 1px solid var(--line-soft); border-radius: 8px; background: rgba(255, 255, 255, 0.05); color: var(--muted); font-size: 12px; }

.backfill-result.ok strong { color: var(--accent); }

.backfill-result.error strong, .backfill-result.error small { color: var(--yellow); }

.backup-list { display: grid; gap: 8px; }

.backup-list span { display: grid; grid-template-columns: minmax(0px, 1fr) auto auto; align-items: center; gap: 10px; min-height: 36px; padding: 8px 10px; border: 1px solid var(--line-soft); border-radius: 8px; background: rgba(255, 255, 255, 0.043); color: var(--muted); font-size: 12px; }

.backup-list b { overflow-wrap: anywhere; color: var(--text); font-weight: 560; }

.backup-list em { color: var(--accent); font-style: normal; font-weight: 560; }

.backup-list small { color: var(--muted); white-space: nowrap; }

.status-detail-card.warning { border-color: rgba(246, 206, 105, 0.28); background: rgba(246, 206, 105, 0.07); }

.status-detail-head { display: flex; align-items: center; gap: 10px; }

.status-detail-head strong { color: rgb(255, 255, 255); font-size: 16px; font-weight: 620; }

.status-detail-head b { margin-left: auto; color: var(--accent); font-size: 13px; font-weight: 520; }

.status-source-open {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin-top: 2px;
  appearance: none;
  padding: 0px 11px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.88);
  background: rgba(255, 255, 255, 0.14);
  box-shadow:
    rgba(255, 255, 255, 0.32) 0 1px inset,
    rgba(0, 0, 0, 0.14) 0 8px 22px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  backdrop-filter: blur(13px) saturate(1.25);
}

.status-source-open:hover {
  border-color: rgba(117, 226, 168, 0.34);
  color: var(--accent);
  background: rgba(255, 255, 255, 0.18);
}

.status-source-open:disabled { cursor: default; opacity: 0.58; }

.status-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 10px; }

.status-detail-grid span { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 0px 12px; border: 1px solid var(--line-soft); color: var(--muted); font-size: 13px; }

.status-detail-grid b { color: var(--text); font-weight: 470; overflow-wrap: anywhere; text-align: right; }

.status-detail-error { grid-column: 1 / -1; color: var(--yellow); }

.rate-limit-meter { display: grid; gap: 9px; padding: 14px; border: 1px solid rgba(117, 226, 168, 0.18); border-radius: 8px; background: rgba(117, 226, 168, 0.055); }

.rate-limit-meter-head, .rate-limit-meter-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; }

.rate-limit-meter-head span, .rate-limit-meter-foot span { color: var(--muted); font-size: 12px; font-weight: 420; }

.rate-limit-meter-head b { color: var(--text); font-size: 13px; font-weight: 520; }

.rate-limit-meter-track { position: relative; overflow: hidden; height: 8px; border-radius: 999px; background: rgba(255, 255, 255, 0.1); }

.rate-limit-meter-track i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, rgba(117, 226, 168, 0.72), rgba(117, 226, 168, 0.95)); box-shadow: rgba(117, 226, 168, 0.24) 0px 0px 18px; }

.bot-guard-list { display: grid; gap: 8px; }

.bot-guard-list span, .bot-guard-list.ok { display: flex; align-items: center; gap: 8px; min-height: 34px; padding: 0px 12px; border: 1px solid rgba(246, 206, 105, 0.18); border-radius: 8px; color: var(--muted); font-size: 12px; font-weight: 420; }

.bot-guard-list.ok { border-color: rgba(117, 226, 168, 0.22); background: rgba(117, 226, 168, 0.06); }

.bot-process-button { min-height: 32px; margin-left: auto; margin-top: 0px; padding: 0px 13px; }

.bot-process-button + b { margin-left: 0px; }

.bot-process-result { display: grid; gap: 6px; padding: 12px 14px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 8px; background: rgba(255, 255, 255, 0.043); }

.bot-process-result.ok { border-color: rgba(107, 211, 145, 0.28); }

.bot-process-result strong { color: var(--text); font-size: 13px; font-weight: 520; }

.bot-process-result small { color: var(--muted); font-size: 12px; font-weight: 360; line-height: 1.45; }


.status-detail-grid span { min-height: 38px; align-content: center; border-radius: 8px; background: rgba(255, 255, 255, 0.035); }

@media (max-width: 760px) {

}

.namoo-error.subtle { color: rgba(255, 255, 255, 0.42); }

@media (max-width: 767px) {
.status-detail-grid { grid-template-columns: 1fr; }
.media-cache-preset-row { grid-template-columns: 1fr; }
.media-cache-worker-history article { grid-template-columns: 1fr; }
}

/* 73-admin-requests-api.css */
.api-management-stack { display: grid; gap: 28px; padding-bottom: 80px; }

.scrape-request-card-title { margin-bottom: 22px; }

body[data-page="scraper-management"] .scrape-request-history-table { overflow: hidden; border-radius: 18px; border: 1px solid rgba(255, 255, 255, 0.12); background: rgba(255, 255, 255, 0.06); box-shadow: rgba(255, 255, 255, 0.08) 0px 1px 0px inset; }

body:not([data-page="scraper-management"]) .scrape-request-history-table { overflow: hidden; border-radius: 18px; border: 1px solid rgba(255, 255, 255, 0.075); background: rgba(255, 255, 255, 0.035); }

.scrape-request-history-head, .scrape-request-history-row { display: grid; grid-template-columns: 78px minmax(150px, 1.25fr) 90px 116px 150px 150px 80px 80px; align-items: center; gap: 0px; }

body[data-page="scraper-management"] .scrape-request-history-head { min-height: 44px; color: rgba(255, 255, 255, 0.62); font-size: 13px; font-weight: 650; background: rgba(255, 255, 255, 0.065); }

body:not([data-page="scraper-management"]) .scrape-request-history-head { min-height: 44px; color: rgba(255, 255, 255, 0.54); font-size: 13px; font-weight: 650; background: rgba(255, 255, 255, 0.043); }

.scrape-request-history-head span, .scrape-request-history-row > span { min-width: 0px; padding: 0px 12px; }

.scrape-request-history-body { max-height: 520px; overflow: auto; }

body[data-page="scraper-management"] .scrape-request-history-row { min-height: 68px; color: rgba(255, 255, 255, 0.82); font-size: 13px; font-weight: 500; border-top: 1px solid rgba(255, 255, 255, 0.08); }

body:not([data-page="scraper-management"]) .scrape-request-history-row { min-height: 68px; color: rgba(255, 255, 255, 0.82); font-size: 13px; font-weight: 500; border-top: 1px solid rgba(255, 255, 255, 0.055); }

.scrape-request-history-id { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

.scrape-request-history-thumb { display: flex; align-items: center; justify-content: center; }

body[data-page="scraper-management"] .scrape-request-history-thumb img,
body[data-page="scraper-management"] .scrape-request-history-thumb i { width: 46px; height: 46px; border: 1px solid rgba(255, 255, 255, 0.11); border-radius: 12px; object-fit: cover; background: rgba(255, 255, 255, 0.08); }

body:not([data-page="scraper-management"]) .scrape-request-history-thumb img,
body:not([data-page="scraper-management"]) .scrape-request-history-thumb i { width: 46px; height: 46px; border-radius: 12px; object-fit: cover; background: rgba(255, 255, 255, 0.08); }

.scrape-request-status-pill { justify-self: start; min-height: 26px; border-radius: 999px; display: inline-flex; align-items: center; color: rgba(255, 255, 255, 0.78); }

.scrape-request-status-pill.done { color: rgba(177, 255, 199, 0.96); }

.scrape-request-status-pill.failed { color: rgba(255, 155, 155, 0.96); }

.scrape-request-config-actions { margin-top: 22px; }

.api-usage-summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 14px; }

.api-usage-summary-grid > div { min-height: 82px; display: grid; align-content: center; gap: 6px; padding: 16px 18px; border-radius: 18px; background: rgba(255, 255, 255, 0.043); border: 1px solid rgba(255, 255, 255, 0.067); }

.api-usage-summary-grid span, .api-usage-summary-grid em { color: rgba(255, 255, 255, 0.52); font-size: 13px; font-style: normal; font-weight: 520; }

.api-usage-summary-grid b { color: rgba(255, 255, 255, 0.92); font-size: 22px; font-weight: 740; }

.api-usage-history-table { overflow: hidden; border-radius: 18px; border: 1px solid rgba(255, 255, 255, 0.075); background: rgba(255, 255, 255, 0.035); }

.api-usage-history-head, .api-usage-history-row { display: grid; grid-template-columns: 156px 104px 74px minmax(150px, 1fr) 110px minmax(180px, 1fr) minmax(160px, 1fr); align-items: center; gap: 0px; }

.api-usage-history-head { min-height: 44px; color: rgba(255, 255, 255, 0.54); font-size: 13px; font-weight: 650; background: rgba(255, 255, 255, 0.043); }

.api-usage-history-head span, .api-usage-history-row > span { min-width: 0px; padding: 0px 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.api-usage-history-body { max-height: 620px; overflow: auto; }

.api-usage-history-row { min-height: 54px; color: rgba(255, 255, 255, 0.82); font-size: 13px; font-weight: 500; border-top: 1px solid rgba(255, 255, 255, 0.055); }

@media (max-width: 900px) {

.api-usage-summary-grid { grid-template-columns: 1fr; }

.api-usage-history-table { overflow-x: auto; }

.api-usage-history-head, .api-usage-history-row { min-width: 980px; }

}

/* 73-admin-auth-management.css */
.auth-management-stack {
  display: grid;
  gap: 24px;
  padding-bottom: 80px;
}

.auth-principal-list,
.auth-audit-list {
  display: grid;
  gap: 14px;
}

.auth-key-issue-form {
  display: grid;
  grid-template-columns: minmax(160px, 220px) auto;
  align-items: end;
  gap: 12px;
}

.auth-key-issue-form label {
  display: grid;
  gap: 8px;
  color: rgba(255, 255, 255, 0.62);
  font-size: 13px;
  font-weight: 600;
}

.auth-key-issue-form input,
.auth-key-issue-form select {
  height: 42px;
  padding: 0 14px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 14px;
  background: rgb(28, 28, 28);
  color: #eee;
  font: inherit;
}

.auth-issued-key {
  display: grid;
  gap: 8px;
  margin-top: 18px;
  padding: 16px;
  border: 1px solid rgba(101, 214, 156, 0.22);
  border-radius: 18px;
  background: rgba(101, 214, 156, 0.08);
}

.auth-issued-key span,
.auth-issued-key small {
  color: rgba(255, 255, 255, 0.68);
  font-size: 13px;
  font-weight: 550;
}

.auth-issued-key code {
  overflow-wrap: anywhere;
  color: #eee;
  font-size: 18px;
  font-weight: 700;
}

.auth-principal-row {
  display: grid;
  grid-template-columns: minmax(220px, 0.72fr) minmax(0, 1.28fr);
  gap: 18px;
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.035);
}

.auth-principal-meta {
  display: grid;
  align-content: start;
  gap: 7px;
  min-width: 0;
}

.auth-principal-meta strong {
  overflow: hidden;
  color: #eee;
  font-size: 18px;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.auth-principal-meta span,
.auth-principal-meta small {
  overflow: hidden;
  color: rgba(255, 255, 255, 0.58);
  font-size: 13px;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.auth-principal-controls {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.auth-principal-controls > label {
  display: grid;
  grid-template-columns: 70px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  color: rgba(255, 255, 255, 0.62);
  font-size: 13px;
  font-weight: 600;
}

.auth-principal-controls select {
  height: 40px;
  padding: 0 14px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 14px;
  background: rgb(28, 28, 28);
  color: #eee;
  font: inherit;
}

.auth-visitor-controls {
  display: grid;
  grid-template-columns: minmax(130px, auto) minmax(160px, 220px) auto;
  align-items: end;
  gap: 12px;
}

.auth-visitor-controls > label:not(.auth-permission-toggle) {
  display: grid;
  gap: 8px;
  color: rgba(255, 255, 255, 0.62);
  font-size: 13px;
  font-weight: 600;
}

.auth-visitor-controls select {
  height: 40px;
  padding: 0 14px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 14px;
  background: rgb(28, 28, 28);
  color: #eee;
  font: inherit;
}

.auth-permission-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.auth-permission-toggle {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.035);
  color: rgba(255, 255, 255, 0.82);
  font-size: 13px;
  font-weight: 550;
}

.auth-permission-toggle input {
  accent-color: rgb(101, 214, 156);
}

.auth-principal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.auth-audit-row {
  display: grid;
  grid-template-columns: 160px minmax(150px, 0.55fr) minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  min-height: 48px;
  padding: 0 16px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.035);
  color: rgba(255, 255, 255, 0.72);
  font-size: 13px;
  font-weight: 500;
}

.auth-audit-row strong,
.auth-audit-row em {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.auth-audit-row strong {
  color: #eee;
  font-style: normal;
  font-weight: 650;
}

.auth-audit-row em {
  color: rgba(255, 255, 255, 0.58);
  font-style: normal;
}

@media (max-width: 900px) {
  .auth-principal-row {
    grid-template-columns: 1fr;
  }

  .auth-key-issue-form {
    grid-template-columns: 1fr;
  }

  .auth-visitor-controls {
    grid-template-columns: 1fr;
  }

  .auth-permission-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .auth-audit-row {
    grid-template-columns: 1fr;
    gap: 4px;
    padding: 12px 14px;
  }
}

/* 74-admin-automation.css */
.automation-management-stack {
  display: grid;
  gap: 24px;
  padding-bottom: 28px;
}

body[data-page="automation-management"] .settings-detail-card,
body[data-page="automation-management"] .bot-queue-card {
  width: min(1120px, calc(100vw - var(--sidebar-width, 280px) - 96px));
  margin: 0 auto 24px;
}

body.sidebar-collapsed[data-page="automation-management"] .settings-detail-card,
body.sidebar-collapsed[data-page="automation-management"] .bot-queue-card {
  width: min(1120px, -96px + 100vw);
}

.automation-format-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.automation-format-actions {
  margin-top: 18px;
}

.automation-log-summary-card {
  display: grid;
  gap: 16px;
}

.automation-log-summary-body {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 44px;
}

.automation-log-summary-body span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 420;
}

.automation-log-summary-body b {
  overflow: hidden;
  color: var(--text);
  font-weight: 560;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.automation-log-open-button {
  flex: 0 0 auto;
}

.automation-log-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: grid;
  place-items: center;
  padding: 32px;
  background: var(--bunny-dim-overlay);
}

.automation-log-modal {
  width: min(980px, calc(100vw - 64px));
  max-height: min(760px, calc(100vh - 64px));
  display: grid;
  grid-template-rows: auto 1fr;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 22px;
  background: rgb(20, 20, 20);
  box-shadow: rgba(0, 0, 0, 0.62) 0 30px 120px;
  overflow: hidden;
}

.automation-log-modal header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 22px 24px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.automation-log-modal header div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.automation-log-modal header strong {
  color: rgb(255, 255, 255);
  font-size: 20px;
  font-weight: 700;
}

.automation-log-modal header small {
  color: rgba(255, 255, 255, 0.58);
  font-size: 13px;
  font-weight: 450;
}

.automation-log-modal header button {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  color: rgb(255, 255, 255);
  cursor: pointer;
}

.automation-log-modal-list {
  display: grid;
  align-content: start;
  gap: 10px;
  padding: 20px 24px 24px;
  overflow: auto;
}

.automation-log-list {
  display: grid;
  gap: 10px;
}

.automation-log-row {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 14px 16px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.035);
  color: rgb(238, 238, 238);
  text-decoration: none;
}

.automation-log-row:hover {
  background: rgba(255, 255, 255, 0.055);
}

.automation-log-row.warning {
  border-color: rgba(255, 128, 128, 0.22);
  background: rgba(255, 80, 80, 0.055);
}

.automation-log-row strong {
  overflow: hidden;
  color: rgb(245, 245, 245);
  font-size: 14px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.automation-log-row span,
.automation-log-row small {
  overflow: hidden;
  color: rgba(255, 255, 255, 0.66);
  font-size: 12px;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body[data-page="automation-management"] .settings-detail-card,
body[data-page="automation-management"] .bot-queue-card,
body[data-page="automation-management"] .automation-log-modal {
  color: var(--admin-liquid-text);
  border: 1px solid var(--admin-liquid-border-soft);
  background: var(--admin-liquid-card-bg);
  background-image: none;
  box-shadow:
    rgba(255, 255, 255, 0.14) 0 1px 0 inset,
    rgba(0, 0, 0, 0.44) 0 -1px 0 inset;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body[data-page="automation-management"] .settings-detail-card,
body[data-page="automation-management"] .bot-queue-card {
  border-radius: var(--admin-liquid-radius-lg);
}

body[data-page="automation-management"] .status-detail-grid span,
body[data-page="automation-management"] .bot-guard-list span,
body[data-page="automation-management"] .bot-guard-list.ok,
body[data-page="automation-management"] .bot-process-result,
body[data-page="automation-management"] .bot-queue-summary span,
body[data-page="automation-management"] .bot-queue-row,
body[data-page="automation-management"] .automation-log-row {
  border: 1px solid var(--admin-liquid-border-soft);
  background: var(--admin-liquid-panel-bg);
  background-image: none;
  box-shadow:
    rgba(255, 255, 255, 0.1) 0 1px 0 inset,
    rgba(0, 0, 0, 0.34) 0 -1px 0 inset;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body[data-page="automation-management"] .bot-guard-list.ok,
body[data-page="automation-management"] .bot-process-result.ok {
  border-color: rgba(141, 247, 174, 0.24);
  background: rgb(18, 42, 28);
}

body[data-page="automation-management"] .automation-log-row.warning {
  border-color: rgba(255, 159, 159, 0.28);
  background: rgb(43, 24, 24);
}

body[data-page="automation-management"] .namoo-primary-button.admin-liquid-button,
body[data-page="automation-management"] .namoo-secondary-button.admin-liquid-button,
body[data-page="automation-management"] .sidebar-action.admin-liquid-button {
  border: 1px solid var(--admin-liquid-border);
  border-radius: 999px;
  background: var(--admin-liquid-button-bg);
  background-image: none;
  color: var(--admin-liquid-text);
  box-shadow:
    rgba(255, 255, 255, 0.18) 0 1px 0 inset,
    rgba(0, 0, 0, 0.42) 0 -1px 0 inset;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body[data-page="automation-management"] .namoo-primary-button.admin-liquid-button.primary {
  border-color: rgba(141, 247, 174, 0.34);
  background: var(--admin-liquid-green-fill);
}

body[data-page="automation-management"] .automation-log-modal header button.automation-log-close-button {
  width: 38px;
  min-width: 38px;
  height: 38px;
  padding: 0;
  border: 1px solid var(--admin-liquid-border);
  border-radius: 50%;
  background: var(--admin-liquid-button-bg);
  background-image: none;
  color: var(--admin-liquid-text);
  box-shadow:
    rgba(255, 255, 255, 0.18) 0 1px 0 inset,
    rgba(0, 0, 0, 0.42) 0 -1px 0 inset;
}

body[data-page="automation-management"] .automation-log-modal-backdrop {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body[data-page="automation-management"] .bot-process-button {
  height: 38px;
  min-width: 92px;
  padding: 0 14px;
}

@media (max-width: 900px) {
  body[data-page="automation-management"] .settings-detail-card,
  body.sidebar-collapsed[data-page="automation-management"] .settings-detail-card,
  body[data-page="automation-management"] .bot-queue-card,
  body.sidebar-collapsed[data-page="automation-management"] .bot-queue-card {
    width: calc(100vw - 32px);
  }

  .automation-format-grid {
    grid-template-columns: 1fr;
  }

  .automation-log-summary-body {
    align-items: stretch;
    flex-direction: column;
  }

  .automation-log-modal-backdrop {
    padding: 16px;
  }

  .automation-log-modal {
    width: calc(100vw - 32px);
    max-height: calc(100vh - 32px);
  }
}

/* 80-bottom-dock-visibility.css */
body:not([data-page="feed"]) .feed-filter-bar,
body:not([data-page="feed"]) .feed-control-backdrop,
body:not([data-page="feed"]) .feed-bottom-controls,
body:not([data-page="feed"]) .feed-floating-nav,
body:not([data-page="feed"]) .source-filter,
body:not([data-page="feed"]) .feed-search-popover,
body:not([data-page="feed"]) .feed-scrape-popover,
body:not([data-page="feed"]) .feed-count {
  display: none;
}

body[data-page="feed"] .feed-filter-bar {
  position: relative;
  z-index: 160;
  display: flex;
  width: 100%;
  min-height: 0;
  margin: 0 auto var(--feed-heading-content-gap);
  padding: 0;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  transform: none;
}

body[data-page="feed"] .feed-filter-bar::before,
body[data-page="feed"][data-feed-view="calendar"] .feed-count::after {
  content: none;
  display: none;
}

body[data-page="feed"] .feed-count,
body[data-page="feed"][data-feed-view="calendar"] .feed-count,
body[data-page="feed"][data-feed-view="calendar"] .feed-count[hidden] {
  position: static;
  display: inline-flex;
  width: auto;
  min-width: 0;
  height: auto;
  min-height: 0;
  margin: 0 auto;
  padding: 0;
  border: 0;
  color: #eee;
  background: transparent;
  box-shadow: none;
  font-size: 24px;
  font-weight: 500;
  line-height: 24px;
  cursor: default;
  pointer-events: auto;
  transform: none;
}

body[data-page="feed"] .feed-count[hidden] {
  display: none;
}

/* 81-bottom-dock-backdrop.css */
body[data-page="feed"] .feed-control-backdrop {
  position: fixed;
  z-index: 108;
  inset: 0;
  display: block;
  width: 100vw;
  height: 100dvh;
  background: var(--bunny-dim-overlay);
  opacity: 0;
  pointer-events: none;
  transition: opacity 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

body[data-page="feed"] .feed-control-backdrop.active {
  opacity: 1;
  pointer-events: auto;
}

body[data-page="feed"] .feed-control-backdrop.closing {
  opacity: 0;
  pointer-events: none;
}

body[data-page="feed"] .feed-control-backdrop::before {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: max(0%, calc(var(--scrape-progress-height, 0%) - 70px));
  background: linear-gradient(180deg, rgb(34, 175, 112), rgb(10, 93, 59));
  opacity: 0;
  pointer-events: none;
  transform: translateZ(0);
  transition:
    height 1600ms cubic-bezier(0.22, 1, 0.36, 1),
    opacity 220ms;
}

body[data-page="feed"] .feed-control-backdrop::after {
  content: "";
  position: absolute;
  left: -18%;
  right: -18%;
  bottom: calc(var(--scrape-progress-height, 0%) - 72px);
  height: 112px;
  background:
    url("data:image/svg+xml,%3Csvg width='360' height='112' viewBox='0 0 360 112' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 46 C 42 16, 82 16, 124 46 S 208 76, 250 46 S 318 16, 360 46 V112 H0 Z' fill='%233bd58f'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg width='360' height='112' viewBox='0 0 360 112' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 38 C 38 14, 82 14, 120 38 S 202 62, 240 38 S 322 14, 360 38 V112 H0 Z' fill='%2326302c'/%3E%3C/svg%3E");
  background-repeat: repeat-x;
  background-position: 0 100%, 180px 100%;
  background-size: 360px 112px, 360px 112px;
  opacity: 0;
  pointer-events: none;
  transform: translate3d(0, 0, 0) scaleY(1);
  animation:
    bunnyScrapeWaveDrift 4.2s linear infinite,
    bunnyScrapeWaveFloat 1.9s ease-in-out infinite;
  transition:
    bottom 1600ms cubic-bezier(0.22, 1, 0.36, 1),
    opacity 220ms;
}

body[data-page="feed"].feed-scrape-processing .feed-control-backdrop.active::before,
body[data-page="feed"].feed-scrape-processing .feed-control-backdrop.active::after {
  opacity: 1;
}

/* 82-bottom-dock-shell.css */
body[data-page="feed"] .feed-bottom-controls {
  --feed-dock-specular-opacity: 1;
  --feed-dock-specular-saturation: 50;
  --feed-dock-refraction-level: 1;
  --feed-dock-progressive-blur-strength: 0;
  --feed-dock-blur-level: 1px;
  --feed-dock-glass-background-opacity: 0;
  --feed-control-width: 70px;
  --feed-control-height: 54px;
  --feed-control-icon-size: 28px;
  --feed-control-side-padding: 10px;
  --feed-menu-anchor-x: calc(var(--feed-control-side-padding) + (var(--feed-control-width) * 0.5));
  --feed-filter-anchor-x: calc(var(--feed-control-side-padding) + (var(--feed-control-width) * 1.5));
  --feed-search-anchor-x: calc(var(--feed-control-side-padding) + (var(--feed-control-width) * 2.5));
  --feed-scrape-anchor-x: calc(var(--feed-control-side-padding) + (var(--feed-control-width) * 3.5));
  --feed-subscribe-anchor-x: calc(var(--feed-control-side-padding) + (var(--feed-control-width) * 4.5));
  position: fixed;
  z-index: 116;
  right: auto;
  bottom: max(18px, env(safe-area-inset-bottom));
  left: 50%;
  display: grid;
  grid-template-columns: repeat(5, var(--feed-control-width));
  width: auto;
  max-width: calc(100vw - 20px);
  box-sizing: border-box;
  height: var(--feed-control-height);
  min-height: var(--feed-control-height);
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 0 var(--feed-control-side-padding);
  border: 0;
  border-radius: 999px;
  background: transparent;
  box-shadow: none;
  pointer-events: auto;
  overflow: visible;
  isolation: isolate;
  transform: translate3d(-50%, 0, 0);
}

body[data-page="feed"] .feed-bottom-controls::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  display: block;
  border-radius: inherit;
  background: rgba(255, 255, 255, 0);
  box-shadow: none;
  pointer-events: none;
  overflow: hidden;
  clip-path: inset(0 round 999px);
  contain: paint;
  backdrop-filter: blur(var(--feed-dock-blur-level));
  -webkit-backdrop-filter: blur(var(--feed-dock-blur-level));
  backdrop-filter: url(#liquid-glass-bottom-dock-refraction) blur(var(--feed-dock-blur-level));
  -webkit-backdrop-filter: url(#liquid-glass-bottom-dock-refraction) blur(var(--feed-dock-blur-level));
}

body[data-page="feed"] .feed-bottom-controls::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  display: block;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: inherit;
  background: rgba(255, 255, 255, var(--feed-dock-glass-background-opacity));
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.52),
    inset 0 -1px 0 rgba(255, 255, 255, 0.11),
    inset 0 0 7px 1px rgba(255, 255, 255, 0.16);
  pointer-events: none;
}

body[data-page="feed"] .feed-bottom-controls .feed-icon-control {
  position: relative;
  z-index: 2;
  display: grid;
  width: var(--feed-control-width);
  min-width: var(--feed-control-width);
  height: var(--feed-control-height);
  min-height: var(--feed-control-height);
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 0;
  outline: 0;
  color: rgba(255, 255, 255, 0.92);
  background: transparent;
  box-shadow: none;
  filter: none;
  cursor: pointer;
  transform: none;
  transition: opacity 160ms;
}

body[data-page="feed"] .feed-bottom-controls .feed-icon-control:hover,
body[data-page="feed"] .feed-bottom-controls .feed-icon-control:focus,
body[data-page="feed"] .feed-bottom-controls .feed-icon-control:focus-visible,
body[data-page="feed"] .feed-bottom-controls .feed-icon-control.active {
  border: 0;
  outline: 0;
  background: transparent;
  box-shadow: none;
  filter: none;
  transform: none;
}

body[data-page="feed"] .feed-bottom-controls .feed-icon-control::before,
body[data-page="feed"] .feed-bottom-controls .feed-icon-control::after {
  content: none;
  display: none;
}

body[data-page="feed"] .feed-bottom-controls .feed-icon-control > *,
body[data-page="feed"] .feed-bottom-controls .feed-icon-control .material-symbols-outlined,
body[data-page="feed"] .feed-bottom-controls .feed-icon-control .local-svg-icon,
body[data-page="feed"] .feed-bottom-controls .feed-control-label {
  border: 0;
  background: transparent;
  box-shadow: none;
  filter: none;
}

body[data-page="feed"] .feed-bottom-controls .feed-icon-control .material-symbols-outlined,
body[data-page="feed"] .feed-bottom-controls .feed-icon-control .local-svg-icon {
  display: flex;
  width: var(--feed-control-icon-size);
  min-width: var(--feed-control-icon-size);
  height: var(--feed-control-icon-size);
  min-height: var(--feed-control-icon-size);
  align-items: center;
  justify-content: center;
  margin: 0;
  color: rgba(255, 255, 255, 0.92);
  font-size: var(--feed-control-icon-size);
  line-height: var(--feed-control-icon-size);
  opacity: 0.94;
  transform: none;
}

body[data-page="feed"] .feed-control-label,
body[data-page="feed"] .scrape-request-label,
body[data-page="feed"] .compact-scrape-status {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

/* 83-bottom-dock-panels.css */
body[data-page="feed"] .feed-floating-nav,
body[data-page="feed"] .source-filter {
  position: absolute;
  z-index: 122;
  inset: auto auto calc(100% + 16px) 50%;
  display: flex;
  width: min(300px, calc(100vw - 36px));
  min-width: min(240px, calc(100vw - 36px));
  max-width: min(300px, calc(100vw - 36px));
  height: auto;
  min-height: 0;
  max-height: none;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  gap: 8px;
  padding: 10px;
  border-radius: 18px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  overflow: visible;
  isolation: isolate;
  transform: translate3d(-50%, 16px, 0) scale(0.96);
  transform-origin: 50% 100%;
  transition:
    opacity 190ms,
    visibility 0s linear 190ms,
    transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
}

body[data-page="feed"] .feed-floating-nav,
body[data-page="feed"] .feed-bottom-controls[data-panel="menu"] .feed-floating-nav {
  left: var(--feed-menu-anchor-x);
}

body[data-page="feed"] .source-filter,
body[data-page="feed"] .feed-bottom-controls[data-panel="filter"] .source-filter {
  left: var(--feed-filter-anchor-x);
}

body[data-page="feed"] .feed-bottom-controls[data-panel="menu"] .feed-floating-nav,
body[data-page="feed"] .feed-bottom-controls[data-panel="filter"] .source-filter {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate3d(-50%, 0, 0) scale(1);
  transition:
    opacity 180ms,
    visibility 0s,
    transform 280ms cubic-bezier(0.16, 1, 0.24, 1);
}

body[data-page="feed"] .feed-floating-nav::after,
body[data-page="feed"] .source-filter::after {
  content: none;
  display: none;
}

body[data-page="feed"] .feed-floating-nav button,
body[data-page="feed"] .source-filter button {
  position: relative;
  z-index: 1;
  display: flex;
  width: 100%;
  min-width: 0;
  height: 46px;
  min-height: 46px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
  border: 0;
  border-radius: 12px;
  color: rgba(255, 255, 255, 0.78);
  background: transparent;
  box-shadow: none;
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  cursor: pointer;
  transform: none;
}

body[data-page="feed"] .feed-floating-nav button.active,
body[data-page="feed"] .source-filter button.active,
body[data-page="feed"] .source-filter button.active[data-source-filter] {
  color: rgba(255, 255, 255, 0.98);
}

body[data-page="feed"] .feed-search-popover,
body[data-page="feed"] .feed-scrape-popover {
  position: absolute;
  z-index: 124;
  inset: auto auto calc(100% + 16px) 50%;
  display: block;
  width: min(520px, calc(100vw - 36px));
  max-width: min(520px, calc(100vw - 36px));
  height: auto;
  min-height: 0;
  opacity: 0;
  pointer-events: none;
  transform: translate3d(-50%, 16px, 0) scale(0.96);
  transform-origin: 50% 100%;
  transition:
    opacity 190ms,
    transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
}

body[data-page="feed"] .feed-search-popover {
  left: var(--feed-search-anchor-x);
}

body[data-page="feed"] .feed-scrape-popover {
  left: var(--feed-scrape-anchor-x);
}

body[data-page="feed"] .feed-search-popover[hidden],
body[data-page="feed"] .feed-scrape-popover[hidden] {
  display: none;
}

body[data-page="feed"] .feed-search-popover.active,
body[data-page="feed"] .feed-scrape-popover.active {
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(-50%, 0, 0) scale(1);
}

body[data-page="feed"] .feed-search-popover.closing,
body[data-page="feed"] .feed-scrape-popover.closing {
  opacity: 0;
  pointer-events: none;
  transform: translate3d(-50%, 12px, 0) scale(0.96);
}

body[data-page="feed"] .feed-search-form,
body[data-page="feed"] .feed-scrape-form {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
  min-width: 0;
  height: 58px;
  min-height: 58px;
  align-items: center;
  gap: 8px;
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  color: rgba(255, 255, 255, 0.92);
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

body[data-page="feed"] .feed-search-form::before,
body[data-page="feed"] .feed-search-form::after,
body[data-page="feed"] .feed-scrape-form::before,
body[data-page="feed"] .feed-scrape-form::after {
  content: none;
  display: none;
}

body[data-page="feed"] .feed-search-form > .material-symbols-outlined,
body[data-page="feed"] .feed-scrape-form > .material-symbols-outlined,
body[data-page="feed"] .feed-search-form button,
body[data-page="feed"] .feed-scrape-form button {
  display: none;
}

body[data-page="feed"] .feed-search-form input,
body[data-page="feed"] .feed-scrape-form input {
  width: 100%;
  min-width: 0;
  height: 46px;
  border: 0;
  outline: 0;
  color: rgba(255, 255, 255, 0.94);
  background: transparent;
  font-family: Pretendard, system-ui, sans-serif;
  font-size: 16px;
  font-weight: 500;
  text-align: center;
}

body[data-page="feed"] .feed-search-form input::placeholder,
body[data-page="feed"] .feed-scrape-form input::placeholder {
  color: rgba(255, 255, 255, 0.78);
  font-weight: 500;
}

body[data-page="feed"] .feed-scrape-form[data-state="queued"],
body[data-page="feed"] .feed-scrape-form[data-state="running"] {
  color: rgba(184, 255, 225, 0.96);
}

body[data-page="feed"] .feed-scrape-form[data-state="completed"] {
  color: rgba(184, 255, 225, 0.98);
}

body[data-page="feed"] .feed-scrape-form[data-state="failed"],
body[data-page="feed"] .feed-scrape-form.input-invalid {
  color: rgba(255, 170, 170, 0.98);
}

body[data-page="feed"] .feed-scrape-form[data-tone="warning"] input,
body[data-page="feed"] .feed-scrape-form[data-tone="warning"] input::placeholder {
  color: #ff9200;
}

body[data-page="feed"] .feed-scrape-form[data-tone="notice"] input,
body[data-page="feed"] .feed-scrape-form[data-tone="notice"] input::placeholder {
  color: rgb(141, 247, 174);
}

body[data-page="feed"] .feed-scrape-form[data-tone="danger"] input,
body[data-page="feed"] .feed-scrape-form[data-tone="danger"] input::placeholder {
  color: rgba(255, 112, 112, 0.98);
}

body[data-page="feed"] .feed-scrape-form.scrape-notice-blink input {
  animation: bunnyScrapeNoticeBlink 1000ms ease-in-out 2;
}

body[data-page="feed"] .feed-scrape-help {
  width: 100%;
  margin: 4px 0 0;
  padding: 0;
  color: #aaa;
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
  text-align: center;
}

body[data-page="feed"] .feed-compact-ghost {
  position: absolute;
  z-index: 5;
  pointer-events: none;
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

body[data-page="feed"] .feed-compact-ghost .feed-search-form,
body[data-page="feed"] .feed-compact-ghost .feed-scrape-form {
  width: 100%;
  height: 100%;
}

body[data-page="feed"] .feed-compact-ghost.leaving {
  animation: 220ms cubic-bezier(0.16, 1, 0.24, 1) both bunnyCompactPanelSwipeOut;
}

body[data-page="feed"] .compact-scrape-progress-fill {
  position: absolute;
  z-index: 0;
  inset: 0 auto 0 0;
  display: none;
  width: 0%;
  max-width: 100%;
  border-radius: inherit;
  background:
    linear-gradient(90deg, rgba(52, 211, 153, 0.34), rgba(139, 255, 210, 0.22)),
    rgba(52, 211, 153, 0.1);
  box-shadow: rgba(139, 255, 210, 0.18) 0 0 24px inset;
  opacity: 0;
  pointer-events: none;
  overflow: hidden;
  transition:
    width 260ms cubic-bezier(0.22, 1, 0.36, 1),
    opacity 180ms,
    background 180ms;
}

body[data-page="feed"] .compact-scrape-progress-fill::after {
  content: "";
  position: absolute;
  inset: 0;
  width: 170%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.38), transparent);
  opacity: 0;
  transform: translateX(-70%);
}

body[data-page="feed"] .feed-scrape-form[data-state="queued"] .compact-scrape-progress-fill,
body[data-page="feed"] .feed-scrape-form[data-state="running"] .compact-scrape-progress-fill,
body[data-page="feed"] .feed-scrape-form[data-state="completed"] .compact-scrape-progress-fill {
  background: rgba(52, 211, 153, 0.18);
  opacity: 1;
}

body[data-page="feed"] .feed-bottom-controls[data-compact-switch="search"] .feed-search-form > *,
body[data-page="feed"] .feed-bottom-controls[data-compact-switch="scrape"] .feed-scrape-form > * {
  animation: 220ms cubic-bezier(0.16, 1, 0.24, 1) both bunnyCompactPanelSwipeIn;
}

/* 84-bottom-dock-motion-responsive.css */
@keyframes bunnyCompactPanelSwipeIn {
  0% { opacity: 0; transform: translate3d(0, 16px, 0) scale(0.96); }
  100% { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes bunnyCompactPanelSwipeOut {
  0% { opacity: 1; transform: translate3d(0, 0, 0); }
  100% { opacity: 0; transform: translate3d(0, 12px, 0) scale(0.96); }
}

@keyframes bunnyScrapeWaveDrift {
  100% { background-position: 360px 100%, -180px 100%; }
}

@keyframes bunnyScrapeWaveFloat {
  0%, 100% { transform: translate3d(0, 3px, 0) scaleY(0.94); }
  50% { transform: translate3d(0, -5px, 0) scaleY(1.04); }
}

@keyframes bunnyScrapeNoticeBlink {
  0%, 100% { opacity: 1; }
  25%, 75% { opacity: 0.28; }
  50% { opacity: 1; }
}

@media (min-width: 768px) {
  body[data-page="feed"] .feed-bottom-controls {
    --feed-control-width: 76px;
    --feed-control-height: 58px;
    --feed-control-icon-size: 30px;
  }

  body[data-page="feed"] .feed-floating-nav button,
  body[data-page="feed"] .source-filter button,
  body[data-page="feed"] .feed-search-form input,
  body[data-page="feed"] .feed-scrape-form input,
  body[data-page="feed"] .feed-scrape-help {
    font-size: 20px;
  }
}

@media (max-width: 767px) {
  body[data-page="feed"] .feed-count,
  body[data-page="feed"][data-feed-view="calendar"] .feed-count,
  body[data-page="feed"][data-feed-view="calendar"] .feed-count[hidden] {
    font-size: 24px;
    line-height: 24px;
  }

  body[data-page="feed"] .feed-bottom-controls {
    --feed-control-width: 62px;
    --feed-control-height: 50px;
    --feed-control-icon-size: 26px;
    --feed-control-side-padding: 8px;
    bottom: max(14px, env(safe-area-inset-bottom));
    max-width: calc(100vw - 12px);
  }

  body[data-page="feed"] .feed-floating-nav,
  body[data-page="feed"] .source-filter {
    width: min(164px, calc(100vw - 28px));
    min-width: min(164px, calc(100vw - 28px));
    max-width: min(164px, calc(100vw - 28px));
    border-radius: 17px;
  }

  body[data-page="feed"] .feed-floating-nav button,
  body[data-page="feed"] .source-filter button {
    height: 40px;
    min-height: 40px;
    border-radius: 11px;
  }

  body[data-page="feed"] .feed-search-popover,
  body[data-page="feed"] .feed-scrape-popover {
    position: fixed;
    inset: var(--feed-compact-input-top, 50dvh) auto auto 50%;
    width: calc(100vw - 28px);
    max-width: calc(100vw - 28px);
    transform: translate3d(-50%, calc(-50% + 16px), 0) scale(0.96);
  }

  body[data-page="feed"] .feed-search-popover.active,
  body[data-page="feed"] .feed-scrape-popover.active {
    transform: translate3d(-50%, -50%, 0) scale(1);
  }

  body[data-page="feed"] .feed-search-form,
  body[data-page="feed"] .feed-scrape-form {
    height: 54px;
    min-height: 54px;
  }

  body[data-page="feed"].feed-search-panel-open .feed-bottom-controls,
  body[data-page="feed"].feed-scrape-panel-open .feed-bottom-controls {
    transform: none;
  }

  body[data-page="feed"].feed-search-panel-open .feed-bottom-controls::before,
  body[data-page="feed"].feed-search-panel-open .feed-bottom-controls::after,
  body[data-page="feed"].feed-scrape-panel-open .feed-bottom-controls::before,
  body[data-page="feed"].feed-scrape-panel-open .feed-bottom-controls::after,
  body[data-page="feed"].feed-search-panel-open .feed-bottom-controls > :is(.feed-icon-control, .feed-floating-nav, .source-filter),
  body[data-page="feed"].feed-scrape-panel-open .feed-bottom-controls > :is(.feed-icon-control, .feed-floating-nav, .source-filter) {
    opacity: 0;
    pointer-events: none;
  }

  body[data-page="feed"] .feed-scrape-help {
    font-size: 16px;
  }
}

/* 85-bottom-dock-subscribe.css */
body[data-page="feed"] .feed-subscribe-actions {
  position: absolute;
  z-index: 124;
  inset: auto auto calc(100% + 16px) var(--feed-subscribe-anchor-x);
  display: flex;
  width: min(220px, calc(100vw - 36px));
  flex-direction: column;
  gap: 8px;
  padding: 10px;
  border-radius: 18px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate3d(-50%, 16px, 0) scale(0.96);
  transform-origin: 50% 100%;
  transition:
    opacity 190ms,
    visibility 0s linear 190ms,
    transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
}

body[data-page="feed"] .feed-subscribe-actions.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate3d(-50%, 0, 0) scale(1);
  transition:
    opacity 180ms,
    visibility 0s,
    transform 280ms cubic-bezier(0.16, 1, 0.24, 1);
}

body[data-page="feed"] .feed-subscribe-actions[hidden] {
  display: none;
}

body[data-page="feed"] .feed-subscribe-actions button {
  height: 46px;
  min-height: 46px;
  border: 0;
  border-radius: 12px;
  color: rgba(255, 255, 255, 0.86);
  background: transparent;
  font-family: Pretendard, system-ui, sans-serif;
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
}

body[data-page="feed"] .feed-subscribe-modal {
  position: fixed;
  z-index: 180;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 36px;
  background: var(--bunny-dim-overlay);
  opacity: 0;
  pointer-events: none;
  transition: opacity 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

body[data-page="feed"] .feed-subscribe-modal.active {
  opacity: 1;
  pointer-events: auto;
}

body[data-page="feed"] .feed-subscribe-modal[hidden] {
  display: none;
}

body[data-page="feed"] .feed-subscribe-card {
  position: relative;
  width: min(400px, calc(100vw - 72px));
  padding: 28px;
  border: 1px solid rgba(238, 238, 238, 0.38);
  border-radius: 20px;
  color: #eee;
  background: rgba(22, 22, 22, 0.96);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.22),
    inset 0 -1px 0 rgba(0, 0, 0, 0.42),
    0 22px 80px rgba(0, 0, 0, 0.52);
}

body[data-page="feed"] .feed-subscribe-card h2 {
  margin: 0;
  color: #eee;
  font-size: 24px;
  font-weight: 500;
  line-height: 1.2;
}

body[data-page="feed"] .feed-subscribe-card p {
  margin: 10px 0 20px;
  color: #ddd;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.45;
}

body[data-page="feed"] .feed-subscribe-note {
  margin: 0 0 18px;
  color: #bbb;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.45;
}

body[data-page="feed"] .feed-subscribe-close {
  position: absolute;
  top: 0;
  right: 0;
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid rgba(238, 238, 238, 0.38);
  border-radius: 50%;
  color: #eee;
  background: rgba(34, 34, 34, 0.72);
  transform: translate(50%, -50%);
  cursor: pointer;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

body[data-page="feed"] .feed-subscribe-trigger.subscribed .material-symbols-outlined {
  color: #8bffd2;
  font-variation-settings:
    "FILL" 1,
    "wght" 400,
    "GRAD" 0,
    "opsz" 24;
}

body[data-page="feed"] .feed-subscribe-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 22px;
}

body[data-page="feed"] .feed-subscribe-option {
  display: flex;
  min-width: 0;
  height: 42px;
  align-items: center;
  gap: 10px;
  padding: 0 14px;
  border: 1px solid rgba(238, 238, 238, 0.24);
  border-radius: 14px;
  color: #eee;
  background: rgba(255, 255, 255, 0.06);
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
}

body[data-page="feed"] .feed-subscribe-option input {
  accent-color: #34d399;
}

body[data-page="feed"] .feed-subscribe-submit {
  display: block;
  width: 100%;
  height: 44px;
  border: 1px solid rgba(238, 238, 238, 0.42);
  border-radius: 999px;
  color: #eee;
  background: rgba(255, 255, 255, 0.14);
  font-family: Pretendard, system-ui, sans-serif;
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
}

body[data-page="feed"] .feed-subscribe-status {
  min-height: 20px;
  margin: 14px 0 0;
  color: #fbbf24;
  text-align: center;
}

@media (min-width: 768px) {
  body[data-page="feed"] .feed-subscribe-actions button {
    font-size: 20px;
  }
}

@media (max-width: 767px) {
  body[data-page="feed"] .feed-subscribe-card {
    padding: 24px 18px 20px;
  }

  body[data-page="feed"] .feed-subscribe-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  body[data-page="feed"] .feed-subscribe-option {
    height: 40px;
    gap: 8px;
    padding: 0 10px;
    font-size: 14px;
  }
}

@media (max-width: 359px) {
  body[data-page="feed"] .feed-subscribe-options {
    grid-template-columns: 1fr;
  }
}
