/* shared tool page styles */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{--bg-primary:#0f0720;--bg-secondary:#1a0f2e;--bg-card:#2a1f50;--text-primary:#f0e6ff;--text-secondary:#b28cd8;--text-muted:#7c6a9e;--accent:#40a8ef;--accent-hover:#6bc4ff;--accent-soft:rgba(64,168,239,0.12);--accent-neon:#ff2d95;--border:rgba(178,140,216,0.12);--border-accent:rgba(64,168,239,0.25);--good:#4ade80;--warn:#fbbf24;--bad:#f87171;--radius:16px;--radius-sm:8px;--font-sans:'Inter',sans-serif;--font-display:'Chakra Petch',sans-serif;--max-width:960px;--nav-height:68px}
body{font-family:var(--font-sans);background:var(--bg-primary);color:var(--text-primary);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent-hover)}
.container{max-width:var(--max-width);margin:0 auto;padding:0 20px}
.nav{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(15,7,32,.95);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);height:var(--nav-height)}
.nav-content{display:flex;align-items:center;justify-content:space-between;height:100%;max-width:1100px;margin:0 auto;padding:0 20px}
.nav-logo{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-weight:700;color:var(--text-primary)}
.nav-logo img{width:34px;height:34px;border-radius:50%}
.nav-logo span{color:var(--accent)}
.nav-links{display:flex;list-style:none;gap:4px;align-items:center}
.nav-links a{padding:6px 12px;border-radius:999px;font-size:.82rem;font-weight:500;color:var(--text-secondary)}
.nav-links a:hover{color:var(--text-primary);background:var(--bg-card)}
.nav-links a.active{color:var(--accent);background:var(--accent-soft);border:1px solid var(--border-accent)}
.nav-toggle{display:none;background:none;border:none;color:var(--text-primary);font-size:1.5rem;cursor:pointer}
.nav-spacer{height:var(--nav-height)}
@media(max-width:768px){.nav-links{display:none;position:absolute;top:var(--nav-height);left:0;right:0;background:var(--bg-primary);border-bottom:1px solid var(--border);flex-direction:column;padding:16px 20px}.nav-links.open{display:flex}.nav-toggle{display:block}}
.hero{padding:40px 0 20px;text-align:center}
.hero h1{font-family:var(--font-display);font-size:clamp(1.6rem,3.5vw,2.4rem);margin-bottom:10px}
.hero h1 span{color:var(--accent)}
.hero p{color:var(--text-secondary);max-width:640px;margin:0 auto;font-size:.95rem}
.back{display:inline-block;margin-bottom:20px;font-size:.85rem;color:var(--text-secondary)}
.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:24px;margin-bottom:20px}
textarea,input[type=text],input[type=file]{width:100%;background:rgba(15,7,32,.6);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius-sm);padding:14px;font-family:var(--font-sans);font-size:.95rem;resize:vertical}
textarea{min-height:200px}
textarea:focus,input:focus{outline:none;border-color:var(--accent)}
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:var(--radius-sm);border:1px solid var(--border-accent);background:var(--accent-soft);color:var(--accent);font-weight:600;font-size:.9rem;cursor:pointer;font-family:var(--font-sans);transition:all .2s}
.btn:hover{background:var(--accent);color:#fff}
.btn.ghost{background:transparent;border-color:var(--border);color:var(--text-secondary)}
.btn-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px}
.stat{background:rgba(15,7,32,.5);border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px;text-align:center}
.stat-value{font-family:var(--font-display);font-size:1.6rem;color:var(--accent);font-weight:700}
.stat-label{font-size:.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-top:4px}
.result-box{padding:16px;border-radius:var(--radius-sm);margin-top:14px;border:1px solid var(--border)}
.meter{height:14px;background:rgba(15,7,32,.6);border-radius:999px;overflow:hidden;margin:12px 0}
.meter-fill{height:100%;transition:width .5s;background:linear-gradient(90deg,var(--good),var(--warn) 50%,var(--bad))}
.tag-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.tag{padding:3px 10px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-size:.75rem}
.tag.warn{background:rgba(251,191,36,.15);color:var(--warn)}
.tag.bad{background:rgba(248,113,113,.15);color:var(--bad)}
.info{font-size:.82rem;color:var(--text-muted);margin-top:10px}
.footer{background:var(--bg-secondary);border-top:1px solid var(--border);padding:30px 0;margin-top:40px;text-align:center;font-size:.78rem;color:var(--text-muted)}
mark.hl{background:rgba(255,45,149,.25);color:var(--text-primary);padding:0 2px;border-radius:3px;cursor:help;border-bottom:1px dashed var(--accent-neon)}