:root{--wlc-bg: #F8FAFC;--wlc-bg2: #FFFFFF;--wlc-bg3: #F1F5F9;--wlc-bg4: #E2E8F0;--wlc-border: #E2E8F0;--wlc-border2: #CBD5E1;--wlc-text: #0F172A;--wlc-text2: #334155;--wlc-text3: #64748B;--wlc-text4: #94A3B8;--wlc-accent: #2563EB;--wlc-accent2: #1D4ED8;--wlc-accent-light: #EFF6FF;--wlc-accent-subtle: #DBEAFE;--wlc-green: #10B981;--wlc-green-light: #D1FAE5;--wlc-blue: #0EA5E9;--wlc-blue-light: #E0F2FE;--wlc-red: #EF4444;--wlc-orange: #F59E0B;--wlc-purple: #7C3AED;--wlc-purple-light: #EDE9FE;--wlc-radius: 12px;--wlc-radius-sm: 8px;--wlc-shadow-sm: 0 1px 3px rgba(0,0,0,.06);--wlc-shadow-md: 0 4px 12px rgba(0,0,0,.08);--wlc-shadow-lg: 0 8px 24px rgba(0,0,0,.12);--wlc-transition: .2s cubic-bezier(.4,0,.2,1)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--wlc-bg);color:var(--wlc-text);min-height:100vh;overflow-y:auto;-webkit-font-smoothing:antialiased}.wlc-header{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:12px 32px;background:#ffffffd9;backdrop-filter:blur(12px);border-bottom:1px solid var(--wlc-border)}.wlc-header-left,.wlc-header-right{display:flex;align-items:center;gap:12px}.wlc-logo{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:700;color:var(--wlc-text);letter-spacing:-.3px}.wlc-logo svg{color:var(--wlc-accent)}.wlc-user-info{display:flex;align-items:center;gap:8px;padding:4px 12px 4px 4px;background:var(--wlc-bg3);border-radius:20px;border:1px solid var(--wlc-border);font-size:13px;color:var(--wlc-text2)}.wlc-user-avatar{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#2563eb,#1d4ed8);border-radius:50%;font-size:12px;font-weight:600;color:#fff}.wlc-tier-badge{padding:2px 8px;border-radius:10px;font-size:10px;font-weight:600;text-transform:uppercase;background:var(--wlc-bg4);color:var(--wlc-text3)}.wlc-tier-badge.tier-free{background:var(--wlc-bg4);color:var(--wlc-text3)}.wlc-tier-badge.tier-starter{background:#fef3c7;color:#b45309}.wlc-tier-badge.tier-pro{background:var(--wlc-purple-light);color:var(--wlc-purple)}.wlc-tier-badge.tier-enterprise{background:var(--wlc-green-light);color:var(--wlc-green)}.wlc-btn-icon{background:none;border:1px solid var(--wlc-border);color:var(--wlc-text4);width:36px;height:36px;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:var(--wlc-transition)}.wlc-btn-icon:hover{border-color:var(--wlc-red);color:var(--wlc-red);background:#fef2f2}.wlc-main{max-width:1200px;margin:0 auto;padding:40px 32px 80px}.wlc-hero{margin-bottom:32px}.wlc-hero h1{font-size:28px;font-weight:800;letter-spacing:-.5px;color:var(--wlc-text);margin-bottom:4px}.wlc-subtitle{color:var(--wlc-text3);font-size:14px}.wlc-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:40px}.wlc-action-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px 20px;background:var(--wlc-bg2);border:1px solid var(--wlc-border);border-radius:var(--wlc-radius);cursor:pointer;transition:var(--wlc-transition);color:var(--wlc-text);text-align:center;box-shadow:var(--wlc-shadow-sm)}.wlc-action-card:hover{border-color:var(--wlc-accent);transform:translateY(-2px);box-shadow:0 8px 24px #2563eb1a}.wlc-action-icon{width:52px;height:52px;display:flex;align-items:center;justify-content:center;background:var(--wlc-accent-light);border-radius:12px;margin-bottom:14px;color:var(--wlc-accent);transition:var(--wlc-transition)}.wlc-action-card:hover .wlc-action-icon{background:var(--wlc-accent-subtle);transform:scale(1.05)}.wlc-icon-blue{background:var(--wlc-blue-light);color:var(--wlc-blue)}.wlc-action-card:hover .wlc-icon-blue{background:#b5e3f9}.wlc-icon-green{background:var(--wlc-green-light);color:var(--wlc-green)}.wlc-action-card:hover .wlc-icon-green{background:#a7f3d0}.wlc-action-card h3{font-size:14px;font-weight:700;margin-bottom:4px;color:var(--wlc-text)}.wlc-action-card p{font-size:12px;color:var(--wlc-text4)}.wlc-section{margin-bottom:36px}.wlc-section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.wlc-section-header h2{font-size:15px;font-weight:700;color:var(--wlc-text);display:flex;align-items:center;gap:8px;letter-spacing:-.3px}.wlc-section-header h2 svg{color:var(--wlc-text4)}.wlc-count{background:var(--wlc-accent-light);color:var(--wlc-accent);padding:1px 8px;border-radius:10px;font-size:11px;font-weight:600}.wlc-section-actions{display:flex;align-items:center;gap:8px}.wlc-select{background:var(--wlc-bg2);border:1px solid var(--wlc-border);color:var(--wlc-text2);padding:6px 10px;border-radius:6px;font-size:12px;cursor:pointer;font-family:inherit}.wlc-select:focus{outline:none;border-color:var(--wlc-accent);box-shadow:0 0 0 3px #2563eb1a}.wlc-view-toggle{display:flex;border:1px solid var(--wlc-border);border-radius:6px;overflow:hidden}.wlc-view-btn{background:var(--wlc-bg2);border:none;color:var(--wlc-text4);padding:6px 8px;cursor:pointer;display:flex;transition:var(--wlc-transition)}.wlc-view-btn:hover{color:var(--wlc-text2)}.wlc-view-btn.active{background:var(--wlc-accent);color:#fff}.wlc-projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}.wlc-projects-grid.wlc-list-view{grid-template-columns:1fr;gap:4px}.wlc-project-card{position:relative;background:var(--wlc-bg2);border:1px solid var(--wlc-border);border-radius:var(--wlc-radius);overflow:hidden;cursor:pointer;transition:var(--wlc-transition);outline:none;box-shadow:var(--wlc-shadow-sm)}.wlc-project-card:hover,.wlc-project-card:focus-visible{border-color:var(--wlc-accent);transform:translateY(-2px);box-shadow:0 8px 20px #2563eb14}.wlc-card-thumb{width:100%;aspect-ratio:16/10;background:var(--wlc-bg3);overflow:hidden;display:flex;align-items:center;justify-content:center}.wlc-card-thumb img{width:100%;height:100%;object-fit:cover}.wlc-card-placeholder{color:var(--wlc-text4);opacity:.35}.wlc-card-info{padding:12px 14px 10px}.wlc-card-info h4{font-size:13px;font-weight:600;color:var(--wlc-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:4px}.wlc-card-meta{display:flex;align-items:center;gap:4px;font-size:11px;color:var(--wlc-text4)}.wlc-source-badge{font-size:12px;margin-left:auto}.wlc-card-actions{position:absolute;top:8px;right:8px;display:flex;gap:4px;opacity:0;transition:var(--wlc-transition)}.wlc-project-card:hover .wlc-card-actions{opacity:1}.wlc-card-del{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:#ffffffe6;backdrop-filter:blur(8px);border:1px solid var(--wlc-border);border-radius:6px;color:var(--wlc-text4);cursor:pointer;transition:var(--wlc-transition)}.wlc-card-del:hover{color:var(--wlc-red);border-color:#fecaca;background:#fef2f2}.wlc-list-view .wlc-project-card{display:flex;align-items:center;border-radius:var(--wlc-radius-sm)}.wlc-list-view .wlc-card-thumb{width:64px;min-width:64px;aspect-ratio:1;border-radius:var(--wlc-radius-sm) 0 0 var(--wlc-radius-sm)}.wlc-list-view .wlc-card-info{flex:1;padding:8px 14px}.wlc-list-view .wlc-card-actions{position:static;opacity:1;padding-right:12px}.wlc-plan-bar{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background:var(--wlc-bg2);border:1px solid var(--wlc-border);border-radius:var(--wlc-radius);box-shadow:var(--wlc-shadow-sm)}.wlc-plan-info{display:flex;align-items:center;gap:8px;font-size:13px}.wlc-plan-label{color:var(--wlc-text3)}.wlc-plan-name{font-weight:700;color:var(--wlc-accent)}.wlc-plan-detail{color:var(--wlc-text4);font-size:12px}.wlc-upgrade-btn{display:flex;align-items:center;gap:6px;padding:9px 22px;border-radius:10px;background:var(--wlc-accent);border:none;color:#fff;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;transition:var(--wlc-transition)}.wlc-upgrade-btn:hover{background:var(--wlc-accent2);transform:translateY(-1px);box-shadow:0 4px 12px #2563eb4d}.wlc-loading{display:flex;flex-direction:column;align-items:center;padding:40px;gap:12px;grid-column:1 / -1}.wlc-spinner{width:32px;height:32px;border:3px solid var(--wlc-border);border-top-color:var(--wlc-accent);border-radius:50%;animation:wlc-spin .8s linear infinite}@keyframes wlc-spin{to{transform:rotate(360deg)}}.wlc-loading p{color:var(--wlc-text4);font-size:13px}.wlc-empty{color:var(--wlc-text4);font-size:13px;padding:24px;text-align:center;grid-column:1 / -1}.wlc-modal-overlay{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;background:#0f172a66;backdrop-filter:blur(6px)}.wlc-modal{background:var(--wlc-bg2);border:1px solid var(--wlc-border);border-radius:var(--wlc-radius);padding:28px;width:420px;max-width:90vw;box-shadow:var(--wlc-shadow-lg)}.wlc-modal h3{font-size:18px;font-weight:700;margin-bottom:20px;color:var(--wlc-text)}.wlc-form-group{margin-bottom:24px}.wlc-form-group label{display:block;font-size:13px;color:var(--wlc-text3);margin-bottom:6px;font-weight:600}.wlc-form-group input{width:100%;padding:12px 16px;background:var(--wlc-bg2);border:1px solid var(--wlc-border);border-radius:10px;color:var(--wlc-text);font-size:14px;font-family:inherit;transition:var(--wlc-transition)}.wlc-form-group input::placeholder{color:var(--wlc-text4)}.wlc-form-group input:focus{outline:none;border-color:var(--wlc-accent);box-shadow:0 0 0 3px #2563eb1a}.wlc-modal-actions{display:flex;gap:10px;justify-content:flex-end}.wlc-btn{padding:10px 22px;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:var(--wlc-transition);border:none;font-family:inherit}.wlc-btn-primary{background:var(--wlc-accent);color:#fff}.wlc-btn-primary:hover{background:var(--wlc-accent2);transform:translateY(-1px);box-shadow:0 4px 12px #2563eb4d}.wlc-btn-secondary{background:var(--wlc-bg3);color:var(--wlc-text2);border:1px solid var(--wlc-border)}.wlc-btn-secondary:hover{border-color:var(--wlc-border2);background:var(--wlc-bg4)}@media(max-width:768px){.wlc-header{padding:10px 16px}.wlc-main{padding:24px 16px 60px}.wlc-actions{grid-template-columns:1fr}.wlc-hero h1{font-size:22px}.wlc-projects-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.wlc-plan-bar{flex-direction:column;gap:12px;text-align:center}}
