:root{--ink:#14231d;--muted:#68766f;--green:#087447;--bright:#18a66a;--mint:#eaf8f1;--line:#dfe8e3;--soft:#f4f8f6;--orange:#eea32f;--red:#dd5d52}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:#f7faf8;font:15px/1.5 Inter,"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased}.topbar{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100% - 1220px)/2));border-bottom:1px solid var(--line);background:#fff}.brand img{display:block;width:112px}.topbar nav{display:flex;gap:24px;align-items:center}.topbar nav a{color:var(--ink);text-decoration:none}.topbar nav span{padding:7px 11px;border-radius:100px;color:var(--green);background:var(--mint);font-size:11px;font-weight:800}.app-shell{width:min(1220px,calc(100% - 48px));margin:auto;padding:54px 0 90px}.intro{display:flex;justify-content:space-between;align-items:end;gap:40px}.eyebrow{margin:0 0 10px;color:var(--green);font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.12em}.intro h1{margin:0;font-size:clamp(38px,4.4vw,58px);line-height:1.05;letter-spacing:-.045em}.intro>div>p:last-child{max-width:680px;margin:16px 0 0;color:var(--muted);font-size:17px}.privacy{display:flex;align-items:center;gap:10px;min-width:260px;padding:12px 16px;border:1px solid var(--line);border-radius:14px;background:#fff}.privacy i{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;color:var(--green);background:var(--mint);font-style:normal;font-weight:900}.privacy span{display:grid;color:var(--muted);font-size:10px}.privacy b{color:var(--ink);font-size:12px}.mode-panel{display:flex;justify-content:space-between;align-items:center;margin-top:38px;padding:13px 14px 13px 20px;border:1px solid var(--line);border-radius:18px;background:#fff}.mode-panel>div:first-child{display:grid}.mode-panel>div:first-child span{font-weight:750}.mode-panel>div:first-child small{color:var(--muted)}.mode-switch{display:flex;padding:4px;border-radius:14px;background:var(--soft)}.mode-switch button{display:flex;gap:10px;align-items:center;min-width:178px;padding:10px 13px;border:0;border-radius:11px;color:var(--muted);background:transparent;text-align:left;cursor:pointer}.mode-switch button.active{color:var(--ink);background:#fff;box-shadow:0 3px 12px rgba(23,55,42,.09)}.mode-switch button span{display:grid}.mode-switch b{font-size:12px}.mode-switch small{font-size:9px}.mode-switch i{width:26px;height:26px;position:relative;border-radius:8px;background:#e6eee9}.mode-switch button.active i{background:var(--mint)}.cloud-icon:before{content:"";position:absolute;left:6px;top:11px;width:15px;height:7px;border-radius:8px;background:var(--green)}.cloud-icon:after{content:"";position:absolute;left:9px;top:7px;width:8px;height:8px;border-radius:50%;background:var(--green)}.server-icon:before{content:"";position:absolute;inset:6px;border:2px solid var(--green);border-radius:3px;box-shadow:0 5px 0 -2px #fff,0 7px 0 -2px var(--green)}.workspace{display:grid;grid-template-columns:minmax(0,1.43fr) minmax(340px,.7fr);gap:20px;margin-top:20px}.visual-column,.result-panel{min-height:570px;border:1px solid var(--line);border-radius:22px;background:#fff;overflow:hidden}.visual-column{display:grid}.upload{margin:18px;display:grid;place-items:center;align-content:center;min-height:532px;border:1.5px dashed #b9cbc2;border-radius:18px;background:linear-gradient(145deg,#fbfdfc,#f1f8f4);cursor:pointer;transition:.2s}.upload.drag{border-color:var(--bright);background:var(--mint)}.upload-icon{display:grid;place-items:center;width:58px;height:58px;margin-bottom:17px;border-radius:18px;color:var(--green);background:#fff;box-shadow:0 10px 30px rgba(24,75,52,.1);font-size:28px;font-weight:300}.upload>b{font-size:18px}.upload>span{margin:6px 0 20px;color:var(--muted);font-size:12px}.upload button{padding:11px 18px;border:1px solid var(--line);border-radius:11px;color:var(--ink);background:#fff;font-weight:750;cursor:pointer}.photo-card{display:grid;grid-template-rows:auto 1fr;height:100%}.photo-tools{height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid var(--line)}.view-switch{display:flex;padding:3px;border-radius:9px;background:var(--soft)}.view-switch button,.new-photo{padding:7px 10px;border:0;border-radius:7px;background:transparent;color:var(--muted);font-size:11px;font-weight:700;cursor:pointer}.view-switch button.active{background:#fff;color:var(--ink);box-shadow:0 2px 8px rgba(20,50,38,.08)}.new-photo{color:var(--green)}.photo-stage{position:relative;display:grid;place-items:center;min-height:510px;overflow:hidden;background:#17201c}.photo-stage img{display:block;width:100%;height:100%;max-height:680px;object-fit:contain}.photo-stage svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.photo-stage svg.hidden{display:none}.mark{fill:rgba(255,97,76,.11);stroke:#ff6b56;stroke-width:3;vector-effect:non-scaling-stroke}.mark.medium{fill:rgba(239,163,47,.12);stroke:var(--orange)}.mark.low{fill:rgba(24,166,106,.1);stroke:var(--bright)}.mark-label{fill:#fff;stroke:rgba(0,0,0,.18);stroke-width:1;paint-order:stroke;font-size:32px;font-weight:850}.result-panel{position:relative;padding:28px}.empty-result,.loading{height:100%;display:grid;place-items:center;align-content:center;text-align:center}.empty-ring{width:110px;height:110px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at center,#fff 64%,transparent 65%),conic-gradient(#e1eae5 25%,#f1f5f3 0)}.empty-ring span{color:#9eaaa4;font-size:34px}.empty-result h2,.loading h2{margin:22px 0 7px;font-size:20px}.empty-result p,.loading p{max-width:290px;margin:0;color:var(--muted);font-size:12px}.loader{width:74px;height:74px;border:4px solid #e6eeea;border-top-color:var(--green);border-radius:50%;animation:spin .9s linear infinite}.loading-line{width:240px;height:4px;margin-top:25px;border-radius:4px;background:#edf2ef;overflow:hidden}.loading-line i{display:block;width:40%;height:100%;background:var(--bright);animation:load 1.4s ease-in-out infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes load{0%{transform:translateX(-110%)}100%{transform:translateX(360%)}}.result-head{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:20px;padding-bottom:24px;border-bottom:1px solid var(--line)}.score-ring{--score:0;--score-color:var(--orange);width:105px;height:105px;display:grid;place-items:center;align-content:center;border-radius:50%;background:radial-gradient(circle at center,#fff 64%,transparent 65%),conic-gradient(var(--score-color) calc(var(--score)*1%),#edf2ef 0)}.score-ring strong{font-size:38px;line-height:1}.score-ring span{color:var(--muted);font-size:9px}.result-head small{color:var(--muted);font-size:10px}.result-head h2{margin:3px 0 5px;font-size:21px}.result-head p{margin:0;color:var(--muted);font-size:11px}.quality{display:flex;justify-content:space-between;margin:19px 0;padding:11px 13px;border-radius:10px;background:var(--soft);font-size:11px}.quality b{color:var(--green)}.section-title{display:flex;align-items:center;justify-content:space-between}.section-title h3,.limitations h3{margin:0;font-size:14px}.section-title span{display:grid;place-items:center;min-width:23px;height:23px;border-radius:50%;color:var(--green);background:var(--mint);font-size:10px;font-weight:850}.issues-section ol{display:grid;gap:9px;margin:12px 0 0;padding:0;list-style:none}.issues-section li{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;padding:11px;border:1px solid var(--line);border-left:3px solid var(--orange);border-radius:10px}.issues-section li.high{border-left-color:var(--red)}.issues-section li.low{border-left-color:var(--bright)}.issue-index{grid-row:1/3;display:grid;place-items:center;width:25px;height:25px;border-radius:7px;color:#9b6a18;background:#fff2d9;font-size:10px;font-weight:900}.high .issue-index{color:#a63a32;background:#ffe4e1}.low .issue-index{color:var(--green);background:var(--mint)}.issues-section li b{font-size:11px}.issues-section li span:last-child{color:var(--muted);font-size:10px}.limitations{margin-top:15px;padding:12px;border-radius:10px;background:#fff8e9}.limitations p{margin:5px 0 0;color:#866c3d;font-size:10px}.result-note{margin:18px 0 0;color:#88958e;font-size:9px}.error{display:flex;gap:14px;align-items:flex-start;margin-top:35%;padding:20px;border-radius:14px;background:#fff1ef}.error>span{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;color:#fff;background:var(--red);font-weight:900}.error h2{margin:0;font-size:17px}.error p{margin:6px 0 12px;color:#86534f;font-size:11px}.error button{padding:8px 11px;border:0;border-radius:8px;color:#fff;background:var(--red);font-size:10px;font-weight:800}.examples{margin-top:70px}.examples-head{display:flex;justify-content:space-between;align-items:end}.examples-head h2{margin:0;font-size:32px;letter-spacing:-.03em}.examples-head>span{color:var(--muted);font-size:11px}.example-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:25px}.example{padding:0;border:1px solid var(--line);border-radius:15px;overflow:hidden;background:#fff;text-align:left;cursor:pointer}.example img{display:block;width:100%;aspect-ratio:1.55;object-fit:cover}.example div{display:grid;grid-template-columns:1fr auto;gap:2px 8px;padding:11px}.example b{font-size:11px}.example strong{grid-row:1/3;grid-column:2;font-size:22px;line-height:1}.example small{color:var(--muted);font-size:9px}.notice{display:flex;gap:22px;margin-top:40px;padding:20px;border:1px solid var(--line);border-radius:14px;background:#fff}.notice b{white-space:nowrap;font-size:12px}.notice p{margin:0;color:var(--muted);font-size:11px}footer{width:min(1220px,calc(100% - 48px));margin:auto;padding:24px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:var(--muted);font-size:10px}footer a{color:inherit}
@media(max-width:900px){.intro{align-items:flex-start;flex-direction:column}.workspace{grid-template-columns:1fr}.result-panel{min-height:450px}.example-grid{grid-template-columns:1fr 1fr}.privacy{min-width:0}.mode-panel{align-items:flex-start;gap:16px;flex-direction:column}.mode-switch{width:100%}.mode-switch button{flex:1;min-width:0}}
@media(max-width:560px){.app-shell{width:calc(100% - 24px);padding-top:34px}.topbar{padding-inline:12px}.topbar nav a{display:none}.intro h1{font-size:39px}.mode-panel{padding:12px}.mode-panel>div:first-child small{display:none}.mode-switch{display:grid;grid-template-columns:1fr 1fr}.mode-switch button{padding:9px}.mode-switch small{display:none}.visual-column,.result-panel{border-radius:16px}.upload{min-height:410px;margin:10px}.photo-stage{min-height:390px}.result-panel{padding:18px}.result-head{grid-template-columns:90px 1fr}.score-ring{width:88px;height:88px}.score-ring strong{font-size:31px}.example-grid{grid-template-columns:1fr 1fr}.examples-head>span{display:none}.notice{display:block}.notice p{margin-top:7px}footer{width:calc(100% - 24px)}}
html,body{overflow-x:hidden}.intro>*,.workspace>*,.mode-panel>*,.mode-switch,.visual-column,.result-panel{min-width:0}
[hidden]{display:none!important}
.photo-stage{min-height:0;aspect-ratio:4000/2252}.photo-stage img{height:100%;max-height:none;object-fit:contain}
@media(max-width:560px){.topbar{overflow:hidden}.brand img{width:102px}.topbar nav span{white-space:nowrap}.intro h1{overflow-wrap:anywhere}.mode-switch button{min-width:0;overflow:hidden}.mode-switch button span{min-width:0}.mode-switch b{white-space:nowrap}.workspace{display:block}.result-panel{margin-top:12px}.upload{padding-inline:12px;text-align:center}.photo-stage{min-height:0}}
.service-version{display:inline-block;margin-left:5px;padding:2px 5px;border:1px solid #dce5e0;border-radius:6px;color:#7d8a84;font-size:9px;font-weight:700;line-height:1.2;vertical-align:middle}.analyze-another{width:100%;margin-top:18px;padding:12px 15px;border:1px solid #b9d9c9;border-radius:11px;color:#087447;background:#f3fbf7;font:700 13px/1.2 inherit;cursor:pointer}.analyze-another:hover{background:#e8f7ef}.example img{object-fit:contain;background:#17201c}
.demo-link{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:38px;padding:22px 24px;border:1px solid var(--line);border-radius:16px;color:var(--ink);background:#fff;text-decoration:none;box-shadow:0 10px 30px rgba(18,48,36,.04)}.demo-link span{display:grid}.demo-link small{color:var(--green);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}.demo-link b{margin-top:3px;font-size:16px}.demo-link>strong{color:var(--green);font-size:12px;white-space:nowrap}.demo-link:hover{border-color:#a8d8c0;background:#f8fcfa}@media(max-width:560px){.demo-link{align-items:flex-start;flex-direction:column;gap:13px;padding:18px}}
