/* ════════════════════════════════════════════════════════════
   Chinokai — design system
   ════════════════════════════════════════════════════════════ */
:root{
  --bg:#0c0c0e; --bg-2:#111114; --card:#17171b; --card-2:#1d1d22; --card-3:#24242a; --line:#26262d; --line-2:#33333b;
  --text:#f3f3f4; --muted:#a1a1aa; --dim:#71717a;
  --accent:#e2463a; --accent-2:#ff6a55; --accent-soft:#e2463a22; --gold:#d4a24c; --ok:#22c55e; --blue:#3b82f6;
  --r:14px; --r-sm:10px; --r-lg:20px;
  --ui:"Plus Jakarta Sans","Noto Sans JP",system-ui,sans-serif; --jp:"Shippori Mincho","Noto Serif JP",serif;
  --w:1440px; --gut:clamp(16px,3vw,40px);
  --st-watching:#3b82f6; --st-completed:#22c55e; --st-planning:#a1a1aa; --st-paused:#d4a24c; --st-dropped:#e2463a;
}
[data-zone="cine"]{ --accent:#22c55e; --accent-2:#4ade80; --accent-soft:#22c55e22 }
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;color-scheme:dark}
body{background:var(--bg);color:var(--text);font:500 15px/1.55 var(--ui);min-height:100vh;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none}
img{display:block;max-width:100%}
svg.i{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
::selection{background:var(--accent);color:#fff}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#2a2a31;border-radius:10px;border:2px solid var(--bg)}::-webkit-scrollbar-track{background:transparent}
.wrap{max-width:var(--w);margin:0 auto;padding:0 var(--gut)}
.muted{color:var(--muted)} .dim{color:var(--dim)}
.jp{font-family:var(--jp)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.hide{display:none!important}

/* ── header ── */
.hd{position:sticky;top:0;z-index:40;height:64px;display:flex;align-items:center;gap:28px;padding:0 var(--gut);
  background:linear-gradient(#0c0c0ef2,#0c0c0ed9);backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:border-color .2s}
.hd.scrolled{border-color:var(--line)}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:19px;letter-spacing:-.01em}
.hanko{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:var(--accent);color:#fff;font:800 20px/1 var(--jp);transform:rotate(-5deg);
  box-shadow:0 0 0 2px var(--bg),0 0 0 3.5px var(--accent);transition:transform .25s}
.logo:hover .hanko{transform:rotate(0) scale(1.05)}
.logo i{font-style:normal;color:var(--accent)}
.logo small{font:700 10px var(--ui);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);padding:2px 6px;border:1px solid var(--accent);border-radius:6px;margin-left:2px}
.nav{display:flex;align-items:center;gap:2px}
.nav>a,.nav>.dd>button{display:flex;align-items:center;gap:5px;padding:8px 13px;border-radius:9px;font-weight:700;font-size:14.5px;color:#d6d6da;transition:.15s}
.nav>a:hover,.nav>.dd>button:hover,.nav>a.on{color:#fff;background:var(--card)}
.nav .chev{width:13px;height:13px;opacity:.6}
.hd-r{margin-left:auto;display:flex;align-items:center;gap:8px}
.ib{position:relative;display:grid;place-items:center;width:40px;height:40px;border-radius:11px;background:var(--card);border:1px solid var(--line);color:#e4e4e7;transition:.15s}
.ib:hover{background:var(--card-2);border-color:var(--line-2);color:#fff}
.ib.on{background:var(--card-3);border-color:#4a4a52}
.badge{position:absolute;top:-5px;right:-5px;min-width:19px;height:19px;padding:0 5px;border-radius:99px;background:var(--accent);color:#fff;font:800 11px/19px var(--ui);text-align:center;box-shadow:0 0 0 3px var(--bg)}
.av{width:40px;height:40px;border-radius:11px;overflow:hidden;display:grid;place-items:center;font-weight:800;color:#fff;background:var(--accent);flex:none;background-size:cover;background-position:center}
.av.round{border-radius:50%}
.hd .av{cursor:pointer;border:1px solid var(--line-2);transition:.15s}.hd .av:hover{transform:scale(1.04)}
.burger{display:none}

/* dropdown */
.dd{position:relative}
.menu{position:absolute;top:calc(100% + 10px);min-width:220px;padding:8px;border-radius:16px;background:#151518f7;border:1px solid var(--line-2);backdrop-filter:blur(12px);
  box-shadow:0 20px 60px #000c;opacity:0;transform:translateY(-6px);pointer-events:none;transition:.16s;z-index:50}
.menu.r{right:0}
.dd.open>.menu{opacity:1;transform:none;pointer-events:auto}
.menu a,.menu button{display:flex;align-items:center;gap:11px;width:100%;padding:10px 12px;border-radius:10px;font-weight:700;font-size:14.5px;color:#dcdce0;text-align:left}
.menu a:hover,.menu button:hover{background:var(--card-2);color:#fff}
.menu a .i,.menu button .i{color:var(--muted)}
.menu hr{border:0;border-top:1px solid var(--line);margin:6px 4px}
.menu .mh{display:flex;align-items:center;gap:11px;padding:8px 10px 10px}
.menu .mh b{display:block;font-size:15px}.menu .mh small{color:var(--muted);font-size:12.5px}
.menu .cnt{margin-left:auto;font-size:12px;background:var(--accent);color:#fff;padding:0 7px;border-radius:99px}

/* notif dropdown */
.np{width:380px;padding:0}
.np-h{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--line)}
.np-h b{font-size:15px}
.np-l{max-height:420px;overflow:auto;padding:6px}
.np-i{display:flex!important;gap:12px;align-items:center}
.np-i img{width:40px;height:56px;border-radius:7px;object-fit:cover;flex:none}
.np-i span{display:block;font-size:13.5px;line-height:1.35}
.np-i small{color:var(--muted);font-weight:600}
.np-i.unread{background:var(--accent-soft)}
.np-f{display:block!important;text-align:center!important;border-top:1px solid var(--line);border-radius:0 0 16px 16px!important;padding:12px!important;color:var(--muted)!important}

/* search overlay */
.so{position:fixed;inset:0;z-index:80;background:#000a;backdrop-filter:blur(6px);display:flex;justify-content:center;padding:10vh 16px 16px;opacity:0;pointer-events:none;transition:.15s}
.so.open{opacity:1;pointer-events:auto}
.so-box{width:min(680px,100%);max-height:76vh;display:flex;flex-direction:column;border-radius:20px;background:#141417;border:1px solid var(--line-2);box-shadow:0 30px 90px #000;overflow:hidden}
.so-in{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line)}
.so-in input{flex:1;background:none;border:0;outline:0;font-size:17px;font-weight:600}
.so-in kbd{font:700 11px var(--ui);color:var(--muted);border:1px solid var(--line-2);border-radius:6px;padding:2px 6px}
.so-r{overflow:auto;padding:8px}
.so-r a{display:flex;gap:14px;align-items:center;padding:9px 10px;border-radius:12px}
.so-r a:hover,.so-r a.sel{background:var(--card-2)}
.so-r img{width:44px;height:62px;border-radius:8px;object-fit:cover;flex:none;background:var(--card-2)}
.so-r b{display:block;font-size:15px}.so-r small{color:var(--muted);font-size:13px}
.so-e{padding:30px;text-align:center;color:var(--muted)}
.so-g{padding:12px 10px 4px;font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.so-r a.so-all{justify-content:center;color:var(--muted);font-weight:700;font-size:13.5px}

/* ── layout & sections ── */
main{min-height:calc(100vh - 64px)}
.page{padding-top:28px;padding-bottom:70px}
.ph{margin-bottom:24px}
.ph h1{font-size:clamp(28px,3.4vw,38px);font-weight:800;letter-spacing:-.02em;line-height:1.15}
.ph p{color:var(--muted);margin-top:6px}
.sec{margin-top:44px}
.sec-h{display:flex;align-items:flex-end;gap:14px;margin-bottom:16px}
.sec-h h2{font-size:22px;font-weight:800;letter-spacing:-.01em}
.sec-h .jp{color:var(--accent);font-size:15px;margin-left:-6px;opacity:.9}
.sec-h .more{margin-left:auto;display:flex;align-items:center;gap:4px;font-weight:700;font-size:14px;color:var(--muted)}
.sec-h .more:hover{color:#fff}
.rail-nav{margin-left:auto;display:flex;gap:6px}
.sec-h .more+.rail-nav{margin-left:8px}
.rail-nav button{width:34px;height:34px;border-radius:10px;background:var(--card);border:1px solid var(--line);display:grid;place-items:center}
.rail-nav button:hover{background:var(--card-2)}
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 5*16px)/6);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
.rail::-webkit-scrollbar{display:none}
.rail>*{scroll-snap-align:start}
.rail.wide{grid-auto-columns:calc((100% - 3*16px)/4)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:22px 16px}

/* buttons, chips, inputs */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:42px;padding:0 20px;border-radius:12px;font-weight:800;font-size:14.5px;background:var(--accent);color:#fff;transition:.15s;white-space:nowrap}
.btn:hover{background:var(--accent-2)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.lg{height:50px;padding:0 26px;font-size:15.5px;border-radius:14px}
.btn.sm{height:34px;padding:0 13px;font-size:13.5px;border-radius:10px}
.btn.ghost{background:var(--card);border:1px solid var(--line);color:#ececef}
.btn.ghost:hover{background:var(--card-2);border-color:var(--line-2)}
.btn.white{background:#fff;color:#111}.btn.white:hover{background:#e7e7ea}
.btn.danger{background:transparent;border:1px solid #e2463a66;color:#ff7b6e}.btn.danger:hover{background:#e2463a1a}
.btn.ic{width:42px;padding:0}
.btn.on{border-color:var(--accent);color:var(--accent-2)}
.chip{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 11px;border-radius:8px;background:var(--card-2);border:1px solid var(--line);font-size:13px;font-weight:700;color:#d4d4d8}
.chip.acc{background:var(--accent-soft);border-color:#e2463a55;color:var(--accent-2)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.inp,select.inp,textarea.inp{width:100%;height:46px;padding:0 15px;border-radius:12px;background:var(--card-2);border:1px solid var(--line);outline:0;font-weight:600;transition:.15s}
textarea.inp{height:auto;min-height:96px;padding:12px 15px;resize:vertical;line-height:1.5}
.inp:focus{border-color:#55555e;background:#202026}
.inp::placeholder{color:var(--dim)}
select.inp{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%23a1a1aa' stroke-width='2'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:38px}
label.f{display:block;margin-bottom:16px}
label.f>span{display:block;font-weight:800;font-size:14px;margin-bottom:8px}
label.f>small{display:block;color:var(--muted);font-size:13px;margin-top:7px}
.pre{display:flex;align-items:center;border-radius:12px;background:var(--card-2);border:1px solid var(--line)}
.pre span{padding-left:15px;color:var(--dim);font-weight:600;white-space:nowrap}
.pre .inp{border:0;background:none;padding-left:2px}
.tog{position:relative;width:44px;height:26px;flex:none}
.tog input{position:absolute;opacity:0;inset:0;cursor:pointer;z-index:1}
.tog i{position:absolute;inset:0;border-radius:99px;background:#3a3a42;transition:.2s}
.tog i::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:.2s}
.tog input:checked+i{background:var(--accent)}
.tog input:checked+i::after{transform:translateX(18px)}
.seg{display:inline-flex;padding:4px;border-radius:12px;background:var(--card);border:1px solid var(--line);gap:2px}
.seg button,.seg a{height:34px;padding:0 15px;border-radius:9px;font-weight:700;font-size:14px;color:var(--muted);display:inline-flex;align-items:center;gap:7px}
.seg button:hover,.seg a:hover{color:#fff}
.seg .on{background:var(--card-3);color:#fff;box-shadow:0 1px 0 #ffffff0d inset}
.seg .n{font-size:11.5px;padding:0 6px;border-radius:6px;background:#ffffff14}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.tabs a,.tabs button{display:flex;align-items:center;gap:8px;padding:14px 16px;font-weight:700;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.tabs a:hover,.tabs button:hover{color:#fff}
.tabs .on{color:#fff;border-color:var(--accent)}
.tabs .n{font-size:11.5px;padding:1px 7px;border-radius:6px;background:var(--card-2);color:var(--muted)}

/* ── cards ── */
.card{position:relative;display:block;min-width:0}
.poster{position:relative;aspect-ratio:2/3;border-radius:var(--r);overflow:hidden;background:var(--card-2)}
.poster img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.card:hover .poster img{transform:scale(1.05)}
.poster::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px #ffffff12;pointer-events:none}
.poster .play{position:absolute;inset:0;display:grid;place-items:center;background:#0008;opacity:0;transition:.2s}
.poster .play i{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--accent);box-shadow:0 8px 30px #000a;transform:scale(.8);transition:.2s}
.poster .play svg{fill:#fff;stroke:none;width:22px;height:22px;margin-left:3px}
.card:hover .play{opacity:1}.card:hover .play i{transform:none}
.pt{position:absolute;top:8px;left:8px;display:flex;gap:5px;flex-wrap:wrap}
.pt span,.pb span{height:23px;padding:0 8px;border-radius:7px;background:#0c0c0ed9;backdrop-filter:blur(6px);font-size:11.5px;font-weight:800;display:inline-flex;align-items:center;gap:4px}
.pt .sc{color:var(--gold)}
.pt .ac{background:var(--accent);color:#fff}
.pb{position:absolute;bottom:8px;left:8px;right:8px;display:flex;justify-content:space-between}
.bar{position:absolute;left:0;right:0;bottom:0;height:4px;background:#ffffff26}
.bar i{display:block;height:100%;background:var(--accent)}
.card h3{margin-top:10px;font-size:14.5px;font-weight:700;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card small{display:block;margin-top:3px;color:var(--muted);font-size:12.5px;font-weight:600}
.dot-st{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}
/* wide card (continue) */
.wcard{display:block}
.wcard .thumb{position:relative;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:var(--card-2)}
.wcard .thumb img{width:100%;height:100%;object-fit:cover;filter:brightness(.8);transition:.3s}
.wcard:hover .thumb img{filter:brightness(1);transform:scale(1.03)}
.wcard .ep{position:absolute;left:12px;bottom:14px;font-weight:800;font-size:13px;background:#000a;padding:3px 9px;border-radius:7px}
.wcard h3{margin-top:10px;font-size:14.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wcard small{color:var(--muted);font-size:12.5px;font-weight:600}
.skel{background:linear-gradient(90deg,var(--card) 0,var(--card-2) 50%,var(--card) 100%);background-size:200% 100%;animation:sk 1.3s infinite;border-radius:var(--r)}
@keyframes sk{to{background-position:-200% 0}}

/* ── hero ── */
.hero{position:relative;height:min(78vh,640px);min-height:460px;margin-top:-64px;overflow:hidden}
.hero-s{position:absolute;inset:0;opacity:0;transition:opacity .8s;pointer-events:none}
.hero-s.on{opacity:1;pointer-events:auto}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center 25%;transform:scale(1.04);transition:transform 8s linear}
.hero-s.on .hero-bg{transform:scale(1)}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--bg) 4%,#0c0c0ec4 40%,#0c0c0e33 75%),linear-gradient(0deg,var(--bg) 2%,transparent 45%),linear-gradient(#0c0c0e99,transparent 20%);pointer-events:none}
.hero-in{position:absolute;z-index:2;left:0;right:0;bottom:70px}
.hero-in .wrap>div{max-width:620px}
.hero-k{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:13px;color:var(--accent-2);letter-spacing:.06em;text-transform:uppercase}
.hero h1{font-size:clamp(32px,4.6vw,56px);font-weight:800;line-height:1.05;letter-spacing:-.025em;margin:12px 0 14px;text-shadow:0 4px 30px #000}
.hero .meta{display:flex;flex-wrap:wrap;gap:14px;color:#d4d4d8;font-weight:700;font-size:14px;margin-bottom:14px}
.hero .meta .sc{color:var(--gold)}
.hero p{color:#c8c8cd;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:24px;max-width:560px}
.hero .acts{display:flex;gap:10px;flex-wrap:wrap}
.hero-jp{position:absolute;z-index:2;right:var(--gut);top:110px;writing-mode:vertical-rl;font:800 54px/1 var(--jp);color:#ffffff14;letter-spacing:.25em;max-height:70%;overflow:hidden}
.hero-dots{position:absolute;z-index:3;right:var(--gut);bottom:78px;display:flex;gap:8px}
.hero-dots button{width:9px;height:9px;border-radius:99px;background:#ffffff40;transition:.3s}
.hero-dots button.on{width:28px;background:var(--accent)}

/* ── détail anime ── */
.dt-banner{position:relative;height:clamp(240px,40vw,420px);margin-top:-64px;background:var(--card) center 30%/cover}
.dt-banner::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--bg) 3%,#0c0c0e88 50%,#0c0c0e66)}
.dt{position:relative;z-index:2;display:grid;grid-template-columns:230px 1fr;gap:36px;margin-top:-170px}
.dt-poster{border-radius:16px;overflow:hidden;box-shadow:0 20px 60px #000c;aspect-ratio:2/3;background:var(--card-2)}
.dt-poster img{width:100%;height:100%;object-fit:cover}
.dt-side{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.dt-main{padding-top:84px;min-width:0}
.dt-main h1{font-size:clamp(28px,3.4vw,42px);font-weight:800;line-height:1.1;letter-spacing:-.02em}
.dt-main .native{font-family:var(--jp);color:var(--muted);font-size:17px;margin-top:6px}
.dt-meta{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
.dt-desc{color:#c4c4ca;max-width:820px;position:relative}
.dt-desc.clamp{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.dt-more{color:var(--accent-2);font-weight:700;font-size:14px;margin-top:6px}
.dt-acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.dt-grid{display:grid;grid-template-columns:1fr 300px;gap:36px;margin-top:40px}
.info{border-radius:var(--r);background:var(--card);border:1px solid var(--line);padding:6px 18px}
.info div{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px solid var(--line);font-size:14px}
.info div:last-child{border:0}
.info dt{color:var(--muted);font-weight:600}.info dd{font-weight:700;text-align:right}
.eps{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px}
.ep{position:relative;display:flex;flex-direction:column;justify-content:center;height:60px;padding:0 14px;border-radius:12px;background:var(--card);border:1px solid var(--line);transition:.15s;overflow:hidden}
.ep b{font-size:15px}.ep small{font-size:11.5px;color:var(--muted);font-weight:700}
.ep:hover{background:var(--card-2);border-color:var(--line-2)}
.ep.seen{opacity:.55}.ep.seen::before{content:"";position:absolute;right:10px;top:10px;width:8px;height:8px;border-radius:50%;background:var(--ok)}
.ep.cur{background:var(--accent);border-color:var(--accent);opacity:1}.ep.cur small{color:#fff}
.ep.na{opacity:.35;pointer-events:none}
.ep .pg{position:absolute;left:0;bottom:0;height:3px;background:var(--accent)}
.chars{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.char{display:flex;justify-content:space-between;border-radius:12px;background:var(--card);border:1px solid var(--line);overflow:hidden;height:72px}
.char>div{display:flex;gap:10px;align-items:center;min-width:0}
.char img{width:50px;height:72px;object-fit:cover;flex:none}
.char b{display:block;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.char small{color:var(--muted);font-size:12px}
.char>div:last-child{flex-direction:row-reverse;text-align:right}

/* ── watch ── */
.wt{display:grid;grid-template-columns:1fr 360px;gap:22px;padding-top:20px}
.player{position:relative;aspect-ratio:16/9;background:#000;border-radius:16px;overflow:hidden;box-shadow:0 20px 70px #000b}
.wt-bar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:16px}
.wt-t h1{font-size:22px;font-weight:800;line-height:1.2}
.wt-t a:hover{color:var(--accent-2)}
.wt-t p{color:var(--muted);font-weight:700;font-size:14px;margin-top:2px}
.wt-side{border-radius:16px;background:var(--card);border:1px solid var(--line);display:flex;flex-direction:column;max-height:calc(100vh - 110px);position:sticky;top:84px;overflow:hidden}
.wt-side-h{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--line)}
.wt-side-h b{font-size:15px}
.wt-list{position:relative;overflow:auto;padding:8px}
.wt-ep{display:flex;gap:12px;align-items:center;padding:9px 10px;border-radius:11px;font-weight:700;font-size:14px}
.wt-ep:hover{background:var(--card-2)}
.wt-ep .n{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:var(--card-3);font-size:13px;flex:none}
.wt-ep.cur{background:var(--accent-soft)}.wt-ep.cur .n{background:var(--accent);color:#fff}
.wt-ep.seen .n{color:var(--ok)}
.wt-ep small{display:block;color:var(--muted);font-size:12px;font-weight:600}
.empty{height:100%;min-height:200px;display:grid;place-content:center;justify-items:center;text-align:center;gap:10px;padding:24px;color:var(--muted)}
.empty b{font-size:20px;color:var(--text)}
.spin{width:36px;height:36px;border-radius:50%;border:3px solid var(--line-2);border-top-color:var(--accent);animation:rot .9s linear infinite}
@keyframes rot{to{transform:rotate(360deg)}}

/* ── lecteur Chino ── */
.cp{position:relative;width:100%;height:100%;background:#000;overflow:hidden;outline:0;user-select:none;color:#fff;font-family:var(--ui)}
.cp video{width:100%;height:100%;object-fit:contain;display:block;background:#000}
.cp svg{width:22px;height:22px;fill:currentColor;display:block}
.cp-top{position:absolute;inset:0 0 auto;padding:18px 22px 50px;background:linear-gradient(#000c,transparent);transition:opacity .3s;pointer-events:none}
.cp-title{font-weight:800;font-size:clamp(15px,1.8vw,20px);text-shadow:0 2px 8px #000}
.cp-sub{font-size:12.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-2)}
.cp-center{position:absolute;inset:0;display:grid;place-items:center;cursor:pointer}
.cp-big{width:78px;height:78px;border-radius:50%;display:grid;place-items:center;background:var(--accent);box-shadow:0 0 0 8px #e2463a33,0 10px 40px #000a;
  transition:transform .2s,opacity .25s;opacity:0;transform:scale(.85);pointer-events:none}
.cp-big svg{width:34px;height:34px}
.cp.paused .cp-big{opacity:1;transform:scale(1);pointer-events:auto}
.cp-big:hover{transform:scale(1.08)!important}
.cp-load{position:absolute;inset:0;display:none;place-items:center;pointer-events:none}
.cp.loading .cp-load{display:grid}.cp.loading .cp-big{opacity:0}
.cp-hanko{display:grid;place-items:center;width:58px;height:58px;border-radius:12px;background:var(--accent);font:800 32px/1 var(--jp);box-shadow:0 0 0 3px #000,0 0 0 5px var(--accent);animation:pulse 1.1s ease-in-out infinite}
@keyframes pulse{0%,100%{transform:rotate(-5deg) scale(.92);opacity:.7}50%{transform:rotate(-5deg) scale(1.05);opacity:1}}
.cp-flash{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:10px 18px;border-radius:12px;background:#000b;font-weight:800;font-size:18px;opacity:0;pointer-events:none}
.cp-flash.on{animation:flash .7s ease-out}
@keyframes flash{0%,70%{opacity:1}100%{opacity:0}}
.cp-ui{position:absolute;inset:auto 0 0;padding:34px 16px 10px;background:linear-gradient(transparent,#000e 75%);transition:opacity .3s}
.cp.idle{cursor:none}.cp.idle .cp-ui,.cp.idle .cp-top{opacity:0}
.cp-seek{position:relative;height:18px;display:flex;align-items:center;cursor:pointer;touch-action:none}
.cp-rail{position:relative;width:100%;height:4px;border-radius:4px;background:#ffffff30;transition:height .15s}
.cp-seek:hover .cp-rail{height:6px}
.cp-buf,.cp-prog{position:absolute;inset:0 auto 0 0;border-radius:4px}
.cp-buf{background:#ffffff50}.cp-prog{background:var(--accent)}
.cp-prog i{position:absolute;right:-7px;top:50%;width:14px;height:14px;margin-top:-7px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px #e2463a66;transform:scale(0);transition:transform .15s}
.cp-seek:hover .cp-prog i{transform:scale(1)}
.cp-tip{position:absolute;bottom:22px;transform:translateX(-50%);padding:4px 9px;border-radius:7px;background:#18181b;border:1px solid #333;font-size:12px;font-weight:700;opacity:0;transition:opacity .15s;pointer-events:none}
.cp-seek:hover .cp-tip{opacity:1}
.cp-bar{display:flex;align-items:center;gap:2px;margin-top:4px}
.cp-b{display:grid;place-items:center;width:40px;height:40px;border-radius:10px;color:#fff;opacity:.9;transition:.15s}
.cp-b:hover{opacity:1;background:#ffffff1c}
.cp-volw{display:flex;align-items:center}
.cp-vol{width:0;opacity:0;transition:.2s;accent-color:var(--accent);cursor:pointer}
.cp-volw:hover .cp-vol,.cp-vol:focus{width:84px;opacity:1;margin:0 8px 0 2px}
.cp-time{font-size:13.5px;font-weight:700;font-variant-numeric:tabular-nums;color:#ffffffe0;margin-left:8px}
.cp-grow{flex:1}
.cp-mark{font:800 15px var(--jp);color:var(--accent-2);opacity:.8;margin:0 10px;letter-spacing:.1em}
.cp-menuw{position:relative}
.cp-menu{position:absolute;right:0;bottom:48px;min-width:170px;max-height:300px;overflow:auto;padding:8px;border-radius:14px;background:#141417f2;border:1px solid #333;backdrop-filter:blur(8px);box-shadow:0 12px 40px #000c}
.cp-menu[hidden]{display:none}
.cp-mh{font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:6px 10px 4px}
.cp-menu button{display:block;width:100%;text-align:left;padding:8px 10px;border-radius:8px;font-size:14px;font-weight:700}
.cp-menu button:hover{background:#ffffff14}
.cp-menu button.on{color:var(--accent-2)}
.cp-menu button.on::before{content:"● ";font-size:9px;vertical-align:middle}
.cp-skip{position:absolute;right:22px;bottom:96px;display:flex;align-items:center;gap:8px;height:44px;padding:0 18px;border-radius:12px;background:#fff;color:#111;font-weight:800;box-shadow:0 10px 30px #000a;transition:.2s}
.cp-skip[hidden]{display:none}
.cp-skip svg{width:18px;height:18px}
.cp-skip:hover{transform:translateY(-2px)}
.cp-next{position:absolute;right:22px;bottom:96px;width:300px;border-radius:14px;overflow:hidden;background:#141417;border:1px solid #333;box-shadow:0 14px 40px #000c}
.cp-next[hidden]{display:none}
.cp-next .nx-h{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;font-size:12px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.cp-next .nx-b{display:flex;gap:10px;padding:0 14px 14px}
.cp-next .nx-b button{flex:1;height:38px;border-radius:10px;font-weight:800;font-size:14px}
.cp-next .nx-go{background:var(--accent);position:relative;overflow:hidden}
.cp-next .nx-go i{position:absolute;left:0;top:0;bottom:0;background:#ffffff33;width:0}
.cp-next .nx-no{background:#ffffff14}
.cp:fullscreen{border-radius:0}

/* ── profil ── */
.pf-banner{height:clamp(200px,26vw,320px);border-radius:0 0 var(--r-lg) var(--r-lg);background:linear-gradient(135deg,#1c1c22,#101013) center/cover;position:relative;margin-top:-64px}
.pf-banner::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#0c0c0eaa,transparent 60%);border-radius:inherit}
.pf-card{position:relative;z-index:2;margin-top:-70px;display:flex;align-items:flex-end;gap:24px;padding:20px 26px;border-radius:var(--r-lg);background:#17171bee;backdrop-filter:blur(10px);border:1px solid var(--line)}
.pf-card .av{width:140px;height:140px;border-radius:50%;margin-top:-90px;font-size:56px;border:5px solid var(--bg);box-shadow:0 10px 40px #000a}
.pf-card h1{font-size:28px;font-weight:800;line-height:1.1}
.pf-card h1 small{font-size:15px;color:var(--muted);font-weight:600;margin-left:8px}
.pf-card .soc{display:flex;gap:16px;color:var(--muted);font-size:14px;margin-top:6px}
.pf-card .soc b{color:var(--text)}
.pf-card .bio{color:#c4c4ca;font-size:14px;margin-top:6px;max-width:640px}
.pf-card .r{margin-left:auto;display:flex;gap:8px;align-items:center}
.pf-switch{display:flex;gap:8px;margin-top:16px}
.pf-switch button{display:flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border-radius:99px;background:var(--card);border:1px solid var(--line);font-weight:700;font-size:13.5px;color:var(--muted)}
.pf-switch button.on{color:#fff;border-color:var(--accent)}
.pf-switch .av{width:26px;height:26px;font-size:12px;border-radius:50%}
.pf-grid{display:grid;grid-template-columns:1fr 400px;gap:32px;margin-top:28px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.stat{padding:16px 18px;border-radius:var(--r);background:var(--card);border:1px solid var(--line)}
.stat b{display:block;font-size:24px;font-weight:800}
.stat small{font-size:11.5px;font-weight:800;letter-spacing:.08em;color:var(--muted);text-transform:uppercase}
.stbar{display:flex;height:22px;border-radius:7px;overflow:hidden;margin-top:14px;background:var(--card-2)}
.stbar i{display:grid;place-items:center;font:800 11px var(--ui);color:#fff;font-style:normal;min-width:2px}
.stleg{display:flex;flex-wrap:wrap;gap:16px;margin-top:10px;font-size:13.5px;font-weight:700;color:var(--muted)}
.stleg b{color:var(--text);margin-left:4px}
.act{display:flex;align-items:flex-end;gap:5px;height:110px;margin-top:10px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.act i{flex:1;border-radius:4px 4px 2px 2px;background:var(--accent);min-height:3px;opacity:.9;position:relative}
.act i.z{background:var(--card-2)}
.act i[data-n]:hover::after{content:attr(data-n);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);padding:3px 7px;border-radius:6px;background:var(--card-3);font:700 11px var(--ui);white-space:nowrap}
.act-l{display:flex;justify-content:space-between;color:var(--dim);font-size:12px;font-weight:700;margin-top:8px}
.hist{display:flex;flex-direction:column;gap:10px}
.hi{display:flex;gap:14px;align-items:center;padding:8px;border-radius:12px;transition:.15s}
.hi:hover{background:var(--card)}
.hi img{width:56px;height:76px;border-radius:9px;object-fit:cover;flex:none;background:var(--card-2)}
.hi>div{flex:1;min-width:0}
.hi b{display:block;font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hi .chip{height:24px;font-size:12px;margin-top:6px}
.hi time{color:var(--muted);font-size:12.5px;font-weight:600;white-space:nowrap;align-self:flex-start;margin-top:6px}

/* liste */
.lt{width:100%;border-collapse:separate;border-spacing:0 6px}
.lt th{text-align:left;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);padding:6px 12px}
.lt td{padding:8px 12px;background:var(--card);font-weight:700;font-size:14px;vertical-align:middle}
.lt td:first-child{border-radius:12px 0 0 12px}.lt td:last-child{border-radius:0 12px 12px 0}
.lt tr:hover td{background:var(--card-2)}
.lt .t{display:flex;align-items:center;gap:14px}
.lt .t img{width:42px;height:58px;border-radius:7px;object-fit:cover;flex:none}
.lt .num{text-align:center;width:110px}
.lt .sc{color:var(--gold)}

/* messages */
.msg-l{display:flex;flex-direction:column;gap:10px;margin-top:20px}
.msg{position:relative;display:flex;gap:18px;align-items:center;padding:18px 20px;border-radius:16px;background:var(--card);border:1px solid var(--line)}
.msg img{width:72px;height:100px;border-radius:10px;object-fit:cover;flex:none}
.msg h3{font-size:16px;font-weight:800}
.msg .chip{margin-top:10px}
.msg .r{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;gap:6px;color:var(--muted);font-size:13.5px;font-weight:700;text-align:right}
.msg .r span{display:flex;align-items:center;gap:6px}
.msg.unread::after{content:"";position:absolute;top:14px;right:14px;width:8px;height:8px;border-radius:50%;background:var(--accent)}
.msg .read{color:var(--dim);font-size:12.5px;display:flex;gap:5px;align-items:center}

/* settings */
.st{display:grid;grid-template-columns:260px 1fr;gap:40px;padding-top:28px}
.st-nav{position:sticky;top:90px;align-self:start}
.st-me{display:flex;align-items:center;gap:12px;padding:10px;border-radius:14px;margin-bottom:18px}
.st-me:hover{background:var(--card)}
.st-me b{display:block}.st-me small{color:var(--muted)}
.st-nav h4{font-size:12.5px;color:var(--dim);font-weight:700;margin:16px 10px 8px}
.st-nav a{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;font-weight:700;color:#d4d4d8}
.st-nav a:hover{background:var(--card)}
.st-nav a.on{background:var(--card-2);color:#fff}
.st-nav a.on .i{color:var(--accent)}
.st-nav a .i{color:var(--muted)}
.st-main h1{font-size:28px;font-weight:800}
.st-main>p{color:var(--muted);margin:4px 0 22px}
.box{padding:24px;border-radius:var(--r-lg);background:var(--card);border:1px solid var(--line);margin-bottom:18px}
.box>h3{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:800;margin-bottom:18px}
.box>h3 .i{color:var(--muted)}
.box>p.d{color:var(--muted);font-size:14px;margin:-10px 0 18px}
.row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 0;border-top:1px solid var(--line)}
.row:first-of-type{border-top:0;padding-top:0}
.row b{display:block;font-size:15px}.row small{color:var(--muted);font-size:13.5px}
.save-bar{display:flex;align-items:center;justify-content:space-between;padding-top:16px;border-top:1px solid var(--line);margin-top:6px;color:var(--muted);font-size:14px}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.svc{padding:18px;border-radius:16px;background:var(--card-2);border:1px solid var(--line)}
.svc .h{display:flex;gap:12px;align-items:center;margin-bottom:14px}
.svc .lg{display:grid;place-items:center;width:42px;height:42px;border-radius:11px;font-weight:900;font-size:13px;color:#fff;flex:none}
.svc b{display:block}.svc small{color:var(--muted);font-size:13px}
.drop{display:grid;place-items:center;gap:8px;padding:34px;border-radius:14px;border:1.5px dashed var(--line-2);color:var(--muted);text-align:center;cursor:pointer;transition:.15s}
.drop:hover,.drop.over{border-color:var(--accent);color:var(--text);background:var(--accent-soft)}
.danger{border-color:#e2463a44}.danger>h3{color:#ff7b6e}.danger>h3 .i{color:#ff7b6e}
.avpick{display:flex;gap:18px;align-items:center}
.avpick .av{width:84px;height:84px;font-size:34px;border-radius:50%}
.bnpick{height:120px;border-radius:14px;background:var(--card-2) center/cover;border:1px solid var(--line);margin-bottom:12px}
.colors{display:flex;gap:8px;flex-wrap:wrap}
.colors button{width:32px;height:32px;border-radius:50%;border:3px solid transparent}
.colors button.on{border-color:#fff}
.code{font:800 34px/1 ui-monospace,monospace;letter-spacing:.3em;padding:18px 22px;border-radius:14px;background:var(--bg);border:1px dashed var(--line-2);text-align:center;margin:10px 0}

/* ── écrans auth / profils ── */
.au{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:20px;overflow:auto;background:var(--bg)}
.au-bg{position:fixed;inset:0;background-size:cover;background-position:center;filter:saturate(.9)}
.au-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 40%,#0c0c0e99,#0c0c0ef2 70%)}
.au-box{position:relative;width:min(430px,100%);padding:36px 32px;border-radius:24px;background:#141417f0;backdrop-filter:blur(16px);border:1px solid var(--line-2);box-shadow:0 40px 100px #000}
.au-box .logo{justify-content:center;margin-bottom:8px;font-size:22px}
.au-box h2{text-align:center;font-size:22px;font-weight:800;margin:16px 0 4px}
.au-box>p{text-align:center;color:var(--muted);font-size:14px;margin-bottom:24px}
.au-err{color:#ff7b6e;font-size:13.5px;font-weight:700;min-height:20px;margin:-6px 0 10px}
.au-sw{text-align:center;color:var(--muted);font-size:14px;margin-top:18px}
.au-sw a{color:var(--accent-2);font-weight:700}
.au-close{position:absolute;top:14px;right:14px}
.pp{position:relative;text-align:center}
.pp h1{font-size:clamp(28px,4.4vw,48px);font-weight:800;letter-spacing:-.02em;text-shadow:0 4px 30px #000}
.pp-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(18px,3vw,36px);margin:44px 0}
.pp-c{display:flex;flex-direction:column;align-items:center;gap:12px;width:132px}
.pp-c .av{width:clamp(96px,12vw,132px);height:clamp(96px,12vw,132px);border-radius:50%;font-size:48px;border:3px solid transparent;transition:.2s;box-shadow:0 10px 40px #000a}
.pp-c:hover .av{border-color:#fff;transform:scale(1.05)}
.pp-c span{font-weight:700;color:#d4d4d8}
.pp-c:hover span{color:#fff}
.pp-add .av{background:#ffffff10!important;border:2px solid #ffffff55;color:#ffffffcc;backdrop-filter:blur(6px)}
.pp-edit .av{position:relative}
.pp-edit .av::after{content:"✎";position:absolute;inset:0;display:grid;place-items:center;background:#000a;border-radius:50%;font-size:30px}
.pp .btn.ghost{background:transparent;border-color:#ffffff66;letter-spacing:.06em;text-transform:uppercase;font-size:13px}
.pp .out{display:block;margin:18px auto 0;color:#d4d4d8;font-weight:700}

/* modal & toast */
.mo{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:16px;background:#000b;backdrop-filter:blur(4px);animation:fade .15s}
@keyframes fade{from{opacity:0}}
.mo-b{width:min(460px,100%);max-height:90vh;overflow:auto;padding:26px;border-radius:22px;background:#151518;border:1px solid var(--line-2);box-shadow:0 30px 90px #000}
.mo-b h3{font-size:19px;font-weight:800;margin-bottom:16px}
.mo-a{display:flex;gap:10px;justify-content:flex-end;margin-top:8px}
.toasts{position:fixed;z-index:99;left:50%;bottom:24px;transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}
.toast{display:flex;align-items:center;gap:10px;padding:12px 18px;border-radius:13px;background:#1d1d22;border:1px solid var(--line-2);box-shadow:0 12px 40px #000b;font-weight:700;font-size:14px;animation:up .2s}
.toast.err{border-color:#e2463a77}.toast.ok .i{color:var(--ok)}.toast.err .i{color:#ff7b6e}
@keyframes up{from{opacity:0;transform:translateY(10px)}}

/* filtres annuaire / saisons / calendrier */
.fl{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:24px}
.fl .inp{width:auto;min-width:150px;height:42px}
.fl .q{flex:1;min-width:220px}
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px}
.cal-d h3{font-size:14px;font-weight:800;padding:10px 12px;border-radius:12px;background:var(--card);border:1px solid var(--line);margin-bottom:10px;display:flex;justify-content:space-between}
.cal-d.today h3{background:var(--accent);border-color:var(--accent)}
.cal-i{display:flex;gap:10px;padding:8px;border-radius:12px;margin-bottom:6px;transition:.15s}
.cal-i:hover{background:var(--card)}
.cal-i img{width:42px;height:58px;border-radius:7px;object-fit:cover;flex:none}
.cal-i b{display:block;font-size:13px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cal-i small{color:var(--muted);font-size:12px;font-weight:700}
.cal-i.mine b{color:var(--accent-2)}
.friends{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.fr{display:flex;gap:12px;align-items:center;padding:14px;border-radius:14px;background:var(--card);border:1px solid var(--line)}
.fr .av{width:48px;height:48px;border-radius:50%}
.fr b{display:block}.fr small{color:var(--muted);font-size:13px}
.fr .r{margin-left:auto;display:flex;gap:6px}

.ft{border-top:1px solid var(--line);margin-top:40px;padding:36px 0 50px;color:var(--muted);font-size:13.5px}
.ft .wrap{display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;align-items:center}
.ft .logo{font-size:16px}.ft .hanko{width:28px;height:28px;font-size:16px}

/* ── responsive ── */
@media(max-width:1200px){.rail{grid-auto-columns:calc((100% - 4*16px)/5)}.wt{grid-template-columns:1fr}.wt-side{position:static;max-height:420px}.cal{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:980px){
  .nav{display:none}.burger{display:grid}
  .nav.open{display:flex;position:fixed;top:64px;left:0;right:0;flex-direction:column;align-items:stretch;padding:12px;background:#111114f7;border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
  .nav.open .menu{position:static;opacity:1;transform:none;pointer-events:auto;box-shadow:none;border:0;background:none;padding:0 0 0 14px;display:none}
  .nav.open .dd.open .menu{display:block}
  .rail{grid-auto-columns:calc((100% - 3*12px)/3.4);gap:12px}.rail.wide{grid-auto-columns:calc((100% - 12px)/1.6)}
  .dt{grid-template-columns:150px 1fr;gap:20px;margin-top:-110px}.dt-main{padding-top:40px}
  .dt-grid,.pf-grid,.st{grid-template-columns:1fr}
  .st-nav{position:static;display:flex;overflow-x:auto;gap:4px}.st-nav h4,.st-me{display:none}.st-nav a{white-space:nowrap}
  .stats{grid-template-columns:repeat(2,1fr)}
  .cal{grid-template-columns:repeat(2,minmax(0,1fr))}
  .np{width:min(380px,calc(100vw - 32px))}
}
@media(max-width:640px){
  :root{--gut:16px}
  .hd{gap:12px}.logo span.t{display:none}
  .hero{min-height:520px}.hero-jp{display:none}.hero-in{bottom:50px}
  .grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:16px 12px}
  .dt{grid-template-columns:1fr}.dt-poster{width:140px}.dt-main{padding-top:0}
  .pf-card{flex-direction:column;align-items:flex-start}.pf-card .av{width:110px;height:110px;margin-top:-70px}.pf-card .r{margin-left:0}
  .msg{flex-wrap:wrap}.msg .r{margin-left:0;align-items:flex-start;text-align:left}
  .lt .hide-m{display:none}
  .cp-b[data-a="back"],.cp-b[data-a="fwd"],.cp-mark{display:none}.cp-b{width:36px;height:36px}
  .cp-next{left:12px;right:12px;width:auto}
}

/* ── 404 ── */
.nf{min-height:calc(100vh - 64px - 140px);display:grid;grid-template-columns:minmax(0,420px) minmax(0,560px);justify-content:center;align-items:center;gap:clamp(20px,5vw,60px);padding-top:30px;padding-bottom:30px}
.nf-art{position:relative}
.nf-art::after{content:"";position:absolute;left:8%;right:4%;bottom:2%;height:9%;border-radius:50%;background:radial-gradient(#000c,transparent 70%);z-index:-1}
.nf-art img{width:100%;height:auto;animation:nfFloat 4.5s ease-in-out infinite;filter:drop-shadow(0 18px 30px #0009)}
@keyframes nfFloat{0%,100%{transform:translateY(0) rotate(-.6deg)}50%{transform:translateY(-10px) rotate(.6deg)}}
.nf h1{font-size:clamp(28px,3.6vw,44px);font-weight:800;letter-spacing:-.02em;line-height:1.1}
.nf h1 b{color:var(--accent)}
.nf p{color:#c8c8cd;font-size:17px;margin:14px 0 26px;line-height:1.6}
.nf .btn{border-radius:99px}
@media(max-width:760px){.nf{grid-template-columns:1fr;text-align:center}.nf-art{max-width:300px;margin:0 auto}}
@media(prefers-reduced-motion:reduce){.nf-art img{animation:none}}

/* ── news ── */
.nw-ph .jp{color:var(--accent);font-size:.6em;margin-left:6px}
.nw-top{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:32px}
.nw-cat{display:inline-block;padding:2px 9px;border-radius:6px;background:var(--accent);color:#fff;font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.nw-img{position:relative;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:var(--card-2)}
.nw-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
a:hover>.nw-img img{transform:scale(1.04)}
.nw-slides{display:grid}
.nw-slide{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .6s,visibility .6s}
.nw-slide.on{opacity:1;visibility:visible}
.nw-slide .nw-cat{margin-top:18px}
.nw-slide h2{font-size:clamp(22px,2.4vw,32px);font-weight:800;line-height:1.15;letter-spacing:-.01em;margin:10px 0 8px}
.nw-slide p{color:#c4c4ca;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:10px}
.nw-slide:hover h2{color:var(--accent-2)}
.nw small{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12.5px;font-weight:700;flex-wrap:wrap}
.nw-by{display:inline-flex;align-items:center;gap:6px;color:#d4d4d8}
.nw-by img{width:20px;height:20px;border-radius:50%;object-fit:cover}
.nw-bars{display:flex;gap:8px;margin-top:18px}
.nw-bars button{flex:1;height:4px;border-radius:4px;background:var(--card-3);overflow:hidden;padding:0}
.nw-bars button i{display:block;height:100%;width:0;background:var(--accent)}
.nw-bars button.on i{animation:nwBar 6.5s linear forwards}
@keyframes nwBar{to{width:100%}}
.nw-une h2{font-size:24px;font-weight:800;margin-bottom:16px}
.nw-mini{display:flex;gap:14px;padding:8px 0;border-bottom:1px solid var(--line)}
.nw-mini:last-child{border:0}
.nw-mini img{width:110px;aspect-ratio:16/9;border-radius:9px;object-fit:cover;flex:none;background:var(--card-2)}
.nw-mini b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13.5px;line-height:1.35;margin:5px 0 3px}
.nw-mini:hover b{color:var(--accent-2)}
.nw-mini .nw-cat{font-size:10px;padding:1px 7px}
.nw-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:26px 20px}
.nw-card h3{font-size:16px;font-weight:800;line-height:1.3;margin:10px 0 8px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.nw-card .nw-cat{margin-top:14px}
.nw-card:hover h3{color:var(--accent-2)}
.nw-row{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 3*16px)/4);gap:16px;overflow-x:auto;scrollbar-width:none}
@media(max-width:980px){.nw-top{grid-template-columns:1fr}.nw-row{grid-auto-columns:calc((100% - 12px)/1.5)}}

/* ── Films & Séries ───────────────────────────────────────── */
.cine-top{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin:8px 0 22px}
.cine-heading{flex:1;min-width:200px;font-size:clamp(24px,3vw,32px);font-weight:800;display:flex;align-items:center;gap:10px}
.cine-heading>.i{width:28px;height:28px;color:var(--accent)}
.cine-heading .plat-w{font-size:clamp(26px,3vw,38px)}
.cine-search-form{flex:1 1 300px;max-width:440px}
.cine-search-box{display:flex;align-items:center;gap:10px;height:44px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:0 14px;transition:border-color .2s}
.cine-search-box:focus-within{border-color:var(--accent)}
.cine-search-box .i{color:var(--muted);flex:none}
.cine-search-in{flex:1;min-width:0;background:none;border:0;outline:0;color:var(--text);font:600 14px var(--ui)}
.cx-seg{display:flex;padding:4px;gap:4px;background:var(--card);border:1px solid var(--line);border-radius:12px}
.cx-seg button{height:34px;padding:0 16px;border-radius:9px;font-weight:700;font-size:14px;color:var(--muted)}
.cx-seg button.on{background:var(--accent);color:#fff}
.cx-seg button:not(.on):hover{color:#fff;background:var(--card-2)}
.cx-chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:14px 0 22px}
.cx-chips button{flex:none;height:34px;padding:0 14px;border-radius:99px;border:1px solid var(--line);background:var(--card);font-weight:700;font-size:13px;color:var(--muted)}
.cx-chips button:hover{color:#fff}
.cx-chips button.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-2)}
.cx-count{margin-bottom:16px;font-weight:600}
.cx-more{display:flex;justify-content:center;margin-top:28px}
.cx-more .btn[hidden]{display:none}

/* tuiles plateformes */
.plat-row{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:12px}
.plat{position:relative;display:grid;place-items:center;aspect-ratio:16/9;border-radius:14px;background:linear-gradient(160deg,#25252c,#17171c);border:1px solid var(--line-2);box-shadow:0 10px 30px #0006;overflow:hidden;transition:transform .2s,border-color .2s,box-shadow .2s}
.plat::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 50% 125%,var(--pc),transparent 62%);opacity:0;transition:opacity .25s}
.plat:hover,.plat.on{transform:translateY(-3px);border-color:color-mix(in srgb,var(--pc) 70%,transparent);box-shadow:0 14px 36px #000a}
.plat:hover::before,.plat.on::before{opacity:.38}
.plat-w{position:relative;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;color:#fff;font-weight:900;font-size:clamp(13px,1.3vw,19px);letter-spacing:-.01em}
.plat-nfx{color:#e50914;font-family:Impact,"Arial Narrow Bold","Arial Narrow",sans-serif;font-weight:400;font-size:clamp(17px,1.9vw,27px);letter-spacing:.05em;text-transform:uppercase}
.plat-dnp{font-family:Georgia,"Times New Roman",serif;font-style:italic;background:linear-gradient(90deg,#fff 30%,#7fb2ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.plat-amp{text-transform:lowercase;box-shadow:inset 0 -3px 0 #00a8e1;padding-bottom:2px}
.plat-hbm{text-transform:uppercase;letter-spacing:.06em;background:linear-gradient(90deg,#fff 20%,#b48cff);-webkit-background-clip:text;background-clip:text;color:transparent}
.plat-atp{font-weight:700;letter-spacing:.01em}
.plat-cpd{font-family:"Arial Black",var(--ui);text-transform:uppercase}
.plat-pmp{color:#e7efff;font-weight:800}
.plat-cru{color:#f47521;text-transform:lowercase}
.plat-anime .hanko{width:26px;height:26px;font-size:15px;box-shadow:none}

/* fiche film / série */
.cd-hero{position:relative;height:clamp(260px,40vw,540px);margin-bottom:clamp(-330px,-24vw,-150px);overflow:hidden}
.cd-hero::before{content:"";position:absolute;inset:0;background:var(--bd) center 22%/cover no-repeat}
.cd-hero-fade{position:absolute;inset:0;background:linear-gradient(to bottom,#0c0c0e55,#0c0c0e99 55%,var(--bg)),linear-gradient(to right,#0c0c0ecc,transparent 60%)}
.cd{position:relative;z-index:1;padding-bottom:70px}
.cd-back{display:inline-flex;align-items:center;gap:4px;color:#d4d4d8;font-weight:700;font-size:13px;margin-bottom:18px}
.cd-back:hover{color:var(--accent-2)}
.cd-head{display:grid;grid-template-columns:clamp(150px,16vw,230px) minmax(0,1fr);gap:clamp(18px,3vw,40px);align-items:end}
.cd-poster{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:16px;box-shadow:0 20px 50px #000c;border:1px solid #ffffff14}
.cd-poster-ph{display:grid;place-items:center;background:var(--card);color:var(--dim)}
.cd-kicker{color:var(--accent-2);font-weight:800;font-size:13px;letter-spacing:.06em;text-transform:uppercase}
.cd-title{font-size:clamp(28px,4.4vw,56px);font-weight:900;line-height:1.05;letter-spacing:-.02em;margin:6px 0 14px;text-shadow:0 4px 30px #000}
.cd-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.cd-tags span{height:28px;display:inline-flex;align-items:center;padding:0 11px;border-radius:99px;background:#ffffff12;border:1px solid #ffffff1a;font-size:12.5px;font-weight:700}
.cd-tags .cd-score{background:#d4a24c22;border-color:#d4a24c55;color:var(--gold)}
.cd-lead{max-width:760px;line-height:1.65;color:#d4d4d8;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:20px}
.cd-actions{display:flex;flex-wrap:wrap;gap:10px}
.cd-plat{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:16px;font-size:13px;color:var(--muted);font-weight:700}
.cd-tabs{display:flex;gap:4px;margin:40px 0 22px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none;scroll-margin-top:90px}
.cd-tabs button{position:relative;flex:none;padding:12px 16px;font-weight:700;font-size:15px;color:var(--muted)}
.cd-tabs button:hover,.cd-tabs button.on{color:#fff}
.cd-tabs button.on::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:3px;border-radius:3px;background:var(--accent)}

/* épisodes */
.ep-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.ep-seasons{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;min-width:0}
.ep-seasons button{flex:none;display:flex;align-items:baseline;gap:6px;height:38px;padding:0 16px;border-radius:99px;background:var(--card);border:1px solid var(--line);font-weight:800;font-size:14px;color:var(--muted);line-height:38px}
.ep-seasons button small{font-weight:600;font-size:12px;color:var(--dim)}
.ep-seasons button:hover{color:#fff}
.ep-seasons button.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-2)}
.ep-spoil{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 14px;border-radius:10px;background:var(--card);border:1px solid var(--line);font-weight:700;font-size:13px;color:var(--muted);transition:.15s}
.ep-spoil:hover{color:#fff;border-color:var(--line-2)}
.ep-spoil.on{color:var(--accent-2);border-color:var(--accent);background:var(--accent-soft)}
.ep-spoil.sm{height:30px;padding:0 10px;font-size:12px;gap:6px}
.ep-spoil .i{width:16px;height:16px}
.ep-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:24px 18px}
.ep-card{position:relative;display:flex;flex-direction:column;gap:10px;min-width:0}
.ep-thumb{position:relative;display:block;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:var(--card-2);border:1px solid var(--line)}
.ep-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .35s,filter .3s}
.ep-card:hover .ep-thumb img{transform:scale(1.05)}
.ep-ph{height:100%;display:grid;place-items:center;color:var(--dim)}
.ep-n{position:absolute;left:8px;top:8px;padding:3px 8px;border-radius:7px;background:#000b;font-weight:800;font-size:12px}
.ep-soon{position:absolute;left:8px;bottom:8px;padding:3px 8px;border-radius:7px;background:var(--gold);color:#1a1205;font-weight:800;font-size:11.5px}
.ep-play{position:absolute;inset:0;display:grid;place-items:center;background:#0006;opacity:0;transition:opacity .2s}
.ep-play .i{width:46px;height:46px;padding:12px;border-radius:50%;background:var(--accent);color:#fff}
.ep-card:hover .ep-play{opacity:1}
.ep-vu{position:absolute;right:8px;top:8px;z-index:2;display:inline-flex;align-items:center;gap:4px;height:26px;padding:0 9px;border-radius:7px;background:#000b;border:1px solid #ffffff22;font-weight:800;font-size:11.5px;color:#d4d4d8;transition:.15s}
.ep-vu .i{width:13px;height:13px}
.ep-vu:hover{border-color:var(--accent);color:#fff}
.ep-vu.on{background:var(--ok);border-color:var(--ok);color:#052e14}
.ep-body b{display:block;font-size:15px;line-height:1.3}
.ep-body:hover b{color:var(--accent-2)}
.ep-body small{color:var(--dim);font-size:12.5px;font-weight:600}
.ep-syn{margin-top:6px;color:var(--muted);font-size:13.5px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ep-card.seen .ep-thumb img{filter:saturate(.7)}
.ep-card.spoil .ep-thumb img{filter:blur(14px) brightness(.6);transform:scale(1.15)}
.ep-card.spoil .ep-syn{font-style:italic;color:var(--dim)}

/* onglets synopsis / casting / bande-annonce */
.cd-syn{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:32px;align-items:start}
.cd-syn>p{font-size:16px;line-height:1.75;color:#d4d4d8;max-width:820px}
.cd-facts{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:4px 18px}
.cd-facts div{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--line)}
.cd-facts div:last-child{border:0}
.cd-facts dt{color:var(--muted);font-weight:700;font-size:13.5px;flex:none}
.cd-facts dd{text-align:right;font-weight:700;font-size:13.5px}
.cd-trailer{position:relative;aspect-ratio:16/9;max-width:980px;border-radius:16px;overflow:hidden;background:#000}
.cd-trailer iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* lecture */
.wt-main{min-width:0}
.cine-wt.solo{grid-template-columns:minmax(0,1fr)}
.cw-bar{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px;margin-top:16px}
.cw-back{display:inline-flex;align-items:center;gap:4px;color:var(--muted);font-weight:700;font-size:13px;margin-bottom:4px}
.cw-back:hover{color:var(--accent-2)}
.cw-t{min-width:0}
.cw-t h1{font-size:clamp(18px,2vw,24px);font-weight:800;line-height:1.25}
.cw-code{color:var(--accent-2);margin-right:4px}
.cw-nav{display:flex;gap:8px}
.cw-syn{margin-top:14px;max-width:900px;color:var(--muted);line-height:1.65}
.src-badge{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.06em;padding:2px 7px;border-radius:4px;margin-left:8px;vertical-align:middle}
.src-badge.vf{background:var(--accent-2);color:#000}
.src-badge.vostfr{background:#3b3b4a;color:var(--muted)}
.cw-syn.spoil{filter:blur(6px);user-select:none}
.wt-side-h small{display:block;color:var(--dim);font-size:12px;font-weight:600}
.wt-seasons{display:flex;gap:6px;padding:10px 12px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.wt-seasons a{flex:none;height:30px;padding:0 12px;display:grid;place-items:center;border-radius:99px;background:var(--card-2);font-weight:800;font-size:12.5px;color:var(--muted)}
.wt-seasons a:hover{color:#fff}
.wt-seasons a.on{background:var(--accent);color:#fff}
.wte{display:grid;grid-template-columns:128px minmax(0,1fr);gap:12px;align-items:center;padding:8px;border-radius:12px;border:1px solid transparent;transition:background .15s}
.wte:hover{background:var(--card-2)}
.wte.cur{background:var(--accent-soft);border-color:color-mix(in srgb,var(--accent) 50%,transparent)}
.wte-th{position:relative;aspect-ratio:16/9;border-radius:8px;overflow:hidden;background:var(--card-3)}
.wte-th img{width:100%;height:100%;object-fit:cover;transition:filter .3s}
.wte-th i{position:absolute;left:5px;top:5px;padding:2px 6px;border-radius:5px;background:#000b;font:800 11px var(--ui)}
.wte-th em{position:absolute;inset:0;display:grid;place-items:center;background:#0007}
.wte-th em .i{width:22px;height:22px;color:#fff}
.wte.spoil .wte-th img{filter:blur(10px) brightness(.6);transform:scale(1.15)}
.wte.seen:not(.cur) .wte-th{opacity:.7}
.wte-tx b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13.5px;line-height:1.3}
.wte-tx small{display:flex;align-items:center;gap:4px;margin-top:4px;color:var(--dim);font-size:12px;font-weight:600}
.wte-tx small .i{width:13px;height:13px}
.wte.seen .wte-tx small{color:var(--ok)}
.wte.cur .wte-tx small{color:var(--accent-2)}

/* indisponible */
.cine-unavail{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:32px 20px;color:var(--muted)}
.cine-unavail>.i{width:46px;height:46px;opacity:.45}
.cine-unavail b{font-size:19px;color:var(--text)}
.cine-unavail p{max-width:440px;line-height:1.6;font-size:14px}

@media(max-width:1100px){.plat-row{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:150px;overflow-x:auto;scrollbar-width:none;padding:4px 0 10px}}
@media(max-width:760px){
  .cine-top{flex-direction:column;align-items:stretch}
  .cine-search-form{max-width:none}
  .cd-head{grid-template-columns:110px minmax(0,1fr);align-items:start}
  .cd-lead{-webkit-line-clamp:5}
  .cd-syn{grid-template-columns:1fr}
  .cd-actions .btn.lg{flex:1 1 auto}
  .ep-grid{grid-template-columns:1fr}
}

/* ════════════════════════════════════════════════════════════
   Curseur chibi
   ════════════════════════════════════════════════════════════ */
:root{--cur:image-set(url(/img/cursor.png) 1x,url(/img/cursor@2x.png) 2x) 7 26,auto;--cur-p:image-set(url(/img/cursor.png) 1x,url(/img/cursor@2x.png) 2x) 7 26,pointer}
html[data-cursor],html[data-cursor] *{cursor:var(--cur)!important}
html[data-cursor] :is(a,button,select,summary,label,[role=button],[data-tab],input[type=checkbox],input[type=radio],input[type=range],input[type=file],.cp-center,.cp-seek,.cc-strip),
html[data-cursor] :is(a,button,summary,label) *{cursor:var(--cur-p)!important}
html[data-cursor] :is(input:not([type=checkbox],[type=radio],[type=range],[type=file],[type=submit],[type=button]),textarea,[contenteditable]){cursor:text!important}
html[data-cursor] :disabled{cursor:not-allowed!important}
html[data-cursor] .cp.idle,html[data-cursor] .cp.idle *{cursor:none!important}

/* ════════════════════════════════════════════════════════════
   Ambiance d'automne
   ════════════════════════════════════════════════════════════ */
:root{--maple:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M50 3 58 22 70 13 66 36 88 27 80 44 98 50 80 58 87 75 64 68 67 85 54 77 52 97 48 97 46 77 33 85 36 68 13 75 20 58 2 50 20 44 12 27 34 36 30 13 42 22Z'/%3E%3C/svg%3E")}
html[data-autumn] body{background:
  radial-gradient(1200px 520px at 12% -120px,#c2410c14,transparent 70%),
  radial-gradient(900px 420px at 92% -60px,#b4231812,transparent 70%),var(--bg);background-attachment:fixed}
html[data-autumn] .hanko{position:relative}
html[data-autumn] .hd .hanko::after{content:"";position:absolute;right:-7px;top:-6px;width:15px;height:15px;transform:rotate(22deg);
  background:#e2652a;-webkit-mask:var(--maple) center/contain no-repeat;mask:var(--maple) center/contain no-repeat;filter:drop-shadow(0 1px 1px #0008)}
html[data-autumn] .ft{position:relative;background:linear-gradient(#0c0c0e00,#1a0d0855)}
html[data-autumn] .sec-h h2::after{content:"";display:inline-block;width:13px;height:13px;margin-left:8px;vertical-align:2px;opacity:.75;background:#d9772b;transform:rotate(-18deg);
  -webkit-mask:var(--maple) center/contain no-repeat;mask:var(--maple) center/contain no-repeat}
.ft-sec{color:var(--accent-2);font-weight:700}

.leaves{position:fixed;inset:0;z-index:30;pointer-events:none;overflow:hidden;contain:strict}
.leaves span{position:absolute;top:-40px;left:var(--x);width:22px;height:22px;opacity:var(--o);will-change:transform;
  animation:leafFall var(--d) linear var(--dl) infinite}
.leaves i{display:block;width:100%;height:100%;background:center/contain no-repeat;will-change:transform;
  animation:leafSway var(--sd) ease-in-out var(--dl) infinite alternate}
.leaves.paused span,.leaves.paused i{animation-play-state:paused}
@keyframes leafFall{from{transform:translate3d(0,0,0)}to{transform:translate3d(calc(var(--sw) * -1),calc(100vh + 80px),0)}}
@keyframes leafSway{from{transform:translateX(calc(var(--sw) * -.5)) rotate(0) scale(var(--s))}to{transform:translateX(calc(var(--sw) * .5)) rotate(var(--r)) scale(var(--s))}}
html[data-page^="watch"] .leaves,html[data-page="clip"] .leaves{display:none}
.leaf-burst{position:fixed;z-index:95;width:0;height:0;pointer-events:none}
.leaf-burst i{position:absolute;left:-6px;top:-6px;width:12px;height:12px;background:center/contain no-repeat;animation:leafPop .85s cubic-bezier(.2,.7,.3,1) forwards}
@keyframes leafPop{0%{transform:translate(0,0) rotate(0) scale(.4);opacity:1}70%{opacity:1}100%{transform:translate(var(--tx),calc(var(--ty) + 26px)) rotate(var(--rt)) scale(1);opacity:0}}
@media(prefers-reduced-motion:reduce){.leaves,.leaf-burst{display:none}}

/* ════════════════════════════════════════════════════════════
   Connexion Discord
   ════════════════════════════════════════════════════════════ */
.btn-discord{background:#5865f2;color:#fff}.btn-discord:hover{background:#6d78f5}
.btn-discord.disabled{opacity:.5;pointer-events:none}
.au-dc{width:100%;margin-top:4px}
.au-dc .i{width:22px;height:22px}
.au-err-box{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:12px;background:#e2463a14;border:1px solid #e2463a44;margin:0 0 16px;line-height:1.45}
.au-err-box .i{flex:none;margin-top:1px}
.au-pts{list-style:none;display:grid;gap:10px;margin:20px 0 6px}
.au-pts li{display:flex;gap:10px;font-size:13px;color:var(--muted);line-height:1.5}
.au-pts .i{flex:none;width:16px;height:16px;margin-top:2px;color:var(--accent-2)}
.au-old{margin-top:18px;border-top:1px solid var(--line);padding-top:14px}
.au-old summary{font-size:13.5px;font-weight:700;color:var(--muted);list-style:none;text-align:center}
.au-old summary::-webkit-details-marker{display:none}
.au-old summary:hover{color:#fff}
.au-old form{margin-top:14px}
.au-old form>p{font-size:13px;margin-bottom:14px;line-height:1.5}
.au-sw a{display:inline-flex;align-items:center;gap:6px}
.au-sw .i{width:15px;height:15px}

/* ════════════════════════════════════════════════════════════
   Annonces de l'équipe (chibi)
   ════════════════════════════════════════════════════════════ */
#anns:empty{display:none}
#anns{padding-top:14px}
.ann{--ak:var(--accent);margin-bottom:10px;animation:annIn .45s cubic-bezier(.2,.8,.3,1.2)}
.ann.out{animation:annOut .26s forwards}
.ann-update{--ak:#3b82f6}.ann-maintenance{--ak:#d4a24c}.ann-event{--ak:#a855f7}.ann-bug{--ak:#e2463a}
.ann-in{position:relative;display:flex;align-items:center;gap:18px;padding:14px 56px 14px 128px;min-height:96px;border-radius:18px;
  background:linear-gradient(100deg,color-mix(in srgb,var(--ak) 22%,#141417),#141417 55%);border:1px solid color-mix(in srgb,var(--ak) 45%,transparent);
  box-shadow:0 14px 40px #0008,inset 0 1px 0 #ffffff0d}
.ann-chibi{position:absolute;left:10px;bottom:-4px;width:112px;height:auto;filter:drop-shadow(0 8px 14px #000a);transform-origin:50% 100%;animation:annBob 3.2s ease-in-out infinite}
.ann-tx{min-width:0}
.ann-h{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.ann-h b{font-size:16px;font-weight:800}
.ann-k{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:7px;background:color-mix(in srgb,var(--ak) 25%,transparent);color:color-mix(in srgb,var(--ak) 60%,#fff);
  font-size:11.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.ann-k .i{width:14px;height:14px}
.ann-k.sm{height:22px;font-size:10.5px;--ak:var(--accent);margin-right:8px}
.ann-tx p{margin-top:5px;color:#d4d4d8;font-size:14px;line-height:1.5}
.ann-tx small{display:block;margin-top:4px;color:var(--dim);font-size:12px;font-weight:600}
.ann-x{position:absolute;top:10px;right:10px;width:34px;height:34px;display:grid;place-items:center;border-radius:10px;color:var(--muted)}
.ann-x:hover{background:#ffffff14;color:#fff}
.ann-demo{animation:none;margin:0}.ann-demo .ann-in{padding-right:18px}
@keyframes annIn{from{opacity:0;transform:translateY(-10px) scale(.98)}}
@keyframes annOut{to{opacity:0;transform:translateY(-8px) scale(.98)}}
@keyframes annBob{0%,100%{transform:rotate(-2deg) translateY(0)}50%{transform:rotate(2deg) translateY(-4px)}}
@media(max-width:640px){.ann-in{padding:12px 46px 12px 92px}.ann-chibi{width:80px}.ann-tx p{font-size:13px}}
@media(prefers-reduced-motion:reduce){.ann,.ann-chibi{animation:none}}

/* ════════════════════════════════════════════════════════════
   Compte en attente / en vérification (chibi)
   ════════════════════════════════════════════════════════════ */
.hold{min-height:calc(100vh - 64px - 140px);display:grid;grid-template-columns:minmax(0,400px) minmax(0,560px);justify-content:center;align-items:center;gap:clamp(20px,5vw,60px);padding-top:30px;padding-bottom:30px}
.hold-art{position:relative}
.hold-art::after{content:"";position:absolute;left:8%;right:6%;bottom:1%;height:9%;border-radius:50%;background:radial-gradient(#000c,transparent 70%);z-index:-1}
.hold-art img{width:100%;height:auto;filter:drop-shadow(0 18px 30px #0009);animation:nfFloat 5s ease-in-out infinite}
.hold-k{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 12px;border-radius:99px;background:#d4a24c1f;border:1px solid #d4a24c55;color:var(--gold);font-weight:800;font-size:12.5px;letter-spacing:.04em;text-transform:uppercase}
.hold-k .i{width:15px;height:15px}
.hold h1{font-size:clamp(26px,3.4vw,40px);font-weight:800;letter-spacing:-.02em;line-height:1.12;margin:14px 0 10px}
.hold p{color:#c8c8cd;font-size:16.5px;line-height:1.6}
.hold-note{display:grid;gap:4px;margin-top:16px;padding:14px 16px;border-radius:14px;background:var(--card);border:1px solid var(--line);border-left:3px solid var(--gold)}
.hold-note b{font-size:12.5px;color:var(--gold);text-transform:uppercase;letter-spacing:.05em}
.hold-id{display:flex;align-items:center;gap:10px;margin-top:16px;color:var(--muted);font-size:14px}
.hold-id .i{color:#8b93ff}
.hold-id code{font-size:12.5px;background:var(--card-2);padding:2px 6px;border-radius:6px}
.hold-a{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
@media(max-width:760px){.hold{grid-template-columns:1fr;text-align:center}.hold-art{max-width:280px;margin:0 auto}.hold-a,.hold-id{justify-content:center}}

/* ════════════════════════════════════════════════════════════
   Panel admin / modo
   ════════════════════════════════════════════════════════════ */
.menu .menu-admin{color:var(--gold)}.menu .menu-admin .i{color:var(--gold)}
.menu .menu-plat{gap:12px}
.menu .menu-plat .plat-logo{width:58px;height:18px;max-width:none;max-height:none;object-fit:contain;object-position:left center}
.adm-h{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;margin-bottom:8px}
.adm-ht{display:flex;align-items:center;gap:14px}
.adm-ht h1{font-size:clamp(24px,3vw,32px);font-weight:800;letter-spacing:-.02em}
.adm-ht p{color:var(--muted);font-weight:600;font-size:14px}
.adm-crown{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:linear-gradient(135deg,#d4a24c,#b4231a);box-shadow:0 10px 30px #b4231a55}
.adm-crown .i{width:26px;height:26px;color:#fff}
.adm-alert{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px;border-radius:12px;background:#d4a24c1c;border:1px solid #d4a24c66;color:var(--gold);font-weight:700}
.adm-alert b{font-size:16px}
.adm-tabs{margin-bottom:22px}
.adm-tabs .i{width:16px;height:16px}
.tabs .n.hot{background:var(--gold);color:#1a1205}
.adm-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin-bottom:22px}
.adm-tile{display:grid;gap:2px;padding:16px 18px;border-radius:16px;background:var(--card);border:1px solid var(--line);transition:.15s}
.adm-tile .i{color:var(--muted);margin-bottom:6px}
.adm-tile b{font-size:26px;font-weight:800;line-height:1}
.adm-tile small{color:var(--muted);font-weight:700;font-size:12.5px}
.adm-tile.ok .i{color:var(--ok)}.adm-tile.warn{border-color:#d4a24c66}.adm-tile.warn .i,.adm-tile.warn b{color:var(--gold)}.adm-tile.bad .i,.adm-tile.bad b{color:#ff7b6e}
a.adm-tile:hover{border-color:var(--line-2);transform:translateY(-2px)}
.adm-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:18px;align-items:start}
.an-cols{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
.adm-code{display:flex;gap:8px;align-items:center;padding:10px 12px;border-radius:12px;background:var(--bg);border:1px dashed var(--line-2);margin-top:8px}
.adm-code code{flex:1;min-width:0;overflow-wrap:anywhere;font-size:13px}
.adm-audit{display:grid}
.adm-audit>div{display:grid;grid-template-columns:90px 110px minmax(0,1fr);gap:10px;padding:9px 0;border-top:1px solid var(--line);font-size:13.5px;align-items:baseline}
.adm-audit>div:first-child{border-top:0}
.adm-audit time{color:var(--dim);font-size:12.5px;font-weight:600}
.adm-audit b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.adm-audit em{font-style:normal;color:var(--accent-2);font-weight:700}
.adm-audit small{color:var(--muted)}
.adm-bar{margin-bottom:14px}
.adm-users{display:grid;gap:8px}
.adm-u{display:grid;grid-template-columns:44px minmax(0,1fr) auto 120px auto;gap:14px;align-items:center;padding:12px 14px;border-radius:14px;background:var(--card);border:1px solid var(--line)}
.adm-u.st-pending{border-color:#d4a24c55;background:linear-gradient(90deg,#d4a24c12,var(--card) 40%)}
.adm-u .av{width:44px;height:44px}
.adm-u-n b{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:15px}
.adm-u-n small{display:flex;align-items:center;gap:5px;flex-wrap:wrap;color:var(--muted);font-size:12.5px;font-weight:600}
.adm-u-n small .i{width:13px;height:13px;color:#8b93ff}
.adm-u-d{color:var(--dim);font-size:12px;font-weight:600;line-height:1.5}
.adm-u-a{display:flex;gap:6px;justify-content:flex-end}
.lnk{color:var(--muted);font-weight:600;font-size:12.5px;text-decoration:underline dotted;text-underline-offset:3px}.lnk:hover{color:#fff}
.rk{display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 7px;border-radius:6px;font-size:10.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;background:var(--card-3);color:var(--muted)}
.rk .i{width:12px;height:12px}
.rk.owner,.rk.admin{background:#d4a24c26;color:var(--gold)}.rk.mod{background:#3b82f626;color:#7fb2ff}
.adm-st{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border-radius:8px;font-size:12.5px;font-weight:800;white-space:nowrap}
.adm-st .i{width:14px;height:14px}
.adm-st.st-active{background:#22c55e1a;color:#4ade80}.adm-st.st-pending,.adm-st.st-review{background:#d4a24c1f;color:var(--gold)}.adm-st.st-suspended{background:#e2463a1f;color:#ff7b6e}
.adm-allow{display:grid;gap:6px}
.adm-al{display:grid;grid-template-columns:20px auto minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:10px 12px;border-radius:12px;background:var(--bg);border:1px solid var(--line);font-size:13.5px}
.adm-al .i{width:16px;height:16px;color:var(--muted)}
.adm-al.owner .i{color:var(--gold)}
.adm-al code{font-size:13px;font-weight:700}
.adm-al span{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.adm-al a{color:var(--accent-2)}
.adm-al small{color:var(--dim);font-size:12px}
.adm-anl{display:grid;gap:8px}
.adm-an{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:10px;align-items:center;padding:12px 14px;border-radius:12px;background:var(--bg);border:1px solid var(--line)}
.adm-an.off{opacity:.55}
.adm-an b{display:block;margin-top:6px;font-size:14.5px}
.adm-an small{color:var(--dim);font-size:12px;font-weight:600}
.adm-an .chip{height:22px;font-size:11px;margin-right:6px}
.an-prev-l{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);margin:8px 0}
#anPrev{margin-bottom:16px}
.adm-mo-h{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.adm-mo-h .av{width:48px;height:48px}
.ck{display:flex;align-items:center;gap:10px;padding:8px 0;font-weight:600;font-size:14px}
.ck input{width:18px;height:18px;accent-color:var(--accent)}
.mu-perms[hidden]{display:none}
@media(max-width:900px){.adm-u{grid-template-columns:44px minmax(0,1fr) auto}.adm-u-d{display:none}.adm-u-a{grid-column:1/-1;justify-content:flex-start}.an-cols{grid-template-columns:1fr}.adm-audit>div{grid-template-columns:70px minmax(0,1fr)}.adm-audit span{grid-column:1/-1}}

/* ════════════════════════════════════════════════════════════
   Logos des plateformes (animés)
   ════════════════════════════════════════════════════════════ */
.plat-logo{display:block;width:auto;height:auto;max-width:72%;max-height:40%;object-fit:contain;transition:transform .35s cubic-bezier(.2,.8,.3,1.3),filter .3s}
.plat-logo.mono{filter:brightness(0) invert(1)}
.plat-logo-atp,.plat-logo-cpd{max-height:34%}
.plat-logo-hbm{max-height:48%}
.plat-logo-dnp{max-height:54%}
.plat{opacity:0;animation:platIn .55s cubic-bezier(.2,.8,.3,1.2) calc(var(--i) * 55ms) forwards}
.plat .plat-logo{position:relative;z-index:1}
.plat:hover .plat-logo,.plat.on .plat-logo{transform:scale(1.1)}
.plat:hover .plat-logo.mono,.plat.on .plat-logo.mono{filter:brightness(0) invert(1) drop-shadow(0 0 10px var(--pc))}
.plat:hover .plat-logo:not(.mono){filter:drop-shadow(0 0 12px color-mix(in srgb,var(--pc) 70%,transparent))}
.plat-shine{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(115deg,transparent 35%,#ffffff2e 50%,transparent 65%);transform:translateX(-120%)}
.plat:hover .plat-shine{transition:transform .7s ease;transform:translateX(120%)}
.plat.on{box-shadow:0 0 0 2px color-mix(in srgb,var(--pc) 70%,transparent),0 14px 36px #000a}
@keyframes platIn{from{opacity:0;transform:translateY(12px) scale(.94)}to{opacity:1;transform:none}}
.cine-pf{display:inline-flex;align-items:center;filter:drop-shadow(0 6px 24px color-mix(in srgb,var(--pc) 45%,transparent))}
.plat-logo.lg{height:clamp(30px,3.4vw,44px);max-width:none;max-height:none}
.sec-plat{display:inline-flex;align-items:center;vertical-align:middle;margin-left:4px}
.plat-logo.sm{height:20px;max-width:none;max-height:none}
.sec-h h2 .sec-plat .plat-logo.sm{height:22px}
.cd-plat .plat-chip{position:relative;height:34px;display:inline-flex;align-items:center;padding:0 12px;border-radius:10px;overflow:hidden;
  background:color-mix(in srgb,var(--pc) 14%,#141417);border:1px solid color-mix(in srgb,var(--pc) 40%,transparent);
  opacity:0;animation:platIn .45s cubic-bezier(.2,.8,.3,1.2) calc(.15s + var(--i) * 70ms) forwards;transition:transform .2s,box-shadow .2s,border-color .2s}
.cd-plat .plat-chip::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,#ffffff30 50%,transparent 65%);transform:translateX(-120%)}
.cd-plat .plat-chip:hover{transform:translateY(-2px);border-color:var(--pc);box-shadow:0 8px 22px color-mix(in srgb,var(--pc) 35%,transparent)}
.cd-plat .plat-chip:hover::after{transition:transform .7s;transform:translateX(120%)}
.plat-logo.chip{height:16px;max-width:96px;max-height:none}
.plat-chip.txt{color:#fff;font-weight:800;font-size:12.5px;opacity:1;animation:none}
@media(prefers-reduced-motion:reduce){.plat,.cd-plat .plat-chip{animation:none;opacity:1}}

/* ════════════════════════════════════════════════════════════
   Casting
   ════════════════════════════════════════════════════════════ */
.cd-cast{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:22px 16px}
.cd-person{margin:0;text-align:center;opacity:0;animation:castIn .5s cubic-bezier(.2,.8,.3,1.1) calc(var(--i,0) * 40ms) forwards}
.cd-person.sk{opacity:1;animation:none}
.cd-person.sk .skel:first-child{aspect-ratio:3/4;border-radius:16px}
.cd-ph{position:relative;aspect-ratio:3/4;border-radius:16px;overflow:hidden;background:linear-gradient(160deg,var(--card-3),var(--card));border:1px solid var(--line);box-shadow:0 12px 30px #0007;
  transition:transform .3s cubic-bezier(.2,.8,.3,1.2),box-shadow .3s,border-color .3s}
.cd-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 20%;z-index:1;transition:transform .5s,filter .3s}
.cd-ph span{position:absolute;inset:0;display:grid;place-items:center;font-size:30px;font-weight:800;color:var(--dim)}
.cd-ph::after{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(to top,#000a,transparent 45%);opacity:.6;transition:opacity .3s}
.cd-person:hover .cd-ph{transform:translateY(-5px);border-color:color-mix(in srgb,var(--accent) 60%,transparent);box-shadow:0 18px 40px #000a,0 0 0 1px var(--accent)}
.cd-person:hover .cd-ph img{transform:scale(1.07)}
.cd-person:hover .cd-ph::after{opacity:.2}
.cd-person figcaption{margin-top:10px}
.cd-person b{display:block;font-size:14.5px;line-height:1.3}
.cd-person small{display:block;margin-top:2px;color:var(--muted);font-size:12.5px;font-weight:600;line-height:1.35}
.cd-crew-h{font-size:17px;font-weight:800;margin:34px 0 14px}
.cd-crew{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.cd-crew>div{display:grid;grid-template-columns:40px minmax(0,1fr);grid-template-rows:auto auto;column-gap:12px;align-items:center;padding:10px;border-radius:12px;background:var(--card);border:1px solid var(--line)}
.cd-crew .av{grid-row:span 2}
.cd-crew b{font-size:14px}.cd-crew small{color:var(--muted);font-size:12.5px;font-weight:600}
@keyframes castIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.cd-person{animation:none;opacity:1}}
@media(max-width:640px){.cd-cast{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 10px}.cd-person b{font-size:13px}}

/* ma liste (films & séries) */
.cd-list .menu{min-width:200px;top:calc(100% + 8px)}
.cd-list .btn.on,.cd-fav.on{border-color:var(--accent);color:var(--accent-2)}
.cd-fav.on .i{fill:currentColor}
.btn.lg.ic{width:50px;padding:0}
.chip.k-tv{border-color:#3b82f655;color:#93c5fd}.chip.k-film{border-color:#22c55e55;color:#86efac}
.stats{grid-template-columns:repeat(auto-fit,minmax(110px,1fr))}

/* ════════════════════════════════════════════════════════════
   Clips
   ════════════════════════════════════════════════════════════ */
.cp-clipb svg{width:22px;height:22px}
.cp.clipping .cp-clipb{background:var(--accent);opacity:1}
.cp-clip{position:absolute;left:14px;right:14px;bottom:76px;z-index:6;padding:14px 16px;border-radius:16px;background:#121215ee;border:1px solid #ffffff1f;backdrop-filter:blur(10px);
  box-shadow:0 20px 50px #000c;animation:up .2s}
.cp-clip[hidden]{display:none}
.cp.clipping .cp-ui{opacity:1!important}
.cc-h{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.cc-h b{display:flex;align-items:center;gap:8px;font-size:15px}
.cc-h b svg,.cc-make svg,.cc-st svg{width:18px;height:18px;fill:currentColor}
.cc-dur{padding:2px 9px;border-radius:7px;background:var(--accent);font-weight:800;font-size:12.5px}
.cc-x{width:32px;height:32px;display:grid;place-items:center;border-radius:9px;color:#d4d4d8}
.cc-x:hover{background:#ffffff1a}.cc-x svg{width:18px;height:18px;fill:currentColor}
.cc-strip{position:relative;height:46px;border-radius:10px;background:repeating-linear-gradient(90deg,#ffffff0d 0 2px,transparent 2px 12px),#000;border:1px solid #ffffff1a;touch-action:none;overflow:hidden}
.cc-sel{position:absolute;top:0;bottom:0;background:color-mix(in srgb,var(--accent) 30%,transparent);border:2px solid var(--accent);border-radius:8px}
.cc-hd{position:absolute;top:-2px;bottom:-2px;width:14px;background:var(--accent);display:grid;place-items:center}
.cc-hd::after{content:"";width:2px;height:16px;border-radius:2px;background:#fff9}
.cc-in{left:-8px;border-radius:8px 0 0 8px}.cc-out{right:-8px;border-radius:0 8px 8px 0}
.cc-head{position:absolute;top:0;bottom:0;width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 6px #fff;pointer-events:none}
.cc-ticks{position:absolute;left:0;right:0;bottom:2px;height:12px;pointer-events:none}
.cc-ticks span{position:absolute;transform:translateX(-50%);font-size:9.5px;font-weight:700;color:#ffffff80}
.cc-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-top:12px}
.cc-row button{height:34px;padding:0 12px;border-radius:9px;background:#ffffff14;font-weight:700;font-size:13px;color:#fff}
.cc-row button:hover{background:#ffffff26}
.cc-t{display:inline-flex;align-items:center;gap:4px}
.cc-t button{width:28px;padding:0}
.cc-t b{min-width:62px;text-align:center;font:700 13px ui-monospace,monospace}
.cc-pv{display:inline-flex;align-items:center;gap:6px}
.cc-pv svg{width:16px;height:16px;fill:currentColor}
.cc-pv.on{background:var(--accent)!important}
.cc-go{flex-wrap:nowrap}
.cc-title{flex:1;min-width:0;height:38px;padding:0 12px;border-radius:10px;background:#000;border:1px solid #ffffff26;color:#fff;font-weight:600;outline:0}
.cc-title:focus{border-color:var(--accent)}
.cc-go .cc-make{height:38px;display:inline-flex;align-items:center;gap:8px;padding:0 16px;background:var(--accent);font-weight:800}
.cc-go .cc-make:hover{background:var(--accent-2)}
.cc-go .cc-make:disabled{opacity:.6}
.cc-st{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:12px;padding:10px 12px;border-radius:10px;background:#ffffff0f;font-weight:700;font-size:13.5px}
.cc-st[hidden]{display:none}
.cc-st.ok{background:#22c55e1f;color:#86efac}.cc-st.err{background:#e2463a1f;color:#ff9b90}
.cc-st a,.cc-st button{padding:4px 10px;border-radius:8px;background:#ffffff1a;color:#fff;font-weight:700;font-size:13px}
.cc-spin{width:16px;height:16px;border-radius:50%;border:2px solid #fff3;border-top-color:#fff;animation:rot .8s linear infinite}
@media(max-width:700px){.cp-clip{left:6px;right:6px;bottom:64px;padding:10px}.cc-row{justify-content:center}.cc-t b{min-width:54px}}

.clgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:22px 16px}
.clc{display:block;min-width:0}
.clc-th{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:var(--card-2);border:1px solid var(--line)}
.clc-th img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.clc:hover .clc-th img{transform:scale(1.05)}
.clc-d{position:absolute;right:8px;bottom:8px;padding:2px 8px;border-radius:7px;background:#000c;font-weight:800;font-size:12px}
.clc.processing .clc-d{background:var(--gold);color:#1a1205}.clc.failed .clc-d{background:#e2463a}
.clc-th i{position:absolute;inset:0;display:grid;place-items:center;background:#0006;opacity:0;transition:opacity .2s}
.clc-th i .i{width:44px;height:44px;padding:12px;border-radius:50%;background:var(--accent);color:#fff}
.clc:hover .clc-th i{opacity:1}
.clc b{display:block;margin-top:10px;font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.clc small{display:flex;align-items:center;gap:6px;margin-top:4px;color:var(--muted);font-size:12.5px;font-weight:600}
.clc small .av{width:20px;height:20px;font-size:10px}
.ph h1 .i{width:30px;height:30px;vertical-align:-4px;color:var(--accent)}
.ph p .i{width:15px;height:15px;vertical-align:-2px}
.clp{max-width:1200px}
.clp-bar{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-top:18px}
.clp-k{display:inline-flex;align-items:center;gap:6px;color:var(--accent-2);font-weight:800;font-size:12.5px;letter-spacing:.05em;text-transform:uppercase}
.clp-k .i{width:15px;height:15px}
.clp-t h1{font-size:clamp(20px,2.4vw,28px);font-weight:800;line-height:1.2;margin:4px 0 8px}
.clp-by{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:14px;font-weight:600}
.clp-by .av{width:26px;height:26px;font-size:12px}
.clp-by a{color:#fff;font-weight:700}
.clp-a{display:flex;flex-wrap:wrap;gap:8px}
.clp-src{display:flex;align-items:center;gap:14px;margin-top:20px;padding:12px;border-radius:14px;background:var(--card);border:1px solid var(--line);max-width:560px;transition:.15s}
.clp-src:hover{border-color:var(--line-2);background:var(--card-2)}
.clp-src img{width:48px;height:68px;border-radius:8px;object-fit:cover}
.clp-src div{flex:1;min-width:0}
.clp-src small{color:var(--dim);font-weight:700;font-size:11.5px;text-transform:uppercase;letter-spacing:.05em}
.clp-src b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.clp-src span{color:var(--muted);font-size:13px}
.clp-src>.i{color:var(--accent)}

/* ════════════════════════════════════════════════════════════
   Apparence & sécurité
   ════════════════════════════════════════════════════════════ */
.ap-prev{display:flex;align-items:center;gap:18px;padding:14px 16px;margin-bottom:16px;border-radius:14px;background:linear-gradient(110deg,#e2463a1c,var(--bg) 60%);border:1px solid var(--line)}
.ap-prev img{width:58px;height:auto;animation:annBob 3s ease-in-out infinite}
.ap-prev b{display:block}.ap-prev small{color:var(--muted);font-size:13.5px}
.box.sec-link{display:flex;align-items:center;gap:14px;transition:.15s}
.box.sec-link:hover{border-color:var(--line-2);background:var(--card-2)}
.box.sec-link>div{flex:1}.box.sec-link b{display:block}.box.sec-link small{color:var(--muted);font-size:13.5px}
.box.sec-link>.i:first-child{width:26px;height:26px;color:var(--accent)}

.sec{max-width:1180px}
.sec-hero{text-align:center;max-width:760px;margin:10px auto 38px}
.sec-badge{display:inline-grid;place-items:center;width:72px;height:72px;border-radius:22px;background:linear-gradient(135deg,var(--accent),#7c1d14);box-shadow:0 18px 50px #e2463a44;animation:secPulse 3.5s ease-in-out infinite}
.sec-badge .i{width:36px;height:36px;color:#fff}
.sec-hero h1{font-size:clamp(28px,4vw,46px);font-weight:900;letter-spacing:-.02em;line-height:1.1;margin:20px 0 12px}
.sec-hero p{color:#c8c8cd;font-size:17px;line-height:1.6}
.sec-pills{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:20px}
.sec-pills span{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 14px;border-radius:99px;background:var(--card);border:1px solid var(--line);font-weight:700;font-size:13.5px}
.sec-pills .i{width:15px;height:15px;color:var(--accent-2)}
.sec-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:16px}
.sec-card{padding:22px;border-radius:20px;background:var(--card);border:1px solid var(--line);opacity:0;animation:castIn .5s cubic-bezier(.2,.8,.3,1.1) calc(var(--i) * 60ms) forwards;transition:border-color .2s,transform .2s}
.sec-card:hover{border-color:color-mix(in srgb,var(--accent) 50%,var(--line));transform:translateY(-2px)}
.sec-ch{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.sec-ch>span{display:grid;place-items:center;width:44px;height:44px;flex:none;border-radius:13px;background:var(--accent-soft);color:var(--accent-2)}
.sec-ch h2{font-size:17px;font-weight:800}
.sec-ch small{color:var(--muted);font-weight:600;font-size:13px}
.sec-card ul{list-style:none;display:grid;gap:10px}
.sec-card li{position:relative;padding-left:20px;color:#d4d4d8;font-size:14px;line-height:1.55}
.sec-card li::before{content:"";position:absolute;left:2px;top:8px;width:7px;height:7px;border-radius:50%;background:var(--accent)}
.sec-not{margin-top:28px;padding:24px;border-radius:20px;background:linear-gradient(110deg,#e2463a14,var(--card) 50%);border:1px solid var(--line);text-align:center}
.sec-not h2{font-size:19px;font-weight:800;margin-bottom:14px}
.sec-not div{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.sec-not span{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 14px;border-radius:99px;background:var(--bg);border:1px solid var(--line);font-weight:700;font-size:13.5px}
.sec-not .i{width:15px;height:15px;color:#ff7b6e}
.sec-foot{text-align:center;color:var(--muted);margin-top:24px}
.sec-foot a{display:inline-flex;align-items:center;gap:4px;color:var(--accent-2);font-weight:700;margin-left:6px}
.sec-foot .i{width:15px;height:15px}
@keyframes secPulse{0%,100%{box-shadow:0 18px 50px #e2463a44}50%{box-shadow:0 18px 70px #e2463a77}}
@media(prefers-reduced-motion:reduce){.sec-card{animation:none;opacity:1}.sec-badge{animation:none}}
#anns:not(:empty)+#app .hero{margin-top:0;border-radius:0}
.plat-logo-cpd{filter:invert(1);border-radius:3px}
.plat:hover .plat-logo-cpd,.plat.on .plat-logo-cpd{filter:invert(1) drop-shadow(0 0 10px #fff6)}

/* ════════════════════════════════════════════════════════════
   Page Status
   ════════════════════════════════════════════════════════════ */
.stp{max-width:980px}
.stp-hero{--sc:var(--ok);display:flex;align-items:center;gap:20px;padding:26px 28px;border-radius:22px;margin-bottom:18px;
  background:linear-gradient(110deg,color-mix(in srgb,var(--sc) 18%,var(--card)),var(--card) 60%);border:1px solid color-mix(in srgb,var(--sc) 40%,var(--line))}
.stp-hero.st-warn,.stp-svc.st-warn{--sc:var(--gold)}.stp-hero.st-down,.stp-svc.st-down{--sc:#ff5a4a}
.stp-hero h1{font-size:clamp(22px,3vw,30px);font-weight:800;letter-spacing:-.01em}
.stp-hero p{color:var(--muted);font-weight:600;font-size:14px;margin-top:2px}
.stp-dot{position:relative;flex:none;width:22px;height:22px}
.stp-dot i,.stp-dot::after{position:absolute;inset:0;border-radius:50%;background:var(--sc)}
.stp-dot::after{content:"";animation:stpPing 2s cubic-bezier(0,0,.2,1) infinite}
@keyframes stpPing{75%,100%{transform:scale(2.2);opacity:0}}
.stp-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:22px}
.stp-kpis div{padding:16px 18px;border-radius:16px;background:var(--card);border:1px solid var(--line)}
.stp-kpis b{display:block;font-size:22px;font-weight:800}
.stp-kpis small{color:var(--muted);font-weight:700;font-size:12.5px}
.stp-list{display:grid;gap:10px}
.stp-svc{--sc:var(--ok);padding:18px 20px;border-radius:18px;background:var(--card);border:1px solid var(--line);opacity:0;animation:castIn .45s ease calc(var(--i) * 40ms) forwards}
.stp-h{display:flex;align-items:center;justify-content:space-between;gap:14px}
.stp-h b{display:block;font-size:15.5px}
.stp-h small{color:var(--muted);font-size:13px;font-weight:600}
.stp-pill{display:inline-flex;align-items:center;gap:6px;flex:none;height:30px;padding:0 12px;border-radius:99px;font-weight:800;font-size:12.5px;
  background:color-mix(in srgb,var(--sc) 16%,transparent);color:color-mix(in srgb,var(--sc) 75%,#fff)}
.stp-pill .i{width:14px;height:14px}
.stp-bars{display:grid;grid-template-columns:repeat(48,minmax(0,1fr));gap:3px;height:32px;margin:14px 0 8px}
.stp-bars i{border-radius:3px;background:var(--ok);opacity:.85;transition:transform .15s,opacity .15s}
.stp-bars i:hover{transform:scaleY(1.15);opacity:1}
.stp-bars .b1{background:var(--gold)}.stp-bars .b2{background:#ff5a4a}.stp-bars .b-1{background:var(--card-3);opacity:.6}
.stp-f{display:flex;justify-content:space-between;gap:10px;color:var(--dim);font-size:12px;font-weight:600}
.stp-f em{font-style:normal;color:var(--gold);display:inline-flex;align-items:center;gap:5px}
.stp-f em .i{width:13px;height:13px}
.stp-note{display:flex;align-items:center;gap:8px;justify-content:center;color:var(--dim);font-size:13px;margin-top:20px}
.stp-note .i{width:15px;height:15px}
@media(max-width:700px){.stp-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.stp-bars{gap:2px}.stp-f em{display:none}}
@media(prefers-reduced-motion:reduce){.stp-svc{animation:none;opacity:1}.stp-dot::after{animation:none}}

/* ════════════════════════════════════════════════════════════
   Badges (sceaux, ema, omamori)
   ════════════════════════════════════════════════════════════ */
.bdg{position:relative;display:inline-grid;place-items:center;width:var(--bs);height:var(--bs);flex:none;outline:0;vertical-align:middle;
  transition:transform .25s cubic-bezier(.2,.8,.3,1.4),filter .25s}
.bdg svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 3px 6px #0009)}
.bdg.t3 svg{filter:drop-shadow(0 3px 6px #0009) drop-shadow(0 0 6px #d9a64055)}
.bdg.t4 svg{filter:drop-shadow(0 3px 6px #0009) drop-shadow(0 0 9px #e2463a77)}
.bdg:hover,.bdg:focus-visible{transform:translateY(-3px) rotate(-4deg) scale(1.06);z-index:5}
.bdg.locked{filter:grayscale(1) brightness(.55);opacity:.55}
.bdg.locked svg{filter:none}
.bdg-sheen{position:absolute;inset:8%;border-radius:22%;overflow:hidden;pointer-events:none;mix-blend-mode:screen}
.bdg-sheen::after{content:"";position:absolute;top:-20%;bottom:-20%;width:40%;left:-60%;background:linear-gradient(100deg,transparent,#fff7 50%,transparent);transform:skewX(-18deg);animation:bdgSheen 3.6s ease-in-out infinite}
@keyframes bdgSheen{0%,60%{left:-60%}100%{left:130%}}
.bdg-tip{position:absolute;left:50%;bottom:calc(100% + 10px);transform:translate(-50%,4px);width:230px;padding:11px 13px;border-radius:12px;background:#141417f5;border:1px solid var(--line-2);
  box-shadow:0 14px 40px #000c;text-align:left;opacity:0;pointer-events:none;transition:.16s;z-index:60}
.bdg:hover .bdg-tip,.bdg:focus-visible .bdg-tip{opacity:1;transform:translate(-50%,0)}
.bdg-tip b{display:block;font-size:14px}
.bdg-tip .bt{display:block;font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;margin:1px 0 6px;color:#ff7b6e}
.bdg-tip .bt.t2{color:#e8a173}.bdg-tip .bt.t3{color:#f0c35a}.bdg-tip .bt.t4{color:#ffb08a}
.bdg-tip span{display:block;color:#d4d4d8;font-size:12.5px;font-weight:600;line-height:1.45}
.bdg-tip em{display:block;margin-top:6px;font-style:normal;color:var(--dim);font-size:11.5px;font-weight:700}
.pf-bdgs{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin:8px 0 2px}
.pf-bdg-more{display:grid;place-items:center;height:30px;padding:0 9px;border-radius:9px;background:var(--card-2);border:1px solid var(--line);font-size:12px;font-weight:800;color:var(--muted)}
.pf-bdg-more:hover{color:#fff}
.bdg-page{display:grid;gap:30px;margin-top:24px}
.bdg-sec-h{display:flex;align-items:baseline;gap:12px;margin-bottom:14px}
.bdg-sec-h h3{font-size:18px;font-weight:800}
.bdg-sec-h small{color:var(--muted);font-weight:600;font-size:13px}
.bdg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}
.bdg-card{display:grid;justify-items:center;text-align:center;gap:4px;padding:18px 14px 16px;border-radius:18px;background:linear-gradient(180deg,var(--card-2),var(--card));border:1px solid var(--line);transition:border-color .2s,transform .2s}
.bdg-card:hover{border-color:var(--line-2);transform:translateY(-2px)}
.bdg-card .bdg{margin-bottom:8px}
.bdg-card b{font-size:14.5px}
.bdg-card small{color:var(--muted);font-size:12.5px;font-weight:600;line-height:1.4}
.bdg-card em{margin-top:4px;font-style:normal;font-size:11.5px;font-weight:800;color:var(--accent-2)}
.bdg-card em.lk{color:var(--dim)}
.bdg-card.off{background:var(--card);border-style:dashed}
.bdg-card.off b{color:var(--muted)}
.bdg-pop{position:fixed;left:50%;bottom:28px;z-index:120;display:flex;align-items:center;gap:18px;padding:16px 22px 16px 18px;border-radius:20px;transform:translateX(-50%);
  background:linear-gradient(110deg,#2a1210f2,#141417f2 60%);border:1px solid #e2463a66;box-shadow:0 24px 60px #000d;max-width:min(460px,calc(100vw - 24px));animation:bdgPopIn .4s ease}
.bdg-pop.out{animation:bdgPopOut .4s ease forwards}
.bdg-pop .bdg{animation:bdgStamp .7s cubic-bezier(.3,1.6,.5,1) .15s both}
.bdg-pop small{display:block;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-2)}
.bdg-pop b{display:block;font-size:19px;font-weight:800;margin:2px 0}
.bdg-pop span{color:#d4d4d8;font-size:13.5px;line-height:1.4}
@keyframes bdgStamp{0%{transform:scale(2.2) rotate(-18deg);opacity:0}55%{transform:scale(.9) rotate(4deg);opacity:1}100%{transform:none}}
@keyframes bdgPopIn{from{opacity:0;transform:translate(-50%,20px)}}
@keyframes bdgPopOut{to{opacity:0;transform:translate(-50%,20px)}}
.mu-bdgs{display:grid;gap:8px}
.mu-bdg{display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:12px;background:var(--bg);border:1px solid var(--line)}
.mu-bdg input{width:18px;height:18px;accent-color:var(--accent);flex:none}
.mu-bdg b{display:block;font-size:14px}.mu-bdg small{color:var(--muted);font-size:12px}
.mu-bdg:has(input:checked){border-color:var(--accent)}
@media(prefers-reduced-motion:reduce){.bdg-sheen::after,.bdg-pop .bdg{animation:none}}

/* ════════════════════════════════════════════════════════════
   Code PIN des profils
   ════════════════════════════════════════════════════════════ */
.av{background-position:center 22%}
.pin{text-align:center;display:grid;justify-items:center;gap:6px}
.pin-av{position:relative;margin-bottom:6px}
.pin-av .av{width:84px;height:84px;border-radius:22px;font-size:34px}
.pin-lock{position:absolute;right:-8px;bottom:-8px;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px #151518}
.pin-lock .i{width:16px;height:16px;color:#fff}
.pin h3{margin:6px 0 0}
.pin p{font-size:14px;margin-bottom:10px}
.pin-boxes{display:flex;gap:10px;margin:6px 0 4px}
.pin-b{width:56px;height:64px;border-radius:14px;background:var(--bg);border:1.5px solid var(--line-2);text-align:center;font:800 28px var(--ui);color:#fff;outline:0;transition:border-color .15s,transform .15s;-webkit-text-security:disc}
.pin-b:focus{border-color:var(--accent);transform:translateY(-2px)}
.pin-err{min-height:20px;margin:4px 0 6px}
.pin.shake .pin-boxes{animation:pinShake .4s}
@keyframes pinShake{20%,60%{transform:translateX(-8px)}40%,80%{transform:translateX(8px)}}
.pp-c{position:relative}
.pp-lock{position:absolute;top:6px;right:6px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#000b;border:1px solid #ffffff2a}
.pp-lock .i{width:14px;height:14px}
.pe-pin>span{display:flex;align-items:center;gap:6px}
.pe-pin>span .i{width:15px;height:15px}
.pe-pin-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.pe-pin-in{width:140px;letter-spacing:.4em;text-align:center;font-weight:800}

/* ════════════════════════════════════════════════════════════
   Choix d'avatar (personnages)
   ════════════════════════════════════════════════════════════ */
.mo-b.avp-mo{width:min(920px,100%);max-height:92vh;padding:0;display:flex;flex-direction:column;overflow:hidden}
.avp{display:flex;flex-direction:column;min-height:0;height:min(86vh,820px)}
.avp-h{display:flex;align-items:center;gap:18px;padding:22px 24px 16px;background:linear-gradient(110deg,#e2463a24,transparent 60%)}
.avp-cur{display:grid;place-items:center;flex:none;width:76px;height:76px;border-radius:20px;overflow:hidden;background:var(--card-2);border:2px solid var(--accent);box-shadow:0 10px 30px #000a}
.avp-cur img{width:100%;height:100%;object-fit:cover;object-position:center 22%}
.avp-cur .i{width:32px;height:32px;color:var(--dim)}
.avp-h h3{margin:0 0 4px;font-size:22px}
.avp-h p{color:var(--muted);font-size:13.5px}
.avp-x{margin-left:auto;align-self:flex-start}
.avp-tools{display:flex;gap:10px;padding:0 24px}
.avp-s{flex:1;display:flex;align-items:center;gap:10px;height:44px;padding:0 14px;border-radius:12px;background:var(--bg);border:1px solid var(--line-2)}
.avp-s .i{color:var(--muted)}
.avp-s input{flex:1;min-width:0;background:none;border:0;outline:0;font-weight:600}
.avp-k{margin:12px 24px 6px;align-self:flex-start}
.avp-body{flex:1;overflow-y:auto;padding:6px 24px 18px;overscroll-behavior:contain}
.avp-g{margin-top:16px}
.avp-gh{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.avp-gh b{font-size:13px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#e4e4e7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.avp-gh small{margin-left:auto;color:var(--dim);font-weight:700;font-size:12px}
.avp-tag{flex:none;padding:1px 7px;border-radius:6px;font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;background:var(--accent-soft);color:var(--accent-2)}
.avp-tag.tv{background:#3b82f622;color:#93c5fd}.avp-tag.movie{background:#22c55e22;color:#86efac}
.avp-row{display:grid;grid-auto-flow:column;grid-auto-columns:84px;gap:10px;overflow-x:auto;padding:4px 2px 10px;scrollbar-width:thin}
.avp-i{position:relative;width:84px;height:84px;border-radius:18px;overflow:hidden;background:var(--card-2);border:2px solid transparent;box-shadow:0 6px 16px #0008;transition:transform .18s,border-color .18s}
.avp-i img{width:100%;height:100%;object-fit:cover;object-position:center 22%}
.avp-i span{position:absolute;left:0;right:0;bottom:0;padding:14px 5px 4px;background:linear-gradient(transparent,#000d);font-size:10px;font-weight:700;line-height:1.2;color:#fff;text-align:center;opacity:0;transition:opacity .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.avp-i:hover{transform:scale(1.07);z-index:1}
.avp-i:hover span{opacity:1}
.avp-i.on{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft),0 6px 16px #0008}
.avp-i.on::after{content:"";position:absolute;top:5px;right:5px;width:18px;height:18px;border-radius:50%;background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/11px no-repeat}
.avp-f{display:flex;align-items:center;gap:10px;padding:14px 24px;border-top:1px solid var(--line);background:#121215}
.avp-f span{margin-right:auto;color:var(--dim);font-size:13px;font-weight:700}
@media(max-width:640px){.avp-h{padding:16px}.avp-tools,.avp-k{margin-left:16px;margin-right:16px;padding:0}.avp-body{padding:4px 16px 14px}.avp-row{grid-auto-columns:72px}.avp-i{width:72px;height:72px}.avp-h p{display:none}}

/* ════════════════════════════════════════════════════════════
   Sélecteur de thème (panel admin)
   ════════════════════════════════════════════════════════════ */
.th-pick{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.th-card{position:relative;display:grid;gap:3px;text-align:left;padding:12px;border-radius:16px;background:var(--bg);border:1.5px solid var(--line);transition:.18s}
.th-card:hover{border-color:var(--line-2);transform:translateY(-2px)}
.th-card.on{border-color:var(--accent)}
.th-card b{font-size:14.5px;margin-top:8px}.th-card small{color:var(--muted);font-size:12.5px}
.th-card em{position:absolute;top:10px;right:10px;display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:99px;background:var(--accent);color:#fff;font-style:normal;font-size:11px;font-weight:800}
.th-card em .i{width:12px;height:12px}
.th-prev{position:relative;display:block;height:74px;border-radius:10px;overflow:hidden}
.th-prev i{position:absolute}
.th-autumn .th-prev{background:radial-gradient(120% 90% at 20% 0,#c2410c55,transparent 60%),#121014}
.th-autumn .th-prev i{width:16px;height:16px;background:#e2652a;-webkit-mask:var(--maple) center/contain no-repeat;mask:var(--maple) center/contain no-repeat}
.th-autumn .th-prev i:nth-child(1){left:18%;top:20%;transform:rotate(20deg)}.th-autumn .th-prev i:nth-child(2){left:58%;top:48%;background:#d99a2b;transform:rotate(-30deg)}.th-autumn .th-prev i:nth-child(3){left:80%;top:14%;background:#b42318}
.th-cyberpunk .th-prev{background:linear-gradient(transparent 49%,#00f0ff22 50%,transparent 51%) 0 0/100% 8px,linear-gradient(135deg,#0a0b10,#14102a);border:1px solid #fcee0a55}
.th-cyberpunk .th-prev i:nth-child(1){left:10%;right:30%;top:22%;height:10px;background:#fcee0a;clip-path:polygon(0 0,100% 0,96% 100%,0 100%)}
.th-cyberpunk .th-prev i:nth-child(2){left:10%;width:40%;top:46%;height:4px;background:#00f0ff;box-shadow:0 0 10px #00f0ff}
.th-cyberpunk .th-prev i:nth-child(3){right:10%;width:22%;bottom:14%;height:14px;background:#ff003c;clip-path:polygon(8px 0,100% 0,100% 100%,0 100%,0 8px)}
.th-classic .th-prev{background:#141417}
.th-classic .th-prev i:nth-child(1){left:10%;right:40%;top:24%;height:8px;border-radius:4px;background:#e2463a}
.th-classic .th-prev i:nth-child(2){left:10%;right:20%;top:46%;height:6px;border-radius:3px;background:#2a2a31}
.th-classic .th-prev i:nth-child(3){left:10%;right:50%;top:62%;height:6px;border-radius:3px;background:#2a2a31}

/* ════════════════════════════════════════════════════════════
   Thème Cyberpunk · Edgerunners
   jaune néon, cyan, rouge ; coins coupés, balayage, glitchs
   ════════════════════════════════════════════════════════════ */
html[data-theme="cyberpunk"]{
  --bg:#06070b; --bg-2:#0a0c12; --card:#0d1017; --card-2:#121621; --card-3:#191e2c; --line:#1b2233; --line-2:#28324a;
  --text:#eef3ff; --muted:#93a0bf; --dim:#5f6b88;
  --accent:#fcee0a; --accent-2:#fff35c; --accent-soft:#fcee0a1f; --gold:#fcee0a; --ok:#00f0a0;
  --cy:#00f0ff; --cr:#ff003c; --cp:#ff2a6d;
  --ui:"Rajdhani","Chakra Petch","Plus Jakarta Sans",system-ui,sans-serif;
  --cut:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));
  --cut-sm:polygon(0 0,calc(100% - 6px) 0,100% 6px,100% 100%,6px 100%,0 calc(100% - 6px));
  --st-watching:#00f0ff; --st-completed:#00f0a0; --st-paused:#fcee0a; --st-dropped:#ff003c;
}
html[data-theme="cyberpunk"] body{background:
  linear-gradient(#00f0ff08 1px,transparent 1px) 0 0/100% 46px,
  linear-gradient(90deg,#00f0ff06 1px,transparent 1px) 0 0/46px 100%,
  radial-gradient(1100px 560px at 85% -10%,#ff003c1a,transparent 70%),
  radial-gradient(900px 500px at 5% 0,#00f0ff14,transparent 70%),var(--bg);background-attachment:fixed;font-weight:600;letter-spacing:.01em}
html[data-theme="cyberpunk"] ::selection{background:var(--cy);color:#000}
html[data-theme="cyberpunk"] [data-zone="cine"],html[data-theme="cyberpunk"][data-zone="cine"]{--accent:#00f0ff;--accent-2:#7ff8ff;--accent-soft:#00f0ff1f}

/* titres : majuscules, crochet néon */
html[data-theme="cyberpunk"] :is(h1,h2,.sec-h h2,.cd-title,.hero h1){font-family:"Chakra Petch","Rajdhani",var(--ui);text-transform:uppercase;letter-spacing:.03em}
html[data-theme="cyberpunk"] .sec-h h2{display:flex;align-items:center;gap:10px}
html[data-theme="cyberpunk"] .sec-h h2::before{content:"";width:8px;height:22px;background:var(--accent);clip-path:polygon(0 0,100% 20%,100% 100%,0 80%);box-shadow:0 0 12px var(--accent)}
html[data-theme="cyberpunk"] .hero h1,html[data-theme="cyberpunk"] .cd-title{text-shadow:2px 0 var(--cr),-2px 0 var(--cy),0 4px 30px #000}

/* en-tête : ligne néon */
html[data-theme="cyberpunk"] .hd{background:linear-gradient(#06070bf5,#06070be6);border-bottom:1px solid #fcee0a55;box-shadow:0 1px 0 #fcee0a22,0 10px 30px -20px #fcee0a66}
html[data-theme="cyberpunk"] .nav>a,html[data-theme="cyberpunk"] .nav>.dd>button{text-transform:uppercase;letter-spacing:.06em;font-size:14px;border-radius:0;clip-path:var(--cut-sm)}
html[data-theme="cyberpunk"] .nav>a.on,html[data-theme="cyberpunk"] .nav>a:hover,html[data-theme="cyberpunk"] .nav>.dd>button:hover{background:#fcee0a14;color:var(--accent)}
html[data-theme="cyberpunk"] .hanko{background:var(--accent);color:#000;border-radius:0;clip-path:var(--cut-sm);box-shadow:none;transform:none}
html[data-theme="cyberpunk"] .logo .t{font-family:"Chakra Petch",var(--ui);text-transform:uppercase;letter-spacing:.06em}
html[data-theme="cyberpunk"] .logo i{color:var(--cy)}
html[data-theme="cyberpunk"] .logo:hover .t{animation:cyGlitchTxt .5s steps(2) 2}
@keyframes cyGlitchTxt{0%{text-shadow:2px 0 var(--cr),-2px 0 var(--cy);transform:translateX(0)}25%{transform:translateX(-2px)}50%{text-shadow:-3px 0 var(--cr),3px 0 var(--cy);transform:translateX(2px)}100%{text-shadow:none;transform:none}}

/* boutons jaunes à coins coupés, texte noir */
html[data-theme="cyberpunk"] .btn{border-radius:0;clip-path:var(--cut-sm);color:#000;text-transform:uppercase;letter-spacing:.06em;font-weight:700}
html[data-theme="cyberpunk"] .btn:hover{background:var(--accent-2);box-shadow:0 0 24px #fcee0a55}
html[data-theme="cyberpunk"] .btn.ghost{background:#0d1017;border:1px solid #28324a;color:var(--text);box-shadow:inset 0 0 0 1px #fcee0a14}
html[data-theme="cyberpunk"] .btn.ghost:hover{border-color:var(--cy);color:var(--cy);box-shadow:inset 0 0 12px #00f0ff22}
html[data-theme="cyberpunk"] .btn.danger{background:transparent;border:1px solid var(--cr);color:var(--cr)}
html[data-theme="cyberpunk"] .btn-discord{background:#5865f2;color:#fff}

/* cartes, boîtes, tuiles : coins coupés */
html[data-theme="cyberpunk"] :is(.box,.stat,.adm-tile,.sec-card,.stp-svc,.bdg-card,.ann-in,.au-box,.mo-b,.menu,.so-box,.cd-facts,.adm-u,.clp-src,.plat,.player,.cp-clip){border-radius:0;clip-path:var(--cut)}
html[data-theme="cyberpunk"] :is(.box,.stat,.adm-tile,.sec-card,.stp-svc,.bdg-card,.adm-u){background:linear-gradient(160deg,#121621,#0b0e14);border-color:#202a40}
html[data-theme="cyberpunk"] .box>h3{text-transform:uppercase;letter-spacing:.05em;color:var(--accent)}
html[data-theme="cyberpunk"] .poster,html[data-theme="cyberpunk"] .card .poster img{border-radius:0;clip-path:var(--cut)}
html[data-theme="cyberpunk"] .card:hover .poster{box-shadow:0 0 0 1px var(--cy),0 0 24px #00f0ff44}
html[data-theme="cyberpunk"] .chip,html[data-theme="cyberpunk"] .seg,html[data-theme="cyberpunk"] .seg button,html[data-theme="cyberpunk"] .inp,html[data-theme="cyberpunk"] .ib,html[data-theme="cyberpunk"] .av{border-radius:0}
html[data-theme="cyberpunk"] .av{clip-path:var(--cut-sm)}
html[data-theme="cyberpunk"] .inp:focus{border-color:var(--cy);box-shadow:0 0 0 1px var(--cy),0 0 18px #00f0ff33}
html[data-theme="cyberpunk"] .tabs .on{border-color:var(--accent);color:var(--accent)}
html[data-theme="cyberpunk"] .badge{background:var(--cr);color:#fff}
html[data-theme="cyberpunk"] .tog input:checked+i{background:var(--cy)}
html[data-theme="cyberpunk"] .ft{border-top:1px solid #fcee0a33;background:linear-gradient(transparent,#fcee0a08)}
html[data-theme="cyberpunk"] .cp-prog{background:var(--accent)}
html[data-theme="cyberpunk"] .cp-mark{color:var(--accent)}

/* calques d'ambiance : balayage, grille qui défile, bandes de glitch */
.cyber{position:fixed;inset:0;z-index:30;pointer-events:none;overflow:hidden;contain:strict}
.cyber .cy-scan{position:absolute;inset:0;background:repeating-linear-gradient(transparent 0 2px,#00000026 2px 3px);opacity:.45}
.cyber .cy-grid{position:absolute;left:0;right:0;bottom:-50vh;height:100vh;background:linear-gradient(#ff003c00,#ff003c10),linear-gradient(90deg,#00f0ff0d 1px,transparent 1px) 0 0/60px 60px,linear-gradient(#00f0ff0d 1px,transparent 1px) 0 0/60px 60px;
  transform:perspective(500px) rotateX(62deg);transform-origin:50% 0;opacity:.5;animation:cyGrid 6s linear infinite;will-change:background-position}
@keyframes cyGrid{to{background-position:0 0,0 60px,0 60px}}
.cyber .cy-gl{position:absolute;left:0;right:0;top:var(--t);height:var(--h);background:linear-gradient(90deg,transparent,var(--c) 20%,transparent 40%,var(--c) 70%,transparent);mix-blend-mode:screen;opacity:0;
  animation:cyGl var(--d) steps(1) var(--dl) infinite;will-change:transform,opacity}
@keyframes cyGl{0%,93%,100%{opacity:0;transform:translateX(0)}94%{opacity:.55;transform:translateX(-30px)}95%{opacity:.2;transform:translateX(40px)}96%{opacity:.6;transform:translateX(-8px) scaleY(2)}97%{opacity:0}}
.cyber.paused *{animation-play-state:paused}
html[data-page^="watch"] .cyber,html[data-page="clip"] .cyber{display:none}
.cy-burst{position:fixed;z-index:95;width:0;height:0;pointer-events:none}
.cy-burst i{position:absolute;left:-3px;top:-3px;width:6px;height:6px;background:var(--c);box-shadow:0 0 8px var(--c);animation:cyPop .7s cubic-bezier(.2,.7,.3,1) forwards}
@keyframes cyPop{0%{transform:translate(0,0) scale(1.4);opacity:1}100%{transform:translate(var(--tx),var(--ty)) scale(.4);opacity:0}}
@media(prefers-reduced-motion:reduce){.cyber,.cy-burst{display:none}}

/* curseur néon du thème */
html[data-theme="cyberpunk"]{
  --cur:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M5 3 L5 25 L11 19 L15 28 L19 26 L15 17 L24 17 Z' fill='%2300f0ff' transform='translate(2 1)'/%3E%3Cpath d='M5 3 L5 25 L11 19 L15 28 L19 26 L15 17 L24 17 Z' fill='%23fcee0a' stroke='%23000' stroke-width='1.5' stroke-linejoin='miter'/%3E%3C/svg%3E") 5 3,auto;
  --cur-p:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M5 3 L5 25 L11 19 L15 28 L19 26 L15 17 L24 17 Z' fill='%23ff003c' transform='translate(2 1)'/%3E%3Cpath d='M5 3 L5 25 L11 19 L15 28 L19 26 L15 17 L24 17 Z' fill='%2300f0ff' stroke='%23000' stroke-width='1.5' stroke-linejoin='miter'/%3E%3C/svg%3E") 5 3,pointer}

/* ════════════════════════════════════════════════════════════
   Tableau de bord TheScent (façon MEE6)
   ════════════════════════════════════════════════════════════ */
.ts{display:grid;grid-template-columns:290px minmax(0,1fr);min-height:calc(100vh - 64px)}
.ts-side{position:sticky;top:64px;align-self:start;height:calc(100vh - 64px);overflow-y:auto;padding:18px 14px 30px;background:#0f0f12;border-right:1px solid var(--line)}
.ts-brand{display:flex;align-items:center;gap:12px;padding:4px 8px 16px}
.ts-bot{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;overflow:hidden;background:#5865f2;flex:none}
.ts-bot img{width:100%;height:100%;object-fit:cover}.ts-bot .i{color:#fff}
.ts-brand b{display:block;font-size:17px;font-weight:800}.ts-brand small{color:var(--accent-2);font-weight:800;font-size:12px;letter-spacing:.05em}
.ts-guild{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;background:var(--card);border:1px solid var(--line);margin-bottom:16px}
.ts-guild img,.ts-guild>span{width:40px;height:40px;border-radius:50%;flex:none;object-fit:cover;display:grid;place-items:center;background:var(--card-3)}
.ts-guild b{display:block;font-size:14px;line-height:1.25}.ts-guild small{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:12px;font-weight:600;margin-top:2px}
.ts-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--dim);flex:none}.ts-dot.on{background:var(--ok);box-shadow:0 0 8px var(--ok)}.ts-dot.off{background:#52525b}
.ts-nav h4{margin:18px 10px 6px;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.ts-nav a{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:10px;font-weight:700;font-size:14px;color:#c9c9cf}
.ts-nav a span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ts-nav a .i{color:var(--muted);width:18px;height:18px}
.ts-nav a:hover{background:var(--card);color:#fff}
.ts-nav a.on{background:var(--accent-soft);color:#fff}.ts-nav a.on .i{color:var(--accent)}
.ts-nav .ts-lk{width:14px!important;height:14px!important;color:var(--dim)}
.ts-main{padding:28px clamp(16px,3vw,40px) 80px;min-width:0;max-width:1100px}
.ts-h{display:flex;align-items:center;gap:16px;margin-bottom:20px}
.ts-hi{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:var(--accent-soft);flex:none}
.ts-hi .i{width:26px;height:26px;color:var(--accent)}
.ts-h h1{font-size:clamp(22px,2.6vw,28px);font-weight:800}.ts-h p{color:var(--muted);font-size:14px;max-width:620px}
.ts-h .ts-big{margin-left:auto;transform:scale(1.25);transform-origin:right center}
.ts-lock,.ts-warn{display:flex;gap:10px;align-items:center;padding:12px 14px;border-radius:12px;background:#d4a24c14;border:1px solid #d4a24c44;color:var(--gold);font-weight:700;font-size:14px;margin-bottom:16px}
.ts-warn b{display:block;color:#fff}.ts-warn span{display:block;color:var(--muted);font-weight:600}
.ts-form .box,.ts-act{margin-bottom:14px}
.ts-form[inert]{opacity:.65}
.ts-save{position:sticky;bottom:16px;z-index:5;display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;background:#1a1a1f;border:1px solid var(--line-2);box-shadow:0 18px 40px #000c;animation:up .2s}
.ts-save span{display:flex;align-items:center;gap:8px;margin-right:auto;font-weight:700;color:var(--gold)}
.ts-save[hidden]{display:none}
.ts-sel{width:100%}
.ts-vars{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.ts-vars .chip{height:26px;font-size:12px;font-family:ui-monospace,monospace}
.ts-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:8px;border-radius:12px;background:var(--bg);border:1px solid var(--line);min-height:46px}
.ts-chip{--rc:#99aab5;display:inline-flex;align-items:center;gap:4px;height:28px;padding:0 4px 0 10px;border-radius:8px;background:color-mix(in srgb,var(--rc) 18%,var(--card-2));border:1px solid color-mix(in srgb,var(--rc) 40%,transparent);font-weight:700;font-size:13px}
.ts-chip button{display:grid;place-items:center;width:20px;height:20px;border-radius:6px;color:var(--muted)}.ts-chip button:hover{background:#ffffff1a;color:#fff}
.ts-chip button .i{width:12px;height:12px}
.ts-add{width:auto;height:30px;padding:0 8px;border:0;background:transparent;color:var(--muted);font-size:13px}
.ts-rws{display:grid;gap:8px;margin-bottom:10px}
.ts-rw{display:grid;grid-template-columns:auto 90px auto minmax(0,1fr) auto;gap:10px;align-items:center}
.ts-rw span{color:var(--muted);font-weight:700;font-size:13px}
.ts-mods{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin-bottom:18px}
.ts-mod{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto auto;column-gap:10px;align-items:center;padding:14px;border-radius:14px;background:var(--card);border:1px solid var(--line);transition:.15s}
.ts-mod:hover{border-color:var(--line-2);transform:translateY(-2px)}
.ts-mod .i{grid-row:span 2;color:var(--accent)}.ts-mod b{font-size:14px}.ts-mod small{grid-column:2;color:var(--muted);font-size:12px;font-weight:700}
.ts-st.pending{color:var(--gold)}.ts-st.done{color:var(--ok)}.ts-st.error{color:#ff7b6e}
.ts-tiers{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-bottom:18px}
.ts-tiers>div{display:grid;justify-items:center;gap:2px;padding:12px 6px;border-radius:14px;background:var(--card);border:1px solid var(--line);text-align:center}
.ts-tiers img{filter:drop-shadow(0 4px 8px #0008)}.ts-tiers b{font-size:13px;margin-top:4px}.ts-tiers small{color:var(--dim);font-size:11.5px;font-weight:700}
.ts-lb{display:grid;gap:6px}
.ts-lbr{display:grid;grid-template-columns:40px 44px minmax(0,1fr) 180px 40px 56px;gap:14px;align-items:center;padding:10px 14px;border-radius:14px;background:var(--card);border:1px solid var(--line);text-align:left;transition:.15s}
.ts-lbr:hover{border-color:var(--line-2);background:var(--card-2)}
.ts-pos{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--card-3);font-weight:800}
.ts-pos.p1{background:linear-gradient(135deg,#f5c84c,#a8741a);color:#1a1205}.ts-pos.p2{background:linear-gradient(135deg,#e2e8f0,#7c8597);color:#111}.ts-pos.p3{background:linear-gradient(135deg,#e8a173,#8f4a22);color:#1a0d05}
.ts-av{width:44px;height:44px;border-radius:50%;object-fit:cover;background:var(--card-3)}
.ts-lbn b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ts-lbn small{color:var(--muted);font-size:12.5px;font-weight:600}
.ts-lbx{height:10px;border-radius:5px;background:var(--card-3);overflow:hidden}.ts-lbx i{display:block;height:100%;border-radius:5px}
.ts-lv{text-align:right;font-size:22px;font-weight:800}.ts-lv small{display:block;font-size:10px;color:var(--dim);letter-spacing:.08em}
.ts-cardp{text-align:center}.ts-cardp img{width:100%;border-radius:16px;margin-bottom:10px}
.mo-b.ts-cardmo{width:min(960px,100%)}
.ts-seals{display:flex;gap:14px;margin-bottom:16px}.ts-seals>div{display:grid;justify-items:center;gap:4px}.ts-seals small{color:var(--muted);font-weight:700;font-size:12px}
.ts-rrl{display:grid;gap:8px}.ts-rrl>div{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;background:var(--bg);border:1px solid var(--line)}
.ts-emo{font-size:20px}.ts-rrl small{margin-left:auto;color:var(--muted)}
.ts-perm{width:100%;border-collapse:collapse}.ts-perm th,.ts-perm td{padding:12px 10px;border-bottom:1px solid var(--line);text-align:left}
.ts-perm th{font-size:12px;color:var(--dim);text-transform:uppercase;letter-spacing:.06em}.ts-perm td:not(:first-child),.ts-perm th:not(:first-child){text-align:center;width:110px}
.ts-perm td .i{color:var(--ok)}.ts-perm .tog{display:inline-block}
@media(max-width:980px){.ts{grid-template-columns:1fr}.ts-side{position:static;height:auto;border-right:0;border-bottom:1px solid var(--line)}.ts-nav{display:flex;flex-wrap:wrap;gap:4px}.ts-nav h4{width:100%}
  .ts-lbr{grid-template-columns:32px 40px minmax(0,1fr) 40px 48px}.ts-lbx{display:none}.ts-tiers{grid-template-columns:repeat(3,minmax(0,1fr))}}
