:root{--primary:#22c55e;--primary-dark:#16a34a;--primary-light:#4ade80;--secondary:#28c76f;--accent:#00cfe8;--warning:#ff9f43;--surface-1:#161622;--surface-2:#1c1c2e;--surface-3:#242438;--text-primary:#f4f4f8;--text-secondary:#c4c4d4;--text-muted:#9a9ab0;--border-subtle:rgba(255, 255, 255, 0.1);--border-medium:rgba(255, 255, 255, 0.16);--radius-sm:6px;--radius-md:8px;--radius-lg:12px}body{background:var(--surface-1);min-height:100vh}.container-xxl,.content-wrapper,.layout-wrapper{background:0 0}.page-header{background:0 0;border:1px solid var(--border-subtle);border-radius:var(--radius-lg);margin-bottom:1.75rem}.page-header-content{padding:1.5rem 1.75rem}.page-title{font-size:1.5rem;font-weight:700;color:var(--text-primary);display:flex;align-items:center;gap:.5rem;margin-bottom:.25rem}.page-title i{color:var(--primary)}.page-subtitle{color:var(--text-muted);font-size:.9rem;margin:0}.hero-cta{background:var(--surface-2);border:1px solid var(--border-subtle);border-left:3px solid var(--primary);border-radius:var(--radius-lg);padding:1.25rem 1.5rem;margin-bottom:1.25rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}.hero-cta-title{font-size:1rem;font-weight:600;color:var(--text-primary);display:flex;align-items:center;gap:.5rem;margin-bottom:.25rem}.hero-cta-text{color:var(--text-muted);font-size:.85rem;margin:0}.hero-cta-btn{background:var(--primary);color:#fff;padding:.5rem 1.25rem;border-radius:var(--radius-md);font-weight:600;font-size:.85rem;text-decoration:none;white-space:nowrap;display:flex;align-items:center;gap:.4rem;transition:background .2s}.hero-cta-btn:hover{background:var(--primary-dark);color:#fff}.progress-overview{background:var(--surface-2);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:1rem 1.25rem;margin-bottom:1.5rem}.progress-overview-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.progress-label{color:var(--text-secondary);font-size:.85rem}.progress-count{color:var(--primary);font-size:.85rem;font-weight:600}.progress-bar-track{background:var(--surface-3);border-radius:4px;height:6px;overflow:hidden}.progress-bar-fill{background:var(--primary);height:100%;border-radius:4px;width:0;transition:width .8s ease}.section-upcoming{background:var(--surface-2);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);margin-bottom:1.5rem;overflow:hidden}.section-upcoming-header{padding:1rem 1.25rem;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border-subtle)}.section-upcoming-title{font-size:.95rem;font-weight:600;color:var(--text-primary);margin:0;display:flex;align-items:center;gap:.4rem}.section-upcoming-body{padding:.75rem 1.25rem}.section-upcoming.collapsed .section-upcoming-body{display:none}.section-upcoming.collapsed .collapse-toggle i{transform:rotate(180deg)}.collapse-toggle{background:0 0;border:none;color:var(--text-muted);cursor:pointer;padding:.25rem}.upcoming-lab-item{display:flex;align-items:center;gap:1rem;padding:.5rem 0;font-size:.85rem;text-decoration:none;color:inherit}.upcoming-lab-item+.upcoming-lab-item{border-top:1px solid var(--border-subtle)}.upcoming-lab-thumb{width:32px;height:32px;border-radius:var(--radius-sm);object-fit:cover;flex-shrink:0}.upcoming-lab-info{display:flex;align-items:center;gap:.5rem;flex:1}.upcoming-lab-name{color:var(--text-primary);font-weight:500}.upcoming-lab-meta{display:flex;align-items:center;gap:1rem;flex-shrink:0}.upcoming-lab-date{color:var(--text-muted);display:flex;align-items:center;gap:.25rem}.upcoming-lab-xp{color:var(--primary);font-weight:600}.handson-filters{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;margin-bottom:1.5rem;padding:1rem 1.25rem;background:var(--surface-2);border:1px solid var(--border-subtle);border-radius:var(--radius-lg)}.filter-group{display:flex;flex-wrap:wrap;gap:.75rem;flex:1}.filter-pills{display:flex;gap:.35rem;flex-wrap:wrap}.filter-pill{background:var(--surface-3);color:var(--text-muted);border:1px solid transparent;border-radius:16px;padding:.3rem .85rem;font-size:.78rem;cursor:pointer;transition:all .2s}.filter-pill:hover{color:var(--text-secondary);border-color:var(--border-medium)}.filter-pill.active{background:rgba(34,197,94,.15);color:var(--primary);border-color:rgba(34,197,94,.3)}.filter-search{display:flex;align-items:center;gap:.5rem;background:var(--surface-3);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:.35rem .75rem}.filter-search i{color:var(--text-muted);font-size:.85rem}.filter-search-input{background:0 0;border:none;color:var(--text-primary);font-size:.8rem;outline:0;width:160px}.filter-search-input::placeholder{color:var(--text-muted)}.filter-info{display:flex;align-items:center;gap:.5rem}.filter-count{color:var(--text-muted);font-size:.8rem}.filter-reset-btn{background:0 0;color:var(--primary);border:1px solid rgba(34,197,94,.3);border-radius:var(--radius-sm);padding:.2rem .6rem;font-size:.75rem;cursor:pointer}.handson-modules{display:flex;flex-direction:column;gap:1.5rem}.module-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem;padding-bottom:.5rem}.module-title-area{display:flex;align-items:center;gap:.5rem}.module-icon{width:28px;height:28px;border-radius:var(--radius-sm);background:rgba(34,197,94,.12);display:flex;align-items:center;justify-content:center}.module-name{font-weight:600;color:var(--text-primary);font-size:1rem}.module-lab-count{color:var(--text-muted);font-size:.8rem;font-weight:400}.module-progress{color:var(--text-muted);font-size:.8rem}.module-labs{display:flex;flex-direction:column;gap:.5rem;padding-left:.75rem;border-left:2px solid var(--border-subtle)}.handson-card{background:var(--surface-2);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:.85rem 1rem;display:flex;align-items:center;gap:.85rem;transition:border-color .2s,background .2s;border-left:3px solid var(--surface-3)}.handson-card:hover{border-color:var(--border-medium);background:rgba(28,28,46,.8)}.handson-card-completed{border-left-color:var(--primary)}.handson-card-in-progress{border-left-color:var(--warning)}.handson-card-locked{opacity:.7}.handson-card-thumb{position:relative;flex-shrink:0}.handson-thumb{width:44px;height:44px;border-radius:var(--radius-md);object-fit:cover}.handson-thumb-fallback{width:44px;height:44px;border-radius:var(--radius-md);background:linear-gradient(135deg,var(--surface-3),var(--surface-2));display:flex;align-items:center;justify-content:center;color:var(--text-muted);font-size:1.2rem}.thumb-completed,.thumb-lock{position:absolute;inset:0;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:1rem}.thumb-lock{background:rgba(0,0,0,.6);color:var(--text-muted)}.thumb-completed{background:rgba(34,197,94,.2);color:var(--primary)}.handson-card-body{flex:1;min-width:0}.handson-card-title-row{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.handson-card-name{font-weight:600;color:var(--text-primary);font-size:.9rem;text-decoration:none}a.handson-card-name:hover{color:var(--primary)}.handson-card-badges{display:flex;gap:.35rem}.badge-english-only,.badge-free,.badge-locked,.badge-new,.badge-pro{font-size:.65rem;padding:.1rem .45rem;border-radius:4px;display:flex;align-items:center;gap:.2rem;white-space:nowrap}.badge-locked{background:rgba(255,255,255,.06);color:var(--text-muted)}.badge-pro{background:rgba(255,159,67,.15);color:var(--warning)}.badge-new{background:rgba(34,197,94,.15);color:var(--primary)}.badge-free{background:rgba(34,197,94,.12);color:#22c55e}.badge-english-only{background:rgba(0,207,232,.1);color:var(--accent)}.handson-card-skills{display:flex;gap:.35rem;margin-top:.3rem;flex-wrap:wrap;align-items:center}.skill-tag{background:var(--surface-3);color:var(--text-muted);padding:.1rem .5rem;border-radius:4px;font-size:.65rem}.handson-card-meta{display:flex;align-items:center;gap:.35rem;margin-top:.3rem}.badge-difficulty{padding:.1rem .5rem;border-radius:4px;font-size:.65rem;font-weight:500}.handson-card-status{flex-shrink:0;font-size:.8rem}.status-completed{color:var(--primary);display:flex;align-items:center;gap:.3rem}.status-in-progress{color:var(--warning)}.status-not-started{color:var(--text-muted)}.btn-upgrade-sm{background:rgba(255,159,67,.12);color:var(--warning);border:1px solid rgba(255,159,67,.25);border-radius:var(--radius-sm);padding:.25rem .65rem;font-size:.75rem;text-decoration:none;display:flex;align-items:center;gap:.3rem;white-space:nowrap}.btn-upgrade-sm:hover{background:rgba(255,159,67,.2);color:var(--warning)}.no-results{text-align:center;padding:3rem 1rem;color:var(--text-muted);font-size:.95rem}.no-results i{font-size:2rem;display:block;margin-bottom:.75rem}.bg-label-success{background:rgba(34,197,94,.15);color:#22c55e}.bg-label-primary{background:rgba(0,207,232,.12);color:#00cfe8}.bg-label-warning{background:rgba(255,159,67,.15);color:#ff9f43}.bg-label-danger{background:rgba(239,68,68,.15);color:#ef4444}.bg-label-info{background:rgba(168,85,247,.12);color:#a855f7}@media (max-width:768px){.hero-cta{flex-direction:column;align-items:flex-start}.handson-filters{flex-direction:column;align-items:stretch}.filter-search-input{width:100%}.handson-card{flex-wrap:wrap}.handson-card-status{width:100%;text-align:right;padding-top:.5rem;border-top:1px solid var(--border-subtle)}}@media (max-width:576px){.page-header-content{padding:1rem 1.25rem}.page-title{font-size:1.25rem}.handson-card{padding:.75rem}.handson-thumb,.handson-thumb-fallback{width:36px;height:36px}}