:root{--azul:#16307a;--azul-2:#2b4fb8;--azul-soft:#e3e9f7;--ink:#141c33;--muted:#59607a;--cream:#f6f1e6;--paper:#fffdf8;--line:#e2dccd;--coral:#d9482b;--coral-soft:#fde6df;--sun:#f5a300;--sun-soft:#fff1cc;--green:#1d7a4d;--green-soft:#dcf1e5;--red:#c8341e;--radius:18px;--shadow:0 1px 0 #141c330f, 0 10px 30px -12px #141c3340;--display:"Bricolage Grotesque", "Figtree", system-ui, sans-serif;--body:"Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;color-scheme:light}*,:before,:after{box-sizing:border-box}[hidden]{display:none!important}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}body{font:17px/1.6 var(--body);color:var(--ink);background:var(--cream);margin:0}img{max-width:100%;height:auto;display:block}a{color:var(--azul-2);text-underline-offset:3px}a:hover{color:var(--azul)}h1,h2,h3{font-family:var(--display);letter-spacing:-.02em;margin:0 0 .5em;line-height:1.1}h1{font-size:clamp(2.1rem,5vw,3.6rem);font-weight:800}h2{margin-top:1.6em;font-size:clamp(1.5rem,3vw,2.1rem);font-weight:800}h3{font-size:1.2rem;font-weight:600}p{margin:0 0 1em}.wrap{width:min(1160px,100% - 32px);margin-inline:auto}.narrow{width:min(780px,100% - 32px);margin-inline:auto}.skip{position:absolute;left:-999px}.skip:focus{z-index:99;background:#fff;padding:8px 12px;top:12px;left:12px}.lede{color:var(--muted);max-width:46em;font-size:1.2rem}.muted{color:var(--muted)}.small{font-size:.875rem}.pt{color:var(--azul);font-weight:700}.ipa{color:var(--coral);font-family:Noto Sans,DejaVu Sans,Segoe UI,system-ui,sans-serif;font-size:.95em}button{font-family:inherit}:focus-visible{outline-offset:2px;outline:3px solid #2b4fb873}.site-head{z-index:30;backdrop-filter:blur(10px);border-bottom:1px solid var(--line);background:#f6f1e6eb;position:sticky;top:0}.site-head .wrap{align-items:center;gap:20px;min-height:60px;display:flex}.brand{color:var(--ink);font:800 1.25rem var(--display);letter-spacing:-.02em;flex:none;align-items:center;gap:9px;text-decoration:none;display:flex}.brand b{color:var(--coral)}.nav{scrollbar-width:none;gap:4px;margin-left:auto;display:flex;overflow-x:auto}.nav a{white-space:nowrap;color:var(--ink);border-radius:99px;padding:7px 12px;font-size:.95rem;font-weight:500;text-decoration:none}.nav a:hover{background:var(--azul-soft)}.nav a[aria-current]{background:var(--azul);color:#fff}@media (width<=760px){.site-head .wrap{flex-wrap:wrap;gap:0;padding-top:6px}.nav{order:3;width:100%;margin:0 -6px;padding-bottom:8px}.nav a{padding:5px 10px;font-size:.9rem}}.crumbs{color:var(--muted);margin:18px 0 0;font-size:.875rem}.btn{font:700 1rem var(--body);border:2px solid var(--azul);background:var(--azul);color:#fff;cursor:pointer;border-radius:99px;align-items:center;gap:8px;padding:11px 18px;text-decoration:none;display:inline-flex}.btn:hover{background:var(--azul-2);border-color:var(--azul-2);color:#fff}.btn.ghost{color:var(--azul);background:0 0}.btn.ghost:hover{background:var(--azul-soft);color:var(--azul)}.btn.coral{background:var(--coral);border-color:var(--coral)}.btn.sm{padding:6px 12px;font-size:.88rem}.btn[disabled]{opacity:.5;cursor:not-allowed}.chip{background:var(--azul-soft);color:var(--azul);border-radius:99px;padding:3px 9px;font-size:.8rem;font-weight:700;display:inline-block}.chip.coral{background:var(--coral-soft);color:var(--coral)}.chip.green{background:var(--green-soft);color:var(--green)}.chip.sun{background:var(--sun-soft);color:#7a4c00}.speak{border:2px solid var(--azul);width:36px;height:36px;color:var(--azul);cursor:pointer;background:#fff;border-radius:50%;flex:none;place-items:center;padding:0;font-size:1rem;display:inline-grid}.speak:hover,.speak.playing{background:var(--azul);color:#fff}.speak:before{content:"🔊";font-size:.95rem}.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px}.grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:18px;display:grid}.grid.two{grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr))}.tool-card{color:inherit;flex-direction:column;text-decoration:none;transition:transform .2s;display:flex}.tool-card:hover{color:inherit;transform:translateY(-3px)}.tool-card .emoji{margin-bottom:10px;font-size:2rem;line-height:1}.tool-card h3{margin-bottom:.3em}.tool-card p{color:var(--muted);margin:0;font-size:.95rem}table{border-collapse:collapse;width:100%;min-width:520px;font-size:.97rem}th,td{text-align:left;border-bottom:1px solid var(--line);vertical-align:top;padding:9px 10px}th{text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-size:.8rem}.table-scroll{overflow-x:auto}.callout{border-left:5px solid var(--sun);background:var(--sun-soft);border-radius:0 12px 12px 0;margin:1.2em 0;padding:14px 18px}.callout.blue{border-color:var(--azul);background:var(--azul-soft)}.callout.red{border-color:var(--coral);background:var(--coral-soft)}label{margin-bottom:4px;font-size:.92rem;font-weight:600;display:block}input,select{font:inherit;border:1.5px solid var(--line);width:100%;color:var(--ink);background:#fff;border-radius:12px;padding:10px 12px}.seg{background:var(--azul-soft);scrollbar-width:none;border-radius:99px;gap:2px;max-width:100%;padding:4px;display:inline-flex;overflow-x:auto}.seg button{white-space:nowrap;font:600 .92rem var(--body);cursor:pointer;color:var(--azul);background:0 0;border:0;border-radius:99px;padding:7px 14px}.seg button[aria-pressed=true]{background:var(--azul);color:#fff}section{padding:10px 0 30px}.hero{background:var(--azul);color:#fff;position:relative;overflow:hidden}.hero>img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.hero:after{content:"";background:linear-gradient(90deg,#0e1a42e6 0%,#0e1a4299 48%,#0e1a420d 100%);position:absolute;inset:0}.hero .wrap{z-index:1;padding:74px 0 64px;position:relative}.hero h1{max-width:12em}.hero .lede{color:#ffffffe6}.hero .btn.ghost{color:#fff;border-color:#fff}.hero .btn.ghost:hover{background:#ffffff26}.hero .cta{flex-wrap:wrap;gap:10px;margin-top:20px;display:flex}@media (width<=640px){.hero:after{background:linear-gradient(#0e1a4259 0%,#0e1a42f0 65%)}.hero .wrap{padding:150px 0 34px}}.page-top{padding:28px 0 8px}.page-top h1{font-size:clamp(2rem,4.5vw,3rem)}.wall{position:relative}.wall3d{aspect-ratio:6/4.2;touch-action:pan-y;background:linear-gradient(160deg,#e9eefb,#d6def3);border-radius:24px;width:100%;display:none;position:relative;overflow:hidden}.wall3d.is-3d{display:block}@media (width<=600px){.wall3d{aspect-ratio:4.4/6.9}}.wall3d canvas{display:block;position:absolute;inset:0;width:100%!important;height:100%!important}.flipgrid{grid-template-columns:repeat(auto-fill,minmax(min(46%,150px),1fr));gap:10px;display:grid}.wall3d.is-3d+.flipgrid,.wall3d.is-3d .flipgrid{display:none}.flip{perspective:600px;aspect-ratio:1;cursor:pointer;background:0 0;border:0;padding:0}.flip .in{width:100%;height:100%;transform-style:preserve-3d;transition:transform .5s;display:block;position:relative}.flip[aria-pressed=true] .in{transform:rotateY(180deg)}.flip .f,.flip .b{backface-visibility:hidden;text-align:center;border:3px solid var(--azul);border-radius:12px;place-content:center;padding:6px;display:grid;position:absolute;inset:0}.flip .f{background:radial-gradient(circle at 50% 50%, var(--cream) 0 28%, transparent 29%), repeating-conic-gradient(var(--azul) 0 12.5%, var(--cream) 0 25%);background-size:100% 100%,36px 36px}.flip .b{background:var(--paper);color:var(--azul);font:800 1.1rem var(--display);transform:rotateY(180deg)}.flip .b small{font:500 .75rem var(--body);color:var(--muted);margin-top:4px;display:block}.lab{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:22px;display:grid}@media (width<=860px){.lab{grid-template-columns:1fr}}.mouth{border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(#eaf0fb,#f6f9ff);padding:10px}.mouth svg{width:100%;height:auto;display:block}.mouth .lbl{font:600 11px var(--body);fill:#59607a;paint-order:stroke;stroke:#f3f7ff;stroke-width:3px}.mouth-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;padding:6px 4px 2px;display:flex}.word-row{border-bottom:1px dashed var(--line);align-items:center;gap:12px;padding:10px 0;display:flex}.word-row:last-child{border-bottom:0}.word-row .w{flex:1;min-width:0}.word-row .w b{font:800 1.2rem var(--display);color:var(--azul)}.word-row .en{color:var(--muted);font-size:.9rem}.word-row .sel{text-align:left;cursor:pointer;color:inherit;background:0 0;border:0;padding:0}.word-row.on{background:var(--azul-soft);border-radius:12px;margin-inline:-10px;padding-inline:10px}.rec canvas{background:#0f1a3d;border-radius:10px;width:100%;height:90px;display:block}.rec .lanes{gap:8px;display:grid}.rec .lanes figcaption{color:var(--muted);margin-bottom:3px;font-size:.8rem}.rec .lanes figure{margin:0}.rec-actions{flex-wrap:wrap;gap:8px;margin:12px 0;display:flex}.rec .dot{background:var(--coral);border-radius:50%;width:10px;height:10px;display:inline-block}.rec .dot.live{animation:1s infinite pulse}@keyframes pulse{50%{opacity:.25}}.ear .opts{grid-template-columns:1fr 1fr;gap:10px;margin:12px 0;display:grid}.ear .opts button,.opt{font:700 1.1rem var(--display);border:2px solid var(--line);cursor:pointer;text-align:left;background:#fff;border-radius:14px;padding:14px}.ear .opts button:hover,.opt:hover{border-color:var(--azul-2)}.good{background:var(--green-soft)!important;border-color:var(--green)!important}.bad{background:var(--coral-soft)!important;border-color:var(--coral)!important}.chat{background:var(--azul-soft);border-radius:var(--radius);flex-direction:column;gap:10px;max-height:60vh;padding:14px;display:flex;overflow-y:auto}.bubble{background:#fff;border-radius:18px;max-width:86%;padding:10px 14px;box-shadow:0 1px #0000000f}.bubble.them{border-bottom-left-radius:4px;align-self:flex-start}.bubble.you{background:var(--azul);color:#fff;border-bottom-right-radius:4px;align-self:flex-end}.bubble .pt{color:inherit}.bubble .en{opacity:.75;font-size:.85rem;display:block}.bubble .row{align-items:center;gap:8px;display:flex}.choices{gap:8px;margin-top:12px;display:grid}.choice{text-align:left;border:2px solid var(--line);cursor:pointer;background:#fff;border-radius:14px;padding:11px 14px;font-size:1rem}.choice:hover{border-color:var(--azul-2)}.choice small{color:var(--muted);display:block}.feedback{border-radius:10px;margin:4px 2px;padding:8px 12px;font-size:.9rem}.feedback.best{background:var(--green-soft);color:var(--green)}.feedback.ok{background:var(--sun-soft);color:#7a4c00}.feedback.off{background:var(--coral-soft);color:var(--coral)}.phrase{border-bottom:1px dashed var(--line);align-items:flex-start;gap:12px;padding:12px 0;display:flex}.phrase:last-child{border-bottom:0}.phrase .pt{font:800 1.1rem var(--display)}.quiz .q{margin-bottom:18px}.quiz .opt{width:100%;font-size:1rem;font-family:var(--body);margin-top:8px;font-weight:600;display:block}.conj td:first-child,.conj th:first-child{color:var(--muted);font-weight:500}.conj td button{font:700 1.05rem var(--display);color:var(--azul);cursor:pointer;background:0 0;border:0;border-radius:8px;padding:2px 4px}.conj td button:hover{background:var(--azul-soft)}.conj.hidden-forms td button{filter:blur(7px)}.conj.hidden-forms td button.shown{filter:none}.blank{border-bottom:3px solid var(--coral);text-align:center;min-width:4.5em;color:var(--coral);font-weight:800;display:inline-block}.row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.gender{text-align:center;justify-items:center;gap:14px;display:grid}.gender .word{font:800 2.6rem var(--display);color:var(--azul)}.gender .art{gap:12px;display:flex}.gender .art button{min-width:96px;font:800 1.3rem var(--display)}.scorebar{color:var(--muted);font-size:.9rem}.fc{max-width:520px;margin-inline:auto}.fc-card{perspective:900px;cursor:pointer;min-height:240px}.fc-card .in{min-height:240px;transform-style:preserve-3d;transition:transform .45s;position:relative}.fc-card.shown .in{transform:rotateY(180deg)}.fc-card .f,.fc-card .b{backface-visibility:hidden;text-align:center;background:var(--paper);border:2px solid var(--azul);box-shadow:var(--shadow);border-radius:22px;place-content:center;gap:8px;padding:22px;display:grid;position:absolute;inset:0}.fc-card .b{background:var(--azul);color:#fff;transform:rotateY(180deg)}.fc-card .b .ipa{color:#ffd9a0}.fc-card .big{font:800 clamp(1.5rem, 4vw, 2rem) var(--display)}.fc-actions{grid-template-columns:repeat(4,1fr);gap:8px;margin-top:14px;display:grid}.fc-actions button{border:2px solid var(--line);cursor:pointer;background:#fff;border-radius:14px;padding:12px 4px;font-weight:700}.fc-actions button.again{border-color:var(--coral)}.fc-actions button.good2{border-color:var(--green)}.stats{flex-wrap:wrap;gap:8px;margin:12px 0 18px;display:flex}.site-foot{background:var(--ink);color:#c9cde0;margin-top:60px;padding:40px 0 70px;font-size:.92rem}.site-foot .cols{grid-template-columns:2fr 1fr 1fr;gap:26px;display:grid}.site-foot nav{flex-direction:column;gap:4px;display:flex}.site-foot strong,.site-foot a{color:#fff}@media (width<=820px){.site-foot .cols{grid-template-columns:1fr 1fr}.site-foot .about{grid-column:1/-1}}.consent{z-index:50;background:var(--paper);border:1px solid var(--line);max-width:560px;box-shadow:var(--shadow);border-radius:16px;margin-inline:auto;padding:14px 16px;font-size:.9rem;position:fixed;bottom:16px;left:16px;right:16px}.consent p{margin:0 0 10px}.consent .actions{gap:8px;display:flex}.consent .btn{padding:8px 14px;font-size:.9rem}.sister{font-size:.92rem}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}html{scroll-behavior:auto}}
