/* Exact component values from CavureBoxShell.swift; no page-specific glow. */
.cavure-box-shell {
  --box-color: var(--primary);
  --box-outline: .38;
  --box-width: 1px;
  --box-radius: 20px;
  --box-light-scale: 1;
  --box-light-opacity: 1;
  --box-light-offset: 7px;
  --box-inner-opacity: 1;
  isolation: isolate;
  border: var(--box-width) solid color-mix(in srgb, var(--box-color) calc(var(--box-outline) * 100%), transparent) !important;
  border-radius: var(--box-radius) !important;
  background: rgba(2.55, 5.1, 7.65, .70) !important;
  box-shadow: none !important;
  overflow: visible !important;
}
/* Keep existing absolute card positions; only static surfaces need positioning. */

.cavure-box-inner {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  overflow: hidden;
  pointer-events: none;
  z-index: -1;
}
.cavure-box-inner > span {
  position: absolute;
  left: 12%; top: 26%; width: 76%; height: 48%;
  border-radius: 50%;
  background: color-mix(in srgb, var(--primary) 16%, transparent);
  filter: blur(28px);
  opacity: var(--box-inner-opacity);
}
.cavure-box-shell::before, .cavure-box-shell::after {
  content: '' !important;
  position: absolute !important;
  left: calc(50% - 82px) !important;
  right: auto !important;
  width: 164px !important;
  height: 78px !important;
  border-radius: 0 !important;
  background: var(--box-light-image, url('assets/box-light.svg')) center / 164px 78px no-repeat !important;
  box-shadow: none !important;
  filter: none !important;
  opacity: var(--box-light-opacity) !important;
  transform: scale(var(--box-light-scale));
  pointer-events: none;
  z-index: 4;
}
.cavure-box-shell::before { top: calc(-32px - var(--box-light-offset)) !important; bottom: auto !important; }
.cavure-box-shell::after { bottom: calc(-32px - var(--box-light-offset)) !important; top: auto !important; }
/* Native white centre is separate from the coloured halo, not a cyan shadow. */
.cavure-box-shell.detail-card, .cavure-box-shell.detail-surface {
  --box-radius: 22px; --box-outline: .32; --box-light-scale: .80; --box-light-opacity: .70;
}
.cavure-box-shell.featured, .cavure-box-shell.list,
.cavure-box-shell.ex-editorial-card, .cavure-box-shell.native-spot-contact-story {
  --box-outline: .30; --box-light-scale: .80; --box-light-opacity: .70;
}
.cavure-box-shell.ex-card, .cavure-box-shell.insight-chart {
  --box-outline: .28; --box-light-scale: .70; --box-light-opacity: .70;
}
.cavure-box-shell.detail-card:has(.catch-headline) { --box-outline: .42; }
.native-spot-map-header.cavure-box-shell {
  --box-outline: .30; --box-light-scale: .80; --box-light-opacity: .70;
}
.cavure-box-shell:has(> .native-spot-information) {
  --box-radius: 20px; --box-outline: .28; --box-light-scale: .70; --box-light-opacity: .70;
}
.cavure-box-shell.capture-window {
  --box-color: var(--capture-color, var(--primary)); --box-outline: .86; --box-radius: 24px;
  background: rgba(2.55, 5.1, 7.65, .32) !important;
  box-shadow: 0 0 5px color-mix(in srgb, var(--box-color) 16%, transparent) !important;
}
#watch-app .cavure-box-shell {
  --box-radius: 10px; --box-outline: 1; --box-color: var(--wc-outline, var(--capture-color, var(--primary)));
}
#watch-app .ws-choice-list.cavure-box-shell {
  --box-radius: 14px; --box-width: .8px; --box-outline: .72;
  --box-light-scale: .82; --box-light-opacity: .62; --box-light-offset: 6px;
  background: linear-gradient(135deg, #00d1db1f, #008c9957), rgba(2.55,5.1,7.65,.70) !important;
  box-shadow: 0 1px 4px #00d1db24 !important;
}
.cavure-box-scroll { max-height: 104px; overflow-y: auto; scrollbar-width: none; border-radius: inherit; }
.ws-choice-list .cavure-box-scroll > button { height:44px;width:100%;padding:0 8px;display:flex;align-items:center;gap:8px;border:0;background:none;color:white;font:13px -apple-system,BlinkMacSystemFont,system-ui,sans-serif;text-align:left; }
.ws-choice-list .cavure-box-scroll > button + button { border-top:1px solid #00d1db2e; }
.cavure-box-shell.capture-window > .cavure-box-inner > span { background: color-mix(in srgb, var(--box-color) 16%, transparent); }
/* Photo contents remain clipped without clipping the shell's external accents. */
.cavure-box-shell.featured > .featured-photo { border-radius: 20px 0 0 20px; }
.cavure-box-shell.featured > .featured-content { border-radius: 0 20px 20px 0; }
.cavure-box-shell.water-tile > .water-open { border-radius: 20px; overflow: hidden; }
.cavure-box-shell.forecast-card > .forecast-atmosphere { border-radius: 20px; overflow: hidden; }