.ocn-demo{--ocn-brand:var(--live-demo-primary,#20b633);font:13px/1.45 Arial,sans-serif;color:var(--ui-demo-text,#242424);background:var(--ui-demo-surface,#fff);border:1px solid var(--ui-demo-line,#ddd);border-radius:12px;overflow:hidden;min-width:0;width:100%;text-align:left}.ocn-demo *{box-sizing:border-box}.ocn-demo [hidden]{display:none!important}.ocn-demo :is(h3,h4,p,strong,span,small,label){font-family:inherit!important;letter-spacing:normal!important;text-wrap:initial!important}.ocn-demo h3{font-size:15px!important;line-height:1.4!important;margin:0!important;color:inherit!important}.ocn-demo h4{font-size:14px!important;margin:0 0 14px!important;color:inherit!important}.ocn-demo p{font-size:12px!important;line-height:1.5!important;margin:10px 0!important;color:inherit!important}.ocn-demo small{font-size:11px!important;color:var(--ui-demo-muted,#777)}.ocn-demo button{font:inherit;min-height:36px;padding:8px 12px;border:1px solid var(--ui-demo-line,#ddd);background:var(--ui-demo-surface,#fff);color:inherit;border-radius:var(--ui-demo-radius,8px);cursor:pointer;max-width:100%;white-space:normal}.ocn-demo button:disabled{opacity:.45;cursor:default}.ocn-demo button.ocn-primary,.ocn-demo button[aria-pressed=true]{background:var(--ocn-brand);border-color:var(--ocn-brand);color:var(--live-demo-ink,#fff)}.ocn-demo :focus-visible{outline:2px solid var(--ocn-brand);outline-offset:2px}.ocn-demo :is(input,textarea){font:inherit;color:inherit;background:var(--ui-demo-bg,#f9f9f9);border:1px solid var(--ui-demo-line,#ddd);border-radius:var(--ui-demo-field-radius,8px);padding:10px;max-width:100%;width:100%;margin-top:5px}.ocn-demo input[type=range]{padding:0;accent-color:var(--ocn-brand)}.ocn-head{display:flex;align-items:center;gap:12px;padding:14px;border-bottom:1px solid var(--ui-demo-line,#ddd);min-height:62px}.ocn-head [data-demo-app-icon]{width:28px;height:28px;background:var(--ocn-brand);color:var(--live-demo-ink,#fff);display:grid;place-items:center;border-radius:6px;flex:none}.ocn-head [data-demo-logo]{margin-left:auto;max-width:115px;font-size:12px}.ocn-head [data-demo-logo] img{max-height:26px;max-width:115px}.ocn-workspace{position:relative;height:490px;background:#a2b89c}.ocn-map{height:100%;width:100%;isolation:isolate;z-index:0}.ocn-map .leaflet-control-attribution{font-size:9px}.ocn-map .leaflet-container{font-family:inherit}.ocn-side{position:absolute;z-index:410;top:12px;bottom:12px;width:220px;padding:16px;background:var(--ui-demo-surface,#fff);border:1px solid var(--ui-demo-line,#ddd);border-radius:12px;overflow:auto;box-shadow:0 3px 16px #0002}.ocn-levels{left:12px;width:195px}.ocn-select{right:12px}.ocn-side p{color:var(--ui-demo-muted,#777)!important}.ocn-side .ocn-row{display:flex;gap:8px;align-items:center;padding:12px 0;border-bottom:1px solid var(--ui-demo-line,#ddd)}.ocn-dot{width:10px;height:10px;border-radius:50%;background:var(--ocn-brand);display:inline-block;flex:none}.ocn-filters,.ocn-buttons{display:flex;gap:6px;flex-wrap:wrap}.ocn-filters button{font-size:11px;min-height:30px;padding:5px 8px}.ocn-boundaries{display:grid;gap:7px;margin:14px 0}.ocn-boundaries button{text-align:left;display:flex;align-items:center;gap:10px}.ocn-boundaries button span{flex:1}.ocn-boundaries small{display:block}.ocn-side .ocn-next{width:100%;margin-top:14px}.ocn-foot{padding:14px 16px;background:var(--ui-demo-surface,#fff);border-top:1px solid var(--ui-demo-line,#ddd)}.ocn-foot .ocn-buttons{margin-top:10px}.ocn-foot .ocn-buttons>button:last-child{flex:1}.ocn-note{display:block;font-size:11px!important;margin-top:5px;color:var(--ui-demo-muted,#777)}.ocn-status{padding:10px 16px;font-size:11px;border-top:1px solid var(--ui-demo-line,#ddd);background:var(--ui-demo-bg,#fafafa)}.ocn-layer{position:absolute;z-index:600;inset:0;background:#0009;display:grid;place-items:center;padding:16px;overflow:auto}.ocn-dialog{width:min(380px,100%);padding:24px;border-radius:14px;background:var(--ui-demo-surface,#fff);color:var(--ui-demo-text,#242424);box-shadow:0 8px 30px #0003}.ocn-dialog h4{font-size:17px!important}.ocn-dialog label{display:block;margin:14px 0}.ocn-dialog .ocn-buttons{justify-content:flex-end;margin-top:20px}.ocn-estimate{padding:16px;border-radius:9px;background:color-mix(in srgb,var(--ocn-brand) 12%,var(--ui-demo-surface,#fff));display:grid;gap:6px;text-align:center}.ocn-dialog progress{width:100%;accent-color:var(--ocn-brand);height:15px}.ocn-editor{left:12px;width:205px}.ocn-editor label{display:block;margin:12px 0;font-size:11px}.ocn-editor label span{float:right}.ocn-editor .ocn-buttons button{flex:1}.ocn-editor .ocn-selected{border-top:1px solid var(--ui-demo-line,#ddd);padding-top:13px;margin-top:15px}.ocn-marker{border-radius:50%;background:var(--ocn-brand);border:2px solid white;box-shadow:0 1px 4px #0008}.ocn-map .leaflet-tooltip{font:11px Arial,sans-serif}.ocn-placement{display:block!important;width:100%!important;max-width:none!important;aspect-ratio:auto!important;height:auto!important;min-height:0!important;padding:0!important;border:0!important;background:none!important;overflow:visible!important}.ocn-demo .ocn-help{color:var(--ui-demo-muted,#777);padding:0 16px 8px}.ocn-levels button{min-height:28px;padding:4px}.ocn-map .leaflet-control-zoom a{color:#222!important}.ocn-editor .ocn-tabs{padding:8px;background:var(--ui-demo-bg,#f1f1f1);border-radius:8px;margin-bottom:12px}.ocn-editor .ocn-tabs span{font-size:11px}.ocn-editor .ocn-tabs b{background:var(--ocn-brand);color:var(--live-demo-ink,#fff);display:inline-block;padding:8px;border-radius:6px;margin-right:9px}
@media(max-width:720px){.ocn-head{padding:10px;gap:7px}.ocn-head h3{font-size:13px!important}.ocn-head [data-demo-logo]{max-width:85px}.ocn-head [data-demo-logo] img{max-width:85px}.ocn-workspace{height:650px}.ocn-levels{display:none}.ocn-select{top:auto;left:10px;right:10px;bottom:10px;width:auto;max-height:300px;padding:13px}.ocn-select h4{margin-bottom:5px!important}.ocn-select p{margin:5px 0!important}.ocn-boundaries{display:flex;margin:8px 0}.ocn-boundaries button{flex:1;font-size:11px;padding:8px}.ocn-boundaries button small{font-size:10px!important}.ocn-side .ocn-next{margin-top:6px}.ocn-editor{top:auto;left:10px;right:10px;bottom:10px;width:auto;height:auto;max-height:280px;padding:12px;display:grid;grid-template-columns:1fr 1fr;gap:5px 14px}.ocn-editor h4,.ocn-editor .ocn-tabs,.ocn-editor .ocn-selected{grid-column:1/-1}.ocn-editor h4{margin-bottom:0!important}.ocn-editor label{margin:4px 0}.ocn-editor .ocn-selected{display:flex;gap:9px;align-items:center;margin-top:3px;padding-top:5px}.ocn-editor .ocn-selected small{flex:1}.ocn-editor .ocn-selected button{font-size:10px;padding:5px;min-height:30px}.ocn-demo[data-ocn-stage=refine] .ocn-workspace{height:700px}.ocn-dialog{padding:19px}.ocn-foot{padding:12px}.ocn-foot .ocn-buttons button{font-size:11px;padding:8px}.ocn-map .leaflet-control-attribution{max-width:190px}.ocn-editor .ocn-tabs{margin-bottom:0;padding:4px}.ocn-editor .ocn-tabs b{padding:4px 9px}}
html .ocn-demo [data-demo-app-icon] i{color:var(--live-demo-ink,#fff)!important}
.ocn-demo[data-ocn-stage=territory] .leaflet-top.leaflet-right{right:244px}@media(max-width:720px){.ocn-demo[data-ocn-stage=territory] .leaflet-top.leaflet-right{right:0}}
.ocn-campaign-scene{position:absolute;inset:0;overflow:hidden;touch-action:none;cursor:grab;background:#789a74}.ocn-campaign-scene:active{cursor:grabbing}.ocn-campaign-crop{position:absolute;left:50%;top:50%;overflow:hidden;transform-origin:center;pointer-events:none}.ocn-campaign-crop img{position:absolute;left:0;width:100%;height:auto;max-width:none!important;user-select:none}.ocn-campaign-controls{position:absolute;z-index:410;right:14px;top:14px;display:grid;gap:5px}.ocn-campaign-controls button{width:38px;height:38px;padding:0;font-size:22px;box-shadow:0 1px 6px #0004}.ocn-demo .ocn-batch-count{font-size:19px!important}.ocn-overview-return{margin-top:10px}.ocn-overview-return button{font-size:11px}@media(max-width:720px){.ocn-demo[data-ocn-stage=campaign] .ocn-workspace{height:430px}.ocn-demo .ocn-batch-count{font-size:17px!important}}