:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f5f8ff;--surface:#ffffffad;--surface-strong:#fff;--text:#111827;--text-soft:#475569;--border:#ffffffe6;--shadow:#0f172a14;background-color:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:16px;line-height:1.65}html.dark{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#020617;--surface:#0f172ad1;--surface-strong:#111827;--text:#f8fafc;--text-soft:#cbd5e1;--border:#94a3b840;--shadow:#02061773}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{color:var(--text);background:linear-gradient(135deg,#f8fbff 0%,#eef4ff 45%,#f6f8ff 100%);min-height:100vh;font-family:inherit;transition:background-color .25s,color .25s}html.dark body{color:var(--text);background:linear-gradient(135deg,#020617 0%,#0f172a 45%,#111827 100%)}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}.page-shell{max-width:1100px;margin:0 auto;padding:32px 24px 64px}.page-shell[dir=rtl]{direction:rtl}.home-header{background:var(--surface);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid var(--border);box-shadow:0 16px 40px var(--shadow);border-radius:26px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;padding:18px 24px 26px;display:flex}.home-nav{flex-wrap:wrap;justify-content:flex-start;gap:10px;display:flex}.nav-button{color:var(--text);border:1px solid var(--border);box-shadow:0 10px 30px var(--shadow);background:#ffffff2e;border-radius:999px;padding:.95rem 1.2rem;font-weight:700;transition:transform .18s,background-color .18s,box-shadow .18s}.nav-button:hover{background:#fffffff2;transform:translateY(-2px)}.nav-button.active{color:#fff;background:linear-gradient(135deg,#e879f9 0%,#60a5fa 100%);border-color:#0000}.hero-card{color:#fff;background:linear-gradient(135deg,#7c3aed 0%,#2563eb 45%,#0ea5e9 100%);border-radius:32px;padding:36px;box-shadow:0 28px 90px #0f172a29}.hero-grid{gap:32px;display:grid}.hero-copy{max-width:720px}.hero-title{letter-spacing:-.05em;margin:12px 0 0;font-size:clamp(2.2rem,4vw,3.4rem);line-height:1.1}.hero-text{color:#ffffffeb;white-space:pre-line;max-width:720px;margin:24px 0 0;font-size:1.05rem;line-height:1.85}.hero-image{width:100%}.hero-image-wrapper{border-radius:28px;width:100%;min-height:320px;position:relative;overflow:hidden}.image-card{object-fit:cover;filter:drop-shadow(0 18px 60px #0f172a38);width:100%;height:100%}.hero-actions{justify-content:flex-start;gap:16px;margin-top:32px;display:flex}.hero-actions .secondary-button{min-width:220px}.info-card,.detail-card,.form-card,.post-card,.empty-state{background:#fff;border:1px solid #e2e8f0;border-radius:24px;box-shadow:0 20px 48px #0f172a0f}.features-section{margin-top:28px;padding:32px}.section-copy{color:#475569;margin-top:12px;line-height:1.8}.feature-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-top:28px;display:grid}.feature-card{background:#3b82f612;border:1px solid #3b82f629;border-radius:24px;min-height:170px;padding:24px}.feature-card h3{color:#1e3a8a;margin:0 0 10px}.feature-card p{color:#475569;margin:0}.page-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:28px;display:flex}.eyebrow{letter-spacing:.16em;text-transform:uppercase;color:#ffffffe0;margin:0 0 12px;font-size:.88rem}.page-heading{letter-spacing:-.04em;color:var(--text);margin:0;font-size:clamp(2rem,3.5vw,3.2rem);line-height:1.05}.page-copy{color:#ffffffeb;max-width:740px;margin:20px 0 0;font-size:1.04rem}.hero-actions,.post-actions,.detail-actions{flex-wrap:wrap;align-items:center;gap:12px;margin-top:28px;display:flex}.primary-button,.secondary-button,.danger-button,.small-button{cursor:pointer;border:none;border-radius:999px;justify-content:center;align-items:center;padding:.98rem 1.5rem;font-weight:700;text-decoration:none;transition:transform .15s,box-shadow .15s,background-color .15s;display:inline-flex}.primary-button{color:#fff;background:#2563eb;box-shadow:0 16px 40px #2563eb33}.primary-button:hover{background:#1d4ed8;transform:translateY(-1px)}.secondary-button{background:var(--surface-strong);color:var(--text);border:1px solid var(--border)}.secondary-button:hover{background:var(--surface);transform:translateY(-1px)}.theme-toggle{border:1px solid var(--border);background:var(--surface-strong);width:48px;height:48px;color:var(--text);box-shadow:0 10px 28px var(--shadow);cursor:pointer;border-radius:999px;justify-content:center;align-items:center;margin-bottom:14px;transition:transform .2s,background-color .2s,color .2s;display:inline-flex}.theme-toggle:hover{transform:translateY(-2px)}.theme-toggle:focus-visible{outline-offset:2px;outline:2px solid #60a5fa}.danger-button{color:#fff;background:#ef4444}.danger-button:hover{background:#dc2626}.small-button{padding:.85rem 1.15rem;font-size:.95rem}.section-title{color:#111827;margin:0 0 12px;font-size:1.6rem}.component-demo-card{margin-top:24px;padding:28px}.component-stats{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;display:grid}.component-stat{background:#f8fafc;border:1px solid #e2e8f0;border-radius:18px;flex-direction:column;gap:6px;padding:16px 18px;display:flex}.component-stat-label{color:#64748b;font-size:.95rem}.component-stat strong{color:#111827;font-size:1.4rem}.component-details{margin-top:24px}.task-list{gap:12px;margin:0;padding:0;list-style:none;display:grid}.task-item{background:#f8fafc;border:1px solid #e2e8f0;border-radius:14px;padding:12px 14px}.task-label{cursor:pointer;align-items:center;gap:10px;display:flex}.post-list{gap:24px;display:grid}.post-card{overflow:hidden}.image-card{width:100%;height:260px;position:relative}.post-card-content{padding:28px}.post-title-link{color:#111827;margin:0;font-size:1.5rem;font-weight:700;text-decoration:none;display:inline-block}.post-title-link:hover{color:#2563eb}.post-excerpt{color:#475569;white-space:pre-line;margin:18px 0 0;line-height:1.85}.post-meta{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:18px;margin-top:24px;display:flex}.post-date,.small-text{color:#64748b;font-size:.95rem}.inline-form{margin:0}.empty-state{text-align:center;padding:36px}.empty-state p{color:#334155;margin:0 0 18px;font-size:1.05rem}.detail-card,.form-card,.info-card{padding:32px}.detail-header{margin-bottom:20px}.detail-text{color:#334155;white-space:pre-line;margin-top:28px;font-size:1.05rem;line-height:1.9}.form-layout{gap:20px;display:grid}.form-group{gap:10px;display:grid}.form-group label{color:#0f172a;font-weight:700}.input-field,.textarea-field,.file-field{color:#0f172a;background:#f8fafc;border:1px solid #cbd5e1;border-radius:16px;width:100%;padding:14px 16px}.textarea-field{resize:vertical;min-height:160px}.file-field{padding:12px 14px}.image-preview{gap:10px;display:grid}.image-preview-card{width:100%;height:160px;min-height:120px}.back-link{color:#2563eb;margin-bottom:20px;font-weight:700;text-decoration:none;display:inline-flex}.back-link:hover{text-decoration:underline}@media (max-width:768px){.page-shell{padding:24px 18px 48px}.page-header{flex-direction:column;align-items:stretch}.hero-card{padding:28px 22px}.post-meta{flex-direction:column;align-items:flex-start}}@keyframes pop{0%{transform:scale(1)}50%{transform:scale(1.3)}to{transform:scale(1)}}.animate-pop{animation:.4s ease-out pop}pre{position:relative;padding-top:2.5rem!important}.rehype-code-copy-btn{color:#f9fafb;cursor:pointer;background-color:#374151;border:1px solid #4b5563;border-radius:6px;padding:4px 8px;font-size:.75rem;transition:all .2s ease-in-out;position:absolute;top:8px;left:8px}.rehype-code-copy-btn:hover{color:#fff;background-color:#4b5563}.rehype-code-copy-btn[data-copied=true]{background-color:#10b981;border-color:#059669}