/* mc-finish.css: the end of a masterclass or tutorial (glue/mc-finish.js). The window is the mc3 dialog (.mcd); only its
   form, the stars and the confetti canvases are here. Gold for the stars, pink for the one send button. */
.mcd.mcf .mcd-in{width:min(500px,calc(100vw - 32px))}
.mcd.mcf .mcd-h{text-align:center;padding-inline:40px}
.mcf-form{display:flex;flex-direction:column;gap:6px}
.mcf-form[hidden]{display:none}
.mcf-form .mcd-p{text-align:center}
.mcf-l{display:block;margin:8px 0 2px;font-weight:800;font-size:15px;color:var(--ink)}
p.mcf-l{text-align:center}
.mcf-stars{display:flex;justify-content:center;gap:4px;margin:2px 0 6px}
.mcf-stars button{width:48px;height:48px;display:grid;place-items:center;border:0;background:none;border-radius:999px;cursor:pointer;padding:0;color:inherit;transition:transform .15s var(--ease,ease-out)}
.mcf-stars button:active{transform:scale(.96)}
.mcf-stars svg{width:34px;height:34px;fill:transparent;stroke:color-mix(in srgb,#D4AF37 70%,transparent);stroke-width:1.5;stroke-linejoin:round}
.mcf-stars button.on svg{fill:#D4AF37;stroke:#A87B12;filter:drop-shadow(0 0 6px rgba(212,175,55,.55))}
.mcf-stars button:focus-visible{outline:2px solid var(--focus,#D9A63A);outline-offset:2px}
.mcf-form textarea,.mcf-form input{width:100%;box-sizing:border-box;border:1.5px solid var(--line);border-radius:14px;background:transparent;color:var(--ink);font:inherit;font-size:16px;line-height:1.5;padding:10px 14px}
.mcf-form textarea{resize:vertical;min-height:84px}
.mcf-form textarea:focus-visible,.mcf-form input:focus-visible{outline:2px solid var(--focus,#D9A63A);outline-offset:1px;border-color:transparent}
.mcf-form textarea::placeholder{color:var(--dim);opacity:.85}
.mcf-honest{text-align:start;margin-top:4px}
.mcf-err{margin:0;color:var(--pink);font-size:14px;font-weight:600}
.mcf-err:empty{display:none}
.mcf-acts{display:flex;flex-direction:column;align-items:center;gap:2px;margin-top:8px}
.mcf-acts .btn{width:100%;min-height:48px}
.mcf-acts .btn[disabled]{opacity:.45;cursor:not-allowed}
.mcf-thanks{margin:6px 0 4px;text-align:center;font-size:17px;line-height:1.6;color:var(--ink)}
.mcf-thanks:empty{display:none}
/* under the player when every lesson is done */
.mcf-add{margin:12px 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;color:var(--dim);font-size:15px}
.mcf-add .linkbtn{color:var(--ink)}
/* confetti: over the player (a lesson), over the whole screen (the last one). Never with reduced motion (the script draws none). */
.mcf-burst{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:4}
.mcf-party{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:2147483000}