:root{--bg-color: #f5f5f5;--text-color: #222;--card-bg: #fff;--button-bg: #007bff;--button-text: #fff;--icon-color: #000}.dark{--bg-color: #121212;--text-color: #eee;--card-bg: #1e1e1e;--button-bg: #333;--button-text: #eee;--icon-color: #fff}html,body{height:100%;margin:0;background:var(--bg-color);color:var(--text-color);font-family:sans-serif}.app{max-width:320px;margin:auto;padding:1rem}header{display:flex;align-items:center;gap:.5rem}h1{flex:1 1 auto;min-width:0;margin:0;font-size:1.4rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.toggle-btn{margin-left:auto;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;background:none;border:none;line-height:1;cursor:pointer}.toggle-icon{font-size:1rem;color:var(--icon-color)}label{display:block;margin-top:1rem}input,select,button{font-size:1rem;padding:.4rem;margin-top:.3rem;width:100%;box-sizing:border-box}.checkbox-inline{display:inline-flex;align-items:center;gap:.4rem;margin-top:1rem}.checkbox-inline input{appearance:checkbox;margin:0;flex-shrink:0;width:16px;height:16px;transform:scale(1.1)}.button-row{display:flex;gap:.5rem;margin-top:1rem}.reset-btn{background-color:#e0e0e0;color:#000;border:none;padding:.5rem 1rem;border-radius:4px;cursor:pointer}.calc-btn{background-color:#007bff;color:#fff;border:none;padding:.5rem 1rem;border-radius:4px;cursor:pointer}.reset-btn:hover{background-color:#d5d5d5}.calc-btn:hover{background-color:#0056b3}.result{background:var(--card-bg);padding:1rem;margin-top:1rem;border-radius:6px;text-align:center}