:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;color:#2f2f2f;background:#f5f7f3;font-size:14px}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #b3b3b3;outline-offset:2px}.topbar{height:66px;background:white;border-bottom:1px solid #e8e8e8;display:flex;align-items:center;padding:0 24px;gap:20px}.brand{font-weight:800;font-size:20px;letter-spacing:-1px;color:#363636}.brand span{display:inline-grid;place-items:center;background:#4f4f4f;color:white;border-radius:8px;width:30px;height:30px;margin-right:8px}.crumb{color:#aaaaaa}.project-name{border:0;font-weight:650;color:#414141;width:180px;background:transparent}.top-spacer{flex:1}.saved{font-size:12px;color:#828282}.btn{border:1px solid #e3e3e3;background:white;color:#454545;border-radius:8px;padding:9px 13px;font-weight:600;min-height:38px}.btn:hover{background:#f6f6f6}.btn.primary{background:#515151;color:white;border-color:#515151}.btn.primary:hover{background:#414141}.btn.danger{color:#a64c49}.layout{display:grid;grid-template-columns:244px minmax(0,1fr) 265px;height:calc(100vh - 66px)}.sidebar,.inspector{background:#fff;overflow:auto;padding:20px 16px}.sidebar{border-right:1px solid #e8e8e8}.inspector{border-left:1px solid #e8e8e8}.section{margin-bottom:25px}.section-title{font-size:10px;letter-spacing:1.4px;font-weight:800;color:#a3a3a3;text-transform:uppercase;margin:0 0 12px}.field{display:grid;gap:6px;margin:11px 0}.field label{font-size:12px;font-weight:650;color:#7d7d7d}.field input,.field select,select.control{width:100%;border:1px solid #e5e5e5;background:#fff;color:#424242;border-radius:8px;padding:9px;min-height:38px}.row{display:flex;gap:7px;align-items:center}.row>*{min-width:0}.row .btn{flex:1}.muted{font-size:12px;line-height:1.55;color:#8c8c8c}.tiny{font-size:11px}.tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.tool{border:1px solid transparent;text-align:left;background:#f6f8f5;padding:10px 8px;border-radius:8px;color:#616161;min-height:42px}.tool.active{background:#eeeeee;border-color:#cfcfcf;color:#4e4e4e;font-weight:700}.tool .icon{display:inline-block;font-size:16px;width:24px}.main{position:relative;display:flex;flex-direction:column;min-width:0;background:#f4f6f2}.workspace-head{height:66px;display:flex;align-items:center;padding:0 24px;gap:12px;background:#fff;border-bottom:1px solid #ebebeb}.workspace-head h1{font-size:16px;margin:0}.workspace-head p{margin:3px 0 0;font-size:11px;color:#a3a3a3}.badge{font-size:11px;color:#717171;background:#f2f2f2;border-radius:20px;padding:6px 10px}.canvas-wrap{position:relative;flex:1;min-height:300px;overflow:hidden;touch-action:none;background-color:#f8faf7;background-image:radial-gradient(#dfdfdf 1px,transparent 1px);background-size:20px 20px}canvas{display:block;width:100%;height:100%;touch-action:none}.canvas-hint{position:absolute;top:18px;left:20px;background:#ffffffed;padding:10px 13px;border:1px solid #eaeaea;border-radius:8px;color:#808080;font-size:12px;pointer-events:none;box-shadow:0 4px 15px #35544009}.zoom{position:absolute;bottom:20px;right:20px;display:flex;gap:5px}.zoom button{width:39px;height:39px;border:1px solid #e3e3e3;border-radius:8px;background:white;color:#5a5a5a;font-size:18px;box-shadow:0 3px 12px #29463212}.bottom{height:40px;background:white;border-top:1px solid #eaeaea;display:flex;align-items:center;padding:0 20px;gap:20px;color:#939393;font-size:11px}.status-dot{display:inline-block;width:7px;height:7px;background:#9f9f9f;border-radius:50%;margin-right:6px}.empty-inspector{text-align:center;padding:32px 8px;color:#8d8d8d;line-height:1.6}.empty-icon{display:grid;place-items:center;margin:0 auto 12px;width:46px;height:46px;border-radius:14px;background:#f3f3f3;color:#8e8e8e;font-size:22px}.panel-card{border:1px solid #e9e9e9;border-radius:10px;padding:12px;margin:10px 0}.panel-card strong{display:block;margin-bottom:5px}.notice{background:#f7f7f7;border:1px solid #eaeaea;border-radius:10px;padding:12px;color:#737373;font-size:12px;line-height:1.55}.notice.warn{background:#fff9ed;border-color:#f0e5ca;color:#826f4f}.inspector h2{font-size:15px;margin:0 0 5px}.divider{border:0;border-top:1px solid #f0f0f0;margin:20px 0}.modal-back{position:fixed;inset:0;background:#172b2480;display:grid;place-items:center;padding:16px;z-index:20}.modal{background:white;border-radius:16px;box-shadow:0 20px 80px #172b2433;width:min(540px,100%);max-height:90vh;overflow:auto;padding:24px}.modal h2{font-size:22px;letter-spacing:-.5px;margin:0 0 8px}.modal p{color:#828282;line-height:1.6}.modal img{width:100%;height:180px;object-fit:cover;border-radius:10px;margin-bottom:18px}.modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:20px}.preview{width:100%;background:#f6f8f5;border:1px solid #e7e7e7;border-radius:8px}.hidden{display:none!important}.file{display:none}.full{width:100%}.legend{display:flex;gap:6px;align-items:center;margin:5px 0}.swatch{width:12px;height:12px;border:1px solid #a8a8a8;border-radius:3px}.inspector .btn{margin-top:4px}.toolbar-scroll{display:contents}@media(max-width:950px){.layout{grid-template-columns:200px minmax(0,1fr)}.inspector{position:absolute;z-index:3;right:10px;top:145px;max-height:calc(100vh - 205px);width:240px;border:1px solid #e8e8e8;border-radius:12px;box-shadow:0 8px 30px #253f301a}.inspector.collapsed{display:none}.saved{display:none}}@media(max-width:650px){.topbar{padding:0 12px;gap:8px}.brand{font-size:0}.brand span{font-size:18px}.project-name{width:100px}.topbar .btn{padding:8px}.layout{display:flex;flex-direction:column;height:calc(100dvh - 66px)}.sidebar{order:2;border:0;border-top:1px solid #e3e3e3;padding:8px;overflow:auto}.sidebar .section:not(.tools-section){display:none}.sidebar .section{margin:0}.tool-grid{display:flex;min-width:max-content}.tool{min-width:76px;text-align:center;font-size:11px}.tool .icon{display:block;width:auto}.main{flex:1}.workspace-head{height:55px;padding:0 12px}.workspace-head p{display:none}.inspector{top:130px;right:8px;width:220px;max-height:55vh}.bottom{height:30px}.canvas-hint{max-width:70%;font-size:11px}.zoom{bottom:10px;right:10px}.topbar .hide-mobile{display:none}}
@media(max-width:650px){.sidebar{max-height:180px}.sidebar .section:not(.tools-section){display:block}.sidebar{display:flex;flex-direction:column;gap:12px}.sidebar .tools-section{order:-1}.sidebar .section-title{margin-top:6px}.topbar .hide-mobile{display:inline-block}.topbar .btn{font-size:11px}.topbar .btn[data-action="undo"],.topbar .btn[data-action="redo"]{display:none}}
/* Planlivo's warm, architectural charcoal palette */
:root{color:#202321;background:#f7f6f2}.topbar,.sidebar,.inspector,.workspace-head,.bottom{background:#fff;border-color:#e2e2dc}.brand{color:#242725}.brand span,.btn.primary{background:#242725;border-color:#242725;color:#fff}.btn.primary:hover{background:#444444}.btn{border-color:#dfdfd8;color:#333333}.btn:hover{background:#f5f4f0}.project-name{color:#242725}.tool{background:#f6f5f1;color:#555555}.tool.active{background:#242725;border-color:#242725;color:#fff}.section-title,.workspace-head p{color:#8b8b8b}.field label,.muted,.saved{color:#747474}.field input,.field select,select.control{border-color:#deded7;color:#323232}.main{background:#f7f6f2}.badge{background:#eeeae2;color:#5e5c54}.canvas-wrap{background-color:#faf9f6;background-image:radial-gradient(#deded8 1px,transparent 1px)}.canvas-hint{color:#696969;border-color:#e8e7e0}.zoom button{border-color:#deded8;color:#383838}.bottom{color:#7a7a7a}.status-dot{background:#777777}.empty-icon{background:#f0eee9;color:#77796e}.notice{background:#f6f4ef;border-color:#e8e4db;color:#696969}.notice.warn{background:#fbf6ee;border-color:#eee2d1;color:#765f4e}button:focus-visible,input:focus-visible,select:focus-visible{outline-color:#a9957c}
.coordinate-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 8px}.inspector details{margin:14px 0;border:1px solid #e2e2dc;border-radius:8px;padding:10px}.inspector summary{cursor:pointer;font-weight:650;color:#383838}
.project-list{display:grid;gap:8px;margin:18px 0}.project-entry{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid #e2e2dc;border-radius:10px;padding:12px}.project-entry .row{flex-shrink:0}@media(max-width:650px){.topbar .project-name{width:70px}.topbar .btn[data-action="projects"]{padding:8px 5px}}
.save-alert{position:fixed;z-index:30;right:16px;bottom:16px;max-width:min(420px,calc(100vw - 32px));padding:14px 16px;border:1px solid #c98b67;border-radius:10px;background:#fff4e8;color:#643c29;box-shadow:0 6px 24px #0002;font-weight:650}.save-alert[hidden]{display:none}
.item-list summary{cursor:pointer;font-size:12px;font-weight:700;color:#585858}.item-button{width:100%;display:flex;justify-content:space-between;gap:8px;border:0;border-radius:7px;padding:9px;background:#f6f5f1;color:#383838;text-align:left;margin:4px 0}.item-button.active{background:#e9e4da;font-weight:700}.item-button span{color:#7e7e7e}#canvas:focus-visible{outline:3px solid #a9957c;outline-offset:-3px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.recognition-preview{position:relative;margin:14px 0;background:#eee;border:1px solid #deded8}.recognition-preview img{display:block;width:100%;height:auto;max-height:230px;object-fit:fill;margin:0;border-radius:0}.recognition-preview svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.recognition-preview line{stroke:#c76b50;stroke-width:7;vector-effect:non-scaling-stroke;opacity:.55}.recognition-preview line.chosen{stroke:#5e5e5e;opacity:1}.candidate-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:150px;overflow:auto}.candidate-list label{display:flex;align-items:center;gap:7px;padding:6px;background:#f6f5f1;border-radius:6px;font-size:12px}.btn:disabled{opacity:.45;cursor:not-allowed}
.recognition-preview text{fill:white;paint-order:stroke;stroke:#493b31;stroke-width:12px;stroke-linejoin:round;font:bold 58px system-ui;text-anchor:middle;dominant-baseline:central}
.recognition-preview{display:table;max-width:100%;margin:14px auto}.recognition-preview img{width:auto;height:auto;max-width:100%;max-height:230px;object-fit:contain}
.field input[type=range]{padding:0;accent-color:#242725}.modal .row:has([data-export]){flex-wrap:wrap}.modal .row:has([data-export]) label{white-space:nowrap}
.measurement-result{position:absolute;left:20px;bottom:20px;max-width:min(360px,65%);padding:10px 13px;background:#fff;border:1px solid #deded8;border-radius:8px;box-shadow:0 3px 12px #0001;display:grid;gap:3px;color:#373737}.measurement-result span{font-size:11px;color:#707070;line-height:1.35}@media(max-width:650px){.measurement-result{left:10px;bottom:10px;max-width:60%}}

.brand img{width:34px;height:34px;object-fit:contain;vertical-align:middle;margin-right:8px}
/* Compact layouts leave the canvas unobstructed until properties are needed. */
.inspector.collapsed{display:none}@media(min-width:951px){.layout:has(.inspector.collapsed){grid-template-columns:244px minmax(0,1fr)}}
@media(max-width:650px){.topbar{padding:0 8px;gap:4px}.topbar .brand{flex:none}.topbar .brand span{width:28px;height:28px;margin-right:0}.topbar .crumb{display:none}.topbar .project-name{width:clamp(35px,13vw,70px);flex:0 1 auto}.topbar .top-spacer{min-width:0}.topbar .btn{font-size:11px;padding:7px 7px;white-space:nowrap;flex-shrink:0}.layout{min-height:0}.main{min-height:0}.canvas-wrap{min-height:0}.sidebar{max-height:min(165px,26dvh);flex:0 0 auto}.bottom{gap:8px;overflow:hidden;white-space:nowrap}.bottom span{overflow:hidden;text-overflow:ellipsis}}
@media(max-width:650px){.btn,.field input,.field select,select.control{min-height:44px}.topbar .btn[data-action="settings"]{min-width:44px}.zoom button{width:44px;height:44px}}
@media(max-width:400px){.topbar .project-name{display:none}}
.inspector-heading{display:flex;align-items:center;justify-content:space-between}.inspector-heading .section-title{margin-bottom:12px}.inspector-close{display:none}@media(max-width:950px){.inspector-close{display:inline-grid;place-items:center;min-width:44px;min-height:44px;margin:-10px -6px 4px 0;border:0;background:transparent;font-size:22px}}
@media(max-width:950px){.topbar .brand{font-size:0;flex:none}.topbar .brand span{font-size:18px}.topbar .project-name,.topbar .crumb{display:none}.topbar .btn{white-space:nowrap;padding:8px 10px}}
@media(min-width:651px) and (max-width:950px){.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tool{min-width:0;min-height:48px;text-align:center;font-size:11px;overflow-wrap:anywhere}.tool .icon{display:block;width:auto;margin-bottom:2px}}
@media(max-width:950px){.btn{min-height:44px}.zoom button{width:44px;height:44px}}
@media(min-width:651px) and (max-width:950px){.tool{padding:10px 4px}}
@media(max-width:650px){.topbar .btn{padding:7px 7px}}
@media(max-width:650px){.bottom{padding:0 8px;gap:6px;font-size:10px}.bottom span{overflow:visible;text-overflow:clip;flex-shrink:0}}
.touch-hint{display:none}@media(pointer:coarse){.keyboard-hint{display:none}.touch-hint{display:inline}}

@font-face{font-family:'Bebas Neue';src:url('assets/BebasNeue-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
:root{font-family:Avenir,'Avenir Next',Arial,sans-serif}
h1,h2,h3,h4,h5,h6,.section-title,.brand{font-family:'Bebas Neue',Impact,sans-serif;font-weight:400;letter-spacing:.03em}

/* Generated architectural symbols share one atlas and follow the active tool colour. */
.tool .tool-icon{display:inline-block;vertical-align:middle;width:24px;height:24px;margin-right:4px;background-image:url('assets/tool-icons.png');background-repeat:no-repeat;background-size:400% 500%;background-position:calc(var(--icon-column) * 100% / 3) calc(var(--icon-row) * 100% / 4)}
.tool.active .tool-icon{filter:invert(1)}
@media(max-width:950px){.tool .tool-icon{display:block;width:24px;height:24px;margin:0 auto 3px}}

.action-icon{display:inline-block;vertical-align:middle;flex:none;width:20px;height:20px;background-image:url('assets/action-icons.png');background-repeat:no-repeat;background-size:400% 400%;background-position:calc(var(--icon-column) * 100% / 3) calc(var(--icon-row) * 100% / 3)}
.btn .action-icon:not(:last-child){margin-right:6px}.btn.primary .action-icon{filter:invert(1)}
.zoom button{display:grid;place-items:center}.empty-icon .action-icon{width:26px;height:26px;opacity:.65}
.detail-icon{background-image:url('assets/detail-icons.png')}
.btn .detail-icon:not(:last-child){margin-right:6px}

/* Follow the system theme; keep the drawing paper light for plan contrast. */
:root[data-theme="dark"]{color-scheme:dark;color:#ecece7;background:#343434}
:root[data-theme="dark"] .topbar,:root[data-theme="dark"] .sidebar,:root[data-theme="dark"] .inspector,:root[data-theme="dark"] .workspace-head,:root[data-theme="dark"] .bottom,:root[data-theme="dark"] .modal{background:#3c3c3c;border-color:#696969;color:#f8f8f3}
:root[data-theme="dark"] .brand,:root[data-theme="dark"] .project-name{color:#f1f1ec}
:root[data-theme="dark"] .crumb,:root[data-theme="dark"] .section-title,:root[data-theme="dark"] .workspace-head p,:root[data-theme="dark"] .field label,:root[data-theme="dark"] .muted,:root[data-theme="dark"] .saved,:root[data-theme="dark"] .bottom,:root[data-theme="dark"] .modal p{color:#d7d7d7}
:root[data-theme="dark"] .btn,:root[data-theme="dark"] .zoom button{background:#525252;border-color:#838383;color:#fff}
:root[data-theme="dark"] .btn:hover,:root[data-theme="dark"] .zoom button:hover{background:#636363}
:root[data-theme="dark"] .btn.primary{background:#e4e0d5;border-color:#e4e0d5;color:#292929}
:root[data-theme="dark"] .btn.primary:hover{background:#f5f1e8}
:root[data-theme="dark"] .btn.danger{color:#ffb6a8}
:root[data-theme="dark"] .field input,:root[data-theme="dark"] .field select,:root[data-theme="dark"] select.control{background:#4c4c4c;border-color:#8d8d8d;color:#fff}
:root[data-theme="dark"] .field input[type=range]{accent-color:#d7c5aa}
:root[data-theme="dark"] .tool,:root[data-theme="dark"] .item-button{background:#525252;color:#fff}
:root[data-theme="dark"] .tool:hover,:root[data-theme="dark"] .item-button:hover{background:#636363}
:root[data-theme="dark"] .tool.active{background:#e4e0d5;border-color:#e4e0d5;color:#292929}
:root[data-theme="dark"] .item-button.active{background:#575757;color:#fff}
:root[data-theme="dark"] .item-button span,:root[data-theme="dark"] .item-list summary{color:#c9c9c9}
:root[data-theme="dark"] .tool .tool-icon,:root[data-theme="dark"] .action-icon{filter:invert(1)}
:root[data-theme="dark"] .tool.active .tool-icon,:root[data-theme="dark"] .btn.primary .action-icon{filter:none}
:root[data-theme="dark"] .empty-icon{background:#5f5f5f;color:#fff}
:root[data-theme="dark"] .empty-inspector{color:#d7d7d7}
:root[data-theme="dark"] .badge{background:#5d5d5d;color:#fff}
:root[data-theme="dark"] .notice{background:#4e4e4e;border-color:#777777;color:#f4f4f4}
:root[data-theme="dark"] .notice.warn{background:#594c3e;border-color:#978069;color:#fff0d9}
:root[data-theme="dark"] .divider,:root[data-theme="dark"] .inspector details,:root[data-theme="dark"] .project-entry,:root[data-theme="dark"] .panel-card{border-color:#707070}
:root[data-theme="dark"] .inspector summary{color:#e5e5e5}
:root[data-theme="dark"] .candidate-list label{background:#525252;color:#fff}
:root[data-theme="dark"] .modal-back{background:#111711a6}
:root[data-theme="dark"] .canvas-hint{background:#ffffffed;color:#525252;border-color:#deded8}
:root[data-theme="dark"] .measurement-result{background:#fff;color:#373737}
:root[data-theme="dark"] .measurement-result span{color:#5f5f5f}
:root[data-theme="dark"] .preview,:root[data-theme="dark"] .recognition-preview{color-scheme:light}

/* Building overview and searchable object library */
.building-row{display:flex;align-items:stretch;gap:4px;margin-bottom:5px}.building-row .item-button{flex:1;min-width:0;margin:0}.building-visibility{min-width:44px;min-height:44px;border:1px solid #d8d8d8;border-radius:8px;background:#fff;color:#2f2f2f;cursor:pointer}.library-list{max-height:280px;overflow:auto;border:1px solid #d8d8d8;border-radius:8px;padding:8px}.library-group strong{display:block;margin:7px 4px;color:#5e5e5e;font-size:12px}.library-item{display:flex;align-items:center;gap:7px;width:100%;min-height:44px;padding:7px;border:0;border-radius:6px;background:transparent;text-align:left;color:inherit;cursor:pointer}.library-item:hover,.library-item.active{background:#ebebeb}.library-item span{font-size:20px}.library-item small{margin-left:auto;white-space:nowrap;color:#5e5e5e}.library-item[hidden],.library-group[hidden]{display:none}.canvas-hint strong{display:block;margin-top:3px}
@media(max-width:650px){.topbar{overflow-x:auto;scrollbar-width:thin}.topbar .top-spacer{display:none}.topbar .btn{min-width:44px;flex-shrink:0}.tool{min-height:44px}.building-visibility{min-width:44px;min-height:44px}.library-list{max-height:180px}}
.book-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:9px}.book-options label{display:flex;align-items:center;gap:8px;min-height:32px}.book-options input{width:18px;height:18px;flex:none}
.help-results{max-height:48vh;overflow:auto;border-top:1px solid #d9d9d9}.help-article{border-bottom:1px solid #d9d9d9;padding:10px 2px}.help-article[hidden]{display:none}.help-article summary{cursor:pointer;min-height:32px;font-weight:600}.help-article ol{margin:6px 0 8px;padding-left:24px;line-height:1.5}.help-article li{margin:5px 0}

/* Task-oriented navigation and quieter surfaces. */
.sidebar{display:flex;flex-direction:column;gap:16px;padding:20px 14px}
.sidebar .section{margin:0}.sidebar .tools-section{order:-2}.sidebar .project-controls{order:-1}
.tool-group{border-top:1px solid #e5e5e5;padding:3px 0}.tool-group summary,.project-controls summary,.underlay-controls summary,.inspector-info summary{cursor:pointer;font-weight:700;padding:10px 4px;color:#3d3d3d;list-style:none}.tool-group summary::after,.project-controls summary::after,.underlay-controls summary::after,.inspector-info summary::after{content:'+';float:right;font-size:16px}.tool-group[open]>summary::after,.project-controls[open]>summary::after,.underlay-controls[open]>summary::after,.inspector-info[open]>summary::after{content:'−'}
.tool-group .tool-grid{padding:0 0 10px}.tool{display:flex;align-items:center;gap:4px;min-height:44px;font-size:12px;background:transparent;border:1px solid #e8e8e8}.tool:hover{background:#f1f3ef}.tool .tool-icon{flex:none;margin:0}.tool.active{background:#434343;border-color:#434343;color:white}.tool.active .tool-icon{filter:invert(1)}
.section-title{font-size:13px;letter-spacing:.06em}.field label,.muted,.saved{color:#616161}.notice{background:#f6f7f3}.canvas-hint{max-width:min(620px,80%);line-height:1.4}
:root[data-theme="dark"] .tool-group{border-color:#696969}:root[data-theme="dark"] .tool-group summary,:root[data-theme="dark"] .project-controls summary,:root[data-theme="dark"] .underlay-controls summary,:root[data-theme="dark"] .inspector-info summary{color:#f4f4f4}:root[data-theme="dark"] .tool{border-color:#727272}:root[data-theme="dark"] .tool.active{background:#e4e0d5;border-color:#e4e0d5;color:#292929}:root[data-theme="dark"] .tool.active .tool-icon{filter:none}
@media(max-width:950px){.tool .tool-icon{margin:0}.tool{justify-content:flex-start;text-align:left;font-size:12px}}
@media(max-width:650px){.sidebar{display:block;max-height:min(210px,32dvh);padding:8px 12px}.sidebar .tools-section{display:block}.sidebar .section{margin:0 0 8px}.tool-group{display:inline-block;vertical-align:top;border:0;margin-right:4px}.tool-group summary{padding:8px 11px;background:#f0f0f0;border-radius:8px}.tool-group summary::after{margin-left:12px}.tool-group .tool-grid{display:flex;overflow-x:auto;max-width:calc(100vw - 36px);padding:8px 0}.tool-group .tool{min-width:88px;min-height:48px;flex-direction:column;justify-content:center;text-align:center;white-space:normal}.inspector{position:fixed;top:auto;bottom:0;right:0;width:100%;max-height:55dvh;border-radius:16px 16px 0 0;box-shadow:0 -6px 30px #0003}.canvas-hint{max-width:90%;font-size:11px}.topbar{gap:6px}:root[data-theme="dark"] .tool-group summary{background:#525252}}
.tool .extended-tool-icon{background-image:url('assets/extended-tool-icons.png');background-size:400% 200%;background-position:calc(var(--icon-column) * 100% / 3) calc(var(--icon-row) * 100%)}
.advanced-inspector>summary{cursor:pointer}
.workflow-icon{display:inline-block;vertical-align:middle;width:20px;height:20px;background:url('assets/workflow-icons.png') no-repeat;background-size:400% 200%;background-position:calc(var(--icon-column) * 100% / 3) calc(var(--icon-row) * 100%);margin-right:5px}
.layer-controls summary{cursor:pointer;font-weight:700;padding:10px 4px}.layer-option{display:flex;gap:8px;align-items:center;padding:5px 4px;font-size:13px}.check-issues{padding-left:20px}.check-issues li{margin:8px 0}.check-issues .btn{text-align:left}
:root[data-theme="dark"] .workflow-icon{filter:invert(1)}
.drawing-controls{border-top:1px solid #e0e0e0;padding:8px 4px}.drawing-controls summary{cursor:pointer;font-weight:700;padding:6px 0}.length-input{min-width:0;width:100%;padding:8px;border:1px solid #bfbfbf;border-radius:8px}.drawing-controls .row{margin-top:6px}.drawing-controls .row .btn{flex:none}.export-visible{display:block;margin:12px 0}
:root[data-theme="dark"] .drawing-controls{border-color:#696969}:root[data-theme="dark"] .length-input{background:#4c4c4c;color:#fff;border-color:#8d8d8d}
.multi-controls summary{cursor:pointer;font-weight:700;padding:10px 4px}.multi-controls .row{flex-wrap:wrap}.multi-controls .row .btn{flex:1 1 100%;text-align:left}
.multi-move{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-bottom:8px}.multi-move .btn{min-width:0;padding:7px}
.layer-row{display:flex;align-items:center;justify-content:space-between;gap:6px}.layer-lock{display:flex;align-items:center;gap:4px;font-size:11px;color:#5c5c5c}.layer-lock input{margin:0}
:root[data-theme="dark"] .layer-lock{color:#e5e5e5}

/* Planlivo editor: compact navigation with a high-contrast charcoal header. */
.topbar{background:#202322;border-color:#202322;color:#f7f7f4;gap:8px;padding:0 16px;overflow-x:auto;scrollbar-width:thin;white-space:nowrap}
.topbar .brand{display:flex;align-items:center;flex:none;color:#fff;font-size:20px;letter-spacing:.03em}
.topbar .brand img{filter:none}
.topbar .crumb{color:#a1a1a1}.topbar .project-name{color:#fff;min-width:80px;width:clamp(90px,13vw,170px);flex:0 1 auto}
.topbar .saved{color:#dbdbdb;white-space:nowrap}.topbar .status-dot{background:#b0b0b0}
.topbar .btn{display:inline-flex;align-items:center;justify-content:center;flex:none;white-space:nowrap;min-height:42px;padding:8px 10px;color:#f5f6f3;background:#363636;border-color:#606060}
.topbar .btn:hover{background:#494949}.topbar .btn .action-icon,.topbar .btn .workflow-icon{filter:brightness(0) invert(1)}
.topbar .btn.primary{color:#202322;background:#f3f1ea;border-color:#f3f1ea}.topbar .btn.primary .action-icon{filter:none}
.topbar .btn.primary:hover{background:#fff}.topbar .top-spacer{min-width:0}
.sidebar{background:#fbfbf9}.tool-group[open]>summary{color:#262626}.tool-group:has(.tool.active)>summary{border-left:3px solid #606060;padding-left:8px}
.tool-results[hidden],.tool-results .tool[hidden],[data-tool-groups][hidden],[data-tool-empty][hidden]{display:none!important}
.tool-results{padding-bottom:8px}.tool-results .tool{min-width:0;overflow-wrap:anywhere}
.tools-section [data-tool-search]{min-height:42px;background:#fff}
.inspector{background:#fff}.selected-label{display:inline-block;color:#5c5c5c;background:#f1f1f1;border:1px solid #e1e1e1;border-radius:20px;font-size:11px;font-weight:700;padding:5px 9px;margin-bottom:4px}
.inspector h2{font-size:20px;line-height:1.2;overflow-wrap:anywhere;margin:10px 0 4px}.inspector .field input,.inspector .field select{min-height:42px}
.inspector .next-library{margin:10px 0;padding:8px 10px}.next-library summary{min-height:28px;line-height:28px}
.library-item{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:9px;min-height:56px;padding:6px 8px;border:1px solid transparent}
.library-item:hover,.library-item.active{border-color:#c2c2c2;background:#f1f1f1}.library-item .library-thumb{grid-row:1 / span 2;display:block;width:42px;height:34px;border:1px solid #e2e2e2;border-radius:6px;background:#f9f9f9;touch-action:auto}
.library-item .library-name{font-size:12px;font-weight:650;line-height:1.2;overflow-wrap:anywhere}.library-item small{grid-column:2;margin:0;font-size:11px;color:#5b5b5b;white-space:normal}
.canvas-hint{max-width:min(440px,68%);font-size:12px;color:#373737;background:#fff;box-shadow:0 3px 12px #00000010;padding:8px 11px}.canvas-hint strong{font-size:11px}
.zoom button{width:44px;height:44px}.tool,.btn,.building-visibility{min-height:44px}
:root[data-theme="dark"] .topbar{background:#202322;border-color:#202322}
:root[data-theme="dark"] .sidebar,:root[data-theme="dark"] .inspector{background:#343434}
:root[data-theme="dark"] .tool-group[open]>summary{color:#f5f6f3}
:root[data-theme="dark"] .selected-label{color:#f5f5f5;background:#535353;border-color:#898989}
:root[data-theme="dark"] .library-list{border-color:#838383}
:root[data-theme="dark"] .library-group strong{color:#eaeaea}
:root[data-theme="dark"] .library-item{color:#f5f7f3}
:root[data-theme="dark"] .library-item:hover,:root[data-theme="dark"] .library-item.active{background:#606060;border-color:#a9a9a9}
:root[data-theme="dark"] .library-item small{color:#e7e7e7}
@media(max-width:950px){.topbar .saved{display:none}.topbar .brand{font-size:18px}.topbar .project-name{display:none}.topbar{padding:0 10px}.sidebar .tool{font-size:12px}}
@media(max-width:650px){.topbar{padding:0 8px;gap:6px}.topbar .brand{font-size:0}.topbar .brand img{width:30px;height:30px;margin:0}.topbar .btn{font-size:12px;padding:8px 10px;min-width:44px}.topbar .btn[data-action="undo"],.topbar .btn[data-action="redo"]{display:inline-flex}.topbar .crumb{display:none}.sidebar{max-height:min(190px,29dvh)}.sidebar .tool-results{display:flex;min-width:0;overflow-x:auto;gap:6px}.sidebar .tool-results .tool{flex:0 0 105px}.inspector{max-height:min(58dvh,560px);padding:16px}.canvas-hint{max-width:78%;font-size:11px}.zoom{bottom:10px;right:10px}.zoom button{width:44px;height:44px}}

/* Additional icons for editor actions and door types. */
.action-icon.editor-extra-icon,.tool .tool-icon.editor-extra-icon{background-image:url('assets/editor-extra-icons.png');background-size:400% 400%;background-position:calc(var(--icon-column) * 100% / 3) calc(var(--icon-row) * 100% / 3)}
.visibility-icon{display:inline-block;vertical-align:middle;width:22px;height:22px;background-image:url('assets/visibility-icons.png');background-repeat:no-repeat;background-size:200% 100%;background-position:left center}
.visibility-icon.is-hidden{background-position:right center}
:root[data-theme="dark"] .visibility-icon{filter:invert(1)}
