/* Scratch card (12A) and quiz (12B). Existing files untouched. */
.y-title{margin:0 0 22px;text-align:center;font:600 clamp(26px,6.4vw,44px)/1.1 var(--serif);letter-spacing:-.03em;color:#3f3347}
.y-title em{font-weight:500;color:#a9573f}

/* scratch */
.y-scratch-section{background:linear-gradient(165deg,#f8e4e4,#f4d8dc 55%,#f1dcd0);border-top:1px solid #e3c4c4;text-align:center}
.y-instr{margin:0 0 22px;font:11px var(--mono);letter-spacing:.18em;color:#9a5b6a}
.y-card{position:relative;width:min(460px,100%);min-height:250px;margin:0 auto;background:#fffaf2;border-radius:18px;box-shadow:0 18px 38px #8a4a5a30,0 0 0 6px #fff8ee,0 0 0 7px #e7b5b5;overflow:hidden;display:flex}
.y-card-inner{position:relative;width:100%;padding:44px 28px 34px;display:flex;flex-direction:column;justify-content:center;gap:12px;background:radial-gradient(circle at 50% 0,#fff2e6,#fffaf2 70%)}
.y-card-no{font:10px var(--mono);letter-spacing:.16em;color:#b0607a}
.y-card-text{margin:0;font:600 clamp(19px,5vw,23px)/1.55 var(--serif);color:#4a3a45;white-space:pre-wrap;user-select:text}
.y-foil{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair;transition:opacity .9s ease;-webkit-user-select:none;user-select:none}
.y-card.is-open .y-foil{opacity:0;pointer-events:none}
.y-card.is-open .y-card-text{animation:yPop .8s ease}
@keyframes yPop{from{opacity:.2;transform:scale(.94)}to{opacity:1;transform:none}}
.y-sparkles{position:absolute;inset:0;pointer-events:none}
.y-sparkles i{position:absolute;font-style:normal;color:#e9b46b;font-size:16px;animation:ySpark 1.4s ease-out forwards}
@keyframes ySpark{from{opacity:1;transform:translate(0,0) scale(.4)}to{opacity:0;transform:translate(var(--dx),var(--dy)) scale(1.3) rotate(120deg)}}
.y-actions{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:26px}
.y-btn{font:11px var(--mono);letter-spacing:.12em;color:#fff7ec;background:#a9573f;border:0;border-radius:40px;padding:15px 28px;cursor:pointer;box-shadow:0 8px 18px #a9573f44;transition:.25s}
.y-btn:hover:not(:disabled){transform:translateY(-2px)}
.y-btn:disabled{opacity:.45;cursor:default;box-shadow:none}
.y-btn[hidden],.y-actions .text-button[hidden]{display:none}
.y-final{max-width:460px;margin:24px auto 0;padding:24px;background:#a9573f;color:#fff4e6;font:italic 600 17px/1.7 var(--serif);box-shadow:0 12px 26px #a9573f40;animation:yPop .9s ease}

/* quiz */
.y-quiz-section{background:linear-gradient(165deg,#e8eedf,#e2e9e4 55%,#e9e3ee);border-top:1px solid #cfd8c8}
.y-mirror{position:relative;max-width:640px;margin:0 auto;padding:34px 30px 30px;background:#fffcf5;border-radius:200px 200px 22px 22px / 90px 90px 22px 22px;border:1px solid #d6dccb;box-shadow:0 18px 38px #5a6a5030,inset 0 0 0 6px #fffcf5,inset 0 0 0 7px #cbd6bf;overflow:hidden}
.y-prog{display:flex;align-items:center;gap:12px;margin-top:34px;font:10px var(--mono);letter-spacing:.12em;color:#6f7d63}
.y-prog i{flex:1;height:5px;background:#e3e8da;border-radius:5px;overflow:hidden}
.y-prog b{display:block;height:100%;width:10%;background:linear-gradient(90deg,#c98a9a,#a9573f);border-radius:5px;transition:width .4s ease}
.y-qno{display:block;margin-top:22px;font:10px var(--mono);letter-spacing:.16em;color:#a9573f}
.y-q{margin:8px 0 18px;font:600 clamp(21px,5vw,27px)/1.3 var(--serif);color:#3f3347}
.y-opts{display:grid;gap:10px}
.y-opt{display:flex;gap:12px;align-items:flex-start;text-align:left;width:100%;padding:14px 16px;font:15px/1.5 var(--sans);color:#443b48;background:#fff;border:1px solid #d9d4c6;border-radius:14px;cursor:pointer;transition:.2s}
.y-opt:hover{border-color:#c98a9a;transform:translateX(3px)}
.y-opt b{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font:10px var(--mono);background:#efeae0;color:#7a6f63}
.y-opt.sel{background:#fbeae6;border-color:#a9573f;box-shadow:0 4px 12px #a9573f22}
.y-opt.sel b{background:#a9573f;color:#fff}
.y-nav{display:flex;justify-content:space-between;gap:10px;margin-top:22px}
.y-btn-ghost{font:11px var(--mono);letter-spacing:.1em;color:#6b4a79;background:transparent;border:1px solid #c9bfd3;border-radius:40px;padding:14px 20px;cursor:pointer}
.y-btn-ghost:disabled{opacity:.35;cursor:default}
.y-hint{margin:12px 0 0;text-align:center;font:19px var(--hand);color:#9c5d49;min-height:24px}
.y-results{list-style:none;margin:0 0 24px;padding:0;display:grid;gap:10px;counter-reset:r}
.y-results li{padding:12px 14px 12px 44px;position:relative;background:#fff;border:1px solid #e1dccd;border-radius:12px;font:14px/1.5 var(--sans);color:#443b48;animation:yPop .6s ease backwards;animation-delay:calc(var(--i) * .08s)}
.y-results li:before{counter-increment:r;content:counter(r);position:absolute;left:12px;top:12px;width:22px;height:22px;border-radius:50%;background:#f1d6cf;color:#a9573f;font:10px/22px var(--mono);text-align:center}
.y-results small{display:block;color:#8a7f73;font-size:12px;margin-bottom:2px}
.y-results b{font-weight:600}
.y-msg{margin-bottom:22px;padding:24px 22px;background:#fbeae6;border:1px dashed #c98a9a;border-radius:14px;text-align:center}
.y-msg h4{margin:0 0 12px;font:600 18px var(--serif);letter-spacing:.04em;color:#a9573f}
.y-msg p{margin:0;font:italic 16px/1.8 var(--serif);color:#4a3a45}
#qDone{text-align:center;padding-top:30px}#qDone .y-results{text-align:left}
.y-petals{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.y-petals i{position:absolute;top:-24px;font-style:normal;font-size:18px;animation:yFall 4.5s ease-in forwards}
@keyframes yFall{to{transform:translate(var(--dx),620px) rotate(260deg);opacity:0}}
@media(max-width:560px){.y-mirror{padding:28px 18px 24px;border-radius:120px 120px 20px 20px / 60px 60px 20px 20px}.y-card-inner{padding:40px 20px 28px}.y-opt{font-size:14px;padding:12px}}
@media(prefers-reduced-motion:reduce){.y-card.is-open .y-card-text,.y-final,.y-results li,.y-sparkles i,.y-petals i{animation:none!important}.y-foil{transition:none}}