.grid.svelte-ff8aiv{--vowel:#c9670a;--semi:#0f7f62;--nasal:#8636be;--voiced:#2a64c8;--voiceless:#c02d48;--fric:#59606d;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 18px;display:grid}.line.svelte-ff8aiv{min-width:0;transition:opacity .4s var(--d), transform .4s var(--d);align-items:center;gap:8px;display:flex}.line.hidden.svelte-ff8aiv{opacity:0;pointer-events:none;transform:translate(-10px)}.num.svelte-ff8aiv{text-align:right;width:24px;font-family:var(--font-mono);color:var(--muted);background:0 0;border:none;flex-shrink:0;padding:0;font-size:12px}button.num.svelte-ff8aiv{cursor:pointer;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}.slots.svelte-ff8aiv{flex-wrap:wrap;gap:4px;min-width:0;display:flex}.slot.svelte-ff8aiv{border:1.5px solid var(--line);background:var(--surface);min-width:36px;height:40px;color:var(--ink);border-radius:8px;flex-direction:column;justify-content:center;align-items:center;padding:0 4px;font-size:20px;line-height:1.1;transition:background .2s,border-color .2s,transform .2s,opacity .2s;display:inline-flex}.slot.svelte-ff8aiv small:where(.svelte-ff8aiv){font-family:var(--font-serif);color:var(--muted);font-size:11px;font-style:italic}button.slot.svelte-ff8aiv{cursor:pointer;font:inherit;font-size:20px}button.slot.svelte-ff8aiv:hover{border-color:var(--indigo);transform:translateY(-1px)}.slot.it.svelte-ff8aiv{min-width:30px;color:var(--muted);background:0 0;border-style:dashed;font-size:17px}.color.svelte-ff8aiv .slot:where(.svelte-ff8aiv):not(.it){border-color:color-mix(in srgb, var(--c) 60%, transparent);background:color-mix(in srgb, var(--c) 12%, var(--surface))}.slot.vowel.svelte-ff8aiv{--c:var(--vowel)}.slot.semi.svelte-ff8aiv{--c:var(--semi)}.slot.nasal.svelte-ff8aiv{--c:var(--nasal)}.slot.voiced.svelte-ff8aiv{--c:var(--voiced)}.slot.voiceless.svelte-ff8aiv{--c:var(--voiceless)}.slot.fric.svelte-ff8aiv{--c:var(--fric)}.slot.lit.svelte-ff8aiv{background:var(--saffron);border-color:var(--saffron);color:#fff;transform:translateY(-2px)}.slot.lit.svelte-ff8aiv small:where(.svelte-ff8aiv){color:#fff}.slot.marked.svelte-ff8aiv{border-color:var(--indigo);background:var(--indigo-soft);color:var(--indigo);box-shadow:0 0 0 2px var(--indigo-soft);border-style:solid}@media (width<=1100px){.grid.svelte-ff8aiv{grid-template-columns:minmax(0,1fr)}}@media (width<=420px){.slot.svelte-ff8aiv{min-width:29px;height:36px;padding:0 2px;font-size:17px}button.slot.svelte-ff8aiv{font-size:17px}.slot.it.svelte-ff8aiv{min-width:24px;font-size:15px}.num.svelte-ff8aiv{width:18px}}
