.fdn{margin:0 0 2rem;padding:1.25rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}.fdn canvas{color:var(--text);border-top-color:var(--accent);display:block;width:100%;aspect-ratio:3/2;max-height:26rem}[data-mode=cream] .fdn canvas{border-top-color:var(--btn-ring)}.fdn figcaption{margin-top:1rem;color:var(--muted);font-size:.9rem;line-height:1.55}.fdn__formula{display:block;margin-top:.6rem;color:var(--accent-ui,var(--accent));font-family:var(--font-mono);font-size:.85rem}.ab{margin:1.5rem 0;padding:1.1rem 1.25rem 1.25rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}.ab h3{margin:0 0 .35rem;font-size:1.05rem}.ab__desc{margin:0 0 1rem;color:var(--muted);font-size:.92rem}.ab__player{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap}.ab__play{position:relative;flex:none;width:2.4rem;height:2.4rem;border:1px solid var(--line-2);border-radius:50%;background:var(--panel-2);cursor:pointer}.ab__play:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.ab__play::before{content:"";position:absolute;top:50%;left:50%;transform:translate(-40%,-50%);border-style:solid;border-width:.42rem 0 .42rem .68rem;border-color:transparent transparent transparent var(--accent)}.ab.is-playing .ab__play::before{transform:translate(-50%,-50%);width:.7rem;height:.8rem;border:none;background:linear-gradient(var(--accent),var(--accent))0/.24rem 100% no-repeat,linear-gradient(var(--accent),var(--accent))100%/.24rem 100% no-repeat}.ab__track{flex:1 1 8rem;height:.5rem;border-radius:999px;background:var(--panel-2);box-shadow:inset 0 1px 2px var(--panel-shadow);cursor:pointer}.ab__track:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.ab__fill{width:0;height:100%;border-radius:999px;background:var(--accent)}.ab__time{flex:none;min-width:5.5rem;color:var(--dim);font-family:var(--font-mono);font-size:.8rem}.ab__switch{display:flex;flex:none;gap:1px;border:1px solid var(--line-2);border-radius:var(--radius);overflow:hidden}.ab__switch button{padding:.4rem .8rem;border:0;background:var(--panel-2);color:var(--muted);font-family:var(--font-mono);font-size:.78rem;cursor:pointer}.ab__switch button[aria-pressed=true]{background:var(--accent);color:var(--btn-text)}.ab__switch button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.ab__missing{margin:0;color:var(--dim);font-family:var(--font-mono);font-size:.8rem}.skins{margin:1.5rem 0}.skins__stage{display:grid;place-items:center;min-height:12rem;padding:1rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}.skins__stage img{display:block;max-width:100%;height:auto}.skins__missing{margin:0;color:var(--dim);font-family:var(--font-mono);font-size:.8rem;text-align:center}.skins__tabs{display:flex;gap:.4rem;margin-top:.75rem}.skins__tabs button{padding:.35rem .85rem;border:1px solid var(--line-2);border-radius:var(--radius);background:var(--panel-2);color:var(--muted);font-family:var(--font-mono);font-size:.78rem;cursor:pointer}.skins__tabs button[aria-selected=true]{border-color:var(--accent);color:var(--accent-ui,var(--accent))}.skins__tabs button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}