/* White cookie card; native inset mobile geometry remains shared. */
html body #cookie-preferences {
  background: var(--site-light-glass-surface, #fff);
  box-shadow: 0 22px 56px rgba(0, 0, 0, .19), 0 4px 18px rgba(0, 0, 0, .08);
}
@media (max-width: 600px) {
  html body #cookie-preferences {
    position: fixed;
    inset: auto max(16px, env(safe-area-inset-right)) max(28px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
    box-sizing: border-box;
    width: auto;
    max-width: none;
    max-height: min(70svh, calc(100dvh - 64px - env(safe-area-inset-top) - env(safe-area-inset-bottom)));
    margin: 0;
    padding: 20px;
    border-width: 1px;
    border-style: solid;
    border-radius: 20px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  /* A compact shadow fits within the card's insets above Safari's viewport edge. */
  html body #cookie-preferences,
  html body #cookie-preferences[data-surface] {
    box-shadow: 0 4px 12px -4px rgba(0, 0, 0, .28), 0 1px 4px rgba(0, 0, 0, .14);
  }
  html body #cookie-preferences::after { content: none; }
}

/* The consent card stays light independently of the page/photograph theme.
   Scope the shared command tokens here; consent and native controls stay native. */
html body #cookie-preferences[data-surface] {
  --studio-ui-ink: #151515;
  --studio-ui-muted: #555;
  --studio-ui-control-primary: #151515;
  --studio-ui-control-primary-ink: #fff;
  --studio-ui-button-border: #0004;
  --studio-ui-surface-rim: #0000002e;
  color-scheme: light;
  background: var(--site-light-glass-surface, #fff) !important;
  color: #151515;
  -webkit-backdrop-filter: blur(var(--site-light-glass-blur, 0px));
  backdrop-filter: blur(var(--site-light-glass-blur, 0px));
}
html body #cookie-preferences h2 { color: #151515; }
html body #cookie-preferences p { color: #555; }
html body #cookie-preferences a { color: inherit; }
html body #cookie-preferences #cookie-details > div > div { border-color: #d7d7d7; }
html body #cookie-preferences [data-studio-ui-button] { --studio-command-hover: #00000015; }
html body #cookie-preferences [data-studio-ui-variant=primary] { --studio-command-hover: #303030; }
html body #cookie-preferences [role=checkbox] {
  color: #151515;
  background: transparent;
  border-color: #888;
}
html body #cookie-preferences [role=checkbox][data-checked] {
  color: #fff;
  background: #151515;
  border-color: #151515;
}
@media (forced-colors: active) {
  html body #cookie-preferences[data-surface] {
    --studio-ui-ink: CanvasText;
    --studio-ui-muted: CanvasText;
    --studio-ui-button-border: ButtonText;
    --studio-ui-surface-rim: CanvasText;
    background: Canvas !important;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    color: CanvasText;
  }
  html body #cookie-preferences :is(h2,p) { color: CanvasText; }
  html body #cookie-preferences [role=checkbox] { color: CanvasText; border-color: CanvasText; }
  html body #cookie-preferences [role=checkbox][data-checked] { color: HighlightText; background: Highlight; border-color: Highlight; }
}