:root,[data-theme=light]{--bg: #ffffff;--bg-card: #f8f8fb;--bg-card-hover: #eeeef3;--text: #1a1a2e;--text-muted: #5c5c7a;--accent: #6c5ce7;--accent-glow: rgba(108, 92, 231, .15);--accent-secondary: #00a89e;--border: #dddde5;--navbar-bg: rgba(255, 255, 255, .92);--radius: 14px;--font-body: "DM Sans", sans-serif;--font-mono: "Space Mono", monospace;--shadow-sm: 0 1px 3px rgba(0,0,0,.06);--shadow-md: 0 4px 12px rgba(0,0,0,.08);--shadow-lg: 0 8px 30px rgba(0,0,0,.1)}[data-theme=dark]{--bg: #0a0a0f;--bg-card: #13131d;--bg-card-hover: #1c1c2a;--text: #e4e4ef;--text-muted: #8888a0;--accent: #6c5ce7;--accent-glow: rgba(108, 92, 231, .3);--accent-secondary: #00cec9;--border: #252538;--navbar-bg: rgba(10, 10, 15, .92);--shadow-sm: 0 1px 3px rgba(0,0,0,.2);--shadow-md: 0 4px 12px rgba(0,0,0,.3);--shadow-lg: 0 8px 30px rgba(0,0,0,.4)}[data-theme=dark] .calc-input,[data-theme=dark] .text-area,[data-theme=dark] .unit-select,[data-theme=dark] .calc-select,[data-theme=dark] .text-input,[data-theme=dark] .code-input,[data-theme=dark] .sm-input,[data-theme=dark] .small-input,[data-theme=dark] select{color-scheme:dark}[data-theme=light] input[type=date],[data-theme=light] input[type=datetime-local]{color-scheme:light}[data-theme=dark] input[type=date],[data-theme=dark] input[type=datetime-local]{color-scheme:dark}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-body);background:var(--bg);color:var(--text);line-height:1.6;min-height:100vh;display:flex;flex-direction:column;transition:background .3s,color .3s}main{flex:1;width:100%;max-width:1100px;margin:0 auto;padding:0 1.5rem}a{color:var(--accent);text-decoration:none;transition:color .2s}a:hover{color:var(--accent-secondary)}.navbar{display:flex;align-items:center;justify-content:space-between;padding:1rem 2rem;border-bottom:1px solid var(--border);background:var(--navbar-bg);backdrop-filter:blur(12px);position:sticky;top:0;z-index:100;transition:background .3s,border-color .3s}.logo{display:flex;align-items:center;gap:.5rem;font-weight:700;font-size:1.2rem;color:var(--text)}.logo:hover{color:var(--text)}.logo-icon{font-size:1.4rem}.logo-text{font-family:var(--font-mono);letter-spacing:-.5px}.nav-right{display:flex;align-items:center;gap:1.25rem}.nav-links{display:flex;gap:1.5rem}.nav-links a{color:var(--text-muted);font-size:.9rem;font-weight:500}.nav-links a:hover{color:var(--text)}.theme-toggle{width:38px;height:38px;border:1px solid var(--border);border-radius:8px;background:var(--bg-card);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.15rem;transition:all .25s}.theme-toggle:hover{border-color:var(--accent);background:var(--bg-card-hover);transform:scale(1.05)}.footer{margin-top:4rem;padding:3rem 2rem 1.5rem;border-top:1px solid var(--border);background:var(--bg-card);transition:all .3s}.footer-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr;gap:2rem}.footer-brand{display:flex;flex-direction:column;gap:.5rem}.footer-logo{font-family:var(--font-mono);font-weight:700;font-size:1.1rem;color:var(--text)}.footer-tagline{color:var(--text-muted);font-size:.85rem}.footer-col{display:flex;flex-direction:column;gap:.5rem}.footer-col h4{font-size:.8rem;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-bottom:.25rem}.footer-col a{color:var(--text-muted);font-size:.85rem}.footer-col a:hover{color:var(--accent)}.footer-bottom{max-width:1100px;margin:2rem auto 0;padding-top:1.5rem;border-top:1px solid var(--border);text-align:center}.footer-bottom p{color:var(--text-muted);font-size:.8rem}.ad-banner{background:var(--bg-card);border:1px dashed var(--border);border-radius:var(--radius);padding:1rem;text-align:center;color:var(--text-muted);font-size:.8rem;margin:2rem 0;transition:background .3s,border-color .3s}.btn-primary{background:var(--accent);color:#fff;border:none;padding:.7rem 1.5rem;border-radius:8px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s;font-family:var(--font-body)}.btn-primary:hover{opacity:.9;transform:translateY(-1px);box-shadow:var(--shadow-md)}@media (max-width: 640px){.navbar{padding:.8rem 1rem}.nav-links{gap:.75rem}.nav-links a{font-size:.82rem}.footer-inner{grid-template-columns:1fr;text-align:center}.footer-col{align-items:center}}