/* Luminous Reef: original living-light scenery. All layers are inert and sit
   behind the operating interface; cards and room actions retain their DOM. */
@media screen {
  html[data-theme='luminous-reef'] {
    --theme-badge-radius: 62% 22% 54% 18% / 34% 52% 28% 47%;
    --theme-badge-clip: polygon(14% 0, 77% 0, 100% 24%, 94% 74%, 72% 100%, 17% 94%, 0 67%, 4% 20%);
  }
  html[data-world='luminous-reef'] {
    --reef-cyan: #42e8e0; --reef-green: #4ccb8a; --reef-violet: #8b6fe8;
    --reef-coral: #e56f91; --reef-pearl: #e9fff9; --reef-amber: #e8aa57;
    --reef-water: #071c2c;
    --room-ambient: reef-room-breathe; --room-approach: reef-organism-travel;
    --room-note-attention: reef-pearl-note; --room-late-ambient: reef-amber-orbit;
    --room-inspect-ambient: reef-inspection-pulse;
    --cine-press: reef-press; --cine-badge: reef-badge-resolve;
    --cine-wash: reef-completion-wash; --cine-route: reef-edge-current;
    --cine-ring: reef-ripple; --cine-signal: reef-organism-travel;
    --cine-particles: reef-creature-bloom; --cine-shards: reef-creature-bloom;
    --cine-flow-ink: var(--reef-cyan); --cine-flow-secondary: var(--reef-green);
  }
  html[data-world='luminous-reef'][data-mode='light'] {
    --reef-cyan: #226f72; --reef-green: #24684c; --reef-violet: #68549b;
    --reef-coral: #b44768; --reef-pearl: #f4fbf7; --reef-amber: #a86a26;
    --reef-water: #ddf5f1;
  }
  html[data-world='luminous-reef'] .workspace > .workspace-animation-decor { display: none !important; }
  html[data-world='luminous-reef'] .world-atmosphere { opacity: .88 !important; }
  html[data-world='luminous-reef'] .world-base {
    background:
      radial-gradient(ellipse at 72% 5%, color-mix(in srgb, var(--reef-violet) 13%, transparent), transparent 47%),
      radial-gradient(ellipse at 8% 76%, color-mix(in srgb, var(--reef-green) 12%, transparent), transparent 45%),
      linear-gradient(168deg, var(--world-deep), var(--world-background) 47%, color-mix(in srgb, var(--reef-water) 85%, #154e60));
    animation: reef-water-breathe 47s ease-in-out infinite alternate;
  }
  html[data-world='luminous-reef'][data-mode='light'] .world-base {
    background:
      radial-gradient(ellipse at 61% -12%, rgba(255, 246, 207, .77), transparent 41%),
      radial-gradient(ellipse at 13% 77%, rgba(39, 198, 184, .18), transparent 38%),
      linear-gradient(170deg, #d4f3ef, #ddf5f1 48%, #a8dcd3);
  }
  html[data-world='luminous-reef'] .world-horizon {
    opacity: .22;
    background: radial-gradient(ellipse at 20% 65%, var(--reef-violet), transparent 34%), radial-gradient(ellipse at 82% 60%, var(--reef-cyan), transparent 30%);
    animation: reef-deep-current 70s ease-in-out infinite alternate;
  }
  html[data-world='luminous-reef'] .world-silhouette { opacity: .18; background: radial-gradient(ellipse at 8% 100%, var(--reef-green), transparent 39%), radial-gradient(ellipse at 98% 96%, var(--reef-violet), transparent 34%); }
  html[data-world='luminous-reef'] .world-particles-far { background-image: radial-gradient(circle, var(--reef-cyan) 0 1px, transparent 2px), radial-gradient(circle, var(--reef-violet) 0 1px, transparent 2px); background-size: 173px 197px, 251px 263px; opacity: .3; animation: reef-organisms-far 61s linear infinite alternate; }
  html[data-world='luminous-reef'] .world-particles-mid { background-image: radial-gradient(circle, var(--reef-green) 0 1px, transparent 3px), radial-gradient(circle, var(--reef-pearl) 0 1px, transparent 3px); background-size: 217px 149px, 319px 269px; opacity: .22; animation: reef-organisms-mid 39s ease-in-out infinite alternate; }
  html[data-world='luminous-reef'] .world-particles-near { opacity: .15; background: radial-gradient(ellipse at 18% 25%, var(--reef-cyan), transparent 22%), radial-gradient(ellipse at 83% 79%, var(--reef-violet), transparent 21%); animation: reef-current 34s ease-in-out infinite alternate; }

  /* Three blended depths: distant branching coral, soft midwater plants, and
     edge vegetation. Unequal phases prevent a synchronized aquarium motion. */
  html[data-cinematic='luminous-reef'] .cinema-atmosphere .reef-depth { position: absolute; inset: 0; overflow: hidden; }
  html[data-cinematic='luminous-reef'] .reef-far { opacity: .29; filter: blur(2px); }
  html[data-cinematic='luminous-reef'] .reef-mid { opacity: .61; }
  html[data-cinematic='luminous-reef'] .reef-near { opacity: .7; }
  html[data-cinematic='luminous-reef'] .reef-plant {
    position: absolute; display: block; left: var(--reef-left); bottom: var(--reef-bottom, -8%);
    width: var(--reef-width, 38px); height: var(--reef-height, 49vh);
    transform-origin: 50% 100%; border-radius: 76% 18% 56% 12% / 28% 36% 64% 30%;
    border-left: 2px solid color-mix(in srgb, var(--reef-green) 46%, transparent);
    background: linear-gradient(95deg, transparent 28%, color-mix(in srgb, var(--reef-green) 25%, transparent) 43%, color-mix(in srgb, var(--reef-cyan) 8%, transparent) 63%, transparent 85%);
    box-shadow: inset 4px 0 10px -7px var(--reef-cyan);
    animation: reef-kelp-sway var(--reef-speed, 19s) ease-in-out var(--reef-delay, 0s) infinite alternate;
  }
  html[data-cinematic='luminous-reef'] .reef-plant::before {
    content: ''; position: absolute; width: 140%; height: 33%; left: -79%; top: 27%;
    border-radius: 85% 8% 89% 6% / 77% 14% 83% 12%;
    background: linear-gradient(125deg, transparent, color-mix(in srgb, var(--reef-green) 55%, transparent), color-mix(in srgb, var(--reef-cyan) 23%, transparent));
    transform: rotate(-24deg); transform-origin: 100% 100%;
    animation: reef-frond-sway calc(var(--reef-speed, 19s) * .7) ease-in-out var(--reef-delay, 0s) infinite alternate;
  }
  html[data-cinematic='luminous-reef'] .reef-plant::after {
    content: ''; position: absolute; left: 45%; top: -2px; width: 6px; height: 6px;
    border-radius: 50%; background: var(--reef-cyan); box-shadow: 0 0 10px 3px var(--reef-cyan);
    opacity: .2; animation: reef-tip-communicate 27s ease-in-out var(--reef-delay, 0s) infinite;
  }
  .reef-plant-a { --reef-left: 7%; --reef-width: 24px; --reef-height: 43vh; --reef-speed: 29s; --reef-delay: -5s; }
  .reef-plant-b { --reef-left: 42%; --reef-width: 27px; --reef-height: 29vh; --reef-speed: 33s; --reef-delay: -17s; }
  .reef-plant-c { --reef-left: 91%; --reef-width: 31px; --reef-height: 51vh; --reef-speed: 27s; --reef-delay: -9s; }
  .reef-plant-d { --reef-left: 13%; --reef-width: 53px; --reef-height: 38vh; --reef-speed: 18s; --reef-delay: -7s; }
  .reef-plant-e { --reef-left: 77%; --reef-width: 48px; --reef-height: 58vh; --reef-speed: 22s; --reef-delay: -13s; }
  .reef-plant-f { --reef-left: -1%; --reef-width: 75px; --reef-height: 70vh; --reef-speed: 13s; --reef-delay: -4s; }
  .reef-plant-g { --reef-left: 96%; --reef-width: 64px; --reef-height: 65vh; --reef-speed: 16s; --reef-delay: -12s; }
  html[data-cinematic='luminous-reef'] .reef-pearls,
  html[data-cinematic='luminous-reef'] .reef-creatures { position: absolute; inset: 0; opacity: .62; background-image: radial-gradient(circle at 14% 27%, var(--reef-cyan) 0 2px, transparent 5px), radial-gradient(circle at 42% 65%, var(--reef-violet) 0 1px, transparent 4px), radial-gradient(circle at 68% 32%, var(--reef-pearl) 0 2px, transparent 5px), radial-gradient(circle at 84% 78%, var(--reef-green) 0 2px, transparent 4px), radial-gradient(circle at 52% 83%, var(--reef-coral) 0 1px, transparent 4px); animation: reef-organisms-mid 32s linear infinite alternate; }
  html[data-cinematic='luminous-reef'] .reef-creatures { opacity: .76; filter: drop-shadow(0 0 5px var(--reef-cyan)); animation-duration: 23s; animation-direction: alternate-reverse; }
  html[data-cinematic='luminous-reef'] .reef-jelly {
    position: absolute; width: var(--jelly-width, 64px); height: var(--jelly-height, 105px);
    left: var(--jelly-left); top: var(--jelly-top); opacity: .45;
    background: radial-gradient(ellipse at 50% 22%, color-mix(in srgb, var(--reef-pearl) 66%, transparent), color-mix(in srgb, var(--reef-violet) 26%, transparent) 46%, transparent 65%);
    border-radius: 55% 55% 48% 48% / 41% 41% 54% 54%;
    filter: drop-shadow(0 0 11px color-mix(in srgb, var(--reef-violet) 45%, transparent));
    animation: reef-jelly-drift var(--jelly-speed, 42s) ease-in-out var(--jelly-delay, 0s) infinite alternate;
  }
  html[data-cinematic='luminous-reef'] .reef-jelly::after { content: ''; position: absolute; inset: 31% 18% -34%; opacity: .5; background: repeating-linear-gradient(90deg, transparent 0 17%, var(--reef-cyan) 18% 19%, transparent 20% 33%); mask-image: linear-gradient(#000, transparent); }
  .reef-jelly-a { --jelly-left: 72%; --jelly-top: 21%; --jelly-speed: 42s; --jelly-delay: -11s; }
  .reef-jelly-b { --jelly-left: 23%; --jelly-top: 52%; --jelly-width: 38px; --jelly-height: 64px; --jelly-speed: 56s; --jelly-delay: -29s; }
  html[data-cinematic='luminous-reef'] .reef-jelly-b { filter: drop-shadow(0 0 9px color-mix(in srgb, var(--reef-coral) 50%, transparent)); }
  html[data-cinematic='luminous-reef'] .reef-caustics { position: absolute; inset: -25%; opacity: .08; background: repeating-radial-gradient(ellipse at 49% 4%, transparent 0 42px, var(--reef-pearl) 43px 44px, transparent 46px 91px); transform: rotate(-13deg); animation: reef-caustic-drift 43s ease-in-out infinite alternate; }
  html[data-cinematic='luminous-reef'][data-mode='light'] .reef-caustics { opacity: .16; }
  html[data-cinematic='luminous-reef'] .reef-response { position: absolute; inset: 0; opacity: 0; background: radial-gradient(circle 130px at var(--react-x) var(--react-y), color-mix(in srgb, var(--reef-cyan) 26%, transparent), transparent 78%), radial-gradient(circle at calc(var(--react-x) + 64px) calc(var(--react-y) - 48px), var(--reef-pearl) 0 2px, transparent 5px), radial-gradient(circle at calc(var(--react-x) - 76px) calc(var(--react-y) + 39px), var(--reef-green) 0 2px, transparent 5px); transition: opacity .5s ease-out; }
  html[data-cinematic='luminous-reef'][data-decorative-animations='on'][data-background-animations='on'] .cinema-atmosphere.is-reacting .reef-response { opacity: .8; }
  html[data-cinematic='luminous-reef'][data-decorative-animations='on'] .cinema-atmosphere.reef-awakening .reef-depth { animation: reef-awakening 2.5s ease-out both; }
  html[data-cinematic='luminous-reef'][data-decorative-animations='on'] .cinema-atmosphere.reef-awakening .reef-plant::after { animation: reef-tip-awaken 2.5s ease-out both; }
  html[data-cinematic='luminous-reef'][data-decorative-animations='on'][data-background-animations='on'] .cinema-atmosphere.reef-cascade .reef-response { animation: reef-cascade 4.3s ease-out both; }
  html[data-cinematic='luminous-reef'][data-decorative-animations='on'] .cinema-atmosphere.reef-cascade .reef-jelly-a { filter: drop-shadow(0 0 17px var(--reef-violet)); }

  /* Sea glass is layered within the edge; no clip-path is applied to cards,
     so expanded controls, menus and long room labels stay fully visible. */
  html[data-world='luminous-reef'] #app-view .view :is(.panel,.room-card,.metric,.employee-bubble,.prod-score-card,.summary-card,.metric-card):not(.card-dragging):not(:where(.print-preview-sheet *,#print-run-root *)) {
    border-radius: 34px 12px 42px 15px / 18px 36px 24px 29px !important;
    border: 1px solid color-mix(in srgb, var(--world-border) 76%, var(--reef-cyan)) !important;
    background: linear-gradient(154deg, color-mix(in srgb, var(--world-surface) 94%, var(--reef-pearl)), var(--world-surface) 57%, color-mix(in srgb, var(--world-elevated) 88%, var(--reef-violet))) !important;
    box-shadow: var(--world-shadow), inset 1px 1px 0 color-mix(in srgb, var(--reef-pearl) 30%, transparent), inset -5px -4px 18px -17px var(--reef-cyan) !important;
    overflow: visible;
    min-width: 0; max-width: 100%; box-sizing: border-box;
  }
  html[data-world='luminous-reef'] #app-view .view :is(.panel,.room-card,.metric,.employee-bubble,.prod-score-card,.summary-card,.metric-card)::before {
    border-radius: inherit !important;
    background: linear-gradient(115deg, color-mix(in srgb, var(--reef-cyan) 8%, transparent), transparent 24%, color-mix(in srgb, var(--reef-violet) 7%, transparent) 82%, transparent) !important;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--reef-cyan) 19%, transparent) !important;
  }
  html[data-world='luminous-reef'] #app-view .view :is(.panel,.room-card,.metric,.employee-bubble,.prod-score-card,.summary-card,.metric-card)::after { content: '✧'; color: var(--reef-cyan); background: transparent; border: 0; box-shadow: none; opacity: .56; }
  html[data-world='luminous-reef'] #app-view .view :is(.panel,.room-card,.metric):is(:hover,:focus-within) { border-color: color-mix(in srgb, var(--reef-cyan) 70%, var(--world-border)) !important; box-shadow: var(--world-shadow), 0 0 28px -21px var(--reef-cyan), inset 0 0 21px -17px var(--reef-violet) !important; }
  html[data-world='luminous-reef'] #app-view .view :is(.panel,.room-card,.metric)[aria-expanded='true'],
  html[data-world='luminous-reef'] #app-view .view :is(.panel,.room-card,.metric).is-expanded { border-color: var(--reef-green) !important; }
  html[data-world='luminous-reef'] #app-view .view :is(.panel,.room-card,.metric):is(.is-expanded,[aria-expanded='true'],:focus-within)::before { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--reef-green) 42%, transparent), inset 7px 0 24px -23px var(--reef-green) !important; }
  html[data-world='luminous-reef'] #app-view .view :is(.panel,.room-card,.metric):focus-within { background-image: radial-gradient(circle at 8% 92%, color-mix(in srgb, var(--reef-green) 11%, transparent), transparent 26%) !important; }
  html[data-world='luminous-reef'] .panel > .panel-head { background: linear-gradient(95deg, color-mix(in srgb, var(--reef-green) 11%, transparent), transparent 60%, color-mix(in srgb, var(--reef-violet) 9%, transparent)) !important; border-bottom: 1px solid color-mix(in srgb, var(--reef-cyan) 30%, transparent) !important; }
  html[data-world='luminous-reef'] #dashboard-view > :first-child { position: relative; isolation: isolate; }
  html[data-world='luminous-reef'] #dashboard-view > :first-child::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(circle at 75% 20%, color-mix(in srgb, var(--reef-violet) 18%, transparent), transparent 29%), radial-gradient(circle at 10% 90%, color-mix(in srgb, var(--reef-green) 20%, transparent), transparent 33%); }
  html[data-world='luminous-reef'] :is(.sidebar,.topbar,#mobile-nav-sheet,.mobile-nav-bar) { background: linear-gradient(164deg, color-mix(in srgb, var(--world-surface) 93%, var(--reef-cyan)), var(--world-deep)) !important; border-color: color-mix(in srgb, var(--reef-cyan) 45%, var(--world-border)) !important; }
  html[data-world='luminous-reef'] .sidebar nav { position: relative; background: linear-gradient(90deg, color-mix(in srgb, var(--reef-green) 8%, transparent), transparent 13%); }
  html[data-world='luminous-reef'] .sidebar nav::before { content: ''; position: absolute; inset: 2% auto 4% 16px; width: 12px; border-left: 2px solid color-mix(in srgb, var(--reef-green) 35%, transparent); border-radius: 70% 0 0 40%; pointer-events: none; background: radial-gradient(circle at 18% 12%, var(--reef-cyan) 0 2px, transparent 4px), radial-gradient(circle at 26% 51%, var(--reef-violet) 0 2px, transparent 4px), radial-gradient(circle at 18% 82%, var(--reef-green) 0 2px, transparent 4px); opacity: .52; }
  html[data-world='luminous-reef'] :is(.nav-item,.mobile-nav-sheet-item) { border-radius: 17px 5px 19px 7px !important; }
  html[data-world='luminous-reef'] :is(.nav-item.active,.mobile-nav-sheet-item.active,[aria-selected='true']) { background: radial-gradient(ellipse at 8% 50%, color-mix(in srgb, var(--reef-cyan) 24%, transparent), transparent 55%), var(--world-elevated) !important; box-shadow: inset 3px 0 var(--reef-cyan), 0 0 18px -12px var(--reef-cyan) !important; }
  html[data-world='luminous-reef'] .nav-item.active::before { content: ''; position: absolute; left: 2px; top: 50%; width: 5px; height: 5px; border-radius: 50%; background: var(--reef-cyan); box-shadow: 0 0 9px var(--reef-cyan); transform: translateY(-50%); pointer-events: none; }
  html[data-world='luminous-reef'] :is(.button,.notification-button,.world-toggle,.world-choice) { border-radius: 20px 7px 24px 10px !important; border-color: color-mix(in srgb, var(--reef-cyan) 50%, var(--world-border)) !important; background: linear-gradient(145deg, var(--world-elevated), color-mix(in srgb, var(--world-surface) 90%, var(--reef-green))) !important; }
  html[data-world='luminous-reef'] :is(.button,.notification-button):is(:hover,:focus-visible) { box-shadow: 0 0 16px -9px var(--reef-cyan), inset 0 0 11px -9px var(--reef-pearl) !important; }
  html[data-world='luminous-reef'] .button.primary { background: linear-gradient(130deg, var(--world-accent), color-mix(in srgb, var(--world-accent) 77%, var(--reef-green))) !important; }
  html[data-world='luminous-reef'] :is(.tab,.tab-button,[role='tab']) { border-radius: 20px 5px 19px 7px !important; }
  html[data-world='luminous-reef'] :is(.tab.active,.tab-button.active,[role='tab'][aria-selected='true']) { box-shadow: inset 0 -2px var(--reef-cyan), 0 3px 12px -7px var(--reef-cyan) !important; }
  html[data-world='luminous-reef'] .world-toggle { position: relative; box-shadow: inset 0 0 0 1px var(--reef-green) !important; }
  html[data-world='luminous-reef'] .world-toggle i { border-radius: 50%; background: var(--reef-pearl); box-shadow: 0 0 8px var(--reef-cyan); }
  html[data-world='luminous-reef'] :is(input,select,textarea,dialog,.notification-panel) { border-radius: 17px 6px 18px 8px !important; }
  html[data-world='luminous-reef'] :is(dialog,.notification-panel) { background: linear-gradient(145deg, var(--world-elevated), var(--world-surface)) !important; border-color: var(--world-border) !important; box-shadow: 0 24px 60px -30px var(--world-deep), inset 0 0 0 1px color-mix(in srgb, var(--reef-cyan) 20%, transparent) !important; }
  html[data-world='luminous-reef'] :is(.status-badge,.badge,.cine-room-type,.cine-operational,.cine-timing,.cine-notes,.cine-workflow) { border-radius: 18px 6px 19px 8px !important; }
  html[data-cinematic='luminous-reef'] .cine-room-type[data-room-type='arrival'] { color: var(--reef-cyan); background: color-mix(in srgb, var(--reef-cyan) 10%, var(--world-surface)); border-left: 3px solid currentColor !important; }
  html[data-cinematic='luminous-reef'] .cine-room-type[data-room-type='checkout'] { color: var(--reef-violet); background: color-mix(in srgb, var(--reef-violet) 11%, var(--world-surface)); border-right: 3px solid currentColor !important; }
  html[data-cinematic='luminous-reef'] .cine-room-type[data-room-type='stayover'] { color: var(--reef-green); background: color-mix(in srgb, var(--reef-green) 11%, var(--world-surface)); }
  html[data-cinematic='luminous-reef'] .cine-workflow[data-workflow='stripped'] { color: var(--world-secondary); background: var(--world-elevated); }
  html[data-cinematic='luminous-reef'] .cine-workflow[data-workflow='bed-made'] { color: var(--reef-cyan); background: color-mix(in srgb, var(--reef-cyan) 13%, var(--world-surface)); }
  html[data-cinematic='luminous-reef'] .cine-workflow[data-workflow='finished'] { color: var(--reef-green); background: color-mix(in srgb, var(--reef-green) 14%, var(--world-surface)); border-color: currentColor !important; }
  html[data-cinematic='luminous-reef'] .cine-room[data-cine-workflow='finished'] { border-color: color-mix(in srgb, var(--reef-green) 66%, var(--world-border)) !important; }
  html[data-cinematic='luminous-reef'] .cine-room[data-cine-workflow='finished'] .cine-room-ambient { box-shadow: inset 0 0 19px -13px var(--reef-green); }
  html[data-cinematic='luminous-reef'] .cine-dnd { color: var(--reef-coral); border-left-color: currentColor !important; box-shadow: none !important; }
  html[data-cinematic='luminous-reef'] .cine-timing,
  html[data-cinematic='luminous-reef'] .cine-inspection { color: var(--reef-amber); }
  html[data-cinematic='luminous-reef'] .cine-notes { color: var(--world-text); box-shadow: inset -4px 0 color-mix(in srgb, var(--reef-pearl) 24%, transparent) !important; }
  html[data-cinematic='luminous-reef'] .cine-room-ambient .arrivalAmbient { width: 23px; background: radial-gradient(ellipse at left, var(--reef-cyan), transparent 72%); }
  html[data-cinematic='luminous-reef'] .cine-room-ambient .checkoutAmbient { width: 23px; background: radial-gradient(ellipse at right, var(--reef-violet), transparent 72%); }
  html[data-cinematic='luminous-reef'] .cine-room-ambient .stayoverAmbient { height: 8px; background: radial-gradient(ellipse, var(--reef-green), transparent 71%); opacity: .25; }
  html[data-cinematic='luminous-reef'] .cine-room[data-room-transition-active='bed-made'] .cine-transition-fx { color: var(--reef-cyan); }
  html[data-cinematic='luminous-reef'] .cine-room[data-room-transition-active='finished'] .cine-transition-fx { color: var(--reef-green); }
  html[data-cinematic='luminous-reef'] .cine-room[data-room-transition-active='finished'] .cine-fx-particles i { box-shadow: 0 0 10px 2px var(--reef-cyan); }
  html[data-cinematic='luminous-reef'] .cine-room[data-room-transition-active='finished'] .cine-fx-rose { display: block; stroke: var(--reef-cyan); animation: reef-jelly-confirm var(--cine-fx-duration) ease-out both; }
  html[data-cinematic='luminous-reef'] .cine-room[data-room-transition-active='finished'] .cine-fx-rose path { stroke-dasharray: 100; animation: reef-edge-current var(--cine-fx-duration) ease-out both; }
  html[data-cinematic='luminous-reef'] .cine-room[data-room-transition-active='stripped'] .cine-fx-particles { display: none; }
  html[data-cinematic='luminous-reef'] .cine-room[data-room-transition-active='finished'] .cine-workflow { animation: reef-badge-resolve 1.4s ease-out 1 !important; }
  html[data-world='luminous-reef'] .world-loading-indicator { width: 28px; height: 28px; background: none; mask: none; position: relative; border-left: 2px solid var(--reef-green); border-radius: 47% 30% 50% 12%; transform-origin: center bottom; animation: reef-polyp-sway 1.8s ease-in-out infinite alternate; }
  html[data-world='luminous-reef'] .world-loading-indicator::before,
  html[data-world='luminous-reef'] .world-loading-indicator::after { content: ''; position: absolute; width: 8px; height: 8px; border-radius: 50%; background: var(--reef-cyan); box-shadow: 0 0 9px var(--reef-cyan); top: 4px; left: 0; animation: reef-polyp-tip 1.8s ease-in-out infinite; }
  html[data-world='luminous-reef'] .world-loading-indicator::after { top: 15px; left: 11px; background: var(--reef-violet); animation-delay: .6s; }
  html[data-world='luminous-reef'] .empty-state { position: relative; background: radial-gradient(ellipse at 7% 93%, color-mix(in srgb, var(--reef-green) 9%, transparent), transparent 28%); }
  html[data-world='luminous-reef'] .empty-state:not(:has(.world-loading-indicator))::after { content: '✧'; position: absolute; right: 13px; bottom: 8px; color: var(--reef-cyan); opacity: .45; font-size: 14px; }
  html[data-cinematic='luminous-reef'] .cinema-transition[data-transition='luminous-reef'] { background: linear-gradient(105deg, transparent 15%, color-mix(in srgb, var(--reef-cyan) 12%, transparent) 52%, transparent 82%); animation: reef-page-current 650ms ease-out both; }
  html[data-cinematic='luminous-reef'] .cinema-transition[data-transition='luminous-reef'] i { width: 4px; height: 4px; border-radius: 50%; background: var(--reef-cyan); box-shadow: 0 0 9px var(--reef-cyan); animation: reef-page-organisms 620ms ease-out both; }
  html[data-cinematic='luminous-reef'] .cinema-transition[data-transition='luminous-reef'] i:nth-child(1) { top: 22%; left: 15%; }
  html[data-cinematic='luminous-reef'] .cinema-transition[data-transition='luminous-reef'] i:nth-child(2) { top: 68%; left: 37%; animation-delay: 45ms; }
  html[data-cinematic='luminous-reef'] .cinema-transition[data-transition='luminous-reef'] i:nth-child(3) { top: 34%; left: 72%; animation-delay: 95ms; }
  html[data-cinematic='luminous-reef'] .cinema-transition[data-transition='luminous-reef'] i:nth-child(4) { top: 81%; left: 85%; animation-delay: 155ms; }
  html[data-cinematic='luminous-reef'] .cinema-transition[data-transition='luminous-reef'] i:nth-child(5) { top: 53%; left: 57%; animation-delay: 70ms; }

  /* The scheduler chooses one rare behavior every several minutes. */
  html[data-world='luminous-reef'] .world-atmosphere[data-event='reef-night-bloom'] .world-rare,
  html[data-world='luminous-reef'] .world-atmosphere[data-event='reef-deep-bloom'] .world-rare { inset: 0; background: radial-gradient(circle at 16% 73%, var(--reef-green) 0 2px, transparent 8px), radial-gradient(circle at 38% 28%, var(--reef-cyan) 0 2px, transparent 9px), radial-gradient(circle at 73% 67%, var(--reef-violet) 0 3px, transparent 11px), radial-gradient(circle at 85% 18%, var(--reef-pearl) 0 2px, transparent 8px); animation: reef-rare-bloom 12s ease-in-out both; }
  html[data-world='luminous-reef'] .world-atmosphere[data-event='reef-jelly-migration'] .world-rare { inset: 15% -30%; background: radial-gradient(ellipse at 17% 28%, color-mix(in srgb, var(--reef-violet) 35%, transparent) 0 2%, transparent 6%), radial-gradient(ellipse at 45% 53%, color-mix(in srgb, var(--reef-cyan) 35%, transparent) 0 2%, transparent 6%), radial-gradient(ellipse at 70% 22%, color-mix(in srgb, var(--reef-green) 35%, transparent) 0 2%, transparent 6%); animation: reef-migration 12s ease-in-out both; }
  html[data-world='luminous-reef'] .world-atmosphere[data-event='reef-constellation'] .world-rare { inset: 0; background-image: radial-gradient(circle at 20% 30%, var(--reef-cyan) 0 1px, transparent 4px), radial-gradient(circle at 36% 67%, var(--reef-pearl) 0 1px, transparent 4px), radial-gradient(circle at 53% 38%, var(--reef-violet) 0 1px, transparent 4px), radial-gradient(circle at 76% 57%, var(--reef-green) 0 1px, transparent 4px); animation: reef-rare-bloom 12s ease-in-out both; }
  html[data-world='luminous-reef'] .world-atmosphere[data-event='reef-wave'] .world-rare { inset: 0; background: linear-gradient(104deg, transparent 20%, color-mix(in srgb, var(--reef-green) 16%, transparent) 49%, transparent 73%); animation: reef-wave 12s ease-in-out both; }
  html[data-world='luminous-reef'] .world-atmosphere[data-event='reef-sun-column'] .world-rare { inset: -12% 10%; background: linear-gradient(112deg, transparent 31%, color-mix(in srgb, #fff6cf 34%, transparent) 50%, transparent 65%); animation: reef-rare-bloom 12s ease-in-out both; }
  html[data-world='luminous-reef'] .world-atmosphere[data-event='reef-deep-bloom'] .world-base { animation: reef-deep-darkness 12s ease-in-out both; }
  html[data-world='luminous-reef'] .world-atmosphere[data-event='reef-sun-column'] + .cinema-atmosphere .reef-creatures { animation: reef-sun-creature 12s ease-in-out both; }
  html[data-world='luminous-reef'] .world-atmosphere[data-event='reef-night-bloom'] + .cinema-atmosphere .reef-plant::after { animation: reef-rare-tips 12s ease-in-out both; }
  html[data-world='luminous-reef'] .world-atmosphere[data-event='reef-wave'] + .cinema-atmosphere .reef-plant { animation: reef-wave-kelp 12s ease-in-out both; }
  html[data-world='luminous-reef'] .world-atmosphere[data-event='reef-wave'] + .cinema-atmosphere .reef-plant:nth-child(even) { animation-delay: .8s; }

  html[data-world='luminous-reef'][data-world-performance='lite'] .reef-far,
  html[data-world='luminous-reef'][data-world-performance='lite'] .reef-jelly-b,
  html[data-world='luminous-reef'][data-world-performance='lite'] .reef-creatures { display: none; }
  html[data-world='luminous-reef'].world-focus-mode .cinema-atmosphere { opacity: .35; }
  @media (max-width: 700px) {
    html[data-world='luminous-reef'] .reef-mid .reef-plant-d,
    html[data-world='luminous-reef'] .reef-jelly-b { display: none; }
    html[data-world='luminous-reef'] #app-view .view :is(.panel,.room-card,.metric,.employee-bubble,.prod-score-card,.summary-card,.metric-card) { border-radius: 22px 8px 26px 10px / 16px 24px 19px 21px !important; }
    html[data-world='luminous-reef'] :is(.button,.notification-button) { min-height: 44px; }
  }
  @media (prefers-reduced-motion: reduce) {
    html[data-world='luminous-reef'] :is(.world-atmosphere,.cinema-atmosphere,.cinema-transition) *,
    html[data-world='luminous-reef'] :is(.world-atmosphere,.cinema-atmosphere,.cinema-transition) *::before,
    html[data-world='luminous-reef'] :is(.world-atmosphere,.cinema-atmosphere,.cinema-transition) *::after { animation: none !important; transition: none !important; }
  }
  html[data-world='luminous-reef'][data-background-animations='off'] .cinema-atmosphere *,
  html[data-world='luminous-reef'][data-decorative-animations='off'] :is(.reef-response,.cine-transition-fx) { animation: none !important; }
}
@media print { html[data-world='luminous-reef'] .cinema-atmosphere { display: none !important; } }

@keyframes reef-water-breathe { from { filter: brightness(.92); } to { filter: brightness(1.09); } }
@keyframes reef-living-light { 0%, 100% { opacity: .42; } 45% { opacity: .65; } 52% { opacity: .49; } }
@keyframes reef-deep-current { from { translate: -2% 0; } to { translate: 2% 1%; } }
@keyframes reef-organisms-far { from { background-position: 0 0, 0 0; } to { background-position: 24px -21px, -18px -38px; } }
@keyframes reef-organisms-mid { from { translate: -1% 1%; } to { translate: 2% -3%; } }
@keyframes reef-current { from { translate: -2% 0; } to { translate: 2% 1%; } }
@keyframes reef-kelp-sway { from { transform: rotate(-4deg) skewX(-1deg); } to { transform: rotate(5deg) skewX(2deg); } }
@keyframes reef-frond-sway { from { transform: rotate(-28deg); } to { transform: rotate(-9deg); } }
@keyframes reef-tip-communicate { 0%, 9%, 18%, 100% { opacity: .2; } 11% { opacity: .8; } 14% { opacity: .55; } 16% { opacity: .87; } }
@keyframes reef-jelly-drift { from { transform: translate(-16px, 17px) rotate(-3deg); } to { transform: translate(24px, -31px) rotate(4deg); } }
@keyframes reef-caustic-drift { from { transform: translate(-2%, -1%) rotate(-13deg); } to { transform: translate(3%, 2%) rotate(-9deg); } }
@keyframes reef-room-breathe { 0%, 100% { opacity: .12; } 53% { opacity: .27; } }
@keyframes reef-organism-travel { 0%, 100% { opacity: 0; transform: translateY(30px); } 46% { opacity: .85; } 70% { opacity: .25; transform: translateY(-18px); } }
@keyframes reef-pearl-note { 0% { box-shadow: 0 0 0 0 var(--reef-cyan); } 50% { box-shadow: 0 0 0 5px transparent, 0 0 12px var(--reef-cyan); } 100% { box-shadow: none; } }
@keyframes reef-amber-orbit { 0%, 100% { opacity: .25; transform: rotate(0); } 50% { opacity: .8; transform: rotate(180deg); } }
@keyframes reef-inspection-pulse { 0%, 100% { opacity: .38; scale: 1; } 48% { opacity: .85; scale: 1.75; } }
@keyframes reef-press { 0% { box-shadow: inset 0 0 0 0 var(--cine-press-ink); } 48% { box-shadow: inset 0 0 0 3px var(--cine-press-ink); } 100% { box-shadow: inset 0 0 0 0 transparent; } }
@keyframes reef-badge-resolve { 0% { opacity: .55; box-shadow: 0 0 0 0 transparent; } 42% { opacity: 1; box-shadow: 0 0 16px var(--reef-cyan); } 100% { box-shadow: 0 0 0 0 transparent; } }
@keyframes reef-completion-wash { 0%, 100% { opacity: 0; } 40% { opacity: .19; } 74% { opacity: .3; } }
@keyframes reef-edge-current { 0% { stroke-dashoffset: 100; opacity: .2; } 55% { opacity: .85; } 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes reef-ripple { 0% { opacity: 0; scale: .6; } 42% { opacity: .7; } 100% { opacity: 0; scale: 2.2; } }
@keyframes reef-creature-bloom { 0%, 100% { opacity: 0; transform: translateY(5px) scale(.5); } 30% { opacity: .65; } 70% { opacity: .95; transform: translateY(-16px) scale(1); } }
@keyframes reef-jelly-confirm { 0%, 100% { opacity: 0; scale: .7; } 50% { opacity: .48; scale: 1.18; } }
@keyframes reef-page-current { 0% { opacity: 0; translate: -8% 0; } 45% { opacity: 1; } 100% { opacity: 0; translate: 8% 0; } }
@keyframes reef-page-organisms { 0% { opacity: 0; transform: translateX(-25px); } 50% { opacity: .75; } 100% { opacity: 0; transform: translateX(55px); } }
@keyframes reef-rare-bloom { 0%, 100% { opacity: 0; filter: brightness(.7); } 25%, 67% { opacity: .5; filter: brightness(1.2); } }
@keyframes reef-migration { 0%, 100% { opacity: 0; translate: -24% 4%; } 45% { opacity: .38; } 80% { opacity: .26; } 100% { translate: 24% -4%; } }
@keyframes reef-wave { 0%, 100% { opacity: 0; translate: -18% 0; } 40% { opacity: .48; } 100% { translate: 18% 0; } }
@keyframes reef-awakening { from { opacity: 0; filter: saturate(.3); } 68% { opacity: 1; filter: saturate(1.2); } to { opacity: 1; filter: none; } }
@keyframes reef-tip-awaken { 0%, 16%, 100% { opacity: .2; } 29%, 46% { opacity: .8; } 66% { opacity: .55; } }
@keyframes reef-cascade { 0%, 100% { opacity: 0; } 15% { opacity: .7; } 31% { opacity: .22; } 49% { opacity: .8; } 74% { opacity: .31; } }
@keyframes reef-polyp-sway { from { transform: rotate(-9deg); } to { transform: rotate(8deg); } }
@keyframes reef-polyp-tip { 0%, 100% { opacity: .24; } 35% { opacity: .95; } }
@keyframes reef-deep-darkness { 0%, 100% { filter: brightness(1); } 15%, 44% { filter: brightness(.65); } 75% { filter: brightness(.83); } }
@keyframes reef-sun-creature { 0%, 100% { opacity: .62; } 45% { opacity: .96; filter: brightness(1.5); } }
@keyframes reef-rare-tips { 0%, 100% { opacity: .2; } 24% { opacity: .85; } 41% { opacity: .42; } 60% { opacity: .9; } }
@keyframes reef-wave-kelp { 0%, 100% { transform: rotate(0); } 46% { transform: rotate(9deg); } 68% { transform: rotate(-4deg); } }