.task-navigation{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;align-items:end;gap:16px;margin:20px 0;padding:20px;background:#fff;border:1px solid #dbe4ee;border-radius:12px;color:#203e55}
.task-navigation>div{min-width:0}
.task-navigation:has(.task-navigation-area){grid-template-columns:repeat(4,minmax(0,1fr))}
.task-navigation:has(.task-navigation-area)>div:nth-child(1){grid-column:1 / 3;grid-row:1}
.task-navigation:has(.task-navigation-area)>div:nth-child(2){grid-column:3 / 5;grid-row:1}
.task-navigation-area{grid-column:1 / 4;grid-row:2}
.task-navigation button{grid-column:-2;grid-row:1}
.task-navigation:has(.task-navigation-area) button{grid-column:4;grid-row:2}
.task-navigation label{display:block;margin:0 0 8px;font-size:14px;font-weight:600}
.task-navigation select{display:block;box-sizing:border-box;width:100%;min-width:0;min-height:44px;padding:10px 12px;border:1px solid #cddae7;border-radius:8px;background:#f7f9fc;color:#203e55;font:inherit;font-size:15px}
.task-navigation button{min-height:44px;padding:10px 20px;border:1px solid #264c6a;border-radius:8px;background:#264c6a;color:#fff;font:inherit;font-size:15px;font-weight:600;cursor:pointer}
.task-navigation :is(select,button):focus-visible{outline:3px solid #ff6a59;outline-offset:3px}
@media(max-width:600px){.task-navigation{grid-template-columns:minmax(0,1fr);padding:16px;gap:12px;margin:16px 0}.task-navigation button{width:100%}}
@media(max-width:600px){.task-navigation:has(.task-navigation-area){grid-template-columns:minmax(0,1fr)}.task-navigation:has(.task-navigation-area)>div:nth-child(1){grid-column:1;grid-row:1}.task-navigation:has(.task-navigation-area)>div:nth-child(2){grid-column:1;grid-row:2}.task-navigation-area{grid-column:1;grid-row:3}.task-navigation button,.task-navigation:has(.task-navigation-area) button{grid-column:1;grid-row:4}}