@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Outfit:wght@300;400;500;600;700;800;900&display=swap";:root{--bg:#faf9f6;--card-bg:#ffffffbf;--text:#5c5565;--text-h:#110e16;--border:#00000014;--code-bg:#f3f1e8;--accent:#7c3aed;--accent-bg:#7c3aed14;--accent-border:#7c3aed4d;--shadow:0 4px 20px -2px #0000000d, 0 2px 8px -1px #00000005;--sans:"Inter", system-ui, -apple-system, sans-serif;--heading:"Outfit", "Inter", system-ui, sans-serif;--mono:ui-monospace, Consolas, monospace;font-family:var(--sans);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background-color:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px;line-height:1.5;transition:background-color .3s,color .3s}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}[data-theme=dark]{--bg:#0f1013;--card-bg:#14151ab3;--text:#9ca3af;--text-h:#f3f4f6;--border:#ffffff0f;--code-bg:#191b22;--accent:#c084fc;--accent-bg:#c084fc1f;--accent-border:#c084fc66;--shadow:0 10px 30px -10px #0000004d, 0 4px 12px -2px #00000026}body{background-color:var(--bg);min-height:100vh;margin:0;padding:0;transition:background-color .3s}#root{box-sizing:border-box;flex-direction:column;min-height:100vh;display:flex}h1,h2,h3,h4,h5,h6{font-family:var(--heading);color:var(--text-h);margin:0;font-weight:700}code{font-family:var(--mono);background-color:var(--code-bg);color:var(--accent);border-radius:4px;padding:2px 6px;font-size:.9em;font-weight:500}*{box-sizing:border-box}.app-portal{box-sizing:border-box;width:100%;min-height:100vh;color:var(--text,#6b6375);flex-direction:column;display:flex}.portal-header{z-index:100;-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border,#e5e4e7);background:#ffffffb3;transition:background .3s,border-color .3s;position:sticky;top:0}[data-theme=dark] .portal-header{background:#16171db3;border-color:#ffffff0d}.header-container{justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;padding:16px 24px;display:flex}.logo-section{align-items:center;gap:10px;display:flex}.logo-dot{background:linear-gradient(135deg, var(--accent,#aa3bff) 0%, #3b82f6 100%);border-radius:50%;width:12px;height:12px;display:inline-block;box-shadow:0 0 10px #aa3bff80}.portal-header h1{letter-spacing:-.5px;color:var(--text-h,#08060d);background:linear-gradient(135deg, var(--text-h,#08060d) 30%, var(--accent,#aa3bff) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin:0;font-size:20px;font-weight:800}[data-theme=dark] .portal-header h1{background:linear-gradient(135deg, #fff 40%, var(--accent,#c084fc) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.portal-main{box-sizing:border-box;flex-direction:column;flex-grow:1;gap:40px;width:100%;max-width:1200px;margin:0 auto;padding:48px 24px;display:flex}.hero-section{text-align:center;flex-direction:column;gap:16px;max-width:800px;margin:0 auto;display:flex}.hero-section h2{letter-spacing:-1.2px;color:var(--text-h,#08060d);margin:0;font-size:42px;font-weight:800;line-height:1.15}@media (width<=768px){.hero-section h2{font-size:32px}}.hero-section p{color:var(--text,#6b6375);font-size:16px;line-height:1.6}.controls-section{flex-direction:column;align-items:center;gap:20px;width:100%;max-width:680px;margin:0 auto;display:flex}.search-bar-wrapper{align-items:center;width:100%;display:flex;position:relative}.search-icon{width:18px;height:18px;color:var(--text,#6b6375);pointer-events:none;opacity:.7;position:absolute;left:18px}.search-input{border:1px solid var(--border,#e5e4e7);background:var(--bg,#fff);width:100%;color:var(--text-h,#08060d);border-radius:30px;outline:none;padding:14px 44px 14px 48px;font-size:15px;transition:all .3s cubic-bezier(.16,1,.3,1);box-shadow:0 4px 20px #00000005}[data-theme=dark] .search-input{box-shadow:0 4px 20px #00000026}.search-input:focus{border-color:var(--accent,#aa3bff);box-shadow:0 6px 24px #aa3bff14}[data-theme=dark] .search-input:focus{box-shadow:0 6px 24px #c084fc1f}.clear-btn{background:var(--border,#e5e4e7);cursor:pointer;width:20px;height:20px;color:var(--bg,#fff);border:none;border-radius:50%;justify-content:center;align-items:center;font-size:14px;line-height:1;display:flex;position:absolute;right:16px}.category-filters{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.filter-btn{background:var(--code-bg,#f4f3ec);color:var(--text,#6b6375);cursor:pointer;border:1px solid #0000;border-radius:20px;padding:8px 18px;font-size:13px;font-weight:600;transition:all .2s cubic-bezier(.16,1,.3,1)}.filter-btn:hover{background:var(--border,#e5e4e7);color:var(--text-h,#08060d)}.filter-btn.active{background:var(--accent,#aa3bff);color:#fff;box-shadow:0 4px 12px #aa3bff40}[data-theme=dark] .filter-btn.active{background:var(--accent,#c084fc);color:#16171d;box-shadow:0 4px 12px #c084fc40}.grid-section{width:100%}.grid-layout{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:24px;display:grid}.animate-fade-in{animation:.5s cubic-bezier(.16,1,.3,1) forwards listFadeIn}@keyframes listFadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.app-card.skeleton{cursor:default;pointer-events:none}.app-card.skeleton:hover{box-shadow:none;transform:none}.skeleton-header{background:linear-gradient(90deg, var(--code-bg,#f4f3ec) 25%, var(--border,#e5e4e7) 50%, var(--code-bg,#f4f3ec) 75%);background-size:200% 100%;height:80px;animation:1.5s infinite loadingShimmer}.skeleton-body{flex-direction:column;gap:12px;padding:24px;display:flex}.skeleton-line{background:linear-gradient(90deg, var(--code-bg,#f4f3ec) 25%, var(--border,#e5e4e7) 50%, var(--code-bg,#f4f3ec) 75%);background-size:200% 100%;border-radius:4px;height:14px;animation:1.5s infinite loadingShimmer}.skeleton-line.short{width:60%}.skeleton-tags{gap:8px;margin-top:12px;display:flex}.skeleton-tag{background:linear-gradient(90deg, var(--code-bg,#f4f3ec) 25%, var(--border,#e5e4e7) 50%, var(--code-bg,#f4f3ec) 75%);background-size:200% 100%;border-radius:6px;width:60px;height:20px;animation:1.5s infinite loadingShimmer}@keyframes loadingShimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.error-state{text-align:center;flex-direction:column;align-items:center;gap:16px;padding:60px 20px;display:flex}.error-icon{color:#ef4444;width:48px;height:48px}.retry-btn{background:var(--accent,#aa3bff);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:10px 24px;font-weight:600;transition:background .2s}.retry-btn:hover{background:#9026e3}.empty-state{text-align:center;color:var(--text,#6b6375);padding:80px 20px;font-size:15px}.portal-footer{border-top:1px solid var(--border,#e5e4e7);text-align:center;padding:32px 24px;font-size:13px;transition:border-color .3s}[data-theme=dark] .portal-footer{border-color:#ffffff0d}.portal-footer p{margin:0;line-height:1.6}.footer-meta{opacity:.7;font-size:11px;margin-top:8px!important}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg,#fff)}::-webkit-scrollbar-thumb{background:var(--border,#e5e4e7);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text,#6b6375)}.app-card{background:var(--card-bg,#fff9);border:1px solid var(--border,#00000014);cursor:pointer;-webkit-backdrop-filter:blur(8px);text-align:left;border-radius:16px;flex-direction:column;height:100%;transition:all .4s cubic-bezier(.16,1,.3,1);display:flex;position:relative;overflow:hidden;box-shadow:0 4px 30px #00000008}[data-theme=dark] .app-card{background:var(--card-bg,#16171d99);border:1px solid var(--border,#ffffff0d);box-shadow:0 4px 30px #0003}.app-card:hover{border-color:var(--accent,#aa3bff);transform:translateY(-6px);box-shadow:0 12px 30px #aa3bff1f}[data-theme=dark] .app-card:hover{box-shadow:0 12px 30px #c084fc33}.card-header-bg{flex-direction:column;gap:12px;padding:24px 24px 12px;display:flex;position:relative}.category-badge{text-transform:uppercase;letter-spacing:.5px;border-radius:20px;align-self:flex-start;padding:4px 10px;font-size:11px;font-weight:600}.category-badge.development{color:#3b82f6;background:#3b82f61a;border:1px solid #3b82f633}.category-badge.education{color:#10b981;background:#10b9811a;border:1px solid #10b98133}.card-title{color:var(--text-h,#08060d);margin:0;font-size:22px;font-weight:700;transition:color .3s}.app-card:hover .card-title{color:var(--accent,#aa3bff)}.card-body{flex-direction:column;flex-grow:1;justify-content:space-between;gap:16px;padding:0 24px 20px;display:flex}.card-desc{color:var(--text,#6b6375);-webkit-line-clamp:3;-webkit-box-orient:vertical;margin:0;font-size:14px;line-height:1.6;display:-webkit-box;overflow:hidden}.card-tags{flex-wrap:wrap;gap:6px;display:flex}.card-tag{background:var(--code-bg,#f4f3ec);color:var(--text,#6b6375);font-size:12px;font-family:var(--sans);border-radius:6px;padding:2px 8px}.card-tag.extra{font-weight:600}.card-footer{border-top:1px solid var(--border,#0000000d);justify-content:flex-end;align-items:center;padding:16px 24px;display:flex}.learn-more{color:var(--text,#6b6375);align-items:center;gap:6px;font-size:13px;font-weight:600;transition:all .3s;display:flex}.app-card:hover .learn-more{color:var(--accent,#aa3bff)}.arrow-icon{width:14px;height:14px;transition:transform .3s cubic-bezier(.16,1,.3,1)}.app-card:hover .arrow-icon{transform:translate(4px)}.carousel{aspect-ratio:16/9;background:var(--code-bg,#f4f3ec);border-radius:12px;width:100%;position:relative;overflow:hidden;box-shadow:inset 0 2px 8px #0000000d}.carousel-track-container{width:100%;height:100%;position:relative}.carousel-track{height:100%;transition:transform .5s cubic-bezier(.4,0,.2,1);display:flex}.carousel-slide{flex:0 0 100%;justify-content:center;align-items:center;width:100%;height:100%;display:flex;overflow:hidden}.carousel-slide img{object-fit:cover;width:100%;height:100%;display:block}.placeholder-gradient{color:#fff;text-align:center;box-sizing:border-box;background:linear-gradient(135deg,#aa3bff 0%,#3b82f6 50%,#10b981 100%);flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:20px;display:flex}[data-theme=dark] .placeholder-gradient{background:linear-gradient(135deg,#7c3aed 0%,#1d4ed8 50%,#065f46 100%)}.placeholder-gradient h3{color:#fff;text-shadow:0 2px 10px #0003;margin:0 0 8px;font-size:28px;font-weight:700}.placeholder-gradient p{opacity:.85;text-shadow:0 1px 5px #0000001a;font-size:14px}.slide-fallback{border-radius:12px}.carousel-btn{color:#000;cursor:pointer;z-index:10;-webkit-backdrop-filter:blur(4px);background:#ffffffb3;border:1px solid #ffffff4d;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;transition:all .2s;display:flex;position:absolute;top:50%;transform:translateY(-50%)}[data-theme=dark] .carousel-btn{color:#fff;background:#16171d99;border-color:#ffffff1a}.carousel-btn:hover{background:var(--accent,#aa3bff);color:#fff;border-color:var(--accent);transform:translateY(-50%)scale(1.1)}.prev-btn{left:16px}.next-btn{right:16px}.carousel-btn svg{width:20px;height:20px}.carousel-dots{z-index:10;gap:8px;display:flex;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}.carousel-dot{cursor:pointer;background:#fff6;border:none;border-radius:50%;width:8px;height:8px;padding:0;transition:all .2s}[data-theme=dark] .carousel-dot{background:#ffffff4d}.carousel-dot.active{background:#fff;border-radius:4px;width:20px}[data-theme=dark] .carousel-dot.active{background:var(--accent,#c084fc)}.modal-overlay{-webkit-backdrop-filter:blur(12px);z-index:1000;background:#00000073;justify-content:center;align-items:center;width:100vw;height:100vh;animation:.3s cubic-bezier(.16,1,.3,1) forwards fadeIn;display:flex;position:fixed;top:0;left:0}.modal-container{background:var(--bg,#fff);border:1px solid var(--border,#e5e4e7);border-radius:24px;width:90%;max-width:960px;max-height:90vh;animation:.4s cubic-bezier(.16,1,.3,1) forwards scaleUp;position:relative;overflow-y:auto;box-shadow:0 25px 50px -12px #00000040}[data-theme=dark] .modal-container{background:#1e1f26;border-color:#ffffff14}.modal-close{background:var(--code-bg,#0000000d);cursor:pointer;z-index:1010;width:36px;height:36px;color:var(--text-h,#08060d);border:none;border-radius:50%;justify-content:center;align-items:center;transition:all .2s;display:flex;position:absolute;top:20px;right:20px}.modal-close:hover{background:var(--accent,#aa3bff);color:#fff;transform:rotate(90deg)}.modal-close svg{width:18px;height:18px}.modal-content{grid-template-columns:1.2fr 1fr;gap:32px;padding:40px;display:grid}@media (width<=768px){.modal-content{grid-template-columns:1fr;padding:30px 20px 20px}.modal-close{top:12px;right:12px}}.modal-gallery{width:100%}.modal-info{text-align:left;flex-direction:column;display:flex}.modal-badge{text-transform:uppercase;border-radius:20px;align-self:flex-start;margin-bottom:12px;padding:4px 10px;font-size:11px;font-weight:600}.modal-badge.development{color:#3b82f6;background:#3b82f61a;border:1px solid #3b82f633}.modal-badge.education{color:#10b981;background:#10b9811a;border:1px solid #10b98133}.modal-title{color:var(--text-h,#08060d);margin:0 0 12px;font-size:28px;font-weight:800}.modal-meta-tags{flex-wrap:wrap;gap:8px;margin-bottom:24px;display:flex}.meta-tag{color:var(--accent,#aa3bff);font-size:13px;font-weight:500}.modal-description{margin-bottom:32px}.modal-description h3{color:var(--text-h,#08060d);margin:0 0 8px;font-size:16px;font-weight:700}.modal-description p{color:var(--text,#6b6375);white-space:pre-line;margin:0;font-size:14px;line-height:1.7}.modal-actions{gap:12px;margin-top:auto;display:flex}@media (width<=480px){.modal-actions{flex-direction:column}}.action-btn{cursor:pointer;box-sizing:border-box;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-size:14px;font-weight:600;text-decoration:none;transition:all .2s;display:inline-flex}.action-btn.primary{background:linear-gradient(135deg, var(--accent,#aa3bff) 0%, #7c3aed 100%);color:#fff;box-shadow:0 4px 15px #aa3bff4d}.action-btn.primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #aa3bff66}.action-btn.secondary{background:var(--code-bg,#f4f3ec);color:var(--text-h,#08060d);border:1px solid var(--border,#e5e4e7)}.action-btn.secondary:hover{background:var(--border,#e5e4e7);transform:translateY(-2px)}.btn-icon{width:14px;height:14px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleUp{0%{opacity:0;transform:scale(.95)translateY(10px)}to{opacity:1;transform:scale(1)translateY(0)}}.theme-toggle{background:var(--card-bg,#fff3);border:1px solid var(--border,#e5e4e7);cursor:pointer;color:var(--text-h,#08060d);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(10px);border-radius:50%;justify-content:center;align-items:center;padding:10px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.theme-toggle:hover{background:var(--accent-bg,#aa3bff1a);border-color:var(--accent,#aa3bff);transform:rotate(15deg)scale(1.1)}.theme-toggle svg{width:20px;height:20px;stroke:var(--text-h,#08060d)}.sun-icon{animation:12s linear infinite rotate-sun}@keyframes rotate-sun{0%{transform:rotate(0)}to{transform:rotate(360deg)}}