*{box-sizing:border-box}
:root{--bg:#fff8f1;--card:#fff;--ink:#3a2433;--muted:#7a6170;--coral:#ef6f5e;--coral2:#ffe3dd;--sun:#f6b93b;--sun2:#fff3d1;--teal:#1f8a83;--teal2:#dff4f1;--ok:#15803d;--okbg:#dcfce7;--bad:#b91c1c;--badbg:#fee2e2;--r:18px}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:"Rubik","Assistant","Heebo",Arial,sans-serif;background:var(--bg);color:var(--ink);line-height:1.55;font-size:17px;overflow-x:hidden}
a{color:var(--teal)}
.top{position:sticky;top:0;z-index:20;background:linear-gradient(90deg,#e8584a,#f39c3d);color:#fff;padding:8px 12px;display:flex;align-items:center;gap:8px;box-shadow:0 2px 8px #0003}
.top .brand{font-weight:800;font-size:1.05rem;text-decoration:none;color:#fff;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top .home{background:#ffffff2e;color:#fff;border-radius:999px;padding:6px 12px;font-size:.95rem;text-decoration:none;white-space:nowrap}
main{max-width:920px;margin:0 auto;padding:12px}
.card{background:var(--card);border-radius:var(--r);padding:16px;margin:12px 0;box-shadow:0 2px 10px #3a243314}
h1{font-size:1.55rem;margin:6px 0 8px;line-height:1.25}
h2{font-size:1.22rem;margin:4px 0 8px}
h3{font-size:1.06rem;margin:10px 0 6px}
.lead{color:var(--muted);margin:0 0 8px}
.hero{background:radial-gradient(circle at 85% 10%,#ffd6cc 0,#fff1e0 40%,#fff 80%);border:2px solid #ffc9b8;text-align:center}
.hero .heart{font-size:3.2rem;line-height:1;margin:4px 0}
.hero h1{font-size:1.8rem}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:48px;padding:10px 18px;border-radius:999px;border:2px solid transparent;background:var(--coral);color:#fff;font:inherit;font-weight:700;cursor:pointer;text-decoration:none;text-align:center;line-height:1.25}
.btn.sun{background:var(--sun);color:#3a2433}
.btn.teal{background:var(--teal)}
.btn.ghost{background:#fff;color:var(--coral);border-color:#f6c3b9}
.btn.small{min-height:40px;padding:6px 14px;font-size:.95rem}
.btn:active{transform:scale(.97)}
.btn:focus-visible,.lv:focus-visible,.opt:focus-visible,.mem:focus-visible,.cell:focus-visible,.chip:focus-visible,.tile:focus-visible{outline:3px solid #1f8a83;outline-offset:2px}
.row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.levels{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0;justify-content:center}
.lv{border:2px solid #f0d6cc;background:#fff;border-radius:999px;padding:8px 14px;font:inherit;font-weight:700;min-height:44px;cursor:pointer;color:var(--ink)}
.lv.on{background:var(--sun);border-color:var(--sun)}
.lvbar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0 0 6px}
.lvbar .lv{min-height:38px;padding:4px 11px;font-size:.92rem}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:120px;border-radius:var(--r);background:#fff;border:2px solid #f6e0d8;text-decoration:none;color:var(--ink);font-weight:800;text-align:center;padding:10px;box-shadow:0 2px 8px #3a243310}
.tile .ic{font-size:2.3rem;line-height:1}
.tile small{font-weight:500;color:var(--muted);font-size:.85rem}
.tile.teacher{background:var(--teal2)}
.tile.print{background:var(--sun2)}
/* memory */
.memgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.mem{position:relative;min-height:96px;border-radius:14px;border:0;padding:0;background:transparent;cursor:pointer;font:inherit;perspective:600px}
.mem .in{position:absolute;inset:0;transition:transform .35s;transform-style:preserve-3d}
.mem.up .in,.mem.done .in{transform:rotateY(180deg)}
.mem .f,.mem .b{position:absolute;inset:0;border-radius:14px;display:flex;align-items:center;justify-content:center;text-align:center;padding:6px;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}
.mem .f{background:linear-gradient(135deg,#ef6f5e,#f6b93b);color:#fff;font-size:2rem}
.mem .b{background:#fff;border:2px solid #f0d6cc;transform:rotateY(180deg);font-size:.86rem;font-weight:700;line-height:1.3;color:var(--ink)}
.mem .b.big{font-size:2.2rem}
.mem .b .lbl{display:block;font-size:.9rem}
.mem.done .b{background:var(--okbg);border-color:var(--ok)}
.memgrid.proj .mem{min-height:130px}
.memgrid.proj .mem .b{font-size:1.05rem}
.memgrid.proj .mem .b.big{font-size:3rem}
.teams{display:flex;gap:8px;margin:8px 0}
.team{flex:1;border-radius:14px;padding:8px;text-align:center;background:#f7f1ee;border:3px solid transparent;font-weight:800}
.team.on{border-color:var(--coral);background:var(--coral2)}
.team b{display:block;font-size:1.6rem}
/* bingo */
.bgrid{display:grid;gap:5px;margin:10px 0}
.cell{min-height:84px;border-radius:12px;border:2px solid #f0d6cc;background:#fff;font:inherit;font-size:.76rem;line-height:1.22;padding:4px;cursor:pointer;color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;font-weight:600;overflow-wrap:anywhere}
.cell .e{font-size:1.5rem;line-height:1.1}
.cell.on{background:#ffe08a;border-color:#e0a526;position:relative}
.cell.on::after{content:"💛";position:absolute;top:2px;left:4px;font-size:.9rem}
.cell.free{background:var(--coral2);border-color:var(--coral)}
.cell.win{background:#bff0c9;border-color:var(--ok)}
.bgrid.g3 .cell{min-height:100px;font-size:1.05rem}.bgrid.g3 .cell .e{font-size:2.6rem}
.bgrid.g4 .cell{font-size:.82rem}
.called{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.called span{background:#f7f1ee;border-radius:999px;padding:3px 9px;font-size:.85rem}
.bigcall{font-size:1.5rem;font-weight:800;text-align:center;padding:14px;border-radius:16px;background:var(--sun2);margin:8px 0;min-height:70px}
input[type=number],input[type=text],textarea,select{font:inherit;border:2px solid #ecd6cd;border-radius:12px;padding:9px 11px;background:#fff;color:var(--ink);max-width:100%}
input[type=number]{width:96px}
textarea{width:100%;min-height:76px}
input[type=text]{width:100%}
label.l{display:block;font-weight:700;margin:10px 0 4px}
/* chips / challenges */
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.chip{border:2px solid #f0d6cc;background:#fff;border-radius:999px;padding:6px 12px;font:inherit;font-size:.92rem;cursor:pointer;color:var(--ink);min-height:40px;text-align:right}
.chip.on{background:var(--sun);border-color:var(--sun)}
.cgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.ccard{border:2px solid #f0d6cc;background:#fff;border-radius:16px;padding:10px;text-align:center;cursor:pointer;font:inherit;color:var(--ink);min-height:110px}
.ccard .e{font-size:2rem;display:block}
.ccard b{display:block;font-size:.98rem}
.ccard.on{background:var(--sun2);border-color:var(--sun)}
.mycard{border:3px dashed var(--coral);border-radius:20px;padding:14px;background:#fff;text-align:center}
.mycard .e{font-size:3rem}
.days{display:grid;grid-template-columns:repeat(6,1fr);gap:5px;margin:10px 0}
.day{border:2px solid #f0d6cc;background:#fff;border-radius:12px;min-height:54px;font:inherit;font-weight:800;cursor:pointer;color:var(--ink)}
.day.on{background:var(--okbg);border-color:var(--ok)}
.feel{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}
.feel button{font-size:1.8rem;border:2px solid #f0d6cc;background:#fff;border-radius:14px;min-width:54px;min-height:54px;cursor:pointer}
.feel button.on{background:var(--sun);border-color:var(--sun)}
.spin{animation:sp .12s linear infinite}
@keyframes sp{50%{transform:scale(1.06)}}
/* jar */
.jarwrap{display:flex;gap:14px;align-items:flex-end;justify-content:center;flex-wrap:wrap}
.jar{position:relative;width:150px;height:200px;border:5px solid #c9a99b;border-top-width:12px;border-radius:24px 24px 34px 34px;background:#fffdfb;overflow:hidden}
.jar .fill{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(0deg,#ef6f5e,#f6b93b);transition:height .5s}
.jar .hearts{position:absolute;inset:0;display:flex;flex-wrap:wrap-reverse;align-content:flex-start;justify-content:center;padding:6px;font-size:.95rem;gap:1px}
.jarnum{font-size:2.2rem;font-weight:800;text-align:center}
.dlist{list-style:none;padding:0;margin:8px 0;max-height:320px;overflow:auto}
.dlist li{display:flex;gap:8px;align-items:center;justify-content:space-between;border-bottom:1px solid #f3e6e0;padding:6px 2px;font-size:.95rem}
.dlist li button{border:0;background:#f7f1ee;border-radius:999px;min-width:36px;min-height:36px;cursor:pointer}
/* quiz */
.q{font-weight:800;font-size:1.12rem;margin:4px 0 10px}
.opts{display:grid;gap:8px}
.opt{text-align:right;border:2px solid #ecd6cd;background:#fff;border-radius:16px;padding:12px 14px;font:inherit;font-size:1.02rem;min-height:52px;cursor:pointer;color:var(--ink)}
.opt.ok{background:var(--okbg);border-color:var(--ok)}
.opt.bad{background:var(--badbg);border-color:var(--bad)}
.big .opts{grid-template-columns:1fr 1fr}
.big .opt{font-size:1.4rem;text-align:center;min-height:110px}
.big .q{font-size:1.6rem;text-align:center}
.fb{margin:10px 0 0;padding:10px 12px;border-radius:12px;display:none}
.fb.ok{display:block;background:var(--okbg)}
.fb.bad{display:block;background:var(--badbg)}
.prog{height:10px;background:#f3e6e0;border-radius:99px;overflow:hidden;margin:6px 0 12px}
.prog i{display:block;height:100%;background:linear-gradient(90deg,var(--coral),var(--sun));transition:width .3s}
.score{font-size:1.4rem;font-weight:800;text-align:center}
.wbank{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.wb{background:var(--teal2);border-radius:999px;padding:4px 11px;font-size:1rem}
.nk{font-size:1.12rem}
/* planner */
.step{border-right:5px solid var(--sun);padding:4px 12px 4px 0;margin:12px 0}
.step h3{margin:0 0 4px}
.step small{color:var(--muted);display:block;margin-bottom:4px}
.pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px}
.pick button{min-height:100px;font-size:1rem}
.pick button .e{font-size:2.2rem;display:block}
.tblscroll{overflow-x:auto}
table.plan{width:100%;border-collapse:collapse;font-size:.95rem}
table.plan th,table.plan td{border:1px solid #efdcd4;padding:7px;vertical-align:top;text-align:right}
table.plan th{background:var(--coral2)}
.note{background:var(--sun2);border-radius:12px;padding:10px 12px;font-size:.92rem}
.safe{background:var(--teal2);border-radius:12px;padding:10px 12px}
.printnote{color:var(--muted);font-size:.88rem;margin-top:8px}
.toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);background:#3a2433;color:#fff;padding:10px 18px;border-radius:999px;font-weight:700;z-index:50;display:none;max-width:90vw;text-align:center}
.toast.on{display:block}
.confetti{position:fixed;inset:0;pointer-events:none;z-index:40;overflow:hidden}
.confetti i{position:absolute;top:-30px;font-size:1.6rem;animation:fall 2.2s linear forwards;font-style:normal}
@keyframes fall{to{transform:translateY(110vh) rotate(360deg)}}
footer{text-align:center;color:var(--muted);padding:22px 10px 30px}
footer img{width:64px;height:64px;border-radius:50%;display:block;margin:0 auto 6px}
.hide{display:none!important}
.printonly{display:none}
@media (max-width:420px){.memgrid{gap:6px}.mem{min-height:88px}.mem .b{font-size:.74rem;padding:4px}.cell{min-height:78px;font-size:.68rem}.bgrid{gap:4px}.bgrid.g4 .cell{font-size:.74rem}h1{font-size:1.4rem}.hero h1{font-size:1.55rem}}
@media print{.printonly{display:block}@page{size:A4;margin:15mm}body{background:#fff;font-size:12pt}.top,.noprint,footer .noprint,.lvbar,.toast{display:none!important}main{max-width:none;padding:0}.card{box-shadow:none;border:1px solid #ddd;break-inside:avoid;text-align:right}.mycard{break-inside:avoid}.bgrid .cell{min-height:22mm;border:1.5px solid #555}.cell.on::after{content:""}*{-webkit-print-color-adjust:exact;print-color-adjust:exact}}

.cover{margin:0 0 12px}.cover img{display:block;width:100%;height:auto;border-radius:18px;box-shadow:0 2px 10px #0001}
@media print{.cover{display:none!important}}