.guide-page,.guide-present{--frame:var(--foreground);--canvas:var(--accent);--ph-top:var(--muted);--ph-bottom:color-mix(in oklch, var(--border) 60%, var(--muted));--ph-line:color-mix(in oklch, var(--muted-foreground) 45%, var(--border));--shadow:0 1px 2px color-mix(in oklch, var(--camera) 4%, transparent), 0 12px 32px -12px color-mix(in oklch, var(--camera) 18%, transparent)}.guide-page{overflow-x:clip}.dark .guide-page,.dark .guide-present{--frame:color-mix(in oklch, var(--foreground) 20%, var(--background));--canvas:color-mix(in oklch, var(--background) 50%, var(--camera));--ph-top:color-mix(in oklch, var(--card) 60%, var(--muted));--ph-bottom:var(--card);--ph-line:color-mix(in oklch, var(--muted-foreground) 35%, var(--card));--shadow:0 1px 2px color-mix(in oklch, var(--camera) 30%, transparent), 0 16px 40px -12px color-mix(in oklch, var(--camera) 60%, transparent)}.guide-wrap,.guide-layout{max-width:1040px;padding:0 max(16px, env(safe-area-inset-right)) 0 max(16px, env(safe-area-inset-left));margin:0 auto}.guide-toc{display:none}@media (min-width:1100px){.guide-layout{grid-template-columns:232px minmax(0,1fr);gap:56px;max-width:1320px;padding:0 32px;display:grid}.guide-toc{top:calc(60px + env(safe-area-inset-top));max-height:calc(100dvh - 60px - env(safe-area-inset-top));flex-direction:column;align-self:start;padding:40px 0 24px;display:flex;position:sticky}}.guide-up{min-height:44px;color:var(--muted-foreground);border-radius:999px;align-self:flex-start;align-items:center;gap:4px;margin-left:-8px;padding:0 12px 0 6px;font-size:15px;font-weight:500;transition:background .15s,color .15s;display:inline-flex}.guide-up svg{width:18px;height:18px}.guide-up:hover{background:var(--muted);color:var(--foreground)}main>.guide-up{margin-top:24px}.guide-toc-head{letter-spacing:.02em;text-transform:uppercase;color:var(--muted-foreground);margin:20px 0 8px;padding:0 10px;font-size:13px;font-weight:500}.guide-list{flex-direction:column;gap:2px;margin:0;padding:0;list-style:none;display:flex}.guide-list a{min-height:40px;color:var(--muted-foreground);border-radius:12px;align-items:center;gap:10px;padding:6px 10px;font-size:14px;line-height:1.3;transition:background .15s,color .15s;display:flex}.guide-list a:hover{background:var(--muted);color:var(--foreground)}.guide-list a[aria-current=step]{background:var(--muted);color:var(--foreground);font-weight:500}.guide-list-num{border:1px solid var(--border);font-variant-numeric:tabular-nums;border-radius:999px;flex:none;place-items:center;width:24px;height:24px;font-size:12px;font-weight:600;display:grid}.guide-list a[aria-current=step] .guide-list-num{background:var(--foreground);border-color:var(--foreground);color:var(--background)}.guide-list-title{text-wrap:pretty;min-width:0}.guide-roomy a{gap:12px;min-height:52px;padding:8px 12px;font-size:16px}.guide-roomy .guide-list-num{width:28px;height:28px;font-size:13px}.guide-sheet{background:var(--card);gap:0;padding:0}.guide-sheet[data-side=bottom]{border-top:0;border-radius:24px 24px 0 0;max-height:82dvh}.guide-sheet[data-side=right]{width:380px;max-width:90vw}.guide-dock{z-index:10;border-top:1px solid var(--border);background:var(--background);padding:10px max(16px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));position:sticky;bottom:0}.guide-dock>div{gap:10px;max-width:560px;margin:0 auto;display:flex}@media (min-width:1100px){.guide-dock{display:none}}.guide-end{background:var(--card);box-shadow:var(--shadow);border-radius:24px;margin:0 0 64px;padding:24px}.guide-end h2{letter-spacing:-.02em;margin:0;font-size:22px;font-weight:600}.guide-end p{color:var(--muted-foreground);text-wrap:pretty;margin:6px 0 0;font-size:16px}.guide-end>div{flex-wrap:wrap;gap:10px;margin-top:18px;display:flex}.dark .guide-end{box-shadow:none}@media (max-width:760px){.guide-end{margin-bottom:32px;padding:20px}.guide-end>div>*{flex:100%}}.guide-hero{padding:56px 0 28px}.guide-eyebrow{color:var(--muted-foreground);letter-spacing:.02em;text-transform:uppercase;margin:0 0 10px;font-size:13px;font-weight:500}.guide-title{letter-spacing:-.035em;text-wrap:balance;margin:0;font-size:clamp(34px,6vw,48px);font-weight:600;line-height:1.05}.guide-lead{color:var(--muted-foreground);text-wrap:pretty;max-width:36em;margin:14px 0 0;font-size:18px}.guide-start{flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:24px;display:flex}.guide-big{height:48px;padding:0 22px;font-size:16px}.guide-or{color:var(--muted-foreground);font-size:14px}.guide-sample{color:var(--muted-foreground);background:var(--muted);border-radius:999px;margin-top:22px;padding:4px 12px;font-size:13px;display:inline-block}.guide-steps{margin:0;padding:8px 0 80px;list-style:none}.guide-step{border-top:1px solid var(--border);grid-template-columns:1fr auto;align-items:center;gap:48px;padding:40px 0;scroll-margin-top:76px;display:grid}.guide-step:nth-child(2n) .guide-text{order:2}.guide-num{background:var(--muted);width:28px;height:28px;color:var(--muted-foreground);font-variant-numeric:tabular-nums;border-radius:999px;flex:none;place-items:center;font-size:13px;font-weight:600;display:inline-grid}.guide-head{flex-direction:column;align-items:flex-start;gap:14px;margin-bottom:8px;display:flex}.guide-step h2{letter-spacing:-.025em;text-wrap:balance;margin:0;font-size:28px;font-weight:600;line-height:1.15}.guide-step p{color:var(--muted-foreground);text-wrap:pretty;max-width:26em;margin:0;font-size:17px}.guide-text{justify-self:center;max-width:420px}.guide-phones{justify-content:center;gap:24px;display:flex}.guide-shot{margin:0}.guide-cap{text-align:center;color:var(--muted-foreground);margin-top:10px;font-size:13px}.guide-seg{display:none}.guide-step .guide-note,.guide-slide .guide-note{color:var(--muted-foreground);max-width:30em;margin:14px 0 0;font-size:14px}.guide-note b{color:var(--foreground);font-weight:600}.guide-phone{--bz:8px;--r:32px;--aspect:390 / 844;--fit:.462;--tall:2.164;--pair:1.082;--w:260px;--w-max:300px;padding:var(--bz);border-radius:calc(var(--r) + var(--bz));background:var(--frame);box-shadow:var(--shadow);cursor:zoom-in;border:0;margin:0;display:block;position:relative}.guide-phone img{width:var(--w);height:auto;aspect-ratio:var(--aspect);border-radius:var(--r);background:var(--canvas);display:block}.guide-phone:after{content:"";aspect-ratio:76/22;background:var(--camera);opacity:.92;border-radius:999px;width:29%;position:absolute;top:16px;left:50%;transform:translate(-50%)}.guide-ph{inset:var(--bz);border-radius:var(--r);background:linear-gradient(180deg, var(--ph-top), var(--ph-bottom));display:none;position:absolute;overflow:hidden;container-type:inline-size}.guide-missing{cursor:default}.guide-missing .guide-ph{display:block}.guide-missing .guide-zh{display:none}.guide-ph-in{border:1.5px dashed var(--ph-line);border-radius:calc(var(--r) - 4px);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:4.5cqi;padding:0 9cqi;display:flex;position:absolute;inset:4.5cqi}.guide-ph-icon{background:var(--card);width:17cqi;height:17cqi;color:var(--muted-foreground);box-shadow:0 1px 2px color-mix(in oklch, var(--camera) 6%, transparent);border-radius:4.5cqi;place-items:center;display:grid}.guide-ph-icon svg{width:52%;height:52%}.guide-ph-tag{letter-spacing:.01em;color:var(--muted-foreground);background:var(--card);border-radius:999px;padding:1.2cqi 3.6cqi;font-size:4.4cqi;font-weight:500}.guide-ph-title{letter-spacing:-.02em;color:var(--foreground);text-wrap:balance;font-size:7.4cqi;font-weight:600;line-height:1.15}.guide-ph-text{color:var(--muted-foreground);text-wrap:pretty;font-size:4.9cqi;line-height:1.4}.guide-zh{background:color-mix(in oklch, var(--camera) 70%, transparent);width:30px;height:30px;color:var(--camera-foreground);opacity:0;border-radius:999px;place-items:center;transition:opacity .15s;display:grid;position:absolute;bottom:14px;right:14px}.guide-zh svg{width:15px;height:15px}.guide-phone:hover .guide-zh,.guide-phone:focus-visible .guide-zh{opacity:1}@media (hover:none){.guide-zh{opacity:.85}}.guide-footer{border-top:1px solid var(--border);padding:28px 0 max(48px, calc(env(safe-area-inset-bottom) + 24px));color:var(--muted-foreground);font-size:14px}@media (max-width:760px){.guide-hero{padding:32px 0 16px}.guide-lead{font-size:17px}.guide-start .guide-big{width:100%;height:52px}.guide-start .guide-or{text-align:center;width:100%}.guide-step{grid-template-columns:1fr;gap:20px;padding:32px 0;scroll-margin-top:64px}.guide-step:nth-child(2n) .guide-text{order:0}.guide-text{justify-self:start}.guide-head{flex-direction:row;align-items:center;gap:10px}.guide-step h2{font-size:24px}.guide-step p{font-size:16px}.guide-phones{flex-direction:column;align-items:center;gap:28px}.guide-phone{--bz:7px;--r:29px}.guide-phone img{width:min(var(--w-max), calc(100vw - 72px), calc((100vh - 120px) * var(--fit)));width:min(var(--w-max), calc(100vw - 72px), calc((100svh - 120px) * var(--fit)))}.guide-phone:after{top:13px}}.guide-present{z-index:50;background:var(--background);color:var(--foreground);overscroll-behavior:contain;outline:none;grid-template-rows:auto minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr);display:grid;position:fixed;inset:0}.guide-p-top{padding:14px 20px;padding-top:max(14px, env(safe-area-inset-top));align-items:center;gap:12px;display:flex}.guide-count-btn,.guide-exit-btn{flex:none;height:44px;padding:0 14px;font-size:15px}.guide-count-btn{gap:6px}.guide-stage{touch-action:pan-y;-webkit-user-select:none;user-select:none;position:relative;overflow:hidden;container-type:size}.guide-slide{opacity:0;pointer-events:none;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:clamp(32px,5vw,72px);padding:0 max(24px,6vw);transition:opacity .3s,transform .3s;display:grid;position:absolute;inset:0;transform:translate(24px)}.guide-here{opacity:1;pointer-events:auto;transform:none}.guide-gone{transform:translate(-24px)}.guide-slide .guide-text{max-width:480px}.guide-slide .guide-head{gap:16px;margin-bottom:14px}.guide-slide .guide-num{width:36px;height:36px;font-size:15px}.guide-slide h2{letter-spacing:-.035em;text-wrap:balance;margin:0;font-size:clamp(32px,4.4vw,56px);font-weight:600;line-height:1.05}.guide-slide p{color:var(--muted-foreground);text-wrap:pretty;max-width:22em;margin:0;font-size:clamp(18px,1.8vw,22px)}.guide-slide .guide-note{margin-top:18px;font-size:15px}.guide-slide .guide-phones{gap:28px}.guide-slide .guide-phone img{width:auto;height:min(100cqh - 84px,760px)}.guide-slide .guide-two .guide-phone img{height:min(100cqh - 84px, 760px, (52cqw - 120px) * var(--pair))}.guide-p-nav{padding:14px 20px;padding-bottom:max(18px, env(safe-area-inset-bottom));justify-content:center;align-items:center;gap:16px;display:flex}.guide-dots{justify-content:center;min-width:0;display:flex}.guide-dots button{cursor:pointer;background:0 0;border:0;place-items:center;width:16px;height:32px;padding:0;display:grid}.guide-dots button:before{content:"";background:var(--border);border-radius:999px;width:8px;height:8px;transition:width .2s,background .2s}.guide-dots button[aria-current=true]{width:30px}.guide-dots button[aria-current=true]:before{background:var(--foreground);width:24px}.guide-dots button:hover:before{background:var(--muted-foreground)}.guide-dots button[aria-current=true]:hover:before{background:var(--foreground)}.guide-nav-btn{flex:none;height:44px}.guide-nav-icon{width:44px}.guide-next{min-width:96px}@media (max-width:760px){.guide-p-top{padding:8px 12px 4px 16px;padding-top:max(8px, env(safe-area-inset-top))}.guide-slide{flex-direction:column;align-items:stretch;gap:14px;padding:8px 16px 6px;display:flex}.guide-slide .guide-text{flex:none;max-width:none}.guide-slide .guide-head{flex-direction:row;align-items:center;gap:10px;margin-bottom:6px}.guide-slide .guide-num{width:28px;height:28px;font-size:13px}.guide-slide h2{letter-spacing:-.025em;font-size:24px;line-height:1.15}.guide-slide p{max-width:none;font-size:16px}.guide-slide .guide-note{margin-top:8px;font-size:13px}.guide-slide .guide-phones{flex:1 1 0;place-items:center;min-height:0;display:grid;container-type:size}.guide-slide .guide-shot{grid-area:1/1;transition:opacity .2s}.guide-slide .guide-shot:not(.guide-cur){opacity:0;visibility:hidden}.guide-slide .guide-cap{display:none}.guide-slide .guide-phone{--bz:6px;--r:24px}.guide-slide .guide-phone img,.guide-slide .guide-two .guide-phone img{height:calc(100cqh - 12px);height:min(100cqh - 12px, (100cqw - 12px) * var(--tall))}.guide-slide .guide-phone:after{top:11px}.guide-slide .guide-zh{bottom:10px;right:10px}.guide-seg{background:var(--muted);border-radius:999px;gap:4px;width:max-content;margin-top:12px;padding:3px;display:flex}.guide-seg button{height:34px;color:var(--muted-foreground);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:0 14px;font-size:14px;font-weight:500}.guide-seg button[aria-pressed=true]{background:var(--card);color:var(--foreground);box-shadow:0 1px 2px color-mix(in oklch, var(--camera) 12%, transparent)}.guide-p-nav{padding:8px 16px;padding-bottom:max(14px, calc(env(safe-area-inset-bottom) + 4px));gap:10px}.guide-nav-btn{height:48px}.guide-nav-icon{width:48px}.guide-next{min-width:100px;font-size:16px}.guide-dots{flex:0 auto}.guide-dots button{flex:0 13px;min-width:8px}.guide-dots button:before{width:6px;height:6px}.guide-dots button[aria-current=true]{flex:0 0 22px}.guide-dots button[aria-current=true]:before{width:16px}}@media (max-width:760px) and (max-height:600px){.guide-slide p{display:none}}.guide-zoom{z-index:80;overscroll-behavior:contain;background:color-mix(in oklch, var(--camera) 92%, transparent);cursor:zoom-out;padding:max(64px, calc(env(safe-area-inset-top) + 56px)) 12px max(24px, env(safe-area-inset-bottom));outline:none;position:fixed;inset:0;overflow-y:auto}.guide-zoom img{border-radius:18px;width:min(100%,430px);height:auto;margin:0 auto;display:block}.guide-zoom-close{top:max(12px, env(safe-area-inset-top));right:max(12px, env(safe-area-inset-right));height:44px;padding:0 18px;position:fixed}@media (prefers-reduced-motion:reduce){.guide-slide,.guide-slide .guide-shot{transition:none}}.guide-phone.guide-android{--bz:6px;--r:24px;--aspect:9 / 20;--fit:.45;--tall:2.222;--pair:1.111;--w:254px;--w-max:292px}.guide-phone.guide-android:after{top:calc(var(--bz) + 1.9%);aspect-ratio:1;width:4.2%}@media (max-width:760px){.guide-phone.guide-android{--bz:5px;--r:22px}.guide-slide .guide-phone.guide-android{--bz:5px;--r:18px}.guide-mid,.guide-mid-only{display:none}}@media (max-width:1099px){.guide-wide{display:none}}@media (min-width:1100px){.guide-mid-only{display:none}}
