/* Modern Natural feedback. Owners keep meaning, dimensions and actual state.
 * No universal success/warning taxonomy; contextual accents remain local. */
:root {
  --al-feedback-icon-small: 16px;
  --al-feedback-icon-inline: 20px;
  --al-feedback-icon-feature: 24px;
  --al-feedback-radius: var(--al-surface-radius-compact);
  --al-feedback-ink: var(--al-surface-ink);
  --al-feedback-muted: var(--al-surface-ink-muted);
  --al-feedback-focus: var(--al-surface-border-hover);
  --al-feedback-label-size: 12px;
  --al-feedback-label-weight: 600;
  --al-feedback-label-leading: 1.25;
  --al-feedback-notice-background: var(--al-surface-card);
  --al-feedback-notice-border: var(--al-surface-border);
  --al-feedback-skeleton: #e8edeb;
  --al-feedback-spin: al-feedback-spin .9s linear infinite;
  --al-feedback-progress-moss-start: #183f2d;
  --al-feedback-progress-moss-mid: #2c6b4a;
  --al-feedback-progress-moss-end: #71966e;
  --al-feedback-progress-moss: linear-gradient(100deg, var(--al-feedback-progress-moss-start), var(--al-feedback-progress-moss-mid) 55%, var(--al-feedback-progress-moss-end));
  --al-feedback-progress-river: linear-gradient(100deg, #285344, #416a78 62%, #8bb4b8);
  --al-feedback-progress-satin: linear-gradient(100deg, #76522d, #b38a53 58%, #dfc99d);
  --al-feedback-premium-panel: linear-gradient(135deg, var(--al-feedback-progress-moss-start), var(--al-feedback-progress-moss-mid));
  --al-feedback-premium-glint: linear-gradient(115deg, transparent 15%, #dfc99d24 50%, transparent 78%);
  --al-feedback-progress-track: #e8eeea;
  --al-feedback-progress-edge: inset 0 1px 0 #ffffff40;
  --al-feedback-progress-transition: width 240ms ease-out;
}

/* Explicit opt-in primitives, also consumed through variables in legacy owners. */
.al-feedback-icon { width: var(--al-feedback-icon-inline); height: var(--al-feedback-icon-inline); flex-shrink: 0; color: inherit; }
.al-feedback-label {
  display: inline-flex; align-items: center; gap: 6px; max-width: 100%;
  padding: 4px 8px; border: 1px solid var(--al-feedback-notice-border);
  border-radius: var(--al-feedback-radius); background: var(--al-surface-subtle);
  color: var(--al-feedback-ink); font-size: var(--al-feedback-label-size);
  font-weight: var(--al-feedback-label-weight); line-height: var(--al-feedback-label-leading);
  overflow-wrap: anywhere;
}
.al-feedback-notice { background: var(--al-feedback-notice-background); border-color: var(--al-feedback-notice-border); border-radius: var(--al-surface-radius-card); color: var(--al-feedback-ink); box-shadow: none; }
.al-feedback-spinner { display: inline-block; width: 16px; height: 16px; flex-shrink: 0; border: 2px solid var(--al-surface-border-defined); border-top-color: currentColor; border-radius: 50%; animation: al-feedback-spin .9s linear infinite; }
.al-feedback-progress { background: var(--al-feedback-progress-track); border-radius: 4px; overflow: hidden; }
.al-feedback-progress__fill { display: block; height: 100%; background: var(--al-feedback-progress-fill, var(--al-feedback-progress-moss)); box-shadow: var(--al-feedback-progress-edge); transition: width 240ms ease-out; }
.al-feedback-progress--river { --al-feedback-progress-fill: var(--al-feedback-progress-river); }
.al-feedback-progress--satin { --al-feedback-progress-fill: var(--al-feedback-progress-satin); }

/* L1/L2: only mounted by a real request owner. No timer or simulated percentage. */
.al-brand-loader {
  --al-loader-track: #d7e2db; --al-loader-runner: var(--al-surface-border-selected);
  --al-loader-logo: #74857b;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  grid-column: 1 / -1; gap: 12px; padding: 16px; box-sizing: border-box;
  color: var(--al-feedback-muted); font: inherit; text-align: center;
}
.al-brand-loader--dark { --al-loader-track: #547264; --al-loader-runner: #d6ebe1; --al-loader-logo: var(--al-loader-track); color: #d6ebe1; }
.al-brand-loader__orbit { position: relative; width: 160px; height: 160px; max-width: 100%; aspect-ratio: 1; }
.al-brand-loader__ring { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke-width: 2.5; transform: rotate(-90deg); }
.al-brand-loader__track { stroke: var(--al-loader-track); }
.al-brand-loader__runner { stroke: var(--al-loader-runner); stroke-linecap: round; stroke-dasharray: 112 353; transform-origin: 80px 80px; animation: al-feedback-spin 1.8s linear infinite; }
.al-brand-loader__logo { position: absolute; width: 76px; height: 76px; inset: 0; margin: auto; overflow: hidden; color: var(--al-loader-logo); }
.al-brand-loader__sheen { opacity: 0; transform: translateX(-100%); animation: al-feedback-logo-sheen 3.6s ease-in-out infinite; }
.al-brand-loader__label { font-size: 14px; line-height: 1.5; }
@keyframes al-feedback-spin { to { transform: rotate(360deg); } }
@keyframes al-feedback-logo-sheen { 0%,12% { transform: translateX(-100%); opacity: 0; } 28% { opacity: .32; } 60% { transform: translateX(100%); opacity: .32; } 72%,100% { transform: translateX(100%); opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  :root { --al-feedback-progress-transition: none; --al-feedback-spin: none; }
  .al-brand-loader__runner, .al-brand-loader__sheen, .al-feedback-spinner { animation: none; }
  .al-feedback-progress__fill { transition: none; }
}
@media (forced-colors: active) {
  .al-feedback-label, .al-feedback-notice { border-color: CanvasText; background: Canvas; color: CanvasText; }
  .al-brand-loader { --al-loader-track: GrayText; --al-loader-runner: CanvasText; --al-loader-logo: CanvasText; color: CanvasText; }
  .al-brand-loader__sheen { display: none; }
  .al-feedback-spinner { border-color: GrayText; border-top-color: CanvasText; }
  .al-feedback-progress { border: 1px solid CanvasText; }
  .al-feedback-progress__fill { background: Highlight; forced-color-adjust: none; box-shadow: none; }
}
