:root{--bg-primary: #0d1117;--bg-card: #161b22;--bg-secondary: #21262d;--text-primary: #f0f6fc;--text-secondary: #8b949e;--text-tertiary: #6e7681;--accent-primary: #161b22;--accent-hover: #21262d;--border-color: #30363d;--card-border: #30363d;--disabled-bg: #484f58;--card-shadow: 0 2px 8px rgba(0, 0, 0, .3);--progress-track: rgba(255, 255, 255, .06);--tank-glass: rgba(255, 255, 255, .08);--tank-glow: rgba(72, 187, 120, .3);--dot-grid-color: rgba(255, 255, 255, .03);--color-success: #48bb78;--color-warning: #ecc94b;--color-error: #e53e3e;--color-info: #14b8a6;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", "Consolas", monospace;--font-size-xs: .6875rem;--font-size-sm: .75rem;--font-size-base: .8125rem;--font-size-md: .875rem;--font-size-lg: .9375rem;--font-size-xl: 1rem;--font-size-2xl: 1.25rem;--font-size-3xl: 1.5rem;--font-size-4xl: 1.625rem;--font-size-5xl: 2.25rem;--font-size-6xl: 3rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.2;--line-height-snug: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.625;--letter-spacing-tight: -.025em;--letter-spacing-normal: 0;--letter-spacing-wide: .02em;--letter-spacing-wider: .05em;--letter-spacing-widest: .08em;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--spacing-3xl: 4rem;--radius-sm: .25rem;--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow-md: 0 2px 8px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .5), 0 4px 6px -4px rgba(0, 0, 0, .5);--transition-fast: .1s ease;--transition-normal: .2s ease;--transition-slow: .3s ease}body.light-mode{--bg-primary: #f6f8fa;--bg-card: #ffffff;--bg-secondary: #f0f3f6;--text-primary: #1f2328;--text-secondary: #656d76;--text-tertiary: #8b949e;--accent-primary: #1f2328;--accent-hover: #32383f;--border-color: #d0d7de;--card-border: #d0d7de;--disabled-bg: #afb8c1;--card-shadow: 0 2px 8px rgba(0, 0, 0, .08);--progress-track: #e6e8eb;--tank-glass: rgba(0, 0, 0, .04);--tank-glow: rgba(72, 187, 120, .2);--dot-grid-color: rgba(0, 0, 0, .03)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none;scroll-behavior:smooth}@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}body{font-family:var(--font-sans);font-variant-numeric:tabular-nums;background:var(--bg-primary);color:var(--text-primary);margin:0;padding:0;transition:background-color var(--transition-slow),color var(--transition-slow);min-height:100vh;display:flex;flex-direction:column;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6,button,input,label{line-height:var(--line-height-snug)}h1,h2,h3,h4,h5,h6{text-wrap:balance;color:var(--text-primary)}p,li,figcaption{text-wrap:pretty;max-width:75ch}ul,ol{list-style:none}a:not([class]){text-decoration-skip-ink:auto;color:var(--color-success)}img,picture,svg,video{display:block;max-width:100%;height:auto}input,button,textarea,select{font:inherit;color:inherit}textarea:not([rows]){min-height:10em}:target{scroll-margin-block:5ex}h1{font-size:var(--font-size-5xl);font-weight:var(--font-weight-bold);letter-spacing:var(--letter-spacing-tight);margin-bottom:var(--spacing-md)}h2{font-size:var(--font-size-3xl);font-weight:var(--font-weight-semibold);letter-spacing:var(--letter-spacing-tight);margin-bottom:var(--spacing-md)}h3{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-sm)}h4{font-size:var(--font-size-xl);font-weight:var(--font-weight-medium);margin-bottom:var(--spacing-sm)}h5{font-size:var(--font-size-lg);font-weight:var(--font-weight-medium);margin-bottom:var(--spacing-xs)}h6{font-size:var(--font-size-md);font-weight:var(--font-weight-medium);margin-bottom:var(--spacing-xs)}p{color:var(--text-secondary);margin-bottom:var(--spacing-md);line-height:var(--line-height-normal)}p:last-child{margin-bottom:0}small{font-size:var(--font-size-sm);color:var(--text-tertiary)}strong,b{font-weight:var(--font-weight-semibold)}code,kbd,samp,pre{font-family:var(--font-mono);font-size:var(--font-size-sm)}code{background-color:var(--bg-secondary);padding:.125em .375em;border-radius:var(--radius-sm);color:var(--color-success)}pre{background-color:var(--bg-secondary);padding:var(--spacing-md);border-radius:var(--radius-md);overflow-x:auto;border:1px solid var(--border-color)}pre code{background-color:transparent;padding:0;border-radius:0}a{color:var(--color-success);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--text-primary);text-decoration:underline}a:focus-visible{outline:2px solid var(--color-success);outline-offset:2px;border-radius:var(--radius-sm)}button{width:100%;padding:10px;background:var(--accent-primary);color:#fff;border:none;border-radius:var(--radius-md);cursor:pointer;font-size:var(--font-size-md);transition:background-color var(--transition-normal)}button:hover:not(:disabled){background:var(--accent-hover)}button:disabled{background:var(--disabled-bg);cursor:not-allowed}::selection{background-color:#48bb784d;color:var(--text-primary)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-tertiary)}*{scrollbar-width:thin;scrollbar-color:var(--border-color) var(--bg-secondary)}:focus-visible{outline:2px solid var(--color-success);outline-offset:2px}.text-mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}.text-muted{color:var(--text-tertiary)}.text-secondary{color:var(--text-secondary)}.text-success{color:var(--color-success)}.text-warning{color:var(--color-warning)}.text-error{color:var(--color-error)}.container{max-width:1200px;margin:0 auto;padding:var(--spacing-lg);flex-grow:1;display:flex;flex-direction:column;width:100%}@keyframes spin{to{transform:rotate(360deg)}}.spinner{display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.top-nav{position:sticky;top:0;z-index:1000;background:var(--bg-primary);border-bottom:1px solid var(--border-color);padding:var(--spacing-sm) var(--spacing-lg);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.top-nav-container{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-md)}.nav-brand{display:flex;align-items:center;gap:var(--spacing-sm);text-decoration:none;color:var(--text-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-lg);transition:color var(--transition-fast)}.nav-brand:hover{color:var(--color-success);text-decoration:none}.nav-brand svg{width:28px;height:28px;flex-shrink:0}.nav-brand-text{letter-spacing:var(--letter-spacing-tight)}.nav-links{display:flex;align-items:center;gap:var(--spacing-xs)}.nav-link{display:inline-flex;align-items:center;gap:var(--spacing-xs);height:36px;padding:0 var(--spacing-sm);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);color:var(--text-secondary);text-decoration:none;border-radius:var(--radius-md);transition:all var(--transition-normal);border:1px solid transparent}.nav-link:hover{color:var(--text-primary);background:var(--bg-secondary);text-decoration:none}.nav-link:focus-visible{outline:2px solid var(--color-success);outline-offset:2px}.nav-link svg{width:16px;height:16px;flex-shrink:0;color:currentColor}.nav-link--external{border:1px solid var(--border-color)}.nav-link--external:hover{border-color:var(--color-success);box-shadow:0 0 12px var(--tank-glow)}@media (max-width: 768px){.top-nav{padding:var(--spacing-sm) var(--spacing-md)}.nav-links{gap:var(--spacing-xs)}.nav-link{padding:0 var(--spacing-xs);font-size:var(--font-size-sm)}.nav-link--external .nav-link-text{display:none}.nav-link--external{padding:0 var(--spacing-sm)}.nav-brand-text{display:none}}@media (max-width: 480px){.nav-link:not(.nav-link--external){font-size:var(--font-size-xs);padding:0 var(--spacing-xs)}}.hero{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--spacing-3xl) var(--spacing-lg);min-height:60vh;background:linear-gradient(135deg,var(--bg-primary) 0%,var(--bg-card) 50%,var(--bg-secondary) 100%);position:relative;overflow:hidden}.hero:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(var(--dot-grid-color) 1px,transparent 1px);background-size:24px 24px;pointer-events:none}.hero:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:600px;height:400px;background:radial-gradient(ellipse at center,var(--tank-glow) 0%,transparent 70%);opacity:.4;pointer-events:none}.hero-content{position:relative;z-index:1;max-width:800px;margin:0 auto}.hero-title{font-size:var(--font-size-6xl);font-weight:var(--font-weight-bold);color:var(--text-primary);letter-spacing:var(--letter-spacing-tight);line-height:var(--line-height-tight);margin-bottom:var(--spacing-md)}.hero-subtitle{font-size:var(--font-size-2xl);color:var(--text-secondary);line-height:var(--line-height-normal);margin-bottom:var(--spacing-2xl);max-width:600px;margin-left:auto;margin-right:auto}.hero-highlight{color:var(--color-success)}.terminal-block{display:inline-flex;align-items:center;gap:var(--spacing-sm);background:var(--bg-primary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--spacing-md) var(--spacing-lg);font-family:var(--font-mono);font-size:var(--font-size-lg);box-shadow:var(--shadow-lg);position:relative;transition:border-color var(--transition-normal),box-shadow var(--transition-normal)}.terminal-block:hover{border-color:var(--color-success);box-shadow:0 0 20px var(--tank-glow)}.terminal-dots{display:flex;gap:6px;margin-right:var(--spacing-sm)}.terminal-dot{width:10px;height:10px;border-radius:var(--radius-full)}.terminal-dot--red{background:var(--color-error);box-shadow:0 0 4px var(--color-error)}.terminal-dot--yellow{background:var(--color-warning);box-shadow:0 0 4px var(--color-warning)}.terminal-dot--green{background:var(--color-success);box-shadow:0 0 4px var(--color-success)}.terminal-prompt{color:var(--text-tertiary);-webkit-user-select:none;user-select:none}.terminal-command{color:var(--color-success)}.terminal-copy{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;background:transparent;border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-tertiary);cursor:pointer;transition:all var(--transition-fast);margin-left:var(--spacing-sm)}.terminal-copy:hover{color:var(--text-primary);background:var(--bg-secondary);border-color:var(--color-success)}.terminal-copy:active{transform:scale(.95)}.terminal-copy svg{width:16px;height:16px}.terminal-copy.copied{color:var(--color-success);border-color:var(--color-success);background:#48bb781a;width:auto;padding:0 var(--spacing-sm)}.terminal-copy .copied-text{font-family:var(--font-sans);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-success);white-space:nowrap}.hero-actions{display:flex;align-items:center;justify-content:center;gap:var(--spacing-md);margin-top:var(--spacing-xl);flex-wrap:wrap}.hero-btn{display:inline-flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-xl);border-radius:var(--radius-lg);font-family:var(--font-sans);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);text-decoration:none;border:1px solid transparent;transition:transform var(--transition-fast),box-shadow var(--transition-normal),background-color var(--transition-normal),border-color var(--transition-normal)}.hero-btn svg{width:20px;height:20px}.hero-btn:hover{transform:translateY(-2px)}.hero-btn--npm{background:var(--color-success);color:#0d1117;box-shadow:0 4px 16px #48bb784d}.hero-btn--npm:hover{background:#5dd98a;box-shadow:0 6px 22px #48bb7866}.hero-btn--ghost{background:var(--bg-primary);color:var(--text-primary);border-color:var(--border-color)}.hero-btn--ghost:hover{border-color:var(--color-success);box-shadow:0 0 20px var(--tank-glow)}@media (max-width: 768px){.hero{padding:var(--spacing-2xl) var(--spacing-md);min-height:50vh}.hero-title{font-size:var(--font-size-5xl)}.hero-subtitle{font-size:var(--font-size-xl);margin-bottom:var(--spacing-xl)}.terminal-block{flex-wrap:wrap;justify-content:center;padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-md)}.terminal-dots{display:none}}@media (max-width: 480px){.hero{padding:var(--spacing-xl) var(--spacing-sm)}.hero-title{font-size:var(--font-size-3xl)}.hero-subtitle{font-size:var(--font-size-lg)}.terminal-block{font-size:var(--font-size-base);width:100%;justify-content:space-between}}.dashboard-preview{position:relative;z-index:2;max-width:900px;margin:0 auto;padding:0 var(--spacing-md);margin-top:calc(-1 * var(--spacing-2xl))}.preview-window{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg),0 0 40px #0006;overflow:hidden}.preview-window-header{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:var(--bg-secondary);border-bottom:1px solid var(--border-color)}.preview-window-dots{display:flex;gap:6px}.preview-window-dot{width:10px;height:10px;border-radius:var(--radius-full)}.preview-window-dot--red{background:var(--color-error);box-shadow:0 0 4px var(--color-error)}.preview-window-dot--yellow{background:var(--color-warning);box-shadow:0 0 4px var(--color-warning)}.preview-window-dot--green{background:var(--color-success);box-shadow:0 0 4px var(--color-success)}.preview-window-title{flex:1;text-align:center;font-size:var(--font-size-sm);color:var(--text-tertiary);font-family:var(--font-mono);letter-spacing:var(--letter-spacing-wide)}.preview-window-content{padding:0;background:#0d1117;line-height:0}.preview-screenshot{display:block;width:100%;height:auto}.agent-card{background:var(--bg-card);border:1px solid rgba(255,255,255,.08);border-radius:var(--radius-xl);padding:var(--spacing-lg) var(--spacing-lg) var(--spacing-md);box-shadow:var(--card-shadow);background-image:radial-gradient(var(--dot-grid-color) 1px,transparent 1px);background-size:16px 16px;background-color:var(--bg-card);transition:border-color var(--transition-normal),box-shadow var(--transition-normal)}.agent-card:hover{border-color:#ffffff1f;box-shadow:var(--card-shadow),0 0 20px #0003}.agent-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--spacing-md)}.agent-card-title-group{display:flex;align-items:center;gap:var(--spacing-sm)}.agent-card-icon{width:32px;height:32px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:var(--font-size-lg);background:var(--bg-secondary);border:1px solid var(--border-color)}.agent-card-name{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--text-primary);letter-spacing:var(--letter-spacing-wide)}.agent-card-status{display:flex;align-items:center;gap:var(--spacing-xs);font-size:var(--font-size-xs);color:var(--text-tertiary);text-transform:uppercase;letter-spacing:var(--letter-spacing-widest)}.agent-card-status-dot{width:6px;height:6px;border-radius:var(--radius-full);background:var(--color-success);box-shadow:0 0 6px var(--color-success)}.agent-card-stats{display:flex;flex-direction:column;gap:var(--spacing-md)}.usage-bar{display:flex;flex-direction:column;gap:var(--spacing-xs)}.usage-bar-header{display:flex;align-items:center;justify-content:space-between}.usage-bar-label{font-size:var(--font-size-xs);color:var(--text-tertiary);text-transform:uppercase;letter-spacing:var(--letter-spacing-widest);font-weight:var(--font-weight-medium)}.usage-bar-value{font-family:var(--font-mono);font-size:var(--font-size-sm);color:var(--text-secondary);font-variant-numeric:tabular-nums}.usage-bar-value strong{color:var(--text-primary);font-weight:var(--font-weight-semibold)}.usage-bar-track{height:16px;background:var(--tank-glass);border-radius:var(--radius-sm);overflow:hidden;position:relative;box-shadow:inset 0 2px 4px #0000004d,inset 0 -1px 2px #ffffff0d;background-image:repeating-linear-gradient(90deg,transparent,transparent calc(20% - 1px),rgba(255,255,255,.08) calc(20% - 1px),rgba(255,255,255,.08) 20%)}.usage-bar-fill{height:100%;border-radius:3px;transition:width var(--transition-slow);box-shadow:inset 0 -2px 4px #0003,inset 0 2px 4px #ffffff26,0 0 8px var(--tank-glow)}.usage-bar-fill--success{background:linear-gradient(180deg,#5dd98a 0%,var(--color-success) 100%)}.usage-bar-fill--warning{background:linear-gradient(180deg,#f5d66a 0%,var(--color-warning) 100%);box-shadow:inset 0 -2px 4px #0003,inset 0 2px 4px #ffffff26,0 0 8px #ecc94b4d}.usage-bar-fill--info{background:linear-gradient(180deg,#2dd4bf 0%,var(--color-info) 100%);box-shadow:inset 0 -2px 4px #0003,inset 0 2px 4px #ffffff26,0 0 8px #14b8a64d}@media (max-width: 768px){.dashboard-preview{margin-top:calc(-1 * var(--spacing-xl));padding:0 var(--spacing-sm)}.preview-window-title{display:none}}@media (max-width: 480px){.dashboard-preview{margin-top:calc(-1 * var(--spacing-md))}}.quickstart{background:var(--bg-secondary);padding:var(--spacing-3xl) var(--spacing-lg);position:relative}.quickstart:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,var(--border-color) 20%,var(--border-color) 80%,transparent 100%)}.quickstart-container{max-width:1100px;margin:0 auto}.quickstart-header{text-align:center;margin-bottom:var(--spacing-2xl)}.quickstart-title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--text-primary);letter-spacing:var(--letter-spacing-tight);margin-bottom:var(--spacing-sm)}.quickstart-subtitle{font-size:var(--font-size-lg);color:var(--text-secondary);max-width:650px;margin:0 auto}.quickstart-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-xl);align-items:start}.quickstart-terminal{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-lg)}.quickstart-terminal-header{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:var(--bg-card);border-bottom:1px solid var(--border-color)}.quickstart-terminal-dots{display:flex;gap:6px}.quickstart-terminal-dots span{width:10px;height:10px;border-radius:var(--radius-full)}.quickstart-terminal-dots span:nth-child(1){background:var(--color-error)}.quickstart-terminal-dots span:nth-child(2){background:var(--color-warning)}.quickstart-terminal-dots span:nth-child(3){background:var(--color-success)}.quickstart-terminal-title{font-family:var(--font-mono);font-size:var(--font-size-sm);color:var(--text-tertiary);letter-spacing:var(--letter-spacing-wide)}.quickstart-terminal-body{margin:0;padding:var(--spacing-lg);font-family:var(--font-mono);font-size:var(--font-size-md);line-height:var(--line-height-relaxed);color:var(--text-secondary);overflow-x:auto}.quickstart-terminal-body .ln{display:block;white-space:pre}.quickstart-terminal-body .prompt{color:var(--text-tertiary);-webkit-user-select:none;user-select:none}.quickstart-terminal-body .cmd{color:var(--color-success)}.quickstart-terminal-body .comment{color:var(--text-tertiary)}.quickstart-terminal-body .out{color:var(--text-secondary)}.quickstart-terminal-body .url{color:var(--color-info)}.quickstart-recipes{display:flex;flex-direction:column;gap:var(--spacing-sm)}.recipe{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--spacing-md);transition:border-color var(--transition-normal),box-shadow var(--transition-normal)}.recipe:hover{border-color:var(--color-success);box-shadow:0 0 16px var(--tank-glow)}.recipe-command{display:flex;align-items:center;gap:var(--spacing-sm);font-family:var(--font-mono);font-size:var(--font-size-sm);cursor:pointer;background:none;border:none;padding:0;width:100%;text-align:left;color:var(--color-success)}.recipe-command .prompt{color:var(--text-tertiary);-webkit-user-select:none;user-select:none}.recipe-command .copy-hint{margin-left:auto;font-family:var(--font-sans);font-size:var(--font-size-xs);color:var(--text-tertiary);opacity:0;transition:opacity var(--transition-fast)}.recipe:hover .copy-hint{opacity:1}.recipe-command.copied .copy-hint{opacity:1;color:var(--color-success)}.recipe-description{font-size:var(--font-size-sm);color:var(--text-secondary);margin:var(--spacing-xs) 0 0 0;line-height:var(--line-height-normal)}@media (max-width: 900px){.quickstart-grid{grid-template-columns:1fr;gap:var(--spacing-lg)}}@media (max-width: 768px){.quickstart{padding:var(--spacing-2xl) var(--spacing-md)}.quickstart-title{font-size:var(--font-size-2xl)}.quickstart-subtitle{font-size:var(--font-size-md)}.quickstart-terminal-body{font-size:var(--font-size-sm)}}@media (max-width: 480px){.quickstart{padding:var(--spacing-xl) var(--spacing-sm)}}.features{background:var(--bg-secondary);padding:var(--spacing-3xl) var(--spacing-lg);position:relative}.features:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,var(--border-color) 20%,var(--border-color) 80%,transparent 100%)}.features-container{max-width:1100px;margin:0 auto}.features-header{text-align:center;margin-bottom:var(--spacing-2xl)}.features-title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--text-primary);letter-spacing:var(--letter-spacing-tight);margin-bottom:var(--spacing-sm)}.features-subtitle{font-size:var(--font-size-lg);color:var(--text-secondary);max-width:600px;margin:0 auto}.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-lg)}.feature-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-xl);padding:var(--spacing-lg);transition:transform var(--transition-normal),border-color var(--transition-normal),box-shadow var(--transition-normal);background-image:radial-gradient(var(--dot-grid-color) 1px,transparent 1px);background-size:16px 16px;background-color:var(--bg-card)}.feature-card:hover{transform:translateY(-4px);border-color:var(--color-success);box-shadow:var(--shadow-lg),0 0 20px var(--tank-glow)}.feature-card-icon{width:48px;height:48px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;background:var(--bg-secondary);border:1px solid var(--border-color);margin-bottom:var(--spacing-md);color:var(--color-success);transition:background-color var(--transition-normal),border-color var(--transition-normal)}.feature-card:hover .feature-card-icon{background:#48bb781a;border-color:var(--color-success)}.feature-card-icon svg{width:24px;height:24px}.feature-card-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-sm);letter-spacing:var(--letter-spacing-wide)}.feature-card-description{font-size:var(--font-size-md);color:var(--text-secondary);line-height:var(--line-height-relaxed);margin:0}@media (max-width: 900px){.features-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 768px){.features{padding:var(--spacing-2xl) var(--spacing-md)}.features-title{font-size:var(--font-size-2xl)}.features-subtitle{font-size:var(--font-size-md)}.features-grid{gap:var(--spacing-md)}.feature-card{padding:var(--spacing-md)}.feature-card-icon{width:40px;height:40px}.feature-card-icon svg{width:20px;height:20px}}@media (max-width: 480px){.features{padding:var(--spacing-xl) var(--spacing-sm)}.features-grid{grid-template-columns:1fr}.feature-card:hover{transform:translateY(-2px)}}.how-it-works{background:var(--bg-primary);padding:var(--spacing-3xl) var(--spacing-lg);position:relative}.how-it-works:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,var(--border-color) 20%,var(--border-color) 80%,transparent 100%)}.how-it-works-container{max-width:1100px;margin:0 auto}.how-it-works-header{text-align:center;margin-bottom:var(--spacing-2xl)}.how-it-works-title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--text-primary);letter-spacing:var(--letter-spacing-tight);margin-bottom:var(--spacing-sm)}.how-it-works-subtitle{font-size:var(--font-size-lg);color:var(--text-secondary);max-width:650px;margin:0 auto}.arch-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-lg);margin-bottom:var(--spacing-2xl)}.arch-step{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-xl);padding:var(--spacing-lg);position:relative;transition:transform var(--transition-normal),border-color var(--transition-normal),box-shadow var(--transition-normal);background-image:radial-gradient(var(--dot-grid-color) 1px,transparent 1px);background-size:16px 16px;background-color:var(--bg-card)}.arch-step:hover{transform:translateY(-4px);border-color:var(--color-success);box-shadow:var(--shadow-lg),0 0 20px var(--tank-glow)}.arch-step-badge{position:absolute;top:calc(-1 * var(--spacing-sm) - 4px);left:var(--spacing-lg);width:32px;height:32px;background:var(--color-success);color:var(--bg-primary);font-family:var(--font-mono);font-size:var(--font-size-md);font-weight:var(--font-weight-bold);border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;box-shadow:0 0 12px var(--tank-glow),0 2px 4px #0000004d;border:2px solid var(--bg-primary)}.arch-step-icon{width:48px;height:48px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;background:var(--bg-secondary);border:1px solid var(--border-color);margin-bottom:var(--spacing-md);margin-top:var(--spacing-sm);color:var(--color-success);transition:background-color var(--transition-normal),border-color var(--transition-normal)}.arch-step:hover .arch-step-icon{background:#48bb781a;border-color:var(--color-success)}.arch-step-icon svg{width:24px;height:24px}.arch-step-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-sm);letter-spacing:var(--letter-spacing-wide)}.arch-step-code{font-family:var(--font-mono);font-size:var(--font-size-sm);color:var(--color-success);background:var(--bg-secondary);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-md);display:inline-block;margin-bottom:var(--spacing-sm);border:1px solid var(--border-color)}.arch-step-description{font-size:var(--font-size-md);color:var(--text-secondary);line-height:var(--line-height-relaxed);margin:0}.security-note{background:#e53e3e14;border:2px solid var(--color-error);border-radius:var(--radius-xl);padding:var(--spacing-lg);position:relative;display:flex;gap:var(--spacing-md);align-items:flex-start;box-shadow:0 0 20px #e53e3e26}.security-note-icon{width:48px;height:48px;min-width:48px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;background:#e53e3e26;border:1px solid var(--color-error);color:var(--color-error)}.security-note-icon svg{width:24px;height:24px}.security-note-content{flex:1}.security-note-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-error);margin-bottom:var(--spacing-sm);letter-spacing:var(--letter-spacing-wide);text-transform:uppercase}.security-note-text{font-size:var(--font-size-md);color:var(--text-secondary);line-height:var(--line-height-relaxed);margin:0 0 var(--spacing-md) 0}.security-note-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-sm)}.security-note-list li{font-size:var(--font-size-md);color:var(--text-primary);display:flex;align-items:center;gap:var(--spacing-sm)}.security-note-list li:before{content:"";width:8px;height:8px;min-width:8px;background:var(--color-error);border-radius:var(--radius-full);box-shadow:0 0 6px var(--color-error)}@media (max-width: 900px){.arch-steps{grid-template-columns:1fr;gap:var(--spacing-xl)}.arch-step{display:flex;flex-direction:row;align-items:flex-start;gap:var(--spacing-md);padding-top:var(--spacing-lg)}.arch-step-badge{position:static;min-width:32px;margin-top:var(--spacing-xs)}.arch-step-icon{display:none}.arch-step-content{flex:1}.security-note-list{grid-template-columns:1fr}}@media (max-width: 768px){.how-it-works{padding:var(--spacing-2xl) var(--spacing-md)}.how-it-works-title{font-size:var(--font-size-2xl)}.how-it-works-subtitle{font-size:var(--font-size-md)}.arch-step{padding:var(--spacing-md)}.security-note{flex-direction:column;padding:var(--spacing-md)}.security-note-icon{width:40px;height:40px;min-width:40px}.security-note-icon svg{width:20px;height:20px}}@media (max-width: 480px){.how-it-works{padding:var(--spacing-xl) var(--spacing-sm)}.arch-step:hover{transform:translateY(-2px)}.arch-step-badge{width:28px;height:28px;min-width:28px;font-size:var(--font-size-sm)}}.site-footer{width:100%;background:var(--bg-primary);border-top:1px solid var(--border-color);padding:var(--spacing-lg) var(--spacing-lg);margin-top:auto}.footer-container{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-md)}.footer-copyright{color:var(--text-tertiary);font-size:var(--font-size-sm);line-height:var(--line-height-normal)}.footer-links{display:flex;align-items:center;gap:var(--spacing-sm)}.footer-link{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--text-tertiary);text-decoration:none;border-radius:var(--radius-md);border:1px solid var(--border-color);transition:all var(--transition-normal)}.footer-link:hover{color:var(--text-primary);border-color:var(--color-success);background:var(--bg-secondary);box-shadow:0 0 12px var(--tank-glow);text-decoration:none}.footer-link:focus-visible{outline:2px solid var(--color-success);outline-offset:2px}.footer-link svg{width:14px;height:14px;flex-shrink:0;color:currentColor}@media (max-width: 768px){.site-footer{padding:var(--spacing-md) var(--spacing-md)}.footer-container{flex-direction:column;gap:var(--spacing-md);text-align:center}.footer-links{gap:var(--spacing-xs)}}@media (max-width: 480px){.footer-link{padding:var(--spacing-xs)}.footer-link-text{display:none}}