.blog-tool--password-grid{--password-grid-surface: var(--bg-card);--password-grid-surface-soft: color-mix( in srgb, var(--blue-soft) 24%, var(--bg-card) );--password-grid-border: color-mix( in srgb, var(--blue) 20%, var(--border) );width:100%;margin-block:clamp(1.5rem,4vw,3rem);padding:clamp(1rem,3vw,2rem);color:var(--text-primary);background:var(--password-grid-surface);border:1px solid var(--password-grid-border);border-radius:var(--blog-radius, 1.5rem);box-shadow:0 1rem 2.5rem var(--shadow)}.blog-tool--password-grid,.blog-tool--password-grid *,.blog-tool--password-grid *::before,.blog-tool--password-grid *::after{box-sizing:border-box}.blog-tool--password-grid button,.blog-tool--password-grid input,.blog-tool--password-grid select{font:inherit}.blog-tool--password-grid button:focus-visible,.blog-tool--password-grid input:focus-visible,.blog-tool--password-grid select:focus-visible{outline:3px solid color-mix(in srgb, var(--blue) 58%, transparent);outline-offset:3px}.blog-tool--password-grid .password-grid__header{display:grid;gap:.55rem;margin-bottom:clamp(1rem,2.5vw,1.5rem)}.blog-tool--password-grid .password-grid__header h2{color:var(--text-title);font-size:clamp(1.45rem,3vw,2.25rem);font-weight:800;line-height:1.05;letter-spacing:-0.045em}.blog-tool--password-grid .password-grid__controls{display:grid;gap:1rem}.blog-tool--password-grid .password-grid__form-grid{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:1rem}.blog-tool--password-grid .password-grid__fieldset{min-width:0;margin:0;padding:1rem;background:var(--password-grid-surface-soft);border:1px solid var(--border);border-radius:1rem}.blog-tool--password-grid .password-grid__fieldset legend{padding-inline:.35rem;color:var(--text-title);font-size:.92rem;font-weight:800}.blog-tool--password-grid .password-grid__fieldset--colors{grid-column:1/-1}.blog-tool--password-grid .password-grid__fieldset--export{grid-column:1/-1}.blog-tool--password-grid .password-grid__options{display:grid;gap:.65rem}.blog-tool--password-grid .password-grid__option{display:flex;align-items:center;gap:.65rem;min-height:2.25rem;color:var(--text-secondary);font-size:.92rem;line-height:1.3;cursor:pointer}.blog-tool--password-grid .password-grid__option input{flex:0 0 auto;width:1.05rem;height:1.05rem;margin:0;accent-color:var(--blue)}.blog-tool--password-grid .password-grid__option b{color:var(--text-title);font-size:.82em;font-weight:800}.blog-tool--password-grid .password-grid__field{display:grid;gap:.4rem;color:var(--text-secondary);font-size:.78rem;font-weight:750;line-height:1.25}.blog-tool--password-grid .password-grid__field input,.blog-tool--password-grid .password-grid__field select{width:100%;min-height:2.55rem;padding:.55rem .7rem;color:var(--text-primary);background:var(--bg-input);border:1px solid var(--border);border-radius:.7rem;cursor:pointer}.blog-tool--password-grid .password-grid__field input:disabled{opacity:.65;cursor:not-allowed}.blog-tool--password-grid .password-grid__mode-note{margin:.8rem 0 0;color:var(--text-muted);font-size:.8rem;line-height:1.45}.blog-tool--password-grid .password-grid__custom-options{display:grid;gap:.85rem;margin-top:.9rem}.blog-tool--password-grid .password-grid__custom-options[hidden]{display:none}.blog-tool--password-grid .password-grid__field-row{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:.75rem}.blog-tool--password-grid .password-grid__color-options{display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));gap:.75rem}.blog-tool--password-grid .password-grid__color-field{display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-width:0;padding:.65rem .75rem;color:var(--text-secondary);background:var(--bg-input);border:1px solid var(--border);border-radius:.7rem;font-size:.78rem;font-weight:750;line-height:1.25;cursor:pointer}.blog-tool--password-grid .password-grid__color-field span{min-width:0}.blog-tool--password-grid .password-grid__color-input{flex:0 0 auto;width:2.6rem !important;height:2.25rem !important;min-height:2.25rem !important;padding:.2rem !important;background:rgba(0,0,0,0) !important;border:1px solid var(--border) !important;border-radius:.55rem !important;cursor:pointer}.blog-tool--password-grid .password-grid__image-options{display:grid;grid-template-columns:minmax(0, 1fr) minmax(0, 1.15fr);gap:.75rem}.blog-tool--password-grid .password-grid__image-dimensions{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:.75rem}.blog-tool--password-grid .password-grid__actions{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem}.blog-tool--password-grid .password-grid__actions .blog-button:disabled{opacity:.55;cursor:not-allowed;pointer-events:none;transform:none}.blog-tool--password-grid .password-grid__consent{display:grid;gap:.55rem;padding:.85rem 1rem;background:color-mix(in srgb, var(--blue-soft) 34%, var(--password-grid-surface));border:1px solid color-mix(in srgb, var(--blue) 24%, var(--border));border-radius:.85rem}.blog-tool--password-grid .password-grid__consent-label{display:flex;align-items:flex-start;gap:.65rem;color:var(--text-secondary);font-size:.82rem;line-height:1.45;cursor:pointer}.blog-tool--password-grid .password-grid__consent-label input{flex:0 0 auto;width:1.1rem;height:1.1rem;margin:.1rem 0 0;accent-color:var(--blue);cursor:pointer}.blog-tool--password-grid .password-grid__consent-note{margin:0;padding-left:1.75rem;color:var(--text-muted);font-size:.75rem;line-height:1.45}.blog-tool--password-grid .password-grid__privacy-note{margin:0;padding-left:1.75rem;color:var(--text-muted);font-size:.75rem;line-height:1.45}.blog-tool--password-grid .password-grid__image-button{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:2.85rem;padding:.7rem 1rem;color:var(--text-primary);background:rgba(0,0,0,0);border:1px solid var(--border);border-radius:.75rem;font-size:.9rem;font-weight:750;cursor:pointer;transition:color 220ms ease,background-color 220ms ease,border-color 220ms ease,transform 220ms ease}.blog-tool--password-grid .password-grid__image-button span{color:var(--blue);font-size:1.1em}.blog-tool--password-grid .password-grid__image-button:hover{color:var(--blue);background:var(--password-grid-surface-soft);border-color:var(--blue);transform:translateY(-1px)}.blog-tool--password-grid .password-grid__image-button:disabled{opacity:.65;cursor:not-allowed;transform:none}.blog-tool--password-grid .password-grid__status{min-height:1.3rem;margin:.9rem 0;color:var(--text-secondary);font-size:.82rem;line-height:1.4}.blog-tool--password-grid .password-grid__status[data-state=error]{color:var(--error);font-weight:700}.blog-tool--password-grid .password-grid__sheet{overflow-x:auto;padding:.55rem;background:var(--bg-page);border:1px solid var(--border);border-radius:1rem}.blog-tool--password-grid .password-grid__grid{--password-grid-columns: 31;--password-grid-cell-size: 2.9rem;--password-grid-row-color: #bfdbfe;--password-grid-column-color: #dbeafe;--password-grid-cell-color: #e0f7fa;--password-grid-character-color: #000000;display:grid;grid-template-columns:var(--password-grid-cell-size) repeat(var(--password-grid-columns), var(--password-grid-cell-size));grid-auto-rows:var(--password-grid-cell-size);width:max-content;min-width:100%;overflow:hidden;color:var(--password-grid-character-color);background:var(--password-grid-cell-color);border:1px solid #000;border-radius:.65rem;font-variant-numeric:tabular-nums}.blog-tool--password-grid .password-grid__cell{display:grid;place-items:center;width:var(--password-grid-cell-size);height:var(--password-grid-cell-size);min-width:var(--password-grid-cell-size);min-height:var(--password-grid-cell-size);padding:0;color:var(--password-grid-character-color) !important;border-right:1px solid #000;border-bottom:1px solid #000;aspect-ratio:1/1;overflow:hidden}.blog-tool--password-grid .password-grid__cell--corner,.blog-tool--password-grid .password-grid__cell--column,.blog-tool--password-grid .password-grid__cell--row{color:var(--password-grid-character-color);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:clamp(1.65rem,3vw,2.2rem);font-weight:800;line-height:1;white-space:nowrap}.blog-tool--password-grid .password-grid__cell--corner{padding:.15rem;background:#fff}.blog-tool--password-grid .password-grid__logo{display:block;width:84%;height:76%;object-fit:contain;pointer-events:none;user-select:none}.blog-tool--password-grid .password-grid__cell--row{background:var(--password-grid-row-color)}.blog-tool--password-grid .password-grid__cell--column{background:var(--password-grid-column-color)}.blog-tool--password-grid .password-grid__cell--character{color:var(--password-grid-character-color);background:var(--password-grid-cell-color);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:clamp(1.65rem,3vw,2.2rem);font-weight:800;line-height:1;white-space:nowrap}.blog-tool--password-grid noscript{display:block;margin-top:1rem;color:var(--warning);font-size:.85rem}@media(max-width: 46rem){.blog-tool--password-grid .password-grid__form-grid{grid-template-columns:1fr}.blog-tool--password-grid .password-grid__color-options{grid-template-columns:repeat(2, minmax(0, 1fr))}}@media(max-width: 30rem){.blog-tool--password-grid{padding:.8rem}.blog-tool--password-grid .password-grid__fieldset{padding:.8rem}.blog-tool--password-grid .password-grid__field-row{grid-template-columns:1fr}.blog-tool--password-grid .password-grid__image-options,.blog-tool--password-grid .password-grid__image-dimensions{grid-template-columns:1fr}.blog-tool--password-grid .password-grid__color-options{grid-template-columns:1fr}.blog-tool--password-grid .password-grid__actions{align-items:stretch;flex-direction:column}.blog-tool--password-grid .password-grid__actions .blog-button,.blog-tool--password-grid .password-grid__actions .password-grid__image-button{width:100%}}