/* =====================================================================
   GAMIFY · EDUCATOR — layout only. Reads every color/radius/font from
   skin.css :root, same rule as shell.css. No new palette here.
   ===================================================================== */
body.shell{padding:0}
.screen{padding:24px 16px 60px}

.ed-tabs{display:flex;gap:8px;margin-bottom:14px}
.ed-tab{flex:1;padding:9px;border-radius:var(--radius);border:1px solid var(--choice-edge);
  background:var(--choice);color:var(--muted);font-weight:800;cursor:pointer;font-family:var(--font)}
.ed-tab.on{background:var(--accent);color:var(--btn-ink);border-color:var(--accent)}

.shell-card input[type=text],.shell-card input[type=email],.shell-card input[type=password]{
  width:100%;border-radius:12px;border:1px solid var(--choice-edge);background:var(--choice);
  color:var(--ink);padding:11px 12px;font:15px var(--font);margin-bottom:4px}
.shell-card textarea{width:100%;min-height:90px;border-radius:12px;border:1px solid var(--choice-edge);
  background:var(--choice);color:var(--ink);padding:11px 12px;font:15px var(--font);resize:vertical}

.ed-topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.ed-who{font-size:.85rem;color:var(--muted);display:flex;align-items:center;gap:10px}
.ed-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:8px}
.ed-row input{margin-bottom:0}

.ed-code-card{text-align:center}
.ed-code{font-size:2.2rem;font-weight:900;letter-spacing:6px;color:var(--ink);
  background:var(--choice);border:2px dashed var(--accent);border-radius:var(--radius);
  padding:10px;margin:6px 0}

.class-row,.lesson-row{background:var(--choice);border:1px solid var(--choice-edge);border-radius:var(--radius);
  padding:14px;margin-bottom:10px;display:flex;justify-content:space-between;align-items:center;gap:10px;cursor:pointer}
.class-row:hover,.lesson-row:hover{border-color:var(--accent)}
.class-row .cr-name,.lesson-row .cr-name{font-weight:800;color:var(--ink)}
.class-row .cr-sub,.lesson-row .cr-sub{font-size:.8rem;color:var(--muted);margin-top:2px}
.badge{display:inline-block;font-size:.68rem;font-weight:800;padding:2px 8px;border-radius:999px;margin-left:6px}
.badge.lock{background:var(--bad);color:#fff}
.badge.pub{background:var(--good);color:#fff}
.badge.draft{background:var(--pill-bg);color:var(--muted)}

.mech-picker{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;margin-top:6px}
.mech-opt{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--choice-edge);border-radius:var(--radius);
  padding:10px;cursor:pointer;background:var(--choice)}
.mech-opt.on{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent) inset}
.mech-opt input{margin-top:3px}
.mech-opt .mo-name{font-weight:800;color:var(--ink);font-size:.92rem}
.mech-opt .mo-sub{font-size:.76rem;color:var(--muted);margin-top:2px}

.insight-block{background:var(--choice);border:1px solid var(--choice-edge);border-radius:var(--radius);
  padding:14px;margin-bottom:12px}
.insight-num{font-size:1.6rem;font-weight:900;color:var(--ink)}
.insight-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);font-weight:700}
.weak-row{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid var(--choice-edge);font-size:.9rem}