/* JoergsMoba4N – Modellbahn-Planer */
.pl-app{display:grid;grid-template-columns:272px minmax(0,1fr) 262px;grid-template-rows:auto minmax(0,1fr) auto;height:calc(100vh - 70px);min-height:560px;background:var(--bg);border-top:1px solid var(--line)}
.pl-bar{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:8px 12px;background:var(--surface);border-bottom:1px solid var(--line)}
.pl-bar .grp{display:flex;gap:4px;align-items:center;padding-right:8px;margin-right:2px;border-right:1px solid var(--line)}
.pl-bar .grp:last-child{border-right:none}
.pl-bar button,.pl-bar summary,.pl-btns button,.pl-btnlink,.pl-acts button{font:600 .86rem var(--sans);color:var(--ink);background:var(--surface);border:1px solid var(--line-strong);border-radius:7px;padding:6px 10px;cursor:pointer;list-style:none;white-space:nowrap;text-decoration:none;display:inline-flex;align-items:center;gap:5px}
.pl-bar button:hover,.pl-bar summary:hover,.pl-btns button:hover,.pl-btnlink:hover{border-color:var(--primary);color:var(--primary-dark)}
.pl-bar button.on,.pl-btns button.on{background:var(--primary);color:#fff;border-color:var(--primary)}
.pl-bar summary::-webkit-details-marker{display:none}
.pl-bar details{position:relative}
.pl-bar details[open] summary{border-color:var(--primary)}
.pl-menu{position:absolute;top:calc(100% + 4px);left:0;z-index:30;min-width:220px;background:var(--surface);border:1px solid var(--line-strong);border-radius:9px;box-shadow:var(--shadow-lg);padding:5px;display:flex;flex-direction:column}
.pl-menu button{border:none;justify-content:flex-start;border-radius:6px;padding:8px 10px}
.pl-menu button:hover{background:var(--surface-2)}
.pl-menu hr{border:none;border-top:1px solid var(--line);margin:4px 0}
#plZoom{font:600 .8rem var(--mono);min-width:52px;text-align:center;color:var(--ink-soft)}
.pl-side{grid-row:2/4;display:flex;flex-direction:column;min-height:0;border-right:1px solid var(--line);background:var(--surface)}
.pl-side .top{padding:10px;display:flex;flex-direction:column;gap:8px;border-bottom:1px solid var(--line)}
.pl-side select,.pl-side input{width:100%;font:1rem var(--sans);padding:7px 9px;border:1px solid var(--line-strong);border-radius:7px;background:var(--surface);color:var(--ink)}
#plTabs{display:flex;gap:4px}
#plTabs button{flex:1;font:600 .86rem var(--sans);padding:6px;border:1px solid var(--line-strong);background:var(--surface);border-radius:7px;cursor:pointer;color:var(--ink)}
#plTabs button.on{background:var(--primary);border-color:var(--primary);color:#fff}
#plParts{overflow:auto;padding:6px 10px 14px;flex:1;min-height:0}
.pl-grp{font:700 .72rem var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--brass-dark);margin:12px 0 5px}
.pl-part{display:flex;gap:9px;align-items:center;width:100%;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:6px 8px;margin-bottom:5px;cursor:pointer;color:var(--ink);font:.84rem/1.25 var(--sans)}
.pl-part:hover{border-color:var(--primary);background:var(--primary-soft)}
.pl-part svg{width:58px;height:30px;flex:none}
.pl-part svg path{fill:none;stroke:#8c8476;stroke-linecap:butt}
.pl-part b{display:block;font-family:var(--mono);font-size:.8rem}
.pl-part b i{font-style:normal;color:var(--claret);font-weight:800}
.pl-part small{display:block;color:var(--ink-faint);font-size:.74rem}
.pl-bico{width:40px;max-height:30px;flex:none;background:#e2d2b3;border:1px solid #7a6a4f;border-radius:3px;aspect-ratio:3/2}
.pl-note{font-size:.8rem;color:var(--ink-faint);margin:10px 0}
.pl-stage{position:relative;min-width:0;min-height:0;overflow:hidden;background:#dfe3ea}
#pl2d,#pl3d{position:absolute;inset:0}
#plSvg{width:100%;height:100%;display:block;touch-action:none;cursor:default;user-select:none}
.pl-board{fill:#efe6d2;stroke:#6b5a3e;stroke-width:2;vector-effect:non-scaling-stroke}
.pl-piece{cursor:grab}
.pl-piece .bed{fill:none;stroke-linecap:butt;stroke-linejoin:round}
.pl-piece .slp{fill:none;stroke:#5b5246;stroke-linecap:butt;pointer-events:none}
.pl-piece .rail{fill:none;stroke:#b9bec6;pointer-events:none}
.pl-piece .stop{stroke:#c0392b;pointer-events:none}
.pl-piece .hlab{fill:#1f2a44;text-anchor:middle;font-weight:700;font-family:var(--sans);pointer-events:none;paint-order:stroke;stroke:#fff;stroke-width:.8}
.pl-piece.sel .bed{stroke:#e0a526!important}
.pl-conn{fill:#d64541;stroke:#fff;stroke-width:1;vector-effect:non-scaling-stroke;cursor:pointer}
.pl-conn.anchor{fill:#2e9d4f}
.pl-bld{cursor:grab}
.pl-bld rect{fill:#e9dcc3;stroke:#7a6a4f;stroke-width:1.2;vector-effect:non-scaling-stroke}
.pl-bld.sel rect{stroke:#e0a526;stroke-width:3}
.pl-bld text{fill:#3d3325;text-anchor:middle;font-family:var(--sans);pointer-events:none}
.pl-vtx{fill:#fff;stroke:var(--primary);stroke-width:2;vector-effect:non-scaling-stroke;cursor:move}
.pl-mid{fill:var(--primary);opacity:.55;cursor:copy}
.pl-elen{fill:var(--primary-dark);text-anchor:middle;font-family:var(--mono);font-weight:700;pointer-events:none;paint-order:stroke;stroke:#fff;stroke-width:3px;vector-effect:non-scaling-stroke}
#pl3dCanvas{position:absolute;inset:0}
#pl3dCanvas canvas{display:block}
#pl3dBar{position:absolute;left:10px;top:10px;display:flex;gap:6px;align-items:center;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line-strong);border-radius:9px;padding:6px 8px;box-shadow:var(--shadow);font-size:.84rem}
#pl3dBar button{font:600 .82rem var(--sans);border:1px solid var(--line-strong);background:var(--surface);border-radius:6px;padding:5px 8px;cursor:pointer;color:var(--ink)}
#pl3dMsg{position:absolute;inset:0;display:grid;place-items:center;font-weight:600;color:var(--ink-soft)}
#pl3dMsg[hidden]{display:none}
.pl-props{grid-row:2/4;grid-column:3;overflow:auto;padding:12px 14px;border-left:1px solid var(--line);background:var(--surface);font-size:.9rem}
.pl-props h3{font-size:1.1rem;margin:0 0 2px}
.pl-sub{font-size:.82rem;color:var(--ink-soft);margin:0 0 10px}
.pl-sub .warn{color:var(--claret)}
.pl-sec{font:700 .72rem var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--brass-dark);margin:16px 0 6px;padding-top:10px;border-top:1px solid var(--line)}
.pl-f{display:flex;flex-direction:column;gap:3px;margin-bottom:8px;font-size:.8rem;color:var(--ink-soft);font-weight:600}
.pl-f input,.pl-f select{font:.95rem var(--sans);padding:6px 8px;border:1px solid var(--line-strong);border-radius:6px;background:var(--surface);color:var(--ink);width:100%}
.pl-row2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pl-row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}
.pl-btns{display:flex;flex-wrap:wrap;gap:5px;margin:6px 0 10px}
.pl-btns button.danger,.pl-acts button.danger{color:var(--danger);border-color:oklch(0.5 0.15 27 / .4)}
.pl-chk{display:flex;gap:7px;align-items:center;margin:4px 0;font-size:.88rem}
.pl-link{background:none;border:none;color:var(--primary-dark);font:600 .82rem var(--sans);padding:0;cursor:pointer;text-decoration:underline;margin-bottom:10px}
.pl-help{margin:0;padding-left:18px;font-size:.8rem;color:var(--ink-soft);display:flex;flex-direction:column;gap:4px}
.pl-status{grid-column:2;display:flex;justify-content:space-between;gap:12px;padding:5px 12px;font:.76rem var(--mono);color:var(--ink-soft);background:var(--surface);border-top:1px solid var(--line)}
.pl-modal{position:fixed;inset:0;z-index:200;background:oklch(0.2 0.02 250 / .45);display:grid;place-items:center;padding:20px}
.pl-modal[hidden]{display:none}
.pl-modal .box{background:var(--surface);border-radius:14px;box-shadow:var(--shadow-lg);width:min(860px,100%);max-height:88vh;overflow:auto;padding:22px 24px}
.pl-modal .hd{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.pl-modal .hd h2{margin:0;font-size:1.4rem}
.pl-modal .hd button{border:none;background:none;font-size:1.6rem;cursor:pointer;color:var(--ink-soft)}
.pl-modal h4{margin:16px 0 6px}
.pl-bom{width:100%;border-collapse:collapse;font-size:.9rem}
.pl-bom th{text-align:left;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);border-bottom:2px solid var(--line-strong);padding:6px 8px}
.pl-bom td{border-bottom:1px solid var(--line);padding:6px 8px}
.pl-bom td.n{text-align:right;font-weight:700;width:48px}
.pl-bom td.m{font-family:var(--mono)}
.pl-bom td i{font-style:normal;color:var(--claret);font-weight:800}
.pl-acts{display:flex;gap:6px;justify-content:flex-end}
@media (max-width:1100px){.pl-app{grid-template-columns:240px minmax(0,1fr) 230px}}
@media (max-width:860px){
.pl-app{display:flex;flex-direction:column;height:auto}
.pl-side{max-height:300px;border-right:none;border-bottom:1px solid var(--line)}
.pl-stage{height:62vh;min-height:360px;flex:none}
.pl-props{border-left:none;border-top:1px solid var(--line)}
}

.pl-stage.pl-drop{outline:3px dashed var(--brass);outline-offset:-8px}

.pl-acct{margin-left:auto;align-items:center;gap:8px}
.pl-acct-name{font-weight:600;font-size:.9rem;white-space:nowrap}
.pl-acct-btn{background:var(--brass)!important;color:oklch(0.23 0.04 60)!important;border-color:var(--brass-dark)!important;font-weight:700}
.pl-acct-tabs{display:flex;gap:6px;margin-bottom:14px;border-bottom:1px solid var(--line)}
.pl-acct-tabs button{background:none;border:none;border-bottom:3px solid transparent;padding:8px 12px;font-weight:600;cursor:pointer;color:var(--ink-soft)}
.pl-acct-tabs button.on{border-color:var(--primary);color:var(--ink)}
.pl-acct-form{min-width:min(360px,80vw)}
.pl-acct-form .pl-f input{width:100%}
.pl-acct-err{color:var(--danger);background:var(--danger-soft);border:1px solid oklch(0.5 0.15 27 / .35);border-radius:6px;padding:8px 10px;font-size:.9rem}
.pl-primary{background:var(--primary)!important;color:#fff!important;border-color:var(--primary-dark)!important}
.pl-acct-del{color:var(--danger)!important;font-weight:600}
.pl-piece.out .bed{stroke:#d63b3b!important}
.pl-sub.warn{color:var(--danger);font-weight:600}
.pl-box{fill:oklch(0.55 0.12 250 / .12);stroke:oklch(0.5 0.14 250);stroke-dasharray:6 4;pointer-events:none}
.pl-piece:hover .bed{filter:brightness(1.12)}
.pl-dxf{pointer-events:none}.pl-dxf-el{fill:none;stroke:#b0452e;stroke-linejoin:round;stroke-linecap:round}.pl-dxf.edit{pointer-events:auto}.pl-dxf.edit .pl-dxf-el{cursor:pointer;pointer-events:stroke}.pl-dxf-el.sel{stroke:#1f6fd1}
.pl-fh{fill:#2fa64a;stroke:#fff;cursor:grab}.pl-fh:hover{fill:#1f8a38}