:root{font-family:Arial,Helvetica,sans-serif;color:#1d2922;background:#f5f2ec;font-synthesis:none}
*{box-sizing:border-box}
body{margin:0;min-width:320px}
button,input{font:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed}
.page-shell{max-width:1380px;margin:0 auto;padding:0 50px 36px}
.site-header{height:91px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d8d9cf}
.brand{display:inline-flex;align-items:center;gap:12px;color:#1e3227;text-decoration:none;font-size:23px;font-weight:700;letter-spacing:-1.6px}
.brand-light{font-weight:400}.brand-dot{color:#d17d4d}
.brand-icon{width:30px;height:30px;border:2px solid #294a37;border-radius:9px;transform:rotate(-10deg);display:grid;place-items:center}
.brand-icon span{width:13px;height:13px;border:2px solid #294a37;border-radius:4px;transform:rotate(25deg)}
.header-meta,.eyebrow,.workspace-topline,.section-label,.empty-kicker,.canvas-footer,.bottom-note{font-size:11px;font-weight:700;letter-spacing:1.6px}
.header-meta{display:flex;align-items:center;gap:10px;color:#6b756b}.online-dot{width:7px;height:7px;background:#79a06a;border-radius:50%;box-shadow:0 0 0 4px #e4eadd}
.intro{text-align:center;padding:69px 10px 51px}.eyebrow{display:flex;align-items:center;justify-content:center;gap:12px;color:#bb7650}.eyebrow-line{width:27px;height:1px;background:#bb7650}
h1,h2,p{margin-top:0}.intro h1{font-family:'Playfair Display',Georgia,serif;font-weight:500;letter-spacing:-2.6px;line-height:1.14;font-size:clamp(42px,5.1vw,73px);margin:20px 0 20px}.intro h1 em{color:#bf7652;font-weight:500}.intro p{max-width:590px;margin:0 auto;color:#6d766f;font-size:15px;line-height:1.75}
.workspace{border:1px solid #d7d9cf;background:#fbfaf7;box-shadow:0 18px 48px #33422d0b}.workspace-topline{height:49px;border-bottom:1px solid #e0e1d9;display:flex;align-items:center;justify-content:space-between;padding:0 27px;color:#435348}.step-number{color:#b47750;margin-right:8px}.topline-right{color:#9a9f94}.tiny-sparkle{color:#b57954;margin-right:5px;font-size:15px}
.workspace-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;min-height:526px}.canvas-column{padding:23px;border-right:1px solid #e0e1d9;min-width:0}.dropzone{height:447px;border:1px dashed #b9c5b4;background:#f2f5ed;position:relative;overflow:hidden;display:grid;place-items:center;outline:none;transition:border-color .2s,background .2s}.dropzone.drag-over{border-color:#cf8259;background:#f6eee5;box-shadow:inset 0 0 0 2px #cf825955}.dropzone:focus-visible{outline:3px solid #cf8259;outline-offset:2px}
.empty-state{text-align:center;padding:20px;max-width:420px}.upload-art{width:122px;height:115px;margin:0 auto 24px;position:relative;overflow:visible;transform:rotate(-8deg);border:4px solid #fdfdf8;border-radius:12px;background:#dae8de;box-shadow:0 12px 25px #33543c1d}.art-grid{position:absolute;inset:0;border-radius:8px;background-image:linear-gradient(#ffffff66 1px,transparent 1px),linear-gradient(90deg,#ffffff66 1px,transparent 1px);background-size:18px 18px}.art-sun{position:absolute;top:21px;right:23px;width:24px;height:24px;background:#edaf6d;border-radius:50%}.art-hill{position:absolute;bottom:0;border-radius:60% 60% 8px 8px}.art-hill-back{height:56px;width:100px;left:12px;background:#9cbea3;transform:rotate(-13deg)}.art-hill-front{height:55px;width:91px;left:-5px;background:#5d8b70;transform:rotate(17deg)}.art-cursor{position:absolute;right:-31px;bottom:-29px;color:#c3764d;font-size:56px;font-family:Arial;text-shadow:2px 2px #fff;transform:rotate(18deg)}
.empty-kicker{color:#bd7854;margin-bottom:12px}.empty-state h2{font-family:'Playfair Display',Georgia,serif;font-size:32px;letter-spacing:-.7px;line-height:1.22;font-weight:500;margin:0 0 11px}.empty-state p{font-size:13px;color:#859084;margin-bottom:23px}.primary-button,.download-button{border:0;background:#2b4a37;color:white;border-radius:5px;display:flex;align-items:center;justify-content:space-between;gap:22px;font-size:13px;font-weight:700;padding:14px 19px;transition:background .2s,transform .2s}.primary-button{margin:auto;min-width:186px}.primary-button:hover,.download-button:not(:disabled):hover{background:#3d674c;transform:translateY(-1px)}.paste-hint{font-size:12px;color:#9a9f96;margin-top:17px}
.canvas-footer{display:flex;justify-content:space-between;gap:10px;padding:19px 0 0;color:#a0a69c}.canvas-footer #statusText{color:#608268;text-align:right}
.controls{padding:34px 29px 27px;display:flex;flex-direction:column}.control-index{display:block;color:#c37c56;font-size:12px;font-weight:700;letter-spacing:1px;margin-bottom:12px}.control-header h2{font-family:'Playfair Display',Georgia,serif;font-size:29px;font-weight:500;letter-spacing:-.7px;margin:0 0 9px}.control-header p,.compare-section p{font-size:13px;line-height:1.65;color:#899188}.control-header p{margin-bottom:29px}.control-section{border-top:1px solid #e0e3da;padding-top:21px;padding-bottom:24px}.section-label{color:#415248;display:flex;justify-content:space-between;margin-bottom:19px}.section-label span{color:#b3b8ad}.swatches{display:flex;gap:12px}.swatch{width:47px;height:47px;border:1px solid #d8ddd2;border-radius:6px;display:grid;place-items:center;position:relative}.swatch.active{outline:2px solid #365b40;outline-offset:3px}.swatch-check{display:none;color:#3c5542;font-size:17px;font-weight:700}.swatch.active .swatch-check{display:block}.swatch-transparent{background-color:#fff;background-image:linear-gradient(45deg,#e1e5df 25%,transparent 25%),linear-gradient(-45deg,#e1e5df 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e1e5df 75%),linear-gradient(-45deg,transparent 75%,#e1e5df 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0}.swatch-white{background:#fff}.swatch-dark{background:#202a25}.swatch-dark .swatch-check{color:#fff}.swatch-peach{background:#ecd8ca}.selected-label{font-size:12px;color:#8b9389;margin-top:17px}.compare-section{padding-bottom:9px}.compare-section p{margin-top:-6px}.control-bottom{margin-top:auto}.download-button{width:100%;padding:16px 19px}.download-button:disabled{opacity:.42}.text-button{display:block;background:transparent;border:0;color:#3c6248;font-size:13px;font-weight:700;margin:20px auto 23px}.text-button:disabled{opacity:.4}.privacy-note{border-top:1px solid #e0e3da;padding-top:16px;display:flex;gap:9px;font-size:11px;color:#9ba499;line-height:1.45}.privacy-note span{font-size:14px;color:#bd7f57}
.bottom-note{display:flex;justify-content:space-between;gap:20px;color:#a5aaa0;padding-top:23px}
.result-state{width:100%;height:100%}.preview-surface{width:100%;height:100%;position:relative;overflow:hidden;display:grid;place-items:center}.checker{background-color:#fff;background-image:linear-gradient(45deg,#e7ece5 25%,transparent 25%),linear-gradient(-45deg,#e7ece5 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e7ece5 75%),linear-gradient(-45deg,transparent 75%,#e7ece5 75%);background-size:24px 24px;background-position:0 0,0 12px,12px -12px,-12px 0}.preview-surface>img,.original-layer img{max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain}.original-layer{position:absolute;inset:0;clip-path:inset(0 50% 0 0)}.compare-line{position:absolute;z-index:2;top:0;bottom:0;left:50%;width:2px;background:#fff;box-shadow:0 0 7px #1d292255}.compare-handle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);height:38px;width:38px;border-radius:50%;display:grid;place-items:center;background:#fff;box-shadow:0 2px 12px #1d292244;color:#274b34;font-size:20px}.compare-range{position:absolute;z-index:3;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize}.image-label{position:absolute;z-index:2;top:16px;padding:7px 10px;background:#fffdf1d9;border-radius:3px;color:#33483a;font-size:10px;font-weight:700;letter-spacing:1.3px}.label-original{left:15px}.label-result{right:15px}
.loading-state{text-align:center}.loading-state strong{font-family:'Playfair Display',Georgia,serif;font-size:26px;font-weight:500}.loading-state p{margin:12px 0 0;font-size:13px;color:#8e998b}.loader-orbit{height:58px;width:58px;border:2px solid #d5dfd2;border-top-color:#bd7954;border-radius:50%;margin:0 auto 28px;animation:spin 1s linear infinite}.loader-orbit span{display:block;height:7px;width:7px;border-radius:50%;background:#bd7954;position:absolute;top:2px;left:9px}@keyframes spin{to{transform:rotate(360deg)}}
[hidden]{display:none!important}
@media(max-width:850px){.page-shell{padding:0 22px 30px}.workspace-grid{grid-template-columns:1fr}.canvas-column{border-right:0;border-bottom:1px solid #e0e1d9}.controls{min-height:380px}.control-bottom{padding-top:16px}.intro{padding-top:55px}.dropzone{height:390px}}
@media(max-width:520px){.page-shell{padding:0 14px 25px}.site-header{height:73px}.brand{font-size:20px}.header-meta{font-size:9px;letter-spacing:.7px}.intro{padding:50px 3px 38px}.intro h1{letter-spacing:-1.5px}.intro p{font-size:14px}.workspace-topline{padding:0 15px;font-size:9px}.topline-right{font-size:9px}.canvas-column{padding:13px}.dropzone{height:360px}.empty-state h2{font-size:27px}.upload-art{transform:rotate(-8deg) scale(.85);margin-bottom:7px}.canvas-footer{font-size:9px}.controls{padding:27px 20px}.bottom-note{font-size:9px}}
