@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#14213d;background:#f7f9fc;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--ink: #14213d;--muted: #6e7b91;--subtle: #98a3b5;--line: #e4e9f1;--surface: #ffffff;--surface-soft: #f7f9fc;--indigo: #4c59c9;--indigo-dark: #3f4bb2;--indigo-soft: #eef0ff;--green: #3ba47a;--danger: #c95a66}*{box-sizing:border-box}html{min-width:320px;background:var(--surface-soft)}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid rgba(76,89,201,.25);outline-offset:2px}.app-shell{min-height:100vh;display:flex;flex-direction:column;background:radial-gradient(circle at 50% -20%,#ffffff 0%,var(--surface-soft) 55%)}.topbar{width:min(1080px,calc(100% - 48px));margin:0 auto;padding:28px 0;display:flex;align-items:center;justify-content:space-between}.brand{display:inline-flex;align-items:center;color:var(--ink);text-decoration:none}.brand-logo{display:block;width:166px;height:44px;object-fit:contain;object-position:left center}.language-picker{display:inline-flex;align-items:center;gap:8px;color:var(--muted)}.language-options{display:inline-flex;align-items:center;gap:2px;padding:3px;border:1px solid var(--line);border-radius:9px;background:#ffffffbf}.language-option{border:0;padding:6px 9px;color:var(--muted);background:transparent;border-radius:6px;font-size:12px;font-weight:600;transition:color .2s,background .2s,box-shadow .2s}.language-option:hover{color:var(--ink)}.language-option.active{color:var(--ink);background:var(--surface);box-shadow:0 1px 4px #14213d14}.main-content{width:min(660px,calc(100% - 40px));margin:0 auto;flex:1;padding:68px 0 48px}.hero{text-align:center;margin:0 auto 36px}.eyebrow{display:inline-flex;align-items:center;gap:7px;margin-bottom:16px;color:var(--indigo);font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase}.eyebrow-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px #3ba47a1a}.hero h1{margin:0;color:var(--ink);font-size:clamp(32px,5vw,46px);line-height:1.12;letter-spacing:-.055em;font-weight:700}.hero p{max-width:430px;margin:15px auto 0;color:var(--muted);font-size:16px;line-height:1.65}.tool-card{padding:25px;border:1px solid rgba(219,226,237,.9);border-radius:18px;background:#ffffffed;box-shadow:0 20px 50px #273b5e14,0 2px 7px #273b5e0a}.tool-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}.section-label{display:inline-flex;align-items:center;gap:8px;color:var(--ink);font-size:13px;font-weight:700}.section-label svg{color:var(--indigo)}.local-badge{display:inline-flex;align-items:center;gap:5px;color:var(--green);font-size:11px;font-weight:600}.secret-input-wrap{position:relative;display:flex;align-items:center;border:1px solid #dce3ee;border-radius:11px;background:var(--surface);transition:border-color .2s,box-shadow .2s}.secret-input-wrap:focus-within{border-color:#8e99e2;box-shadow:0 0 0 4px #4c59c91a}.secret-input-wrap.has-error{border-color:#df969d}.secret-input-wrap.has-error:focus-within{box-shadow:0 0 0 4px #c95a661a}.secret-input-wrap input{width:100%;min-width:0;height:52px;padding-block:0;padding-inline:16px 50px;border:0;outline:0;color:var(--ink);background:transparent;font-size:14px;letter-spacing:.02em}.secret-input-wrap input::placeholder{color:#a3adbc}.icon-button{display:inline-grid;place-items:center;width:36px;height:36px;flex:0 0 auto;border:0;border-radius:8px;color:var(--muted);background:transparent;transition:color .2s,background .2s}.icon-button:hover{color:var(--indigo);background:var(--indigo-soft)}.secret-input-wrap .icon-button{position:absolute;inset-inline-end:8px}.input-error,.copy-error,.scanner-error{margin:9px 2px 0;color:var(--danger);font-size:12px;line-height:1.45}.tool-actions{display:flex;align-items:center;gap:8px;margin-top:11px}.secondary-button,.text-button,.copy-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:8px;font-size:12px;font-weight:600;transition:color .2s,background .2s,border-color .2s,transform .2s}.secondary-button{min-height:35px;padding:0 11px;border:1px solid var(--line);color:#536177;background:#fbfcfe}.secondary-button:hover{border-color:#bec8dc;color:var(--indigo);background:#f5f6ff}.text-button{padding:7px 8px;border:0;color:var(--muted);background:transparent}.text-button:hover{color:var(--indigo);background:var(--indigo-soft)}.clear-button{margin-inline-start:auto}.scanner-panel{margin-top:18px;padding:16px;border:1px solid #dce3ee;border-radius:13px;background:#f9faff}.scanner-header{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:13px}.scanner-header h2{margin:0;font-size:14px;letter-spacing:-.01em}.scanner-header p{margin:5px 0 0;color:var(--muted);font-size:11px;line-height:1.4}.video-frame{position:relative;overflow:hidden;min-height:200px;border-radius:9px;background:#111827}.video-frame video{display:block;width:100%;height:230px;object-fit:cover}.scan-guide{position:absolute;top:20%;right:23%;bottom:20%;left:23%;border:2px solid rgba(255,255,255,.85);border-radius:12px;box-shadow:0 0 0 999px #070c1b40}.scan-guide span{position:absolute;top:12%;left:8%;right:8%;height:2px;background:#7bd6ae;box-shadow:0 0 10px #7bd6ae;animation:scan-line 2.2s ease-in-out infinite}.video-hint{position:absolute;right:0;bottom:12px;left:0;display:flex;justify-content:center;align-items:center;gap:6px;color:#ffffffe6;font-size:11px}.spin{animation:spin 1.2s linear infinite}.scanner-close-button{margin-top:9px;padding-left:0}@keyframes scan-line{0%,to{transform:translateY(0)}50%{transform:translateY(145px)}}@keyframes spin{to{transform:rotate(360deg)}}.code-panel{margin-top:24px;padding:20px 20px 18px;border:1px solid #e6eaf2;border-radius:13px;background:#fbfcfe;text-align:center;transition:border-color .25s,background .25s}.code-panel.ready{border-color:#d9def8;background:linear-gradient(135deg,#fbfcff,#f6f7ff)}.code-panel-topline{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:11px;font-weight:600}.refresh-label{color:#98a3b5;font-weight:500}.code-display{min-height:78px;display:flex;align-items:center;justify-content:center;margin:3px 0 5px;color:var(--ink);font-size:clamp(40px,10vw,58px);font-weight:700;letter-spacing:.1em;line-height:1;font-variant-numeric:tabular-nums}.code-placeholder{color:#b5bfcd;font-size:16px;font-weight:500;letter-spacing:0}.countdown-row{display:flex;align-items:center;gap:12px;margin:2px auto 16px;max-width:390px}.progress-track{height:5px;flex:1;overflow:hidden;border-radius:99px;background:#e7eaf4}.progress-fill{height:100%;border-radius:inherit;background:var(--indigo);transition:width .2s linear}.countdown-number{min-width:39px;color:var(--muted);font-size:11px;text-align:end}.countdown-number strong{color:var(--indigo);font-size:13px;font-variant-numeric:tabular-nums}.copy-button{width:100%;min-height:43px;border:1px solid var(--indigo);color:#fff;background:var(--indigo);box-shadow:0 5px 12px #4c59c92e}.copy-button:hover:not(:disabled){background:var(--indigo-dark);transform:translateY(-1px)}.copy-button:disabled{cursor:not-allowed;border-color:#e0e5ee;color:#aab4c4;background:#eef1f6;box-shadow:none}.saved-secrets{margin-top:18px;padding-top:17px;border-top:1px solid #e8edf4}.saved-secrets-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}.saved-secrets-header h2{margin:0;color:var(--ink);font-size:12px;font-weight:700}.saved-secrets-header span{color:var(--subtle);font-size:11px}.saved-secrets-list{display:grid;gap:7px}.saved-secret-row{display:flex;align-items:center;gap:6px;padding:4px 4px 4px 11px;border:1px solid #e6eaf2;border-radius:9px;background:#fbfcfe}.saved-secret-name-input{width:100px;min-width:0;padding:5px 7px;border:1px solid transparent;border-radius:6px;outline:0;color:var(--ink);background:transparent;font-size:12px;font-weight:600}.saved-secret-name-input:focus{border-color:#d9def8;background:var(--indigo-soft)}.saved-secret-code{min-width:77px;color:var(--ink);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;font-weight:700;letter-spacing:.04em;text-align:center;white-space:nowrap}.saved-secret-countdown{flex:0 0 auto;margin-inline-start:auto;color:var(--indigo);font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap}.saved-secret-remove{width:30px;height:30px}.storage-note{margin:12px 2px 0;color:var(--subtle);font-size:11px;line-height:1.55}.trust-row{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:9px 20px;margin:25px 0 0;color:#778399;font-size:11px}.trust-item{display:inline-flex;align-items:center;gap:6px}.trust-icon{display:inline-grid;place-items:center;width:17px;height:17px;border-radius:50%;color:var(--green);background:#e8f7f0}.privacy-note{max-width:540px;margin:25px auto 0;color:#99a4b4;font-size:11px;line-height:1.6;text-align:center}.seo-content{margin-top:46px;padding-top:34px;border-top:1px solid rgba(224,230,239,.85)}.content-heading{max-width:560px}.content-heading h2{margin:0;color:var(--ink);font-size:20px;letter-spacing:-.035em;line-height:1.3}.content-heading p{margin:9px 0 0;color:var(--muted);font-size:13px;line-height:1.65}.steps-list{display:grid;gap:18px;margin:25px 0 0;padding:0;list-style:none}.steps-list li{display:grid;grid-template-columns:28px 1fr;gap:12px;align-items:start}.step-number{display:grid;place-items:center;width:27px;height:27px;border-radius:9px;color:var(--indigo);background:var(--indigo-soft);font-size:12px;font-weight:700}.steps-list h3{margin:2px 0 0;color:var(--ink);font-size:13px;font-weight:700}.steps-list p{margin:5px 0 0;color:var(--muted);font-size:12px;line-height:1.6}.usage-note,.usage-warning{margin:22px 0 0;color:var(--muted);font-size:12px;line-height:1.6}.usage-warning{margin-top:10px;color:#806f42}.privacy-content{display:flex;align-items:flex-start;gap:15px}.privacy-content:before{content:"✓";display:grid;place-items:center;width:27px;height:27px;flex:0 0 auto;margin-top:1px;border-radius:9px;color:var(--green);background:#e8f7f0;font-size:13px;font-weight:700}.faq-content details{padding:15px 0;border-bottom:1px solid #e8edf4}.faq-content details:first-of-type{margin-top:14px;border-top:1px solid #e8edf4}.faq-content summary{cursor:pointer;color:var(--ink);font-size:13px;font-weight:600}.faq-content details p{max-width:590px;margin:9px 0 0;color:var(--muted);font-size:12px;line-height:1.65}.guide-link-list{display:grid;gap:9px;margin-top:15px}.guide-link-list a{color:var(--indigo);font-size:13px;font-weight:600;text-decoration:none}.guide-link-list a:hover{text-decoration:underline}.seo-fallback{max-width:720px;margin:0 auto;padding:48px 24px;color:#14213d;font-family:Inter,ui-sans-serif,system-ui,sans-serif;line-height:1.6}.seo-fallback h1{margin:10px 0;font-size:42px;line-height:1.15}.seo-fallback h2{margin-top:42px;font-size:25px}.seo-fallback h3{margin-bottom:2px;font-size:16px}.seo-fallback p{color:#6e7b91}.footer{display:flex;align-items:center;justify-content:center;gap:9px;padding:22px 20px 28px;color:#a4adbb;font-size:11px;text-align:center}.footer-dot{color:#c7ced9}@media(max-width:640px){.topbar{width:calc(100% - 32px);padding:20px 0}.brand-logo{width:148px;height:39px}.language-picker>svg{display:none}.language-option{padding:6px 7px;font-size:11px}.main-content{width:calc(100% - 28px);padding:49px 0 32px}.hero{margin-bottom:27px}.hero h1{font-size:clamp(30px,9vw,40px)}.hero p{margin-top:12px;font-size:14px}.tool-card{padding:18px 15px 15px;border-radius:15px}.tool-card-header{margin-bottom:11px}.local-badge{font-size:10px}.tool-actions{flex-wrap:wrap}.clear-button{margin-left:0}.code-panel{margin-top:21px;padding:17px 14px 14px}.code-display{min-height:72px}.trust-row{gap:10px 15px;margin-top:20px;font-size:10px}.privacy-note{margin-top:20px;font-size:10px}.seo-content{margin-top:36px;padding-top:26px}.content-heading h2{font-size:18px}.privacy-content{gap:11px}.footer{flex-direction:column;gap:4px;padding-top:18px;font-size:10px}.footer-dot{display:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}