/* Scoped to the new preview's display-only hunt player. */
.smart-lesson{max-width:900px;margin:0 auto}.hunt-replay{min-width:0}.replay-loading{aspect-ratio:15/11;display:grid;place-items:center;background:#101319;border:1px solid var(--line);border-radius:12px;color:var(--muted)}
.replay-panel{border:1px solid #30353c;background:#101319;border-radius:12px;overflow:hidden;min-width:0}.replay-head{height:49px;padding:0 15px 0 19px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid #ffffff09}.replay-head>span:first-child{display:flex;align-items:center;gap:9px;font-family:var(--display);font-size:13px}.replay-head i{display:block;width:6px;height:6px;background:var(--red);border-radius:2px}.replay-head small{font-family:system-ui,sans-serif;color:#939da9;font-size:10px;margin-left:4px}.replay-head-tools{display:flex;gap:5px}
.replay-button{display:grid;place-items:center;flex-shrink:0;min-width:34px;height:34px;border:1px solid transparent;border-radius:6px;background:transparent;color:#b3bdc8;padding:7px;transition:color .15s,background .15s}.replay-button .icon{width:18px;height:18px}.replay-button:hover:not(:disabled){background:#2a303b;color:white}.replay-button[aria-pressed=true]{color:#ffa6ba;background:#f0526815}.replay-button:disabled{opacity:.3;cursor:default}.replay-button:focus-visible,.replay-seek:focus-visible,.replay-node-select:focus-visible,.replay-start:focus-visible,.replay-stage canvas:focus-visible{outline:2px solid var(--red);outline-offset:-3px}
.replay-stage{position:relative;background:#0a0e12;aspect-ratio:15/11;isolation:isolate}.replay-stage canvas{display:block;width:100%;height:100%;image-rendering:pixelated;touch-action:none;cursor:grab}.replay-stage canvas:active{cursor:grabbing}.replay-status{position:absolute;left:14px;top:14px;max-width:calc(100% - 90px);background:#0d1119e8;border:1px solid #ffffff17;border-radius:5px;padding:7px 11px;color:#d5dae2;font-size:11px;pointer-events:none;box-shadow:0 3px 14px #0003}.replay-status.is-fighting{border-color:#f052684d;color:#ffb7c6}.replay-status.is-error{color:#ffc0ce;pointer-events:auto}.replay-canvas-controls{position:absolute;top:12px;right:12px;display:flex;flex-direction:column;gap:2px;padding:3px;border:1px solid #ffffff17;background:#0d1119e8;border-radius:7px}.replay-start{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:65px;height:65px;border:1px solid #ffb0c375;border-radius:50%;background:#20141ce8;color:#ffc5d2;display:grid;place-items:center;box-shadow:0 4px 32px #0008;cursor:pointer}.replay-start:hover{background:#873149e8;border-color:#ffb0c3}.replay-start .icon{width:30px;height:30px;margin-left:4px;fill:currentColor;stroke-width:1}
.replay-controls{border-top:1px solid #ffffff10}.replay-transport{padding:9px 12px;display:flex;align-items:center;gap:6px}.replay-transport>[data-control=play]{color:#ffadc0;background:#f0526817}.replay-clock,.replay-duration{font-size:11px;font-variant-numeric:tabular-nums;color:#a8b0bd;min-width:30px;text-align:center}.replay-clock{color:#e0e4ea}.replay-seek{flex:1;min-width:25px;height:20px;accent-color:#ed7d96;cursor:pointer;margin:0 5px}.replay-toggle-group{display:flex;border-left:1px solid var(--line);padding-left:6px;margin-left:5px}.replay-bottom{display:flex;align-items:center;gap:13px;border-top:1px solid #ffffff09;padding:9px 18px;min-height:43px;font-size:11px;color:#98a4b3}.replay-node-select{max-width:180px;font-size:11px;color:#e5c0cd;border:0;background:#1e1d27;padding:5px 7px;border-radius:4px}.replay-selection{font-variant-numeric:tabular-nums}.replay-footnote{display:flex;justify-content:space-between;align-items:baseline;gap:18px;color:#7e8897;font-size:10px;padding:12px 2px}.replay-footnote details{text-align:right;flex-shrink:0;max-width:48%}.replay-footnote summary{cursor:pointer;color:#aab4c1}.replay-footnote p{padding:8px 0 0;color:#c4aab3;font-size:11px}
.replay-dialog{padding:0;border:0;background:transparent;overflow:visible;color:white;max-width:96vw;max-height:96svh;width:min(1180px,calc((100svh - 160px)*15/11));}.replay-dialog::backdrop{background:#04060aee;backdrop-filter:blur(6px)}.replay-dialog .replay-panel{border-color:#43434e;box-shadow:0 24px 120px #0009}.replay-dialog-close{position:absolute;right:4px;top:-39px;background:#1a2029;border:1px solid #434957;color:#e5ebf3;display:grid;place-items:center;width:31px;height:31px;border-radius:6px;cursor:pointer}.replay-dialog-close .icon{width:16px;height:16px}.replay-dialog .replay-head{height:42px}.replay-dialog .replay-bottom{min-height:38px;padding-top:6px;padding-bottom:6px}.replay-dialog .replay-transport{padding-top:6px;padding-bottom:6px}
@media(max-width:760px){.smart-lesson{margin:0 -6px}.replay-head{height:43px;padding-left:12px;padding-right:8px}.replay-head>span:first-child{font-size:12px;gap:6px}.replay-head small{font-size:9px}.replay-status{left:9px;top:9px;font-size:10px;max-width:calc(100% - 65px);padding:5px 7px}.replay-canvas-controls{top:8px;right:8px;padding:1px}.replay-canvas-controls .replay-button{min-width:29px;width:29px;height:29px;padding:6px}.replay-start{width:53px;height:53px}.replay-start .icon{width:25px;height:25px}.replay-transport{padding:7px 6px;gap:2px}.replay-transport .replay-button{width:30px;min-width:30px;height:32px;padding:6px}.replay-clock,.replay-duration{font-size:10px;min-width:27px}.replay-toggle-group{padding-left:3px;margin-left:2px}.replay-bottom{padding:8px 10px;gap:8px;font-size:10px;flex-wrap:wrap}.replay-node-select{max-width:157px;font-size:10px}.replay-footnote{font-size:9px;gap:14px}.replay-dialog{width:min(96vw,calc((100svh - 175px)*15/11));}.replay-dialog .replay-head small{display:none}}
@media(prefers-reduced-motion:reduce){.replay-button{transition:none}}
.replay-dialog-close{top:6px;right:13px;z-index:3;background:#191d24}.replay-dialog [data-control=expand]{visibility:hidden}.replay-stage canvas{image-rendering:auto}
.replay-cast{position:absolute;left:14px;bottom:13px;border:1px solid #ffffff24;border-radius:5px;padding:6px 10px;background:#0c111be8;font-size:11px;pointer-events:none}
.replay-footnote>span{min-width:0;flex:1}
@media(max-width:760px){.replay-footnote{flex-direction:column;gap:7px}.replay-footnote details{max-width:100%;text-align:left}}
