:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0d0d10;--surface:#17171c;--surface-2:#1f1f26;--text:#f2f2f5;--text-dim:#9a9aa6;--accent:#4f8cff;--accent-press:#3a6fd8;--danger:#ff4650;--radius:14px;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{background:var(--bg);height:100%;color:var(--text);margin:0}.app{height:100%;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);flex-direction:column;width:100%;max-width:640px;margin:0 auto;display:flex}button{font:inherit;cursor:pointer;color:inherit;background:0 0;border:none}.upload-screen{flex-direction:column;flex:1;justify-content:center;gap:28px;padding:24px;display:flex}.brand{text-align:center}.brand h1{letter-spacing:-.5px;background:linear-gradient(120deg,#6ea8ff,#b48cff);color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-size:34px}.brand p{color:var(--text-dim);margin:6px 0 0}.drop-zone{border-radius:var(--radius);background:var(--surface);color:var(--accent);border:2px dashed #3a3a46;flex-direction:column;align-items:center;gap:10px;padding:44px 20px;transition:border-color .15s,background .15s;display:flex}.drop-zone:active{background:var(--surface-2);border-color:var(--accent)}.drop-title{color:var(--text);font-size:18px;font-weight:600}.drop-sub{color:var(--text-dim);font-size:14px}.how-it-works{color:var(--text-dim);margin:0;padding:0 0 0 22px;font-size:14px;line-height:1.9}.detecting{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:18px;padding:20px;display:flex}.scan-frame{border-radius:var(--radius);max-width:100%;position:relative;overflow:hidden}.scan-frame img{max-width:100%;max-height:70vh;display:block}.scan-shimmer{background:linear-gradient(110deg,#0000 30%,#6ea8ff59 50%,#0000 70%);animation:1.6s infinite shimmer;position:absolute;inset:0}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.status-text{color:var(--text-dim);margin:0}.editor-screen,.result-screen{flex-direction:column;flex:1;min-height:0;display:flex}.editor-header{align-items:center;gap:12px;padding:10px 14px;display:flex}.editor-title{color:var(--text-dim);flex:1;min-width:0;font-size:15px}.editor-toolbar{flex-wrap:wrap;align-items:center;gap:12px;padding:0 14px 10px;display:flex}.tool-group{background:var(--surface-2);border-radius:12px;gap:6px;padding:4px;display:flex}.tool-btn{color:var(--text-dim);border-radius:9px;padding:8px 14px;font-size:14px;transition:background .15s,color .15s}.tool-btn.active{background:var(--surface);color:var(--text);box-shadow:inset 0 0 0 1px #3a3a46}.tool-btn:disabled{opacity:.45}.brush-size{min-width:140px;color:var(--text-dim);flex:1;align-items:center;gap:10px;font-size:13px;display:flex}.brush-size input[type=range]{accent-color:var(--accent);flex:1}.canvas-wrap canvas{border-radius:10px;max-width:100%;max-height:100%}.canvas-wrap canvas.canvas-select{touch-action:manipulation;cursor:default}.canvas-wrap canvas.canvas-draw{touch-action:none;cursor:crosshair}.overlay-loading{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);color:var(--text-dim);background:#0d0d10b8;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:14px;display:flex;position:absolute;inset:0}.spinner{border:3px solid #33333e;border-top-color:var(--accent);border-radius:50%;width:34px;height:34px;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.action-bar{align-items:center;gap:14px;padding:14px;display:flex}.legend{color:var(--text-dim);flex-direction:column;gap:4px;font-size:12px;display:flex}.legend-item:before{content:"";border-radius:3px;width:10px;height:10px;margin-right:6px;display:inline-block}.legend-keep:before{background:#50c8ffcc}.legend-remove:before{background:var(--danger)}.legend-hint{color:var(--text-dim);opacity:.85;margin-top:2px;font-size:11px}.canvas-wrap{flex:1;justify-content:center;align-items:center;min-height:0;padding:0 10px;display:flex;position:relative}.primary-btn{border-radius:var(--radius);background:var(--accent);color:#fff;flex:1;padding:15px 18px;font-size:16px;font-weight:600;transition:background .15s,opacity .15s}.primary-btn:active{background:var(--accent-press)}.primary-btn:disabled{opacity:.45;cursor:default}.ghost-btn{background:var(--surface-2);color:var(--text);border-radius:10px;padding:10px 14px;font-size:14px}.ghost-btn:disabled{opacity:.45}.error-banner{color:#ff9aa0;background:#ff465024;border:1px solid #ff465066;border-radius:10px;margin:0 14px 8px;padding:10px 14px;font-size:14px}.compare-wrap{touch-action:none;-webkit-user-select:none;user-select:none;border-radius:10px;align-self:center;width:100%;max-width:calc(100% - 20px);max-height:72vh;margin:10px auto;position:relative;overflow:hidden}.compare-after{object-fit:contain;width:100%;height:100%;display:block}.compare-before-clip{position:absolute;inset:0 auto 0 0;overflow:hidden}.compare-before-clip img{max-width:none;height:100%;display:block}.compare-handle{background:#fff;width:2px;position:absolute;top:0;bottom:0;transform:translate(-1px);box-shadow:0 0 8px #0009}.compare-handle-knob{color:#111;background:#fff;border-radius:50%;justify-content:center;align-items:center;width:38px;height:38px;font-size:17px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 2px 10px #00000080}.compare-label{color:#fff;pointer-events:none;background:#0000008c;border-radius:999px;padding:4px 10px;font-size:12px;transition:opacity .2s;position:absolute;top:10px}.label-before{left:10px}.label-after{right:10px}.result-actions .ghost-btn{border-radius:var(--radius);padding:15px 18px;font-size:16px}
