:root{--accent:#1f6feb;--bg:#f6f7f9;--fg:#1c1f24}
*{box-sizing:border-box}
body{margin:0;font:16px/1.4 system-ui,sans-serif;background:var(--bg);color:var(--fg)}
header,main{max-width:1000px;margin:0 auto;padding:12px 16px}
h1{margin:0 0 4px}
.hint{font-size:12px;color:#667;margin:4px 0}
.error{color:#c62828;min-height:1.2em}
.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:10px 0}
button,.btn,select{font:inherit;padding:8px 14px;border:1px solid #bbc;border-radius:8px;background:#fff;color:inherit;cursor:pointer;text-decoration:none}
button.primary{background:var(--accent);color:#fff;border-color:var(--accent)}
button:disabled{opacity:.5;cursor:not-allowed}
.seg{display:flex}.seg button{border-radius:0}.seg button:first-child{border-radius:8px 0 0 8px}.seg button:last-child{border-radius:0 8px 8px 0}
.seg button.on{background:var(--accent);color:#fff;border-color:var(--accent)}
#stage,#cmp{position:relative;display:inline-block;max-width:100%;line-height:0;touch-action:none;user-select:none}
#photo,#after,#before{max-width:100%;max-height:70vh;display:block}
#overlay{position:absolute;left:0;top:0;width:100%;height:100%;opacity:.5;cursor:crosshair;touch-action:none}
#before{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:fill;clip-path:inset(0 50% 0 0)}
#handle{position:absolute;top:0;bottom:0;left:50%;width:4px;margin-left:-2px;background:#fff;box-shadow:0 0 4px #000;cursor:ew-resize;touch-action:none}
#handle::after{content:"↔";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#fff;border-radius:50%;width:32px;height:32px;line-height:32px;text-align:center;box-shadow:0 0 4px #000}
.spin{display:inline-block;width:14px;height:14px;border:2px solid #bbc;border-top-color:var(--accent);border-radius:50%;animation:s 1s linear infinite;vertical-align:-2px;margin-right:6px}
@keyframes s{to{transform:rotate(360deg)}}

#tabs{margin:10px 0}
#marks{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none}
#wish{font:inherit;padding:8px;border:1px solid #bbc;border-radius:8px;max-width:100%}
[hidden]{display:none !important}
#cmp img,#photo{-webkit-user-drag:none;user-drag:none}#cmp img{pointer-events:none}