:root{--ink:#233c33;--forest:#284f3e;--muted:#768177;--paper:#fbfaf6;--line:#e4e7df;--mint:#eaf0e7;--orange:#dfac76;--green:#9db38d;--blue:#92bfd0;--font:'DM Sans',system-ui,sans-serif}*{box-sizing:border-box}body{margin:0;color:var(--ink);font-family:var(--font);background:var(--paper);font-size:14px}button,input,select{font:inherit}button{border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:9px;padding:10px 14px;cursor:pointer;transition:background .15s,transform .15s}button:hover{background:var(--mint)}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #caa96b;outline-offset:3px}button:disabled{opacity:.35;cursor:default}button.primary{background:var(--forest);color:#fff;border-color:var(--forest)}button.primary:hover{background:#35694e}button.active{background:var(--mint);color:var(--forest);border-color:#c7d3bf}input:focus{outline:2px solid #a5b894;outline-offset:1px}.topbar{height:91px;padding:0 27px;display:flex;align-items:center;justify-content:space-between;gap:20px;background:#fff;border-bottom:1px solid var(--line)}.brand{display:flex;gap:11px;align-items:center;color:inherit;text-decoration:none;min-width:225px;font-size:25px;letter-spacing:-1px;font-family:Georgia,serif}.brandmark{display:flex;align-items:center;justify-content:center;background:var(--forest);color:#e2eacb;border-radius:12px;width:43px;height:45px;font-size:30px}.brand em{font-weight:400}.brand small{display:block;font:9px var(--font);font-weight:700;letter-spacing:2px;margin-top:6px;color:var(--muted)}.projectname{display:flex;flex-direction:column;gap:4px;flex:1;max-width:310px}.projectname input{border:0;background:transparent;padding:0;width:100%;font-size:16px;font-weight:600;color:var(--ink)}.projectname span{font-size:11px;color:var(--muted)}.topactions{display:flex;gap:8px}.studio{display:grid;grid-template-columns:245px minmax(350px,1fr) 260px;min-height:calc(100vh - 91px)}.palette{padding:28px 20px;display:flex;flex-direction:column;border-right:1px solid var(--line);background:var(--paper)}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;color:#879576}h1{font-family:Georgia,serif;font-size:29px;font-weight:400;line-height:1.14;letter-spacing:-.7px;margin:13px 0}p{line-height:1.6}.sectionhead p{font-size:12px;color:var(--muted);margin-bottom:22px}.tabs{display:flex;gap:4px;background:#eeeee7;padding:4px;border-radius:10px;margin-bottom:15px}.tabs button{flex:1;border:0;padding:8px;background:transparent}.tabs button.active{background:#fff;box-shadow:0 1px 4px #00000008}.paletteitem{display:flex;gap:12px;align-items:center;text-align:left;width:100%;padding:12px 9px;margin:6px 0;border:1px solid transparent;background:transparent}.paletteitem:hover{background:#fff;border-color:var(--line);transform:translateX(2px)}.paletteitem.active{border:1px solid var(--forest);background:#fff}.paletteitem strong{font-weight:600;font-size:12px;display:block}.paletteitem small{font-size:10px;color:var(--muted);display:block;margin-top:4px}.objecticon{width:49px;height:46px;display:flex;align-items:center;justify-content:center;background:#eeefe6;border-radius:10px;flex-shrink:0}.objecticon svg{width:40px;height:35px}.palettebottom{margin-top:auto;padding-top:28px}.widebutton{width:100%;margin:4px 0;text-align:left;font-weight:600;font-size:12px;padding:13px 11px}.widebutton span{display:block;color:var(--muted);font-size:10px;font-weight:400;padding-top:4px;padding-left:16px}.palette details{font-size:11px;padding:15px 0}.palette details button{display:block;width:100%;text-align:left;font-size:11px;margin:7px 0}.localnote{font-size:10px;color:var(--muted)}.workspace{min-width:0;background:#f1f2eb;display:flex;flex-direction:column;position:relative}.canvasbar{height:67px;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:8px;background:#f7f8f2;border-bottom:1px solid #e0e4d9}.segmented{display:flex;background:#e9ede3;padding:3px;border-radius:8px}.segmented button{padding:7px 12px;font-size:11px;background:transparent;border:0}.segmented button.active{background:#fff;box-shadow:0 1px 3px #0000000a}.viewactions{display:flex;align-items:center;gap:7px}.viewactions>button{font-size:11px;padding:7px 10px}.check{font-size:10px;display:flex;gap:3px;align-items:center;white-space:nowrap}input[type=checkbox]{accent-color:var(--forest)}.mapframe{position:relative;flex:1;min-height:650px;overflow:hidden;background:#eaeee1;background-image:radial-gradient(#cad3c0 1px,transparent 1px);background-size:19px 19px}#scene{display:block;position:absolute;inset:0;width:100%;height:100%;touch-action:none;outline:none}#scene[data-tool=pan]{cursor:grab}#scene[data-tool=path],#scene[data-tool=stamp]{cursor:crosshair}#scene [data-id]{cursor:grab}#scene [data-id]:focus{outline:none;filter:drop-shadow(0 0 1px #e1ae64)}.canvasbadge{position:absolute;top:21px;left:20px;font-size:8px;letter-spacing:1px;color:#748268;display:flex;gap:6px;align-items:center;pointer-events:none}.canvasbadge i{width:5px;height:5px;border-radius:50%;background:#7b9564}.modehint{position:absolute;left:50%;bottom:23px;transform:translateX(-50%);padding:10px 16px;background:#fffffff0;box-shadow:0 3px 15px #2634210b;border:1px solid #e2e8da;border-radius:30px;color:#6a7663;font-size:10px;pointer-events:none;max-width:75%;white-space:normal;text-align:center}.maptools{position:absolute;left:18px;top:63px;display:flex;flex-direction:column;padding:5px;background:#ffffffed;border:1px solid #e0e5d8;border-radius:12px;box-shadow:0 3px 13px #33492a08}.maptools button{padding:0;width:32px;height:32px;border:0;background:transparent;font-size:21px}.maptools button.active{background:#e5ebdd;border-radius:7px}.maptools hr{margin:4px 2px;border:0;border-top:1px solid var(--line)}.scale{position:absolute;right:22px;bottom:24px;pointer-events:none}.scale span{display:block;border:solid #60735a;border-width:0 1px 2px;height:7px;width:90px}.scale small{font-size:9px;color:#60735a}.pathactions{position:absolute;bottom:64px;left:50%;transform:translateX(-50%);white-space:nowrap}.pathactions button{font-size:11px}.bottomstrip{min-height:67px;display:flex;align-items:center;justify-content:center;gap:21px;padding:13px;border-top:1px solid #dce3d3;background:#f8faf4;font-size:10px;flex-wrap:wrap}.bottomstrip>span{display:flex;align-items:center;gap:6px}.bottomstrip strong{font-size:11px}.bottomstrip small{color:var(--muted);font-size:8px}.bottomstrip .total{color:var(--muted)}.swatch{width:10px;height:10px;display:inline-block;border-radius:3px;flex-shrink:0}.swatch.a{background:var(--orange)}.swatch.b{background:var(--green)}.swatch.drive{background:var(--blue)}.swatch.path{background:#d8c6a4}.inspector{background:#fff;border-left:1px solid var(--line);padding:28px 20px;overflow:auto}.inspector h2{font-family:Georgia,serif;font-size:24px;font-weight:400;margin:9px 0 6px;letter-spacing:-.4px}.inspector h3{font-size:12px;font-weight:600;margin:0 0 12px}.inspector .sub{font-size:11px;line-height:1.5;color:var(--muted);margin:0 0 18px}.inspector label{font-size:11px;display:block;color:#768174;margin:12px 0}.unitinput{display:flex;align-items:center;border:1px solid var(--line);border-radius:7px;margin-top:6px;overflow:hidden;background:#fbfcf8}.unitinput input{border:0;width:100%;min-width:0;padding:8px 10px;background:transparent;color:var(--ink);font-size:12px}.unitinput span{padding-right:9px;font-size:10px;white-space:nowrap}.fieldrow{display:grid;grid-template-columns:1fr 1fr;gap:9px}.fieldrow label{margin:5px 0}.inspector .area{font-size:32px;letter-spacing:-1px;margin:18px 0;color:var(--forest)}.inspector .area small{font-size:11px;letter-spacing:0;color:var(--muted);display:block;margin-top:2px}.inspector .actionrow{display:flex;gap:5px;margin-top:15px}.actionrow button{font-size:11px;flex:1;padding:9px 5px}.danger{color:#995947}.emptyselection{padding:10px 0 22px}.emptyselection .emptyglyph{width:66px;height:66px;background:#f0f4e9;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:28px;margin-bottom:17px}.emptyselection p{font-size:12px;color:var(--muted)}.parcelsettings{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;margin-top:22px}.parcelsettings summary{font-size:12px;font-weight:600}.parcelsettings p{font-size:10px;color:var(--muted)}input[type=range]{width:100%;accent-color:var(--forest)}.checks{margin-top:23px}.checkitem{font-size:11px;line-height:1.5;margin:8px 0;display:flex;gap:7px;color:#8d673e}.checkitem.ok{color:#6c8060}.legend{margin-top:25px}.legend span{display:flex;align-items:center;gap:8px;font-size:10px;margin:9px 0;color:#697763}.disclaimer{font-size:9px;color:#8b9487;margin-top:25px;line-height:1.7}.selection-note{background:#f2f5ea;border-radius:7px;padding:10px;font-size:10px;color:#6f7d63;line-height:1.6}.chips{display:flex;gap:6px;flex-wrap:wrap}.chips button{font-size:10px;padding:6px 9px}.fullbutton{width:100%;font-size:11px;margin-top:9px}#toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(100px);padding:13px 22px;background:#284c3c;color:#fff;border-radius:12px;box-shadow:0 10px 35px #0002;transition:transform .2s;z-index:30;font-size:12px;max-width:90vw}#toast.show{transform:translateX(-50%) translateY(0)}dialog{border:1px solid var(--line);border-radius:19px;padding:28px;max-width:940px;width:90vw;max-height:90vh;color:var(--ink);box-shadow:0 25px 100px #132c2b30}dialog::backdrop{background:#15271c70;backdrop-filter:blur(3px)}.dialoghead{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.dialoghead h2{font-family:Georgia,serif;font-weight:400;font-size:30px;margin:8px 0 23px}.dialoghead button{font-size:23px;border:0}#variantGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.variantcard{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#f9faf5}.variantcard .thumb{background:#e7eedf;height:145px;display:flex;justify-content:center}.variantcard svg{height:100%;width:100%}.variantcard .content{padding:14px}.variantcard h3{font-size:12px;margin:0 0 5px}.variantcard p{font-size:10px;color:var(--muted);margin:0 0 11px}.variantcard button{font-size:11px;padding:7px 10px}.variantcard .deletevariant{float:right;color:#986654;border:0;background:transparent}.nodata{padding:40px 0;color:var(--muted);font-size:14px;grid-column:1/-1}#printSheet{display:none}summary{cursor:pointer}body[data-printing=true] #toast{display:none}
@media(min-height:950px){.mapframe{min-height:calc(100vh - 225px)}}@media(max-width:1220px){.studio{grid-template-columns:205px minmax(320px,1fr) 225px}.palette,.inspector{padding-left:14px;padding-right:14px}.topbar{padding:0 18px}.brand{min-width:185px;font-size:22px}.topactions button{font-size:11px;padding:9px}.canvasbar{padding:10px;flex-wrap:wrap;height:auto;min-height:65px}.bottomstrip{gap:10px}.check{font-size:9px}.projectname{max-width:200px}h1{font-size:26px}}
@media(max-width:950px){.studio{grid-template-columns:180px minmax(300px,1fr)}.inspector{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;padding:20px;border-top:1px solid var(--line)}.inspector #selectionPanel{grid-row:span 2}.parcelsettings{margin-top:0;border-top:0}.inspector .disclaimer{grid-column:2/-1;margin:0}.mapframe{min-height:680px}.legend{margin-top:0}.topbar .projectname{display:none}.brand{min-width:190px}.topbar{gap:8px}.viewactions .check{display:none}.paletteitem{gap:7px;padding-left:0;padding-right:0}.paletteitem small{font-size:9px}.objecticon{width:40px}.sectionhead p{font-size:11px}.bottomstrip{font-size:9px}}
@media(max-width:600px){.topbar{height:auto;min-height:100px;flex-wrap:wrap;padding:13px 14px}.brand{font-size:23px}.topactions{width:100%;justify-content:space-between}.topactions button{flex:1;font-size:10px}.studio{display:flex;flex-direction:column}.palette{padding:12px;border-right:0;order:1}.sectionhead{display:none}.tabs{width:170px;margin-bottom:5px}.palette #paletteItems{display:flex;overflow-x:auto;gap:4px}.paletteitem{min-width:165px;width:165px}.palettebottom{padding:4px 0;display:flex;flex-wrap:wrap;gap:5px}.widebutton{width:auto;flex:1;min-width:140px}.widebutton span,.localnote{display:none}.palette details{padding:10px}.workspace{order:2}.inspector{order:3;display:block}.mapframe{min-height:620px}.canvasbadge{font-size:7px;left:12px}.canvasbar{gap:5px;min-height:50px}.canvasbar button{font-size:10px}.modehint{font-size:9px;bottom:10px}.maptools{top:50px;left:10px}.bottomstrip{gap:11px;justify-content:flex-start;padding:14px}.bottomstrip .total{display:none}.legend{margin-top:20px;display:flex;gap:15px;flex-wrap:wrap}.legend h3{width:100%;margin:0}.legend span{margin:0}#variantGrid{grid-template-columns:1fr 1fr}.scale{bottom:45px;right:10px}.pathactions{bottom:70px}.inspector .area{margin:10px 0}.disclaimer{margin-top:15px}dialog{padding:18px}.dialoghead h2{font-size:24px}.variantcard .content{padding:10px}}
@page{size:A3 portrait;margin:15mm}@media print{body>*:not(#printSheet){display:none!important}#printSheet{display:block!important;color:#1d332b;font-family:Arial,sans-serif}#printSheet h1{font:30px Georgia,serif;margin:0 0 8px}#printSheet p{font-size:11px;margin:7px 0}#printSheet .printplan{height:270mm;width:100%;display:block}#printSheet table{width:100%;border-collapse:collapse;font-size:11px;margin:15px 0}#printSheet th,#printSheet td{text-align:left;padding:7px;border-bottom:1px solid #ddd}#printSheet .printlegend{display:flex;gap:22px;font-size:11px;margin:10px 0}#printSheet .printlegend span{display:flex;align-items:center;gap:7px}#printSheet .printnote{font-size:9px;color:#666;line-height:1.5}.noprint{display:none!important}}
@media(min-width:951px){.studio{height:calc(100vh - 91px);min-height:0;overflow:hidden}.palette{overflow-y:auto;min-height:0}.inspector{min-height:0}.workspace{min-height:0}.mapframe{min-height:0}.canvasbar,.bottomstrip{flex-shrink:0}}

/* De Kavelier: zacht, tactiel en speels. */
:root{--font:'Avenir Next','Trebuchet MS',system-ui,sans-serif;--forest:#315940;--mint:#edf2df;--paper:#fffaf0;--line:#e3e6d5}
.brand{font-family:var(--font);font-weight:800;letter-spacing:-1.3px}.brand em{font-style:normal;color:#d98a41;font-weight:800}.brandmark{background:#e5ecd8;color:#46663b;border:2px solid #fff;box-shadow:0 3px 0 #cfdbc0;border-radius:15px;transform:rotate(-5deg)}
.topbar{background:#fffdf6}.sectionhead h1{font-family:var(--font);font-weight:800;font-size:29px;letter-spacing:-1.2px;color:#34543d}.sectionhead p{color:#849071}.inspector h2,.dialoghead h2{font-family:var(--font);font-weight:800;letter-spacing:-1px}.palette{background:#fffaf0}.tabs{border-radius:15px;background:#eeeede}.tabs button{border-radius:12px}.paletteitem{border-radius:15px;padding-top:12px;padding-bottom:12px}.paletteitem:hover{box-shadow:0 3px 0 #e6e9d9}.objecticon{border:1px solid #e7ead9;background:#f0f3e5;border-radius:15px}.topactions button{border-radius:14px;box-shadow:0 3px 0 #e5e9dc}.topactions button.primary{background:#db9250;border-color:#db9250;color:#fff;box-shadow:0 3px 0 #bd7539}.primary:hover{filter:brightness(1.04)}.widebutton{border-radius:14px}.modehint{border:2px solid #fff;box-shadow:0 3px 0 #d7dfc8}.maptools{border-radius:17px;border:2px solid #fff;box-shadow:0 4px 0 #ccd7bd}.maptools button{border-radius:10px}.canvasbadge{background:#ffffffe0;padding:7px 10px;border-radius:15px;color:#536c43}.canvasbar{background:#f4f6e9}.bottomstrip{background:#fffdf4}.unitinput{border-radius:10px}.checks{background:#f4f7eb;padding:15px;border-radius:16px}.pickerlabel{font-size:9px!important;font-weight:700;letter-spacing:1px}.pickerlabel select{display:block;width:100%;margin:9px 0 20px;padding:10px;border:1px solid var(--line);border-radius:10px;background:#f6f8ed;color:#3c5638;font-size:11px;letter-spacing:0}.quicktools{position:absolute;z-index:2;top:20px;right:15px;display:flex;gap:5px;padding:5px;background:#fffef5ed;border-radius:15px;box-shadow:0 3px 0 #bcc9a7}.quicktools[hidden]{display:none}.quicktools button{font-size:10px;border:0;border-radius:10px;padding:8px 9px}.mapframe{background-color:#e7eddc}.printplan{object-fit:contain}.brand small{letter-spacing:1.6px}
@media(max-width:600px){.quicktools{top:43px;right:8px}.quicktools button{font-size:9px;padding:6px}.tabs{width:240px}.paletteitem{min-width:165px}.pickerlabel{margin-top:0}.canvasbadge{font-size:6px}.modehint{max-width:80%}}

#pdfDialog{max-width:920px}#pdfDialog>p{font-size:12px;color:#7a856f}#pdfPreview{background:#fff;padding:20px;margin-top:20px;border:1px solid #e1e5d5;border-radius:12px}#pdfPreview h1{font-size:24px}#pdfPreview .printplan{display:block;width:100%;height:680px;object-fit:contain}#pdfPreview table{width:100%;font-size:11px;border-collapse:collapse;margin:16px 0}#pdfPreview th,#pdfPreview td{padding:7px;text-align:left;border-bottom:1px solid #e6e8de}#pdfPreview .printlegend{display:flex;gap:16px;font-size:10px;flex-wrap:wrap}#pdfPreview .printnote{font-size:9px;color:#78836d}#pdfPreview p{font-size:11px}

.panelbuttons{display:flex;gap:5px}.panelbuttons button{font-size:10px;padding:7px 9px;border-radius:10px;background:#fffdf3}.panelbuttons button[aria-expanded=false]{background:#dce6cb;border-color:#b3c69c}#scene{cursor:grab}#scene.dragging,#scene.dragging [data-id]{cursor:grabbing}#scene.spacepan,#scene.spacepan [data-id]{cursor:grab}.palette,.inspector{min-width:0;transition:padding .25s,transform .25s,opacity .2s}.paletteitem{min-width:0}.tabs button{padding-left:5px;padding-right:5px;font-size:11px}.canvasbar{height:auto;min-height:67px;flex-wrap:wrap}.mapframe{isolation:isolate}.maptools{z-index:2}
@media(min-width:1221px){.studio{--left-width:245px;--right-width:260px}}
@media(min-width:951px) and (max-width:1220px){.studio{--left-width:205px;--right-width:225px}}
@media(min-width:951px){.studio{grid-template-columns:var(--left-width) minmax(300px,1fr) var(--right-width);transition:grid-template-columns .28s ease}.studio.leftclosed{--left-width:0px}.studio.rightclosed{--right-width:0px}.studio.leftclosed .palette{padding-left:0;padding-right:0;opacity:0;transform:translateX(-100%);overflow:hidden;pointer-events:none}.studio.rightclosed .inspector{padding-left:0;padding-right:0;opacity:0;transform:translateX(100%);overflow:hidden;pointer-events:none}}
@media(max-width:950px){.studio.leftclosed .palette,.studio.rightclosed .inspector{display:none}.studio.leftclosed{grid-template-columns:minmax(300px,1fr)}.studio.leftclosed .workspace{grid-column:1/-1}}
@media(max-width:600px){.paletteitem{min-width:165px}.tabs{width:100%}.canvasbar{justify-content:space-between}.panelbuttons button{font-size:9px;padding:7px}.viewactions{width:100%;justify-content:center}.studio.leftclosed .workspace{order:2}.studio.rightclosed .inspector{display:none}}
@media(prefers-reduced-motion:reduce){.studio,.palette,.inspector{transition:none!important}}

/* Pijltje en hand zijn niet meer nodig: één automatische bediening. */
#selectTool,#panTool,.maptools hr:first-of-type{display:none}
/* Garden tools */
.modehint{transition:opacity .7s,transform .7s;pointer-events:none}.modehint.faded{opacity:0;transform:translateY(8px)}.drawingoptions,.explorepanel{padding:12px;border:1px solid #d9dfca;border-radius:12px;margin:10px 0;background:#f4f4e9}.drawingoptions summary,.explorepanel summary{cursor:pointer;font-weight:700;color:#365840}.drawingoptions label,.explorepanel label{display:block;margin-top:12px;font-size:12px}.drawingoptions select,.explorepanel input:not([type=checkbox]),#objectMaterial{max-width:100%;width:100%;padding:8px;border:1px solid #d4dac6;border-radius:7px;background:#fffdf5;color:#365840}.explorepanel p{font-size:11px;line-height:1.6;color:#74806b}.explorepanel .check,.drawingoptions .check{display:flex;gap:8px}.viewactions{flex-wrap:wrap}#languageToggle{font-size:11px;padding:7px 10px;white-space:nowrap}.palettebottom{padding-bottom:20px}#scene [data-vertex]{pointer-events:all}.canvasbar{flex-wrap:wrap}.tabs{flex-wrap:wrap}
/* Work mode: the map fills the window, controls float above it. */
.topbar{transition:transform .28s ease,opacity .22s ease;position:relative;z-index:20}
body.workmode{overflow:hidden}
body.workmode .topbar{transform:translateY(-110%);opacity:0;pointer-events:none}
body.workmode .studio{position:fixed;inset:0;display:block;height:100dvh;min-height:0;overflow:hidden;z-index:10}
body.workmode .workspace{position:absolute;inset:0;display:block;min-height:0}
body.workmode .mapframe{position:absolute;inset:0;min-height:0;height:100%;width:100%}
body.workmode .canvasbar{position:absolute;z-index:6;top:14px;left:16px;right:16px;height:auto;min-height:0;padding:0;border:0;background:transparent;gap:8px;justify-content:flex-start;pointer-events:none}
body.workmode .canvasbar>div{pointer-events:auto;background:#fffdf3c9;border:1px solid #ffffffb8;box-shadow:0 3px 15px #243d2514;border-radius:13px;padding:4px;backdrop-filter:blur(12px)}
body.workmode .canvasbar .viewactions{margin-left:auto;width:auto;flex-wrap:wrap;justify-content:flex-start}
body.workmode .canvasbar .check{display:none}
body.workmode .panelbuttons button,body.workmode .viewactions>button{border:0;background:transparent}
body.workmode #workModeBtn{background:#315940;color:#fff}
body.workmode .bottomstrip{position:absolute;z-index:5;right:16px;bottom:16px;min-height:0;max-width:440px;padding:9px 12px;gap:7px 13px;justify-content:flex-start;font-size:9px;background:#fffdf3b3;border:1px solid #ffffff9e;border-radius:13px;box-shadow:0 3px 15px #243d2510;backdrop-filter:blur(10px);pointer-events:none}
body.workmode .bottomstrip strong{font-size:10px}body.workmode .bottomstrip small{font-size:8px}body.workmode .bottomstrip .total{display:flex}
body.workmode .palette,body.workmode .inspector{position:absolute;z-index:7;top:86px;bottom:90px;width:260px;display:block;max-width:calc(100vw - 32px);height:auto;overflow:auto;padding:20px;border:1px solid #ffffffcf;border-radius:19px;background:#fffaf0ed;box-shadow:0 8px 35px #203f2926;backdrop-filter:blur(14px)}
body.workmode .palette{left:16px}body.workmode .inspector{right:16px}
body.workmode .studio.leftclosed .palette{display:block;opacity:0;transform:translateX(calc(-100% - 20px));pointer-events:none;padding:20px}
body.workmode .studio.rightclosed .inspector{display:block;opacity:0;transform:translateX(calc(100% + 20px));pointer-events:none;padding:20px}
body.workmode .palette #paletteItems{display:block;overflow:visible}body.workmode .paletteitem{min-width:0;width:100%}body.workmode .sectionhead{display:block}body.workmode .palettebottom{display:block;padding-top:20px}body.workmode .widebutton{width:100%}body.workmode .widebutton span{display:block}body.workmode .palette .tabs{width:100%}
body.workmode .canvasbadge{top:78px;left:18px}body.workmode .maptools{top:120px}body.workmode .quicktools{top:78px;right:18px}body.workmode .scale{left:76px;right:auto;bottom:22px}body.workmode .modehint{bottom:88px}body.workmode .pathactions{bottom:130px}
#workModeBtn{font-size:10px;padding:7px 9px;white-space:nowrap}
@media(max-width:700px){body.workmode .canvasbar{top:10px;left:10px;right:10px;gap:6px}body.workmode .canvasbar .viewactions{margin-left:0}body.workmode .canvasbar>div{padding:3px}body.workmode .canvasbar button{font-size:9px;padding:7px}body.workmode .palette,body.workmode .inspector{top:130px;bottom:110px}body.workmode .canvasbadge{top:125px;left:12px}body.workmode .maptools{top:165px}body.workmode .quicktools{top:125px;right:12px}body.workmode .bottomstrip{right:10px;bottom:10px;max-width:calc(100vw - 20px);font-size:8px;padding:8px 10px;gap:6px 10px}body.workmode .scale{bottom:95px;left:auto;right:15px}body.workmode .modehint{bottom:125px}body.workmode .pathactions{bottom:160px}}
@media(prefers-reduced-motion:reduce){.topbar{transition:none!important}}
/* Compact settings at the selected object. */
.objectpopover{position:absolute;z-index:8;width:265px;max-width:calc(100% - 24px);max-height:calc(100% - 100px);overflow:auto;padding:13px;background:#fffdf5f5;border:1px solid #fff;border-radius:17px;box-shadow:0 8px 35px #203f2930;backdrop-filter:blur(14px);font-size:11px;overscroll-behavior:contain}
.objectpopover[hidden]{display:none}.pophead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.pophead strong{font-size:13px}.pophead button{border:0;background:transparent;padding:0 4px;font-size:22px;line-height:1}.objectpopover label{display:block;font-size:10px;color:#65765d;margin:9px 0}.objectpopover select,.objectpopover input:not([type=checkbox]){display:block;width:100%;min-width:0;padding:8px;margin-top:4px;border:1px solid #dce2cf;background:#f7f9ee;border-radius:8px;color:#34533c;font-size:12px}.objectpopover input[type=checkbox]{display:block;margin:10px 0}.popfields{display:grid;grid-template-columns:1fr 1fr;gap:9px}.popnote{font-size:10px;color:#75836c;line-height:1.5;margin:6px 0}.popactions{display:flex;gap:4px;margin-top:11px}.popactions button{flex:1;padding:7px 5px;font-size:10px}.objectpopover .popmore{width:100%;font-size:10px;border:0;background:transparent;color:#6c7e5b;margin-top:7px;padding:6px}.objectpopover details{font-size:10px;line-height:1.5;padding:6px 0;color:#77846b}.objectpopover details p{margin:6px 0}.haspopover .quicktools{display:none}#scene [data-midpoint]{pointer-events:all}
body.workmode .objectpopover{max-height:calc(100% - 170px)}
@media(max-width:600px){.objectpopover{width:235px;font-size:10px}.pophead strong{font-size:12px}.popactions button{font-size:9px}body.workmode .objectpopover{max-height:calc(100% - 220px)}}
.canvasbadge{transition:opacity .7s ease,transform .7s ease}.canvasbadge.faded{opacity:0;transform:translateY(-6px);pointer-events:none}
@media(prefers-reduced-motion:reduce){.canvasbadge,.modehint{transition:none!important}}
/* Keep every floating toolbar group inside the visible fullscreen area. */
:root:fullscreen{width:100%;height:100%;margin:0;background:#e7eddc}
body.workmode .canvasbar{left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));top:max(12px,env(safe-area-inset-top));width:auto;max-width:calc(100% - 24px);align-items:flex-start;flex-wrap:wrap;overflow:visible}
body.workmode .canvasbar>div{flex-shrink:1;min-width:0;max-width:100%}body.workmode .panelbuttons{flex-wrap:wrap}body.workmode .canvasbar .viewactions{flex-wrap:wrap;max-width:100%}
body.workmode .canvasbar .viewactions{margin-left:0}body.workmode .canvasbar{justify-content:flex-start}
/* One responsibility per drawer. Layers never resize the map or open Details. */
.layersdrawer{position:absolute;z-index:9;top:var(--drawer-top,80px);bottom:88px;right:14px;width:292px;max-width:calc(100% - 28px);padding:18px;background:#fffaf0f5;border:1px solid #fff;border-radius:18px;box-shadow:0 8px 35px #203f2926;backdrop-filter:blur(14px);overflow:auto;overscroll-behavior:contain;opacity:0;transform:translateX(calc(100% + 24px));pointer-events:none;visibility:hidden;transition:transform .25s,opacity .2s,visibility .25s}
.layersdrawer.open{opacity:1;transform:translateX(0);pointer-events:auto;visibility:visible}.layershead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.layershead h2{font-size:16px;margin:0;font-weight:800}.layershead button{font-size:23px;border:0;padding:0 5px;background:transparent}#layersContent label{display:block;font-size:11px;color:#65765c;margin:14px 0}#layersContent label.check{display:flex;gap:8px;align-items:center;white-space:normal}#layersContent p{font-size:10px;color:#7b866e;line-height:1.6}#layersContent input:not([type=checkbox]){display:block;width:100%;max-width:100%;border:1px solid #d6dfc8;padding:8px;background:#fffdf5;border-radius:8px;margin-top:6px;color:#365840}#layersContent input[type=range]{padding:0}#exploreBtn{font-size:10px;padding:7px 9px;white-space:nowrap;border-radius:10px}.panelbuttons{flex-wrap:wrap}
body.workmode .layersdrawer{top:var(--drawer-top,80px);bottom:90px;right:16px}body.workmode .palette,body.workmode .inspector{top:var(--drawer-top,86px)}
.mapframe[data-background=map]{background:#526848;background-image:none}.mapframe[data-background=garden]{background-color:#e7eddc;background-image:radial-gradient(#cad3c0 1px,transparent 1px)}
/* Preserve horizontal centering while a hint fades. */
.modehint.faded{transform:translateX(-50%) translateY(8px)}
@media(max-width:700px){.layersdrawer,body.workmode .layersdrawer{right:10px;width:280px;max-width:calc(100% - 20px);bottom:90px;padding:14px}}
@media(prefers-reduced-motion:reduce){.layersdrawer{transition:none!important}}
/* Three rendering modes, one shared metre model. */
.mapframe[data-background=sketch]{background:#f7f5ec;background-image:radial-gradient(#827b6312 .6px,transparent .6px);background-size:5px 5px}.mapframe[data-background=sketch] #scene [data-vertex],.mapframe[data-background=sketch] #scene [data-midpoint] circle{fill:#fffdf4;stroke:#33362e}.mapframe[data-background=sketch] #scene [data-midpoint] path{stroke:#33362e}.mapframe[data-background=sketch] #scene text{fill:#34372e}.segmented{flex-wrap:wrap}#contextView{font-size:11px;width:100%;padding:9px}.mapSource{border-top:1px solid #dce0d1;padding-top:10px;font-size:9px!important;line-height:1.5}

.viewactions #contextView{width:auto;padding:7px 10px;white-space:nowrap}
.layerlist{border-bottom:1px solid #dce1d0;padding:8px 0 12px}.layerlist summary,.measurelist summary{font-size:12px;font-weight:700;color:#39583d;cursor:pointer}.layerlist label.check{margin:9px 0!important}.opacitysetting strong{float:right;font-size:11px}.measurelist{margin-top:20px;padding-top:12px;border-top:1px solid #dce1d0}.measureentry{display:flex;align-items:center;justify-content:space-between;font-size:11px;margin:7px 0}.measureentry button{border:0;padding:4px 9px;font-size:17px}.viewactions #measureBtn,.viewactions #birdViewBtn{width:auto;font-size:11px;padding:7px 10px;white-space:nowrap}#scene[data-tool=measure]{cursor:crosshair}#scene [data-locked]{cursor:not-allowed}.mapframe[data-background=map]{background:#62764e}.viewactions{min-width:0}.canvasbar{gap:7px}.topactions{flex-wrap:wrap}.compare-trigger{font-size:11px}
