.gen{--bg: #f8fafc;--text: #1e293b;--muted: #64748b;--card: #fff;--surface: #fff;--border: #e2e8f0;--ch-num: #0369a1;--ch-sym: #a21caf;--ghost: #f1f5f9;--ghost-hover: #e2e8f0;--track: #d4d4d8;--range: #e2e8f0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px;background:var(--bg);padding:48px 24px;color:var(--text);font:15px/1.5 IBM Plex Sans,Segoe UI,sans-serif}html[data-theme=dark] .gen{--bg: #16162a;--text: #e0e0e0;--muted: rgba(224, 224, 224, .5);--card: #0d0d1a;--surface: rgba(255, 255, 255, .03);--border: rgba(255, 255, 255, .06);--ch-num: #7dd3fc;--ch-sym: #f0abfc;--ghost: rgba(255, 255, 255, .08);--ghost-hover: rgba(255, 255, 255, .12);--track: rgba(255, 255, 255, .12);--range: rgba(255, 255, 255, .08)}.gen-display{border:1px solid var(--border);border-radius:18px;background:var(--card);padding:24px;width:min(520px,100%)}.gen-password{display:block;margin-bottom:16px;font-size:1.3rem;line-height:1.8;font-family:JetBrains Mono,IBM Plex Mono,monospace;letter-spacing:.05em;word-break:break-all}.ch-num{color:var(--ch-num)}.ch-sym{color:var(--ch-sym)}.gen-actions{display:flex;gap:8px}.gen-copy,.gen-new{transition:background .15s;cursor:pointer;border:0;border-radius:10px;padding:10px 24px;font:inherit;font-weight:600;font-size:14px}.gen-copy{background:#6366f1;color:#fff}.gen-copy:hover{background:#818cf8}.gen-new{background:var(--ghost);color:var(--text)}.gen-new:hover{background:var(--ghost-hover)}.strength-meter{display:flex;align-items:center;gap:12px;width:min(520px,100%)}.strength-bar{flex:1;border-radius:2px;background:var(--range);height:4px;overflow:hidden}.strength-fill{transition:width .3s ease,background .3s ease;border-radius:2px;height:100%}.strength-label{transition:color .3s ease;color:var(--muted);font-weight:700;font-size:12px;white-space:nowrap}.gen-options{display:grid;gap:24px;width:min(520px,100%)}.gen-length{display:grid;gap:10px}.gen-length span{color:var(--muted);font-size:14px}.gen-length strong{color:var(--text)}.gen-range{-webkit-appearance:none;appearance:none;outline:none;border-radius:2px;background:var(--range);width:100%;height:4px}.gen-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;cursor:pointer;box-shadow:0 0 0 2px #6366f14d;border:3px solid var(--bg);border-radius:50%;background:#6366f1;width:20px;height:20px}.gen-toggles{display:grid;grid-template-columns:1fr 1fr;gap:10px}.gen-sw{display:flex;align-items:center;gap:12px;transition:background .15s;cursor:pointer;border:1px solid var(--border);border-radius:12px;background:var(--surface);padding:14px 16px;font-size:14px}.gen-sw:hover{background:var(--ghost)}.gen-sw input[type=checkbox]{display:none}.gen-sw-track{position:relative;flex-shrink:0;transition:background .2s;border-radius:11px;background:var(--track);width:38px;height:22px}.gen-sw-track:after{position:absolute;top:3px;left:3px;transition:transform .2s ease;border-radius:50%;background:#fff;width:16px;height:16px;content:""}.gen-sw input:checked+.gen-sw-track{background:#6366f1}.gen-sw input:checked+.gen-sw-track:after{transform:translate(16px)}.timer{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:32px;transition:background .6s ease;padding:32px;min-height:100vh;font:15px/1.5 IBM Plex Sans,Segoe UI,sans-serif}.timer[data-mode=work]{background:#ba4949;color:#fff}.timer[data-mode=break]{background:#38858a;color:#fff}.timer-tabs{display:flex;gap:4px;border-radius:10px;background:#ffffff1a;padding:4px}.timer-tab{transition:all .15s;cursor:pointer;border:0;border-radius:8px;background:transparent;padding:8px 28px;color:#fff9;font:inherit;font-weight:600;font-size:15px}.timer-tab--on{background:#fff3;color:#fff}.timer-face{position:relative;width:280px;height:280px}.timer-ring{width:100%;height:100%}.timer-ring__track{stroke:#ffffff26}.timer-ring__fill{transition:stroke-dashoffset .3s ease;stroke:#ffffffe6}.timer-time{display:grid;position:absolute;place-items:center;inset:0}.timer-digits{font-weight:700;font-size:4.5rem;font-variant-numeric:tabular-nums;letter-spacing:.02em}.timer-controls{display:flex;gap:10px}.timer-btn{transition:background .15s;cursor:pointer;border:0;border-radius:12px;background:#fff3;padding:16px 52px;color:#fff;font:inherit;font-weight:700;font-size:20px}.timer-btn:hover{background:#ffffff4d}.timer-btn--sec{background:#ffffff1a;padding:16px 28px;font-size:16px}.timer-btn--sec:hover{background:#ffffff2e}.timer-sessions{margin:0;color:#ffffff80;font-size:15px}