@font-face{font-family:Heebo;src:url(Heebo-400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Heebo;src:url(Heebo-700.woff2) format('woff2');font-weight:700 900;font-display:swap}
@font-face{font-family:Secular;src:url(Secular.woff2) format('woff2');font-display:swap}
:root{--ink:#241f3d;--muted:#5d5675;--bg:#fff8fc;--pri:#5b4fc4;--pink:#e8457c;--teal:#1f8a7f;--fs:1}
*{box-sizing:border-box}html{font-size:calc(17px * var(--fs))}
body{margin:0;font-family:Heebo,Arial,sans-serif;color:var(--ink);background:radial-gradient(circle at 10% 0,#ffe3f0 0,transparent 40%),radial-gradient(circle at 90% 10%,#e0f2ff 0,transparent 40%),var(--bg);line-height:1.65;overflow-x:hidden}
a{color:#4a3db3}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #f08a24;outline-offset:2px;border-radius:6px}
.skip{position:absolute;right:-9999px;top:0;background:#241f3d;color:#fff;padding:.5rem 1rem;z-index:9}.skip:focus{right:0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.top{background:linear-gradient(90deg,#5b4fc4,#e8457c 60%,#f08a24);color:#fff;position:sticky;top:0;z-index:5;box-shadow:0 3px 12px #0002}
.bar{display:flex;justify-content:space-between;align-items:center;padding:.45rem 1rem;max-width:1150px;margin:auto}
.brand{color:#fff;font-family:Secular,Heebo;font-size:1.25rem;text-decoration:none}
.tools button{background:#fff3;color:#fff;border:1px solid #fff8;border-radius:10px;padding:.3rem .65rem;font:inherit;font-weight:700;cursor:pointer;min-width:44px;min-height:40px;margin-inline-start:.25rem}
.mainnav{display:flex;gap:.25rem;overflow-x:auto;padding:0 1rem .45rem;max-width:1150px;margin:auto;scrollbar-width:thin}
.mainnav a{color:#fff;text-decoration:none;white-space:nowrap;padding:.3rem .65rem;border-radius:999px;background:#ffffff22;font-size:.9rem}
.mainnav a[aria-current]{background:#fff;color:#5b4fc4;font-weight:700}
main{max-width:1150px;margin:auto;padding:1rem}
.crumbs{font-size:.9rem;color:var(--muted);margin-bottom:.6rem}
h1{font-family:Secular,Heebo;font-weight:400;line-height:1.25;color:#3a2f99;margin:.3rem 0 .6rem;font-size:1.9rem}
h2{color:#b8336d;margin:1.6rem 0 .6rem;font-size:1.35rem}h3{color:#1f7a72}
.lead{font-size:1.08rem;color:var(--muted)}
.hero{display:flex;gap:1rem;align-items:center;background:#fff;border-radius:26px;padding:1.4rem;box-shadow:0 10px 30px #5b4fc41f;border:3px solid #f7d3e4}
.hero-emo{font-size:3.6rem;white-space:nowrap}.kicker{color:#e8457c;font-weight:800;margin:0}
.chooser{margin-top:1.2rem}.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}
.tile{background:#fff;border:3px solid var(--c);border-radius:22px;padding:1rem;font:inherit;color:var(--ink);cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:.2rem;min-height:130px;box-shadow:0 6px 0 var(--c);transition:transform .15s}
.tile span{font-size:2.2rem}.tile b{font-size:1.15rem;color:var(--c)}.tile small{color:var(--muted);text-align:center}
.tile:hover{transform:translateY(-3px)}.tile[aria-pressed=true]{background:var(--c);color:#fff}.tile[aria-pressed=true] b,.tile[aria-pressed=true] small{color:#fff}
.chosen{font-weight:700;color:#1f7a72}
.filters{display:flex;flex-direction:column;gap:.5rem;background:#fff;padding:.8rem;border-radius:18px;border:2px dashed #d9cdf5}
.filters input{font:inherit;padding:.55rem .8rem;border-radius:12px;border:2px solid #c9bedd;width:100%}
.fgroup{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center}
.f{font:inherit;font-size:.9rem;border:2px solid #c9bedd;background:#fff;border-radius:999px;padding:.25rem .75rem;cursor:pointer;min-height:38px}
.f.on{background:#5b4fc4;color:#fff;border-color:#5b4fc4}
.cards{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:.9rem}
.card a{display:flex;flex-direction:column;gap:.35rem;height:100%;background:#fff;border-radius:20px;padding:1rem;text-decoration:none;color:var(--ink);border-top:8px solid var(--tc);box-shadow:0 6px 18px #0000000f;position:relative;transition:transform .15s}
.card a:hover{transform:translateY(-4px) rotate(-.4deg)}.cemo{font-size:2.3rem}.cnum{position:absolute;left:.8rem;top:.6rem;background:var(--tc);color:#fff;border-radius:999px;min-width:2rem;text-align:center;font-weight:800}
.ctitle{font-weight:800;font-size:1.05rem}.cchips{display:flex;flex-wrap:wrap;gap:.25rem;margin-top:auto}
.chip{display:inline-block;background:color-mix(in srgb,var(--c) 14%,#fff);color:var(--c);border:1.5px solid var(--c);border-radius:999px;padding:0 .55rem;font-size:.8rem;font-weight:700}
.quick{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin-top:1.5rem}
.qbox{background:#fff;border-radius:18px;padding:1rem;text-align:center;text-decoration:none;font-weight:800;color:#3a2f99;border:2px solid #e3dbf7}
.thead{display:flex;gap:.9rem;align-items:center;background:#fff;border-radius:22px;padding:1rem;border-inline-start:10px solid var(--tc)}
.big-emoji{font-size:3.2rem}.meta2{color:var(--muted);margin:0}
.tracks{display:flex;gap:.5rem;margin:1rem 0;flex-wrap:wrap}
.trk{font:inherit;font-weight:700;border:3px solid #c9bedd;background:#fff;border-radius:16px;padding:.5rem 1rem;cursor:pointer;min-height:44px}
.trk[aria-selected=true]{background:#5b4fc4;border-color:#5b4fc4;color:#fff}
.intro{background:#fff6d9;border-radius:16px;padding:.8rem 1rem;border:2px solid #f3d27a}
.readbar{display:flex;gap:.5rem;margin:.6rem 0}.readbar button{font:inherit;font-weight:700;border:0;border-radius:14px;padding:.55rem 1rem;background:#1f8a7f;color:#fff;cursor:pointer;min-height:44px}.readbar .stop{background:#5d5675}
.textcard{background:#fff;border-radius:20px;padding:1.1rem 1.2rem;box-shadow:0 6px 20px #00000010;border:2px solid #f7d3e4}
.subh{margin:.8rem 0 .2rem;color:#1f7a72;font-size:1.08rem}
.para{display:flex;gap:.6rem;margin:.45rem 0}.pn{flex:0 0 auto;background:#7a5bd6;color:#fff;border-radius:999px;width:1.9rem;height:1.9rem;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:.9rem;margin-top:.15rem}
.big .textcard,.big .oq,.big .mc{font-size:1.2rem;line-height:1.85}
.gw{font:inherit;background:#fff2b3;border:0;border-bottom:2px dotted #a8650a;padding:0 .1rem;cursor:help;color:inherit;border-radius:4px}
.pop{position:absolute;z-index:20;background:#241f3d;color:#fff;padding:.5rem .75rem;border-radius:12px;max-width:260px;font-size:.95rem;box-shadow:0 8px 20px #0004}
.gloss{background:#f2fbfa;border:2px solid #8fd6cf;border-radius:16px;padding:.6rem 1rem;margin:.8rem 0}.gloss summary{font-weight:800;cursor:pointer;color:#1f7a72}
.gloss dl{display:grid;grid-template-columns:max-content 1fr;gap:.2rem .8rem;margin:.5rem 0}.gloss dt{font-weight:800}.gloss dd{margin:0}
.note{background:#fff0f5;border-radius:14px;padding:.6rem 1rem;border:2px solid #f7a8c4}
.lvl{font-size:.8rem;background:#e8457c;color:#fff;border-radius:999px;padding:.1rem .6rem;vertical-align:middle}
.mc,.oq{background:#fff;border-radius:18px;padding:.8rem 1rem;margin:.7rem 0;border:2px solid #e3dbf7}
.mc .q{margin:.1rem 0 .5rem}.opts{display:grid;gap:.4rem}
.opt{font:inherit;text-align:right;background:#f7f3ff;border:2px solid #c9bedd;border-radius:14px;padding:.55rem .8rem;cursor:pointer;min-height:44px;color:var(--ink)}
.opt.ok{background:#d8f5e3;border-color:#0f9b4a}.opt.no{background:#ffe1e1;border-color:#d33}
.fb{font-weight:700;margin:.4rem 0 0}.fb.good{color:#0b7a3a}.fb.bad{color:#b42318}
.oq label{display:block}.meta{color:#7a5bd6;font-size:.88rem;font-weight:700}
.oq textarea{width:100%;font:inherit;border:2px solid #c9bedd;border-radius:12px;padding:.5rem;margin-top:.4rem;background:#fffefb}
.saved{font-size:.85rem;color:#0b7a3a}.rem{background:#fff6d9;border-radius:10px;padding:.3rem .6rem;font-size:.92rem;margin:.4rem 0}
.starters span{background:#eef6ff;border-radius:8px;padding:0 .35rem}
.bank{background:#fffaf0;border:2px solid #e5a224;border-radius:16px;padding:.6rem 1rem;margin:.8rem 0;display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}.bank span{background:#fff;border:2px solid #e5a224;border-radius:10px;padding:.1rem .6rem;font-weight:700}
.conn{background:#f5f0ff;border:2px solid #b9a7f0;border-radius:16px;padding:.6rem 1rem;display:grid;gap:.25rem}.cg{font-weight:800;color:#5b3fc0}
.tip{color:#1f7a72;font-weight:700}
.printblock{background:linear-gradient(135deg,#fff,#f2fbfa);border:3px dashed #1f8a7f;border-radius:22px;padding:1rem 1.2rem;margin-top:1.6rem}
.frow{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}.frow li{background:#fff;border:2px solid #c9bedd;border-radius:14px;padding:.35rem .8rem}.fl{font-weight:800}
.pn-nav{display:flex;justify-content:space-between;gap:1rem;margin:1.5rem 0}.pn-nav a{background:#fff;border-radius:14px;padding:.6rem .9rem;border:2px solid #e3dbf7;text-decoration:none;font-weight:700;max-width:48%}
.score{position:fixed;bottom:.8rem;left:.8rem;background:#f08a24;color:#fff;border-radius:999px;padding:.35rem .9rem;font-weight:800;box-shadow:0 4px 12px #0003;z-index:6}
.bks{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}.bk{background:#fff;border-radius:18px;padding:.8rem 1rem;border:2px solid #e3dbf7}.bk ol{padding-inline-start:1.4rem;font-size:.92rem}
.tablewrap{overflow-x:auto}table{border-collapse:collapse;width:100%;background:#fff;border-radius:14px}th,td{border:1px solid #e3dbf7;padding:.45rem .6rem;text-align:right;vertical-align:top}thead th{background:#5b4fc4;color:#fff}
.rub th{background:#fde4ee;color:#8c2556;white-space:nowrap}
.amap{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}.am{background:#fff;border-radius:18px;padding:.6rem 1rem;border-top:8px solid var(--c)}.am h3{color:var(--c);margin:.3rem 0}
.flist>li{margin:.6rem 0}.smap li{margin:.2rem 0}
.foot{text-align:center;color:var(--muted);padding:1.5rem 1rem;font-size:.9rem}
@media (max-width:760px){.tiles,.quick,.bks,.amap{grid-template-columns:1fr}.hero{flex-direction:column;text-align:center}.hero-emo{font-size:2.6rem}h1{font-size:1.5rem}.pn-nav{flex-direction:column}.pn-nav a{max-width:100%}.gloss dl{grid-template-columns:1fr}.gloss dd{margin-bottom:.4rem}}
@media print{.top,.readbar,.tracks,.pn-nav,.score,.foot,.skip{display:none}}