:root{--blue:#0b57b7;--steel:#60656b;--bg:#f4f6f8;--line:#dce2e8;--ok:#067647;--bad:#b42318;--warn:#9a6700}*{box-sizing:border-box}body{margin:0;font-family:Segoe UI,Arial,sans-serif;background:var(--bg);color:#17202a}header{height:86px;background:white;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:8px 24px;position:sticky;top:0;z-index:5}header img{height:68px;max-width:310px;object-fit:contain}.headright{display:flex;gap:12px;align-items:center}.headright button,button{cursor:pointer}.shell{display:grid;grid-template-columns:220px 1fr;min-height:calc(100vh - 86px)}aside{background:#172b3f;padding:18px 10px}aside button{display:block;width:100%;text-align:left;border:0;background:transparent;color:#dfe9f2;padding:11px;border-radius:8px;margin-bottom:4px}aside button.active,aside button:hover{background:#244a6e;color:#fff}main{padding:24px;max-width:1280px;width:100%}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}.card{background:#fff;border:1px solid var(--line);border-radius:13px;padding:16px;margin-bottom:12px;box-shadow:0 2px 9px #00000008}.metric strong{display:block;font-size:31px}.muted{color:#6c7884}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.space{justify-content:space-between}.titleline{display:flex;justify-content:space-between;gap:10px}.primary,.danger,.secondary,.warningBtn{border:0;border-radius:8px;padding:10px 14px;font-weight:700}.primary{background:var(--blue);color:white}.danger{background:#c62828;color:#fff}.secondary{background:#e9eef3}.warningBtn{background:#f4b400}.status,.pill{display:inline-block;border-radius:999px;padding:4px 8px;font-size:12px;font-weight:700}.ok{background:#ecfdf3;color:var(--ok)}.bad{background:#fef3f2;color:var(--bad)}.warnpill{background:#fff7db;color:var(--warn)}.fault{border-left:5px solid var(--bad)}.clickrow{cursor:pointer}.clickrow:hover{box-shadow:0 7px 22px #0001}.code{font-family:Consolas,monospace;background:#eef2f5;padding:3px 6px;border-radius:5px}.form{display:grid;gap:10px}.form input,.form textarea,.form select{padding:10px;border:1px solid #cdd6df;border-radius:7px;font:inherit}.form textarea{min-height:90px}.actions{display:flex;gap:8px;flex-wrap:wrap}.tablewrap{overflow:auto;background:#fff;border-radius:12px;border:1px solid var(--line)}table{border-collapse:collapse;width:100%}th,td{padding:11px;border-bottom:1px solid #e7ebef;text-align:left}.modal{position:fixed;inset:0;background:#0008;display:grid;place-items:center;z-index:20}.modal>div{background:white;padding:18px;border-radius:14px;max-width:700px;width:92%;max-height:90vh;overflow:auto}.ghost{border:0;background:transparent;font-size:20px}#toast{position:fixed;right:20px;bottom:20px;background:#172b3f;color:white;padding:10px 14px;border-radius:8px;opacity:0;transform:translateY(15px);transition:.2s;z-index:30}#toast.show{opacity:1;transform:none}.voice{display:flex;align-items:center;gap:10px}.rec{animation:pulse 1s infinite}@keyframes pulse{50%{opacity:.6}}@media(max-width:800px){.shell{grid-template-columns:1fr}aside{display:flex;overflow:auto;position:sticky;top:86px;z-index:4}aside button{min-width:max-content}.two{grid-template-columns:1fr}header img{max-width:220px;height:58px}main{padding:14px}}
/* V2.5 UI */
header{height:116px;padding:8px 26px}
header img{height:100px;max-width:460px;object-fit:contain}
.shell{min-height:calc(100vh - 116px)}
aside{padding-top:22px}
.loginCard{max-width:580px!important;padding:24px}.loginHero{max-width:580px;margin-bottom:14px}.demoBox{background:#f1f6fb;border:1px solid #d2e2f1;border-radius:10px;padding:12px}.bigBtn{padding:13px 18px;font-size:16px}.clickable{cursor:pointer}.clickable:hover,.alertCard:hover{box-shadow:0 8px 25px #0002;transform:translateY(-1px)}
.adminLoginBtn{background:linear-gradient(135deg,#0b57b7,#083b7e)!important;color:#fff!important;border:0;border-radius:10px;padding:11px 16px;font-weight:800;box-shadow:0 3px 10px #0b57b744}.adminLoginBtn:hover{filter:brightness(1.08)}.adminLogout{background:#eef2f5;border:1px solid #ccd6df;border-radius:9px;padding:9px 13px}.adminLoginPanel{text-align:center;padding:5px 12px 12px}.adminIcon{font-size:42px;margin-bottom:2px}.adminLoginPanel .form{text-align:left}.doneBanner{margin-top:15px;padding:12px;border-radius:9px;background:#ecfdf3;color:#067647;font-weight:700}.alertCard{border-left:5px solid #f4b400}.alertCard small{color:#0b57b7;font-weight:700}
@media(max-width:800px){header{height:96px;padding:6px 12px}header img{height:82px;max-width:300px}.shell{min-height:calc(100vh - 96px)}aside{top:96px}.headright{gap:7px}.headright #clock{display:none}.adminLoginBtn{padding:9px 11px}}
/* V2.6 */
.searchPanel{border-left:5px solid var(--blue)}.searchRow{display:grid;grid-template-columns:1fr auto;gap:10px}.searchRow input{padding:12px;border:1px solid #cdd6df;border-radius:8px;font:inherit}.compareList{margin-top:14px;display:grid;gap:9px}.compareItem{border:1px solid #dce5ee;border-radius:10px;padding:13px;background:#f9fbfd}.noResult{margin-top:12px;padding:12px;border-radius:8px;background:#f4f6f8;color:#6c7884}
.maintenanceChecklist{display:grid;gap:14px}.maintenancePoint{border:1px solid #dbe3eb;border-radius:12px;padding:15px;background:#fbfcfd}.checkTitle{display:flex;gap:10px;align-items:center;margin-bottom:12px}.checkNo{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#172b3f;color:#fff;font-weight:800}.checkButtons{display:flex;gap:8px;flex-wrap:wrap}.checkButtons button{border:1px solid #cdd6df;background:#fff;border-radius:8px;padding:9px 12px;font-weight:700}.checkButtons button.selectedOK{background:#ecfdf3;border-color:#8bd5b1;color:#067647}.checkButtons button.selectedBad{background:#fef3f2;border-color:#efaaa4;color:#b42318}.checkButtons button.selectedNA{background:#eef2f5;border-color:#aebbc7}.miniFields{margin-top:10px}.protocolCard details{margin-top:10px}.protocolCard summary{cursor:pointer;color:var(--blue);font-weight:800}.protocolItems{display:grid;gap:8px;margin-top:12px}.protocolResult{border-left:4px solid #4caf7a;background:#f7fbf8;padding:10px;border-radius:6px}.protocolResult.resultBad{border-left-color:#d6453d;background:#fff7f6}.tallText{min-height:180px!important}
.trainingReadBox{max-height:55vh;overflow:auto;border:1px solid #d8e0e8;border-radius:10px;padding:20px;background:#fff;line-height:1.65}.trainingContent{font-size:16px;white-space:normal}.trainingFile{margin:22px 0}.fileLink{display:inline-block;text-decoration:none}.readEnd{text-align:center;margin:40px 0 12px;color:#87929d;font-weight:700}.trainingReadBox:after{content:'';display:block;height:40px}#ackTrainingBtn:disabled{opacity:.45;cursor:not-allowed}#ackTrainingBtn.ready{box-shadow:0 0 0 4px #0b57b722}
@media(max-width:700px){.searchRow{grid-template-columns:1fr}.checkButtons button{flex:1;min-width:110px}}
/* V2.7 */
header{height:136px;padding:6px 28px}header img{height:122px;max-width:560px}.shell{min-height:calc(100vh - 136px)}
.mediaSection{margin-top:18px}.mediaGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}.mediaItem{border:1px solid #dce2e8;border-radius:10px;padding:8px;background:#f9fbfd;text-decoration:none;color:inherit}.mediaItem img,.mediaItem video{width:100%;height:150px;object-fit:cover;border-radius:7px;background:#111}.mediaItem small{display:block;margin-top:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.signatureWrap{border:2px dashed #aeb9c4;border-radius:10px;background:#fff;touch-action:none}.signatureWrap canvas{display:block;width:100%;height:190px;touch-action:none}.signaturePreview{display:block;max-width:300px;max-height:100px;margin-top:8px;border:1px solid #dce2e8;background:white}.ackCard{border-left:5px solid #4caf7a}
@media(max-width:800px){header{height:110px;padding:5px 10px}header img{height:98px;max-width:340px}.shell{min-height:calc(100vh - 110px)}aside{top:110px}.mediaGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.mediaItem img,.mediaItem video{height:120px}}

/* V2.8 */
header{height:100px;padding:10px 24px}.shell{min-height:calc(100vh - 100px)}.customerBrand{height:74px;min-width:260px;display:flex;align-items:center}.customerBrand img{max-height:70px;max-width:360px;object-fit:contain}.customerLogoPlaceholder{height:64px;min-width:250px;border:1px dashed #cbd4dd;border-radius:10px;display:grid;place-items:center;color:#9aa5b0;font-size:13px;letter-spacing:1.5px;background:#fafbfc}.appFooter{background:#fff;border-top:1px solid var(--line);padding:9px 18px}.ftBrand{display:flex;align-items:center;gap:9px;color:#7a858f;font-size:11px}.ftBrand img{height:34px;width:auto;opacity:.72}.maintenanceTitle{color:#0b57b7}.protocolTitle{color:#16804f}.analysisControls{display:flex;align-items:end;gap:12px;flex-wrap:wrap}.analysisControls>div{display:grid;gap:5px}.analysisControls input{padding:10px;border:1px solid #cdd6df;border-radius:7px}.analysisNote{margin-top:12px}.metric small{display:block;margin-top:6px}.metric strong{overflow-wrap:anywhere}
@media(max-width:800px){header{height:86px;padding:6px 10px}.shell{min-height:calc(100vh - 86px)}aside{top:86px}.customerBrand{height:64px;min-width:120px}.customerBrand img{max-height:58px;max-width:190px}.customerLogoPlaceholder{height:52px;min-width:120px;font-size:10px}.ftBrand img{height:28px}.appFooter{padding:7px 10px}}

/* V2.9 */
aside{display:flex;flex-direction:column}.ftNavBrand{margin-top:44px;padding:0 12px 18px}.ftNavBrand img{display:block;width:176px;max-width:100%;height:auto;opacity:.9}.incidentNo{font-family:Consolas,monospace;color:var(--blue);font-size:.92em;white-space:nowrap;margin-right:5px}
@media(max-width:800px){aside{flex-direction:row;align-items:center}.ftNavBrand{margin:0 4px 0 28px;padding:0 10px;min-width:120px}.ftNavBrand img{width:120px;max-height:44px;object-fit:contain}}

/* V3.0 */
.ftNavBrand{margin-top:52px;padding:12px 14px 14px;border-radius:12px;background:#dfe6ec;border:1px solid #31485d;box-shadow:inset 0 1px 0 #ffffff99}.ftNavBrand img{width:138px;opacity:.78;filter:saturate(.88)}
@media(max-width:800px){.ftNavBrand{margin:0 4px 0 28px;padding:7px 9px;min-width:100px;border-radius:9px}.ftNavBrand img{width:98px;max-height:38px;object-fit:contain}}

/* V3.1 */
.ftNavBrand{margin-top:96px;padding:10px 12px 12px;border-radius:10px;background:#050607;border:1px solid #20262c;box-shadow:none}.ftNavBrand img{width:108px;opacity:.68;filter:saturate(.82)}
@media(max-width:800px){.ftNavBrand{margin:0 4px 0 36px;padding:6px 8px;min-width:82px;border-radius:8px;background:#050607;border-color:#20262c}.ftNavBrand img{width:82px;max-height:32px;object-fit:contain;opacity:.68}}

/* V3.2 - brighter FT branding */
.ftNavBrand{background:#050607;border-color:#2b333b;box-shadow:0 8px 22px #0000002e,inset 0 0 18px #ffffff08}
.ftNavBrand img{opacity:1;filter:brightness(1.34) contrast(1.08) saturate(1.12) drop-shadow(0 0 5px #5aa9ff55) drop-shadow(0 0 10px #ffffff20)}
@media(max-width:800px){.ftNavBrand img{opacity:1;filter:brightness(1.28) contrast(1.06) saturate(1.1) drop-shadow(0 0 4px #5aa9ff4d)}}

/* V3.3 - original FT logo look on black background; no glow/filter */
.ftNavBrand{background:#000;border-color:#1b1b1b;box-shadow:none}
.ftNavBrand img{opacity:1;filter:none;width:108px}
@media(max-width:800px){.ftNavBrand img{opacity:1;filter:none;width:82px;max-height:32px;object-fit:contain}}

/* V3.4 - lighter anthracite FT logo background */
.ftNavBrand{background:#202020;border-color:#343434;box-shadow:none}

/* V3.5 - original FT logo on clean white brand surface */
.ftNavBrand{
  margin-top:110px;
  padding:14px 16px 16px;
  border-radius:10px;
  background:#fff;
  border:1px solid #e3e7eb;
  box-shadow:0 2px 8px #00000010;
}
.ftNavBrand img{
  display:block;
  width:102px;
  max-width:100%;
  height:auto;
  opacity:1;
  filter:none;
}
@media(max-width:800px){
  .ftNavBrand{
    margin:0 4px 0 38px;
    padding:6px 8px;
    min-width:80px;
    border-radius:8px;
    background:#fff;
    border-color:#e3e7eb;
    box-shadow:none;
  }
  .ftNavBrand img{
    width:78px;
    max-height:34px;
    object-fit:contain;
    opacity:1;
    filter:none;
  }
}


/* V3.6 - FT brand in header beside Admin; clock removed */
.ftNavBrand{display:none!important}
.headright{display:flex;align-items:center;gap:12px}
.headerFtBrand{
  display:flex;
  align-items:center;
  justify-content:center;
  width:132px;
  height:72px;
  padding:2px 4px;
  background:#fff;
  border:0;
  border-radius:8px;
  overflow:hidden;
}
.headerFtBrand img{
  display:block;
  width:124px;
  height:auto;
  max-height:68px;
  max-width:100%;
  object-fit:contain;
  opacity:1;
  filter:none;
}
@media(max-width:800px){
  .headright{gap:7px}
  .headerFtBrand{width:96px;height:56px;padding:1px 2px}
  .headerFtBrand img{width:92px;max-height:54px}
}

/* V3.7 - slightly larger FT logo beside Admin */
.headerFtBrand{
  width:156px;
  height:82px;
  padding:2px 4px;
}
.headerFtBrand img{
  width:148px;
  max-height:78px;
}
@media(max-width:800px){
  .headerFtBrand{width:108px;height:62px;padding:1px 2px}
  .headerFtBrand img{width:104px;max-height:60px}
}

/* V3.8 - QR machine access */
.qrGrid{display:grid;gap:18px;margin-top:18px}.qrCard h2{margin:0 0 6px}.qrLayout{display:grid;grid-template-columns:230px 1fr;gap:24px;align-items:start;margin-top:18px}.qrBox{display:flex;align-items:center;justify-content:center;padding:12px;background:#fff;border:1px solid #dbe3eb;border-radius:12px}.qrBox svg{width:205px;height:205px;max-width:100%}.qrInfo{min-width:0}.qrInfo input{width:100%;box-sizing:border-box;padding:10px;border:1px solid #cdd6df;border-radius:8px;font-family:Consolas,monospace;font-size:12px;background:#f8fafc}.qrAdminActions{margin-top:16px;padding-top:14px;border-top:1px solid #e2e8ee}.networkOk,.networkWarn{padding:14px 16px;border-radius:10px;margin:12px 0 18px}.networkOk{background:#ecfdf3;border:1px solid #8bd5b1;color:#067647}.networkWarn{background:#fff8e8;border:1px solid #e6c76c;color:#725711}.qrSvg{display:block;background:#fff}
@media(max-width:800px){.qrLayout{grid-template-columns:1fr}.qrBox{max-width:260px}.qrBox svg{width:220px;height:220px}.qrInfo .actions button{flex:1;min-width:140px}}

/* V3.9 Backup / Datenuebertragung */
.backupGrid{grid-template-columns:repeat(auto-fit,minmax(340px,1fr));align-items:stretch}
.backupFacts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:18px 0}
.backupFacts div{background:#f4f7fa;border:1px solid #dce4eb;border-radius:10px;padding:10px;text-align:center}
.backupFacts b{display:block;font-size:20px;color:#173b5f}.backupFacts span{font-size:11px;color:#6b7785}
.warningBox{margin:14px 0;padding:12px 14px;border:1px solid #e4b85d;background:#fff8e8;border-radius:10px;font-size:13px}
@media(max-width:700px){.backupFacts{grid-template-columns:repeat(2,1fr)}}

/* V4.0 - desktop-like mobile layout + machine-based documentation */
.documentMachineGrid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.documentMachineCard h2{margin-top:0}.documentOpen{display:inline-block;text-decoration:none;padding:7px 11px}
@media(max-width:800px){
  header{height:74px;padding:5px 8px;gap:6px}
  .customerBrand{height:58px;min-width:72px;max-width:112px}.customerBrand img{max-height:54px;max-width:108px}.customerLogoPlaceholder{height:46px;min-width:70px;font-size:8px;letter-spacing:.5px}
  .headright{gap:5px;min-width:0}.headright #role{display:none}.adminLoginBtn,.adminLogout{padding:7px 8px;font-size:11px;white-space:nowrap}.headerFtBrand{width:88px;height:58px}.headerFtBrand img{width:84px;max-height:54px}
  .shell{grid-template-columns:128px minmax(0,1fr);min-height:calc(100vh - 74px)}
  aside{display:block;position:sticky;top:74px;align-self:start;z-index:4;height:calc(100vh - 74px);overflow-y:auto;overflow-x:hidden;padding:10px 6px;background:#172b3f}
  aside button{display:block;min-width:0;width:100%;padding:9px 6px;margin-bottom:3px;border-radius:7px;font-size:10.5px;line-height:1.18;white-space:normal;overflow-wrap:anywhere}
  main{min-width:0;padding:10px;font-size:12px;overflow-x:hidden}
  h1{font-size:21px;margin:8px 0 12px}h2{font-size:16px}.card{padding:11px;border-radius:10px}.grid,.documentMachineGrid{grid-template-columns:1fr;gap:9px}.two{grid-template-columns:1fr;gap:9px}
  .primary,.danger,.secondary,.warningBtn{padding:8px 9px;font-size:11px}.bigBtn{padding:10px 11px;font-size:12px}.actions{gap:5px}.row{gap:6px}.metric strong{font-size:22px}
  .form input,.form textarea,.form select{padding:8px;font-size:16px}.tablewrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}table{min-width:520px}th,td{padding:8px;font-size:11px}
  .qrLayout{grid-template-columns:1fr}.qrBox{max-width:210px}.qrBox svg{width:190px;height:190px}.qrInfo .actions button{flex:0 1 auto;min-width:0}.qrInfo input{font-size:10px}
  .backupGrid{grid-template-columns:1fr}.backupFacts{grid-template-columns:repeat(2,1fr)}
  .mediaGrid{grid-template-columns:1fr}.mediaItem img,.mediaItem video{height:auto;max-height:180px}
}
@media(max-width:420px){
  .shell{grid-template-columns:116px minmax(0,1fr)}
  aside button{font-size:9.8px;padding:8px 5px}
  main{padding:8px}
  .headerFtBrand{width:78px}.headerFtBrand img{width:74px}.customerBrand{max-width:88px}.customerBrand img{max-width:84px}.adminLoginBtn,.adminLogout{font-size:10px;padding:7px 6px}
}


/* V4.1 - customer logo hierarchy + repair spare-parts booking */
.customerBrand{height:86px;min-width:300px;max-width:480px;flex:1}
.customerBrand img{max-height:82px;max-width:460px;width:auto;object-fit:contain}
.repairPartRow{display:grid;grid-template-columns:minmax(0,1fr) 90px auto;gap:8px;align-items:center;margin:8px 0}
.repairPartRow select,.repairPartRow input{min-width:0;width:100%;box-sizing:border-box}
.compactBtn{white-space:nowrap}.subtleCard{padding:10px 12px;background:#f7f9fb;border:1px solid #dfe6ec;border-radius:9px;color:#66727f}.linkBtn{border:0;background:transparent;color:#0b57b7;text-decoration:underline;cursor:pointer;padding:0;font:inherit;font-weight:700}
@media(max-width:800px){.customerBrand{height:62px;min-width:132px;max-width:170px;flex:1}.customerBrand img{max-height:60px;max-width:166px}.repairPartRow{grid-template-columns:minmax(0,1fr) 64px}.repairPartRow .compactBtn{grid-column:1/-1;justify-self:start}}
@media(max-width:420px){.customerBrand{min-width:118px;max-width:146px}.customerBrand img{max-width:142px}}