:root{--tnc-blue:#003c82;--tnc-blue-2:#1b529e;--tnc-dark:#162033;--tnc-light:#f4f7fb;--navy:var(--tnc-dark);--blue:var(--tnc-blue);--canvas:#edf2f7;--line:#d8e0ea}
.topbar{height:64px;min-width:0;padding:0 18px;gap:18px;border-bottom:1px solid #d6e0ec;box-shadow:0 2px 10px rgba(22,32,51,.05);overflow:visible}
.brand{flex:0 0 auto;gap:10px;min-width:max-content;color:var(--tnc-dark);text-decoration:none}
.brand>img{display:block;width:82px;height:48px;object-fit:contain;object-position:center}
.brand>span.brand-divider{display:block;width:1px;height:26px;border-radius:0;background:#d4dce7;color:initial;font-size:initial;font-weight:initial}
.brand>strong{font-size:15px;font-weight:750;letter-spacing:-.01em;white-space:nowrap}
.app-nav{display:flex;align-items:stretch;align-self:stretch;gap:2px;min-width:0;flex:1;overflow-x:auto;overflow-y:visible;scrollbar-width:none}
.app-nav::-webkit-scrollbar{display:none}
.nav-menu{position:relative;flex:0 0 auto}
.nav-menu>summary{display:flex;align-items:center;height:64px;padding:0 10px;border:0;border-bottom:3px solid transparent;color:#344054;font-size:13px;font-weight:700;white-space:nowrap;list-style:none;cursor:pointer;user-select:none}
.nav-menu>summary::-webkit-details-marker{display:none}
.nav-menu>summary::after{content:"⌄";margin-left:6px;color:#667085;font-size:13px;line-height:1;transform:translateY(-1px)}
.nav-menu[open]>summary{border-bottom-color:var(--tnc-blue);color:var(--tnc-blue);background:#f5f9ff}
.nav-menu>summary:focus-visible,.menu-action:focus-visible,.menu-input:focus-visible{outline:3px solid rgba(0,60,130,.22);outline-offset:-2px}
.nav-popover{position:absolute;z-index:100;top:calc(100% - 1px);left:0;width:286px;max-height:calc(100vh - 80px);overflow-y:auto;padding:8px;background:#fff;border:1px solid #d6e0ec;border-radius:0 0 8px 8px;box-shadow:0 16px 35px rgba(22,32,51,.18)}
.nav-popover.wide{width:320px}.menu-title{margin:4px 8px 8px;color:#667085;font-size:10px;font-weight:800;letter-spacing:.09em;text-transform:uppercase}.nav-popover hr{height:1px;margin:7px 4px;border:0;background:#e5eaf0}
.menu-action{display:block;width:100%;min-height:34px;padding:8px 10px;border:0;border-radius:5px;background:transparent;color:#344054;text-align:left;font:inherit;line-height:1.25;cursor:pointer;text-decoration:none}
.menu-action:hover:not(:disabled){background:#eef5ff;color:#003c82}.menu-action b,.menu-action small{display:block}.menu-action b{font-size:12px;font-weight:750}.menu-action small{margin-top:2px;color:#667085;font-size:11px;font-weight:500}.menu-action:disabled{opacity:.45;cursor:not-allowed}.primary-action{background:var(--tnc-blue);color:#fff}.primary-action small{color:#fff}.primary-action:hover:not(:disabled){background:var(--tnc-blue-2);color:#fff}.danger-action{color:#9f1c12}.danger-action:hover:not(:disabled){background:#fff1f0;color:#9f1c12}
.menu-input,.menu-field input{width:calc(100% - 20px);min-height:34px;margin:3px 10px 7px;padding:7px 8px;border:1px solid #b9c5d3;border-radius:5px;color:var(--text);background:#fff;font:inherit;font-size:12px}.menu-field{display:block;margin:4px 10px;color:#475467;font-size:11px;font-weight:700}.menu-field input{width:100%;margin:4px 0 1px}.menu-inline{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:0 4px}.menu-inline .menu-action{padding:8px 6px;text-align:center}
.topbar-actions{display:flex;align-items:center;align-self:stretch;gap:6px;flex:0 0 auto}.zoom-control{height:34px;padding:2px 4px;border:1px solid #d0d9e4;border-radius:6px;background:#fff;gap:2px}.zoom-control span{min-width:42px;font-size:11px;color:#475467}.icon-button{width:28px;height:28px;padding:0;border:0;border-radius:4px;background:#fff;color:#344054;font-size:18px;line-height:1;cursor:pointer}.icon-button:hover:not(:disabled){background:#edf4ff;color:#003c82}.icon-button:disabled{opacity:.45;cursor:not-allowed}
.account-menu>summary{padding:0}.account-menu>summary::after{display:none}.account-menu .user-role{height:32px;display:flex;align-items:center;padding:0 9px;border-color:#cbd7e5;color:#344054;background:#f8fafc}.account-menu[open] .user-role{border-color:#003c82;color:#003c82;background:#eef5ff}.account-popover{right:0;left:auto;width:230px}
.app-layout{min-height:calc(100vh - 64px)}
.left-panel{padding:18px 14px}.left-panel section{padding-bottom:16px;margin-bottom:16px}.left-panel h2,.right-panel h2{color:#162033;font-size:12px;text-transform:uppercase;letter-spacing:.055em}.tools-panel .panel-heading{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.tools-panel .panel-heading .compact{margin:0;white-space:nowrap}.tool-groups{display:grid;gap:5px}.tool-group{border:1px solid #dce4ee;border-radius:6px;background:#fff;overflow:hidden}.tool-group>summary{position:relative;padding:9px 26px 9px 10px;color:#344054;font-size:12px;font-weight:750;list-style:none;cursor:pointer;user-select:none}.tool-group>summary::-webkit-details-marker{display:none}.tool-group>summary::after{content:"›";position:absolute;right:10px;top:6px;color:#667085;font-size:19px;line-height:1;transform:rotate(0deg)}.tool-group[open]>summary{color:#003c82;background:#f5f9ff;border-bottom:1px solid #dce4ee}.tool-group[open]>summary::after{transform:rotate(90deg)}.tool-group-content{padding:4px 5px 6px}.tool{margin:2px 0;padding:8px 7px;border-radius:4px;font-size:12px}.tool b{width:22px;color:#475467}.tool.active{border-color:#a7c8f8;background:#eaf3ff;color:#003c82}.tool.active b{color:#003c82}.tool.danger.active{border-color:#f3c1bb;background:#fff4f2;color:#9f1c12}.tool-setting{margin:7px 5px;color:#475467}.tools-panel>.muted{padding:7px 8px;margin:7px 0 0;border-left:3px solid #bfd1e8;background:#f7faff;font-size:10.5px}
@media(max-width:1050px){.topbar{padding:0 12px;gap:10px}.brand>img{width:72px}.brand-divider{display:none!important}.brand>strong{display:none}.nav-menu>summary{padding:0 8px}.app-layout{grid-template-columns:245px minmax(0,1fr)}}
@media(max-width:720px){.topbar{height:58px;padding:0 9px;gap:8px}.brand>img{width:58px;height:44px}.app-nav{align-self:stretch;gap:0}.nav-menu>summary{height:58px;padding:0 7px;font-size:12px}.nav-menu>summary::after{margin-left:3px}.topbar-actions .zoom-control{display:none}.account-menu>summary{height:58px}.account-menu .user-role{width:30px;padding:0;border-radius:50%;font-size:0;justify-content:center}.account-menu .user-role::before{content:"●";font-size:13px}.nav-popover{position:fixed;top:58px;left:8px;width:calc(100vw - 16px);max-height:calc(100vh - 70px);border-radius:0 0 8px 8px}.account-popover{right:8px;left:auto;width:min(230px,calc(100vw - 16px))}.app-layout{min-height:calc(100vh - 58px)}.left-panel{padding:12px}.toolbar{display:none}}
/* Desktop: Popover dürfen nicht durch eine Scroll-Box der Menüleiste abgeschnitten werden. */
@media(min-width:721px){.app-nav{overflow:visible}}
/* Sekundäre Bereiche der Seitenleiste: Details erst bei Bedarf statt einer endlosen Werkzeugliste. */
.side-accordion{padding-bottom:8px!important;margin-bottom:8px!important}.side-accordion>details{border:1px solid #dce4ee;border-radius:6px;background:#fff}.side-accordion>details>summary{position:relative;padding:10px 28px 10px 10px;color:#344054;font-size:12px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;list-style:none;cursor:pointer}.side-accordion>details>summary::-webkit-details-marker{display:none}.side-accordion>details>summary::after{content:"›";position:absolute;right:10px;top:7px;color:#667085;font-size:19px;line-height:1}.side-accordion>details[open]>summary{border-bottom:1px solid #dce4ee;color:#003c82;background:#f5f9ff}.side-accordion>details[open]>summary::after{transform:rotate(90deg)}.side-accordion .pill{float:right;margin-right:8px}.side-accordion-content{padding:8px 8px 10px}.side-accordion-content .align-actions{margin-top:7px}.side-accordion-content .option{font-size:12px}.side-accordion-content label{font-size:12px}
