/* Layout: arbeidsbord — fast topplinje, faner, og i Planlegging et bygningstre til venstre og arbeidsflate til høyre */
:root{
  --bg:#eef1ee; --panel:#ffffff; --panel-2:#f6f8f6; --ink:#17201b; --muted:#5b6861; --faint:#a9b3ad; --rt1:#b08a4a; --rt2:#4f9a5b; --rt3:#d0782a; --rt4:#3d7fc4; --rt5:#2f9c9c; --rt6:#8a62c4; --rt7:#8a7560; --rt8:#c4568a; --rt9:#607080; --rt10:#9aa23a; --line:#d3dbd5; --line-2:#e4e9e5;
  --accent:#1d7448; --accent-ink:#ffffff; --accent-soft:#dcece2;
  --brand-blue:#006bb6; --brand-green:#087a35; --brand-grey:#4f585e;
  --warn:#a85512; --warn-soft:#fbead9; --bad:#b0261c; --bad-soft:#f8dedb;
  --c1:#c2860c; --c2:#2c68ad; --c3:#c0442d; --c4:#7650aa; --c5:#1d7448; --c6:#3f7f8a; --c7:#a3477a;
  --f-ui:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-label:"Barlow Condensed","Arial Narrow",system-ui,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Consolas,monospace;
  --r:6px;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:#111613; --panel:#181e1b; --panel-2:#1d2420; --ink:#e2eae4; --muted:#93a29a; --faint:#56625c; --rt1:#c9a465; --rt2:#6fbf7b; --rt3:#e8954a; --rt4:#6aa5e0; --rt5:#55c0c0; --rt6:#a98ae0; --rt7:#ad977f; --rt8:#e07aa9; --rt9:#8c9cad; --rt10:#bcc45a; --line:#2d3732; --line-2:#242c28;
  --accent:#4cb47b; --accent-ink:#0d1a12; --accent-soft:#1d3327;
  --brand-blue:#5aaee8; --brand-green:#0cb14b; --brand-grey:#c9cfd3;
  --warn:#e39a52; --warn-soft:#3a2a19; --bad:#f07a6e; --bad-soft:#3d1f1c;
  --c1:#e3a93a; --c2:#6aa1e0; --c3:#ea7a62; --c4:#a888d8; --c5:#4cb47b; --c6:#6db4bf; --c7:#d982b4;
  color-scheme:dark }}
:root[data-theme="dark"]{
  --bg:#111613; --panel:#181e1b; --panel-2:#1d2420; --ink:#e2eae4; --muted:#93a29a; --faint:#56625c; --rt1:#c9a465; --rt2:#6fbf7b; --rt3:#e8954a; --rt4:#6aa5e0; --rt5:#55c0c0; --rt6:#a98ae0; --rt7:#ad977f; --rt8:#e07aa9; --rt9:#8c9cad; --rt10:#bcc45a; --line:#2d3732; --line-2:#242c28;
  --accent:#4cb47b; --accent-ink:#0d1a12; --accent-soft:#1d3327;
  --brand-blue:#5aaee8; --brand-green:#0cb14b; --brand-grey:#c9cfd3;
  --warn:#e39a52; --warn-soft:#3a2a19; --bad:#f07a6e; --bad-soft:#3d1f1c;
  --c1:#e3a93a; --c2:#6aa1e0; --c3:#ea7a62; --c4:#a888d8; --c5:#4cb47b; --c6:#6db4bf; --c7:#d982b4;
  color-scheme:dark }
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--f-ui);font-size:15px;line-height:1.45}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--panel)}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.wrap{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}

/* top */
header.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--panel);border-bottom:1px solid var(--line)}
.top-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;padding-block:10px}
.brand{display:flex;align-items:center;gap:10px;min-width:0;flex:1 1 260px}
.bus{width:30px;height:30px;border-radius:5px;background:var(--accent);position:relative;flex:none}
.bus::before,.bus::after{content:"";position:absolute;left:6px;right:6px;height:3px;border-radius:2px;background:var(--accent-ink)}
.bus::before{top:10px}.bus::after{top:17px;opacity:.55}
.brand input{font-family:var(--f-label);font-weight:600;font-size:21px;border:1px solid transparent;background:transparent;padding:2px 6px;border-radius:4px;min-width:0;width:100%}
.brand input:hover{border-color:var(--line)}
.actions{display:flex;flex-wrap:wrap;gap:6px}
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--panel);padding:6px 12px;border-radius:var(--r);cursor:pointer;font-weight:500;font-size:14px;white-space:nowrap}
.btn:hover{border-color:var(--muted)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn.primary:hover{filter:brightness(1.07)}
.btn.small{padding:3px 9px;font-size:13px}
.btn.ghost{border-color:transparent;background:transparent}
.btn.ghost:hover{background:var(--panel-2)}
.btn.danger{color:var(--bad)}
.btn[data-armed]{background:var(--bad);color:#fff;border-color:var(--bad)}
.tabs{display:flex;gap:2px;overflow-x:auto}
.tab{border:0;background:transparent;padding:9px 14px;font-family:var(--f-label);font-weight:600;font-size:16px;letter-spacing:.03em;text-transform:uppercase;color:var(--muted);border-bottom:3px solid transparent;cursor:pointer;white-space:nowrap}
.tab[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--accent)}
.tab .pill{margin-left:6px}

.pill{display:inline-block;font-family:var(--f-mono);font-size:11px;padding:1px 6px;border-radius:10px;background:var(--panel-2);border:1px solid var(--line);color:var(--muted);letter-spacing:0;text-transform:none;vertical-align:middle}
.pill.bad{background:var(--bad-soft);border-color:transparent;color:var(--bad)}
.pill.ok{background:var(--accent-soft);border-color:transparent;color:var(--accent)}
.pill.warn{background:var(--warn-soft);border-color:transparent;color:var(--warn)}

main{padding-block:18px 60px}
.label{font-family:var(--f-label);font-weight:600;text-transform:uppercase;letter-spacing:.06em;font-size:12.5px;color:var(--muted)}
h2{font-family:var(--f-label);font-weight:600;font-size:24px;margin:0;text-wrap:balance}
h3{font-family:var(--f-label);font-weight:600;font-size:18px;margin:0}
p.hint{color:var(--muted);margin:4px 0 0;max-width:68ch;font-size:14px}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}

/* plan */
.plan{display:grid;grid-template-columns:290px minmax(0,1fr);gap:18px;align-items:start}
.tree{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:8px;position:sticky;top:calc(env(safe-area-inset-top,0px) + 112px);max-height:calc(100vh - 140px);overflow:auto}
.node{display:flex;align-items:center;gap:6px;padding:5px 6px;border-radius:4px;cursor:pointer;min-width:0}
.node:hover{background:var(--panel-2)}
.node.sel{background:var(--accent-soft)}
.node .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.node.b .nm{font-weight:600}
.node.f{padding-left:22px}
.node.r{padding-left:40px;font-size:14px}
.node .kind{font-family:var(--f-label);font-size:11px;font-weight:600;letter-spacing:.06em;color:var(--muted);text-transform:uppercase;width:36px;flex:none}
.caret{width:18px;height:18px;flex:none;border:0;background:none;cursor:pointer;color:var(--muted);padding:0;font-size:9px;line-height:1;display:inline-flex;align-items:center;justify-content:center;border-radius:3px;font-family:system-ui,"Segoe UI Symbol",sans-serif}
.caret:hover{background:var(--line-2);color:var(--ink)}
.tw-ar{display:inline-flex;transition:transform .15s}
.tw-ar svg{width:11px;height:11px;fill:currentColor;stroke:currentColor;stroke-width:1.2;stroke-linejoin:round}
.caret{color:var(--ink);opacity:.7}
.caret:hover{opacity:1}
.tw-ar.open{transform:rotate(90deg)}
.dots{display:flex;gap:2px;flex:none}
.dot{width:7px;height:7px;border-radius:50%;background:var(--muted)}
.dot.off{opacity:.3}
.tree-root{display:flex;justify-content:space-between;align-items:center;padding:4px 6px 8px;border-bottom:1px solid var(--line-2);margin-bottom:6px}
.tree-add{margin-top:8px;display:flex;flex-wrap:wrap;gap:6px;padding:6px}
.node[draggable="true"],.storey-label,.room-tile[draggable="true"]{cursor:grab}
.dragging{opacity:.4}
[data-drag].drop-before{box-shadow:inset 0 3px 0 var(--accent)}
[data-drag].drop-after{box-shadow:inset 0 -3px 0 var(--accent)}
[data-drag][data-axis="x"].drop-before{box-shadow:inset 3px 0 0 var(--accent)}
[data-drag][data-axis="x"].drop-after{box-shadow:inset -3px 0 0 var(--accent)}
[data-drag].drop-into{background:var(--accent-soft);outline:1px dashed var(--accent);outline-offset:-1px}
.section-draw + .tree-hint{margin:8px 0 0}
.tree-hint{font-size:12px;color:var(--muted);padding:2px 6px 0}

.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:18px;min-width:0}
.stack{display:flex;flex-direction:column;gap:18px}
.crumbs{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:13px;color:var(--muted);margin-bottom:6px}
.crumbs button{border:0;background:none;padding:0;cursor:pointer;color:var(--muted);text-decoration:underline;text-underline-offset:2px}
.edit-head{display:flex;flex-wrap:wrap;gap:12px;align-items:end;justify-content:space-between}
.fields{display:flex;flex-wrap:wrap;gap:10px;align-items:end}
.field{display:flex;flex-direction:column;gap:3px;min-width:0}
.field input,.field select,.inp{border:1px solid var(--line);background:var(--panel);border-radius:4px;padding:6px 8px;min-width:0}
.field input.big{font-family:var(--f-label);font-size:22px;font-weight:600;padding:3px 8px;width:260px;max-width:100%}
.field input.short{width:90px}
.toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.sep{width:1px;align-self:stretch;background:var(--line)}

/* building section */
.section-draw{border:1px solid var(--line);border-radius:var(--r);background:var(--panel-2);padding:16px 16px 0;overflow-x:auto}
.storey{display:grid;grid-template-columns:110px minmax(0,1fr);border:2px solid var(--ink);border-bottom:0;background:var(--panel);min-width:420px}
.storey:first-child{border-radius:4px 4px 0 0}
.storey-label{border-right:2px solid var(--ink);padding:8px 10px;cursor:pointer;display:flex;flex-direction:column;justify-content:center}
.storey-label:hover{background:var(--accent-soft)}
.storey-label b{font-family:var(--f-label);font-size:16px;font-weight:600}
.storey-rooms{display:flex;flex-wrap:wrap;gap:0;min-height:62px}
.room-tile{border-right:1px dashed var(--line);padding:8px 10px;min-width:96px;cursor:pointer;display:flex;flex-direction:column;gap:6px;justify-content:space-between}
.room-tile:hover{background:var(--accent-soft)}
.room-tile .nm{font-weight:500;font-size:14px}
.room-tile.empty{color:var(--muted);font-style:italic;cursor:default}
.room-tile.empty:hover{background:none}
.ground{height:14px;border-top:2px solid var(--ink);margin:0 -16px;background:repeating-linear-gradient(135deg,var(--line) 0 2px,transparent 2px 9px);min-width:452px}
.bld-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin:0 0 8px}
.bld-card{cursor:pointer;transition:border-color .15s}
.bld-card:hover{border-color:var(--accent)}
.bld-card:hover .bld-head h3{color:var(--accent)}

/* floor grid */
.room-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.room-card{border:1px solid var(--line);border-radius:var(--r);padding:12px;background:var(--panel-2);cursor:pointer;display:flex;flex-direction:column;gap:8px;min-width:0}
.room-card:hover{border-color:var(--accent)}
.room-card .nm{font-weight:600}
.dev-mini{display:flex;flex-direction:column;gap:3px;font-size:13px}
.dev-mini div{display:flex;align-items:center;gap:6px;min-width:0}
.dev-mini span.t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dev-mini .off{opacity:.45}

/* palette */
.palette{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--panel);border-radius:20px;padding:5px 12px 5px 9px;cursor:pointer;font-size:14px;white-space:nowrap}
.chip:hover{border-color:var(--ink)}
.chip .plus{font-family:var(--f-mono);color:var(--muted)}
.chip.sm{padding:3px 10px;font-size:13px}

/* device card */
.devs{display:flex;flex-direction:column;gap:12px}
.dev{border:1px solid var(--line);border-left:5px solid var(--dc,var(--muted));border-radius:var(--r);background:var(--panel)}
.dev.inactive{opacity:.55}
.dev-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:10px 12px;border-bottom:1px solid var(--line-2)}
.dev-head input.name{font-weight:600;border:1px solid transparent;background:transparent;padding:3px 6px;border-radius:4px;width:170px;max-width:100%}
.dev-head input.name:hover,.dev-head input.name:focus{border-color:var(--line)}
.dev-head .type{font-size:13px;color:var(--muted)}
.dev-head .spacer{flex:1}
.nr{display:flex;align-items:center;gap:5px;font-size:13px;color:var(--muted)}
.nr input{width:62px;border:1px solid var(--line);border-radius:4px;padding:3px 6px;background:var(--panel);font-family:var(--f-mono)}
.switch{display:inline-flex;align-items:center;gap:6px;font-size:13px;cursor:pointer;user-select:none}
.switch input{appearance:none;width:32px;height:18px;border-radius:9px;background:var(--line);position:relative;cursor:pointer;margin:0;flex:none;transition:background .15s}
.switch input::after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:var(--panel);transition:left .15s}
.switch input:checked{background:var(--accent)}
.switch input:checked::after{left:16px}
.tw{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:14px}
th{text-align:left;font-family:var(--f-label);font-weight:600;text-transform:uppercase;letter-spacing:.05em;font-size:12px;color:var(--muted);padding:6px 10px;border-bottom:1px solid var(--line)}
td{padding:5px 10px;border-bottom:1px solid var(--line-2);vertical-align:middle}
tr:last-child td{border-bottom:0}
td.addr{font-family:var(--f-mono);font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:600}
.addr i{font-style:normal;color:var(--muted);font-weight:400;padding:0 1px}
td.nm{min-width:220px}
/* Enhetstabellene: faste kolonnebredder så kolonnene står under hverandre i alle enheter */
table.dev-table{table-layout:fixed;min-width:560px}
table.dev-table col.c-cb{width:40px}
table.dev-table col.c-addr{width:96px}
table.dev-table col.c-fn{width:200px}
table.dev-table col.c-dpt{width:90px}
table.dev-table td{overflow-wrap:anywhere}
table.dev-table td.nm{min-width:0}
table.rl-gas{table-layout:fixed;width:100%}
.rl-gas td.addr{width:70px}
.rl-gas td.rl-role{width:150px}
.rl-gas td{overflow-wrap:anywhere}
td.dpt{font-family:var(--f-mono);font-size:12.5px;color:var(--muted);white-space:nowrap}
tr.off td{color:var(--faint)}
tr.off td.addr{font-weight:400}
tr.conf td.addr{color:var(--bad)}
.cb{width:16px;height:16px;accent-color:var(--accent);cursor:pointer;margin:0}

/* address view */
.summary{display:flex;flex-wrap:wrap;gap:10px}
.stat{width:160px;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);padding:8px 12px;display:flex;flex-direction:column;gap:2px}
.stat b{order:-1}
@media (max-width:420px){.stat{width:calc(50% - 5px)}}
.stat b{display:block;font-family:var(--f-label);font-size:24px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.1}
.stat .label{font-size:11.5px}
.seg-list{display:flex;flex-direction:column;gap:6px}
.seg{display:grid;grid-template-columns:54px minmax(0,1fr) 140px 74px;gap:12px;align-items:center;font-size:14px}
.seg .hg{font-family:var(--f-mono);font-weight:600}
.bar{height:8px;border-radius:4px;background:var(--line-2);overflow:hidden}
.bar span{display:block;height:100%;background:var(--accent)}
.bar span.warn{background:var(--warn)}.bar span.bad{background:var(--bad)}
tr.hgrow td{background:var(--panel-2);font-family:var(--f-label);font-weight:600;font-size:15px;letter-spacing:.02em;padding-top:10px}
tr.mgrow td{font-family:var(--f-label);font-weight:600;color:var(--muted);font-size:14px}
tr.click{cursor:pointer}
tr.click:hover td{background:var(--accent-soft)}
.where{font-size:13px;color:var(--muted);white-space:nowrap}

/* settings */
.modes{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.mode{border:2px solid var(--line);border-radius:var(--r);padding:14px;cursor:pointer;background:var(--panel);display:flex;flex-direction:column;gap:6px}
.mode:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.mode input{position:absolute;opacity:0}
.mode b{font-family:var(--f-label);font-size:18px;font-weight:600}
.mode .ex{font-family:var(--f-mono);font-size:12.5px;color:var(--muted);line-height:1.6}
.tokens{display:flex;flex-wrap:wrap;gap:6px}
.tok{font-family:var(--f-mono);font-size:12.5px;border:1px dashed var(--line);background:var(--panel-2);border-radius:4px;padding:2px 7px;cursor:pointer}
.tok:hover{border-color:var(--accent);color:var(--accent)}
.preview{display:flex;flex-direction:column;gap:4px;font-size:14px;border:1px solid var(--line-2);background:var(--panel-2);border-radius:4px;padding:10px 12px}
.preview div{display:flex;gap:14px}
.preview .mono{width:70px;flex:none;font-weight:600}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}
input.hg-in{width:64px;font-family:var(--f-mono)}

/* templates */
.tpl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:14px}
.tpl{border:1px solid var(--line);border-top:4px solid var(--dc,var(--muted));border-radius:var(--r);background:var(--panel);padding:12px;display:flex;flex-direction:column;gap:10px;min-width:0}
.tpl table input,.tpl table select,.dom-table input,.dom-table select{border:1px solid var(--line);background:var(--panel);border-radius:4px;padding:3px 6px;width:100%;min-width:0}
.tpl td{padding:3px 4px}
.mg-names{display:grid;grid-template-columns:repeat(8,minmax(60px,1fr));gap:4px}
.mg-names label{display:flex;flex-direction:column;font-size:11px;color:var(--muted);font-family:var(--f-mono)}
.mg-names input{border:1px solid var(--line);background:var(--panel);border-radius:4px;padding:3px 5px;font-size:12.5px;min-width:0}
.dom-card{border:1px solid var(--line);border-left:5px solid var(--dc);border-radius:var(--r);padding:12px;display:flex;flex-direction:column;gap:10px;background:var(--panel)}
.colors{display:flex;gap:4px}
.colors button{width:18px;height:18px;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0}
.colors button[aria-pressed="true"]{border-color:var(--ink)}

.issues{display:flex;flex-direction:column;gap:6px}
.issue{border-radius:4px;padding:7px 10px;font-size:14px;background:var(--bad-soft);color:var(--bad)}
.issue.warn{background:var(--warn-soft);color:var(--warn)}

/* romliste */
.rl-progress{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;font-size:13px;color:var(--muted)}
.rl-steps{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:4px;font-size:14px;max-width:80ch}
.rl-floor{display:flex;flex-direction:column;gap:10px}
.rl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,360px),1fr));gap:12px}
.rl-room{border:1px solid var(--line);border-radius:var(--r);background:var(--panel-2);padding:10px;display:flex;flex-direction:column;gap:8px;min-width:0}
.rl-head{display:flex;justify-content:space-between;align-items:center;gap:8px}
.rl-fn{background:var(--panel);border:1px solid var(--line-2);border-left:4px solid var(--dc);border-radius:4px;padding:8px 10px;display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;min-width:0}
.rl-fn.done{opacity:.6}
.rl-fn.done .rl-name{text-decoration:line-through}
.rl-check{display:flex;align-items:center;gap:8px;flex:1;min-width:0;cursor:pointer;font-weight:600}
.rl-gas{flex-basis:100%;font-size:13px}
.rl-gas td{padding:2px 6px 2px 0;border:0}
.rl-gas td.addr{width:70px}
.rl-gas td.nm{min-width:0;color:var(--muted)}
.rl-role{white-space:nowrap;width:150px}
.empty-state{border:1px dashed var(--line);border-radius:var(--r);padding:22px;text-align:center;color:var(--muted)}

/* modal + toast */
.modal{position:fixed;inset:0;background:rgba(10,16,12,.5);display:flex;align-items:center;justify-content:center;z-index:20;padding:16px}
.modal-box{background:var(--panel);border-radius:8px;border:1px solid var(--line);width:min(760px,100%);max-height:90vh;display:flex;flex-direction:column;gap:10px;padding:16px}
.modal-box textarea{width:100%;flex:1;min-height:300px;font-family:var(--f-mono);font-size:12.5px;background:var(--panel-2);color:var(--ink);border:1px solid var(--line);border-radius:4px;padding:8px}
.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:8px 16px;border-radius:6px;font-size:14px;z-index:30}

@media (max-width:820px){
  .plan{grid-template-columns:1fr}
  .tree{position:static;max-height:320px}
  .seg{grid-template-columns:48px minmax(0,1fr) 70px}
  .seg .bar{display:none}
  .mg-names{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* Etasjer som egne bokser */
.floors{display:flex;flex-direction:column;gap:10px}
.floor-box{border:1px solid var(--line);border-radius:8px;background:var(--panel);padding:10px 12px 12px;display:flex;flex-direction:column;gap:10px;transition:border-color .15s}
.floor-box:hover{border-color:var(--muted)}
.floor-head{display:flex;align-items:center;gap:10px;cursor:grab;border-radius:4px;padding:2px 4px;margin:-2px -4px}
.floor-head:hover b{color:var(--accent)}
.floor-head b{font-family:var(--f-label);font-weight:600;font-size:17px}
.floor-meta{font-size:13px;color:var(--muted);margin-left:auto;white-space:nowrap}
.grip{width:10px;height:16px;flex:none;background-image:radial-gradient(var(--muted) 1.2px,transparent 1.4px);background-size:5px 5px;opacity:.7}
.floor-rooms{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px}
.room-box{border:1px solid var(--line-2);border-radius:6px;background:var(--panel-2);padding:8px 10px;display:flex;flex-direction:column;gap:8px;min-height:62px;justify-content:space-between;cursor:grab;transition:border-color .15s,background .15s;min-width:0}
.room-box:hover{border-color:var(--accent);background:var(--accent-soft)}
.room-box .nm{font-weight:500;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.room-foot{display:flex;align-items:center;gap:6px;min-height:8px}
.room-foot .cnt{margin-left:auto;font-family:var(--f-mono);font-size:11px;color:var(--muted)}
.room-empty{grid-column:1/-1;border:1px dashed var(--line);border-radius:6px;padding:12px;color:var(--muted);font-size:13px;text-align:center}
.floors .ground{height:10px;margin:2px 0 0;border-top:2px solid var(--muted);background:repeating-linear-gradient(135deg,var(--line) 0 2px,transparent 2px 8px);min-width:0;border-radius:0 0 4px 4px}
.floor-box.drop-before{box-shadow:0 -3px 0 var(--accent)}
.floor-box.drop-after{box-shadow:0 3px 0 var(--accent)}
.room-box[data-axis="x"].drop-before{box-shadow:-3px 0 0 var(--accent)}
.room-box[data-axis="x"].drop-after{box-shadow:3px 0 0 var(--accent)}
.floor-box.drop-into{outline:2px dashed var(--accent);outline-offset:2px;background:var(--panel)}
.floors + .tree-hint{margin:8px 0 0}

/* Romtyper */
.rt-card table td{padding:3px 4px}
.rt-card .rt-acts{white-space:nowrap;width:1%}
.rt-card .rt-add{align-self:flex-start;max-width:100%}

/* Kopier enheter */
.copy-box{width:min(820px,100%)}
.copy-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:16px}
.copy-list{border:1px solid var(--line);border-radius:6px;max-height:46vh;overflow:auto;padding:4px;background:var(--panel)}
.copy-row{display:flex;align-items:center;gap:8px;padding:5px 6px;border-radius:4px;cursor:pointer;font-size:14px;min-width:0}
.copy-row:hover{background:var(--panel-2)}
.copy-row .where{margin-left:auto;white-space:nowrap}
.copy-row.head{font-size:13px}
.copy-row.sub{padding-left:28px}
.copy-floor+.copy-floor{border-top:1px solid var(--line-2);margin-top:4px;padding-top:4px}
@media (max-width:640px){.copy-cols{grid-template-columns:1fr}}

/* Gruppeadresser som bokser i rommet */
.fn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px;padding:10px 12px 12px}
.fn-box{border:1px solid var(--line-2);border-radius:6px;background:var(--panel-2);padding:8px 10px;display:flex;flex-direction:column;gap:4px;min-width:0}
.fn-top{display:flex;align-items:center;gap:8px;min-width:0}
.fn-name{font-weight:600;font-size:14px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fn-dpt{font-family:var(--f-mono);font-size:11.5px;color:var(--muted);white-space:nowrap}
.fn-addr{font-family:var(--f-mono);font-variant-numeric:tabular-nums;font-weight:600;font-size:18px;letter-spacing:.01em}
.fn-addr i{font-style:normal;color:var(--muted);font-weight:400;padding:0 1px}
.fn-ga{font-size:12.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fn-box.off{opacity:.5}
.fn-box.off .fn-addr{font-weight:400}
.fn-box.conf{border-color:var(--bad);background:var(--bad-soft)}
.fn-box.conf .fn-addr{color:var(--bad)}
.seg-toggle{display:inline-flex}
.seg-toggle .btn{border-radius:0}
.seg-toggle .btn:first-child{border-radius:var(--r) 0 0 var(--r)}
.seg-toggle .btn:last-child{border-radius:0 var(--r) var(--r) 0;margin-left:-1px}
.seg-toggle .btn[aria-pressed="true"]{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);position:relative}

/* Bygninger som kvadratiske bokser på oversikten */
.bld-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.bld-tile{aspect-ratio:1;display:flex;flex-direction:column;gap:6px;text-align:left;border:1px solid var(--line);border-top:5px solid var(--bk,var(--c2));border-radius:8px;background:var(--panel);padding:14px;cursor:pointer;font:inherit;color:inherit;min-width:0;overflow:hidden;transition:box-shadow .15s,transform .15s}
.bld-tile:hover{box-shadow:0 3px 12px rgba(0,0,0,.10);transform:translateY(-1px)}
.bld-tile.k-ute{--bk:var(--c5)}.bld-tile.k-felles{--bk:var(--c4)}
.bt-kind{flex:none;font-family:var(--f-label);font-weight:600;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.bt-name{flex:none;font-weight:600;font-size:19px;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bt-draw{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:3px;min-height:0;overflow:hidden;padding:6px 0 2px}
.bt-draw.empty{justify-content:center;color:var(--muted);font-size:14px}
.bt-floor{display:flex;align-items:center;gap:8px;min-width:0}
.bt-fn{flex:none;width:44px;font-family:var(--f-mono);font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right}
.bt-rooms{display:flex;gap:3px;flex-wrap:nowrap;min-width:0;padding:3px;border:1px solid var(--line);border-radius:3px;background:var(--panel-2);min-height:17px;align-items:center;flex:1}
.bt-rooms i{flex:0 1 14px;min-width:6px;height:10px;border-radius:2px;background:var(--rtc)}
.bt-rooms em{font-style:normal;font-size:11px;color:var(--muted);padding:0 2px;white-space:nowrap}
.bt-more{font-size:12px;color:var(--muted);padding-left:52px}
.bt-ground{height:5px;margin:2px 0 0 52px;background:repeating-linear-gradient(135deg,var(--line) 0 2px,transparent 2px 6px);border-top:2px solid var(--muted)}
.bt-draw.flat .bt-floor{gap:0}
.bt-foot{flex:none;display:flex;flex-direction:column;gap:1px;font-size:13px;color:var(--muted)}
.bld-tile.rm-tile{border-top-color:var(--bk)}
.rt-devs{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;gap:3px;font-size:13px;margin-top:4px}
.rt-devs>span{display:flex;align-items:center;gap:6px;min-width:0}
.rt-devs .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rt-devs .a{font-family:var(--f-mono);font-size:12px;color:var(--muted)}
.rt-devs .off{color:var(--faint)}
.rt-devs .off .dot{opacity:.45}
.rt-devs .more{font-size:12px;color:var(--muted)}
.ft-rooms{flex:1;min-height:0;overflow:hidden;display:flex;flex-wrap:wrap;align-content:flex-start;gap:5px;padding-top:6px}
.ft-rooms span{font-size:13px;line-height:1.1;padding:6px 8px;border-radius:3px;border-left:3px solid var(--rtc);background:color-mix(in srgb,var(--rtc) 16%,var(--panel-2));max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bld-tile .go{cursor:pointer;transition:background-color .12s,box-shadow .12s}
.bt-floor.go{border-radius:4px;margin:0 -4px;padding:1px 4px}
.bt-floor.go:hover{background:var(--accent-soft)}
.bt-floor.go:hover .bt-fn{color:var(--accent);font-weight:600}
.bt-floor.go:hover .bt-rooms{border-color:var(--accent)}
.ft-rooms span.go:hover{background:color-mix(in srgb,var(--rtc) 34%,var(--panel-2));box-shadow:0 0 0 1px var(--rtc)}
.ft-rooms em{font-style:normal;font-size:12px;color:var(--muted);align-self:center}
.bld-tile.gl-tile{--bk:var(--c7)}
.gt-cats{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;gap:3px;font-size:13px;margin-top:4px}
.gt-cats>span{display:flex;align-items:center;gap:8px;min-width:0}
.gt-cats .a{flex:none;width:38px;font-family:var(--f-mono);font-size:12px;color:var(--muted)}
.gt-cats .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gt-cats .n{font-family:var(--f-mono);font-size:12px;color:var(--muted)}
.gt-cats .off{color:var(--faint)}
.node.g .nm{font-weight:600}
.gc-lines{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;gap:2px;font-size:13px;margin-top:4px}
.gl-line{display:flex;align-items:center;gap:8px;min-width:0;border-radius:4px;margin:0 -4px;padding:2px 4px;color:var(--faint)}
.gl-line.on{color:var(--ink)}
.gl-line:hover{background:var(--accent-soft)}
.gl-line .ck{flex:none;width:14px;height:14px;border:1.5px solid var(--muted);border-radius:3px;box-sizing:border-box;display:flex;align-items:center;justify-content:center}
.gl-line.on .ck{background:var(--accent);border-color:var(--accent)}
.gl-line.on .ck::after{content:"";width:3px;height:7px;border:solid var(--accent-ink);border-width:0 2px 2px 0;transform:translateY(-1px) rotate(45deg)}
.gl-line .a{flex:none;width:52px;font-family:var(--f-mono);font-size:12px;color:var(--muted)}
.gl-line .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gc-lines .more{font-size:12px;color:var(--muted)}
.gc-lines .empty{color:var(--muted)}
.bld-tile.add{cursor:default;border-style:dashed;border-top:1px dashed var(--line);background:transparent;justify-content:center;align-items:center;text-align:center}
.bld-tile.add:hover{box-shadow:none;transform:none}
.bld-tile.ar-tile{border-top-color:var(--bk)}
.bld-tile.ar-tile.inactive{opacity:.6}
.bld-tile.ar-tile.conf{border-color:var(--bad)}
.ar-gas{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;gap:3px;font-size:13px;margin-top:4px}
.ar-gas>span{display:flex;align-items:center;gap:8px;min-width:0}
.ar-gas .a{flex:none;width:52px;font-family:var(--f-mono);font-size:12px;color:var(--muted)}
.ar-gas .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ar-gas .off{color:var(--faint)}
.ar-gas .conf .a{color:var(--bad)}
.ar-gas .more{font-size:12px;color:var(--muted)}
.bt-add select{font:inherit;font-size:14px;padding:6px 8px;border:1px solid var(--line);border-radius:5px;background:var(--panel);color:var(--ink);max-width:100%}
.bt-note{font-size:12px;color:var(--muted);margin-top:6px}
.bld-tile.add .bt-name{color:var(--muted);font-weight:500}
.bt-add{display:flex;flex-direction:column;gap:6px;margin-top:8px}
@media (prefers-reduced-motion:reduce){.bld-tile{transition:none}.bld-tile:hover{transform:none}}

/* Enheter som kvadratiske bokser, detaljer ved klikk */
.dev-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.dev-tile{aspect-ratio:1;display:flex;flex-direction:column;gap:6px;text-align:left;border:1px solid var(--line);border-top:5px solid var(--dc);border-radius:8px;background:var(--panel);padding:12px;cursor:pointer;font:inherit;color:inherit;min-width:0;transition:box-shadow .15s,transform .15s}
.dev-tile:hover{box-shadow:0 3px 12px rgba(0,0,0,.10);transform:translateY(-1px)}
.dt-type{font-family:var(--f-label);font-weight:600;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.dt-name{font-weight:600;font-size:16px;line-height:1.25;overflow-wrap:anywhere;flex:1}
.dt-foot{display:flex;justify-content:space-between;align-items:baseline;gap:6px;font-size:12px;color:var(--muted)}
.dt-nr{font-family:var(--f-mono);font-size:14px;color:var(--ink);font-weight:600}
.dev-tile.inactive{opacity:.5}
.dev-tile.conf{border-color:var(--bad);border-top-color:var(--bad)}
.dev-tile.conf .dt-foot span:last-child{color:var(--bad)}
.dev-modal{width:min(1000px,100%);overflow:auto}
.dm-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
@media (prefers-reduced-motion:reduce){.dev-tile{transition:none}.dev-tile:hover{transform:none}}

/* To størrelser på enhetsboksene */
.dt-gas{display:none}
.dev-tiles.large{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.dev-tiles.large .dt-name{flex:none;font-size:17px}
.dev-tiles.large .dt-gas{display:flex;flex-direction:column;gap:4px;flex:1;margin-top:6px}
.dt-ga{display:flex;gap:10px;align-items:baseline;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted);font-size:13px}
.dt-ga b{font-family:var(--f-mono);font-weight:600;color:var(--ink);min-width:54px;font-size:13px;font-variant-numeric:tabular-nums}
.dt-ga.off{opacity:.5}
.dt-ga.conf b{color:var(--bad)}
.dt-more{font-size:12px;color:var(--muted)}

/* Fellesfunksjoner og «legg til i flere rom» */
.area-sec details summary{cursor:pointer;width:max-content}
.area-sec h3{font-size:18px}
.copy-row.sub2{padding-left:50px}

/* Felles telegrammer */
.gl-table td{padding:4px 6px}
.gl-table input.inp{width:100%;padding:4px 6px}
.gl-table tr.off td.addr{color:var(--faint);font-weight:400;text-decoration:none}
.gl-table tr.off input.inp{color:var(--faint)}
tr.off td.addr i{color:inherit}

.gl-table tr.conf td.addr{color:var(--bad)}
.gl-cat .edit-head{align-items:center}

/* Fjern enheter */
.btn.danger-fill{background:var(--bad);border-color:var(--bad);color:#fff}
.btn.danger-fill:disabled{opacity:.5;cursor:default}
.del-warn{color:var(--bad);font-size:13.5px;font-weight:500}

/* Bekreftelsesdialog */
#confirmDlg .confirm-modal{z-index:40}
.confirm-box{width:min(460px,100%);gap:12px;padding:20px 22px}
.confirm-box h3{font-size:20px;line-height:1.3;text-wrap:balance}
.cf-body{margin:0;font-size:14.5px;line-height:1.5}
.confirm-box .del-warn{margin:0}
.cf-btns{display:flex;justify-content:flex-end;gap:8px;margin-top:6px}

/* Knapper uten noe å gjøre skjules */
#main .toolbar .btn:disabled,#main .fields .btn:disabled,.dm-head .btn:disabled{display:none}
.dev-head .btn:disabled,.rt-acts .btn:disabled{visibility:hidden}

/* Romfarger etter romtype */
.room-box,.room-card{border-left:4px solid var(--rtc,var(--line));background:color-mix(in srgb,var(--rtc,transparent) 10%,var(--panel-2))}
.room-box:hover,.room-card:hover{background:color-mix(in srgb,var(--rtc,transparent) 20%,var(--panel-2));border-left-color:var(--rtc,var(--accent))}
.rt-sw{width:4px;height:16px;border-radius:2px;flex:none;margin-right:2px}
.node.r{padding-left:34px}

/* Utvendig uten etasjenivå */
.node.r.flat{padding-left:22px}

/* Bryter for eksport øverst til høyre i boksene */
.tile-wrap{position:relative;min-width:0;display:flex}
.tile-wrap>.bld-tile,.tile-wrap>.dev-tile{flex:1;min-width:0}
.tile-wrap .bt-kind,.tile-wrap .dt-type{padding-right:44px}
.exp-sw{position:absolute;top:14px;right:12px;width:34px;height:20px;border-radius:10px;border:0;padding:0;background:var(--line);cursor:pointer}
.exp-sw::before{content:"";position:absolute;inset:-8px}
.exp-sw span{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.3);transition:left .15s}
.exp-sw.on{background:var(--accent)}
.exp-sw.on span{left:16px}
.exp-sw:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.tile-wrap .dev-tile+.exp-sw{top:16px}
.bld-tile.noexp{opacity:.55}
.node.noexp .nm{color:var(--faint)}
@media (prefers-reduced-motion:reduce){.exp-sw span{transition:none}}

/* Av/på for eksport: slått av her eller ute via nivået over */
.bld-tile.noexp.own{border-style:dashed}
.bt-nx{font-weight:600;flex-basis:100%}
.bld-tile.noexp.inh .bt-nx{font-weight:500;font-style:italic}
.exp-sw.on.inh{background:repeating-linear-gradient(135deg,var(--accent) 0 4px,var(--line) 4px 8px)}
.dev-tile.inactive.own{border-style:dashed}
.node.own .nm::after{content:"av";margin-left:6px;padding:0 5px;border:1px solid var(--line);border-radius:8px;font-size:10px;font-weight:600;vertical-align:1px}
.exp-off{border:1px dashed var(--line);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:8px}
.exp-off-head{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap}
.exp-off-head .hint{margin:2px 0 0}
.exp-off-list{display:flex;flex-wrap:wrap;gap:6px}
.exp-chip{font:inherit;font-size:13px;border:1px solid var(--line);background:var(--panel-2,transparent);color:inherit;border-radius:14px;padding:3px 10px;cursor:pointer;display:inline-flex;gap:6px;align-items:baseline}
.exp-chip:hover{border-color:var(--accent)}
.exp-chip .k{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.exp-more{font-size:13px;color:var(--muted);align-self:center}