
:root { --bg: #1e1b4b; --panel: #312e81; --text: #e0e7ff; --accent: #6366f1; --border: #4338ca; }
body { margin: 0; padding: 20px; font-family: 'Segoe UI', system-ui, sans-serif; background: var(--bg); color: var(--text); display:flex; justify-content:center;}
.container { max-width: 700px; width: 100%; }
header { text-align: center; margin-bottom: 2rem; }
.panel { background: var(--panel); border: 1px solid var(--border); padding: 25px; border-radius: 12px; }
.mt { margin-top: 25px; }
h2 { margin-top: 0; color: #a5b4fc; font-size: 1.3rem; }
input { width: 100%; padding: 12px; background: #1e1b4b; border: 1px solid var(--border); color: #fff; border-radius: 6px; font-size: 16px; margin-bottom: 15px; box-sizing: border-box; }
input:focus { outline: none; border-color: #818cf8; }
button { width: 100%; padding: 14px; background: var(--accent); color: #fff; border: none; font-size: 16px; font-weight: bold; border-radius: 6px; cursor: pointer; }
button:hover { background: #4f46e5; }
.alt-btn { background: #10b981; } .alt-btn:hover { background: #059669; }
label { display: block; margin-bottom: 15px; color: #c7d2fe; }
#gen-rounds { width: 80px; display: inline-block; margin-left: 10px; margin-bottom:0; }
#gen-out { font-family: monospace; color: #fde047; margin-top: 15px; margin-bottom:0; text-align:center;}
.ver-res { margin-top: 15px; padding: 15px; border-radius: 6px; text-align: center; font-weight: bold; display: none; }
.match { background: rgba(16,185,129,0.2); color: #10b981; border: 1px solid #10b981; display: block; }
.fail { background: rgba(239,68,68,0.2); color: #ef4444; border: 1px solid #ef4444; display: block; }

.tool-matrix { margin-top: 40px; padding-top: 30px; border-top: 1px solid var(--border); text-align: center; }
.matrix-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; margin-top: 20px; }
.matrix-grid a { background: var(--panel); color: var(--text); padding: 10px; border-radius: 6px; text-decoration: none; border: 1px solid var(--border); transition: 0.2s; font-size: 0.9rem; }
.matrix-grid a:hover { background: var(--bg); border-color: var(--accent); }
.donate-text { color: #a5b4fc; font-size: 0.9rem; }
.support-text a { color: #fde047; text-decoration: none; font-weight: bold; }
