.hb-app{--hb-bg:#111c23;--hb-card:#17262d;--hb-panel:#20313a;--hb-edge:#38505a;--hb-text:#eff4ed;--hb-muted:#adc0c2;--hb-accent:#a9d8ca;--hb-gold:#debd7c;--hb-green:#75b5a0;--hb-amber:#d6a65b;--hb-red:#c67266;box-sizing:border-box;width:100%;max-width:1460px;margin:20px auto 40px;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--hb-text);font-size:14px;line-height:1.45}
.hb-app *,.hb-app *::before,.hb-app *::after{box-sizing:border-box}
.hb-app button,.hb-app input{font-family:inherit}.hb-app button{cursor:pointer;transition:background .18s,transform .16s,border-color .18s;line-height:1.4}
.hb-app button:disabled{opacity:.42;cursor:not-allowed}.hb-app button:not(:disabled):hover{filter:brightness(1.11)}.hb-app button:focus-visible,.hb-app input:focus-visible,.hb-app [data-go]:focus-visible{outline:3px solid #e3c181;outline-offset:3px}
.hb-app .hb-shell{background:radial-gradient(ellipse at 28% -8%,#37515c 0%,transparent 35%),linear-gradient(155deg,#1a2b33,#111a21 63%,#10181f);border:1px solid #38515c;border-radius:17px;padding:clamp(14px,2.5vw,30px);box-shadow:0 20px 68px #0003;overflow:hidden;isolation:isolate}
.hb-app .hb-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:4px 0 22px}
.hb-app .hb-header h2{font-family:Georgia,serif;font-size:clamp(28px,3vw,42px);font-weight:500;line-height:1.12;color:#f2eee0;padding:0;margin:8px 0 7px;letter-spacing:.01em}
.hb-app .hb-header p{color:#bbc8c6;margin:0;font-size:13px}
.hb-app .hb-kicker{color:var(--hb-gold);font-size:10px;letter-spacing:.2em;font-weight:800;text-transform:uppercase}.hb-app .hb-kicker span{padding:0 8px}
.hb-app .hb-header-role{white-space:nowrap;border:1px solid #6c786d;border-radius:30px;color:#e7ddbb;font-weight:750;letter-spacing:.11em;font-size:10px;padding:8px 13px;background:#1c2a30}
.hb-app .hb-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;border:1px solid var(--hb-edge);border-radius:10px;background:var(--hb-edge);overflow:hidden;margin-bottom:16px}
.hb-app .hb-metrics>div{padding:12px 16px;background:#1b2c35;display:flex;flex-direction:column;gap:3px}
.hb-app .hb-metrics span{font-size:10px;color:#a6b9ba;text-transform:uppercase;letter-spacing:.1em;font-weight:750}
.hb-app .hb-metrics strong{font-size:24px;line-height:1.25;letter-spacing:-.02em;font-weight:600;font-variant-numeric:tabular-nums;color:#eff2ed}
.hb-app .hb-metrics strong small{font-size:11px;font-weight:500;color:#9eb3b6}
.hb-app .hb-map-card{border:1px solid #45606b;background:radial-gradient(ellipse at 50% 63%,#31515d66,transparent 64%),linear-gradient(180deg,#1b303a,#16262e);border-radius:12px;overflow:hidden}
.hb-app .hb-map-head{padding:17px 18px 3px;display:flex;justify-content:space-between;align-items:center;gap:15px}
.hb-app h3{margin:0;line-height:1.25;color:#f3f1e7;font-weight:650;font-size:19px}
.hb-app .hb-map-head h3{font-size:17px;margin-top:4px}
.hb-app .hb-map-status{font-size:11px;color:#d8e5d9;background:#263e43;border:1px solid #607c7c;border-radius:30px;padding:8px 13px;text-align:right}
.hb-app .hb-map-scroll{overflow-x:auto;scrollbar-color:#536c72 transparent;scrollbar-width:thin;padding:0 4px}
.hb-app .hb-bridge-svg{display:block;width:100%;min-width:860px;height:auto;max-height:480px;overflow:visible}
.hb-app .hb-map-coast{font-size:11px;letter-spacing:.14em;font-weight:800;fill:#b4c3c2}.hb-app .hb-map-legend{font-size:10px;letter-spacing:.16em;fill:#a3bebe}
.hb-app .hb-map-node,.hb-app .hb-platform-node{transition:opacity .2s ease,filter .2s ease}.hb-app .hb-clickable{cursor:pointer}.hb-app .hb-locked{cursor:not-allowed;opacity:.34;filter:grayscale(.95)}
.hb-app .hb-map-glow{fill:transparent;stroke:transparent;stroke-width:3;transition:fill .2s,stroke .2s}
.hb-app .hb-clickable:hover .hb-map-glow,.hb-app .hb-selected .hb-map-glow{fill:#c5e3d516;stroke:#cfe6d4}
.hb-app .hb-map-deck{fill:#524d44;stroke:#948b7a;stroke-width:2;filter:drop-shadow(0 4px 3px #0005);transition:fill .2s}
.hb-app .hb-map-planks{fill:none;stroke:#d9caac;stroke-opacity:.2;stroke-width:3}.hb-app .hb-map-rail{fill:none;stroke:#9eaba7;stroke-width:5;stroke-linecap:round;stroke-opacity:.75}
.hb-app .hb-map-number{font-family:Georgia,serif;font-size:26px;font-weight:700;fill:#f9f6ed;paint-order:stroke fill;stroke:#253137;stroke-width:4}
.hb-app .hb-map-sp{fill:#e2e9e5;font-size:11px;font-weight:850;letter-spacing:.07em;paint-order:stroke fill;stroke:#283038;stroke-width:3}
.hb-app .hb-map-lock{fill:#b8b7a7;font-size:19px}.hb-app .hb-unstable .hb-map-deck{fill:#8e7045;stroke:#e0b36a}.hb-app .hb-stable .hb-map-deck{fill:#4f8074;stroke:#a6d4b6}.hb-app .hb-secure .hb-map-deck{fill:#3d927d;stroke:#b5e9bc}.hb-app .hb-critical .hb-map-deck,.hb-app .hb-collapsed .hb-map-deck{fill:#8b4f4e;stroke:#d68f7e}
.hb-app .hb-platform-aura{fill:#75cbd014;stroke:#639d9a;stroke-width:3;stroke-dasharray:7 6}.hb-app .hb-platform-ring{fill:#193c45;stroke:#8ac6ca;stroke-width:5}.hb-app .hb-platform-core{fill:#2b5661;stroke:#b1d2cb;stroke-width:1}.hb-app .hb-platform-rune{fill:none;stroke:#b6e5d6;stroke-width:2}.hb-app .hb-platform-title{font:700 22px Georgia,serif;fill:#ecf5e9}.hb-app .hb-platform-score{font-size:11px;font-weight:800;fill:#d8eeee;letter-spacing:.12em}.hb-app .hb-platform-node.hb-selected .hb-platform-aura,.hb-app .hb-platform-node.hb-clickable:hover .hb-platform-aura{stroke:#f3d29d;stroke-width:5}.hb-app .hb-platform-node.hb-critical .hb-platform-ring,.hb-app .hb-platform-node.hb-collapsed .hb-platform-ring{stroke:#d0786a}.hb-app .hb-platform-node.hb-secure .hb-platform-ring{stroke:#b0ead0}
.hb-app .hb-legend{border-top:1px solid #344d57;display:flex;flex-wrap:wrap;gap:10px 17px;padding:12px 17px;font-size:11px;color:#b4c6c7}.hb-app .hb-legend>span{white-space:nowrap}.hb-app .hb-dot{width:9px;height:9px;display:inline-block;border-radius:3px;margin-right:6px;background:#9db2ac}.hb-app .hb-critical-dot{background:#c67266}.hb-app .hb-unstable-dot{background:#d6a65b}.hb-app .hb-stable-dot{background:#75b5a0}.hb-app .hb-secure-dot{background:#4ad0a5}.hb-app .hb-locked-dot{background:#62747a}
.hb-app .hb-columns{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(310px,.8fr);gap:15px;margin-top:16px;align-items:start}.hb-app .hb-main-col,.hb-app .hb-side-col{display:flex;flex-direction:column;gap:15px;min-width:0}
.hb-app .hb-panel{border:1px solid #3e535b;background:linear-gradient(160deg,#21323a,#192930);border-radius:11px;padding:19px 21px;box-shadow:0 7px 14px #00000013}
.hb-app .hb-panel-overline{font-size:10px;letter-spacing:.17em;font-weight:800;color:#d8b981;margin-bottom:8px}.hb-app .hb-current-tag{margin-left:8px;display:inline-block;letter-spacing:.07em;padding:3px 7px;font-size:9px;border-radius:5px;background:#587f6a;color:#f2faee}.hb-app .hb-muted-tag{background:#45575e;color:#d0dddb}
.hb-app .hb-desc{margin:9px 0 17px;font-size:13px;color:#c5d1cf;line-height:1.65}
.hb-app .hb-durability{padding:13px;background:#13232a;border:1px solid #3a545b;border-radius:9px}.hb-app .hb-dura-main{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.hb-app .hb-dura-main span{font-size:12px;font-weight:700;color:#d9e4da}.hb-app .hb-dura-main strong{font-size:24px;color:#edf5ec;font-variant-numeric:tabular-nums}.hb-app .hb-dura-main small{font-size:12px;font-weight:500;color:#a9bebe}.hb-app .hb-track{height:10px;border-radius:5px;background:#384047;overflow:hidden;margin:8px 0}.hb-app .hb-track span{height:100%;display:block;background:#c47b6d;border-radius:5px;transition:width .25s}.hb-app .hb-durability.hb-unstable .hb-track span{background:#d6a65b}.hb-app .hb-durability.hb-stable .hb-track span{background:#83b9a3}.hb-app .hb-durability.hb-secure .hb-track span{background:#4ed2a8}.hb-app .hb-dura-bottom{display:flex;justify-content:space-between;color:#aebec1;font-size:10px}
.hb-app .hb-danger-note{font-size:12px;color:#e1ceb1;display:flex;align-items:flex-start;gap:8px;margin:12px 0 18px}.hb-app .hb-danger-note span{display:grid;flex:0 0 18px;place-items:center;background:#7a5245;color:white;font-weight:800;border-radius:100%;font-size:11px;height:18px}
.hb-app .hb-section-label{font-size:10px;color:#d4b77f;letter-spacing:.13em;text-transform:uppercase;font-weight:850;margin:14px 0 10px}
.hb-app .hb-skill-list{display:grid;gap:6px}.hb-app .hb-skill-item{display:flex;align-items:center;gap:10px;padding:9px 11px;border:1px solid #415861;border-radius:7px;background:#192d34;color:#e0e9e4;font-size:12px;cursor:pointer}.hb-app .hb-skill-item:hover,.hb-app .hb-skill-item.is-selected{border-color:#92b7ab;background:#2b444a}.hb-app .hb-skill-item input{accent-color:#81c8ac;flex:0 0 auto;width:14px;height:14px;margin:0}.hb-app .hb-skill-item span{flex:1}.hb-app .hb-skill-item strong{white-space:nowrap;color:#f3d99e;font-size:12px}
.hb-app .hb-check-panel{border-top:1px solid #3b505a;margin-top:19px;padding-top:4px}.hb-app .hb-roll-inputs{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;align-items:end}.hb-app .hb-roll-inputs label{display:flex;flex-direction:column;gap:5px;color:#b4c6c6;font-size:11px}.hb-app .hb-roll-inputs input{border:1px solid #658089;border-radius:7px;height:38px;background:#13272e;color:white;min-width:0;width:100%;padding:7px 9px;font-weight:600}.hb-app .hb-dice-button{background:#3a5862;border:1px solid #8ca2a2;border-radius:7px;height:38px;color:#f4e2be;font-weight:650;padding:0 11px;font-size:12px}
.hb-app .hb-material-check{margin-top:13px;display:flex;align-items:center;gap:7px;font-size:12px;color:#d4e0d9}.hb-app .hb-material-check input{accent-color:#7dc5aa}
.hb-app .hb-action-row{margin-top:13px}.hb-app .hb-primary,.hb-app .hb-next-button{display:block;width:100%;padding:12px 13px;border-radius:8px;border:1px solid #8bc7aa;background:#548b77;color:#fbfff9;font-size:13px;font-weight:750}.hb-app .hb-primary{background:#3c817a}.hb-app .hb-mini-info{font-size:11px;color:#afc0c3;line-height:1.45;margin:9px 0}
.hb-app .hb-manual-tools{display:flex;align-items:center;flex-wrap:wrap;gap:5px;margin-top:17px;padding-top:13px;border-top:1px solid #3a4d57}.hb-app .hb-manual-tools span{margin-right:auto;color:#b6c7c6;font-size:11px}.hb-app .hb-manual-tools button,.hb-app .hb-value-buttons button{background:#31464e;color:#e4f2eb;border:1px solid #58727b;border-radius:6px;padding:5px 10px;font-size:12px;min-width:37px}
.hb-app .hb-next-block{margin-top:18px;border:1px solid #455b5d;background:#172b31;padding:12px;border-radius:9px}.hb-app .hb-next-button:disabled{filter:grayscale(.6)}.hb-app .hb-risk-button{display:block;width:100%;background:transparent;border:1px dashed #b7885a;color:#e6bb83;border-radius:7px;padding:10px;margin-top:9px;font-size:12px;font-weight:700}.hb-app .hb-readonly-hint,.hb-app .hb-view-only{font-size:12px;color:#a9bdbe;line-height:1.55;margin:13px 0 0}
.hb-app .hb-resource-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:15px 0}.hb-app .hb-resource{border:1px solid #3d5660;background:#182b33;border-radius:8px;padding:12px 9px}.hb-app .hb-resource-title{color:#adbec0;font-size:11px;display:block;margin-bottom:10px}.hb-app .hb-value-buttons{display:flex;align-items:center;justify-content:space-between;gap:5px}.hb-app .hb-value-buttons strong{font-size:21px;font-weight:650;color:#eef3e8;font-variant-numeric:tabular-nums}.hb-app .hb-value-buttons button{font-size:17px;padding:4px 8px}
.hb-app .hb-mode-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.hb-app .hb-switch{background:#1a2d35;border:1px solid #48616a;border-radius:8px;padding:10px 6px;font-size:12px;color:#a7bbbe}.hb-app .hb-switch.is-on{border-color:#9ac2ac;background:#3b625a;color:#fff2d4;font-weight:750}
.hb-app .hb-alarm-box{margin-top:18px;background:#14242c;border:1px solid #3c535d;border-radius:9px;padding:12px}.hb-app .hb-alarm-label{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:#d3d9ce}.hb-app .hb-alarm-label strong{color:#f1c385}.hb-app .hb-alarm-bars{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;margin:10px 0}.hb-app .hb-alarm-bars i{height:10px;background:#34444a;border-radius:3px}.hb-app .hb-alarm-bars i.active{background:#d29965}.hb-app .hb-alarm-box p{font-size:11px;color:#a6babe;margin:0;line-height:1.5}.hb-app .hb-spell-note{color:#b4c5be;font-size:12px;border-left:2px solid #7caaab;padding-left:11px;line-height:1.65;margin:18px 0}.hb-app .hb-reset{width:100%;padding:9px;border:1px solid #785958;background:transparent;color:#dfada3;border-radius:7px;font-size:11px}
.hb-app .hb-history-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.hb-app .hb-history-head h3{font-size:15px}.hb-app .hb-history-head>span{color:#aabfc1;font-size:10px}.hb-app .hb-history-list{list-style:none;margin:10px 0 0;padding:0;max-height:295px;overflow-y:auto;scrollbar-color:#567078 transparent}.hb-app .hb-history-list li{border-bottom:1px solid #3b4d54;padding:10px 0;display:flex;gap:12px;font-size:11px;color:#c9d2d0;line-height:1.5}.hb-app .hb-history-list li:last-child{border-bottom:0}.hb-app .hb-history-list time{white-space:nowrap;color:#e1c190}.hb-app .hb-log-danger>span{color:#e4a8a0}.hb-app .hb-log-success>span{color:#b1dfc5}.hb-app .hb-log-warning>span{color:#e8cb9c}
.hb-app .hb-notice{padding:11px 15px;border:1px solid #6eac9e;background:#294740;border-radius:9px;margin-top:15px;color:#e8f7ee;font-size:12px}.hb-app .hb-notice-error{border-color:#c37f74;background:#59362f;color:#ffe1dd}.hb-app.hb-is-busy{pointer-events:none;opacity:.8}
.hb-app .hb-footer{border-top:1px solid #34474e;margin-top:20px;padding-top:15px;text-align:center;font-size:10px;letter-spacing:.08em;color:#849fa1}
.hb-app .hb-loading{padding:80px 20px;border-radius:12px;background:#192932;color:#d5e2da;text-align:center}
@media(max-width:950px){.hb-app .hb-columns{grid-template-columns:1fr}.hb-app .hb-side-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.hb-app .hb-bridge-svg{min-width:880px}.hb-app .hb-map-status{max-width:225px}}
@media(max-width:650px){.hb-app .hb-shell{padding:12px}.hb-app .hb-header{gap:10px}.hb-app .hb-header-role{padding:6px 8px;font-size:9px}.hb-app .hb-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.hb-app .hb-metrics>div{padding:10px}.hb-app .hb-map-head{display:block}.hb-app .hb-map-status{display:inline-block;margin-top:9px;max-width:none}.hb-app .hb-side-col{display:flex;flex-direction:column}.hb-app .hb-panel{padding:15px}.hb-app .hb-legend{gap:8px}.hb-app .hb-roll-inputs{grid-template-columns:1fr 1fr}.hb-app .hb-dice-button{grid-column:span 2}.hb-app .hb-header h2{font-size:30px}}
@media(prefers-reduced-motion:reduce){.hb-app button,.hb-app .hb-map-node,.hb-app .hb-platform-node{transition:none!important}}
/* v1.1 — neue Logistik- und Alarmmechanik */
.hb-app .hb-logistics{margin-top:0}
.hb-app .hb-logistics-part{margin-top:12px;padding:14px;border:1px solid #455d63;border-radius:9px;background:#172b32;display:flex;flex-direction:column;gap:8px}
.hb-app .hb-logistics-part>strong{font-size:12px;color:#ecdfc5}
.hb-app .hb-logistics-part>p{font-size:11px;line-height:1.55;color:#b9cac8;margin:0}
.hb-app .hb-logistics-part>label,.hb-app .hb-threat-controls label,.hb-app .hb-logistics-roll label{font-size:11px;color:#d4e3de;display:flex;flex-direction:column;gap:5px}
.hb-app .hb-logistics select,.hb-app .hb-logistics input,.hb-app .hb-threat select,.hb-app .hb-threat input{width:100%;min-width:0;height:36px;border:1px solid #658089;border-radius:6px;background:#142831;color:#f3efe5;padding:6px 9px;font-size:12px}
.hb-app .hb-logistics option,.hb-app .hb-threat option{color:#192b33;background:#f5f3e8}
.hb-app .hb-logistics-roll{display:grid;grid-template-columns:1fr 1fr 42px;gap:8px;align-items:end}
.hb-app .hb-small-action{min-height:36px;text-align:center;padding:8px 11px;background:#355e59;color:#ebf4e9;border:1px solid #80b3a1;border-radius:7px;font-size:12px;font-weight:750;width:100%}
.hb-app .hb-danger-action{background:#593b37;border-color:#aa7568}
.hb-app .hb-small-action:disabled{opacity:.38}
.hb-app .hb-alarm-timeline{display:grid;gap:4px;margin:13px 0}
.hb-app .hb-alarm-step{display:flex;align-items:flex-start;gap:10px;padding:6px 7px;border:1px solid transparent;border-radius:6px;opacity:.65}
.hb-app .hb-alarm-step>span{min-width:29px;height:24px;display:grid;place-items:center;border-radius:4px;background:#35484d;font-size:11px;color:#ece3ce;font-weight:750}
.hb-app .hb-alarm-step>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.hb-app .hb-alarm-step strong{font-size:11px;color:#d9e4df}
.hb-app .hb-alarm-step small{font-size:10px;line-height:1.45;color:#aabbbd}
.hb-app .hb-alarm-step.hb-alarm-done{opacity:1}
.hb-app .hb-alarm-step.hb-alarm-now{border-color:#bc875d;background:#513c32;opacity:1}
.hb-app .hb-threat{margin-top:16px;padding:18px 21px;background:linear-gradient(130deg,#503028,#322c2c);border:2px solid #bd7c62;border-radius:11px;box-shadow:0 8px 22px #0003}
.hb-app .hb-threat-head{display:flex;justify-content:space-between;gap:15px;align-items:center}
.hb-app .hb-threat h3{margin:7px 0;font-size:20px;color:#fff0d7}
.hb-app .hb-threat p{margin:0 0 13px;color:#f2d4c8;font-size:12px;line-height:1.55}
.hb-app .hb-threat-marker{display:grid;place-items:center;border-radius:50%;width:36px;height:36px;flex:0 0 36px;background:#9d4d40;color:#fff;font-size:23px;font-weight:900}
.hb-app .hb-threat-controls{display:grid;grid-template-columns:2fr 1fr 1fr 43px;gap:8px;align-items:end;margin:12px 0}
.hb-app .hb-threat-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:12px}
.hb-app .hb-threat-actions button{width:auto;flex:1 1 220px;min-height:40px}
.hb-app .hb-hazard-button{padding:10px 13px;background:transparent;border:1px solid #e0aa89;color:#f4d2c2;border-radius:8px;font-size:12px;font-weight:700}
@media(max-width:650px){.hb-app .hb-threat{padding:14px}.hb-app .hb-threat-controls{grid-template-columns:1fr 1fr}.hb-app .hb-threat-controls label:first-child{grid-column:1 / -1}.hb-app .hb-threat-controls .hb-dice-button{height:36px}}
