.nav-group { margin: 19px 14px 7px; color: #b6d1e5; font-size: 10px; font-weight: 750; letter-spacing: 1px; text-transform: uppercase; }
.nav-group:first-child { margin-top: 4px; }
.sidebar nav { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.sidebar .brand, .sidebar .workspace-label, .sidebar-bottom { flex-shrink: 0; }
.integration-home { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 22px; border-left: 4px solid var(--brand-primary); }
.integration-home h2 { margin: 5px 0 8px; }
.integration-home p { margin: 0 0 8px; color: var(--brand-muted); }
.integration-home button { flex-shrink: 0; }
.integration-workspace { min-width: 0; }
.integration-tabs { display: flex; gap: 8px; flex-wrap: wrap; padding: 6px; margin-bottom: 22px; background: #eaf1f8; border-radius: 13px; }
.integration-tabs button { flex: 1; min-height: 44px; white-space: normal; }
.integration-tabs .selected, .integration-service-picker .selected { background: var(--brand-primary); color: #fff; }
.integration-service-picker { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin-bottom: 20px; }
.integration-service-picker button { display: flex; flex-direction: column; align-items: flex-start; min-height: 68px; padding: 14px 18px; font-size: 16px; }
.integration-service-picker small { margin-top: 5px; font-size: 11px; font-weight: 500; }
.integration-layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(245px,300px); align-items: start; gap: 22px; }
.integration-layout > *, .integration-market-grid > * { min-width: 0; }
.integration-title { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.integration-title h2 { margin: 4px 0; }
.integration-workspace .form-grid { margin-top: 18px; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 17px; }
.integration-workspace label { min-width: 0; }
.integration-workspace input, .integration-workspace select, .integration-workspace textarea { min-width: 0; width: 100%; }
.integration-workspace input[type=checkbox] { width: auto; flex-shrink: 0; }
.integration-workspace input[readonly] { background: #f0f5fa; color: #526a82; }
.integration-field-status { display: flex; flex-wrap: wrap; gap: 7px 16px; padding: 11px 13px; background: #edf4fc; border-radius: 8px; color: #526a82; font-size: 11px; }
.integration-details { border: 1px solid #dfe8f2; border-radius: 10px; padding: 14px; }
.integration-details summary { cursor: pointer; font-weight: 750; }
.integration-details .form-grid { margin-top: 18px; }
.integration-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
.integration-actions button { min-height: 44px; white-space: normal; }
.integration-aside { display: grid; gap: 18px; }
.integration-aside ol { padding-left: 19px; margin: 15px 0 20px; color: #62748a; font-size: 13px; line-height: 1.7; }
.integration-aside li + li { margin-top: 8px; }
.integration-aside .button { display: inline-flex; min-height: 44px; align-items: center; }
.integration-market-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
.integration-workspace #integration-message:empty { display: none; }
.integration-workspace .notice { overflow-wrap: anywhere; }
@media(max-width:1100px) { .integration-layout { grid-template-columns: minmax(0,1fr); } .integration-aside { grid-template-columns: repeat(2,minmax(0,1fr)); } .integration-market-grid { grid-template-columns: minmax(0,1fr); } }
@media(max-width:600px) { .integration-home { align-items: stretch; flex-direction: column; gap: 15px; } .integration-service-picker { gap: 7px; } .integration-service-picker button { padding: 12px 9px; font-size: 14px; } .integration-service-picker small { font-size: 10px; } .integration-tabs button { flex-basis: 100%; } .integration-workspace .form-grid, .integration-aside { grid-template-columns: minmax(0,1fr); } .integration-actions { flex-direction: column; } .integration-actions button { width: 100%; } .integration-title { align-items: flex-start; } }
