:root { --bg:#0e120e; --panel:#141a14; --fg:#c8d6c0; --acc:#7fd17a; --err:#e06a6a; --mut:#5d6b58; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font-family:"Consolas","Courier New",monospace; }
.terminal { max-width:720px; margin:0 auto; padding:24px 16px 64px; }
h1 { color:var(--acc); letter-spacing:2px; font-size:1.2rem; border-bottom:1px solid var(--mut); padding-bottom:8px; }
.tabs { display:flex; gap:8px; margin:16px 0; }
.tab { background:var(--panel); color:var(--fg); border:1px solid var(--mut); padding:8px 14px; cursor:pointer; }
.tab.active { color:var(--acc); border-color:var(--acc); }
.panel { background:var(--panel); border:1px solid var(--mut); padding:16px; display:flex; flex-direction:column; gap:12px; }
.panel.hidden { display:none; }
label { display:flex; flex-direction:column; gap:6px; font-size:.85rem; color:var(--mut); }
textarea, input, select { background:#0b0f0b; color:var(--fg); border:1px solid var(--mut); padding:8px; font-family:inherit; font-size:.95rem; }
textarea { resize:vertical; }
.key-row { display:flex; gap:6px; }
.key-row input { flex:1; }
button { background:#1c241c; color:var(--fg); border:1px solid var(--mut); padding:6px 10px; cursor:pointer; font-family:inherit; }
button:hover { border-color:var(--acc); color:var(--acc); }
.run { background:var(--acc); color:#0b0f0b; font-weight:bold; border:none; padding:10px; }
.strength { font-size:.8rem; min-height:1em; }
.strength.weak { color:var(--err); }
.strength.mid { color:#d6c87f; }
.strength.strong { color:var(--acc); }
.level-badge { min-height:1.2em; color:var(--acc); font-size:.85rem; }
.err { color:var(--err); min-height:1.2em; font-size:.85rem; }
.security { margin-top:20px; color:var(--mut); font-size:.8rem; }
.security summary { cursor:pointer; color:var(--fg); }
.security li { margin:6px 0; }