body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;margin:0;padding:0;background:#f5f5f5}#app{display:flex;flex-direction:column;height:100vh;overflow:hidden}.header{background:#fff;padding:10px 24px;box-shadow:0 2px 8px #0000001a;z-index:10}.header h1{margin:0;font-size:24px;color:#333}.header h1 a{color:inherit;text-decoration:none;cursor:pointer;transition:opacity .2s}.header h1 a:hover{opacity:.7}.header .logo{height:55px;display:block}.content{display:flex;flex:1;overflow:hidden}.main-content{flex:1;display:flex;align-items:center;justify-content:center;padding:20px;overflow:auto;background:#fafafa}.sidebar{width:320px;background:#fff;padding:20px;overflow-y:auto;box-shadow:-2px 0 8px #0000001a}.sidebar h3{color:#555;margin:0 0 12px;font-size:16px;font-weight:600}.upload-area{margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid #e0e0e0}.canvas-container{display:flex;align-items:center;justify-content:center;width:100%;height:100%;position:relative}.canvas-container:before{content:"No Image";position:absolute;color:#ccc;font-size:24px;font-weight:300;pointer-events:none;z-index:0}.canvas-container.has-image:before{display:none}canvas{display:block;max-width:100%;max-height:100%;box-shadow:0 4px 12px #00000026;border-radius:4px}.controls{display:flex;flex-direction:column;gap:24px}.filter-section{display:flex;flex-direction:column;gap:12px}.slider-control{display:flex;flex-direction:column;gap:8px}.slider-control label{display:flex;justify-content:space-between;align-items:center;font-size:14px;color:#666}.slider-control label span{font-weight:600;color:#007bff;min-width:40px;text-align:right}button{padding:10px 20px;border:none;border-radius:4px;background:#007bff;color:#fff;cursor:pointer;font-size:14px;transition:background .2s;width:100%}button:hover:not(:disabled){background:#0056b3}button:disabled{background:#ccc;cursor:not-allowed}input[type=file]{padding:8px;font-size:14px;width:100%;box-sizing:border-box}input[type=range]{width:100%;height:6px;border-radius:3px;background:#e0e0e0;outline:none;-webkit-appearance:none;appearance:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:#007bff;cursor:pointer;transition:background .2s}input[type=range]::-webkit-slider-thumb:hover:not(:disabled){background:#0056b3}input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#007bff;cursor:pointer;border:none;transition:background .2s}input[type=range]::-moz-range-thumb:hover:not(:disabled){background:#0056b3}input[type=range]:disabled{opacity:.5;cursor:not-allowed}