diff --git a/config/instance-config.js b/config/instance-config.js
index abc257b6..249347de 100644
--- a/config/instance-config.js
+++ b/config/instance-config.js
@@ -40,7 +40,7 @@ export const IS_VERBOSE_DEV_MODE = true;
  * Leave this `false` for normal operation so downstream modules (via
  * `js/config.js`) continue exposing the full experience.
  */
-export const IS_LOCKDOWN_MODE = fales;
+export const IS_LOCKDOWN_MODE = true;
 
 /**
  * The title displayed in the header when the site is in lockdown mode.
diff --git a/css/tailwind.source (1).css b/css/tailwind.source (1).css
new file mode 100644
index 00000000..90bd850f
--- /dev/null
+++ b/css/tailwind.source (1).css	
@@ -0,0 +1,5800 @@
+@import "./tokens.css";
+
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer base {
+  html {
+    font-size: 80%;
+  }
+
+  @media (min-width: theme("screens.md")) {
+    html {
+      font-size: 100%;
+    }
+  }
+
+  @media (min-width: theme("screens.lg")) {
+    html {
+      font-size: 75%;
+    }
+  }
+
+  *,
+  *::before,
+  *::after {
+    scrollbar-width: thin;
+    scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
+  }
+
+  *::-webkit-scrollbar {
+    width: var(--scrollbar-width);
+    height: var(--scrollbar-width);
+  }
+
+  *::-webkit-scrollbar-track {
+    background: var(--scrollbar-track);
+  }
+
+  *::-webkit-scrollbar-thumb {
+    background: var(--scrollbar-thumb);
+    border-radius: var(--radius-sm);
+  }
+
+  *::-webkit-scrollbar-thumb:hover {
+    background: var(--scrollbar-thumb-hover);
+  }
+
+  body {
+    --app-header-centerline: calc(
+      env(safe-area-inset-top, 0) + var(--app-header-centerline-offset)
+    );
+    font-family: var(--font-family-sans);
+    background-color: var(--color-page);
+    color: var(--color-text-strong);
+    line-height: 1.5;
+    margin: 0;
+    padding: 0;
+    overflow-x: hidden;
+  }
+
+  :root[data-theme-accent="override"] {
+    --color-accent: var(--color-accent-override);
+    --color-accent-strong: var(--color-accent-strong-override);
+    --color-accent-pressed: var(--color-accent-pressed-override);
+  }
+
+  #uiOverlay {
+    position: fixed;
+    inset: 0;
+    pointer-events: none;
+    z-index: var(--z-overlay-popover);
+  }
+
+  #uiOverlay > * {
+    pointer-events: auto;
+  }
+
+  #nip71TagsFieldset > legend,
+  #editNip71TagsFieldset > legend {
+    margin-left: 0;
+    padding: 0;
+  }
+
+  #app {
+    background-color: var(--color-page);
+    color: inherit;
+  }
+
+  html.modal-open,
+  body.modal-open {
+    overflow: hidden;
+    height: 100%;
+  }
+
+  body.modal-open #app {
+    overflow: hidden;
+  }
+
+  body.modal-open #sidebar {
+    pointer-events: none;
+    opacity: 0;
+    visibility: hidden;
+  }
+
+  body.modal-open #sidebar {
+    z-index: var(--z-sidebar-overlay);
+  }
+
+  #sidebar.is-modal-hidden {
+    pointer-events: none;
+    opacity: 0;
+    visibility: hidden;
+  }
+
+  [ng\:cloak],
+  [ng-cloak],
+  [data-ng-cloak],
+  [x-ng-cloak],
+  .ng-cloak,
+  .x-ng-cloak,
+  .ng-hide:not(.ng-hide-animate) {
+    display: none !important;
+  }
+
+  ng\:form {
+    display: block;
+  }
+
+  .ng-animate-shim {
+    visibility: hidden;
+  }
+
+  .ng-anchor {
+    position: absolute;
+  }
+}
+
+@layer components {
+  .ds-header {
+    @apply flex items-center justify-start py-sm;
+  }
+
+  .app-shell__header {
+    position: sticky;
+    top: env(safe-area-inset-top, 0);
+    z-index: var(--z-app-header);
+    padding-top: calc(var(--space-sm) + env(safe-area-inset-top, 0));
+    padding-bottom: var(--space-sm);
+    background-color: transparent;
+    background-image: var(--surface-overlay-banner-gradient-header);
+    background-repeat: no-repeat;
+    background-size: 100% 100%;
+  }
+
+  .ds-metric-probe {
+    position: absolute;
+    top: 0;
+    left: 0;
+    visibility: hidden;
+    pointer-events: none;
+    contain: layout size style;
+    inline-size: 0;
+    block-size: var(--ds-metric-probe-length, 0);
+    overflow: hidden;
+  }
+
+  .ds-header__logo {
+    @apply h-2xl-plus w-auto max-w-none;
+  }
+
+  .focus-ring {
+    @apply outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-opacity-70 focus-visible:ring-offset-2 focus-visible:ring-offset-surface focus-visible:transition-shadow focus-visible:duration-fast focus-visible:ease-out;
+  }
+
+  .focus-ring:focus-visible {
+    --tw-ring-color: var(--color-accent);
+  }
+
+  .author-pic {
+    @apply block h-full w-full rounded-full object-cover;
+  }
+
+  .header-icon-toggle {
+    @apply focus-ring inline-flex items-center justify-center rounded-full transition-colors duration-150 ease-out;
+    width: var(--icon-size-lg);
+    height: var(--icon-size-lg);
+    min-width: var(--icon-size-lg);
+    min-height: var(--icon-size-lg);
+    padding: 0;
+    border: none;
+    background: transparent;
+    color: var(--color-text-muted);
+    line-height: 1;
+  }
+
+  .header-icon-toggle[data-theme-state="light"] {
+    color: var(--color-text-strong);
+  }
+
+  .header-icon-toggle[data-theme-state="dark"] {
+    color: var(--color-text);
+  }
+
+  .header-icon-toggle__icon-wrapper {
+    @apply inline-flex items-center justify-center;
+    inline-size: var(--space-lg);
+    block-size: var(--space-lg);
+  }
+
+  .header-icon-toggle__icon {
+    inline-size: 100%;
+    block-size: 100%;
+    display: none;
+    fill: currentColor;
+  }
+
+  .header-icon-toggle__icon-wrapper:not([data-theme-icon-state]),
+  .header-icon-toggle__icon-wrapper[data-theme-icon-state="light"] {
+    color: inherit;
+  }
+
+  .header-icon-toggle__icon-wrapper[data-theme-icon-state="light"]
+    .header-icon-toggle__icon--dark {
+    display: block;
+  }
+
+  .header-icon-toggle__icon-wrapper[data-theme-icon-state="dark"]
+    .header-icon-toggle__icon--light {
+    display: block;
+  }
+
+  .header-icon-toggle__icon-wrapper:not([data-theme-icon-state])
+    .header-icon-toggle__icon--dark {
+    display: block;
+  }
+
+  #profileUnreadDot {
+    position: absolute;
+    top: var(--space-2xs);
+    right: var(--space-2xs);
+    width: var(--space-sm);
+    height: var(--space-sm);
+    border-radius: var(--radius-full);
+    border: var(--border-width-hairline) solid var(--color-page);
+    background-color: var(--status-danger);
+    display: none;
+    pointer-events: none;
+  }
+
+  #profileUnreadDot.is-visible {
+    display: block;
+  }
+
+  .header-icon-toggle[data-theme-state="light"]:hover,
+  .header-icon-toggle[data-theme-state="light"]:focus-visible {
+    color: var(--color-text);
+  }
+
+  .header-icon-toggle[data-theme-state="dark"]:hover,
+  .header-icon-toggle[data-theme-state="dark"]:focus-visible {
+    color: var(--color-text-strong);
+  }
+
+  .header-icon-toggle[aria-pressed="true"] {
+    color: var(--color-text-strong);
+  }
+
+  .header-icon-toggle[aria-pressed="true"]:hover,
+  .header-icon-toggle[aria-pressed="true"]:focus-visible {
+    color: var(--color-text-strong);
+  }
+
+  .header-search__region {
+    @apply hidden flex-1 justify-center md:flex;
+    min-width: 0;
+    padding-inline: clamp(var(--space-md), 4vw, var(--space-3xl));
+  }
+
+  .header-search {
+    @apply flex items-center gap-3 rounded-full border border-border border-opacity-40 bg-overlay-panel px-4 shadow-sm transition-colors duration-base ease-out;
+    backdrop-filter: blur(var(--popover-backdrop-blur));
+    -webkit-backdrop-filter: blur(var(--popover-backdrop-blur));
+    padding-block: calc(var(--space-sm) * 0.9);
+    inline-size: min(100%, var(--header-search-max-inline));
+  }
+
+  .header-search:focus-within {
+    @apply border-accent-strong;
+  }
+
+  .header-search__icon {
+    @apply block h-5 w-5;
+    background-color: currentColor;
+    mask-repeat: no-repeat;
+    mask-position: center;
+    mask-size: contain;
+    -webkit-mask-repeat: no-repeat;
+    -webkit-mask-position: center;
+    -webkit-mask-size: contain;
+  }
+
+  .header-search__icon--filter {
+    mask-image: url("../assets/svg/filter.svg");
+    -webkit-mask-image: url("../assets/svg/filter.svg");
+  }
+
+  .header-search__icon--submit {
+    mask-image: url("../assets/svg/search.svg");
+    -webkit-mask-image: url("../assets/svg/search.svg");
+  }
+
+  .header-search__filter {
+    @apply focus-ring inline-flex shrink-0 items-center justify-center rounded-full border border-transparent bg-transparent transition-colors duration-base ease-out;
+    color: var(--color-accent);
+    inline-size: calc(var(--icon-size-lg) * 0.9);
+    block-size: calc(var(--icon-size-lg) * 0.9);
+    min-inline-size: calc(var(--icon-size-lg) * 0.9);
+    min-block-size: calc(var(--icon-size-lg) * 0.9);
+  }
+
+  .header-search__filter:hover,
+  .header-search__filter:focus-visible {
+    color: var(--color-accent-strong);
+  }
+
+  .header-search__input {
+    @apply flex-1 appearance-none bg-transparent text-sm text-text outline-none placeholder:text-muted;
+    min-width: 0;
+  }
+
+  .header-search__input:focus-visible {
+    @apply outline-none ring-0;
+  }
+
+  .header-search__submit {
+    @apply focus-ring inline-flex items-center justify-center rounded-full border border-transparent transition-colors duration-base ease-out;
+    background-color: var(--color-accent-strong);
+    color: var(--color-white);
+    inline-size: calc(var(--icon-size-lg) * 0.9);
+    block-size: calc(var(--icon-size-lg) * 0.9);
+    min-inline-size: calc(var(--icon-size-lg) * 0.9);
+    min-block-size: calc(var(--icon-size-lg) * 0.9);
+    padding: 0;
+  }
+
+  .header-search__submit:hover {
+    background-color: var(--color-accent);
+  }
+
+  .header-search__submit:focus-visible {
+    background-color: var(--color-accent-pressed);
+  }
+
+  .bv-logo {
+    --logo-wordmark-color: var(--color-logo-wordmark);
+    --logo-accent-color: var(--color-logo-accent);
+    --logo-background-color: var(--color-logo-background);
+  }
+
+  .bv-logo[data-variant="inverse"] {
+    --logo-wordmark-color: var(--color-logo-wordmark-inverse);
+    --logo-background-color: var(--color-logo-background-inverse);
+  }
+
+  .bv-logo[data-wordmark="current"] {
+    --logo-wordmark-color: currentColor;
+  }
+
+  .bv-logo[data-accent="current"] {
+    --logo-accent-color: currentColor;
+  }
+
+  .bv-logo[data-background="transparent"] {
+    --logo-background-color: transparent;
+  }
+
+  .bv-logo__wordmark {
+    fill: var(--logo-wordmark-color);
+    color: var(--logo-wordmark-color);
+  }
+
+  .bv-logo__accent {
+    fill: var(--logo-accent-color);
+    color: var(--logo-accent-color);
+  }
+
+  .bv-logo__background {
+    fill: var(--logo-background-color);
+    color: var(--logo-background-color);
+  }
+
+  .markdown-prose {
+    @apply prose max-w-none leading-relaxed text-text;
+    --tw-prose-body: var(--color-text);
+    --tw-prose-headings: var(--color-text-strong);
+    --tw-prose-invert-headings: var(--color-text-strong);
+    --tw-prose-lead: var(--color-text);
+    --tw-prose-links: var(--color-accent-strong);
+    --tw-prose-bold: var(--color-text-strong);
+    --tw-prose-counters: var(--color-text-muted);
+    --tw-prose-bullets: var(--color-text-muted);
+    --tw-prose-hr: var(--color-border-translucent-strong);
+    --tw-prose-quotes: var(--color-text-strong);
+    --tw-prose-quote-borders: var(--color-border-subtle);
+    --tw-prose-captions: var(--color-text-muted);
+    --tw-prose-code: var(--color-text-strong);
+    --tw-prose-pre-code: var(--color-text);
+    --tw-prose-pre-bg: var(--surface-muted);
+    --tw-prose-th-borders: var(--color-border);
+    --tw-prose-td-borders: var(--color-border-subtle);
+  }
+
+  .markdown-prose :where(h1, h2, h3, h4, h5, h6) {
+    color: var(--color-text-strong);
+  }
+
+  .markdown-prose :where(h1, h2, h3, h4, h5, h6) strong {
+    color: inherit;
+  }
+
+  .markdown-prose a {
+    color: var(--color-accent-strong);
+    text-decoration-color: color-mix(
+      in srgb,
+      var(--color-accent-strong) 65%,
+      transparent
+    );
+    text-decoration-thickness: var(--link-underline-thickness);
+    text-underline-offset: 0.2em;
+  }
+
+  .markdown-prose a:hover,
+  .markdown-prose a:focus-visible {
+    color: var(--color-accent);
+    text-decoration-line: underline;
+  }
+
+  .markdown-prose blockquote {
+    @apply rounded-md border-l-4 border-border-subtle bg-surface-muted bg-opacity-50 px-4 py-2 text-muted;
+  }
+
+  .markdown-prose :where(pre, code) {
+    @apply font-mono;
+  }
+
+  .markdown-prose code {
+    @apply rounded-md bg-surface-muted px-1 py-0.5 text-accent-strong;
+  }
+
+  .markdown-prose pre {
+    @apply overflow-x-auto rounded-lg border border-border-subtle bg-surface-muted p-4 text-text;
+  }
+
+  .markdown-prose pre code {
+    background-color: transparent;
+    color: inherit;
+    padding: 0;
+  }
+
+  .popover {
+    @apply relative inline-flex;
+  }
+
+  .popover-panel,
+  .popover__panel {
+    @apply focus-ring pointer-events-none z-overlay-popover min-w-menu max-w-popover-safe scale-95 rounded-overlay border border-border border-opacity-40 bg-overlay-panel px-overlay-panel-inline py-overlay-panel-block text-sm text-text opacity-0 shadow-overlay-panel transition-opacity transition-transform duration-base ease-out;
+    position: var(--popover-strategy, fixed);
+    left: var(--popover-left, 0);
+    top: var(--popover-top, 0);
+    max-width: var(--popover-max-width, none);
+    max-height: var(--popover-max-height, none);
+  }
+
+  .popover-panel[data-state="open"],
+  .popover__panel[data-state="open"] {
+    @apply pointer-events-auto scale-100 opacity-100;
+  }
+
+  .popover-panel[data-state="closed"],
+  .popover__panel[data-state="closed"] {
+    @apply pointer-events-none scale-95 opacity-0;
+  }
+
+  [data-popover-arrow="true"] {
+    left: var(--popover-arrow-left, auto);
+    right: var(--popover-arrow-right, auto);
+    top: var(--popover-arrow-top, auto);
+    bottom: var(--popover-arrow-bottom, auto);
+  }
+
+  .p-overlay-panel {
+    @apply px-overlay-panel-inline py-overlay-panel-block;
+  }
+
+  .ds-overlay-backdrop {
+    position: fixed;
+    inset: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: var(--overlay-backdrop-color);
+    backdrop-filter: blur(var(--overlay-backdrop-blur));
+    -webkit-backdrop-filter: blur(var(--overlay-backdrop-blur));
+  }
+
+  .popover-panel[data-variant="zap"],
+  .popover__panel[data-variant="zap"] {
+    background: var(--color-overlay-veil);
+    color: var(--color-subtle);
+    border: var(--border-width-hairline) solid
+      var(--color-border-translucent-stronger);
+    box-shadow: var(--shadow-popover-zap);
+    backdrop-filter: blur(var(--popover-backdrop-blur));
+    -webkit-backdrop-filter: blur(var(--popover-backdrop-blur));
+  }
+
+  .btn {
+    @apply focus-ring inline-flex items-center justify-center gap-2 rounded-full border border-transparent bg-accent-strong px-5 py-2.5 text-base font-semibold text-white shadow-lg transition duration-base ease-in-out;
+  }
+
+  .btn[data-size="sm"],
+  .btn-ghost[data-size="sm"] {
+    @apply px-3 py-1.5 text-sm;
+  }
+
+  .btn[data-size="sm"],
+  .btn-ghost[data-size="sm"] {
+    @apply gap-1.5;
+  }
+
+  .btn:hover {
+    @apply bg-accent;
+  }
+
+  .btn:focus-visible {
+    @apply bg-accent-pressed;
+  }
+
+  .btn:disabled {
+    @apply pointer-events-none cursor-not-allowed opacity-60 shadow-none;
+  }
+
+  .btn-link {
+    @apply focus-ring inline-flex items-center gap-1 text-sm font-semibold text-accent transition duration-base ease-out;
+  }
+
+  .btn-link:hover,
+  .btn-link:focus-visible {
+    @apply text-accent-strong underline;
+  }
+
+  .progress,
+  [data-progress-meter] {
+    --progress-height: var(--progress-height-md);
+    --progress-track: var(--progress-track-color);
+    --progress-fill: var(--progress-fill-color);
+    --progress-radius-current: var(--progress-radius);
+    display: block;
+    width: 100%;
+    height: var(--progress-height);
+    border: none;
+    border-radius: var(--progress-radius-current);
+    overflow: hidden;
+    background-color: var(--progress-track);
+    appearance: none;
+  }
+
+  .progress::-webkit-progress-bar,
+  [data-progress-meter]::-webkit-progress-bar {
+    background-color: var(--progress-track);
+    border-radius: var(--progress-radius-current);
+  }
+
+  .progress::-webkit-progress-value,
+  [data-progress-meter]::-webkit-progress-value {
+    background-color: var(--progress-fill);
+    border-radius: var(--progress-radius-current);
+    transition: width var(--progress-transition-duration)
+      var(--progress-transition-ease);
+  }
+
+  .progress::-moz-progress-bar,
+  [data-progress-meter]::-moz-progress-bar {
+    background-color: var(--progress-fill);
+    border-radius: var(--progress-radius-current);
+    transition: width var(--progress-transition-duration)
+      var(--progress-transition-ease);
+  }
+
+  .progress[data-variant="surface"],
+  [data-progress-meter][data-variant="surface"],
+  .progress.progress--surface,
+  [data-progress-meter].progress--surface {
+    --progress-track: var(--color-panel);
+  }
+
+  .progress[data-variant="accent"],
+  [data-progress-meter][data-variant="accent"],
+  .progress.progress--accent,
+  [data-progress-meter].progress--accent {
+    --progress-fill: var(--color-info-strong);
+  }
+
+  .btn-ghost {
+    @apply btn border border-border border-opacity-60 bg-transparent text-text shadow-none;
+  }
+
+  .btn-ghost:hover {
+    @apply bg-panel-hover text-text;
+  }
+
+  .btn-ghost:focus-visible {
+    @apply bg-panel-hover;
+  }
+
+  .btn-ghost:disabled {
+    @apply pointer-events-none opacity-50 shadow-none;
+  }
+
+  .btn-ghost[data-variant="critical"] {
+    @apply border border-critical border-opacity-60 text-critical;
+  }
+
+  .btn-ghost[data-variant="critical"]:hover,
+  .btn-ghost[data-variant="critical"]:focus-visible {
+    @apply bg-critical bg-opacity-20 text-critical-strong;
+  }
+
+  .login-option {
+    @apply focus-ring relative flex h-full w-full flex-col gap-4 overflow-hidden border border-border bg-overlay-panel-soft px-6 py-5 text-left text-text shadow-lg transition duration-300 ease-out;
+    border-radius: calc(var(--radius-xl) * 1.12);
+    isolation: isolate;
+    backdrop-filter: blur(var(--blur-modal-backdrop));
+    background-image: linear-gradient(
+      140deg,
+      color-mix(in srgb, var(--surface-overlay-panel-soft) 88%, transparent) 0%,
+      color-mix(in srgb, var(--surface-overlay-panel) 72%, transparent) 100%
+    );
+    transform: translate3d(0, 0, 0);
+    transition-property: border-color, box-shadow, transform;
+  }
+
+  .login-option::after {
+    content: "";
+    position: absolute;
+    inset: 0;
+    z-index: 0;
+    border-radius: inherit;
+    opacity: 0;
+    transform: translate3d(0, 14%, 0);
+    transition:
+      opacity 220ms ease,
+      transform 220ms ease;
+    background: radial-gradient(
+      115% 115% at 0% 0%,
+      color-mix(in srgb, var(--status-neutral) 32%, transparent) 0%,
+      transparent 65%
+    );
+  }
+
+  .login-option:hover,
+  .login-option:focus-visible {
+    @apply border-border-strong;
+    box-shadow: var(--shadow-modal);
+    transform: translate3d(0, var(--motion-login-option-hover-translate), 0);
+  }
+
+  .login-option:hover::after,
+  .login-option:focus-visible::after {
+    opacity: 0.65;
+    transform: translate3d(0, 0, 0);
+  }
+
+  .login-option:disabled,
+  .login-option[aria-disabled="true"] {
+    @apply cursor-not-allowed opacity-60 shadow-none;
+    transform: none;
+  }
+
+  .login-option[data-tone="accent"]::after {
+    background: radial-gradient(
+      120% 120% at 0% 0%,
+      color-mix(in srgb, var(--status-info) 38%, transparent) 0%,
+      transparent 65%
+    );
+  }
+
+  .login-option[data-tone="warning"]::after {
+    background: radial-gradient(
+      120% 120% at 0% 0%,
+      color-mix(in srgb, var(--status-warning) 42%, transparent) 0%,
+      transparent 65%
+    );
+  }
+
+  .login-option--primary {
+    @apply border-border;
+  }
+
+  .login-option--ghost {
+    background-image: linear-gradient(
+      145deg,
+      color-mix(in srgb, var(--surface-overlay-panel-soft) 82%, transparent) 0%,
+      color-mix(in srgb, var(--surface-overlay-panel-soft) 68%, transparent)
+        100%
+    );
+  }
+
+  .login-option--outline {
+    @apply border-border-strong;
+  }
+
+  .login-option--link {
+    @apply border border-transparent bg-transparent text-accent shadow-none;
+  }
+
+  .login-option__header,
+  .login-option__copy,
+  .login-option__status,
+  .login-option__capabilities {
+    position: relative;
+    z-index: 1;
+  }
+
+  .login-option__header {
+    @apply flex w-full items-start justify-between gap-4;
+  }
+
+  .login-option__copy {
+    @apply flex min-w-0 flex-col items-start gap-2;
+  }
+
+  .login-option__eyebrow {
+    @apply text-[length:var(--font-size-2xs)] font-semibold uppercase text-text-muted;
+    letter-spacing: 0.18em;
+  }
+
+  .login-option:hover .login-option__eyebrow,
+  .login-option:focus-visible .login-option__eyebrow {
+    @apply text-text;
+  }
+
+  .login-option__label {
+    @apply text-lg font-semibold text-text;
+  }
+
+  .login-option__description {
+    @apply text-sm leading-relaxed text-text-muted;
+  }
+
+  .login-option__chevron {
+    @apply inline-flex h-9 w-9 items-center justify-center rounded-full bg-overlay-panel text-text-muted transition duration-200 ease-out;
+    box-shadow: inset 0 0 0 var(--border-width-hairline)
+      color-mix(in srgb, var(--border-overlay) 60%, transparent);
+  }
+
+  .login-option:hover .login-option__chevron,
+  .login-option:focus-visible .login-option__chevron {
+    @apply bg-accent text-white;
+    box-shadow: none;
+  }
+
+  .login-option__status {
+    @apply flex w-full items-center justify-between gap-2 text-sm text-text-muted;
+  }
+
+  .login-option__capabilities {
+    @apply flex flex-wrap gap-2;
+    position: relative;
+  }
+
+  .btn-ghost[data-state="active"],
+  .btn-ghost[aria-pressed="true"] {
+    @apply border-transparent bg-primary text-white shadow-md;
+  }
+
+  .btn-ghost[data-state="active"]:hover,
+  .btn-ghost[data-state="active"]:focus-visible,
+  .btn-ghost[aria-pressed="true"]:hover,
+  .btn-ghost[aria-pressed="true"]:focus-visible {
+    @apply bg-accent-strong;
+  }
+
+  .modal-progress {
+    width: var(--progress-width, 0%);
+    transition: width var(--motion-duration-base, 160ms)
+      var(--motion-ease-out, ease-out);
+  }
+
+  .cloudflare-progress__fill {
+    width: var(--cloudflare-progress-width, 0%);
+    transition: width var(--motion-duration-base, 160ms)
+      var(--motion-ease-out, ease-out);
+  }
+
+  /*
+   * Blog embed heights are now driven by the iframe content via postMessage.
+   * Styling lives inline so the shell can expand naturally with its card.
+   */
+
+  /*
+   * Blog carousel component styles
+   * Tokens consumed here are defined in css/tokens.css under the
+   * "Blog carousel tokens" section:
+   */
+
+  .badge {
+    @apply inline-flex items-center gap-1 rounded-full border border-status-neutral-border bg-status-neutral-surface px-3 py-1 text-2xs font-semibold uppercase tracking-extra-wide text-status-neutral-on;
+  }
+
+  .badge[data-variant="info"] {
+    @apply border-status-info-border bg-status-info-surface text-status-info-on;
+  }
+
+  .badge[data-variant="success"] {
+    @apply border-status-success-border bg-status-success-surface text-status-success-on;
+  }
+
+  .badge[data-variant="warning"] {
+    @apply border-status-warning-border bg-status-warning-surface text-status-warning-on;
+  }
+
+  .badge[data-variant="critical"] {
+    @apply border-status-danger-border bg-status-danger-surface text-status-danger-on;
+  }
+
+  .badge[data-variant="private"] {
+    @apply border-status-private-border bg-status-private-surface text-status-private-on;
+  }
+
+  .badge[data-variant="neutral"] {
+    @apply border-status-neutral-border bg-status-neutral-surface text-status-neutral-on;
+  }
+
+  .moderation-badge {
+    @apply inline-flex flex-col items-start gap-sm rounded-xl border px-3 py-1.5 text-xs font-semibold normal-case tracking-tight shadow-sm;
+  }
+
+  .moderation-badge--interactive {
+    pointer-events: auto;
+  }
+
+  .moderation-badge__actions {
+    @apply inline-flex flex-nowrap items-center gap-sm;
+  }
+
+  .moderation-badge__label {
+    @apply inline-flex items-center gap-xs whitespace-nowrap;
+  }
+
+  .moderation-badge[data-variant="warning"] {
+    @apply border-status-warning-border bg-status-warning-surface text-status-warning-on;
+    box-shadow: 0 var(--shadow-badge-offset-y) var(--shadow-badge-blur)
+      color-mix(in srgb, var(--status-warning) 18%, transparent);
+  }
+
+  .moderation-badge[data-variant="neutral"] {
+    @apply border-status-neutral-border bg-status-neutral-surface text-status-neutral-on;
+    box-shadow: 0 var(--shadow-badge-offset-y) var(--shadow-badge-blur)
+      color-mix(in srgb, var(--status-neutral) 18%, transparent);
+  }
+
+  .moderation-badge__icon {
+    @apply inline-flex h-5 w-5 items-center justify-center rounded-full bg-status-warning-surface text-status-warning-on;
+    background-color: color-mix(
+      in srgb,
+      var(--status-warning) 18%,
+      transparent
+    );
+    color: var(--status-warning-on);
+  }
+
+  .moderation-badge[data-variant="neutral"] .moderation-badge__icon {
+    @apply bg-status-neutral-surface text-status-neutral-on;
+    background-color: color-mix(
+      in srgb,
+      var(--status-neutral) 18%,
+      transparent
+    );
+    color: var(--status-neutral-on);
+  }
+
+  .moderation-badge__icon-mark {
+    @apply h-3.5 w-3.5;
+  }
+
+  .moderation-badge__text {
+    @apply whitespace-nowrap text-xs font-semibold tracking-tight;
+  }
+
+  .moderation-badge__action {
+    @apply inline-flex items-center gap-1.5 rounded-full border border-status-warning-border bg-status-warning-surface px-3 py-1 text-xs font-semibold normal-case tracking-tight text-status-warning-on transition duration-150 ease-out;
+    background-color: color-mix(
+      in srgb,
+      var(--status-warning) 16%,
+      transparent
+    );
+    border-color: color-mix(
+      in srgb,
+      var(--status-warning-border) 80%,
+      transparent
+    );
+    color: var(--status-warning-on);
+  }
+
+  .moderation-badge[data-variant="warning"] .moderation-badge__action:hover {
+    background-color: color-mix(
+      in srgb,
+      var(--status-warning) 24%,
+      transparent
+    );
+  }
+
+  .moderation-badge[data-variant="neutral"] .moderation-badge__action {
+    @apply border-status-neutral-border bg-status-neutral-surface text-status-neutral-on;
+    background-color: color-mix(
+      in srgb,
+      var(--status-neutral) 16%,
+      transparent
+    );
+    border-color: color-mix(
+      in srgb,
+      var(--status-neutral-border) 80%,
+      transparent
+    );
+    color: var(--status-neutral-on);
+  }
+
+  .moderation-badge[data-variant="neutral"] .moderation-badge__action:hover {
+    background-color: color-mix(
+      in srgb,
+      var(--status-neutral) 24%,
+      transparent
+    );
+  }
+
+  .moderation-badge__action:focus-visible {
+    outline: var(--outline-thick-width) solid
+      color-mix(in srgb, var(--status-warning) 38%, transparent);
+    outline-offset: var(--space-3xs);
+  }
+
+  .moderation-badge[data-variant="neutral"]
+    .moderation-badge__action:focus-visible {
+    outline: var(--outline-thick-width) solid
+      color-mix(in srgb, var(--status-neutral) 38%, transparent);
+  }
+
+  .moderation-badge__action[disabled] {
+    cursor: wait;
+    opacity: 0.7;
+  }
+
+  .pill {
+    @apply inline-flex items-center gap-2 rounded-full border border-status-neutral-border bg-status-neutral-surface px-3 py-1 text-xs font-medium text-status-neutral-on;
+  }
+
+  .pill[data-size="compact"] {
+    @apply px-2 py-0.5 text-2xs;
+  }
+
+  .pill[data-variant="info"] {
+    @apply border-status-info-border bg-status-info-surface text-status-info-on;
+  }
+
+  .pill[data-variant="success"] {
+    @apply border-status-success-border bg-status-success-surface text-status-success-on;
+  }
+
+  .pill[data-variant="warning"] {
+    @apply border-status-warning-border bg-status-warning-surface text-status-warning-on;
+  }
+
+  .pill[data-variant="critical"] {
+    @apply border-status-danger-border bg-status-danger-surface text-status-danger-on;
+  }
+
+  .pill[data-variant="private"] {
+    @apply border-status-private-border bg-status-private-surface text-status-private-on;
+  }
+
+  .pill[data-variant="neutral"] {
+    @apply border-status-neutral-border bg-status-neutral-surface text-status-neutral-on;
+  }
+
+  .overlay-scrim {
+    background-color: var(--surface-overlay);
+  }
+
+  .overlay-scrim[data-strength="muted"] {
+    background-color: var(--surface-overlay-muted);
+  }
+
+  .overlay-scrim[data-strength="strong"] {
+    background-color: var(--surface-overlay-strong);
+  }
+
+  .overlay-panel {
+    background-color: var(--surface-overlay-panel);
+  }
+
+  .overlay-panel[data-variant="soft"] {
+    background-color: var(--surface-overlay-panel-soft);
+  }
+
+  .overlay-panel[data-variant="glass"] {
+    background-color: var(--surface-overlay-panel-glass);
+  }
+
+  .menu {
+    @apply flex flex-col gap-1 py-2;
+  }
+
+  .menu__heading {
+    @apply px-4 pb-2 text-xs font-semibold uppercase tracking-wide text-muted;
+  }
+
+  .menu__separator {
+    @apply my-2 h-px bg-border bg-opacity-20;
+  }
+
+  .menu__item {
+    @apply focus-ring relative flex w-full items-center gap-3 rounded-md px-4 py-2 text-sm font-medium text-text transition-colors duration-[var(--motion-duration-fast)] ease-[var(--motion-ease-in-out)];
+  }
+
+  .menu__item:hover {
+    @apply bg-panel-hover text-text;
+  }
+
+  .menu__item[data-state="active"] {
+    @apply bg-accent bg-opacity-20 text-accent-strong;
+  }
+
+  .menu__item[data-variant="critical"] {
+    @apply text-critical-strong;
+  }
+
+  .menu__item[data-variant="critical"]:hover {
+    @apply bg-critical bg-opacity-20;
+  }
+
+  .menu__item:disabled,
+  .menu__item[aria-disabled="true"] {
+    @apply cursor-not-allowed bg-transparent text-muted opacity-60;
+  }
+
+  .menu__item:disabled:hover,
+  .menu__item[aria-disabled="true"]:hover {
+    @apply bg-transparent text-muted;
+  }
+
+  .card {
+    --video-card-lift-translate-y: 0;
+    --video-card-backdrop-opacity: 0;
+    --video-card-backdrop-translate-y: var(--space-md-plus);
+    --video-card-backdrop-scale: 1.08;
+    --video-card-backdrop-blur: var(--blur-thumbnail-blur);
+    @apply focus-ring relative rounded-lg border border-transparent bg-card text-text shadow-md transition duration-base ease-in-out;
+    transform: translate3d(0, var(--video-card-lift-translate-y), 0);
+    transition-property:
+      transform, box-shadow, border-color, background-color, color;
+    will-change: transform;
+    isolation: isolate;
+  }
+
+  .card::before {
+    content: "";
+    position: absolute;
+    inset: 0;
+    z-index: 0;
+    opacity: var(--video-card-backdrop-opacity);
+    background-image: var(--video-card-thumb-url, none);
+    background-position: center;
+    background-repeat: no-repeat;
+    background-size: cover;
+    transform: translate3d(0, var(--video-card-backdrop-translate-y), 0)
+      scale(var(--video-card-backdrop-scale));
+    filter: blur(var(--video-card-backdrop-blur));
+    transition:
+      opacity var(--motion-duration-base) var(--motion-ease-in-out),
+      transform var(--motion-duration-base) var(--motion-ease-in-out),
+      filter var(--motion-duration-base) var(--motion-ease-in-out);
+    pointer-events: none;
+    will-change: opacity, transform, filter;
+  }
+
+  .card > * {
+    position: relative;
+    z-index: 1;
+  }
+
+  .card--compact {
+    @apply flex flex-row items-start gap-md;
+  }
+
+  .card--compact .video-card__media {
+    inline-size: clamp(
+      var(--video-card-compact-media-min),
+      calc(var(--video-modal-secondary-min) * 0.4),
+      var(--video-card-compact-media-max)
+    );
+    flex-basis: clamp(
+      var(--video-card-compact-media-min),
+      calc(var(--video-modal-secondary-min) * 0.4),
+      var(--video-card-compact-media-max)
+    );
+    @apply block shrink-0 overflow-hidden rounded-lg;
+  }
+
+  .card--compact .video-card__content {
+    @apply flex min-w-0 flex-1 flex-col gap-sm p-md;
+  }
+
+  .card--compact .video-card__title {
+    @apply text-base font-semibold leading-snug;
+  }
+
+  .card--compact .video-card__author-name {
+    @apply text-xs;
+  }
+
+  .card--compact .video-card__meta {
+    @apply mt-0 flex items-center gap-2 text-2xs text-muted-strong;
+  }
+
+  .card--compact .video-card__meta .view-count-text {
+    @apply text-2xs;
+  }
+
+  .card:hover,
+  .card:focus-within {
+    --video-card-lift-translate-y: var(--motion-video-card-hover-translate);
+    --video-card-backdrop-opacity: 0.425;
+    --video-card-backdrop-translate-y: var(
+      --motion-video-card-backdrop-translate
+    );
+    --video-card-backdrop-scale: 1.12;
+    --video-card-backdrop-blur: var(--blur-video-card-backdrop-strong);
+    @apply shadow-lg;
+  }
+
+  .card:focus-visible {
+    @apply border-accent border-opacity-40 shadow-lg;
+  }
+
+  .card[data-state="critical"] {
+    @apply border border-critical border-opacity-40 bg-card-critical;
+  }
+
+  .card[data-state="private"] {
+    @apply bg-card-private shadow-lg;
+  }
+
+  .card[data-state="disabled"] {
+    @apply opacity-60 shadow-none;
+  }
+
+  .video-card__title {
+    transition: color var(--motion-duration-base) var(--motion-ease-in-out);
+  }
+
+  .video-card__title:hover,
+  .video-card__title:focus-visible {
+    color: var(--color-accent);
+  }
+
+  .form-control {
+    @apply focus-ring block w-full rounded-md border border-border-subtle bg-surface-alt px-3 py-2 text-sm text-text shadow-sm transition duration-base ease-in-out placeholder:text-muted;
+  }
+
+  .form-control:hover {
+    @apply border-border;
+  }
+
+  .form-control:focus-visible {
+    @apply border-accent-strong;
+  }
+
+  .form-control:disabled {
+    @apply cursor-not-allowed bg-surface text-muted opacity-60;
+  }
+
+  .form-control:invalid {
+    @apply border-critical border-opacity-60;
+  }
+
+  .form-control[data-state="locked"],
+  .input[data-state="locked"],
+  .textarea[data-state="locked"],
+  .select[data-state="locked"],
+  textarea.form-control[data-state="locked"],
+  select.form-control[data-state="locked"] {
+    @apply cursor-default border-border-sidebar-strong bg-overlay-panel-soft text-muted;
+  }
+
+  .form-control[data-state="locked"]:focus-visible,
+  .input[data-state="locked"]:focus-visible,
+  .textarea[data-state="locked"]:focus-visible,
+  .select[data-state="locked"]:focus-visible,
+  textarea.form-control[data-state="locked"]:focus-visible,
+  select.form-control[data-state="locked"]:focus-visible {
+    @apply border-border-sidebar-strong shadow-none outline-none ring-0 ring-offset-0;
+  }
+
+  .form-control[data-state="locked"]:disabled,
+  .input[data-state="locked"]:disabled,
+  .textarea[data-state="locked"]:disabled,
+  .select[data-state="locked"]:disabled,
+  textarea.form-control[data-state="locked"]:disabled,
+  select.form-control[data-state="locked"]:disabled {
+    @apply cursor-default opacity-100;
+  }
+
+  .input {
+    @apply form-control;
+  }
+
+  .textarea {
+    @apply form-control min-h-[var(--form-textarea-min-height)] resize-y;
+  }
+
+  .select {
+    @apply form-control appearance-none pr-10;
+    --select-arrow-color: var(--color-border);
+    background-image:
+      linear-gradient(135deg, transparent 50%, var(--select-arrow-color) 50%),
+      linear-gradient(45deg, var(--select-arrow-color) 50%, transparent 50%),
+      linear-gradient(
+        to right,
+        var(--color-border-subtle),
+        var(--color-border-subtle)
+      );
+    background-position:
+      right var(--form-select-icon-offset) center,
+      right var(--form-select-icon-gap) center,
+      right var(--form-select-icon-hit-area) center;
+    background-size:
+      var(--form-select-icon-size) var(--form-select-icon-size),
+      var(--form-select-icon-size) var(--form-select-icon-size),
+      var(--form-select-divider-width) 60%;
+    background-repeat: no-repeat;
+  }
+
+  .select:hover {
+    --select-arrow-color: var(--color-border);
+  }
+
+  .select:focus-visible {
+    --select-arrow-color: var(--color-accent-strong);
+  }
+
+  .select:disabled {
+    --select-arrow-color: var(--color-border-subtle);
+  }
+
+  .select:invalid {
+    --select-arrow-color: var(--color-critical);
+  }
+
+  .checkbox {
+    @apply focus-ring inline-flex h-5 w-5 cursor-pointer appearance-none items-center justify-center rounded border border-border-subtle bg-surface-alt text-white transition duration-base ease-in-out;
+  }
+
+  .checkbox:hover {
+    @apply border-border;
+  }
+
+  .checkbox:disabled {
+    @apply cursor-not-allowed border-border-subtle bg-surface text-muted opacity-60;
+  }
+
+  .checkbox::after {
+    content: "";
+    @apply pointer-events-none h-2 w-3 border-b-2 border-r-2 border-white opacity-0 transition duration-base ease-in-out;
+    transform: rotate(45deg) translateY(var(--form-checkbox-checkmark-offset))
+      scale(0.85);
+  }
+
+  .checkbox:checked,
+  .checkbox[aria-checked="true"] {
+    @apply border-accent-strong bg-accent-strong;
+  }
+
+  .checkbox:checked::after,
+  .checkbox[aria-checked="true"]::after {
+    @apply opacity-100;
+    transform: rotate(45deg) translateY(var(--form-checkbox-checkmark-offset))
+      scale(1);
+  }
+
+  .switch {
+    @apply focus-ring relative inline-flex h-6 w-11 cursor-pointer items-center rounded-full border border-border-subtle bg-border-subtle transition-colors duration-base ease-in-out;
+  }
+
+  .switch::before {
+    content: "";
+    @apply pointer-events-none absolute left-0.5 top-1/2 h-5 w-5 -translate-y-1/2 transform rounded-full bg-surface shadow-md transition duration-base ease-in-out;
+  }
+
+  .switch:disabled {
+    @apply cursor-not-allowed border-border-subtle bg-surface text-muted opacity-60;
+  }
+
+  .switch[aria-checked="true"],
+  .switch.is-on {
+    @apply border-accent-strong bg-accent-strong;
+  }
+
+  .switch[aria-checked="true"]::before,
+  .switch.is-on::before {
+    @apply translate-x-5;
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    .form-control,
+    .checkbox,
+    .checkbox::after,
+    .switch,
+    .switch::before,
+    .popover-panel,
+    .popover__panel,
+    .menu__item {
+      transition: none !important;
+    }
+  }
+
+  .bv-modal {
+    @apply fixed inset-0 z-[var(--z-modal-root)] flex items-center justify-center p-6 sm:p-8;
+  }
+
+  .bv-modal[hidden],
+  .bv-modal.hidden {
+    display: none !important;
+  }
+
+  .bv-modal__panel {
+    @apply focus-ring relative z-[var(--z-modal-content)] w-full max-w-modal rounded-modal-xl border border-border-translucent px-8 pb-8 pt-7 text-left text-text shadow-modal transition duration-base ease-out;
+    background-color: var(--color-modal-surface, var(--color-overlay-panel));
+  }
+
+  .bv-modal__panel:focus-visible {
+    @apply border-border-translucent-bright;
+  }
+
+  .bv-modal-backdrop {
+    @apply fixed inset-0 z-[var(--z-modal-overlay)] backdrop-saturate-150;
+    background-color: var(--color-modal-backdrop, var(--color-overlay-muted));
+    backdrop-filter: blur(var(--blur-modal-backdrop));
+    -webkit-backdrop-filter: blur(var(--blur-modal-backdrop));
+  }
+
+  .bv-modal-backdrop[data-variant="veil"] {
+    @apply backdrop-blur-3xl;
+    background-color: var(--color-overlay-veil);
+  }
+
+  .bv-modal-backdrop[data-variant="muted"] {
+    background-color: var(--color-overlay-muted);
+  }
+
+  .modal-sheet {
+    @apply bv-modal__panel relative my-0 w-full overflow-hidden;
+    max-width: var(--modal-sheet-inline-max);
+    overscroll-behavior: contain;
+  }
+
+  @media (max-width: calc(theme("screens.lg") - var(--breakpoint-edge-offset))) {
+    .bv-modal {
+      align-items: stretch;
+      justify-content: stretch;
+      padding: 0;
+    }
+
+    .bv-modal__panel,
+    .modal-sheet {
+      inline-size: 100vw;
+      block-size: 100vh;
+      max-width: none;
+      max-height: none;
+      margin: 0;
+      border-radius: 0;
+      border: 0;
+      padding-top: calc(var(--space-lg) + env(safe-area-inset-top));
+      padding-right: calc(var(--space-lg) + env(safe-area-inset-right));
+      padding-bottom: calc(var(--space-lg) + env(safe-area-inset-bottom));
+      padding-left: calc(var(--space-lg) + env(safe-area-inset-left));
+      overflow: auto;
+    }
+  }
+
+  .modal-header {
+    @apply flex items-start justify-between gap-md px-8 pb-4 pt-7;
+    background: transparent;
+    border: 0;
+  }
+
+  .modal-header[data-variant="flush"] {
+    @apply px-0 pb-0 pt-0;
+    background: transparent;
+  }
+
+  .modal-header__title {
+    @apply text-xl font-bold text-text;
+  }
+
+  .modal-close {
+    @apply focus-ring flex h-10 w-10 items-center justify-center rounded-full transition duration-base ease-out;
+    border: var(--border-width-hairline) solid
+      var(--color-border-translucent-medium);
+    background: var(--color-surface-tint-subtle);
+    color: var(--color-text-frosted-strong);
+  }
+
+  .modal-close:hover {
+    background: var(--color-border-translucent);
+    border-color: var(--color-border-translucent-stronger);
+    color: var(--color-text);
+  }
+
+  .modal-back {
+    @apply inline-flex items-center gap-2;
+  }
+
+  @media (min-width: theme("screens.lg")) {
+    .modal-back {
+      display: none !important;
+    }
+  }
+
+  .modal-body {
+    @apply space-y-5 px-8 pb-8 pt-2;
+    overscroll-behavior: contain;
+  }
+
+  .modal-body {
+    scrollbar-width: thin;
+  }
+
+  .modal-body::-webkit-scrollbar {
+    width: var(--scrollbar-thin-width);
+  }
+
+  .modal-body::-webkit-scrollbar-track {
+    background: transparent;
+  }
+
+  .modal-body::-webkit-scrollbar-thumb {
+    background: var(--color-border-translucent);
+    border-radius: var(--radius-full);
+  }
+
+  /* Modal embed containers ensure iframe wrappers respect modal sizing tokens. */
+  .modal-embed-frame {
+    @apply flex h-modal-embed max-h-modal-embed w-full flex-col;
+  }
+
+  .modal-footer {
+    @apply flex flex-col gap-3 px-8 pb-8 pt-4;
+  }
+
+  .modal-alert {
+    @apply flex items-start gap-3 rounded-md border border-warning-strong border-opacity-60 px-4 py-3 text-sm text-warning-strong;
+    backdrop-filter: blur(var(--blur-modal-alert));
+    background-color: var(--color-warning-glass);
+  }
+
+  .modal-alert__icon {
+    @apply mt-0.5 h-5 w-5 flex-shrink-0 text-warning-strong;
+  }
+
+  .modal-tile {
+    @apply rounded-xl border border-border-translucent bg-overlay-panel-soft px-5 py-4 text-sm text-text-frosted;
+    background-color: var(--color-overlay-panel-glass-soft);
+  }
+
+  .modal-tile > h3 {
+    @apply text-base font-semibold text-text;
+  }
+
+  .modal-primary {
+    @apply btn w-full justify-center;
+  }
+
+  .grid-stack {
+    @apply grid gap-lg;
+  }
+
+  .grid-stack[data-variant="cards"] {
+    @apply grid-cols-1 sm:grid-cols-2 xl:grid-cols-3;
+  }
+
+  .grid-stack[data-orientation="vertical"] {
+    @apply flex flex-col gap-md;
+  }
+
+  .bv-stack {
+    @apply flex flex-col gap-lg;
+  }
+
+  .bv-stack--tight {
+    @apply gap-md;
+  }
+
+  .bv-grid-video {
+    @apply grid gap-xl py-lg;
+    grid-template-columns: repeat(
+      auto-fill,
+      minmax(var(--grid-card-min-width), 1fr)
+    );
+  }
+
+  .card[data-alert="nsfw-owner"] {
+    @apply border border-critical border-opacity-40 bg-black;
+  }
+
+  .card[data-alert="nsfw-owner"]:hover {
+    @apply border-opacity-60 shadow-lg;
+  }
+
+  .card img[data-thumbnail-state="blurred"],
+  .card img[data-visual-state="blurred"],
+  .channel-profile-container img[data-visual-state="blurred"] {
+    @apply transition duration-base ease-in-out;
+    filter: blur(var(--blur-thumbnail-blur));
+    transform: scale(1.05);
+  }
+
+  .channel-moderation-badge-anchor {
+    @apply flex flex-col gap-sm;
+    pointer-events: none;
+    width: 100%;
+  }
+
+  .channel-moderation-badge-anchor:empty {
+    display: none;
+  }
+
+  .channel-moderation-badge-anchor > [data-moderation-badge="true"] {
+    pointer-events: auto;
+    max-width: min(100%, var(--moderation-badge-max-inline));
+  }
+
+  #playerModal .video-modal__video {
+    position: relative;
+  }
+
+  #playerModal
+    .video-modal__video[data-visual-state="blurred"]
+    .video-modal__media {
+    @apply transition duration-base ease-in-out;
+    filter: blur(var(--blur-thumbnail-blur));
+    transform: scale(1.05);
+  }
+
+  #playerModal .video-modal__moderation-bar {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding-bottom: var(--space-md);
+  }
+
+  #playerModal .video-modal__moderation-bar[hidden] {
+    display: none;
+  }
+
+  #playerModal .video-modal__moderation-bar .moderation-badge {
+    width: 100%;
+    max-width: none;
+    flex-direction: row;
+    flex-wrap: wrap;
+    justify-content: space-between;
+    align-items: center;
+    gap: var(--space-sm);
+    @apply px-4 py-3;
+  }
+
+  #playerModal .video-modal__moderation-bar .moderation-badge__label {
+    flex: 1 1 auto;
+  }
+
+  #playerModal .video-modal__moderation-bar .moderation-badge__actions {
+    flex-shrink: 0;
+  }
+
+  .card[data-owner-is-viewer="true"][data-url-health-state="offline"][data-stream-health-state="unhealthy"] {
+    @apply border border-critical border-opacity-40 bg-card-critical;
+  }
+
+  .video-visibility-toggle {
+    @apply inline-flex items-center gap-1 rounded-full border border-border bg-panel px-1 py-1;
+  }
+
+  .video-visibility-toggle__option {
+    @apply inline-flex items-center justify-center rounded-full border border-transparent bg-panel px-3 py-2 text-xs font-semibold uppercase text-muted transition duration-base ease-in-out;
+  }
+
+  .video-visibility-toggle__option:not(.is-disabled):hover {
+    @apply bg-panel-hover text-text;
+  }
+
+  .video-visibility-toggle__option[data-active="true"] {
+    @apply border border-accent border-opacity-60 text-text shadow-lg;
+  }
+
+  .video-visibility-toggle__option.is-disabled {
+    @apply cursor-not-allowed opacity-45;
+  }
+
+  .video-modal__container {
+    @apply flex h-full min-h-screen w-full flex-1 flex-col;
+  }
+
+  .player-modal__container {
+    @apply video-modal__container gap-6;
+  }
+
+  #playerModal {
+    --player-modal-vertical-padding: var(--space-md-plus);
+    --player-modal-primary-inline-padding-lg: clamp(
+      var(--space-sm),
+      2.75vw,
+      var(--space-lg)
+    );
+  }
+
+  #playerModal > .bv-modal__panel {
+    max-width: none;
+    width: 100%;
+    min-height: 100%;
+    padding: 0;
+    border-radius: 0;
+    box-shadow: none;
+    border: none;
+    background-color: var(--color-surface);
+    display: flex;
+    flex-direction: column;
+    align-items: stretch;
+    justify-content: flex-start;
+    flex: 1 1 auto;
+  }
+
+  .video-modal__panel {
+    position: relative;
+    z-index: var(--z-modal-content);
+    display: flex;
+    flex: 1 1 auto;
+    width: 100%;
+    min-height: 100%;
+    flex-direction: column;
+    overflow: visible;
+    padding: 0;
+    margin: 0;
+    border: none;
+    border-radius: 0;
+    background-color: var(--color-surface);
+    box-shadow: none;
+  }
+
+  #playerModal .watch-container {
+    width: 100%;
+    max-width: var(--player-modal-inline-max, var(--layout-player-max-width));
+    margin-inline: auto;
+    padding-inline: var(
+      --player-modal-inline-padding,
+      clamp(var(--space-md), 4vw, var(--space-xl-plus))
+    );
+    overflow: visible;
+  }
+
+  #playerModal .watch-container.video-modal__similar {
+    padding-inline: clamp(var(--space-3xs), 0.6vw, var(--space-2xs));
+  }
+
+  #playerModal .video-modal__primary > .watch-container:first-child {
+    padding-block-start: var(--player-modal-vertical-padding);
+  }
+
+  #playerModal .video-modal__primary > .watch-container:last-child {
+    padding-block-end: var(--player-modal-vertical-padding);
+  }
+
+  #playerModal .video-modal__secondary > .watch-container:last-child {
+    padding-block-end: var(--player-modal-vertical-padding);
+  }
+
+  #playerModal .modal-nav .watch-container {
+    max-width: none;
+    margin-inline: 0;
+  }
+
+  #playerModal .modal-info-panel {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-md-plus);
+  }
+
+  #playerModal h2#videoTitle {
+    margin: 0;
+    font-size: clamp(
+      var(--font-size-xl),
+      calc(var(--font-size-modal-title-base) + 0.5vw),
+      var(--font-size-xl-plus)
+    );
+    font-weight: 600;
+    line-height: 1.3;
+    color: var(--color-text);
+    min-width: 0;
+    overflow-wrap: break-word;
+    word-break: break-word;
+  }
+
+  @media (min-width: theme("screens.lg")) {
+    .video-modal__headline #videoTitle.video-modal__title {
+      flex: 1 1 0%;
+      min-width: 0;
+      max-width: calc(100% - var(--space-3xl) - var(--space-md));
+    }
+
+    .video-modal__headline .video-modal__status {
+      flex: 0 0 auto;
+      max-width: clamp(var(--space-xl), 25%, var(--space-3xl));
+      margin-left: auto;
+    }
+  }
+
+  #playerModal .modal-meta {
+    font-size: var(--font-size-sm);
+    line-height: 1.4;
+    color: var(--color-text-muted);
+  }
+
+  #playerModal .modal-view-count {
+    font-weight: 600;
+    color: var(--color-text);
+  }
+
+  #playerModal .channel-card {
+    display: flex;
+    align-items: center;
+    gap: var(--space-md);
+    padding: var(--space-md) var(--space-lg);
+    border-radius: var(--radius-xl);
+    border: var(--border-width-hairline) solid var(--color-border-translucent);
+    background-color: var(--color-surface);
+    box-shadow: var(--shadow-sm);
+  }
+
+  #playerModal .player-modal__module {
+    display: flex;
+    flex-direction: column;
+    gap: clamp(var(--space-2xs), 1vw, var(--space-sm));
+    width: 100%;
+    padding: clamp(var(--space-xs), 1vw, var(--space-sm));
+    border-radius: var(--radius-xl);
+    border: var(--border-width-hairline) solid var(--color-border-translucent);
+    background-color: var(--color-surface);
+    box-shadow: var(--shadow-sm);
+  }
+
+  #playerModal .player-modal__module-title {
+    margin: 0;
+    font-size: var(--font-size-lg);
+    font-weight: 600;
+    line-height: 1.3;
+    color: var(--color-text);
+  }
+
+  #playerModal .player-modal__module-list {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-sm);
+    width: 100%;
+    margin: 0;
+    padding: 0;
+    list-style: none;
+  }
+
+  #playerModal .video-modal__similar .player-modal__module {
+    gap: clamp(var(--space-3xs), 0.6vw, var(--space-xs));
+    padding: clamp(var(--space-2xs), 0.6vw, var(--space-xs));
+    border-width: 0;
+    box-shadow: none;
+    background-color: transparent;
+  }
+
+  #playerModal .video-modal__similar .player-modal__module-title {
+    padding-inline: clamp(var(--space-3xs), 0.6vw, var(--space-2xs));
+  }
+
+  #playerModal .video-modal__similar .player-modal__module-list {
+    gap: clamp(var(--space-3xs), 0.6vw, var(--space-xs));
+    padding-inline: clamp(var(--space-3xs), 0.6vw, var(--space-2xs));
+    padding-bottom: clamp(var(--space-3xs), 0.6vw, var(--space-2xs));
+  }
+
+  #playerModal .player-modal__module-scroll {
+    max-height: clamp(
+      var(--player-modal-module-scroll-min-height),
+      calc(
+        100vh - (var(--player-modal-vertical-padding) * 2) - var(--space-2xl)
+      ),
+      var(--player-modal-module-scroll-max-height)
+    );
+    overflow-y: auto;
+    overflow-x: hidden;
+    overscroll-behavior: contain;
+    scrollbar-gutter: stable;
+    padding-inline-end: var(--space-xs);
+  }
+
+  #playerModal .video-modal__similar .player-modal__module-scroll {
+    max-height: none;
+    overflow: visible;
+    padding-inline-end: 0;
+    scrollbar-gutter: auto;
+  }
+
+  #playerModal .player-modal__module-scroll > li {
+    scroll-margin-block: var(--space-xs);
+  }
+
+  @media (max-width: theme("screens.xs")) {
+    #playerModal .modal-nav .icon-button {
+      width: var(--space-xl);
+      height: var(--space-xl);
+      min-width: var(--space-xl);
+      min-height: var(--space-xl);
+    }
+
+    #playerModal .watch-container {
+      padding-inline: var(--space-sm);
+    }
+
+    #playerModal .channel-card {
+      gap: var(--space-sm);
+      padding: var(--space-sm) var(--space-md);
+    }
+  }
+
+  #playerModal .channel-card__avatar {
+    flex-shrink: 0;
+    width: var(--avatar-size-lg);
+    height: var(--avatar-size-lg);
+    border-radius: var(--radius-full);
+    overflow: hidden;
+    background-color: var(--color-border-subtle);
+  }
+
+  #playerModal .channel-card__avatar img {
+    display: block;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+
+  #playerModal .channel-card__name {
+    margin: 0;
+    font-size: var(--font-size-lg);
+    font-weight: 600;
+    color: var(--color-text);
+  }
+
+  #playerModal .channel-card__npub {
+    margin: 0;
+    font-size: var(--font-size-sm);
+    color: var(--color-text-muted);
+  }
+
+  #playerModal .description-panel {
+    padding: var(--space-md-plus) var(--space-lg);
+    border-radius: var(--radius-xl);
+    border: var(--border-width-hairline) solid var(--color-border-translucent);
+    background-color: var(--color-surface);
+    box-shadow: var(--shadow-sm);
+  }
+
+  #playerModal .description-panel p {
+    margin: 0;
+    font-size: var(--font-size-sm);
+    line-height: 1.6;
+    color: var(--color-text);
+  }
+
+  .player-modal__content {
+    @apply video-modal__panel;
+  }
+
+  #playerModal .modal-nav {
+    @apply sticky top-0 z-overlay-nav translate-y-0 transition-transform duration-150;
+    background-color: var(--surface-overlay-panel);
+    background-image: linear-gradient(
+      180deg,
+      color-mix(in srgb, var(--surface-overlay-panel) 94%, transparent) 0%,
+      color-mix(in srgb, var(--surface-overlay-panel) 88%, transparent) 100%
+    );
+    border-bottom: var(--border-width-hairline) solid var(--border-overlay);
+    backdrop-filter: blur(var(--modal-nav-backdrop-blur));
+    -webkit-backdrop-filter: blur(var(--modal-nav-backdrop-blur));
+  }
+
+  #playerModal .modal-nav__bar {
+    @apply flex w-full items-center justify-start gap-2;
+    padding-block: var(--space-xs);
+    padding-inline: clamp(var(--space-sm), 2.5vw, var(--space-lg));
+  }
+
+  #playerModal .modal-nav__rail {
+    @apply flex w-full items-center justify-between gap-2;
+  }
+
+  #playerModal .modal-nav__slot {
+    @apply flex items-center gap-2;
+  }
+
+  #playerModal .modal-nav__slot--context {
+    @apply justify-end;
+    margin-inline-start: auto;
+    min-inline-size: 0;
+  }
+
+  #playerModal .modal-nav__context {
+    @apply text-xs font-semibold uppercase tracking-wide text-muted;
+  }
+
+  #playerModal .modal-nav .modal-actions {
+    @apply flex items-center gap-2;
+    margin-left: 0;
+    align-self: stretch;
+  }
+
+  #playerModal .modal-nav .icon-button {
+    @apply inline-flex items-center justify-center rounded-full text-muted transition duration-150 ease-out;
+    inline-size: var(--icon-size-md);
+    block-size: var(--icon-size-md);
+    background: var(--surface-overlay-panel-tint);
+    border: var(--border-width-hairline) solid var(--border-overlay);
+    color: var(--color-text-muted);
+  }
+
+  #playerModal .modal-nav .icon-button:hover,
+  #playerModal .modal-nav .icon-button:focus-visible {
+    background: var(--surface-overlay-panel-soft);
+    border-color: var(--border-overlay-strong);
+    color: var(--color-text);
+  }
+
+  .modal-nav--hidden {
+    @apply -translate-y-full;
+  }
+
+  .modal-nav--visible {
+    @apply translate-y-0;
+  }
+
+  .video-modal__layout {
+    --video-modal-secondary-size: clamp(
+      var(--video-modal-secondary-min),
+      46vw,
+      var(--video-modal-secondary-max)
+    );
+    --video-modal-gap: clamp(var(--space-2xs), 0.85vw, var(--space-sm));
+    @apply grid;
+    gap: var(--video-modal-gap);
+    width: min(100%, var(--video-modal-layout-max));
+    margin-inline: auto;
+    grid-template-columns: minmax(0, 1fr);
+    grid-template-areas:
+      "primary"
+      "secondary";
+    align-items: start;
+  }
+
+  @media (min-width: theme("screens.lg")) {
+    .video-modal__layout {
+      --video-modal-secondary-size: clamp(
+        var(--video-modal-secondary-min),
+        30vw,
+        var(--video-modal-secondary-max)
+      );
+      grid-template-columns:
+        minmax(0, 1fr)
+        minmax(
+          var(--video-modal-secondary-min),
+          var(--video-modal-secondary-size)
+        );
+      grid-template-areas: "primary secondary";
+      align-items: stretch;
+      grid-auto-flow: column;
+    }
+
+    .video-modal__primary {
+      min-width: 0;
+      min-height: 0;
+      grid-area: primary;
+    }
+
+    .video-modal__secondary {
+      min-width: var(--video-modal-secondary-min);
+      min-height: 0;
+      max-width: var(--video-modal-secondary-size);
+      grid-area: secondary;
+      height: 100%;
+    }
+
+    #playerModal .video-modal__layout .watch-container {
+      max-width: none;
+      margin-inline: 0;
+      width: 100%;
+    }
+  }
+
+  @media (min-width: theme("screens.xl")) {
+    .video-modal__layout {
+      --video-modal-secondary-size: clamp(
+        var(--video-modal-secondary-min),
+        28vw,
+        var(--video-modal-secondary-max)
+      );
+    }
+  }
+
+  #playerModal .video-modal__layout {
+    display: grid;
+  }
+
+  @media (min-width: theme("screens.lg")) {
+    #playerModal .video-modal__layout {
+      grid-template-columns:
+        minmax(0, 1fr)
+        minmax(
+          var(--video-modal-secondary-min),
+          var(--video-modal-secondary-size)
+        );
+      grid-template-areas: "primary secondary";
+      align-items: stretch;
+      grid-auto-flow: column;
+    }
+
+    #playerModal .video-modal__primary {
+      grid-area: primary;
+    }
+
+    #playerModal .video-modal__secondary {
+      grid-area: secondary;
+    }
+  }
+
+  @media (min-width: theme("screens.lg")) {
+    #playerModal .video-modal__primary {
+      --player-modal-inline-padding: var(
+        --player-modal-primary-inline-padding-lg,
+        clamp(var(--space-sm), 2.75vw, var(--space-lg))
+      );
+    }
+
+    #playerModal .modal-nav__bar {
+      --player-modal-inline-padding: var(
+        --player-modal-primary-inline-padding-lg,
+        clamp(var(--space-sm), 2.75vw, var(--space-lg))
+      );
+    }
+  }
+
+  .revert-modal__layout {
+    @apply grid gap-6;
+  }
+
+  @media (min-width: theme("screens.lg")) {
+    .revert-modal__layout {
+      grid-template-columns:
+        minmax(
+          var(--revert-modal-sidebar-min),
+          var(--revert-modal-sidebar-width)
+        )
+        minmax(0, 1fr);
+    }
+  }
+
+  .video-modal__primary {
+    @apply flex flex-col gap-6;
+    min-width: 0;
+    min-height: 0;
+  }
+
+  .video-modal__secondary {
+    @apply flex flex-col gap-4;
+    min-width: 0;
+    min-height: 0;
+    width: 100%;
+    align-self: stretch;
+  }
+
+  .video-modal__similar {
+    display: none;
+  }
+
+  @media (min-width: theme("screens.lg")) {
+    .video-modal__similar {
+      @apply flex flex-col gap-6;
+      align-self: stretch;
+      flex: 1 1 auto;
+      min-height: 0;
+    }
+  }
+
+  @media (min-width: theme("screens.lg")) {
+    #playerModal .video-modal__similar .player-modal__module {
+      height: 100%;
+      display: flex;
+      flex: 1 1 auto;
+      min-height: 0;
+      flex-direction: column;
+    }
+
+    #playerModal .video-modal__similar .player-modal__module-list {
+      flex: 1 1 auto;
+      min-height: 0;
+    }
+
+    #playerModal .video-modal__similar .player-modal__module-scroll {
+      height: 100%;
+      max-height: none;
+      min-height: 0;
+    }
+  }
+
+  #playerModal .player-modal__module-item {
+    width: 100%;
+  }
+
+  #playerModal
+    .player-modal__module-item
+    > .card:not(.player-modal__similar-card) {
+    @apply flex w-full flex-row flex-nowrap items-stretch gap-md;
+  }
+
+  #playerModal
+    .player-modal__module-item
+    > .card:not(.player-modal__similar-card)
+    .video-card__media {
+    width: clamp(
+      var(--video-modal-item-media-min),
+      18vw,
+      var(--video-modal-item-media-max)
+    );
+    @apply shrink-0 overflow-hidden rounded-lg;
+  }
+
+  #playerModal
+    .player-modal__module-item
+    > .card:not(.player-modal__similar-card)
+    .video-card__content {
+    padding: clamp(var(--space-sm), 1.25vw, var(--space-md));
+    @apply flex min-w-0 flex-1 flex-col gap-sm;
+  }
+
+  #playerModal
+    .player-modal__module-item
+    > .card:not(.player-modal__similar-card)
+    .video-card__meta {
+    @apply flex flex-wrap items-center gap-2 text-xs text-muted-strong;
+  }
+
+  #playerModal .video-modal__similar .player-modal__module-list {
+    gap: clamp(var(--space-2xs), 0.85vw, var(--space-sm));
+  }
+
+  .player-modal__similar-card {
+    @apply focus-ring relative flex w-full min-w-0 items-start gap-3 rounded-xl p-2 transition duration-base ease-out;
+  }
+
+  .player-modal__similar-card:hover,
+  .player-modal__similar-card:focus-within {
+    background-color: var(--surface-panel-hover);
+  }
+
+  .player-modal__similar-card-media {
+    @apply relative block shrink-0 overflow-hidden rounded-lg bg-surface-alt;
+    width: var(--similar-card-media-width);
+    aspect-ratio: 16 / 9;
+    background-image: var(--similar-card-thumb-url, none);
+    background-position: center;
+    background-size: cover;
+  }
+
+  @media (max-width: theme("screens.sm")) {
+    .player-modal__similar-card-media {
+      width: var(--similar-card-media-width-sm);
+    }
+  }
+
+  .player-modal__similar-card-media img {
+    display: block;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    border-radius: inherit;
+  }
+
+  .player-modal__similar-card-content {
+    @apply flex min-w-0 flex-1 flex-col gap-1;
+  }
+
+  .player-modal__similar-card-title {
+    @apply text-sm font-semibold leading-snug text-text transition-colors duration-base ease-out;
+    min-width: 0;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+  }
+
+  .player-modal__similar-card:hover .player-modal__similar-card-title,
+  .player-modal__similar-card-title:focus-visible {
+    color: var(--color-accent-strong);
+  }
+
+  .player-modal__similar-card-author {
+    @apply flex min-w-0 items-center;
+  }
+
+  .player-modal__similar-card-author-meta {
+    @apply flex min-w-0 flex-col;
+  }
+
+  .player-modal__similar-card-author-name {
+    @apply truncate text-xs font-medium text-muted transition-colors duration-base ease-out;
+  }
+
+  .player-modal__similar-card:hover .player-modal__similar-card-author-name {
+    @apply text-text-strong;
+  }
+
+  /* Hidden for now to match cleaner modern look, but kept in DOM if needed */
+  .player-modal__similar-card-author-npub {
+    display: none;
+  }
+
+  .player-modal__similar-card-meta {
+    @apply flex flex-wrap items-center gap-1 text-2xs text-muted-strong;
+    min-width: 0;
+  }
+
+  .player-modal__similar-card-timestamp {
+    white-space: nowrap;
+  }
+
+  .player-modal__similar-card-separator {
+    @apply text-muted opacity-60;
+  }
+
+  .player-modal__similar-card-views {
+    white-space: nowrap;
+  }
+
+  .video-modal__stage {
+    position: relative;
+    isolation: isolate;
+    overflow: visible;
+    --video-modal-ambient-bleed: clamp(
+      var(--space-2xl),
+      12vw,
+      var(--space-5xl)
+    );
+    --video-modal-ambient-scale: 1.38;
+    --video-modal-ambient-blur: clamp(
+      var(--video-modal-ambient-blur-min),
+      20vw,
+      var(--video-modal-ambient-blur-max)
+    );
+    --video-modal-ambient-opacity: 1;
+  }
+
+  .video-modal__video {
+    position: relative;
+    z-index: 1;
+    border-radius: var(--radius-xl);
+    padding-block: clamp(var(--space-xs), 2.5vw, var(--space-md-plus));
+    background-color: transparent;
+    box-shadow: 0 0 0 var(--border-width-hairline)
+      color-mix(in srgb, var(--color-border-strong) 8%, transparent) inset;
+    overflow: visible;
+  }
+
+  .video-modal__ambient {
+    position: absolute;
+    inset: calc(var(--video-modal-ambient-bleed) * -1);
+    border-radius: calc(var(--radius-3xl) + var(--video-modal-ambient-bleed));
+    pointer-events: none;
+    z-index: 0;
+    display: block;
+    overflow: visible;
+  }
+
+  .video-modal__ambient::before {
+    content: "";
+    position: absolute;
+    inset: 0;
+    border-radius: inherit;
+    background: radial-gradient(
+      circle at 50% 50%,
+      color-mix(in srgb, var(--color-overlay-strong) 18%, transparent) 0%,
+      color-mix(in srgb, var(--color-overlay) 34%, transparent) 62%,
+      transparent 100%
+    );
+    opacity: 0.9;
+    mix-blend-mode: screen;
+    pointer-events: none;
+  }
+
+  .video-modal__ambient-canvas {
+    position: relative;
+    width: 100%;
+    height: 100%;
+    display: block;
+    transform: scale(var(--video-modal-ambient-scale));
+    filter: blur(var(--video-modal-ambient-blur)) saturate(2) brightness(1.24);
+    opacity: var(--video-modal-ambient-opacity);
+  }
+
+  @media (min-width: theme("screens.lg")) {
+    .video-modal__video {
+      position: sticky;
+      top: calc(var(--space-2xl) + var(--space-3xl));
+      z-index: 1;
+    }
+
+    .video-modal__status {
+      flex-basis: clamp(var(--space-xl), 25%, var(--space-3xl));
+      max-width: clamp(var(--space-xl), 25%, var(--space-3xl));
+    }
+
+    .video-modal__details {
+      position: relative;
+      z-index: 2;
+      margin-top: var(--space-lg);
+    }
+  }
+
+  #playerModal .video-modal__video video {
+    position: relative;
+    z-index: 1;
+    background-color: var(--color-black);
+    border-radius: var(--radius-lg);
+    box-shadow: var(--shadow-video-modal);
+    max-height: min(80vh, calc(100vw * 9 / 16));
+    object-fit: contain;
+  }
+
+  .video-modal__media {
+    display: block;
+    aspect-ratio: 16 / 9;
+    width: 100%;
+    object-fit: contain;
+  }
+
+  .video-modal__details {
+    @apply flex flex-col gap-6;
+  }
+
+  .video-modal__meta {
+    @apply border-b border-border border-opacity-20 pb-4;
+  }
+
+  /* Video modal tag strip */
+  .video-modal__tags {
+    @apply -mx-1 flex gap-2 px-1;
+  }
+
+  .video-modal__similar .video-modal__tags {
+    margin-bottom: clamp(var(--space-xs), 0.9vw, var(--space-md));
+  }
+
+  .video-modal__tags[hidden] {
+    display: none;
+  }
+
+  .video-modal__tags[data-fade] {
+    position: relative;
+  }
+
+  .video-modal__tags[data-fade]::before,
+  .video-modal__tags[data-fade]::after {
+    content: "";
+    position: sticky;
+    top: 0;
+    bottom: 0;
+    width: var(--space-lg);
+    pointer-events: none;
+    z-index: 1;
+  }
+
+  .video-modal__tags[data-fade]::before {
+    left: 0;
+    background: linear-gradient(
+      to right,
+      var(--surface-overlay-muted),
+      transparent
+    );
+  }
+
+  .video-modal__tags[data-fade]::after {
+    right: 0;
+    background: linear-gradient(
+      to left,
+      var(--surface-overlay-muted),
+      transparent
+    );
+  }
+
+  .video-tag-strip {
+    display: flex;
+    flex-wrap: nowrap;
+    align-items: center;
+    gap: var(--space-xs);
+    overflow: hidden;
+  }
+
+  .video-tag-pill {
+    @apply inline-flex items-center gap-2 rounded-full border border-status-neutral-border bg-status-neutral-surface px-3 py-1 text-2xs font-medium text-status-neutral-on;
+    @apply relative justify-center whitespace-nowrap transition;
+    @apply min-h-[calc(var(--space-sm)+var(--space-xs))];
+    @apply me-1;
+  }
+
+  .video-tag-pill__label {
+    @apply transition-opacity duration-150 ease-in-out;
+    opacity: 1;
+  }
+
+  .video-tag-pill__icon {
+    @apply absolute inset-0 flex items-center justify-center transition duration-150 ease-in-out;
+    opacity: 0;
+    transform: scale(0.8);
+  }
+
+  .video-tag-pill__icon svg {
+    @apply h-3 w-3;
+  }
+
+  .video-tag-pill:hover .video-tag-pill__label,
+  .video-tag-pill:focus-visible .video-tag-pill__label {
+    opacity: 0;
+  }
+
+  .video-tag-pill:hover .video-tag-pill__icon,
+  .video-tag-pill:focus-visible .video-tag-pill__icon {
+    opacity: 1;
+    transform: scale(1);
+  }
+
+  .video-modal__actions-row {
+    @apply flex w-full flex-wrap items-start gap-x-3 gap-y-3 sm:gap-x-4;
+  }
+
+  .video-modal__reactions,
+  .video-modal__actions-group {
+    flex: 1 1 var(--menu-min-width);
+    min-inline-size: 0;
+  }
+
+  .video-modal__reactions {
+    @apply flex basis-full flex-wrap items-start gap-3 sm:gap-4 md:basis-auto;
+  }
+
+  .video-modal__reaction-buttons {
+    @apply inline-flex flex-wrap items-center gap-2;
+  }
+
+  .video-modal__reaction-button {
+    --video-modal-reaction-active-bg: color-mix(
+      in srgb,
+      var(--color-accent) 22%,
+      var(--surface-overlay-panel)
+    );
+    --video-modal-reaction-active-border: color-mix(
+      in srgb,
+      var(--color-accent) 38%,
+      var(--border-overlay)
+    );
+  }
+
+  .video-modal__reaction-button[aria-pressed="true"] {
+    color: var(--color-accent-strong);
+    background-color: var(--video-modal-reaction-active-bg);
+    border-color: var(--video-modal-reaction-active-border);
+  }
+
+  .video-modal__reaction-button[aria-pressed="true"]
+    .video-modal__reaction-count {
+    color: var(--color-accent-strong);
+  }
+
+  .video-modal__reaction-count {
+    @apply text-sm font-semibold text-muted;
+  }
+
+  .video-modal__reaction-meter {
+    display: flex;
+    align-items: center;
+    gap: var(--space-sm);
+    flex-wrap: wrap;
+    flex: 1 1 var(--menu-min-width);
+    max-inline-size: 100%;
+  }
+
+  .video-modal__reaction-meter-label {
+    @apply text-sm font-medium text-muted;
+    min-inline-size: var(--video-modal-reaction-label-min-inline);
+  }
+
+  .video-modal__reaction-meter-track {
+    position: relative;
+    flex: 1 1 auto;
+    inline-size: 100%;
+    block-size: var(--space-xs);
+    border-radius: var(--radius-full);
+    background-color: var(--color-border-muted);
+    overflow: hidden;
+  }
+
+  .video-modal__reaction-meter-fill {
+    position: absolute;
+    inset-inline-start: 0;
+    inset-block-start: 0;
+    block-size: 100%;
+    max-inline-size: 100%;
+    inline-size: var(--video-modal-reaction-fill, 0%);
+    width: var(--video-modal-reaction-fill, 0%);
+    background-image: linear-gradient(
+      90deg,
+      var(--color-accent) 0%,
+      var(--color-accent-strong) 100%
+    );
+    transition: inline-size var(--motion-duration-base) var(--motion-ease-out);
+  }
+
+  .video-modal__reaction-meter-fill--empty {
+    inline-size: 0%;
+    width: 0%;
+  }
+
+  .video-modal__actions-group {
+    @apply flex basis-full flex-wrap items-start justify-start gap-3 md:basis-auto md:justify-end;
+  }
+
+  @media (min-width: theme("screens.md")) {
+    .video-modal__actions-group {
+      margin-inline-start: auto;
+    }
+  }
+
+  .video-modal__action-button {
+    @apply inline-flex h-11 items-center justify-center gap-2 rounded-full text-sm font-semibold transition duration-base ease-out;
+    min-width: var(--video-modal-action-min-width);
+    padding-inline: var(--space-md);
+    border-width: var(--border-width-hairline);
+    border-style: solid;
+  }
+
+  .video-modal__action-label {
+    @apply hidden sm:inline;
+  }
+
+  .video-modal__action-icon {
+    @apply h-5 w-5;
+  }
+
+  .video-modal__channel,
+  .video-modal__description,
+  .video-modal__stats {
+    @apply rounded-2xl border border-border border-opacity-20 bg-surface px-5 py-4 shadow-sm;
+  }
+
+  .video-modal__description-body {
+    overflow-wrap: anywhere;
+    word-break: break-word;
+  }
+
+  .video-modal__description-body a {
+    color: var(--color-accent-strong);
+    text-decoration: underline;
+    text-decoration-color: currentColor;
+    word-break: break-word;
+  }
+
+  .video-modal__description-body a:hover,
+  .video-modal__description-body a:focus-visible {
+    color: var(--color-accent-pressed);
+  }
+
+  .video-modal__comments {
+    @apply rounded-2xl border border-border border-opacity-20 bg-surface px-5 py-5 shadow-sm;
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-lg);
+  }
+
+  .comment-thread {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-lg);
+  }
+
+  .comment-thread__header {
+    display: flex;
+    align-items: flex-start;
+    justify-content: space-between;
+    gap: var(--space-sm);
+  }
+
+  .comment-thread__title {
+    @apply text-lg font-semibold text-text;
+  }
+
+  .comment-thread__count {
+    @apply text-sm text-muted;
+    margin: 0;
+  }
+
+  .comment-thread__empty {
+    @apply text-sm text-muted;
+    margin: 0;
+    padding: var(--space-md);
+    border-radius: var(--radius-lg);
+    border: var(--border-width-hairline) dashed
+      color-mix(in srgb, var(--border-default) 40%, transparent);
+    background-color: var(--surface-alt);
+  }
+
+  .comment-thread__list {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-md);
+    margin: 0;
+    padding: 0;
+    list-style: none;
+  }
+
+  .comment-thread__item {
+    display: grid;
+    grid-template-columns: auto 1fr;
+    gap: var(--space-md);
+    padding-block: var(--space-sm);
+    border-bottom: var(--border-width-hairline) solid var(--border-subtle);
+  }
+
+  .comment-thread__item:last-child {
+    border-bottom: none;
+    padding-bottom: 0;
+  }
+
+  .comment-thread__avatar {
+    inline-size: var(--comment-avatar-size);
+    block-size: var(--comment-avatar-size);
+  }
+
+  .comment-thread__avatar img {
+    @apply rounded-full object-cover;
+    inline-size: 100%;
+    block-size: 100%;
+  }
+
+  .comment-thread__content {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-xs);
+    min-inline-size: 0;
+  }
+
+  .comment-thread__meta {
+    @apply text-xs text-muted;
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: var(--space-xs);
+  }
+
+  .comment-thread__author {
+    font-weight: 600;
+    color: var(--text-primary);
+  }
+
+  .comment-thread__timestamp {
+    color: var(--text-muted);
+  }
+
+  .comment-thread__body {
+    color: var(--text-primary);
+    line-height: 1.6;
+    word-break: break-word;
+  }
+
+  .comment-thread__actions {
+    @apply text-xs;
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: var(--space-sm);
+  }
+
+  .comment-thread__actions button {
+    @apply focus-ring inline-flex items-center gap-1 rounded-full border border-border-subtle bg-surface px-3 py-1 text-xs font-semibold text-muted transition duration-base ease-out;
+  }
+
+  .comment-thread__actions button:hover,
+  .comment-thread__actions button:focus-visible {
+    color: var(--text-primary);
+    border-color: var(--border-default);
+  }
+
+  .comment-thread__replies {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-md);
+    margin: 0;
+    margin-inline-start: calc(var(--space-lg) + var(--space-sm));
+    padding-inline-start: var(--space-md);
+    padding-block-start: var(--space-md);
+    border-inline-start: var(--border-width-hairline) solid var(--border-subtle);
+    list-style: none;
+  }
+
+  .comment-thread__load-more {
+    @apply inline-flex items-center justify-center gap-2 rounded-full border border-border-subtle bg-surface px-4 py-2 text-sm font-semibold text-text transition duration-base ease-out;
+  }
+
+  .comment-thread__load-more:hover,
+  .comment-thread__load-more:focus-visible {
+    border-color: var(--border-default);
+    color: var(--text-primary);
+    background-color: color-mix(in srgb, var(--surface-alt) 70%, transparent);
+  }
+
+  .comment-thread__disabled {
+    @apply text-sm text-muted;
+    border-radius: var(--radius-lg);
+    border: var(--border-width-hairline) dashed
+      color-mix(in srgb, var(--border-default) 32%, transparent);
+    background-color: var(--surface-alt);
+    padding: var(--space-md);
+  }
+
+  .comment-composer {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-md);
+    border-top: var(--border-width-hairline) solid var(--border-subtle);
+    padding-top: var(--space-lg);
+  }
+
+  .comment-composer__field {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-2xs);
+  }
+
+  .comment-composer__label {
+    @apply text-sm font-semibold text-text;
+  }
+
+  .comment-composer__textarea {
+    min-block-size: var(--comment-composer-min-height);
+  }
+
+  .comment-composer__footer {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-sm);
+  }
+
+  .comment-composer__hint {
+    @apply text-xs text-muted;
+    margin: 0;
+  }
+
+  .comment-composer__actions {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    justify-content: flex-end;
+    gap: var(--space-sm);
+  }
+
+  .comment-composer__char-count {
+    @apply text-xs font-medium text-muted;
+  }
+
+  .comment-composer__submit {
+    @apply focus-ring;
+  }
+
+  .comment-composer__status {
+    margin: 0;
+  }
+
+  @media (min-width: theme("screens.sm")) {
+    .comment-composer__footer {
+      flex-direction: row;
+      align-items: center;
+      justify-content: space-between;
+    }
+  }
+
+  .video-modal__progress {
+    @apply h-2 w-full overflow-hidden rounded-full bg-border-subtle;
+  }
+
+  .video-modal__stat-metrics {
+    @apply flex flex-wrap items-center justify-between gap-3 text-sm text-muted;
+  }
+
+  .profile-modal {
+    display: flex;
+    flex-direction: column;
+    inline-size: 100%;
+    block-size: 100%;
+    min-block-size: 100%;
+    max-block-size: none;
+    overflow: hidden;
+    --modal-sheet-inline-max: var(--profile-modal-inline-max);
+    --profile-modal-scale: 0.9;
+    --profile-modal-gap: calc(
+      (var(--space-md) - var(--space-3xs)) * var(--profile-modal-scale)
+    );
+    --profile-modal-padding-inline: calc(
+      (var(--space-lg) - var(--space-md)) * var(--profile-modal-scale)
+    );
+    --profile-modal-padding-block-start: calc(
+      (var(--space-md) - var(--space-2xs)) * var(--profile-modal-scale)
+    );
+    --profile-modal-padding-block-end: calc(
+      (var(--space-lg) - var(--space-sm)) * var(--profile-modal-scale)
+    );
+    --profile-modal-nav-gap: calc(var(--space-xs) * var(--profile-modal-scale));
+  }
+
+  .profile-modal__content {
+    display: flex;
+    flex: 1 1 auto;
+    flex-direction: column;
+    block-size: 100%;
+    min-block-size: 0;
+    transform: scale(var(--profile-modal-scale));
+    transform-origin: top center;
+  }
+
+  .profile-modal__active-profile {
+    @apply focus-ring flex flex-wrap items-center gap-4 p-4;
+  }
+
+  .profile-modal__active-details {
+    display: flex;
+    flex: 1 1 var(--profile-modal-active-min-width);
+    flex-direction: column;
+    gap: var(--space-2xs);
+    min-inline-size: 0;
+  }
+
+  .profile-modal__active-meta {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: var(--space-xs);
+  }
+
+  .profile-modal__channel-link {
+    margin-inline-start: auto;
+    align-self: center;
+    white-space: nowrap;
+  }
+
+  .profile-hashtag-list {
+    display: flex;
+    flex-wrap: wrap;
+    gap: var(--space-xs);
+    margin: 0;
+    padding: 0;
+    list-style: none;
+  }
+
+  .profile-hashtag-item {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--space-3xs);
+    padding-block: var(--space-3xs);
+    padding-inline: var(--space-sm);
+    border-radius: var(--radius-full);
+    border: var(--border-width-hairline) solid var(--color-border-translucent);
+    background-color: var(--color-panel);
+    color: var(--color-text);
+    font-size: var(--font-size-sm);
+    font-weight: var(--font-weight-medium);
+    line-height: var(--font-lineheight-tight);
+  }
+
+  .profile-hashtag-remove {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    inline-size: var(--space-md);
+    block-size: var(--space-md);
+    border-radius: var(--radius-full);
+    color: var(--color-text-muted);
+    background: transparent;
+    border: none;
+    padding: 0;
+    cursor: pointer;
+  }
+
+  .profile-hashtag-remove:hover {
+    color: var(--color-text);
+  }
+
+  .profile-modal__remove-button {
+    @apply border-2;
+  }
+
+  .profile-modal__remove-button:focus-visible {
+    --tw-ring-color: var(--color-critical-strong);
+  }
+
+  .profile-modal__add-profile {
+    --tw-ring-color: var(--color-ring-alert);
+    @apply focus-ring relative flex w-full items-center justify-start gap-4 rounded-xl px-5 py-4 text-left text-text transition duration-base ease-in-out;
+    border: var(--outline-thick-width) solid var(--color-ring-alert);
+    background-color: var(--surface-panel-hover);
+  }
+
+  .profile-modal__add-profile:hover {
+    background-color: color-mix(
+      in srgb,
+      var(--surface-panel-hover) 88%,
+      var(--color-ring-alert) 12%
+    );
+  }
+
+  .profile-modal__add-profile:focus-visible {
+    background-color: color-mix(
+      in srgb,
+      var(--surface-panel-hover) 80%,
+      var(--color-ring-alert) 20%
+    );
+  }
+
+  .profile-modal__add-profile-icon {
+    @apply flex h-10 w-10 items-center justify-center rounded-full;
+    background-color: color-mix(
+      in srgb,
+      var(--color-ring-alert) 18%,
+      var(--surface-panel)
+    );
+    color: var(--color-ring-alert);
+  }
+
+  .profile-modal__body {
+    display: flex;
+    flex: 1 1 auto;
+    flex-direction: column;
+    gap: var(--profile-modal-gap);
+    inline-size: 100%;
+    min-block-size: 0;
+    overflow: hidden;
+    overflow-x: hidden;
+    padding-block-start: var(--profile-modal-padding-block-start);
+    padding-block-end: var(--profile-modal-padding-block-end);
+    padding-inline: var(--profile-modal-padding-inline);
+  }
+
+  .profile-modal__layout {
+    display: flex;
+    flex: 1 1 auto;
+    flex-direction: column;
+    gap: var(--profile-modal-gap);
+    inline-size: 100%;
+    min-block-size: 0;
+  }
+
+  .profile-modal__header {
+    align-items: center;
+  }
+
+  .profile-modal__header-title {
+    display: flex;
+    align-items: center;
+    gap: var(--space-sm);
+  }
+
+  .profile-modal__menu {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-sm);
+  }
+
+  .profile-modal__pane-wrapper {
+    display: flex;
+    flex: 1 1 auto;
+    flex-direction: column;
+    min-block-size: 0;
+  }
+
+  .profile-modal__nav {
+    display: flex;
+    flex-wrap: wrap;
+    gap: var(--profile-modal-nav-gap);
+    align-self: flex-start;
+    overflow-x: hidden;
+  }
+
+  .profile-nav__unread-dot {
+    position: absolute;
+    top: var(--space-3xs);
+    right: var(--space-3xs);
+    width: var(--space-sm);
+    height: var(--space-sm);
+    border-radius: var(--radius-full);
+    border: var(--border-width-hairline) solid var(--surface-panel);
+    background-color: var(--status-danger);
+    display: none;
+    pointer-events: none;
+  }
+
+  .profile-nav__unread-dot.is-visible {
+    display: block;
+  }
+
+  .profile-modal__panes {
+    display: flex;
+    flex: 1 1 auto;
+    flex-direction: column;
+    block-size: 100%;
+    min-block-size: 0;
+    overflow-y: auto;
+    overflow-x: hidden;
+    padding-inline-end: var(--profile-modal-scrollbar-offset);
+    scrollbar-gutter: stable;
+  }
+
+  .profile-pane {
+    display: flex;
+    flex-direction: column;
+    min-block-size: auto;
+    overflow-x: hidden;
+  }
+
+  .profile-pane.hidden {
+    display: none !important;
+  }
+
+  @supports not (scrollbar-gutter: stable) {
+    .profile-modal__panes {
+      padding-inline-end: calc(
+        var(--profile-modal-scrollbar-offset) + var(--space-2xs)
+      );
+    }
+  }
+
+  @media (max-width: calc(theme("screens.lg") - var(--breakpoint-edge-offset))) {
+    .profile-modal__layout[data-mobile-view="menu"]
+      .profile-modal__pane-wrapper {
+      display: none;
+    }
+
+    .profile-modal__layout[data-mobile-view="pane"] .profile-modal__menu {
+      display: none;
+    }
+  }
+
+  @media (min-width: theme("screens.lg")) {
+    .profile-modal {
+      max-block-size: var(--modal-shell-max-height);
+    }
+
+    .profile-modal__body {
+      gap: calc(var(--profile-modal-gap) + var(--space-2xs));
+      padding-inline: calc(
+        var(--profile-modal-padding-inline) + var(--space-xs)
+      );
+    }
+
+    .profile-modal__layout {
+      display: grid;
+      align-items: stretch;
+      block-size: 100%;
+      gap: calc(var(--profile-modal-gap) + var(--space-2xs));
+      grid-template-columns:
+        minmax(
+          var(--profile-modal-nav-min-width),
+          var(--profile-modal-nav-max-width)
+        )
+        minmax(0, 1fr);
+      grid-auto-rows: minmax(0, 1fr);
+    }
+
+    .profile-modal__nav {
+      flex-direction: column;
+      flex-wrap: nowrap;
+      gap: var(--profile-modal-nav-gap);
+      justify-self: start;
+      inline-size: var(--profile-modal-nav-max-width);
+      min-inline-size: var(--profile-modal-nav-min-width);
+    }
+
+    .profile-modal__pane-wrapper {
+      block-size: 100%;
+    }
+  }
+
+  /* Torrent helper classes */
+  .beacon-hidden-download,
+  [data-beacon-hidden-download],
+  .torrent-download-anchor {
+    display: none !important;
+  }
+
+  .beacon-clipboard-offscreen,
+  [data-beacon-clipboard-state="offscreen"],
+  [data-beacon-clipboard="offscreen"],
+  .torrent-clipboard-textarea {
+    position: fixed;
+    top: 0;
+    left: var(--offscreen-offset);
+    opacity: 0;
+    width: 0;
+    height: 0;
+    pointer-events: none;
+  }
+
+  .beacon-toast-motion,
+  .torrent-toast-motion {
+    transition-property: opacity, transform;
+    will-change: opacity, transform;
+    opacity: 0;
+    transform: translateY(var(--toast-translate));
+  }
+
+  .beacon-toast-motion[data-beacon-motion="enter"],
+  .beacon-toast-motion[data-beacon-motion="show"],
+  .torrent-toast-motion[data-beacon-motion="enter"],
+  .torrent-toast-motion[data-beacon-motion="show"] {
+    opacity: 1;
+    transform: translateY(0);
+  }
+
+  .beacon-toast-motion[data-beacon-motion="exit"],
+  .torrent-toast-motion[data-beacon-motion="exit"] {
+    opacity: 0;
+    transform: translateY(var(--toast-translate));
+  }
+
+  .torrent-toast {
+    @apply pointer-events-auto w-full max-w-md rounded-lg px-4 py-3 text-sm font-medium tracking-tight shadow-lg ring-1 ring-inset;
+  }
+
+  .torrent-toast--info {
+    @apply border border-border-translucent bg-surface text-text;
+  }
+
+  .torrent-toast--success {
+    @apply border border-info border-opacity-60 bg-info text-white;
+  }
+
+  .torrent-toast--error {
+    @apply border border-critical border-opacity-60 bg-critical text-white;
+  }
+
+  .torrent-toast--warn {
+    @apply border border-warning-strong border-opacity-70 bg-warning-strong text-warning-strong;
+  }
+
+  .profile-switcher {
+    @apply card flex flex-col gap-lg;
+  }
+
+  .profile-switcher__badge {
+    @apply badge self-start;
+  }
+
+  .profile-switcher__header {
+    @apply flex flex-col gap-sm sm:flex-row sm:items-center sm:justify-between;
+  }
+
+  .profile-switcher__intro {
+    @apply flex flex-col gap-2xs;
+  }
+
+  .profile-switcher__title {
+    @apply text-base font-semibold text-text;
+  }
+
+  .profile-switcher__subtitle {
+    @apply text-sm text-muted;
+  }
+
+  .profile-switcher__list {
+    @apply flex flex-col gap-md;
+  }
+
+  .profile-switcher__helper {
+    @apply text-xs text-muted;
+  }
+
+  .profile-card {
+    @apply card relative flex cursor-pointer flex-col gap-md p-4 text-text transition duration-base ease-out hover:shadow-lg focus-visible:border-accent focus-visible:border-opacity-60 focus-visible:shadow-lg sm:flex-row sm:items-center;
+  }
+
+  .profile-card--active {
+    @apply border-accent border-opacity-60 shadow-lg;
+  }
+
+  .profile-card__avatar {
+    @apply flex h-12 w-12 flex-none items-center justify-center overflow-hidden rounded-full border border-border border-opacity-30 bg-surface;
+  }
+
+  .profile-card__avatar img {
+    @apply h-full w-full rounded-full object-cover;
+  }
+
+  .profile-card--active .profile-card__avatar {
+    @apply border-accent border-opacity-70 ring-2;
+    --tw-ring-color: color-mix(in srgb, var(--color-accent) 32%, transparent);
+    --tw-ring-opacity: 1;
+  }
+
+  .profile-card__meta {
+    @apply flex min-w-0 flex-1 flex-col gap-sm;
+  }
+
+  .profile-card__topline {
+    @apply flex w-full flex-wrap items-center gap-sm sm:justify-between;
+  }
+
+  .profile-card__label {
+    @apply text-xs font-semibold uppercase tracking-wide text-accent;
+  }
+
+  .profile-card__name {
+    @apply truncate text-sm font-semibold text-text;
+  }
+
+  .profile-card__npub {
+    @apply break-all font-mono text-xs text-muted;
+  }
+
+  .profile-card__action,
+  .profile-nav-button {
+    @apply btn-ghost ml-auto flex-shrink-0 px-3 py-1 text-xs;
+  }
+
+  .profile-switcher__add {
+    --profile-switcher-add-hover-bg: color-mix(
+      in srgb,
+      var(--color-accent) 14%,
+      transparent
+    );
+
+    @apply card flex cursor-pointer items-center gap-4 border border-dashed border-border border-opacity-40 bg-surface text-left text-muted transition duration-base ease-out hover:border-accent hover:border-opacity-60 hover:text-text focus-visible:border-accent focus-visible:border-opacity-60;
+  }
+
+  .profile-switcher__add:hover,
+  .profile-switcher__add:focus-visible {
+    background-color: var(--profile-switcher-add-hover-bg);
+  }
+
+  .profile-switcher__addAvatar {
+    @apply flex h-12 w-12 flex-none items-center justify-center rounded-full border border-dashed border-current bg-surface;
+  }
+
+  .profile-switcher__addAvatar svg {
+    @apply h-5 w-5;
+  }
+
+  .profile-switcher__addCopy {
+    @apply flex flex-col gap-1 text-left;
+  }
+
+  .profile-switcher__addTitle {
+    @apply text-sm font-semibold text-inherit;
+  }
+
+  .profile-switcher__addHint {
+    @apply text-xs text-muted;
+  }
+
+  .watch-history-grid {
+    @apply flex w-full flex-col gap-5 py-6 sm:gap-6;
+  }
+
+  .watch-history-grid.watch-history-grid--modal {
+    @apply gap-5 py-0 sm:gap-6;
+  }
+
+  .watch-history-card {
+    @apply card flex flex-wrap items-stretch gap-5 p-4 transition duration-base ease-out hover:-translate-y-0.5 hover:shadow-lg sm:gap-6 sm:p-5;
+  }
+
+  .watch-history-card--private {
+    @apply border-info border-opacity-60;
+  }
+
+  .watch-history-card__primary {
+    @apply flex min-w-0 flex-1 flex-col items-stretch gap-4 sm:flex-row;
+  }
+
+  .watch-history-card__thumbnail {
+    @apply block w-56 max-w-full flex-none text-text no-underline;
+  }
+
+  .watch-history-card__thumbnailInner {
+    @apply aspect-video w-full overflow-hidden rounded-lg bg-surface;
+  }
+
+  .watch-history-card__thumbnailInner img {
+    @apply h-full w-full object-cover;
+  }
+
+  .watch-history-card [data-thumbnail-state="blurred"] img,
+  .watch-history-card [data-visual-state="blurred"] img {
+    @apply transition duration-base ease-in-out;
+    filter: blur(var(--blur-thumbnail-blur));
+    transform: scale(1.05);
+  }
+
+  .watch-history-card__details {
+    @apply flex min-w-0 flex-1 flex-col justify-center gap-sm;
+  }
+
+  .watch-history-card__title {
+    @apply cursor-pointer text-lg font-semibold leading-snug text-text transition duration-base ease-out;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+  }
+
+  .watch-history-card__title:hover,
+  .watch-history-card__title:focus {
+    @apply text-accent;
+  }
+
+  .watch-history-card__created {
+    @apply text-sm text-muted;
+  }
+
+  .watch-history-card__meta {
+    @apply flex min-w-0 flex-col justify-between gap-4 sm:min-w-56 sm:flex-none sm:basis-64;
+  }
+
+  .watch-history-card__watched {
+    @apply text-sm text-border-subtle;
+  }
+
+  .watch-history-card__creator {
+    @apply flex items-center gap-3;
+  }
+
+  .watch-history-card__creatorAvatar {
+    @apply flex h-10 w-10 items-center justify-center overflow-hidden rounded-full bg-panel transition duration-base ease-out hover:ring-2 hover:ring-opacity-50 focus-visible:ring-2 focus-visible:ring-opacity-50;
+  }
+
+  .watch-history-card__creatorAvatar:hover,
+  .watch-history-card__creatorAvatar:focus-visible {
+    --tw-ring-color: color-mix(in srgb, var(--color-accent) 38%, transparent);
+  }
+
+  .watch-history-card__creatorAvatar img {
+    @apply h-full w-full rounded-full object-cover;
+  }
+
+  .watch-history-card__creatorName {
+    @apply cursor-pointer bg-transparent p-0 text-left text-base font-medium text-muted transition duration-base ease-out hover:text-accent focus-visible:text-accent;
+  }
+
+  .watch-history-card__actions {
+    @apply flex flex-wrap items-center gap-3;
+  }
+
+  .watch-history-card__action {
+    @apply inline-flex items-center justify-center gap-2 rounded-full border border-transparent bg-panel px-4 py-2 text-sm font-medium text-muted transition duration-base ease-out hover:border-border hover:bg-surface-alt hover:text-text focus-visible:border-border focus-visible:bg-surface-alt focus-visible:text-text;
+  }
+
+  .watch-history-card__action--primary {
+    @apply bg-accent-strong text-white hover:bg-accent-pressed focus-visible:bg-accent-pressed;
+  }
+
+  .watch-history-card__action--danger {
+    @apply bg-critical text-white hover:bg-critical-strong focus-visible:bg-critical-strong;
+  }
+
+  .watch-history-card__moderation {
+    @apply mt-sm flex flex-wrap items-center gap-sm;
+  }
+
+  .watch-history-card__hidden {
+    @apply mt-md rounded-lg border border-dashed border-border bg-overlay-panel-soft text-sm text-text;
+  }
+
+  .watch-history-card__hidden .moderation-badge {
+    @apply self-start;
+  }
+
+  /* Ensure the video modal avatar respects the blur state */
+  #playerModal .channel-card__avatar img[data-visual-state="blurred"] {
+    @apply transition duration-base ease-in-out;
+    filter: blur(var(--blur-thumbnail-blur));
+    transform: scale(1.05);
+  }
+
+  /* Override moderation badge text color inside the modal bar for better contrast in all themes */
+  #playerModal .video-modal__moderation-bar .moderation-badge {
+    --text-status-neutral-on: var(--color-text);
+    --text-status-warning-on: var(--color-warning-on);
+  }
+
+  #playerModal
+    .video-modal__moderation-bar
+    .moderation-badge[data-variant="neutral"] {
+    color: var(--color-text);
+  }
+}
+
+@layer components {
+  .container {
+    max-width: var(--layout-docs-max-width);
+    margin: 0 auto;
+    padding: var(--space-md);
+  }
+
+  .docs-popover-scenarios__scroll-spacer {
+    height: var(--docs-popover-scroll-height);
+  }
+
+  .qr-code__table {
+    border: 0;
+    border-collapse: collapse;
+    margin: var(--qr-code-table-margin, 0);
+  }
+
+  .qr-code__cell {
+    border: 0;
+    border-collapse: collapse;
+    padding: 0;
+    margin: 0;
+    width: var(--qr-code-cell-width);
+    height: var(--qr-code-cell-height);
+    background-color: var(--qr-code-color-light);
+  }
+
+  .qr-code__cell--dark {
+    background-color: var(--qr-code-color-dark);
+  }
+
+  .qr-code__container[data-qr-code-mode="image"] .qr-code__canvas {
+    display: none;
+  }
+
+  .qr-code__container[data-qr-code-mode="image"] .qr-code__image {
+    display: block;
+  }
+
+  .qr-code__container[data-qr-code-mode="canvas"] .qr-code__canvas {
+    display: block;
+  }
+
+  .qr-code__container[data-qr-code-mode="canvas"] .qr-code__image {
+    display: none;
+  }
+
+  .fade-in {
+    opacity: 0;
+    animation: interface-fade-in 280ms ease-out forwards;
+    animation-delay: var(--fade-in-delay, 0ms);
+  }
+
+  .fade-in-delay-100 {
+    --fade-in-delay: 100ms;
+  }
+
+  .fade-in-delay-200 {
+    --fade-in-delay: 200ms;
+  }
+
+  .fade-in-delay-300 {
+    --fade-in-delay: 300ms;
+  }
+
+  .fade-in-delay-400 {
+    --fade-in-delay: 400ms;
+  }
+
+  .card[data-motion="enter"] {
+    opacity: 0;
+    animation: card-motion-enter 220ms ease-out forwards;
+  }
+
+  .icon-button {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: var(--icon-size-lg);
+    height: var(--icon-size-lg);
+    min-width: var(--icon-size-lg);
+    min-height: var(--icon-size-lg);
+    flex: 0 0 var(--icon-size-lg);
+    line-height: 0;
+    background-color: var(--color-neutral-700);
+    color: var(--color-white);
+    border: none;
+    border-radius: var(--radius-full);
+    cursor: pointer;
+    transition:
+      background-color 200ms ease,
+      box-shadow 200ms ease;
+  }
+
+  .icon-button:hover {
+    background-color: var(--color-neutral-600);
+  }
+
+  .icon-button:focus,
+  .icon-button:active {
+    outline: none;
+    box-shadow: 0 0 0 var(--icon-button-ring-width) var(--color-ring-alert);
+  }
+
+  .icon-image {
+    width: var(--icon-size-md);
+    height: var(--icon-size-md);
+    pointer-events: none;
+  }
+
+  .accent-action-button,
+  .channel-action-button {
+    --accent-action-bg: color-mix(
+      in srgb,
+      var(--surface-overlay-panel) 78%,
+      transparent
+    );
+    --accent-action-border: color-mix(
+      in srgb,
+      var(--border-overlay) 92%,
+      transparent
+    );
+    --accent-action-bg-hover: color-mix(
+      in srgb,
+      var(--color-accent) 22%,
+      var(--surface-overlay-panel)
+    );
+    --accent-action-ring: color-mix(
+      in srgb,
+      var(--color-accent) 48%,
+      transparent
+    );
+    --accent-action-bg-active: color-mix(
+      in srgb,
+      var(--color-accent-pressed) 28%,
+      var(--surface-overlay-panel)
+    );
+
+    color: var(--color-text);
+    background-color: var(--accent-action-bg);
+    border-color: var(--accent-action-border);
+    border-style: solid;
+    border-width: var(--border-width-hairline);
+  }
+
+  .accent-action-button:hover,
+  .accent-action-button:focus-visible,
+  .channel-action-button:hover,
+  .channel-action-button:focus-visible {
+    color: var(--color-accent-strong);
+    background-color: var(--accent-action-bg-hover);
+  }
+
+  .accent-action-button:focus,
+  .accent-action-button:focus-visible,
+  .channel-action-button:focus,
+  .channel-action-button:focus-visible {
+    box-shadow: 0 0 0 var(--icon-button-ring-width) var(--accent-action-ring);
+  }
+
+  .accent-action-button:active,
+  .channel-action-button:active {
+    color: var(--color-accent-pressed);
+    background-color: var(--accent-action-bg-active);
+  }
+
+  .modal-nav .icon-button {
+    box-shadow: none;
+    padding: 0;
+    gap: 0;
+    width: var(--icon-size-lg);
+    height: var(--icon-size-lg);
+    min-width: var(--icon-size-lg);
+    min-height: var(--icon-size-lg);
+  }
+
+  .modal-nav
+    .icon-button:not(.accent-action-button):not(.channel-action-button) {
+    border: none;
+  }
+
+  .modal-meta {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--space-xs);
+  }
+
+  .modal-view-count {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--space-2xs);
+    font-size: var(--font-size-sm);
+    line-height: var(--space-md-plus);
+    color: var(--color-muted-alt);
+    white-space: nowrap;
+  }
+
+  .view-count-text {
+    white-space: nowrap;
+    color: var(--color-muted-strong);
+  }
+
+  .progress-bar {
+    width: 100%;
+    height: var(--modal-progress-height);
+    border-radius: var(--radius-full);
+    background-color: var(--color-border-translucent);
+    overflow: hidden;
+  }
+
+  .progress-bar-fill {
+    width: 0;
+    height: 100%;
+    border-radius: inherit;
+    background: linear-gradient(
+      90deg,
+      var(--color-info-strong),
+      var(--color-info)
+    );
+    transition: width 240ms ease;
+  }
+
+  .ratio-16-9 {
+    position: relative;
+    width: 100%;
+    padding-top: 56.25%;
+    background-color: var(--color-card);
+  }
+
+  .ratio-16-9 > img {
+    position: absolute;
+    inset: 0;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+
+  #modalContainer {
+    position: fixed;
+    inset: 0;
+    z-index: var(--z-modal-root);
+    pointer-events: none;
+    isolation: isolate;
+  }
+
+  #modalContainer > * {
+    pointer-events: auto;
+  }
+
+  #modalContainer > [id$="Modal"]:not(#playerModal) {
+    z-index: var(--z-modal-root);
+  }
+
+  #modalContainer > [id$="Modal"]:not(#playerModal) > .bv-modal-backdrop {
+    z-index: var(--z-modal-overlay);
+  }
+
+  #modalContainer > [id$="Modal"]:not(#playerModal) .bv-modal__panel {
+    z-index: var(--z-modal-content);
+  }
+
+  #modalContainer > #profileModal,
+  #profileModal[data-modal-stack="top"] {
+    z-index: var(--z-modal-top-root);
+  }
+
+  #modalContainer > #profileModal > .bv-modal-backdrop,
+  #profileModal[data-modal-stack="top"] > .bv-modal-backdrop {
+    z-index: var(--z-modal-top-overlay);
+  }
+
+  #modalContainer > #profileModal .bv-modal__panel,
+  #profileModal[data-modal-stack="top"] .bv-modal__panel {
+    z-index: var(--z-modal-top-content);
+  }
+
+  #modalContainer > #eventDetailsModal {
+    z-index: var(--z-modal-top-root);
+  }
+
+  #modalContainer > #eventDetailsModal > .bv-modal-backdrop {
+    z-index: var(--z-modal-top-overlay);
+  }
+
+  #modalContainer > #eventDetailsModal .bv-modal__panel {
+    z-index: var(--z-modal-top-content);
+  }
+
+  .bv-modal[data-nested-modal-active="true"] {
+    pointer-events: none;
+    visibility: hidden;
+  }
+
+  #modalContainer > #loginModal {
+    z-index: var(--z-modal-peak-root);
+  }
+
+  #modalContainer > #loginModal > .bv-modal-backdrop {
+    z-index: var(--z-modal-peak-overlay);
+  }
+
+  #modalContainer > #loginModal .bv-modal__panel {
+    z-index: var(--z-modal-peak-content);
+  }
+
+  #modalContainer > #playerModal {
+    z-index: var(--z-modal-player);
+  }
+
+  #modalContainer > #playerModal .player-modal__container,
+  #modalContainer > #playerModal .player-modal__content {
+    z-index: var(--z-modal-content);
+  }
+
+  #playerModal {
+    position: fixed;
+    inset: 0;
+    z-index: var(--z-modal-player);
+    display: none;
+    flex-direction: column;
+    align-items: stretch;
+    justify-content: flex-start;
+    width: 100vw;
+    height: 100vh;
+    padding: 0;
+    background-color: var(--color-surface);
+    color: var(--color-subtle-text);
+    --player-modal-inline-max: var(--layout-player-max-width);
+    --player-modal-inline-padding: clamp(
+      var(--space-md-plus),
+      4vw,
+      var(--space-2xl)
+    );
+    overflow-x: hidden;
+    overflow-y: auto;
+    overscroll-behavior: contain;
+    -webkit-overflow-scrolling: touch;
+  }
+
+  #playerModal.flex {
+    display: block;
+  }
+
+  #modalVideo {
+    width: 100%;
+    aspect-ratio: 16 / 9;
+    background-color: var(--color-black);
+  }
+
+  .notification-portal {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    z-index: var(--z-overlay-toast);
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: var(--space-md);
+    padding: calc(var(--space-xl) + env(safe-area-inset-top)) var(--space-lg)
+      var(--space-lg);
+    pointer-events: none;
+    opacity: 0;
+    transform: translateY(var(--toast-translate));
+    transition:
+      transform var(--motion-duration-base) var(--motion-ease-out),
+      opacity var(--motion-duration-base) var(--motion-ease-out);
+  }
+
+  @media (min-width: theme("screens.sm")) {
+    .notification-portal {
+      padding-inline: var(--space-xl);
+    }
+  }
+
+  .notification-portal:has(.notification-banner:not(.hidden)) {
+    opacity: 1;
+    transform: translateY(0);
+  }
+
+  .notification-portal--active {
+    opacity: 1;
+    transform: translateY(0);
+  }
+
+  .notification-banner,
+  .torrent-toast {
+    --notify-accent: var(--notification-banner-accent);
+    --notify-accent-strong: var(--notification-banner-accent-strong);
+    --notify-border: var(--notification-banner-border);
+    --notify-background: var(--notification-banner-background);
+    --notify-foreground: var(--notification-banner-text);
+
+    position: relative;
+    display: flex;
+    align-items: center;
+    gap: var(--space-md);
+    width: min(var(--notification-banner-max-inline), 100%);
+    padding: var(--space-md) var(--space-xl);
+    border-radius: var(--radius-xl);
+    border: var(--border-width-hairline) solid var(--notify-border);
+    background: var(--notify-background);
+    color: var(--notify-foreground);
+    box-shadow: 0 var(--shadow-notification-offset-y)
+      var(--shadow-notification-blur) var(--color-shadow-notification);
+    backdrop-filter: blur(var(--overlay-backdrop-blur));
+    pointer-events: auto;
+    isolation: isolate;
+    @apply text-sm font-semibold leading-snug;
+    transition:
+      transform var(--motion-duration-base) var(--motion-ease-out),
+      opacity var(--motion-duration-base) var(--motion-ease-out);
+  }
+
+  .notification-banner::before,
+  .torrent-toast::before {
+    content: "";
+    position: absolute;
+    inset: 0;
+    border-radius: inherit;
+    background: linear-gradient(
+      135deg,
+      var(--notify-accent) 0%,
+      var(--notify-accent-strong) 100%
+    );
+    opacity: 0.18;
+    pointer-events: none;
+  }
+
+  .notification-banner > *,
+  .torrent-toast > * {
+    position: relative;
+    z-index: 1;
+  }
+
+  .notification-dismiss {
+    @apply inline-flex h-8 w-8 items-center justify-center rounded-full border border-transparent transition duration-base ease-out;
+    color: inherit;
+    opacity: 0.75;
+    background-color: var(--notify-dismiss-background);
+  }
+
+  .notification-dismiss:hover,
+  .notification-dismiss:focus-visible {
+    opacity: 1;
+    background-color: var(--notify-dismiss-background-hover);
+  }
+
+  .notification-dismiss svg {
+    @apply h-4 w-4;
+  }
+
+  .notification-banner:not(.hidden) {
+    animation: notification-slide-in var(--motion-duration-base)
+      var(--motion-ease-out);
+  }
+
+  .notification-banner--critical,
+  .torrent-toast--error {
+    --notify-accent: var(--notification-banner-critical-accent);
+    --notify-accent-strong: var(--notification-banner-critical-accent-strong);
+    --notify-border: var(--notification-banner-critical-border);
+    --notify-background: var(--notification-banner-critical-background);
+    --notify-foreground: var(--notification-banner-critical-text);
+  }
+
+  .notification-banner--success,
+  .torrent-toast--success {
+    --notify-accent: var(--notification-banner-success-accent);
+    --notify-accent-strong: var(--notification-banner-success-accent-strong);
+    --notify-border: var(--notification-banner-success-border);
+    --notify-background: var(--notification-banner-success-background);
+    --notify-foreground: var(--notification-banner-success-text);
+  }
+
+  .notification-banner--info,
+  .torrent-toast--info {
+    --notify-accent: var(--notification-banner-info-accent);
+    --notify-accent-strong: var(--notification-banner-info-accent-strong);
+    --notify-border: var(--notification-banner-info-border);
+    --notify-background: var(--notification-banner-info-background);
+    --notify-foreground: var(--notification-banner-info-text);
+  }
+
+  .notification-banner--warning,
+  .torrent-toast--warn {
+    --notify-accent: var(--notification-banner-warning-accent);
+    --notify-accent-strong: var(--notification-banner-warning-accent-strong);
+    --notify-border: var(--notification-banner-warning-border);
+    --notify-background: var(--notification-banner-warning-background);
+    --notify-foreground: var(--notification-banner-warning-text);
+  }
+
+  .status-banner .status-spinner {
+    animation: spin 1s linear infinite;
+    border: var(--space-3xs) solid var(--color-info-border);
+    border-radius: var(--radius-full);
+    border-top-color: var(--color-info);
+    flex-shrink: 0;
+    height: var(--icon-size-md);
+    width: var(--icon-size-md);
+  }
+
+  .status-banner .status-message {
+    flex: 1 1 auto;
+  }
+
+  @keyframes notification-slide-in {
+    from {
+      opacity: 0;
+      transform: translateY(var(--toast-translate));
+    }
+
+    to {
+      opacity: 1;
+      transform: translateY(0);
+    }
+  }
+
+  .status-spinner--inline {
+    animation: spin 1s linear infinite;
+    border: var(--space-3xs) solid var(--color-border-info-soft);
+    border-radius: var(--radius-full);
+    border-top-color: var(--color-info);
+    display: inline-block;
+    height: var(--space-md);
+    width: var(--space-md);
+  }
+
+  body.iframe-form {
+    background-color: transparent;
+    color: var(--color-text);
+    font-family: var(--font-family-sans);
+    margin: var(--space-lg);
+  }
+
+  body.iframe-form .container {
+    width: 100%;
+    max-width: 100%;
+    margin: 0;
+    padding: 0;
+  }
+
+  body.iframe-form .form-container {
+    background-color: var(--color-surface-alt);
+    border-radius: var(--radius-md);
+    box-shadow: var(--shadow-md);
+    color: var(--color-text);
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-md);
+    padding: var(--space-lg);
+  }
+
+  body.iframe-form .form-container > p {
+    margin: 0;
+  }
+
+  body.iframe-form form {
+    display: flex;
+    flex-direction: column;
+  }
+
+  body.iframe-form form > * + * {
+    margin-top: var(--space-sm);
+  }
+
+  body.iframe-form form h1,
+  body.iframe-form form h2 {
+    color: var(--color-text);
+    margin-top: var(--space-md);
+  }
+
+  body.iframe-form label {
+    color: var(--color-subtle-text);
+    display: block;
+    font-weight: 600;
+    margin-top: var(--space-sm);
+  }
+
+  body.iframe-form label + .form-control,
+  body.iframe-form label + .textarea,
+  body.iframe-form label + .select {
+    margin-top: var(--space-xs);
+  }
+
+  body.iframe-form .checkbox-group,
+  body.iframe-form .radio-group {
+    display: flex;
+    flex-wrap: wrap;
+    gap: var(--space-sm);
+    margin-top: var(--space-xs);
+  }
+
+  body.iframe-form .checkbox-group label,
+  body.iframe-form .radio-group label {
+    align-items: center;
+    color: var(--color-subtle-text);
+    display: inline-flex;
+    font-weight: 500;
+    gap: var(--space-xs);
+    margin: 0;
+  }
+
+  body.iframe-form .checkbox-group input[type="checkbox"],
+  body.iframe-form .radio-group input[type="radio"] {
+    margin: 0;
+  }
+
+  body.iframe-form .radio-group input[type="radio"] {
+    accent-color: var(--color-accent-strong);
+  }
+
+  body.iframe-form button.btn {
+    align-self: flex-start;
+    margin-top: var(--space-md);
+  }
+
+  body.iframe-form #status {
+    background: var(--color-surface);
+    border-radius: var(--radius-sm);
+    box-shadow: inset 0 0 0 var(--border-width-hairline)
+      var(--color-border-translucent);
+    color: var(--color-subtle-text);
+    min-height: calc(var(--space-2xl) + var(--space-xl));
+    padding: var(--space-sm);
+    white-space: pre-wrap;
+  }
+
+  body.iframe-form .status-line {
+    color: var(--color-subtle-text);
+    margin: var(--space-2xs) 0;
+  }
+
+  body.iframe-form .status-line.error {
+    color: var(--color-critical-strong);
+  }
+
+  body.iframe-form .status-line.success {
+    color: var(--color-info-strong);
+  }
+
+  body.iframe-form .status-line.warn {
+    color: var(--color-warning-strong);
+  }
+
+  @media (max-width: theme("screens.sm")) {
+    body.iframe-form {
+      margin: var(--space-md);
+    }
+
+    body.iframe-form .form-container {
+      padding: var(--space-md);
+    }
+  }
+
+  #sidebarContainer {
+    position: relative;
+    overflow: visible;
+  }
+
+  #sidebar {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: var(--sidebar-width);
+    min-width: var(--sidebar-width);
+    height: 100vh;
+    height: 100dvh;
+    color: var(--color-text-frosted-strong);
+    overflow-x: hidden;
+    overflow-y: auto;
+    -webkit-overflow-scrolling: touch;
+    overscroll-behavior: contain;
+    overscroll-behavior-inline: contain;
+    touch-action: pan-y;
+    scrollbar-gutter: stable both-edges;
+    background: transparent;
+    border-right: none;
+    backdrop-filter: none;
+    -webkit-backdrop-filter: none;
+    transition:
+      width 200ms ease,
+      transform 300ms ease;
+    z-index: var(--z-sidebar);
+    box-shadow: none;
+    isolation: isolate;
+  }
+
+  body.sidebar-collapsed,
+  #sidebar.sidebar-collapsed,
+  #sidebar[data-state="collapsed"],
+  #app.sidebar-collapsed {
+    --sidebar-width: var(--sidebar-width-collapsed);
+  }
+
+  body.sidebar-expanded,
+  #sidebar.sidebar-expanded,
+  #sidebar[data-state="expanded"],
+  #app.sidebar-expanded {
+    --sidebar-width: var(--sidebar-width-expanded);
+  }
+
+  #sidebar .sidebar__inner {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    padding-block-start: max(
+      var(--space-sidebar-shell-block-start),
+      calc(var(--app-header-centerline) - (var(--sidebar-control-size) / 2))
+    );
+    padding-block-end: var(--space-sidebar-shell-block-end);
+    padding-inline: var(--space-sidebar-shell-inline);
+    width: 100%;
+    border-radius: var(--radius-sidebar-shell);
+    border: none;
+    background: none;
+    box-shadow: none;
+    backdrop-filter: none;
+    -webkit-backdrop-filter: none;
+    overflow: visible;
+    isolation: isolate;
+    transition: color 200ms ease;
+  }
+
+  .sidebar-scroll {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-sidebar-scroll-gap);
+    width: 100%;
+    height: 100%;
+    min-height: 0;
+    flex: 1 1 auto;
+    overflow: visible;
+  }
+
+  .sidebar-panel {
+    position: relative;
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-sidebar-panel-gap);
+    padding: var(--space-sidebar-panel-padding-block)
+      var(--space-sidebar-panel-padding-inline);
+    border-radius: var(--radius-sidebar-panel);
+    border: none;
+    background: transparent;
+    box-shadow: none;
+    color: inherit;
+    backdrop-filter: none;
+    -webkit-backdrop-filter: none;
+    overflow: hidden;
+    isolation: isolate;
+    transition:
+      border-color 200ms ease,
+      box-shadow 220ms ease,
+      background 220ms ease;
+  }
+
+  .sidebar-panel--primary {
+    flex: 1 1 auto;
+    min-height: 0;
+    padding-block-start: 0;
+  }
+
+  .sidebar-panel__header {
+    display: flex;
+    justify-content: flex-end;
+    margin-bottom: var(--space-md);
+  }
+
+  .sidebar-collapse-toggle {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: var(--sidebar-control-size);
+    height: var(--sidebar-control-size);
+    border-radius: var(--radius-full);
+    border: var(--border-width-hairline) solid
+      var(--color-border-translucent-medium);
+    background: var(--color-surface-tint-subtle);
+    color: inherit;
+    cursor: pointer;
+    transition:
+      background 180ms ease,
+      color 180ms ease,
+      border-color 180ms ease;
+    flex-shrink: 0;
+    box-sizing: border-box;
+  }
+
+  .sidebar-collapse-toggle:hover {
+    background: var(--color-border-translucent);
+    border-color: var(--color-border-translucent-stronger);
+    color: var(--color-text);
+  }
+
+  .sidebar-collapse-toggle:focus-visible {
+    outline: var(--space-3xs) solid var(--color-secondary);
+    outline-offset: var(--space-2xs);
+  }
+
+  .sidebar-collapse-toggle__icon {
+    width: var(--icon-size-sm);
+    height: var(--icon-size-sm);
+    transition: transform 200ms ease;
+  }
+
+  .sidebar-nav {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-xs);
+    opacity: 1;
+    transition: opacity 160ms ease;
+    width: 100%;
+  }
+
+  .sidebar-nav-link {
+    --sidebar-nav-translate-x: 0;
+    --sidebar-nav-link-highlight-opacity: 0;
+    --sidebar-nav-link-highlight-scale: 0.96;
+    display: flex;
+    align-items: center;
+    gap: var(--space-sidebar-footer-gap);
+    padding-block: var(--space-sidebar-nav-padding-block);
+    padding-inline-start: var(--space-sidebar-nav-padding-inline-start);
+    padding-inline-end: var(--space-sidebar-nav-padding-inline-end);
+    min-height: var(--sidebar-control-size);
+    border-radius: var(--radius-sidebar-nav);
+    font-size: var(--font-size-sidebar-nav);
+    font-weight: 600;
+    letter-spacing: 0.015em;
+    color: var(--color-text);
+    text-decoration: none;
+    width: 100%;
+    position: relative;
+    border: var(--border-width-hairline) solid transparent;
+    background: none;
+    box-shadow: none;
+    transform: translateX(var(--sidebar-nav-translate-x));
+    transition:
+      color 180ms ease,
+      border-color 200ms ease,
+      box-shadow 220ms ease,
+      transform 220ms ease;
+    overflow: hidden;
+    isolation: isolate;
+    backdrop-filter: none;
+    -webkit-backdrop-filter: none;
+  }
+
+  .sidebar-nav-link::before,
+  .sidebar-nav-link::after {
+    content: "";
+    position: absolute;
+    inset: calc(var(--border-width-hairline) * -1);
+    border-radius: inherit;
+    pointer-events: none;
+    transition:
+      opacity 220ms ease,
+      transform 240ms ease;
+    z-index: -1;
+  }
+
+  .sidebar-nav-link::before {
+    background: linear-gradient(
+      120deg,
+      var(--color-sidebar-accent-start) 0%,
+      var(--color-sidebar-accent-end) 100%
+    );
+    opacity: var(--sidebar-nav-link-highlight-opacity);
+    transform: scale(var(--sidebar-nav-link-highlight-scale));
+    filter: saturate(140%);
+  }
+
+  .sidebar-nav-link::after {
+    background: linear-gradient(
+      105deg,
+      var(--color-sidebar-hover) 0%,
+      transparent 75%
+    );
+    opacity: 0.22;
+    mix-blend-mode: screen;
+    z-index: -2;
+  }
+
+  .sidebar-nav-link:hover,
+  .sidebar-nav-link:focus-visible {
+    --sidebar-nav-link-highlight-opacity: 1;
+    --sidebar-nav-link-highlight-scale: 1.02;
+    --sidebar-nav-translate-x: var(--space-sidebar-nav-translate);
+    color: var(--color-white);
+    border-color: var(--color-sidebar-hover-strong);
+    box-shadow:
+      0 0 0 var(--border-width-hairline) var(--color-sidebar-hover-strong),
+      var(--shadow-sidebar-accent);
+  }
+
+  .sidebar-nav-link:focus-visible {
+    outline: none;
+    box-shadow: var(--shadow-sidebar-focus-ring), var(--shadow-sidebar-accent);
+  }
+
+  .sidebar-nav-link:hover::after,
+  .sidebar-nav-link:focus-visible::after {
+    opacity: 0.35;
+  }
+
+  .sidebar-nav-link--sub {
+    font-size: var(--font-size-sidebar-subnav);
+    font-weight: 500;
+    color: var(--color-sidebar-text-muted);
+    padding-block: var(--space-sidebar-subnav-padding-block);
+    letter-spacing: 0.02em;
+    --sidebar-nav-link-highlight-opacity: 0.25;
+    --sidebar-nav-link-highlight-scale: 1;
+  }
+
+  .sidebar-icon {
+    width: var(--space-lg);
+    height: var(--space-lg);
+    min-width: var(--space-lg);
+    min-height: var(--space-lg);
+    flex-shrink: 0;
+    display: block;
+    filter: var(--sidebar-icon-filter);
+    transition: filter 180ms ease;
+  }
+
+  .sidebar-footer {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-sidebar-footer-gap);
+    margin-top: auto;
+    position: relative;
+    z-index: 2;
+  }
+
+  .sidebar-dropup-trigger {
+    position: relative;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: var(--space-sidebar-footer-gap);
+    width: 100%;
+    padding-block: var(--space-sidebar-trigger-padding-block);
+    padding-inline-start: var(--space-sidebar-nav-padding-inline-start);
+    padding-inline-end: var(--space-sidebar-nav-padding-inline-end);
+    min-height: var(--sidebar-control-size);
+    border-radius: var(--radius-sidebar-nav);
+    border: var(--border-width-hairline) solid transparent;
+    background: none;
+    color: var(--color-text);
+    font-size: var(--font-size-sidebar-trigger);
+    font-weight: 600;
+    cursor: pointer;
+    box-sizing: border-box;
+    flex-shrink: 0;
+    overflow: hidden;
+    isolation: isolate;
+    backdrop-filter: none;
+    -webkit-backdrop-filter: none;
+    box-shadow: none;
+    transition:
+      border-color 200ms ease,
+      color 200ms ease,
+      box-shadow 220ms ease;
+  }
+
+  .sidebar-dropup-trigger::before {
+    content: "";
+    position: absolute;
+    inset: calc(var(--border-width-hairline) * -1);
+    border-radius: inherit;
+    pointer-events: none;
+    background: linear-gradient(
+      120deg,
+      var(--color-sidebar-accent-start) 0%,
+      var(--color-sidebar-accent-end) 100%
+    );
+    opacity: 0;
+    transform: scale(0.96);
+    transition:
+      opacity 200ms ease,
+      transform 220ms ease;
+    z-index: -1;
+    filter: saturate(140%);
+  }
+
+  .sidebar-dropup-trigger::after {
+    content: "";
+    position: absolute;
+    inset: calc(var(--border-width-hairline) * -1);
+    border-radius: inherit;
+    pointer-events: none;
+    background: linear-gradient(
+      110deg,
+      var(--color-sidebar-hover) 0%,
+      transparent 80%
+    );
+    opacity: 0.18;
+    mix-blend-mode: screen;
+    transition: opacity 200ms ease;
+    z-index: -2;
+  }
+
+  .sidebar-dropup-trigger:hover,
+  .sidebar-dropup-trigger:focus-visible {
+    color: var(--color-white);
+    border-color: var(--color-sidebar-hover-strong);
+    box-shadow:
+      0 0 0 var(--border-width-hairline) var(--color-sidebar-hover-strong),
+      var(--shadow-sidebar-dropup);
+  }
+
+  .sidebar-dropup-trigger:hover::before,
+  .sidebar-dropup-trigger:focus-visible::before {
+    opacity: 1;
+    transform: scale(1.02);
+  }
+
+  .sidebar-dropup-trigger:hover::after,
+  .sidebar-dropup-trigger:focus-visible::after {
+    opacity: 0.35;
+  }
+
+  .sidebar-dropup-trigger:focus-visible {
+    outline: none;
+    box-shadow: var(--shadow-sidebar-focus-ring), var(--shadow-sidebar-dropup);
+  }
+
+  .sidebar-dropup-trigger__glyph {
+    width: var(--icon-size-md);
+    height: var(--icon-size-md);
+    opacity: 0.9;
+  }
+
+  .sidebar-dropup-trigger__chevron {
+    width: var(--icon-size-sm);
+    height: var(--icon-size-sm);
+    transition: transform 180ms ease;
+  }
+
+  .sidebar-dropup-trigger__chevron.is-rotated,
+  .sidebar-dropup-trigger[aria-expanded="true"]
+    .sidebar-dropup-trigger__chevron {
+    transform: rotate(180deg);
+  }
+
+  .sidebar-dropup-panel {
+    position: absolute;
+    left: 0;
+    right: 0;
+    bottom: calc(100% + var(--space-sidebar-popover-offset));
+    border-radius: var(--radius-xl);
+    border: var(--border-width-hairline) solid
+      var(--color-sidebar-border-strong);
+    background: linear-gradient(
+      160deg,
+      color-mix(in srgb, var(--color-sidebar-surface) 88%, transparent) 0%,
+      color-mix(in srgb, var(--color-sidebar-surface-alt) 68%, transparent) 100%
+    );
+    box-shadow:
+      inset 0 0 0 var(--border-width-fine) var(--color-sidebar-border),
+      var(--shadow-sidebar-panel);
+    padding: var(--space-sidebar-popover-padding-block)
+      var(--space-sidebar-popover-padding-inline);
+    color: var(--color-text-frosted);
+    opacity: 0;
+    visibility: hidden;
+    pointer-events: none;
+    transform: translateY(var(--space-sm));
+    transition:
+      opacity 180ms ease,
+      transform 180ms ease,
+      visibility 180ms ease,
+      box-shadow 220ms ease;
+    backdrop-filter: blur(var(--sidebar-panel-backdrop-blur))
+      saturate(var(--sidebar-panel-backdrop-saturation));
+    -webkit-backdrop-filter: blur(var(--sidebar-panel-backdrop-blur))
+      saturate(var(--sidebar-panel-backdrop-saturation));
+    z-index: 5;
+    isolation: isolate;
+  }
+
+  .sidebar-dropup-panel[data-state="expanded"] {
+    opacity: 1;
+    visibility: visible;
+    pointer-events: auto;
+    transform: translateY(0);
+  }
+
+  .sidebar-dropup-panel__inner {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-sidebar-popover-gap);
+    width: 100%;
+    padding-inline-end: var(--space-sidebar-dropup-scroll-reserve);
+    max-height: var(--sidebar-dropup-max-height);
+    overflow-y: auto;
+    overflow-x: hidden;
+    scrollbar-gutter: stable both-edges;
+  }
+
+  .sidebar-dropup-panel__inner.is-measuring {
+    position: absolute;
+    width: max-content;
+    max-width: none;
+    visibility: hidden;
+    pointer-events: none;
+    left: var(--offscreen-offset);
+    right: auto;
+    top: auto;
+    bottom: auto;
+  }
+
+  .sidebar-dropup-measure {
+    position: absolute;
+    visibility: hidden;
+    pointer-events: none;
+    height: 0;
+    overflow: hidden;
+  }
+
+  .sidebar-dropup-panel__inner > * {
+    width: 100%;
+    min-width: 0;
+  }
+
+  #sidebar[data-footer-state="expanded"] .sidebar-nav {
+    opacity: 0;
+    pointer-events: none;
+  }
+
+  #sidebar[data-footer-state="collapsed"] .sidebar-nav {
+    opacity: 1;
+  }
+
+  .sidebar-loading-wrapper {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: var(--space-2xl) 0;
+    width: 100%;
+    grid-column: 1 / -1;
+  }
+
+  .sidebar-loading-indicator {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--space-sm);
+    color: var(--color-muted-strong);
+    font-size: var(--font-size-sm);
+    font-weight: 500;
+    letter-spacing: 0.01em;
+  }
+
+  .sidebar-loading-text {
+    white-space: nowrap;
+  }
+
+  #app {
+    box-sizing: border-box;
+    transition:
+      margin-left 200ms ease,
+      width 200ms ease,
+      max-width 200ms ease;
+  }
+
+  #app[data-sidebar-state="collapsed"] {
+    margin-left: var(--sidebar-width-collapsed);
+    width: calc(100vw - var(--sidebar-width-collapsed));
+    max-width: calc(100vw - var(--sidebar-width-collapsed));
+  }
+
+  #app[data-sidebar-state="expanded"] {
+    margin-left: max(
+      var(--sidebar-width-expanded-base),
+      var(--sidebar-dropup-content-width)
+    );
+    width: min(
+      calc(100vw - var(--sidebar-width-expanded-base)),
+      calc(100vw - var(--sidebar-dropup-content-width))
+    );
+    max-width: min(
+      calc(100vw - var(--sidebar-width-expanded-base)),
+      calc(100vw - var(--sidebar-dropup-content-width))
+    );
+  }
+
+  body.sidebar-collapsed #sidebar .sidebar-nav-link,
+  #sidebar.sidebar-collapsed .sidebar-nav-link {
+    justify-content: center;
+    width: var(--sidebar-control-size);
+    padding: 0;
+    margin-inline: auto;
+    border-radius: var(--radius-full);
+    --sidebar-nav-translate-x: 0;
+    --sidebar-nav-link-highlight-scale: 1;
+  }
+
+  body.sidebar-expanded #sidebar .sidebar-nav-link,
+  #sidebar.sidebar-expanded .sidebar-nav-link {
+    justify-content: flex-start;
+  }
+
+  body.sidebar-collapsed #sidebar .sidebar-text,
+  #sidebar.sidebar-collapsed .sidebar-text {
+    display: none;
+  }
+
+  body.sidebar-collapsed #sidebar .sidebar__inner,
+  #sidebar.sidebar-collapsed .sidebar__inner {
+    padding-inline: var(--space-2xs);
+  }
+
+  body.sidebar-collapsed #sidebar .sidebar-panel,
+  #sidebar.sidebar-collapsed .sidebar-panel {
+    padding-inline: calc(var(--space-3xs) * 3);
+  }
+
+  body.sidebar-collapsed #sidebar .sidebar-panel__header,
+  #sidebar.sidebar-collapsed .sidebar-panel__header {
+    justify-content: center;
+  }
+
+  body.sidebar-collapsed #sidebar .sidebar-collapse-toggle,
+  #sidebar.sidebar-collapsed .sidebar-collapse-toggle {
+    margin-inline: auto;
+  }
+
+  #sidebar .sidebar-toggle-icon--rotated {
+    transform: rotate(180deg);
+  }
+
+  body.sidebar-collapsed #sidebar .sidebar-toggle-icon--rotated,
+  #sidebar.sidebar-collapsed .sidebar-toggle-icon--rotated {
+    transform: rotate(0deg);
+  }
+
+  body.sidebar-collapsed #sidebar .sidebar-dropup-trigger,
+  #sidebar.sidebar-collapsed .sidebar-dropup-trigger {
+    justify-content: center;
+    width: var(--sidebar-control-size);
+    height: var(--sidebar-control-size);
+    padding: 0;
+    margin-inline: auto;
+    border-radius: var(--radius-full);
+  }
+
+  body.sidebar-collapsed #sidebar .sidebar-dropup-trigger .sidebar-text,
+  #sidebar.sidebar-collapsed .sidebar-dropup-trigger .sidebar-text {
+    display: none;
+  }
+
+  body.sidebar-collapsed #sidebar .sidebar-dropup-trigger__chevron {
+    display: none;
+  }
+
+  body.sidebar-collapsed #sidebar .sidebar-dropup-trigger__glyph,
+  #sidebar.sidebar-collapsed .sidebar-dropup-trigger__glyph {
+    margin: 0;
+  }
+
+  body.sidebar-collapsed #sidebar .sidebar-nav-link:hover,
+  #sidebar.sidebar-collapsed .sidebar-nav-link:hover,
+  body.sidebar-collapsed #sidebar .sidebar-nav-link:focus-visible,
+  #sidebar.sidebar-collapsed .sidebar-nav-link:focus-visible {
+    --sidebar-nav-translate-x: 0;
+  }
+
+  @media (min-width: theme("screens.md")) {
+    .sidebar-panel__header {
+      display: flex;
+    }
+
+    .sidebar-collapse-toggle {
+      display: inline-flex;
+    }
+
+    #sidebar {
+      transform: translateX(0) !important;
+      width: var(--sidebar-width);
+      overflow: visible;
+    }
+
+    #app[data-sidebar-state="collapsed"] {
+      margin-left: calc(
+        var(--sidebar-width-collapsed) + var(--sidebar-content-gap)
+      );
+      width: calc(
+        100vw - var(--sidebar-width-collapsed) - var(--sidebar-content-gap)
+      );
+      max-width: calc(
+        100vw - var(--sidebar-width-collapsed) - var(--sidebar-content-gap)
+      );
+    }
+
+    #app[data-sidebar-state="expanded"] {
+      margin-left: max(
+        calc(var(--sidebar-width-expanded-base) + var(--sidebar-content-gap)),
+        calc(var(--sidebar-dropup-content-width) + var(--sidebar-content-gap))
+      );
+      width: min(
+        calc(
+          100vw - var(--sidebar-width-expanded-base) -
+            var(--sidebar-content-gap)
+        ),
+        calc(
+          100vw - var(--sidebar-dropup-content-width) -
+            var(--sidebar-content-gap)
+        )
+      );
+      max-width: min(
+        calc(
+          100vw - var(--sidebar-width-expanded-base) -
+            var(--sidebar-content-gap)
+        ),
+        calc(
+          100vw - var(--sidebar-dropup-content-width) -
+            var(--sidebar-content-gap)
+        )
+      );
+    }
+  }
+
+  @keyframes card-motion-enter {
+    from {
+      opacity: 0;
+      transform: translateY(var(--motion-card-enter-translate));
+    }
+
+    to {
+      opacity: 1;
+      transform: translateY(0);
+    }
+  }
+
+  @keyframes video-thumbnail-fade-in {
+    from {
+      opacity: 0;
+    }
+
+    to {
+      opacity: 1;
+    }
+  }
+
+  @keyframes interface-fade-in {
+    from {
+      opacity: 0;
+    }
+
+    to {
+      opacity: 1;
+    }
+  }
+
+  @keyframes fadeIn {
+    from {
+      opacity: 0;
+      transform: translateY(var(--motion-fade-in-translate));
+    }
+
+    to {
+      opacity: 1;
+      transform: translateY(0);
+    }
+  }
+
+  @keyframes spin {
+    to {
+      transform: rotate(360deg);
+    }
+  }
+}
+
+@layer utilities {
+  @media (max-width: theme("screens.compact")) {
+    .u-max-400-flex-wrap {
+      flex-wrap: wrap;
+    }
+
+    .u-max-400-gap-y-sm {
+      row-gap: var(--space-sm);
+    }
+
+    .u-max-400-gap-y-xs {
+      row-gap: var(--space-xs);
+    }
+
+    .u-max-400-w-full {
+      width: 100%;
+    }
+
+    .u-max-400-justify-between {
+      justify-content: space-between;
+    }
+
+    .u-max-400-ml-0 {
+      margin-left: 0;
+    }
+
+    .u-max-400-px-sm {
+      padding-left: var(--space-sm);
+      padding-right: var(--space-sm);
+    }
+
+    .u-max-400-square-9 {
+      height: var(--space-xl-compact);
+      width: var(--space-xl-compact);
+      min-height: var(--space-xl-compact);
+      min-width: var(--space-xl-compact);
+    }
+  }
+}
+
+@media (max-width: theme("screens.sm")) {
+  .bv-grid-video {
+    gap: var(--space-md);
+    grid-template-columns: 1fr;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  :root {
+    --motion-duration-fast: 0s;
+    --motion-duration-base: 0s;
+    --motion-duration-slow: 0s;
+    --modal-motion-duration: 0s;
+  }
+
+  *,
+  *::before,
+  *::after {
+    animation-delay: 0s !important;
+    animation-duration: 0s !important;
+    animation-iteration-count: 1 !important;
+    animation-timing-function: linear !important;
+    transition-delay: 0s !important;
+    transition-duration: 0s !important;
+    transition-timing-function: linear !important;
+  }
+
+  .player-modal__similar-card::before {
+    transition: none !important;
+  }
+
+  .btn,
+  .btn-ghost,
+  .card,
+  .card[data-motion="enter"],
+  .fade-in,
+  .icon-button,
+  .menu__item,
+  .modal-nav,
+  .popover-panel,
+  .popover__panel,
+  .progress-bar-fill,
+  .notification-banner,
+  .notification-portal,
+  .torrent-toast,
+  .status-banner .status-spinner,
+  .status-spinner--inline,
+  .video-modal__panel,
+  .watch-history-card,
+  .watch-history-card__creatorAvatar,
+  .watch-history-card__creatorName,
+  .watch-history-card__action,
+  .watch-history-card__title,
+  #app,
+  #playerModal .player-modal__content,
+  #sidebar,
+  .sidebar-collapse-toggle,
+  .sidebar-collapse-toggle__icon,
+  .sidebar-dropup-panel,
+  .sidebar-dropup-trigger,
+  .sidebar-dropup-trigger__chevron,
+  .sidebar-nav,
+  .sidebar-nav-link,
+  .sidebar-loading-indicator,
+  .sidebar-loading-wrapper {
+    transition-property: none !important;
+  }
+
+  .popover-panel,
+  .popover__panel {
+    transform: none !important;
+  }
+
+  .popover-panel[data-state="open"],
+  .popover__panel[data-state="open"] {
+    opacity: 1;
+  }
+
+  .popover-panel[data-state="closed"],
+  .popover__panel[data-state="closed"] {
+    opacity: 0;
+  }
+
+  .card[data-motion="enter"],
+  .fade-in {
+    opacity: 1;
+    animation: none !important;
+  }
+
+  [data-video-thumbnail][data-thumbnail-loaded="true"] {
+    animation: none !important;
+    opacity: 1;
+  }
+
+  .notification-banner,
+  .torrent-toast,
+  .status-banner .status-spinner,
+  .status-spinner--inline {
+    animation: none !important;
+  }
+
+  .notification-portal {
+    transform: none !important;
+    opacity: 1 !important;
+  }
+}
+
+@layer components {
+  .ui-grid-row {
+    border-bottom: var(--border-width-hairline) solid
+      var(--color-border-subtle, var(--color-border));
+  }
+
+  .status-line {
+    @apply my-1 text-sm leading-snug text-text;
+  }
+
+  /* Status log containers reserve space for dynamic messages. */
+  .status-log {
+    @apply min-h-status-log;
+  }
+
+  .status-line.error {
+    color: var(--color-critical-strong);
+  }
+
+  .status-line.success {
+  }
+
+  .status-line.warn {
+    color: var(--color-warning-strong);
+  }
+
+  /* Blog layout root scaffolding */
+
+  @keyframes ztr-rotate {
+    100% {
+      transform: rotate(360deg);
+    }
+  }
+
+  @keyframes ztr-dash {
+    0% {
+      stroke-dasharray: 1, 150;
+      stroke-dashoffset: 0;
+    }
+
+    50% {
+      stroke-dasharray: 90, 150;
+      stroke-dashoffset: -35;
+    }
+
+    100% {
+      stroke-dasharray: 90, 150;
+      stroke-dashoffset: -124;
+    }
+  }
+
+  @keyframes svelte-181fgen-loader-animation {
+    0% {
+      transform: rotate(0);
+    }
+
+    to {
+      transform: rotate(360deg);
+    }
+  }
+
+  @keyframes svelte-181fgen-fade-in {
+    to {
+      opacity: 1;
+    }
+  }
+}
+
+@layer components {
+  .dm-app-shell {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-lg);
+    padding: var(--space-lg);
+    background: var(--surface-base);
+    color: var(--text-primary);
+    min-height: 100vh;
+  }
+
+  .profile-modal .dm-app-shell {
+    min-height: 0;
+    height: auto;
+    padding: var(--space-md);
+  }
+
+  .dm-app-shell__sidebar,
+  .dm-app-shell__main {
+    border-radius: var(--radius-lg);
+    border: var(--border-width-hairline) solid var(--border-default);
+    background: var(--surface-panel);
+    box-shadow: var(--shadow-soft);
+  }
+
+  .profile-modal .dm-app-shell__sidebar,
+  .profile-modal .dm-app-shell__main {
+    height: auto;
+    min-height: 0;
+  }
+
+  .dm-app-shell__sidebar {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-md);
+    padding: var(--space-md);
+  }
+
+  .dm-app-shell__title {
+    font-size: var(--font-size-lg);
+    margin: 0;
+  }
+
+  .dm-app-shell__main {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-md);
+    padding: var(--space-md);
+    background: var(--surface-raised);
+  }
+
+  .profile-modal .dm-app-shell__main,
+  .profile-modal .dm-app-shell__sidebar {
+    min-width: 0;
+  }
+
+  .dm-conversation-list {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-sm);
+  }
+
+  .dm-conversation-list__header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+
+  .dm-conversation-list__title {
+    font-size: var(--font-size-sm);
+    text-transform: uppercase;
+    letter-spacing: 0.08em;
+    color: var(--text-muted);
+    margin: 0;
+  }
+
+  .dm-conversation-list__items {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-xs);
+    overflow-y: auto;
+    max-height: 60vh;
+    padding-right: var(--space-xs);
+  }
+
+  .dm-conversation-list__state {
+    font-size: var(--font-size-sm);
+    color: var(--text-muted);
+    padding: var(--space-md);
+    text-align: center;
+    background: var(--surface-sunken);
+    border-radius: var(--radius-md);
+  }
+
+  .dm-contact-row {
+    display: flex;
+    align-items: center;
+    gap: var(--space-sm);
+    padding: var(--space-sm) var(--space-md);
+    border-radius: var(--radius-md);
+    border: var(--border-width-hairline) solid var(--border-subtle);
+    background: transparent;
+    color: inherit;
+    text-align: left;
+    cursor: pointer;
+  }
+
+  .dm-contact-row:hover,
+  .dm-contact-row:focus-visible {
+    background: var(--surface-muted);
+    border-color: var(--border-strong);
+    outline: none;
+  }
+
+  .dm-contact-row--active {
+    background: var(--surface-sunken);
+    border-color: var(--border-strong);
+  }
+
+  .dm-contact-row__content {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-2xs);
+    flex: 1;
+  }
+
+  .dm-contact-row__header {
+    display: flex;
+    justify-content: space-between;
+    align-items: baseline;
+    gap: var(--space-xs);
+  }
+
+  .dm-contact-row__meta {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--space-xs);
+  }
+
+  .dm-contact-row__name {
+    font-weight: 600;
+  }
+
+  .dm-contact-row__time {
+    font-size: var(--font-size-2xs);
+    color: var(--text-muted);
+  }
+
+  .dm-contact-row__preview {
+    font-size: var(--font-size-xs);
+    color: var(--text-muted);
+  }
+
+  .dm-contact-row__badge {
+    align-self: flex-start;
+    padding: var(--space-3xs) var(--space-xs);
+    border-radius: var(--radius-full);
+    background: var(--color-accent);
+    color: var(--color-white);
+    font-size: var(--font-size-3xs);
+  }
+
+  .dm-avatar {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+    border-radius: var(--radius-full);
+    background: var(--surface-sunken);
+    color: var(--text-muted);
+    font-weight: 600;
+    overflow: hidden;
+    border: var(--border-width-hairline) solid var(--border-subtle);
+  }
+
+  .dm-avatar--md {
+    width: var(--space-xl-plus);
+    height: var(--space-xl-plus);
+  }
+
+  .dm-avatar--sm {
+    width: var(--space-xl);
+    height: var(--space-xl);
+  }
+
+  .dm-avatar__image {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+
+  .dm-message-thread {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-sm);
+    flex: 1;
+    min-height: 0;
+  }
+
+  .dm-message-thread__header {
+    display: flex;
+    align-items: baseline;
+    gap: var(--space-sm);
+  }
+
+  .dm-message-thread__title {
+    font-size: var(--font-size-base);
+    margin: 0;
+  }
+
+  .dm-message-thread__status {
+    font-size: var(--font-size-xs);
+    color: var(--text-muted);
+  }
+
+  .dm-message-thread__zap-summary {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--space-xs);
+    padding: var(--space-2xs) var(--space-xs);
+    border-radius: var(--radius-full);
+    border: var(--border-width-hairline) solid var(--border-subtle);
+    background: var(--surface-sunken);
+    color: var(--text-muted);
+    font-size: var(--font-size-2xs);
+  }
+
+  .dm-message-thread__zap-label {
+    text-transform: uppercase;
+    letter-spacing: var(--tracking-wide);
+  }
+
+  .dm-message-thread__zap-total {
+    font-weight: 600;
+    color: var(--text-primary);
+  }
+
+  .dm-message-thread__zap-profile {
+    color: var(--text-muted);
+  }
+
+  .dm-message-thread__timeline {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-sm);
+    padding: var(--space-sm);
+    border-radius: var(--radius-md);
+    background: var(--surface-panel);
+    border: var(--border-width-hairline) solid var(--border-subtle);
+    overflow-y: auto;
+    min-height: var(--size-16rem);
+  }
+
+  .dm-message-thread__state {
+    padding: var(--space-md);
+    text-align: center;
+    color: var(--text-muted);
+    background: var(--surface-sunken);
+    border-radius: var(--radius-md);
+  }
+
+  .dm-message-bubble {
+    max-width: 85%;
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-2xs);
+    padding: var(--space-sm) var(--space-md);
+    border-radius: var(--radius-lg);
+    border: var(--border-width-hairline) solid var(--message-bubble-border);
+    background: var(--message-bubble-background);
+    color: var(--message-bubble-text);
+  }
+
+  .dm-message-bubble--incoming {
+    align-self: flex-start;
+  }
+
+  .dm-message-bubble--outgoing {
+    align-self: flex-end;
+    background: var(--color-accent);
+    color: var(--color-white);
+    border-color: var(--color-accent-strong);
+  }
+
+  .dm-message-bubble--outgoing .dm-message-bubble__meta,
+  .dm-message-bubble--outgoing .dm-message-bubble__status {
+    color: var(--color-white);
+    opacity: 0.9;
+  }
+
+  .dm-message-bubble__content {
+    font-size: var(--font-size-sm);
+    overflow-wrap: anywhere;
+    white-space: pre-wrap;
+  }
+
+  .dm-message-bubble__meta {
+    display: flex;
+    gap: var(--space-xs);
+    font-size: var(--font-size-2xs);
+    color: var(--message-bubble-meta);
+  }
+
+  .dm-message-bubble__status {
+    color: var(--text-muted);
+  }
+
+  .dm-message-bubble__status[data-status="pending"] {
+    color: var(--status-warning);
+  }
+
+  .dm-message-bubble__status[data-status="sending"] {
+    color: var(--status-info);
+  }
+
+  .dm-message-bubble__status[data-status="failed"] {
+    color: var(--status-danger);
+  }
+
+  .dm-message-thread__new {
+    align-self: center;
+    border-radius: var(--radius-full);
+    border: var(--border-width-hairline) solid var(--border-subtle);
+    padding: var(--space-2xs) var(--space-sm);
+    font-size: var(--font-size-2xs);
+    background: var(--surface-sunken);
+    color: var(--text-muted);
+  }
+
+  .dm-message-thread__new:hover,
+  .dm-message-thread__new:focus-visible {
+    background: var(--surface-overlay-panel-soft);
+    color: var(--text-primary);
+    outline: none;
+  }
+
+  .dm-day-divider {
+    display: grid;
+    grid-template-columns: 1fr auto 1fr;
+    align-items: center;
+    gap: var(--space-xs);
+    color: var(--text-muted);
+    font-size: var(--font-size-2xs);
+  }
+
+  .dm-day-divider__line {
+    height: var(--border-width-hairline);
+    background: var(--border-subtle);
+  }
+
+  .dm-notification-center {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-sm);
+  }
+
+  .dm-notification-center__filters {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: var(--space-xs);
+  }
+
+  .dm-notification-center__filter-button {
+    border-radius: var(--radius-full);
+    border: var(--border-width-hairline) solid var(--border-subtle);
+    background: var(--surface-sunken);
+    padding: var(--space-2xs) var(--space-sm);
+    font-size: var(--font-size-2xs);
+    font-weight: 600;
+    color: var(--text-muted);
+    transition:
+      color var(--motion-duration-fast) var(--motion-ease-out),
+      background var(--motion-duration-fast) var(--motion-ease-out),
+      border-color var(--motion-duration-fast) var(--motion-ease-out);
+  }
+
+  .dm-notification-center__filter-button:hover,
+  .dm-notification-center__filter-button:focus-visible {
+    outline: none;
+    border-color: var(--border-strong);
+    background: var(--surface-raised);
+    color: var(--text-primary);
+  }
+
+  .dm-notification-center__filter-button--active {
+    border-color: var(--border-strong);
+    background: var(--surface-overlay-panel);
+    color: var(--text-primary);
+  }
+
+  .dm-notification-center__groups {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-md);
+  }
+
+  .dm-notification-center__group {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-xs);
+  }
+
+  .dm-notification-center__group-title {
+    font-size: var(--font-size-2xs);
+    font-weight: 600;
+    text-transform: uppercase;
+    letter-spacing: var(--tracking-wide);
+    color: var(--text-muted);
+  }
+
+  .dm-notification-center__list {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-xs);
+  }
+
+  .dm-notification-center__empty {
+    font-size: var(--font-size-xs);
+    color: var(--text-muted);
+  }
+
+  .dm-notification-item {
+    display: grid;
+    grid-template-columns: auto 1fr auto;
+    align-items: center;
+    gap: var(--space-sm);
+    padding: var(--space-sm);
+    border-radius: var(--radius-md);
+    border: var(--border-width-hairline) solid var(--border-subtle);
+    background: var(--surface-sunken);
+    font-size: var(--font-size-xs);
+    text-align: left;
+    transition:
+      border-color var(--motion-duration-fast) var(--motion-ease-out),
+      background var(--motion-duration-fast) var(--motion-ease-out);
+  }
+
+  .dm-notification-item:hover,
+  .dm-notification-item:focus-visible {
+    outline: none;
+    border-color: var(--border-strong);
+    background: var(--surface-raised);
+  }
+
+  .dm-notification-item__icon {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: var(--icon-size-md);
+    height: var(--icon-size-md);
+    border-radius: var(--radius-full);
+    background: var(--surface-overlay-panel-soft);
+    color: var(--text-muted);
+    font-size: var(--font-size-xs);
+  }
+
+  .dm-notification-item__body {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-2xs);
+    min-width: 0;
+  }
+
+  .dm-notification-item__title {
+    font-weight: 600;
+    color: var(--text-primary);
+  }
+
+  .dm-notification-item__message {
+    color: var(--text-muted);
+  }
+
+  .dm-notification-item__meta {
+    display: flex;
+    align-items: center;
+    gap: var(--space-2xs);
+    color: var(--text-muted);
+  }
+
+  .dm-notification-item__timestamp {
+    font-variant-numeric: tabular-nums;
+    white-space: nowrap;
+  }
+
+  .dm-notification-item--info {
+    background: var(--status-info-surface);
+    border-color: var(--status-info-border);
+    color: var(--status-info-on);
+  }
+
+  .dm-notification-item--success {
+    background: var(--status-success-surface);
+    border-color: var(--status-success-border);
+    color: var(--status-success-on);
+  }
+
+  .dm-notification-item--warning {
+    background: var(--status-warning-surface);
+    border-color: var(--status-warning-border);
+    color: var(--status-warning-on);
+  }
+
+  .dm-notification-item--error {
+    background: var(--status-danger-surface);
+    border-color: var(--status-danger-border);
+    color: var(--status-danger-on);
+  }
+
+  .reply-highlight {
+    padding: var(--space-xs) var(--space-sm);
+    border-radius: var(--radius-md);
+    border: var(--border-width-hairline) solid var(--reply-highlight-border);
+    background: var(--reply-highlight-background);
+    color: var(--reply-highlight-text);
+  }
+
+  .reply-highlight svg {
+    color: var(--reply-highlight-icon);
+  }
+
+  .dm-composer {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-xs);
+  }
+
+  .dm-composer__label {
+    font-size: var(--font-size-xs);
+    color: var(--text-muted);
+  }
+
+  .dm-composer__input {
+    resize: vertical;
+    border-radius: var(--radius-md);
+    border: var(--border-width-hairline) solid var(--border-default);
+    background: var(--surface-base);
+    color: var(--text-primary);
+    padding: var(--space-sm);
+    font-family: inherit;
+  }
+
+  .dm-composer__input:focus-visible {
+    outline: var(--space-3xs) solid var(--color-accent);
+    outline-offset: var(--space-3xs);
+  }
+
+  .dm-composer__actions {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    gap: var(--space-sm);
+  }
+
+  .dm-composer__tools {
+    display: flex;
+    align-items: center;
+    gap: var(--space-sm);
+    flex-wrap: wrap;
+    position: relative;
+  }
+
+  .dm-composer__hint {
+    font-size: var(--font-size-2xs);
+    color: var(--text-muted);
+  }
+
+  .dm-composer__attach,
+  .dm-composer__more-btn {
+    border-radius: var(--radius-md);
+    border: var(--border-width-hairline) solid var(--border-default);
+    background: var(--surface-base);
+    color: var(--text-muted);
+    padding: var(--space-2xs) var(--space-sm);
+    font-size: var(--font-size-2xs);
+    cursor: pointer;
+  }
+
+  .dm-composer__more-btn {
+    font-weight: 700;
+    line-height: 1;
+    min-width: 2rem;
+  }
+
+  .dm-composer__more-menu {
+    position: absolute;
+    bottom: 100%;
+    left: 0;
+    margin-bottom: var(--space-xs);
+    background: var(--surface-overlay-panel);
+    border: var(--border-width-hairline) solid var(--border-default);
+    border-radius: var(--radius-md);
+    box-shadow: var(--shadow-popover);
+    z-index: 10;
+    display: flex;
+    flex-direction: column;
+    min-width: 8rem;
+    padding: var(--space-xs);
+  }
+
+  .dm-composer__menu-item {
+    text-align: left;
+    padding: var(--space-xs) var(--space-sm);
+    border-radius: var(--radius-sm);
+    font-size: var(--font-size-xs);
+    color: var(--text-muted);
+    background: transparent;
+    border: none;
+    cursor: pointer;
+    transition: background var(--motion-duration-fast) ease-out;
+  }
+
+  .dm-composer__menu-item:hover,
+  .dm-composer__menu-item:focus-visible {
+    background: var(--surface-overlay-panel-soft);
+    color: var(--text-primary);
+    outline: none;
+  }
+
+  .dm-composer__menu-item[aria-pressed="true"] {
+    background: var(--color-accent);
+    color: var(--color-white);
+  }
+
+  .dm-composer__attach:hover,
+  .dm-composer__attach:focus-visible,
+  .dm-composer__more-btn:hover,
+  .dm-composer__more-btn:focus-visible {
+    background: var(--surface-overlay-panel-soft);
+    color: var(--text-primary);
+    outline: none;
+  }
+
+  .dm-composer__send {
+    border-radius: var(--radius-md);
+    border: var(--border-width-hairline) solid var(--border-strong);
+    background: var(--surface-overlay-panel);
+    color: var(--text-primary);
+    padding: var(--space-xs) var(--space-md);
+    font-weight: 600;
+    cursor: pointer;
+  }
+
+  .dm-composer__send:hover,
+  .dm-composer__send:focus-visible {
+    background: var(--surface-overlay-panel-soft);
+    outline: none;
+  }
+
+  .dm-composer__zap-panel {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-xs);
+    padding: var(--space-sm);
+    border-radius: var(--radius-md);
+    border: var(--border-width-hairline) solid var(--border-subtle);
+    background: var(--surface-sunken);
+  }
+
+  .dm-composer__zap-recipient {
+    font-size: var(--font-size-xs);
+    font-weight: 600;
+    color: var(--text-primary);
+  }
+
+  .dm-composer__zap-address {
+    font-size: var(--font-size-2xs);
+    color: var(--text-muted);
+  }
+
+  .dm-composer__zap-label {
+    font-size: var(--font-size-2xs);
+    text-transform: uppercase;
+    letter-spacing: var(--tracking-wide);
+    color: var(--text-muted);
+  }
+
+  .dm-composer__zap-input {
+    border-radius: var(--radius-md);
+    border: var(--border-width-hairline) solid var(--border-default);
+    background: var(--surface-base);
+    color: var(--text-primary);
+    padding: var(--space-2xs) var(--space-sm);
+    font-size: var(--font-size-xs);
+    font-family: inherit;
+  }
+
+  .dm-composer__zap-input:focus-visible {
+    outline: var(--size-2px) solid var(--color-accent);
+    outline-offset: var(--size-2px);
+  }
+
+  .dm-composer__zap-actions {
+    display: flex;
+    justify-content: flex-end;
+  }
+
+  .dm-composer__zap-send {
+    border-radius: var(--radius-md);
+    border: var(--border-width-hairline) solid var(--border-strong);
+    background: var(--surface-overlay-panel);
+    color: var(--text-primary);
+    padding: var(--space-2xs) var(--space-md);
+    font-size: var(--font-size-xs);
+    font-weight: 600;
+    cursor: pointer;
+  }
+
+  .dm-composer__zap-send:hover,
+  .dm-composer__zap-send:focus-visible {
+    background: var(--surface-overlay-panel-soft);
+    outline: none;
+  }
+
+  .dm-composer__zap-status {
+    font-size: var(--font-size-2xs);
+    color: var(--text-muted);
+    min-height: var(--space-md);
+  }
+
+  .dm-composer__zap-status[data-state="error"] {
+    color: var(--status-danger);
+  }
+
+  .dm-composer__zap-status[data-state="success"] {
+    color: var(--status-success);
+  }
+
+  .dm-composer__status {
+    font-size: var(--font-size-2xs);
+    color: var(--status-danger);
+    min-height: var(--space-md);
+  }
+
+  @media (min-width: theme("screens.md")) {
+    .dm-app-shell {
+      flex-direction: row;
+      align-items: stretch;
+    }
+
+    .dm-app-shell__sidebar {
+      flex: 0 0 var(--size-18rem);
+      max-width: var(--size-20rem);
+      height: calc(100vh - var(--space-lg) * 2);
+    }
+
+    .dm-app-shell__main {
+      height: calc(100vh - var(--space-lg) * 2);
+    }
+
+    .dm-conversation-list__items {
+      max-height: none;
+      flex: 1;
+    }
+  }
+
+  @media (min-width: theme("screens.md")) {
+    .profile-modal .dm-app-shell {
+      flex-direction: row;
+      align-items: stretch;
+    }
+
+    .profile-modal .dm-app-shell__sidebar {
+      flex: 0 0 var(--size-18rem);
+      max-width: var(--size-20rem);
+      height: auto;
+    }
+
+    .profile-modal .dm-app-shell__main {
+      flex: 1 1 auto;
+      height: auto;
+    }
+  }
+
+  @media (min-width: theme("screens.lg")) {
+    .dm-app-shell__sidebar {
+      flex-basis: var(--size-20rem);
+    }
+
+    .dm-message-thread__timeline {
+      padding: var(--space-md);
+    }
+  }
+}
diff --git a/css/tailwind.source.css b/css/tailwind.source.css
index 90bd850f..92fd2e3e 100644
--- a/css/tailwind.source.css
+++ b/css/tailwind.source.css
@@ -5798,3 +5798,28 @@
     }
   }
 }
+
+/* Profile Modal Full Screen Overrides */
+#profileModal {
+  padding: 0;
+  width: 100vw;
+  height: 100vh;
+  max-width: none;
+  max-height: none;
+}
+
+#profileModal .bv-modal__panel {
+  width: 100%;
+  height: 100%;
+  max-width: none;
+  max-height: none;
+  border-radius: 0;
+  border: none;
+}
+
+/* Override responsive max-height constraint */
+@media (min-width: theme("screens.lg")) {
+  #profileModal .profile-modal {
+    max-block-size: none;
+  }
+}