:root{--dark-bg: #0f1729;--card-bg: #1a2236;--accent: #4f69c6;--text: #e2e8f0;--text-secondary: #94a3b8;--input-bg: #262f46;--hover: #6577c7;--success: #34d399}*{margin:0;padding:0}@keyframes gradientAnimation{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:linear-gradient(135deg,var(--dark-bg),#1f2b4d,var(--dark-bg));background-size:200% 200%;animation:gradientAnimation 15s ease infinite;min-height:100vh;display:flex;align-items:center;justify-content:center}.container{background-color:var(--card-bg);padding:min(3rem,6vw);border-radius:12px;box-shadow:0 8px 32px #0000004d;width:min(90%,400px)}@media (max-width: 1400px){.container{width:65%}}@media (max-width: 1024px){.container{width:80%}}@media (max-width: 768px){.container{width:90%}}@media (max-width: 480px){.container{width:85%;padding:min(2rem,5vw)}body{padding:0}.password-display{flex-direction:column;gap:.5rem}.options{grid-template-columns:1fr}#password{font-size:.9rem;padding:1rem;letter-spacing:normal}}h1{text-align:center;margin-bottom:2rem;color:var(--text);font-size:clamp(1.5rem,4vw,2rem)}.password-display{display:flex;margin-bottom:2rem;gap:.75rem;position:relative;width:100%;overflow-x:hidden}#password{flex:1;padding:1.25rem;font-size:clamp(1rem,2.5vw,1.25rem);min-width:100%;letter-spacing:.5px;font-family:Monaco,Consolas,monospace;white-space:nowrap;overflow-x:auto;overflow-y:hidden}#password::-webkit-scrollbar{height:6px}#password::-webkit-scrollbar-track{background:var(--input-bg);border-radius:3px}#password::-webkit-scrollbar-thumb{background:var(--accent);border-radius:3px}#password:focus{outline:none;border-color:var(--hover)}#password:hover{border-color:var(--hover)}.controls{display:flex;flex-direction:column;gap:1.5rem;padding:.5rem}.length-control{display:flex;flex-direction:column;gap:.75rem;padding:.5rem}#length{width:100%}.options{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;padding:.5rem}.options label{color:var(--text-secondary);display:flex;align-items:center;gap:.5rem;cursor:pointer;transition:color .2s;padding:.5rem;background-color:var(--input-bg);border-radius:6px}.options label:hover{color:var(--text)}input[type=checkbox]{accent-color:var(--accent);width:1.2em;height:1.2em}input[type=range]{accent-color:var(--accent);height:6px;border-radius:3px}button{padding:1rem 1.75rem;background-color:var(--accent);color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:1rem;font-weight:600;transition:all .2s}button:hover{background-color:var(--hover)}.length-control label{color:var(--text-secondary);font-size:clamp(.875rem,2.5vw,1rem)}#lengthValue{color:var(--accent);font-weight:700}.exclusion-control{display:flex;flex-direction:column;gap:.75rem;width:100%;position:relative}.exclusion-tags{display:flex;flex-wrap:wrap;gap:.5rem;width:100%;max-height:150px;overflow-y:auto;padding:.25rem}.exclusion-tags::-webkit-scrollbar{width:8px}.exclusion-tags::-webkit-scrollbar-track{background:var(--input-bg);border-radius:4px}.exclusion-tags::-webkit-scrollbar-thumb{background:var(--accent);border-radius:4px}.exclusion-tag{background-color:var(--input-bg);color:var(--text);padding:.5rem 1rem;border-radius:4px;font-size:.875rem;position:relative;cursor:pointer;transition:all .2s;flex:0 0 auto;margin:.25rem}.exclusion-tag:hover{background-color:#3a4559}.exclusion-tag:before{content:"×";position:absolute;top:-4px;left:-4px;background-color:var(--accent);color:var(--text);width:16px;height:16px;font-size:12px;border-radius:50%;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s}.exclusion-tag:hover:before{opacity:1}.exclusion-control label{color:var(--text-secondary);font-size:clamp(.875rem,2.5vw,1rem)}.toast{position:fixed;top:-45px;left:50%;transform:translate(-50%) translateY(10px);background-color:var(--success);color:#fff;padding:.5rem 1rem;border-radius:4px;font-size:.875rem;opacity:0;transition:all .3s ease;z-index:1000;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%) translateY(0)}#exclude{background-color:var(--input-bg);border:1px solid var(--card-bg);color:var(--text);padding:.5rem;border-radius:4px}#exclude:focus{outline:none;border-color:var(--accent)}.exclusion-toast{position:absolute;top:-40px;left:50%;transform:translate(-50%) translateY(10px);background-color:#ef4444;color:#fff;padding:.5rem 1rem;border-radius:4px;font-size:.875rem;opacity:0;transition:all .3s ease;pointer-events:none}.exclusion-toast.show{opacity:1;transform:translate(-50%) translateY(0)}
