/* ============================================================
   ATIGA PROMPTER — style.css
   Palet (disetujui 21 Okt 2026):
   Indigo #4F46E5 · Aksen amber #F59E0B
   Latar terang #F8FAFC · Latar gelap #0F172A
   Tanpa framework, tanpa font eksternal (jalan offline).
   ============================================================ */

:root{
  --indigo:#4F46E5;
  --indigo-gelap:#3730A3;
  --indigo-lembut:#EEF2FF;
  --amber:#F59E0B;
  --amber-lembut:#FFFBEB;
  --latar:#F8FAFC;
  --kartu:#FFFFFF;
  --teks:#0F172A;
  --teks-redup:#475569;
  --garis:#E2E8F0;
  --bahaya:#DC2626;
  --sukses:#059669;
  --bayang:0 10px 30px rgba(15,23,42,.11);
  --jari:16px;
  --font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-mono:ui-monospace,"Cascadia Mono",Consolas,"Courier New",monospace;
}
[data-theme="gelap"]{
  --latar:#0F172A;
  --kartu:#1E293B;
  --teks:#F1F5F9;
  --teks-redup:#94A3B8;
  --garis:#334155;
  --indigo-lembut:#312E81;
  --amber-lembut:#451A03;
  --bayang:0 6px 24px rgba(0,0,0,.35);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--latar);
  color:var(--teks);
  font-family:var(--font);
  font-size:16px;
  line-height:1.55;
  overflow-x:hidden;
}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
a{color:var(--indigo)}
[data-theme="gelap"] a{color:#A5B4FC}
button{font-family:inherit;cursor:pointer}
input,select,textarea{font-family:inherit;font-size:1rem;color:var(--teks)}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px}

/* ---------- Kepala ---------- */
.kepala{
  position:sticky;top:0;z-index:50;
  background:var(--kartu);
  border-bottom:1px solid var(--garis);
}
.kepala-dalam{
  width:100%;max-width:1440px;margin:0 auto;padding:.6rem 1rem;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;
}
.merek{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--teks)}
.merek-logo{
  width:44px;height:44px;border-radius:12px;flex:none;
  background:var(--indigo);color:var(--amber);
  display:grid;place-items:center;font-size:1.5rem;font-weight:800;
}
.merek-teks{display:flex;flex-direction:column;min-width:0}
.merek-teks strong{font-size:1.15rem;line-height:1.2}
.merek-teks small{color:var(--teks-redup);font-size:.8rem;max-width:52ch}
.kepala-aksi{display:flex;gap:.5rem;flex-wrap:wrap}

/* ---------- Pahlawan ---------- */
.pahlawan{
  width:100%;max-width:1440px;margin:0 auto;padding:1.6rem 1rem .4rem;text-align:center;
}
.pahlawan h1{margin:.2rem 0 .4rem;font-size:clamp(1.6rem,4vw,2.4rem);color:var(--indigo)}
[data-theme="gelap"] .pahlawan h1{color:#A5B4FC}
.pahlawan p{margin:0 auto;max-width:65ch;color:var(--teks-redup)}
.trust-badge{
  display:inline-flex;align-items:center;gap:.4rem;margin-top:.85rem!important;
  padding:.35rem .75rem;border:1px solid var(--garis);border-radius:999px;
  background:var(--kartu);font-size:.8rem;color:var(--teks-redup)!important;
}
.langkah{
  list-style:none;display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap;
  padding:0;margin:1rem 0 0;
}
.langkah li{
  background:var(--kartu);border:1px solid var(--garis);border-radius:999px;
  padding:.35rem .9rem .35rem .45rem;display:flex;align-items:center;gap:.5rem;font-size:.92rem;
}
.langkah li span{
  background:var(--amber);color:#1E293B;font-weight:800;
  width:26px;height:26px;border-radius:50%;display:grid;place-items:center;flex:none;
}

/* ---------- Progres aplikasi ---------- */
.progres-aplikasi{
  max-width:920px;margin:1rem auto .3rem;padding:0 1rem;
  display:flex;align-items:center;justify-content:center;gap:.45rem;
}
.progres-item{display:flex;align-items:center;gap:.45rem;color:var(--teks-redup);font-size:.82rem;white-space:nowrap}
.progres-item span:first-child{
  width:28px;height:28px;border:2px solid var(--garis);border-radius:50%;
  display:grid;place-items:center;font-weight:800;background:var(--kartu);color:var(--teks-redup);
}
.progres-item.aktif{color:var(--indigo);font-weight:800}
.progres-item.aktif span:first-child{border-color:var(--indigo);background:var(--indigo);color:#fff}
.progres-item.selesai span:first-child{border-color:var(--sukses);background:var(--sukses);color:#fff}
.progres-garis{height:2px;background:var(--garis);flex:1;max-width:90px}
.progres-garis.selesai{background:var(--sukses)}

/* ---------- Tata letak ---------- */
.tata{
  width:100%;max-width:1280px;margin:0 auto;padding:1rem;
  display:grid;grid-template-columns:1fr;gap:1rem;align-items:start;
}
.kolom-kiri,.kolom-kanan,.kartu,.grup-kolom{min-width:0}
@media (min-width:900px){
  .tata{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
}
@media (min-width:1100px){
  .kartu-preview{position:sticky;top:92px}
}
.kartu{
  background:var(--kartu);border:1px solid var(--garis);border-radius:var(--jari);
  padding:1.1rem;box-shadow:0 1px 3px rgba(15,23,42,.04);margin-bottom:1rem;
}
.kartu-preview{
  border-top:4px solid var(--indigo);
  box-shadow:var(--bayang);
}
.kartu h2{margin:.1rem 0 .8rem;font-size:1.15rem}
.subjudul{margin:1rem 0 .5rem;font-size:1rem;color:var(--teks-redup)}
.petunjuk{color:var(--teks-redup);font-size:.88rem;margin:.35rem 0}
.label-grup{display:block;font-weight:600;font-size:.92rem;margin:.7rem 0 .4rem}
.lencana{
  background:var(--indigo-lembut);color:var(--indigo);border-radius:999px;
  padding:.15rem .7rem;font-size:.8rem;font-weight:700;white-space:nowrap;
}
[data-theme="gelap"] .lencana{color:#C7D2FE}

/* ---------- Pencarian ---------- */
.cari{display:block;margin:.4rem 0 .8rem}
.cari input{
  width:100%;padding:.65rem .8rem;border:1.5px solid var(--garis);
  border-radius:10px;background:var(--latar);
}
.cari input:focus{border-color:var(--indigo);outline:none}

/* ---------- Grid kategori ---------- */
.grid-kategori{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.6rem}
.kartu-kategori{
  text-align:left;background:var(--latar);border:2px solid var(--garis);
  border-radius:12px;padding:.7rem .8rem;transition:border-color .15s,background .15s;
}
.kartu-kategori:hover{border-color:var(--indigo)}
.kartu-kategori.aktif{border-color:var(--indigo);background:var(--indigo-lembut)}
.kartu-kategori .ikon{font-size:1.5rem;display:block}
.kartu-kategori strong{display:block;font-size:.95rem;margin-top:.2rem}
.kartu-kategori small{color:var(--teks-redup);font-size:.78rem;line-height:1.35;display:block}

/* ---------- Daftar template ---------- */
.daftar-template{display:flex;flex-direction:column;gap:.5rem}
.kartu-template{
  text-align:left;background:var(--latar);border:2px solid var(--garis);
  border-radius:12px;padding:.65rem .8rem;display:flex;gap:.7rem;align-items:flex-start;width:100%;
}
.kartu-template:hover{border-color:var(--indigo)}
.kartu-template.aktif{border-color:var(--amber);background:var(--amber-lembut)}
.kartu-template .ikon{font-size:1.35rem}
.kartu-template strong{display:block;font-size:.98rem}
.kartu-template small{color:var(--teks-redup);font-size:.82rem;line-height:1.4;display:block}
.kosong{color:var(--teks-redup);font-style:italic;padding:.5rem 0}

/* ---------- Segmen mode & chip target ---------- */
.segmen{display:inline-flex;border:2px solid var(--garis);border-radius:999px;overflow:hidden}
.segmen-tombol{
  border:0;background:var(--latar);color:var(--teks);
  min-height:44px;padding:.5rem 1.1rem;font-weight:700;font-size:.95rem;
}
.segmen-tombol.aktif{background:var(--indigo);color:#fff}
.chip-baris{display:flex;gap:.45rem;flex-wrap:wrap}
.chip{
  border:2px solid var(--garis);background:var(--latar);color:var(--teks);
  border-radius:999px;padding:.5rem .85rem;min-height:42px;font-weight:600;font-size:.9rem;
}
.chip:hover{border-color:var(--indigo)}
.chip.aktif{background:var(--indigo);border-color:var(--indigo);color:#fff}

/* ---------- Formulir ---------- */
.form-kepala{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}
.form-kepala > *{min-width:0}
.form-kepala h3{margin:.2rem 0 .1rem;font-size:1.05rem}
.status-form{color:var(--teks-redup);font-size:.82rem;white-space:nowrap;padding:.25rem .6rem;border-radius:999px;background:var(--latar)}
.status-form.lengkap{color:var(--sukses);background:#ECFDF5}
[data-theme="gelap"] .status-form.lengkap{background:#064E3B;color:#A7F3D0}
.grup-kolom{
  border:1px dashed var(--garis);border-radius:12px;
  padding:.7rem .9rem .9rem;margin:.9rem 0 0;
}
.grup-kolom legend{font-weight:800;color:var(--indigo);padding:0 .4rem;font-size:.95rem}
[data-theme="gelap"] .grup-kolom legend{color:#A5B4FC}
.detail-lanjutan{margin-top:.9rem;border:1px solid var(--garis);border-radius:12px;background:var(--latar)}
.detail-lanjutan summary{cursor:pointer;padding:.75rem .9rem;font-weight:800;color:var(--indigo);list-style-position:inside}
.detail-lanjutan[open] summary{border-bottom:1px solid var(--garis)}
.detail-lanjutan-isi{padding:0 .9rem .9rem}
.kolom{margin-bottom:.85rem}
.kolom label,.kolom .label-kolom{display:block;font-weight:600;font-size:.93rem;margin-bottom:.3rem}
.kolom .wajib{color:var(--bahaya)}
.kolom .mode-lencana{
  font-size:.7rem;font-weight:700;background:var(--amber-lembut);color:#92400E;
  border-radius:6px;padding:.05rem .4rem;margin-left:.4rem;vertical-align:middle;
}
[data-theme="gelap"] .kolom .mode-lencana{color:var(--amber)}
.kolom input[type="text"],.kolom input[type="number"],.kolom select,.kolom textarea{
  width:100%;padding:.6rem .75rem;border:1.5px solid var(--garis);
  border-radius:10px;background:var(--latar);
}
.kolom textarea{resize:vertical;min-height:74px}
.kolom input:focus,.kolom select:focus,.kolom textarea:focus{border-color:var(--indigo);outline:none}
.kolom.kurang input,.kolom.kurang select,.kolom.kurang textarea{border-color:var(--bahaya)}
.kolom .contoh{font-size:.8rem;color:var(--teks-redup);margin-top:.25rem}
.pesan-error{color:var(--bahaya);font-size:.82rem;font-weight:600;margin:.3rem 0 0}
.kotak-centang{display:flex;flex-direction:column;gap:.35rem}
.kotak-centang label{font-weight:400;display:flex;gap:.55rem;align-items:flex-start;margin:0;cursor:pointer}
.kotak-centang input{width:20px;height:20px;flex:none;margin-top:.1rem;accent-color:var(--indigo)}

/* ---------- Tombol ---------- */
.baris-tombol{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.8rem;align-items:center}
.baris-tombol > *{min-width:0}
.tombol{
  min-height:44px;border-radius:10px;padding:.6rem 1rem;font-weight:700;font-size:.95rem;
  border:2px solid transparent;text-decoration:none;display:inline-flex;align-items:center;gap:.4rem;
  transition:background-color .15s,border-color .15s,color .15s,transform .15s,box-shadow .15s;
}
button:active,.tombol:active{transform:translateY(1px)}
button:disabled,.tombol[aria-disabled="true"]{cursor:not-allowed;opacity:.55}
.tombol-utama{background:var(--indigo);color:#fff}
.tombol-utama:hover{background:var(--indigo-gelap)}
.tombol-aksen{background:var(--amber);color:#1E293B}
.tombol-aksen:hover{filter:brightness(1.07)}
.tombol-sekunder{background:var(--indigo-lembut);color:var(--indigo);border-color:var(--indigo)}
[data-theme="gelap"] .tombol-sekunder{color:#C7D2FE}
.tombol-hantu{background:transparent;color:var(--teks);border-color:var(--garis)}
.tombol-hantu:hover{border-color:var(--indigo)}
.tombol.kecil{padding:.35rem .7rem;font-size:.85rem;border-radius:8px}
label.tombol.berkas{cursor:pointer}

/* ---------- Preview ---------- */
.preview-kepala{display:flex;justify-content:space-between;align-items:center;gap:.6rem;flex-wrap:wrap}
.preview-kepala > *{min-width:0}
.preview-meta{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.target-preview{
  font-size:.78rem;font-weight:800;color:var(--indigo);
  background:var(--indigo-lembut);border:1px solid color-mix(in srgb,var(--indigo) 25%,transparent);
  border-radius:999px;padding:.15rem .55rem;white-space:nowrap;
}
[data-theme="gelap"] .target-preview{color:#C7D2FE}
.status-preview{font-size:.78rem;font-weight:800;color:var(--sukses);background:#ECFDF5;border-radius:999px;padding:.15rem .55rem}
[data-theme="gelap"] .status-preview{background:#064E3B;color:#A7F3D0}
.tab-preview{display:flex;gap:.25rem;border-bottom:1px solid var(--garis);margin:.65rem 0 .8rem}
.tab-preview-tombol{border:0;background:transparent;color:var(--teks-redup);padding:.55rem .8rem;font-weight:800;border-bottom:3px solid transparent;cursor:pointer}
.tab-preview-tombol.aktif{color:var(--indigo);border-bottom-color:var(--indigo)}
.preview-aksi-utama{margin-top:1rem}
.preview-aksi-utama .tombol-utama{box-shadow:0 4px 12px rgba(79,70,229,.22)}
.preview-bawah{display:flex;align-items:center;justify-content:space-between;gap:.7rem;flex-wrap:wrap}
.preview-bawah > *{min-width:0}
#areaPreview{
  width:100%;border:1.5px solid var(--garis);border-radius:10px;background:var(--latar);
  padding:.8rem;font-family:var(--font-mono);font-size:.86rem;line-height:1.5;resize:vertical;
}
#areaPreview:focus{border-color:var(--indigo);outline:none}
.struktur-preview{min-height:345px;max-height:510px;overflow:auto;border:1.5px solid var(--garis);border-radius:10px;background:var(--latar);padding:.8rem}
.struktur-blok{padding:.7rem 0;border-bottom:1px solid var(--garis)}
.struktur-blok:first-child{padding-top:0}
.struktur-blok:last-child{border-bottom:0}
.struktur-blok h3{margin:0 0 .35rem;font-size:.86rem;color:var(--indigo);text-transform:uppercase;letter-spacing:.04em}
.struktur-blok p{margin:0;white-space:pre-wrap;font-family:var(--font-mono);font-size:.82rem;line-height:1.5}
.status{min-height:1.3em;font-size:.9rem;color:var(--sukses);font-weight:600}
.status-kualitas{
  margin-top:.55rem;padding:.6rem .75rem;border-radius:10px;
  font-size:.84rem;line-height:1.45;background:var(--amber-lembut);color:#92400E;
}
.status-kualitas.ada-error{background:#FEF2F2;color:var(--bahaya)}
[data-theme="gelap"] .status-kualitas{background:#451A03;color:#FCD34D}
[data-theme="gelap"] .status-kualitas.ada-error{background:#450A0A;color:#FCA5A5}
.menu-kirim{position:relative}
.pilih-kirim{
  appearance:none;min-width:185px;padding-right:2.2rem!important;
  background-color:var(--amber);
  background-image:linear-gradient(45deg,transparent 50%,#1E293B 50%),linear-gradient(135deg,#1E293B 50%,transparent 50%);
  background-position:calc(100% - 17px) 50%,calc(100% - 12px) 50%;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;color:#1E293B;
}
.pilih-kirim option{background:var(--kartu);color:var(--teks)}
.menu-ekspor{position:relative}
.menu-ekspor summary{list-style:none;cursor:pointer}
.menu-ekspor summary::-webkit-details-marker{display:none}
.menu-ekspor[open] .menu-ekspor-isi{position:absolute;right:0;top:calc(100% + 6px);z-index:60;display:flex;gap:.35rem;padding:.45rem;background:var(--kartu);border:1px solid var(--garis);border-radius:12px;box-shadow:var(--bayang)}

/* ---------- Pustaka ---------- */
.pustaka-kontrol{display:flex;align-items:center;gap:.5rem}
.pustaka-kontrol > *{min-width:0}
.pustaka-kontrol .cari{flex:1}
.pilih-urutkan select{min-height:44px;padding:.6rem .7rem;border:1.5px solid var(--garis);border-radius:10px;background:var(--latar);color:var(--teks)}
.daftar-pustaka{display:flex;flex-direction:column;gap:.6rem;margin-top:.4rem}
.daftar-pustaka .kosong{
  margin:.6rem 0 0;padding:1.4rem 1rem;text-align:center;font-style:normal;
  border:1px dashed var(--garis);border-radius:12px;background:var(--latar);
}
.empty-pustaka{display:flex;flex-direction:column;align-items:center;gap:.2rem}
.empty-pustaka .ikon{font-size:2rem;margin-bottom:.2rem}
.empty-pustaka strong{font-size:1rem;color:var(--teks)}
.empty-pustaka p{margin:.2rem 0 0;color:var(--teks-redup);font-size:.86rem}
.item-pustaka{
  border:1.5px solid var(--garis);border-radius:12px;padding:.7rem .8rem;background:var(--latar);
  min-width:0;
}
.item-pustaka .atas{display:flex;justify-content:space-between;gap:.5rem;align-items:flex-start}
.item-pustaka strong{font-size:.97rem}
.item-pustaka strong,.item-pustaka .meta,.item-pustaka .cuplikan{overflow-wrap:anywhere}
.item-pustaka .meta{font-size:.78rem;color:var(--teks-redup)}
.item-pustaka .cuplikan{
  font-size:.82rem;color:var(--teks-redup);margin:.35rem 0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.item-pustaka .aksi{display:flex;gap:.35rem;flex-wrap:wrap}
.bintang{color:var(--amber)}

/* ---------- Pemberitahuan ---------- */
.pemberitahuan{
  position:fixed;left:50%;bottom:22px;transform:translateX(-50%) translateY(20px);
  background:var(--teks);color:var(--latar);padding:.7rem 1.1rem;border-radius:12px;
  font-weight:600;font-size:.93rem;opacity:0;pointer-events:none;transition:.25s;z-index:99;
  max-width:92vw;text-align:center;box-shadow:var(--bayang);
}
.pemberitahuan.tampil{opacity:1;transform:translateX(-50%) translateY(0)}

.baris-aksi-mobile{display:none}

/* ---------- Kaki ---------- */
.kaki{
  width:100%;max-width:1440px;margin:0 auto;padding:1.4rem 1rem 2.2rem;text-align:center;color:var(--teks-redup);
}
.kaki p{margin:.3rem 0}
.kaki-kecil{font-size:.82rem}

/* ---------- Layar sangat lebar (IFP/TV) ---------- */
@media (min-width:1800px){
  body{font-size:19px}
  .tata,.kepala-dalam,.pahlawan,.kaki{max-width:1440px}
  .tombol,.segmen-tombol,.chip{padding:.8rem 1.3rem}
  .kotak-centang input{width:24px;height:24px}
}

/* ---------- Tablet ---------- */
@media (min-width:768px) and (max-width:1099px){
  .kepala-dalam,.pahlawan,.tata,.kaki{padding-left:1.25rem;padding-right:1.25rem}
  .tata{gap:1.25rem}
  .kartu{padding:1.2rem}
  .grid-kategori{grid-template-columns:repeat(auto-fill,minmax(145px,1fr))}
  .progres-aplikasi{max-width:760px}
  .struktur-preview{max-height:460px}
}

/* ---------- HP ---------- */
@media (max-width:767px){
  .merek-teks small{display:none}
  .kepala-dalam{padding:.5rem .7rem;flex-wrap:nowrap}
  .merek{min-width:0}
  .merek-teks strong{font-size:1rem}
  .kepala-aksi{width:auto;gap:.35rem;flex-wrap:nowrap}
  .kepala-aksi .tombol{justify-content:center;min-width:0;white-space:nowrap;padding-left:.55rem;padding-right:.55rem;font-size:.78rem}
  .pahlawan{padding:.95rem .7rem .25rem}
  .pahlawan h1{font-size:clamp(1.45rem,7vw,1.85rem)}
  .pahlawan p{font-size:.92rem}
  .trust-badge{font-size:.74rem}
  .tata{padding:.7rem;gap:.7rem}
  .kartu{padding:.9rem}
  .grid-kategori{grid-template-columns:repeat(auto-fit,minmax(min(128px,100%),1fr))}
  .grid-kategori,.daftar-template{gap:.45rem}
  .kartu-kategori{padding:.6rem .65rem}
  .kartu-template{padding:.6rem .65rem;gap:.55rem}
  .form-kepala{display:block}
  .status-form{display:inline-block;margin-top:.35rem;white-space:normal}
  .segmen{display:flex;width:100%}
  .segmen-tombol{flex:1;padding-left:.65rem;padding-right:.65rem}
  #areaPreview{font-size:.8rem}
  .progres-aplikasi{justify-content:center;overflow:visible;padding:.1rem .7rem .3rem}
  .progres-item strong{display:none}
  .progres-garis{min-width:24px}
  .chip-baris{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));padding-bottom:0}
  .chip{width:100%;text-align:center;padding-left:.45rem;padding-right:.45rem}
  .preview-bawah{display:block}
  .pustaka-kontrol{align-items:stretch;flex-direction:column}
  .pustaka-kontrol .cari{margin-bottom:0}
  .pilih-urutkan select{width:100%}
  .baris-tombol{flex-direction:column;align-items:stretch}
  .baris-tombol .tombol{flex:1;justify-content:center;width:100%}
  .baris-tombol > .menu-kirim,.baris-tombol > .menu-ekspor{flex:1;width:100%;min-width:0}
  .baris-tombol > .menu-kirim .tombol,.baris-tombol > .menu-ekspor .tombol{width:100%;justify-content:center}
  .pilih-kirim{min-width:0;width:100%}
  .menu-ekspor[open] .menu-ekspor-isi{right:0;max-width:calc(100vw - 2.2rem)}
  .item-pustaka .aksi .tombol{flex:1;min-width:calc(50% - .35rem);justify-content:center}
  .kaki{padding-left:.7rem;padding-right:.7rem}
  .baris-aksi-mobile{
    position:fixed;display:flex;left:0;right:0;bottom:0;z-index:80;gap:.5rem;
    padding:.55rem .7rem calc(.55rem + env(safe-area-inset-bottom));
    background:color-mix(in srgb,var(--kartu) 94%,transparent);border-top:1px solid var(--garis);box-shadow:0 -5px 20px rgba(15,23,42,.12)
  }
  .baris-aksi-mobile .tombol{flex:1;justify-content:center}
  body{padding-bottom:76px}
  .pemberitahuan{bottom:calc(76px + env(safe-area-inset-bottom) + 12px)}
}

@media (min-width:1100px){
  .daftar-template{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}
}