/* Spacing only: no content, controls, permissions or data-loading changes. */
html body #graphic-app .design-department{container-type:inline-size;container-name:design-work}
html body #graphic-app .design-department .jobs-table-v52{min-width:0!important;width:100%!important;table-layout:fixed!important}
html body #graphic-app .design-department .jobs-table-v52 :is(td,th){min-width:0!important;max-width:none!important;white-space:normal!important;overflow-wrap:anywhere!important}
html body #graphic-app .design-department .jobs-table-v52 :is(button,select,input,a){min-width:0!important;max-width:100%!important;box-sizing:border-box!important;white-space:normal!important;overflow-wrap:anywhere!important}
html body #graphic-app .design-department .job-day-heading{background:#eaf3f8!important;color:#244861!important;border-bottom:1px solid #bed4df!important}
html body #graphic-app .design-department .queue-shopee>.job-day-heading{background:linear-gradient(115deg,#d74b13,#f17837)!important;color:#fff!important}
html body #graphic-app .design-department .queue-outstanding>.job-day-heading{background:linear-gradient(115deg,#ffdec6,#fff0df)!important;color:#783712!important}
html body #graphic-app .design-department .queue-red>.job-day-heading{background:linear-gradient(115deg,#b82246,#df4d69)!important;color:#fff!important}
html body #graphic-app .design-department .queue-overdue>.job-day-heading{background:linear-gradient(115deg,#85243d,#b9465c)!important;color:#fff!important}
html body #graphic-app .design-department .job-day-heading h3{color:inherit!important;line-height:1.5!important}
html body #graphic-app .design-department .job-day-heading>span{background:#ffffffed!important;color:#375265!important}
html body #graphic-app .design-department .design-day-group{border-color:#ccdce3!important;border-radius:14px!important;box-shadow:0 3px 12px #27465308!important}
html body #graphic-app .design-department .jobs-table-v52 tr.job-row>td+td{border-left:0!important}
html body #graphic-app .design-department .jobs-table-v52 tr.job-row>td{border-bottom:2px solid #cbdde5!important}
html body #graphic-app .design-department .jobs-table-v52 tr.job-row:hover>td{background:#edf5f8!important}
html body #graphic-app .design-department .jobs-table-v52 :is(.status-picker-button,.payment-summary,.inline-note-button){border-radius:11px!important}
@container design-work (max-width:1050px){
 html body #graphic-app .design-department .jobs-table-v52,html body #graphic-app .design-department .jobs-table-v52 tbody{display:block!important;width:100%!important}
 html body #graphic-app .design-department .jobs-table-v52 thead{position:absolute!important;width:1px!important;height:1px!important;clip-path:inset(50%)!important;overflow:hidden!important}
 html body #graphic-app .design-department .jobs-table-v52 tr.job-row{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px 16px!important;padding:12px!important;border-bottom:2px solid #c0d5df!important;background:#fff!important}
 html body #graphic-app .design-department .jobs-table-v52 tr.job-row:nth-child(even){background:#f2f7f9!important}
 html body #graphic-app .design-department .jobs-table-v52 tr.job-row>td{display:block!important;width:auto!important;padding:0!important;border:0!important;background:transparent!important}
 html body #graphic-app .design-department .jobs-table-v52 tr.job-row>td:before{display:block!important;font-size:12px!important;color:#536d7c!important;margin-bottom:4px!important;line-height:1.4!important}
 html body #graphic-app .design-department .jobs-table-v52 tr.job-row>.urgency-cell:before{content:'ความด่วน'}
 html body #graphic-app .design-department .jobs-table-v52 tr.job-row>.job-main-cell{grid-column:2 / 4}
 html body #graphic-app .design-department .jobs-table-v52 tr.job-row>.job-main-cell:before{content:'ลูกค้า / งาน'}
 html body #graphic-app .design-department .jobs-table-v52 tr.job-row>.team-cell:before{content:'ทีมงาน'}
 html body #graphic-app .design-department .jobs-table-v52 tr.job-row>.work-status-cell:before{content:'ป้ายงาน / สถานะ'}
 html body #graphic-app .design-department .jobs-table-v52 tr.job-row>td:nth-child(5):before{content:'การชำระเงิน'}
 html body #graphic-app .design-department .jobs-table-v52 tr.job-row>.due-cell:before{content:'กำหนดส่ง'}
 html body #graphic-app .design-department .jobs-table-v52 tr.job-row>.job-note{grid-column:2 / 4}
 html body #graphic-app .design-department .jobs-table-v52 tr.job-row>.job-note:before{content:'หมายเหตุ / จัดการ'}
}
@container design-work (max-width:600px){
 html body #graphic-app .design-department .jobs-table-v52 tr.job-row{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
 html body #graphic-app .design-department .jobs-table-v52 tr.job-row>.job-main-cell{grid-column:1 / -1;grid-row:1}
 html body #graphic-app .design-department .jobs-table-v52 tr.job-row>.work-status-cell{grid-column:1 / -1}
 html body #graphic-app .design-department .jobs-table-v52 tr.job-row>.job-note{grid-column:1 / -1}
}
html body #graphic-app>main{padding:16px 18px!important}
html body #graphic-app .topbar{gap:8px 14px!important;padding-bottom:12px!important;margin-bottom:14px!important}
html body #graphic-app #view{gap:12px!important}
html body #graphic-app :is(.panel,.operations-dashboard,.printer-dashboard-card,.job-calendar,.dashboard-revenue,.hero,.analysis-hero){padding:14px!important;border-radius:12px!important}
html body #graphic-app :is(.panel-head,.calendar-head,.operations-dashboard-head){gap:8px!important;margin-bottom:10px!important}
html body #graphic-app :is(.operations-total,.operations-today-result){padding:9px 12px!important}
html body #graphic-app .operations-stage-grid{gap:8px!important}
html body #graphic-app .operations-stage-card{min-height:80px!important;padding:10px!important;gap:5px!important}
html body #graphic-app .operations-stage-card b{font-size:25px!important}
html body #graphic-app :is(.toolbar,.job-filters,.production-filters,.shipping-filters){gap:7px!important}
html body #graphic-app :is(.toolbar,.production-filters,.shipping-filters) :is(input,select){padding:7px 9px!important;min-height:36px!important}
html body #graphic-app :is(.shipping-grid,.production-grid,.kpi-grid,.daily-summary){gap:9px!important}
html body #graphic-app :is(.shipping-card,.production-card,.daily-summary article){padding:11px!important;border-radius:10px!important}
html body #graphic-app :is(.production-stage-cards,.shipping-stage-cards){gap:8px!important;margin:10px 0!important}
html body #graphic-app :is(.production-stage-cards,.shipping-stage-cards)>.workflow-stage-card{min-height:82px!important;padding:10px 48px 10px 10px!important;gap:3px!important}
html body #graphic-app .empty{padding:18px 12px!important}
@media(min-width:761px){
 html body #graphic-app>.sidebar{padding:18px 12px!important}
 html body #graphic-app #nav{gap:4px!important;margin-top:14px!important}
 html body #graphic-app #nav button[data-view]{min-height:38px!important;padding:7px 9px!important}
 html body #graphic-app .top-actions :is(button,input){min-height:38px!important;padding:6px 10px!important}
}
@media(max-width:760px){
 html body #graphic-app>main{padding:12px!important}
 html body #graphic-app :is(.toolbar,.production-filters,.shipping-filters) :is(input,select){min-height:44px!important}
 html body #graphic-app :is(.panel,.operations-dashboard,.printer-dashboard-card,.job-calendar,.dashboard-revenue,.hero,.analysis-hero){padding:11px!important}
}