:root{--backend-blue:#2563eb;--backend-deep:#0f172a;--backend-panel:#fff;--backend-border:#dbe5f3;--backend-soft:#eef5ff;--backend-green:#10b981;--backend-red:#ef4444}
.backend-toolbar{display:inline-flex;align-items:center;gap:7px;padding:4px 7px;border-radius:10px;font-family:'Microsoft YaHei','PingFang SC',sans-serif;margin-left:auto}
.backend-toolbar button,.backend-toolbar a{height:34px;border:1px solid #d7e2f0;border-radius:10px;padding:0 11px;background:#f7faff;color:#17325c;font-size:13px;font-weight:700;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:5px;white-space:nowrap}.backend-toolbar button:hover,.backend-toolbar a:hover{background:#eaf2ff}.backend-toolbar .user-chip{background:#17325c;color:#fff}.backend-toolbar .admin-link{background:#fff4d8;color:#7a4d00}.backend-toolbar .logout-btn{width:34px;padding:0;justify-content:center;color:#be123c;background:#fff0f2}
.backend-overlay{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(circle at 30% 20%,rgba(59,130,246,.23),transparent 42%),linear-gradient(135deg,rgba(8,20,43,.96),rgba(17,44,80,.94));font-family:'Microsoft YaHei','PingFang SC',sans-serif}.backend-overlay[hidden]{display:none!important}
.backend-modal{width:min(620px,96vw);max-height:92vh;overflow:auto;border:1px solid rgba(255,255,255,.42);border-radius:24px;background:rgba(255,255,255,.98);box-shadow:0 30px 80px rgba(0,0,0,.32);color:#172033}.backend-modal.wide{width:min(900px,96vw)}
.backend-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;padding:22px 24px 14px;border-bottom:1px solid #e6edf7}.backend-modal-head h2{font-size:25px;margin:0 0 5px}.backend-modal-head p{margin:0;color:#64748b;font-size:14px;line-height:1.6}.backend-close{border:0;width:34px;height:34px;border-radius:10px;background:#eef2f7;color:#475569;font-size:20px;cursor:pointer}.backend-modal-body{padding:20px 24px 24px}
.auth-mascot{display:flex;align-items:center;gap:14px;margin-bottom:15px}.auth-mascot-icon{width:64px;height:64px;border-radius:18px;background:linear-gradient(135deg,#4f8df7,#1d4ed8);display:grid;place-items:center;font-size:34px;box-shadow:0 10px 22px rgba(37,99,235,.28)}.auth-mascot strong{font-size:20px}.auth-mascot span{display:block;margin-top:4px;color:#64748b;font-size:13px}
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:5px;border-radius:13px;background:#eef3f9;margin:15px 0}.auth-tabs button{border:0;border-radius:9px;padding:10px;background:transparent;color:#64748b;font-weight:800;cursor:pointer}.auth-tabs button.active{background:#fff;color:#1d4ed8;box-shadow:0 3px 10px rgba(15,23,42,.1)}
.known-users{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:12px}.known-user{border:1px solid #dbe5f3;border-radius:999px;padding:6px 10px;background:#f8fbff;color:#34517a;cursor:pointer;font-weight:700}.known-user.active{border-color:#4f8df7;background:#e8f1ff;color:#1d4ed8}
.backend-field{display:grid;gap:6px;margin:13px 0}.backend-field label{font-size:13px;font-weight:800;color:#334155}.backend-field input,.backend-field select,.backend-field textarea{width:100%;border:1px solid #cfdbea;border-radius:11px;background:#fff;padding:11px 12px;color:#172033;font:inherit;outline:none}.backend-field textarea{min-height:90px;resize:vertical}.backend-field input:focus,.backend-field textarea:focus,.backend-field select:focus{border-color:#4f8df7;box-shadow:0 0 0 3px rgba(79,141,247,.13)}
.pin-display{display:flex;justify-content:center;gap:18px;margin:16px 0}.pin-dot{width:54px;height:54px;border-radius:16px;border:2px solid #cbd8e8;background:#f7faff;display:grid;place-items:center;font-size:27px;font-weight:900;color:#1d4ed8}.pin-dot.filled{border-color:#4f8df7;background:#e8f1ff}
.pin-keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;width:min(330px,100%);margin:0 auto}.pin-keypad button{height:52px;border:1px solid #d7e2f0;border-radius:14px;background:#f7faff;color:#18345d;font-size:20px;font-weight:900;cursor:pointer}.pin-keypad button:hover{background:#eaf2ff;border-color:#8eb4f7}.pin-keypad .minor{font-size:14px;color:#64748b;background:#f1f5f9}
.backend-primary{width:100%;border:0;border-radius:13px;padding:12px 16px;background:linear-gradient(135deg,#397be8,#1d4ed8);color:#fff;font-weight:900;font-size:16px;cursor:pointer;margin-top:15px;box-shadow:0 9px 20px rgba(37,99,235,.25)}.backend-primary:disabled{opacity:.55;cursor:not-allowed}.backend-secondary{border:1px solid #ccd9e9;border-radius:10px;padding:9px 12px;background:#fff;color:#334155;font-weight:800;cursor:pointer}.backend-danger{background:#fff0f2!important;color:#be123c!important;border-color:#fecdd3!important}
.backend-message{min-height:22px;margin-top:10px;text-align:center;font-size:13px;color:#be123c}.backend-note{padding:10px 12px;border-radius:11px;background:#fff8dc;color:#765400;font-size:12px;line-height:1.6;margin-top:13px}
.summary-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px}.summary-card{padding:13px;border:1px solid #dce6f2;border-radius:13px;background:#f8fbff}.summary-card b{display:block;font-size:23px;color:#1d4ed8}.summary-card span{font-size:12px;color:#64748b}.summary-list{display:grid;gap:8px}.summary-row{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid #e1e9f3;border-radius:11px;background:#fff}.summary-row small{color:#64748b}.summary-empty{padding:30px;text-align:center;color:#64748b;border:1px dashed #cbd5e1;border-radius:14px}
.random-levels{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.random-level{height:44px;border:1px solid #d7e2f0;border-radius:11px;background:#f8fbff;color:#25466f;font-weight:900;cursor:pointer}.random-level:hover{background:#e7f0ff;border-color:#77a7f4}
.backend-toast{position:fixed;z-index:12000;left:50%;bottom:28px;transform:translate(-50%,20px);opacity:0;pointer-events:none;padding:10px 16px;border-radius:999px;background:#13243d;color:#fff;box-shadow:0 10px 25px rgba(0,0,0,.25);transition:.2s;font-family:'Microsoft YaHei',sans-serif}.backend-toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:900px){.backend-toolbar{top:auto;bottom:12px;right:12px;left:12px;justify-content:center;overflow:auto}.backend-toolbar .tool-text{display:none}.summary-cards{grid-template-columns:repeat(2,1fr)}/* 课程学习页顶栏（第一排）窄屏兑底：上一题/完成下一题只保留图标，杜绝文字换行/省略号 */#cl-prev,#cl-next{flex-shrink:0!important;width:36px!important;padding-left:0!important;padding-right:0!important;font-size:0;overflow:hidden;text-align:center}#cl-prev::before{content:'◀';font-size:12px;font-weight:700}#cl-next::before{content:'▶';font-size:12px;font-weight:700}}
@media(max-width:540px){.backend-overlay{padding:10px}.backend-modal-head,.backend-modal-body{padding-left:16px;padding-right:16px}.random-levels{grid-template-columns:repeat(2,1fr)}.backend-toolbar{justify-content:flex-start}.backend-toolbar button,.backend-toolbar a{padding:0 9px}}
.crumb{display:inline-flex;align-items:center;gap:6px;margin-left:6px;font-size:12px;color:#64748b;min-width:0;max-width:50%}
.crumb a{color:#fff;text-decoration:none;font-weight:700;cursor:pointer;padding:7px 14px;border-radius:9px;font-size:14px;background:linear-gradient(135deg,#3478f6,#235fc7);border:1px solid #1d52ad;box-shadow:0 2px 8px rgba(52,120,246,.25)}
.crumb a:hover{background:linear-gradient(135deg,#286cea,#1d52ad);text-decoration:none;border-color:#153d8a;box-shadow:0 4px 14px rgba(52,120,246,.35);transform:translateY(-1px)}
.crumb .sep{color:#cbd5e1;font-weight:400}
.crumb .current{color:#334155;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
#cl-crumb{flex:0 1 auto}

/* ── 题目目录收起后的左侧数字图标列 ── */
#cl-toc-rail{flex-shrink:0}
.cl-rail-head{flex-shrink:0;width:100%;height:38px;border:none;border-bottom:1px solid #e6ebf2;background:#f8fafc;font-size:15px;cursor:pointer;color:#1e3a5f;display:flex;align-items:center;justify-content:center}
.cl-rail-head:hover{background:#eaf2ff;color:#1d4ed8}
.cl-rail-list{flex:1;overflow-y:auto;overflow-x:hidden;padding:7px 0;display:flex;flex-direction:column;gap:4px;align-items:center}
.cl-rail-item{position:relative;width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;line-height:1;cursor:pointer;flex-shrink:0;transition:transform .12s}
.cl-rail-item:hover{transform:scale(1.12)}
/* 数字边栏翻页：与数字列表连成序列链条 —— 链首「向前翻页」、链尾「向后翻页」，矢量箭头图标 */
.cl-rail-pg{flex-shrink:0;width:26px;height:26px;border-radius:50%;border:1.5px dashed #a8bdd8;background:#f4f8ff;color:#2563eb;font-size:0;line-height:1;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;transition:transform .12s,background .12s,border-color .12s,opacity .12s}
.cl-rail-pg svg{display:block}
.cl-rail-pg:hover:not(:disabled){background:#eaf2ff;border-color:#3478f6;transform:scale(1.12)}
.cl-rail-pg:disabled{opacity:.3;cursor:not-allowed}
.cl-rail-pg-txt{flex-shrink:0;text-align:center;font-size:9px;color:#64748b;font-weight:700;line-height:1;padding:5px 0 3px}
