/* Jejak Seni Sarah — gaya asas dikongsi oleh menu (index.html) dan pemain episod (episod.html) */

/* Fon (Google Fonts, lesen OFL — lihat ../fonts/*-OFL.txt), disimpan setempat supaya berfungsi tanpa internet.
   Pelayar hanya memuat turun fon yang benar-benar digunakan pada halaman. */
@font-face{
 font-family:"Sour Gummy";
 font-style:normal;
 font-weight:100 900;
 font-display:swap;
 src:url("../fonts/SourGummy-latin.woff2") format("woff2");
}
@font-face{
 font-family:"Quicksand";
 font-style:normal;
 font-weight:300 700;
 font-display:swap;
 src:url("../fonts/Quicksand-latin.woff2") format("woff2");
}
@font-face{
 font-family:"Andika";
 font-style:normal;
 font-weight:400;
 font-display:swap;
 src:url("../fonts/Andika-Regular-latin.woff2") format("woff2");
}
@font-face{
 font-family:"Andika";
 font-style:normal;
 font-weight:700;
 font-display:swap;
 src:url("../fonts/Andika-Bold-latin.woff2") format("woff2");
}

/* Warna tema (dari butang MULA, butang home, kertas menu dan logo) */
:root{
 --blue:#188CF0;       /* biru butang ▶ menu dan garis teks */
 --sky:#0A8BE0;        /* biru MULA, sedikit gelap supaya ikon putih cukup kontras */
 --sky-soft:#B5D4F4;
 --sun:#FFC21A;        /* kuning syiling butang home */
 --ink:#1E2A5A;        /* biru gelap logo */
 --paper:#FFF8EC;      /* kertas krim menu */
 --track:#EADFC8;

 /* Peranan fon — gunakan peranan, bukan nama fon, supaya fon boleh ditukar di satu tempat:
    tajuk    : perkataan pendek yang besar dan ceria (tajuk episod, MULA, "Tahniah!")
    subtajuk : label dan butang (Senarai Episod, Ulang Semula, Menu Utama, masa video)
    badan    : ayat yang dibaca murid (mesej, arahan). Andika direka khas untuk kanak-kanak belajar membaca */
 --font-title:"Sour Gummy","Arial Rounded MT Bold",Arial,Helvetica,sans-serif;
 --font-subtitle:"Quicksand","Arial Rounded MT Bold",Arial,Helvetica,sans-serif;
 --font-body:"Andika",Verdana,"Segoe UI",Arial,sans-serif;
}

html,body{margin:0;height:100%}
body{
 font-family:var(--font-body);
 -webkit-tap-highlight-color:transparent;
 -webkit-text-size-adjust:100%;
 text-size-adjust:100%;
}
img,svg{display:block}
img{-webkit-touch-callout:none;-webkit-user-drag:none}
button{font-family:inherit}