html:not(.ui-ready) .matrix-code-rain {
  opacity: 0;
}

[data-page="dashboard"] [data-dashboard-task-card],
[data-page="week"] .task-card,
[data-page="week"] .quiz-card,
[data-page="week"] .doc-card,
[data-page="week"] .notes-shell,
[data-page="week"] .helper-panel {
  content-visibility: auto;
  contain: layout style paint;
}

[data-page="dashboard"] [data-dashboard-task-card] {
  contain-intrinsic-size: 340px;
}

[data-page="week"] .task-card {
  contain-intrinsic-size: 520px;
}

[data-page="week"] .quiz-card,
[data-page="week"] .doc-card,
[data-page="week"] .notes-shell {
  contain-intrinsic-size: 420px;
}

[data-page="week"] .helper-panel {
  contain-intrinsic-size: 720px;
}

[data-theme="matrix"] .matrix-code-rain,
body.theme-matrix .matrix-code-rain {
  gap: clamp(0.2rem, 0.8vw, 0.75rem);
  mask-image: linear-gradient(180deg, transparent, #000 10%, #000 90%, transparent);
  contain: layout style paint;
  isolation: isolate;
  transition: opacity 180ms ease;
}

[data-theme="matrix"] .matrix-code-column,
body.theme-matrix .matrix-code-column {
  gap: clamp(0.55rem, 1.6vh, 1.1rem);
}

.page-hidden [data-matrix-code-rain] {
  opacity: 0;
}

.page-hidden [data-matrix-code-rain] .matrix-code-column {
  animation-play-state: paused;
}

.theme-cursor,
.theme-cursor-trail {
  contain: layout style paint;
}

.page-hidden .theme-cursor,
.page-hidden .theme-cursor-trail,
.page-hidden .theme-cursor-particle {
  opacity: 0 !important;
  visibility: hidden;
}

[data-theme="matrix"] .matrix-code-token,
body.theme-matrix .matrix-code-token {
  border-color: rgba(33, 255, 102, 0.08);
  background: rgba(2, 7, 3, 0.14);
  text-shadow: 0 0 4px currentColor;
  filter: none;
}

[data-theme="matrix"] .matrix-code-token.is-html,
body.theme-matrix .matrix-code-token.is-html {
  border-color: rgba(125, 249, 255, 0.12);
}

[data-theme="matrix"] .matrix-code-token.is-css,
body.theme-matrix .matrix-code-token.is-css {
  border-color: rgba(215, 255, 103, 0.12);
}

[data-theme="matrix"] .matrix-code-token.is-js,
body.theme-matrix .matrix-code-token.is-js {
  border-color: rgba(255, 122, 217, 0.12);
}

[data-theme="matrix"] .matrix-code-token.is-glyph,
body.theme-matrix .matrix-code-token.is-glyph {
  border-color: rgba(33, 255, 102, 0.1);
  background: rgba(33, 255, 102, 0.03);
}

[data-theme="matrix"] .theme-cursor-orb,
body.theme-matrix .theme-cursor-orb {
  box-shadow:
    0 0 10px rgba(33, 255, 102, 0.45),
    0 0 20px rgba(167, 255, 190, 0.2);
}

[data-theme="matrix"] .theme-cursor-ring,
body.theme-matrix .theme-cursor-ring {
  box-shadow:
    inset 0 0 8px rgba(33, 255, 102, 0.1),
    0 0 14px rgba(33, 255, 102, 0.12);
}

[data-theme="matrix"] .theme-cursor-particle,
body.theme-matrix .theme-cursor-particle {
  box-shadow: 0 0 8px rgba(33, 255, 102, 0.38);
}

@supports not (content-visibility: auto) {
  [data-page="dashboard"] [data-dashboard-task-card],
  [data-page="week"] .task-card,
  [data-page="week"] .quiz-card,
  [data-page="week"] .doc-card,
  [data-page="week"] .notes-shell,
  [data-page="week"] .helper-panel {
    contain: none;
  }
}