/* ATT-MACHINE-REFINERIA-001 · isolated premium-industrial motion LAB.
   Scoped to opt-in role shells; stable /app/ without experience is untouched.
   No animation is an operational source of truth. */
body.refinery-motion-enabled {
  --refinery-ink: #061b30;
  --refinery-blue: #0c3656;
  --refinery-gold: #dfb75b;
  --refinery-glow: rgba(52, 157, 206, .14);
}
body.refinery-motion-enabled .role-experience-banner {
  position: relative;
  overflow: hidden;
  background: linear-gradient(115deg, #061a2f 0%, #0c3354 65%, #133e5e 100%);
  border: 1px solid #26516e;
  box-shadow: 0 14px 34px rgba(4, 24, 43, .17);
}
body.refinery-motion-enabled .role-experience-banner::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: linear-gradient(#ffe09a, #b48826);
}
body.refinery-motion-enabled .role-experience-kicker { color: #e5c576; }
body.refinery-motion-enabled .role-experience-heading h2 { color: #fff; letter-spacing: -.035em; }
body.refinery-motion-enabled .role-experience-heading p:last-child { color: #d0e0ec; }
body.refinery-motion-enabled .role-experience-switch {
  color: #fff1c5;
  border-color: #6e7d82;
  background: rgba(255, 255, 255, .08);
}
body.refinery-motion-enabled .role-experience-switch:hover { background: rgba(255, 255, 255, .14); }

/* FIELD: one clear operating focus, high-contrast states, touch-safe controls. */
body.refinery-motion-enabled[data-experience="field"] #operatorView > .hero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background:
    linear-gradient(135deg, rgba(11, 57, 91, .92), rgba(4, 25, 45, .98)),
    repeating-linear-gradient(90deg, transparent 0 31px, rgba(170, 206, 227, .1) 32px 33px);
  color: #fff;
  border: 1px solid #2c5470;
  box-shadow: 0 18px 36px rgba(5, 27, 48, .2);
}
body.refinery-motion-enabled[data-experience="field"] #operatorView > .hero h2,
body.refinery-motion-enabled[data-experience="field"] #operatorView > .hero .eyebrow,
body.refinery-motion-enabled[data-experience="field"] #operatorView > .hero .hero-metrics strong {
  color: #fff4d8;
}
body.refinery-motion-enabled[data-experience="field"] #operatorView > .hero p,
body.refinery-motion-enabled[data-experience="field"] #operatorView > .hero .hero-metrics span {
  color: #dae7f0;
}
body.refinery-motion-enabled[data-experience="field"] .field-guide {
  position: relative;
  overflow: hidden;
  border-top: 4px solid var(--refinery-gold);
  background: linear-gradient(140deg, #fff, #edf5fa);
  box-shadow: 0 14px 36px rgba(10, 52, 83, .13);
}
body.refinery-motion-enabled[data-experience="field"] .field-quick-primary {
  background: linear-gradient(120deg, #0b3557, #145b80);
  box-shadow: 0 6px 18px var(--refinery-glow);
}
body.refinery-motion-enabled[data-experience="field"] #fieldSyncDescription[data-tone="pending"] {
  color: #795513;
}
body.refinery-motion-enabled[data-experience="field"] .field-sync-strip {
  border-left: 3px solid #537e9e;
}
body.refinery-motion-enabled[data-experience="field"] .field-sync-strip:has(#fieldSyncDescription[data-tone="error"]) {
  border-left-color: #b33e3e;
}
body.refinery-motion-enabled[data-experience="field"] .field-sync-strip:has(#fieldSyncDescription[data-tone="ok"]) {
  border-left-color: #217e59;
}
body.refinery-motion-enabled[data-experience="field"] .field-sync-strip:has(#fieldSyncDescription[data-tone="offline"]) {
  border-left-color: #a97416;
}
.refinery-prestart-progress {
  padding: 15px 16px 13px;
  margin: 12px 0 15px;
  background: #f4f8fb;
  border: 1px solid #d1dfe8;
  border-radius: 14px;
}
.refinery-prestart-top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 13px;
  color: #103956;
}
.refinery-prestart-top strong { font-weight: 800; }
.refinery-prestart-top output { font-variant-numeric: tabular-nums; font-weight: 800; }
.refinery-prestart-progress progress {
  display: block;
  width: 100%;
  height: 12px;
  margin: 12px 0;
  border-radius: 9px;
  border: 0;
  accent-color: #1a7088;
  overflow: hidden;
}
.refinery-prestart-progress progress::-webkit-progress-bar { background: #dbe6ed; border-radius: 9px; }
.refinery-prestart-progress progress::-webkit-progress-value {
  background: linear-gradient(90deg, #11526e, #39a5ab);
  border-radius: 9px;
  transition: width .28s ease;
}
.refinery-prestart-progress progress::-moz-progress-bar {
  background: #176680;
  border-radius: 9px;
}
.refinery-prestart-progress p { margin: 0; font-size: 12px; color: #546c7c; line-height: 1.5; }

/* SUPERVISOR: visual emphasis on derived source and exception hierarchy. */
body.refinery-motion-enabled[data-experience="command"] .command-brief {
  border-top: 4px solid var(--refinery-gold);
  background: linear-gradient(155deg, #fff 45%, #eaf3f8 100%);
  box-shadow: 0 16px 42px rgba(5, 38, 67, .1);
}
body.refinery-motion-enabled[data-experience="command"] .command-brief-kpis article {
  border-color: #d4e2ec;
  border-bottom: 3px solid #367697;
  box-shadow: 0 6px 19px rgba(5, 37, 65, .055);
}
body.refinery-motion-enabled[data-experience="command"] .command-brief-kpis article strong {
  letter-spacing: -.045em;
  font-variant-numeric: tabular-nums;
}
body.refinery-motion-enabled[data-experience="command"] .command-attention-item[data-severity="ERROR"] {
  background: #fff3f1;
}
body.refinery-motion-enabled[data-experience="command"] .command-attention-item[data-severity="WARNING"] {
  background: #fff9ed;
}

/* Motion should never hide alerts, disable a control, or delay canonical writes. */
@media (prefers-reduced-motion: no-preference) {
  body.refinery-motion-enabled .role-experience-switch,
  body.refinery-motion-enabled .field-quick-actions button,
  body.refinery-motion-enabled .command-actions button {
    transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
  }
  body.refinery-motion-enabled .role-experience-switch:hover,
  body.refinery-motion-enabled .field-quick-actions button:hover:not(:disabled),
  body.refinery-motion-enabled .command-actions button:hover:not(:disabled) {
    transform: translateY(-2px);
  }
}
@media (prefers-reduced-motion: reduce) {
  body.refinery-motion-enabled *,
  body.refinery-motion-enabled *::before,
  body.refinery-motion-enabled *::after {
    animation: none !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}
@media (max-width: 480px) {
  body.refinery-motion-enabled .role-experience-banner { padding: 16px; }
  .refinery-prestart-progress { padding: 13px; }
}

/* Pre-Start decisions are NOT authorization. Risk is communicated in text and color. */
.refinery-prestart-progress[data-tone="nonconformity"] { border: 2px solid #a03b37; background: #fff1ef; }
.refinery-prestart-progress[data-tone="observation"] { border-color: #b98a1f; background: #fff9e8; }
.refinery-prestart-progress[data-tone="nonconformity"] .refinery-prestart-top { color: #842720; }
.refinery-prestart-progress[data-tone="nonconformity"] progress { accent-color: #a03b37; }
.refinery-prestart-progress[data-tone="nonconformity"] progress::-webkit-progress-value { background: #a03b37; }
.refinery-prestart-progress[data-tone="nonconformity"] progress::-moz-progress-bar { background: #a03b37; }
.refinery-prestart-progress[data-tone="observation"] progress { accent-color: #94660a; }
.refinery-prestart-progress[data-tone="observation"] progress::-webkit-progress-value { background: #94660a; }
.refinery-prestart-progress[data-tone="observation"] progress::-moz-progress-bar { background: #94660a; }
.refinery-prestart-flags { margin: 0 0 8px; font-weight: 800; font-size: 13px; line-height: 1.5; }
.refinery-prestart-flags[hidden] { display: none; }
.refinery-prestart-progress[data-tone="nonconformity"] .refinery-prestart-flags { color: #842720; }
.refinery-prestart-progress[data-tone="observation"] .refinery-prestart-flags { color: #76550e; }

/* SUPERVISOR: optional Fleet -> Asset continuity through native View Transitions.
   JavaScript activates this ONLY for the synthetic supervisor shell and only
   when the browser supports the API and the user allows motion. */
@media (prefers-reduced-motion: no-preference) {
  @keyframes refinery-supervisor-view-out {
    from { opacity: 1; filter: blur(0); }
    to { opacity: .74; filter: blur(2px); }
  }
  @keyframes refinery-supervisor-view-in {
    from { opacity: .66; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
  }
  html:has(body.refinery-motion-enabled[data-experience="command"])::view-transition-old(root) {
    animation: .15s ease-in both refinery-supervisor-view-out;
  }
  html:has(body.refinery-motion-enabled[data-experience="command"])::view-transition-new(root) {
    animation: .29s cubic-bezier(.16,.84,.28,1) both refinery-supervisor-view-in;
  }
}

/* FIELD: synthetic identity is read-only; no false impression that the textbox
   changes the authenticated event actor. */
body.refinery-motion-enabled[data-experience="field"] #operator[readonly] {
  background: #edf3f7;
  border-color: #bdcfda;
  color: #405b6f;
  cursor: not-allowed;
}
body.refinery-motion-enabled[data-experience="field"] .field-identity-hint {
  display: block;
  margin: 6px 0 0;
  font-size: 12px;
  line-height: 1.45;
  color: #4d6576;
}