/* App-only layout. Browser/desktop pages retain their existing design. */
html.legion-app{--app-bottom-space:78px;--app-surface:var(--brand-surface,#fff);--app-ink:var(--brand-ink,#17345c);--app-muted:var(--brand-muted,#6c809e);--app-line:var(--brand-line,#dbe5f4);--app-accent:var(--brand-blue,#245de8);scroll-padding-bottom:90px}
html.legion-app,html.legion-app body{width:100%;min-width:0;overflow-x:hidden;overflow-x:clip}
html.legion-app body.portal-glass{height:var(--app-screen-height,100vh);overflow:hidden;font-size:15px;-webkit-tap-highlight-color:transparent}
html.legion-app .app-shell{height:var(--app-screen-height,100vh);min-height:0;overflow:hidden}
html.legion-app .app-shell .app-body{margin:0!important;min-width:0;min-height:0!important;width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden;padding-bottom:var(--app-bottom-space)}
html.legion-app .app-shell .sidebar,html.legion-app .sidebar-overlay,html.legion-app .workspace-footer{display:none!important}
html.legion-app .app-shell .topbar{position:relative!important;top:0!important;height:auto!important;min-height:68px;max-height:none;flex-shrink:0;padding:9px 14px!important;display:flex!important;align-items:center;justify-content:space-between;gap:8px!important;grid-template-columns:none;background:var(--app-surface);z-index:24}
html.legion-app .topbar .topbar-nav-slot,html.legion-app .topbar .management-toggle,html.legion-app .topbar .secure-label{display:none!important}
html.legion-app .app-shell .topbar #topbar-date{display:flex!important;position:static!important;transform:none!important;align-items:flex-start;flex-direction:column;text-align:left;gap:2px;font-size:10px;white-space:normal;min-width:0;flex:1}
html.legion-app .topbar [data-clock-date]{overflow-wrap:anywhere;line-height:1.4;max-width:100%}
html.legion-app .topbar .topbar-clock [data-clock-time]{font-size:17px;font-variant-numeric:tabular-nums}
html.legion-app .topbar .topbar-clock small{margin-left:7px}
html.legion-app .app-shell .topbar .topbar-controls{display:flex!important;flex-shrink:0;gap:8px!important;position:static!important}
html.legion-app .topbar .theme-toggle{width:44px;height:44px;min-height:44px;padding:10px;min-width:44px}
html.legion-app .topbar .theme-toggle [data-theme-label]{display:none}
html.legion-app .topbar .notification-button{width:44px;height:44px;min-width:44px;min-height:44px}
html.legion-app .topbar .notifications-panel{position:absolute!important;top:calc(100% + 5px)!important;left:10px!important;right:10px!important;width:auto!important;max-width:none!important;max-height:calc(var(--app-screen-height,100vh) - 160px);border-radius:16px}
html.legion-app .app-shell .workspace{padding:22px 16px 24px!important;max-width:1100px;min-width:0;min-height:0;flex:1;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scroll-padding:18px 0;overflow-wrap:anywhere}
html.legion-app .app-shell .page-heading{gap:14px;margin-bottom:22px;flex-wrap:wrap;align-items:flex-start}
html.legion-app .app-shell .page-heading h1{font-size:29px;line-height:1.15;margin:8px 0 10px}
html.legion-app .app-shell .page-heading p{font-size:13px;line-height:1.65}
html.legion-app .app-shell .page-heading .eyebrow{font-size:9px}
html.legion-app .app-shell .page-heading .button{min-height:44px;font-size:13px;max-width:100%;white-space:normal}
html.legion-app .app-shell .welcome-card{padding:23px;min-height:0;border-radius:20px}
html.legion-app .app-shell .welcome-card h2{font-size:27px;line-height:1.2}
html.legion-app .app-shell .welcome-mark{display:none}
html.legion-app .app-shell .stat-card{padding:17px;min-height:132px}
html.legion-app .app-shell .stat-value{font-size:30px}
html.legion-app .app-shell .stat-value.text-value{font-size:16px}
html.legion-app .app-shell .quick-card{min-height:110px}
html.legion-app .app-shell .panel-toolbar{padding:18px;flex-wrap:wrap;gap:12px;min-width:0}
html.legion-app .app-shell .panel-toolbar h2{font-size:17px}
html.legion-app .app-shell .search-input{min-width:0;max-width:100%;min-height:44px;font-size:16px}
html.legion-app .app-shell .catalog-layout{grid-template-columns:minmax(0,1fr)}
html.legion-app .app-shell .estimate-panel{position:static;max-width:100%;width:100%}
html.legion-app .app-shell .catalog-toolbar,html.legion-app .catalog-filters{flex-wrap:wrap;min-width:0;gap:10px}
html.legion-app .app-shell .catalog-filters>*{min-width:0;max-width:100%}
html.legion-app .app-shell .catalog-filters{grid-template-columns:minmax(0,1fr);padding:18px}
html.legion-app .app-shell .product-row{grid-template-columns:84px minmax(0,1fr);grid-template-areas:"photo copy" "price price";padding:18px;gap:15px 13px;min-width:0}
html.legion-app .app-shell .product-photo-wrap{grid-area:photo}
html.legion-app .app-shell .product-photo{width:84px;height:84px;padding:7px}
html.legion-app .app-shell .product-copy{grid-area:copy;min-width:0;padding-right:22px}
html.legion-app .app-shell .product-row h3{font-size:14px;line-height:1.45}
html.legion-app .app-shell .product-price{grid-area:price;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"amount add" "unit add";text-align:left;padding-top:14px;border-top:1px solid var(--app-line);gap:0 10px}
html.legion-app .app-shell .product-price>strong{grid-area:amount;font-size:17px}
html.legion-app .app-shell .product-price>small{grid-area:unit;margin-top:3px}
html.legion-app .app-shell .product-add{grid-area:add;align-self:center;min-height:44px!important;white-space:normal;font-size:12px;margin-top:0}
html.legion-app .app-shell .data-table{min-width:620px}
html.legion-app .app-shell .table-wrap{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain}
html.legion-app .app-shell .personnel-card-head{padding:22px 18px;gap:14px;flex-wrap:wrap}
html.legion-app .app-shell .personnel-details{grid-template-columns:repeat(2,minmax(0,1fr));padding:22px 18px;gap:18px}
html.legion-app .app-shell .personnel-card-actions{padding:0 18px 22px}
html.legion-app .app-shell .employee-document-row{flex-wrap:wrap}
html.legion-app .app-shell .employee-document-actions{flex-basis:100%;padding-left:0;justify-content:flex-start}
html.legion-app .app-shell .chat-layout{grid-template-columns:minmax(0,1fr)}
html.legion-app .app-shell .chat-directory{max-height:260px;overflow-y:auto;border-right:0;border-bottom:1px solid var(--app-line);padding:18px}
html.legion-app .app-shell #chat-conversations{display:flex;gap:8px;flex-wrap:wrap;max-height:190px;overflow:auto}
html.legion-app .app-shell .chat-person{width:100%;min-width:0}
html.legion-app .app-shell .chat-thread-head{padding:18px;gap:10px;flex-wrap:wrap}
html.legion-app .app-shell .chat-messages{height:330px;min-height:180px;padding:18px}
html.legion-app .app-shell .chat-compose{padding:16px;min-width:0}
html.legion-app .app-shell .chat-message{max-width:94%}
html.legion-app .app-shell .chat-message p{font-size:14px}
html.legion-app .app-shell .chat-message-meta{flex-wrap:wrap;gap:4px 10px}
html.legion-app .form-dialog{position:fixed;width:calc(100% - 24px);max-width:620px;padding:22px 18px!important;max-height:calc(var(--app-screen-height,100vh) - 24px)!important;overflow:auto;overscroll-behavior:contain;border-radius:20px}
html.legion-app .form-dialog .dialog-head{margin-bottom:22px;align-items:flex-start;gap:12px}
html.legion-app .form-dialog .dialog-head h2{font-size:24px!important}
html.legion-app .form-dialog .dialog-row{grid-template-columns:minmax(0,1fr)}
html.legion-app .form-dialog .dialog-actions{flex-wrap:wrap;gap:10px;padding-bottom:4px}
html.legion-app .form-dialog .button{min-height:44px;white-space:normal;max-width:100%}
html.legion-app .form-dialog :is(input,select,textarea){font-size:16px;max-width:100%;min-width:0}
html.legion-app .form-dialog .close-button{min-width:44px;min-height:44px}
html.legion-app .toast{left:12px;right:12px;bottom:calc(var(--app-bottom-space) + 12px);width:auto;max-width:none;font-size:13px;padding:14px 16px}
html.legion-app .mobile-app-navigation{position:fixed;bottom:0;left:0;right:0;z-index:28;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));height:var(--app-bottom-space);padding:7px 8px calc(7px + env(safe-area-inset-bottom,0px));background:var(--app-surface);border-top:1px solid var(--app-line);box-shadow:0 -8px 35px #07182f12}
html.legion-app .mobile-app-navigation[hidden]{display:none}
.mobile-app-navigation button{position:relative;border:0;background:none;font:inherit;color:var(--app-muted);border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;font-size:11px;min-height:44px;padding:7px 2px;cursor:pointer}
.mobile-app-navigation button.active{color:var(--app-accent);background:var(--brand-raised,#eef4ff)}
.mobile-app-navigation button svg{width:23px;height:23px;flex-shrink:0}
.mobile-app-navigation button:focus-visible,.app-menu-item:focus-visible,.app-menu-actions a:focus-visible{outline:3px solid var(--app-accent);outline-offset:-3px}
.mobile-app-navigation .app-chat-badge{position:absolute;top:1px;left:calc(50% + 9px);min-width:18px;border-radius:9px;font-size:10px;background:var(--app-accent);color:#fff;padding:2px 4px}
html.legion-app.app-keyboard-open{--app-bottom-space:0px}
html.legion-app.app-keyboard-open .mobile-app-navigation,html.legion-app.app-sheet-open .mobile-app-navigation{display:none}
html.legion-app .mobile-app-menu{position:fixed;top:auto;left:12px;right:12px;bottom:12px;width:calc(100% - 24px);max-width:600px;max-height:calc(var(--app-screen-height,100vh) - 24px);padding:0;margin:0 auto;border:1px solid var(--app-line);border-radius:24px;background:var(--app-surface);color:var(--app-ink);box-shadow:0 24px 80px #06152770;overflow:hidden}
html.legion-app .mobile-app-menu[open]{display:flex;flex-direction:column}
.mobile-app-menu::backdrop{background:#06152cb0}
.mobile-app-menu>header{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:21px 20px;border-bottom:1px solid var(--app-line);flex-shrink:0}
.mobile-app-menu>header small{font-size:9px;letter-spacing:1.4px;color:var(--app-muted)}
.mobile-app-menu h2{font-size:23px;margin:5px 0 0;font-weight:600}
.mobile-app-menu>header button{background:var(--brand-raised,#edf3fc);color:var(--app-ink);border:1px solid var(--app-line);font-size:27px;border-radius:12px;width:44px;height:44px;flex-shrink:0}
.app-menu-content{overflow-y:auto;overscroll-behavior:contain;padding:18px 20px 24px;min-height:0}
.app-menu-account{padding:15px 16px;background:var(--brand-raised,#edf3fc);border-radius:15px;overflow-wrap:anywhere}
.app-menu-account strong{display:block;font-size:17px}.app-menu-account small{display:block;font-size:12px;color:var(--app-muted);margin-top:5px}
.app-menu-content h3{font-size:11px;letter-spacing:.7px;text-transform:uppercase;margin:23px 0 12px;color:var(--app-muted)}
.app-menu-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.app-menu-item{display:flex;align-items:center;gap:11px;min-height:52px;padding:12px;border:1px solid var(--app-line);border-radius:13px;color:var(--app-ink);background:var(--app-surface);font:inherit;font-size:13px;text-align:left;cursor:pointer;min-width:0}
.app-menu-item svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.6;flex-shrink:0}.app-menu-item span{overflow-wrap:anywhere;line-height:1.4}
.app-menu-actions{display:grid;gap:10px;border-top:1px solid var(--app-line);padding-top:18px;margin-top:22px}
.app-menu-actions a{display:block;min-height:44px;padding:13px;font-size:13px;color:var(--app-accent);text-decoration:none}
html.legion-app .auth-screen{height:var(--app-screen-height,100vh);min-height:0;overflow-y:auto;display:block;grid-template-columns:none}
html.legion-app .auth-screen[hidden]{display:none}
html.legion-app .auth-header-shell,html.legion-app .auth-story,html.legion-app .auth-copyright,html.legion-app .auth-card .back-link{display:none!important}
html.legion-app .auth-panel{min-height:100%;padding:28px 18px;display:flex;align-items:center;justify-content:center}
html.legion-app .auth-card{width:100%;max-width:440px;padding:27px 22px;border-radius:24px}
html.legion-app .auth-card h2{font-size:30px}
html.legion-app .auth-card .field input{font-size:16px;min-height:48px}
html.legion-app .auth-card .password-field{min-width:0}
html.legion-app .auth-card .password-field input{min-width:0;width:100%}
html.legion-app .auth-card .password-field button{min-width:44px;min-height:44px}
html.legion-app .auth-card .password-vault{max-width:100%;min-width:0}
html.legion-app .guide-brand{display:none}
html.legion-app .guide-header{justify-content:flex-end;min-height:64px}
@media(min-width:700px){html.legion-app .app-shell .workspace{padding:26px 28px 28px!important}html.legion-app .app-shell .topbar{padding-inline:28px!important}html.legion-app .app-shell .catalog-filters{grid-template-columns:repeat(2,minmax(0,1fr))}html.legion-app .app-shell .chat-layout{grid-template-columns:240px minmax(0,1fr)}html.legion-app .app-shell .chat-directory{max-height:none;border-bottom:0;border-right:1px solid var(--app-line)}html.legion-app .app-shell .chat-messages{height:400px}html.legion-app .form-dialog .dialog-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:359px){html.legion-app .app-shell .workspace{padding-inline:12px!important}.app-menu-grid{grid-template-columns:minmax(0,1fr)}html.legion-app .app-shell .personnel-details{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){html.legion-app .workspace>*{animation:none!important}}