:root{--pw-ink: #0f172a;--pw-body: #334155;--pw-muted: #64748b;--pw-line: #e2e8f0;--pw-paper: #ffffff;--pw-soft: #f1f5f9;--pw-accent: #4f46e5;--pw-accent-dark: #4338ca;--pw-tint: #eef2ff;--pw-well: #f8fafc;--pw-c-upper: #4338ca;--pw-c-digit: #0f766e;--pw-c-sym: #b45309;--pw-weak: #dc2626;--pw-fair: #b45309;--pw-good: #4d7c0f;--pw-strong: #047857;--pw-warn-bg: #fffbeb;--pw-warn-line: #fcd34d;--primary: #4f46e5;--primary-dark: #4338ca;--border: #e2e8f0;--surface: #ffffff;--shadow-soft: 0 10px 30px rgba(15, 23, 42, .08);--surface-muted: #f1f5f9;--text-main: #0f172a;--text-muted: #64748b;}
.pw-app{display: grid;grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);gap: 20px;align-items: start;margin: 8px 0 56px;}
.pw-vault{background: var(--pw-paper);color: var(--pw-ink);border: 1px solid var(--pw-line);border-top: 4px solid var(--pw-accent);border-radius: 20px;padding: 24px;box-shadow: var(--shadow-soft);min-width: 0;}
.pw-vault-head{display: flex;justify-content: space-between;align-items: center;gap: 12px;margin-bottom: 10px;}
.pw-eyebrow{display: block;font-size: 12px;font-weight: 700;letter-spacing: .08em;text-transform: uppercase;color: var(--pw-muted);}
.pw-legend{display: flex;gap: 10px;font: 600 12px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;}
.pw-legend i{font-style: normal;}
.pw-out{display: block;min-height: 96px;padding: 18px 20px;background: var(--pw-well);border: 1px solid var(--pw-line);border-radius: 14px;font: 600 26px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;letter-spacing: .04em;word-break: break-all;color: var(--pw-ink);}
.pw-out.is-long{font-size: 19px;}
.pw-out.is-huge{font-size: 15px;}
.pw-out.is-masked{color: var(--pw-muted);letter-spacing: .12em;}
.pw-c-l{color: var(--pw-ink);}
.pw-c-u{color: var(--pw-c-upper);}
.pw-c-d{color: var(--pw-c-digit);}
.pw-c-s{color: var(--pw-c-sym);}
.pw-noscript{margin: 10px 0 0;color: var(--pw-c-sym);font-size: 14px;}
.pw-actions{display: flex;flex-wrap: wrap;align-items: center;gap: 10px;margin: 16px 0 20px;}
.pw-btn{appearance: none;border: 1px solid var(--pw-line);background: var(--pw-paper);color: var(--pw-ink);font-weight: 700;font-size: 15px;padding: 10px 18px;border-radius: 12px;cursor: pointer;transition: background .15s ease, border-color .15s ease;}
.pw-btn:hover{background: var(--pw-soft);border-color: #cbd5e1;}
.pw-btn:focus-visible{outline: 3px solid rgba(79, 70, 229, .35);outline-offset: 2px;}
.pw-btn-main{background: var(--pw-accent);border-color: var(--pw-accent);color: #fff;}
.pw-btn-main:hover{background: var(--pw-accent-dark);border-color: var(--pw-accent-dark);}
.pw-btn-ghost{border-color: transparent;background: transparent;}
.pw-btn-ghost:hover{background: var(--pw-soft);}
.pw-btn-ghost[aria-pressed="true"]{border-color: var(--pw-accent);background: var(--pw-tint);color: var(--pw-accent-dark);}
.pw-status{font-size: 13.5px;color: var(--pw-strong);min-height: 1em;}
.pw-meter{margin-bottom: 18px;}
.pw-meter-top{display: flex;justify-content: space-between;align-items: baseline;margin-bottom: 8px;}
.pw-meter-label{font-weight: 800;font-size: 17px;}
.pw-meter-bits{font-size: 14px;color: var(--pw-muted);}
.pw-meter-bits b{font-size: 20px;color: var(--pw-ink);}
.pw-bar{height: 10px;border-radius: 99px;background: var(--pw-soft);overflow: hidden;}
.pw-bar i{display: block;height: 100%;width: 0;border-radius: inherit;background: var(--pw-weak);transition: width .25s ease, background .25s ease;}
.pw-meter[data-level="0"] .pw-meter-label{color: var(--pw-weak);}
.pw-meter[data-level="1"] .pw-meter-label{color: var(--pw-fair);}
.pw-meter[data-level="1"] .pw-bar i{background: var(--pw-fair);}
.pw-meter[data-level="2"] .pw-meter-label{color: var(--pw-good);}
.pw-meter[data-level="2"] .pw-bar i{background: var(--pw-good);}
.pw-meter[data-level="3"] .pw-meter-label,.pw-meter[data-level="4"] .pw-meter-label{color: var(--pw-strong);}
.pw-meter[data-level="3"] .pw-bar i,.pw-meter[data-level="4"] .pw-bar i{background: var(--pw-strong);}
.pw-stats{display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));gap: 10px;margin: 0;}
.pw-stats div{background: var(--pw-well);border: 1px solid var(--pw-line);border-radius: 12px;padding: 10px 12px;min-width: 0;}
.pw-stats dt{font-size: 11.5px;font-weight: 700;letter-spacing: .05em;text-transform: uppercase;color: var(--pw-muted);margin-bottom: 4px;}
.pw-stats dd{margin: 0;font-weight: 700;font-size: 15px;line-height: 1.3;overflow-wrap: anywhere;color: var(--pw-ink);}
.pw-batch{margin-top: 20px;padding-top: 16px;border-top: 1px dashed var(--pw-line);}
.pw-batch-list{list-style: none;margin: 10px 0 0;padding: 0;display: grid;gap: 8px;counter-reset: pw;}
.pw-batch-list li{display: flex;align-items: center;gap: 10px;background: var(--pw-well);border: 1px solid var(--pw-line);border-radius: 10px;padding: 8px 8px 8px 12px;counter-increment: pw;}
.pw-batch-list li::before{content: counter(pw);font-size: 12px;font-weight: 700;color: var(--pw-muted);min-width: 16px;}
.pw-batch-list code{flex: 1;min-width: 0;font: 600 14.5px/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;color: var(--pw-ink);background: none;padding: 0;word-break: break-all;}
.pw-batch-list button{appearance: none;border: 1px solid var(--pw-line);background: var(--pw-paper);color: var(--pw-accent-dark);font-size: 13px;font-weight: 700;padding: 5px 10px;border-radius: 8px;cursor: pointer;flex-shrink: 0;}
.pw-batch-list button:hover{background: var(--pw-tint);border-color: var(--pw-accent);}
.pw-panel{background: var(--pw-paper);border: 1px solid var(--pw-line);border-radius: 20px;padding: 20px;box-shadow: var(--shadow-soft);color: var(--pw-ink);}
.pw-byline{display: flex;flex-wrap: wrap;justify-content: space-between;gap: 4px 12px;font-size: 12.5px;color: var(--pw-muted);padding-bottom: 12px;margin-bottom: 16px;border-bottom: 1px dashed var(--pw-line);}
.pw-byline .author-link{color: var(--pw-accent-dark);font-weight: 700;text-decoration: none;}
.pw-byline .author-link:hover{text-decoration: underline;}
.pw-group{border: 0;padding: 0;margin: 0 0 18px;min-width: 0;}
.pw-label,.pw-group legend{display: block;float: none;width: auto;font-size: 12px;font-weight: 700;letter-spacing: .06em;text-transform: uppercase;line-height: 1.2;color: var(--pw-muted);margin-bottom: 8px;padding: 0;}
.pw-presets{display: grid;grid-template-columns: 1fr 1fr;gap: 8px;}
.pw-preset{appearance: none;border: 1px solid var(--pw-line);background: var(--pw-soft);color: var(--pw-body);font-weight: 700;font-size: 14px;padding: 9px 10px;border-radius: 10px;cursor: pointer;text-align: left;}
.pw-preset:hover{border-color: var(--pw-accent);}
.pw-preset.is-active{background: var(--pw-tint);border-color: var(--pw-accent);color: var(--pw-accent-dark);}
.pw-preset:focus-visible,.pw-set input:focus-visible+span,.pw-count input:focus-visible+span{outline: 3px solid rgba(79, 70, 229, .35);outline-offset: 2px;}
.pw-length{display: flex;align-items: center;gap: 12px;}
.pw-length input[type="range"]{flex: 1;accent-color: var(--pw-accent);min-width: 0;}
.pw-length input[type="number"]{width: 76px;border: 1px solid var(--pw-line);border-radius: 10px;padding: 8px 10px;font-weight: 700;font-size: 16px;color: var(--pw-ink);text-align: center;}
.pw-length input[type="number"]:focus{outline: none;border-color: var(--pw-accent);box-shadow: 0 0 0 3px rgba(79, 70, 229, .18);}
.pw-sets{display: grid;grid-template-columns: 1fr 1fr;gap: 8px;}
.pw-set{display: block;cursor: pointer;margin: 0;}
.pw-set input,.pw-count input{position: absolute;opacity: 0;pointer-events: none;}
.pw-set span{display: block;height: 100%;border: 1px solid var(--pw-line);border-radius: 12px;padding: 10px 12px;background: var(--pw-paper);transition: border-color .15s ease, background .15s ease;}
.pw-set b{display: block;font-size: 14.5px;color: var(--pw-ink);}
.pw-set small{display: block;font: 12px/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;color: var(--pw-muted);margin-top: 2px;word-spacing: -2px;}
.pw-set input:checked+span{border-color: var(--pw-accent);background: var(--pw-tint);}
.pw-set input:checked+span b{color: var(--pw-accent-dark);}
.pw-toggle{display: flex;align-items: flex-start;gap: 10px;margin: 0 0 10px;cursor: pointer;font-size: 14.5px;font-weight: 600;color: var(--pw-body);}
.pw-toggle input{width: 18px;height: 18px;margin-top: 2px;accent-color: var(--pw-accent);flex-shrink: 0;}
.pw-toggle input:disabled+span{opacity: .5;}
.pw-toggle small{display: block;font: 12px/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;color: var(--pw-muted);font-weight: 400;margin-top: 2px;}
.pw-count{display: inline-flex;border: 1px solid var(--pw-line);border-radius: 12px;overflow: hidden;}
.pw-count label{margin: 0;cursor: pointer;}
.pw-count span{display: block;padding: 8px 20px;font-weight: 700;color: var(--pw-body);border-right: 1px solid var(--pw-line);}
.pw-count label:last-child span{border-right: 0;}
.pw-count input:checked+span{background: var(--pw-accent);color: #fff;}
.pw-note{margin: 0;padding: 10px 12px;border-radius: 10px;background: #fef2f2;color: #b91c1c;font-size: 14px;font-weight: 600;}
.pw-read{margin: 0 auto 44px;color: var(--pw-body);font-size: 16.5px;line-height: 1.7;}
.pw-read h2,.pw-limits h2{font-size: 26px;font-weight: 800;color: var(--pw-ink);margin: 0 0 14px;letter-spacing: -.01em;}
.pw-read p{margin: 0 0 14px;}
.pw-read strong{color: var(--pw-ink);}
.pw-read code,.pw-limits code{font-size: .9em;background: var(--pw-soft);color: var(--pw-accent-dark);padding: 1px 6px;border-radius: 6px;}
.pw-table-wrap{overflow-x: auto;margin: 0 0 16px;border: 1px solid var(--pw-line);border-radius: 14px;}
.pw-table{width: 100%;border-collapse: collapse;font-size: 15px;}
.pw-table th{background: var(--pw-soft);color: var(--pw-ink);font-weight: 700;text-align: left;padding: 10px 14px;white-space: nowrap;}
.pw-table td{padding: 10px 14px;border-top: 1px solid var(--pw-line);vertical-align: top;}
.pw-table td:not(:first-child){font-variant-numeric: tabular-nums;}
.pw-list{padding-left: 20px;margin: 0 0 14px;}
.pw-list li{margin-bottom: 8px;}
.pw-presets-ref{margin: 0;display: grid;gap: 12px;}
.pw-presets-ref div{border-left: 4px solid var(--pw-accent);background: var(--pw-soft);border-radius: 0 12px 12px 0;padding: 14px 18px;}
.pw-presets-ref dt{font-size: 17px;font-weight: 800;color: var(--pw-ink);}
.pw-presets-ref dt span{display: block;font-size: 13px;font-weight: 600;color: var(--pw-muted);margin-top: 2px;}
.pw-presets-ref dd{margin: 6px 0 0;}
.pw-limits{margin: 0 auto 48px;background: var(--pw-warn-bg);border: 1px solid var(--pw-warn-line);color: var(--pw-body);border-radius: 20px;padding: 28px 30px;font-size: 16px;line-height: 1.65;}
.pw-limits h2{color: var(--pw-ink);}
.pw-limits ul{margin: 0;padding-left: 20px;}
.pw-limits li{margin-bottom: 10px;}
.pw-limits strong{color: var(--pw-ink);}
@media (max-width: 991.98px){.pw-app{grid-template-columns: 1fr;}.pw-stats{grid-template-columns: repeat(2, minmax(0, 1fr));}}
@media (max-width: 575.98px){.pw-vault,.pw-panel{padding: 16px;border-radius: 16px;}.pw-out{font-size: 20px;padding: 14px;min-height: 80px;}.pw-out.is-long{font-size: 16px;}.pw-out.is-huge{font-size: 13px;}.pw-legend{display: none;}.pw-btn{flex: 1 1 auto;padding: 10px 12px;}.pw-sets,.pw-presets{grid-template-columns: 1fr;}.pw-read h2,.pw-limits h2{font-size: 22px;}.pw-limits{padding: 20px 18px;}}
@media (prefers-reduced-motion: reduce){.pw-bar i,.pw-btn,.pw-set span{transition: none;}}