.sp-root{--sp-accent:var(--ink);--sp-gap:10px}.sp-head{background:var(--surface);border-bottom:1px solid var(--line);padding:12px 20px}.sp-head-row{flex-wrap:wrap;align-items:center;gap:8px;max-width:1400px;margin:0 auto;display:flex}.sp-count{color:var(--muted);white-space:nowrap;margin-left:auto;font-size:12px}.sp-split{max-width:1400px;height:calc(100vh - var(--sp-chrome,118px));margin:0 auto;display:flex}.sp-pane-list{border-right:1px solid var(--line);background:var(--surface);width:40%;min-width:360px;overflow-y:auto}.sp-pane-detail{background:var(--bg,#f4f6f7);flex:1;overflow-y:auto}.sp-card{border-bottom:1px solid var(--line-soft);color:inherit;cursor:pointer;padding-left:3px;text-decoration:none;display:block;position:relative}.sp-card:hover{background:var(--line-soft)}.sp-card-accent{background:0 0;width:3px;position:absolute;top:0;bottom:0;left:0}.sp-card[data-selected=true]{background:color-mix(in srgb, var(--sp-accent) 5%, white)}.sp-card[data-selected=true] .sp-card-accent{background:var(--sp-accent)}.sp-card:focus-visible{outline:2px solid var(--sp-accent);outline-offset:-2px}.sp-empty{text-align:center;color:var(--muted);padding:40px 24px;font-size:14px}.sp-empty-detail{text-align:center;height:100%;min-height:320px;color:var(--muted);flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:40px 24px;font-size:14px;display:flex}.sp-back{color:var(--muted);cursor:pointer;background:0 0;border:none;align-items:center;gap:6px;padding:12px 20px 0;font-family:inherit;font-size:13px;font-weight:600;text-decoration:none;display:none}.sp-grid-4{gap:var(--sp-gap);grid-template-columns:repeat(4,1fr);display:grid}.sp-grid-3{gap:var(--sp-gap);grid-template-columns:repeat(3,1fr);display:grid}.sp-grid-2{gap:var(--sp-gap);grid-template-columns:repeat(2,1fr);display:grid}@media (max-width:900px){.sp-split{height:auto;display:block}.sp-pane-list{border-right:none;width:100%;min-width:0;overflow-y:visible}.sp-pane-detail{overflow-y:visible}.sp-root[data-sp-selected=false] .sp-pane-detail,.sp-root[data-sp-selected=true] .sp-pane-list{display:none}.sp-root[data-sp-selected=true] .sp-back{display:flex}.sp-grid-2{grid-template-columns:1fr}}@media (max-width:620px){.sp-grid-4{grid-template-columns:1fr 1fr}.sp-grid-3{grid-template-columns:1fr}}
