@font-face { font-display: swap; font-family: "Lato Radar"; font-style: normal; font-weight: 400; src: url("/dashboard/fonts/Lato-Regular.ttf") format("truetype"); }
@font-face { font-display: swap; font-family: "Lato Radar"; font-style: normal; font-weight: 700; src: url("/dashboard/fonts/Lato-Bold.ttf") format("truetype"); }
@font-face { font-display: swap; font-family: "Lilita Radar"; font-style: normal; font-weight: 400; src: url("/dashboard/fonts/LilitaOne-Regular.ttf") format("truetype"); }
@font-face { font-display: swap; font-family: "Bangers Radar"; font-style: normal; font-weight: 400; src: url("/dashboard/fonts/Bangers-Regular.ttf") format("truetype"); }
@font-face { font-display: swap; font-family: "Caveat Radar"; font-style: normal; font-weight: 400; src: url("/dashboard/fonts/CaveatBrush-Regular.ttf") format("truetype"); }
@font-face { font-display: swap; font-family: "Pacifico Radar"; font-style: normal; font-weight: 400; src: url("/dashboard/fonts/Pacifico-Regular.ttf") format("truetype"); }
@font-face { font-display: swap; font-family: "Kalam Radar"; font-style: normal; font-weight: 400; src: url("/dashboard/fonts/Kalam-Regular.ttf") format("truetype"); }
@font-face { font-display: swap; font-family: "Short Stack Radar"; font-style: normal; font-weight: 400; src: url("/dashboard/fonts/ShortStack-Regular.ttf") format("truetype"); }
@font-face { font-display: swap; font-family: "Knewave Radar"; font-style: normal; font-weight: 400; src: url("/dashboard/fonts/Knewave-Regular.ttf") format("truetype"); }

:root {
  color-scheme: light;
  --ink: #18212b;
  --muted: #687480;
  --paper: #fffaf4;
  --surface: #ffffff;
  --line: #e9dfd4;
  --coral: #f65a3a;
  --coral-dark: #c93822;
  --navy: #102b3f;
  --green: #17785d;
  --amber: #a85d00;
  --red: #b73527;
  --blue: #246da0;
  --accent: var(--coral);
  --focus: rgba(36, 109, 160, 0.42);
  --surface-muted: #f5eee7;
  --shadow: 0 18px 48px rgba(41, 31, 23, 0.08);
  --shadow-soft: 0 10px 30px rgba(41, 31, 23, 0.07);
  --shadow-raised: 0 22px 55px rgba(16, 43, 63, 0.13);
  --space-1: .35rem;
  --space-2: .65rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --control-height: 2.45rem;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background:
    linear-gradient(rgba(255, 250, 244, 0.88), rgba(255, 250, 244, 0.94)),
    url("/dashboard/assets/images/radar-editorial-background.webp") center top / cover fixed,
    var(--paper);
  color: var(--ink);
  font-family: "Lato Radar", ui-sans-serif, system-ui, sans-serif;
  min-height: 100vh;
  line-height: 1.45;
}

.skip-link {
  left: 1rem;
  position: fixed;
  top: -5rem;
  z-index: 10;
}

.skip-link:focus { top: 1rem; }

.topbar {
  align-items: center;
  backdrop-filter: blur(18px) saturate(1.15);
  background: rgba(255, 250, 244, 0.78);
  border-bottom: 1px solid rgba(233, 223, 212, 0.72);
  display: grid;
  grid-template-columns: minmax(9rem, 1fr) auto minmax(9rem, 1fr);
  padding: 1rem clamp(1rem, 4vw, 4rem);
  position: sticky;
  top: 0;
  z-index: 20;
}

.primary-nav { align-items: center; display: flex; gap: 1.15rem; justify-self: center; }
.ui-icon { fill: none; flex: 0 0 auto; height: 1.05rem; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; width: 1.05rem; }
.primary-nav > a, .nav-group-trigger { align-items: center; border-radius: 0; color: var(--muted); display: inline-flex; font-size: 0.85rem; font-weight: 750; gap: .42rem; padding: 0.65rem 0.1rem; position: relative; text-decoration: none; }
.primary-nav > a:focus, .nav-group-trigger:focus { outline: none; }
.primary-nav > a:focus-visible, .nav-group-trigger:focus-visible { color: var(--navy); }
.primary-nav > a::after, .nav-group-trigger::before { background: var(--coral); bottom: 0; content: ""; height: 2px; left: 0; position: absolute; transform: scaleX(0); transform-origin: left; transition: transform 160ms ease; width: 100%; }
.primary-nav > a:hover, .primary-nav > a[aria-current="page"] { background: transparent; color: var(--navy); }
.primary-nav > a:hover::after, .primary-nav > a:focus-visible::after, .primary-nav > a[aria-current="page"]::after, .nav-group-trigger:hover::before, .nav-group-trigger:focus-visible::before, .nav-group-trigger.active::before, .nav-group.open .nav-group-trigger::before { transform: scaleX(1); }
.primary-nav span[aria-disabled="true"] { cursor: not-allowed; opacity: 0.42; }
.nav-group { position: relative; }
.nav-group-trigger { align-items: center; background: transparent; border: 0; box-shadow: none; color: var(--muted); cursor: pointer; display: flex; font-family: inherit; gap: 0.35rem; min-height: auto; transform: none; }
.nav-chevron { height: .85rem; margin-left: -.12rem; transition: transform 160ms ease; width: .85rem; }
.nav-incident-badge { align-items: center; background: var(--red); border: 2px solid var(--paper); border-radius: 999px; color: white; display: inline-flex; font-size: .58rem; font-weight: 700; height: 1.25rem; justify-content: center; line-height: 1; min-width: 1.25rem; padding: 0 .22rem; }
.nav-incident-badge[hidden] { display: none; }
.nav-group-trigger:hover, .nav-group-trigger:active, .nav-group-trigger.active, .nav-group.open .nav-group-trigger { background: transparent; box-shadow: none; color: var(--navy); transform: none; }
.nav-group.open .nav-chevron { transform: rotate(180deg); }
.nav-submenu { background: rgba(255, 255, 255, 0.98); border: 1px solid var(--line); border-radius: 0 0 0.45rem 0.45rem; box-shadow: 0 14px 28px rgba(16, 43, 63, 0.12); display: none; left: 0; min-width: 12rem; padding: 0.35rem; position: absolute; top: calc(100% + 0.15rem); }
.nav-group.open .nav-submenu { display: grid; }
.nav-submenu a { align-items: center; border-bottom: 1px solid var(--line); border-radius: 0; color: var(--muted); display: flex; gap: .65rem; padding: 0.75rem 0.8rem; text-decoration: none; white-space: nowrap; }
.nav-submenu a .ui-icon { color: #9a897b; height: 1rem; width: 1rem; }
.nav-submenu a:hover .ui-icon, .nav-submenu a[aria-current="page"] .ui-icon { color: var(--coral); }
.nav-submenu a:last-child { border-bottom: 0; }
.nav-submenu a:hover, .nav-submenu a:focus-visible, .nav-submenu a[aria-current="page"] { background: #fff8f3; color: var(--coral-dark); outline: none; text-decoration: none; }

.brand {
  align-items: center;
  color: var(--navy);
  display: flex;
  font-size: 1.05rem;
  font-weight: 800;
  gap: 0.65rem;
  justify-self: start;
  text-decoration: none;
}

.brand-mark {
  align-items: center;
  background: var(--coral);
  border-radius: 0.7rem;
  color: white;
  display: inline-flex;
  font-size: 1.2rem;
  height: 2.25rem;
  justify-content: center;
  width: 2.25rem;
  box-shadow: 0 8px 20px rgba(246, 90, 58, 0.25);
  transform: rotate(-3deg);
}

.environment {
  background: rgba(16, 43, 63, 0.08);
  border-radius: 999px;
  color: var(--navy);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  padding: 0.5rem 0.75rem;
  justify-self: end;
  text-transform: uppercase;
}
.context-help-link { align-items: center; background: rgba(255,255,255,.92); border: 1px solid rgba(255,255,255,.62); border-radius: 999px; color: var(--navy); display: inline-flex; font-size: .7rem; gap: .35rem; margin-top: .8rem; padding: .42rem .65rem; text-decoration: none; white-space: nowrap; width: fit-content; }
.context-help-link:hover { background: white; color: var(--coral-dark); transform: translateY(-1px); }
.context-help-link:focus-visible { box-shadow: 0 0 0 3px rgba(255,255,255,.35); color: var(--coral-dark); outline: 2px solid var(--coral); outline-offset: 2px; }
.dashboard-update-notice { align-items: center; animation: dashboard-update-enter .2s ease-out; background: #102b3f; border: 1px solid rgba(255,255,255,.16); border-radius: 1rem; bottom: 1rem; box-shadow: 0 1rem 2.8rem rgba(8,25,36,.28); color: white; display: flex; gap: 1rem; left: 50%; max-width: min(34rem,calc(100vw - 2rem)); padding: .8rem .9rem .8rem 1rem; position: fixed; transform: translateX(-50%); width: max-content; z-index: 13000; }
.dashboard-update-notice > div { display: grid; gap: .1rem; min-width: 0; }
.dashboard-update-notice strong { font-size: .82rem; }
.dashboard-update-notice span { color: rgba(255,255,255,.72); font-size: .7rem; }
.dashboard-update-notice button { background: #ffca66; color: #102b3f; flex: 0 0 auto; font-size: .7rem; min-height: 2.25rem; padding: .5rem .7rem; }
.dashboard-update-notice button:hover { background: #ffd88f; }
@keyframes dashboard-update-enter { from { opacity: 0; transform: translate(-50%,.65rem); } to { opacity: 1; transform: translate(-50%,0); } }

.shell {
  margin: 0 auto;
  max-width: 1180px;
  padding: clamp(1.35rem, 3vw, 2.5rem) clamp(1rem, 4vw, 2rem) 4rem;
}

main.shell:not(#reels-lab) { display: grid; gap: var(--space-3); }
main.shell:not(#reels-lab) > section,
main.shell:not(#reels-lab) > aside,
main.shell:not(#reels-lab) > p { margin-bottom: 0; margin-top: 0; }

.hero {
  align-items: end;
  display: flex;
  gap: 2rem;
  justify-content: space-between;
}
.hero-compact h1 { max-width: 12ch; }

.executive-shell { padding-bottom: 4rem; }
.executive-hero { align-items: end; background: linear-gradient(110deg, rgba(255, 255, 255, 0.82), rgba(255, 247, 239, 0.52)); border: 1px solid rgba(255, 255, 255, 0.85); border-radius: 2rem; box-shadow: 0 30px 80px rgba(40, 29, 20, 0.09); display: grid; gap: 2rem; grid-template-columns: minmax(0, 1.55fr) minmax(18rem, 0.65fr); margin-top: 2rem; overflow: hidden; padding: clamp(2rem, 5vw, 4rem); position: relative; }
.executive-hero::after { border: 1px solid rgba(246, 90, 58, 0.18); border-radius: 50%; content: ""; height: 18rem; position: absolute; right: -7rem; top: -10rem; width: 18rem; }
.executive-hero h1 { font-size: clamp(2.8rem, 5.5vw, 5rem); letter-spacing: -0.045em; line-height: 0.94; margin: 0.35rem 0 1.25rem; max-width: 13ch; }
.hero-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 1.75rem; }
.primary-action { align-items: center; background: linear-gradient(135deg, var(--coral), #f47c43); border-radius: 0.7rem; box-shadow: 0 8px 18px rgba(201, 56, 34, 0.18); color: white; display: inline-flex; font-weight: 500; justify-content: center; min-height: 2.5rem; padding: 0.62rem 1rem; text-decoration: none; transition: transform 160ms ease, box-shadow 160ms ease; }
.primary-action:hover { box-shadow: 0 14px 28px rgba(201, 56, 34, 0.26); transform: translateY(-2px); }
.secondary-action { align-items: center; background: white; border: 1px solid var(--line); border-radius: 0.7rem; box-shadow: none; color: var(--navy); display: inline-flex; font-weight: 500; justify-content: center; min-height: 2.5rem; padding: 0.58rem 0.9rem; text-decoration: none; }
.secondary-action:hover { background: white; border-color: #d6c7ba; }
.secondary-action > .ui-icon, button > .ui-icon { margin-right: .42rem; }
.text-action { color: var(--coral-dark); display: inline-block; font-weight: 900; margin-top: 0.5rem; text-decoration: none; }
.hero-signal { background: linear-gradient(145deg, rgba(16, 43, 63, 0.94), rgba(29, 76, 105, 0.9)), url("/dashboard/assets/images/radar-editorial-background.webp") right center / cover; border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 1.5rem; box-shadow: var(--shadow-raised); color: white; padding: 1.5rem; position: relative; z-index: 1; }

.visual-assets-grid { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); margin-top: 1.5rem; }
.platforms-shell { max-width: 1280px; }
.platforms-hero { align-items: end; }
.platforms-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(285px, 1fr)); margin-top: 1rem; }
.platforms-filters { align-items: end; background: #f7f3ee; border: 1px solid var(--line); border-radius: .9rem; display: grid; gap: .75rem; grid-template-columns: minmax(14rem, 2fr) minmax(10rem, 1fr) minmax(11rem, 1fr) auto; margin-top: 1rem; padding: .8rem; }
.platforms-filters label { display: grid; gap: .3rem; min-width: 0; }
.platforms-filters label span { color: var(--muted); font-size: .7rem; text-transform: uppercase; }
.platforms-filters input, .platforms-filters select { min-width: 0; width: 100%; }
.platforms-results { color: var(--muted); font-size: .78rem; margin: .75rem 0 0; }
.platform-issues-panel { background: #fff8ed; border: 1px solid #efd3a5; border-radius: 1rem; margin: 1rem 0; padding: 1rem; }
.platform-issues-panel-ready { background: #edf8f4; border-color: #b9ded1; }
.platform-issues-count { background: #fff; border-radius: 999px; color: var(--navy); font-size: .72rem; padding: .4rem .65rem; }
.platform-issues { display: grid; gap: .6rem; margin-top: .75rem; }
.platform-issue { align-items: start; background: rgba(255,255,255,.8); border-radius: .75rem; display: grid; gap: .75rem; grid-template-columns: auto 1fr; padding: .75rem; }
.platform-issue > span { background: #fff0d6; border-radius: 999px; color: #895300; font-size: .68rem; padding: .3rem .5rem; }
.platform-issue-critical > span { background: #fde4df; color: #a52f20; }
.platform-issue h3, .platform-issue p { margin: 0; }
.platform-issue p, .platform-issue small, .platform-issues-ready { color: var(--muted); }
.platform-issue p { margin-top: .2rem; }
.platform-issues-ready { margin: 0; }
.platform-card { background: rgba(255,255,255,.94); border: 1px solid var(--line); border-radius: 1rem; display: grid; gap: .9rem; min-width: 0; padding: 1rem; }
.platform-card > header { align-items: flex-start; display: flex; gap: 1rem; justify-content: space-between; }
.platform-card h3 { margin: .18rem 0 0; }
.platform-category { color: var(--muted); font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; }
.platform-status { background: #eef1f3; border-radius: 999px; color: var(--navy); font-size: .7rem; padding: .35rem .55rem; white-space: nowrap; }
.platform-configured { border-top: 3px solid #1f8065; }
.platform-configured .platform-status { background: #e1f4ed; color: #17634f; }
.platform-partial { border-top: 3px solid #d88b17; }
.platform-partial .platform-status { background: #fff0d6; color: #895300; }
.platform-inactive, .platform-not_configured { border-top: 3px solid #aeb6bd; }
.platform-purpose { color: var(--muted); margin: 0; min-height: 2.5em; }
.platform-dependencies { display: flex; flex-wrap: wrap; gap: .35rem; list-style: none; margin: 0; padding: 0; }
.platform-dependencies li { background: #f4f1ed; border-radius: 999px; color: var(--navy); font-size: .7rem; padding: .3rem .5rem; }
.platform-card dl { display: grid; gap: .6rem; grid-template-columns: 1fr 1fr; margin: 0; }
.platform-card dl div { border-top: 1px solid var(--line); min-width: 0; padding-top: .5rem; }
.platform-card dt { color: var(--muted); font-size: .68rem; text-transform: uppercase; }
.platform-card dd { color: var(--navy); margin: .15rem 0 0; overflow-wrap: anywhere; }
.platform-settings { border-top: 1px solid var(--line); padding-top: .7rem; }
.platform-settings summary { color: var(--navy); cursor: pointer; font-size: .78rem; }
.platform-settings dl { display: grid; gap: 0; grid-template-columns: 1fr; margin-top: .65rem; }
.platform-settings dl div { border-left: 3px solid #aeb6bd; display: grid; gap: .15rem; padding: .5rem .6rem; }
.platform-settings dl .platform-setting-medium { border-left-color: #d88b17; }
.platform-settings dl .platform-setting-high { border-left-color: #cc4633; }
.platform-settings small { color: var(--muted); font-size: .66rem; }
@media (max-width: 760px) { .platforms-filters { grid-template-columns: 1fr; } .platforms-filters button { width: 100%; } }
.help-shell { max-width: 1180px; }
.help-hero { align-items: end; }
.help-search { display: grid; gap: .35rem; min-width: min(24rem, 100%); }
.help-search span { color: rgba(255,255,255,.9); font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.help-search input { background: rgba(255,255,255,.96); border-color: rgba(255,255,255,.58); box-shadow: 0 8px 24px rgba(4,20,31,.16); color: var(--navy); width: 100%; }
.help-search input::placeholder { color: #73808a; }
.help-search input:focus { background: white; border-color: #ffb09c; box-shadow: 0 0 0 3px rgba(255,176,156,.24), 0 8px 24px rgba(4,20,31,.16); }
.help-categories { display: flex; flex-wrap: wrap; gap: .45rem; margin: 1rem 0; }
.help-system-guide { background: linear-gradient(135deg, #12364a, #194d52); border-radius: 1rem; color: white; overflow: hidden; }
.help-system-guide > summary { align-items: center; cursor: pointer; display: flex; gap: 1rem; justify-content: space-between; list-style: none; padding: 1rem 1.15rem; }
.help-system-guide > summary::-webkit-details-marker { display: none; }
.help-system-guide > summary span:first-child { display: grid; gap: .2rem; }
.help-system-guide > summary small { color: #b9d5d2; font-size: .66rem; letter-spacing: .05em; text-transform: uppercase; }
.help-system-guide > summary strong { font-family: "Lilita Radar", sans-serif; font-size: 1.25rem; font-weight: 400; }
.help-guide-toggle { border: 1px solid rgba(255,255,255,.25); border-radius: 999px; font-size: .7rem; padding: .4rem .65rem; white-space: nowrap; }
.help-system-guide[open] .help-guide-toggle { background: rgba(255,255,255,.12); }
.help-system-guide-body { border-top: 1px solid rgba(255,255,255,.14); padding: 1rem 1.15rem 1.15rem; }
.help-system-guide-body > p { color: #d8e7e5; margin: 0 0 1rem; }
.help-journey { display: grid; gap: .55rem; grid-template-columns: repeat(2, 1fr); list-style: none; margin: 0; padding: 0; }
.help-journey li { align-items: start; background: rgba(255,255,255,.08); border-radius: .75rem; display: grid; gap: .65rem; grid-template-columns: auto 1fr; padding: .7rem; }
.help-journey li > span { align-items: center; background: var(--coral); border-radius: 50%; display: flex; font-size: .68rem; height: 1.4rem; justify-content: center; width: 1.4rem; }
.help-journey p { color: #c9dcda; font-size: .75rem; margin: .15rem 0 0; }
.help-capability-grid { display: grid; gap: .65rem; grid-template-columns: repeat(3, 1fr); margin-top: .75rem; }
.help-capability-grid article { background: rgba(255,255,255,.08); border-radius: .75rem; padding: .75rem; }
.help-capability-grid article > span { border-radius: 999px; display: inline-block; font-size: .62rem; padding: .25rem .45rem; }
.help-capability-active { background: #dff4ec; color: #17634f; }.help-capability-assisted { background: #fff0d6; color: #895300; }.help-capability-future { background: #e4edf8; color: #245c87; }
.help-capability-grid h3 { font-size: .88rem; margin: .5rem 0 .2rem; }.help-capability-grid p { color: #c9dcda; font-size: .72rem; margin: 0; }
.help-safety-note { background: rgba(255,255,255,.1); border-left: 3px solid #f6bd4a; border-radius: .6rem; margin-top: .75rem; padding: .7rem; }
.help-safety-note p { color: #d8e7e5; font-size: .74rem; margin: .2rem 0 0; }.help-system-guide-body .help-effective-note { font-size: .7rem; margin: .75rem 0 0; }
.help-category { background: rgba(255,255,255,.72); border: 1px solid var(--line); border-radius: 999px; color: var(--navy); padding: .42rem .68rem; transition: background 140ms ease, border-color 140ms ease, color 140ms ease; }
.help-category:hover { background: white; border-color: #cdbdaf; }
.help-category[aria-pressed="true"] { background: var(--navy); border-color: var(--navy); color: white; }
.help-guides { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); margin: 1rem 0 1.5rem; }
.help-guide { background: rgba(255,255,255,.94); border: 1px solid var(--line); border-radius: 1rem; box-shadow: 0 10px 24px rgba(35,27,20,.05); min-width: 0; padding: 1rem; transition: border-color 140ms ease, box-shadow 140ms ease, transform 140ms ease; }
.help-guide:hover { border-color: #d9cabc; box-shadow: 0 14px 32px rgba(35,27,20,.08); transform: translateY(-2px); }
.help-guide-heading span { color: var(--coral); font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; }
.help-guide-heading h2 { margin: .25rem 0 .55rem; }
.help-guide-summary { color: var(--muted); min-height: 2.5em; }
.help-guide dl { display: grid; gap: .65rem; margin: 1rem 0 0; }
.help-guide dl div { border-top: 1px solid var(--line); padding-top: .55rem; }
.help-guide dt { color: var(--muted); font-size: .68rem; text-transform: uppercase; }
.help-guide dd { color: var(--navy); margin: .2rem 0 0; }
@media (max-width: 760px) { .help-hero { align-items: stretch; flex-direction: column; } .help-search { min-width: 0; } .help-journey, .help-capability-grid { grid-template-columns: 1fr; } .help-system-guide > summary { align-items: flex-start; } }
.content-assets-link { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1.25rem; }
.visual-asset-card { background: rgba(255, 255, 255, 0.92); border: 1px solid var(--line); border-radius: 1.25rem; box-shadow: var(--shadow-soft); overflow: hidden; transition: transform 160ms ease, box-shadow 160ms ease; }
.visual-asset-card:hover { box-shadow: var(--shadow-raised); transform: translateY(-3px); }
.visual-asset-card > img { aspect-ratio: 4 / 3; display: block; height: auto; object-fit: cover; width: 100%; }
.visual-asset-body { padding: 1rem; }
.visual-asset-body h3 { font-size: 1.15rem; margin: 0.4rem 0 0.8rem; }
.visual-asset-category { color: var(--accent); font-size: 0.72rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.visual-asset-body dl { display: grid; gap: 0.45rem; margin: 0 0 0.9rem; }
.visual-asset-body dl div { display: grid; gap: 0.1rem; grid-template-columns: 5.5rem 1fr; }
.visual-asset-body dt { color: var(--muted); font-size: 0.78rem; font-weight: 700; }
.visual-asset-body dd { font-size: 0.82rem; margin: 0; }
.visual-asset-body code { color: var(--muted); font-size: 0.72rem; overflow-wrap: anywhere; }
.theme-studio-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); }
.theme-studio-card { background: white; border: 1px solid var(--line); border-radius: 1rem; overflow: hidden; }
.theme-studio-card > img { aspect-ratio: 3 / 2; display: block; object-fit: cover; width: 100%; }
.theme-studio-body { padding: 1rem; }
.theme-studio-body h3 { margin: 0.55rem 0 0.35rem; }
.theme-studio-body p { color: var(--muted); font-size: 0.82rem; min-height: 2.8rem; }
.theme-studio-body dl { display: grid; gap: 0.55rem; grid-template-columns: repeat(2, 1fr); margin: 1rem 0; }
.theme-studio-body dl div { background: var(--paper); border-radius: 0.6rem; padding: 0.6rem; }
.theme-studio-body dt { color: var(--muted); font-size: 0.66rem; font-weight: 850; text-transform: uppercase; }
.theme-studio-body dd { font-size: 0.78rem; font-weight: 800; margin: 0.2rem 0 0; }
.theme-studio-body code { color: var(--coral-dark); font-size: 0.72rem; }

.danger-action { background: #fff7f4; border: 1px solid rgba(190,45,45,.28); color: var(--red); cursor: pointer; font: inherit; }
.danger-action:hover { background: #fde5df; border-color: rgba(190,45,45,.48); }
.danger-action:disabled { cursor: wait; opacity: .58; }
.reels-upload-state { color: var(--muted); margin: 0; }
.reels-readiness { display: grid; gap: .45rem; margin: 1.2rem 0; }
.reels-readiness > span { color: var(--navy); font-size: .82rem; font-weight: 850; }
.reels-readiness-track { background: #e8e0d8; border-radius: 999px; height: .7rem; overflow: hidden; }
.reels-readiness-track span { background: linear-gradient(90deg, var(--coral), #f6a43a, var(--green)); border-radius: inherit; display: block; height: 100%; transition: width 300ms ease; width: 0; }
.hero-signal span { color: #bcd0dc; font-size: 0.75rem; font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; }
.hero-signal strong { display: block; font-size: clamp(1.6rem, 3vw, 2.5rem); margin-top: 0.65rem; }
.hero-signal p { color: #dce8ee; line-height: 1.5; margin-bottom: 0; }
.executive-grid { display: grid; gap: 0.9rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.executive-card { backdrop-filter: blur(12px); background: rgba(255, 255, 255, 0.88); border: 1px solid rgba(255, 255, 255, 0.9); border-radius: 1.2rem; box-shadow: var(--shadow); min-height: 10rem; overflow: hidden; padding: 1.25rem; position: relative; transition: box-shadow 180ms ease, transform 180ms ease; }
.executive-card::after { background: radial-gradient(circle, color-mix(in srgb, var(--accent) 15%, transparent), transparent 68%); content: ""; height: 7rem; position: absolute; right: -2rem; top: -2rem; width: 7rem; }
.executive-card:hover { box-shadow: var(--shadow-raised); transform: translateY(-3px); }
.executive-card::before { background: var(--accent); border-radius: 1rem; content: ""; height: 0.28rem; left: 1.25rem; position: absolute; right: 1.25rem; top: 0; }
.executive-card > span { color: var(--muted); font-size: 0.78rem; font-weight: 850; text-transform: uppercase; }
.executive-card strong { display: block; font-size: clamp(2.5rem, 5vw, 4rem); letter-spacing: -0.05em; margin-top: 0.7rem; }
.executive-card small { color: var(--muted); }
.accent-coral { --accent: var(--coral); } .accent-green { --accent: var(--green); } .accent-amber { --accent: var(--amber); } .accent-navy { --accent: var(--navy); }
.dashboard-columns { display: grid; gap: 1rem; grid-template-columns: 1.3fr 0.7fr; margin-top: 1rem; }
.insight-panel, .future-metrics { backdrop-filter: blur(12px); background: rgba(255, 255, 255, 0.88); border: 1px solid rgba(255, 255, 255, 0.9); border-radius: 1.25rem; box-shadow: 0 12px 36px rgba(34, 26, 20, 0.05); padding: clamp(1.2rem, 3vw, 2rem); }
.readiness-meter { background: #eee5dc; border-radius: 999px; height: 0.75rem; margin: 1.4rem 0 0.8rem; overflow: hidden; }
.readiness-meter span { background: linear-gradient(90deg, var(--coral), #ff9b55); display: block; height: 100%; transition: width 350ms ease; width: 0; }
.signal-list { display: grid; gap: 0.75rem; margin-top: 1.5rem; }
.signal-list div { align-items: center; border-top: 1px solid var(--line); display: flex; justify-content: space-between; padding-top: 0.75rem; }
.signal-list span { color: var(--muted); }
.future-metrics { background: linear-gradient(135deg, #fff, #fff4eb); margin-top: 1rem; }
.future-metrics h2 { font-size: clamp(1.8rem, 4vw, 3rem); margin: 0.25rem 0 0.8rem; }
.future-metrics p:last-child { color: var(--muted); line-height: 1.6; max-width: 65ch; }

.reports-shell { max-width: 1280px; }
.reports-hero { align-items: end; display: flex; gap: 2rem; justify-content: space-between; margin-bottom: 1rem; }
.reports-hero h1 { max-width: 10ch; }
.reports-status { margin: 1.25rem 0 2rem; }
.content-hero.planning-hero { align-items: stretch; grid-template-columns: 1fr; }
.planning-controls { align-items: end; display: grid; gap: 0.75rem; grid-template-columns: repeat(4, minmax(7.5rem, 1fr)) minmax(9rem, auto); min-width: 0; width: 100%; }
.planning-controls label { color: var(--muted); display: grid; font-size: 0.72rem; font-weight: 850; gap: 0.35rem; text-transform: uppercase; }
.planning-workspaces { display: grid; gap: .7rem; grid-template-columns: repeat(3,minmax(0,1fr)); }
.planning-workspaces a { align-items: center; background: rgba(255,255,255,.88); border: 1px solid var(--line); border-radius: .9rem; color: var(--navy); display: grid; gap: .7rem; grid-template-columns: auto minmax(0,1fr); padding: .8rem .9rem; text-decoration: none; transition: border-color 160ms ease,box-shadow 160ms ease,transform 160ms ease; }
.planning-workspaces a:hover { border-color: rgba(246,90,58,.45); box-shadow: 0 10px 24px rgba(35,27,20,.08); transform: translateY(-1px); }
.planning-workspaces a.is-active { background: linear-gradient(135deg,#102b3f,#214b62); border-color: transparent; color: white; }
.planning-workspaces .ui-icon { color: var(--coral); height: 1.35rem; width: 1.35rem; }
.planning-workspaces a.is-active .ui-icon { color: #ffb09c; }
.planning-workspaces strong,.planning-workspaces small { display: block; }
.planning-workspaces strong { color: inherit; font-size: .76rem; }
.planning-workspaces small { color: var(--muted); font-size: .62rem; line-height: 1.35; margin-top: .15rem; }
.planning-workspaces a.is-active small { color: rgba(255,255,255,.68); }
.planning-toolbar { align-items: center; background: rgba(255,255,255,.72); border: 1px solid var(--line); border-radius: .85rem; display: flex; justify-content: space-between; margin: .85rem 0; padding: .65rem .8rem; }
.planning-actions { align-items: center; display: flex; flex-wrap: wrap; gap: .65rem; }
.planning-days { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 31rem), 1fr)); }
.planning-day { background: rgba(255,255,255,0.94); border: 1px solid var(--line); border-radius: 1.1rem; box-shadow: 0 12px 28px rgba(35,27,20,0.055); overflow: hidden; padding: .85rem; }
.planning-day-heading { align-items: start; display: flex; gap: 1rem; justify-content: space-between; }
.planning-day-heading h2 { font-size: 1.1rem; margin: 0; text-transform: capitalize; }
.planning-day-heading span { color: var(--muted); font-size: 0.72rem; text-align: right; }
.planning-day-heading > div span { display: block; margin-top: 0.2rem; text-align: left; }
.planning-day-heading > strong { color: var(--amber); font-size: 0.74rem; white-space: nowrap; }
.planning-day-heading > strong.is-complete { color: var(--green); }
.planning-readiness { background: #e8e1da; border-radius: 999px; height: 0.42rem; margin-top: 0.8rem; overflow: hidden; }
.planning-readiness span { background: linear-gradient(90deg, var(--amber), var(--coral)); display: block; height: 100%; transition: width 200ms ease; }
.planning-channel-grid { display: grid; gap: 0.65rem; grid-template-columns: repeat(2, minmax(0,1fr)); margin-top: .8rem; }
.planning-channel-grid section { background: linear-gradient(180deg,rgba(255,250,245,.98),rgba(249,243,237,.86)); border: 1px solid rgba(30,54,67,.09); border-radius: .8rem; min-width: 0; padding: .7rem; }
.planning-surface-heading { align-items: center; display: flex; gap: 0.7rem; justify-content: space-between; }
.planning-surface-heading > strong { color: var(--navy); font-size: 0.8rem; text-transform: uppercase; }
.planning-surface-meta { align-items: center; display: flex; gap: .45rem; }
.planning-surface-meta > span { color: var(--muted); font-size: 0.6rem; text-align: right; }
.planning-add-window { align-items: center; background: var(--navy); border: 0; border-radius: 50%; color: white; display: inline-flex; flex: 0 0 auto; font-size: 1rem; font-weight: 800; height: 1.7rem; justify-content: center; line-height: 1; min-height: 0; padding: 0 0 .08rem; width: 1.7rem; }
.planning-add-window:hover { background: var(--coral); transform: translateY(-1px); }
.planning-window-creator { background: white; border: 1px solid rgba(246,90,58,.28); border-radius: .7rem; box-shadow: 0 9px 20px rgba(35,27,20,.07); margin-top: .6rem; padding: .65rem; }
.planning-window-creator > strong { color: var(--navy); display: block; font-size: .72rem; margin-bottom: .55rem; }
.planning-window-fields { display: grid; gap: .5rem; grid-template-columns: minmax(6.5rem,.7fr) minmax(0,1.3fr); }
.planning-window-fields label { color: var(--muted); display: grid; font-size: .56rem; font-weight: 850; gap: .22rem; text-transform: uppercase; }
.planning-window-fields input,.planning-window-fields select { font-size: .66rem; min-height: 2.25rem; padding: .38rem .5rem; width: 100%; }
.planning-window-feedback { color: var(--muted); font-size: .6rem; line-height: 1.35; margin: .5rem 0 0; }
.planning-window-feedback.error { color: var(--red); }
.planning-window-actions { display: flex; gap: .4rem; margin-top: .5rem; }
.planning-window-actions button { font-size: .6rem; min-height: 1.95rem; padding: .35rem .55rem; }
.planning-slot { align-items: start; border-top: 1px solid var(--line); display: grid; gap: 0.55rem; grid-template-columns: 2.8rem minmax(0, 1fr) auto auto; margin-top: 0.65rem; padding-top: 0.65rem; }
.planning-slot time { color: var(--navy); font-size: 0.7rem; font-weight: 900; }
.planning-slot a, .planning-slot strong { color: var(--navy); display: block; font-size: 0.7rem; font-weight: 850; line-height: 1.3; text-decoration: none; }
.planning-slot a:hover { color: var(--coral-dark); text-decoration: underline; }
.planning-slot p { color: var(--muted); font-size: 0.62rem; line-height: 1.35; margin: 0.2rem 0 0; }
.planning-slot-status { background: #e9e3dc; border: 1px solid transparent; border-radius: 999px; color: var(--navy); font-size: 0.55rem; font-weight: 700; padding: 0.25rem 0.42rem; text-transform: uppercase; }
.planning-slot-status.status-pending,.planning-slot-status.status-awaiting_media,.planning-slot-status.status-awaiting_photo { background: #fff1d8; border-color: #f2d69f; color: #8b5b09; }
.planning-slot-status.status-processing,.planning-slot-status.status-publishing { background: #e7eefc; border-color: #c3d2f4; color: #315a9d; }
.planning-slot-status.status-reconciling { background: #eee8f8; border-color: #d6c6ed; color: #67439a; }
.planning-slot-status.status-scheduled,.planning-slot-status.status-reserved { background: #e1f1f5; border-color: #b9dce4; color: #176579; }
.planning-slot-status.status-ready { background: #e5f5ee; border-color: #bce2d3; color: #17694e; }
.planning-slot-status.status-published,.planning-slot-status.status-completed { background: #dff3ea; border-color: #b8e0ce; color: var(--green); }
.planning-slot-status.status-failed,.planning-slot-status.status-rejected,.planning-slot-status.status-cancelled,.planning-slot-status.status-canceled,.planning-slot-status.status-gap { background: #fde5df; border-color: #f2c5ba; color: var(--red); }
.planning-slot-status.status-archived { background: #ebe8e5; border-color: #d5cec8; color: #6d625a; }
.planning-slot.needs-photo { border-left: 3px solid var(--amber); padding-left: 0.5rem; }
.planning-slot.is-gap { border-left: 3px solid var(--red); padding-left: 0.5rem; }
.planning-slot.is-unavailable { background: #fff1ed; border-left-color: var(--red); }
.planning-slot.is-reserve { background: rgba(255,255,255,0.7); border-radius: 0.55rem; margin-top: 0.45rem; padding: 0.55rem; }
.planning-upload-trigger { align-items: center; background: transparent; border: 1px solid var(--line); border-radius: .55rem; color: var(--navy); display: inline-flex; font-size: .6rem; font-weight: 850; justify-content: center; min-height: 1.9rem; padding: .35rem .5rem; text-decoration: none; white-space: nowrap; }
.planning-upload-trigger:hover { background: var(--navy); color: white; }
.planning-publication-dialog { background: #fffaf5; border: 0; border-radius: 1.25rem; box-shadow: 0 1.5rem 5rem rgba(8,34,52,.28); color: var(--navy); max-height: 92vh; max-width: min(72rem, calc(100vw - 2rem)); padding: 0; width: 100%; }
.planning-publication-dialog::backdrop { background: rgba(5,25,38,.72); backdrop-filter: blur(5px); }
.planning-publication-dialog > header { align-items: center; background: linear-gradient(125deg,#123d4c,#1c5962); color: white; display: flex; justify-content: space-between; padding: 1.25rem 1.5rem; }
.planning-publication-dialog h2 { font-size: clamp(1.25rem,3vw,2rem); margin: .2rem 0 0; }
.planning-preview-close { align-items: center; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25); border-radius: 50%; color: white; display: inline-flex; font-size: 1.5rem; height: 2.5rem; justify-content: center; padding: 0; width: 2.5rem; }
.planning-preview-meta { display: flex; flex-wrap: wrap; gap: .5rem; padding: 1rem 1.5rem 0; }
.planning-preview-meta span { background: #e7f3ef; border-radius: 999px; color: #175d52; font-size: .72rem; padding: .35rem .65rem; }
.planning-preview-gallery { display: grid; gap: 1rem; grid-auto-columns: minmax(16rem, 22rem); grid-auto-flow: column; overflow-x: auto; padding: 1rem 1.5rem 1.5rem; scroll-snap-type: x mandatory; }
.planning-preview-gallery figure { background: #102f3d; border-radius: 1rem; box-shadow: 0 .7rem 1.8rem rgba(8,34,52,.14); margin: 0; overflow: hidden; scroll-snap-align: start; }
.planning-preview-gallery img,.planning-preview-gallery video { aspect-ratio: 4/5; background: #091e29; display: block; object-fit: contain; width: 100%; }
.planning-preview-gallery.is-story img,.planning-preview-gallery.is-story video { aspect-ratio: 9/16; }
.planning-preview-gallery figcaption { color: white; font-size: .72rem; padding: .65rem .8rem; }
.planning-preview-caption { border-top: 1px solid var(--line); margin: 0 1.5rem; padding: 1rem 0 1.5rem; }
.planning-preview-caption p { line-height: 1.55; margin: .45rem 0 0; white-space: pre-wrap; }
.planning-media-choices { position: relative; }
.planning-media-choices > summary { background: transparent; border: 1px solid var(--line); border-radius: .55rem; color: var(--navy); cursor: pointer; font-size: .6rem; font-weight: 850; list-style: none; min-width: 5.6rem; padding: .48rem .55rem; text-align: center; white-space: nowrap; }
.planning-media-choices > summary::-webkit-details-marker { display: none; }
.planning-media-choices[open] > summary { background: var(--navy); color: white; }
.planning-media-choices > div { background: white; border: 1px solid var(--line); border-radius: .55rem; box-shadow: 0 8px 20px rgba(35,27,20,.12); display: grid; gap: .2rem; margin-top: .3rem; padding: .3rem; position: absolute; right: 0; width: 7rem; z-index: 5; }
.planning-media-choices a,.planning-media-choices button { background: transparent; border: 0; border-radius: .35rem; color: var(--navy); cursor: pointer; font-size: .58rem; font-weight: 800; min-height: 1.8rem; padding: .35rem; text-align: left; text-decoration: none; }
.planning-media-choices a:hover,.planning-media-choices button:hover { background: #fff0e9; color: var(--coral-dark); text-decoration: none; }
.planning-inline-upload { align-items: center; background: #f8f3ed; border: 1px solid var(--line); border-radius: .75rem; display: grid; gap: .75rem; grid-column: 1 / -1; grid-template-columns: 4.5rem minmax(0, 1fr); padding: .7rem; }
.planning-upload-preview { background: #ece5dd; border-radius: .55rem; height: 4.5rem; object-fit: contain; width: 4.5rem; }
.planning-upload-feedback { color: var(--muted); font-size: .66rem; font-weight: 800; margin: 0 0 .55rem; }
.planning-upload-feedback.error { color: var(--red); }
.planning-upload-dropzone { align-items: center; border: 1px dashed var(--coral); border-radius: .55rem; color: var(--coral-dark); cursor: pointer; display: flex; font-size: .64rem; font-weight: 900; justify-content: center; min-height: 2.3rem; padding: .45rem .7rem; text-align: center; }
.planning-upload-dropzone.drag-active { background: #fff0e9; border-style: solid; }
.planning-upload-dropzone input { height: 1px; opacity: 0; position: absolute; width: 1px; }
.planning-upload-controls { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .55rem; }
.planning-upload-controls button { min-height: 2.1rem; padding: .42rem .65rem; }
.planning-reserves { border-top: 1px solid var(--line); margin-top: 0.7rem; padding-top: 0.65rem; }
.planning-reserves summary { color: var(--coral-dark); cursor: pointer; font-size: 0.67rem; font-weight: 900; list-style-position: inside; }
.planning-day-footer { align-items: center; border-top: 1px solid var(--line); display: flex; gap: 1rem; justify-content: space-between; margin-top: 0.9rem; padding-top: 0.8rem; }
.planning-day-footer span { color: var(--muted); font-size: 0.68rem; font-weight: 800; }
.planning-day-footer a { background: var(--navy); border-radius: 0.65rem; color: white; font-size: 0.67rem; font-weight: 900; padding: 0.55rem 0.7rem; text-decoration: none; }
.planning-day-footer a:hover { background: var(--coral-dark); }
.planning-surface-empty { color: var(--muted); font-size: 0.68rem; margin: 0.8rem 0 0; }
.report-kpis { display: grid; gap: 1rem; grid-template-columns: repeat(4, 1fr); }
.report-kpi { background: white; border: 1px solid var(--line); border-radius: 1.15rem; box-shadow: var(--shadow); overflow: hidden; padding: 1.25rem; position: relative; }
.report-kpi::after { background: var(--navy); bottom: 0; content: ""; height: 0.25rem; left: 0; position: absolute; right: 0; }
.report-kpi-featured { background: linear-gradient(145deg, var(--navy), #1e536e); color: white; }
.report-kpi-featured::after { background: var(--coral); }
.report-kpi-alert::after { background: var(--red); }
.report-kpi > span { color: var(--muted); font-size: 0.72rem; font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; }
.report-kpi-featured > span, .report-kpi-featured small { color: #c5d6df; }
.report-kpi strong { display: block; font-family: "Lilita Radar", sans-serif; font-size: clamp(2.5rem, 5vw, 4rem); font-weight: 400; line-height: 1; margin: 0.65rem 0 0.35rem; }
.report-kpi small { color: var(--muted); }
.report-layout { display: grid; gap: 1rem; grid-template-columns: minmax(0, 1.7fr) minmax(19rem, 0.7fr); margin-top: 1rem; }
.report-panel { backdrop-filter: blur(14px); background: rgba(255, 255, 255, 0.9); border: 1px solid rgba(255, 255, 255, 0.95); border-radius: 1.25rem; box-shadow: var(--shadow); overflow: hidden; padding: clamp(1.2rem, 3vw, 2rem); position: relative; }
.report-panel::before { background: linear-gradient(90deg, var(--coral), #ffb172, transparent); content: ""; height: 0.2rem; left: 0; position: absolute; right: 0; top: 0; }
.report-heading { align-items: end; display: flex; justify-content: space-between; margin-bottom: 1.5rem; }
.report-heading > p { color: var(--muted); font-size: 0.78rem; margin: 0; }
.chart-legend { display: flex; gap: 1rem; }
.chart-legend span { align-items: center; color: var(--muted); display: flex; font-size: 0.72rem; font-weight: 800; gap: 0.4rem; }
.chart-legend i, .status-legend i { border-radius: 50%; display: inline-block; height: 0.55rem; width: 0.55rem; }
.legend-feed { background: var(--coral); } .legend-story { background: var(--navy); }
.daily-chart { align-items: end; border-bottom: 1px solid var(--line); display: grid; gap: clamp(0.45rem, 2vw, 1rem); grid-template-columns: repeat(7, 1fr); height: 18rem; padding: 1.5rem 0 0; }
.chart-column { align-items: center; display: flex; flex-direction: column; height: 100%; justify-content: end; }
.chart-column > strong { color: var(--navy); font-size: 0.78rem; margin-bottom: 0.35rem; }
.chart-column > small { color: var(--muted); font-size: 0.7rem; font-weight: 800; margin: 0.55rem 0 -1.4rem; text-transform: uppercase; }
.chart-bars { border-radius: 0.65rem 0.65rem 0.15rem 0.15rem; display: flex; flex-direction: column; min-height: 0.5rem; overflow: hidden; transition: height 350ms ease; width: min(3.5rem, 66%); }
.chart-bars span { display: block; min-height: 2px; }
.chart-story { background: linear-gradient(180deg, #285e7c, var(--navy)); }
.chart-feed { background: linear-gradient(180deg, #ff8b65, var(--coral)); }
.donut-layout { align-items: center; display: grid; gap: 1.5rem; grid-template-columns: minmax(9rem, 0.8fr) 1fr; }
.status-donut { align-items: center; aspect-ratio: 1; border-radius: 50%; display: flex; flex-direction: column; justify-content: center; position: relative; }
.status-donut::after { background: white; border-radius: 50%; content: ""; inset: 22%; position: absolute; }
.status-donut span, .status-donut small { position: relative; z-index: 1; }
.status-donut span { color: var(--navy); font-family: "Lilita Radar", sans-serif; font-size: 2.4rem; line-height: 1; }
.status-donut small { color: var(--muted); }
.status-legend { display: grid; gap: 0.65rem; }
.status-legend div { align-items: center; border-bottom: 1px solid #f0e9e2; display: flex; justify-content: space-between; padding-bottom: 0.55rem; }
.status-legend span { align-items: center; color: var(--muted); display: flex; font-size: 0.75rem; gap: 0.45rem; }
.report-table-panel { margin-top: 1rem; }
.table-scroll { overflow-x: auto; }
.report-table { border-collapse: collapse; min-width: 760px; width: 100%; }
.report-table th, .report-table td { border-bottom: 1px solid var(--line); padding: 0.85rem 0.7rem; text-align: right; }
.report-table thead th { color: var(--muted); font-size: 0.68rem; letter-spacing: 0.06em; text-transform: uppercase; }
.report-table thead button { align-items: center; background: none; border: 0; color: inherit; cursor: pointer; display: inline-flex; font: inherit; gap: .35rem; letter-spacing: inherit; padding: .35rem .15rem; text-transform: inherit; white-space: nowrap; }
.report-table thead button::after { color: #b0a39a; content: "↕"; font-size: .75rem; }
.report-table thead th[aria-sort="ascending"] button::after { color: var(--orange); content: "↑"; }
.report-table thead th[aria-sort="descending"] button::after { color: var(--orange); content: "↓"; }
.report-table thead button:focus-visible { border-radius: .35rem; outline: 2px solid var(--orange); outline-offset: 2px; }
.report-table th:first-child { color: var(--navy); text-align: left; }
.report-table tbody tr:hover { background: #fff8f3; }
.data-boundary { align-items: center; background: linear-gradient(135deg, #f1e9e1, #fff8f2); border-radius: 1rem; display: flex; gap: 1rem; margin-top: 1rem; padding: 1rem 1.25rem; }
.data-boundary strong { color: var(--navy); flex: 0 0 auto; }
.data-boundary p { color: var(--muted); margin: 0; }

.operations-shell { max-width: 1280px; }
.operations-hero { align-items: end; display: flex; gap: 2rem; justify-content: space-between; margin-bottom: 1rem; }
.operations-hero h1 { max-width: 11ch; }
.operations-status { margin: 1.25rem 0 2rem; }
.operations-kpis { display: grid; gap: 1rem; grid-template-columns: repeat(4, 1fr); }
.operations-kpis article { background: rgba(255,255,255,0.92); border: 1px solid var(--line); border-radius: 0.9rem; box-shadow: 0 10px 24px rgba(35,27,20,0.05); display: grid; gap: 0.25rem; padding: 1rem; }
.operations-kpis article span { color: var(--muted); font-size: 0.72rem; font-weight: 800; text-transform: uppercase; }
.operations-kpis article strong { color: var(--navy); font-size: 1.8rem; }
.operation-kpi { background: rgba(255, 255, 255, 0.92); border: 1px solid var(--line); border-radius: 1.15rem; box-shadow: var(--shadow); padding: 1.25rem; }
.operation-kpi > span { color: var(--muted); font-size: 0.72rem; font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; }
.operation-kpi strong { color: var(--navy); display: block; font-family: "Lilita Radar", sans-serif; font-size: clamp(2.3rem, 5vw, 3.7rem); font-weight: 400; line-height: 1; margin: 0.65rem 0 0.35rem; }
.operation-kpi small { color: var(--muted); }
.operation-kpi-critical { border-top: 4px solid var(--red); }
.operation-kpi-warning { border-top: 4px solid var(--amber); }
.operation-kpi-ready { border-top: 4px solid var(--green); }
.attention-panel { background: rgba(255, 255, 255, 0.9); border: 1px solid rgba(255, 255, 255, 0.96); border-radius: 1.35rem; box-shadow: var(--shadow); margin-top: 1rem; padding: clamp(1.2rem, 3vw, 2rem); }
.attention-list { display: grid; gap: 0.75rem; }
.attention-item { align-items: center; background: white; border: 1px solid var(--line); border-left: 5px solid var(--amber); border-radius: 0.9rem; display: grid; gap: 1rem; grid-template-columns: 5rem 1fr auto; padding: 1rem; }
.attention-critical { border-left-color: var(--red); }
.attention-signal { color: var(--amber); font-size: 0.7rem; font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; }
.attention-critical .attention-signal { color: var(--red); }
.attention-item h3 { font-family: "Lato Radar", sans-serif; font-size: 1rem; font-weight: 900; letter-spacing: 0; }
.attention-item p { color: var(--muted); margin: 0.3rem 0 0; }
.attention-impact { color: var(--navy); display: block; font-size: .68rem; font-weight: 800; margin-top: .55rem; overflow-wrap: anywhere; }
.attention-action { color: var(--coral-dark); font-size: 0.82rem; font-weight: 900; text-decoration: none; white-space: nowrap; }
.attention-actions { align-items: center; display: flex; flex-wrap: wrap; gap: .65rem; justify-content: flex-end; }
.attention-actions button { min-height: 2.35rem; padding: .45rem .7rem; white-space: nowrap; }
.attention-empty { background: #edf7f3; border: 1px solid #cde7dc; border-radius: 1rem; color: var(--green); padding: 1.5rem; text-align: center; }
.attention-empty p { color: var(--muted); margin-bottom: 0; }
.operations-range-control > div { display: grid; gap: .55rem; grid-template-columns: minmax(9rem, 1fr) minmax(10rem, 1fr) auto; }
.operations-range-control select { min-width: 0; }
.incident-dialog { background: linear-gradient(150deg, #fff 0%, #fff8f2 100%); border: 1px solid rgba(246, 90, 58, .22); border-radius: 1.25rem; box-shadow: 0 28px 80px rgba(35, 27, 20, .28); color: var(--navy); max-height: min(42rem, 88vh); max-width: 42rem; padding: 1.35rem; width: calc(100% - 2rem); }
.incident-dialog::backdrop { background: rgba(17, 36, 51, .58); backdrop-filter: blur(4px); }
.incident-dialog-header, .incident-dialog-footer, .incident-dialog-summary { align-items: center; display: flex; gap: .8rem; justify-content: space-between; }
.incident-dialog-header h2 { margin: .1rem 0 0; }
.dialog-close { border-radius: 50%; font-size: 1.25rem; height: 2.5rem; min-height: 0; padding: 0; width: 2.5rem; }
.incident-dialog-summary { background: #f6efe8; border: 1px solid var(--line); border-radius: .8rem; flex-wrap: wrap; margin: 1rem 0; padding: .75rem; }
.incident-dialog-summary code { background: white; border: 1px solid var(--line); border-radius: .4rem; font-size: .7rem; overflow-wrap: anywhere; padding: .3rem .45rem; }
.incident-handling { background: #fff1e7; border-radius: 999px; color: #9a3a20; font-size: .66rem; font-weight: 700; padding: .3rem .55rem; text-transform: uppercase; }
.incident-handling.is-automatic { background: #e5f6ef; color: #176b51; }
.incident-handling.is-monitoring { background: #fff4d9; color: #875c00; }
.incident-steps { background: rgba(255, 255, 255, .72); border: 1px solid var(--line); border-radius: .8rem; color: var(--navy); display: grid; font-size: .78rem; gap: .45rem; margin: 0; padding: .8rem .8rem .8rem 2rem; }
.incident-critical { color: var(--red); }
.incident-warning { color: #9b6500; }
.incident-dialog h3 { font-size: .82rem; margin: 1.1rem 0 .6rem; }
.incident-entities { display: grid; gap: .4rem; list-style: none; margin: 0; max-height: 14rem; overflow: auto; padding: 0; }
.incident-entities li { background: white; border: 1px solid var(--line); border-radius: .6rem; font-size: .75rem; font-weight: 800; overflow-wrap: anywhere; padding: .65rem .75rem; }
.incident-dialog-footer { border-top: 1px solid var(--line); margin-top: 1.1rem; padding-top: 1rem; }
.incident-dialog-footer p { color: var(--muted); font-size: .7rem; margin: 0; max-width: 25rem; }

.eyebrow {
  color: var(--coral-dark);
  font-size: 0.75rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  margin: 0 0 0.65rem;
  text-transform: uppercase;
}
.eyebrow::before { background: var(--coral); border-radius: 99px; content: ""; display: inline-block; height: 0.42rem; margin-right: 0.5rem; vertical-align: 0.08rem; width: 0.42rem; }

h1, h2, h3 { color: var(--navy); font-family: "Lilita Radar", "Lato Radar", sans-serif; font-weight: 400; letter-spacing: -0.025em; margin: 0; text-wrap: balance; }
h1 { font-size: clamp(2.25rem, 6vw, 4.75rem); line-height: 0.98; max-width: 760px; }
h2 { font-size: clamp(1.5rem, 3vw, 2.3rem); }
.subtitle { color: var(--muted); font-size: 1.05rem; margin: 1.15rem 0 0; }

.date-control { min-width: 285px; }
.date-control label { display: block; font-size: 0.8rem; font-weight: 800; margin-bottom: 0.45rem; }
.date-control-title { display: block; font-size: 0.8rem; font-weight: 800; margin-bottom: 0.45rem; }
.date-control div { display: flex; gap: 0.5rem; }
input, select { border-radius: 0.7rem; font: inherit; min-height: 2.7rem; }
input { background: var(--surface); border: 1px solid var(--line); color: var(--ink); padding: 0 0.8rem; width: 100%; }
select { appearance: none; background: white url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='m1 1 5 5 5-5' fill='none' stroke='%23102b3f' stroke-width='2'/%3E%3C/svg%3E") right 0.75rem center / 0.7rem no-repeat; border: 1px solid var(--line); color: var(--navy); font-weight: 800; padding: 0 2.2rem 0 0.75rem; }
button { align-items: center; background: linear-gradient(135deg, var(--navy), #1c526f); border: 0; border-radius: 0.7rem; box-shadow: 0 6px 16px rgba(16, 43, 63, 0.14); color: white; cursor: pointer; display: inline-flex; font-weight: 500 !important; justify-content: center; line-height: 1.15; min-height: 2.5rem; padding: 0.55rem 0.9rem; transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease; }
.primary-action,.secondary-action,.planning-upload-trigger,.filter-button,.period-button,.content-detail-button { font-weight: 500; }
button:hover { background: linear-gradient(135deg, #183f59, #287397); box-shadow: 0 12px 24px rgba(16, 43, 63, 0.2); transform: translateY(-1px); }
button:active { box-shadow: 0 4px 10px rgba(16, 43, 63, 0.14); transform: translateY(1px); }
input:focus-visible, button:focus-visible, a:focus-visible { outline: 3px solid rgba(246, 90, 58, 0.45); outline-offset: 2px; }
select:focus-visible { outline: 3px solid rgba(246, 90, 58, 0.45); outline-offset: 2px; }

.system-flow-panel { backdrop-filter: blur(14px); background: rgba(255, 255, 255, 0.9); border: 1px solid rgba(255, 255, 255, 0.95); border-radius: 1.35rem; box-shadow: var(--shadow); margin-top: 1rem; padding: clamp(1.2rem, 3vw, 2rem); }
.system-flow { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); }
.system-flow-step { display: flex; gap: 0.6rem; min-width: 0; position: relative; }
.system-flow-step:not(:last-child)::after { background: #ddd5cc; content: ""; height: 3px; left: 2.65rem; position: absolute; right: 0; top: 1.08rem; }
.system-flow-marker { align-items: center; background: #eee9e3; border: 3px solid white; border-radius: 50%; box-shadow: 0 0 0 1px #d7cec5; color: var(--muted); display: flex; flex: 0 0 auto; font-size: 0.78rem; font-weight: 900; height: 2.25rem; justify-content: center; position: relative; width: 2.25rem; z-index: 1; }
.system-flow-step > div { min-width: 0; position: relative; z-index: 1; }
.system-flow-step strong, .system-flow-step small { display: block; }
.system-flow-step strong { color: var(--navy); font-size: 0.78rem; }
.system-flow-step small { color: var(--muted); font-size: 0.65rem; font-weight: 800; }
.system-flow-step p { color: var(--muted); font-size: 0.65rem; line-height: 1.25; margin: 0.3rem 0 0; }
.flow-done .system-flow-marker { background: var(--green); color: white; }
.flow-done:not(:last-child)::after { background: var(--green); }
.flow-active .system-flow-marker { animation: progress-pulse 1.8s ease-in-out infinite; background: var(--blue); color: white; }
.flow-error .system-flow-marker { background: var(--red); color: white; }
.flow-error:not(:last-child)::after { background: var(--red); }

.summary {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(4, 1fr);
  margin: 3rem 0;
}

.health-strip {
  background: var(--navy);
  border-radius: 1.35rem;
  box-shadow: var(--shadow);
  color: white;
  margin-top: 3rem;
  padding: clamp(1.2rem, 3vw, 1.75rem);
}
.health-heading { align-items: end; display: flex; justify-content: space-between; margin-bottom: 1.2rem; }
.health-heading h2 { color: white; font-size: clamp(1.25rem, 2vw, 1.75rem); }
.health-heading .eyebrow { color: #ff947c; }
.health-heading .status-message { color: #b9c8d3; }
.health-heading .status-message.error { color: #ffb6a8; }
.health-grid { display: grid; gap: 1px; grid-template-columns: repeat(4, 1fr); }
.health-item { border-left: 1px solid rgba(255, 255, 255, 0.15); padding: 0.35rem 1.2rem; }
.health-item:first-child { border-left: 0; padding-left: 0; }
.health-item span { color: #b9c8d3; display: block; font-size: 0.72rem; font-weight: 800; text-transform: uppercase; }
.health-item strong { display: block; font-size: 1.5rem; margin-top: 0.3rem; }
.health-item small { color: #b9c8d3; display: block; margin-top: 0.25rem; }
.health-item[data-has-alert="true"] strong { color: #ffb09f; }

.metric {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 1.2rem;
  box-shadow: var(--shadow);
  padding: 1.25rem 1.5rem;
}

.metric span { color: var(--muted); display: block; font-size: 0.8rem; font-weight: 800; text-transform: uppercase; }
.metric strong { color: var(--navy); display: block; font-size: 2.4rem; margin-top: 0.25rem; }
.metric-primary { border-top: 4px solid var(--coral); }
.metric-alert[data-has-alert="true"] { border-top: 4px solid var(--amber); }
.metric-gap[data-has-alert="true"] { border-top: 4px solid #a52b1b; }

.agenda-section {
  backdrop-filter: blur(16px);
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(255, 255, 255, 0.95);
  border-radius: 1.5rem;
  box-shadow: var(--shadow);
  padding: clamp(1.2rem, 3vw, 2rem);
}

.section-heading { align-items: end; display: flex; gap: 1rem; justify-content: space-between; margin-bottom: 1rem; }
.section-heading h2, .report-heading h2 { align-items: center; display: flex; gap: .55rem; }
.heading-icon { color: var(--coral); height: 1.15rem; width: 1.15rem; }
.status-message { color: var(--muted); font-size: 0.85rem; margin: 0; }
.status-message.error { color: #a52b1b; font-weight: 700; }
.filter-toolbar { align-items: end; background: linear-gradient(135deg, #f7f0e9, rgba(255, 255, 255, 0.8)); border: 1px solid var(--line); border-radius: 1rem; display: grid; gap: 0.65rem; grid-template-columns: repeat(6, minmax(7rem, auto)) minmax(13rem, 1fr); margin-bottom: 1.25rem; padding: 0.85rem; }
.filter-field { color: var(--muted); display: grid; font-size: 0.65rem; font-weight: 900; gap: 0.25rem; letter-spacing: 0.06em; text-transform: uppercase; }
.filter-field select { font-size: 0.78rem; min-height: 2.4rem; text-transform: none; }
.agenda-search { margin-left: auto; min-width: min(100%, 18rem); }
.agenda-search input { min-height: 2.4rem; width: 100%; }
.sr-only { height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; clip: rect(0, 0, 0, 0); }
.filter-button,
.period-button {
  background: transparent;
  border: 1px solid var(--line);
  color: var(--muted);
  min-height: 2.35rem;
  padding: 0 0.85rem;
}
.filter-button:hover, .period-button:hover { background: #f6eee7; color: var(--navy); }
.filter-button.active, .period-button.active { background: var(--navy); border-color: var(--navy); color: white; }
.agenda-list { display: grid; gap: 0.8rem; }

.agenda-item {
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 1rem;
  display: grid;
  gap: 1rem;
  grid-template-columns: 5rem 3.25rem 1fr auto;
  padding: 1rem;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}
.agenda-item:hover { border-color: #dbcbbd; box-shadow: 0 12px 30px rgba(35, 27, 20, 0.07); transform: translateY(-2px); }
.agenda-item-selected { border-color: var(--coral); box-shadow: 0 0 0 3px rgb(246 90 58 / 16%); }
.agenda-deep-link { color: var(--navy); font-size: 0.78rem; font-weight: 800; }
.timeline-section { background: linear-gradient(145deg, var(--surface), #fff9f3); border: 1px solid var(--line); border-radius: 1.25rem; box-shadow: var(--shadow); margin-top: 1.5rem; overflow: hidden; padding: clamp(1rem, 3vw, 2rem); }
.visual-journey { border-bottom: 1px solid var(--line); margin: 0 calc(clamp(1rem, 3vw, 2rem) * -1) 2rem; padding: 0 clamp(1rem, 3vw, 2rem) 2rem; }
.visual-journey-heading { align-items: end; display: flex; justify-content: space-between; margin-bottom: 1.2rem; }
.visual-journey-heading h3 { color: var(--navy); font-family: "Lilita Radar", sans-serif; font-size: clamp(1.4rem, 3vw, 2rem); font-weight: 400; margin: 0; }
.visual-journey-heading > p { color: var(--muted); font-size: 0.82rem; margin: 0; max-width: 30rem; text-align: right; }
.visual-journey-gallery { display: grid; gap: 1rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.visual-stage { background: #f4ede6; border: 1px solid var(--line); border-radius: 1rem; margin: 0; overflow: hidden; position: relative; }
.visual-stage-media { align-items: center; aspect-ratio: 4 / 5; background: linear-gradient(145deg, #eee5db, #faf5ef); color: var(--muted); display: flex; height: auto; justify-content: center; object-fit: contain; width: 100%; }
.visual-stage-ready .visual-stage-media { background: #ebe5df; }
.visual-stage-empty .visual-stage-media span { font-size: 0.78rem; font-weight: 800; padding: 1rem; text-align: center; }
.visual-stage figcaption { align-items: center; background: rgba(255, 255, 255, 0.94); display: flex; gap: 0.75rem; padding: 0.85rem; }
.visual-stage-number { color: var(--coral); font-family: "Lilita Radar", sans-serif; font-size: 1.5rem; }
.visual-stage figcaption strong, .visual-stage figcaption small { display: block; }
.visual-stage figcaption strong { color: var(--navy); font-size: 0.86rem; }
.visual-stage figcaption small { color: var(--muted); font-size: 0.7rem; margin-top: 0.1rem; }
.timeline-progress { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin: 1.75rem 0 2rem; }
.progress-step { align-items: center; display: flex; gap: 0.65rem; min-width: 0; position: relative; }
.progress-step:not(:last-child)::after { background: #ddd5cc; content: ""; height: 3px; left: calc(2.25rem + 0.65rem); position: absolute; right: 0; top: 1.05rem; z-index: 0; }
.progress-marker { align-items: center; background: #eee9e3; border: 3px solid white; border-radius: 50%; box-shadow: 0 0 0 1px #d7cec5; color: var(--muted); display: flex; flex: 0 0 auto; font-size: 0.78rem; font-weight: 900; height: 2.2rem; justify-content: center; position: relative; width: 2.2rem; z-index: 1; }
.progress-step > div { min-width: 0; position: relative; z-index: 1; }
.progress-step strong, .progress-step small { display: block; }
.progress-step strong { color: var(--navy); font-size: 0.84rem; }
.progress-step small { color: var(--muted); font-size: 0.68rem; margin-top: 0.16rem; }
.progress-done .progress-marker { background: var(--green); color: white; }
.progress-done:not(:last-child)::after, .progress-skipped:not(:last-child)::after { background: var(--green); }
.progress-error .progress-marker { background: var(--red); color: white; }
.progress-error:not(:last-child)::after { background: var(--red); }
.progress-active .progress-marker { animation: progress-pulse 1.8s ease-in-out infinite; background: var(--blue); color: white; }
.progress-skipped .progress-marker { background: #dfe9e5; color: var(--green); }
@keyframes progress-pulse { 0%, 100% { box-shadow: 0 0 0 1px rgba(36, 109, 160, 0.35); } 50% { box-shadow: 0 0 0 7px rgba(36, 109, 160, 0.12); } }
.timeline-list { display: grid; gap: 0; list-style: none; margin: 1.5rem 0 0; padding: 0; }
.timeline-list li { border-left: 3px solid var(--coral); padding: 0 0 1.35rem 1.2rem; position: relative; }
.timeline-list li::before { background: var(--coral); border-radius: 50%; content: ""; height: 0.7rem; left: -0.42rem; position: absolute; top: 0.2rem; width: 0.7rem; }
.timeline-list strong, .timeline-list time { display: block; }
.timeline-list time { color: var(--muted); font-size: 0.82rem; margin-top: 0.2rem; }
.timeline-list p { margin: 0.45rem 0 0; }
.agenda-item-gap { background: #fff8f6; border-color: #f2c3ba; }
.agenda-item-gap .agenda-time { color: #a52b1b; }

.agenda-time { color: var(--navy); font-size: 1.25rem; font-weight: 900; }
.agenda-thumbnail {
  align-items: center;
  aspect-ratio: 1;
  background: #f2ece5;
  border-radius: 0.7rem;
  color: var(--muted);
  display: flex;
  font-size: 0.65rem;
  font-weight: 800;
  justify-content: center;
  object-fit: cover;
  overflow: hidden;
  text-align: center;
  width: 3.25rem;
}
.agenda-title { font-size: 1rem; margin: 0 0 0.35rem; }
.agenda-meta { color: var(--muted); display: flex; flex-wrap: wrap; font-size: 0.78rem; gap: 0.45rem 0.8rem; }
.agenda-detail { color: #8b3427; font-size: 0.76rem; margin: 0.55rem 0 0; }
.badges { align-items: flex-end; display: flex; flex-direction: column; gap: 0.4rem; }
.badge { border-radius: 999px; font-size: 0.7rem; font-weight: 900; padding: 0.35rem 0.55rem; text-transform: uppercase; }
.badge-ready { background: #e2f5ee; color: var(--green); }
.badge-waiting { background: #fff0d9; color: var(--amber); }
.badge-role { background: #e9eef3; color: var(--navy); }
.badge-pending { background: #eef1f4; color: #4b5b67; }
.badge-processing { background: #e6efff; color: #24569a; }
.badge-completed { background: #e2f5ee; color: var(--green); }
.badge-failed, .badge-rejected { background: #ffe8e4; color: #a52b1b; }
.product-link { color: var(--coral-dark); font-weight: 800; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.empty { color: var(--muted); padding: 2.5rem 1rem; text-align: center; }

.content-shell { padding-bottom: 4rem; }
.content-hero { align-items: end; background: radial-gradient(circle at 88% 20%, rgba(255, 202, 74, 0.28), transparent 28%), linear-gradient(135deg, rgba(255,255,255,0.96), rgba(255,242,232,0.9)); border: 1px solid rgba(255,255,255,0.96); border-radius: 1.6rem; box-shadow: var(--shadow); display: grid; gap: 2rem; grid-template-columns: 1fr auto; margin: 2.25rem 0 1.25rem; overflow: hidden; padding: clamp(1.5rem, 4vw, 3rem); position: relative; }
.content-hero::after { border: 1px solid rgba(246,90,58,0.18); border-radius: 50%; content: ""; height: 15rem; position: absolute; right: -5rem; top: -7rem; width: 15rem; }
.content-hero-stat { background: var(--navy); border-radius: 1.2rem; color: white; display: grid; grid-template-columns: auto 1fr; min-width: 12rem; padding: 1.25rem 1.5rem; position: relative; z-index: 1; }
.content-hero-stat span, .content-hero-stat small { color: #bfd0da; display: block; font-size: 0.72rem; font-weight: 800; }
.content-hero-stat strong { display: block; font-family: "Lilita Radar", sans-serif; font-size: 2.8rem; font-weight: 400; margin: 0.25rem 0; }
.content-hero-stat > span, .content-hero-stat > strong, .content-hero-stat > small { grid-column: 2; }
.hero-stat-icon { color: #ff9b83; grid-row: 1 / 4; height: 1.4rem; margin: .12rem .65rem 0 0; width: 1.4rem; }
.content-panel { backdrop-filter: blur(16px); background: rgba(255,255,255,0.91); border: 1px solid rgba(255,255,255,0.96); border-radius: 1.25rem; box-shadow: var(--shadow); padding: clamp(1rem, 2.4vw, 1.5rem); }
.content-filters { align-items: end; background: linear-gradient(135deg, #f7f0e9, rgba(255,255,255,0.82)); border: 1px solid var(--line); border-radius: 1rem; display: grid; gap: 0.8rem; grid-template-columns: minmax(12rem, 2fr) repeat(4, minmax(7.5rem, 1fr)) minmax(9rem, auto); margin-bottom: 1.4rem; padding: 1rem; }
.content-filters label { color: var(--muted); display: grid; font-size: 0.67rem; font-weight: 900; gap: 0.3rem; letter-spacing: 0.06em; text-transform: uppercase; }
.content-filters label, .content-filters .content-search, .content-filters button { grid-column: auto; min-width: 0; }
.content-filters button { grid-column: 1 / -1; justify-self: end; min-width: 9rem; white-space: nowrap; width: min(15rem, 100%); }
.visual-assets-filters { grid-template-columns: minmax(16rem, 2fr) minmax(12rem, 1fr) minmax(9rem, auto); }
.visual-assets-filters label, .visual-assets-filters .content-search, .visual-assets-filters button { grid-column: auto; }
.content-filters input, .content-filters select, .content-filters button { min-height: 2.55rem; }

.filter-disclosure { background: rgba(255,255,255,.76); border: 1px solid rgba(16,43,63,.1); border-radius: .9rem; margin-bottom: 1rem; overflow: hidden; }
.filter-disclosure-trigger { align-items: center; background: transparent; border: 0; border-radius: 0; box-shadow: none; color: var(--navy); display: grid; gap: .15rem .75rem; grid-template-columns: auto 1fr auto auto; min-height: 3.25rem; padding: .65rem .8rem; text-align: left; transform: none; width: 100%; }
.filter-disclosure-trigger:hover, .filter-disclosure-trigger:active { background: #fff8f3; box-shadow: none; transform: none; }
.filter-disclosure-title { align-items: center; display: flex; gap: .5rem; }
.filter-disclosure-title .ui-icon { color: var(--coral); }
.filter-disclosure-trigger small { color: var(--muted); font-size: .72rem; font-weight: 600; }
.filter-active-count { background: #edf1f3; border-radius: 999px; color: var(--muted); font-size: .66rem; font-weight: 900; padding: .28rem .55rem; white-space: nowrap; }
.filter-active-count.has-active { background: #e8f6ef; color: var(--green); }
.filter-chevron { transition: transform 160ms ease; }
.filter-disclosure.open .filter-chevron { transform: rotate(180deg); }
.filter-disclosure-body { display: none; }
.filter-disclosure.open .filter-disclosure-body { display: block; }
.filter-disclosure .filter-toolbar,
.filter-disclosure .content-filters,
.filter-disclosure .product-filters,
.filter-disclosure .policy-toolbar,
.filter-disclosure .policy-history-toolbar { background: #fbf7f2; border: 0; border-radius: 0; border-top: 1px solid var(--line); margin: 0; padding: .8rem; }
.filter-disclosure input, .filter-disclosure select, .filter-disclosure button[type="submit"] { min-height: var(--control-height); }
.content-grid { display: grid; gap: 1rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.content-card { background: white; border: 1px solid var(--line); border-radius: 1.15rem; box-shadow: 0 10px 28px rgba(35,27,20,0.06); min-width: 0; overflow: hidden; transition: transform 160ms ease, box-shadow 160ms ease; }
.content-card:hover { box-shadow: 0 16px 34px rgba(35,27,20,0.11); transform: translateY(-3px); }
.content-card-media { align-items: center; aspect-ratio: 4 / 3; background: linear-gradient(145deg, #e9e0d6, #f8f3ed); color: var(--muted); display: flex; font-size: 0.78rem; font-weight: 800; justify-content: center; overflow: hidden; text-align: center; }
.content-card-media img { height: 100%; object-fit: cover; width: 100%; }
.content-card-media-empty { padding: 1rem; }
.content-card-body { padding: 1rem; }
.content-card-badges { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.content-card-badges span { background: #f2ece5; border-radius: 999px; color: var(--navy); font-size: 0.63rem; font-weight: 900; padding: 0.3rem 0.48rem; text-transform: uppercase; }
.content-card h3 { font-family: "Lato Radar", sans-serif; font-size: 1rem; font-weight: 900; line-height: 1.3; margin-top: 0.8rem; min-height: 2.6em; }
.content-card-body > p { color: var(--muted); font-size: 0.73rem; margin: 0.65rem 0 0; }
.content-card-footer { align-items: center; border-top: 1px solid var(--line); display: flex; gap: 0.75rem; justify-content: space-between; margin-top: 0.9rem; padding-top: 0.75rem; }
.content-card-footer strong { color: var(--green); font-size: 0.68rem; text-transform: uppercase; }
.content-card-footer code { color: var(--muted); font-size: 0.62rem; max-width: 58%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.content-detail-button { border-radius: 0.72rem; margin-top: 0.85rem; min-height: 2.45rem; width: 100%; }
.content-empty { color: var(--muted); grid-column: 1 / -1; padding: 4rem 1rem; text-align: center; }
.content-empty strong { color: var(--navy); display: block; font-size: 1.1rem; }
.content-pagination { align-items: center; display: flex; gap: 1rem; justify-content: center; margin-top: 1.5rem; }
.content-pagination span { color: var(--muted); font-size: 0.78rem; font-weight: 800; }
.content-pagination button:disabled { cursor: not-allowed; opacity: 0.4; transform: none; }
.content-detail-dialog { background: transparent; border: 0; height: min(92vh, 64rem); max-height: 92vh; max-width: 76rem; padding: 0; width: min(94vw, 76rem); }
.content-detail-dialog::backdrop { backdrop-filter: blur(8px); background: rgba(8, 25, 38, 0.68); }
.content-detail-shell { background: #fbf7f2; border: 1px solid rgba(255,255,255,0.88); border-radius: 1.5rem; box-shadow: 0 28px 80px rgba(6, 24, 36, 0.35); max-height: 92vh; overflow-y: auto; padding: clamp(1.1rem, 3vw, 2rem); }
.content-detail-header { align-items: start; border-bottom: 1px solid var(--line); display: flex; gap: 1rem; justify-content: space-between; padding-bottom: 1.2rem; }
.content-detail-header h2 { max-width: 46rem; }
.content-detail-header .subtitle { font-size: 0.82rem; margin-top: 0.4rem; }
.content-detail-close { background: white; border: 1px solid var(--line); box-shadow: none; color: var(--navy); flex: 0 0 auto; min-height: 2.5rem; }
.content-detail-metadata { display: grid; gap: 0.7rem; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 1.25rem; }
.content-detail-field { background: white; border: 1px solid var(--line); border-radius: 0.9rem; padding: 0.8rem 0.9rem; }
.content-detail-field span, .content-detail-field strong { display: block; }
.content-detail-field span { color: var(--muted); font-size: 0.62rem; font-weight: 900; letter-spacing: 0.05em; text-transform: uppercase; }
.content-detail-field strong { color: var(--navy); font-size: 0.82rem; margin-top: 0.25rem; overflow-wrap: anywhere; text-transform: capitalize; }
.content-detail-section { margin-top: 1.5rem; }
.content-detail-section > h3 { color: var(--navy); font-size: 1.05rem; margin-bottom: 0.8rem; }
.content-detail-slides { display: grid; gap: 1rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.content-detail-slide { background: white; border: 1px solid var(--line); border-radius: 1rem; margin: 0; overflow: hidden; }
.content-detail-slide img, .content-detail-slide-empty { aspect-ratio: 4 / 5; height: auto; object-fit: contain; width: 100%; }
.content-detail-slide img { background: #eee7df; display: block; }
.content-detail-slide-empty { align-items: center; background: linear-gradient(145deg, #e9e0d6, #f8f3ed); color: var(--muted); display: flex; font-size: 0.75rem; font-weight: 800; justify-content: center; padding: 1rem; text-align: center; }
.content-detail-slide figcaption { padding: 0.75rem; }
.content-detail-slide figcaption strong, .content-detail-slide figcaption small { display: block; }
.content-detail-slide figcaption strong { color: var(--navy); font-size: 0.82rem; }
.content-detail-slide figcaption small { color: var(--muted); font-size: 0.67rem; margin-top: 0.15rem; overflow-wrap: anywhere; }
.content-detail-lower { display: grid; gap: 1rem; grid-template-columns: 1.25fr 0.75fr; }
.content-readiness-list { display: grid; gap: 0.55rem; list-style: none; margin: 0; padding: 0; }
.content-readiness-list li { align-items: start; background: white; border: 1px solid var(--line); border-radius: 0.85rem; display: flex; gap: 0.7rem; padding: 0.75rem; }
.content-readiness-icon { align-items: center; background: #fff0d9; border-radius: 50%; color: var(--amber); display: flex; flex: 0 0 auto; font-weight: 900; height: 1.7rem; justify-content: center; width: 1.7rem; }
.content-readiness-list .is-ready .content-readiness-icon { background: #e2f5ee; color: var(--green); }
.content-readiness-list strong { color: var(--navy); display: block; font-size: 0.8rem; }
.content-readiness-list p { color: var(--muted); font-size: 0.7rem; margin: 0.2rem 0 0; }
.content-readiness-empty { color: var(--muted); }
.content-identifiers { background: white; border: 1px solid var(--line); border-radius: 0.85rem; margin: 0; padding: 0.8rem; }
.content-identifiers dt { color: var(--muted); font-size: 0.62rem; font-weight: 900; margin-top: 0.65rem; text-transform: uppercase; }
.content-identifiers dt:first-child { margin-top: 0; }
.content-identifiers dd { color: var(--navy); font-family: monospace; font-size: 0.7rem; margin: 0.2rem 0 0; overflow-wrap: anywhere; }
.content-affiliate-link { color: var(--coral-dark); display: inline-block; font-size: 0.78rem; font-weight: 900; margin-top: 0.75rem; }
.content-detail-caption { background: var(--navy); border-radius: 0.9rem; color: #f8f3ed; font: 0.78rem/1.55 "Lato Radar", sans-serif; margin: 0; max-height: 16rem; overflow: auto; padding: 1rem; white-space: pre-wrap; }
.content-usage-history { display: grid; gap: 0; list-style: none; margin: 0; padding: 0; }
.content-usage-history li { display: flex; gap: 0.75rem; min-height: 4.3rem; padding-bottom: 0.8rem; position: relative; }
.content-usage-history li:not(:last-child)::after { background: var(--line); bottom: 0; content: ""; left: 0.84rem; position: absolute; top: 1.8rem; width: 2px; }
.content-usage-marker { align-items: center; background: var(--navy); border: 3px solid #fbf7f2; border-radius: 50%; color: white; display: flex; flex: 0 0 auto; font-size: 0.7rem; font-weight: 900; height: 1.8rem; justify-content: center; position: relative; width: 1.8rem; z-index: 1; }
.content-usage-history strong, .content-usage-history time { display: block; }
.content-usage-history strong { color: var(--navy); font-size: 0.8rem; text-transform: capitalize; }
.content-usage-history time { color: var(--muted); font-size: 0.68rem; margin-top: 0.15rem; }
.content-usage-history p { color: var(--muted); font-family: monospace; font-size: 0.68rem; margin: 0.3rem 0 0; overflow-wrap: anywhere; }

.product-shell { padding-bottom: 4rem; }
.product-hero { align-items: end; background: radial-gradient(circle at 88% 20%, rgba(255, 202, 74, 0.24), transparent 28%), linear-gradient(135deg, rgba(255,255,255,0.96), rgba(255,242,232,0.9)); border: 1px solid rgba(255,255,255,0.96); border-radius: 1.6rem; box-shadow: var(--shadow); display: grid; gap: 2rem; grid-template-columns: 1fr auto; margin: 2.25rem 0 1.25rem; padding: clamp(1.5rem, 4vw, 3rem); }
.product-filters { align-items: end; background: linear-gradient(135deg, #f7f0e9, rgba(255,255,255,0.82)); border: 1px solid var(--line); border-radius: 1rem; display: grid; gap: 0.8rem; grid-template-columns: repeat(12, minmax(0, 1fr)); margin-bottom: 1.4rem; padding: 1rem; }
.product-filters label:not(.product-check) { color: var(--muted); display: grid; font-size: 0.67rem; font-weight: 900; gap: 0.3rem; letter-spacing: 0.06em; text-transform: uppercase; }
.product-filters .product-search { grid-column: span 4; }
.product-filters label:not(.product-search, .product-check) { grid-column: span 2; }
.product-filters .product-check { grid-column: span 4; }
.product-filters button { grid-column: span 3; min-width: 9rem; white-space: nowrap; width: 100%; }
.product-filters input, .product-filters select, .product-filters button { min-height: 2.55rem; }
.section-heading-actions { align-items: flex-end; display: flex; flex-direction: column; gap: .45rem; text-align: right; }
.product-check { align-items: center; color: var(--navy); display: flex; font-size: 0.75rem; font-weight: 900; gap: 0.45rem; min-height: 2.55rem; white-space: nowrap; }
.product-check input { accent-color: var(--coral); min-height: auto; width: 1rem; }
.product-grid { display: grid; gap: 1rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.product-card { background: white; border: 1px solid var(--line); border-radius: 1.1rem; box-shadow: 0 10px 28px rgba(35,27,20,0.06); min-width: 0; overflow: hidden; transition: transform 160ms ease, box-shadow 160ms ease; }
.product-card:hover { box-shadow: 0 16px 34px rgba(35,27,20,0.11); transform: translateY(-3px); }
.product-card > img { aspect-ratio: 1; background: #f3eee8; display: block; object-fit: contain; width: 100%; }
.product-card-body { padding: 0.9rem; }
.product-card h3 { color: var(--navy); font: 900 0.9rem/1.3 "Lato Radar", sans-serif; margin: 0.7rem 0; min-height: 3.5em; }
.product-card-metrics { display: grid; gap: 0.5rem; grid-template-columns: 1fr 1fr; }
.product-detail-metric { background: #f5f1ec; border-radius: 0.65rem; padding: 0.6rem; }
.product-detail-metric span, .product-detail-metric strong { display: block; }
.product-detail-metric span { color: var(--muted); font-size: 0.6rem; font-weight: 900; text-transform: uppercase; }
.product-detail-metric strong { color: var(--navy); font-size: 0.82rem; margin-top: 0.2rem; overflow-wrap: anywhere; }
.product-card small { color: var(--muted); display: block; font-size: 0.65rem; margin-top: 0.7rem; }
.product-card button { border-radius: 0.7rem; margin-top: 0.75rem; min-height: 2.4rem; width: 100%; }
.product-detail-overview { display: grid; gap: 1.2rem; grid-template-columns: minmax(16rem, 0.8fr) 1.2fr; margin-top: 1.2rem; }
.product-detail-visual { background: white; border: 1px solid var(--line); border-radius: 1rem; margin: 0; overflow: hidden; }
.product-detail-visual img { aspect-ratio: 1; display: block; object-fit: contain; width: 100%; }
.product-detail-facts { display: grid; gap: 0.65rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.product-detail-links { display: flex; flex-wrap: wrap; gap: 0.7rem; margin-top: 1rem; }
.product-detail-links a { background: var(--navy); border-radius: 0.7rem; color: white; font-size: 0.75rem; font-weight: 900; padding: 0.7rem 0.9rem; text-decoration: none; }
.product-history-summary { display: grid; gap: 0.65rem; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 1rem; }
.product-history-events { border-top: 1px solid var(--line); padding-top: 1rem; }
.history-marker { background: var(--blue); border: 4px solid #edf7ff; border-radius: 50%; flex: 0 0 auto; height: 1.7rem; width: 1.7rem; z-index: 1; }
.history-marker.is-completed { background: var(--green); border-color: #e9f7ef; }
.history-marker.is-rejected, .history-marker.is-failed { background: var(--red); border-color: #fff0ed; }
.product-score-list { display: grid; gap: 0.75rem; }
.product-score-list > div > div:first-child { align-items: center; display: flex; gap: 1rem; justify-content: space-between; }
.product-score-list strong { color: var(--navy); font-size: 0.76rem; text-transform: capitalize; }
.product-score-list span { color: var(--green); font-size: 0.72rem; font-weight: 900; }
.product-score-list .score-penalty { color: var(--red); }
.product-score-track { background: #e8e1da; border-radius: 999px; height: 0.42rem; margin-top: 0.3rem; overflow: hidden; }
.product-score-track span { background: var(--green); display: block; height: 100%; }
.product-score-track span.is-penalty { background: var(--red); }
.priority-panel { background: linear-gradient(135deg, rgba(16,43,63,.98), rgba(31,67,88,.96)); color: white; }
.priority-panel .eyebrow { color: var(--yellow); }
.priority-panel h2, .priority-panel .subtitle { color: white; }
.priority-panel .subtitle { opacity: .75; }
.priority-panel .status-message { color: rgba(255,255,255,.75); }
.priority-search-form { align-items: end; display: grid; gap: .8rem; grid-template-columns: minmax(0, 1fr) auto; margin-top: 1rem; }
.priority-search-form label { color: var(--muted); display: grid; font-size: .7rem; font-weight: 900; gap: .4rem; letter-spacing: .05em; text-transform: uppercase; }
.priority-search-form input { min-height: 2.75rem; width: 100%; }
.priority-search-form button { min-height: 2.75rem; min-width: 11rem; white-space: nowrap; }
.priority-batch-panel { border-top: 1px solid var(--line); margin-top: 1.25rem; padding-top: 1rem; }
.priority-batch-panel summary { color: var(--navy); cursor: pointer; font-weight: 900; }
.priority-batch-form { display: grid; gap: 1rem; margin-top: 1rem; }
.priority-batch-form > label { color: var(--muted); display: grid; font-size: .7rem; font-weight: 900; gap: .4rem; letter-spacing: .05em; text-transform: uppercase; }
.priority-batch-terms textarea { min-height: 8rem; resize: vertical; width: 100%; }
.priority-batch-form > button { justify-self: start; }
.priority-batch-matches { display: grid; gap: .75rem; }
.priority-batch-match { align-items: center; background: #fff8f2; border: 1px solid var(--line); border-radius: .8rem; display: grid; gap: .75rem; grid-template-columns: minmax(8rem, .7fr) minmax(12rem, 1fr) auto; padding: .8rem; }
.priority-batch-match strong { font-size: .78rem; overflow-wrap: anywhere; }
.priority-batch-match select { min-width: 0; width: 100%; }
.priority-batch-confirm { align-items: center; color: var(--navy); display: flex; font-size: .72rem; font-weight: 800; gap: .4rem; }
.priority-candidates { display: grid; gap: .8rem; margin-top: 1rem; }
.priority-candidate-card { align-items: center; background: linear-gradient(135deg, #fff, #fff8f2); border: 1px solid var(--line); border-radius: .9rem; display: grid; gap: 1rem; grid-template-columns: 5rem minmax(0, 1fr) auto; padding: .75rem; }
.priority-candidate-card img { aspect-ratio: 1; background: #f2ece7; border-radius: .7rem; height: 5rem; object-fit: contain; width: 5rem; }
.priority-candidate-card h3 { font-size: 1rem; margin: 0 0 .25rem; }
.priority-candidate-card small { color: var(--muted); display: block; margin-top: .2rem; }
.priority-candidate-price { color: var(--ink); }
.priority-candidate-card button { min-width: 10rem; white-space: nowrap; }
.priority-card-actions { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: .35rem; }
.priority-card-actions button { flex: 1 1 9rem; }
.priority-list { display: grid; gap: .8rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.priority-list .content-empty { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.16); color: white; grid-column: 1 / -1; }
.priority-card { background: white; border-left: .3rem solid var(--coral); border-radius: .9rem; color: var(--navy); display: grid; gap: .55rem; padding: 1rem; }
.priority-card.is-blocked { border-left-color: var(--red); }
.priority-card.is-paused { border-left-color: var(--muted); opacity: .9; }
.priority-card.is-reserved { border-left-color: var(--yellow); }
.priority-card > div { align-items: start; display: flex; gap: .6rem; }
.priority-card h3 { font-size: .86rem; line-height: 1.35; margin: 0; }
.priority-order { background: var(--navy); border-radius: .45rem; color: white; flex: 0 0 auto; font-size: .68rem; font-weight: 900; padding: .3rem .42rem; }
.priority-meta { color: var(--muted); font-size: .7rem; margin: 0; }
.priority-state { background: #edf7f1; border-radius: 999px; color: var(--green); font-size: .65rem; font-weight: 900; justify-self: start; padding: .3rem .55rem; }
.priority-state.is-blocked { background: #fde5df; color: var(--red); }
.priority-state.is-paused { background: #e8edf0; color: var(--navy); }
.priority-state.is-reserved { background: #fff2ca; color: #7a5800; }
.priority-card small { color: var(--muted); }
.priority-remove { background: transparent; border: 1px solid var(--line); color: var(--red); justify-self: start; min-height: 2.2rem; padding: .45rem .7rem; }
.priority-form-grid { display: grid; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 1.2rem; }
.priority-form-grid label { color: var(--muted); display: grid; font-size: .7rem; font-weight: 900; gap: .4rem; letter-spacing: .05em; text-transform: uppercase; }
.priority-form-grid input, .priority-form-grid select, .priority-form-grid textarea { width: 100%; }
.priority-note { grid-column: 1 / -1; }
.priority-note textarea { min-height: 6rem; resize: vertical; }
.priority-form-actions { display: flex; flex-wrap: wrap; gap: .7rem; justify-content: flex-end; margin-top: 1rem; }
.policy-toolbar { align-items: end; background: #f7f0e9; border: 1px solid var(--line); border-radius: .9rem; display: grid; gap: .8rem; grid-template-columns: minmax(16rem, 1fr) minmax(11rem, .45fr) auto; margin: 1.2rem 0; padding: .9rem; }
.policy-toolbar label { color: var(--muted); display: grid; font-size: .66rem; font-weight: 900; gap: .35rem; letter-spacing: .05em; text-transform: uppercase; }
.policy-toolbar input, .policy-toolbar select, .policy-toolbar button { min-height: 2.55rem; width: 100%; }
.policy-toolbar button { white-space: nowrap; }
.policy-grid { align-items: start; display: grid; gap: 1rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.policy-card { background: linear-gradient(160deg, #fff 0%, #fffaf6 100%); border: 1px solid var(--line); border-top: .3rem solid var(--blue); border-radius: 1rem; box-shadow: 0 10px 26px rgba(35,27,20,.06); min-width: 0; overflow: hidden; padding: 1rem; }
.policy-card.effect-reject { border-top-color: var(--red); }
.policy-card.effect-thematic_only { border-top-color: var(--amber); }
.policy-card.effect-priority_4 { border-top-color: var(--green); }
.policy-card header { align-items: start; display: flex; flex-wrap: wrap; gap: .7rem; justify-content: space-between; }
.policy-card header > div { flex: 1 1 9rem; min-width: 0; }
.policy-card h2 { font-size: .9rem; margin: 0; }
.policy-card header p { color: var(--muted); font-size: .64rem; margin: .25rem 0 0; }
.policy-card header > span { background: #eef3f7; border-radius: 999px; color: var(--navy); flex: 0 1 auto; font-size: .57rem; font-weight: 900; max-width: 100%; overflow-wrap: anywhere; padding: .3rem .45rem; text-transform: uppercase; }
.policy-card.effect-reject header > span { background: #fde5df; color: var(--red); }
.policy-card.effect-thematic_only header > span { background: #fff2ca; color: #725300; }
.policy-card.effect-priority_4 header > span { background: #dff3ea; color: var(--green); }
.policy-card ul { display: flex; flex-wrap: wrap; gap: .4rem; list-style: none; margin: .9rem 0 0; max-height: 12rem; overflow: auto; padding: 0; }
.policy-card li { background: #f5f1ec; border: 1px solid #ece4dc; border-radius: .45rem; color: var(--navy); font-size: .65rem; font-weight: 800; padding: .32rem .45rem; }
.policy-editor { margin-top: 1.25rem; }
.policy-editor + .content-panel { margin-top: 1.25rem; }
.policy-override-form { align-items: end; background: linear-gradient(145deg, #fffaf6, #f7f0e9); border: 1px solid var(--line); border-radius: 1rem; display: grid; gap: .9rem; grid-template-columns: repeat(12, minmax(0, 1fr)); margin-top: 1rem; padding: 1rem; }
.policy-override-form label { min-width: 0; }
.policy-source, .policy-destination { grid-column: span 2; }
.policy-group { grid-column: span 5; }
.policy-operation { grid-column: span 3; }
.policy-value { grid-column: span 4; }
.policy-effective-from, .policy-expires-at { grid-column: span 2; }
.policy-override-reason { grid-column: span 4; }
.policy-override-form label { color: var(--muted); display: grid; font-size: .66rem; font-weight: 900; gap: .35rem; letter-spacing: .05em; text-transform: uppercase; }
.policy-override-form input, .policy-override-form select { min-height: 2.55rem; min-width: 0; width: 100%; }
.policy-override-form button { white-space: nowrap; }
.policy-override-actions { display: flex; flex-wrap: wrap; gap: .55rem; grid-column: 1 / -1; justify-content: flex-end; min-width: 0; }
.policy-override-actions button { flex: 0 1 auto; min-width: 8.75rem; padding-inline: .85rem; width: auto; }
.policy-impact { background: #fff8f2; border: 1px solid var(--line); border-radius: .9rem; margin-top: 1rem; padding: 1rem; }
.policy-impact-summary { align-items: center; display: flex; flex-wrap: wrap; gap: .6rem 1.2rem; justify-content: space-between; }
.policy-impact-summary h3 { margin: 0; }
.policy-impact-summary p { color: var(--muted); margin: .25rem 0 0; }
.policy-impact-list { display: grid; gap: .55rem; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: .9rem; }
.policy-impact-product { align-items: center; background: white; border: 1px solid var(--line); border-radius: .7rem; display: grid; gap: .7rem; grid-template-columns: 3.5rem minmax(0, 1fr); padding: .6rem; }
.policy-impact-product img { aspect-ratio: 1; background: #f2ece7; border-radius: .55rem; height: 3.5rem; object-fit: contain; width: 3.5rem; }
.policy-impact-product strong { display: block; font-size: .78rem; line-height: 1.3; }
.policy-impact-product small { color: var(--muted); }
.policy-overrides { display: grid; gap: .55rem; margin-top: 1rem; }
.policy-override { align-items: center; background: #f8f3ed; border: 1px solid #ece3da; border-left: .25rem solid var(--green); border-radius: .7rem; display: flex; gap: 1rem; justify-content: space-between; min-width: 0; padding: .85rem; }
.policy-override > div, .policy-version > div { min-width: 0; overflow-wrap: anywhere; }
.policy-override.is-inactive { border-left-color: var(--muted); opacity: .72; }
.policy-override strong { color: var(--navy); font-size: .78rem; }
.policy-override p { color: var(--muted); font-size: .66rem; margin: .2rem 0 0; }
.policy-override button { flex: 0 0 auto; min-height: 2.1rem; padding: .4rem .65rem; }
.policy-row-actions { display: flex; flex: 0 0 auto; flex-wrap: wrap; gap: .45rem; justify-content: flex-end; }
.policy-override-form :disabled:not(button) { background: #eee8e1; color: #6d625a; cursor: not-allowed; opacity: 1; }
.policy-history { display: grid; gap: .55rem; margin-top: 1rem; }
.policy-history-toolbar { align-items: end; background: #fbf7f2; border: 1px solid var(--line); border-radius: .85rem; display: grid; gap: .75rem; grid-template-columns: minmax(15rem, 1.5fr) minmax(12rem, 1fr) minmax(9rem, .7fr) auto auto; margin-top: 1rem; padding: .85rem; }
.policy-history-toolbar label { color: var(--muted); display: grid; font-size: .66rem; font-weight: 900; gap: .35rem; letter-spacing: .05em; min-width: 0; text-transform: uppercase; }
.policy-history-toolbar input, .policy-history-toolbar select { min-height: 2.55rem; min-width: 0; width: 100%; }
.policy-history-toolbar button { min-height: 2.55rem; white-space: nowrap; }
.policy-version { align-items: center; background: linear-gradient(135deg, #fff 0%, #f8f3ed 100%); border: 1px solid var(--line); border-left: .25rem solid var(--orange); border-radius: .7rem; display: flex; gap: 1rem; justify-content: space-between; min-width: 0; padding: .85rem; }
.policy-version strong { color: var(--navy); font-size: .78rem; }
.policy-version p, .policy-version small { color: var(--muted); display: block; font-size: .66rem; margin: .2rem 0 0; }
.policy-version button { flex: 0 0 auto; min-height: 2.1rem; padding: .4rem .65rem; }
.product-detail-links button { border-radius: .7rem; min-height: auto; padding: .7rem .9rem; }
.reels-hero { background: radial-gradient(circle at 86% 18%, rgba(246,90,58,.3), transparent 25%), linear-gradient(125deg, #102b3f 0%, #173f58 58%, #254f63 100%); border: 1px solid rgba(255,255,255,.12); border-radius: 1.6rem; box-shadow: 0 28px 70px rgba(16,43,63,.18); color: white; overflow: hidden; padding: clamp(1.7rem,4vw,3rem); position: relative; }
.reels-hero::before { border: 1px solid rgba(255,255,255,.12); border-radius: 50%; content: ""; height: 16rem; position: absolute; right: -5rem; top: -9rem; width: 16rem; }
.reels-hero > * { position: relative; z-index: 1; }
.reels-hero h1 { color: white; font-size: clamp(2.4rem,5vw,4.6rem); letter-spacing: -.04em; line-height: .96; max-width: 11ch; }
.reels-hero .eyebrow { color: #ffb09c; }
.reels-hero .subtitle { color: rgba(255,255,255,.76); max-width: 42rem; }

/* Page mastheads share one visual language while keeping contextual accents. */
.executive-hero,
.hero-compact,
.operations-hero,
.reports-hero,
.content-hero,
.product-hero {
  background:
    radial-gradient(circle at 88% 16%, rgba(246,90,58,.28), transparent 27%),
    radial-gradient(circle at 62% 112%, rgba(64,150,178,.2), transparent 32%),
    linear-gradient(125deg, #0d273a 0%, #173e57 58%, #244f63 100%);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 1.6rem;
  box-shadow: 0 28px 70px rgba(16,43,63,.18);
  color: white;
  overflow: hidden;
  padding: clamp(1.7rem,4vw,3rem);
  position: relative;
}
.executive-hero::before,
.hero-compact::before,
.operations-hero::before,
.reports-hero::before,
.content-hero::before,
.product-hero::before {
  background: linear-gradient(135deg, rgba(255,255,255,.08), transparent 58%);
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 50%;
  content: "";
  height: 17rem;
  pointer-events: none;
  position: absolute;
  right: -5rem;
  top: -10rem;
  width: 17rem;
}
.executive-hero::after,
.content-hero::after {
  border-color: rgba(255,176,156,.2);
}
.executive-hero > *,
.hero-compact > *,
.operations-hero > *,
.reports-hero > *,
.content-hero > *,
.product-hero > * {
  position: relative;
  z-index: 1;
}
.executive-hero h1,
.hero-compact h1,
.operations-hero h1,
.reports-hero h1,
.content-hero h1,
.product-hero h1 {
  color: white;
  letter-spacing: -.04em;
  line-height: .98;
}
.executive-hero .eyebrow,
.hero-compact .eyebrow,
.operations-hero .eyebrow,
.reports-hero .eyebrow,
.content-hero .eyebrow,
.product-hero .eyebrow {
  color: #ffb09c;
}
.executive-hero .subtitle,
.hero-compact .subtitle,
.operations-hero .subtitle,
.reports-hero .subtitle,
.content-hero .subtitle,
.product-hero .subtitle {
  color: rgba(255,255,255,.76);
  max-width: 46rem;
}
.executive-hero .secondary-action,
.content-hero .secondary-action,
.product-hero .secondary-action {
  background: rgba(255,255,255,.1);
  border-color: rgba(255,255,255,.2);
  color: white;
}
.executive-hero .secondary-action:hover,
.content-hero .secondary-action:hover,
.product-hero .secondary-action:hover {
  background: rgba(255,255,255,.17);
  border-color: rgba(255,255,255,.32);
}
.executive-hero .status-message,
.content-hero .status-message,
.product-hero .status-message {
  color: rgba(255,255,255,.72);
}
.content-hero-stat,
.executive-hero .hero-signal {
  backdrop-filter: blur(14px);
  background: linear-gradient(145deg, rgba(255,255,255,.13), rgba(255,255,255,.07));
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: inset 0 1px rgba(255,255,255,.08), 0 18px 40px rgba(3,18,29,.16);
}
.content-hero-stat span,
.content-hero-stat small,
.executive-hero .hero-signal span,
.executive-hero .hero-signal p {
  color: rgba(255,255,255,.7);
}
.hero-compact,
.operations-hero,
.reports-hero {
  margin: 2.25rem 0 1.25rem;
}
.operations-hero {
  background:
    radial-gradient(circle at 88% 18%, rgba(255,170,69,.26), transparent 28%),
    linear-gradient(125deg, #0d273a 0%, #173e57 60%, #315361 100%);
}
.reports-hero {
  background:
    radial-gradient(circle at 88% 18%, rgba(115,126,255,.25), transparent 28%),
    linear-gradient(125deg, #10263a 0%, #193b56 58%, #32495f 100%);
}
.product-hero {
  background:
    radial-gradient(circle at 88% 18%, rgba(255,202,74,.25), transparent 28%),
    linear-gradient(125deg, #102a3d 0%, #184158 58%, #31565d 100%);
}
.planning-hero {
  background:
    radial-gradient(circle at 88% 18%, rgba(61,181,132,.24), transparent 28%),
    linear-gradient(125deg, #0d293b 0%, #173f55 58%, #28575c 100%);
}
.date-control label,
.planning-hero .planning-controls label {
  color: rgba(255,255,255,.72);
}
.date-control input,
.date-control select,
.planning-hero input,
.planning-hero select {
  background-color: rgba(255,255,255,.97);
}
.reels-state-card { align-items: flex-start; backdrop-filter: blur(12px); background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.17); box-shadow: 0 16px 38px rgba(0,0,0,.13); color: white; display: grid; grid-template-columns: auto 1fr; min-width: 15rem; padding: 1rem; }
.reels-state-card > .ui-icon { color: #ff9b83; grid-row: 1 / 4; height: 1.5rem; margin-right: .65rem; margin-top: .15rem; width: 1.5rem; }
.reels-state-card span, .reels-state-card small { color: rgba(255,255,255,.66); }
.reels-state-card strong { color: white; }
#reels-lab { display: grid; gap: 1rem; padding-top: clamp(1.35rem,3vw,2.4rem); }
#reels-lab > .content-hero, #reels-lab > .content-panel, #reels-lab > .data-boundary, #reels-lab > .reels-flow { margin-bottom: 0; margin-top: 0; }
#reels-lab > .content-panel { padding: clamp(1rem,2.2vw,1.45rem); }
#reels-lab .section-heading { margin-bottom: .8rem; }
#reels-lab .section-heading h2 { font-size: clamp(1.35rem,2.2vw,1.75rem); }
#reels-lab .section-heading p:not(.eyebrow) { font-size: .78rem; line-height: 1.45; margin-top: .3rem; max-width: 54rem; }
.reels-hero { margin: 0; padding: clamp(1.6rem,3vw,2.35rem); }
.reels-hero h1 { font-size: clamp(2.35rem,4.5vw,4.1rem); }
.reels-flow { background: rgba(255,255,255,.92); border: 1px solid rgba(16,43,63,.09); border-radius: 1rem; box-shadow: 0 10px 28px rgba(35,27,20,.07); display: grid; gap: 0; grid-template-columns: repeat(3, minmax(0,1fr)); overflow: hidden; }
.reels-flow[hidden] { display: none !important; }
.reels-flow-step { align-items: center; display: flex; gap: .65rem; min-width: 0; padding: .72rem .9rem; position: relative; }
.reels-flow-step { background: transparent; border: 0; border-radius: 0; box-shadow: none; color: inherit; cursor: pointer; justify-content: flex-start; text-align: left; width: 100%; }
.reels-flow-step:hover { box-shadow: none; transform: none; }
.reels-flow-step:not(:last-child) { border-right: 1px solid var(--line); }
.reels-flow-step > span { align-items: center; background: #edf1f3; border: 2px solid white; border-radius: 50%; box-shadow: 0 0 0 1px #dce3e7; color: var(--muted); display: flex; flex: 0 0 auto; font-size: .68rem; font-weight: 900; height: 1.85rem; justify-content: center; width: 1.85rem; }
.reels-flow-step.is-active { background: linear-gradient(135deg, #fff3ec, #fff); }
.reels-flow-step.is-active > span { background: linear-gradient(135deg,var(--coral),#ff8a58); box-shadow: 0 7px 16px rgba(246,90,58,.23); color: white; }
.reels-flow-step.is-complete { background: linear-gradient(135deg,#eef9f3,#fff); }
.reels-flow-step.is-complete > span { background: #16825d; box-shadow: 0 7px 16px rgba(22,130,93,.2); color: white; }
.reels-flow-step.is-error { background: linear-gradient(135deg,#fff0ed,#fff); }
.reels-flow-step.is-error > span { background: var(--red); color: white; }
.reels-flow-step strong, .reels-flow-step small { display: block; }
.reels-flow-step strong { color: var(--navy); font-size: .72rem; }
.reels-flow-step small { color: var(--muted); font-size: .62rem; margin-top: .12rem; }
.reels-setup-panel, .reels-review-panel, #reels-lab > .content-panel { background: rgba(255,255,255,.94); border: 1px solid rgba(16,43,63,.09); border-radius: 1.25rem; box-shadow: 0 16px 46px rgba(35,27,20,.075); }
.reels-settings { align-items: end; display: grid; gap: .75rem; grid-template-columns: repeat(2,minmax(13rem,24rem)); justify-content: start; margin-top: 0; }
.reels-draft-inbox { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fit,minmax(min(100%,20rem),1fr)); }
.reels-inbox-panel > summary { align-items: center; cursor: pointer; display: flex; justify-content: space-between; list-style: none; padding: .15rem 0; }
.reels-inbox-panel > summary::-webkit-details-marker { display: none; }
.reels-inbox-panel > summary span:first-child { display: grid; gap: .12rem; }
.reels-inbox-panel > summary small { color: var(--coral-dark); font-size: .58rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.reels-inbox-panel > summary strong { color: var(--navy); font-size: 1rem; }
.reels-inbox-summary-hint { align-items: center; color: var(--muted); display: inline-flex; font-size: .65rem; font-weight: 800; gap: .4rem; }
.reels-inbox-summary-hint::after { border-bottom: 2px solid currentColor; border-right: 2px solid currentColor; content: ""; height: .42rem; transform: rotate(45deg); transition: transform 160ms ease; width: .42rem; }
.reels-inbox-panel[open] .reels-inbox-summary-hint::after { transform: rotate(225deg); }
.reels-inbox-content { border-top: 1px solid var(--line); margin-top: .8rem; padding-top: .8rem; }
.reels-inbox-tools { align-items: end; display: flex; flex-wrap: wrap; gap: .5rem; }
.reels-inbox-tools label { color: var(--muted); display: grid; font-size: .58rem; font-weight: 900; gap: .2rem; letter-spacing: .06em; text-transform: uppercase; }
.reels-inbox-tools select { min-height: 2.25rem; min-width: 11.5rem; padding: .35rem 2rem .35rem .55rem; }
.reels-storage-overview { display: grid; gap: .65rem; grid-template-columns: repeat(5,minmax(0,1fr)); }
.reels-storage-overview article { background: linear-gradient(145deg,#102d3f,#173f50); border: 1px solid rgba(255,255,255,.09); border-radius: .8rem; box-shadow: 0 .6rem 1.4rem rgba(16,45,63,.12); display: grid; gap: .2rem; min-width: 0; padding: .75rem .85rem; }
.reels-storage-overview span { color: #b9d1d9; font-size: .55rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.reels-storage-overview strong { color: #fff; font-size: 1.25rem; line-height: 1.1; overflow-wrap: anywhere; }
.reels-storage-overview small { color: #b9d1d9; font-size: .56rem; line-height: 1.35; }
.reels-readiness-panel { align-items: center; background: linear-gradient(125deg,rgba(16,45,63,.98),rgba(20,66,76,.96)) !important; color: #fff; display: grid; gap: 1rem; grid-template-columns: auto minmax(0,1fr) auto; overflow: hidden; position: relative; }
.reels-readiness-panel::after { background: radial-gradient(circle,rgba(255,188,73,.2),transparent 68%); content: ""; height: 12rem; pointer-events: none; position: absolute; right: -3rem; top: -5rem; width: 12rem; }
.reels-readiness-icon { align-items: center; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.16); border-radius: 1rem; display: flex; height: 3.3rem; justify-content: center; width: 3.3rem; }
.reels-readiness-copy { min-width: 0; }
.reels-readiness-copy .eyebrow { color: #ffc76a; }
.reels-readiness-copy h2 { color: #fff; margin: .15rem 0 .35rem; }
.reels-readiness-copy > p:last-of-type { color: #d7e5e9; margin: 0; }
.reels-readiness-copy .reels-operational-message { color: #ffc76a; font-size: .72rem; font-weight: 800; margin: .3rem 0 0; }
.reels-mix-readiness { border-left: 2px solid rgba(255,199,106,.72); margin-top: .7rem; padding-left: .7rem; }
.reels-mix-readiness strong { color: #fff; font-size: .68rem; letter-spacing: .04em; text-transform: uppercase; }
.reels-mix-readiness p { color: #d7e5e9; font-size: .7rem; margin: .18rem 0 0; }
.reels-mix-readiness ul { color: #ffc76a; display: flex; flex-wrap: wrap; font-size: .62rem; gap: .25rem 1rem; margin: .35rem 0 0; padding-left: 1rem; }
.reels-mix-readiness ul[hidden] { display: none; }
.reels-mix-missing-actions { align-items: center; display: flex; flex-wrap: wrap; gap: .55rem .8rem; justify-content: space-between; margin-top: .55rem; max-width: 34rem; }
.reels-mix-missing-actions[hidden] { display: none; }
.reels-mix-missing-actions select { min-height: 2.35rem; width: 100%; }
.reels-mix-missing-actions .secondary-action { min-height: 2.35rem; padding: .48rem .8rem; }
.reels-missing-slot-action { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); border-radius: .55rem; color: #fff; font-size: .64rem; font-weight: 800; padding: .38rem .58rem; text-decoration: none; }
.reels-missing-slot-action:hover { background: rgba(255,255,255,.18); border-color: rgba(255,199,106,.7); color: #ffc76a; }
.reels-readiness-copy dl { display: flex; flex-wrap: wrap; gap: .5rem 1.2rem; margin: .7rem 0 0; }
.reels-readiness-copy dl div { display: grid; gap: .08rem; }
.reels-readiness-copy dt { color: #9fbdc5; font-size: .58rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.reels-readiness-copy dd { color: #fff; font-size: .75rem; font-weight: 800; margin: 0; overflow-wrap: anywhere; }
.reels-publication-command { align-items: center; background: rgba(4,20,29,.42); border: 1px solid rgba(255,255,255,.12); border-radius: .8rem; display: grid; gap: .45rem; grid-template-columns: minmax(0,1fr) auto; margin-top: .85rem; padding: .7rem; }
.reels-publication-command[hidden] { display: none; }
.reels-publication-command > span { color: #9fbdc5; font-size: .58rem; font-weight: 900; grid-column: 1 / -1; letter-spacing: .06em; text-transform: uppercase; }
.reels-publication-command code { color: #fff; font-family: ui-monospace,SFMono-Regular,Consolas,monospace; font-size: .66rem; line-height: 1.55; overflow-wrap: anywhere; }
.reels-publication-command .secondary-action { background: #fff; border-color: #fff; color: #102d3f; white-space: nowrap; }
.reels-publication-command small { color: #ffc76a; grid-column: 1 / -1; min-height: .8rem; }
.reels-readiness-action { align-items: flex-end; display: grid; gap: .45rem; justify-items: end; position: relative; z-index: 1; }
.reels-readiness-action .secondary-action { background: #fff; border-color: #fff; color: #102d3f; white-space: nowrap; }
.reels-selected-window { align-items: center; background: linear-gradient(135deg,#eef8f5,#f6fbf9); border: 1px solid #b9dfd2; border-radius: .75rem; color: #174f3e; display: grid; gap: .65rem; grid-template-columns: auto minmax(0,1fr); margin-top: .7rem; padding: .65rem .75rem; }
.reels-selected-window[hidden] { display: none; }
.reels-selected-window-icon { align-items: center; align-self: center; background: #197052; border-radius: 50%; display: inline-flex; flex: 0 0 1.7rem; height: 1.7rem; justify-content: center; line-height: 1; overflow: hidden; width: 1.7rem; }
.reels-selected-window-icon::before { border-bottom: 2px solid #fff; border-left: 2px solid #fff; content: ""; display: block; height: .3rem; transform: translateY(-.08rem) rotate(-45deg); width: .58rem; }
.reels-selected-window strong,.reels-selected-window span,.reels-selected-window small { display: block; }
.reels-selected-window strong { font-size: .7rem; font-weight: 700; }
.reels-selected-window span { font-size: .68rem; margin-top: .08rem; }
.reels-selected-window small { color: #527267; font-size: .6rem; line-height: 1.35; margin-top: .16rem; }
.reels-readiness-action .compact-action { font-size: .68rem; min-height: 2.1rem; padding: .4rem .7rem; }
.reels-readiness-action small { color: #a9c1c8; font-size: .56rem; text-align: right; }
@media (max-width: 760px) { .reels-readiness-panel { align-items: start; grid-template-columns: auto minmax(0,1fr); } .reels-readiness-action { align-items: stretch; grid-column: 1 / -1; justify-items: stretch; } .reels-readiness-action small { text-align: left; } .reels-publication-command { grid-template-columns: 1fr; } }
.reels-readiness-panel { display: block; padding: 1rem 1.15rem !important; }
.reels-readiness-copy { position: relative; z-index: 1; }
.reels-readiness-heading { align-items: center; display: flex; gap: 1rem; justify-content: space-between; }
.reels-readiness-heading .eyebrow { margin: 0 0 .12rem; }
.reels-readiness-heading h2 { font-size: clamp(1.35rem,2.2vw,1.8rem); margin: 0; }
.reels-readiness-heading + #reels-publication-readiness-message { color: #d7e5e9; font-size: .72rem; margin: .45rem 0 0; }
.reels-readiness-action { align-items: center; display: flex; flex: 0 0 auto; gap: .45rem; justify-items: initial; }
.reels-readiness-action .compact-action { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.22); color: white; font-size: .62rem; min-height: 1.9rem; padding: .35rem .58rem; }
.reels-readiness-action .compact-action:hover { background: white; color: var(--navy); }
.reels-selected-window { background: rgba(235,249,244,.98); border-color: rgba(185,223,210,.85); margin-top: .7rem; padding: .58rem .68rem; }
.reels-selected-window small { max-width: 42rem; }
.reels-operational-message { background: rgba(255,199,106,.1); border-radius: .45rem; padding: .38rem .55rem; }
.reels-operational-message:empty,.reels-operational-message[hidden] { display: none; }
.reels-mix-readiness,.reels-readiness-technical { background: rgba(4,20,29,.18); border: 1px solid rgba(255,255,255,.12); border-radius: .65rem; margin-top: .6rem; padding: 0; }
.reels-mix-readiness > summary,.reels-readiness-technical > summary { align-items: center; cursor: pointer; display: flex; gap: .8rem; justify-content: space-between; list-style: none; padding: .58rem .68rem; }
.reels-mix-readiness > summary::-webkit-details-marker,.reels-readiness-technical > summary::-webkit-details-marker { display: none; }
.reels-mix-readiness > summary strong,.reels-mix-readiness > summary small { display: block; }
.reels-mix-readiness > summary strong { color: white; font-size: .65rem; letter-spacing: .035em; text-transform: uppercase; }
.reels-mix-readiness > summary small { color: #b9ced4; font-size: .62rem; line-height: 1.35; margin-top: .12rem; }
.reels-readiness-disclosure { color: #ffc76a; font-size: .58rem; white-space: nowrap; }
.reels-readiness-disclosure::after { border-bottom: 1px solid currentColor; border-right: 1px solid currentColor; content: ""; display: inline-block; height: .35rem; margin-left: .4rem; transform: rotate(45deg); transition: transform 160ms ease; vertical-align: .15rem; width: .35rem; }
.reels-mix-readiness[open] .reels-readiness-disclosure::after { transform: rotate(225deg); }
.reels-mix-readiness-body { border-top: 1px solid rgba(255,255,255,.1); padding: .55rem .68rem .68rem; }
.reels-mix-readiness ul { margin-top: 0; }
.reels-mix-missing-actions { max-width: 28rem; }
.reels-readiness-technical > summary { color: #c7d9de; font-size: .62rem; }
.reels-readiness-technical > summary::after { content: "+"; font-size: .85rem; }
.reels-readiness-technical[open] > summary::after { content: "−"; }
.reels-readiness-technical dl { border-top: 1px solid rgba(255,255,255,.1); margin: 0; padding: .55rem .68rem .68rem; }
@media (max-width: 620px) { .reels-readiness-heading { align-items: flex-start; } .reels-readiness-action { align-items: flex-end; flex-direction: column; } .reels-selected-window { grid-template-columns: 1fr; } .reels-selected-window-icon { display: none; } }
@media (max-width: 900px) { .reels-storage-overview { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 520px) { .reels-storage-overview { grid-template-columns: 1fr; } }
.reels-draft-inbox > .empty-state { grid-column: 1 / -1; margin: 0; }
.reels-draft-summary { background: linear-gradient(145deg,#fff,#f8f5f1); border: 1px solid var(--line); border-left: .25rem solid #9aaab4; border-radius: .75rem; display: grid; gap: .5rem; min-width: 0; overflow: hidden; padding: .8rem; }
.reels-draft-summary.status-needs_review { border-left-color: var(--coral); }
.reels-draft-summary.status-approved { border-left-color: #16825d; }
.reels-draft-summary.status-rejected { border-left-color: var(--red); }
.reels-draft-summary.status-failed { border-left-color: var(--red); }
.reels-draft-heading { align-items: flex-start; display: flex; flex-wrap: wrap; gap: .45rem; justify-content: space-between; min-width: 0; }
.reels-draft-summary > * { max-width: 100%; min-width: 0; overflow-wrap: anywhere; }
.reels-draft-summary strong { color: var(--navy); font-size: .76rem; }
.reels-draft-status { background: #edf1f3; border-radius: 999px; color: var(--muted); font-size: .54rem; font-weight: 900; padding: .25rem .4rem; text-transform: uppercase; }
.status-needs_review .reels-draft-status { background: #fff0e8; color: var(--coral-dark); }
.status-approved .reels-draft-status { background: #e9f7f0; color: #116647; }
.status-rejected .reels-draft-status { background: #fdecea; color: var(--red); }
.status-failed .reels-draft-status { background: #fdecea; color: var(--red); }
.reels-draft-summary p, .reels-draft-summary small { color: var(--muted); font-size: .62rem; line-height: 1.4; margin: 0; }
.reels-draft-progress { display: grid; gap: .25rem; grid-template-columns: repeat(3,minmax(0,1fr)); margin: .25rem 0; }
.reels-draft-progress span { border-top: 3px solid #dfe5e7; color: var(--muted); font-size: .48rem; min-width: 0; overflow-wrap: anywhere; padding-top: .3rem; }
.reels-draft-progress span.is-complete { border-color: var(--green); color: var(--ink); }
.reels-draft-progress span.is-error { border-color: var(--red); color: var(--red); }
.reels-draft-history { font-variant-numeric: tabular-nums; }
.reels-publication-attempt { background: #f4f7f7; border: 1px solid #e1e8e9; border-radius: .55rem; display: grid; gap: .25rem; padding: .5rem; }
.reels-publication-attempt small { overflow-wrap: anywhere; }
.reels-attempt-status { align-items: center; color: var(--navy); display: inline-flex; font-size: .57rem; font-weight: 900; gap: .3rem; text-transform: uppercase; }
.reels-attempt-status::before { background: #8ca0aa; border-radius: 999px; content: ""; height: .42rem; width: .42rem; }
.reels-attempt-status.status-preparing::before, .reels-attempt-status.status-submitted::before { background: #e59b28; box-shadow: 0 0 0 .18rem #fcebd0; }
.reels-attempt-status.status-succeeded::before { background: var(--green); box-shadow: 0 0 0 .18rem #dff2e9; }
.reels-attempt-status.status-failed::before { background: var(--red); box-shadow: 0 0 0 .18rem #fde1de; }
.reels-attempt-status.status-outcome_unknown::before { background: #8b5fc7; box-shadow: 0 0 0 .18rem #eee5fa; }
.reels-recovery-guidance { border: 1px solid; border-radius: .5rem; display: grid; gap: .18rem; margin-top: .15rem; padding: .45rem .5rem; }
.reels-recovery-guidance.is-automatic { background: #edf8f4; border-color: #c4e7d9; }
.reels-recovery-guidance.is-manual { background: #fff3ed; border-color: #f4c9b8; }
.reels-recovery-mode { color: var(--navy); font-size: .58rem !important; text-transform: uppercase; }
.reels-recovery-guidance.is-automatic .reels-attempt-failure { color: #116647 !important; }
.reels-recovery-guidance.is-manual .reels-attempt-failure { color: var(--red) !important; }
.reels-attempt-failure { font-weight: 700; }
.reels-attempt-technical { margin-top: .1rem; }
.reels-attempt-technical > summary { color: var(--muted); cursor: pointer; font-size: .56rem; list-style: none; }
.reels-attempt-technical > summary::after { content: "+"; margin-left: .3rem; }
.reels-attempt-technical[open] > summary::after { content: "−"; }
.reels-attempt-technical .reels-attempt-failure-code { display: block; margin-top: .3rem; }
.reels-attempt-failure-code { color: var(--muted); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .62rem; overflow-wrap: anywhere; }
.reels-external-id { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.reels-schedule-controls { align-items: center; display: flex; flex-wrap: wrap; gap: .45rem; }
.reels-schedule-controls input { flex: 1 1 13.5rem; font-size: .72rem; min-height: 2.35rem; min-width: 13.5rem; padding: .4rem .55rem; }
.reels-schedule-controls button { flex: 0 0 auto; }
.reels-schedule-controls .reels-reserve-option { align-items: center; color: var(--muted-text); display: inline-flex; flex: 1 1 100%; font-size: .78rem; gap: .45rem; min-width: 0; }
.reels-schedule-controls .reels-reserve-option input { accent-color: var(--accent); flex: 0 0 1rem; height: 1rem; margin: 0; min-height: 1rem; min-width: 1rem; padding: 0; width: 1rem; }
.reels-schedule-feedback.error { color: var(--red); }
.reels-draft-summary button { justify-self: start; margin-top: .15rem; }
.reels-settings label, .reels-url-field { color: var(--muted); display: grid; font-size: .68rem; font-weight: 900; gap: .4rem; letter-spacing: .04em; text-transform: uppercase; }
.reels-settings select, .reels-url-field input { min-height: 2.5rem; }
.reels-rights-confirmation { align-items: center; background: linear-gradient(135deg,#fff6f0,#fffaf7); border: 1px solid rgba(246,90,58,.22); border-radius: .75rem; display: flex !important; grid-column: 1 / -1; letter-spacing: 0 !important; max-width: 48.75rem; padding: .65rem .8rem; text-transform: none !important; }
.reels-rights-confirmation input { accent-color: var(--coral); flex: 0 0 auto; height: 1rem; margin: 0; width: 1rem; }
.reels-rights-confirmation span { color: var(--navy); font-size: .72rem; line-height: 1.35; }
.reels-items { display: grid; gap: .85rem; margin-top: .75rem; }
.reels-item-card { background: linear-gradient(145deg,#fff 0%,#fffaf6 100%); border: 1px solid rgba(16,43,63,.1); border-radius: 1rem; box-shadow: 0 8px 22px rgba(16,43,63,.05); display: grid; gap: .75rem 1rem; grid-template-columns: minmax(0,1.45fr) minmax(12rem,.55fr); min-width: 0; overflow: hidden; padding: .9rem 1rem; position: relative; }
.reels-item-card::before { background: linear-gradient(180deg,var(--coral),#ff9a65); content: ""; inset: 0 auto 0 0; position: absolute; width: .27rem; }
.reels-item-card header { align-items: center; display: flex; gap: .6rem; grid-column: 1 / -1; }
.reels-item-card h3 { flex: 1; font-size: 1rem; }
.reels-item-actions { align-items: center; display: flex; gap: .35rem; }
.reels-order-action { font-size: .9rem; min-height: 2.1rem; min-width: 2.1rem; padding: .35rem; }
.reels-order-action:disabled { box-shadow: none; cursor: default; opacity: .35; transform: none; }
.reels-item-order { align-items: center; background: linear-gradient(135deg,var(--navy),#28566e); border-radius: .58rem; box-shadow: 0 6px 14px rgba(16,43,63,.17); color: white; display: flex; font-size: .7rem; font-weight: 900; height: 2rem; justify-content: center; width: 2rem; }
.reels-remove { min-height: 2.15rem; padding: .4rem .65rem; }
.reels-url-field { align-self: start; }
.reels-url-row { display: grid; gap: .55rem; grid-template-columns: minmax(0,1fr); }
.reels-url-row button { white-space: nowrap; }
.reels-product-preview { align-items: center; background: #f7f1eb; border: 1px solid #ebe1d8; border-radius: .75rem; display: grid; gap: .65rem; grid-template-columns: 3.6rem minmax(0,1fr); min-height: 4.35rem; padding: .45rem; }
.reels-product-preview.empty { color: var(--muted); display: flex; font-size: .72rem; justify-content: center; }
.reels-product-preview img { aspect-ratio: 1; background: white; border-radius: .5rem; height: 3.6rem; object-fit: contain; width: 3.6rem; }
.reels-product-preview strong, .reels-product-preview span, .reels-product-preview small { display: block; }
.reels-product-preview strong { color: var(--navy); font-size: .78rem; }
.reels-product-preview span, .reels-product-preview small { color: var(--muted); font-size: .64rem; margin-top: .18rem; }
.reels-product-preview a { color: var(--coral-dark); display: inline-block; font-size: .64rem; font-weight: 900; margin-top: .35rem; text-decoration-thickness: 1px; text-underline-offset: 2px; }
.reels-product-preview.reels-product-import { align-items: center; display: grid; gap: .75rem; grid-template-columns: minmax(0,1fr) auto; justify-content: stretch; text-align: left; }
.reels-product-import > div { display: grid; gap: .2rem; min-width: 0; text-align: left; }
.reels-import-product { max-width: 100%; min-width: 0; white-space: normal; }
.reels-video-drop { align-items: center; background: radial-gradient(circle at top,#fff 0%,#fff4ed 100%); border: 1.5px dashed rgba(246,90,58,.45); border-radius: .8rem; cursor: pointer; display: flex; flex-direction: column; grid-column: 2; justify-content: center; min-height: 4.8rem; padding: .65rem; text-align: center; transition: background 160ms ease,border-color 160ms ease,transform 160ms ease; }
.reels-video-drop:hover, .reels-video-drop:focus-within { background: #fff0e7; border-color: var(--coral); transform: translateY(-1px); }
.reels-video-drop input { height: 1px; opacity: 0; position: absolute; width: 1px; }
.reels-video-drop strong { color: var(--coral-dark); font-size: .76rem; }
.reels-video-drop small { color: var(--muted); font-size: .62rem; margin-top: .25rem; }
.reels-video-preview { aspect-ratio: 9 / 16; background: linear-gradient(145deg,#0b202f,#173f58); border: 3px solid white; border-radius: .9rem; box-shadow: 0 12px 28px rgba(16,43,63,.16); grid-column: 2; justify-self: center; max-height: 20rem; max-width: 100%; width: 11.25rem; }
.reels-video-preview:not([src]) { display: none; }
.reels-item-card > .reels-upload-state { align-self: end; margin: 0; }
.reels-item-card > .reels-product-state,
.reels-item-card > .reels-video-state { grid-column: 1 / -1; }
.reels-item-card > .reels-video-state { color: #217451; font-weight: 800; }
.reels-review-panel .reels-readiness { margin-top: .8rem; }
.reels-summary { background: linear-gradient(135deg,#f5f8f9,#fff); border: 1px solid #e1e8eb; border-radius: .75rem; color: var(--muted); font-size: .74rem; margin-top: .7rem; padding: .7rem .85rem; }
.reels-summary p { margin: 0; }
.reels-review-contract { display: grid; gap: .65rem; grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: .8rem; }
.reels-review-contract div { align-items: start; background: linear-gradient(145deg,#fff,#fbf7f3); border: 1px solid var(--line); border-radius: .75rem; display: grid; grid-template-columns: auto 1fr; min-width: 0; padding: .7rem; }
.reels-review-contract .ui-icon { color: var(--coral); grid-row: 1 / 3; height: 1.2rem; margin-right: .65rem; margin-top: .1rem; width: 1.2rem; }
.reels-review-contract span, .reels-review-contract strong { display: block; }
.reels-review-contract span { color: var(--coral-dark); font-size: .6rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.reels-review-contract strong { color: var(--navy); font-size: .72rem; line-height: 1.4; margin-top: .25rem; }
.reels-editorial-review { background: linear-gradient(135deg,#f2faf6,#fff); border: 1px solid rgba(22,130,93,.2); border-radius: .9rem; display: grid; gap: .8rem; margin-top: .9rem; padding: 1rem; }
.reels-editorial-review[hidden] { display: none; }
.reels-editorial-review h3 { margin: .15rem 0 0; }
.reels-composition-preview { background: linear-gradient(145deg,#102b3f,#183f57); border: 1px solid rgba(255,255,255,.1); border-radius: .9rem; box-shadow: 0 14px 32px rgba(16,43,63,.16); overflow: hidden; padding: .85rem; }
.reels-preview-heading { align-items: end; color: white; display: flex; gap: 1rem; justify-content: space-between; margin-bottom: .7rem; }
.reels-preview-heading span, .reels-preview-heading strong { display: block; }
.reels-preview-heading span { color: #ff9b83; font-size: .6rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.reels-preview-heading strong { font-size: .82rem; margin-top: .18rem; }
.reels-preview-heading small { color: rgba(255,255,255,.6); font-size: .62rem; }
.reels-preview-stage { display: grid; gap: .7rem; grid-auto-columns: minmax(11rem,13.5rem); grid-auto-flow: column; overflow-x: auto; padding: .15rem .15rem .55rem; scroll-snap-type: x mandatory; }
.reels-preview-frame { aspect-ratio: 9 / 16; background: #07131c; border: 3px solid rgba(255,255,255,.9); border-radius: 1rem; box-shadow: 0 12px 28px rgba(0,0,0,.28); min-width: 0; overflow: hidden; position: relative; scroll-snap-align: start; }
.reels-preview-frame video,
.reels-preview-frame > img { height: 100%; inset: 0; object-fit: cover; position: absolute; width: 100%; }
.reels-preview-top { align-items: center; display: flex; inset: .65rem .65rem auto; justify-content: space-between; position: absolute; z-index: 2; }
.reels-preview-brand, .reels-preview-counter { background: rgba(7,19,28,.72); border: 1px solid rgba(255,255,255,.18); border-radius: 999px; color: white; font-size: .52rem; font-weight: 900; padding: .28rem .42rem; }
.reels-preview-overlay { background: linear-gradient(180deg,transparent,rgba(7,19,28,.88)); bottom: 0; color: white; display: grid; gap: .25rem; left: 0; padding: 4rem .72rem 1.7rem; position: absolute; right: 0; z-index: 2; }
.reels-preview-kicker { color: #ffcf61; font-size: .55rem; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.reels-preview-product-title { font-size: .9rem; line-height: 1.12; }
.reels-preview-frame.font-brand .reels-preview-product-title { font-family: "Lilita Radar",sans-serif; font-weight: 400; }
.reels-preview-frame.font-clean .reels-preview-product-title { font-family: "Lato Radar",sans-serif; font-weight: 700; }
.reels-preview-frame.font-expressive .reels-preview-product-title { font-family: "Bangers Radar",sans-serif; font-weight: 400; letter-spacing: .035em; }
.reels-preview-frame.font-handwritten .reels-preview-product-title { font-family: "Caveat Radar", "Segoe Print", cursive; font-weight: 400; }
.reels-preview-frame.font-pacifico .reels-preview-product-title { font-family: "Pacifico Radar", cursive; font-weight: 400; }
.reels-preview-frame.font-kalam .reels-preview-product-title { font-family: "Kalam Radar", cursive; font-weight: 400; }
.reels-preview-frame.font-shortstack .reels-preview-product-title { font-family: "Short Stack Radar", cursive; font-weight: 400; }
.reels-preview-frame.font-knewave .reels-preview-product-title { font-family: "Knewave Radar", cursive; font-weight: 400; }
.reels-preview-frame.size-compact .reels-preview-product-title { font-size: .74rem; }
.reels-preview-frame.size-impact .reels-preview-product-title { font-size: 1.08rem; line-height: 1.02; }
.reels-preview-frame.size-large .reels-preview-product-title { font-size: 1.28rem; line-height: .98; }
.reels-preview-frame.size-hero .reels-preview-product-title { font-size: 1.5rem; line-height: .94; }
.reels-preview-overlay.position-top { bottom: auto; padding-bottom: 1rem; padding-top: 4rem; top: 0; }
.reels-preview-overlay.position-center { bottom: 50%; padding-bottom: 1rem; transform: translateY(50%); }
.reels-preview-overlay.position-bottom { bottom: 0; }
.reels-preview-cta { color: #fffaf5; font-size: .57rem; line-height: 1.3; text-shadow: 0 1px 4px rgba(7,19,28,.9); }
.reels-preview-duration { bottom: .5rem; color: rgba(255,255,255,.54); font-size: .48rem; left: .72rem; position: absolute; z-index: 3; }
.reels-editorial-fields { display: grid; gap: .65rem; grid-template-columns: repeat(2,minmax(0,1fr)); }
.reels-visual-controls { align-items: end; background: #fff; border: 1px solid var(--line); border-radius: .75rem; display: grid; gap: .65rem; grid-template-columns: repeat(2,minmax(0,1fr)); padding: .75rem; }
.reels-visual-controls small { color: var(--muted); grid-column: 1 / -1; }
.reels-editorial-review label span { color: var(--muted); display: block; font-size: .65rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.reels-editorial-review input { margin-top: .35rem; width: 100%; }
.reels-editorial-review ol { margin: .4rem 0 0; padding-left: 1.3rem; }
.reels-editorial-review textarea { background: white; margin-top: .35rem; resize: vertical; width: 100%; }
.reels-editorial-review > small { color: var(--muted); }
.reels-audio-policy { align-items: end; background: linear-gradient(135deg,#eef5f6,#fffaf5); border: 1px solid #dce8e9; border-left: 4px solid var(--green); border-radius: .85rem; display: grid; gap: .75rem 1rem; grid-template-columns: minmax(12rem,1fr) minmax(14rem,1fr); padding: .9rem 1rem; }
.reels-audio-policy > div span { color: var(--muted); display: block; font-size: .62rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.reels-audio-policy > div strong { display: block; margin-top: .2rem; }
.reels-audio-policy label { color: var(--muted); display: grid; font-size: .62rem; font-weight: 900; gap: .3rem; text-transform: uppercase; }
.reels-audio-policy p { color: var(--muted); grid-column: 1 / -1; line-height: 1.5; margin: 0; }
.reels-audio-policy small { color: var(--muted); grid-column: 1 / -1; }
.reels-editorial-item { align-items: center; display: grid; gap: .55rem; grid-template-columns: 1fr auto; margin-bottom: .45rem; }
.reels-editorial-item input { margin: 0; }
.reels-editorial-item button { min-height: 2.35rem; }
.reels-editorial-actions { align-items: center; display: flex; flex-wrap: wrap; gap: .55rem; justify-content: flex-end; }
.reels-editorial-actions small { color: var(--muted); margin-right: auto; }
.reels-review-decision { background: #fff; border: 1px solid rgba(16,43,63,.12); border-radius: .8rem; display: grid; gap: .65rem; grid-template-columns: minmax(12rem,1fr) repeat(2,minmax(11rem,.7fr)); padding: .8rem; }
.reels-review-decision > div:first-child span, .reels-review-decision > div:first-child strong { display: block; }
.reels-review-decision > div:first-child span { color: var(--coral-dark); font-size: .62rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.reels-review-decision > div:first-child strong { color: var(--navy); font-size: .72rem; line-height: 1.4; margin-top: .25rem; }
.reels-review-decision label { color: var(--muted); font-size: .62rem; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.reels-review-decision select, .reels-review-decision textarea { margin-top: .35rem; width: 100%; }
.reels-review-decision textarea { min-height: 2.6rem; resize: vertical; }
.reels-decision-actions { align-items: center; display: flex; gap: .5rem; grid-column: 1 / -1; justify-content: flex-end; }
.reels-review-decision > .status-message { grid-column: 1 / -1; margin: 0; }
.reels-final-actions { align-items: center; border-top: 1px solid var(--line); display: flex; gap: 1rem; justify-content: space-between; margin-top: .85rem; padding-top: .85rem; }
.reels-final-actions p { color: var(--muted); font-size: .7rem; margin: 0; max-width: 46rem; }
.reels-final-actions button { white-space: nowrap; }
.reels-operation-status { align-items: center; background: #eef5f6; border: 1px solid #d8e6e8; border-left: .25rem solid var(--coral); border-radius: .75rem; color: var(--navy); display: flex; font-size: .72rem; font-weight: 800; min-height: 2.75rem; padding: .65rem .85rem; }
.reels-operation-status a { color: var(--coral-dark); margin-left: .2rem; text-underline-offset: .16rem; }
.reels-operation-status.error { background: #fff0ed; border-color: #f3cbc3; color: var(--red); }
.reels-notification { align-items: flex-start; animation: reels-notification-enter .24s ease-out; background: #f4fbf8; border: 1px solid #a8d9c5; border-left: .35rem solid #16805e; border-radius: 1rem; bottom: 1.25rem; box-shadow: 0 1.1rem 3rem rgba(6, 34, 48, .22); display: grid; gap: .8rem; grid-template-columns: auto minmax(0, 1fr) auto; max-width: min(31rem, calc(100vw - 2rem)); padding: .95rem 1rem; position: fixed; right: 1.25rem; width: 100%; z-index: 12000; }
.reels-notification[hidden] { display: none; }
.reels-notification-icon { align-items: center; background: #16805e; border-radius: 50%; color: #fff; display: inline-flex; font-size: .9rem; height: 2rem; justify-content: center; margin-top: .05rem; width: 2rem; }
.reels-notification-copy { min-width: 0; }
.reels-notification-copy strong { color: #0b533f; display: block; font-size: .96rem; line-height: 1.25; margin-bottom: .2rem; }
.reels-notification-copy p { color: #335f52; font-size: .8rem; line-height: 1.45; margin: 0; overflow-wrap: anywhere; }
.reels-notification-close { align-items: center; background: transparent; border: 0; border-radius: .45rem; color: #47665d; display: inline-flex; font-size: 1.35rem; height: 1.9rem; justify-content: center; min-width: 1.9rem; padding: 0; width: 1.9rem; }
.reels-notification-close:hover { background: rgba(22, 128, 94, .1); }
.reels-notification.is-warning { background: #fff9eb; border-color: #edce83; border-left-color: #b97a08; }
.reels-notification.is-warning .reels-notification-icon { background: #b97a08; }
.reels-notification.is-warning .reels-notification-copy strong { color: #704804; }
.reels-notification.is-warning .reels-notification-copy p { color: #715b30; }
.reels-notification.is-error { background: #fff2ef; border-color: #efb9af; border-left-color: #c63b2b; }
.reels-notification.is-error .reels-notification-icon { background: #c63b2b; }
.reels-notification.is-error .reels-notification-copy strong { color: #8d261b; }
.reels-notification.is-error .reels-notification-copy p { color: #75443e; }
@keyframes reels-notification-enter { from { opacity: 0; transform: translateY(.75rem); } to { opacity: 1; transform: translateY(0); } }
[data-stage-panel][hidden], .reels-busy-overlay[hidden] { display: none !important; }
.required-mark { color: var(--coral-dark); display: inline; font-size: .52rem; margin-left: .3rem; }
.reels-validation-message { color: var(--red); font-size: .7rem; font-weight: 800; margin: .6rem 0 0; min-height: 1rem; }
.reels-rights-confirmation.field-invalid, select.field-invalid { border-color: var(--red) !important; box-shadow: 0 0 0 3px rgba(190,52,38,.1); }
.reels-stage-actions { display: flex; justify-content: flex-end; margin-top: .75rem; }
.reels-busy-overlay { align-items: center; background: rgba(8,25,36,.72); backdrop-filter: blur(5px); display: flex; inset: 0; justify-content: center; padding: 1rem; position: fixed; z-index: 10000; }
.reels-busy-card { background: #fff; border: 1px solid rgba(255,255,255,.4); border-radius: 1rem; box-shadow: 0 24px 70px rgba(0,0,0,.28); display: grid; gap: .4rem; justify-items: center; max-width: 30rem; padding: 1.4rem; text-align: center; width: 100%; }
.reels-busy-card strong { color: var(--navy); font-size: 1.05rem; }
.reels-busy-card p { color: var(--ink); line-height: 1.5; margin: 0; }
.reels-busy-card small { color: var(--muted); line-height: 1.4; }
.reels-spinner { animation: reels-spin .8s linear infinite; border: 3px solid #f4d8cd; border-radius: 50%; border-top-color: var(--coral); height: 2rem; width: 2rem; }
@keyframes reels-spin { to { transform: rotate(360deg); } }
.reels-item-details, .reels-item-video { align-content: start; display: grid; gap: .65rem; min-width: 0; }
.reels-item-video { justify-items: stretch; }
.reels-item-video .reels-video-drop, .reels-item-video .reels-video-preview { grid-column: auto; }
.reels-item-video .reels-video-preview { margin-inline: auto; }
.reels-item-details .reels-upload-state, .reels-item-video .reels-upload-state { margin: 0; overflow-wrap: anywhere; }
#reels-lab > .data-boundary { padding: .8rem 1rem; }
#reels-lab > .data-boundary p { font-size: .72rem; line-height: 1.45; }

@media (max-width: 760px) {
  .dashboard-update-notice { align-items: stretch; flex-direction: column; width: calc(100vw - 2rem); }
  .dashboard-update-notice button { width: 100%; }
  .filter-disclosure-trigger { grid-template-columns: 1fr auto auto; }
  .filter-disclosure-trigger > small { display: none; }
  .reels-flow { grid-template-columns: 1fr 1fr; }
  .reels-schedule-controls { align-items: stretch; }
  .reels-schedule-controls input, .reels-schedule-controls button { flex-basis: 100%; min-width: 0; width: 100%; }
  .reels-flow-step:not(:last-child) { border-bottom: 1px solid var(--line); border-right: 0; }
  .reels-settings, .reels-item-card { grid-template-columns: 1fr; }
  .reels-video-drop, .reels-video-preview { grid-column: 1; }
  .reels-url-row { grid-template-columns: 1fr; }
  .reels-final-actions { align-items: stretch; flex-direction: column; }
  .reels-review-contract { grid-template-columns: 1fr; }
  .reels-audio-policy { grid-template-columns: 1fr; }
  .reels-review-decision { grid-template-columns: 1fr; }
  .reels-decision-actions, .reels-review-decision > .status-message { grid-column: 1; }
  .reels-decision-actions { align-items: stretch; flex-direction: column; }
  .reels-decision-actions button { width: 100%; }
  .reels-preview-heading { align-items: start; flex-direction: column; gap: .25rem; }
  .reels-preview-stage { grid-auto-columns: minmax(10.5rem,72%); }
  .planning-controls { grid-template-columns: 1fr; min-width: 0; }
  .planning-workspaces { grid-template-columns: 1fr; }
  .planning-toolbar { align-items: stretch; flex-direction: column; gap: 0.75rem; }
  .planning-channel-grid { grid-template-columns: 1fr; }
  .planning-window-fields { grid-template-columns: 1fr; }
  .topbar { align-items: flex-start; display: flex; flex-wrap: wrap; justify-content: space-between; padding: 0.75rem 1rem; }
  .primary-nav { flex-wrap: wrap; gap: 0.45rem 1rem; justify-content: center; order: 3; overflow: visible; padding-top: 0.35rem; width: 100%; }
  .nav-submenu { left: auto; right: 0; }
  .primary-nav span[aria-disabled="true"] { display: none; }
  .executive-hero { border-radius: 1.4rem; grid-template-columns: 1fr; margin-top: 1rem; padding: 2rem 1.35rem; }
  .executive-hero h1 { font-size: clamp(2.6rem, 13vw, 4rem); }
  .executive-grid, .dashboard-columns { grid-template-columns: 1fr; }
  .system-flow { grid-template-columns: 1fr; }
  .system-flow-step { min-height: 4.2rem; }
  .system-flow-step:not(:last-child)::after { bottom: 0; height: auto; left: 1.05rem; right: auto; top: 2.25rem; width: 3px; }
  .filter-toolbar { grid-template-columns: 1fr 1fr; }
  .agenda-search { grid-column: 1 / -1; margin-left: 0; max-width: none; }
  .reports-hero { align-items: stretch; flex-direction: column; }
  .operations-hero { align-items: stretch; flex-direction: column; }
  .operations-kpis { grid-template-columns: 1fr 1fr; }
  .attention-item { align-items: start; grid-template-columns: 1fr; }
  .attention-actions, .incident-dialog-footer { align-items: stretch; flex-direction: column; }
  .attention-actions button, .attention-actions a { text-align: center; width: 100%; }
  .operations-range-control > div { grid-template-columns: 1fr; }
  .operations-range-control button { width: 100%; }
  .report-kpis, .report-layout { grid-template-columns: 1fr; }
  .donut-layout { grid-template-columns: minmax(8rem, 0.55fr) 1fr; }
  .data-boundary { align-items: start; flex-direction: column; }
  .timeline-progress { gap: 0; grid-template-columns: 1fr; }
  .visual-journey-heading { align-items: start; flex-direction: column; gap: 0.4rem; }
  .visual-journey-heading > p { text-align: left; }
  .visual-journey-gallery { grid-auto-columns: minmax(78%, 1fr); grid-auto-flow: column; grid-template-columns: none; overflow-x: auto; padding-bottom: 0.5rem; scroll-snap-type: x mandatory; }
  .visual-stage { scroll-snap-align: start; }
  .progress-step { min-height: 4rem; }
  .progress-step:not(:last-child)::after { bottom: 0; height: auto; left: 1.05rem; right: auto; top: 2.2rem; width: 3px; }
  .hero { align-items: stretch; flex-direction: column; }
  .date-control { min-width: 0; }
  .summary { grid-template-columns: 1fr; }
  .health-heading { align-items: start; flex-direction: column; gap: 0.5rem; }
  .health-grid { grid-template-columns: 1fr 1fr; row-gap: 1.25rem; }
  .health-item:nth-child(odd) { border-left: 0; padding-left: 0; }
  .section-heading { align-items: start; flex-direction: column; }
  .agenda-item { align-items: start; grid-template-columns: 4rem 2.75rem 1fr; }
  .content-hero { align-items: stretch; grid-template-columns: 1fr; }
  .content-hero-stat { min-width: 0; }
  .content-filters { grid-template-columns: 1fr; }
  .content-filters label, .content-filters .content-search, .visual-assets-filters label, .visual-assets-filters .content-search, .visual-assets-filters button { grid-column: auto; }
  .content-filters button { grid-column: 1 / -1; justify-self: stretch; width: 100%; }
  .content-grid { grid-auto-columns: minmax(84%, 1fr); grid-auto-flow: column; grid-template-columns: none; overflow-x: auto; padding-bottom: 0.6rem; scroll-snap-type: x mandatory; }
  .content-card { scroll-snap-align: start; }
  .content-detail-dialog { height: 96vh; max-height: 96vh; width: 96vw; }
  .content-detail-shell { border-radius: 1.1rem; max-height: 96vh; }
  .content-detail-header { align-items: stretch; flex-direction: column; }
  .content-detail-close { width: 100%; }
  .content-detail-metadata, .content-detail-lower { grid-template-columns: 1fr; }
  .content-detail-slides { grid-auto-columns: minmax(76%, 1fr); grid-auto-flow: column; grid-template-columns: none; overflow-x: auto; padding-bottom: 0.5rem; scroll-snap-type: x mandatory; }
  .content-detail-slide { scroll-snap-align: start; }
  .product-hero, .product-detail-overview { grid-template-columns: 1fr; }
  .priority-list, .priority-form-grid, .policy-grid, .policy-toolbar, .policy-override-form, .policy-impact-list { grid-template-columns: 1fr; }
  .policy-source, .policy-destination, .policy-group, .policy-operation, .policy-value, .policy-effective-from, .policy-expires-at, .policy-override-reason, .policy-override-actions { grid-column: 1 / -1; }
  .policy-override-actions { flex-direction: column; }
  .policy-override-actions button { width: 100%; }
  .policy-override, .policy-version { align-items: stretch; flex-direction: column; }
  .policy-override button, .policy-version button, .policy-row-actions { width: 100%; }
  .policy-row-actions { flex-direction: column; }
  .policy-history-toolbar { grid-template-columns: 1fr; }
  .policy-history-toolbar button { width: 100%; }
  .priority-search-form, .priority-candidate-card { grid-template-columns: 1fr; }
  .priority-search-form button, .priority-candidate-card button { width: 100%; }
  .priority-note { grid-column: auto; }
  .product-filters { grid-template-columns: 1fr; }
  .product-filters .product-search, .product-filters label:not(.product-search, .product-check), .product-filters .product-check, .product-filters button { grid-column: auto; }
  .product-grid { grid-auto-columns: minmax(76%, 1fr); grid-auto-flow: column; grid-template-columns: none; overflow-x: auto; padding-bottom: 0.6rem; scroll-snap-type: x mandatory; }
  .product-card { scroll-snap-align: start; }
  .agenda-thumbnail { width: 2.75rem; }
  .badges { align-items: start; flex-direction: row; flex-wrap: wrap; grid-column: 2 / 4; }
}

@media (min-width: 761px) and (max-width: 980px) {
  .executive-grid { grid-template-columns: repeat(2, 1fr); }
  .system-flow { gap: 1rem 0; grid-template-columns: repeat(3, 1fr); }
  .filter-toolbar { grid-template-columns: repeat(3, 1fr); }
  .agenda-search { grid-column: 1 / -1; margin-left: 0; max-width: none; }
  .report-kpis { grid-template-columns: repeat(2, 1fr); }
  .report-layout { grid-template-columns: 1fr; }
  .dashboard-columns { grid-template-columns: 1fr; }
  .summary { grid-template-columns: repeat(2, 1fr); }
  .health-grid { grid-template-columns: repeat(2, 1fr); row-gap: 1.25rem; }
  .health-item:nth-child(odd) { border-left: 0; padding-left: 0; }
  .content-filters { grid-template-columns: repeat(2, 1fr); }
  .content-filters label, .content-filters .content-search, .visual-assets-filters label, .visual-assets-filters .content-search, .visual-assets-filters button { grid-column: auto; }
  .content-filters button { grid-column: 1 / -1; justify-self: end; width: min(15rem, 100%); }
  .content-search { grid-column: 1 / -1; }
  .content-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .content-detail-slides { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-filters .product-search, .product-filters label:not(.product-search, .product-check), .product-filters .product-check, .product-filters button { grid-column: auto; }
  .product-search { grid-column: 1 / -1; }
  .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 761px) and (max-width: 1180px) {
  .policy-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .policy-override-form { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .policy-source, .policy-destination { grid-column: span 2; }
  .policy-group { grid-column: span 2; }
  .policy-value, .policy-override-reason { grid-column: span 3; }
  .policy-effective-from, .policy-expires-at { grid-column: span 3; }
  .policy-operation { grid-column: span 2; }
  .policy-override-actions { grid-column: 1 / -1; }
  .policy-history-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .policy-history-toolbar label:first-child { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}

.login-body { align-items: center; display: flex; justify-content: center; padding: 1rem; }
.login-card { background: white; border: 1px solid var(--line); border-radius: 1.5rem; box-shadow: var(--shadow); max-width: 430px; padding: 2rem; width: 100%; }
.login-card .brand { margin-bottom: 3rem; }
.login-card h1 { font-size: clamp(2rem, 8vw, 3.2rem); margin-bottom: 2rem; }
.login-form { display: grid; gap: 0.65rem; }
.login-form label { font-size: 0.8rem; font-weight: 800; margin-top: 0.5rem; }
.login-error { color: #a52b1b; min-height: 1.2rem; margin: 0.35rem 0; }