/* Aurel 6.0: shared semantic states. Selection is petroleum; correctness is revealed only after grading. */
:root {
 --x60-success: #00633e; --x60-success-bg: #e0f0e6;
 --x60-error: #873d35; --x60-error-bg: #fae9e5;
 --x60-unknown: #765313; --x60-unknown-bg: #fff1d4;
 --x60-neutral: #415d58; --x60-neutral-bg: #e9efec;
 --x60-focus: #006c40;
 --x60-space-section: clamp(24px, 3vw, 40px);
 --x60-space-card: clamp(18px, 2vw, 28px);
 --x60-motion: 160ms cubic-bezier(.2,.8,.2,1);
}
/* Text, symbol and label always accompany status color. */
.x60-state {display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:10px;font-weight:750;line-height:1.4;}
.x60-state--success{color:var(--x60-success);background:var(--x60-success-bg)}
.x60-state--error{color:var(--x60-error);background:var(--x60-error-bg)}
.x60-state--unknown{color:var(--x60-unknown);background:var(--x60-unknown-bg)}
.x60-state--neutral{color:var(--x60-neutral);background:var(--x60-neutral-bg)}
.x60-divider{border:0;border-top:1px solid var(--a-line);margin-block:var(--x60-space-section)}
/* Shared, visible focus does not replace controls' selected states. */
:where(.beta-ui,.student-portal) :is(a,button,input,select,textarea,summary):focus-visible{outline:3px solid var(--x60-focus);outline-offset:4px;}
:where(.beta-ui,.student-portal) :is(button,a,input,select,textarea){scroll-margin-block:96px;}
@media(prefers-reduced-motion:reduce){.x60-state{transition:none;animation:none}}