@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Noto+Sans+SC:wght@300;400;500;700&family=DM+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap";:root{--bg-page: #f7f7f9;--bg-surface: #ffffff;--bg-elevated: #f2f2f8;--border: #e4e4ec;--border-hover: #c4c4d8;--accent: #5b4cfa;--accent-hover: #4a3ce8;--accent-soft: rgba(91,76,250,.08);--accent-mid: rgba(91,76,250,.15);--text-primary: #1a1a2e;--text-secondary: #6b6b8a;--text-muted: #a0a0bc;--success: #10b981;--warning: #f59e0b;--danger: #ef4444;--shadow-sm: 0 1px 3px rgba(0,0,0,.06);--shadow-md: 0 4px 16px rgba(0,0,0,.08);--shadow-lg: 0 12px 40px rgba(0,0,0,.1);--shadow-accent: 0 4px 20px rgba(91,76,250,.28);--radius-xs: 4px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--radius-full: 9999px;--sidebar-width: 220px;--topbar-height: 56px;--transition: .18s ease}*{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--bg-page);color:var(--text-primary);font-family:DM Sans,Noto Sans SC,sans-serif;font-size:14px;line-height:1.6;min-height:100vh;-webkit-font-smoothing:antialiased}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-hover);border-radius:99px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:0 18px;height:36px;border-radius:var(--radius-sm);font-family:DM Sans,sans-serif;font-weight:500;font-size:14px;cursor:pointer;transition:all var(--transition);border:none;white-space:nowrap;-webkit-user-select:none;user-select:none;text-decoration:none}.btn:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.btn-primary{background:var(--accent);color:#fff;box-shadow:var(--shadow-accent)}.btn-primary:hover{background:var(--accent-hover);transform:translateY(-1px);box-shadow:0 6px 24px #5b4cfa61}.btn-outline{background:transparent;color:var(--text-primary);border:1.5px solid var(--border)}.btn-outline:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}.btn-ghost{background:transparent;color:var(--text-secondary);border:none}.btn-ghost:hover{background:var(--bg-elevated);color:var(--text-primary)}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover{background:#dc2626}.btn-sm{height:30px;padding:0 12px;font-size:13px;border-radius:var(--radius-xs)}.btn-lg{height:44px;padding:0 28px;font-size:15px;font-weight:600}.btn-icon{width:36px;padding:0}.input,.textarea{width:100%;background:var(--bg-surface);border:1.5px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-family:DM Sans,Noto Sans SC,sans-serif;font-size:14px;padding:9px 13px;transition:border-color var(--transition),box-shadow var(--transition);outline:none;resize:vertical}.input:focus,.textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.input::placeholder,.textarea::placeholder{color:var(--text-muted)}.textarea{min-height:90px}.card{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm)}.card:hover{box-shadow:var(--shadow-md)}label{display:block;font-size:12px;font-weight:500;color:var(--text-secondary);margin-bottom:6px}.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:var(--radius-full);font-size:11px;font-weight:600}.badge-purple{background:#5b4cfa1a;color:var(--accent)}.badge-green{background:#10b9811a;color:var(--success)}.badge-gold{background:#f59e0b1a;color:var(--warning)}.badge-red{background:#ef44441a;color:var(--danger)}.badge-gray{background:var(--bg-elevated);color:var(--text-secondary)}.badge-teal{background:#14b8a61a;color:#0d9488}.topbar{position:fixed;top:0;left:0;right:0;height:var(--topbar-height);background:var(--bg-surface);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 20px;gap:12px;z-index:200;box-shadow:var(--shadow-sm)}.topbar-logo{display:flex;align-items:center;gap:8px;font-weight:700;font-size:17px;color:var(--text-primary);text-decoration:none;flex-shrink:0}.topbar-logo .logo-icon{width:30px;height:30px;background:var(--accent);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px}.topbar-logo span{color:var(--accent)}.topbar-nav{display:flex;align-items:center;gap:2px;flex:1;margin-left:8px}.topbar-nav-item{display:flex;align-items:center;gap:6px;padding:6px 14px;border-radius:var(--radius-sm);font-size:14px;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all var(--transition);border:none;background:none;text-decoration:none}.topbar-nav-item:hover{background:var(--bg-elevated);color:var(--text-primary)}.topbar-nav-item.active{background:var(--accent-soft);color:var(--accent);font-weight:600}.topbar-actions{display:flex;align-items:center;gap:10px;margin-left:auto}.user-avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,var(--accent),#8b7cf7);display:flex;align-items:center;justify-content:center;color:#fff;font-size:13px;font-weight:700;cursor:pointer;flex-shrink:0;transition:transform var(--transition)}.user-avatar:hover{transform:scale(1.08)}.main-layout{display:flex;padding-top:var(--topbar-height);min-height:100vh}.sidebar{position:fixed;left:0;top:var(--topbar-height);width:var(--sidebar-width);height:calc(100vh - var(--topbar-height));background:var(--bg-surface);border-right:1px solid var(--border);padding:12px 8px;overflow-y:auto;z-index:50;display:flex;flex-direction:column;gap:2px}.sidebar-section{font-size:11px;font-weight:600;color:var(--text-muted);letter-spacing:.08em;text-transform:uppercase;padding:10px 12px 4px}.sidebar-item{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:var(--radius-sm);font-size:14px;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all var(--transition);border:none;background:none;width:100%;text-align:left}.sidebar-item:hover{background:var(--bg-elevated);color:var(--text-primary)}.sidebar-item.active{background:var(--accent-soft);color:var(--accent);font-weight:600}.sidebar-item .icon{font-size:17px;flex-shrink:0}.main-content{margin-left:var(--sidebar-width);flex:1;min-width:0;padding:28px 32px}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.page-title{font-size:22px;font-weight:700;color:var(--text-primary);letter-spacing:-.02em}.page-subtitle{font-size:13px;color:var(--text-secondary);margin-top:3px}.section-title{font-size:15px;font-weight:700;color:var(--text-primary);margin-bottom:14px;display:flex;align-items:center;gap:8px}.tools-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px;margin-bottom:36px}.tool-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;cursor:pointer;transition:all .22s ease;position:relative}.tool-card:hover{border-color:var(--accent);box-shadow:var(--shadow-md);transform:translateY(-3px)}.tool-card-thumb{aspect-ratio:16/9;background:linear-gradient(135deg,#eef,#f5f0ff);display:flex;align-items:center;justify-content:center;font-size:34px;overflow:hidden;position:relative}.tool-card-thumb img{width:100%;height:100%;object-fit:cover}.tool-card-body{padding:11px 14px 14px}.tool-card-title{font-size:13px;font-weight:600;color:var(--text-primary);margin-bottom:3px}.tool-card-desc{font-size:12px;color:var(--text-secondary);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.tool-card-badge{position:absolute;top:8px;left:8px}.project-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}.project-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;cursor:pointer;transition:all .22s ease;display:flex;flex-direction:column}.project-card:hover{border-color:var(--border-hover);box-shadow:var(--shadow-md);transform:translateY(-2px)}.project-card-cover{aspect-ratio:16/10;background:linear-gradient(135deg,#eef,#f5f0ff);display:flex;align-items:center;justify-content:center;font-size:38px;overflow:hidden;position:relative}.project-card-cover img{width:100%;height:100%;object-fit:cover}.project-card-body{padding:13px 14px 14px;flex:1;display:flex;flex-direction:column;gap:7px}.project-card-title{font-size:14px;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.project-card-meta{font-size:12px;color:var(--text-muted);display:flex;align-items:center;gap:6px}.project-card:hover .project-card-del-btn{opacity:1!important}.step-nav{display:flex;align-items:center;gap:0;margin-bottom:24px;background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:4px}.step-item{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;padding:8px 10px;border-radius:var(--radius-sm);font-size:13px;font-weight:500;color:var(--text-muted);cursor:pointer;transition:all var(--transition);white-space:nowrap}.step-item:hover{background:var(--bg-elevated);color:var(--text-primary)}.step-item.active{background:var(--accent);color:#fff;font-weight:600}.step-item.done{color:var(--success)}.step-num{width:20px;height:20px;border-radius:50%;background:var(--border);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700}.step-item.active .step-num{background:#ffffff40;color:#fff}.step-item.done .step-num{background:var(--success);color:#fff}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f0f1e8c;display:flex;align-items:center;justify-content:center;z-index:500;padding:24px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal{background:var(--bg-surface);border-radius:var(--radius-xl);padding:32px;width:100%;box-shadow:var(--shadow-lg);animation:modalIn .22s ease}@keyframes modalIn{0%{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:none}}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.modal-title{font-size:18px;font-weight:700;color:var(--text-primary)}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}@keyframes fadeUp{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}@keyframes shimmer{0%{background-position:-600px 0}to{background-position:600px 0}}.animate-fade-up{animation:fadeUp .3s ease forwards}.skeleton{background:linear-gradient(90deg,var(--bg-elevated) 25%,#fff 50%,var(--bg-elevated) 75%);background-size:600px 100%;animation:shimmer 1.4s infinite;border-radius:var(--radius-xs)}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.w-full{width:100%}.text-muted{color:var(--text-muted)}.text-sm{font-size:13px}.font-medium{font-weight:500}.font-semibold{font-weight:600}.divider{height:1px;background:var(--border);margin:16px 0}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.typewriter-cursor:after{content:"▋";display:inline-block;color:var(--accent);animation:blink .8s step-end infinite;margin-left:2px;font-size:.9em}.progress-ring{transform:rotate(-90deg)}.progress-ring__circle{transition:stroke-dashoffset .5s ease}.iconfont{font-family:iconfont!important;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon{display:inline-flex;align-items:center;justify-content:center}.icon-sm{font-size:14px}.icon-md{font-size:18px}.icon-lg{font-size:24px}.icon-xl{font-size:32px}