html, body, #__nuxt { margin: 0; height: 100%; font-family: "Segoe UI", Inter, system-ui, sans-serif; background: #eef1f4; color: #1c2430; } .shell { display: flex; flex-direction: column; min-height: 100vh; height: 100%; } .brand { font-size: 14px; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: #0f2744; padding: 0 12px 0 4px; } .menubar { border-radius: 0 !important; border: none !important; border-bottom: 1px solid #d5dde6 !important; background: #fff !important; min-height: 44px; padding: 0 8px !important; flex-shrink: 0; } .menubar-link { display: flex; align-items: center; gap: 8px; padding: 0.5rem 0.75rem; color: inherit; text-decoration: none; cursor: pointer; } .menubar-link i { font-size: 14px; } .menubar .p-menubar-end { display: flex; align-items: center; gap: 0.5rem; } .menubar-link.is-active { color: #1c4a7a; box-shadow: inset 0 -2px 0 #1c4a7a; } .ribbon.p-toolbar { border-radius: 0 !important; border: none !important; border-bottom: 1px solid #d5dde6 !important; background: #fff !important; padding: 4px 10px 6px !important; flex-shrink: 0; } .ribbon-cluster { display: flex; align-items: stretch; gap: 8px; } .ribbon-group { display: flex; flex-direction: column; align-items: center; gap: 2px; } .ribbon-group-items { display: flex; gap: 2px; } .ribbon-group-label { font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: #6b7785; } .ribbon .p-button { min-width: 58px; } .ribbon .p-button-label { font-size: 11px; } .statusbar.p-toolbar { border-radius: 0 !important; border: none !important; border-top: 1px solid #d5dde6 !important; background: #f7f9fb !important; padding: 2px 10px !important; min-height: 32px; flex-shrink: 0; } .desk-body { flex: 1; min-height: 0; } .desk-split { height: 100%; border: none !important; border-radius: 0 !important; background: transparent !important; } .desk-pane { overflow: hidden; } .desk-main { height: 100%; display: flex; flex-direction: column; background: #fff; min-width: 0; } .desk-tabstrip { display: flex; gap: 4px; padding: 8px 12px 0; border-bottom: 1px solid #d5dde6; background: #f7f9fb; flex-shrink: 0; } .desk-tab { display: inline-block; padding: 8px 14px; font-size: 13px; color: #6b7785; } .desk-tab.is-active { background: #fff; color: #0f2744; font-weight: 600; border: 1px solid #d5dde6; border-bottom-color: #fff; border-radius: 10px 10px 0 0; margin-bottom: -1px; } .desk-page:has(.kanban-page) { display: flex; flex-direction: column; overflow: hidden; padding: 8px 12px 12px; } .desk-side { height: 100%; display: flex; flex-direction: column; background: #fff; min-width: 0; } .desk-side-title { padding: 10px 12px; font-size: 13px; font-weight: 700; color: #0f2744; border-bottom: 1px solid #d5dde6; flex-shrink: 0; } .desk-tree { flex: 1; min-height: 0; overflow: auto; border: none; padding: 8px; } .tree-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; } .desk-detail-scroll { flex: 1; min-height: 0; overflow: auto; padding: 16px; box-sizing: border-box; } .ficha { min-width: 0; box-sizing: border-box; } .ficha .p-datatable, .ficha .p-button.w-full { max-width: 100%; } .ficha .p-datatable-table-container { overflow-x: auto; } .ficha-head { display: flex; align-items: center; gap: 10px; } .ficha-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; } .workspace { overflow: auto; padding: 12px 16px 20px; min-height: 0; display: flex; flex-direction: column; } .toolbar-title { margin: 0; font-size: 16px; font-weight: 700; color: #0f2744; } .p-toolbar-start, .p-toolbar-center, .p-toolbar-end { gap: 0.5rem; } .kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; } .kpi-value { font-size: 28px; font-weight: 700; color: #0f2744; line-height: 1.1; } .home-split .list-page { min-height: 0; } .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 12px; } .form-grid .span-2 { grid-column: 1 / -1; } .muted { color: #6b7785; font-size: 12px; } .w-full { width: 100%; } .mt-2 { margin-top: 8px; } .mt-3 { margin-top: 12px; } .ml-2 { margin-left: 8px; } .gap-2 { gap: 8px; } .flex { display: flex; } .align-items-center { align-items: center; } .mb-3 { margin-bottom: 12px; } .p-error { color: #b00020; font-size: 11px; } .person-cell { display: flex; align-items: center; gap: 10px; } .person-cell .muted { margin-top: 2px; } .person-cell, .toolbar-title, .data-text, .data-text .p-inputtext { text-transform: uppercase; } .workspace .p-datatable-tbody > tr > td, .desk-page .p-datatable-tbody > tr > td { text-transform: uppercase; } .workspace .p-datatable-tbody .p-tag, .workspace .p-datatable-tbody .p-chip, .workspace .p-datatable-tbody .p-badge, .workspace .p-datatable-tbody .p-button, .workspace .p-datatable-tbody .p-button-label, .workspace .p-datatable-tbody .p-toggleswitch, .desk-page .p-datatable-tbody .p-tag, .desk-page .p-datatable-tbody .p-chip, .desk-page .p-datatable-tbody .p-badge, .desk-page .p-datatable-tbody .p-button, .desk-page .p-datatable-tbody .p-button-label, .desk-page .p-datatable-tbody .p-toggleswitch { text-transform: none; } .workspace .p-inputtext:not(.no-caps), .desk-page .p-inputtext:not(.no-caps) { text-transform: uppercase; } .badge-pair { display: flex; gap: 24px; flex-wrap: wrap; align-items: flex-start; } .letter-wrap { overflow: auto; padding-bottom: 8px; } .letter-caption { margin-bottom: 8px; } .letter-sheet { width: 900px; aspect-ratio: 11 / 8.5; background: #fff; border: 1px solid #cfd6de; box-shadow: 0 8px 24px rgba(15, 39, 68, 0.12); display: flex; flex-direction: column; justify-content: space-between; padding: 10px 14px; box-sizing: border-box; } .letter-row { display: flex; justify-content: space-between; gap: 6px; } .letter-row > * { flex: 1; min-width: 0; } @media (max-width: 1100px) { .kpi-grid, .home-split, .form-grid { grid-template-columns: 1fr; } }