.how-demo{max-width:760px;margin:0 auto;}.how-demo-stage{border:1px solid var(--border);border-radius:18px;background:linear-gradient(165deg,#F8FAFC 0%,#EEF4FF 48%,#F8FAFC 100%);box-shadow:var(--shadow-sm);overflow:hidden;}html[data-theme="dark"] .how-demo-stage{background:linear-gradient(165deg,#111827 0%,#0f172a 50%,#111827 100%);}.how-demo-window{margin:1rem;border:1px solid var(--border);border-radius:14px;background:var(--surface);overflow:hidden;box-shadow:0 10px 28px rgba(15,23,42,0.06);}.how-demo-chrome{display:flex;align-items:center;gap:0.65rem;padding:0.65rem 0.85rem;border-bottom:1px solid var(--border);background:#F1F5F9;}html[data-theme="dark"] .how-demo-chrome{background:#0f172a;}.how-demo-dots{display:inline-flex;gap:0.28rem;flex-shrink:0;}.how-demo-dots i{width:8px;height:8px;border-radius:50%;display:block;}.how-demo-dots i:nth-child(1){background:#FCA5A5;}.how-demo-dots i:nth-child(2){background:#FCD34D;}.how-demo-dots i:nth-child(3){background:#86EFAC;}.how-demo-address{flex:1;min-width:0;display:flex;align-items:center;gap:0.4rem;border:1px solid var(--border);border-radius:999px;background:#fff;padding:0.35rem 0.7rem;position:relative;overflow:hidden;min-height:30px;}html[data-theme="dark"] .how-demo-address{background:#111827;}.how-demo-lock{color:#64748B;display:inline-flex;flex-shrink:0;}.how-demo-address-text{position:absolute;left:1.7rem;right:0.7rem;font-size:0.75rem;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;}.how-demo:not(.is-playing) .how-demo-address-google{opacity:1;position:static;}.how-demo.is-playing .how-demo-address-google{animation:howAddrGoogle 15s ease-in-out infinite;}.how-demo.is-playing .how-demo-address-df{animation:howAddrDf 15s ease-in-out infinite;}.how-demo.is-playing .how-demo-address-tool{animation:howAddrTool 15s ease-in-out infinite;}@keyframes howAddrGoogle{0%,22%{opacity:1;}26%,100%{opacity:0;}}@keyframes howAddrDf{0%,24%{opacity:0;}28%,42%{opacity:1;}46%,100%{opacity:0;}}@keyframes howAddrTool{0%,44%{opacity:0;}48%,100%{opacity:1;}}.how-demo-google-brand{text-align:center;font-family:var(--display);font-size:1.65rem;font-weight:700;letter-spacing:-0.04em;margin:0.15rem 0 0.75rem;line-height:1;}.how-demo-google-brand .g1{color:#4285F4;}.how-demo-google-brand .g2{color:#EA4335;}.how-demo-google-brand .g3{color:#FBBC05;}.how-demo-google-brand .g4{color:#4285F4;}.how-demo-google-brand .g5{color:#34A853;}.how-demo-google-brand .g6{color:#EA4335;}.how-demo-site-brand{display:flex;flex-direction:column;gap:0.15rem;margin-bottom:0.75rem;}.how-demo-site-brand strong{font-family:var(--display);font-size:1.05rem;color:var(--text);}.how-demo-site-brand span{font-size:0.78rem;color:var(--muted);}.how-demo-viewport{position:relative;min-height:340px;}.how-demo-body{position:relative;min-height:340px;overflow:hidden;}.how-demo-cursor{position:absolute;left:0;top:0;z-index:30;width:32px;height:32px;margin:0;opacity:0;pointer-events:none;transform:translate(-2px,-2px);will-change:left,top,opacity,transform;}.how-demo-cursor.is-visible{opacity:1;}.how-demo-cursor-arrow{display:block;filter:drop-shadow(0 3px 6px rgba(15,23,42,0.35));}.how-demo-cursor-click{position:absolute;left:0;top:0;width:22px;height:22px;border-radius:50%;border:2px solid rgba(37,99,235,0.65);background:rgba(37,99,235,0.12);opacity:0;transform:scale(0.35);pointer-events:none;}.how-demo-cursor.is-clicking .how-demo-cursor-click{opacity:1;animation:howCursorRipple 0.45s ease-out;}@keyframes howCursorRipple{0%{opacity:0.9;transform:scale(0.35);}100%{opacity:0;transform:scale(1.8);}}.how-demo-caption{display:flex;align-items:center;justify-content:center;gap:0.65rem;margin:0.95rem auto 0;max-width:36rem;text-align:center;color:var(--muted);font-size:0.9rem;line-height:1.45;min-height:2.6rem;}.how-demo-caption-step{flex:0 0 auto;font-size:0.72rem;font-weight:800;letter-spacing:0.04em;color:var(--primary-dark);background:var(--primary-soft);border-radius:999px;padding:0.28rem 0.55rem;}.how-demo-scene{position:absolute;inset:0;padding:1rem 1.05rem 1.15rem;opacity:0;pointer-events:none;}.how-demo:not(.is-playing) .how-demo-scene-search{opacity:1;position:relative;}.how-demo.is-playing .how-demo-scene-search{animation:howSceneSearch 15s ease-in-out infinite;}.how-demo.is-playing .how-demo-scene-paste{animation:howScenePaste 15s ease-in-out infinite;}.how-demo.is-playing .how-demo-scene-tool{animation:howSceneTool 15s ease-in-out infinite;}.how-demo.is-playing .how-demo-scene-result{animation:howSceneResult 15s ease-in-out infinite;}@keyframes howSceneSearch{0%,22%{opacity:1;}26%,100%{opacity:0;}}@keyframes howScenePaste{0%,24%{opacity:0;}28%,42%{opacity:1;}46%,100%{opacity:0;}}@keyframes howSceneTool{0%,44%{opacity:0;}48%,74%{opacity:1;}78%,100%{opacity:0;}}@keyframes howSceneResult{0%,76%{opacity:0;}80%,95%{opacity:1;}100%{opacity:0;}}.how-demo-scene-search{background:#fff;}html[data-theme="dark"] .how-demo-scene-search{background:transparent;}.how-demo-searchbar{display:flex;align-items:center;gap:0.55rem;border:1px solid #E8EAED;border-radius:999px;padding:0.55rem 0.85rem;background:#fff;margin-bottom:0.85rem;box-shadow:0 1px 6px rgba(32,33,36,0.18);position:relative;overflow:hidden;min-height:42px;}html[data-theme="dark"] .how-demo-searchbar{background:var(--bg-elevated);border-color:var(--border);box-shadow:none;}.how-demo-search-icon{color:var(--muted);display:inline-flex;}.how-demo-search-zoom{transform-origin:center top;}.how-demo.is-playing .how-demo-search-zoom{animation:howSearchZoom 15s ease-in-out infinite;}@keyframes howSearchZoom{0%,2%{transform:scale(1);}5%,12%{transform:scale(1.08);}16%,100%{transform:scale(1);}}.how-demo-search-query-full{max-width:0;overflow:hidden;white-space:nowrap;opacity:0;font-size:0.86rem;color:var(--text);font-weight:600;}.how-demo:not(.is-playing) .how-demo-search-query-full{max-width:none;opacity:1;}.how-demo.is-playing .how-demo-search-query-full{animation:howTypeQuery 15s steps(18,end) infinite;}@keyframes howTypeQuery{0%,4%{max-width:0;opacity:0;}6%{opacity:1;}14%,100%{max-width:200px;opacity:1;}}.how-demo.is-playing .how-demo-serp{animation:howSerpReveal 15s ease-in-out infinite;}@keyframes howSerpReveal{0%,10%{opacity:0;transform:translateY(8px);}14%,100%{opacity:1;transform:translateY(0);}}.how-demo-search-query{font-size:0.86rem;color:var(--text);font-weight:600;}.how-demo-search-query-empty{display:none;}.how-demo-serp{list-style:none;margin:0;padding:0;display:grid;gap:0.45rem;}.how-demo-serp-item{position:relative;border:1px solid transparent;border-radius:10px;padding:0.45rem 0.55rem;}.how-demo-serp-host{display:block;font-size:0.72rem;color:#047857;margin-bottom:0.1rem;}html[data-theme="dark"] .how-demo-serp-host{color:#34D399;}.how-demo-serp-title{display:block;font-size:0.88rem;color:#1D4ED8;margin-bottom:0.12rem;font-weight:700;}html[data-theme="dark"] .how-demo-serp-title{color:#93C5FD;}.how-demo-serp-snip{display:block;font-size:0.74rem;color:var(--muted);line-height:1.35;}.how-demo-serp-skel{display:grid;gap:0.38rem;padding:0.1rem 0;}.how-demo-skel-host,.how-demo-skel-title,.how-demo-skel-snip{display:block;height:8px;border-radius:4px;background:#CBD5E1;}html[data-theme="dark"] .how-demo-skel-host,html[data-theme="dark"] .how-demo-skel-title,html[data-theme="dark"] .how-demo-skel-snip{background:#475569;}.how-demo-skel-host{width:38%;height:7px;background:#94A3B8;}.how-demo-skel-title{width:78%;height:10px;}.how-demo-skel-snip{width:92%;}.how-demo-serp-item.is-blur{filter:blur(3.2px);opacity:0.4;user-select:none;pointer-events:none;}.how-demo.is-playing .how-demo-serp-item.is-blur{animation:howBlurPulse 15s ease-in-out infinite;}@keyframes howBlurPulse{0%,6%{filter:blur(1.8px);opacity:0.55;}12%,30%{filter:blur(3.8px);opacity:0.32;}34%,100%{filter:blur(3.8px);opacity:0.32;}}.how-demo-serp-item.is-ours{border-color:#BFDBFE;background:rgba(239,246,255,0.95);z-index:2;filter:none;opacity:1;}html[data-theme="dark"] .how-demo-serp-item.is-ours{background:rgba(37,99,235,0.16);border-color:rgba(96,165,250,0.45);}.how-demo.is-playing .how-demo-serp-item.is-ours{animation:howOursFocus 15s ease-in-out infinite;}@keyframes howOursFocus{0%,10%{transform:scale(1);box-shadow:none;}16%,30%{transform:scale(1.015);box-shadow:0 8px 22px rgba(37,99,235,0.2);}34%,100%{transform:scale(1);box-shadow:none;}}.how-demo-search-type{margin-left:auto;width:2px;height:1rem;background:var(--primary);opacity:0;}.how-demo.is-playing .how-demo-search-type{animation:howSearchCaret 15s steps(1,end) infinite;}@keyframes howSearchCaret{0%,2%{opacity:0;}3%,10%{opacity:1;}12%,100%{opacity:0;}}.how-demo-paste-label{margin:0 0 0.45rem;font-size:0.82rem;font-weight:600;color:var(--muted);}.how-demo-paste-row{display:flex;gap:0.55rem;align-items:stretch;}.how-demo-paste-field{position:relative;flex:1;min-height:46px;border:1px solid var(--border);border-radius:10px;padding:0.7rem 0.85rem;background:var(--bg-elevated);overflow:hidden;}.how-demo-paste-placeholder,.how-demo-paste-url{font-size:0.84rem;white-space:nowrap;}.how-demo-paste-placeholder{color:#94A3B8;}.how-demo-paste-url{position:absolute;left:0.85rem;top:50%;transform:translateY(-50%);color:var(--text);opacity:0;max-width:calc(100% - 1.4rem);overflow:hidden;text-overflow:ellipsis;}.how-demo.is-playing .how-demo-paste-placeholder{animation:howPlaceholder 15s ease-in-out infinite;}.how-demo.is-playing .how-demo-paste-url{animation:howPasteUrl 15s ease-in-out infinite;}@keyframes howPlaceholder{0%,30%{opacity:1;}34%,100%{opacity:0;}}@keyframes howPasteUrl{0%,32%{opacity:0;}36%,42%{opacity:1;}46%,100%{opacity:0;}}.how-demo-caret{position:absolute;left:0.85rem;top:50%;width:2px;height:1.05rem;margin-top:-0.52rem;background:var(--primary);opacity:0;}.how-demo.is-playing .how-demo-caret{animation:howCaret 15s steps(1,end) infinite;}@keyframes howCaret{0%,30%{opacity:0;}32%,35%{opacity:1;}36%,100%{opacity:0;}}.how-demo-paste-btn{display:inline-flex;align-items:center;justify-content:center;padding:0 0.95rem;border-radius:10px;background:var(--primary);color:#fff;font-size:0.8rem;font-weight:700;white-space:nowrap;}.how-demo.is-playing .how-demo-paste-btn{animation:howBtnPulse 15s ease-in-out infinite;}@keyframes howBtnPulse{0%,38%{transform:scale(1);box-shadow:none;}40%,43%{transform:scale(1.04);box-shadow:0 0 0 4px rgba(37,99,235,0.18);}46%,100%{transform:scale(1);box-shadow:none;}}.how-demo-detect{margin:0.75rem 0 0;font-size:0.84rem;font-weight:600;color:var(--primary-dark);opacity:0;}.how-demo.is-playing .how-demo-detect{animation:howDetect 15s ease-in-out infinite;}@keyframes howDetect{0%,36%{opacity:0;transform:translateY(4px);}38%,42%{opacity:1;transform:translateY(0);}46%,100%{opacity:0;}}.how-demo-kicker{margin:0 0 0.55rem;font-size:0.75rem;font-weight:700;letter-spacing:0.03em;text-transform:uppercase;color:var(--primary-dark);}.how-demo-tool-url{border:1px solid var(--border);border-radius:10px;padding:0.65rem 0.8rem;background:var(--bg-elevated);font-size:0.82rem;color:var(--muted);margin-bottom:0.75rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.how-demo-human{position:relative;display:flex;gap:0.75rem;align-items:flex-start;border:1px solid var(--border);border-radius:12px;padding:0.85rem 0.95rem;background:var(--bg-elevated);margin-bottom:0.85rem;opacity:0;}.how-demo-human strong{display:block;font-size:0.92rem;margin-bottom:0.15rem;}.how-demo-human p{margin:0;font-size:0.78rem;color:var(--muted);}.how-demo-human-box{width:22px;height:22px;border-radius:6px;border:2px solid #94A3B8;flex-shrink:0;margin-top:0.1rem;background:#fff;}html[data-theme="dark"] .how-demo-human-box{background:#0f172a;}.how-demo-human-check{position:absolute;left:0.95rem;top:0.9rem;width:22px;height:22px;border-radius:6px;background:var(--primary);color:#fff;font-size:0.75rem;font-weight:800;display:inline-flex;align-items:center;justify-content:center;opacity:0;transform:scale(0.6);}.how-demo.is-playing .how-demo-human{animation:howHumanPanel 15s ease-in-out infinite;}.how-demo.is-playing .how-demo-human-check{animation:howHumanCheck 15s ease-in-out infinite;}@keyframes howHumanPanel{0%,48%{opacity:0;transform:translateY(8px);}52%,68%{opacity:1;transform:translateY(0);}72%,100%{opacity:0;}}@keyframes howHumanCheck{0%,54%{opacity:0;transform:scale(0.6);}57%,68%{opacity:1;transform:scale(1);}72%,100%{opacity:0;transform:scale(0.6);}}.how-demo-tool-fetch{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:0.55rem;min-height:84px;opacity:0;}.how-demo-tool-fetch p{margin:0;color:var(--muted);font-size:0.9rem;}.how-demo.is-playing .how-demo-tool-fetch{animation:howToolFetch 15s ease-in-out infinite;}@keyframes howToolFetch{0%,58%{opacity:0;}62%,74%{opacity:1;}78%,100%{opacity:0;}}.how-demo-ready-static{display:flex;flex-direction:column;justify-content:center;gap:1rem;height:100%;}.how-demo-process,.how-demo-ready{position:absolute;inset:1.15rem 1.1rem 1.25rem;}.how-demo-process{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:0.7rem;}.how-demo-process p{margin:0;color:var(--muted);font-size:0.92rem;}.how-demo-spinner{width:34px;height:34px;border-radius:50%;border:3px solid #DBEAFE;border-top-color:var(--primary);}.how-demo.is-playing .how-demo-spinner{animation:howSpin 0.8s linear infinite,howSpinnerShow 15s ease-in-out infinite;}@keyframes howSpin{to{transform:rotate(360deg);}}@keyframes howSpinnerShow{0%,60%{opacity:0;}62%,74%{opacity:1;}78%,100%{opacity:0;}}.how-demo-progress{width:min(220px,70%);height:6px;border-radius:999px;background:#E2E8F0;overflow:hidden;opacity:0;}html[data-theme="dark"] .how-demo-progress{background:#334155;}.how-demo.is-playing .how-demo-progress{animation:howProgressShow 15s ease-in-out infinite;}.how-demo.is-playing .how-demo-progress span{display:block;height:100%;width:0;background:var(--primary);border-radius:inherit;animation:howProgressFill 15s ease-in-out infinite;}@keyframes howProgressShow{0%,60%{opacity:0;}62%,74%{opacity:1;}78%,100%{opacity:0;}}@keyframes howProgressFill{0%,62%{width:0;}74%{width:100%;}78%,100%{width:100%;}}.how-demo-ready{display:flex;flex-direction:column;justify-content:center;gap:1rem;opacity:0;}.how-demo.is-playing .how-demo-process{animation:howProcessPanel 15s ease-in-out infinite;}.how-demo.is-playing .how-demo-ready{animation:howReady 15s ease-in-out infinite;}@keyframes howProcessPanel{0%,64%{opacity:0;}66%,78%{opacity:1;}84%,100%{opacity:0;}}@keyframes howReady{0%,80%{opacity:0;transform:translateY(8px);}84%,94%{opacity:1;transform:translateY(0);}100%{opacity:0;}}.how-demo-file{display:flex;align-items:center;gap:0.8rem;border:1px solid var(--border);border-radius:12px;padding:0.85rem 1rem;background:var(--bg-elevated);}.how-demo-file-icon{width:42px;height:42px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;background:#FEE2E2;color:#B91C1C;font-size:0.72rem;font-weight:800;}.how-demo-file strong{display:block;font-size:0.95rem;}.how-demo-file span{color:var(--muted);font-size:0.82rem;}.how-demo-dl{display:inline-flex;align-items:center;justify-content:center;align-self:stretch;min-height:44px;border-radius:10px;background:var(--primary);color:#fff;font-weight:700;font-size:0.9rem;}.how-demo.is-playing .how-demo-dl{animation:howDlPulse 15s ease-in-out infinite;}@keyframes howDlPulse{0%,84%{transform:scale(1);}88%,92%{transform:scale(1.03);box-shadow:0 8px 20px rgba(37,99,235,0.28);}96%,100%{transform:scale(1);}}.how-demo-steps{list-style:none;margin:1.15rem 0 0;padding:0.15rem 0.1rem 0;display:flex;align-items:flex-start;justify-content:space-between;gap:0;width:100%;}.how-demo-step{position:relative;flex:1 1 0;display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0;color:var(--muted);}.how-demo-step:not(:last-child)::after{content:"";position:absolute;top:11px;left:calc(50%+14px);right:calc(-50%+14px);height:2px;background:#E2E8F0;border-radius:999px;z-index:0;}html[data-theme="dark"] .how-demo-step:not(:last-child)::after{background:#334155;}.how-demo-step.is-done:not(:last-child)::after,.how-demo-step.is-active:not(:last-child)::after{background:linear-gradient(90deg,var(--primary) 0%,#93C5FD 100%);}.how-demo-step-dot{position:relative;z-index:1;width:24px;height:24px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;background:#fff;border:2px solid #CBD5E1;margin-bottom:0.45rem;box-shadow:0 0 0 3px #fff;}html[data-theme="dark"] .how-demo-step-dot{background:#0f172a;box-shadow:0 0 0 3px #0f172a;border-color:#475569;}.how-demo-step-num{font-size:0.68rem;font-weight:800;line-height:1;color:#94A3B8;}.how-demo-step-label{font-size:0.72rem;font-weight:600;line-height:1.25;max-width:7.5rem;padding:0 0.15rem;}.how-demo-step.is-active{color:var(--text);}.how-demo-step.is-active .how-demo-step-dot{border-color:var(--primary);background:var(--primary);box-shadow:0 0 0 4px var(--primary-soft);}.how-demo-step.is-active .how-demo-step-num{color:#fff;}.how-demo-step.is-done .how-demo-step-dot{border-color:var(--primary);background:var(--primary-soft);}.how-demo-step.is-done .how-demo-step-num{color:var(--primary-dark);}.how-demo-step.is-done .how-demo-step-label{color:var(--text);}@media (max-width:640px){.how-demo-viewport,.how-demo-body{min-height:380px;}.how-demo-paste-row{flex-direction:column;}.how-demo-paste-btn{min-height:42px;}.how-demo-caption{font-size:0.84rem;}.how-demo-steps{margin-top:1rem;}.how-demo-step-dot{width:20px;height:20px;margin-bottom:0.35rem;}.how-demo-step:not(:last-child)::after{top:9px;left:calc(50%+12px);right:calc(-50%+12px);}.how-demo-step-num{font-size:0.62rem;}.how-demo-step-label{font-size:0.62rem;max-width:4.8rem;}}@media (prefers-reduced-motion:reduce){.how-demo-body{min-height:0 !important;display:grid !important;gap:0.85rem;padding:1rem;}.how-demo-scene{position:relative !important;inset:auto !important;opacity:1 !important;padding:0.9rem;border:1px solid var(--border);border-radius:12px;background:var(--bg-elevated);}.how-demo-process{display:none !important;}.how-demo-ready{position:relative !important;inset:auto !important;opacity:1 !important;}.how-demo-serp-item.is-blur{filter:blur(2.8px) !important;opacity:0.35 !important;}.how-demo-cursor,.how-demo-caret,.how-demo-human-check{display:none !important;}.how-demo-human,.how-demo-tool-fetch,.how-demo-search-query-full,.how-demo-address-df{opacity:1 !important;max-width:none !important;}.how-demo-address-google,.how-demo-address-tool{display:none !important;}.how-demo-paste-placeholder{display:none !important;}.how-demo-paste-url{position:static !important;opacity:1 !important;transform:none !important;}.how-demo-detect{opacity:1 !important;}.how-demo-step.is-active .how-demo-step-dot,.how-demo-step.is-done .how-demo-step-dot{border-color:var(--primary);background:var(--primary-soft);}.how-demo-step.is-active .how-demo-step-num,.how-demo-step.is-done .how-demo-step-num{color:var(--primary-dark);}}