/* Ranime player: the same charcoal surfaces and signature red as the catalog. */
.ranime-player { isolation:isolate; overflow:hidden; color:#fff; font-size:14px; outline:none; container-type:inline-size; }
.ranime-player:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.ranime-player video { display:block; object-fit:contain; }
.ranime-player video::cue { color:#fff; background:rgba(0,0,0,.8); font-size:1.05em; }
.ranime-player:fullscreen, .ranime-player:-webkit-full-screen { width:100vw; height:100vh; height:100dvh; max-width:100vw; max-height:100dvh; border-radius:0; aspect-ratio:auto; display:grid; place-items:center; overflow:hidden; background:#000; }
.ranime-player:fullscreen video, .ranime-player:-webkit-full-screen video { width:100%; height:100%; max-width:100%; max-height:100%; object-fit:contain; background:#000; }
.ranime-player:fullscreen .rp-ui, .ranime-player:-webkit-full-screen .rp-ui { width:100%; height:100%; }
.ranime-player .player-overlay { z-index:2; padding:30px 22px 135px; pointer-events:none; background:rgba(7,7,10,.8); }
.rp-ui { position:absolute; inset:0; pointer-events:none; z-index:3; }
.rp-heading { position:absolute; inset:0 0 auto; padding:18px 20px 48px; display:flex; align-items:center; gap:18px; background:linear-gradient(#08080be6,transparent); transition:opacity .2s; }
.rp-brand { flex-shrink:0; display:flex; align-items:center; gap:9px; }
.rp-brand img { width:94px; height:36px; object-fit:contain; }
.rp-brand span { font-size:12px; color:#d9d9df; letter-spacing:.15em; font-weight:600; border-left:1px solid #ffffff40; padding-left:9px; }
.rp-title { min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:#ededf1; font-weight:500; }
.rp-center { position:absolute; inset:50% auto auto 50%; transform:translate(-50%,-50%); width:76px; height:76px; border:1px solid #ff6570; border-radius:50%; background:var(--accent,#e5202b); color:#fff; box-shadow:0 0 40px #e5202b38; display:grid; place-items:center; pointer-events:auto; transition:opacity .2s,scale .2s; }
.rp-center:hover { scale:1.05; background:#f42d39; }
.rp-center svg { width:36px; height:36px; fill:currentColor; }
.ranime-player:not(.is-paused) .rp-center,.ranime-player.is-preparing .rp-center { opacity:0; pointer-events:none; }
.rp-bottom { position:absolute; inset:auto 0 0; padding:52px 18px 10px; background:linear-gradient(transparent,#09090ced 60%); pointer-events:auto; transition:opacity .2s,transform .2s; }
.rp-timeline { height:22px; position:relative; margin-bottom:2px; }
.rp-timeline::before,.rp-buffer,.rp-progress { content:''; position:absolute; left:0; top:9px; height:4px; border-radius:3px; pointer-events:none; }
.rp-timeline::before { width:100%; background:#ffffff30; }
.rp-buffer { background:#ffffff58; }
.rp-progress { background:var(--accent,#e5202b); }
.rp-seek { position:absolute; inset:0; width:100%; height:22px; margin:0; appearance:none; -webkit-appearance:none; background:transparent; cursor:pointer; }
.rp-seek::-webkit-slider-runnable-track { height:4px; background:transparent; }
.rp-seek::-webkit-slider-thumb { appearance:none; -webkit-appearance:none; width:12px; height:12px; margin-top:-4px; background:#fff; border:2px solid var(--accent,#e5202b); border-radius:50%; box-shadow:0 0 6px #0009; }
.rp-seek::-moz-range-track { height:4px; background:transparent; }
.rp-seek::-moz-range-thumb { width:10px; height:10px; background:#fff; border:2px solid var(--accent,#e5202b); border-radius:50%; }
.rp-toolbar { display:flex; align-items:center; gap:3px; min-width:0; }
.rp-button { border:0; color:#fff; background:transparent; padding:10px; width:44px; height:44px; flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; border-radius:7px; position:relative; cursor:pointer; list-style:none; }
.rp-button svg { width:23px; height:23px; fill:currentColor; }
.rp-button:hover,.rp-settings-trigger[aria-expanded="true"] { background:#ffffff1c; }
.rp-button:focus-visible,.rp-seek:focus-visible,.rp-volume:focus-visible,.rp-settings select:focus-visible { outline:2px solid #ff5d67; outline-offset:2px; }
.rp-back span,.rp-forward span { font-size:32px; line-height:1; font-family:system-ui,sans-serif; }
.rp-back small,.rp-forward small { position:absolute; font-size:12px; top:18px; left:15px; font-weight:600; }
.rp-volume-group { display:flex; align-items:center; gap:1px; }
.rp-volume { width:60px; accent-color:var(--accent,#e5202b); height:22px; cursor:pointer; }
.rp-time { padding:0 6px; font-size:13px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.rp-time-divider,.rp-duration { color:#c0c0ca; }
.rp-spacer { flex:1; min-width:0; }
.rp-quality-badge { color:#e3e3e9; font-weight:600; font-size:12px; white-space:nowrap; letter-spacing:.025em; padding:4px 7px; border:1px solid #ffffff2a; border-radius:4px; }
.rp-cc { font-weight:700; font-size:14px; }
.rp-cc[aria-pressed="true"]::after { content:''; position:absolute; bottom:5px; height:3px; width:20px; background:var(--accent,#e5202b); border-radius:3px; }
.rp-settings-panel { position:fixed; inset:0; margin:auto; width:360px; max-width:calc(100vw - 32px); max-height:calc(100dvh - 32px); overflow:auto; overscroll-behavior:contain; background:#17171d; color:#fff; border:1px solid #ffffff26; box-shadow:0 15px 40px #0009; border-radius:16px; padding:18px; pointer-events:auto; font-family:inherit; }
.rp-settings-panel:not([open]) { display:none; }
.rp-settings-panel::backdrop { background:#000b; }
.rp-settings-title { display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:1rem; font-weight:600; padding-bottom:10px; margin-bottom:2px; border-bottom:1px solid #ffffff18; }
.rp-settings-close { width:44px; min-width:44px; height:44px; flex-shrink:0; }
.rp-settings-panel label { display:grid; grid-template-columns:70px minmax(0,1fr); align-items:center; gap:8px; margin-top:12px; font-size:14px; }
.rp-settings select { width:100%; min-height:44px; border:1px solid #ffffff24; border-radius:6px; background:#24242c; color:#fff; padding:8px; font:inherit; font-size:1rem; }
.rp-settings-panel p { color:#b6b6c2; font-size:12px; margin:14px 0 0; line-height:1.6; }
.rp-notice { position:absolute; top:75px; left:50%; transform:translateX(-50%) translateY(-5px); max-width:85%; text-align:center; padding:9px 14px; color:#fff; background:#19191fee; border:1px solid #ffffff2e; border-radius:8px; font-size:13px; opacity:0; transition:opacity .2s,transform .2s; }
.rp-notice.show { opacity:1; transform:translateX(-50%) translateY(0); }
.ranime-player:not(.controls-visible):not(.is-paused):not(.is-preparing) .rp-heading { opacity:0; }
.ranime-player:not(.controls-visible):not(.is-paused):not(.is-preparing) .rp-bottom { opacity:0; transform:translateY(10px); pointer-events:none; }
.ranime-player:not(.controls-visible):not(.is-paused):not(.is-preparing) { cursor:none; }
.ranime-player .next-toast { z-index:5; bottom:125px; }
@media (max-width:1000px) { .rp-volume { width:45px; } .rp-brand span { display:none; } }
@container (max-width:680px) {
  .rp-heading { padding:10px 12px 40px; gap:10px; } .rp-brand img { width:70px; height:28px; } .rp-title { font-size:12px; }
  .rp-bottom { padding:24px 10px 4px; } .rp-toolbar { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:0; }
  .rp-time { grid-row:1; grid-column:1/4; padding:0; font-size:12px; } .rp-quality-badge { grid-row:1; grid-column:4/7; justify-self:end; font-size:12px; padding:2px 5px; }
  .rp-button { width:100%; min-width:44px; height:44px; padding:8px; } .rp-volume-group { display:none; } .rp-spacer { display:none; }
  .rp-back small,.rp-forward small { left:50%; transform:translateX(-50%); top:16px; }
  .rp-center { width:58px; height:58px; } .rp-center svg { width:28px; height:28px; }
  .rp-notice { top:45px; font-size:12px; padding:5px 9px; } .ranime-player .player-overlay { padding:35px 14px 110px; } .ranime-player .player-overlay h3 { font-size:15px; } .ranime-player .player-overlay p { font-size:12px; }
}
@media (max-width:700px) {
  .rp-settings-panel { inset:auto 0 0; margin:0 auto; width:100%; max-width:100%; max-height:calc(100dvh - env(safe-area-inset-top, 0px) - 16px); padding:18px max(18px, env(safe-area-inset-right, 0px)) calc(20px + env(safe-area-inset-bottom, 0px)) max(18px, env(safe-area-inset-left, 0px)); border-radius:18px 18px 0 0; }
  .rp-settings-panel label { grid-template-columns:82px minmax(0, 1fr); }
  .rp-settings-close { width:44px; }
}
@media (max-width:700px) and (orientation:landscape) {
  .player-wrap { aspect-ratio:auto; height:min(100svh, calc(100vw * .5625)); max-height:100svh; }
  .player-wrap video { object-fit:contain; }
}
@media (pointer:coarse) {
  .rp-timeline, .rp-seek { height:44px; }
  .rp-timeline::before, .rp-buffer, .rp-progress { top:20px; }
  .rp-seek { touch-action:none; }
  .rp-seek::-webkit-slider-thumb { width:18px; height:18px; margin-top:-7px; }
  .rp-seek::-moz-range-thumb { width:16px; height:16px; }
  .rp-button:hover { background:transparent; }
  .ranime-player .player-overlay { padding:18px; background:#07070de8; }
  .ranime-player .player-overlay h3 { font-size:.875rem; }
  .ranime-player .player-overlay p { font-size:.75rem; }
  .ranime-player .player-overlay .spinner { width:26px; height:26px; }
  .ranime-player.is-preparing .rp-heading, .ranime-player.is-preparing .rp-timeline, .ranime-player.is-preparing .rp-time { visibility:hidden; }
  .ranime-player.is-preparing .rp-bottom { padding-top:0; }
  .ranime-player:fullscreen .rp-bottom { padding-left:max(16px, env(safe-area-inset-left, 0px)); padding-right:max(16px, env(safe-area-inset-right, 0px)); padding-bottom:max(8px, env(safe-area-inset-bottom, 0px)); }
  .ranime-player:fullscreen .rp-heading { padding-left:max(16px, env(safe-area-inset-left, 0px)); padding-right:max(16px, env(safe-area-inset-right, 0px)); }
}
@media (prefers-reduced-motion:reduce) { .rp-ui * { transition:none !important; } }
.rp-settings-panel .rp-settings-close { width:44px; min-width:44px; height:44px; }
.rp-skip-intro { position:absolute; right:18px; bottom:145px; z-index:4; padding:10px 16px; min-height:44px; border:1px solid #ffffff80; border-radius:8px; background:#17171df5; color:#fff; font:inherit; font-weight:600; pointer-events:auto; cursor:pointer; }
.rp-skip-intro:focus-visible { outline:2px solid #ff5d67; outline-offset:2px; }
.ep-guide-note { padding:10px 12px; border-bottom:1px solid var(--line); color:var(--muted); font-size:.875rem; line-height:1.5; }
.ep-guide-note span { white-space:nowrap; }
.ep-grid a.ep-filler, .ep-item.ep-filler { border-color:#c89022; background:#46351050; }
.ep-grid a.ep-mixed, .ep-item.ep-mixed { border-color:#538ec0; background:#16324a50; }
.ep-grid a.ep-filler, .ep-grid a.ep-mixed { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; min-height:54px; }
.ep-filler-label { font-size:.75rem; line-height:1.2; font-weight:600; color:#ffd074; }
.ep-mixed .ep-filler-label { color:#a8d5ff; }
.ep-grid a.active, .ep-item.active { outline:2px solid var(--accent); outline-offset:-2px; }
@container (max-width:680px) { .rp-skip-intro { bottom:auto; top:8px; right:10px; padding:8px 12px; } .ranime-player:has(.rp-skip-intro:not([hidden])) .rp-title { visibility:hidden; } }
