/* 项目实战独立页面样式 */
.projects-page{background:#f2f6f2;min-height:100vh}
.projects-topbar{display:flex;align-items:center;justify-content:space-between;height:60px;padding:0 28px;background:#24332f;color:#d9f2e5;position:sticky;top:0;z-index:5}
.projects-brand{font-size:15px;font-weight:800;letter-spacing:-.3px;color:#d9f2e5}
.projects-brand:hover{color:#fff}
.projects-home{color:#9fd0b4;font-size:11px}
.projects-home:hover{color:#fff}
.projects-main{display:grid;grid-template-columns:minmax(250px,320px) minmax(0,1fr);min-height:calc(100vh - 60px)}
.projects-side{border-right:1px solid #dde6df;background:#eef4ef;padding:20px 16px;overflow:auto;max-height:calc(100vh - 60px);position:sticky;top:60px}
.projects-side-title{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#9aa69f;font-size:10px;font-weight:800;letter-spacing:.08em;padding:4px 6px 10px}.projects-side-title span{padding:4px 7px;border-radius:10px;background:#dfeee4;color:#52856a;font-size:9px;letter-spacing:0;white-space:nowrap}
.projects-list{display:grid;gap:9px}
.project-item{display:flex;flex-direction:column;gap:7px;width:100%;padding:13px 14px;border:1px solid #dce6df;border-radius:11px;background:#fff;text-align:left}
.project-item:hover{border-color:#bcd9c6;background:#f7fbf8}
.project-item.current{border-color:#6fb38e;background:#e7f4ec;box-shadow:0 0 0 2px #d9efe2}
.project-item-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.project-item strong{font-size:12px;color:#42534a}
.project-item .project-difficulty{color:#c07835;font-size:9px;font-weight:800}
.project-item small{color:#9aa69f;font-size:9px;line-height:1.6}
.project-item .project-bar{height:5px;border-radius:5px;background:#e6efe8;overflow:hidden}
.project-item .project-bar span{display:block;height:100%;background:#6fb38e;border-radius:5px}
.project-item .project-bar-text{color:#5c9b75;font-size:9px;font-weight:800}
.projects-work{padding:28px 30px 50px;max-width:980px;width:100%;margin:0 auto}
.projects-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:18px}
.projects-head h1{margin:7px 0 8px;font-size:28px;letter-spacing:-1px}
.projects-head p{margin:0;color:#7f9286;font-size:12px;line-height:1.8;max-width:560px}
.projects-head .project-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.project-tag{padding:4px 10px;border-radius:6px;background:#eef5f0;color:#5c9b75;font-size:9px;font-weight:800}
.project-tag.difficulty{background:#fff4e5;color:#c07835}
.projects-tasks{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.project-task-tab{padding:8px 14px;border:1px solid #dce6df;border-radius:9px;background:#fff;color:#71877a;font-size:11px;font-weight:800}
.project-task-tab:hover{border-color:#bfd9c8;color:#3e7c58}
.project-task-tab.current{background:#273b34;border-color:#273b34;color:#fff}
.project-task-tab.done{color:#5c9b75}
.project-task-tab.done::before{content:'✓ ';color:#4fae74}
.projects-task-panel{background:#fff;border:1px solid #dce7df;border-radius:14px;padding:20px 22px;margin-bottom:16px}
.projects-task-panel h3{margin:0 0 11px;font-size:14px;letter-spacing:-.3px}
.projects-task-panel p{font-size:12px;line-height:1.9;color:#4f6257;margin:0 0 13px}
.projects-task-panel details{background:#f7faf7;border:1px solid #e3ebe5;border-radius:9px;padding:9px 12px;margin-bottom:11px}
.projects-task-panel details summary{cursor:pointer;color:#5c9b75;font-size:10px;font-weight:800}
.projects-task-panel details div{margin-top:7px;color:#7a8b80;font-size:11px;line-height:1.75}
.projects-expected{background:#fbf1de;border:1px solid #f0dfc2;border-radius:9px;padding:11px 13px}
.projects-expected>span{display:block;color:#b08a55;font-size:9px;font-weight:800;margin-bottom:6px}
.projects-expected pre{margin:0;color:#8a6a3a;font:11px/1.8 "DM Mono",monospace;white-space:pre-wrap}
.projects-reveal-row{display:flex;gap:9px;flex-wrap:wrap;margin-top:13px}
.projects-reference{margin-top:12px;border:1px solid #2c3a36;border-radius:9px;overflow:hidden;background:#141c1a}
.projects-ref-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;background:#1d2725;color:#9fd0b4;font-size:10px;font-weight:800}
.projects-ref-head .projects-btn{padding:6px 10px;font-size:10px}
.projects-reference pre{margin:0;padding:12px 14px;color:#dce9e0;font:11px/1.8 "DM Mono",monospace;white-space:pre-wrap;overflow:auto;max-height:320px}
.projects-done-row{display:flex;align-items:center;gap:10px;margin-top:13px}
.projects-done-row button{padding:8px 14px;border-radius:8px;border:1px solid #d5e4da;color:#5c9b75;font-size:11px;font-weight:800}
.projects-done-row button.is-done{background:#e3f5e9;border-color:#bfe3cc;color:#2f7a4e}
.projects-done-row span{color:#9aa69f;font-size:10px}
.projects-editor-panel{background:#1d2725;border-radius:14px;overflow:hidden;box-shadow:0 14px 34px rgba(31,41,40,.14)}
.projects-editor-head{display:flex;align-items:center;justify-content:space-between;height:44px;padding:0 16px;background:#263431;color:#94a39b;font-size:10px}
.projects-editor-status{font-size:9px;color:#72847b}
.projects-stdin{display:flex;align-items:center;gap:9px;padding:8px 15px;border-top:1px solid #2c3a36;background:#202b2a}
.projects-stdin label{color:#84938a;font-size:9px;white-space:nowrap}
.projects-stdin input{flex:1;min-width:0;border:1px solid #33453e;border-radius:6px;padding:7px 9px;background:#1a2321;color:#dce9e0;font:10px "DM Mono",monospace;outline:0}
.projects-stdin input:focus{border-color:#4f8a68}
.projects-editor{display:flex;align-items:stretch;height:300px;background:#202b2a;color:#dce9e0;font:13px/1.9 "DM Mono",monospace}
.projects-lines{flex:none;width:38px;padding:19px 8px 15px 10px;overflow:hidden;color:#62726a;text-align:right;user-select:none;background:#202b2a;border-right:1px solid #2c3a36;font:13px/1.9 "DM Mono",monospace}
.projects-body{position:relative;flex:1;min-width:0;overflow:hidden}
.projects-input,.projects-highlight{position:absolute;inset:0;margin:0;padding:19px 19px 15px 13px;border:0;background:transparent;font:13px/1.9 "DM Mono",monospace;white-space:pre;tab-size:4;word-break:normal;overflow-wrap:normal}
.projects-input{width:100%;height:100%;color:transparent;caret-color:#dce9e0;resize:none;outline:0;overflow:auto;z-index:2;box-shadow:none}
.projects-input::selection{background:rgba(112,198,157,.3)}
.projects-highlight{overflow:hidden;color:#dce9e0;z-index:1;pointer-events:none}
.projects-actions{display:flex;gap:9px;padding:13px 15px;background:#263431}
.projects-btn{padding:10px 16px;border-radius:8px;border:1px solid #3c4d47;color:#b8c8c0;font-size:11px;font-weight:800}
.projects-btn:disabled{opacity:.6;cursor:wait}
.projects-btn:not(:disabled):hover{background:#33433e}
.projects-btn-primary{background:#76c99c;border-color:#76c99c;color:#17372a}
.projects-btn-primary:not(:disabled):hover{background:#8bd6ab}
.projects-btn-submit{background:#e0b06a;border-color:#e0b06a;color:#3d2c14}
.projects-btn-submit:not(:disabled):hover{background:#ecc282}
.projects-btn-mistake{background:#3d2620;border-color:#5a352c;color:#f0a08c}
.projects-btn-mistake:not(:disabled):hover{background:#4a2c23}
.projects-btn-mistake:disabled{background:#233d30;border-color:#2f5540;color:#7fd6a4}
.projects-output{min-height:170px;max-height:440px;overflow:auto;padding:16px 18px;background:#1a2321;color:#c7d4cd;border-top:1px solid #2c3a36;font-size:11px;line-height:1.8}
.projects-output .output-placeholder{color:#7d8f84;text-align:center;padding:26px 0}
.projects-output pre{margin:10px 0;padding:12px 14px;border-radius:8px;background:#141c1a;color:#cfe0d6;font:11px/1.8 "DM Mono",monospace;white-space:pre-wrap;overflow:auto}
.projects-output .ok{color:#7fd6a4}
.projects-output .fail{color:#ef9a78}
.projects-output .warn{color:#e8c07e}
.projects-output h4{margin:14px 0 7px;font-size:10px;letter-spacing:.05em;color:#8fa59a}
.projects-output .issue{display:flex;gap:7px;padding:5px 0;border-bottom:1px dashed #2c3a36}
.projects-output .issue.error{color:#ef9a78}
.projects-output .issue.warning{color:#e8c07e}
.projects-output .issue.info{color:#9fd0b4}
.project-verdict{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border-radius:7px;font-size:11px;font-weight:800;margin-bottom:9px}
.project-verdict.is-good{background:#233d30;color:#8fe0ad}
.project-verdict.is-risky{background:#3d3323;color:#f0c98c}
.project-verdict.is-bad{background:#3d2620;color:#f0a08c}
.project-verdict.is-unclear{background:#2c3431;color:#aebdb5}
.reflection-hint{color:#9fd0b4;font-size:10px;line-height:1.7;margin:4px 0 8px}
#projectsReflectionInput{width:100%;min-height:80px;padding:10px 12px;border:1px solid #33453e;border-radius:8px;background:#141c1a;color:#dce9e0;font-size:11px;line-height:1.7;resize:vertical;outline:0;box-sizing:border-box}
#projectsReflectionInput:focus{border-color:#4f8a68}
.reflection-row{display:flex;align-items:center;gap:12px;margin-top:9px;flex-wrap:wrap}
.reflection-status{font-size:10px;line-height:1.6}
.reflection-status.ok{color:#7fd6a4}
.reflection-status.warn{color:#e8c07e}
@media(max-width:900px){.projects-main{grid-template-columns:1fr}.projects-side{position:static;max-height:none;border-right:0;border-bottom:1px solid #dde6df}.projects-work{padding:18px 14px 40px}}
.projects-access-denied{max-width:560px;margin:80px auto;padding:44px 36px;border:1px dashed #dfe8e1;border-radius:16px;background:#fff;text-align:center}
.projects-access-denied h1{margin:10px 0 8px;font-size:26px;letter-spacing:-.6px;color:#2d4538}
.projects-access-denied p{margin:0 0 22px;color:#85938b;font-size:12px;line-height:1.8}
