.ex{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:start;gap:28px;margin-top:8px;display:grid}.ex-left,.ex-right{min-width:0}.ex-right{gap:10px;display:grid;position:sticky;top:80px}@media (width<=960px){.ex{grid-template-columns:minmax(0,1fr)}.ex-right{position:static}}.ex-prog{margin:8px 0 18px}.ex-bar{background:var(--surface-2);border-radius:99px;height:8px;overflow:hidden}.ex-bar i{background:var(--accent);border-radius:99px;width:0;height:100%;transition:width .4s;display:block}.ex-count{margin:6px 0 0;font-size:.9rem}.ex-prev{background:var(--surface-2);border-radius:10px;margin:0 0 16px;padding:8px 14px;font-size:.95rem}.steps{gap:12px;margin:28px 0 0;padding:0;list-style:none;display:grid}.step{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);padding:14px 18px}.step[data-state=locked]{display:none}.step[data-state=current]{border-color:var(--accent);box-shadow:var(--shadow)}.step[data-state=done]{background:var(--ok-bg);border-color:color-mix(in srgb, var(--ok) 40%, var(--line))}.step .head{align-items:center;gap:10px;font-weight:800;display:flex}.step .num{background:var(--surface-2);border-radius:50%;place-items:center;width:28px;height:28px;font-size:.9rem;display:inline-grid}.step[data-state=current] .num{background:var(--accent);color:#1b1300}.step[data-state=done] .num{background:var(--ok);color:#fff}.step[data-state=done] .num:before{content:"✓"}.step[data-state=done] .num span{display:none}.step .instr p{color:var(--ink);margin:.5em 0}.step .instr code,.feedback code,.hint code{font-family:var(--mono);background:var(--surface-2);direction:ltr;unicode-bidi:isolate;border-radius:6px;padding:1px 6px;font-size:.9em}.step-actions{flex-wrap:wrap;gap:8px;margin-top:8px;display:flex}.step[data-state=done] .step-actions,.step[data-state=done] .hint{display:none}.small-btn{border:1px solid var(--line);background:var(--surface);color:var(--ink-2);cursor:pointer;border-radius:8px;padding:2px 12px;font-family:inherit;font-size:.85rem;font-weight:700}.small-btn:hover{border-color:var(--accent)}.hint{background:var(--surface-2);border-radius:10px;margin-top:8px;padding:8px 14px;font-size:.95rem}.hint p{margin:.3em 0}.ex-done{border-color:var(--ok);background:var(--ok-bg);margin-top:20px}.ex-done h2{margin:0 0 6px;font-size:1.3rem}.ex-done .actions{flex-wrap:wrap;gap:10px;margin-top:12px;display:flex}.toolbar{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.toolbar .btn{padding:8px 16px;font-size:.95rem}.toolbar .btn:disabled{opacity:.55;cursor:default}.toolbar .sp{flex:1}.ex-editor{border:1px solid var(--line);direction:ltr;background:#282c34;border-radius:12px;min-height:220px;overflow:hidden}.ex-editor .cm-editor{min-height:220px;max-height:420px;font-size:15px}.ex-editor .cm-scroller{font-family:var(--mono)}.ex-editor .loading{color:#8a96ad;direction:rtl;padding:16px;font-size:.9rem}.ex-stdin{color:var(--ink-2);font-size:.9rem}.ex-stdin textarea{text-align:left;width:100%;min-height:54px;font-family:var(--mono);border:1px solid var(--line);background:var(--surface);color:var(--ink);resize:vertical;direction:ltr;border-radius:10px;padding:8px 12px;font-size:14px}.ex-out{text-align:left;font-family:var(--mono);white-space:pre-wrap;color:#d7e3f4;border:1px solid var(--line);border-top:2px solid var(--accent);direction:ltr;background:#070c17;border-radius:12px;min-height:64px;max-height:260px;margin:0;padding:12px 16px;font-size:13.5px;overflow:auto}.ex-out:empty:before{content:"خروجی برنامه اینجا نشان داده می‌شود";font-family:var(--font);color:#8a96ad;direction:rtl;font-size:.9rem}.ex-out .err{color:#ff8a80}.ex-out .info{color:#8a96ad;font-style:italic}.feedback{border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:12px 16px;line-height:1.9}.feedback.ok{border-color:var(--ok);background:var(--ok-bg)}.feedback.bad{border-color:var(--bad);background:var(--bad-bg)}.feedback .xp{background:var(--accent);color:#1b1300;border-radius:99px;margin-inline-start:8px;padding:0 10px;font-size:.8rem;font-weight:800;display:inline-block}.feedback .why{border-top:1px dashed var(--line);margin-top:8px;padding-top:8px;font-size:.95rem}.pr-hero{margin:8px 0 28px}.pr-stats{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;margin:18px 0;display:grid}.pr-stats>div{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);text-align:center;padding:12px 16px}.pr-stats b{color:var(--accent-ink);font-size:1.7rem;line-height:1.4;display:block}.pr-stats span{color:var(--muted);font-size:.85rem}.pr-actions{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.pr-topic{margin-top:36px}.pr-topic h2{margin:0 0 8px}.tb{background:var(--surface-2);border-radius:99px;max-width:320px;height:6px;overflow:hidden}.tb i{background:var(--ok);width:0;height:100%;transition:width .4s;display:block}.tb-text{color:var(--muted);margin:4px 0 14px;font-size:.85rem}.ex-card{position:relative}.ex-card .n{background:var(--surface-2);border-radius:50%;place-items:center;width:30px;height:30px;font-size:.9rem;font-weight:800;display:inline-grid}.ex-card .st{color:var(--muted);margin-top:10px;font-size:.85rem;font-weight:700;display:inline-block}.ex-card[data-state=done]{border-color:color-mix(in srgb, var(--ok) 50%, var(--line))}.ex-card[data-state=done] .n{background:var(--ok);color:#fff}.ex-card[data-state=done] .st{color:var(--ok)}.ex-card[data-state=progress] .st{color:var(--accent-ink)}.ex-card.next{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 35%, transparent), var(--shadow)}.pr-tools{gap:10px;margin-top:36px;display:grid}.pr-tools .row{flex-wrap:wrap;gap:10px;display:flex}.toolbar .btn.next{background:var(--accent,#16a34a);color:#fff;animation:1.6s ease-in-out 2 nextPulse}@keyframes nextPulse{50%{transform:scale(1.06)}}@media (prefers-reduced-motion:reduce){.toolbar .btn.next{animation:none}}
