@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap";
:root{--color-bg-base:#fafafa;--color-bg-surface:#f5f5f5;--color-bg-elevated:#fff;--color-bg-hover:#efefef;--color-bg-overlay:#fffc;--color-primary-50:#f9f9f9;--color-primary-100:#eaeaea;--color-primary-400:#666;--color-primary-500:#111;--color-primary-600:#000;--color-accent-400:#6366f1;--color-accent-500:#4f46e5;--color-accent-600:#4338ca;--color-success-400:#34d399;--color-success-500:#10b981;--color-warning-400:#fbbf24;--color-warning-500:#f59e0b;--color-danger-400:#f87171;--color-danger-500:#ef4444;--color-text-primary:#111;--color-text-secondary:#666;--color-text-muted:#888;--color-text-inverse:#fff;--color-border:#eaeaea;--color-border-strong:#d4d4d4;--color-border-focus:#111;--shadow-sm:0 1px 2px #0000000a;--shadow-md:0 4px 6px -1px #0000000d, 0 2px 4px -1px #00000008;--shadow-lg:0 10px 15px -3px #0000000d, 0 4px 6px -2px #00000006;--shadow-xl:0 20px 25px -5px #0000000d, 0 10px 10px -5px #00000005;--shadow-glow:none;--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono:"Menlo", "Monaco", "Courier New", monospace;--text-xs:.75rem;--text-sm:.875rem;--text-base:.9375rem;--text-lg:1.0625rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:1.75rem;--font-regular:400;--font-medium:500;--font-semibold:600;--tracking-tight:-.015em;--tracking-normal:-.005em;--tracking-wide:.01em;--radius-sm:3px;--radius-md:6px;--radius-lg:8px;--radius-xl:12px;--radius-full:9999px;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.5rem;--space-6:2rem;--space-8:3rem;--space-10:4rem;--sidebar-width:240px;--topbar-height:56px;--content-max-width:1100px}
*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-moz-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;height:100%;font-size:16px}body{font-family:var(--font-sans);font-size:var(--text-base);font-weight:var(--font-regular);line-height:var(--leading-normal);color:var(--color-text-primary);background-color:var(--color-bg-base);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100%}h1,h2,h3,h4,h5,h6{font-weight:var(--font-bold);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight);color:var(--color-text-primary)}h1{font-size:var(--text-4xl)}h2{font-size:var(--text-3xl)}h3{font-size:var(--text-2xl)}h4{font-size:var(--text-xl)}h5{font-size:var(--text-lg)}h6{font-size:var(--text-base)}p{line-height:var(--leading-relaxed);color:var(--color-text-secondary)}a{color:var(--color-primary-400);transition:color var(--transition-fast);text-decoration:none}a:hover{color:var(--color-accent-500)}strong{font-weight:var(--font-semibold);color:var(--color-text-primary)}ul,ol{list-style:none}img,video{max-width:100%;height:auto;display:block}input,textarea,select,button{font-family:inherit;font-size:inherit}button{cursor:pointer;background:0 0;border:none}input:focus-visible,textarea:focus-visible,select:focus-visible,button:focus-visible{outline:2px solid var(--color-border-focus);outline-offset:2px}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--color-bg-surface)}::-webkit-scrollbar-thumb{background:var(--color-neutral-700);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--color-neutral-600)}::selection{color:var(--color-text-primary);background-color:#1a56db4d}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInScale{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes shimmer{0%{background-position:-200%}to{background-position:200%}}@keyframes slideInRight{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}@keyframes slideInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn .3s var(--transition-base) both}.animate-fade-in-scale{animation:fadeInScale .2s var(--transition-base) both}.animate-slide-in-up{animation:slideInUp .3s var(--transition-base) both}.animate-pulse{animation:2s ease-in-out infinite pulse}.animate-spin{animation:1s linear infinite spin}.skeleton{background:linear-gradient(90deg, var(--color-bg-elevated) 25%, var(--color-bg-hover) 50%, var(--color-bg-elevated) 75%);border-radius:var(--radius-md);background-size:200% 100%;animation:1.5s infinite shimmer}
.btn{justify-content:center;align-items:center;gap:var(--space-2);font-size:var(--text-sm);font-weight:var(--font-medium);border-radius:var(--radius-md);cursor:pointer;white-space:nowrap;font-family:var(--font-sans);border:1px solid #0000;outline:none;padding:.5rem 1rem;text-decoration:none;transition:all .15s;display:inline-flex}.btn:focus-visible{box-shadow:0 0 0 2px var(--color-bg-base), 0 0 0 4px var(--color-primary-500)}.btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.btn--primary{background:var(--color-primary-500);color:#fff;border-color:var(--color-primary-600);box-shadow:0 1px 2px #0000001a}.btn--primary:hover{background:#222}.btn--primary:active{background:#000;transform:translateY(1px)}.btn--secondary{color:var(--color-text-primary);border-color:var(--color-border-strong);background:#fff;box-shadow:0 1px 2px #0000000d}.btn--secondary:hover{background:var(--color-bg-surface);border-color:#bdbdbd}.btn--secondary:active{background:var(--color-bg-hover);transform:translateY(1px)}.btn--ghost{color:var(--color-text-secondary);background:0 0}.btn--ghost:hover{background:var(--color-bg-hover);color:var(--color-text-primary)}.btn--ghost:active{transform:translateY(1px)}.btn--danger{color:var(--color-danger-500);border-color:var(--color-border);background:#fff}.btn--danger:hover{border-color:var(--color-danger-400);background:#fef2f2}.btn--sm{font-size:var(--text-sm);border-radius:var(--radius-sm);padding:.375rem .75rem}.btn--lg{font-size:var(--text-base);padding:.75rem 1.5rem}.btn--xl{font-size:var(--text-lg);border-radius:var(--radius-lg);padding:1rem 2rem}.btn--full-width{width:100%}
.auth-page{background:var(--color-bg-base);min-height:100vh;padding:var(--space-6);justify-content:center;align-items:center;display:flex}.auth-card{background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:var(--radius-lg);width:100%;max-width:400px;padding:var(--space-6) var(--space-8) var(--space-8);box-shadow:var(--shadow-sm);animation:.2s both fadeIn}.auth-card__logo{align-items:center;gap:var(--space-3);margin-bottom:var(--space-8);display:flex}.auth-card__logo-mark{border-radius:var(--radius-xl);background:var(--gradient-primary);width:40px;height:40px;font-size:var(--text-lg);font-weight:var(--font-extrabold);color:#fff;box-shadow:var(--shadow-glow);justify-content:center;align-items:center;display:flex}.auth-card__logo-text{font-size:var(--text-xl);font-weight:var(--font-extrabold);background:var(--gradient-primary);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.auth-card__title{font-size:var(--text-2xl);font-weight:var(--font-bold);color:var(--color-text-primary);letter-spacing:var(--tracking-tight);margin-bottom:var(--space-2)}.auth-card__subtitle{font-size:var(--text-sm);color:var(--color-text-secondary);margin-bottom:var(--space-6)}.auth-card__form{gap:var(--space-4);flex-direction:column;display:flex}.auth-divider{align-items:center;gap:var(--space-3);margin:var(--space-2) 0;display:flex}.auth-divider:before,.auth-divider:after{content:"";background:var(--color-border);flex:1;height:1px}.auth-divider__text{font-size:var(--text-xs);color:var(--color-text-muted);white-space:nowrap}.auth-google-btn{justify-content:center;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--color-bg-elevated);border:1.5px solid var(--color-border-strong);border-radius:var(--radius-lg);color:var(--color-text-primary);font-size:var(--text-sm);font-weight:var(--font-medium);transition:background var(--transition-fast), border-color var(--transition-fast);cursor:pointer;width:100%;display:flex}.auth-google-btn:hover{background:var(--color-bg-hover);border-color:var(--color-neutral-500)}.auth-card__footer{margin-top:var(--space-6);text-align:center;font-size:var(--text-sm);color:var(--color-text-muted)}.auth-card__footer a{color:var(--color-primary-400);font-weight:var(--font-medium)}.auth-error{align-items:flex-start;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);font-size:var(--text-sm);color:var(--color-danger-400);background:#ef44441a;border:1px solid #ef444433;animation:.2s both slideInUp;display:flex}.landing{background:var(--color-bg-base);min-height:100vh}.landing-nav{padding:var(--space-4) var(--space-8);z-index:var(--z-sticky);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border);background:#060e1ecc;justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.landing-nav__logo{align-items:center;gap:var(--space-3);text-decoration:none;display:flex}.landing-nav__logo-mark{border-radius:var(--radius-lg);background:var(--gradient-primary);width:36px;height:36px;font-weight:var(--font-extrabold);color:#fff;font-size:var(--text-sm);justify-content:center;align-items:center;display:flex}.landing-nav__logo-text{font-size:var(--text-lg);font-weight:var(--font-extrabold);background:var(--gradient-primary);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.landing-nav__links{align-items:center;gap:var(--space-6);display:flex}.landing-nav__link{font-size:var(--text-sm);color:var(--color-text-secondary);font-weight:var(--font-medium);transition:color var(--transition-fast)}.landing-nav__link:hover{color:var(--color-text-primary)}.landing-nav__actions{align-items:center;gap:var(--space-3);display:flex}.hero{max-width:var(--content-max-width);padding:var(--space-24) var(--space-8) var(--space-16);text-align:center;margin:0 auto;position:relative}.hero:before{content:"";background:var(--gradient-glow);pointer-events:none;width:800px;height:400px;position:absolute;top:0;left:50%;transform:translate(-50%)}.hero__eyebrow{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--font-semibold);color:var(--color-primary-400);letter-spacing:var(--tracking-wide);text-transform:uppercase;margin-bottom:var(--space-6);background:#1a56db1f;border:1px solid #1a56db40;display:inline-flex}.hero__title{font-size:clamp(var(--text-4xl), 6vw, var(--text-6xl));font-weight:var(--font-extrabold);color:var(--color-text-primary);letter-spacing:var(--tracking-tight);margin-bottom:var(--space-6);line-height:1.1}.hero__title-gradient{background:var(--gradient-primary);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.hero__subtitle{font-size:var(--text-lg);color:var(--color-text-secondary);max-width:560px;margin:0 auto var(--space-10);line-height:var(--leading-relaxed)}.hero__cta{justify-content:center;align-items:center;gap:var(--space-4);flex-wrap:wrap;display:flex}.features{max-width:var(--content-max-width);padding:var(--space-16) var(--space-8);margin:0 auto}.section-header{text-align:center;margin-bottom:var(--space-12)}.section-header__title{font-size:var(--text-3xl);font-weight:var(--font-bold);letter-spacing:var(--tracking-tight);margin-bottom:var(--space-4)}.section-header__subtitle{font-size:var(--text-base);color:var(--color-text-secondary);max-width:480px;margin:0 auto}.features__grid{gap:var(--space-6);grid-template-columns:repeat(3,1fr);display:grid}@media (max-width:1024px){.features__grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:640px){.features__grid{grid-template-columns:1fr}}.feature-card{background:var(--gradient-card);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-6);transition:border-color var(--transition-base), box-shadow var(--transition-base), transform var(--transition-base)}.feature-card:hover{box-shadow:var(--shadow-md);border-color:#1a56db4d;transform:translateY(-3px)}.feature-card__icon{border-radius:var(--radius-xl);width:44px;height:44px;color:var(--color-primary-400);margin-bottom:var(--space-4);background:#1a56db26;justify-content:center;align-items:center;font-size:1.25rem;display:flex}.feature-card__title{font-size:var(--text-base);font-weight:var(--font-semibold);color:var(--color-text-primary);margin-bottom:var(--space-2)}.feature-card__desc{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:var(--leading-relaxed)}.pricing{max-width:var(--content-max-width);padding:var(--space-16) var(--space-8);margin:0 auto}.pricing__grid{gap:var(--space-6);grid-template-columns:repeat(3,1fr);align-items:start;display:grid}@media (max-width:1024px){.pricing__grid{grid-template-columns:1fr;max-width:400px;margin:0 auto}}.pricing-card{background:var(--gradient-card);border:1px solid var(--color-border);border-radius:var(--radius-2xl);padding:var(--space-8);position:relative}.pricing-card--featured{box-shadow:var(--shadow-glow);border-color:#1a56db66;transform:scale(1.02)}.pricing-card__popular{background:var(--gradient-primary);color:#fff;font-size:var(--text-xs);font-weight:var(--font-bold);padding:4px var(--space-4);border-radius:var(--radius-full);white-space:nowrap;letter-spacing:var(--tracking-wide);position:absolute;top:-12px;left:50%;transform:translate(-50%)}.pricing-card__name{font-size:var(--text-lg);font-weight:var(--font-bold);color:var(--color-text-primary);margin-bottom:var(--space-2)}.pricing-card__price{align-items:baseline;gap:var(--space-1);margin-bottom:var(--space-6);display:flex}.pricing-card__amount{font-size:var(--text-4xl);font-weight:var(--font-extrabold);color:var(--color-text-primary);letter-spacing:var(--tracking-tight)}.pricing-card__period{font-size:var(--text-sm);color:var(--color-text-muted)}.pricing-card__features{gap:var(--space-3);margin-bottom:var(--space-8);flex-direction:column;display:flex}.pricing-card__feature{align-items:center;gap:var(--space-3);font-size:var(--text-sm);color:var(--color-text-secondary);display:flex}.pricing-card__check{width:16px;height:16px;color:var(--color-success-500);flex-shrink:0}.pwa-prompt{bottom:var(--space-6);width:calc(100% - var(--space-8));background:var(--color-bg-elevated);border:1px solid var(--color-border-strong);border-radius:var(--radius-2xl);max-width:420px;padding:var(--space-5);box-shadow:var(--shadow-xl);z-index:var(--z-toast);align-items:center;gap:var(--space-4);animation:slideInUp .4s var(--transition-spring) both;display:flex;position:fixed;left:50%;transform:translate(-50%)translateY(0)}.pwa-prompt__icon{border-radius:var(--radius-xl);background:var(--gradient-primary);width:48px;height:48px;font-size:var(--text-xl);font-weight:var(--font-extrabold);color:#fff;flex-shrink:0;justify-content:center;align-items:center;display:flex}.pwa-prompt__content{flex:1}.pwa-prompt__title{font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--color-text-primary);margin-bottom:2px}.pwa-prompt__desc{font-size:var(--text-xs);color:var(--color-text-muted)}.pwa-prompt__actions{gap:var(--space-2);flex-direction:column;flex-shrink:0;display:flex}.desktop-only{display:block}.mobile-only{display:none}@media (max-width:768px){.desktop-only{display:none!important}.mobile-only{display:block}.mobile-actions{margin-top:var(--space-6);margin-bottom:var(--space-8);padding:0 var(--space-2);justify-content:space-between;display:flex}.mobile-action-btn{align-items:center;gap:var(--space-2);cursor:pointer;background:0 0;border:none;flex-direction:column;padding:0;display:flex}.mobile-action-btn__icon{background:var(--color-bg-elevated);border:1px solid var(--color-border);width:56px;height:56px;color:var(--color-text-secondary);border-radius:50%;justify-content:center;align-items:center;display:flex}.mobile-action-btn__label{color:var(--color-text-secondary);text-align:center;max-width:60px;font-size:11px;font-weight:500;line-height:1.2}.mobile-section{margin-bottom:var(--space-8)}.mobile-section__header{margin-bottom:var(--space-4);justify-content:space-between;align-items:center;display:flex}.mobile-section__title{color:var(--color-text-primary);align-items:center;gap:var(--space-2);font-size:18px;font-weight:700;display:flex}.mobile-project-card{border-radius:var(--radius-lg);margin-bottom:var(--space-3);border:1px solid var(--color-border);background:#fff;display:flex;overflow:hidden;box-shadow:0 2px 8px #0000000a}.mobile-project-card__img{background:var(--color-bg-subtle);object-fit:cover;flex-shrink:0;width:80px;min-width:80px;height:80px}.mobile-project-card__content{padding:var(--space-3);flex:1;justify-content:space-between;align-items:center;display:flex}.mobile-project-card__info{flex-direction:column;gap:2px;display:flex}.mobile-project-card__title{color:var(--color-text-primary);font-size:14px;font-weight:600}.mobile-project-card__subtitle{color:var(--color-text-muted);font-size:12px}.mobile-project-card__action{width:32px;height:32px;color:var(--color-primary-500);background:#1a56db1a;border-radius:50%;justify-content:center;align-items:center;display:flex}.mobile-feed-grid{gap:var(--space-3);grid-template-columns:repeat(2,1fr);display:grid}.mobile-feed-item{border-radius:var(--radius-lg);aspect-ratio:4/5;background:var(--color-bg-subtle);position:relative;overflow:hidden}.mobile-feed-item__img{object-fit:cover;width:100%;height:100%}.mobile-feed-item__overlay{width:100%;padding:var(--space-3);color:#fff;gap:var(--space-1);background:linear-gradient(#0000,#0009);flex-direction:column;display:flex;position:absolute;bottom:0;left:0}.mobile-feed-item__user{align-items:center;gap:var(--space-2);display:flex}.mobile-feed-item__avatar{width:20px;height:20px;color:var(--color-text-primary);background:#fff;border-radius:50%;justify-content:center;align-items:center;font-size:10px;font-weight:700;display:flex}.mobile-feed-item__time{opacity:.8;font-size:10px}.mobile-feed-item__title{font-size:12px;font-weight:500}}