:root{--plum:#3B1734;--plum2:#864076;--gold:#EBAE3F;--gold2:#FFCF6B;--slate:#546177;--bg:#FBF6EE}
*{box-sizing:border-box}body{margin:0;font-family:'Nunito Sans',sans-serif;background:var(--bg);color:#222;padding-bottom:90px}
h1,h2,h3,button,.big{font-family:Poppins,sans-serif}
header{background:var(--plum);color:#fff;padding:18px 16px 14px;text-align:center}header h1{margin:0;font-size:1.7rem}header h1 span{color:var(--gold2)}header p{margin:4px 0 0;color:var(--gold2);font-size:.9rem}
main{max-width:560px;margin:auto;padding:14px}
.card{background:#fff;border-radius:14px;padding:16px;margin:0 0 14px;box-shadow:0 2px 8px #3b173420;border-top:4px solid var(--gold)}
.card h2{margin:0 0 8px;color:var(--plum);font-size:1.2rem}
button,.btn{background:var(--plum);color:#fff;border:0;border-radius:10px;padding:11px 16px;font-size:1rem;cursor:pointer;text-decoration:none;display:inline-block;margin:4px 4px 0 0}
.btn.gold,button.gold{background:var(--gold);color:var(--plum)}
input{width:100%;padding:10px;border:1px solid #ccc;border-radius:8px;font-size:1rem;margin:4px 0 10px}
label{font-weight:700;color:var(--slate);font-size:.9rem}
.big{font-size:2rem;color:var(--plum2);font-weight:700}
.bar{background:#eee;border-radius:9px;height:16px;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--plum2))}
.day{display:flex;gap:10px;align-items:flex-start;padding:9px 0;border-bottom:1px solid #eee}.day input{width:22px;height:22px;margin:2px 0 0;accent-color:var(--plum2)}
.day b{color:var(--plum2)}.done span{opacity:.55;text-decoration:line-through}
.note{font-size:.8rem;color:var(--slate)}
.vid{background:var(--plum);color:var(--gold2);border-radius:10px;height:120px;display:flex;align-items:center;justify-content:center;margin-bottom:8px}
.opt{display:block;width:100%;text-align:left;background:#f3eaf1;color:var(--plum);margin:6px 0}.opt.right{background:#d8f0d2}.opt.wrong{background:#f6d2d2}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.tile{background:var(--plum);color:#fff;border-radius:14px;padding:16px;text-align:left}.tile b{color:var(--gold2);display:block;font-size:1.05rem}
nav{position:sticky;top:0;z-index:5;box-shadow:0 2px 6px #0003;background:var(--plum);display:flex;justify-content:space-around;padding:6px 0}
nav button{background:none;margin:0;padding:6px 4px;font-size:.7rem;color:#ddd}nav button.on{color:var(--gold2)}
footer{text-align:center;font-size:.75rem;color:var(--slate);padding:10px}
.vthumb{position:relative;display:block;border-radius:10px;overflow:hidden;margin-bottom:8px;background:var(--plum);aspect-ratio:9/12}.vthumb img{width:100%;height:100%;object-fit:cover;display:block}.vthumb .play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:64px;height:64px;border-radius:50%;background:#3B1734d9;color:var(--gold2);font-size:28px;display:flex;align-items:center;justify-content:center;border:3px solid var(--gold2)}.vthumb .vlabel{position:absolute;bottom:8px;left:8px;background:#3B1734d9;color:#fff;padding:4px 10px;border-radius:8px;font-size:.85rem}
select{width:100%;padding:10px;border:1px solid #ccc;border-radius:8px;font-size:1rem;margin:4px 0 10px;background:#fff;font-family:inherit}