:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#edeaf6;background:#14111d;color-scheme:dark}
*{box-sizing:border-box}body{margin:0}a{color:#c9b2fb;text-decoration:none}
header,footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:19px clamp(16px,5vw,60px);border-bottom:1px solid #342d46}
footer{border-top:1px solid #342d46;border-bottom:0;font-size:12px;color:#a49db3;flex-wrap:wrap}
header span{font-weight:750;color:#edeaf6;font-size:20px}
header .brand{display:flex;align-items:center;gap:9px}header .brand img{width:28px;height:28px;object-fit:contain}
main{max-width:1160px;margin:0 auto;padding:32px 20px 60px}h1{font-size:clamp(29px,5vw,47px);line-height:1.08;margin:9px 0 14px}
main>p{color:#b8b0c5;max-width:800px;line-height:1.6}.eyebrow{font-size:11px;font-weight:700;letter-spacing:2px;color:#a6c5ff}
.panel{background:#201b2d;border:1px solid #45395a;padding:clamp(16px,3vw,26px);border-radius:17px;margin-top:25px}
.file-picker{display:block;font-weight:700;margin-bottom:10px}input[type=file]{max-width:100%;font:inherit;color:#d9d0e7}
#privacy,.controls p,.work-area p{font-size:12px;color:#b1a8c2;line-height:1.5}
.work-area{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:23px 0}
.work-area>div{min-width:0}.work-area h2{font-size:15px;font-weight:700;line-height:1.3}
.image-well{height:300px;max-width:100%;overflow:hidden;border:1px solid #504266;border-radius:12px;background:#181520;display:flex;align-items:center;justify-content:center}
.image-well.checker{background-color:#eee;background-image:linear-gradient(45deg,#ccc 25%,transparent 25%),linear-gradient(-45deg,#ccc 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ccc 75%),linear-gradient(-45deg,transparent 75%,#ccc 75%);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px}
canvas{max-width:100%;max-height:100%;object-fit:contain;display:block}#original{cursor:crosshair}#original:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #c4aaff;outline-offset:3px}
button{border:1px solid #6f5d91;background:#342846;color:#f3edff;padding:12px 16px;border-radius:9px;font:inherit;font-weight:600;cursor:pointer;min-height:44px}
button:disabled{opacity:.45;cursor:not-allowed}#erase{background:#6f4db2;border-color:#9375d1}
.controls{display:grid;gap:11px}.controls label{font-size:14px;font-weight:700}.controls input{width:100%;max-width:430px;accent-color:#bb97ff}.actions{display:flex;flex-wrap:wrap;gap:10px}
#status,#sampleStatus{min-height:20px}#status{color:#c4e6bc;font-weight:650}.footer-note{margin-top:23px}
@media(max-width:680px){.work-area{grid-template-columns:1fr}.image-well{height:260px}header{padding:16px}.panel{padding:15px}}

/* BASE1-C4: owner neon treatment applies only when the local erase action
   is available; keep native disabled, canvas checkerboard and algorithms. */
html:not([data-theme="light"]) #erase:not(:disabled){
 background:linear-gradient(110deg,var(--ds-violet,#925bff),var(--ds-pink,#ee80d2));
 border-color:#b17cff;color:#100b23;box-shadow:0 8px 24px #793ef04a;
}
html:not([data-theme="light"]) #erase:not(:disabled):hover{
 border-color:#d5b2ff;box-shadow:0 10px 28px #793ef077,0 0 18px #4c9cf42c;
}
