/* The same low-exposure film material as the landing, never on the video. */
.case-dialog.work-dialog,.tariff-dialog{
  background-image:var(--film-exposure),var(--film-grain),radial-gradient(ellipse at 12% 0%,#ffffff0b,transparent 66%),linear-gradient(145deg,#111,#080808 80%);
  background-size:auto,512px 512px,auto,auto;
  background-blend-mode:normal,soft-light,normal,normal;
  border-color:#ffffff30;border-radius:4px;
  box-shadow:inset 0 1px #ffffff0d,0 24px 80px #000b;
  scrollbar-width:thin;scrollbar-color:#555 #080808;
}
.work-dialog::backdrop,.tariff-dialog::backdrop{background:#000c;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.case-dialog-header,.tariff-dialog-header,.tariff-dialog-footer{
  background-image:var(--film-exposure),var(--film-grain),radial-gradient(ellipse at 10% 0%,#ffffff08,transparent 65%),linear-gradient(140deg,#151515,#0e0e0e);
  background-size:auto,512px 512px,auto,auto;
  background-blend-mode:normal,soft-light,normal,normal;
  border-color:var(--hud-rule);box-shadow:inset 0 1px #ffffff08;
}
.case-close{background:radial-gradient(ellipse at 0% 0%,#ffffff0d,transparent 70%),#121212;border-color:#ffffff35;box-shadow:inset 0 1px #ffffff10;color:#ddd}
.case-close:hover{background:#1c1c1c;border-color:#ffffff65}
.case-close:focus-visible,.case-description-hint:focus-visible{outline:2px solid #eee;outline-offset:-4px}
.case-media{background:#060606;border-color:var(--hud-rule)}
.case-player{container-type:inline-size}
.case-copy:before{display:none}
.case-copy h2{font-size:clamp(26px,2.4vw,34px);line-height:1.2}
.case-copy h2:focus-visible{outline:1px solid #ffffff55;outline-offset:6px}
.case-source{background:#ffffff04;border-color:#ffffff35;box-shadow:none}
.case-source:hover{background:#ffffff09;border-color:#ffffff65}
.tariff-dialog-content{scrollbar-color:#555 #080808}
.case-description-hint{display:none}
@media(max-width:700px){
  /* Reserve space for the fixed header, cue and a glimpse of the description. */
  .case-player{width:min(100%,calc((100dvh - 184px)*9/16));margin-inline:auto}
  .case-description-hint{display:flex;justify-content:center;align-items:center;gap:12px;min-height:48px;width:100%;padding:10px 18px;border:0;border-top:1px solid #ffffff12;background:none;color:#ddd;font:400 12px/1.5 Body,Arial,sans-serif;cursor:pointer;transition:opacity .2s,visibility .2s;-webkit-tap-highlight-color:transparent}
  .case-description-hint svg{width:19px;height:19px;flex-shrink:0;animation:caseCueDrop 1.8s ease-in-out infinite}
  .case-description-hint.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
  .case-description-hint.is-hidden svg{animation-play-state:paused}
}
/* Short windows produce a narrow portrait player: keep both 44px controls. */
@container(max-width:210px){
  .case-controls{padding:16px 4px 4px}
  .case-controls-row{display:grid;grid-template-columns:44px 44px;justify-content:space-between;gap:2px}
  .case-time{grid-column:1/-1;grid-row:2;text-align:center}
  .case-mute{grid-column:2;grid-row:1;margin-left:0}
}
@keyframes caseCueDrop{50%{transform:translateY(4px)}}
@media(prefers-reduced-motion:reduce){.case-description-hint{transition:none}.case-description-hint svg{animation:none}}
@media(forced-colors:active){
  .case-dialog.work-dialog,.tariff-dialog,.case-dialog-header,.tariff-dialog-header,.tariff-dialog-footer{background:Canvas;border-color:CanvasText;box-shadow:none}
  .case-close,.case-description-hint,.case-source{background:ButtonFace;color:ButtonText;border-color:ButtonText}
}