/* Dritë Math blocks: shared by the teacher editor and the student page */
.dm-top{display:flex;gap:20px;align-items:flex-start;justify-content:space-between;margin-bottom:18px}
.dm-top h2{font:400 clamp(28px,4vw,44px)/1.1 'Libre Baskerville',Georgia,serif;margin:4px 0 8px;color:#eef0fa}.dm-top p{color:#b7bddb;margin:0;max-width:680px}
.dm-kick{color:#a594ff;font-size:12px;letter-spacing:1.2px;text-transform:uppercase}
.dm-score{flex:none;padding:10px 16px;border-radius:999px;background:linear-gradient(180deg,#8f7bff,#6a5bea);color:#fff;font-size:18px;box-shadow:0 8px 24px rgba(106,91,234,.35);transition:transform .2s}.dm-score.pop{transform:scale(1.15)}
.dm-blocks{display:flex;flex-direction:column;gap:16px}
.dm-block{background:rgba(31,38,64,.72);border:1px solid rgba(180,188,255,.14);border-radius:18px;padding:20px 22px;color:#eef0fa}
.dm-block h3{margin:0 0 8px;font:400 21px/1.3 'Libre Baskerville',Georgia,serif}.dm-block p{margin:0 0 12px;color:#cfd4ea;line-height:1.55}
.dm-formula{font:22px/1.4 'Libre Baskerville',Georgia,serif;text-align:center;padding:12px;border-radius:12px;background:rgba(165,148,255,.1);color:#fff}
.dm-live{font:18px 'SF Mono',ui-monospace,Menlo,monospace;color:#c9bfff;margin:6px 0 10px}
.dm-block canvas{display:block;max-width:100%;height:auto;border-radius:12px;margin:0 auto}
.dm-sliders{display:flex;flex-wrap:wrap;gap:10px 24px;margin-top:12px}.dm-sliders label{display:flex;align-items:center;gap:10px;font-size:15px}
.dm-sliders input[type=range]{width:200px;accent-color:#a594ff}.dm-sliders span{min-width:36px;font-family:'SF Mono',ui-monospace,monospace;color:#c9bfff}
.dm-frac{display:grid;grid-template-columns:1fr auto;gap:14px 24px;align-items:center}.dm-frac .dm-bar{grid-column:1/-1;display:flex;gap:3px;height:34px}
.dm-bar i{flex:1;border-radius:6px;background:#252d4a}.dm-bar i.on{background:#a594ff}
.dm-big{font:26px 'Libre Baskerville',Georgia,serif;display:flex;align-items:center;gap:10px}.dm-fr{display:inline-flex;flex-direction:column;text-align:center;font-style:normal;line-height:1.1}.dm-fr i{font-style:normal}.dm-fr i:first-child{border-bottom:2px solid #eef0fa;padding:0 6px}
.dm-nl input{width:100%;accent-color:#a594ff}.dm-ticks{display:flex;justify-content:space-between;font-size:12px;color:#8b92b3;margin-top:4px}
.dm-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:10px}.dm-val{font:20px 'SF Mono',ui-monospace,monospace;min-width:60px}
.dm-btn{background:linear-gradient(180deg,#8f7bff,#6a5bea);color:#fff;border:0;border-radius:10px;padding:9px 16px;font:500 14px -apple-system,system-ui,sans-serif;cursor:pointer}.dm-btn.ghost{background:transparent;border:1px solid rgba(180,188,255,.3)}.dm-btn:disabled{opacity:.5;cursor:default}
.dm-in{background:#12162a;border:1px solid rgba(180,188,255,.25);color:#eef0fa;border-radius:10px;padding:9px 12px;font-size:16px;width:160px}
.dm-opts{display:grid;grid-template-columns:1fr 1fr;gap:8px}.dm-opts button{text-align:left;background:#1b2140;color:#eef0fa;border:1px solid rgba(180,188,255,.2);border-radius:12px;padding:12px 14px;font-size:15px;cursor:pointer}
.dm-opts button:hover{border-color:#a594ff}.dm-opts button.good{border-color:#6ed3a8;background:rgba(110,211,168,.14)}.dm-opts button.bad{border-color:#ff7a8a;background:rgba(255,122,138,.12)}
.dm-fb{margin-top:10px;min-height:20px;font-size:15px}.dm-fb.good{color:#6ed3a8}.dm-fb.bad{color:#ff9aa6}
.dm-steps li{margin:8px 0;font-size:16px;line-height:1.5}.dm-steps li:last-child{animation:dmIn .35s ease}@keyframes dmIn{from{opacity:0;transform:translateY(6px)}}
.dm-order{list-style:decimal;padding-left:22px}.dm-order li{display:flex;gap:8px;align-items:center;margin:6px 0;background:#1b2140;border:1px solid rgba(180,188,255,.18);border-radius:10px;padding:8px 10px}
.dm-order li span{flex:1}.dm-order button{background:none;border:1px solid rgba(180,188,255,.3);color:#eef0fa;border-radius:8px;width:30px;height:30px;cursor:pointer}
.dm-err{color:#ff9aa6}
@media(max-width:640px){.dm-opts{grid-template-columns:1fr}.dm-frac{grid-template-columns:1fr}.dm-sliders input[type=range]{width:150px}}

/* 🎮 3D games */
.dm-3d{position:relative;border-radius:14px;overflow:hidden;background:radial-gradient(circle at 70% 20%,rgba(165,148,255,.22),transparent 55%),#0e1124;border:1px solid rgba(180,188,255,.16)}
.dm-3d canvas{display:block;width:100%;height:auto;aspect-ratio:16/9;cursor:grab;border-radius:0}.dm-3d canvas:active{cursor:grabbing}
.dm-hud{position:absolute;left:12px;top:10px;display:flex;gap:10px;align-items:center;pointer-events:none}
.dm-hud b{background:linear-gradient(180deg,#8f7bff,#6a5bea);color:#fff;font-size:12px;padding:4px 10px;border-radius:999px}.dm-hud span{color:#ffd36e;font:15px 'SF Mono',ui-monospace,monospace;text-shadow:0 1px 6px #000}
.dm-hint3{position:absolute;right:12px;bottom:8px;font-size:11px;color:#8b92b3;pointer-events:none}

/* 🎈 balloons */
.dm-bal{background:linear-gradient(180deg,#27306a 0%,#1a1f45 55%,#12162a 100%)}
.dm-q{position:absolute;left:0;right:0;top:14px;text-align:center;font:600 clamp(20px,3.4vw,34px)/1.2 -apple-system,system-ui,sans-serif;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.5);padding:0 60px;pointer-events:none}
.dm-bal .dm-hud{left:auto;right:12px}

/* 🧩 step-by-step game */
.sg-prob{font-size:17px;color:#eef0fa!important}
.sg{position:relative;border-radius:16px;padding:18px 18px 16px;background:linear-gradient(180deg,#27306a,#1a1f45);border:1px solid rgba(180,188,255,.18);text-align:center;overflow:hidden}
.sg-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.sg-n{font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#c9bfff}
.sg-dots{display:flex;gap:6px}.sg-dots i{width:22px;height:6px;border-radius:4px;background:#3a4174}.sg-dots i.now{background:#ffd36e}.sg-dots i.ok{background:#6ed3a8}
.sg-say{font:600 clamp(17px,2.4vw,22px)/1.35 -apple-system,system-ui,sans-serif;color:#fff;margin:6px 0 16px}
.sg-board{font:clamp(28px,5vw,46px)/1.3 'Libre Baskerville',Georgia,serif;color:#fff;margin:6px 0 14px;transition:transform .25s}.sg-board.pop{transform:scale(1.08)}
.sg-slot{display:inline-block;min-width:1.6em;padding:0 .25em;border-radius:12px;border:3px dashed #ffd36e;color:#ffd36e;background:rgba(255,211,110,.08);animation:slotglow 1.6s ease-in-out infinite}
.sg-slot.hover{background:rgba(255,211,110,.3);transform:scale(1.08)}.sg-slot.filled{border-style:solid;border-color:#6ed3a8;color:#6ed3a8;animation:none}
@keyframes slotglow{50%{box-shadow:0 0 22px rgba(255,211,110,.55)}}
.sg-vis{display:flex;align-items:center;justify-content:center;gap:14px;min-height:0;margin-bottom:14px;color:#c9bfff}.sg-vis:empty{margin:0}
.sg-grp,.sg-rows>div{display:flex;flex-wrap:wrap;gap:5px;max-width:190px;justify-content:center}.sg-rows{display:flex;flex-direction:column;gap:5px}
.sg-vis i{width:14px;height:14px;border-radius:50%;background:#a594ff;display:inline-block}.sg-grp.alt i{background:#ffd36e}.sg-vis b{font-size:24px;color:#fff}
.sg-tiles{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;touch-action:none}
.sg-tile{min-width:70px;padding:14px 18px;border-radius:16px;border:0;background:#fff;color:#1b2140;font:700 26px -apple-system,system-ui,sans-serif;cursor:grab;box-shadow:0 6px 0 #b9b2ff,0 10px 24px rgba(0,0,0,.3);transition:transform .15s;user-select:none;touch-action:none}
.sg-tile.lift{cursor:grabbing;transition:none;z-index:5;position:relative}.sg-tile.used{opacity:0;pointer-events:none}.sg-tile.nope{animation:nope .45s}
@keyframes nope{20%,60%{transform:translateX(-8px)}40%,80%{transform:translateX(8px)}}
.sg-trail{margin-top:14px;color:#8b92b3;font:15px 'Libre Baskerville',Georgia,serif}.sg-trail div:before{content:"→ "}
