/* MeloTools Midnight Glass theme + fluid Melozinha chibi reveal. */

::view-transition-old(root),
::view-transition-new(root) {
  animation: none;
  mix-blend-mode: normal;
}

::view-transition-old(root) { z-index: 1; }
::view-transition-new(root) { z-index: 9999; }

html.mt-theme-transitioning::view-transition-group(root) {
  animation-duration: 1.72s;
  animation-timing-function: linear;
}

html.mt-theme-transitioning::view-transition-new(root) {
  animation: mt-melozinha-reveal 1.72s cubic-bezier(.65, 0, .35, 1) both;
  -webkit-mask-image: url("../theme-mascot/melozinha-chibi-dance.webp?v=20260724-fps2");
  mask-image: url("../theme-mascot/melozinha-chibi-dance.webp?v=20260724-fps2");
  -webkit-mask-position: 50% 50%;
  mask-position: 50% 50%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 0;
  mask-size: 0;
}

@keyframes mt-melozinha-reveal {
  0% {
    -webkit-mask-image: url("../theme-mascot/melozinha-chibi-dance.webp?v=20260724-fps2");
    mask-image: url("../theme-mascot/melozinha-chibi-dance.webp?v=20260724-fps2");
    -webkit-mask-position: 50% 55%;
    mask-position: 50% 55%;
    -webkit-mask-size: 0;
    mask-size: 0;
  }
  7% {
    -webkit-mask-image: url("../theme-mascot/melozinha-chibi-dance.webp?v=20260724-fps2");
    mask-image: url("../theme-mascot/melozinha-chibi-dance.webp?v=20260724-fps2");
    -webkit-mask-position: 50% 50%;
    mask-position: 50% 50%;
    -webkit-mask-size: 27vmax;
    mask-size: 27vmax;
  }
  7.01%, 87.99% {
    -webkit-mask-image: url("../theme-mascot/melozinha-chibi-dance.webp?v=20260724-fps2");
    mask-image: url("../theme-mascot/melozinha-chibi-dance.webp?v=20260724-fps2");
    -webkit-mask-position: 50% 50%;
    mask-position: 50% 50%;
    -webkit-mask-size: 28vmax;
    mask-size: 28vmax;
  }
  88% {
    -webkit-mask-image: radial-gradient(circle, #000 0 68%, transparent 70%);
    mask-image: radial-gradient(circle, #000 0 68%, transparent 70%);
    -webkit-mask-position: 50% 50%;
    mask-position: 50% 50%;
    -webkit-mask-size: 28vmax 28vmax;
    mask-size: 28vmax 28vmax;
  }
  100% {
    -webkit-mask-image: radial-gradient(circle, #000 0 68%, transparent 70%);
    mask-image: radial-gradient(circle, #000 0 68%, transparent 70%);
    -webkit-mask-position: 50% 50%;
    mask-position: 50% 50%;
    -webkit-mask-size: 220vmax 220vmax;
    mask-size: 220vmax 220vmax;
  }
}

html.mt-theme-transitioning,
html.mt-theme-transitioning * {
  pointer-events: none !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] {
  color-scheme: dark;
  --brand: #5aa2ff;
  --brand-strong: #357de2;
  --brand-ink: #b9d8ff;
  --brand-soft: #10233b;
  --accent: #f6bd4a;
  --accent-2: #57d6c7;
  --bg: #05080e;
  --fg: #f1f5f9;
  --muted: #9ba9b9;
  --stroke: #222e3d;
  --stroke-strong: #34465b;
  --surface: #0c121b;
  --surface-soft: #101925;
  --panel: rgba(12, 18, 27, .92);
  --panel-soft: rgba(16, 25, 37, .96);
  --soft: #131d2a;
  --soft-2: #0b121c;
  --card: #0c121b;
  --ui-ink: #f1f5f9;
  --ui-muted: #9ba9b9;
  --ui-line: #222e3d;
  --ui-soft: #0c131d;
  --ui-blue: #5aa2ff;
  --ui-blue-dark: #9cc8ff;
  --ui-blue-soft: #10233b;
  --shadow: 0 30px 90px rgba(0, 0, 0, .46);
  --shadow-soft: 0 14px 36px rgba(0, 0, 0, .28);
  --focus-ring: 0 0 0 4px rgba(90, 162, 255, .18);
  background: #05080e;
}

html[data-ui-theme="saas"][data-color-mode="dark"] body {
  background:
    radial-gradient(ellipse 70% 34% at 50% -8%, rgba(57, 126, 224, .16), transparent 68%),
    radial-gradient(circle at 92% 18%, rgba(45, 212, 191, .045), transparent 24%),
    linear-gradient(180deg, #070b12 0%, #05080e 46%, #04070c 100%) !important;
  color: var(--fg) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] body::before {
  background: linear-gradient(180deg, rgba(28, 73, 131, .08), transparent 58%) !important;
  opacity: 1 !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] body::after {
  background-image:
    linear-gradient(rgba(148, 163, 184, .018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148, 163, 184, .018) 1px, transparent 1px) !important;
  background-size: 42px 42px !important;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, .75), transparent 72%);
  opacity: .65 !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] ::selection {
  background: rgba(90, 162, 255, .34);
  color: #fff;
}

html[data-ui-theme="saas"][data-color-mode="dark"] ::-webkit-scrollbar-track { background: #060a10 !important; }
html[data-ui-theme="saas"][data-color-mode="dark"] ::-webkit-scrollbar-thumb {
  border-color: #060a10 !important;
  background: #2a394b !important;
}

/* Header */
html[data-ui-theme="saas"][data-color-mode="dark"] .header {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .header-top {
  border: 1px solid rgba(75, 96, 121, .5) !important;
  background: linear-gradient(180deg, rgba(18, 25, 36, .96), rgba(9, 14, 22, .96)) !important;
  box-shadow:
    0 20px 55px rgba(0, 0, 0, .34),
    inset 0 1px 0 rgba(255, 255, 255, .055),
    inset 0 -1px 0 rgba(90, 162, 255, .055) !important;
  backdrop-filter: blur(22px) saturate(125%) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .saas-brand-logo {
  filter: brightness(1.28) saturate(1.08) drop-shadow(0 7px 15px rgba(0, 0, 0, .32)) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .mt-tools-badge-dot-saas {
  border-color: #121b28 !important;
  background: linear-gradient(145deg, #64adff, #357de2) !important;
  box-shadow: 0 0 0 1px rgba(121, 184, 255, .24), 0 7px 20px rgba(53, 125, 226, .34) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .theme-switcher {
  border: 1px solid #202d3d !important;
  background: #060a10 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .theme-option {
  color: #8f9daf !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .theme-option:hover {
  background: #101925 !important;
  color: #e5edf6 !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .theme-option.active {
  border-color: rgba(90, 162, 255, .34) !important;
  background: linear-gradient(145deg, #18365b, #102640) !important;
  color: #f4f8ff !important;
  box-shadow: 0 7px 20px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .07) !important;
}

.theme-option[data-theme-choice="dark"] {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.theme-option-icon {
  width: 15px;
  height: 15px;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(.lang-current, .lang-menu) {
  border-color: #263548 !important;
  background: rgba(9, 14, 22, .98) !important;
  color: var(--fg) !important;
  box-shadow: 0 18px 44px rgba(0, 0, 0, .38) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(.lang-option:hover, .lang-option.active) {
  background: #142135 !important;
}

/* Main shell and typography */
html[data-ui-theme="saas"][data-color-mode="dark"] .card {
  border: 1px solid rgba(57, 75, 96, .68) !important;
  background: linear-gradient(180deg, rgba(10, 15, 23, .95), rgba(7, 11, 18, .97)) !important;
  box-shadow:
    0 32px 100px rgba(0, 0, 0, .42),
    inset 0 1px 0 rgba(255, 255, 255, .028) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .workspace-intro {
  position: relative;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .workspace-kicker {
  border-color: rgba(90, 162, 255, .3) !important;
  background: rgba(26, 59, 99, .48) !important;
  color: #acd0ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(
  .workspace-intro h1, .title, .media-brand-title, .media-tool-title,
  .nav-rail-label strong, .tool-launcher-head strong
) {
  color: #f3f7fb !important;
  text-shadow: none !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(
  .workspace-intro p, .sub, .note, .small, .nav-rail-label,
  .nav-rail-label span, .mt-card-form small, .tool-launcher-copy small,
  .tool-launcher-action, .tool-search-meta, .youtube-meta-copy span, .footer
) {
  color: #98a7b8 !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(
  .mt-field label, .youtube-mode-row label, .youtube-mode-row label span,
  .media-action-strip label, .media-action-strip label span,
  .media-options-panel label, .media-field-stack label,
  .clip-control-grid label, .inputs label, legend
) {
  color: #d8e0e9 !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(.mt-auto-hint, .mt-field small) {
  color: #8797a9 !important;
}

/* Search */
html[data-ui-theme="saas"][data-color-mode="dark"] #toolSearchWrap .tool-search-row {
  border-color: #29394d !important;
  background: rgba(9, 15, 24, .98) !important;
  box-shadow: 0 14px 36px rgba(0, 0, 0, .25), inset 0 1px 0 rgba(255, 255, 255, .028) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] #toolSearchWrap .tool-search-row:focus-within,
html[data-ui-theme="saas"][data-color-mode="dark"] #toolSearchWrap.is-open .tool-search-row {
  border-color: #548fd2 !important;
  box-shadow: 0 0 0 4px rgba(90, 162, 255, .12), 0 18px 48px rgba(0, 0, 0, .32) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] #toolSearchWrap .tool-search-submit {
  background: linear-gradient(145deg, #173457, #10253e) !important;
  color: #8fc1ff !important;
  box-shadow: inset 0 0 0 1px rgba(90, 162, 255, .1) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] #toolSearchWrap #toolSearchInput {
  color: #eef4fa !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] #toolSearchWrap #toolSearchInput::placeholder {
  color: #8292a5 !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(.tool-search-shortcut kbd, .tool-launcher-footer kbd) {
  border-color: #2b3b4e !important;
  border-bottom-color: #3a4c61 !important;
  background: #101822 !important;
  color: #a7b4c3 !important;
  box-shadow: 0 1px 0 #03060a !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] #toolSearchClear:not([hidden]) {
  background: #121c29 !important;
  color: #b5c1cf !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] #toolLauncher.tool-launcher {
  border-color: #2b3b4f !important;
  background: rgba(7, 12, 19, .99) !important;
  box-shadow: 0 32px 80px rgba(0, 0, 0, .58) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .tool-launcher-option {
  color: #d3dce6 !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .tool-launcher-option.is-highlighted {
  border-color: #2f537c !important;
  background: linear-gradient(100deg, #122840, #0e1d2e) !important;
  color: #c5ddfa !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .tool-launcher-badge {
  border-color: #2b3b4e !important;
  background: #111b27 !important;
  color: #a6b5c5 !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .tool-launcher-option[data-category="pdf"] .tool-launcher-badge { background: #321922 !important; border-color: #673043 !important; color: #f5a7bb !important; }
html[data-ui-theme="saas"][data-color-mode="dark"] .tool-launcher-option[data-category="image"] .tool-launcher-badge { background: #271c37 !important; border-color: #4d3569 !important; color: #d4b3f4 !important; }
html[data-ui-theme="saas"][data-color-mode="dark"] .tool-launcher-option[data-category="dev"] .tool-launcher-badge { background: #0d2c3b !important; border-color: #1c5069 !important; color: #7dd3fc !important; }
html[data-ui-theme="saas"][data-color-mode="dark"] .tool-launcher-option[data-category="links"] .tool-launcher-badge { background: #102d25 !important; border-color: #205440 !important; color: #86efac !important; }
html[data-ui-theme="saas"][data-color-mode="dark"] .tool-launcher-option[data-category="video"] .tool-launcher-badge,
html[data-ui-theme="saas"][data-color-mode="dark"] .tool-launcher-option[data-category="media"] .tool-launcher-badge { background: #332416 !important; border-color: #684824 !important; color: #fdba74 !important; }

html[data-ui-theme="saas"][data-color-mode="dark"] :is(.tool-launcher-empty, .tool-launcher-footer) {
  border-color: #202d3c !important;
  background: #0b121b !important;
  color: #8f9daf !important;
}

/* Privacy note */
html[data-ui-theme="saas"][data-color-mode="dark"] .privacy-status {
  border-color: rgba(52, 211, 153, .22) !important;
  background: rgba(8, 47, 39, .66) !important;
  color: #a8d5c7 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .privacy-status::before {
  background: rgba(52, 211, 153, .14) !important;
  color: #6ee7b7 !important;
}

/* Navigation */
html[data-ui-theme="saas"][data-color-mode="dark"] :is(.main-tabs, .tool-tabs, body.mt-category-media .tool-tabs) {
  border-color: #202d3c !important;
  background: #080d14 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .022) !important;
  scrollbar-color: #2c3d51 transparent !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(.main-tabs, .tool-tabs) .tabbtn,
html[data-ui-theme="saas"][data-color-mode="dark"] body.mt-category-media .tool-tabs .tool-tab:not(.active) {
  color: #9eacbc !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(.main-tabs, .tool-tabs) .tabbtn:hover,
html[data-ui-theme="saas"][data-color-mode="dark"] body.mt-category-media .tool-tabs .tool-tab:not(.active):hover {
  border-color: #2b3c50 !important;
  background: #111a26 !important;
  color: #edf3f9 !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .main-tabs .tabbtn.active {
  border-color: #5da5ff !important;
  background: linear-gradient(145deg, #438eea, #2e70c8) !important;
  color: #fff !important;
  box-shadow: 0 8px 22px rgba(39, 103, 186, .3), inset 0 1px 0 rgba(255, 255, 255, .16) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .tool-tabs .tabbtn.active,
html[data-ui-theme="saas"][data-color-mode="dark"] body.mt-category-media .tool-tabs .tool-tab.active {
  border-color: #31577f !important;
  background: linear-gradient(180deg, #132b47, #10233a) !important;
  color: #b9d8ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045) !important;
}

/* Forms and tool content */
html[data-ui-theme="saas"][data-color-mode="dark"] :is(
  input[type="text"], input[type="search"], input[type="number"], input[type="url"],
  input[type="password"], input[type="email"], input[type="date"], input[type="time"],
  textarea, select
) {
  border-color: #293b50 !important;
  background: #070c13 !important;
  color: #eef3f8 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .018) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(
  input[type="text"], input[type="search"], input[type="number"], input[type="url"],
  input[type="password"], input[type="email"], textarea, select
):focus {
  border-color: #548fd2 !important;
  box-shadow: 0 0 0 4px rgba(90, 162, 255, .11), inset 0 1px 0 rgba(255, 255, 255, .02) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(input, textarea)::placeholder {
  color: #748497 !important;
  opacity: 1 !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] option {
  background: #0b111a;
  color: #eef3f8;
}

html[data-ui-theme="saas"][data-color-mode="dark"] input:is([type="radio"], [type="checkbox"]) {
  accent-color: #5aa2ff;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(.media-tool-shell, .media-tool-shell-narrow) {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .youtube-panel.media-panel-clean {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .mt-field {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(
  .drop, .media-download-card:not(.media-panel-clean), .instagram-card,
  .instagram-action-card, .instagram-output-panel, .instagram-result,
  .mt-card-form, .youtube-options, .media-options-panel, .media-action-strip,
  .youtube-mode-row, .youtube-meta, .youtube-batch-item, .row, .item,
  .removebg-strength, .removebg-preview-card, .slider-wrap,
  .tool-favorite-toggle, .tool-shortcut-chip, .cookie-notice,
  .cookie-panel-card, .xp-dialog, .saas-share-link, .mt-dice-stage,
  .mt-inline-result
) {
  border-color: #222f3f !important;
  background: linear-gradient(180deg, #0e1621, #0a111a) !important;
  color: #e9eff5 !important;
  box-shadow: 0 12px 34px rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .025) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(.drop:hover, .drop.dragover) {
  border-color: #416e9d !important;
  background: #101e2d !important;
  box-shadow: 0 0 0 4px rgba(90, 162, 255, .07) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(.drop .icon, .icon) {
  background: #112944 !important;
  color: #8fc1ff !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(.btn, button.btn, a.btn) {
  border-color: #4b92ea !important;
  background: linear-gradient(145deg, #4d96f1, #3479d4) !important;
  color: #fff !important;
  box-shadow: 0 10px 26px rgba(40, 103, 184, .27), inset 0 1px 0 rgba(255, 255, 255, .16) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(.btn, button.btn, a.btn):hover {
  border-color: #71b0ff !important;
  background: linear-gradient(145deg, #5ba4fb, #3d84df) !important;
  box-shadow: 0 13px 30px rgba(40, 103, 184, .34) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(.btn.alt, .btn.secondary, .controls .btn) {
  border-color: #2d3e52 !important;
  background: #111a26 !important;
  color: #dbe4ed !important;
  box-shadow: 0 7px 18px rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .028) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(.btn.alt, .btn.secondary, .controls .btn):hover {
  border-color: #435d79 !important;
  background: #162231 !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(.progress, .youtube-progress, .youtube-progress-bar) {
  border-color: #202d3c !important;
  background: #05090f !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(pre, code, .code-output, .json-output) {
  border-color: #243347 !important;
  background: #05090f !important;
  color: #c8d7e7 !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .checkerboard {
  background-color: #080d14 !important;
  background-image:
    linear-gradient(45deg, #131d29 25%, transparent 25%),
    linear-gradient(-45deg, #131d29 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #131d29 75%),
    linear-gradient(-45deg, transparent 75%, #131d29 75%) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .media-brand-title img[alt="Threads"] {
  filter: invert(1) brightness(1.08) !important;
}

/* Dialogs, notices and footer */
html[data-ui-theme="saas"][data-color-mode="dark"] .footer {
  border-color: rgba(45, 61, 80, .82) !important;
  background: rgba(8, 13, 20, .78) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .018) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] :is(a, .footer-link, .cookie-policy-link, .cookie-footer-link) {
  color: #83baff !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .toast {
  border-color: #2b3b4f !important;
  background: #0c141f !important;
  color: #edf3f9 !important;
  box-shadow: 0 20px 54px rgba(0, 0, 0, .5) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .xp-dialog-titlebar {
  background: linear-gradient(135deg, #357de2, #204f8d) !important;
}

html[data-ui-theme="saas"][data-color-mode="dark"] .mt-logo-slogan {
  border-color: #29486a !important;
  background: linear-gradient(135deg, #101f32, #0b1522) !important;
  color: #eef4fa !important;
  box-shadow: var(--shadow-soft) !important;
}

@media (max-width: 640px) {
  html[data-ui-theme="saas"] .theme-option {
    min-width: 0 !important;
    padding-inline: 8px !important;
  }

  .theme-option-icon {
    width: 14px;
    height: 14px;
  }

  html[data-ui-theme="saas"][data-color-mode="dark"] .header-top {
    background: linear-gradient(180deg, rgba(17, 24, 35, .98), rgba(8, 13, 20, .98)) !important;
  }

  html[data-ui-theme="saas"][data-color-mode="dark"] .card {
    background: linear-gradient(180deg, rgba(9, 14, 22, .98), rgba(6, 10, 16, .99)) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root),
  ::view-transition-new(root) {
    animation-duration: .001ms !important;
  }
}