.replay-history{margin-top:32px;padding-top:24px;border-top:1px solid var(--line);min-width:0}
.replay-history-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.replay-history h3{margin:0;font-size:14px;font-weight:600;display:flex;align-items:center;gap:8px}
.replay-history h3 svg{width:17px;height:17px;color:var(--muted)}
.replay-counts{display:flex;gap:18px;flex-wrap:wrap;font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums;margin:14px 0 8px}
.replay-history select,.replay-controls select{font:inherit;font-size:12px;color:var(--text);background:var(--surface);border:1px solid var(--line);border-radius:5px;padding:7px 9px;min-height:34px}
.replay-list{list-style:none;margin:0;padding:0;max-height:260px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--tile-border) transparent;scrollbar-gutter:stable}
.replay-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto 76px;align-items:center;gap:14px;min-height:66px;border-bottom:1px solid var(--line);padding:8px 6px 8px 0}
.replay-level-mark{width:32px;height:32px;display:grid;place-items:center;color:var(--green);background:var(--green-soft);border-radius:5px}
.replay-level-mark svg{width:17px;height:17px}.replay-level-mark.medium{color:#647eaa;background:#edf0f6}.replay-level-mark.expert{color:var(--red);background:var(--red-soft)}
.replay-detail{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;min-width:0}.replay-detail strong{font-size:12px;font-weight:550}.replay-detail time{font-size:11px;color:var(--muted)}
.replay-duration{font:12px ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap}.replay-row-actions{display:flex;gap:4px}.replay-row-actions button{width:36px;height:36px}
.replay-incompatible{color:var(--red);font-size:11px}.replay-empty{font-size:12px;color:var(--muted);padding:16px 0;margin:0}
.replay-message{font-size:12px;line-height:1.6;color:var(--muted);overflow-wrap:anywhere;margin:10px 0 0;min-height:19px}
.win-replay-actions{display:flex;justify-content:center;gap:8px;margin:16px 0 0;flex-wrap:wrap}.win-replay-actions svg{width:15px;height:15px}
.replay-dialog{width:min(var(--replay-width,1060px),calc(100% - 32px));max-height:calc(100dvh - 24px);overflow:auto;padding:24px}
.replay-confetti{z-index:3;contain:strict}
.replay-dialog .dialog-heading{margin-bottom:20px;gap:12px}.replay-dialog h2{font-size:18px}.replay-date{display:block;font-size:11px;color:var(--muted);margin-top:6px}
.replay-metrics{display:flex;justify-content:space-between;align-items:center;gap:30px 16px;flex-wrap:wrap;margin-bottom:16px;padding-top:20px;font-size:12px;font-variant-numeric:tabular-nums}
.replay-time-metric{position:relative}
.replay-skip-notice{position:absolute;right:0;bottom:calc(100% + 5px);display:inline-flex;align-items:center;gap:5px;white-space:nowrap;font-size:11px;line-height:16px;color:var(--green);pointer-events:none}
.replay-skip-notice svg{width:15px;height:15px;fill:currentColor;stroke-width:1.5}
.replay-metric{display:flex;align-items:center;gap:8px}.replay-metric>svg{width:16px;height:16px;color:var(--muted)}.replay-metric strong{font:18px ui-monospace,SFMono-Regular,Menlo,monospace}.replay-metric small{color:var(--muted);font-size:11px}
.replay-board-scroll{max-height:calc(100dvh - 290px);min-height:160px;overflow:auto;overscroll-behavior:contain;padding:5px;scrollbar-width:thin;background:var(--bg);border:1px solid var(--line);border-radius:6px}
.replay-dialog .replay-board{--cell:var(--replay-cell,28px);--gap:3px;margin:auto;touch-action:pan-x pan-y}
.replay-board .cell{font-size:15px;pointer-events:none;transition:none}.replay-board .cell svg{width:15px;height:15px}.replay-board .replay-target{outline:2px solid var(--focus-ring);outline-offset:1px;z-index:1}
.replay-pointer-layer{position:absolute;inset:0;overflow:clip;overflow-clip-margin:5px;z-index:4;pointer-events:none}
.replay-pointer-layer *{pointer-events:none}
.replay-cursor,.replay-cursor-feedback{position:absolute;width:0;height:0;color:var(--green)}
.replay-cursor-arrow{position:absolute;left:-2px;top:-2px;width:20px;height:20px;overflow:visible;fill:currentColor;stroke:#fff;stroke-width:1.6;stroke-linejoin:round;filter:drop-shadow(0 1px 2px #132b3970);transform-origin:2px 2px}
.replay-cursor-ring{position:absolute;width:27px;height:27px;border:2px solid currentColor;border-radius:50%;background:color-mix(in srgb,currentColor 12%,transparent)}
.replay-cursor[data-action=flag],.replay-cursor-feedback[data-action=flag]{color:#b87920}
.replay-cursor-flag{position:absolute;left:-20px;top:-7px;width:14px;height:17px;display:grid;place-items:center;background:var(--surface);border:1px solid currentColor;border-radius:3px}
.replay-cursor-flag svg{width:11px;height:11px}.replay-cursor-flag.is-removal::after{content:"";position:absolute;left:1px;right:1px;top:7px;height:1px;background:currentColor;transform:rotate(-45deg)}
.replay-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:16px}.replay-controls .icon-button{border:1px solid var(--line);width:36px;height:36px;flex:0 0 36px}.replay-controls #replay-play{background:var(--green-soft);color:var(--green)}
.replay-progress{flex:1;min-width:100px;width:100%;accent-color:var(--green);margin:0 4px;height:28px}.replay-step-count{min-width:66px;text-align:right;font:11px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted)}
.replay-footer{display:flex;align-items:center;justify-content:space-between;gap:10px 16px;flex-wrap:wrap;margin-top:12px;min-height:24px}
.replay-action{margin:0;min-height:18px;color:var(--muted);font-size:12px}.replay-delete-dialog .dialog-actions{flex-wrap:wrap}
.replay-skip-option{display:inline-flex;align-items:center;gap:7px;min-height:24px;font-size:12px;color:var(--muted);cursor:pointer}
.replay-skip-option input{width:14px;height:14px;margin:0;accent-color:var(--green)}
[data-theme=dark] .replay-level-mark.medium{background:#323d49;color:#a7bbd1}
@media(max-width:620px){.replay-history{margin-top:28px}.replay-row{grid-template-columns:28px minmax(0,1fr) auto 72px;gap:8px}.replay-level-mark{width:28px;height:30px}.replay-detail{display:block}.replay-detail time,.replay-incompatible{display:block;margin-top:4px}.replay-row-actions button{width:34px}.replay-dialog{padding:16px;width:calc(100% - 16px)}.replay-dialog .replay-board{--cell:25px;--gap:3px}.replay-controls{gap:6px}.replay-progress{order:2;flex-basis:calc(100% - 82px);margin:4px 0 0}.replay-step-count{order:3}.replay-controls select{margin-left:auto}.replay-metrics{gap:30px 10px}.replay-metric strong{font-size:16px}.replay-board-scroll{max-height:calc(100dvh - 310px)}}