/* Reviews: the title page (/anime/123/reviews/) and My reviews. Site tokens, so dark and light follow the theme. */
.rv-main{padding-bottom:72px;}
.rv-wrap{width:min(820px,100% - 32px); align-content:start; --rv-rec:#2FC9A0; --rv-mixed:#E3A93B; --rv-not:#E5575F;}
[data-theme="light"] .rv-wrap{--rv-rec:#169B7A; --rv-mixed:#B97F0B; --rv-not:#D23F4A;}
.rv-sr{position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;}

/* title header */
.rv-hero{position:relative; display:flex; gap:20px; align-items:center; padding:20px; border-radius:20px; border:1px solid color-mix(in srgb, var(--navy) 10%, transparent); background:var(--paper); overflow:hidden; isolation:isolate;}
.rv-hero-bg{position:absolute; inset:-30px; z-index:-1; background-size:cover; background-position:center 20%; filter:blur(28px) saturate(1.3); opacity:.28; transform:scale(1.1);}
.rv-hero::after{content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg, color-mix(in srgb, var(--paper) 55%, transparent), var(--paper) 85%);}
html[dir="rtl"] .rv-hero::after{background:linear-gradient(270deg, color-mix(in srgb, var(--paper) 55%, transparent), var(--paper) 85%);}
.rv-eyebrow{margin:0; font:600 11px/1 'JetBrains Mono',monospace; letter-spacing:.08em; text-transform:uppercase; color:var(--blue);}
.rv-name{margin:0; font:800 clamp(22px,4vw,30px)/1.2 'Sora','Inter',sans-serif; letter-spacing:-.01em; color:var(--navy); overflow-wrap:anywhere;}
.rv-name a{color:inherit; text-decoration:none;}
.rv-name a:hover{color:var(--blue);}
html[lang="ar"] .rv-name,html[lang="ja"] .rv-name{font-family:inherit;}
.rv-poster{flex:none; width:132px; aspect-ratio:2/3; border-radius:14px; background:var(--blue-tint); overflow:hidden; display:block; box-shadow:0 10px 28px rgba(0,0,0,.35), 0 0 0 1px color-mix(in srgb, var(--navy) 12%, transparent);}
.rv-poster img{width:100%; height:100%; object-fit:cover; display:block;}
.rv-hero-t{min-width:0; flex:1; display:grid; gap:8px; justify-items:start;}
.rv-hero-t .rv-sum{justify-self:stretch; margin-top:4px;}
.rv-back{align-self:start; justify-self:start; display:inline-flex; align-items:center; max-width:100%; padding:7px 14px; border-radius:999px; border:1px solid color-mix(in srgb, var(--navy) 12%, transparent); background:var(--paper); font:600 13px/1.3 'Inter',sans-serif; color:var(--navy-soft); text-decoration:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.rv-back:hover{color:var(--blue); border-color:var(--blue);}
.rv-back::before{content:"\2190\00a0";}
html[dir="rtl"] .rv-back::before{content:"\2192\00a0";}
html[lang="ar"] .rv-back,html[lang="ja"] .rv-back{font-family:inherit;}
.rv-sub{margin:0; color:var(--navy-soft); font-size:14px; overflow-wrap:anywhere;}
.rv-sub a{color:var(--navy); font-weight:600; text-decoration:none;}
.rv-sub a:hover{color:var(--blue);}

.rv-sum{display:grid; gap:8px; margin-top:6px;}
.rv-bar{display:flex; gap:2px; height:8px; border-radius:999px; overflow:hidden; background:color-mix(in srgb, var(--navy) 8%, transparent);}
.rv-bar span{display:block; min-width:4px;}
.rv-bar-1{background:var(--rv-rec);}
.rv-bar-2{background:var(--rv-mixed);}
.rv-bar-3{background:var(--rv-not);}
.rv-legend{list-style:none; display:flex; flex-wrap:wrap; gap:6px 16px; font:500 13px/1.3 'Inter',sans-serif; color:var(--navy-soft);}
html[lang="ar"] .rv-legend,html[lang="ja"] .rv-legend{font-family:inherit;}
.rv-legend li{display:inline-flex; align-items:center; gap:6px;}
.rv-legend b{color:var(--navy); font-weight:700;}
.rv-total{font-weight:700; color:var(--navy);}
.rv-legend i{width:9px; height:9px; border-radius:50%; background:currentColor;}
.rv-legend .rv-rec-1 i{background:var(--rv-rec);}
.rv-legend .rv-rec-2 i{background:var(--rv-mixed);}
.rv-legend .rv-rec-3 i{background:var(--rv-not);}

/* the member's own box and the form */
.rv-box{background:var(--white); border:1px solid var(--border-soft); border-radius:16px; padding:16px; display:grid; gap:12px;}
.rv-box h2{font:700 17px/1.3 'Sora','Inter',sans-serif; color:var(--navy);}
html[lang="ar"] .rv-box h2,html[lang="ja"] .rv-box h2{font-family:inherit;}
.rv-box-note{grid-template-columns:1fr auto; align-items:center;}
.rv-box-note p{margin:0; color:var(--navy-soft); font-size:14.5px;}
.rv-mine{display:grid; gap:12px;}
.rv-mine .rv{border-color:color-mix(in srgb, var(--blue) 45%, var(--border-soft));}
.rv-form[hidden]{display:none;}
.rv-form textarea,.rv-dlg textarea{width:100%; resize:vertical; min-height:120px; padding:12px 14px; border-radius:12px; border:1px solid var(--border-soft); background:var(--paper); color:var(--navy); font:400 15px/1.6 'Inter',sans-serif;}
html[lang="ar"] .rv-form textarea,html[lang="ja"] .rv-form textarea,html[lang="ar"] .rv-dlg textarea,html[lang="ja"] .rv-dlg textarea{font-family:inherit;}
.rv-form textarea:focus-visible,.rv-dlg textarea:focus-visible{outline:2px solid var(--blue); outline-offset:1px;}
.rv-dlg textarea{min-height:76px;}
.rv-count{margin-top:-6px; text-align:end; font:500 12px/1 'JetBrains Mono',monospace; color:var(--navy-soft);}
.rv-recs{border:0; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:8px; min-width:0;}
.rv-recs legend{float:none; width:100%; padding:0 0 8px; font:600 13px/1.3 'Inter',sans-serif; color:var(--navy-soft);}
html[lang="ar"] .rv-recs legend,html[lang="ja"] .rv-recs legend{font-family:inherit;}
.rv-pill{cursor:pointer;}
.rv-pill input{position:absolute; opacity:0; pointer-events:none;}
.rv-pill span{display:inline-flex; align-items:center; gap:7px; padding:9px 15px; border-radius:999px; border:1px solid var(--border-soft); background:var(--paper); color:var(--navy-soft); font:600 14px/1 'Inter',sans-serif; transition:background .15s,border-color .15s,color .15s;}
html[lang="ar"] .rv-pill span,html[lang="ja"] .rv-pill span{font-family:inherit;}
.rv-pill:hover span{color:var(--navy);}
.rv-pill input:focus-visible + span{outline:2px solid var(--blue); outline-offset:2px;}
.rv-pill.rv-rec-1 input:checked + span{color:var(--rv-rec); border-color:var(--rv-rec); background:color-mix(in srgb, var(--rv-rec) 14%, transparent);}
.rv-pill.rv-rec-2 input:checked + span{color:var(--rv-mixed); border-color:var(--rv-mixed); background:color-mix(in srgb, var(--rv-mixed) 14%, transparent);}
.rv-pill.rv-rec-3 input:checked + span{color:var(--rv-not); border-color:var(--rv-not); background:color-mix(in srgb, var(--rv-not) 14%, transparent);}
.rv-check{display:flex; align-items:center; gap:9px; font:500 14px/1.3 'Inter',sans-serif; color:var(--navy); cursor:pointer;}
html[lang="ar"] .rv-check,html[lang="ja"] .rv-check{font-family:inherit;}
.rv-check input{width:18px; height:18px; accent-color:var(--blue);}
.rv-hint{margin:0; font-size:12.5px; color:var(--navy-soft);}
.rv-err{margin:0; font-size:13.5px; color:#e0495d;}
.rv-err[hidden]{display:none;}
.rv-form-acts{display:flex; flex-wrap:wrap; gap:8px;}

/* filters */
.rv-filters{min-width:0;}

/* a review */
.rv-list{display:grid; gap:12px; min-width:0;}
.rv{background:var(--white); border:1px solid var(--border-soft); border-radius:16px; padding:16px; display:grid; gap:11px; min-width:0; transition:opacity .25s, transform .25s;}
.rv.rv-gone{opacity:0; transform:scale(.98);}
.rv-off{border-style:dashed;}
.rv-ttl{display:flex; align-items:center; gap:10px; padding:8px; margin:-4px -4px 0; border-radius:12px; background:var(--paper); color:inherit; text-decoration:none; min-width:0;}
.rv-ttl:hover{background:var(--blue-tint);}
.rv-ttl-img{flex:none; width:34px; aspect-ratio:2/3; border-radius:6px; background:var(--blue-tint); overflow:hidden;}
.rv-ttl-img img{width:100%; height:100%; object-fit:cover; display:block;}
.rv-ttl-t{min-width:0; display:grid; gap:2px;}
.rv-ttl-t b{font:700 14px/1.3 'Inter',sans-serif; color:var(--navy); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.rv-ttl-t small{font:600 10.5px/1 'JetBrains Mono',monospace; letter-spacing:.06em; text-transform:uppercase; color:var(--navy-soft);}
html[lang="ar"] .rv-ttl-t b,html[lang="ja"] .rv-ttl-t b{font-family:inherit;}

.rv-head{display:flex; align-items:center; gap:12px; min-width:0;}
.rv-av{position:relative; flex:none; width:40px; height:40px; border-radius:50%; background:var(--blue-tint); color:var(--blue); display:grid; place-items:center; font:700 16px/1 'Sora',sans-serif; overflow:hidden; text-decoration:none;}
.rv-av img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.rv-who{min-width:0; flex:1; display:grid; gap:2px;}
.rv-who b{font:700 14.5px/1.3 'Inter',sans-serif; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
html[lang="ar"] .rv-who b,html[lang="ja"] .rv-who b{font-family:inherit;}
.rv-who a{color:var(--navy); text-decoration:none;}
.rv-who a:hover{text-decoration:underline;}
.rv-who span{font-size:12.5px; color:var(--navy-soft);}
.rv-lang{font:600 11px/1 'JetBrains Mono',monospace; letter-spacing:.05em;}
.rv-badge{flex:none; padding:4px 10px; border-radius:999px; background:color-mix(in srgb, var(--navy) 10%, transparent); color:var(--navy-soft); font:600 12px/1 'Inter',sans-serif;}
html[lang="ar"] .rv-badge,html[lang="ja"] .rv-badge{font-family:inherit;}

.rv-meta{display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px;}
.rv-rec{display:inline-flex; align-items:center; gap:6px; padding:5px 11px 5px 9px; border-radius:999px; font:600 13px/1 'Inter',sans-serif;}
html[dir="rtl"] .rv-rec{padding:5px 9px 5px 11px;}
html[lang="ar"] .rv-rec,html[lang="ja"] .rv-rec{font-family:inherit;}
.rv-meta .rv-rec-1{color:var(--rv-rec); background:color-mix(in srgb, var(--rv-rec) 14%, transparent);}
.rv-meta .rv-rec-2{color:var(--rv-mixed); background:color-mix(in srgb, var(--rv-mixed) 14%, transparent);}
.rv-meta .rv-rec-3{color:var(--rv-not); background:color-mix(in srgb, var(--rv-not) 14%, transparent);}
.rv-score{display:inline-flex; align-items:center; gap:5px; padding:5px 10px; border-radius:999px; background:color-mix(in srgb, #E3A93B 16%, transparent); border:1px solid color-mix(in srgb, #E3A93B 40%, transparent); color:var(--navy); font:700 14px/1 'Inter',sans-serif;}
.rv-score .rv-ic{color:#E3A93B;}
.rv-score small{color:var(--navy-soft); font-size:11px;}
.rv-parts{display:inline-flex; flex-wrap:wrap; gap:6px;}
.rv-part{padding:4px 9px; border-radius:999px; background:color-mix(in srgb, var(--navy) 6%, transparent); font:500 12px/1.2 'Inter',sans-serif; color:var(--navy-soft);}
.rv-part b{color:var(--navy); font-weight:700;}
html[lang="ar"] .rv-part,html[lang="ja"] .rv-part,html[lang="ar"] .rv-score,html[lang="ja"] .rv-score{font-family:inherit;}
.rv-ic{width:17px; height:17px; flex:none;}
.rv-ic-down{transform:rotate(180deg);}

.rv-body{position:relative; min-width:0;}
.rv-text{margin:0; font:400 15px/1.7 'Inter',sans-serif; color:var(--prose-text); overflow-wrap:anywhere;}
html[lang="ar"] .rv-text,html[lang="ja"] .rv-text{font-family:inherit;}
.rv-body.is-clamped .rv-text{display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:8; overflow:hidden;}
.rv-readmore{margin-top:6px; padding:0; border:0; background:none; color:var(--blue); font:600 13.5px/1.3 'Inter',sans-serif; cursor:pointer;}
html[lang="ar"] .rv-readmore,html[lang="ja"] .rv-readmore{font-family:inherit;}
.rv-readmore[hidden]{display:none;}
.rv-body.is-spoiler:not(.is-revealed) .rv-text{filter:blur(9px); user-select:none; max-height:8em; overflow:hidden; -webkit-line-clamp:none;}
.rv-body.is-spoiler:not(.is-revealed) .rv-readmore{display:none;}
.rv-reveal{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; background:rgba(14,27,46,.35); border:0; border-radius:12px; color:#fff; cursor:pointer; font:inherit;}
.rv-reveal span{font:700 15px/1.2 'Inter',sans-serif;}
.rv-reveal small{font-size:12.5px; opacity:.9;}
.rv-reveal:focus-visible{outline:2px solid var(--blue); outline-offset:2px;}
.rv-body.is-spoiler:not(.is-revealed){min-height:84px;}
.rv-body.is-revealed .rv-reveal{display:none;}

.rv-foot{display:flex; flex-wrap:wrap; align-items:center; gap:10px;}
.rv-votes{display:inline-flex; gap:6px;}
.rv-vote{display:inline-flex; align-items:center; gap:7px; min-width:56px; height:36px; padding:0 13px; border-radius:999px; border:1px solid var(--border-soft); background:var(--paper); color:var(--navy-soft); font:600 13.5px/1 'Inter',sans-serif; cursor:pointer; transition:background .15s,border-color .15s,color .15s;}
.rv-vote:hover:not(:disabled){color:var(--navy); background:var(--blue-tint);}
.rv-vote:disabled{opacity:.55; cursor:default;}
.rv-vote:focus-visible,.rv-flag:focus-visible,.rv-b:focus-visible{outline:2px solid var(--blue); outline-offset:2px;}
.rv-vote[aria-pressed="true"][data-v="1"]{color:var(--rv-rec); border-color:var(--rv-rec); background:color-mix(in srgb, var(--rv-rec) 14%, transparent);}
.rv-vote[aria-pressed="true"][data-v="2"]{color:var(--rv-not); border-color:var(--rv-not); background:color-mix(in srgb, var(--rv-not) 14%, transparent);}
.rv-flag{margin-inline-start:auto; width:36px; height:36px; display:grid; place-items:center; border-radius:50%; border:0; background:transparent; color:var(--navy-soft); cursor:pointer;}
.rv-flag:hover{color:var(--navy); background:var(--blue-tint);}
.rv-flag[aria-pressed="true"]{color:var(--rv-not);}
.rv-acts{margin-inline-start:auto; display:flex; flex-wrap:wrap; gap:6px; justify-content:flex-end;}
.rv-b{padding:8px 14px; border-radius:999px; border:1px solid var(--border-soft); background:var(--white); color:var(--navy); font:600 13px/1.2 'Inter',sans-serif; cursor:pointer; text-decoration:none; display:inline-block; transition:background .15s,border-color .15s,opacity .15s;}
html[lang="ar"] .rv-b,html[lang="ja"] .rv-b{font-family:inherit;}
.rv-b:hover:not(:disabled){background:var(--blue-tint); border-color:var(--blue);}
.rv-b:disabled{opacity:.5; cursor:default;}
.rv-b-danger{color:var(--rv-not);}
.rv-b-danger:hover:not(:disabled){background:color-mix(in srgb, var(--rv-not) 12%, transparent); border-color:var(--rv-not);}

.ab-empty p{margin:0 0 12px;}

/* report dialog */
.rv-dlg{border:1px solid var(--border-soft); border-radius:18px; background:var(--white); color:var(--navy); padding:20px; width:min(440px,100% - 32px); margin:auto;}
.rv-dlg::backdrop{background:rgba(0,0,0,.55);}
.rv-dlg form{display:grid; gap:12px;}
.rv-dlg h2{font:700 18px/1.3 'Sora','Inter',sans-serif;}
html[lang="ar"] .rv-dlg h2,html[lang="ja"] .rv-dlg h2{font-family:inherit;}
.rv-reasons{display:grid; gap:6px;}
.rv-reason{display:flex; align-items:center; gap:10px; padding:10px 12px; border:1px solid var(--border-soft); border-radius:12px; cursor:pointer; font:500 14.5px/1.3 'Inter',sans-serif;}
html[lang="ar"] .rv-reason,html[lang="ja"] .rv-reason{font-family:inherit;}
.rv-reason input{accent-color:var(--blue);}
.rv-reason:has(input:checked){border-color:var(--blue); background:var(--blue-tint);}

.rv-toast{position:fixed; inset-inline:16px; bottom:84px; margin-inline:auto; width:fit-content; max-width:min(420px,100% - 32px); padding:11px 18px; border-radius:999px; background:var(--navy); color:var(--paper); font:600 14px/1.3 'Inter',sans-serif; text-align:center; opacity:0; transform:translateY(8px); transition:opacity .25s, transform .25s; z-index:90; pointer-events:none;}
html[lang="ar"] .rv-toast,html[lang="ja"] .rv-toast{font-family:inherit;}
.rv-toast.is-in{opacity:1; transform:none;}

@media (max-width:520px){
  .rv-hero{gap:14px; padding:14px; border-radius:16px; align-items:flex-start;}
  .rv-poster{width:92px; border-radius:11px;}
  .rv-box-note{grid-template-columns:1fr;}
  .rv-box,.rv{padding:14px;}
  .rv-acts{margin-inline-start:0; justify-content:flex-start; width:100%;}
}
.rv[hidden]{display:none;}
