@font-face{font-family:QRCodeWifiCJK;src:url(/fonts/wifi-qr-tool/noto-sans-sc.woff2?v=1711406667ba)format("woff2");font-weight:100 900;font-style:normal;font-display:swap}.wifi-qr-tool{--fog:#f5f4ed;--paper:#fbfaf5;--ink:#10213d;--blue:#1746e8;--signal:#f2f85a;--muted:#526078;--line:#d6d9d6;--ease:cubic-bezier(.23, 1, .32, 1);color:var(--ink);background:var(--fog);scroll-padding-top:100px;font-family:QRCodeWifiCJK,Noto Sans SC,sans-serif;font-size:16px;line-height:1.6}:where(.wifi-qr-tool) *{box-sizing:border-box}.wifi-qr-tool,:where(.wifi-qr-tool) h1,:where(.wifi-qr-tool) h2,:where(.wifi-qr-tool) h3,:where(.wifi-qr-tool) p{margin:0}:where(.wifi-qr-tool) button,:where(.wifi-qr-tool) input,:where(.wifi-qr-tool) select{font:inherit;color:inherit}:where(.wifi-qr-tool) a{color:inherit;text-underline-offset:4px}:where(.wifi-qr-tool) button,:where(.wifi-qr-tool) a{touch-action:manipulation}:where(.wifi-qr-tool) button{cursor:pointer}:where(.wifi-qr-tool) button:disabled{opacity:.45;cursor:not-allowed}:where(.wifi-qr-tool) button,:where(.wifi-qr-tool) a{transition:background .16s,color .16s,transform .16s}:where(.wifi-qr-tool) button:active:not(:disabled){transform:translateY(1px)}:where(.wifi-qr-tool) a:hover{color:var(--blue)}:where(.wifi-qr-tool) svg{stroke-width:1.7px;flex-shrink:0;width:20px;height:20px}:where(.wifi-qr-tool) ::selection{background:var(--signal);color:var(--ink)}:where(.wifi-qr-tool) :focus-visible{outline:3px solid var(--blue);outline-offset:4px}:where(.wifi-qr-tool) input{caret-color:var(--blue)}:where(.wifi-qr-tool) .wrap{width:min(1184px,100% - 64px);margin-inline:auto}:where(.wifi-qr-tool) .hero{padding-block:62px 38px}:where(.wifi-qr-tool) .eyebrow{letter-spacing:.1em;text-transform:uppercase;align-items:center;gap:8px;font-size:12px;font-weight:750;display:flex}:where(.wifi-qr-tool) .hero h1{letter-spacing:-.04em;text-wrap:balance;max-width:900px;margin:16px 0 20px;font-size:clamp(36px,4.4vw,62px);font-weight:750;line-height:1.13}:where(.wifi-qr-tool) .intro{max-width:730px;color:var(--muted);font-size:18px}:where(.wifi-qr-tool) .workbench{border:1px solid var(--line);background:var(--paper);grid-template-columns:1.1fr 1fr;display:grid}:where(.wifi-qr-tool) .editor{padding:32px 36px}:where(.wifi-qr-tool) .editor fieldset{border:0;min-width:0;margin:0 0 24px;padding:0}:where(.wifi-qr-tool) .editor legend{letter-spacing:.1em;color:var(--blue);margin-bottom:22px;font-size:12px;font-weight:750}:where(.wifi-qr-tool) .editor label,:where(.wifi-qr-tool) .field-label{align-items:center;gap:7px;margin-bottom:8px;font-size:14px;font-weight:650;display:flex}:where(.wifi-qr-tool) .editor input:not([type=checkbox]):not([type=file]),:where(.wifi-qr-tool) .editor select{background:#fff;border:1px solid #aeb8c5;border-radius:3px;width:100%;min-width:0;min-height:48px;padding:10px 12px}:where(.wifi-qr-tool) .hint{color:var(--muted);margin:7px 0 17px;font-size:12px;line-height:1.7}:where(.wifi-qr-tool) .password-field{margin-bottom:14px;display:flex}:where(.wifi-qr-tool) .password-field input{border-right:0!important;border-radius:3px 0 0 3px!important}:where(.wifi-qr-tool) .password-field button{background:#fff;border:1px solid #aeb8c5;border-radius:0 3px 3px 0;flex-shrink:0;place-items:center;width:48px;display:grid}:where(.wifi-qr-tool) .password-field button:hover{background:var(--fog)}:where(.wifi-qr-tool) .check-field{min-height:32px;margin:16px 0 0!important}:where(.wifi-qr-tool) .check-field input{width:18px;height:18px;accent-color:var(--blue)}:where(.wifi-qr-tool) .appearance{border-top:1px solid var(--line)!important;padding-top:24px!important}:where(.wifi-qr-tool) .logo-box{border:1px dashed #aeb8c5;margin-bottom:18px;padding:14px 16px}:where(.wifi-qr-tool) .logo-box input{width:100%;min-height:34px;font-size:12px}:where(.wifi-qr-tool) .logo-box input::file-selector-button{font:inherit;border:1px solid var(--line);background:var(--fog);cursor:pointer;margin-right:8px;padding:8px 12px}:where(.wifi-qr-tool) .logo-box .hint{margin-bottom:0}:where(.wifi-qr-tool) .logo-selected{overflow-wrap:anywhere;justify-content:space-between;align-items:center;gap:12px;margin-top:10px;font-size:12px;display:flex}:where(.wifi-qr-tool) .logo-selected button{color:var(--blue);background:0 0;border:0;flex-shrink:0;padding:5px 0;text-decoration:underline}:where(.wifi-qr-tool) .colors{flex-wrap:wrap;gap:8px;display:flex}:where(.wifi-qr-tool) .colors button{border:1px solid var(--line);background:#fff;align-items:center;gap:8px;min-height:44px;padding:10px 12px;font-size:13px;display:flex}:where(.wifi-qr-tool) .colors button.selected{border-color:var(--blue);box-shadow:inset 0 0 0 1px var(--blue)}:where(.wifi-qr-tool) .colors button:hover{background:var(--fog)}:where(.wifi-qr-tool) .colors i{border-radius:50%;width:14px;height:14px}:where(.wifi-qr-tool) .primary{background:var(--blue);color:#fff;border:0;justify-content:center;align-items:center;gap:10px;width:100%;min-height:54px;padding:14px 16px;font-size:15px;font-weight:650;display:flex}:where(.wifi-qr-tool) .primary svg:last-child{margin-left:auto}:where(.wifi-qr-tool) .primary:hover:not(:disabled){background:#1037bd}:where(.wifi-qr-tool) .privacy{color:var(--muted);gap:9px;margin-top:18px;font-size:12px;line-height:1.65;display:flex}:where(.wifi-qr-tool) .privacy svg{width:16px;height:16px;margin-top:3px}:where(.wifi-qr-tool) .local-actions{flex-wrap:wrap;gap:20px;margin-top:18px;display:flex}:where(.wifi-qr-tool) .local-actions button{color:var(--blue);background:0 0;border:0;min-height:30px;padding:6px 0;font-size:12px;text-decoration:underline}:where(.wifi-qr-tool) .local-actions button:hover{color:var(--ink)}:where(.wifi-qr-tool) .error{color:#8c281c;background:#fff1ed;border-left:3px solid #b33724;margin-bottom:16px;padding:12px 14px;font-size:14px}:where(.wifi-qr-tool) .result-panel{border-left:1px solid var(--line);background:#e9edf7;flex-direction:column;min-width:0;padding:30px;display:flex}:where(.wifi-qr-tool) .result-title{justify-content:space-between;align-items:center;gap:16px;display:flex}:where(.wifi-qr-tool) .result-title h2{letter-spacing:-.02em;font-size:19px}:where(.wifi-qr-tool) .result-title>svg{color:var(--blue)}:where(.wifi-qr-tool) .empty-result{text-align:center;min-height:335px;color:var(--muted);flex-direction:column;flex:1;justify-content:center;align-items:center;padding:24px;display:flex}:where(.wifi-qr-tool) .empty-result>svg{width:44px;height:44px;color:var(--blue);margin-bottom:22px}:where(.wifi-qr-tool) .empty-result h3{color:var(--ink);max-width:300px;margin-bottom:12px;font-size:20px}:where(.wifi-qr-tool) .empty-result p{max-width:285px;font-size:14px}:where(.wifi-qr-tool) .ready{color:#12573e;gap:7px;margin:16px 0 12px;font-size:13px;display:flex}:where(.wifi-qr-tool) .qr-stage{aspect-ratio:1;background:#fff;border:1px solid #c5cede;align-self:center;place-items:center;width:min(100%,310px);padding:12px;scroll-margin-top:100px;scroll-margin-bottom:24px;display:grid}:where(.wifi-qr-tool) .qr-stage img{width:100%;max-width:100%;height:auto;image-rendering:pixelated;display:block}:where(.wifi-qr-tool) .result-enter{animation:result-arrive .65s var(--ease) both}@keyframes result-arrive{0%{opacity:.35;transform:translateY(14px)}to{opacity:1;transform:none}}:where(.wifi-qr-tool) .network-name{text-align:center;overflow-wrap:anywhere;margin-top:12px;font-weight:700}:where(.wifi-qr-tool) .result-note{color:var(--muted);max-width:62ch;margin:12px 0 16px;font-size:12px}:where(.wifi-qr-tool) .downloads{gap:8px;display:grid}:where(.wifi-qr-tool) .downloads button{background:var(--ink);color:#fff;border:0;align-items:center;gap:10px;min-height:46px;padding:12px 14px;font-size:13px;display:flex}:where(.wifi-qr-tool) .downloads button svg:last-child{color:var(--signal);width:16px;height:16px;margin-left:auto}:where(.wifi-qr-tool) .downloads button:hover:not(:disabled){background:#23385b}:where(.wifi-qr-tool) .download-notice{color:#12573e;margin-top:12px;font-size:12px}:where(.wifi-qr-tool) .scan-note{border-top:1px solid #c5cede;margin-top:30px;padding-top:20px}:where(.wifi-qr-tool) .scan-note p{color:var(--muted);margin-top:8px;font-size:13px}:where(.wifi-qr-tool) .steps{padding-top:70px}:where(.wifi-qr-tool) h2{letter-spacing:-.03em;font-size:30px;line-height:1.2}:where(.wifi-qr-tool) .steps ol{grid-template-columns:repeat(3,1fr);gap:32px;margin:28px 0 0;padding:0;list-style:none;display:grid}:where(.wifi-qr-tool) .steps li{isolation:isolate;border-top:1px solid var(--ink);padding-top:20px;position:relative}:where(.wifi-qr-tool) .step-rule{background:var(--blue);transform-origin:0;height:2px;position:absolute;inset:-1px 0 auto}:where(.wifi-qr-tool) .steps li:before{content:"";z-index:-1;opacity:0;transition:opacity .22s var(--ease);background:#e9edf7;position:absolute;inset:-12px}:where(.wifi-qr-tool) .steps [data-entered=true] .step-rule{animation:wifi-step-rule .65s var(--ease) both}:where(.wifi-qr-tool) .steps [data-entered=true] .step-copy{animation:wifi-step-copy .65s var(--ease) both}:where(.wifi-qr-tool) .steps [data-running=false] .step-rule,:where(.wifi-qr-tool) .steps [data-running=false] .step-copy{animation-play-state:paused}@keyframes wifi-step-rule{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes wifi-step-copy{0%{opacity:.4;transform:translateY(14px)}to{opacity:1;transform:none}}:where(.wifi-qr-tool) .step-number{color:var(--blue);transition:transform .22s var(--ease);font-size:12px;font-weight:750;display:inline-block}:where(.wifi-qr-tool) .steps h3{transition:color .18s var(--ease);margin:12px 0 8px;font-size:18px}@media (hover:hover) and (pointer:fine){:where(.wifi-qr-tool) .steps li:hover:before{opacity:1}:where(.wifi-qr-tool) .steps li:hover .step-number{transform:translateY(-4px)}:where(.wifi-qr-tool) .steps li:hover h3{color:var(--blue)}}:where(.wifi-qr-tool) .steps p{color:var(--muted);max-width:36ch;font-size:14px}:where(.wifi-qr-tool) .support{padding-block:70px}:where(.wifi-qr-tool) .table-scroll{margin-top:26px}:where(.wifi-qr-tool) table{border-collapse:collapse;width:100%;font-size:14px}:where(.wifi-qr-tool) th,:where(.wifi-qr-tool) td{border-bottom:1px solid var(--line);text-align:left;vertical-align:top;padding:16px 18px 16px 0}:where(.wifi-qr-tool) thead th{color:var(--muted);border-top:1px solid var(--ink);font-size:12px;font-weight:600}:where(.wifi-qr-tool) tbody th{width:30%;font-weight:650}:where(.wifi-qr-tool) td:nth-child(2){width:25%}:where(.wifi-qr-tool) .faq{grid-template-columns:.65fr 1fr;gap:50px;display:grid}:where(.wifi-qr-tool) .faq-item{border-top:1px solid var(--line)}:where(.wifi-qr-tool) .faq-item:last-child{border-bottom:1px solid var(--line)}:where(.wifi-qr-tool) .faq h3 button{text-align:left;background:0 0;border:0;justify-content:space-between;align-items:center;gap:16px;width:100%;min-height:60px;padding:20px 0;font-size:16px;font-weight:650;display:flex}:where(.wifi-qr-tool) .faq h3 button:hover{color:var(--blue)}:where(.wifi-qr-tool) .faq h3 svg{transition:transform .28s var(--ease)}:where(.wifi-qr-tool) .is-open h3 svg{transform:rotate(45deg)}:where(.wifi-qr-tool) .faq-answer{visibility:hidden;transition:grid-template-rows .3s var(--ease), visibility .3s;grid-template-rows:0fr;display:grid}:where(.wifi-qr-tool) .faq-answer>div{overflow:hidden}:where(.wifi-qr-tool) .faq-answer p{color:var(--muted);padding-bottom:22px;font-size:14px}:where(.wifi-qr-tool) .is-open .faq-answer{visibility:visible;grid-template-rows:1fr}:where(.wifi-qr-tool) .related{background:var(--signal);justify-content:space-between;align-items:center;gap:30px;margin-top:70px;margin-bottom:70px;padding:26px 30px;display:flex}:where(.wifi-qr-tool) .related h2{font-size:24px}:where(.wifi-qr-tool) .related>div{gap:28px;display:flex}:where(.wifi-qr-tool) .related a{align-items:center;gap:8px;padding:8px 0;font-size:13px;font-weight:600;display:flex}@media (width<=900px){:where(.wifi-qr-tool) .wrap{width:calc(100% - 40px)}:where(.wifi-qr-tool) .editor{padding:26px}:where(.wifi-qr-tool) .result-panel{padding:24px}:where(.wifi-qr-tool) .faq{grid-template-columns:1fr;gap:24px}:where(.wifi-qr-tool) .related{align-items:flex-start}:where(.wifi-qr-tool) .related>div{flex-direction:column;gap:8px}}@media (width<=620px){:where(.wifi-qr-tool) .wrap{width:calc(100% - 32px)}:where(.wifi-qr-tool) .hero{padding-block:35px 24px}:where(.wifi-qr-tool) .hero h1{margin:13px 0 16px;font-size:36px;line-height:1.15}:where(.wifi-qr-tool) .intro{font-size:15px}:where(.wifi-qr-tool) .eyebrow{font-size:10px}:where(.wifi-qr-tool) .workbench{grid-template-columns:1fr}:where(.wifi-qr-tool) .editor{padding:22px 20px}:where(.wifi-qr-tool) .result-panel{border-left:0;border-top:1px solid var(--line);padding:24px 20px}:where(.wifi-qr-tool) .empty-result{min-height:230px}:where(.wifi-qr-tool) .steps{padding-top:44px}:where(.wifi-qr-tool) .steps ol{grid-template-columns:1fr;gap:24px;margin-top:22px}:where(.wifi-qr-tool) .steps li{padding-top:16px}:where(.wifi-qr-tool) .steps .step-copy{grid-template-columns:32px 1fr;gap:4px 12px;display:grid}:where(.wifi-qr-tool) .steps h3{margin:0;font-size:17px}:where(.wifi-qr-tool) .steps p{grid-column:2;max-width:none}:where(.wifi-qr-tool) .support{padding-block:44px}:where(.wifi-qr-tool) h2{font-size:25px}:where(.wifi-qr-tool) .table-scroll{overflow-x:auto}:where(.wifi-qr-tool) table{font-size:12px}:where(.wifi-qr-tool) th,:where(.wifi-qr-tool) td{padding:13px 10px 13px 0}:where(.wifi-qr-tool) tbody th{width:29%}:where(.wifi-qr-tool) td:nth-child(2){width:23%}:where(.wifi-qr-tool) .faq h3 button{font-size:15px}:where(.wifi-qr-tool) .related{flex-direction:column;gap:18px;margin-block:44px;padding:22px 20px}:where(.wifi-qr-tool) .related h2{font-size:23px}:where(.wifi-qr-tool) .related>div{gap:10px}:where(.wifi-qr-tool) .privacy{font-size:11px}:where(.wifi-qr-tool) .primary{font-size:14px}:where(.wifi-qr-tool) .colors button{padding:9px 10px;font-size:12px}:where(.wifi-qr-tool) .local-actions{gap:16px}}@media (prefers-reduced-motion:reduce){:where(.wifi-qr-tool) *,:where(.wifi-qr-tool) :before,:where(.wifi-qr-tool) :after{scroll-behavior:auto!important;transition:none!important;animation:none!important}:where(.wifi-qr-tool) .result-enter{opacity:1;transform:none}:where(.wifi-qr-tool) .steps li:hover .step-number{transform:none}}:where(.wifi-qr-tool) #security{margin-bottom:20px}@media (prefers-reduced-motion:reduce){:where(.wifi-qr-tool) *{-webkit-tap-highlight-color:transparent}}
