:root{--brand-orange: #FF8C42;--primary: #6366F1;--primary-2: #8B5CF6;--primary-gradient: linear-gradient(90deg, #6366F1, #8B5CF6);--accent-teal: #06B6D4;--surface: #ffffff;--surface-muted: #F8FAFC;--text: #111827;--text-muted: #6B7280;--border: #E5E7EB;--primary-color: var(--primary);--primary-600: #4F46E5;--primary-700: #4338CA;--secondary-color: #6B7280;--secondary-600: #4B5563;--accent: var(--accent-teal);--success-color: #4CAF50;--danger-color: #F44336;--text-color: var(--text);--bg-color: var(--surface);--bg-cream: var(--surface-muted);--border-color: var(--border);--shadow: 0 10px 25px rgba(17, 24, 39, .05);--gradient-hero: var(--primary-gradient)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.6;color:var(--text-color);background-color:var(--bg-color)}#app{min-height:100vh;display:flex;flex-direction:column}.app-header{background:var(--surface);color:var(--text-color);padding:15px 40px;display:flex;justify-content:space-between;align-items:center;box-shadow:var(--shadow)}.header-content{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}.header-content:hover{opacity:.8}.header-logo{width:32px;height:32px}.header-text{display:flex;flex-direction:column;gap:2px}.header-title{font-size:1.5em;font-weight:900;font-family:Arial Black,Arial,sans-serif;color:var(--text-color);line-height:1}.header-tagline{font-size:.75em;font-weight:500;color:var(--text-muted);letter-spacing:.02em}.header-actions{display:flex;gap:10px}.btn{padding:10px 20px;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .3s ease;text-decoration:none;display:inline-block}.btn-primary{background-color:var(--primary-color);color:#fff}.btn-primary:hover{background-color:var(--danger-color);transform:translateY(-2px);box-shadow:0 4px 12px #ff6b6b4d}.btn-primary:disabled{background-color:var(--border);cursor:not-allowed;transform:none}.btn-secondary{background-color:var(--secondary-color);color:#fff}.btn-secondary:hover{background-color:var(--accent-teal);transform:translateY(-2px);box-shadow:0 4px 12px #4ecdc44d}.btn-danger{background-color:var(--danger-color);color:#fff}.btn-danger:hover{background-color:var(--danger-color)}.btn-google{background-color:#fff;color:var(--text-color);border:1px solid var(--border-color)}.btn-google:hover{background-color:var(--surface-muted)}.btn-sm{padding:6px 12px;font-size:12px}.btn-large{padding:15px 30px;font-size:16px}.btn-block{width:100%;display:block}.btn-icon{background:none;border:none;cursor:pointer;font-size:18px;padding:5px}.btn-icon:hover{opacity:.7}.alert{padding:15px 20px;margin:20px 40px;border-radius:6px;display:flex;justify-content:space-between;align-items:center;animation:slideDown .3s ease}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.alert-error{background-color:#f443361a;color:var(--danger-color);border-left:4px solid var(--danger-color)}.alert-success{background-color:#4caf501a;color:var(--success-color);border-left:4px solid var(--success-color)}.alert-close{background:none;border:none;font-size:24px;cursor:pointer;color:inherit;opacity:.7}.alert-close:hover{opacity:1}.landing-page{flex:1;background:var(--surface)}.hero-section{padding:80px 40px;text-align:center;position:relative;background:var(--surface);color:var(--text);overflow:hidden}.hero-section:before{content:"";position:absolute;inset:-10%;background:radial-gradient(600px 600px at 20% -10%,#EEF2FF 0%,transparent 60%),radial-gradient(500px 500px at 85% 0%,#ECFEFF 0%,transparent 55%),radial-gradient(400px 400px at -10% 50%,#FFF7ED 0%,transparent 50%);filter:blur(18px);opacity:.7;z-index:0;pointer-events:none}.hero-decor{position:absolute;inset:0;z-index:0;pointer-events:none}.hero-decor .sushi{position:absolute;opacity:.15;width:clamp(64px,10vw,120px);filter:drop-shadow(0 2px 4px rgba(0,0,0,.1));animation:sushiDrift var(--dur, 8s) ease-in-out infinite alternate;animation-delay:var(--delay, 0s);animation-play-state:running!important;will-change:transform;transform:translateZ(0)}.hero-decor .s1{top:8%;left:10%;--dur: 9s;--delay: .2s}.hero-decor .s2{top:15%;right:12%;--dur: 10s;--delay: .6s}.hero-decor .s3{top:45%;left:5%;--dur: 8.5s;--delay: .1s}.hero-decor .s4{top:52%;right:8%;--dur: 11s;--delay: .4s}.hero-decor .s5{bottom:10%;left:18%;--dur: 9.5s;--delay: .9s}.hero-decor .s6{bottom:8%;right:16%;--dur: 10.5s;--delay: .3s}@keyframes sushiDrift{0%{transform:translateZ(0) rotate(0)}25%{transform:translate3d(28px,-22px,0) rotate(2deg)}50%{transform:translate3d(-20px,18px,0) rotate(-2deg)}75%{transform:translate3d(22px,26px,0) rotate(1.5deg)}to{transform:translateZ(0) rotate(0)}}@media(max-width:640px){.hero-decor .s5,.hero-decor .s6{display:none}.hero-decor .sushi{width:clamp(48px,14vw,96px)}}.hero-content{max-width:900px;margin:0 auto;position:relative;z-index:1}.hero-logo{width:240px;max-width:60vw;margin-bottom:20px}.inline-brand-icon{width:20px;height:20px;vertical-align:-4px}.hero-badge{display:inline-block;background:#eef2ff;color:#4f46e5;padding:8px 20px;border-radius:20px;font-size:.9em;margin-bottom:20px;font-weight:600}.hero-title{font-size:3.5em;font-weight:700;margin-bottom:20px;line-height:1.2}.hero-subtitle{font-size:1.4em;margin-bottom:40px;opacity:.95;line-height:1.5}.hero-actions{display:flex;gap:20px;justify-content:center;margin-bottom:20px}.btn-hero-primary{background:var(--primary-gradient);color:#fff;padding:16px 40px;font-size:18px;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #6366f133}.btn-hero-primary:hover{transform:translateY(-2px);box-shadow:0 8px 24px #6366f140}.btn-hero-secondary{background-color:transparent;color:var(--text);padding:16px 40px;font-size:18px;font-weight:600;border:1px solid var(--border);border-radius:8px;cursor:pointer;transition:all .3s ease}.btn-hero-secondary:hover{background-color:var(--surface-muted);transform:translateY(-2px)}.hero-note{font-size:.9em;opacity:.9}.latest-articles-section{padding:40px;max-width:1200px;margin:0 auto;background:var(--surface)}.articles-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:40px}.article-card{background:var(--surface);padding:30px;border-radius:12px;box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s}.article-card:hover{transform:translateY(-5px);box-shadow:0 4px 16px #00000026}.article-title-link{text-decoration:none;color:inherit;display:block}.article-title-link:hover .article-title{color:var(--primary-color)}.article-title{font-size:1.3em;margin:0 0 10px;color:var(--text-color);transition:color .2s ease}.article-excerpt{color:var(--text-muted);line-height:1.6;margin-bottom:15px}.article-meta{font-size:.9em;color:var(--text-muted);margin-bottom:15px}.article-separator{margin:0 8px}.article-link{color:var(--primary-color);text-decoration:none;font-weight:600;display:inline-block;transition:color .2s}.article-link:hover{color:var(--primary-600)}.problems-solutions-section{padding:80px 40px;max-width:1200px;margin:0 auto;background:var(--surface-muted)}.section-title{font-size:2.5em;text-align:center;margin-bottom:50px;color:var(--text-color)}.section-subtitle{text-align:center;font-size:1.2em;color:var(--text-muted);margin-top:-30px;margin-bottom:50px}.comparison-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:40px}.problems-column,.solutions-column{background:var(--surface);padding:30px;border-radius:12px;box-shadow:0 4px 16px #00000014}.problems-column{border-left:4px solid var(--danger-color)}.solutions-column{border-left:4px solid var(--success-color)}.column-title{font-size:1.5em;margin-bottom:25px;font-weight:600}.problem-item,.solution-item{display:flex;align-items:flex-start;gap:12px;padding:15px 0;border-bottom:1px solid var(--border)}.problem-item:last-child,.solution-item:last-child{border-bottom:none}.problem-item .icon,.solution-item .icon{font-size:1.5em;flex-shrink:0}.problem-item .icon{filter:grayscale(100%)}.problem-item span:last-child,.solution-item span:last-child{font-size:1.05em;line-height:1.5;color:var(--text-color)}.how-it-works-section{padding:80px 40px;background:var(--surface)}.steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;max-width:1200px;margin:0 auto}.step-card{background:var(--surface);padding:30px;border-radius:12px;text-align:center;box-shadow:0 4px 16px #00000014;transition:transform .3s ease,box-shadow .3s ease}.step-card:hover{transform:translateY(-8px);box-shadow:0 8px 24px #0000001f}.step-number{width:60px;height:60px;background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.8em;font-weight:700;margin:0 auto 20px}.step-card h3{font-size:1.3em;margin-bottom:15px;color:var(--text-color)}.step-card p{color:var(--text-muted);line-height:1.6}.features-section{padding:80px 40px;max-width:1200px;margin:0 auto;background:var(--surface-muted)}.features-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;margin-top:50px}.feature-card{background:var(--surface);padding:30px;border-radius:12px;text-align:center;box-shadow:0 4px 16px #00000014;transition:transform .3s ease,box-shadow .3s ease}.feature-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px #0000001f}.feature-icon{font-size:3em;margin-bottom:15px;filter:grayscale(100%);opacity:.7}.feature-card h3{font-size:1.2em;margin-bottom:10px;color:var(--text-color)}.feature-card p{color:var(--text-muted);line-height:1.5;font-size:.95em}.email-capture-section{padding:60px 40px;background:var(--surface);margin:40px;border-radius:16px;box-shadow:var(--shadow)}.email-capture-box{max-width:600px;margin:0 auto;text-align:center}.email-capture-box h2{font-size:2em;color:var(--text-color);margin-bottom:15px}.email-capture-box>p{font-size:1.1em;color:var(--text-muted);margin-bottom:30px}.email-capture-form{display:flex;gap:10px;margin-bottom:15px}.email-input{flex:1;padding:14px 20px;border:2px solid var(--border-color);border-radius:8px;font-size:1em;transition:border-color .2s}.email-input:focus{outline:none;border-color:var(--primary-color)}.email-note{font-size:.9em;color:var(--text-muted);margin:0}.cta-section{padding:80px 40px;text-align:center;background:var(--primary-gradient);color:#fff}.cta-section h2{font-size:2.5em;margin-bottom:20px}.cta-section p{font-size:1.3em;margin-bottom:40px;opacity:.95}.modal-alert{padding:12px 16px;margin-bottom:20px;border-radius:6px;display:flex;justify-content:space-between;align-items:center;animation:slideDown .3s ease}.modal-alert-error{background-color:#f443361a;color:var(--danger-color);border-left:4px solid var(--danger-color)}@media(max-width:1024px){.features-grid,.steps-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.hero-title{font-size:2.5em}.hero-subtitle{font-size:1.1em}.hero-actions{flex-direction:column}.articles-grid{grid-template-columns:1fr}.comparison-grid{grid-template-columns:1fr;gap:20px}.steps-grid,.features-grid{grid-template-columns:1fr}.section-title{font-size:2em}.problems-solutions-section,.how-it-works-section,.features-section,.cta-section{padding:60px 20px}}.main-content{flex:1;padding:40px;max-width:1400px;margin:0 auto;width:100%}.view-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.view-header h2{font-size:2em;color:var(--text-color);margin:10px 0 0}.blog-name{color:var(--text-muted);font-size:.9em;margin:5px 0}.loading{text-align:center;padding:40px;font-size:1.2em;color:var(--text-muted)}.empty-state{text-align:center;padding:60px 20px;color:var(--text-muted);font-size:1.1em}.blogs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:20px}.blog-card{background:var(--surface);border-radius:8px;padding:20px;box-shadow:var(--shadow);transition:transform .3s ease,box-shadow .3s ease}.blog-card:hover{transform:translateY(-4px);box-shadow:0 4px 16px #00000026}.blog-card h3{font-size:1.5em;margin-bottom:10px;color:var(--primary-color)}.blog-description{color:var(--text-muted);margin:10px 0;line-height:1.5}.blog-stats{display:flex;gap:15px;margin:15px 0;font-size:.9em;color:var(--text-muted)}.schedule-badge{background-color:var(--secondary-color);color:#fff;padding:2px 8px;border-radius:12px;font-size:.85em}.keywords-section{margin:15px 0}.keywords-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.keyword-tag{background-color:#6366f11a;color:var(--primary);padding:4px 10px;border-radius:12px;font-size:.85em;display:inline-flex;align-items:center;gap:5px}.keyword-remove{background:none;border:none;color:var(--primary);cursor:pointer;font-size:16px;padding:0;line-height:1}.keyword-remove:hover{color:var(--danger-color)}.blog-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}.blog-edit-form{display:flex;flex-direction:column;gap:10px}.form-actions{display:flex;gap:8px}.public-url{margin-top:15px;padding-top:15px;border-top:1px solid var(--border-color)}.public-url small{color:var(--text-muted);font-size:.85em}.url-display{display:flex;align-items:center;gap:8px;margin-top:5px}.url-link{color:var(--secondary-color);text-decoration:none;font-size:.9em;word-break:break-all}.url-link:hover{text-decoration:underline}.articles-list{display:grid;gap:20px}.article-card{background:var(--surface);border-radius:8px;padding:20px;box-shadow:var(--shadow);transition:transform .3s ease,box-shadow .3s ease}.article-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px #00000026}.article-card h3{font-size:1.3em;margin-bottom:10px;color:var(--text-color)}.article-excerpt{color:var(--text-muted);margin:10px 0;line-height:1.5}.article-meta{display:flex;gap:15px;align-items:center;margin:10px 0;font-size:.9em;color:var(--text-muted)}.status-badge{padding:4px 12px;border-radius:12px;font-size:.85em;font-weight:500}.status-badge.published{background-color:#4caf501a;color:var(--success-color)}.status-badge.draft{background-color:var(--surface-muted);color:var(--text-muted);border:1px solid var(--border-color)}.article-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}.article-detail{background:var(--surface);border-radius:8px;padding:30px;box-shadow:var(--shadow)}.article-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:20px;border-bottom:2px solid var(--border-color)}.article-content h1{font-size:2.5em;margin-bottom:20px;color:var(--text-color)}.article-excerpt{background-color:var(--surface-muted);padding:15px;border-left:4px solid var(--secondary-color);margin:20px 0}.article-body{line-height:1.8;font-size:1.1em;margin-top:30px}.article-edit-form{display:flex;flex-direction:column;gap:15px}.modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal{background:var(--surface);border-radius:12px;max-width:500px;width:90%;max-height:90vh;overflow-y:auto;box-shadow:0 8px 32px #0003;animation:slideUp .3s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.modal-header{padding:20px;border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center}.modal-header h2{margin:0;font-size:1.5em}.modal-close{background:none;border:none;font-size:28px;cursor:pointer;color:var(--text-muted);line-height:1}.modal-close:hover{color:var(--text-color)}.modal-body{padding:20px}.auth-form{display:flex;flex-direction:column;gap:15px}.auth-switch{text-align:center;margin-top:10px;color:var(--text-muted)}.auth-switch a{color:var(--primary-color);cursor:pointer;text-decoration:none}.auth-switch a:hover{text-decoration:underline}.form-group{margin-bottom:15px}.form-group label{display:block;margin-bottom:5px;font-weight:500;color:var(--text-color)}.form-group small{display:block;margin-top:5px;color:var(--text-muted);font-size:.85em}.checkbox-label{display:flex;align-items:center;gap:8px;cursor:pointer}.checkbox-label input[type=checkbox]{width:18px;height:18px;cursor:pointer}.input,.textarea{width:100%;padding:10px 12px;border:1px solid var(--border-color);border-radius:6px;font-size:14px;font-family:inherit;transition:border-color .3s ease}.input:focus,.textarea:focus{outline:none;border-color:var(--primary-color)}.textarea{resize:vertical;min-height:80px}select.input{cursor:pointer}@media(max-width:768px){.app-header{padding:15px 20px;flex-direction:column;gap:15px}.header-title{font-size:1.3em}.header-tagline{font-size:.7em}.main-content{padding:20px}.blogs-grid{grid-template-columns:1fr}.view-header{flex-direction:column;align-items:flex-start;gap:15px}.blog-actions,.article-actions{flex-direction:column}.btn{width:100%}}.faq-section{padding:80px 40px;background:var(--surface);max-width:1000px;margin:0 auto}.faq-container{max-width:800px;margin:0 auto}.faq-item{padding:24px 0;border-bottom:1px solid var(--border)}.faq-item:last-child{border-bottom:none}.faq-question{display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-size:1.15em;font-weight:600;color:var(--text-color);list-style:none;-webkit-user-select:none;user-select:none}.faq-question::-webkit-details-marker{display:none}.faq-icon{font-size:1.5em;color:var(--text-muted);transition:transform .3s ease;margin-left:16px;flex-shrink:0}.faq-item[open] .faq-icon{transform:rotate(180deg)}.faq-answer{margin-top:16px;color:var(--text-muted);line-height:1.7;font-size:1em}.faq-answer p{margin:12px 0}.faq-answer p:first-child{margin-top:0}.faq-answer ul,.faq-answer ol{margin:12px 0;padding-left:24px}.faq-answer li{margin:8px 0}.faq-answer strong{color:var(--primary-color);font-weight:600}@media(max-width:768px){.faq-section{padding:60px 20px}.faq-question{font-size:1.05em}.faq-answer{font-size:.95em}}
