:root{--bg:#0d0f12;--panel:#16181c;--panel2:#1c1f24;--border:#262a30;--text:#e6e9ee;--dim:#9aa3ad;--accent:#4f8cff;--accent2:#3a6fd8}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}#app{grid-template-rows:52px 1fr 220px;height:100vh;display:grid}#topbar{background:var(--panel);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:0 16px;display:flex}.brand{letter-spacing:.3px;align-items:center;gap:10px;font-weight:600;display:flex}.brand svg{color:var(--accent)}.actions{gap:8px;display:flex}button{background:var(--panel2);color:var(--text);border:1px solid var(--border);cursor:pointer;border-radius:6px;padding:7px 14px;font-size:13px}button:hover{background:#23262c}button:active{transform:translateY(1px)}#btn-export{background:var(--accent2);border-color:var(--accent2)}#btn-export:hover{background:var(--accent)}#stage{background:#0a0b0d;justify-content:center;align-items:center;display:flex;overflow:hidden}#canvas{image-rendering:auto;max-width:100%;max-height:100%}#panel{background:var(--panel);border-top:1px solid var(--border);gap:24px;padding:14px 20px;display:flex}#panel section{flex:1}#panel h3{text-transform:uppercase;letter-spacing:1px;color:var(--dim);margin:0 0 10px;font-size:12px}input[type=range]{width:100%;accent-color:var(--accent)}#brightness-val{color:var(--dim);margin-left:8px;font-size:12px}.crop-row{gap:12px;margin-bottom:8px;display:flex}.crop-row label{color:var(--dim);align-items:center;gap:6px;font-size:12px;display:flex}.crop-row input{background:var(--panel2);border:1px solid var(--border);width:60px;color:var(--text);border-radius:4px;padding:5px 8px;font-size:12px}#btn-crop{margin-top:4px}