/* Token desain WorkflowArtikel — satu sumber untuk warna, tipe, spasi, radius, bahan, dan gerak.
   Dimuat sebelum stylesheet lain. Mode gelap mengikuti sistem; tidak ada pengaturan manual. */
:root{
    color-scheme:light dark;

    /* latar */
    --bg:#ffffff;            /* kanvas konten */
    --bg-side:#f5f5f7;       /* sidebar, header tabel */
    --bg-group:#f5f5f7;      /* bagian terkelompok: form, gerbang, catatan */
    --bg-field:#ffffff;      /* field dan baris di dalam kelompok */
    --bg-elevated:#ffffff;   /* popover, dialog, lembar */

    /* teks */
    --label:#1d1d1f;
    --label-2:#6e6e73;       /* 4,98:1 di putih, 4,7:1 di #f5f5f7 */
    --label-3:#8e8e93;       /* ikon dan dekorasi saja, bukan teks inti */

    /* garis dan isian */
    --sep:rgba(60,60,67,.16);
    --sep-strong:rgba(60,60,67,.29);
    --stroke-control:#8e8e93;   /* batas field 3,3:1 (WCAG 1.4.11) */
    --fill:rgba(120,120,128,.12);
    --fill-2:rgba(120,120,128,.20);
    --switch-off:#8e8e93;

    /* tint dan semantik */
    --tint:#1f7a5a;          /* isian tombol: teks putih 5,3:1 */
    --tint-press:#17654a;
    --tint-text:#1f7a5a;     /* teks dan tautan */
    --tint-wash:rgba(31,122,90,.10);
    --on-tint:#ffffff;
    --amber:#b25000;  --amber-wash:rgba(255,149,0,.14);
    --red:#d70015;    --red-wash:rgba(255,59,48,.10);
    --blue:#0066cc;   --blue-wash:rgba(0,122,255,.10);
    --green:#248a3d;

    /* bahan dan elevasi */
    --mat-bar:rgba(255,255,255,.78);
    --scrim:rgba(0,0,0,.28);
    --elev-pop:0 12px 32px rgba(0,0,0,.14),0 2px 6px rgba(0,0,0,.07);
    --elev-sheet:0 -6px 32px rgba(0,0,0,.16);
    --focus:#1f7a5a;

    /* tipografi: huruf sistem, delapan langkah dalam rem */
    --font:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI Variable Text","Segoe UI",system-ui,"Helvetica Neue",Arial,sans-serif;
    --font-display:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI Variable Display","Segoe UI",system-ui,"Helvetica Neue",Arial,sans-serif;
    --font-mono:ui-monospace,"SF Mono","Cascadia Mono",Consolas,monospace;
    --fs-caption:.75rem;     /* 12 */
    --fs-footnote:.8125rem;  /* 13 */
    --fs-callout:.9375rem;   /* 15 — UI padat */
    --fs-body:1rem;          /* 16 desktop, 17 di layar sentuh */
    --fs-headline:1.0625rem; /* 17 */
    --fs-title3:1.25rem;     /* 20 */
    --fs-title2:1.375rem;    /* 22 */
    --fs-title1:1.75rem;     /* 28 */
    --fs-large:2.125rem;     /* 34 */

    /* spasi: kisi 4 */
    --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-8:32px;--sp-10:40px;--sp-12:48px;--sp-16:64px;

    /* radius */
    --r-xs:6px;--r-sm:8px;--r-md:10px;--r-lg:14px;--r-xl:20px;--r-pill:999px;

    /* gerak */
    --dur-press:100ms;--dur-fast:160ms;--dur-base:240ms;--dur-slow:360ms;
    --ease:cubic-bezier(.2,0,0,1);
    --spring:linear(0,.042 5%,.137 10%,.253 15%,.37 20%,.577 30%,.729 40%,.832 50%,.899 60%,.94 70%,.965 80%,.98 90%,1);

    /* tinggi kontrol */
    --control:36px;
    --toolbar:52px;
}
@media (pointer:coarse){:root{--fs-body:1.0625rem;--control:44px}}
@media (prefers-color-scheme:dark){:root{
    --bg:#000000;--bg-side:#1c1c1e;--bg-group:#1c1c1e;--bg-field:#2c2c2e;--bg-elevated:#2c2c2e;
    --label:#f5f5f7;--label-2:#aeaeb2;--label-3:#6e6e73;
    --sep:rgba(84,84,88,.48);--sep-strong:rgba(84,84,88,.75);--stroke-control:#8e8e93;
    --fill:rgba(120,120,128,.24);--fill-2:rgba(120,120,128,.36);--switch-off:#76767b;
    --tint:#1f7a5a;--tint-press:#17654a;--tint-text:#3dbe8b;--tint-wash:rgba(61,190,139,.16);
    --amber:#ffb340;--amber-wash:rgba(255,179,64,.16);--red:#ff6961;--red-wash:rgba(255,105,97,.16);
    --blue:#409cff;--blue-wash:rgba(64,156,255,.16);--green:#30d158;
    --mat-bar:rgba(22,22,24,.78);--scrim:rgba(0,0,0,.5);
    --elev-pop:0 12px 32px rgba(0,0,0,.5),0 2px 6px rgba(0,0,0,.3);--elev-sheet:0 -6px 32px rgba(0,0,0,.5);
    --focus:#3dbe8b;
}}
@media (prefers-contrast:more){:root{--sep:var(--sep-strong);--label-2:var(--label);--stroke-control:var(--label)}}
@media (prefers-reduced-transparency:reduce){:root{--mat-bar:var(--bg)}}