/* Shared presentation only: the category players and voting controls stay intact. */
.tops-education { width: 100%; text-align: center; padding: 0 0 24px; }
.tops-home-education, .tops-home-footer { width: 100%; }
.tops-education h1 { font: 700 36px/1.15 Insatiable, sans-serif; letter-spacing: 0; color: var(--white); margin: 0 0 12px; }
.tops-education p, .tops-committee p { font: 14px/1.6 sans-serif; color: var(--white); letter-spacing: 0; max-width: 640px; margin: 0 auto; }
.tops-contributions { display: flex; justify-content: center; align-items: center; gap: 24px; margin-top: 20px; }
.tops-contributions div { display: flex; flex-direction: column; gap: 4px; }
.tops-contributions strong { font: 700 28px/1.1 Insatiable, sans-serif; color: var(--gold); letter-spacing: 0; }
.tops-contributions span { color: var(--white); font: 13px/1.4 sans-serif; letter-spacing: 0; }
.tops-committee { width: 100%; border-top: 1px solid var(--border-gold); padding: 16px 0; margin: 24px 0 8px; text-align: left; }
.tops-committee summary { cursor: pointer; font-size: 20px; letter-spacing: 0; color: var(--white); min-height: 44px; }
.tops-committee p { margin: 0 0 16px; }
.tops-committee ul { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.tops-committee li { display: flex; align-items: center; gap: 12px; font-size: 20px; min-width: 0; overflow-wrap: anywhere; }
.tops-committee img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.tops-share { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px; margin: 20px 0; width: 100%; }
.tops-share-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 44px; white-space: normal; letter-spacing: 0; }
.tops-share-button svg { flex-shrink: 0; }
.tops-copy-button { background: none; border: 0; color: var(--white); font: 16px/1.4 Insatiable, sans-serif; cursor: pointer; min-height: 44px; padding: 8px; letter-spacing: 0; }
.tops-share [role="status"] { flex-basis: 100%; text-align: center; font: 12px/1.4 sans-serif; color: var(--gold); }
.tops-reveal { display: flex; flex-direction: column; gap: 8px; margin: 20px 0; color: var(--white); font: 14px/1.5 sans-serif; letter-spacing: 0; text-align: center; }
.tops-reveal strong { color: var(--gold); font: 700 22px/1.2 Insatiable, sans-serif; }
.tops-copy-link { width: 100%; color: var(--white); background: var(--bg); border: 1px solid var(--border-gold); }
.tops-share button:focus-visible, .tops-committee summary:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
@media (max-width: 700px) {
  .tops-education h1 { font-size: 30px; }
  .tops-contributions { gap: 12px; }
  .tops-contributions strong { font-size: 24px; }
  .tops-committee ul { grid-template-columns: minmax(0, 1fr); }
  .tops-share-button { max-width: 100%; }
}
.tops-mobile-sidebar { display: contents; }
.tops-video-details, .tops-rotate-hint, .tops-auth-orientation { display: none; }

/* Fan-only presentation reuses the public gallery primitives. */
:is(.tops-fan-gallery,.tops-committee-gallery) #screen-intro .intro-content { width: min(940px, 100%); margin: auto; gap: 16px; padding: 24px max(20px, env(safe-area-inset-right)) 24px max(20px, env(safe-area-inset-left)); flex: none; }
.tops-fan-step { color: var(--gold); font-size: 16px; letter-spacing: 0; }
:is(.tops-fan-gallery,.tops-committee-gallery) .intro-logo-l1plus, :is(.tops-fan-gallery,.tops-committee-gallery) .intro-mcdo-logo { height: 28px; }
:is(.tops-fan-gallery,.tops-committee-gallery) .intro-logo-top { width: 200px; }
:is(.tops-fan-gallery,.tops-committee-gallery) .intro-title { font-size: 48px; letter-spacing: 0; }
:is(.tops-fan-gallery,.tops-committee-gallery) .intro-sub { font-size: 18px; letter-spacing: 0; }
.tops-finalists { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; width: 100%; }
.tops-finalist.synth-card { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 10px; min-width: 0; margin: 0; padding: 16px 12px; color: var(--white); background: var(--bg2); border: 1px solid var(--border); border-radius: 4px; cursor: pointer; text-align: center; font-family: inherit; letter-spacing: 0; }
.tops-finalist:hover { border-color: var(--gold); }
.tops-finalist .club-logo { height: 44px; width: 44px; object-fit: contain; }
.tops-finalist-info { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.tops-finalist-info strong { font-size: 22px; line-height: 1.1; overflow-wrap: anywhere; }
.tops-finalist-info>span { font: 12px/1.4 sans-serif; color: var(--gray); overflow-wrap: anywhere; }
:is(.tops-fan-gallery,.tops-committee-gallery) .work-header { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; }
:is(.tops-fan-gallery,.tops-committee-gallery) .work-ref { min-width: 0; white-space: normal; letter-spacing: 0; display: flex; flex-direction: column; gap: 4px; }
.tops-fan-category { font-size: 22px; color: var(--white); }
.tops-fan-position { font-size: 14px; color: var(--gray); }
.tops-video-shortcuts { gap: 4px; }
.tops-video-shortcuts .btn-nav { padding: 0; width: 44px; height: 44px; min-width: 44px; font-size: 16px; color: var(--white); letter-spacing: 0; }
.tops-video-shortcuts [aria-current] { border-color: var(--gold); background: var(--gold-dim); color: var(--gold); }
.tops-fan-choice { display: inline-flex; justify-content: center; align-items: center; gap: 8px; white-space: normal; min-height: 44px; }
.tops-fan-choice svg { flex-shrink: 0; }
.tops-fan-continue { white-space: normal; min-height: 44px; }
.tops-fan-continue:disabled { opacity: .35; cursor: not-allowed; }
.tops-finalist:focus-visible, .tops-video-shortcuts button:focus-visible, .tops-fan-choice:focus-visible, .tops-fan-continue:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }

@media (max-width: 700px) {
  :is(.tops-fan-gallery,.tops-committee-gallery) #btn-enter { width: 100%; max-width: none; align-self: stretch; }
  :is(.tops-fan-gallery,.tops-committee-gallery) #screen-intro .intro-content { padding-top: 20px; gap: 12px; }
  .tops-finalists { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .tops-finalist.synth-card { display: grid; grid-template-columns: 20px 40px minmax(0, 1fr); gap: 12px; align-items: center; text-align: left; padding: 10px 12px; }
  .tops-finalist .club-logo { height: 36px; width: 36px; }
  .tops-finalist-info { gap: 3px; }
  .tops-finalist-info strong { font-size: 20px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .intro-logo-top { width: 160px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .intro-title { font-size: 36px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header { grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .work-ref { grid-column: 1; grid-row: 1; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .work-header .pm-cgroup { grid-column: 2; grid-row: 1; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-video-shortcuts { grid-column: 1 / -1; grid-row: 2; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .acquire-bar { grid-auto-flow: row; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) minmax(0, 1fr); }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-fan-continue { grid-column: 1 / -1; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .work-header .collection-count { display: none; }
}

@media (max-width: 700px), (max-width: 1100px) and (max-height: 600px) and (orientation: landscape) and (pointer: coarse) {
  .tops-work-screen { overflow-x: hidden; }
  .tops-mobile-sidebar { display: flex; flex-direction: column; min-width: 0; }
  .tops-work-screen .work-header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 12px;
    padding: max(8px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) 8px max(12px, env(safe-area-inset-left));
  }
  .tops-work-screen .progress-dots { justify-content: center; min-width: 0; flex-wrap: wrap; }
  .tops-work-screen .pm-cgroup { min-width: 0; }
  .tops-work-screen .pm-btn.pm-inline { width: 44px; height: 44px; margin-left: 6px; }
  .tops-work-screen .work-overlay, .tops-work-screen .work-overlay-mini { display: none; }
  .tops-work-screen .video-wrapper { display: block; flex: none; }
  .tops-work-screen .video-container { width: 100%; height: auto; min-height: 0; aspect-ratio: 16 / 9; }
  .tops-video-details {
    display: block;
    padding: 14px max(16px, env(safe-area-inset-right)) 12px max(16px, env(safe-area-inset-left));
    background: var(--bg);
  }
  .tops-video-details .work-cartel-title { font-size: 24px !important; line-height: 1.1; letter-spacing: 0; margin-bottom: 8px; text-shadow: none; overflow-wrap: anywhere; }
  .tops-video-details .work-cartel-rule, .tops-video-details .work-cartel-sep { display: none; }
  .tops-video-details .work-cartel-meta { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; }
  .tops-video-details .work-cartel-match { flex-wrap: wrap; gap: 5px; font-size: 12px; letter-spacing: 0; min-width: 0; }
  .tops-video-details .work-cartel-match span { overflow-wrap: anywhere; }
  .tops-video-details .club-logo-sm { height: 20px; flex-shrink: 0; }
  .tops-video-details .work-cartel-collection { letter-spacing: 0; color: var(--gray); }
  .tops-work-screen .acquire-bar {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
    gap: 8px;
    padding: 10px max(12px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
  }
  .tops-work-screen .acquire-bar button { min-width: 0; min-height: 44px; padding: 10px 6px; font-size: 14px; line-height: 1.2; letter-spacing: 0; white-space: normal; overflow-wrap: anywhere; }
  .tops-rotate-hint { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 8px 20px 16px; color: var(--gray); font: 12px/1.5 sans-serif; letter-spacing: 0; text-align: left; }
  .tops-rotate-hint svg { width: 22px; height: 22px; flex-shrink: 0; color: var(--gold); }
  .pm-panel { padding-top: max(16px, env(safe-area-inset-top)); padding-right: max(16px, env(safe-area-inset-right)); padding-bottom: max(16px, env(safe-area-inset-bottom)); }
  .pm-close { min-width: 44px; min-height: 44px; }
  .seal-modal-overlay.active { padding: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); }
  .seal-modal-overlay .seal-modal-card { min-height: 0; max-height: 100%; overflow-y: auto; }
  .seal-modal-card button, .seal-modal-card a { min-height: 44px; }
}

/* Wide phones are still phones after rotation; mouse-driven desktop is unchanged. */
@media (max-width: 1100px) and (max-height: 600px) and (orientation: landscape) and (pointer: coarse) {
  .tops-work-screen {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(190px, 26%);
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }
  .tops-work-screen .work-header { grid-column: 1 / -1; padding: max(4px, env(safe-area-inset-top)) 12px 4px; }
  .tops-work-screen .video-wrapper { width: 100%; height: 100%; min-height: 0; }
  .tops-work-screen .video-container { height: 100%; min-height: 0; aspect-ratio: auto; }
  .tops-mobile-sidebar { display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow-y: auto; border-left: 1px solid var(--border); background: var(--bg); }
  .tops-video-details { padding: 12px; flex: 0 1 auto; min-height: 0; overflow-y: auto; }
  .tops-video-details .work-cartel-title { font-size: 22px !important; }
  .tops-video-details .work-cartel-meta { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .tops-work-screen .acquire-bar { grid-auto-flow: row; grid-template-columns: minmax(0, 1fr); gap: 6px; padding: 8px 12px max(8px, env(safe-area-inset-bottom)); margin-top: auto; flex-shrink: 0; }
  .tops-rotate-hint { display: none; }
  body .tops-closed-banner { padding: 4px 12px; font-size: 11px; letter-spacing: 0; flex-shrink: 0; }
  body .tops-closed-banner small { display: inline; margin: 0 0 0 8px; }
  #tops-info-modal { padding: max(8px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); }
  #tops-info-modal .seal-modal-card { max-height: 100%; padding: 16px; gap: 12px; }
  #tops-info-modal .seal-modal-item { padding: 8px 0; }
  #tops-info-modal .seal-modal-title { font-size: 24px; }
  #tops-info-modal .seal-modal-sub { margin-top: 8px; line-height: 1.4; }
  #tops-info-modal .tops-prize { padding: 10px 0; margin-bottom: 12px; }
  .tops-auth-orientation { display: block; color: var(--gray); font: 12px/1.5 sans-serif; letter-spacing: 0; margin-top: 8px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header { grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .work-ref, :is(.tops-fan-gallery,.tops-committee-gallery) .tops-video-shortcuts, :is(.tops-fan-gallery,.tops-committee-gallery) .work-header .pm-cgroup { grid-row: 1; grid-column: auto; }
  .tops-fan-category { font-size: 18px; }
  .tops-fan-position { font-size: 12px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .work-header .collection-count { display: none; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .acquire-bar { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-auto-flow: row; gap: 6px; padding: 6px 8px max(6px, env(safe-area-inset-bottom)); }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-fan-choice { grid-column: 1 / -1; grid-row: 1; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-fan-continue { grid-column: 1 / -1; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .acquire-bar button { font-size: 13px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) #screen-intro .intro-content { padding-top: 12px; }
  .tops-finalists { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .tops-finalist.synth-card { display: flex; text-align: center; gap: 6px; padding: 10px 6px; }
  .tops-finalist-info strong { font-size: 18px; }
}
/* Homepage visual treatment: public fans only; gallery and committee nodes unchanged. */
.tops-fan-home { --home-image-shade: color-mix(in srgb, var(--bg) 20%, transparent); --home-text-shadow: 0 2px 8px var(--bg); }
.tops-fan-home #vote-cards .card { background-size: cover; background-position: center; aspect-ratio: 3 / 4; justify-content: center; min-width: 0; background-color: var(--surface); }
.tops-fan-home #vote-cards .card-logo, .tops-fan-home #vote-cards .card-sub, .tops-fan-home #vote-cards .card-status, .tops-fan-home #vote-cards .card-arrow { position: relative; text-shadow: var(--home-text-shadow); }
.tops-fan-home #vote-cards .card-sub { color: var(--white); background: var(--home-image-shade); padding: 5px 8px; }
.tops-fan-home .tops-home-education { margin: 32px 0 0; border: 1px solid var(--border-gold); padding: 32px; }
.tops-home-footer a { color: var(--muted); font: 12px/1.5 sans-serif; letter-spacing: 0; text-underline-offset: 3px; }
.tops-home-footer a:hover { color: var(--white); }
.tops-fan-home .tops-education { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 32px; text-align: left; padding: 0; align-items: center; }
.tops-education h2 { font: 700 30px/1.15 Insatiable,sans-serif; color: var(--white); letter-spacing: 0; margin-bottom: 12px; }
.tops-fan-home .tops-education p { margin: 0; }
.tops-fan-home .tops-contributions { justify-content: flex-start; gap: 18px; }
.tops-committee-names { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); list-style: none; gap: 12px 20px; text-align: left; }
.tops-committee-names li { font: 18px/1.3 Insatiable,sans-serif; color: var(--white); overflow-wrap: anywhere; letter-spacing: 0; }
#tops-home-prize { width: 100%; }
.tops-prize.tops-prize-illustrated { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.2fr); align-items: center; gap: 32px; text-align: left; padding: 24px 0; }
.tops-prize-image { display: block; width: 100%; height: auto; max-height: 240px; object-fit: contain; }
.pm-nav .tops-share { margin: 14px 0 0; justify-content: flex-start; gap: 4px; }
.pm-nav .tops-share-button, .pm-nav .pm-cookie-settings { display: flex; align-items: center; justify-content: flex-start; gap: 12px; width: 100%; min-height: 44px; padding: 12px 14px; border: 0; border-radius: 8px; background: none; color: inherit; text-align: left; font: 18px/1.3 Insatiable,sans-serif; letter-spacing: 0; cursor: pointer; }
.pm-nav .tops-share-button:hover, .pm-nav .pm-cookie-settings:hover { background: var(--border); }
.pm-nav .tops-share-button:disabled { cursor: wait; }
.pm-nav .tops-share [role="status"]:empty, .pm-cookie-status:empty { display: none; }
.pm-nav .tops-share [role="status"], .pm-cookie-status { display: block; text-align: left; padding: 0 14px; color: var(--gold); font: 12px/1.5 sans-serif; }
.tops-share-spinner { animation: tops-share-spin .8s linear infinite; flex-shrink: 0; }
@keyframes tops-share-spin { to { transform: rotate(360deg); } }
@media (max-width: 800px) {
  .tops-fan-home .tops-education { grid-template-columns: minmax(0,1fr); gap: 20px; }
  .tops-committee-names { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 640px) {
  .tops-fan-home #vote-cards .card { aspect-ratio: 16 / 9; padding: 16px 20px; }
  .tops-fan-home #vote-cards .card-logo { width: 140px; margin-bottom: 10px; }
  .tops-fan-home #vote-cards .card-arrow { margin-top: 8px; }
  .tops-fan-home .tops-home-education { margin-top: 24px; padding: 24px 20px; }
  .tops-fan-home .tops-contributions { gap: 12px; }
  .tops-fan-home .tops-contributions strong { font-size: 22px; }
  .tops-committee-names { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px 16px; }
  .tops-prize.tops-prize-illustrated { grid-template-columns: minmax(0,1fr); gap: 16px; text-align: center; }
  .tops-prize-image { max-height: 200px; }
}
@media (prefers-reduced-motion: reduce) { .tops-share-spinner { animation: none; } }

.tops-footer-cookie { background: none; border: 0; padding: 8px; color: inherit; font: 14px/1.4 sans-serif; text-decoration: underline; cursor: pointer; }
.tops-home-footer { --footer-surface: #262624; --footer-foreground: #fff; --footer-muted: color-mix(in srgb, var(--footer-foreground) 90%, transparent); --footer-copyright: color-mix(in srgb, var(--footer-foreground) 60%, transparent); --footer-icon-surface: color-mix(in srgb, var(--footer-foreground) 10%, transparent); --footer-icon-hover: color-mix(in srgb, var(--footer-foreground) 20%, transparent); margin-top: 32px; background: var(--footer-surface); text-align: left; }
.l1f { max-width: 1152px; margin: 0 auto; padding: 40px 20px; }
.l1f-columns { display: grid; grid-template-columns: minmax(0,1fr); gap: 40px; }
.l1f-column h3 { color: var(--footer-foreground); font: 400 18px/28px Insatiable,sans-serif; text-transform: uppercase; letter-spacing: 0; margin: 0 0 20px; }
.l1f-column ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; }
.tops-home-footer .l1f-column a { color: var(--footer-muted); font: 15px/22.5px sans-serif; text-decoration: none; }
.tops-home-footer .l1f-column a:hover { color: var(--footer-foreground); }
.l1f-divider { height: 1px; background: var(--footer-icon-surface); margin: 32px 0; }
.l1f-bottom { display: flex; flex-direction: column; gap: 24px; }
.l1f-stores { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.l1f-store img { display: block; height: 44px; width: auto; max-width: 100%; }
.l1f-social { display: flex; align-items: center; gap: 12px; max-width: 100%; }
.tops-home-footer a.l1f-icon { display: grid; place-items: center; width: 36px; height: 36px; flex-shrink: 0; background: var(--footer-icon-surface); border-radius: 6px; }
.l1f-icon img { width: 16px; height: 16px; object-fit: contain; }
.l1f-store:hover { opacity: .9; }
.tops-home-footer a.l1f-icon:hover { background: var(--footer-icon-hover); }
.l1f-copyright { color: var(--footer-copyright); font: 12px/16px sans-serif; margin: 0; }
.l1f .tops-footer-cookie { color: var(--footer-muted); font: 14px/22.5px sans-serif; text-decoration: none; padding: 0; text-align: left; }
.l1f .tops-footer-cookie:hover { color: var(--footer-foreground); text-decoration: underline; }
.l1f a:focus-visible, .l1f button:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
.l1f .pm-cookie-status { padding: 8px 0 0; text-align: left; }
@media (min-width: 640px) { .l1f { padding: 56px 32px; } }
@media (min-width: 768px) { .l1f-columns { grid-template-columns: repeat(3,minmax(0,1fr)); } .l1f-bottom { flex-direction: row; align-items: center; justify-content: space-between; } .l1f-copyright { text-align: right; } }
@media (min-width: 768px) and (max-width: 1100px) { .l1f-bottom { flex-wrap: wrap; } }
@media (max-width: 420px) { .l1f-social { gap: 8px; } }

/* Homepage intro: title + contest merged above the Top cards. */
.tops-fan-home .vote-greeting { font-size: 32px; margin-bottom: 0; padding-bottom: 20px; border-bottom: 0; }
.tops-fan-home #tops-home-prize { margin-bottom: 32px; }
.tops-fan-home #tops-home-prize .tops-prize { border-top: 0; margin-bottom: 0; padding-top: 0; }
.tops-fan-home #vote-cards .card-logo { width: 260px; margin-bottom: 18px; }
.tops-fan-home #vote-cards .card-sub { font-size: 14px; }
.tops-fan-home #vote-cards .card-arrow { font-size: 28px; }
@media (max-width: 640px) {
  .tops-fan-home .vote-greeting { font-size: 24px; }
  .tops-fan-home #vote-cards .card-logo { width: 180px; margin-bottom: 10px; }
  .tops-fan-home #vote-cards .card-sub { font-size: 12px; }
  .tops-fan-home #vote-cards .card-arrow { font-size: 22px; margin-top: 6px; }
}
/* Finalists intro: larger category logo, aligned card content on desktop/tablet. */
:is(.tops-fan-gallery,.tops-committee-gallery) .intro-logo-top { width: 280px; }
@media (min-width: 641px) {
  .tops-finalist.synth-card { position: relative; padding-top: 40px; }
  .tops-finalist .synth-num { position: absolute; top: 10px; left: 10px; }
  .tops-finalist .club-logo { flex-shrink: 0; }
  .tops-finalist-info { flex: 1; width: 100%; }
  .tops-finalist-info strong { min-height: 2.2em; display: flex; align-items: center; justify-content: center; }
  .tops-finalist-info > span { margin-top: auto; }
}
@media (max-width: 640px) { :is(.tops-fan-gallery,.tops-committee-gallery) .intro-logo-top { width: 220px; } }
body.tops-has-footer { padding-bottom: 0 !important; display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; margin: 0; }
body.tops-has-footer > * { flex-shrink: 0; }
body.tops-has-footer > .tops-home-footer { margin: auto -24px 0 !important; width: calc(100% + 48px) !important; width: 100%; max-width: none; border-radius: 0; box-sizing: border-box; }

/* Home hero + reusable tutorial */
.tops-fan-home .tops-home-education { margin-bottom: 48px; }
.tops-fan-home .vote-greeting { width: 100%; max-width: 1180px; letter-spacing: 0; margin-bottom: 40px; }
.tops-hero-title { display: block; font: 300 56px/1.08 Insatiable, 'Arial Narrow', sans-serif; color: color-mix(in srgb, var(--white) 75%, transparent); text-align: center; letter-spacing: 0; }
.tops-hero-title strong { color: var(--gold); font-weight: 300; }
.tops-hero-prize { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 4px; }
.tops-hero-ticket { width: 150px; height: auto; transform: rotate(14deg); margin-left: -150px; }
.vote-greeting .vote-dates { font: 700 15px/1.2 Insatiable, sans-serif; letter-spacing: .2em; color: var(--white); }
.tops-tuto { list-style: none; margin: 32px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; width: 100%; }
.tops-tuto-step { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; min-width: 0; padding: 0 8px; }
.tops-tuto-icon { position: relative; width: 80px; height: 80px; display: grid; place-items: center; margin-bottom: 8px; color: var(--white); }
.tops-tuto-main { width: 60px; height: 60px; }
.tops-tuto-step strong { font: 700 26px/1.1 Insatiable, sans-serif; color: var(--white); letter-spacing: 0; }
.tops-tuto-step p { margin: 0; font: 17px/1.4 sans-serif; color: var(--white); letter-spacing: 0; max-width: 280px; text-transform: none; }
.tops-tuto-next { position: absolute; right: -24px; top: 50px; width: 40px; height: 40px; color: var(--white); }
.tops-tuto-check { position: absolute; right: 0; bottom: 6px; width: 36px; height: 36px; color: var(--gold); background: var(--bg); border-radius: 50%; stroke-width: 2.5; }
.tops-tuto-badge { position: absolute; right: 6px; bottom: 6px; width: 30px; height: 30px; border-radius: 50%; background: #1a5cff; color: var(--white); font: italic 700 18px/30px Insatiable, sans-serif; text-align: center; border: 2px solid var(--bg); }
.tops-tuto-sparkle { position: absolute; top: -6px; left: 50%; width: 44px; height: 20px; transform: translateX(-60%); }
.tops-tuto-sparkle i { position: absolute; width: 3px; height: 10px; background: var(--gold); border-radius: 2px; bottom: 0; }
.tops-tuto-sparkle i:nth-child(1) { left: 4px; transform: rotate(-40deg); }
.tops-tuto-sparkle i:nth-child(2) { left: 20px; bottom: 6px; }
.tops-tuto-sparkle i:nth-child(3) { left: 36px; transform: rotate(40deg); }
@media (max-width: 1024px) { .tops-hero-title { font-size: 40px; } .tops-hero-ticket { width: 110px; margin-left: -110px; } }
@media (max-width: 640px) {
  .tops-hero-title { font-size: 28px; }
  .tops-hero-prize { flex-direction: column; gap: 8px; }
  .tops-hero-ticket { width: 96px; margin: 8px 0 0; transform: rotate(10deg); }
  .tops-tuto { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; gap: 16px; padding: 0 12% 8px; scrollbar-width: none; }
  .tops-tuto::-webkit-scrollbar { display: none; }
  .tops-tuto-step { flex: 0 0 76%; scroll-snap-align: center; border: 1px solid var(--border); padding: 20px 12px; }
  .tops-tuto-next { display: none; }
  .tops-tuto-step strong { font-size: 22px; }
  .tops-tuto-step p { font-size: 15px; }
}
.tops-fan-home .vote-greeting { max-width: 1280px; }
@media (min-width: 1025px) { .tops-hero-title { font-size: 52px; white-space: nowrap; } .tops-hero-prize { white-space: normal; } }
@media (max-width: 640px) { .tops-tuto { align-items: flex-start; } }

/* Tutorial v2 */
.tops-tuto { border: 1px solid var(--border); border-radius: 16px; padding: 24px 16px; gap: 16px; }
.tops-tuto-icon { width: 48px; height: 48px; margin-bottom: 12px; }
.tops-tuto-main { width: 36px; height: 36px; }
.tops-tuto-icon-img { width: 88px; }
.tops-tuto-icon-img img { width: 100%; height: 100%; object-fit: contain; }
.tops-tuto-copy { display: flex; flex-direction: column; gap: 8px; }
.tops-tuto-step strong { font: 700 24px/1.1 Insatiable, sans-serif; text-transform: uppercase; }
.tops-tuto-step p { font: 400 16px/1.4 Insatiable, sans-serif; max-width: 300px; margin: 0 auto; }
@media (max-width: 640px) {
  .tops-tuto { display: flex; flex-direction: column; overflow: visible; padding: 16px; gap: 16px; align-items: stretch; }
  .tops-tuto-step { flex: none; flex-direction: row; align-items: center; text-align: left; gap: 16px; border: 0; padding: 0; }
  .tops-tuto-icon { flex: 0 0 56px; width: 56px; height: 48px; margin: 0; }
  .tops-tuto-icon-img { flex-basis: 56px; }
  .tops-tuto-copy { gap: 4px; min-width: 0; }
  .tops-tuto-step strong { font-size: 18px; }
  .tops-tuto-step p { font-size: 14px; margin: 0; max-width: none; }
}

/* Hero title as one sentence + tighter spacing */
.tops-hero-title .tops-hero-prize { display: inline; margin: 0; }
.tops-fan-home .vote-greeting { margin-bottom: 24px; }

/* Rotate hint: framed + animated */
.tops-rotate-hint { border: 1px solid var(--border-gold); border-radius: 12px; padding: 12px 16px; background: color-mix(in srgb, var(--gold) 8%, transparent); color: var(--white) !important; font-size: 13px !important; }
.tops-rotate-hint svg { width: 28px !important; height: 28px !important; animation: tops-rotate-phone 2.4s ease-in-out infinite; transform-origin: center; }
@keyframes tops-rotate-phone { 0%, 20% { transform: rotate(0); } 45%, 70% { transform: rotate(-90deg); } 95%, 100% { transform: rotate(0); } }
@media (prefers-reduced-motion: reduce) { .tops-rotate-hint svg { animation: none; } }

/* Closed/upcoming banner acts as the header: the menu stays inside it, on every viewport. */
body.tops-has-banner .tops-closed-banner { box-sizing: border-box; min-height: 50px; display: flex; flex-direction: column; justify-content: center; padding-left: 64px; padding-right: 64px; }
body.tops-has-banner .pm-bar { top: 4px !important; }
@media (max-width: 700px) {
  body.tops-has-banner .tops-closed-banner { padding-left: 52px; padding-right: 52px; }
  body.tops-has-banner .pm-bar { top: 7px !important; right: 8px; }
}

/* Homepage: Top logos turn white on hover; tutorial copy uses the title white. */
.tops-fan-home #vote-cards .card-logo { transition: transform .2s, filter .2s; }
.tops-fan-home #vote-cards .card:hover .card-logo { filter: brightness(0) invert(1); }
.tops-fan-home .tops-tuto .tops-tuto-step p { color: var(--white, #f5f0e8); opacity: 1; }

/* Lien Règlement : accueil (avant footer) et sidebar (après les dates) */
.tops-home-rules-wrap{display:flex;align-items:center;justify-content:center;min-height:56px;margin:32px 0 48px;padding:12px 16px;text-align:center}
.tops-home-rules,.pm-rules{color:var(--gold);font:14px/1.4 Insatiable,sans-serif;text-decoration:underline;text-underline-offset:3px}
.pm-rules{display:inline-block;margin-top:8px}
.tops-home-rules:hover,.pm-rules:hover{color:var(--white)}

/* Video pages: the heart counter matches the 1–5 shortcut buttons height. */
.tops-work-screen .work-header .collection-count, .work-header .pm-cgroup .collection-count { box-sizing: border-box; height: 44px; line-height: 34px; }
.work-header .pm-cgroup { display: flex; align-items: center; }

#vote-page2.tops-no-rules { padding-bottom: 48px; }
@media (max-width: 767px) { #vote-page2.tops-no-rules { padding-bottom: 32px; } }

/* Bouton « Voter » permanent pendant la période de vote */
.tops-fan-home #vote-cards .card:not(.vote-closed):not(.sealed):not(.locked) .card-arrow { opacity: 1; transform: none; display: inline-flex; align-items: center; gap: 6px; margin-top: 20px; padding: 10px 20px; background: var(--card-color); color: var(--white, #f5f0e8); font: 400 1.2rem/1 Insatiable, sans-serif; text-transform: uppercase; text-shadow: none; transition: filter .2s, transform .2s; }
.tops-fan-home #vote-cards .card:not(.vote-closed):not(.sealed):not(.locked) .card-arrow::before { content: none; }
.tops-fan-home #vote-cards .card:not(.vote-closed):not(.sealed):not(.locked):hover .card-arrow { filter: brightness(1.15); transform: translateY(-2px); }
.tops-fan-home #vote-cards .card.vote-closed .card-arrow { display: none; }
@media (max-width: 640px) { .tops-fan-home #vote-cards .card:not(.vote-closed):not(.sealed):not(.locked) .card-arrow { padding: 8px 16px; margin-top: 10px; } }
.tops-tuto-step strong, .tops-fan-home .tops-tuto .tops-tuto-step strong { font-weight: 200; }
.tops-tuto { border-radius: 0; }

/* Public recap and sandbox header label share the static gallery primitives. */
:root { --tops-buts: #7b42f6; --tops-arrets: #00e55b; --tops-skills: #e8003d; --tops-brand-accent: #FF7FDD; --tops-recap-gold: var(--tops-brand-accent); --tops-brand-border: color-mix(in srgb, var(--tops-brand-accent) 35%, transparent); --tops-cta-shadow: 0 3px 10px color-mix(in srgb, var(--bg) 35%, transparent); --tops-control-surface: color-mix(in srgb, var(--bg) 70%, transparent); --tops-control-shade: linear-gradient(180deg, color-mix(in srgb, var(--bg) 60%, transparent), transparent 35%, transparent 50%, color-mix(in srgb, var(--bg) 85%, transparent)); --tops-control-glow: 0 0 12px color-mix(in srgb, var(--gold) 45%, transparent); --tops-recap-surface: #0d0e19; --tops-recap-muted: #808084; --tops-recap-border: color-mix(in srgb, var(--tops-recap-gold) 35%, transparent); --tops-sandbox: #ffd400; --tops-sandbox-foreground: #07080f; }
.tops-sandbox-label { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; padding: 10px 12px; border-radius: 8px; background: var(--tops-sandbox); color: var(--tops-sandbox-foreground); font: 700 12px/1.2 sans-serif; letter-spacing: 0; white-space: nowrap; pointer-events: none; }
.work-header .tops-sandbox-label { order: 1; }
.work-header .tops-video-shortcuts, .work-header .progress-dots { order: 2; }
.work-header .pm-cgroup { order: 3; }
:is(.tops-fan-gallery,.tops-committee-gallery) .work-header:has(.tops-sandbox-label) { grid-template-columns: minmax(0,1fr) auto auto auto; }
.top-bar .tops-sandbox-label { margin-left: auto; }
.logos:has(.tops-sandbox-label) { flex-wrap: wrap; }
#tops-info-modal.tops-fan-recap .seal-modal-card { position: relative; padding: 40px; gap: 24px; border-radius: 0; background: var(--tops-recap-surface); border-color: var(--tops-recap-border); }
#tops-info-modal.tops-fan-recap .seal-modal-title { font-size: 36px; font-weight: 200; padding-right: 32px; }
#tops-info-modal.tops-fan-recap .gold { color: var(--tops-recap-gold); }
#tops-info-modal.tops-fan-recap .seal-modal-sub { font-size: 18px; line-height: 1.55; margin-top: 20px; color: var(--tops-recap-muted); }
#tops-info-modal.tops-fan-recap .seal-modal-item { padding: 24px 0; gap: 20px; }
#tops-info-modal.tops-fan-recap .seal-modal-name { font-size: 24px; font-weight: 200; }
#tops-info-modal.tops-fan-recap .seal-modal-info { gap: 10px; }
#tops-info-modal.tops-fan-recap .seal-modal-pts { font-size: 20px; }
#tops-info-modal.tops-fan-recap .tops-recap-buts { color: var(--tops-buts); }
#tops-info-modal.tops-fan-recap .tops-recap-arrets { color: var(--tops-arrets); }
#tops-info-modal.tops-fan-recap .tops-recap-skills { color: var(--tops-skills); }
#tops-info-modal.tops-fan-recap .seal-modal-match { font-size: 16px; color: var(--tops-recap-muted); }
#tops-info-modal.tops-fan-recap a.seal-modal-back { font-size: 18px; text-transform: uppercase; text-decoration: underline; text-underline-offset: 3px; flex-shrink: 0; }
#tops-info-modal.tops-fan-recap .btn-primary { background: var(--tops-recap-gold); color: var(--bg); border-color: var(--tops-recap-gold); font: 200 24px/1.4 Insatiable,sans-serif; padding: 24px; width: 100%; }
#tops-info-modal.tops-fan-recap .btn-primary:hover { filter: brightness(1.1); }
#tops-info-modal.tops-fan-recap .tops-recap-rules { align-self: center; margin-top: 12px; }
#tops-info-modal.tops-fan-recap .tops-recap-close { position: absolute; top: 12px; right: 12px; display: grid; place-items: center; width: 44px; height: 44px; background: none; border: 0; padding: 4px; color: var(--white); cursor: pointer; }
.tops-recap-close svg { width: 100%; height: 100%; }
.tops-recap-close:focus-visible, .tops-fan-recap a:focus-visible { outline: 2px solid var(--tops-recap-gold); outline-offset: 2px; }
@media (max-width: 700px) {
  :is(.tops-fan-gallery,.tops-committee-gallery) .work-header:has(.tops-sandbox-label) { grid-template-columns: minmax(0,1fr) auto; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .work-header .tops-sandbox-label { grid-row: 2; grid-column: 1 / -1; justify-self: end; padding: 6px 10px; font-size: 11px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .work-header:has(.tops-sandbox-label) .tops-video-shortcuts { grid-row: 3; }
  #tops-info-modal.tops-fan-recap .seal-modal-card { padding: 32px 20px 24px; gap: 16px; }
  #tops-info-modal.tops-fan-recap .seal-modal-title { font-size: 30px; }
  #tops-info-modal.tops-fan-recap .seal-modal-sub { font-size: 15px; margin-top: 16px; }
  #tops-info-modal.tops-fan-recap .seal-modal-item { padding: 18px 0; gap: 10px; }
  #tops-info-modal.tops-fan-recap .seal-modal-name { font-size: 21px; }
  #tops-info-modal.tops-fan-recap .seal-modal-match { font-size: 14px; }
  #tops-info-modal.tops-fan-recap .btn-primary { font-size: 21px; padding: 18px; }
  #tops-info-modal.tops-fan-recap a.seal-modal-back { font-size: 16px; padding: 4px; }
}

#tops-info-modal.tops-fan-recap .seal-modal-card { padding: 32px 40px; gap: 16px; }
#tops-info-modal.tops-fan-recap .seal-modal-item { padding: 14px 0; }
#tops-info-modal.tops-fan-recap .seal-modal-sub { margin-top: 12px; }
#tops-info-modal.tops-fan-recap .btn-primary { padding: 18px; }
#tops-info-modal.tops-fan-recap .seal-modal-header { padding-right: 40px; }
@media (max-width: 640px) { #tops-info-modal.tops-fan-recap .seal-modal-card { padding: 28px 18px 20px; gap: 12px; } #tops-info-modal.tops-fan-recap .seal-modal-item { padding: 10px 0; } #tops-info-modal.tops-fan-recap .btn-primary { padding: 14px; font-size: 20px; } }

/* Icône « mouse-pointer-click » : sidebar Mes Tops favoris + bouton Consulter */
[data-my-votes]{ display:flex; align-items:center; gap:8px; }
[data-my-votes] .tops-click-icon{ flex:none; }
:is(#tops-fan-resume,.tops-resume){ display:flex; align-items:center; justify-content:center; gap:10px; box-sizing:border-box; width:100%; max-width:none; margin:32px 0; padding:18px 24px; background-color:transparent; border:1px solid var(--tops-brand-border); color:var(--tops-brand-accent); font-weight:200; font-size:1.1rem; box-shadow:none; }
:is(#tops-fan-resume,.tops-resume):hover{ border-color:var(--tops-brand-accent); }

/* Fenêtres modales : la page derrière ne défile plus. */
html:has(#tops-info-modal), html:has(#tops-info-modal) body { overflow: hidden; }

/* Accueil d'une catégorie : finaliste déjà choisi (contour + circle-check couleur catégorie). */
.tops-finalist.tops-finalist-voted { border: 1px solid var(--tops-cat); box-shadow: inset 0 0 0 1px var(--tops-cat); }
.tops-finalist.tops-finalist-voted .synth-num { display: inline-grid; place-items: center; color: var(--tops-cat); }
.tops-finalist .tops-finalist-check { width: 24px; height: 24px; stroke-width: 2; }
@media (max-width: 640px) { .tops-finalist .tops-finalist-check { width: 20px; height: 20px; } }
/* Bac à sable : label dans l'en-tête, à côté du profil et du menu. */
.pm-bar .tops-sandbox-header { height: 44px; padding: 0 14px; }
@media (max-width: 640px) { .pm-bar .tops-sandbox-header { height: 36px; padding: 0 10px; font-size: 11px; } }

/* Fenêtres : descente avec léger rebond à l’ouverture, remontée en fondu à la fermeture. */
@keyframes tops-modal-in { 0% { opacity: 0; transform: translateY(-40px) scale(.96); } 60% { opacity: 1; transform: translateY(6px) scale(1); } 80% { transform: translateY(-2px); } 100% { opacity: 1; transform: none; } }
@keyframes tops-modal-out { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateY(-16px) scale(.96); } }
@keyframes tops-backdrop-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes tops-backdrop-out { from { opacity: 1; } to { opacity: 0; } }
.seal-modal-overlay.active { animation: tops-backdrop-in .3s ease-out both; }
.seal-modal-overlay.active .seal-modal-card { animation: tops-modal-in .45s cubic-bezier(.22,1,.36,1) both; }
.seal-modal-overlay.tops-modal-closing { animation: tops-backdrop-out .25s ease-in .05s both; }
.seal-modal-overlay.tops-modal-closing .seal-modal-card { animation: tops-modal-out .22s ease-in both; }
@media (max-width: 640px) { .seal-modal-overlay.active .seal-modal-card { animation-duration: .38s; } }
@media (prefers-reduced-motion: reduce) {
  .seal-modal-overlay.active .seal-modal-card, .seal-modal-overlay.tops-modal-closing .seal-modal-card { animation: none; }
  .seal-modal-overlay.tops-modal-closing { animation: tops-backdrop-out .15s linear both; }
}

/* Official public identity; category accents retain their own colors. */
.tops-fan-home { --gold: var(--tops-brand-accent); --border-gold: var(--tops-brand-border); }
.tops-brand-logo { display:block; width:160px; height:60px; object-fit:contain; margin:0 auto 14px; }
.tops-home-logo { width:220px; height:82px; margin-bottom:20px; }
.tops-fan-home #vote-cards .card .card-arrow { box-shadow:var(--tops-cta-shadow); }
#tops-info-modal.tops-fan-recap .seal-modal-header { padding:0; text-align:center; }
#tops-info-modal.tops-fan-recap .seal-modal-title { padding:0; text-align:center; }
#tops-info-modal.tops-fan-recap .seal-modal-sub { font-size:14px; line-height:1.4; text-align:center; max-width:440px; margin:10px auto 0; }
.tops-recap-category-logo { display:block; width:130px; height:36px; object-fit:contain; object-position:left center; filter:brightness(0) invert(1); }
@media(max-width:640px) {
  .tops-home-logo { width:180px; height:64px; }
  #tops-info-modal.tops-fan-recap .tops-brand-logo { width:128px; height:44px; margin-bottom:10px; }
  #tops-info-modal.tops-fan-recap .seal-modal-sub { font-size:12px; }
  #tops-info-modal.tops-fan-recap .seal-modal-title { font-size:28px; }
  .tops-recap-category-logo { width:110px; height:28px; }
}
/* Fan landscape: full-viewport player with stable, always reachable overlays. */
@media (max-width:1100px) and (max-height:600px) and (orientation:landscape) and (pointer:coarse) {
  body:has(:is(.tops-fan-gallery,.tops-committee-gallery)), body:is(.tops-fan-gallery,.tops-committee-gallery) { overflow:hidden; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen.active { position:fixed; inset:0; display:block; height:100dvh; width:100%; overflow:hidden; padding:0; isolation:isolate; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen::after { content:""; position:absolute; inset:0; background:var(--tops-control-shade); z-index:2; pointer-events:none; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .video-wrapper { position:absolute; inset:0; width:100%; height:100%; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .video-container { width:100%; height:100%; aspect-ratio:auto; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .video-player { object-fit:contain; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header, :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header:has(.tops-sandbox-label) { position:absolute; inset:max(12px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) auto max(20px,env(safe-area-inset-left)); z-index:5; padding:0; display:grid; grid-template-columns:minmax(0,1fr) auto auto; background:none; border:0; gap:8px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-ref { grid-column:1; grid-row:1; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-fan-category { font-size:24px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-fan-position { font-size:14px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header .pm-cgroup { grid-column:3; grid-row:1; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header .pm-btn { width:44px; height:44px; margin-left:6px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header .tops-sandbox-label { grid-column:2; grid-row:1; padding:6px 8px; font-size:10px; align-self:start; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-fan-continue { display:none; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-mobile-sidebar { display:contents; border:0; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-video-details { position:absolute; left:max(24px,env(safe-area-inset-left)); bottom:max(20px,env(safe-area-inset-bottom)); width:58%; padding:0; background:none; z-index:4; overflow:visible; pointer-events:none; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-video-details .work-cartel-title { font-size:26px !important; margin-bottom:8px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-video-details .work-cartel-meta { display:flex; gap:10px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-video-details .work-cartel-match { font-size:12px; gap:5px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-video-details .work-cartel-collection { font-size:11px; margin-top:8px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .acquire-bar { display:contents; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-prev, :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-next { position:absolute; top:42%; z-index:5; display:flex; flex-direction:column; align-items:center; justify-content:center; width:90px; height:70px; padding:0; background:var(--tops-control-surface); color:var(--white); border:1px solid var(--gold); box-shadow:var(--tops-control-glow); border-radius:0; font-size:0; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-prev { left:max(16px,env(safe-area-inset-left)); }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-next { right:max(16px,env(safe-area-inset-right)); }
  .tops-landscape-prev::before, .tops-landscape-next::before { content:""; width:20px; height:20px; border-top:2px solid currentColor; border-right:2px solid currentColor; transform:rotate(45deg); }
  .tops-landscape-prev::before { transform:rotate(-135deg); }
  .tops-landscape-prev::after, .tops-landscape-next::after { position:absolute; top:calc(100% + 8px); font:400 14px/1 Insatiable,sans-serif; white-space:nowrap; }
  .tops-landscape-prev::after { content:"PRÉCÉDENT"; }
  .tops-landscape-next::after { content:"SUIVANT"; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-fan-choice { position:absolute; right:max(20px,env(safe-area-inset-right)); bottom:max(22px,env(safe-area-inset-bottom)); width:32%; height:50px; padding:8px 12px; z-index:5; border:1px solid var(--gold); background:var(--tops-control-surface); color:var(--white); box-shadow:var(--tops-control-glow); font-size:22px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-fan-choice svg { width:30px; height:30px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-landscape-mute { display:grid; position:absolute; top:max(12px,env(safe-area-inset-top)); right:calc(max(16px,env(safe-area-inset-right)) + 108px); z-index:6; width:44px; height:44px; }
  .tops-landscape-mute svg { width:24px; height:24px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .video-play-btn, :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-overlay-mini { visibility:hidden; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-rotate-hint { display:none; }
}

/* Avoid category-specific late overrides leaking into shared landscape controls. */
body .tops-landscape-mute { display:none !important; }
@media (max-width:1100px) and (max-height:600px) and (orientation:landscape) and (pointer:coarse) {
  body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-landscape-mute { display:grid !important; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-prev, :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-next { font-size:0 !important; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-fan-choice { font-size:22px !important; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header .tops-sandbox-label { margin-right:60px; }
}

@media (max-width:1100px) and (max-height:600px) and (orientation:landscape) and (pointer:coarse) {
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header .tops-sandbox-label { position:absolute; right:164px; top:0; margin:0; }
}

/* Recap remains reachable on short viewports without a visible scrollbar. */
#tops-info-modal.tops-fan-recap .seal-modal-card { max-height:calc(100dvh - 32px); overflow-y:auto; scrollbar-width:none; }
#tops-info-modal.tops-fan-recap .seal-modal-card::-webkit-scrollbar { display:none; }
@media (max-height:600px) and (orientation:landscape) {
  #tops-info-modal.tops-fan-recap .seal-modal-card { padding:20px 28px; gap:10px; }
  #tops-info-modal.tops-fan-recap .tops-brand-logo { width:128px; height:44px; margin-bottom:8px; }
  #tops-info-modal.tops-fan-recap .seal-modal-title { font-size:28px; }
  #tops-info-modal.tops-fan-recap .seal-modal-item { padding:10px 0; }
  #tops-info-modal.tops-fan-recap .btn-primary { padding:12px; font-size:20px; }
}
/* Fan breadcrumb on Top presentation screens. */
.tops-crumbs { display:flex; align-items:center; justify-content:flex-start; gap:12px; width:100%; padding:16px max(80px,env(safe-area-inset-right)) 4px max(16px,env(safe-area-inset-left)); box-sizing:border-box; }
.tops-crumb { display:flex; align-items:center; gap:10px; color:var(--white); text-decoration:none; min-width:0; }
.tops-crumb-dot { display:grid; place-items:center; width:36px; height:36px; flex-shrink:0; border-radius:50%; border:2px solid var(--tops-cat); background:color-mix(in srgb, var(--tops-cat) 25%, transparent); font:600 16px/1 sans-serif; }
.tops-crumb-dot svg { width:18px; height:18px; }
.tops-crumb[data-state="todo"] .tops-crumb-dot { background:color-mix(in srgb, var(--tops-cat) 45%, transparent); }
.tops-crumb-text { display:flex; flex-direction:column; gap:2px; font-family:sans-serif; min-width:0; }
.tops-crumb-text strong { font-size:14px; font-weight:600; white-space:nowrap; }
.tops-crumb-text small { font-size:12px; opacity:.6; white-space:nowrap; }
.tops-crumb-sep { opacity:.6; font-size:20px; }
.tops-crumb:hover .tops-crumb-text strong, .tops-crumb[aria-current] .tops-crumb-text strong { text-decoration:none; color:var(--white); }
.tops-crumb:focus-visible { outline:2px solid var(--gold); outline-offset:4px; border-radius:8px; }
#screen-intro:has(.tops-crumbs) { flex-direction:column; }
@media (max-width:480px) { .tops-crumbs { gap:6px; padding-right:64px; justify-content:flex-start; } .tops-crumb { gap:6px; } .tops-crumb-dot { width:28px; height:28px; font-size:13px; } .tops-crumb-text strong { font-size:12px; } .tops-crumb-text small { font-size:11px; } }

/* Public recap: category identity, readable saved status, no text overflow. */
:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen:not(.active) { visibility:hidden; pointer-events:none; }
#tops-info-modal.tops-fan-recap .seal-modal-item { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; }
#tops-info-modal.tops-fan-recap .seal-modal-info { min-width:0; }
#tops-info-modal.tops-fan-recap .seal-modal-name,
#tops-info-modal.tops-fan-recap .seal-modal-match { overflow-wrap:anywhere; white-space:normal; }
.tops-vote-recorded { display:flex; align-items:center; gap:8px; }
.tops-vote-recorded svg { color:var(--white); flex-shrink:0; }
.tops-landscape-actions { display:contents; }
.tops-fan-progress, .tops-nav-square { display:none; }
@media(max-width:480px) {
  #tops-info-modal.tops-fan-recap .seal-modal-item { grid-template-columns:minmax(0,1fr); }
  .tops-vote-recorded { font-size:13px !important; }
}
@keyframes tops-progress-appear {
  0% { opacity:0; transform:scale(.78); box-shadow:none; }
  65% { opacity:1; transform:scale(1.08); box-shadow:var(--tops-control-glow); }
  100% { opacity:1; transform:scale(1); box-shadow:none; }
}
@media (max-width:1100px) and (max-height:600px) and (orientation:landscape) and (pointer:coarse) {
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen { --tops-native-clearance:max(68px,calc(env(safe-area-inset-bottom) + 56px)); }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header { pointer-events:none; grid-template-columns:minmax(0,1fr) auto; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header .pm-cgroup { grid-column:2; pointer-events:auto; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header .pm-btn,
  body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-mute { width:44px; height:44px; border-radius:0; margin:0; box-sizing:border-box; }
  body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-mute { top:max(12px,env(safe-area-inset-top)); right:calc(max(16px,env(safe-area-inset-right)) + 60px); }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header .tops-sandbox-label { right:104px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-video-details { bottom:var(--tops-native-clearance); left:max(16px,env(safe-area-inset-left)); width:calc(100% - 218px - env(safe-area-inset-left) - env(safe-area-inset-right)); }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-video-details .work-cartel-title { font-size:22px !important; margin-bottom:5px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-video-details .work-cartel-collection { margin-top:4px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-prev,
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-next { top:50%; bottom:auto; transform:translateY(-50%); height:calc(100% - 252px - env(safe-area-inset-bottom)); width:60px; min-height:44px; padding:0; background:none; border:0; box-shadow:none; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-prev { left:max(4px,env(safe-area-inset-left)); }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-next { right:max(4px,env(safe-area-inset-right)); }
  .tops-landscape-prev::before, .tops-landscape-next::before,
  .tops-landscape-prev::after, .tops-landscape-next::after { display:none; }
  .tops-landscape-prev .tops-nav-text, .tops-landscape-next .tops-nav-text { display:none; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-nav-square { display:grid; place-items:center; width:44px; height:44px; border:1px solid transparent; background:var(--tops-control-surface); box-sizing:border-box; transition:border-color .18s; }
  .tops-nav-square svg { width:24px; height:24px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-landscape-prev:is(:hover,:active,:focus-visible):not(:disabled) .tops-nav-square,
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-landscape-next:is(:hover,:active,:focus-visible):not(:disabled) .tops-nav-square { border-color:var(--gold); }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-landscape-prev:disabled, :is(.tops-fan-gallery,.tops-committee-gallery) .tops-landscape-next:disabled { opacity:.3; cursor:not-allowed; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-actions { position:absolute; right:max(16px,env(safe-area-inset-right)); bottom:var(--tops-native-clearance); z-index:5; display:flex; align-items:center; gap:8px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-fan-choice { position:static; width:112px; height:44px; min-height:44px; padding:6px 10px; font-size:18px !important; box-shadow:none; border-radius:0; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-fan-choice svg { width:22px; height:22px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-fan-choice span { display:none; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-fan-choice::after { content:"VOTER"; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-fan-choice[aria-pressed="true"] { background:var(--gold); border-color:var(--gold); color:var(--bg); }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-fan-progress:not([hidden]) { display:grid; place-items:center; width:44px; height:44px; min-height:44px; padding:8px; border:1px solid var(--gold); border-radius:0; background:var(--tops-control-surface); color:var(--gold); animation:tops-progress-appear .36s ease-out both; }
  .tops-fan-progress svg { width:24px; height:24px; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header,
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-video-details,
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-prev,
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-next,
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-actions,
  body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-mute,
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen::after { transition:opacity .22s ease; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen.tops-controls-hidden::after { opacity:0; pointer-events:none; visibility:hidden; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen.tops-controls-hidden :is(.work-header,.tops-video-details,.tops-landscape-prev,.tops-landscape-next,.tops-landscape-actions) { opacity:0; visibility:hidden; pointer-events:none; transition:opacity .22s ease,visibility 0s .22s; }
}
@media (max-width:1100px) and (max-height:340px) and (orientation:landscape) and (pointer:coarse) {
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-video-details .work-cartel-title { font-size:18px !important; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-video-details .work-cartel-collection { display:none; }
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-prev, :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-next { height:44px; }
}
@media(prefers-reduced-motion:reduce) {
  :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-fan-progress:not([hidden]) { animation:none; }
}

/* Committee uses the same public presentation, with its own ranking controls. */
.tops-committee-home { --gold:var(--tops-brand-accent); --border-gold:var(--tops-brand-border); }
.tops-committee-home #vote-cards .card { background-size:cover; background-position:center; aspect-ratio:3/4; justify-content:center; }
.tops-committee-home #vote-cards .card-sub, .tops-committee-home #vote-cards .card-status { display:none; }
.tops-committee-home #vote-cards .card-arrow { display:inline-flex; padding:12px 24px; background:var(--card-color); color:var(--white); box-shadow:var(--tops-cta-shadow); letter-spacing:0; }
.tops-committee-home #vote-cards .sealed .card-arrow { background:var(--tops-control-surface); color:var(--white); }
.tops-committee-gallery #screen-intro { overflow-y:auto; }
.tops-review-logos { display:flex; align-items:center; gap:20px; min-width:0; }
.tops-review-logos img { height:30px; width:auto; object-fit:contain; }
body.tops-committee-gallery #screen-review .top-bar > .session-badge { display:none; }
body.tops-committee-gallery #screen-review .top-bar > .tops-review-logos { margin-left:auto; }
/* Saved committee ranks use the same category outline as fan favorites. */
.tops-finalist.tops-finalist-ranked { position:relative; }
.tops-finalist.tops-finalist-ranked .synth-num { position:absolute; top:10px; left:10px; font-size:20px; line-height:24px; letter-spacing:0; }
@media (max-width:700px) {
  .tops-finalist.tops-finalist-ranked.synth-card { padding-left:44px; grid-template-columns:40px minmax(0,1fr); }
}
@media (min-width:701px) {
  body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-fan-position { display:none; }
  body.tops-committee-gallery #screen-review .top-bar { position:sticky; top:0; z-index:900; background:var(--bg); }
  body.tops-committee-gallery:has(#screen-review.active) .pm-bar.tops-category-header { background:none; }
}
.tops-committee-gallery .tops-finalists { grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); }
.tops-committee-gallery #seal-modal .seal-modal-header, .tops-committee-recap .seal-modal-header { text-align:center; }
.tops-committee-gallery #seal-modal .tops-recap-category-logo, .tops-committee-recap .tops-recap-category-logo { margin:0 auto 12px; object-position:center; }
.tops-committee-gallery #seal-modal .seal-modal-name, .tops-committee-gallery .synth-name { color:var(--tops-cat,var(--gold)); }
.tops-committee-recap .tops-recap-buts { color:var(--tops-buts); }
.tops-committee-recap .tops-recap-arrets { color:var(--tops-arrets); }
.tops-committee-recap .tops-recap-skills { color:var(--tops-skills); }
.tops-committee-recap .seal-modal-card { position:relative; max-height:calc(100dvh - 32px); overflow-y:auto; }
.tops-committee-recap .tops-recap-close { position:absolute; top:12px; right:12px; width:44px; height:44px; border:0; background:none; color:var(--white); cursor:pointer; }
.tops-committee-ballot { border-top:1px solid var(--border); padding:16px 0; }
.tops-committee-status { color:var(--gray); text-align:center; font:13px/1.4 sans-serif; margin-bottom:12px; }
.tops-committee-progress { display:none; }
@media(max-width:700px) { .tops-committee-gallery .tops-finalists { grid-template-columns:minmax(0,1fr); } }
@media(max-width:1100px) and (max-height:600px) and (orientation:landscape) and (pointer:coarse) {
  
  .tops-committee-gallery .tops-work-screen .tops-committee-choice { min-width:112px; max-width:180px; height:44px; padding:8px; font-size:15px; background:var(--tops-control-surface); color:var(--white); border:1px solid var(--gold); }
  .tops-committee-gallery .tops-work-screen .tops-committee-choice.acquired { background:var(--gold); color:var(--bg); }
  .tops-committee-gallery .tops-committee-progress { display:grid; place-items:center; width:44px; height:44px; padding:8px; color:var(--gold); background:var(--tops-control-surface); border:1px solid var(--gold); }
  .tops-committee-progress svg { width:24px; height:24px; }
  .tops-committee-gallery .tops-finalists { grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); }
  .tops-committee-gallery .tops-work-screen .tops-video-details { width:calc(100% - 270px - env(safe-area-inset-left) - env(safe-area-inset-right)); }
}
/* Committee confirmation remains opaque and scrollable on short screens. */
.tops-committee-home #vote-cards .card .card-arrow { opacity:1; transform:none; }
.tops-committee-gallery #seal-modal .seal-modal-card, .tops-committee-recap .seal-modal-card { background:var(--tops-recap-surface); border-color:var(--tops-brand-border); }
.tops-committee-gallery #seal-modal .seal-modal-card > * { flex-shrink:0; }
.tops-committee-gallery #seal-modal .seal-modal-title .gold, .tops-committee-recap .gold { color:var(--tops-brand-accent); }

/* Public dialog shell: shared by Fan and Committee, including static selection. */
:root { --tops-modal-width:600px; --tops-modal-backdrop:color-mix(in srgb, var(--bg) 80%, transparent); }
body.tops-modal-open { overflow:hidden; }
#tops-info-modal, body .seal-modal-overlay { position:fixed; inset:0; z-index:12000; display:flex; align-items:center; justify-content:center; background:var(--tops-modal-backdrop); padding:16px; }
body .seal-modal-overlay:not(.active) { opacity:0; visibility:hidden; pointer-events:none; }
body .seal-modal-overlay.active { visibility:visible; pointer-events:auto; }
#tops-info-modal .seal-modal-card, body #seal-modal .seal-modal-card { position:relative; box-sizing:border-box; width:min(var(--tops-modal-width),100%); max-height:calc(100dvh - 32px); overflow-y:auto; padding:32px; border:1px solid var(--tops-cat,var(--tops-brand-border)); border-radius:0; background:var(--tops-recap-surface); color:var(--white); display:flex; flex-direction:column; gap:20px; }
.seal-modal-card > * { flex-shrink:0; }
body .seal-modal-card .tops-recap-close { position:absolute; top:12px; right:12px; display:grid; place-items:center; width:44px; height:44px; min-height:44px; padding:8px; border:0; background:none; color:var(--white); cursor:pointer; }
.seal-modal-card .tops-recap-close:focus-visible, .seal-modal-card button:focus-visible, .seal-modal-card a:focus-visible { outline:2px solid var(--tops-cat,var(--tops-brand-accent)); outline-offset:2px; }
.seal-modal-card h2[tabindex="-1"]:focus { outline:none; }
.tops-category-buts { --tops-cat:var(--tops-buts); }
.tops-category-arrets { --tops-cat:var(--tops-arrets); }
.tops-category-skills { --tops-cat:var(--tops-skills); }
#tops-info-modal.tops-category-modal .seal-modal-card, body #seal-modal.tops-category-modal .seal-modal-card { border-color:var(--tops-cat); }
#tops-info-modal.tops-category-modal .gold, body #seal-modal.tops-category-modal .gold { color:var(--tops-cat); }
.tops-category-modal .seal-modal-header { text-align:center; }
.tops-category-modal .tops-recap-category-logo { width:180px; height:88px; margin:0 auto 16px; object-position:center; }
.tops-category-modal .seal-modal-title { padding:0 32px; }
#tops-info-modal.tops-fan-recap .tops-favorite-row { grid-template-columns:76px minmax(0,1fr); align-items:center; column-gap:20px; row-gap:10px; }
#tops-info-modal.tops-fan-recap .tops-favorite-row > .tops-recap-category-logo { grid-column:1; grid-row:1; width:76px; height:64px; object-position:center; }
#tops-info-modal.tops-fan-recap .tops-favorite-row > .seal-modal-info { grid-column:2; grid-row:1; }
#tops-info-modal.tops-fan-recap .tops-favorite-row > :is(a,.tops-vote-recorded) { grid-column:2; grid-row:2; justify-self:start; margin:0; }
body #tops-info-modal .seal-modal-item:last-child, body #seal-modal .seal-modal-item:last-child { border-bottom:0; }
.tops-fan-category .tops-recap-category-logo { width:100px; height:42px; }
.review-header > .tops-recap-category-logo { width:180px; height:80px; margin:0 auto 16px; object-position:center; }
.work-header .collection-count { display:flex; align-items:center; justify-content:center; gap:6px; min-width:44px; cursor:pointer; }
.work-header .collection-count svg { width:18px; height:18px; }
@media(max-width:640px) {
 #tops-info-modal .seal-modal-card, body #seal-modal .seal-modal-card { padding:28px 18px 20px; gap:16px; }
 #tops-info-modal.tops-fan-recap .tops-favorite-row { grid-template-columns:60px minmax(0,1fr); column-gap:12px; }
 #tops-info-modal.tops-fan-recap .tops-favorite-row > .tops-recap-category-logo { width:60px; height:56px; }
 .tops-committee-home #vote-cards .card { aspect-ratio:16/9; padding:20px; }
 .tops-crumbs { padding-right:16px; padding-top:64px; flex-wrap:wrap; }
}
@media(max-width:1100px) and (max-height:600px) and (orientation:landscape) and (pointer:coarse) {
 :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header { grid-template-columns:minmax(0,1fr) auto; inset:8px 16px auto; }
 :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-video-shortcuts { display:none; }
 .tops-video-shortcuts .btn-nav { width:32px; height:32px; min-width:32px; }
 :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header .pm-cgroup { display:flex; align-items:center; gap:8px; grid-row:1 / 3; }
 body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-mute { position:static; display:grid !important; margin:0; width:44px; height:44px; }
 :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .collection-count { display:flex; padding:0 8px; }
 :is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header .tops-sandbox-label { position:static; grid-column:1; grid-row:3; justify-self:start; margin:0; padding:3px 6px; font-size:9px; }
 .tops-work-screen .video-container { z-index:3; }
 .tops-work-screen .video-player { pointer-events:auto; }
 .tops-work-screen .tops-video-details { pointer-events:none; }
}

#tops-info-modal.tops-committee-recap .seal-modal-item, body #seal-modal .seal-modal-item { display:grid; grid-template-columns:44px 64px minmax(0,1fr); align-items:center; justify-content:start; gap:12px; text-align:left; }
.tops-committee-recap .seal-modal-info { min-width:0; }
.tops-committee-recap .seal-modal-pts { color:var(--tops-cat,var(--tops-brand-accent)); }

body #seal-modal.tops-category-modal .seal-modal-title .gold, #tops-info-modal.tops-category-modal .seal-modal-title .gold { color:var(--tops-cat) !important; }

/* Committee reading surfaces stay opaque; only the backdrop is translucent. */
#tops-info-modal.tops-committee-recap .seal-modal-card, body.tops-committee-gallery #seal-modal .seal-modal-card { background:var(--tops-recap-surface); opacity:1; }
#tops-info-modal.tops-committee-recap .seal-modal-info, body.tops-committee-gallery #seal-modal .seal-modal-info { align-items:flex-start; text-align:left; }
#tops-info-modal.tops-committee-recap .seal-modal-sub { text-align:left; }
body.tops-committee-gallery #seal-modal .seal-modal-sub { text-align:center; }
#tops-info-modal.tops-committee-recap .seal-modal-rank, #tops-info-modal.tops-committee-recap .seal-modal-pts, body.tops-committee-gallery #seal-modal .seal-modal-rank, body.tops-committee-gallery #seal-modal .seal-modal-pts { text-align:left; justify-self:start; }
.tops-committee-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.tops-committee-tabs button { min-width:0; min-height:44px; padding:8px; border:1px solid var(--border); background:none; color:var(--white); font:20px/1.2 Insatiable,sans-serif; cursor:pointer; }
.tops-committee-tabs button[aria-selected="true"] { border-color:var(--tops-cat); color:var(--tops-cat); background:color-mix(in srgb,var(--tops-cat) 12%,var(--tops-recap-surface)); }
.tops-committee-ballot[hidden] { display:none; }
.tops-committee-columns { display:grid; grid-template-columns:44px 64px minmax(0,1fr); gap:12px; padding:8px 0; text-align:left; font:12px/1.4 sans-serif; color:var(--tops-recap-muted); }
.tops-committee-ballot .tops-committee-status { text-align:left; color:var(--white); }
.tops-committee-empty { display:grid; place-items:center; min-height:220px; }
.tops-committee-empty .btn-primary { text-decoration:none; text-align:center; background:var(--tops-cat); color:var(--bg); }
body.tops-committee-gallery .btn-acquire.tops-committee-choice { display:inline-flex; align-items:center; justify-content:center; gap:8px; line-height:1.2; }
.tops-committee-gallery .tops-committee-choice svg { display:block; width:20px; height:20px; flex:none; }
.tops-committee-gallery .tops-committee-choice span { line-height:1.2; }

@keyframes tops-home-enter { from { opacity:0; translate:0 22px; } to { opacity:1; translate:0 0; } }
:is(.tops-fan-home,.tops-committee-home) .tops-home-enter { animation:tops-home-enter .55s cubic-bezier(.22,1,.36,1) both; animation-delay:var(--tops-enter-delay,0s); }
@media(prefers-reduced-motion:reduce) { :is(.tops-fan-home,.tops-committee-home) .tops-home-enter { animation:none; } }

/* Recorded votes are read-only, including the compact landscape action. */
body.tops-fan-gallery .tops-fan-choice[data-locked="true"] { background:var(--tops-control-surface) !important; border-color:var(--gray) !important; color:var(--gray) !important; box-shadow:none !important; cursor:not-allowed; opacity:.5; }
body.tops-fan-gallery .tops-fan-choice[data-locked="true"][aria-pressed="true"] { opacity:1; }
body.tops-fan-gallery .tops-fan-choice[data-locked="true"][aria-pressed="true"] svg { color:var(--gold); }
@media(max-width:1100px) and (max-height:600px) and (orientation:landscape) and (pointer:coarse) {
 body.tops-fan-gallery .tops-fan-choice[data-locked="true"][aria-pressed="true"]::after { content:"TOP CHOISI"; font-size:14px; }
}
.tops-content-enter { animation:tops-home-enter .4s cubic-bezier(.22,1,.36,1) both; animation-delay:var(--tops-enter-delay,0s); }
.work-header > .tops-header-crumbs, .top-bar > .tops-header-crumbs { display:none; }
@media(max-width:700px), (max-width:1100px) and (max-height:600px) and (orientation:landscape) and (pointer:coarse) {
 body .pm-bar.tops-category-header { left:0; right:0; top:0 !important; gap:8px; padding:8px max(12px,env(safe-area-inset-right)) 8px max(12px,env(safe-area-inset-left)); box-sizing:border-box; background:var(--bg); }
 body:has(.tops-work-screen.active) .pm-bar.tops-category-header { display:none !important; }
 body.tops-has-banner .tops-work-screen .work-header .pm-btn.pm-inline { display:grid !important; }
 .tops-category-header > .tops-crumbs { flex:1; }
 body .tops-category-header .tops-crumbs, body .top-bar > .tops-header-crumbs { display:flex; width:auto; padding:0; gap:6px; flex-wrap:nowrap; pointer-events:auto; min-width:0; align-self:center; }
 body .tops-category-header .tops-crumb, body .tops-header-crumbs .tops-crumb { gap:4px; }
 body .tops-category-header .tops-crumb-dot, body .tops-header-crumbs .tops-crumb-dot { width:24px; height:24px; font-size:12px; }
 body .tops-category-header .tops-crumb-text strong, body .tops-header-crumbs .tops-crumb-text strong { font-size:11px; white-space:normal; }
 body .tops-category-header .tops-crumb-text small, body .tops-header-crumbs .tops-crumb-text small { display:none; }
 body .tops-category-header .tops-crumb-sep, body .tops-header-crumbs .tops-crumb-sep { display:none; }
 body:is(.tops-fan-gallery,.tops-committee-gallery) .work-header { grid-template-columns:minmax(0,1fr) auto !important; }
 body:is(.tops-fan-gallery,.tops-committee-gallery) .work-header > .work-ref { grid-column:1; grid-row:1; }
 body:is(.tops-fan-gallery,.tops-committee-gallery) .work-header > .pm-cgroup { grid-column:2; grid-row:1; }
 body:is(.tops-fan-gallery,.tops-committee-gallery) .work-header > .tops-video-shortcuts { grid-row:2; }
 body:is(.tops-fan-gallery,.tops-committee-gallery) #screen-intro .intro-content { padding-top:72px; }
 body:is(.tops-fan-gallery,.tops-committee-gallery) #screen-review .top-bar { padding-top:64px; }
}
@media(max-width:1100px) and (max-height:600px) and (orientation:landscape) and (pointer:coarse) {
 body.tops-has-banner:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header { top:58px; }
 body:is(.tops-fan-gallery,.tops-committee-gallery) .work-header > .tops-header-crumbs { max-width:430px; }
 body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header { align-items:center; }
 body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header > .work-ref { display:flex; flex-direction:row !important; align-items:center; gap:12px; min-height:44px; }
 body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-ref .tops-fan-category { display:flex; align-items:center; flex-shrink:0; }
 body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-ref .tops-recap-category-logo { display:block; width:auto; height:32px; margin:0; }
 body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-ref .tops-fan-position { display:block; margin:0; white-space:nowrap; line-height:1; }
 body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header > .pm-cgroup { align-self:center; grid-row:1; }
}
@media(prefers-reduced-motion:reduce) { .tops-content-enter { animation:none; } }
/* Every public modal (Fans and Comité) is fully opaque for readability. */
body .seal-modal-overlay .seal-modal-card, body #tops-info-modal .seal-modal-card { background:var(--tops-recap-surface) !important; opacity:1; backdrop-filter:none; }
#tops-info-modal.tops-fan-recap .seal-modal-name[class*="tops-recap-"] { color:var(--white) !important; }
#tops-info-modal.tops-fan-recap a.seal-modal-back { color:var(--tops-brand-accent) !important; }
.vote-greeting .vote-notice { font:700 15px/1.2 Insatiable, sans-serif; letter-spacing:.2em; text-transform:uppercase; color:var(--tops-brand-accent); }
@media (min-width: 1025px) { .tops-hero-title { font-size:48px; } }

/* Shared compact progress; only homepage progress moves to the mobile bottom bar. */
body .pm-bar.tops-home-header, body .pm-bar.tops-category-header { left:0; right:0; top:0; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px; padding:10px 24px; background:none; box-sizing:border-box; }
body .pm-bar.tops-home-header { grid-template-columns:minmax(0,1fr) auto auto auto; }
#tops-home-progress { min-width:0; }
body.tops-no-vote-yet #tops-home-progress { display:none !important; }
body:is(.tops-edition-closed,.tops-voting-inactive) :is(#tops-home-progress,.tops-crumbs,.tops-header-crumbs) { display:none !important; }
body:is(.tops-edition-closed,.tops-voting-inactive) .pm-bar.tops-category-header::before { content:""; grid-column:1; }
@media(min-width:701px) and (min-height:601px), (min-width:1101px) {
  body:is(.tops-no-vote-yet,.tops-edition-closed,.tops-voting-inactive) .pm-bar.tops-home-header::before { content:""; grid-column:1; }
  /* Match the notification's 50px row instead of adding padding below it. */
  body.tops-has-banner:is(.tops-fan-home,.tops-fan-gallery) .pm-bar:is(.tops-home-header,.tops-category-header) { top:0 !important; height:50px; padding-block:3px; }
}
body .tops-crumbs { padding:0; gap:12px; flex-wrap:nowrap; min-width:0; }
body .tops-crumb { gap:6px; min-height:44px; }
body .tops-crumb-dot { width:22px; height:22px; font-size:11px; border-width:1px; }
body .tops-crumb-dot svg { width:14px; height:14px; }
body .tops-crumb-text strong { font-size:12px; }
body .tops-crumb-text small { font-size:10px; }
body .tops-crumb-sep { display:none; }
#tops-home-progress > .btn-primary { display:none; }
body:is(.tops-fan-gallery,.tops-committee-gallery) #screen-intro .intro-content { padding-top:80px; }
:is(.tops-fan-home,.tops-committee-home) #vote-cards .card .card-arrow { display:inline-flex; align-items:center; justify-content:center; opacity:1; transform:none; font:400 20px/1.2 Insatiable,sans-serif; letter-spacing:0; padding:10px 16px; margin-top:16px; background:var(--card-color); color:var(--white); min-height:44px; text-shadow:none; }
body.tops-fan-home #vote-cards .card .card-arrow::before { content:none; }
:is(.tops-fan-home,.tops-committee-home) #vote-cards .card[data-vote-state="recorded"] { opacity:1; cursor:pointer; }
body:is(.tops-fan-home,.tops-committee-home) #vote-cards .card[data-vote-state="recorded"] .card-arrow { background:var(--tops-control-surface) !important; color:var(--tops-brand-accent) !important; box-shadow:none !important; border:1px solid var(--tops-brand-border); }
body:is(.tops-fan-home,.tops-committee-home) #vote-cards .card[data-vote-state="recorded"] .card-arrow { color:var(--white) !important; border-color:var(--white); }
:is(.tops-fan-home,.tops-committee-home) #vote-cards .card[data-vote-state="recorded"]:hover { transform:none; }
.tops-card-badge { position:relative; display:flex; align-items:center; justify-content:center; gap:8px; padding:8px 10px; margin-top:12px; max-width:100%; color:var(--white); background:var(--tops-control-surface); text-shadow:none; text-align:left; letter-spacing:0; }
.tops-card-badge > svg { width:18px; height:18px; flex-shrink:0; }
.tops-card-badge > span { display:flex; flex-direction:column; gap:4px; min-width:0; }
.tops-card-badge strong { font:600 13px/1.3 sans-serif; }
.tops-card-badge span span { font:400 18px/1.2 Insatiable,sans-serif; overflow-wrap:anywhere; }
#tops-home-finalize { width:min(420px,100%); margin:24px auto 0; letter-spacing:0; }
body #tops-info-modal.tops-thank-you .seal-modal-card, body #tops-info-modal.tops-thank-you :is(.seal-modal-header,.seal-modal-title,.seal-modal-sub,.seal-modal-list,.tops-complete-content,.tops-committee-status) { text-align:center; }
body #tops-info-modal.tops-thank-you .seal-modal-sub { max-width:440px; margin:12px auto 0; }
body #tops-info-modal.tops-thank-you .btn-primary { align-self:center; width:auto; min-width:200px; max-width:100%; }
@media(max-width:700px), (max-width:1100px) and (max-height:600px) and (orientation:landscape) and (pointer:coarse) {
  body .pm-bar.tops-home-header { left:auto; padding:8px 12px; background:none; display:flex; }
  #tops-home-progress { position:fixed; z-index:70; left:12px; right:12px; bottom:max(12px,env(safe-area-inset-bottom)); padding:8px 12px; background:var(--tops-recap-surface); border:1px solid var(--tops-brand-border); box-shadow:var(--tops-cta-shadow); }
  #tops-home-progress .tops-crumbs { justify-content:space-between; gap:6px; }
  #tops-home-progress .tops-crumb-text strong { font-size:11px; }
  #tops-home-progress .tops-crumb-text small { display:none; }
  #tops-home-progress > .btn-primary { display:block; margin:4px 0 0; width:100%; min-height:44px; padding:8px; font-size:18px; letter-spacing:0; }
  body:is(.tops-fan-home,.tops-committee-home) { padding-bottom:140px !important; }
  body .pm-bar.tops-category-header { padding:8px 12px; }
  body .pm-bar.tops-category-header > .pm-btn { grid-column:2; justify-self:end; width:44px; height:44px; }
  body .pm-bar.tops-home-header > .pm-btn { width:44px; height:44px; }
  body.tops-committee-home #vote-page2, body.tops-committee-home #vote-cards { min-width:0; }
  body.tops-committee-home #vote-cards { grid-template-columns:minmax(0,1fr); }
  body.tops-committee-home #vote-cards .card { min-width:0; max-width:100%; }
  body.tops-committee-home #tops-committee-recap-button { position:static; flex:none; width:100%; max-width:100%; min-width:0; margin:24px 0 0; padding:16px; white-space:normal; letter-spacing:0; }
  body.tops-committee-home #tops-committee-recap-button svg { flex:none; }
  body.tops-committee-home #tops-committee-recap-button span { min-width:0; overflow-wrap:anywhere; }
  body.tops-committee-gallery #screen-review .top-bar { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; min-height:60px; padding:8px 72px 8px 16px !important; }
  body.tops-committee-gallery #screen-review .top-bar > .tops-header-crumbs, body.tops-committee-gallery #screen-review .session-badge { display:none; }
  body.tops-committee-gallery #screen-review .top-bar > .tops-review-logos { margin-left:0; }
  .tops-review-logos { display:flex; align-items:center; gap:14px; min-width:0; }
  body.tops-committee-gallery .tops-review-logos img { height:24px; width:auto; max-width:calc(50% - 7px); object-fit:contain; flex-shrink:0; }
  body .tops-header-crumbs .tops-crumb-dot, body .tops-category-header .tops-crumb-dot { width:22px; height:22px; }
}
@media(max-width:700px) and (orientation:portrait) {
  body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-fan-position { display:none; }
  body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header .pm-btn.pm-inline { width:44px; height:44px; }
  body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-ref .tops-recap-category-logo { height:42px; }
}

/* Mobile: no breadcrumb until a first vote; category-colored landscape controls. */
@media(max-width:700px), (max-width:1100px) and (max-height:600px) and (orientation:landscape) and (pointer:coarse) {
  body.tops-no-vote-yet .pm-bar.tops-category-header > .tops-crumbs, body.tops-no-vote-yet .tops-header-crumbs { display:none !important; }
}
.tops-scrubber, .tops-seek-hint { display:none; }
@media(max-width:1100px) and (max-height:600px) and (orientation:landscape) and (pointer:coarse) {
  body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen { --tops-player-left:max(16px,env(safe-area-inset-left)); --tops-player-right:max(16px,env(safe-area-inset-right)); }
  body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .work-header { left:var(--tops-player-left); right:var(--tops-player-right); }
  body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-prev { left:var(--tops-player-left); align-items:flex-start; }
  body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-next { right:var(--tops-player-right); align-items:flex-end; }
  body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-video-details { left:var(--tops-player-left); }
  body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-actions { right:var(--tops-player-right); }
  body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-video-details,
  body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-landscape-actions { bottom:var(--tops-native-clearance) !important; }
  body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen :is(.work-header,.tops-video-details,.acquire-bar).tops-content-enter { translate:none !important; }
  body:is(.tops-fan-gallery,.tops-committee-gallery) .tops-work-screen .tops-scrubber { display:flex; align-items:center; gap:10px; position:absolute; z-index:7; left:var(--tops-player-left); right:var(--tops-player-right); bottom:max(8px,env(safe-area-inset-bottom)); height:44px; color:var(--white); font:600 12px/1 sans-serif; transition:opacity .25s; }
  body .tops-work-screen.tops-controls-hidden .tops-scrubber { opacity:0; pointer-events:none; }
  .tops-scrubber input { flex:1; min-width:0; height:44px; margin:0; background:transparent; -webkit-appearance:none; appearance:none; }
  .tops-scrubber input::-webkit-slider-runnable-track { height:4px; border-radius:2px; background:linear-gradient(to right,var(--tops-player-accent) var(--tops-scrub,0%),color-mix(in srgb,var(--white) 35%,transparent) var(--tops-scrub,0%)); }
  .tops-scrubber input::-webkit-slider-thumb { -webkit-appearance:none; width:18px; height:18px; margin-top:-7px; border-radius:50%; background:var(--white); border:2px solid var(--tops-player-accent); }
  .tops-scrubber input::-moz-range-track { height:4px; background:color-mix(in srgb,var(--white) 35%,transparent); }
  .tops-scrubber input::-moz-range-progress { height:4px; background:var(--tops-player-accent); }
  .tops-scrubber input::-moz-range-thumb { width:16px; height:16px; border-radius:50%; background:var(--white); border:2px solid var(--tops-player-accent); }
  body .tops-scrubber .pm-btn { width:44px; height:44px; margin:0; border-radius:0; background:var(--tops-control-surface); color:var(--white); border-color:var(--tops-player-accent); }
  body .tops-work-screen.tops-controls-hidden :is(.tops-scrubber,.tops-landscape-mute) { opacity:0; visibility:hidden; pointer-events:none; }
  .tops-scrubber input:focus-visible { outline:2px solid var(--tops-player-accent); outline-offset:2px; }
  .tops-work-screen .tops-seek-hint { display:block; position:absolute; z-index:8; top:50%; transform:translateY(-50%); padding:10px 16px; background:var(--tops-control-surface); color:var(--white); border:1px solid var(--tops-player-accent); font:400 22px/1 Insatiable,sans-serif; animation:tops-seek .6s ease-out both; pointer-events:none; }
  .tops-seek-back { left:22%; } .tops-seek-fwd { right:22%; }
}
@keyframes tops-seek { from { opacity:0; transform:translateY(-50%) scale(.8); } 30% { opacity:1; transform:translateY(-50%) scale(1); } to { opacity:0; } }
@media(max-width:700px) {
  body.tops-committee-home #vote-cards .card { box-sizing:border-box; height:auto; min-height:180px; aspect-ratio:auto; padding:16px 20px; gap:10px; }
  body.tops-committee-home #vote-cards .card-logo { width:180px; max-width:100%; height:76px; margin:0; flex:none; }
  body.tops-committee-home #vote-cards .card .card-arrow { max-width:100%; box-sizing:border-box; margin:0; flex:none; white-space:normal; overflow-wrap:anywhere; }
  body.tops-committee-home #vote-cards .tops-card-badge { box-sizing:border-box; margin:0; min-width:0; width:100%; }
}