@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&family=Space+Grotesk:wght@400;500;600;700&display=swap";:root{--primary:#1e293b;--secondary:#334155;--cta:#22c55e;--cta-hover:#16a34a;--bg:#0f172a;--bg-card:#1e293b;--bg-input:#162032;--border:#334155;--border-focus:#22c55e;--text:#94a3b8;--text-heading:#f8fafc;--text-muted:#64748b;--accent:#818cf8;--accent-bg:#818cf81f;--danger:#ef4444;--shadow:0 4px 24px #0000004d;--shadow-hover:0 8px 40px #0006;--radius:12px;--radius-sm:8px;--radius-full:9999px;--font-heading:"Space Grotesk", system-ui, sans-serif;--font-body:"DM Sans", system-ui, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, Consolas, monospace;font-family:var(--font-body);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px;line-height:1.6}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}*{box-sizing:border-box;margin:0;padding:0}body{min-height:100svh}#root{flex-direction:column;min-height:100svh;display:flex}::selection{color:var(--text-heading);background:#22c55e4d}:focus-visible{outline:2px solid var(--cta);outline-offset:2px}.app{flex-direction:column;flex:1;max-width:960px;margin:0 auto;padding:0 24px;display:flex}.app-header{text-align:center;padding:64px 0 48px}.app-header h1{font-family:var(--font-heading);letter-spacing:-1.5px;color:var(--text-heading);margin:0;font-size:56px;font-weight:700;line-height:1.1}.app-header h1 span{background:linear-gradient(135deg, var(--cta) 0%, var(--accent) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.subtitle{color:var(--text);margin-top:16px;font-size:18px;line-height:1.6}@media (width<=768px){.app-header{padding:40px 0 32px}.app-header h1{font-size:36px}.subtitle{font-size:16px}}footer{text-align:center;color:var(--text-muted);margin-top:auto;padding:48px 0 24px;font-size:13px}.suggest-form-container{width:100%;max-width:640px;margin:0 auto}.suggest-form{flex-direction:column;gap:28px;display:flex}.skill-input{flex-direction:column;gap:8px;display:flex}.skill-input label,.level-select label{font-family:var(--font-heading);color:var(--text-heading);letter-spacing:.02em;text-transform:uppercase;font-size:14px;font-weight:600;display:block}.tag-input-wrapper{border:1.5px solid var(--border);border-radius:var(--radius);background:var(--bg-input);cursor:text;padding:12px 16px;transition:border-color .2s,box-shadow .2s}.tag-input-wrapper:focus-within{border-color:var(--border-focus);box-shadow:0 0 0 3px #22c55e26}.tag-input-wrapper input{font-family:var(--font-body);color:var(--text-heading);background:0 0;border:none;outline:none;width:100%;padding:4px 0;font-size:16px}.tag-input-wrapper input::placeholder{color:var(--text-muted)}.tags{flex-wrap:wrap;gap:8px;display:flex}.tags:not(:empty){margin-bottom:8px}.tag{color:var(--cta);border-radius:var(--radius-full);letter-spacing:.01em;background:#22c55e1f;align-items:center;gap:6px;padding:5px 12px;font-size:13px;font-weight:500;transition:background .2s;display:inline-flex}.tag:hover{background:#22c55e33}.tag button{color:var(--cta);cursor:pointer;opacity:.7;background:0 0;border:none;align-items:center;padding:0;font-size:15px;line-height:1;transition:opacity .2s;display:flex}.tag button:hover{opacity:1}.level-select{flex-direction:column;gap:8px;display:flex}.level-select select{border:1.5px solid var(--border);border-radius:var(--radius);width:100%;font-family:var(--font-body);background:var(--bg-input);color:var(--text-heading);cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394A3B8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-position:right 16px center;background-repeat:no-repeat;padding:12px 44px 12px 16px;font-size:16px;transition:border-color .2s,box-shadow .2s}.level-select select:focus{border-color:var(--border-focus);outline:none;box-shadow:0 0 0 3px #22c55e26}.submit-btn{font-family:var(--font-heading);letter-spacing:.02em;border-radius:var(--radius);background:var(--cta);color:#0f172a;cursor:pointer;border:none;padding:16px 32px;font-size:16px;font-weight:600;transition:background .2s,transform .2s,box-shadow .2s;position:relative;overflow:hidden}.submit-btn:hover:not(:disabled){background:var(--cta-hover);transform:translateY(-1px);box-shadow:0 4px 20px #22c55e4d}.submit-btn:active:not(:disabled){transform:translateY(0)}.submit-btn:disabled{opacity:.4;cursor:not-allowed}.error-message{color:#fca5a5;border-radius:var(--radius);background:#ef44441a;border:1px solid #ef444433;margin-top:20px;padding:14px 18px;font-size:14px}.suggestions-grid{grid-template-columns:1fr;gap:24px;margin-top:48px;padding-bottom:24px;display:grid}@media (width>=768px){.suggestions-grid{grid-template-columns:repeat(3,1fr)}}.suggestion-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);text-align:left;cursor:pointer;padding:24px;transition:transform .25s,box-shadow .25s,border-color .25s}.suggestion-card:hover{box-shadow:var(--shadow-hover);border-color:var(--text-muted);transform:translateY(-4px)}.card-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.industry-badge{background:var(--accent-bg);color:var(--accent);border-radius:var(--radius-full);letter-spacing:.02em;padding:4px 12px;font-size:12px;font-weight:600}.difficulty-badge{color:#0f172a;border-radius:var(--radius-full);letter-spacing:.04em;text-transform:uppercase;padding:4px 10px;font-size:11px;font-weight:700}.suggestion-card h3{font-family:var(--font-heading);color:var(--text-heading);margin:0 0 10px;font-size:18px;font-weight:600;line-height:1.3}.suggestion-card .description{color:var(--text);margin-bottom:20px;font-size:14px;line-height:1.7}.section{margin-bottom:16px}.section h4{font-family:var(--font-heading);color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;margin:0 0 8px;font-size:11px;font-weight:600}.tech-tags{flex-wrap:wrap;gap:6px;display:flex}.tech-tag{border:1px solid var(--border);color:var(--text-heading);border-radius:var(--radius-sm);font-size:12px;font-family:var(--font-mono);background:#1e293bcc;padding:3px 10px}.suggestion-card ul{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}.suggestion-card li{color:var(--text);align-items:center;gap:8px;font-size:13px;display:flex}.suggestion-card li:before{content:"";background:var(--cta);border-radius:50%;flex-shrink:0;width:6px;height:6px;display:inline-block}.est-weeks{border-top:1px solid var(--border);color:var(--text-muted);align-items:center;gap:6px;margin-top:20px;padding-top:16px;font-size:13px;display:flex}.est-weeks svg{width:14px;height:14px;stroke:var(--text-muted)}.skeleton-grid{grid-template-columns:1fr;gap:24px;margin-top:48px;display:grid}@media (width>=768px){.skeleton-grid{grid-template-columns:repeat(3,1fr)}}.skeleton-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:24px}.skeleton-line{background:linear-gradient(90deg, var(--secondary) 25%, #3b4a63 50%, var(--secondary) 75%);background-size:200% 100%;border-radius:6px;margin-bottom:12px;animation:1.5s ease-in-out infinite shimmer}.skeleton-line.w-20{width:30%;height:24px}.skeleton-line.w-60{width:70%;height:20px}.skeleton-line.w-full{width:100%;height:14px}.skeleton-line.w-80{width:85%;height:14px}.skeleton-line.w-40{width:45%;height:14px}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.suggestion-card{animation:.4s ease-out both fadeInUp}.suggestion-card:first-child{animation-delay:0s}.suggestion-card:nth-child(2){animation-delay:.1s}.suggestion-card:nth-child(3){animation-delay:.2s}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}