@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Noto+Sans+SC:wght@400;500;600;700&display=swap";
:root{--ink:#17231f;--muted:#6e7773;--paper:#f5f5ef;--surface:#fff;--line:#dfe2da;--green:#1d7559;--green-dark:#155b45;--green-pale:#e7f0eb;--lime:#bfdc77}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{color:var(--ink);background:linear-gradient(#1d755909 1px, transparent 1px), linear-gradient(90deg, #1d755909 1px, transparent 1px), var(--paper);background-size:40px 40px;font-family:DM Sans,Noto Sans SC,sans-serif}button,input{font:inherit}button{color:inherit}.shell{flex-direction:column;min-height:100vh;display:flex}.navbar{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#f5f5efdb;border-bottom:1px solid #17231f1a;justify-content:space-between;align-items:center;height:72px;padding:0 max(28px,50vw - 590px);display:flex}.brand{color:var(--ink);letter-spacing:.12em;align-items:center;gap:10px;font-size:21px;font-weight:700;text-decoration:none;display:flex}.brand-mark{color:#fff;background:var(--green);place-items:center;width:36px;height:36px;display:grid;transform:rotate(-3deg)}.brand-en{color:var(--muted);letter-spacing:.18em;margin-left:2px;font-size:9px;font-weight:600}.nav-status{color:var(--muted);align-items:center;gap:9px;font-size:12px;display:flex}.status-dot{background:#4ba77d;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 5px #4ba77d1f}.hero{text-align:center;padding:70px 24px 44px}.eyebrow{color:var(--green);letter-spacing:.14em;align-items:center;gap:7px;margin-bottom:20px;font-size:12px;font-weight:600;display:inline-flex}.hero h1{letter-spacing:-.055em;margin:0;font-size:clamp(38px,5vw,62px);line-height:1.14}.hero h1 em{color:var(--green);font-style:normal;position:relative}.hero h1 em:after{content:"";background:var(--lime);clip-path:polygon(1% 35%,99% 0,100% 75%,0 100%);opacity:.75;height:6px;position:absolute;bottom:-7px;left:0;right:0}.hero p{color:var(--muted);letter-spacing:.02em;margin:22px 0 0;font-size:15px}.workspace{width:min(1120px,100% - 40px);margin:0 auto}.stepper{color:#a3aaa6;justify-content:center;align-items:center;gap:20px;margin-bottom:24px;display:flex}.step{align-items:center;gap:9px;font-size:12px;font-weight:600;display:flex}.step>span{border:1px solid #cbd0ca;border-radius:50%;place-items:center;width:25px;height:25px;font-size:9px;display:grid}.step.active{color:var(--green)}.step.active>span{color:#fff;border-color:var(--green);background:var(--green)}.step.done>span{color:var(--green);background:var(--green-pale);border-color:#a6c5b5}.dropzone{cursor:pointer;outline-offset:-10px;background:#ffffffc7;border:1px solid #cfd4cc;outline:4px solid #0000;flex-direction:column;justify-content:center;align-items:center;min-height:390px;transition:border-color .2s,outline-color .2s,transform .2s;display:flex;box-shadow:0 24px 70px #24342d12}.dropzone:hover,.dropzone.is-dragging{border-color:var(--green);outline-color:#1d75591f;transform:translateY(-2px)}.upload-illustration{width:102px;height:88px;color:var(--green);background:var(--green-pale);place-items:center;margin-bottom:25px;display:grid;position:relative}.scan-corner{border-color:var(--green);width:15px;height:15px;position:absolute}.top-left{border-top:2px solid;border-left:2px solid;top:-7px;left:-7px}.top-right{border-top:2px solid;border-right:2px solid;top:-7px;right:-7px}.bottom-left{border-bottom:2px solid;border-left:2px solid;bottom:-7px;left:-7px}.bottom-right{border-bottom:2px solid;border-right:2px solid;bottom:-7px;right:-7px}.dropzone h2{letter-spacing:-.02em;margin:0;font-size:19px}.dropzone p{color:var(--muted);margin:8px 0 20px;font-size:13px}.primary-button,.measure-button{color:#fff;background:var(--green);cursor:pointer;border:0;justify-content:center;align-items:center;gap:9px;transition:background .2s,transform .2s;display:flex}.primary-button{min-width:148px;padding:12px 20px}.primary-button:hover,.measure-button:hover{background:var(--green-dark);transform:translateY(-1px)}.file-note{color:#9ca39f;margin-top:17px;font-size:10px}.result-layout{border:1px solid var(--line);background:var(--surface);grid-template-columns:1fr;display:grid;box-shadow:0 24px 70px #24342d14}.result-layout.has-results{grid-template-columns:minmax(0,1.55fr) minmax(320px,.8fr)}.preview-panel{min-width:0;padding:22px}.result-layout.has-results .preview-panel{border-right:1px solid var(--line)}.panel-heading{justify-content:space-between;align-items:center;margin-bottom:15px;display:flex}.panel-heading>div{flex-direction:column;gap:3px;min-width:0;display:flex}.panel-heading strong{text-overflow:ellipsis;white-space:nowrap;max-width:600px;font-size:13px;overflow:hidden}.panel-kicker{color:var(--green);letter-spacing:.15em;text-transform:uppercase;font-size:9px;font-weight:700}.icon-button{border:1px solid var(--line);cursor:pointer;background:0 0;place-items:center;width:34px;height:34px;display:grid}.image-stage{background:#e9ebe7;justify-content:center;align-items:center;min-height:360px;display:flex;position:relative;overflow:hidden}.image-stage>img{object-fit:contain;width:100%;max-height:570px;display:block}.measure-button{width:100%;margin-top:15px;padding:14px;font-weight:600}.scanning-overlay{color:#fff;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#11261fb3;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.scanning-overlay strong{margin-top:14px;font-size:15px}.scanning-overlay span{color:#ffffffb3;margin-top:5px;font-size:11px}.scan-line{background:#bde889;height:1px;animation:2.6s ease-in-out infinite scan;position:absolute;left:8%;right:8%;box-shadow:0 0 15px #bde889}@keyframes scan{0%,to{opacity:.4;top:15%}50%{opacity:1;top:85%}}.progress-block{padding:17px 3px 2px}.progress-copy{justify-content:space-between;margin-bottom:10px;font-size:11px;display:flex}.progress-copy span{color:var(--green);align-items:center;gap:7px;font-weight:600;display:flex}.progress-track{background:#e6e9e3;height:3px;overflow:hidden}.progress-track span{background:var(--green);height:100%;transition:width .5s;display:block}.spin{animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.object-box{cursor:pointer;background:#bfdc7714;border:1.5px solid #c4e37ae6;transition:background .2s,border-color .2s;position:absolute}.object-box span{color:var(--ink);background:var(--lime);padding:3px 7px;font-size:9px;font-weight:700;position:absolute;top:-23px;left:-1px}.object-box.selected{z-index:2;background:#bfdc772e;border:2px solid #d2f382;box-shadow:0 0 0 1px #17231f40}.measurements-panel{background:#fbfcf9;padding:26px}.result-heading{justify-content:space-between;gap:10px;margin-bottom:25px;display:flex}.result-heading h2{letter-spacing:-.03em;margin:5px 0 0;font-size:19px}.complete-badge{height:fit-content;color:var(--green);background:var(--green-pale);align-items:center;gap:5px;padding:5px 8px;font-size:9px;font-weight:600;display:flex}.selected-object{border:1px solid var(--line);background:#fff;align-items:center;gap:13px;padding:15px;display:flex}.object-icon{width:45px;height:45px;color:var(--green);background:var(--green-pale);place-items:center;display:grid}.selected-object span{color:var(--muted);font-size:9px}.selected-object h3{text-transform:capitalize;margin:1px 0 0;font-size:16px}.selected-object p{color:var(--muted);margin:3px 0 0;font-size:9px}.dimension-grid{grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px;display:grid}.dimension-card{border-top:2px solid var(--green);background:var(--green-pale);padding:13px 11px}.dimension-card div{color:var(--muted);align-items:center;gap:5px;font-size:9px;display:flex}.dimension-card div span{color:#fff;background:var(--green);place-items:center;width:16px;height:16px;font-size:8px;display:grid}.dimension-card strong{letter-spacing:-.05em;margin-top:11px;font-size:clamp(18px,2vw,24px);display:block}.dimension-card small{color:var(--muted);font-size:8px}.result-note{color:#8b928e;border-left:2px solid #d7dcd4;padding-left:9px;font-size:9px;line-height:1.6}.object-list{border-top:1px solid var(--line);margin-top:24px;padding-top:18px}.list-label{color:var(--muted);letter-spacing:.12em;margin-bottom:8px;font-size:9px;display:block}.object-list button{text-align:left;cursor:pointer;background:0 0;border:0;border-bottom:1px solid #ebede8;grid-template-columns:30px 1fr auto;align-items:center;gap:8px;width:100%;padding:9px;display:grid}.object-list button:hover,.object-list button.active{background:var(--green-pale)}.object-list i{color:var(--green);font-size:9px;font-style:normal}.object-list button span{text-overflow:ellipsis;text-transform:capitalize;white-space:nowrap;font-size:11px;overflow:hidden}.secondary-button{cursor:pointer;background:#fff;border:1px solid #bac1bb;width:100%;margin-top:20px;padding:11px;font-size:11px}.secondary-button:hover{border-color:var(--green);color:var(--green)}.empty-result{color:var(--muted);text-align:center;padding:55px 20px}.empty-result p{font-size:12px}.error-message{color:#8f342b;background:#fff3f1;border:1px solid #e7c2bd;align-items:center;gap:8px;margin-top:12px;padding:11px 14px;font-size:12px;display:flex}.error-message button{cursor:pointer;background:0 0;border:1px solid;margin-left:auto;padding:4px 10px}footer{color:#98a09b;letter-spacing:.12em;justify-content:space-between;align-items:center;width:min(1120px,100% - 40px);margin:auto auto 0;padding:42px 0 25px;font-size:9px;display:flex}footer p{letter-spacing:.04em;margin:0}@media (max-width:800px){.navbar{height:62px;padding:0 20px}.brand-en,.nav-status{display:none}.hero{padding:50px 20px 35px}.hero p{font-size:13px}.workspace{width:min(100% - 24px,600px)}.stepper{gap:8px}.stepper>svg{width:12px}.step{gap:5px;font-size:10px}.dropzone{min-height:350px}.result-layout.has-results{grid-template-columns:1fr}.result-layout.has-results .preview-panel{border-right:0;border-bottom:1px solid var(--line)}.preview-panel{padding:14px}.image-stage{min-height:260px}.measurements-panel{padding:20px}footer{padding-top:30px}footer span{display:none}}