/* Adi Life design tokens — the ONE colour/type/shape system for every page (student, parent, school, admin, offline).
   Loaded first; every other stylesheet reads these names and never defines its own palette.
   A second art style (e.g. grades 7+) is a skin: it overrides these custom properties under one selector
   (body[data-skin="<name>"], see docs/DESIGN-SYSTEM.fa.md §7-5) and maps art ids in public/adi.js; component CSS and JS
   stay the same. Values here are the current (grades ≤6) game skin. */
:root{
 /* ---- palette ---- */
 --g-indigo:#173b73;--g-indigo-deep:#10284f;--g-navy-ink:#0d2d55;--g-turq:#24b8c3;--g-turq-hi:#5fe1e8;--g-sky:#2e91d0;
 --g-ivory:#fff8eb;--g-content:#fffdf8;--g-paper:#fffaf0;--g-ink:#183958;--g-muted:#52627b;--g-line:#ead9b5;--g-line-soft:#f0e6cf;--g-frame:#e3cd9f;
 --g-gold:#e9b24c;--g-gold-deep:#b9852a;--g-gold-soft:#ffd77a;
 --g-green:#248d43;--g-green-hi:#3bad59;--g-green-edge:#17602f;
 --g-blue:#256bb3;--g-blue-hi:#3d86cf;--g-blue-edge:#16457a;
 --g-purple:#7151b6;--g-purple-edge:#4d3487;--g-maroon:#7d2f3d;--g-maroon-edge:#561f29;
 /* ---- states ---- */
 --g-good:#237b49;--g-good-bg:#e4f3e8;--g-good-line:#9fd6b1;
 --g-bad:#b34251;--g-bad-bg:#fcebed;--g-bad-line:#efb3bb;
 --g-amber:#7a5000;--g-amber-bg:#fff1d6;--g-amber-line:#f0cf8b;
 /* «منتظر تأیید/بررسی» (recorded, waiting for a parent or teacher): amber everywhere, never the green of «انجام‌شده» */
 --g-pending:var(--g-amber);--g-pending-bg:var(--g-amber-bg);--g-pending-edge:var(--g-amber-line);--g-pending-solid:#f2b233;
 --g-badge:#cc2d4a;--g-disabled:#c1c9d3;--g-disabled-ink:#23394d;
 /* ---- roles: what components ask for (the old purple «primary» is the game's blue accent) ---- */
 --g-accent:var(--g-blue);--g-accent-hi:var(--g-blue-hi);--g-accent-edge:var(--g-blue-edge);--g-accent-soft:#eaf2fc;--g-accent-line:#c9d6e8;--g-accent-ink:#1d4f8a;
 --g-surface:var(--g-content);--g-surface-alt:var(--g-ivory);--g-on-dark:#fff;
 --g-focus:#19b7dc;--g-focus-on-dark:#fff;--g-select:var(--g-blue);--g-select-ink:#fff;--g-locked:#4d3487;
 --g-select-fill:linear-gradient(180deg,var(--g-blue-hi),var(--g-blue-edge));
 --g-meter-track:#e6dcc6;--g-meter-fill:linear-gradient(90deg,#2fa05a,#5fd07f);--g-meter-h:12px;
 --g-close-size:44px;
 /* ---- type, shape, depth, layers, motion ---- */
 --g-font:Vazirmatn,Tahoma,sans-serif;
 --g-radius:22px;--g-radius-s:14px;--g-radius-pill:999px;
 --g-shadow-1:0 3px 8px #0003;--g-shadow-2:0 10px 28px #0008;--g-shadow-window:0 30px 80px #000a;
 --z-nav:30;--z-modal:60;--z-fx:70;--z-lightbox:80;--z-toast:90;--z-popover:1000;
 --g-dur:.2s;--g-ease:cubic-bezier(.2,.8,.2,1);
 /* ---- legacy names kept as aliases (old sheets and inline styles still read them) ---- */
 --bg:#f4f8fc;--panel:#fff;--border:#dce5f0;--mint:#b5f2cf;--green:var(--g-good);--red:var(--g-bad);--muted:var(--g-muted);--ink:var(--g-ink);
 --accent:var(--g-accent);--purple:var(--g-accent);
 --adi-nav:var(--g-indigo);--adi-nav-2:var(--g-indigo-deep);--adi-sky:var(--g-sky);--adi-teal:var(--g-turq);--adi-purple:var(--g-purple);--adi-gold:var(--g-gold);
 --adi-cream:var(--g-ivory);--adi-cream-2:#fcefd6;--adi-ink:var(--g-ink);--adi-muted:var(--g-muted);--adi-line:var(--g-line);
 --adi-green:var(--g-green);--adi-green-2:var(--g-green-edge);--adi-success:var(--g-good);--adi-error:var(--g-bad);--adi-amber:var(--g-amber);
 --adi-pending:var(--g-pending);--adi-pending-bg:var(--g-pending-bg);
 --adi-r-panel:var(--g-radius);--adi-r-btn:16px;--adi-nav-w:104px}

/* The learner skin (body.adi-ui): old sheets' panels are ivory with the gold-beige line */
body.adi-ui{--panel:var(--g-ivory);--border:var(--g-line);--mint:#cfefd8}

/* ---- shared base: one screen-reader class (three names in use), one focus ring, motion ---- */
.sr-only,.g-sr,.jd-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
:focus-visible{outline:3px solid var(--g-focus);outline-offset:3px}
@keyframes g-modal-in{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}
@keyframes g-fade-in{from{opacity:0}to{opacity:1}}
/* «کاهش حرکت»: a11y.js sets html.reduce-motion from the account or the system setting */
html.reduce-motion *,html.reduce-motion *::before,html.reduce-motion *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}