.site .phon-page{--read:"Andika", ui-sans-serif, system-ui, sans-serif}.site .phon-ask,.site .phon-blend{flex-direction:column;align-items:center;gap:22px;padding:12px 0;display:flex}.site .phon-speaker{border:3px solid var(--ink);background:var(--gold);min-height:64px;color:var(--ink);font:inherit;cursor:pointer;box-shadow:0 4px 0 var(--ink);border-radius:999px;align-items:center;gap:12px;padding:0 24px 0 16px;font-weight:800;display:inline-flex}.site .phon-speaker:active{box-shadow:0 1px 0 var(--ink);translate:0 3px}.site .phon-speaker svg{width:40px;height:40px;fill:var(--ink)}.site .phon-speaker .wave{fill:none;stroke:var(--ink);stroke-width:3.2px;stroke-linecap:round}.site .phon-speaker.is-busy .wave{animation:.5s ease-in-out infinite alternate phon-wave}@keyframes phon-wave{to{opacity:.25}}.site .phon-cards{flex-wrap:wrap;justify-content:center;gap:14px;display:flex}.site .phon-card{border:3px solid var(--ink);background:var(--paper);min-width:108px;height:104px;color:var(--ink);font-family:var(--read);cursor:pointer;box-shadow:0 5px 0 var(--ink);border-radius:16px 20px 14px 18px;padding:0 18px;font-size:3rem;font-weight:700;line-height:1;transition:translate .1s,box-shadow .1s,background-color .15s}.site .phon-wordcard{min-width:140px;font-size:clamp(1.75rem,1.3rem + 1.6vw,2.5rem)}.site .phon-card:hover:not(:disabled){background:#fff9dc}.site .phon-card:active:not(:disabled){box-shadow:0 1px 0 var(--ink);translate:0 4px}.site :is(.phon-card,.phon-picture):disabled{opacity:.3;cursor:default;box-shadow:none}.site :is(.phon-card,.phon-picture).is-right{opacity:1;background:#d9f3e5;border-color:#1b9461;animation:.5s cubic-bezier(.3,1.6,.5,1) right-bounce;box-shadow:0 5px #1b9461}.site :is(.phon-card,.phon-picture).is-hint{outline-offset:4px;outline:4px dashed #ec8216}.site .phon-target{border-bottom:3px solid var(--ink);font-family:var(--read);padding:6px 28px;font-size:3rem;font-weight:700}.site .phon-word{justify-content:center;gap:2px;display:grid}.site .phon-letter{font-family:var(--read);text-align:center;color:var(--ink);grid-row:1;padding:0 2px;font-size:clamp(3.5rem,2.4rem + 4vw,6rem);font-weight:700;line-height:1;transition:color .15s}.site .phon-letter.is-lit{color:#2f6fe4}.site .phon-mark{cursor:pointer;background:0 0;border:0;place-items:center;min-height:44px;padding:0;display:grid}.site .phon-mark i{background:#dc3f45;transition:background-color .15s,scale .15s;display:block}.site .phon-mark-dot i{border-radius:50%;width:18px;height:18px}.site .phon-mark-line i{border-radius:4px;width:calc(100% - 14px);height:7px}.site .phon-mark-curve{min-height:30px}.site .phon-mark-curve i{background:0 0;border:5px solid #dc3f45;border-top:0;border-radius:0 0 40px 40px;width:calc(100% - 30px);height:18px}.site .phon-mark:hover i,.site .phon-mark.is-lit i{background-color:#2f6fe4;scale:1.2}.site .phon-mark-curve:hover i,.site .phon-mark-curve.is-lit i{background:0 0;border-color:#2f6fe4}.site .phon-word-small .phon-letter{font-size:1.6rem}.site .phon-word-small .phon-mark{min-height:24px}.site .phon-word-small .phon-mark-dot i{width:9px;height:9px}.site .phon-fast{font:inherit;font-size:var(--step-small);cursor:pointer;background:0 0;border:0}.site .phon-pictures{flex-wrap:wrap;justify-content:center;gap:14px;display:flex}.site .phon-picture{aspect-ratio:1;border:3px solid var(--ink);background:var(--paper);cursor:pointer;width:clamp(96px,16vw,128px);box-shadow:0 5px 0 var(--ink);border-radius:18px 22px 16px 20px;place-items:center;font-size:clamp(3rem,2rem + 3vw,4.25rem);line-height:1;display:grid}.site .phon-picture small{font-family:var(--read);color:var(--ink);font-size:1.1rem;font-weight:700}.site .phon-turns{text-align:center;font-size:var(--step-small);color:var(--muted);font-weight:800}.site .phon-memory{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;width:min(100%,560px);margin:0 auto;display:grid}.site .phon-flip{aspect-ratio:4/3;cursor:pointer;perspective:600px;background:0 0;border:0;padding:0;position:relative}.site .phon-flip>span{border:3px solid var(--ink);backface-visibility:hidden;border-radius:14px;place-items:center;transition:transform .35s cubic-bezier(.3,.8,.3,1);display:grid;position:absolute;inset:0}.site .phon-flip-back{background-color:var(--blue);background-image:var(--squares)}.site .phon-flip-face{background:var(--paper);color:var(--ink);font-family:var(--read);font-size:clamp(1.25rem,1rem + 1.2vw,2rem);font-weight:700;transform:rotateY(180deg)}.site .phon-flip.is-open .phon-flip-back{transform:rotateY(180deg)}.site .phon-flip.is-open .phon-flip-face{transform:rotateY(0)}.site .phon-flip.is-found .phon-flip-face{background:#d9f3e5;border-color:#1b9461}.site .phon-lists{grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:20px;margin-top:40px;display:grid}.site .phon-list{border-radius:var(--radius);background:var(--paper);border:2px solid var(--grid);padding:22px 22px 26px}.site .phon-list h3{font-size:var(--step-lead);letter-spacing:-.02em}.site .phon-list-when{font-size:var(--step-small);color:var(--muted);margin-top:4px}.site .phon-list ul,.site .phon-list ol{flex-wrap:wrap;gap:8px;margin-top:16px;display:flex}.site .phon-list li{background:var(--soft);font-family:var(--read);border-radius:10px;padding:4px 12px;font-size:1.25rem;font-weight:700}.site .phon-list button{background:var(--soft);color:var(--ink);font-family:var(--read);cursor:pointer;border:0;border-radius:10px;padding:4px 12px;font-size:1.25rem;font-weight:700}.site .phon-list button:hover{background:var(--gold)}.site .phon-list-vowel{font-family:var(--read);font-size:3rem;line-height:1}.site .phon-tips{grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:28px;margin-top:40px;display:grid}.site .phon-tips h3{font-size:var(--step-body)}.site .phon-tips p{color:var(--muted);margin-top:8px}.site .free-section .phon-copy{gap:18px;max-width:62ch;margin-top:22px;display:grid}.site .print-zone{margin-top:32px}.site .print-controls{flex-wrap:wrap;align-items:center;gap:16px 24px;margin-bottom:24px;display:flex}.site .print-sheet{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;display:grid}.site .print-card{background:var(--paper);border:2px dashed #b9c6dc;border-radius:8px;place-items:center;gap:6px;min-height:110px;padding:12px;display:grid}.site .print-word{font-family:var(--read);font-size:2.25rem;font-weight:700;line-height:1}.site .print-letter{justify-items:center;gap:6px;display:inline-grid}.site .print-letter i{background:#dc3f45;border-radius:50%;width:9px;height:9px}@media print{html.printing-cards,html.printing-cards body{background:#fff!important}html.printing-cards .site :is(.bar,.foot,.skip),html.printing-cards .site .phon-page>:not(.print-host),html.printing-cards .site .print-host>:not(.print-zone,h2),html.printing-cards .site .print-controls,html.printing-cards .game-fx{display:none!important}html.printing-cards .site .print-host{background:#fff;padding:0}html.printing-cards .site .print-sheet{grid-template-columns:repeat(3,1fr);gap:0}html.printing-cards .site .print-card{break-inside:avoid;border:1px dashed #888;border-radius:0;min-height:42mm}html.printing-cards .site .print-word{font-size:30pt}@page{margin:10mm}}.site .phon-list-wide{grid-column:1/-1}.site .phon-list .phon-list-play li{background:0 0;padding:0}.site .phon-fry-n{font-family:var(--face);color:var(--muted);margin-right:2px;font-size:.75rem;font-weight:500}.site .phon-speaker:focus-visible{outline:3px dashed var(--ink);outline-offset:6px;border-radius:999px}.site .phon-speaker.is-busy{background:#ffe680}.site :is(.phon-cards,.phon-pictures)>button{animation:.4s cubic-bezier(.3,1.4,.5,1) both card-in}.site :is(.phon-cards,.phon-pictures)>button.is-wrong{animation:.45s ease-in-out wrong-wobble}.site :is(.phon-cards,.phon-pictures)>button.is-right{animation:.5s cubic-bezier(.3,1.6,.5,1) right-bounce}@keyframes card-in{0%{opacity:0;transform:translateY(16px)scale(.85)rotate(-4deg)}}.site .phon-sky{border:3px solid var(--ink);background:radial-gradient(at 70% 20%,#2c4a8f,#142552 70%);border-radius:18px 22px 16px 20px;width:100%;max-width:640px;margin:0 auto;overflow:hidden}.site .phon-sky svg{width:100%;height:auto;display:block}.site .phon-sky .dust{fill:#fff;opacity:.5;animation:2.8s ease-in-out infinite alternate twinkle}@keyframes twinkle{to{opacity:.12}}.site .phon-sky .faint{fill:#8fa4d640;stroke:#8fa4d6;stroke-width:1.5px;stroke-dasharray:3 3}.site .phon-sky .lit{fill:var(--gold);stroke:#fff2a8;stroke-width:1px;transform-box:fill-box;transform-origin:50%;filter:drop-shadow(0 0 6px #ffd84ae6);animation:.6s cubic-bezier(.3,1.8,.5,1) star-light}.site .phon-sky .lit.silver{fill:#e4eaf4;stroke:#fff;filter:drop-shadow(0 0 5px #e4eaf4cc)}@keyframes star-light{0%{rotate:-120deg;scale:.1}}.site .phon-sky .join{stroke:#c9d7ff;stroke-width:2px;stroke-linecap:round;stroke-dasharray:1;opacity:.8;animation:.6s ease-out both join-draw}.site .phon-sky .join.is-closing{animation-delay:.4s}@keyframes join-draw{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}.site .phon-sky .name{fill:var(--gold);font-family:var(--hand);text-anchor:middle;font-size:26px;font-weight:700;animation:.6s ease-out .8s both card-in}.site .phon-sky.is-done .lit{animation:1.4s ease-in-out infinite alternate star-pulse}@keyframes star-pulse{to{scale:1.25}}.site .phon-river{width:100%;max-width:640px;margin:0 auto;position:relative}.site .phon-river svg{width:100%;height:auto;display:block}.site .phon-river .water{fill:#cfe6f7;stroke:#1e2b4a;stroke-width:2px}.site .phon-river .ripple{fill:none;stroke:#8cbde3;stroke-width:2px;stroke-linecap:round;animation:3s ease-in-out infinite alternate ripple}@keyframes ripple{to{transform:translate(14px)}}.site .phon-river .bank{fill:#f1e2b8;stroke:#1e2b4a;stroke-width:2px}.site .phon-river .trunk{fill:none;stroke:#6e4321;stroke-width:5px;stroke-linecap:round}.site .phon-river .leaves{fill:#8fb36a;stroke:#1e2b4a;stroke-width:2px}.site .phon-river .olive{fill:#4c5d2a}.site .phon-river .spot{fill:none;stroke:#8cbde3;stroke-width:2px;stroke-dasharray:4 5}.site .phon-river .rock{fill:#c9cfd9;stroke:#1e2b4a;stroke-width:2px}.site .phon-river .stone.gold .rock{fill:#f6dd84}.site .phon-river .stone{animation:.5s cubic-bezier(.3,1.5,.5,1) stone-drop}.site .phon-river .splash{fill:none;stroke:#fff;stroke-width:3px;opacity:0;animation:.7s ease-out .15s splash}@keyframes stone-drop{0%{opacity:0;translate:0 -40px}}@keyframes splash{0%{opacity:1;scale:.6}to{opacity:0;scale:1.8}}.site .phon-river-owl{z-index:1;pointer-events:none;width:clamp(46px,10%,66px);transition:left .75s cubic-bezier(.45,0,.3,1),top .75s;position:absolute;translate:-50% -92%}.site .phon-river-owl svg{width:100%;height:auto;display:block}.site .phon-river-owl.is-home{animation:.5s ease-in-out .8s 4 alternate owl-cheer}@keyframes owl-cheer{to{transform:translateY(-10px)rotate(6deg)}}.site .phon-balloons{flex-wrap:wrap;justify-content:center;gap:18px 22px;padding:6px 0 30px;display:flex}.site .phon-balloon{--tint:#ffd0d3;--edge:#dc3f45;aspect-ratio:5/6;border:3px solid var(--ink);background:radial-gradient(circle at 32% 26%, #ffffffd9 0 9%, transparent 10%), var(--tint);width:clamp(118px,15vw,150px);color:var(--ink);cursor:pointer;border-radius:50% 50% 48% 52%/56% 56% 44% 44%;place-items:center;padding:0 10px 12px;animation:.4s cubic-bezier(.3,1.4,.5,1) both card-in,3.2s ease-in-out infinite alternate balloon-bob;display:grid;position:relative;box-shadow:inset -10px -12px #0000000f}.site .phon-balloon:before{content:"";border:3px solid var(--ink);background:var(--tint);border-top:0;border-radius:0 0 6px 6px;width:14px;height:10px;position:absolute;bottom:-9px;left:50%;translate:-50%}.site .phon-balloon:after{content:"";background:var(--ink);transform-origin:top;width:2px;height:30px;margin-top:1px;position:absolute;top:100%;left:50%;rotate:4deg}.site .phon-balloon.tint-1{--tint:#cfe1ff}.site .phon-balloon.tint-2{--tint:#c9efd9}.site .phon-balloon.tint-3{--tint:#ffeaa0}.site .phon-balloon.tint-4{--tint:#e6d6ff}.site .phon-balloon-word{font-family:var(--read);font-size:clamp(1.6rem,1.2rem + 1.4vw,2.3rem);font-weight:700;line-height:1}.site .phon-balloon:hover:not(:disabled){filter:brightness(1.04);scale:1.04}@keyframes balloon-bob{0%{transform:translateY(0)rotate(-2deg)}to{transform:translateY(-10px)rotate(2deg)}}.site .phon-balloon:disabled{cursor:default}.site .phon-balloon.is-wrong{opacity:.35;filter:grayscale();animation:.45s ease-in-out wrong-wobble}.site .phon-balloon.is-right{animation:.42s ease-out forwards balloon-pop}.site .phon-balloon.is-hint{outline-offset:6px;outline:4px dashed #ec8216}@keyframes balloon-pop{30%{opacity:1;transform:scale(1.25)}to{opacity:0;transform:scale(1.6)}}.site .phon-best{color:#1b9461;font-weight:800}@media (width<=720px){.site .phon-balloon{width:112px}.site .phon-balloons{gap:40px 14px}}@media (prefers-reduced-motion:reduce){.site :is(.phon-sky *,.phon-river *,.phon-river-owl,.phon-balloon,.phon-cards>button,.phon-pictures>button){transition:none!important;animation:none!important}.site .phon-balloon.is-right{opacity:.4}}