/* Password Strength Lab extras (shell: planning-tools-shell.css). Scoped to .pl-shell. */
.pl-shell{--pl-s0:var(--pt-bad,#ff7a7a);--pl-s1:#ff9f5a;--pl-s2:var(--pt-warn,#edc777);--pl-s3:#8fdc6a;--pl-s4:var(--pt-accent,var(--bb-kelly,#00c853))}
.pl-privacy{margin-top:18px;max-width:820px;border:1px solid color-mix(in srgb,var(--pt-accent,#00c853) 45%,transparent);border-left:4px solid var(--pt-accent,var(--bb-kelly,#00c853));border-radius:10px;padding:14px 16px;background:color-mix(in srgb,var(--pt-accent,#00c853) 8%,var(--pt-panel,#101b22));line-height:1.6}
.pl-privacy strong{color:var(--pt-accent,var(--bb-kelly,#00c853))}
.pl-inputrow{display:flex;gap:8px;align-items:stretch}
.pl-inputrow input{flex:1 1 auto;font-family:var(--font-code,monospace)!important;letter-spacing:.5px}
.pl-inputrow button{flex:0 0 auto}
.pl-shell .pl-sample{min-height:36px;padding:5px 10px;margin:4px 4px 0 0;font:500 14px var(--font-code,monospace)}
.pl-meter{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:18px 0 8px}
.pl-meter span{height:12px;border-radius:6px;background:var(--pt-line,#2a3a44);transition:background .25s}
.pl-meter.pl-s0 span.on{background:var(--pl-s0)}
.pl-meter.pl-s1 span.on{background:var(--pl-s1)}
.pl-meter.pl-s2 span.on{background:var(--pl-s2)}
.pl-meter.pl-s3 span.on{background:var(--pl-s3)}
.pl-meter.pl-s4 span.on{background:var(--pl-s4)}
.pl-verdict{font-weight:700;font-size:18px;margin:6px 0 16px;color:var(--pt-muted,#acbec7)}
.pl-verdict.pl-s0{color:var(--pl-s0)}.pl-verdict.pl-s1{color:var(--pl-s1)}.pl-verdict.pl-s2{color:var(--pl-s2)}.pl-verdict.pl-s3{color:var(--pl-s3)}.pl-verdict.pl-s4{color:var(--pl-s4)}
.pl-stats{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin:0 0 6px}
.pl-stat{border:1px solid var(--pt-line,#2a3a44);border-radius:10px;padding:12px 14px;display:flex;flex-direction:column;gap:2px;min-width:0}
.pl-stat-k{font:13px var(--font-code,monospace);letter-spacing:1px;text-transform:uppercase;color:var(--pt-muted,#acbec7)}
.pl-stat-v{font:700 24px/1.3 var(--font-code,monospace);color:var(--pt-accent,var(--bb-kelly,#00c853));overflow-wrap:anywhere}
.pl-stat-v.pl-dim{color:var(--pt-muted,#acbec7);text-decoration:line-through;text-decoration-thickness:1px}
.pl-crack td.pl-time{font-weight:700;white-space:nowrap}
.pl-tokens{display:flex;flex-wrap:wrap;gap:4px;margin:0 0 8px}
.pl-tok{font-weight:700;white-space:pre-wrap;overflow-wrap:anywhere}
.pl-shell .pt-tag{max-width:100%;overflow-wrap:anywhere}
.pl-why,.pl-tips{padding-left:20px;margin:8px 0}
.pl-why li{margin:6px 0}
.pl-why li::marker{color:var(--pt-bad,#ff7a7a)}
.pl-why li.pl-why-none::marker{color:var(--pt-accent,var(--bb-kelly,#00c853))}
.pl-tips li::marker{color:var(--pt-accent,var(--bb-kelly,#00c853))}
.pl-details{margin-top:14px;border-top:1px solid var(--pt-line,#2a3a44);padding-top:10px}
.pl-details summary{cursor:pointer;font-weight:600;min-height:44px;display:flex;align-items:center;color:var(--pt-accent,var(--bb-kelly,#00c853))}
.pl-details p{color:var(--pt-muted,#acbec7);font-size:15px}
/* Generator */
.pl-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 6px}
.pl-shell .pl-tabs button[aria-selected=true]{border-color:var(--pt-accent,#00c853);color:var(--pt-accent,var(--bb-kelly,#00c853));background:color-mix(in srgb,var(--pt-accent,#00c853) 12%,var(--pt-bg,#070d12))}
.pl-fieldset{border:1px solid var(--pt-line,#2a3a44);border-radius:8px;padding:6px 14px 10px;margin:16px 0 0;min-width:0}
.pl-fieldset legend{font-size:15px;font-weight:600;padding:0 6px}
.pl-shell label.pl-check{display:flex;gap:10px;align-items:flex-start;font-weight:500;margin:10px 0}
.pl-check input{width:20px;height:20px;flex-shrink:0;margin-top:3px;accent-color:var(--pt-accent,var(--bb-kelly,#00c853))}
.pl-output{margin-top:18px}
.pl-shell .pl-genout{display:block;font:600 clamp(17px,2.4vw,22px)/1.5 var(--font-code,monospace);padding:14px 16px;border-radius:10px;border:1px dashed color-mix(in srgb,var(--pt-accent,#00c853) 55%,transparent);background:var(--pt-bg,#070d12);color:var(--pt-text,#ecf3f4);overflow-wrap:anywhere;word-break:break-all;white-space:pre-wrap;min-height:56px;user-select:all}
.pl-math{font:14px var(--font-code,monospace);color:var(--pt-muted,#acbec7);overflow-wrap:anywhere}
/* Password manager flow */
.pl-flow{list-style:none;padding:0;margin:18px 0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;counter-reset:pl}
.pl-flow li{position:relative;border:1px solid var(--pt-line,#2a3a44);border-radius:10px;padding:10px 6px;text-align:center;font-size:14px;font-weight:600;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;transition:border-color .2s,background .2s,transform .2s;min-height:44px}
.pl-flow li:not(:last-child)::after{content:"\203A";position:absolute;right:-8px;top:50%;transform:translateY(-50%);color:var(--pt-muted,#acbec7);font-size:18px}
.pl-flow li.is-done{border-color:color-mix(in srgb,var(--pt-accent,#00c853) 45%,transparent)}
.pl-flow li.is-active{border-color:var(--pt-accent,var(--bb-kelly,#00c853));background:color-mix(in srgb,var(--pt-accent,#00c853) 14%,var(--pt-panel,#101b22));transform:translateY(-2px)}
.pl-node-ic{font-size:22px;line-height:1}
.pl-stage{display:grid;gap:18px;grid-template-columns:minmax(0,1fr);border:1px solid var(--pt-line,#2a3a44);border-radius:12px;padding:18px;background:color-mix(in srgb,var(--pt-text,#ecf3f4) 3%,transparent)}
@media(min-width:900px){.pl-stage{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center}}
.pl-stage-visual{display:flex;flex-direction:column;align-items:center;gap:6px;min-height:180px;justify-content:center;animation:pl-in .35s ease}
.pl-stage-text h3{margin-top:6px}
.pl-v-box{border:1px solid var(--pt-line,#2a3a44);border-radius:10px;padding:10px 14px;background:var(--pt-bg,#070d12);text-align:center;font:600 15px/1.5 var(--font-code,monospace);max-width:100%;overflow-wrap:anywhere}
.pl-v-box small{display:block;font:500 12px var(--font-code,monospace);color:var(--pt-muted,#acbec7);margin-top:2px}
.pl-v-kdf{border-color:var(--pt-warn,#edc777);color:var(--pt-warn,#edc777)}
.pl-v-key{border-color:var(--pt-accent,var(--bb-kelly,#00c853));color:var(--pt-accent,var(--bb-kelly,#00c853))}
.pl-v-cipher{color:var(--pt-muted,#acbec7);font-weight:500;font-size:13px;word-break:break-all;max-width:260px}
.pl-v-cloud{border-style:dashed}
.pl-v-locked{border-color:var(--pt-bad,#ff7a7a)}
.pl-v-items{text-align:left}
.pl-v-dots{letter-spacing:2px}
.pl-v-arrow{color:var(--pt-accent,var(--bb-kelly,#00c853));font:600 14px var(--font-code,monospace)}
.pl-v-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:center}
.pl-v-move{animation:pl-move 1.2s ease-in-out infinite}
@keyframes pl-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes pl-move{0%,100%{transform:translateX(-4px);opacity:.6}50%{transform:translateX(4px);opacity:1}}
@media(prefers-reduced-motion:reduce){.pl-stage-visual,.pl-v-move{animation:none}.pl-flow li{transition:none}}
/* Passkeys */
.pl-pk-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin:16px 0}
.pl-pk-card{border:1px solid var(--pt-line,#2a3a44);border-top:3px solid var(--pt-accent,var(--bb-kelly,#00c853));border-radius:10px;padding:14px 16px;min-width:0}
.pl-pk-card h3{margin-top:4px}
.pl-pk-card ol{padding-left:20px;margin:6px 0}
.pl-compare th[scope=row]{color:var(--pt-text,#ecf3f4);font-weight:600;letter-spacing:0;background:none;font-size:15px}
.pl-compare td:last-child{color:var(--pt-accent,var(--bb-kelly,#00c853))}
.pl-compare{min-width:560px}
.pl-exam{margin-top:16px;border:1px solid var(--pt-line,#2a3a44);border-left:4px solid var(--pt-warn,#edc777);border-radius:10px;padding:12px 16px}
@media(max-width:899px){
  .pl-flow{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pl-flow li:nth-child(3n)::after{display:none}
}
@media(max-width:500px){
  .pl-inputrow{flex-wrap:wrap}
  .pl-inputrow input{flex-basis:100%}
  .pl-inputrow button{flex:1 1 0}
  .pl-flow{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pl-flow li:nth-child(3n)::after{display:block}
  .pl-flow li:nth-child(2n)::after{display:none}
  .pl-stat-v{font-size:21px}
}
html[data-bb-theme="patriotic"] .pl-shell{--pl-s1:#b45309;--pl-s3:#3f7d20}
html[data-bb-theme="patriotic"] .pl-shell .pl-genout{color:#0a2240}
