@import"https://fonts.googleapis.com/css2?family=Manrope:wght@500;700;800&family=JetBrains+Mono:wght@500&display=swap";:root{--bg-top: #f4f9ff;--bg-bottom: #e8f3ec;--card: rgba(255, 255, 255, .86);--text: #14304a;--muted: #4a6a84;--line: rgba(20, 48, 74, .14);--accent: #0e97a7;--accent-strong: #0c7582;--warm: #ff9b5c;--danger: #da4f4f;--ok: #1e9861;--radius-lg: 24px;--radius-md: 14px}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:Manrope,Avenir Next,Segoe UI,sans-serif;color:var(--text);background:linear-gradient(170deg,var(--bg-top),var(--bg-bottom))}#root{min-height:100vh}.page{position:relative;min-height:100vh;overflow-x:hidden;padding:24px 16px 36px}.ambient{position:absolute;border-radius:999px;filter:blur(12px);opacity:.55;pointer-events:none}.ambient-one{width:380px;height:380px;background:radial-gradient(circle at 30% 20%,#70d8e2,transparent 70%);top:-130px;left:-100px;animation:floatA 10s ease-in-out infinite}.ambient-two{width:420px;height:420px;background:radial-gradient(circle at 70% 40%,#ffd0ac,transparent 70%);bottom:-170px;right:-100px;animation:floatB 12s ease-in-out infinite}.shell{position:relative;z-index:1;max-width:840px;margin:0 auto;display:grid;gap:18px;animation:reveal .55s ease-out}.card,.history{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:var(--card);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:0 16px 40px #122b4a14}.card{padding:26px;display:grid;gap:18px}.header{display:grid;gap:8px}.eyebrow{margin:0;font-size:.8rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-strong)}h1{margin:0;font-size:clamp(1.7rem,3vw,2.2rem);line-height:1.1}.subtitle{margin:0;color:var(--muted)}.mode-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.mode-btn{border:1px solid var(--line);background:#fffc;color:var(--text);border-radius:999px;padding:10px 14px;font-size:.93rem;font-weight:700;cursor:pointer;transition:transform .2s ease,border-color .2s ease,background .2s ease}.mode-btn:hover{transform:translateY(-1px);border-color:var(--accent)}.mode-btn.active{color:#fff;border-color:transparent;background:linear-gradient(130deg,var(--accent),#0c6fbc)}.password-box{border:1px solid var(--line);border-radius:var(--radius-md);background:#fff;min-height:66px;padding:14px;display:flex;align-items:center;font-family:JetBrains Mono,Menlo,Monaco,monospace;font-size:clamp(.92rem,2vw,1.1rem);overflow-x:auto}.password-box span{white-space:nowrap}.strength-row{display:flex;align-items:center;gap:10px}.strength-bars{flex:1;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.bar{height:8px;border-radius:999px;background:#14304a1f}.bar.active[data-level="1"]{background:var(--danger)}.bar.active[data-level="2"]{background:#f1993f}.bar.active[data-level="3"]{background:#2f8ece}.bar.active[data-level="4"]{background:var(--ok)}.strength-label{min-width:56px;text-align:right;font-weight:700}.entropy{margin:0;color:var(--muted);font-size:.9rem}.controls{display:grid;gap:14px}.range-wrap{display:grid;gap:10px}.range-head{display:flex;justify-content:space-between;align-items:center}.range-head strong{font-family:JetBrains Mono,Menlo,Monaco,monospace}input[type=range]{width:100%;accent-color:var(--accent)}.separator-field{display:grid;gap:8px;max-width:140px}.separator-field input{border-radius:10px;border:1px solid var(--line);padding:8px 10px;font-family:JetBrains Mono,Menlo,Monaco,monospace}.check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.check-card{border:1px solid var(--line);border-radius:var(--radius-md);background:#fff;padding:10px 12px;display:grid;gap:4px;cursor:pointer;transition:border-color .2s ease,transform .2s ease}.check-card:hover{transform:translateY(-1px);border-color:#0c758273}.check-card input{margin:0 0 3px}.check-card .title{font-weight:700}.check-card .hint{color:var(--muted);font-size:.85rem}.toggles{display:grid;gap:10px}.toggle{display:flex;gap:10px;align-items:center;cursor:pointer;color:var(--muted)}.toggle input{margin:0}.actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.btn{border:0;border-radius:12px;padding:12px 14px;font-size:.95rem;font-weight:800;cursor:pointer;transition:transform .2s ease,opacity .2s ease}.btn:hover:not(:disabled){transform:translateY(-1px)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{color:#fff;background:linear-gradient(130deg,var(--accent),#0c6fbc)}.btn-secondary{color:var(--text);border:1px solid var(--line);background:#fff}.history{padding:18px;animation:reveal .55s ease-out}.history-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.history-head h2{margin:0;font-size:1rem}.history-head button{border:0;background:transparent;color:var(--accent-strong);font-weight:700;cursor:pointer}.history ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}.history li button{width:100%;border:1px solid var(--line);border-radius:10px;background:#fff;font-family:JetBrains Mono,Menlo,Monaco,monospace;text-align:left;padding:9px 10px;cursor:pointer;overflow-x:auto;white-space:nowrap}@keyframes reveal{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes floatA{0%,to{transform:translate(0)}50%{transform:translate(16px,12px)}}@keyframes floatB{0%,to{transform:translate(0)}50%{transform:translate(-14px,-10px)}}@media (max-width: 720px){.card{padding:18px}.mode-grid,.actions,.check-grid{grid-template-columns:1fr}}