:root{--portal-primary:#6366f1;--portal-primary-light:#818cf8;--portal-primary-dark:#4f46e5;--portal-secondary:#0ea5e9;--portal-sidebar-bg:#1e293b;--portal-sidebar-width:260px;--portal-navbar-height:64px;--portal-card-radius:16px;--portal-transition:0.3s cubic-bezier(0.4,0,0.2,1)}*,:after,:before{box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f8fafc;color:#1e293b;margin:0;padding:0}.portal-layout{display:flex;min-height:100vh}.portal-sidebar{background:var(--portal-sidebar-bg);display:flex;flex-direction:column;height:100vh;left:0;overflow-y:auto;position:fixed;top:0;transition:transform var(--portal-transition);width:var(--portal-sidebar-width);z-index:40}.portal-main{display:flex;flex:1;flex-direction:column;margin-left:var(--portal-sidebar-width);min-height:100vh}.portal-navbar{backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);background:hsla(0,0%,100%,.85);border-bottom:1px solid #e2e8f0;height:var(--portal-navbar-height);position:sticky;top:0;z-index:30}.portal-content{flex:1;padding:32px}.sidebar-brand{border-bottom:1px solid hsla(0,0%,100%,.08);padding:24px 20px}.sidebar-nav-item{align-items:center;border-radius:10px;color:#94a3b8;display:flex;font-size:14px;font-weight:500;gap:12px;margin:2px 12px;padding:10px 20px;text-decoration:none;transition:all var(--portal-transition)}.sidebar-nav-item:hover{background:hsla(0,0%,100%,.06);color:#e2e8f0}.sidebar-nav-item.active{background:linear-gradient(135deg,var(--portal-primary),var(--portal-primary-dark));box-shadow:0 4px 12px rgba(99,102,241,.3);color:#fff}.sidebar-nav-item .nav-icon,.sidebar-nav-item svg{flex-shrink:0;height:20px;width:20px}.sidebar-section-title{color:#475569;font-size:11px;font-weight:700;letter-spacing:.08em;padding:20px 20px 8px;text-transform:uppercase}.content-card{background:#fff;border:1px solid #f1f5f9;border-radius:var(--portal-card-radius);box-shadow:0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04);overflow:hidden;transition:all var(--portal-transition)}.content-card:hover{border-color:#e2e8f0;box-shadow:0 20px 40px rgba(0,0,0,.08),0 8px 16px rgba(0,0,0,.04);transform:translateY(-4px)}.content-card .card-image{height:200px;object-fit:cover;width:100%}.content-card .card-body{padding:20px}.content-card .card-title{color:#0f172a;font-size:18px;font-weight:700;line-height:1.4;margin:0 0 8px}.content-card .card-description{color:#64748b;font-size:14px;line-height:1.6;margin:0}.content-card .card-badge{align-items:center;border-radius:9999px;display:inline-flex;font-size:12px;font-weight:600;letter-spacing:.02em;padding:4px 12px}.badge-free{background:#ecfdf5;color:#059669}.badge-pro{background:#eff6ff;color:#2563eb}.badge-premium{background:#fef3c7;color:#d97706}.content-grid{display:grid;gap:24px;grid-template-columns:repeat(1,1fr)}@media (min-width:640px){.content-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width:1024px){.content-grid{grid-template-columns:repeat(3,1fr)}}.video-wrapper{border-radius:12px;height:0;margin-top:12px;overflow:hidden;padding-bottom:56.25%;position:relative}.video-wrapper iframe{border:0;border-radius:12px;height:100%;left:0;position:absolute;top:0;width:100%}.filter-bar{align-items:center;display:flex;flex-wrap:wrap;gap:12px;margin-bottom:28px}.filter-search{background:#fff;border:2px solid #e2e8f0;border-radius:12px;flex:1;font-family:inherit;font-size:14px;min-width:240px;outline:none;padding:12px 16px 12px 44px;transition:all var(--portal-transition)}.filter-search:focus{border-color:var(--portal-primary);box-shadow:0 0 0 4px rgba(99,102,241,.1)}.filter-pill{background:#fff;border:2px solid #e2e8f0;border-radius:9999px;color:#475569;cursor:pointer;font-size:13px;font-weight:600;padding:8px 18px;transition:all var(--portal-transition);white-space:nowrap}.filter-pill:hover{background:#eef2ff;border-color:var(--portal-primary-light);color:var(--portal-primary)}.filter-pill.active{background:var(--portal-primary);border-color:var(--portal-primary);box-shadow:0 4px 12px rgba(99,102,241,.3);color:#fff}.user-badge{align-items:center;border-radius:9999px;display:inline-flex;font-size:12px;font-weight:600;gap:6px;padding:4px 12px}.user-badge-free{background:#f0fdf4;color:#16a34a}.user-badge-pro{background:#eff6ff;color:#2563eb}.user-badge-premium{background:linear-gradient(135deg,#fef3c7,#fde68a);color:#b45309}.user-avatar{align-items:center;background:linear-gradient(135deg,var(--portal-primary),var(--portal-secondary));border-radius:50%;color:#fff;display:flex;flex-shrink:0;font-size:14px;font-weight:700;height:36px;justify-content:center;width:36px}.empty-state{color:#94a3b8;padding:64px 24px;text-align:center}.empty-state svg{height:64px;margin:0 auto 16px;opacity:.5;width:64px}.empty-state h3{color:#475569;font-size:18px;font-weight:600;margin:0 0 8px}.empty-state p{font-size:14px;margin:0}.locked-overlay{position:relative}.locked-overlay:after{align-items:center;backdrop-filter:blur(4px);background:hsla(0,0%,100%,.7);border-radius:var(--portal-card-radius);content:"";display:flex;inset:0;justify-content:center;position:absolute}@media (max-width:1023px){.portal-sidebar{transform:translateX(-100%)}.portal-sidebar.sidebar-open{transform:translateX(0)}.portal-main{margin-left:0}.portal-content{padding:20px 16px}.sidebar-overlay{background:rgba(0,0,0,.5);display:none;inset:0;position:fixed;z-index:35}.sidebar-overlay.active{display:block}}.portal-sidebar::-webkit-scrollbar{width:4px}.portal-sidebar::-webkit-scrollbar-track{background:transparent}.portal-sidebar::-webkit-scrollbar-thumb{background:hsla(0,0%,100%,.1);border-radius:4px}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in-up{animation:fadeInUp .5s ease-out forwards}.content-card{animation:fadeInUp .4s ease-out forwards}.content-grid .content-card:first-child{animation-delay:.05s}.content-grid .content-card:nth-child(2){animation-delay:.1s}.content-grid .content-card:nth-child(3){animation-delay:.15s}.content-grid .content-card:nth-child(4){animation-delay:.2s}.content-grid .content-card:nth-child(5){animation-delay:.25s}.content-grid .content-card:nth-child(6){animation-delay:.3s}