.case-sort { display:inline-flex; position:relative; align-items:center; gap:.5rem; }
.case-sort-trigger { display:inline-flex; align-items:center; gap:.5rem; min-height:44px; padding:.5rem .7rem; border:1px solid var(--line); border-radius:9px; background:var(--card); color:var(--ink); font-size:.875rem; }
.case-sort-trigger svg { flex:none; }
.case-sort-shuffle { display:inline-flex; align-items:center; gap:.45rem; min-height:44px; padding:.5rem .8rem; border:1px solid var(--line); border-radius:9px; background:var(--card); color:var(--ink); font-size:.875rem; cursor:pointer; }
.case-sort-shuffle svg { flex:none; }
.case-sort-shuffle[aria-pressed="true"] { border-color:var(--teal); color:var(--teal); }
.case-sort-shuffle:focus-visible { outline:2px solid var(--teal); outline-offset:3px; }
.case-sort-trigger:focus-visible,.case-sort-popover button:focus-visible,.case-sort-popover input:focus-visible { outline:2px solid var(--teal); outline-offset:3px; }
.case-sort-popover { position:fixed; z-index:65; max-width:calc(100vw - 24px); max-height:calc(100dvh - 24px); overflow:auto; padding:16px; border:1px solid var(--line); border-radius:12px; background:var(--card); color:var(--ink); box-shadow:0 12px 40px #0005; font-size:.875rem; }
.case-sort-popover[hidden] { display:none; }
.case-sort-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.case-sort-head button { width:40px; height:40px; border:1px solid var(--line); border-radius:8px; background:var(--card); color:var(--ink); font-size:1.3rem; }
.case-sort-popover fieldset { border:0; border-top:1px solid var(--line); margin:12px 0 0; padding:12px 0 0; }
.case-sort-popover legend { padding-right:8px; font-weight:700; }
.case-sort-popover label { display:flex; align-items:center; gap:10px; min-height:42px; cursor:pointer; }
.case-sort-popover input { accent-color:var(--teal); width:17px; height:17px; min-width:0; padding:0; flex:none; }
.case-sort-popover p { font-size:.875rem; color:var(--muted); line-height:1.65; overflow-wrap:anywhere; }
.case-list-heading { display:flex; gap:12px; align-items:center; justify-content:space-between; flex-wrap:wrap; margin:16px 0; }
.case-list-heading h2 { margin:0; font-size:1.1rem; }
.case-sort-caption { color:var(--muted); font-size:.875rem; }
@media(max-width:480px) { .case-sort-trigger,.case-sort-shuffle { max-width:100%; } .case-list-heading { align-items:flex-start; } }