:root{--ink:#17231c;--muted:#6f796f;--paper:#f3f1e9;--card:#fffef9;--line:#d9ddd4;--green:#215c42;--green-dark:#174633;--lime:#ddef69;--danger:#b63e35}*{box-sizing:border-box}html{background:var(--paper);color:var(--ink);font-family:Avenir Next,Segoe UI,sans-serif}body{background:radial-gradient(circle at 8% 15%,#e2e9d7 0,transparent 25rem),radial-gradient(circle at 92% 70%,#e8e1ce 0,transparent 25rem),var(--paper);min-height:100vh;margin:0}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--lime);outline-offset:3px}.app-shell{grid-template-rows:auto auto 1fr auto;min-height:100vh;display:grid}.topbar{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#f3f1e9d1;border-bottom:1px solid #17231c1f;justify-content:space-between;align-items:center;height:74px;padding:0 clamp(20px,5vw,72px);display:flex}.brand{color:var(--ink);align-items:center;gap:11px;text-decoration:none;display:flex}.brand>span{background:var(--green);width:37px;height:37px;color:var(--lime);border-radius:50% 50% 45% 55%;place-items:center;font:italic 600 24px Georgia,serif;display:grid;transform:rotate(-8deg)}.brand div{letter-spacing:.12em;gap:4px;line-height:1;display:grid}.brand b{font-size:14px}.brand small{color:var(--muted);font-size:8px}.secure{letter-spacing:.12em;color:var(--muted);align-items:center;gap:8px;font-size:10px;font-weight:700;display:flex}.secure span{background:#4b9b62;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 4px #dbe9dc}.stepper{grid-template-columns:repeat(4,1fr);width:min(680px,100% - 32px);margin:26px auto 4px;display:grid;position:relative}.stepper:before{content:"";background:var(--line);height:1px;position:absolute;top:16px;left:10%;right:10%}.stepper div{z-index:1;color:#9da49d;justify-items:center;gap:7px;font-size:11px;display:grid}.stepper i{border:1px solid var(--line);background:var(--paper);border-radius:50%;place-items:center;width:32px;height:32px;font-style:normal;font-weight:700;display:grid}.stepper .active{color:var(--green);font-weight:700}.stepper .active i{background:var(--green);border-color:var(--green);color:#fff;box-shadow:0 0 0 5px #dae5dc}.stepper .done i{color:var(--green);background:#dce8dc;border-color:#b7ccb9}.workspace{place-items:center;width:min(940px,100% - 32px);margin:26px auto;display:grid}.stage-card{background:#fffef9eb;border:1px solid #17231c1c;border-radius:24px;width:100%;padding:clamp(24px,4.5vw,52px);box-shadow:0 22px 70px #2d33291a}.upload-stage{text-align:center;max-width:760px}.eyebrow{text-transform:uppercase;letter-spacing:.15em;color:var(--green);margin-bottom:12px;font-size:11px;font-weight:700}.stage-card h1,.stage-card h2{letter-spacing:-.04em;margin:0;line-height:1.05}.stage-card h1{font-size:clamp(38px,7vw,66px)}.stage-card h1 em{color:var(--green);font-family:Georgia,serif;font-weight:600}.stage-card h2{font-size:clamp(28px,5vw,42px)}.stage-card>p,.lead{color:var(--muted);line-height:1.6}.lead{max-width:540px;margin:18px auto 28px}.upload-drop{width:100%;min-height:180px;color:var(--ink);cursor:pointer;background:#f1f5ec;border:1.5px dashed #96a995;border-radius:18px;align-content:center;place-items:center;gap:9px;transition:all .2s;display:grid}.upload-drop:hover{border-color:var(--green);background:#e9f0e3;transform:translateY(-2px)}.upload-icon{background:var(--green);width:48px;height:48px;color:var(--lime);border-radius:50%;place-items:center;font-size:24px;display:grid}.upload-drop strong{font-size:17px}.upload-drop small{color:var(--muted)}.photo-tips{text-align:left;border-top:1px solid var(--line);grid-template-columns:auto 1fr auto 1fr;align-items:center;gap:12px;margin-top:24px;padding-top:20px;display:grid}.photo-tips>span{color:#a3b0a1;font:italic 600 28px Georgia,serif}.photo-tips p{color:var(--muted);margin:0;font-size:12px;line-height:1.45}.photo-tips b{color:var(--ink)}.marker-surface,.review-visual,.comparison{background:#d9ddd4;border-radius:16px;margin-top:24px;line-height:0;position:relative;overflow:hidden}.marker-surface img,.review-visual img,.comparison>img{object-fit:contain;width:100%;max-height:560px}.marker-box{border:3px solid var(--lime);cursor:move;touch-action:none;background:#215c4224;line-height:1;position:absolute;box-shadow:0 0 0 9999px #0d161047}.marker-box span{background:var(--ink);color:#fff;border-radius:999px;padding:6px 9px;font-size:10px;position:absolute;top:8px;left:8px}.marker-box button{background:var(--green);cursor:nwse-resize;touch-action:none;border:4px solid #fff;border-radius:50%;width:28px;height:28px;position:absolute;bottom:-12px;right:-12px}.search{border:1px solid var(--line);border-radius:13px;align-items:center;gap:10px;margin:22px 0;padding:12px 15px;display:flex}.search input{background:0 0;border:0;outline:0;width:100%}.sku-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:grid}.sku-card{text-align:left;border:1px solid var(--line);cursor:pointer;color:var(--ink);background:#fff;border-radius:15px;align-items:center;gap:15px;padding:11px;display:flex;position:relative}.sku-card:hover,.sku-card.selected{border-color:var(--green);box-shadow:0 0 0 2px #d9e7dc}.sku-card img{object-fit:cover;border-radius:10px;width:78px;height:78px}.sku-copy{gap:5px;display:grid}.sku-copy b{font-size:15px}.sku-copy small{color:var(--muted);font-size:11px}.sku-check{background:var(--green);color:#fff;border-radius:50%;place-items:center;width:23px;height:23px;display:none;position:absolute;top:9px;right:9px}.sku-card.selected .sku-check{display:grid}.review-visual i{border:2px solid var(--lime);background:#ddef692e;position:absolute;box-shadow:0 0 0 9999px #17231c2e}.review-sku{border:1px solid var(--line);border-radius:14px;align-items:center;gap:15px;margin-top:16px;padding:14px;display:flex}.review-sku img{object-fit:cover;border-radius:9px;width:62px;height:62px}.review-sku div{gap:4px;display:grid}.review-sku span,.review-sku small{color:var(--muted);font-size:11px}.privacy-note{margin-bottom:0;font-size:12px!important}.privacy-note span{color:var(--green)}.loading-stage,.error-stage{text-align:center;max-width:650px;padding-block:80px}.loader-orbit{border:1px solid #c8d4c7;border-radius:50%;width:112px;height:112px;margin:0 auto 28px;animation:4s linear infinite spin;position:relative}.loader-orbit:before,.loader-orbit:after{content:"";border:1px solid #dfe5dc;border-radius:50%;position:absolute;inset:14px}.loader-orbit:after{background:var(--green);inset:32px}.loader-orbit span{background:var(--lime);border-radius:50%;width:17px;height:17px;position:absolute;top:-8px;left:48px}.loading-stage output{font-variant-numeric:tabular-nums;margin:24px;font-size:30px;font-weight:700;display:block}.loading-stage>small{color:var(--muted)}@keyframes spin{to{transform:rotate(360deg)}}.error-mark{width:70px;height:70px;color:var(--danger);background:#f4ddd9;border-radius:50%;place-items:center;margin:0 auto 24px;font-family:serif;font-size:36px;display:grid}.field-error{font-size:13px;color:var(--danger)!important}.result-stage{max-width:1000px}.eyebrow.success{color:#3b8555}.comparison{aspect-ratio:16/9}.comparison>img,.comparison .before img{object-fit:cover;width:100%;height:100%}.comparison .before{position:absolute;inset:0 auto 0 0;overflow:hidden}.comparison .before img{object-position:left;width:calc(100vw - 32px);max-width:836px}.comparison-line{background:#fff;width:2px;position:absolute;top:0;bottom:0;transform:translate(-1px)}.comparison-line i{width:42px;height:42px;color:var(--green);background:#fff;border-radius:50%;place-items:center;font-style:normal;line-height:1;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 4px 18px #0004}.comparison input{opacity:0;cursor:ew-resize;width:100%;height:100%;position:absolute;inset:0}.comparison>b{color:#fff;text-transform:uppercase;letter-spacing:.12em;background:#17231ccc;border-radius:99px;padding:10px 12px;font-size:10px;line-height:1;position:absolute;top:14px}.before-label{left:14px}.after-label{right:14px}.download{width:max-content;margin:22px auto 0;text-decoration:none;display:flex!important}.actionbar{z-index:5;border-top:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#fffef9e0;justify-content:space-between;gap:14px;padding:16px clamp(20px,5vw,72px);display:flex;position:sticky;bottom:0}.result-actions{justify-content:center}.button{cursor:pointer;border:1px solid #0000;border-radius:999px;justify-content:center;align-items:center;gap:12px;min-height:48px;padding:0 22px;font-weight:700;display:flex}.button.primary{background:var(--green);color:#fff}.button.primary:hover{background:var(--green-dark)}.button.primary span{color:var(--lime);font-size:18px}.button.ghost{border-color:var(--line);color:var(--ink);background:0 0}.button:disabled{opacity:.4;cursor:not-allowed}.visually-hidden{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;position:absolute!important}@media (max-width:640px){.topbar{height:64px}.secure{font-size:0}.secure:after{content:"NỘI BỘ";font-size:9px}.stepper{margin-top:18px}.stepper div span{display:none}.workspace{margin:18px auto}.stage-card{border-radius:18px;padding:24px 18px}.stage-card h1{font-size:38px}.photo-tips{grid-template-columns:auto 1fr}.sku-grid{grid-template-columns:1fr}.actionbar{padding:12px 16px}.button{padding:0 17px}.comparison{aspect-ratio:3/4}.comparison .before img{width:calc(100vw - 68px)}.result-actions{grid-template-columns:1fr 1fr;display:grid}.result-actions .button{font-size:12px}.marker-surface img{max-height:62vh}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}