/* DilArena V5 / standalone, scoped lesson CSS, last stylesheet wins */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body.lesson-body-v5{margin:0;min-height:100dvh;display:flex;flex-direction:column;color:#173c48;background:radial-gradient(circle at 20% 0%,#e4fff1 0,transparent 35%),linear-gradient(180deg,#f6fbf8,#eaf5f4);font:16px/1.5 system-ui,-apple-system,'Segoe UI',sans-serif;overflow-x:hidden}
.lesson-body-v5 button,.lesson-body-v5 input{font:inherit}
.lesson-body-v5 a{text-decoration:none}
.lesson-body-v5 button{cursor:pointer}
.lesson-body-v5 [hidden]{display:none!important}
.lv5-top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:13px;padding:13px max(17px,calc((100% - 820px)/2));background:#ffffffeb;backdrop-filter:blur(14px);border-bottom:1px solid #dce9e5;box-shadow:0 5px 20px #17685008;min-height:75px}
.lv5-exit{width:42px;height:42px;border-radius:14px;border:1px solid #e0eae6;display:grid;place-items:center;background:white;color:#526875;flex:none}
.lv5-progress{flex:1;min-width:0;height:13px;border-radius:40px;background:#e0ebe8;overflow:hidden;border:1px solid #cfe0db}
#lesson-progress{display:block;width:0;height:100%;background:linear-gradient(90deg,#0fba82,#59d9b1);border-radius:40px;transition:width .2s}
.lv5-hearts{display:flex;align-items:center;gap:5px;font-size:18px;color:#e94e76;font-weight:900;padding:7px 10px;border-radius:14px;background:#fff3f6;border:1px solid #ffe5ee;flex:none}
.lv5-main{flex:1;width:min(800px,calc(100% - 28px));padding:24px 0 42px;margin:auto}
.lv5-lesson-name{display:inline-flex;align-items:center;gap:8px;color:#138f6d;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.07em;background:#e4f9ef;border:1px solid #bcebd7;border-radius:999px;padding:8px 12px;margin-bottom:19px;max-width:100%;overflow-wrap:anywhere}
.lv5-question,.lv5-start,.lv5-result{background:#fff;border:1px solid #e0ede6;border-radius:28px;padding:clamp(19px,5vw,35px);box-shadow:0 16px 50px #127c5a14;max-width:100%;overflow:hidden}
.lv5-eyebrow{display:inline-flex;align-items:center;gap:7px;color:#0ba276;font-weight:900;letter-spacing:.1em;font-size:12px}
.lv5-heading{font-weight:950;font-size:clamp(25px,4vw,34px);line-height:1.22;letter-spacing:-.032em;color:#173949;margin:13px 0 23px}
.lv5-prompt{display:flex;align-items:center;gap:13px;min-height:89px;border-radius:20px;padding:17px;background:linear-gradient(118deg,#dff9eb,#ecf8fe);border:1px solid #c2ead7;overflow-wrap:anywhere}
.lv5-prompt .lv5-word{margin-right:auto}.lv5-prompt-text{font-weight:850;font-size:22px;color:#1f6858}
.lv5-word{min-width:0;display:flex;flex-direction:column;gap:2px;flex:1;overflow-wrap:anywhere;align-items:flex-start}
.lv5-text{font-size:clamp(17px,4vw,22px);line-height:1.35;font-weight:850;color:#183b47;overflow-wrap:anywhere}
.lv5-reading{font-weight:650;font-size:clamp(12px,2.7vw,15px);letter-spacing:.015em;color:#6f8890;max-width:100%;overflow-wrap:anywhere}
.lv5-prompt .lv5-text{font-size:clamp(24px,5vw,32px);color:#124f40}
.lv5-prompt .lv5-reading{color:#278b76}
.lv5-audio{display:grid;place-items:center;flex:0 0 auto;width:39px;height:39px;border-radius:13px;background:#e6f8f0;color:#0ca271;border:1px solid #bcebd5}
.lv5-audio:active{transform:scale(.95)}
.lv5-instruction{font-weight:850;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:#7d949a;margin:20px 0 12px}
.lv5-options{display:grid;gap:12px}
.lv5-choice{display:flex;align-items:center;gap:12px;min-height:69px;width:100%;text-align:start;border:2px solid #dceae5;border-radius:17px;background:#fff;padding:12px 14px;color:#173c48;box-shadow:0 3px 0 #dae9e2;transition:border-color .15s,background .15s,box-shadow .15s}
.lv5-choice:hover{border-color:#9cddc3}.lv5-choice.selected{background:#e3faef;border-color:#0fbb84;box-shadow:0 3px 0 #78dabb}
.lv5-choice .lv5-audio{margin-inline-start:auto}
.lv5-choice:focus-visible,.lv5-exit:focus-visible,.lv5-cta:focus-visible,.lv5-match:focus-visible{outline:3px solid #27a3ed;outline-offset:3px}
.lv5-choice.lv5-used{opacity:.46}
.lv5-word-output{background:#f0fbf5;border-radius:14px;min-height:55px;border:2px dashed #b8e5d3;padding:11px 14px;font-weight:800;margin-bottom:12px;overflow-wrap:anywhere}
.lv5-reset{background:#f0f8f5;border:1px solid #d0e6dc;color:#117e62;border-radius:13px;padding:11px 15px;font-size:13px;font-weight:850;margin-top:12px}
.lv5-input{display:block;width:100%;padding:16px 17px;font-size:19px;border-radius:16px;border:2px solid #d2e8dc;outline:none;background:white;color:#173c48}
.lv5-input:focus{border-color:#15ba85;box-shadow:0 0 0 4px #b8e8d955}
.lv5-match-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.lv5-match-column{display:grid;gap:9px;min-width:0;align-content:start}
.lv5-match{display:flex;text-align:start;align-items:center;min-width:0;min-height:68px;border-radius:15px;border:2px solid #dce9e5;padding:10px;background:#fff;color:#173949;font-weight:800;overflow-wrap:anywhere}
.lv5-match .lv5-text{font-size:15px}.lv5-match .lv5-reading{font-size:12px}
.lv5-match.active{background:#f2ecff;border-color:#9a7bea}.lv5-match.paired{background:#e7faf0;border-color:#80dabc;opacity:.74}
.lv5-cta{display:inline-flex;align-items:center;justify-content:center;gap:9px;color:#fff;background:linear-gradient(115deg,#13b980,#068e6b);padding:14px 20px;font-size:15px;font-weight:900;border:0;border-radius:15px;box-shadow:0 5px 0 #087c5f}
.lv5-start{text-align:center;padding-block:48px}.lv5-start h1{font-size:clamp(25px,5vw,36px);line-height:1.2;margin:17px 0 8px}.lv5-start p{color:#66827d;margin-bottom:27px}
.lv5-starter-icon{display:grid;place-items:center;width:95px;height:95px;background:linear-gradient(120deg,#d8f9e5,#eefbf4);color:#0c9e70;border:1px solid #b7efd4;border-radius:28px;margin:auto}
.lv5-bottom{position:sticky;bottom:0;background:#ffffffee;backdrop-filter:blur(12px);border-top:1px solid #daebe4;box-shadow:0 -10px 35px #20564610;z-index:18}
.lv5-bottom-inner{width:min(800px,calc(100% - 28px));padding:13px 0;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:80px}
.lv5-count{color:#738f89;font-weight:900;font-size:14px}
.lv5-next{min-width:155px}
.lv5-loading{text-align:center;padding:80px 12px;color:#348a73;font-size:21px;font-weight:800}
.lv5-result{text-align:center;padding:38px clamp(17px,5vw,37px);background:radial-gradient(circle at 50% 0%,#d8fdec,#fff 58%)}
.lv5-result-medal{height:110px;width:110px;margin:0 auto 16px;border-radius:50%;display:grid;place-items:center;color:#c08616;background:radial-gradient(circle at 30% 26%,#fffbd3,#f6c65f);border:5px solid #fff1c0;box-shadow:0 7px 0 #e2ad38,0 20px 35px #b27b2320;animation:lv5-bounce .65s ease both}
.lv5-result-kicker{color:#149874;font-size:13px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.lv5-result-title{font-size:clamp(24px,5vw,35px);margin:8px 0 11px;color:#194638;line-height:1.22}
.lv5-result-score{font-size:clamp(54px,12vw,85px);font-weight:1000;letter-spacing:-.05em;color:#09a779;line-height:1.1;margin-bottom:26px}
.lv5-result-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;margin:0 auto 19px;max-width:590px}
.lv5-stat{display:flex;flex-direction:column;align-items:center;gap:5px;padding:15px 8px;border:1px solid #ddede5;border-radius:17px;background:#fafefd}
.lv5-stat svg{color:#0fa77a}.lv5-stat:nth-child(2) svg{color:#c99628}.lv5-stat:nth-child(3) svg{color:#e16c7b}
.lv5-stat strong{font-size:24px;font-weight:940;color:#203b46}.lv5-stat small{font-size:11px;color:#728a87;font-weight:850}
.lv5-tip{display:flex;align-items:center;gap:7px;justify-content:center;margin:15px auto;padding:12px 13px;max-width:520px;background:#fff5eb;color:#926b45;border:1px solid #f2dfc8;border-radius:14px;font-size:12px;font-weight:750;overflow-wrap:anywhere}
.lv5-reward-hint{font-size:12px;color:#7a8c8e}
.lv5-actions{display:grid;gap:11px;max-width:440px;margin:25px auto 0}
.lv5-actions a,.lv5-actions button{font:inherit;font-size:14px;font-weight:880;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:9px;min-height:49px;padding:12px 16px;border-radius:15px;border:1px solid #cfeadd;text-align:center}
.lv5-go-next{background:#0aa675;color:white!important;border:0!important;box-shadow:0 4px 0 #087b59}.lv5-go-home{background:#e9f9f1;color:#137f61}.lv5-go-subtle{background:#fff;color:#69817b}
.lv5-confetti{position:fixed;inset:0;pointer-events:none;z-index:100;overflow:hidden}
.lv5-piece{position:absolute;top:-20px;left:var(--left);width:9px;height:16px;border-radius:2px;opacity:0;animation:lv5-fall var(--duration) ease-in var(--delay) forwards}
@keyframes lv5-fall{0%{transform:translateY(-20px) rotate(0deg);opacity:1}80%{opacity:1}100%{transform:translate(var(--drift),110vh) rotate(820deg);opacity:0}}
@keyframes lv5-bounce{0%{transform:scale(.3)}70%{transform:scale(1.12)}100%{transform:scale(1)}}
@media(max-width:550px){.lv5-top{min-height:62px;padding:8px 13px}.lv5-exit{height:39px;width:39px}.lv5-main{width:calc(100% - 24px);padding:18px 0 29px}.lv5-lesson-name{font-size:11px;margin-bottom:14px}.lv5-question{padding:19px 14px;border-radius:21px}.lv5-heading{font-size:25px}.lv5-prompt{padding:13px 12px}.lv5-choice{min-height:65px;padding:11px 12px}.lv5-choice .lv5-reading{font-size:12px}.lv5-audio{height:36px;width:36px}.lv5-match-grid{gap:7px}.lv5-match{padding:8px}.lv5-result{border-radius:22px;padding:28px 12px}.lv5-result-stats{gap:6px}.lv5-stat{padding:12px 5px}.lv5-stat strong{font-size:20px}.lv5-stat small{font-size:10px}.lv5-bottom-inner{min-height:70px;padding:9px 0}.lv5-next{min-width:130px}}
@media(prefers-reduced-motion:reduce){.lv5-result-medal,.lv5-piece{animation:none!important}#lesson-progress{transition:none}}
/* Native word first, parenthesized reading immediately alongside it; wraps only when space runs out. */
.lv5-word{flex-direction:row;flex-wrap:wrap;align-items:baseline;column-gap:9px;row-gap:2px}
.lv5-word .lv5-reading{display:inline;flex:none}
.lv5-choice[aria-disabled="true"]{opacity:.5;cursor:not-allowed}
