.proj-detail-hero { background: linear-gradient(135deg, #1a1a2e 0%, #e67e22 100%); }
    .download-btn { background: #e67e22; box-shadow: 0 4px 15px rgba(0,0,0,0.2); }
    .btn-next-proj { background: #e67e22; }

    .proj-detail-hero { padding: 50px 0 40px; color: #fff; }
    .badge-level { display:inline-block; background:rgba(255,255,255,0.2); color:#fff; font-size:0.78rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; padding:5px 16px; border-radius:50px; margin-bottom:16px; }
    .proj-detail-hero h1 { font-size:clamp(1.8rem,4vw,2.8rem); font-weight:800; margin-bottom:12px; }
    .proj-detail-hero p { font-size:1.05rem; color:rgba(255,255,255,0.85); max-width:600px; line-height:1.7; }
    .hero-meta { display:flex; gap:24px; flex-wrap:wrap; margin-top:20px; }
    .hero-meta span { font-size:0.85rem; color:rgba(255,255,255,0.75); display:flex; align-items:center; gap:6px; }
    .proj-back { display:inline-flex; align-items:center; gap:6px; color:rgba(255,255,255,0.75); text-decoration:none; font-size:0.88rem; margin-bottom:20px; transition:color 0.2s; }
    .proj-back:hover { color:#fff; }
    .proj-content { padding:50px 0; }
    .proj-section-title { font-size:1.4rem; font-weight:700; color:var(--text-blue); margin-bottom:18px; padding-bottom:10px; border-bottom:2px solid rgba(37,38,94,0.08); }
    body.dark-theme .proj-section-title { color:#fff; border-color:rgba(255,255,255,0.08); }
    .learn-list { list-style:none; padding:0; }
    .learn-list li { display:flex; align-items:flex-start; gap:12px; padding:10px 0; border-bottom:1px solid rgba(37,38,94,0.05); font-size:0.95rem; color:#555; line-height:1.6; }
    body.dark-theme .learn-list li { color:#bbb; border-color:rgba(255,255,255,0.05); }
    .step-card { background:var(--white); border-radius:12px; padding:24px; margin-bottom:20px; border:1px solid rgba(37,38,94,0.07); border-left:4px solid #e67e22; box-shadow:0 2px 8px rgba(37,38,94,0.05); }
    body.dark-theme .step-card { background:#1e1e38; border-color:rgba(255,255,255,0.07); border-left-color:#e67e22; }
    .feat-icon { font-size:1.3rem; margin-bottom:10px; }
    .step-card h3 { font-size:1.05rem; font-weight:700; color:var(--text-blue); margin-bottom:8px; }
    body.dark-theme .step-card h3 { color:#fff; }
    .step-card p { font-size:0.92rem; color:#666; line-height:1.7; margin-bottom:0; }
    body.dark-theme .step-card p { color:#aaa; }
    .download-box { border-radius:16px; padding:36px; text-align:center; background: linear-gradient(135deg, #f8f9ff, #eff1ff); border: 1px solid rgba(0,0,0,0.08); }
    body.dark-theme .download-box { background:linear-gradient(135deg,#1a1a30,#1e1e38) !important; border-color:rgba(255,255,255,0.1) !important; }
    .download-box h3 { font-size:1.3rem; font-weight:700; color:var(--text-blue); margin-bottom:8px; }
    body.dark-theme .download-box h3 { color:#fff; }
    .download-box > p { color:#666; margin-bottom:20px; font-size:0.95rem; }
    body.dark-theme .download-box > p { color:#aaa; }
    .download-btn { display:inline-flex; align-items:center; gap:10px; color:#fff; padding:14px 32px; border-radius:50px; font-weight:700; font-size:1rem; text-decoration:none; transition:all 0.3s; }
    .download-btn:hover { color:#fff; transform:translateY(-2px); filter:brightness(0.9); }
    .proj-nav { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; padding:30px 0; border-top:1px solid rgba(37,38,94,0.08); margin-top:20px; }
    body.dark-theme .proj-nav { border-color:rgba(255,255,255,0.08); }
    .proj-nav a { display:inline-flex; align-items:center; gap:8px; padding:10px 24px; border-radius:50px; font-weight:600; text-decoration:none; font-size:0.9rem; transition:all 0.3s; }
    .btn-back-proj { background:rgba(37,38,94,0.07); color:var(--text-blue); }
    body.dark-theme .btn-back-proj { background:rgba(255,255,255,0.08); color:#ccc; }
    .btn-back-proj:hover { background:var(--text-blue); color:#fff; }
    .btn-next-proj { color:#fff; }
    .btn-next-proj:hover { filter:brightness(0.9); color:#fff; }
    .code-header { background:#1e1e2e; border-radius:10px 10px 0 0; padding:10px 16px; display:flex; align-items:center; justify-content:space-between; }
    .code-lang { color:#ccc; font-size:0.8rem; font-family:monospace; letter-spacing:0.5px; }
    .code-copy-btn { background:rgba(255,255,255,0.1); border:none; color:#ccc; font-size:0.78rem; padding:4px 12px; border-radius:4px; cursor:pointer; transition:all 0.2s; }
    .code-copy-btn:hover { background:rgba(255,255,255,0.2); color:#fff; }