/* 보관함에만 적용한다. 재생 화면과 저장소는 기존 동작을 유지한다. */
#replay-screen { overflow-y:auto; padding:22px 26px calc(var(--legal-h,0px) + 24px); background:#0d1420; scrollbar-gutter:stable; }
.rp-library-head, .rp-library-context, #replay-screen #rp-list { width:100%; max-width:1280px; margin:0 auto; flex:none; }
.rp-library-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; }
.rp-library-title { display:flex; align-items:center; gap:12px; }
.rp-library-title h2 { margin:0; color:#edf1f6; font-size:26px; }
#rp-library-count { padding:3px 8px; border:1px solid #304057; border-radius:5px; color:#a7b5c9; font-size:12px; }
.rp-library-tools { display:flex; gap:7px; flex-wrap:wrap; }
#replay-screen button { min-height:36px; padding:8px 12px; border:1px solid #35445a; border-radius:7px; background:#192638; color:#edf1f6; font-size:12px; white-space:nowrap; }
#replay-screen button:hover { background:#2a3c55; border-color:#7a8ba1; }
#replay-screen #btn-rp-import, #replay-screen .rp-play { background:#d6c18f; color:#182030; border-color:#d6c18f; font-weight:600; }
#replay-screen #btn-rp-import:hover, #replay-screen .rp-play:hover { background:#e7d4a6; }
.rp-library-context { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-top:12px; margin-bottom:12px; font-size:12px; color:#a7b5c9; }
.rp-library-context>span { flex:none; }
.rp-library-context details { text-align:right; min-width:0; }
.rp-library-context summary { cursor:pointer; }
#rp-path { overflow-wrap:anywhere; margin-top:8px; line-height:1.6; }
#replay-screen #rp-list { display:flex; flex-direction:column; gap:0; padding:0; overflow:visible; }
#rp-list .rp-day-heading { margin:20px 0 0; padding:0 0 10px; border-bottom:1px solid #304057; color:#c0ccda; font-size:13px; font-weight:500; }
#rp-list .rp-day-heading:first-child { margin-top:8px; }
#replay-screen .rp-card { display:grid; grid-template-columns:108px minmax(0,1fr) 130px 218px; gap:18px; align-items:center; width:100%; min-width:0; padding:14px 0; background:transparent; border:0; border-bottom:1px solid #28364a; border-radius:0; }
.rp-portraits { display:flex; gap:4px; height:76px; }
.rp-portrait { position:relative; flex:1; min-width:0; overflow:hidden; border-radius:7px; background:#1b2b42; color:#a7b5c9; display:flex; align-items:center; justify-content:center; font-size:11px; }
.rp-portrait img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center top; }
.rp-summary { min-width:0; }
.rp-time { color:#a7b5c9; font-size:12px; display:flex; align-items:center; gap:8px; }
.rp-latest { color:#dfca9a; background:#2d302e; padding:1px 6px; border-radius:4px; font-size:10px; }
#replay-screen .rp-summary h3 { margin:4px 0; color:#edf1f6; font-size:16px; line-height:1.4; overflow-wrap:anywhere; }
.rp-meta { font-size:12px; color:#9dacbf; line-height:1.6; overflow-wrap:anywhere; }
.rp-result { color:#dfca9a; font-size:12px; overflow-wrap:anywhere; }
.rp-result strong { display:block; font-size:22px; line-height:1.5; font-variant-numeric:tabular-nums; }
.rp-incomplete { color:#a7b5c9; }
#replay-screen .rp-card .dk-btns { display:flex; gap:6px; flex-wrap:nowrap; margin:0; }
#replay-screen .rp-card .dk-btns button { flex:none; }
#replay-screen .rp-card .dk-btns .rp-play { flex:1; }
#replay-screen .rp-delete { color:#efa5ae; }
#replay-screen :is(button,summary):focus-visible { outline:2px solid #e7d4a6; outline-offset:3px; }
@media(max-width:1000px) {
  #replay-screen { padding:16px 18px calc(var(--legal-h,0px) + 18px); }
  #replay-screen .rp-card { grid-template-columns:88px minmax(0,1fr) 100px 200px; gap:12px; }
  #replay-screen .rp-card button { padding:7px 9px; }
}
@media(max-width:600px) {
  #replay-screen { padding:16px 12px calc(var(--legal-h,0px) + 18px); }
  .rp-library-title h2 { font-size:23px; }
  .rp-library-tools { gap:5px; }
  #replay-screen .rp-library-tools button { padding:7px 9px; }
  #replay-screen .rp-card { grid-template-columns:68px minmax(0,1fr) 68px; gap:8px 10px; padding:12px 0; }
  #replay-screen .rp-summary h3 { font-size:14px; }
  .rp-time, .rp-meta, .rp-result { font-size:11px; }
  .rp-result strong { font-size:19px; }
  #replay-screen .rp-card .dk-btns { grid-column:2/4; }
  #replay-screen .rp-card button { min-height:32px; padding:6px 9px; font-size:11px; }
}
@media(pointer:coarse) and (orientation:landscape) and (max-height:600px) {
  #replay-screen { padding-top:8px; }
  .rp-library-title h2 { font-size:20px; }
  #replay-screen .rp-library-tools button { min-height:32px; padding:6px 9px; }
  .rp-library-context { margin-top:5px; margin-bottom:0; font-size:11px; }
  #rp-list .rp-day-heading { margin-top:10px; padding-bottom:4px; font-size:11px; }
  #rp-list .rp-day-heading:first-child { margin-top:5px; }
  #replay-screen .rp-card { grid-template-columns:66px minmax(0,1fr) 96px 192px; gap:10px; padding:3px 0; }
  .rp-portraits { height:48px; gap:3px; }
  #replay-screen .rp-summary h3 { margin:1px 0; font-size:13px; line-height:1.3; }
  .rp-time, .rp-meta, .rp-result { font-size:11px; line-height:1.35; }
  .rp-result strong { font-size:18px; }
  #replay-screen .rp-card .dk-btns { grid-column:auto; }
  #replay-screen .rp-card button { min-height:32px; }
}