/* AniMus — "ani" skin: warm-black canvas, pill chrome, coral accent, quiet touch glow. Loads last. */
:root{--bg:#0a0708;--panel:#14100f;--line:rgba(255,255,255,.08);--hot:#ff4d5e;--gold:#ffc46b;--pill:rgba(24,17,16,.78)}
html{-webkit-tap-highlight-color:transparent}
body{background:radial-gradient(120% 60% at 50% -10%,#3a2a24 0%,#150e0d 45%,#0a0708 80%) fixed;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
input,textarea{-webkit-user-select:text;user-select:text}
img{-webkit-user-drag:none}
a,button,select{outline:none}
a:focus-visible,button:focus-visible{box-shadow:0 0 0 2px var(--hot)}
.liquid-bg{opacity:.35}
main{padding-bottom:120px}
.foot{border:0;opacity:.5}

/* top bar: wordmark pill + round icon buttons */
.top{position:sticky;top:max(8px,env(safe-area-inset-top));margin:8px max(14px,3vw) 0;padding:0;gap:10px;background:none;border:0;border-radius:0;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;flex-wrap:nowrap}
.top::before,.top::after{display:none}
.brand{display:inline-flex;align-items:center;height:52px;padding:0 22px;border-radius:99px;background:var(--pill);border:1px solid var(--line);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);font:800 22px Sora,sans-serif;letter-spacing:.01em;text-transform:uppercase;color:#fff}
.brand b{color:var(--hot)}
.nav{margin-left:8px;padding:5px;border-radius:99px;background:var(--pill);border:1px solid var(--line)}
.search{margin-left:auto;display:flex;align-items:center;gap:10px;position:relative}
.rbtn{width:52px;height:52px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--pill);border:1px solid var(--line);color:#fff;cursor:pointer;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);position:relative;overflow:hidden}
.rbtn svg{width:22px;height:22px}
.search input{width:0;padding:0;opacity:0;border:0;height:52px;border-radius:99px;background:var(--pill);transition:width .35s cubic-bezier(.2,.8,.2,1),opacity .2s,padding .3s}
.search.open input{width:min(260px,52vw);padding:0 18px;opacity:1;border:1px solid var(--line)}
.sg{top:60px;right:0;width:min(340px,92vw)}

/* hero */
.hc{min-height:560px;border-radius:34px;border:1px solid var(--line);box-shadow:0 30px 80px -40px #000;background:#120c0b}
.slide::after{background:linear-gradient(to top,#0a0708 2%,rgba(10,7,8,.55) 38%,transparent 70%)}
.hcov{display:none}
.gp{margin:0;max-width:none;width:100%;padding:0 20px 26px;border:0;border-radius:0;background:none;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;display:flex;flex-direction:column;align-items:center;text-align:center}
.gp::before,.gp::after{display:none}
.gp h1{font-size:clamp(28px,7vw,48px);text-shadow:0 4px 30px rgba(0,0,0,.6);margin:6px 0 12px}
.gp p,.gp .tags,.gp>.tag{display:none}
.mrow{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:0;padding:0 6px;border-radius:99px;background:rgba(10,7,8,.55);border:1px solid var(--line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.mrow>*{padding:10px 14px;font-size:14px;font-weight:600;color:#eee}
.mrow>*+*{border-left:1px solid var(--line)}
.mrow b{color:var(--gold)}
.gp .acts{justify-content:center;margin:18px 0 0;gap:10px}
.btn{border-radius:99px;background:rgba(255,255,255,.1);border:1px solid var(--line);position:relative;overflow:hidden}
.btn.hot{background:#fff;color:#111;border-color:#fff;box-shadow:0 10px 30px -10px rgba(255,255,255,.5);height:52px;padding:0 28px;font-size:16px;font-weight:700}
.btn.ic{width:52px;height:52px;padding:0;justify-content:center;border-radius:50%}
.btn.ic svg{width:22px;height:22px}
.hc .dots{bottom:10px}

/* rows, cards */
.row-h h2{display:inline-flex;align-items:center;padding:10px 18px;border-radius:99px;background:var(--pill);border:1px solid var(--line);font-size:18px}
.row-h a{padding:8px 14px;border-radius:99px;border:1px solid var(--line)}
.poster{border-radius:22px;border:1px solid var(--line);overflow:hidden}
.card:hover .poster{box-shadow:0 18px 40px -18px rgba(255,77,94,.55);border-color:rgba(255,77,94,.4)}
.card h3{font-weight:600}
.chipsrow a,.tag,.tabs a,.eps a{border-radius:99px}
.bar{background:var(--hot)}
.detail.glass{background:rgba(20,14,13,.7);border-radius:30px}

/* bottom bar: icon-only pill, coral dot on active */
.tabbar{display:none}
.tabbar a span{display:none}
@media(max-width:820px){
  .top .nav{display:none}
  .tabbar{display:flex;left:50%;right:auto;transform:translateX(-50%);width:max-content;max-width:calc(100vw - 24px);gap:4px;padding:7px;border-radius:99px;background:rgba(20,14,13,.82);border:1px solid var(--line);bottom:max(16px,env(safe-area-inset-bottom));backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);box-shadow:0 20px 40px -10px #000}
  .tabbar a{width:56px;height:56px;padding:0;justify-content:center;border-radius:50%;position:relative;overflow:hidden;color:#cfc6c4;transition:background .3s,color .3s,transform .2s}
  .tabbar a svg{width:24px;height:24px}
  .tabbar a.on{background:var(--hot);color:#fff;box-shadow:0 8px 24px -6px rgba(255,77,94,.7)}
  .tabbar::before,.tabbar::after,.tabbar .lens{display:none}
  .hc{min-height:min(74vh,600px);border-radius:30px}
}

/* touch glow: soft light that follows the finger, then fades. No ripple, no highlight box. */
.gl{position:absolute;inset:0;pointer-events:none;opacity:0;border-radius:inherit;transition:opacity .45s ease;background:radial-gradient(circle 90px at var(--gx,50%) var(--gy,50%),rgba(255,120,130,.34),rgba(255,77,94,.10) 55%,transparent 75%);mix-blend-mode:screen;z-index:3}
.glowing>.gl{opacity:1;transition:opacity .12s}
.poster.glowing{border-color:rgba(255,77,94,.45)}
.card:active .poster,.btn:active,.rbtn:active{transform:scale(.97)}
.card .poster,.btn,.rbtn,.tabbar a{transition:transform .25s cubic-bezier(.2,.8,.2,1),border-color .3s,box-shadow .3s,background .3s}
@media(prefers-reduced-motion:reduce){.gl{transition:none}*{scroll-behavior:auto!important}}

/* studio: demo series rows */
.adm.row.demo.off{opacity:.6}
.adm.row.demo b{font-weight:600}
.catmode{border-color:rgba(255,77,94,.35)}
