/* Commercial V4 conversational grammar tutor */
body.grammar-v4-open{overflow:hidden}
.grammar-v4-shell[hidden]{display:none!important}
.grammar-v4-shell{position:fixed;inset:0;z-index:10050;background:rgba(25,42,63,.36);backdrop-filter:blur(4px);padding:16px;display:grid;place-items:center}
.grammar-v4-dialog{width:min(920px,100%);max-height:calc(100vh - 32px);background:#fbfdff;border:1px solid #d7e5f3;border-radius:24px;box-shadow:0 28px 80px rgba(32,66,102,.22);display:flex;flex-direction:column;overflow:hidden}
.grammar-v4-dialog>header{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:18px 20px;background:linear-gradient(135deg,#eef7ff,#fff8ee);border-bottom:1px solid #dfebf5}
.grammar-v4-dialog h2{margin:2px 0 0;font-size:clamp(1.2rem,2.4vw,1.75rem);line-height:1.3;color:#172c43}
.grammar-v4-dialog .eyebrow{font-size:.78rem;font-weight:800;letter-spacing:.04em;color:#3c6e9d}
.grammar-v4-dialog button{font:inherit}
.grammar-v4-dialog button.icon{width:42px;height:42px;border-radius:50%;border:1px solid #c9d9e8;background:#fff;font-size:1.6rem;line-height:1;color:#345}
.grammar-v4-dialog button.outline,.grammar-v4-dialog button.soft,.grammar-v4-dialog button.primary{border-radius:13px;padding:11px 16px;font-weight:800;cursor:pointer}
.grammar-v4-dialog button.outline{border:1px solid #b9cede;background:#fff;color:#29445e}
.grammar-v4-dialog button.soft{border:1px solid #ead7ad;background:#fff9e9;color:#71551a}
.grammar-v4-dialog button.primary{border:1px solid #2675b8;background:#2f84c8;color:#fff}
.grammar-v4-dialog button:disabled{opacity:.45;cursor:not-allowed}
.grammar-v4-progress{height:7px;background:#e8eff5}
.grammar-v4-progress>div{height:100%;background:linear-gradient(90deg,#44a6df,#6cbf94);transition:width .25s ease}
.grammar-v4-dialog>main{padding:24px;overflow:auto;min-height:340px;outline:none}
.grammar-v4-dialog>footer{display:grid;grid-template-columns:auto 1fr auto;gap:10px;padding:15px 20px;border-top:1px solid #dde8f1;background:#f7fbfe}
.grammar-v4-bubble{border-radius:18px;padding:18px 20px;margin-bottom:14px;line-height:1.78;font-size:1.02rem}
.grammar-v4-bubble b{display:block;margin-bottom:6px;color:#254a6a}
.grammar-v4-bubble p{margin:5px 0}
.grammar-v4-bubble.teacher{background:#edf7ff;border:1px solid #c8e4f7}
.grammar-v4-bubble.coach{background:#f0fbf5;border:1px solid #c9ead8}
.grammar-v4-bubble.warning{background:#fff5ee;border:1px solid #f2d4c0}
.grammar-v4-prompt{margin:14px 0;padding:14px 17px;border-left:5px solid #7aaad0;background:#f7fafc;border-radius:0 12px 12px 0;color:#506274;line-height:1.65}
.grammar-v4-steps{list-style:none;padding:0;margin:10px 0;display:grid;gap:10px}
.grammar-v4-steps li{display:grid;grid-template-columns:42px 1fr;gap:12px;align-items:center;background:#fff;border:1px solid #dbe7f0;border-radius:15px;padding:12px 15px;line-height:1.55}
.grammar-v4-steps li span{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#dff0fc;color:#205e8b;font-weight:900}
.grammar-v4-example{padding:20px;border-radius:18px;border:1px solid #d7e5ef;margin-bottom:14px}
.grammar-v4-example.easy{background:#fffdf6}
.grammar-v4-example.csat{background:#f3f8ff}
.grammar-v4-example .tag,.grammar-v4-check .tag{display:inline-block;padding:5px 10px;border-radius:999px;background:#dbeefc;color:#265f88;font-size:.78rem;font-weight:900;margin-bottom:9px}
.grammar-v4-example .en{font-size:1.17rem;font-weight:800;line-height:1.65;color:#172d43}
.grammar-v4-example .ko{color:#4b6174;line-height:1.6}
.grammar-v4-example .walk{margin-top:14px;padding:14px 16px;background:rgba(255,255,255,.78);border-radius:12px;line-height:1.75}
.grammar-v4-check{background:#fff;border:1px solid #cfdeea;border-radius:18px;padding:20px}
.grammar-v4-check h3{font-size:1.12rem;line-height:1.6;color:#1e3850}
.grammar-v4-check-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.grammar-v4-check-actions button{padding:9px 12px;border:1px solid #c7d9e8;background:#f8fbfd;border-radius:11px;font-weight:750}
.grammar-v4-hints p{background:#fff8e7;border:1px solid #edd9a3;border-radius:11px;padding:10px 12px;line-height:1.55}
.grammar-v4-answer{margin-top:14px;padding:14px 16px;background:#ecf8f0;border:1px solid #bfe2ca;border-radius:12px;line-height:1.65}
.grammar-v4-complete{display:flex;gap:14px;align-items:center;background:#eefaf3;border:1px solid #bfe3cd;border-radius:18px;padding:18px}
.grammar-v4-complete>span{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#4eae77;color:white;font-size:1.4rem;font-weight:900}
.grammar-v4-complete p{margin:4px 0;color:#547063}
.grammar-v4-dialog.list>main{padding:18px}
.grammar-v4-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.grammar-v4-lesson-card{display:grid;grid-template-columns:42px 1fr;gap:11px;text-align:left;align-items:center;border:1px solid #d6e3ed;background:#fff;border-radius:14px;padding:12px;cursor:pointer}
.grammar-v4-lesson-card>span{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#e8f3fb;color:#2e6c99;font-weight:900}
.grammar-v4-lesson-card b{display:block;color:#223b52}
.grammar-v4-lesson-card small{display:block;margin-top:4px;color:#788b9b}
.grammar-v4-lesson-card.done{background:#f1fbf5;border-color:#bfe2cc}
.grammar-v4-lesson-card.done>span{background:#d8f1e2;color:#267147}
@media(max-width:680px){
 .grammar-v4-shell{padding:0;place-items:stretch}
 .grammar-v4-dialog{max-height:100vh;height:100%;border-radius:0;border:0}
 .grammar-v4-dialog>header{grid-template-columns:auto 1fr;padding:14px}
 .grammar-v4-dialog>header>.outline{grid-column:2;justify-self:start;padding:7px 10px}
 .grammar-v4-dialog>main{padding:16px}
 .grammar-v4-dialog>footer{grid-template-columns:1fr 1fr;padding:12px}
 .grammar-v4-dialog>footer .soft{grid-column:1/-1;grid-row:1}
 .grammar-v4-grid{grid-template-columns:1fr}
 .grammar-v4-bubble,.grammar-v4-example,.grammar-v4-check{padding:16px}
}
@media(prefers-reduced-motion:reduce){.grammar-v4-progress>div{transition:none}}
