:root{--brand-primary:#2095e9;--brand-secondary:#143959;--brand-accent:#caeb5a;--brand-teal:#2aecba;--brand-gradient:linear-gradient(90deg, #143959 0%, #2095e9 100%);--brand-gradient-accent:linear-gradient(135deg, #2095e9, #caeb5a);--font-display:"Archivo", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-body:"DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:"JetBrains Mono", "Fira Code", "Consolas", monospace;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--space-3xl:64px;--space-4xl:96px;--max-width:1200px;--max-width-narrow:800px;--radius-sm:6px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--radius-pill:100px;--transition-fast:.15s ease;--transition-base:.25s ease;--transition-slow:.4s ease;--transition-theme:.35s ease}[data-theme=dark],:root{--color-primary:#2095e9;--color-primary-soft:#2095e91f;--color-primary-glow:#2095e940;--color-secondary:#143959;--color-accent:#caeb5a;--color-accent-soft:#caeb5a26;--color-bg:#0a0a0a;--color-bg-elevated:#0a1f35;--color-surface:#111827;--color-surface-hover:#1c2940;--color-surface-active:#243352;--color-border:#1c4060;--color-border-subtle:#162236;--color-border-focus:#2095e9;--color-text:#e8edf4;--color-text-secondary:#94a3b8;--color-text-muted:#64748b;--color-text-inverse:#0a0a0a;--color-success:#22c55e;--color-success-soft:#22c55e1f;--color-warning:#f59e0b;--color-warning-soft:#f59e0b1f;--color-danger:#ef4444;--color-danger-soft:#ef44441f;--shadow-sm:0 1px 3px #0006;--shadow-md:0 4px 16px #00000080;--shadow-lg:0 8px 40px #0009;--shadow-glow:0 0 24px var(--color-primary-glow);--shadow-glow-accent:0 0 24px #caeb5a26;--mesh-1:radial-gradient(ellipse 80% 60% at 10% 20%, #2095e91f 0%, transparent 60%);--mesh-2:radial-gradient(ellipse 60% 80% at 85% 70%, #14395933 0%, transparent 55%);--mesh-3:radial-gradient(ellipse 50% 50% at 50% 100%, #2aecba0f 0%, transparent 50%)}[data-theme=light]{--color-primary:#1a7fd4;--color-primary-soft:#1a7fd414;--color-primary-glow:#1a7fd426;--color-secondary:#143959;--color-accent:#4d7c0f;--color-accent-soft:#4d7c0f14;--color-bg:#f8fafc;--color-bg-elevated:#f1f5f9;--color-surface:#fff;--color-surface-hover:#f1f5f9;--color-surface-active:#e2e8f0;--color-border:#e2e8f0;--color-border-subtle:#f1f5f9;--color-border-focus:#1a7fd4;--color-text:#0f172a;--color-text-secondary:#475569;--color-text-muted:#94a3b8;--color-text-inverse:#f8fafc;--color-success:#16a34a;--color-success-soft:#16a34a14;--color-warning:#d97706;--color-warning-soft:#d9770614;--color-danger:#dc2626;--color-danger-soft:#dc262614;--shadow-sm:0 1px 3px #0000000f;--shadow-md:0 4px 16px #00000014;--shadow-lg:0 8px 40px #0000001f;--shadow-glow:0 0 24px var(--color-primary-glow);--shadow-glow-accent:0 0 24px #4d7c0f1a;--mesh-1:radial-gradient(ellipse 80% 60% at 10% 20%, #1a7fd40f 0%, transparent 60%);--mesh-2:radial-gradient(ellipse 60% 80% at 85% 70%, #1439590a 0%, transparent 55%);--mesh-3:radial-gradient(ellipse 50% 50% at 50% 100%, #2aecba08 0%, transparent 50%)}.reveal{opacity:0;transition:opacity .6s,transform .6s;transform:translateY(30px)}.reveal.visible{opacity:1;transform:translateY(0)}.reveal-delay-1{transition-delay:.1s}.reveal-delay-2{transition-delay:.2s}.reveal-delay-3{transition-delay:.3s}.reveal-delay-4{transition-delay:.4s}.reveal-stagger>*{opacity:0;transition:opacity .5s,transform .5s;transform:translateY(20px)}.reveal-stagger.visible>:first-child{opacity:1;transition-delay:50ms;transform:translateY(0)}.reveal-stagger.visible>:nth-child(2){opacity:1;transition-delay:.1s;transform:translateY(0)}.reveal-stagger.visible>:nth-child(3){opacity:1;transition-delay:.15s;transform:translateY(0)}.reveal-stagger.visible>:nth-child(4){opacity:1;transition-delay:.2s;transform:translateY(0)}.reveal-stagger.visible>:nth-child(5){opacity:1;transition-delay:.25s;transform:translateY(0)}.reveal-stagger.visible>:nth-child(6){opacity:1;transition-delay:.3s;transform:translateY(0)}.reveal-stagger.visible>:nth-child(7){opacity:1;transition-delay:.35s;transform:translateY(0)}.reveal-stagger.visible>:nth-child(8){opacity:1;transition-delay:.4s;transform:translateY(0)}.reveal-stagger.visible>:nth-child(9){opacity:1;transition-delay:.45s;transform:translateY(0)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{background:var(--color-bg);min-height:100vh;color:var(--color-text);line-height:1.6}img,picture,video,canvas,svg{max-width:100%;display:block}input,button,textarea,select{font:inherit;color:inherit}button{cursor:pointer;background:0 0;border:none}a{color:inherit;text-decoration:none}ul,ol{list-style:none}h1,h2,h3,h4,h5,h6{overflow-wrap:break-word;line-height:1.2}p{overflow-wrap:break-word}.pel-page{color:var(--color-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.6;font-family:var(--font-body)!important;font-size:16px!important}.pel-page h1,.pel-page h2,.pel-page h3,.pel-page h4{color:var(--color-text);font-weight:700;font-family:var(--font-display)!important}.pel-page h1{letter-spacing:-.03em;font-size:clamp(32px,5vw,56px)!important}.pel-page h2{letter-spacing:-.02em;font-size:clamp(24px,3.5vw,40px)!important}.pel-page h3{letter-spacing:-.01em;font-size:clamp(20px,2.5vw,28px)!important}.pel-page p{color:var(--color-text-secondary);line-height:1.75;font-size:16px!important}.pel-page a{color:var(--color-primary);transition:color var(--transition-fast)}.pel-page a:hover{color:var(--color-accent)}.pel-page ::selection{background:var(--color-primary-soft);color:var(--color-text)}.pel-page :focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.pel-page code,.pel-page pre{font-family:var(--font-mono)!important}.pel-page pre{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-lg);line-height:1.7;overflow-x:auto;font-size:14px!important}.pel-page hr{border:none;border-top:1px solid var(--color-border);margin:var(--space-2xl) 0}.scroll-progress{background:var(--brand-gradient);z-index:200;width:0%;height:3px;transition:width .1s linear;position:fixed;top:0;left:0}.no-transition *{transition:none!important}.container{width:100%;max-width:var(--max-width);padding:0 var(--space-lg);margin:0 auto}.container--narrow{max-width:var(--max-width-narrow)}.section{padding:var(--space-4xl) 0}.section--alt{background:var(--color-bg-elevated)}.grid{gap:var(--space-lg);display:grid}.grid--2{grid-template-columns:repeat(2,1fr)}.grid--3{grid-template-columns:repeat(3,1fr)}.grid--4{grid-template-columns:repeat(4,1fr)}@media (width<=1024px){.grid--4,.grid--3{grid-template-columns:repeat(2,1fr)}}@media (width<=640px){.container{padding:0 var(--space-md)}.section{padding:var(--space-3xl) 0}.grid--2,.grid--3,.grid--4{grid-template-columns:1fr}}.flex{display:flex}.flex--center{justify-content:center;align-items:center}.flex--between{justify-content:space-between;align-items:center}.flex--col{flex-direction:column}.flex--gap-sm{gap:var(--space-sm)}.flex--gap-md{gap:var(--space-md)}.flex--gap-lg{gap:var(--space-lg)}.text-center{text-align:center}.text-muted{color:var(--color-text-muted)}.visually-hidden{clip:rect(0, 0, 0, 0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.pel-section-nav{z-index:100;-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border);background:#0a0a0aeb;padding:0 24px;position:sticky;top:0}.pel-section-nav__inner{max-width:var(--max-width);-webkit-overflow-scrolling:touch;scrollbar-width:none;justify-content:space-between;align-items:center;margin:0 auto;display:flex;overflow-x:auto}.pel-section-nav__inner::-webkit-scrollbar{display:none}.pel-section-nav__links{align-items:center;gap:24px;display:flex}.pel-section-nav__links a{font-family:var(--font-body);color:var(--color-text-secondary);white-space:nowrap;padding:14px 0;font-size:13px;font-weight:500;text-decoration:none;transition:color .15s;position:relative}.pel-section-nav__links a:hover,.pel-section-nav__links a.active{color:var(--color-primary)}.pel-section-nav__links a:after{content:"";background:var(--brand-gradient);border-radius:1px;height:2px;transition:transform .15s;position:absolute;bottom:0;left:0;right:0;transform:scaleX(0)}.pel-section-nav__links a:hover:after,.pel-section-nav__links a.active:after{transform:scaleX(1)}.pel-section-nav__actions{align-items:center;gap:12px;padding-left:16px;display:flex}.pel-top-btn{font-family:var(--font-body);color:var(--color-text-secondary);border:1px solid var(--color-border);border-radius:var(--radius-sm);white-space:nowrap;padding:6px 12px;font-size:12px;font-weight:600;text-decoration:none;transition:all .15s}.pel-top-btn:hover{color:var(--color-primary);border-color:var(--color-primary)}@media (width<=900px){.pel-section-nav{padding:0 16px}.pel-section-nav__links{gap:16px}}.hero{padding:var(--space-4xl) 0;align-items:center;min-height:85vh;display:flex;position:relative;overflow:hidden}.hero:before{content:"";background:var(--mesh-1), var(--mesh-2), var(--mesh-3);pointer-events:none;transition:background var(--transition-theme);position:absolute;inset:0}.hero:after{content:"";filter:blur(40px);pointer-events:none;background:radial-gradient(circle,#2aecba0f 0%,#0000 60%);border-radius:50%;width:500px;height:500px;animation:8s ease-in-out infinite float;position:absolute;top:20%;right:-10%}@keyframes float{0%,to{transform:translate(0)}50%{transform:translate(-20px,-30px)}}.hero__content{z-index:1;max-width:800px;position:relative}.hero__badge{align-items:center;gap:var(--space-sm);background:var(--color-primary-soft);border-radius:var(--radius-full);color:var(--color-primary);margin-bottom:var(--space-lg);text-transform:uppercase;letter-spacing:.08em;border:1px solid #2095e933;padding:6px 16px;font-size:13px;font-weight:600;display:inline-flex}.hero__badge-dot{background:var(--color-primary);border-radius:50%;width:6px;height:6px;animation:2s ease-in-out infinite pulse-dot}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.5)}}.hero__title{margin-bottom:var(--space-lg);letter-spacing:-.04em;font-size:clamp(40px,6vw,64px);font-weight:800;line-height:1.08}.hero__title span{background:linear-gradient(135deg, var(--color-primary), var(--color-accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.hero__subtitle{color:var(--color-text-secondary);margin-bottom:var(--space-xl);max-width:650px;font-size:19px;line-height:1.75}.hero__actions{align-items:center;gap:var(--space-md);flex-wrap:wrap;display:flex}.hero__demo{z-index:1;margin-top:var(--space-3xl);position:relative}.hero__demo-window{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);overflow:hidden}.hero__demo-titlebar{align-items:center;gap:var(--space-sm);padding:12px var(--space-md);background:var(--color-bg-elevated);border-bottom:1px solid var(--color-border);display:flex}.hero__demo-dot{border-radius:50%;width:10px;height:10px}.hero__demo-dot--red{background:#ef4444}.hero__demo-dot--yellow{background:#f59e0b}.hero__demo-dot--green{background:#22c55e}.hero__demo-label{color:var(--color-text-muted);font-size:12px;font-family:var(--font-mono);margin-left:auto}.hero__demo-body{padding:var(--space-lg);font-family:var(--font-mono);min-height:160px;font-size:14px;line-height:1.8}.hero__demo-label-tag{color:var(--color-text-muted);margin-bottom:var(--space-sm);font-size:12px}.hero__demo-bad{color:var(--color-text-muted);opacity:.5;text-decoration:line-through}.hero__demo-good{color:var(--color-accent)}.hero__demo-cursor{background:var(--color-primary);vertical-align:text-bottom;width:2px;height:1.1em;margin-left:2px;animation:1s step-end infinite blink;display:inline-block}@keyframes blink{50%{opacity:0}}.hero__stats{gap:var(--space-2xl);margin-top:var(--space-2xl);padding-top:var(--space-2xl);border-top:1px solid var(--color-border);display:flex}.hero__stat{text-align:center}.hero__stat-value{font-family:var(--font-primary);color:var(--color-primary);font-size:32px;font-weight:800;line-height:1}.hero__stat-label{color:var(--color-text-muted);margin-top:var(--space-xs);font-size:13px}@media (width<=768px){.hero{min-height:auto;padding-top:calc(var(--space-3xl) + 60px)}.hero__stats{gap:var(--space-lg);flex-wrap:wrap}}.problem{position:relative}.problem__grid{gap:var(--space-2xl);grid-template-columns:1fr 1fr;align-items:stretch;display:grid}.problem__card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-xl);position:relative;overflow:hidden}.problem__card--bad{border-color:#ef444433}.problem__card--bad:before{content:"";background:var(--color-danger);height:3px;position:absolute;top:0;left:0;right:0}.problem__card--good{border-color:#22c55e33}.problem__card--good:before{content:"";background:var(--color-success);height:3px;position:absolute;top:0;left:0;right:0}.problem__card-tag{text-transform:uppercase;letter-spacing:.1em;margin-bottom:var(--space-md);border-radius:var(--radius-full);align-items:center;gap:6px;padding:4px 12px;font-size:12px;font-weight:700;display:inline-flex}.problem__card--bad .problem__card-tag{color:var(--color-danger);background:var(--color-danger-soft)}.problem__card--good .problem__card-tag{color:var(--color-success);background:var(--color-success-soft)}.problem__card-prompt{font-family:var(--font-mono);color:var(--color-text);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-md);margin-bottom:var(--space-md);font-size:14px;line-height:1.7}.problem__card-output{color:var(--color-text-secondary);border-left:3px solid var(--color-border);padding-left:var(--space-md);font-size:14px;line-height:1.7}.problem__card--bad .problem__card-output{border-left-color:#ef44444d}.problem__card--good .problem__card-output{border-left-color:#22c55e4d}.problem__card-output mark{color:var(--color-warning);background:0 0;font-weight:600}.problem__card--good .problem__card-output mark{color:var(--color-success)}@media (width<=768px){.problem__grid{grid-template-columns:1fr}}.why-matters__intro{max-width:700px;margin:0 auto var(--space-2xl);text-align:center}.why-matters__cards{gap:var(--space-lg);grid-template-columns:repeat(3,1fr);display:grid}.why-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-xl);transition:all var(--transition-base);position:relative;overflow:hidden}.why-card:hover{border-color:var(--color-primary);box-shadow:var(--shadow-md);transform:translateY(-2px)}.why-card__icon{background:var(--color-primary-soft);border-radius:var(--radius-md);width:48px;height:48px;margin-bottom:var(--space-md);justify-content:center;align-items:center;font-size:22px;display:flex}.why-card__title{margin-bottom:var(--space-sm);color:var(--color-text);font-size:18px;font-weight:700}.why-card__desc{color:var(--color-text-secondary);font-size:14px;line-height:1.7}.why-card__stat{margin-top:var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--color-border);font-family:var(--font-primary);color:var(--color-primary);font-size:29px;font-weight:800}.why-card__stat-label{color:var(--color-text-muted);font-size:12px;font-family:var(--font-body);font-weight:400}@media (width<=768px){.why-matters__cards{grid-template-columns:1fr}}.phases__intro{max-width:700px;margin:0 auto var(--space-2xl);text-align:center}.phases__timeline{gap:var(--space-lg);flex-direction:column;display:flex;position:relative}.phases__timeline:before{content:"";background:linear-gradient(to bottom, var(--color-primary), var(--color-accent));opacity:.3;width:2px;position:absolute;top:0;bottom:0;left:28px}.phase-card{gap:var(--space-lg);display:flex;position:relative}.phase-card__number{background:var(--color-surface);border:2px solid var(--color-primary);width:56px;min-width:56px;height:56px;font-family:var(--font-primary);color:var(--color-primary);z-index:1;border-radius:50%;justify-content:center;align-items:center;font-size:19px;font-weight:800;display:flex;position:relative}.phase-card__body{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-xl);transition:all var(--transition-base);cursor:pointer;flex:1}.phase-card__body:hover{border-color:var(--color-primary);box-shadow:0 0 20px var(--color-primary-glow)}.phase-card__header{margin-bottom:var(--space-sm);justify-content:space-between;align-items:center;display:flex}.phase-card__title{font-size:19px;font-weight:700}.phase-card__level{text-transform:uppercase;letter-spacing:.1em;border-radius:var(--radius-full);background:var(--color-primary-soft);color:var(--color-primary);padding:4px 12px;font-size:11px;font-weight:700}.phase-card__desc{color:var(--color-text-secondary);font-size:15px;line-height:1.7}.phase-card__details{max-height:0;transition:max-height var(--transition-slow);overflow:hidden}.phase-card__body.expanded .phase-card__details{max-height:500px}.phase-card__topics{margin-top:var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--color-border);gap:var(--space-sm);flex-wrap:wrap;display:flex}.phase-card__topic{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-full);color:var(--color-text-secondary);padding:4px 12px;font-size:13px}.phase-card__expand-hint{color:var(--color-text-muted);margin-top:var(--space-sm);font-size:12px}@media (width<=640px){.phases__timeline:before{display:none}.phase-card{gap:var(--space-sm);flex-direction:column}.phase-card__number{width:40px;min-width:40px;height:40px;font-size:16px}}.tools-section__intro{max-width:700px;margin:0 auto var(--space-2xl);text-align:center}.tool-container{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden}.tool-header{padding:var(--space-lg) var(--space-xl);background:var(--color-bg-elevated);border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;display:flex}.tool-header__title{align-items:center;gap:var(--space-sm);font-size:18px;font-weight:700;display:flex}.tool-header__badge{background:var(--color-primary-soft);color:var(--color-primary);border-radius:var(--radius-full);text-transform:uppercase;letter-spacing:.05em;padding:3px 10px;font-size:11px;font-weight:600}.tool-body{padding:var(--space-xl)}.template-gallery{gap:var(--space-md);grid-template-columns:repeat(auto-fill,minmax(300px,1fr));display:grid}.template-card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-lg);transition:all var(--transition-fast);cursor:pointer}.template-card:hover{border-color:var(--color-primary);transform:translateY(-1px)}.template-card__category{text-transform:uppercase;letter-spacing:.1em;color:var(--color-primary);margin-bottom:var(--space-sm);font-size:11px;font-weight:700}.template-card__title{margin-bottom:var(--space-sm);color:var(--color-text);font-size:16px;font-weight:600}.template-card__preview{font-family:var(--font-mono);color:var(--color-text-muted);max-height:80px;font-size:13px;line-height:1.6;position:relative;overflow:hidden}.template-card__preview:after{content:"";background:linear-gradient(to bottom, transparent, var(--color-bg));height:30px;position:absolute;bottom:0;left:0;right:0}.template-card__actions{gap:var(--space-sm);margin-top:var(--space-md);display:flex}.template-filters{gap:var(--space-sm);margin-bottom:var(--space-lg);flex-wrap:wrap;display:flex}.template-filter-btn{color:var(--color-text-secondary);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-full);transition:all var(--transition-fast);cursor:pointer;padding:6px 16px;font-size:14px;font-weight:500}.template-filter-btn:hover,.template-filter-btn.active{color:var(--color-primary);border-color:var(--color-primary);background:var(--color-primary-soft)}@media (width<=640px){.tool-header{gap:var(--space-sm);padding:var(--space-md);text-align:center;flex-direction:column}.tool-body{padding:var(--space-md)}.template-gallery{grid-template-columns:1fr}.template-filter-btn{padding:5px 12px;font-size:12px}}.resources__intro{max-width:700px;margin:0 auto var(--space-2xl);text-align:center}.resources__grid{gap:var(--space-lg);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));display:grid}.resource-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-xl);transition:all var(--transition-base);position:relative;overflow:hidden}.resource-card:hover{border-color:var(--color-primary);box-shadow:var(--shadow-md);transform:translateY(-3px)}.resource-card__icon{background:var(--color-primary-soft);border-radius:var(--radius-md);width:52px;height:52px;margin-bottom:var(--space-md);justify-content:center;align-items:center;font-size:24px;display:flex}.resource-card__format{top:var(--space-md);right:var(--space-md);text-transform:uppercase;letter-spacing:.1em;border-radius:var(--radius-pill);background:var(--color-surface-hover);color:var(--color-text-muted);border:1px solid var(--color-border);padding:3px 10px;font-size:10px;font-weight:700;position:absolute}.resource-card__title{color:var(--color-text);margin-bottom:var(--space-sm);font-size:18px;font-weight:700}.resource-card__desc{color:var(--color-text-secondary);margin-bottom:var(--space-md);font-size:14px;line-height:1.6}.resource-card__download{align-items:center;gap:var(--space-sm);color:var(--color-primary);cursor:pointer;transition:all var(--transition-fast);font-size:14px;font-weight:600;display:inline-flex}.resource-card__download:hover{gap:12px}@media (width<=640px){.resources__grid{grid-template-columns:1fr}.resource-card{padding:var(--space-lg)}}.feedback-section{position:relative;overflow:hidden}.feedback-section:before{content:"";background:var(--mesh-1), var(--mesh-2);opacity:.5;pointer-events:none;position:absolute;inset:0}.feedback__grid{gap:var(--space-2xl);z-index:1;grid-template-columns:1fr 1fr;display:grid;position:relative}.feedback__rating{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-xl)}.feedback__rating-title{margin-bottom:var(--space-md);color:var(--color-text);font-size:18px;font-weight:700}.feedback__stars{gap:var(--space-sm);margin-bottom:var(--space-md);display:flex}.feedback__star{cursor:pointer;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);width:40px;height:40px;transition:all var(--transition-fast);color:var(--color-text-muted);justify-content:center;align-items:center;font-size:24px;display:flex}.feedback__star:hover,.feedback__star.active{border-color:var(--color-warning);background:var(--color-warning-soft);color:var(--color-warning);transform:scale(1.1)}.feedback__comment{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);width:100%;color:var(--color-text);resize:vertical;min-height:80px;margin-bottom:var(--space-md);font-size:14px;font-family:var(--font-body);transition:border-color var(--transition-fast);padding:12px 16px}.feedback__comment:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-soft);outline:none}.feedback__comment::placeholder{color:var(--color-text-muted)}.feedback__role-label{color:var(--color-text-secondary);margin-bottom:var(--space-xs);text-transform:uppercase;letter-spacing:.05em;font-size:13px;font-weight:600;display:block}.feedback__role-select{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);width:100%;color:var(--color-text);font-size:14px;font-family:var(--font-body);margin-bottom:var(--space-md);cursor:pointer;transition:border-color var(--transition-fast);appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236b7280' d='M1.41 0L6 4.58 10.59 0 12 1.41l-6 6-6-6z'/%3E%3C/svg%3E");background-position:right 14px center;background-repeat:no-repeat;background-size:12px;padding:10px 16px}.feedback__role-select:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-soft);outline:none}.feedback__newsletter{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-xl)}.feedback__newsletter-title{margin-bottom:var(--space-sm);color:var(--color-text);font-size:18px;font-weight:700}.feedback__newsletter-desc{color:var(--color-text-secondary);margin-bottom:var(--space-lg);font-size:14px;line-height:1.6}.feedback__email-group{gap:var(--space-sm);display:flex}.feedback__email-input{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text);font-size:14px;font-family:var(--font-body);transition:border-color var(--transition-fast);flex:1;padding:12px 16px}.feedback__email-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-soft);outline:none}.feedback__email-input::placeholder{color:var(--color-text-muted)}.share-actions{align-items:center;gap:var(--space-sm);margin-top:var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--color-border);display:flex}.share-actions__label{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em;font-size:12px;font-weight:600}.share-btn{border-radius:var(--radius-sm);background:var(--color-bg);border:1px solid var(--color-border);width:32px;height:32px;color:var(--color-text-muted);cursor:pointer;transition:all var(--transition-fast);justify-content:center;align-items:center;font-size:14px;display:flex}.share-btn:hover{border-color:var(--color-primary);color:var(--color-primary);background:var(--color-primary-soft)}@media (width<=768px){.feedback__grid{grid-template-columns:1fr}.feedback__email-group{flex-direction:column}}.btn{justify-content:center;align-items:center;gap:var(--space-sm);font-family:var(--font-display);border-radius:var(--radius-md);transition:all var(--transition-fast);cursor:pointer;white-space:nowrap;border:none;padding:12px 24px;font-size:14px;font-weight:600;display:inline-flex;position:relative}.btn--primary{background:var(--brand-gradient);color:#fff}.btn--primary:hover{box-shadow:var(--shadow-glow);color:#fff;transform:translateY(-1px)}.btn--secondary{background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border);transition:all var(--transition-fast), background var(--transition-theme), border-color var(--transition-theme)}.btn--secondary:hover{border-color:var(--color-primary);color:var(--color-primary)}.btn--ghost{color:var(--color-text-secondary);background:0 0}.btn--ghost:hover{color:var(--color-primary);background:var(--color-primary-soft)}.btn--accent{background:var(--color-accent);color:var(--color-text-inverse)}.btn--accent:hover{opacity:.9;transform:translateY(-1px)}.btn--outline-gradient{color:var(--color-primary);background:0 0;background-image:linear-gradient(var(--color-surface), var(--color-surface)), var(--brand-gradient);background-origin:border-box;background-clip:padding-box,border-box;border:2px solid #0000}.btn--outline-gradient:hover{background-image:linear-gradient(var(--color-surface-hover), var(--color-surface-hover)), var(--brand-gradient);box-shadow:var(--shadow-glow)}.btn--sm{padding:8px 16px;font-size:13px}.btn--lg{border-radius:var(--radius-pill);padding:16px 32px;font-size:16px}.btn--icon{border-radius:var(--radius-sm);padding:8px}.btn--pill{border-radius:var(--radius-pill)}.btn--full{width:100%}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-group{gap:2px;display:flex}.btn-group .btn{border-radius:0}.btn-group .btn:first-child{border-radius:var(--radius-md) 0 0 var(--radius-md)}.btn-group .btn:last-child{border-radius:0 var(--radius-md) var(--radius-md) 0}.simulator__frameworks{gap:var(--space-sm);margin-bottom:var(--space-lg);grid-template-columns:repeat(4,1fr);display:grid}.simulator__fw-btn{background:var(--color-bg);border:2px solid var(--color-border);border-radius:var(--radius-md);text-align:center;cursor:pointer;transition:all var(--transition-fast);padding:12px}.simulator__fw-btn:hover{border-color:var(--color-text-muted)}.simulator__fw-btn.active{border-color:var(--color-primary);background:var(--color-primary-soft)}.simulator__fw-name{font-family:var(--font-primary);color:var(--color-text);margin-bottom:2px;font-size:16px;font-weight:700}.simulator__fw-btn.active .simulator__fw-name{color:var(--color-primary)}.simulator__fw-full{color:var(--color-text-muted);font-size:11px}.simulator__fw-desc{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-md);margin-bottom:var(--space-lg);color:var(--color-text-secondary);font-size:14px;line-height:1.6;display:none}.simulator__fw-desc.visible{display:block}.simulator__fields{gap:var(--space-md);flex-direction:column;display:flex}.simulator__field{gap:var(--space-xs);flex-direction:column;display:flex}.simulator__field label{color:var(--color-text);font-size:14px;font-weight:600}.simulator__field-hint{color:var(--color-text-muted);font-size:12px}.simulator__field input,.simulator__field textarea{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text);transition:border-color var(--transition-fast);width:100%;padding:10px 14px;font-size:14px}.simulator__field input:focus,.simulator__field textarea:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-soft);outline:none}.simulator__field textarea{resize:vertical;min-height:80px;line-height:1.6}.simulator__char-count{color:var(--color-text-muted);text-align:right;font-size:11px;font-family:var(--font-mono)}.simulator__char-count.warning{color:var(--color-warning)}.simulator__char-count.danger{color:var(--color-danger)}.simulator__actions{gap:var(--space-sm);margin-top:var(--space-md);display:flex}.simulator__output{margin-top:var(--space-lg);display:none}.simulator__output.visible{display:block}.simulator__output-header{margin-bottom:var(--space-sm);justify-content:space-between;align-items:center;display:flex}.simulator__output-header h4{font-size:14px;font-weight:600}.simulator__output-meta{color:var(--color-text-muted);font-size:12px;font-family:var(--font-mono)}.simulator__output-text{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-lg);font-family:var(--font-mono);color:var(--color-text);white-space:pre-wrap;max-height:400px;font-size:14px;line-height:1.8;overflow-y:auto}@media (width<=640px){.simulator__frameworks{grid-template-columns:repeat(2,1fr)}}.persona__form{gap:var(--space-md);grid-template-columns:1fr 1fr;display:grid}.persona__field{gap:var(--space-xs);flex-direction:column;display:flex}.persona__field--full{grid-column:span 2}.persona__field label{color:var(--color-text);font-size:14px;font-weight:600}.persona__field-hint{color:var(--color-text-muted);font-size:12px}.persona__field input,.persona__field textarea,.persona__field select{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text);transition:border-color var(--transition-fast);width:100%;padding:10px 14px;font-size:14px}.persona__field input:focus,.persona__field textarea:focus,.persona__field select:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-soft);outline:none}.persona__field textarea{resize:vertical;min-height:80px;line-height:1.6}.persona__field select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%239ca3b4'%3E%3Cpath d='M6 8.5L1 3.5h10z'/%3E%3C/svg%3E");background-position:right 14px center;background-repeat:no-repeat;padding-right:36px}.persona__presets{margin-bottom:var(--space-lg)}.persona__presets-label{color:var(--color-text-secondary);margin-bottom:var(--space-sm);font-size:13px;font-weight:600}.persona__presets-list{gap:var(--space-sm);flex-wrap:wrap;display:flex}.persona__preset-btn{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-full);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast);padding:6px 14px;font-size:13px}.persona__preset-btn:hover{border-color:var(--color-primary);color:var(--color-primary)}.persona__actions{gap:var(--space-sm);margin-top:var(--space-sm);grid-column:span 2;display:flex}.persona__output{margin-top:var(--space-lg);display:none}.persona__output.visible{display:block}.persona__output-text{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-lg);font-family:var(--font-mono);color:var(--color-text);white-space:pre-wrap;font-size:14px;line-height:1.8}@media (width<=640px){.persona__form{grid-template-columns:1fr}.persona__field--full,.persona__actions{grid-column:span 1}}.toast-container{z-index:1000;gap:var(--space-sm);pointer-events:none;flex-direction:column;display:flex;position:fixed;bottom:24px;right:24px}.toast{align-items:center;gap:var(--space-sm);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);color:var(--color-text);pointer-events:auto;opacity:0;transition:all var(--transition-base);padding:12px 20px;font-size:14px;display:flex;transform:translate(120%)}.toast.show{opacity:1;transform:translate(0)}.toast--success{border-color:#22c55e4d}.toast--success:before{content:"";background:var(--color-success);border-radius:var(--radius-md) 0 0 var(--radius-md);width:4px;height:100%;position:absolute;top:0;left:0}.toast--warning{border-color:#f59e0b4d}.toast--warning:before{content:"";background:var(--color-warning);border-radius:var(--radius-md) 0 0 var(--radius-md);width:4px;height:100%;position:absolute;top:0;left:0}.toast--error{border-color:#ef44444d}.toast--error:before{content:"";background:var(--color-danger);border-radius:var(--radius-md) 0 0 var(--radius-md);width:4px;height:100%;position:absolute;top:0;left:0}@media (width<=640px){.toast-container{bottom:16px;left:16px;right:16px}}.template-modal-overlay{z-index:500;-webkit-backdrop-filter:blur(8px);padding:var(--space-lg);opacity:0;pointer-events:none;transition:opacity var(--transition-base);background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.template-modal-overlay.open{opacity:1;pointer-events:auto}.template-modal{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);width:100%;max-width:720px;max-height:85vh;transition:transform var(--transition-base);box-shadow:var(--shadow-lg);overflow-y:auto;transform:scale(.9)translateY(20px)}.template-modal-overlay.open .template-modal{transform:scale(1)translateY(0)}.template-modal__header{padding:var(--space-xl) var(--space-xl) 0;justify-content:space-between;align-items:flex-start;display:flex}.template-modal__category{text-transform:uppercase;letter-spacing:.1em;color:var(--color-primary);margin-bottom:var(--space-xs);font-size:11px;font-weight:700}.template-modal__title{font-family:var(--font-display);color:var(--color-text);font-size:22px;font-weight:700}.template-modal__close{border-radius:var(--radius-sm);width:36px;height:36px;color:var(--color-text-muted);background:var(--color-bg);border:1px solid var(--color-border);cursor:pointer;transition:all var(--transition-fast);flex-shrink:0;justify-content:center;align-items:center;font-size:21px;display:flex}.template-modal__close:hover{color:var(--color-text);border-color:var(--color-text-muted)}.template-modal__body{padding:var(--space-xl)}.template-modal__prompt{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-lg);font-family:var(--font-mono);color:var(--color-text);white-space:pre-wrap;margin-bottom:var(--space-lg);font-size:14px;line-height:1.8;position:relative}.template-modal__prompt-label{text-transform:uppercase;letter-spacing:.1em;color:var(--color-primary);background:var(--color-bg);border-radius:var(--radius-sm);border:1px solid var(--color-border);padding:2px 8px;font-size:10px;font-weight:700;position:absolute;top:-10px;left:16px}.template-modal__tips{margin-bottom:var(--space-lg)}.template-modal__tips-title{text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-secondary);margin-bottom:var(--space-sm);font-size:13px;font-weight:700}.template-modal__tips-list{gap:var(--space-sm);flex-direction:column;display:flex}.template-modal__tip{align-items:flex-start;gap:var(--space-sm);color:var(--color-text-secondary);font-size:14px;line-height:1.6;display:flex}.template-modal__tip-icon{color:var(--color-primary);flex-shrink:0;margin-top:2px;font-weight:700}.template-modal__placeholders{gap:var(--space-sm);margin-bottom:var(--space-lg);flex-wrap:wrap;display:flex}.template-modal__placeholder{font-size:13px;font-family:var(--font-mono);background:var(--color-primary-soft);color:var(--color-primary);border-radius:var(--radius-sm);border:1px solid #2095e926;padding:4px 12px}.template-modal__actions{gap:var(--space-sm);padding-top:var(--space-md);border-top:1px solid var(--color-border);display:flex}.template-card{cursor:pointer;position:relative}.template-card:after{content:"Click to expand";bottom:var(--space-md);right:var(--space-md);color:var(--color-text-muted);opacity:0;transition:opacity var(--transition-fast);font-size:11px;position:absolute}.template-card:hover:after{opacity:1}@media (width<=640px){.template-modal{border-radius:var(--radius-lg);max-height:95vh}.template-modal__actions{flex-direction:column}}