:root{color-scheme:dark;--bg:#051324;--bg2:#081c33;--panel:#0e2945;--panel2:#102d4b;--line:#2b5672;--muted:#93b5ca;--text:#eaf8ff;--accent:#19baff;--amber:#ffc55b;--green:#22e58a;--red:#ff5665;--radius:18px;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
*{box-sizing:border-box}html{min-height:100%;background:var(--bg)}body{margin:0;min-height:100vh;color:var(--text);font-size:14px}.app-backdrop{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse 70% 60% at 55% -15%,rgba(0,124,214,.32),transparent 75%),linear-gradient(180deg,#061b35,#041120);z-index:-1}.topbar{position:sticky;z-index:10;top:0;display:flex;align-items:center;gap:11px;padding:12px max(14px,calc((100vw - 1100px)/2));padding-top:max(12px,env(safe-area-inset-top));background:rgba(4,20,37,.91);border-bottom:1px solid #23506e;backdrop-filter:blur(18px);box-shadow:0 4px 30px #0005}.brand-logo{font-size:31px;filter:drop-shadow(0 0 10px #18bafb)}.brand-copy{display:flex;flex-direction:column;gap:1px}.brand-overline{font-size:9px;letter-spacing:2.2px;font-weight:800;color:#b2d9f6}.brand-copy strong{font-size:18px;letter-spacing:.4px}.brand-copy em{font-style:normal;color:var(--amber)}.topbar-right{margin-left:auto;display:flex;align-items:center;gap:8px}.net-pill{font-size:10px;padding:7px 10px;border-radius:20px;background:#213951;color:#b9cfdf;white-space:nowrap}.net-pill.online{color:#51ffae;background:#0c3f37}.net-pill.offline{color:#ffb9ad;background:#502c35}.icon-btn{border:1px solid #2e678c;background:#113457;border-radius:11px;padding:7px 11px;color:#eefbff;font-size:18px;cursor:pointer}.shell{max-width:1080px;margin:auto;padding:16px 14px 60px}.toast{position:fixed;z-index:50;top:85px;left:50%;transform:translateX(-50%);max-width:min(90vw,520px);border:1px solid #387db0;background:#143e61;color:white;box-shadow:0 14px 35px #0008;padding:12px 20px;border-radius:11px;font-size:13px}.toast.error{background:#632631;border-color:#ff7b89}.login-container{position:relative;overflow:hidden;max-width:480px;margin:4vh auto 0;background:linear-gradient(155deg,#153a59,#071a30 65%);border:1px solid #326181;padding:37px 27px;border-radius:24px;box-shadow:0 20px 70px #0007;text-align:center}.login-glow{position:absolute;width:320px;height:320px;background:#1099ff25;filter:blur(35px);border-radius:50%;top:-200px;left:50%;transform:translateX(-50%);pointer-events:none}.login-mark{font-size:56px;margin-bottom:4px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:800;color:var(--accent);margin:0 0 10px}.login-container h1{font-size:37px;line-height:1.15;margin:9px 0}.login-container h1 span{color:var(--amber)}.login-intro{line-height:1.6;color:#bbcfde;margin:0 0 18px}.notice{padding:11px;border:1px solid #346383;background:#132f48;border-radius:10px;color:#a9d6ee;font-size:12px;margin:14px 0}.form-stack{display:flex;flex-direction:column;gap:14px;text-align:left}.form-stack label{font-size:12px;font-weight:700;color:#b7d6e7;display:flex;flex-direction:column;gap:7px}input,select,textarea{width:100%;border:1px solid #3d6380;border-radius:11px;background:#061b30;color:#f3fbff;padding:13px 12px;font:inherit;outline:none}input:focus,select:focus,textarea:focus{border-color:#25beff;box-shadow:0 0 0 2px #18aefe38}input::placeholder,textarea::placeholder{color:#7193ac}button{font:inherit}.button{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:11px;border:1px solid #3b7394;padding:12px 16px;font-weight:800;transition:filter .15s,transform .15s;white-space:nowrap}.button:active{transform:scale(.985)}.button:disabled{opacity:.4;cursor:not-allowed}.button.primary{background:linear-gradient(180deg,#15b3fa,#0073ce);border-color:#1bafea;color:#fff;box-shadow:0 5px 17px #077ccb55}.button.secondary{background:#145a84;border-color:#3f9fca;color:#fff}.button.outline{background:transparent;color:#9dd9ff;width:100%;margin-top:12px}.button.ghost{background:#123453;border-color:#2b6589;color:#b5e1fc}.button.small{padding:9px 12px;font-size:12px}.small-muted{font-size:11px;color:var(--muted);line-height:1.5}.login-container .small-muted{margin-bottom:0}.hero{position:relative;overflow:hidden;border:1px solid #346e99;border-radius:19px;background:radial-gradient(circle at right top,#165d7f 0,#0d345b 40%,#091d37 85%);padding:24px 20px 14px;box-shadow:inset 0 0 40px #1975b012,0 10px 28px #0004}.hero h1{font-size:clamp(27px,5vw,42px);margin:0;letter-spacing:-1.4px;line-height:1.1}.hero h1 span{color:#ffd169}.hero-subtitle{font-size:12px;color:#b4d6ec;margin:6px 0 23px}.hero-symbol{position:absolute;right:28px;top:21px;font-size:70px;opacity:.27;transform:rotate(-13deg)}.hero-strip{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:10px;border-top:1px solid #3f7091;padding-top:12px}.hero-strip>div{min-width:0}.hero-strip small{display:block;font-size:9px;color:#80cdea;letter-spacing:.8px;font-weight:800;margin-bottom:4px}.hero-strip strong{font-size:12px;line-height:1.35;overflow-wrap:anywhere}.warning-banner{margin-top:12px;border:1px solid #946c29;background:#49351e;color:#ffe1a5;padding:11px;border-radius:11px;font-size:12px}.warning-banner.danger{border-color:#db6270;background:#532c36;color:#ffd1d7}.tabs{position:sticky;z-index:9;top:69px;display:flex;gap:5px;margin:15px 0 13px;padding:5px;background:#071a2feF;border:1px solid #25516c;border-radius:14px;backdrop-filter:blur(16px)}.tab{cursor:pointer;flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 5px;border:none;border-radius:10px;color:#87a8c0;background:transparent;font-size:20px;font-weight:800}.tab span{font-size:11px}.tab.active{background:#0869a3;color:white;box-shadow:0 3px 10px #087fba45}.panel{display:none;animation:fade-in .16s ease-out}.panel.active{display:block}@keyframes fade-in{from{opacity:.6;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}.section-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:17px 1px 14px}.section-bar h2{margin:0;font-size:20px}.section-bar p{margin:5px 0 0;color:var(--muted);font-size:12px}.legend{display:flex;gap:14px;flex-wrap:wrap;margin:0 0 13px;color:#a5c4d7;font-size:10px;font-weight:800}.dot{display:inline-block;vertical-align:middle;width:10px;height:10px;border-radius:50%;margin-right:4px}.dot.green{background:var(--green);box-shadow:0 0 10px #18fc8f}.dot.red{background:var(--red);box-shadow:0 0 10px #f65d70}.dot.amber{background:var(--amber)}.equipment-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.equipment{position:relative;overflow:hidden;background:linear-gradient(140deg,#103252,#09233e);border:1px solid #3b7090;border-radius:14px;min-height:148px;padding:12px 11px;display:grid;grid-template-columns:minmax(55px,42%) 1fr;gap:7px;align-items:center;box-shadow:inset 0 1px #5497b122,0 4px 13px #0002}.equipment.red{border-color:#bc4857;background:linear-gradient(145deg,#492638,#112036)}.equipment.unknown{border-color:#786643}.equip-picture{border-radius:10px;background:radial-gradient(circle at 45% 32%,#386b89a8,#0d243c5f 80%);height:108px;width:100%;object-fit:contain;padding:6px}.equip-right{min-width:0;display:flex;flex-direction:column;gap:9px;align-items:flex-start}.equip-name{font-size:clamp(11px,2.8vw,15px);font-weight:900;line-height:1.2;overflow-wrap:anywhere;min-height:2.5em;display:flex;align-items:flex-end}.status-chip{display:inline-flex;gap:5px;align-items:center;padding:7px 9px;border-radius:30px;font-size:11px;font-weight:900;border:1px solid currentColor;letter-spacing:.2px;white-space:nowrap}.status-chip.green{color:#42ff9c;background:#073e2f;box-shadow:0 0 9px #12d17d35}.status-chip.red{color:#ff8b90;background:#4a202c}.status-chip.unknown{color:#ffdc7e;background:#45391d}.equip-actions{display:flex;gap:5px;flex-wrap:wrap}.mini{border:1px solid #386d8a;background:#112d48;color:#e2f2ff;border-radius:7px;padding:7px 8px;font-size:11px;font-weight:800;cursor:pointer}.mini.green{border-color:#1c9b6c;color:#64ffb1}.mini.red{border-color:#b34c5e;color:#ffb2b9}.mini:disabled{opacity:.35;cursor:not-allowed}.safety-note{color:#b7c8d7;line-height:1.6;font-size:11px;border:1px dashed #335675;padding:12px;margin:18px 0;border-radius:12px}.filters{display:grid;grid-template-columns:minmax(0,1.3fr) 1fr;gap:8px;margin-bottom:17px}.timeline{display:flex;flex-direction:column;gap:9px}.event{display:flex;gap:13px;background:#0c2841;border:1px solid #2e5975;border-radius:12px;padding:14px}.event-marker{flex:0 0 32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#164466;font-size:16px}.event-marker.status{background:#144e3f}.event-marker.handover{background:#53411d}.event-info{flex:1;min-width:0}.event-title{font-weight:800;font-size:13px}.event-sub{margin-top:5px;color:var(--muted);font-size:11px;line-height:1.5}.event-changes{margin-top:7px;font-size:11px;color:#b7dfff}.empty{padding:35px 15px;text-align:center;border:1px dashed #3f6b8a;border-radius:13px;color:#a7c2d7}.feature-card{background:linear-gradient(150deg,#124065,#0e2842);border:1px solid #31678c;border-radius:15px;padding:20px;margin-bottom:15px}.feature-card small{color:var(--accent);font-weight:900;letter-spacing:1.4px}.feature-card h3{font-size:23px;margin:10px 0}.feature-card p{color:var(--muted);margin-bottom:0}.card-form{background:#0b243b;border:1px solid #2a5875;border-radius:15px;padding:17px;margin-bottom:20px}.subheading{margin:25px 2px 12px;font-size:16px}.admin-equipment,.admin-users{display:grid;gap:9px}.admin-row{display:flex;gap:10px;align-items:center;background:#0c2a44;border:1px solid #2d5876;padding:9px;border-radius:12px}.admin-row img{width:51px;height:54px;object-fit:contain;border-radius:9px;background:#173c57;padding:4px}.admin-row-title{flex:1;min-width:0;font-weight:800;font-size:12px;overflow-wrap:anywhere}.footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin:32px 0 0;padding:18px 2px;border-top:1px solid #28536e;color:#cde8f8}.footer strong{display:block;font-size:12px}.footer a{display:block;text-decoration:none;color:#55c8fa;font-size:11px;margin-top:4px}.footer-actions{display:flex;gap:15px}.text-button{border:0;background:transparent;color:#72c8fa;font-size:11px;cursor:pointer}.modal{border:1px solid #3c82a5;border-radius:19px;max-width:min(94vw,440px);width:100%;padding:0;color:var(--text);background:#0b2844;box-shadow:0 25px 90px #000a}.modal::backdrop{background:#000b;backdrop-filter:blur(3px)}.dialog-content{display:flex;flex-direction:column;gap:13px;padding:23px}.dialog-content h3{font-size:20px;margin:0}.dialog-content p{color:#b6d3e7;line-height:1.5;margin:0}.modal-actions{display:flex;justify-content:end;gap:9px;margin-top:5px}.modal-actions button{flex:1}.dialog-content label{font-size:12px;color:#d5eafa;font-weight:750;display:flex;flex-direction:column;gap:6px}.img-preview{display:block;margin:auto;width:120px;height:105px;object-fit:contain}.help-steps{padding-left:20px;color:#c6e2f3;line-height:1.7;font-size:13px}.footer,.safety-note{clear:both}[hidden]{display:none!important}
@media(min-width:720px){.shell{padding:22px 20px 60px}.equipment-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.equipment{min-height:158px}.tabs{top:72px}.tab{flex-direction:row;justify-content:center;gap:10px;font-size:18px}.tab span{font-size:13px}.hero{padding:34px 30px 20px}.hero-strip strong{font-size:14px}}
@media(min-width:1040px){.equipment-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:360px){.brand-overline{font-size:8px}.brand-copy strong{font-size:14px}.net-pill{font-size:9px;padding:6px}.equipment{grid-template-columns:1fr;gap:3px;min-height:205px}.equip-picture{height:88px}.equip-name{min-height:0}.equip-right{gap:5px}.equip-actions{margin-top:3px}}


/* v2 — photographic red OLV Venture 1 header, richer equipment imagery */
.hero{min-height:268px;display:flex;flex-direction:column;justify-content:space-between;isolation:isolate;background:linear-gradient(90deg,rgba(1,18,42,.97) 0%,rgba(2,20,42,.63) 36%,rgba(3,25,46,.04) 72%),linear-gradient(0deg,rgba(2,12,32,.76),transparent 58%),url('./assets/olv-venture-1-red.jpg') center 51%/cover no-repeat;border-color:#1784d2;box-shadow:inset 0 0 30px #0c77af33,0 10px 30px #0007;}
.hero>div:first-child{position:relative;z-index:1;max-width:72%;text-shadow:0 2px 8px #001529}
.hero h1{text-shadow:0 2px 10px #001a37;font-size:clamp(30px,5.5vw,46px)}
.hero-symbol{display:none}
.hero-strip{position:relative;z-index:1;border:1px solid #368bc9aa;border-radius:12px;background:#001a35c9;backdrop-filter:blur(9px);padding:12px;gap:6px}
.hero-strip small{color:#b4d6ec}.hero-strip strong{color:white}
.equipment{border-color:#0ba5edaa;background:linear-gradient(137deg,#0a2c4c,#061a32 93%);min-height:128px;grid-template-columns:37% 1fr;gap:10px;padding:10px}
.equipment.off{border-color:#6a8ca5;background:linear-gradient(140deg,#102c40,#0b1a2f)}
.equip-picture{height:100px;padding:0;background:#041e34;object-fit:contain;border:1px solid #1d5775;filter:saturate(1.08)}
.equip-name{font-size:clamp(11px,2.7vw,15px);min-height:auto;line-height:1.18}
.equip-right{gap:8px;align-self:center}
.status-chip{padding:5px 9px;font-size:10px}
.status-chip.off{color:#d4e3ec;background:#193047;border-color:#6e8faa}
.dot.off{background:#c6d4e0;box-shadow:0 0 10px #9eb3be}
.equip-actions{flex-wrap:nowrap;gap:3px;width:100%}
.equip-actions .mini{flex:1;min-width:0;padding:8px 4px;font-size:10px;line-height:1;border-radius:9px;transition:background .2s,border .2s}
.mini.off{border-color:#647f96;color:#d9e7f3}
.equipment.green .mini.green:disabled,.equipment.red .mini.red:disabled,.equipment.off .mini.off:disabled{opacity:1;background:#1a7d57;color:#d5ffed;border-color:#2aff9b;box-shadow:0 0 12px #26ed9566}
.equipment.red .mini.red:disabled{background:#832c41;color:#ffe1e5;border-color:#ff5665;box-shadow:0 0 12px #ff566577}
.equipment.off .mini.off:disabled{background:#4b6681;color:#fff;border-color:#bbd4ee;box-shadow:0 0 12px #b5d8f055}
.equipment.unknown .status-chip.unknown{color:#ffcb6c}
.status-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-bottom:13px}
.status-summary .stat{padding:8px 6px;border:1px solid #25618b;border-radius:10px;background:#092842;text-align:center}
.stat strong{display:block;font-size:19px}.stat small{display:block;font-size:9px;color:#c0d3e6;letter-spacing:.3px;font-weight:700}
.stat.green strong{color:#4effa1}.stat.red strong{color:#ff7386}.stat.off strong{color:#e1f1ff}.stat.unknown strong{color:#ffca70}
.recent-card{border:1px solid #285d83;border-radius:14px;background:linear-gradient(145deg,#0f3459,#071e36);margin-top:18px;overflow:hidden}
.recent-head{padding:12px 15px;background:#103d65;display:flex;justify-content:space-between;align-items:center}
.recent-row{padding:11px 15px;border-top:1px solid #1d4664;display:flex;align-items:center;gap:9px;font-size:12px}
.recent-row .recent-time{color:#93b7d1;font-size:10px;margin-left:auto;white-space:nowrap}
.recent-row .recent-circle{width:11px;height:11px;flex:0 0 11px;border-radius:50%;background:#e7ba59}
.recent-circle.green{background:#22e58a;box-shadow:0 0 7px #22e58a}.recent-circle.red{background:#ff5665;box-shadow:0 0 7px #ff5665}.recent-circle.off{background:#bbd6ea}
@media(min-width:740px){.hero{min-height:330px}.equipment{min-height:138px}.equip-picture{height:110px}.equip-actions .mini{padding:9px 5px}}
@media(max-width:420px){.hero{min-height:260px;padding:20px 12px 12px;background-position:58% center}.hero>div:first-child{max-width:100%}.hero h1{font-size:30px}.hero-strip{grid-template-columns:1fr 1fr 1fr;padding:9px 6px}.hero-strip small{font-size:8px}.hero-strip strong{font-size:10px}.equipment{padding:7px;grid-template-columns:37% 1fr;gap:5px;min-height:138px}.equip-picture{height:95px}.equip-name{font-size:11px}.equip-actions .mini{font-size:9px;padding:8px 2px}.status-chip{font-size:9px;padding:5px 7px}.section-bar h2{font-size:18px}.status-summary .stat{padding:7px 2px}.stat strong{font-size:18px}}


/* v2.1 - entire equipment tile reflects the selected status */
.equipment.green {
  border: 1px solid #31f49c;
  background: linear-gradient(140deg, #09643b 0%, #07543b 39%, #08342e 100%);
  box-shadow: inset 0 0 0 1px #36ff9c2b, inset 0 17px 32px #3afa9b14,
              0 0 0 1px #00af5c20, 0 0 17px #09e57738;
}
.equipment.green .equip-picture {
  border-color: #15bc7c;
  background: linear-gradient(145deg,#0b513c,#07372f);
  box-shadow: inset 0 0 16px #14e39b22;
}
.equipment.green .equip-name {color:#f1fff8}
.equipment.green .status-chip.green {
  border-color: #49ffad; color:#c4ffdf; background:#06492c;
  box-shadow:0 0 10px #11ff883e;
}
.equipment.green .mini.green:disabled {
  background:linear-gradient(180deg,#148d56,#086c47);
  border-color:#63ffb1; color:#f2fff7;
  box-shadow:0 0 14px #11ff8e7c, inset 0 1px #b7ffcb50;
}
.equipment.red {
  border: 1px solid #ff596f;
  background:linear-gradient(140deg,#6d122c 0%,#491628 46%,#301826 100%);
  box-shadow:inset 0 0 0 1px #ff6e8528,inset 0 18px 34px #ff275b12,
             0 0 0 1px #e2315420,0 0 16px #ff32544d;
}
.equipment.red .equip-picture {
  border-color:#cd4762;
  background:linear-gradient(145deg,#492333,#321c2a);
}
.equipment.red .equip-name {color:#fff5f6}
.equipment.red .status-chip.red {
  color:#ffd4dd; border-color:#ff7086;background:#641a34;
  box-shadow:0 0 10px #ff496238;
}
.equipment.red .mini.red:disabled {
  background:linear-gradient(180deg,#ce2b4e,#92233e);
  color:#fff; border-color:#ff9ba8;
  box-shadow:0 0 15px #ff4d6e88,inset 0 1px #ffe0e650;
}
.equipment.off {
  border:1px solid #98a2a9;
  background:linear-gradient(140deg,#42484c 0%,#30383f 43%,#1d252d 100%);
  box-shadow:inset 0 0 0 1px #e3e9eb14,inset 0 13px 27px #fff9,
             0 0 10px #afb6bd27;
  box-shadow:inset 0 0 0 1px #e3e9eb14,inset 0 13px 27px #d9e1e80c,0 0 10px #afb6bd27;
}
.equipment.off .equip-picture {
  filter:grayscale(1) contrast(.91) brightness(.76);
  opacity:.83; border-color:#899198;
  background:#262b30;
}
.equipment.off .equip-right {
  filter:grayscale(1);
}
.equipment.off .equip-name {color:#d0d7da}
.equipment.off .status-chip.off {
  color:#f3f5f6; border-color:#d5d9df;background:#454e55;
  box-shadow:0 0 8px #d9e0e63c;
}
.equipment.off .mini.off:disabled {
  background:linear-gradient(180deg,#8b9499,#565e65);
  color:#fff; border-color:#eef2f6;
  box-shadow:0 0 12px #e4effa55;
}
.equipment.unknown {background:linear-gradient(140deg,#102a48,#091e37);border-color:#a08045}
@media (prefers-reduced-motion:no-preference) {
  .equipment {transition: background .23s ease, border-color .23s ease, box-shadow .23s ease;}
  .equip-picture {transition: filter .2s ease,opacity .2s ease;}
}