.sort-page{max-width:1368px}
.sort-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;background:#e7e1ea;border-radius:10px;padding:15px 18px}
.sort-toolbar .secondary{margin:0}
.sort-progress{display:flex;align-items:baseline;gap:8px}
.sort-progress strong{font-size:28px;color:#69407c}
.sort-progress span{color:#506873}
.sort-progress-track{height:8px;background:#d8e2e7;border-radius:99px;overflow:hidden;margin:12px 0}
.sort-progress-track span{display:block;width:0;height:100%;background:#69407c;transition:width .25s}
.sort-status{min-height:27px;margin:10px 0 22px;font-weight:650;color:#365665}
.sort-workspace{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:20px;height:clamp(560px,68vh,760px);align-items:stretch}
.med-bank-panel,.category-panel{display:flex;min-height:0;flex-direction:column;background:#fff;border:1px solid #cbd8df;border-radius:12px;padding:20px;overflow:hidden}
.med-bank-panel{border-top:5px solid #69407c}
.category-panel{border-top:5px solid #0b6e75}
.bank-heading,.category-heading{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:18px;flex:0 0 auto}
.bank-heading .eyebrow,.category-heading .eyebrow{margin-bottom:7px}
.bank-heading h2,.category-heading h2{margin:0}
.bank-heading>span{color:#69407c;font-weight:700}
.med-bank{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;overflow:auto;padding:3px;align-content:start}
.sort-med{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0;min-height:64px;padding:11px 12px;text-align:left;background:#fff;color:#203f50;border:1px solid #b8c9d2;cursor:grab}
.sort-med strong{font-size:14px;line-height:1.25}
.sort-med span{font-size:12px;line-height:1.3;color:#617984}
.sort-med.selected{background:#f3edf5;border:2px solid #69407c;padding:10px 11px;box-shadow:0 0 0 2px #fff,0 0 0 4px #69407c}
.sort-med.incorrect{background:#fff0e8;border-color:#bc6240;animation:sort-shake .25s}
.sort-med.placed{cursor:default;background:#e0f4eb;border-color:#198864}
.sort-categories{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;overflow:auto;padding:3px;align-content:start}
.sort-category{min-height:90px;background:#fff;border:2px dashed #b8c9d2;border-radius:10px;overflow:hidden;transition:border-color .15s,background .15s}
.sort-category.drag-over{border-color:#69407c;background:#f7f0f9}
.sort-category.incorrect{border-color:#bc6240;background:#fff0e8}
.category-target{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:54px;padding:12px 15px;border-radius:0;background:#f0ebf2;color:#382243;text-align:left}
.category-target span{font-size:14px}
.category-count{display:grid;place-items:center;min-width:28px;height:28px;border-radius:99px;background:#69407c;color:#fff}
.placed-meds{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:10px}
.placed-meds:empty{display:block;padding:14px}
.placed-meds:empty::after{content:'Drop medication here';color:#80939c;font-size:13px}
.complete-panel{margin-top:26px}
@keyframes sort-shake{25%{transform:translateX(-4px)}
75%{transform:translateX(4px)}
}
@media(max-width:900px){.sort-workspace{grid-template-columns:1fr;height:auto}
.med-bank-panel,.category-panel{max-height:620px}
.med-bank{grid-template-columns:repeat(3,minmax(0,1fr))}
.sort-categories{grid-template-columns:1fr}
}
@media(max-width:650px){.sort-toolbar{align-items:stretch;flex-direction:column}
.sort-toolbar button{width:100%}
.med-bank{grid-template-columns:repeat(2,minmax(0,1fr));max-height:430px}
.placed-meds{grid-template-columns:1fr}
.bank-heading{align-items:start;flex-direction:column;gap:5px}
}
@media(prefers-reduced-motion:reduce){.sort-med.incorrect{animation:none}
.sort-progress-track span{transition:none}
}