@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{font-family:'DM Sans',Arial,sans-serif;color:#202522;background:#e9e8e3;font-synthesis:none}
*{box-sizing:border-box}
body{margin:0;min-width:320px}
button,input{font:inherit}
button{cursor:pointer}
[hidden]{display:none!important}
.site-header{border-bottom:1px solid #cbcfc8;background:#f3f3ee}
.header-inner{max-width:1512px;height:64px;padding:0 42px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:30px}
.brand{color:#243129;text-decoration:none;font-size:27px;font-weight:700;letter-spacing:-1.9px;display:inline-flex;align-items:center;gap:10px;line-height:1}
.brand-period{color:#c7623c}
.brand-symbol{width:27px;height:27px;border:2px solid #c7623c;border-radius:50%;display:block;position:relative;transform:rotate(-20deg)}
.brand-symbol i{display:block;position:absolute;width:16px;height:8px;border:1.5px solid #c7623c;border-radius:50%;left:3px;top:3px}
.brand-symbol i:nth-child(2){top:8px}.brand-symbol i:nth-child(3){top:13px}
.site-header nav{height:100%;display:flex;align-items:center;gap:27px;font-size:13px;color:#8b928c}
.site-header nav a{height:100%;display:flex;align-items:center;color:#28362d;text-decoration:none;border-bottom:2px solid #c7623c;font-weight:700}
.header-label,.overline,.controls-head,.section-index,.fields label,.radius-label,.map-footer,footer{font-family:'IBM Plex Mono',monospace}
.header-label{font-size:10px;letter-spacing:.6px;color:#69746c;white-space:nowrap}.header-label span{color:#b25c3b}
.page{max-width:1512px;margin:auto;padding:0 42px}
.page-heading{display:flex;align-items:end;justify-content:space-between;gap:60px;padding:39px 0 33px}
.overline{margin:0 0 9px;color:#af5c3d;font-size:10px;font-weight:600;letter-spacing:1.1px}
.page-heading h1{font-size:46px;letter-spacing:-2.2px;line-height:1;margin:0;font-weight:700}
.page-heading h1 span{color:#c7623c}
.page-heading>p{max-width:390px;margin:0 0 2px;font-size:14px;line-height:1.5;color:#647068}
.workspace{display:grid;grid-template-columns:minmax(345px,388px) minmax(0,1fr);align-items:stretch;gap:14px}
.controls,.map-panel{border:1px solid #cad0c7;background:#f8f8f3}
.controls{display:flex;flex-direction:column}
.controls-head{height:39px;background:#e4e8df;border-bottom:1px solid #cad0c7;display:flex;align-items:center;justify-content:space-between;padding:0 21px;color:#536057;font-weight:600;font-size:10px;letter-spacing:.8px}
.control-section{padding:20px 21px 21px;border-bottom:1px solid #d8ddd5}
.control-section:last-child{border-bottom:none}
.section-heading{display:flex;align-items:flex-start;gap:13px;margin-bottom:17px}
.section-index{color:#bd6040;font-size:12px;font-weight:600;padding-top:2px}
.section-heading h2{margin:0;font-size:16px;letter-spacing:-.4px;line-height:1.15}
.section-heading p{font-size:12px;line-height:1.35;color:#7a847c;margin:5px 0 0}
.dropzone{min-height:74px;border:1px dashed #aeb8ad;background:#f0f2eb;display:flex;align-items:center;gap:14px;padding:13px 16px;cursor:pointer;transition:background .15s,border-color .15s}
.dropzone:hover,.dropzone.drag{border-color:#bb633f;background:#f9ede5}
.upload-symbol{width:37px;height:37px;flex:none;border:1px solid #ccd5c9;background:#fff;display:grid;place-items:center;color:#bd6040;font-size:22px;line-height:1}
.dropzone strong,.dropzone small{display:block}.dropzone strong{font-size:13px;line-height:1.25}.dropzone small{font-size:11px;margin-top:4px;color:#828b81}
.file-hint,.map-note{font-size:11px;line-height:1.5;color:#8a9389;margin:9px 0 0}.upload-status{font-size:11px;color:#355e48;margin-top:9px;line-height:1.45}
.upload-progress{margin-top:14px}.upload-progress-copy{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:11px;color:#4c5d50}.upload-progress-copy strong{font-family:'IBM Plex Mono',monospace;color:#355e48;font-size:11px}.upload-track{height:7px;margin-top:8px;background:#dce3d8;overflow:hidden}.upload-track>span{display:block;width:0;height:100%;background:#b9603f;transition:width .15s ease}.upload-track.processing>span{width:100%!important;background:repeating-linear-gradient(110deg,#3d674e 0 12px,#6e9977 12px 24px);background-size:48px 100%;animation:analyzing .8s linear infinite}.upload-track.done>span{background:#3d674e}.upload-progress p{margin:7px 0 0;font-family:'IBM Plex Mono',monospace;font-size:10px;color:#819084}@keyframes analyzing{to{background-position:48px 0}}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.fields label,.radius-label{font-size:10px;font-weight:600;color:#5a675e;letter-spacing:.7px}
.fields input,.radius-label input{display:block;width:100%;height:37px;border:1px solid #cbd2c7;border-radius:0;background:#fff;color:#202522;padding:0 10px;margin-top:7px;outline:none;font-family:'IBM Plex Mono',monospace;font-size:13px}
.fields input:focus,.radius-label input:focus{border-color:#b9603f;box-shadow:0 0 0 2px #c7623c1e}
.radius-label{display:block;margin-top:14px}.radius-label span{font-size:9px;font-weight:400;color:#8e978d;margin-left:5px}
.radius-presets{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:8px}
.radius-presets button{height:29px;border:1px solid #d0d7cb;background:#fff;color:#59645b;font-family:'IBM Plex Mono',monospace;font-size:10px}
.radius-presets button:hover{border-color:#b9603f}.radius-presets button.selected{background:#344d3e;border-color:#344d3e;color:#fff}
.final-section{flex:1}.action,.download{height:42px;width:100%;border:0;border-radius:0;background:#bf5e3c;color:#fff;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:space-between;padding:0 15px;transition:background .15s}
.action:hover:not(:disabled){background:#a95031}.action:disabled{background:#c4c8bf;color:#737d74;cursor:not-allowed}.action>span:last-child{font-size:18px;font-weight:400}.download{margin-top:9px;background:#344d3e;justify-content:center}.download:hover{background:#253d2e}.download:disabled{opacity:.65;cursor:wait}
.result{margin-top:11px;padding:11px 13px;background:#e9eee5;border-left:2px solid #426849;color:#445b48;font-size:12px;line-height:1.5}.result strong{font-size:17px}.message{font-size:11px;color:#a84730;margin:9px 0 0;min-height:0}
.map-panel{display:flex;flex-direction:column;min-width:0}.map-header{min-height:72px;padding:16px 23px;display:flex;align-items:center;justify-content:space-between;gap:20px}.map-header .overline{margin-bottom:5px}.map-header h2{font-size:17px;letter-spacing:-.5px;margin:0}.map-hint{font-size:11px;color:#67766a;white-space:nowrap}.map-hint span{color:#b96140;font-size:17px;margin-left:5px}
.map-wrap{position:relative;flex:1;min-height:550px;background:#192522;overflow:hidden;cursor:crosshair}.map-wrap img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;user-select:none;opacity:.92;filter:saturate(.74) contrast(1.06)}
.map-crosshair{position:absolute;z-index:2;width:12px;height:12px;border:2px solid #fff;border-radius:50%;transform:translate(-50%,-50%);background:#b95636;box-shadow:0 0 0 2px #b95636}.map-circle{position:absolute;z-index:1;width:48px;height:48px;border:1.5px solid #fff;outline:1px solid #b95636;background:#c7683b55;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}
.map-footer{height:43px;border-top:1px solid #cad0c7;padding:0 21px;display:flex;align-items:center;justify-content:space-between;gap:15px;background:#f2f4ed;font-size:10px;color:#536057;letter-spacing:.3px}.map-footer span:last-child{color:#344d3e;font-weight:600}.legend-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#bd6040;margin-right:7px}
footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:21px 0 28px;color:#92998f;font-size:10px;letter-spacing:.4px}
@media(max-width:1020px){.workspace{grid-template-columns:340px minmax(0,1fr)}.map-wrap{min-height:500px}.header-label{display:none}}
@media(max-width:760px){.page{padding:0 18px}.header-inner{padding:0 18px}.site-header nav span{display:none}.page-heading{padding:29px 0 24px;display:block}.page-heading h1{font-size:37px}.page-heading>p{margin-top:12px;max-width:540px}.workspace{grid-template-columns:1fr}.map-wrap{min-height:490px}.controls{order:1}.map-panel{order:2}.map-header{min-height:65px}footer{display:none}}
@media(max-width:480px){.site-header nav{font-size:11px}.brand{font-size:24px}.brand-symbol{width:23px;height:23px}.page{padding:0 12px}.map-wrap{min-height:350px}.map-hint{font-size:0}.map-hint span{font-size:18px}.map-footer{padding:0 10px;font-size:9px}.control-section{padding:19px 16px}.page-heading h1{font-size:34px}}