.password-generator{display:flex;flex-direction:column;gap:calc(var(--spacing) * 3)}.password-display-card{display:flex;flex-direction:column;gap:calc(var(--spacing) * 2);padding:calc(var(--spacing) * 2);background:var(--color-surface-elevated);border-radius:var(--radius)}.password-display-wrapper{position:relative;display:flex;align-items:center;gap:var(--spacing)}.password-display{flex:1;padding:calc(var(--spacing) * 1.5);font-size:16px;font-family:Courier New,monospace;background:var(--color-surface);border:2px solid var(--color-border);border-radius:calc(var(--radius) * .75);color:var(--color-text);text-align:right;direction:ltr;letter-spacing:2px}.password-display:focus{outline:none;border-color:var(--color-accent)}.password-actions{display:flex;gap:calc(var(--spacing) * .5)}.password-action-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;background:var(--color-surface);border:2px solid var(--color-border);border-radius:calc(var(--radius) * .5);color:var(--color-text-secondary);cursor:pointer;transition:all .2s}.password-action-btn:hover{background:var(--color-surface-elevated);color:var(--color-accent);border-color:var(--color-accent)}.password-action-btn:active{transform:scale(.95)}.btn-generate{display:flex;align-items:center;justify-content:center;gap:calc(var(--spacing) * .75);padding:calc(var(--spacing) * 1.5);font-size:16px;font-weight:600;color:#fff;background:var(--color-accent);border:none;border-radius:calc(var(--radius) * .75);cursor:pointer;transition:all .2s}.btn-generate:hover{background:var(--color-accent-hover);transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.btn-generate:active{transform:translateY(0)}.password-strength{display:flex;flex-direction:column;gap:calc(var(--spacing) * .75)}.strength-label{display:flex;justify-content:space-between;align-items:center;font-size:14px;color:var(--color-text-secondary)}.strength-text{font-weight:600;color:var(--color-text)}.strength-bar{width:100%;height:8px;background:var(--color-surface);border-radius:4px;overflow:hidden}.strength-bar-fill{height:100%;background:linear-gradient(90deg,#ef4444,#f59e0b,#10b981);border-radius:4px;transition:width .3s ease,background .3s ease}.password-settings-card{display:flex;flex-direction:column;gap:calc(var(--spacing) * 3);padding:calc(var(--spacing) * 2);background:var(--color-surface-elevated);border-radius:var(--radius)}.setting-group{display:flex;flex-direction:column;gap:calc(var(--spacing) * 1.5)}.setting-label{font-size:15px;font-weight:600;color:var(--color-text)}.slider-wrapper{display:flex;flex-direction:column;gap:calc(var(--spacing) * .75)}.password-slider{width:100%;height:8px;background:var(--color-surface);border-radius:4px;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.password-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:var(--color-accent);border-radius:50%;cursor:pointer;-webkit-transition:all .2s;transition:all .2s}.password-slider::-webkit-slider-thumb:hover{transform:scale(1.1);box-shadow:0 0 0 4px rgba(var(--color-accent-rgb),.2)}.password-slider::-moz-range-thumb{width:20px;height:20px;background:var(--color-accent);border-radius:50%;cursor:pointer;border:none;-moz-transition:all .2s;transition:all .2s}.password-slider::-moz-range-thumb:hover{transform:scale(1.1);box-shadow:0 0 0 4px rgba(var(--color-accent-rgb),.2)}.slider-labels{display:flex;justify-content:space-between;font-size:12px;color:var(--color-text-secondary)}.checkbox-group{display:flex;flex-direction:column;gap:calc(var(--spacing) * 1.25)}.checkbox-label{display:flex;align-items:center;gap:calc(var(--spacing) * 1);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.checkbox-label input[type=checkbox]{width:20px;height:20px;cursor:pointer;accent-color:var(--color-accent)}.checkbox-text{font-size:14px;color:var(--color-text);flex:1}.password-history-card{display:flex;flex-direction:column;gap:calc(var(--spacing) * 2);padding:calc(var(--spacing) * 2);background:var(--color-surface-elevated);border-radius:var(--radius)}.history-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--spacing)}.history-header h3{font-size:18px;font-weight:600;color:var(--color-text);margin:0}.btn-clear-history{padding:calc(var(--spacing) * .75) calc(var(--spacing) * 1.5);font-size:14px;color:#ef4444;background:transparent;border:1px solid #ef4444;border-radius:calc(var(--radius) * .5);cursor:pointer;transition:all .2s}.btn-clear-history:hover{background:#ef4444;color:#fff}.password-history-list{display:flex;flex-direction:column;gap:calc(var(--spacing) * 1);list-style:none;padding:0;margin:0;max-height:300px;overflow-y:auto}.password-history-item{display:flex;align-items:center;gap:var(--spacing);padding:calc(var(--spacing) * 1);background:var(--color-surface);border-radius:calc(var(--radius) * .5);transition:all .2s}.password-history-item:hover{background:var(--color-surface-elevated)}.password-history-item button{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;background:transparent;border:none;color:var(--color-text-secondary);cursor:pointer;transition:all .2s;border-radius:calc(var(--radius) * .5)}.password-history-item button:hover{background:var(--color-surface-elevated);color:var(--color-accent)}.password-history-item .password-text{flex:1;font-family:Courier New,monospace;font-size:14px;color:var(--color-text);direction:ltr;text-align:right;letter-spacing:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.privacy-note{font-size:12px;color:var(--color-text-secondary);text-align:center;margin:0;padding-top:calc(var(--spacing) * 1);border-top:1px solid var(--color-border)}@media(max-width:480px){.password-display-card,.password-settings-card,.password-history-card{padding:var(--spacing)}.password-display{font-size:14px;padding:var(--spacing)}.password-action-btn{width:36px;height:36px}.btn-generate{padding:var(--spacing);font-size:14px}.history-header{flex-direction:column;align-items:flex-start}.password-history-list{max-height:200px}}