/* 紫微递进练习：沿用学堂设计令牌。阶段信息与反馈颜色均有语义。 */
.lp-overview,.lp-widget{margin:24px 0;padding:22px;border:1px solid var(--border-strong);border-radius:var(--radius-md);background:var(--paper-pure);color:var(--text);scroll-margin-top:110px}
.lp-overview{border-left:4px solid var(--seal-blue)}
.lp-overview h2,.lp-widget h3{font-family:var(--font-serif);font-size:1.25rem;line-height:1.5;margin:0 0 10px}
.lp-overview p,.lp-widget p{margin:10px 0;line-height:1.85;overflow-wrap:anywhere}
.lp-overview-progress{display:flex;flex-wrap:wrap;gap:8px 24px;margin:14px 0}
.lp-overview-progress span{display:block}
.lp-task-label{font-weight:700;color:var(--text2);font-size:.9rem}
.lp-muted,.lp-prerequisites,.lp-save{font-size:.86rem;color:var(--text2)}
.lp-heading{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 20px}
.lp-progress-label{font-size:.85rem;color:var(--text2)}
.lp-demo{border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:14px 0;margin:16px 0}
.lp-demo summary,.lp-reference summary{cursor:pointer;font-weight:700;padding:4px 0;line-height:1.7}
.lp-demo ol{padding-left:24px}
.lp-demo li{padding:8px 0}
.lp-demo li p{margin-bottom:0}
.lp-modes{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}
.lp-modes [aria-pressed="true"]{background:var(--ink-deep);color:var(--paper-pure);border-color:var(--ink-deep)}
.lp-given{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 20px;padding:14px;background:var(--paper-warm);border-radius:var(--radius-sm)}
.lp-given div{min-width:0}
.lp-given dt{font-size:.8rem;color:var(--text2)}
.lp-given dd{margin:0;overflow-wrap:anywhere;font-size:.92rem}
.lp-steps{list-style:decimal;padding-left:24px}
.lp-steps>li{padding:14px 0;border-bottom:1px solid var(--border)}
.lp-steps label,.lp-reflection>label,.lp-reference>label{display:block;font-weight:600;line-height:1.65;margin-bottom:8px}
.lp-steps input,.lp-steps select,.lp-reflection textarea,.lp-reference-search{display:block;width:100%;max-width:640px;min-height:44px;padding:10px 12px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--field-bg);color:var(--text);font:inherit;font-size:16px;line-height:1.6}
.lp-steps input[aria-invalid="true"],.lp-steps select[aria-invalid="true"]{border-color:var(--vermilion)}
.lp-steps input:focus-visible,.lp-steps select:focus-visible,.lp-reflection textarea:focus-visible,.lp-reference-search:focus-visible,.lp-widget button:focus-visible,.lp-widget summary:focus-visible,.lp-reference summary:focus-visible{outline:3px solid var(--seal-blue-soft);outline-offset:3px}
.lp-step-tools{margin-top:8px}
.lp-step-tools .btn{font-size:.83rem;min-height:36px;padding:6px 12px}
.lp-field-feedback{font-size:.91rem;min-height:0}
.lp-correct{color:var(--text);border-left:3px solid var(--jade);padding-left:9px}
.lp-needs-review,.lp-error{color:var(--vermilion)}
.lp-actions{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0 12px}
.lp-actions .btn{min-height:44px}
.lp-result:not(:empty){padding:14px;border-left:3px solid var(--seal-blue);background:var(--paper-warm);line-height:1.8;overflow-wrap:anywhere}
.lp-result:focus-visible{outline:2px solid var(--seal-blue-soft);outline-offset:3px}
.lp-checkpoint{border-top:3px solid var(--gold-dim)}
.learn-search-shell{max-width:var(--maxw);margin:0 auto;display:flex;align-items:center;gap:12px}
.learn-search-shell>.learn-search-wrap{flex:1;min-width:0}
.lp-learning-tools{flex:none}
.lp-learning-tools[hidden]{display:none}
.lp-learning-tools .btn{min-height:44px;white-space:nowrap}
.lp-reference-dialog{width:min(720px,calc(100vw - 2 * var(--gutter)));max-height:85vh;margin:auto;padding:24px;border:1px solid var(--border-strong);border-radius:var(--radius-md);background:var(--paper-pure);color:var(--text);box-shadow:var(--shadow-lg);overflow-y:auto}
.lp-reference-dialog::backdrop{background:rgba(0,0,0,.45)}
.lp-reference-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}
.lp-reference-heading h2{font-family:var(--font-serif);font-size:1.3rem;color:var(--ink-deep);margin:0}
.lp-reference{line-height:1.8}
.lp-reference p{margin:12px 0}
.lp-reference-dialog button:focus-visible{outline:3px solid var(--seal-blue-soft);outline-offset:3px}
.lp-reference>label{margin-top:12px}
.lp-table-wrap{overflow-x:auto;max-height:360px;overflow-y:auto;margin:14px 0;border:1px solid var(--border);border-radius:var(--radius-sm)}
.lp-table-wrap table{width:100%;border-collapse:collapse;min-width:290px;font-size:.9rem}
.lp-table-wrap th,.lp-table-wrap td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--border);white-space:nowrap}
.lp-table-wrap th{background:var(--paper-warm);position:sticky;top:0}
.lp-table-wrap caption{text-align:left;padding:10px;font-weight:600}
.lp-reference-empty{color:var(--text2)}
.lp-reflection{margin-top:22px;padding-top:16px;border-top:1px solid var(--border)}
.lp-reflection h4{font-size:1rem}
.lp-reflection textarea{margin-top:8px;resize:vertical}
.lp-reflection ul{list-style:none;padding:0}
.lp-reflection li{padding:8px 0}
.lp-reflection li label{display:flex;gap:9px;align-items:flex-start;font-size:.9rem}
.lp-reflection input[type="checkbox"]{min-width:18px;min-height:18px;margin-top:5px;accent-color:var(--seal-blue)}
@media(max-width:600px){
 .lp-overview,.lp-widget{padding:16px 12px;margin:18px 0;border-radius:var(--radius-sm)}
 .lp-overview h2,.lp-widget h3{font-size:1.1rem}
 .lp-given{grid-template-columns:1fr}
 .lp-steps{padding-left:21px}
 .lp-actions .btn{flex:1 1 130px;white-space:normal}
 .lp-modes .btn{flex:1 1 130px;white-space:normal}
 .lp-table-wrap th,.lp-table-wrap td{padding:8px}
 .learn-search-shell{gap:8px}
 .lp-learning-tools .btn{padding:8px 10px;font-size:.8rem}
 .lp-reference-dialog{width:calc(100vw - 24px);padding:16px}
}
@media print{.lp-reference-dialog,.lp-learning-tools{display:none!important}}
@media(prefers-reduced-motion:reduce){.lp-widget *,.lp-overview *{scroll-behavior:auto!important;transition:none!important}}

.lp-fill-progress{font-size:.85rem;color:var(--text2)}
.lp-guided-starter{padding:12px;background:var(--paper-warm);border-left:3px solid var(--gold-dim)}

/* T87 递进手做 UX：快捷胶囊 */
.lp-chips{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 4px}
.lp-chip{min-height:40px;padding:6px 16px;border-radius:999px;border:1px solid var(--border);background:var(--field-bg);color:var(--ink-deep);font-size:.92rem;cursor:pointer;transition:transform .12s ease}
.lp-chip:active{transform:scale(.96)}