*{box-sizing:border-box;margin:0;padding:0;font-family:Arial,sans-serif;}
:root{--bg:#f9f9f9;--card:#ffffff;--text:#333;--accent:#e01616;--accent2:#ff9800;--muted:#575757;}
html,body{height:100%;}
body{background:var(--bg);color:var(--text);line-height:1.6;font-size:14px;}
.container{width:min(1100px,calc(100% - 32px));margin:0 auto;padding:24px 0;}
.topbar{background:var(--accent);color:#fff;position:sticky;top:0;z-index:100;box-shadow:0 6px 20px rgba(0,0,0,.12);}
.topbar .container{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.topbar h1{font-size:1.35rem;letter-spacing:1px;}
.btn{display:inline-block;background:var(--accent2);color:#fff;padding:12px 22px;border-radius:999px;font-weight:700;text-decoration:none;transition:all .25s ease;}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(255,152,0,.25);}
.btn-secondary{background:#fff;color:var(--accent2);border:1px solid var(--accent2);}
.btn-secondary:hover{background:#fffbf2;}
.curriculum-form{background:var(--card);border-radius:14px;padding:20px;margin:24px 0;box-shadow:0 8px 24px rgba(0,0,0,.08);}
.curriculum-form h3{color:var(--accent);margin-bottom:10px;margin-top:20px;}
.form-group{margin-bottom:15px;}
.form-group label{display:block;margin-bottom:5px;font-weight:bold;}
.form-group input, .form-group select, .form-group textarea{width:100%;padding:10px;border:1px solid #d1d5db;border-radius:8px;font-size:14px;}
.form-group textarea{resize:vertical;}
.item-actions{display:flex;gap:10px;align-items:flex-start;margin-top:10px;}
.remove-btn{background:#c0392b;color:#fff;border:none;padding:8px 12px;border-radius:4px;cursor:pointer;font-size:12px;}
.remove-btn:hover{background:#a93226;}
.add-btn{margin-top:15px;}
.actions{margin-top:30px;text-align:center;}
.curriculum-preview{background:var(--card);border-radius:14px;padding:20px;margin:24px 0;box-shadow:0 8px 24px rgba(0,0,0,.08);}
.preview-actions{margin-top:30px;text-align:center;display:flex;gap:15px;justify-content:center;flex-wrap:wrap;}
#curriculum-content{font-family:Arial,sans-serif;font-size:14px;line-height:1.5;}
#curriculum-content h4{margin-top:20px;margin-bottom:10px;text-transform:uppercase;font-weight:bold;}
#curriculum-content p{margin-bottom:10px;}
footer{margin-top:28px;padding:16px 0;background:var(--accent);color:#fff;text-align:center;}
.main-nav{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;}
.main-nav a{display:inline-block;background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.2);padding:8px 14px;border-radius:8px;transition:all .25s ease;font-size:14px;text-decoration:none;}
.main-nav a:hover{background:rgba(255,255,255,.2);}
.main-nav a.active{background:#fff;color:var(--accent);border-color:#fff;}
.tools-nav{display:flex;justify-content:center;align-items:center;gap:16px;flex-wrap:wrap;margin:20px auto 16px;padding:8px 0;width:100%;max-width:1000px;}
.nav-btn{display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.2);padding:10px 18px;border-radius:8px;cursor:pointer;transition:all .25s ease;font-size:14px;text-decoration:none;min-width:200px;text-align:center;}
.nav-btn:hover{background:rgba(255,255,255,.2);}
.nav-btn.active{background:#fff;color:var(--accent);border-color:#fff;}
.tool-section{display:none;padding:24px 0;}
.tool-section.active{display:block;}
.tool-section h2{color:var(--accent);margin-bottom:20px;text-align:center;}
.tool-content{background:var(--card);border-radius:14px;padding:24px;margin:24px 0;box-shadow:0 8px 24px rgba(0,0,0,.06);}
.checkbox-group{display:flex;flex-direction:column;gap:12px;margin:15px 0;}
.checkbox-group label{display:flex;align-items:center;gap:10px;cursor:pointer;}
.result{margin-top:20px;}
.result input{background:#f8f9fa;border:1px solid #dee2e6;padding:12px;border-radius:6px;width:100%;font-family:monospace;font-size:14px;}
.password-strength{margin-top:15px;}
.strength-bar{height:10px;background:#e9ecef;border-radius:999px;overflow:hidden;}
#strength-indicator{height:100%;width:0;transition:width .3s ease;border-radius:999px;}
.image-preview{display:flex;gap:20px;margin-top:20px;flex-wrap:wrap;}
.preview-original,.preview-compressed{flex:1;min-width:220px;}
.preview-original h4,.preview-compressed h4{color:var(--accent);margin-bottom:10px;}
#original-info,#compressed-info{font-size:13px;color:var(--muted);margin-top:10px;}
.calculator-tabs{display:flex;margin-bottom:20px;border-bottom:1px solid #d1d5db;flex-wrap:wrap;}
.calc-tab{background:none;border:none;padding:12px 18px;cursor:pointer;border-bottom:2px solid transparent;color:var(--text);font-weight:600;}
.calc-tab.active{border-bottom-color:var(--accent);color:var(--accent);}
.calc-content{display:none;}
.calc-content.active{display:block;}
#simple-result,#compound-result{margin-top:15px;padding:18px;background:#f8f9fa;border-radius:10px;}
#simple-result p,#compound-result p{margin:8px 0;}
@media (max-width:700px){.topbar .container{justify-content:center;}
.main-nav{justify-content:center;}
.checkbox-group{gap:12px;}
.image-preview{flex-direction:column;}
.calculator-tabs{flex-wrap:wrap;}
.container{padding:16px 0;}}
