*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Inter',sans-serif;background:#0f1117;color:#e2e8f0;height:100vh;display:flex;flex-direction:column;overflow:hidden}

/* ── Topbar ── */
#topbar{background:#1a1d27;border-bottom:1px solid #2d3148;display:flex;align-items:center;padding:0 16px;height:52px;gap:12px;z-index:2000;flex-shrink:0}
.logo{display:flex;align-items:center;gap:9px;font-weight:700;font-size:15px;color:#fff;white-space:nowrap}
.logo-icon{width:32px;height:32px;background:linear-gradient(135deg,#3b82f6,#1d4ed8);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}
.top-divider{width:1px;height:28px;background:#2d3148;flex-shrink:0}
.top-nav{display:flex;gap:2px}
.tab-btn{color:#94a3b8;font-size:12px;font-weight:500;padding:7px 13px;border-radius:6px;cursor:pointer;display:flex;align-items:center;gap:6px;border:none;background:none;transition:all .15s;white-space:nowrap}
.tab-btn:hover{background:#2d3148;color:#e2e8f0}
.tab-btn.active{background:#1e3a5f;color:#60a5fa;font-weight:600}
.top-right{display:flex;align-items:center;gap:10px;margin-left:auto}
.badge-crit{background:#ef4444;color:#fff;font-size:10px;font-weight:700;padding:2px 7px;border-radius:10px;cursor:pointer}
.badge-warn{background:#f59e0b;color:#000;font-size:10px;font-weight:700;padding:2px 7px;border-radius:10px}
.top-status{font-size:11px;color:#64748b;display:flex;align-items:center;gap:5px}
.user-av{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,#6366f1,#8b5cf6);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;cursor:pointer;flex-shrink:0}

/* ── Views ── */
#main{flex:1;overflow:hidden;position:relative}
.view{position:absolute;inset:0;display:none;overflow:hidden}
.view.active{display:flex}

/* ══ KART VIEW ══ */
#view-kart{flex-direction:row}
#sidebar{width:310px;background:#12151f;border-right:1px solid #1e2235;display:flex;flex-direction:column;flex-shrink:0;overflow:hidden}
.sb-header{padding:12px 14px 8px;border-bottom:1px solid #1e2235;display:flex;align-items:center;justify-content:space-between}
.sb-header h2{font-size:12px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.5px}
.sb-hlink{font-size:11px;color:#60a5fa;cursor:pointer;background:none;border:none}
.stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:10px 12px;border-bottom:1px solid #1e2235}
.stat-c{background:#1a1d27;border:1px solid #1e2235;border-radius:8px;padding:9px;text-align:center}
.stat-c .v{font-size:22px;font-weight:700;line-height:1}
.stat-c .l{font-size:10px;color:#475569;margin-top:2px}
.v-r{color:#f87171}.v-o{color:#fb923c}.v-g{color:#4ade80}.v-b{color:#60a5fa}
.wo-filters{display:flex;gap:5px;padding:8px 12px 6px;overflow-x:auto;border-bottom:1px solid #1e2235;flex-shrink:0}
.wo-filters::-webkit-scrollbar{height:0}
.fbtn{font-size:11px;padding:4px 10px;border-radius:12px;border:1px solid #2d3148;background:none;color:#94a3b8;cursor:pointer;white-space:nowrap;transition:all .15s}
.fbtn.active,.fbtn:hover{background:#2563eb;border-color:#2563eb;color:#fff}
.wo-list{flex:1;overflow-y:auto;padding:8px}
.wo-list::-webkit-scrollbar{width:4px}
.wo-list::-webkit-scrollbar-thumb{background:#2d3148;border-radius:4px}
.wo-card{background:#1a1d27;border:1px solid #1e2235;border-left:3px solid transparent;border-radius:8px;padding:9px 11px;margin-bottom:7px;cursor:pointer;transition:all .15s}
.wo-card:hover,.wo-card.sel{background:#1e2235;border-color:#374151}
.wo-card.p-crit{border-left-color:#ef4444}.wo-card.p-high{border-left-color:#f97316}
.wo-card.p-norm{border-left-color:#3b82f6}.wo-card.p-low{border-left-color:#22c55e}
.wo-card.p-done{border-left-color:#374151;opacity:.6}
.wo-id{font-size:10px;color:#64748b;font-family:monospace;font-weight:500}
.wo-ttl{font-size:12px;font-weight:600;color:#e2e8f0;margin:2px 0;line-height:1.3}
.wo-meta{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:3px}
.tag{font-size:10px;padding:2px 6px;border-radius:4px;font-weight:500}
.tr{background:#3b0a0a;color:#f87171}.to{background:#3a1a00;color:#fb923c}
.tb{background:#0e2548;color:#60a5fa}.tg{background:#052e16;color:#4ade80}.tgr{background:#1e2235;color:#64748b}
.wo-who{font-size:10px;color:#475569;display:flex;align-items:center;gap:3px;margin-left:auto}
#map-container{flex:1;position:relative;overflow:hidden}
#map{width:100%;height:100%}

/* SCADA alarm bar */
#scada-bar{position:absolute;top:0;left:0;right:0;z-index:1200;display:none;background:#1a0808;border-bottom:1px solid #7f1d1d}
#scada-bar.show{display:block}
.scada-inner{display:flex;align-items:center;gap:0;overflow-x:auto}
.scada-item{display:flex;align-items:center;gap:8px;padding:7px 14px;border-right:1px solid #3d0a0a;white-space:nowrap;cursor:pointer;transition:background .15s;flex-shrink:0}
.scada-item:hover{background:#3d0a0a}
.scada-sev{font-size:10px;font-weight:700;padding:2px 6px;border-radius:4px}
.sev-k{background:#ef4444;color:#fff}.sev-h{background:#f97316;color:#fff}.sev-m{background:#eab308;color:#000}
.scada-name{font-size:11px;color:#fca5a5;font-weight:500}
.scada-type{font-size:10px;color:#f87171}
.scada-time{font-size:10px;color:#6b7280}
.scada-ack{font-size:9px;color:#f97316}
.scada-close{margin-left:auto;padding:0 14px;color:#64748b;background:none;border:none;font-size:16px;cursor:pointer;flex-shrink:0}

/* Floating panels */
#weather-panel{position:absolute;top:10px;right:10px;background:#1a1d27e6;backdrop-filter:blur(12px);border:1px solid #2d3148;border-radius:10px;padding:11px 13px;min-width:195px;z-index:900;transition:right .25s ease}
#weather-panel.shifted{right:370px}
/* Layer panel dropdown */
#layer-panel{display:none;position:fixed;top:52px;background:#1a1d27;border:1px solid #2d3148;border-radius:0 0 10px 10px;z-index:1999;min-width:230px;box-shadow:0 8px 24px rgba(0,0,0,.6);max-height:calc(100vh - 70px);overflow-y:auto}
#layer-panel.show{display:block}
.lp-ttl{font-size:12px;font-weight:600;color:#e2e8f0;padding:10px 14px 6px;border-bottom:1px solid #2d3148}
.lp-sec{font-size:10px;color:#64748b;text-transform:uppercase;letter-spacing:.5px;padding:8px 14px 3px}
.lp-item{display:flex;align-items:center;gap:9px;padding:5px 14px;cursor:pointer;font-size:12px;color:#94a3b8;transition:background .1s;user-select:none}
.lp-item:hover{background:#1e2235;color:#e2e8f0}
.lp-item input[type=checkbox],.lp-item input[type=radio]{cursor:pointer;accent-color:#60a5fa;width:13px;height:13px}
.lp-sep{border-top:1px solid #2d3148;margin:4px 0}
.panel-title{font-size:10px;color:#64748b;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:7px}
.w-item{display:flex;justify-content:space-between;align-items:center;padding:4px 0;border-bottom:1px solid #1e2235}
.w-item:last-child{border-bottom:none}
.w-name{font-size:11px;color:#cbd5e1;font-weight:500}
.w-data{display:flex;gap:8px;font-size:11px}
.w-temp{color:#60a5fa}.w-wind{color:#94a3b8}
.w-warn{color:#f97316!important;font-weight:700}

/* Route bar */
#route-bar{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);background:#1a1d27e6;backdrop-filter:blur(12px);border:1px solid #2d3148;border-radius:10px;padding:9px 16px;z-index:900;display:flex;gap:14px;align-items:center;max-width:620px;width:calc(100% - 340px)}
.rb-info{display:flex;flex-direction:column}
.rb-label{font-size:10px;color:#64748b}
.rb-val{font-size:12px;font-weight:600;color:#e2e8f0}
.rb-div{width:1px;height:28px;background:#2d3148;flex-shrink:0}
.rb-btn{font-size:11px;padding:6px 13px;background:#2563eb;border:none;color:#fff;border-radius:6px;cursor:pointer;white-space:nowrap;flex-shrink:0}
.rb-btn:hover{background:#1d4ed8}
.rb-x{background:none;border:1px solid #2d3148;color:#64748b;padding:6px 10px;border-radius:6px;cursor:pointer;font-size:12px;flex-shrink:0}

/* AI panel */
#ai-panel{position:absolute;bottom:60px;right:10px;width:330px;background:#1a1d27;border:1px solid #2d3148;border-radius:12px;z-index:900;display:flex;flex-direction:column;max-height:430px;overflow:hidden;transition:max-height .2s,right .25s ease}
#ai-panel.shifted{right:370px}
#ai-panel.col{max-height:44px}
.ai-hdr{background:#1e2235;padding:10px 14px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;border-radius:12px 12px 0 0;flex-shrink:0}
#ai-panel.col .ai-hdr{border-radius:12px}
.ai-hdr-l{display:flex;align-items:center;gap:8px}
.ai-badge{width:24px;height:24px;background:linear-gradient(135deg,#6366f1,#8b5cf6);border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700}
.ai-ttl{font-size:12px;font-weight:600;color:#e2e8f0}
.ai-sub{font-size:10px;color:#64748b}
.ai-dot{width:6px;height:6px;background:#4ade80;border-radius:50%;animation:pulse 2s infinite;flex-shrink:0}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
.ai-msgs{flex:1;overflow-y:auto;padding:9px;display:flex;flex-direction:column;gap:7px;min-height:0}
.ai-msgs::-webkit-scrollbar{width:3px}
.ai-msgs::-webkit-scrollbar-thumb{background:#2d3148;border-radius:3px}
.msg{max-width:92%;font-size:12px;line-height:1.5;padding:7px 10px;border-radius:8px}
.msg-ai{background:#1e2235;color:#cbd5e1;align-self:flex-start;border-radius:4px 8px 8px 8px}
.msg-u{background:#1d3a6b;color:#bfdbfe;align-self:flex-end;border-radius:8px 4px 8px 8px}
.msg-t{font-size:9px;color:#4b5563;margin-top:2px}
.ai-sugs{display:flex;gap:5px;padding:7px 9px;overflow-x:auto;flex-shrink:0}
.ai-sugs::-webkit-scrollbar{height:0}
.ai-sg{white-space:nowrap;font-size:10px;padding:4px 9px;background:#1e2235;border:1px solid #2d3148;border-radius:12px;color:#94a3b8;cursor:pointer;transition:all .15s}
.ai-sg:hover{background:#2d3148;color:#e2e8f0}
.ai-inp-row{display:flex;gap:5px;padding:9px;border-top:1px solid #1e2235;flex-shrink:0}
#ai-inp{flex:1;background:#0f1117;border:1px solid #2d3148;color:#e2e8f0;border-radius:8px;padding:6px 9px;font-size:12px;font-family:'Inter',sans-serif;outline:none}
#ai-inp:focus{border-color:#3b82f6}
.ai-mic,.ai-send{width:30px;height:30px;border-radius:7px;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0}
.ai-send{background:#2563eb;color:#fff}.ai-send:hover{background:#1d4ed8}
.ai-mic{background:#1e2235;color:#94a3b8;border:1px solid #2d3148}
.ai-mic.rec{background:#ef4444;color:#fff;animation:pulse .8s infinite}

/* WO detail panel */
#wo-detail{position:absolute;top:0;right:0;width:360px;height:100%;background:#12151f;border-left:1px solid #1e2235;z-index:800;overflow-y:auto;transform:translateX(100%);transition:transform .25s ease;display:flex;flex-direction:column}
#wo-detail.open{transform:translateX(0)}
#wo-detail::-webkit-scrollbar{width:4px}
#wo-detail::-webkit-scrollbar-thumb{background:#2d3148;border-radius:4px}
.det-hdr{padding:13px 15px;border-bottom:1px solid #1e2235;display:flex;align-items:flex-start;gap:9px;position:sticky;top:0;background:#12151f;z-index:1}
.det-close{margin-left:auto;background:none;border:none;color:#64748b;cursor:pointer;font-size:15px;flex-shrink:0}
.det-close:hover{color:#e2e8f0}
.det-id{font-size:10px;color:#64748b;font-family:monospace}
.det-ttl{font-size:14px;font-weight:600;color:#e2e8f0;margin-top:2px;line-height:1.3}
.det-sec{padding:11px 15px;border-bottom:1px solid #1e2235}
.det-sec h3{font-size:10px;color:#64748b;text-transform:uppercase;letter-spacing:.5px;margin-bottom:7px;font-weight:600}
.det-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.det-f{background:#1a1d27;border-radius:6px;padding:7px}
.det-f label{font-size:10px;color:#64748b;display:block;margin-bottom:1px}
.det-f span{font-size:12px;color:#e2e8f0;font-weight:500}
.step-list{display:flex;flex-direction:column;gap:5px}
.step{display:flex;align-items:center;gap:7px;font-size:12px;color:#94a3b8}
.step.done{color:#4ade80}
.step-chk{width:15px;height:15px;border-radius:4px;border:1.5px solid #374151;display:flex;align-items:center;justify-content:center;font-size:9px;flex-shrink:0}
.step.done .step-chk{background:#14532d;border-color:#16a34a;color:#4ade80}
.mat-list{display:flex;flex-direction:column;gap:4px}
.mat{font-size:11px;color:#94a3b8;padding:4px 8px;background:#1a1d27;border-radius:4px;display:flex;align-items:center;gap:5px}
.mat::before{content:'';width:5px;height:5px;background:#3b82f6;border-radius:50%;flex-shrink:0}
.sja-box{background:#1a1d27;border:1px solid #2d3148;border-radius:8px}
.sja-row{display:flex;justify-content:space-between;align-items:center;font-size:11px;padding:8px 11px;border-bottom:1px solid #1e2235}
.sja-row:last-child{border-bottom:none}
.sja-lbl{color:#94a3b8}.sja-val{font-weight:500;color:#e2e8f0}
.sja-tgl{display:flex;gap:5px;align-items:center}
.sja-btn{font-size:10px;padding:3px 8px;border-radius:4px;border:1px solid #2d3148;background:#1e2235;color:#94a3b8;cursor:pointer}
.sja-btn.on{background:#2563eb;border-color:#2563eb;color:#fff}
.photo-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.photo-ph{background:#1a1d27;border:1px dashed #374151;border-radius:6px;aspect-ratio:4/3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer;font-size:11px;color:#64748b;transition:all .15s}
.photo-ph:hover{border-color:#3b82f6;color:#60a5fa}
.voice-box{background:#1a1d27;border:1px solid #2d3148;border-radius:8px;padding:10px;display:flex;flex-direction:column;gap:7px}
.voice-txt{font-size:11px;color:#94a3b8;font-style:italic;line-height:1.5}
.voice-btn{display:flex;align-items:center;gap:7px;font-size:12px;padding:7px 11px;background:#1e2235;border:1px solid #2d3148;border-radius:7px;color:#e2e8f0;cursor:pointer}
.voice-btn.rec{background:#7f1d1d;border-color:#ef4444;color:#fca5a5}
.ts-box{background:#1a1d27;border:1px solid #2d3148;border-radius:8px;padding:10px}
.ts-hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px}
.ts-ord{font-size:11px;color:#60a5fa;font-weight:600;font-family:monospace}
.ts-dur{font-size:13px;font-weight:700;color:#e2e8f0}
.ts-meta{font-size:10px;color:#64748b}
.ts-acts{display:flex;gap:6px;margin-top:8px}
.ts-acc{font-size:11px;padding:5px 11px;background:#14532d;border:1px solid #16a34a;color:#4ade80;border-radius:6px;cursor:pointer}
.ts-edi{font-size:11px;padding:5px 11px;background:#1e2235;border:1px solid #2d3148;color:#94a3b8;border-radius:6px;cursor:pointer}
.hist-list{display:flex;flex-direction:column;gap:6px}
.hist-item{display:flex;gap:9px;font-size:11px}
.hist-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;margin-top:3px}
.hist-k{background:#ef4444}.hist-h{background:#f97316}.hist-m{background:#eab308}.hist-i{background:#64748b}
.hist-body{flex:1}
.hist-date{font-size:10px;color:#64748b}
.hist-desc{color:#94a3b8;margin-top:1px}

/* Leaflet overrides */
.leaflet-control-layers{background:#1a1d27!important;border:1px solid #2d3148!important;color:#e2e8f0!important;border-radius:8px!important;font-family:'Inter',sans-serif!important}
.leaflet-control-layers-expanded{padding:9px 13px!important}
.leaflet-control-layers label{color:#cbd5e1!important;font-size:11px!important;font-family:'Inter',sans-serif!important}
.leaflet-control-layers-separator{border-color:#2d3148!important}
.leaflet-bar a{background:#1a1d27!important;color:#e2e8f0!important;border-color:#2d3148!important}
.leaflet-bar a:hover{background:#2d3148!important}
.leaflet-popup-content-wrapper{background:#1a1d27!important;border:1px solid #2d3148!important;color:#e2e8f0!important;border-radius:8px!important;box-shadow:0 8px 24px rgba(0,0,0,.5)!important}
.leaflet-popup-tip{background:#1a1d27!important}
.leaflet-popup-content{margin:11px 13px!important;font-family:'Inter',sans-serif!important;font-size:12px!important;min-width:170px}
.pu-ttl{font-size:13px;font-weight:600;color:#e2e8f0;margin-bottom:6px}
.pu-row{display:flex;justify-content:space-between;gap:10px;margin-bottom:3px;font-size:11px}
.pu-lbl{color:#64748b}.pu-val{color:#cbd5e1;font-weight:500}
.pu-btn{display:block;margin-top:9px;padding:6px 11px;background:#2563eb;border-radius:6px;color:#fff;text-align:center;cursor:pointer;font-size:11px;font-weight:600}

/* ══ PLANLEGGER VIEW ══ */
#view-planlegger{flex-direction:row}
.pl-left{width:270px;background:#12151f;border-right:1px solid #1e2235;display:flex;flex-direction:column;overflow:hidden;flex-shrink:0}
.pl-map{flex:1;position:relative}
#plan-map{width:100%;height:100%}
.pl-right{width:300px;background:#12151f;border-left:1px solid #1e2235;display:flex;flex-direction:column;overflow:hidden;flex-shrink:0}
.pl-sec-hdr{padding:11px 14px;border-bottom:1px solid #1e2235;font-size:12px;font-weight:600;color:#94a3b8;text-transform:uppercase;letter-spacing:.5px;flex-shrink:0}
.pl-wo-item{padding:9px 13px;border-bottom:1px solid #1e2235;cursor:pointer;transition:background .15s}
.pl-wo-item:hover{background:#1e2235}
.pl-wo-item.assigned{opacity:.5}
.pl-wo-hdr{display:flex;justify-content:space-between;align-items:flex-start;gap:6px}
.pl-wo-id{font-size:10px;color:#64748b;font-family:monospace}
.pl-wo-ttl{font-size:11px;font-weight:600;color:#e2e8f0;margin:2px 0;line-height:1.3}
.pl-certs-need{display:flex;gap:3px;flex-wrap:wrap;margin-top:3px}
.cert-need{font-size:9px;padding:1px 5px;border-radius:3px;background:#1e2235;color:#94a3b8}
.mon-card{padding:11px 13px;border-bottom:1px solid #1e2235;cursor:pointer;transition:background .15s}
.mon-card:hover,.mon-card.sel{background:#1e2235}
.mon-hdr{display:flex;align-items:center;gap:9px}
.mon-av{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex-shrink:0}
.mon-name{font-size:12px;font-weight:600;color:#e2e8f0}
.mon-role{font-size:10px;color:#64748b}
.mon-status{font-size:10px;padding:2px 7px;border-radius:10px;white-space:nowrap}
.ms-ledig{background:#14532d;color:#4ade80}.ms-felt{background:#1e3a5f;color:#60a5fa}.ms-vei{background:#3a2a0a;color:#fb923c}
.mon-certs{display:flex;gap:3px;flex-wrap:wrap;margin-top:6px}
.cert{font-size:9px;padding:2px 6px;border-radius:4px;background:#1e2235;border:1px solid #2d3148;color:#94a3b8}
.cert.match{background:#052e16;border-color:#16a34a;color:#4ade80}
.mon-compat{margin-top:7px;font-size:10px;color:#64748b}
.compat-bar{height:4px;background:#1e2235;border-radius:2px;margin-top:3px;overflow:hidden}
.compat-fill{height:100%;border-radius:2px;background:#22c55e}
.assign-btn{margin-top:8px;width:100%;font-size:11px;padding:7px;background:#2563eb;border:none;border-radius:6px;color:#fff;cursor:pointer;font-weight:600}
.assign-btn:disabled{background:#1e2235;color:#475569;cursor:not-allowed}
.pl-hint{padding:12px 14px;font-size:11px;color:#64748b;text-align:center}

/* ══ TIMEFØRING VIEW ══ */
#view-timeforing{flex-direction:column;background:#0f1117;overflow:auto}
.tf-header{padding:20px 28px 16px;border-bottom:1px solid #1e2235;display:flex;align-items:center;gap:16px;flex-shrink:0}
.tf-header h1{font-size:18px;font-weight:700;color:#e2e8f0}
.tf-summary{display:flex;gap:16px;margin-left:auto}
.tf-sum-c{background:#1a1d27;border:1px solid #1e2235;border-radius:8px;padding:8px 14px;text-align:center}
.tf-sum-c .sv{font-size:18px;font-weight:700;color:#60a5fa}
.tf-sum-c .sl{font-size:10px;color:#64748b;margin-top:1px}
.tf-bulk{display:flex;gap:8px}
.tf-bulk-btn{font-size:12px;padding:7px 14px;border-radius:7px;border:none;cursor:pointer;font-weight:500}
.tf-accept-all{background:#14532d;color:#4ade80;border:1px solid #16a34a}
.tf-export{background:#1e2235;color:#94a3b8;border:1px solid #2d3148}
.tf-table-wrap{flex:1;overflow:auto;padding:0 28px 28px}
table.tf-table{width:100%;border-collapse:collapse;margin-top:14px}
table.tf-table th{font-size:11px;color:#64748b;text-transform:uppercase;letter-spacing:.5px;padding:8px 12px;text-align:left;border-bottom:1px solid #1e2235;white-space:nowrap}
table.tf-table td{padding:10px 12px;border-bottom:1px solid #1e2235;font-size:12px;color:#cbd5e1;vertical-align:middle}
table.tf-table tr:hover td{background:#1a1d27}
.tf-mon-av{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;flex-shrink:0}
.tf-conf{display:flex;align-items:center;gap:5px;font-size:11px}
.tf-conf-bar{width:50px;height:4px;background:#1e2235;border-radius:2px;overflow:hidden}
.tf-conf-fill{height:100%;border-radius:2px}
.tf-stat{font-size:10px;padding:2px 7px;border-radius:4px;font-weight:500;white-space:nowrap}
.ts-forslag{background:#1e3a5f;color:#60a5fa}.ts-godkjent{background:#052e16;color:#4ade80}.ts-avvist{background:#3b0a0a;color:#f87171}
.tf-act-btn{font-size:11px;padding:4px 9px;border-radius:5px;border:none;cursor:pointer;font-weight:500}
.tf-ok{background:#14532d;color:#4ade80;border:1px solid #16a34a}
.tf-edit{background:#1e2235;color:#94a3b8;border:1px solid #2d3148}
.tf-rej{background:#3b0a0a;color:#f87171;border:1px solid #7f1d1d}

/* ══ RAPPORTER VIEW ══ */
#view-rapporter{flex-direction:column;background:#0f1117;overflow:auto}
.rp-header{padding:20px 28px 16px;border-bottom:1px solid #1e2235;display:flex;align-items:center;gap:12px;flex-shrink:0}
.rp-header h1{font-size:18px;font-weight:700;color:#e2e8f0}
.rp-period{font-size:12px;color:#64748b;margin-left:auto;padding:6px 12px;background:#1a1d27;border:1px solid #1e2235;border-radius:6px}
.rp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:20px 28px}
.kpi-card{background:#1a1d27;border:1px solid #1e2235;border-radius:10px;padding:14px 16px}
.kpi-card h4{font-size:10px;color:#64748b;text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}
.kpi-val{font-size:28px;font-weight:700;line-height:1}
.kpi-sub{font-size:11px;color:#64748b;margin-top:4px}
.kpi-green .kpi-val{color:#4ade80}.kpi-red .kpi-val{color:#f87171}.kpi-yellow .kpi-val{color:#fb923c}.kpi-blue .kpi-val{color:#60a5fa}
.kpi-vs{font-size:10px;margin-top:6px;padding:3px 7px;border-radius:4px;display:inline-block}
.kpi-better{background:#052e16;color:#4ade80}.kpi-worse{background:#3b0a0a;color:#f87171}
.chart-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:0 28px}
.chart-row.full{grid-template-columns:1fr;max-width:none}
.chart-card{background:#1a1d27;border:1px solid #1e2235;border-radius:10px;padding:16px 18px}
.chart-card h3{font-size:13px;font-weight:600;color:#e2e8f0;margin-bottom:4px}
.chart-sub{font-size:11px;color:#64748b;margin-bottom:14px}
svg.chart{width:100%;overflow:visible}
.chart-legend{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px}
.cl-item{display:flex;align-items:center;gap:5px;font-size:11px;color:#94a3b8}
.cl-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.donut-wrap{display:flex;align-items:center;gap:20px}
.donut-labels{display:flex;flex-direction:column;gap:6px}
.dl-item{display:flex;align-items:center;gap:7px;font-size:11px;color:#94a3b8}
.dl-dot{width:10px;height:10px;border-radius:2px;flex-shrink:0}

/* Outage simulator */
#sim-banner{position:absolute;top:0;left:0;right:0;z-index:1100;background:#431a00;border-bottom:1px solid #f97316;padding:7px 14px;display:none;align-items:center;gap:12px;font-size:12px;color:#fed7aa}
#sim-banner.show{display:flex}
.sim-btn{font-size:11px;padding:4px 10px;background:#f97316;border:none;color:#fff;border-radius:5px;cursor:pointer}
.sim-exit{margin-left:auto;background:none;border:none;color:#f97316;cursor:pointer;font-size:14px}

/* Avvik modal */
#avvik-modal{position:fixed;inset:0;z-index:3000;background:#000b;display:none;align-items:center;justify-content:center}
#avvik-modal.show{display:flex}
.modal-box{background:#1a1d27;border:1px solid #2d3148;border-radius:12px;width:480px;max-height:80vh;overflow-y:auto;display:flex;flex-direction:column}
.modal-hdr{padding:14px 16px;border-bottom:1px solid #1e2235;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:#1a1d27}
.modal-hdr h2{font-size:14px;font-weight:600}
.modal-body{padding:16px;display:flex;flex-direction:column;gap:12px}
.form-group{display:flex;flex-direction:column;gap:5px}
.form-group label{font-size:11px;color:#64748b;font-weight:500}
.form-group input,.form-group select,.form-group textarea{background:#0f1117;border:1px solid #2d3148;color:#e2e8f0;border-radius:7px;padding:8px 10px;font-size:12px;font-family:'Inter',sans-serif;outline:none;resize:vertical}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:#3b82f6}
.modal-ftr{padding:12px 16px;border-top:1px solid #1e2235;display:flex;justify-content:flex-end;gap:8px;position:sticky;bottom:0;background:#1a1d27}
.btn-cancel{font-size:12px;padding:7px 14px;background:#1e2235;border:1px solid #2d3148;color:#94a3b8;border-radius:7px;cursor:pointer}
.btn-save{font-size:12px;padding:7px 14px;background:#2563eb;border:none;color:#fff;border-radius:7px;cursor:pointer;font-weight:600}