:root{--bg:#f0f0f0;--fg:#222;--panel:#fff;--accent:#00c896;--accent-fg:#000}[data-theme=dark]{--bg:#1e1e2f;--fg:#f0f0f0;--panel:#2b2b3c;--accent:#00f5d4;--accent-fg:#000}*{box-sizing:border-box}body{margin:0;padding:0;font-family:Segoe UI,sans-serif;background:var(--bg);color:var(--fg);flex-direction:column;min-height:100vh}body,header{display:flex}header{justify-content:space-between;align-items:center;padding:.5em 1em;background:var(--panel);box-shadow:0 2px 5px rgba(0,0,0,.2)}h1{margin:0;font-size:1.4em}button{background:var(--accent);color:var(--accent-fg);border:none;padding:.5em .8em;border-radius:6px;font-size:1em;cursor:pointer;transition:transform .1s}button:active{transform:scale(.95)}main#app{flex:1;padding:1em;max-width:600px;margin:auto}.mode-tabs{display:flex;margin-bottom:1em}.mode-tabs button{flex:1;background:var(--panel);color:var(--fg)}.mode-tabs button.active{background:var(--accent);color:var(--accent-fg)}.converter{background:var(--panel);padding:1em;border-radius:10px;box-shadow:0 2px 10px rgba(0,0,0,.1);position:relative}textarea{width:100%;padding:.8em;margin-bottom:.8em;border:1px solid #ccc;border-radius:6px;resize:vertical;font-size:1em;background:var(--bg);color:var(--fg)}.controls{display:flex;flex-wrap:wrap;gap:.5em;margin-bottom:.8em}.settings{margin:1em 0;background:var(--panel);padding:1em;border-radius:8px}.settings label{display:block;margin-bottom:.5em}.settings input[type=range]{width:100%}.lists{display:grid;grid-template-columns:1fr 1fr;gap:1em}.lists ul{background:var(--panel);padding:.8em;border-radius:8px;max-height:150px;overflow-y:auto}.lists li{display:flex;justify-content:space-between;margin-bottom:.4em}.lists li button{background:transparent;border:none;font-size:1.1em;cursor:pointer}@media (max-width:500px){.lists{grid-template-columns:1fr}}