/* Animeista admin panel.
   Tokens and component rules are copied from the public site's css/styles.css
   (same names, same values) so the panel reads as the same product. It is
   standalone on purpose: the site stylesheet styles bare `header`, `section`
   and `a`, which would fight the panel layout. */

:root{
  --white:#221D17;
  --paper:#161210;
  --navy:#F3EDE3;
  --navy-soft:#A99E8E;
  --blue:#5FB0DE;
  --blue-dark:#7FC4E8;
  --teal:#31D6A8;
  --teal-dark:#5CE0BC;
  --mint-tint:#16241D;
  --blue-tint:#1C1712;
  --border-soft:rgba(243,237,227,.12);
  --prose-text:#D8CFC0;
  --ring-1:rgba(95,176,222,.16);
  --ring-2:rgba(49,214,168,.20);
  --danger:#F0836F;
  --danger-tint:#2B1814;
}
[data-theme="light"]{
  --white:#FFFFFF;
  --paper:#F6F8FA;
  --navy:#0E1B2E;
  --navy-soft:#5B6472;
  --blue:#1483E0;
  --blue-dark:#0E63AE;
  --teal:#3AD6B7;
  --teal-dark:#25AE93;
  --mint-tint:#E9FBF5;
  --blue-tint:#EAF4FF;
  --border-soft:#E7E9EE;
  --prose-text:#2C3646;
  --ring-1:#DCEBFB;
  --ring-2:#D5F5EC;
  --danger:#B3321E;
  --danger-tint:#FDECE8;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{-webkit-text-size-adjust:100%;}
body.admin-page{
  background:var(--white); color:var(--navy);
  font-family:'Inter',sans-serif; -webkit-font-smoothing:antialiased;
  overflow-x:hidden; min-height:100vh; display:flex; flex-direction:column;
  transition:background-color .25s ease, color .25s ease;
}
body.admin-page > main{flex:1 0 auto;}
::selection{background:var(--teal); color:var(--navy);}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
h1,h2,h3{font-family:'Sora',sans-serif; font-weight:700; line-height:1.06; letter-spacing:-0.5px; color:var(--navy);}
:focus-visible{outline:2px solid var(--blue); outline-offset:2px;}
.wrap{max-width:1180px; margin:0 auto; padding:0 28px; position:relative;}
.mono{font-family:'JetBrains Mono',monospace; font-size:12.5px;}
.muted{color:var(--navy-soft);}

.eyebrow{
  font-family:'JetBrains Mono',monospace; font-size:12px; font-weight:600;
  letter-spacing:2.5px; text-transform:uppercase; color:var(--blue-dark);
  display:inline-flex; align-items:center; gap:8px;
}
.accent{color:var(--blue);}

/* ---------- header (same bar as the home page) ---------- */
.site-header{position:sticky; top:0; z-index:60; background:var(--white); border-bottom:1px solid var(--border-soft);}
.nav{display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:80px;}
.logo{display:flex; align-items:center; gap:10px; font-family:'Sora',sans-serif; font-weight:700; font-size:19px; white-space:nowrap;}
.logo img{width:32px; height:32px;}
.logo-tag{
  font-family:'JetBrains Mono',monospace; font-size:10.5px; font-weight:600; letter-spacing:1.5px;
  padding:3px 8px; border-radius:6px; background:#0E1B2E; color:var(--teal);
}
nav.links{display:flex; gap:32px; font-size:14.5px; font-weight:600; color:var(--navy-soft); margin-inline-end:auto; margin-inline-start:24px;}
nav.links a{padding:6px 0; border-bottom:2px solid transparent;}
nav.links a:hover{color:var(--navy);}
nav.links a.active{color:var(--navy); border-bottom-color:var(--teal);}
.nav-right{display:flex; align-items:center; gap:14px;}
.nav-right form{display:flex;}

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px; font-weight:700; font-size:14.5px;
  font-family:'Inter',sans-serif; padding:13px 24px; border-radius:10px; cursor:pointer; border:2px solid var(--navy);
  background:transparent; color:var(--navy);
  transition:background .15s ease, color .15s ease, transform .15s ease;
}
.btn-solid{background:var(--blue); color:#FFFFFF; border-color:var(--blue);}
.btn-solid:hover{background:var(--blue-dark); border-color:var(--blue-dark);}
.btn-sm{padding:11px 20px; font-size:13.5px;}
.btn-block{width:100%;}

.theme-toggle{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:50%; flex-shrink:0;
  border:2px solid var(--navy); background:transparent; color:var(--navy);
  cursor:pointer; padding:0;
  transition:background .18s ease, color .18s ease, transform .15s ease;
}
.theme-toggle:hover{transform:translateY(-1px); background:var(--navy); color:var(--white);}
.theme-toggle svg{width:18px; height:18px;}
.theme-toggle .icon-moon{display:none;}
[data-theme="light"] .theme-toggle .icon-sun{display:none;}
[data-theme="light"] .theme-toggle .icon-moon{display:block;}

.user-chip{display:inline-flex; align-items:center; gap:10px; font-size:14px; font-weight:600; max-width:200px;}
.user-chip-name{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

/* ---------- avatars (initial underneath, picture on top) ---------- */
.avatar{
  position:relative; display:block; border-radius:50%; overflow:hidden; flex-shrink:0;
  background:linear-gradient(135deg,var(--teal),var(--blue));
}
.avatar-sm{width:32px; height:32px;}
.avatar-lg{width:100%; height:100%;}
.avatar img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.avatar img.is-broken,.thumb img.is-broken,.thumb-preview img.is-broken{display:none;}
.avatar-fallback{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-family:'Sora',sans-serif; font-weight:800; font-size:13px; color:rgba(255,255,255,.92);
}
.avatar-lg .avatar-fallback{font-size:20px;}

/* ---------- decor ---------- */
.ring{position:absolute; border-radius:50%; border:2px solid; pointer-events:none;}
.ring.r1{width:520px; height:520px; top:-220px; right:-160px; border-color:var(--ring-1);}
.ring.r2{width:360px; height:360px; top:-100px; right:-40px; border-color:var(--ring-2);}
.disc{position:absolute; border-radius:50%; pointer-events:none;}

/* ---------- page hero ---------- */
.page-hero{position:relative; padding:72px 0 80px; overflow:hidden;}
.page-hero .wrap{z-index:1;}
.page-hero h1{font-size:clamp(38px,5.4vw,64px); margin:20px 0 18px;}
.page-hero .lede{font-size:17px; line-height:1.6; color:var(--navy-soft); max-width:460px;}
.page-hero-compact{padding:56px 0 56px;}
.page-hero-compact h1{font-size:clamp(34px,4.6vw,52px);}

/* ---------- bands (same tinted sections as the home page) ---------- */
.band{position:relative; padding:80px 0;}
.band-mint{background:var(--mint-tint);}
.band-paper{background:var(--paper);}
.sec-head{max-width:620px; margin-bottom:40px;}
.sec-head h2{font-size:clamp(28px,3.6vw,40px); margin-top:14px;}

/* ---------- stat cards (same outlined cards as the feature grid) ---------- */
.stat-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.stat-card{
  background:var(--white); border:2px solid var(--navy); border-radius:16px;
  padding:26px 22px; display:flex; flex-direction:column; gap:6px;
}
.stat-mark{width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; margin-bottom:12px;}
.stat-mark svg{width:22px; height:22px; stroke:#FFFFFF;}
.stat-card:nth-child(4n+1) .stat-mark{background:var(--blue);}
.stat-card:nth-child(4n+2) .stat-mark{background:var(--teal-dark);}
.stat-card:nth-child(4n+3) .stat-mark{background:#0E1B2E;}
.stat-card:nth-child(4n+4) .stat-mark{background:var(--blue-dark);}
.stat-value{
  font-family:'Sora',sans-serif; font-weight:800; line-height:1.1; font-size:40px; font-variant-numeric:tabular-nums;
  background:linear-gradient(135deg,var(--teal),var(--blue));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.stat-label{font-size:14.5px; font-weight:600; color:var(--navy-soft);}

/* ---------- member strip (same story rings as "communities talking") ---------- */
.member-strip{display:flex; flex-wrap:wrap; gap:22px 18px;}
.member-card{width:96px; display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center;}
.member-ring{
  width:76px; height:76px; border-radius:50%; padding:3px; flex-shrink:0;
  background:conic-gradient(from 200deg,var(--teal),var(--blue),var(--teal));
  transition:transform .18s ease;
}
.member-card:hover .member-ring{transform:scale(1.05);}
.member-ring-inner{width:100%; height:100%; border-radius:50%; padding:3px; background:var(--paper);}
.member-name{
  font-family:'Sora',sans-serif; font-weight:700; font-size:12.5px; line-height:1.25;
  max-width:96px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.member-meta{font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--navy-soft);}

/* ---------- panels & tables ---------- */
.panel{background:var(--white); border:2px solid var(--navy); border-radius:16px; overflow:hidden;}
.band-paper .panel{background:var(--white);}
.empty{padding:28px 24px; color:var(--navy-soft);}
.panel-foot{padding:14px 24px; border-top:1px solid var(--border-soft); font-size:13.5px; font-weight:600;}
.panel-foot a{color:var(--blue-dark);}
.panel-foot a:hover{color:var(--blue);}
.table-wrap{overflow-x:auto;}
table.data{width:100%; border-collapse:collapse; font-size:14px;}
table.data th{
  text-align:start; font-family:'JetBrains Mono',monospace; font-weight:600; font-size:11px;
  letter-spacing:1.5px; text-transform:uppercase; color:var(--navy-soft);
  padding:14px 24px; border-bottom:1px solid var(--border-soft); white-space:nowrap; background:var(--paper);
}
table.data td{padding:13px 24px; border-bottom:1px solid var(--border-soft); vertical-align:top;}
table.data tr:last-child td{border-bottom:0;}
.tag{
  display:inline-block; padding:2px 10px; border-radius:99px; font-family:'JetBrains Mono',monospace;
  font-size:12px; font-weight:600; background:var(--mint-tint); color:var(--teal-dark); border:1px solid var(--border-soft);
  white-space:nowrap;
}

/* ---------- sign-in / 2FA ---------- */
body.is-auth > main{display:flex;}
.auth-stage{
  position:relative; flex:1; display:flex; align-items:center; justify-content:center; overflow:hidden;
  padding:56px max(20px,env(safe-area-inset-right)) 56px max(20px,env(safe-area-inset-left));
}
.auth-stage .disc.backdrop{
  width:360px; height:360px; background:linear-gradient(135deg,var(--teal),var(--blue));
  opacity:.16; left:max(-120px, calc(50% - 560px)); bottom:-140px;
}
.auth-card{
  position:relative; z-index:1; width:100%; max-width:420px; background:var(--white);
  border:2px solid var(--navy); border-radius:20px; padding:36px 32px;
}
.auth-card h1{font-size:34px; margin:14px 0 10px;}
.auth-card .muted{font-size:15px; line-height:1.6; margin-bottom:24px;}
.auth-alt{margin-top:18px; text-align:center; font-size:14px;}
.auth-alt a{color:var(--blue-dark); font-weight:600; text-decoration:underline; text-underline-offset:2px;}

.field{margin-bottom:18px;}
.field label{display:block; font-weight:600; font-size:13.5px; margin-bottom:6px;}
.field input{
  width:100%; padding:13px 14px; font:inherit; font-size:16px; /* 16px stops iOS zoom-on-focus */
  color:var(--navy); background:var(--paper); border:2px solid var(--border-soft); border-radius:10px;
}
.field input:focus{border-color:var(--blue); outline:none;}
.code-input{font-family:'JetBrains Mono',monospace !important; font-size:24px !important; letter-spacing:6px; text-align:center;}

.alert{padding:12px 14px; border-radius:10px; font-size:14px; line-height:1.5; margin-bottom:18px; border:2px solid transparent;}
.alert-error{background:var(--danger-tint); color:var(--danger); border-color:var(--danger);}
.alert-ok{background:var(--mint-tint); color:var(--teal-dark); border-color:var(--teal-dark);}

/* ---------- panel buttons on the dashboard ---------- */
.panel-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:22px;}
.panel-link{
  display:flex; flex-direction:column; gap:6px; background:var(--white); border:2px solid var(--navy);
  border-radius:16px; padding:26px 22px; transition:transform .15s ease, background .15s ease;
}
.panel-link:hover{transform:translateY(-2px); background:var(--mint-tint);}
.panel-link .stat-mark{background:var(--blue);}
.panel-link-title{font-family:'Sora',sans-serif; font-weight:700; font-size:20px;}
.panel-link-desc{font-size:14.5px; line-height:1.55; color:var(--navy-soft);}
.panel-link-go{margin-top:10px; font-size:13.5px; font-weight:700; color:var(--blue-dark);}

/* ---------- search ---------- */
.search-bar{display:flex; gap:16px; align-items:flex-end; flex-wrap:wrap; margin-bottom:26px;}
.search-bar .field{margin-bottom:0; min-width:170px;}
.search-bar .field-grow{flex:1 1 260px;}
.search-bar .field-btn .btn{padding:13px 28px; height:50px;}
.field input[type="search"]{appearance:none; -webkit-appearance:none;}
.field select{
  width:100%; height:50px; padding:0 14px; font:inherit; font-size:16px; color:var(--navy);
  background:var(--paper); border:2px solid var(--border-soft); border-radius:10px; cursor:pointer;
}
.field select:focus{border-color:var(--blue); outline:none;}
.field input::placeholder{color:var(--navy-soft); opacity:.8;}

/* ---------- tags & links ---------- */
.tag-plain{background:var(--paper); color:var(--navy-soft);}
.tag-admin{background:#0E1B2E; color:var(--teal); border-color:transparent;}
.tag-premium{background:var(--blue-tint); color:var(--blue-dark);}
.tag-danger{background:var(--danger-tint); color:var(--danger); border-color:var(--danger);}
.tag-row{display:flex; gap:8px; flex-wrap:wrap; margin-top:12px;}
.text-link{color:var(--blue-dark); font-weight:600; text-decoration:underline; text-underline-offset:2px;}
.text-link:hover{color:var(--blue);}
.back-link{display:inline-block; margin-bottom:18px; font-size:14px; font-weight:600; color:var(--navy-soft);}
.back-link:hover{color:var(--navy);}
table.data a:not(.member-cell){color:var(--blue-dark); text-decoration:underline; text-underline-offset:2px;}
.small{font-size:13px;}

/* ---------- member cell in tables ---------- */
.member-cell{display:flex; align-items:center; gap:12px; min-width:190px;}
.member-cell:hover strong{color:var(--blue-dark);}
.member-cell-text{display:flex; flex-direction:column; min-width:0;}
.member-cell-text strong{font-family:'Sora',sans-serif; font-size:14px;}
table.data td .mono.muted{font-size:11.5px;}

/* ---------- user detail ---------- */
.user-head{display:flex; align-items:center; gap:24px;}
.user-head-avatar .member-ring{width:96px; height:96px; padding:4px;}
.user-head-avatar .member-ring-inner{padding:4px;}
.user-head-avatar .avatar-fallback{font-size:32px;}
.user-head h1{font-size:clamp(30px,4vw,44px); margin:0 0 6px;}
.stat-grid-4{grid-template-columns:repeat(4,1fr);}
.info-grid{display:grid; grid-template-columns:repeat(2,1fr);}
.info-grid > div{padding:20px 24px; border-bottom:1px solid var(--border-soft); border-inline-end:1px solid var(--border-soft);}
.info-grid .info-wide{grid-column:1 / -1;}
.info-grid dt{
  font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:600; letter-spacing:1.5px;
  text-transform:uppercase; color:var(--navy-soft); margin-bottom:8px;
}
.info-grid dd{font-size:15px; line-height:1.55; overflow-wrap:anywhere;}
.info-grid dd .text-link{margin-inline-start:12px; font-family:'Inter',sans-serif; font-size:13.5px;}
.callout{
  background:var(--blue-tint); border:2px solid var(--navy); border-radius:14px;
  padding:18px 20px; margin-bottom:22px; font-size:14.5px; line-height:1.65;
}
.callout strong{color:var(--danger);}
.chip-row{display:flex; gap:10px; flex-wrap:wrap; margin-top:12px;}
.chip{
  display:inline-flex; align-items:center; gap:8px; padding:7px 14px; border-radius:99px;
  background:var(--white); border:2px solid var(--border-soft); font-size:13.5px; font-weight:600;
}
.chip:hover{border-color:var(--navy);}
.panel-foot.muted{color:var(--navy-soft); font-weight:400;}

/* ---------- footer ---------- */
.site-footer{padding:28px 0 32px; border-top:1px solid var(--border-soft); flex-shrink:0;}
.foot-bottom{
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
  font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--navy-soft);
}
.foot-bottom a:hover{color:var(--navy);}


/* ---------- articles ---------- */
.thumb{width:64px; height:40px; border-radius:8px; overflow:hidden; background:var(--paper); border:1px solid var(--border-soft); flex:0 0 auto;}
.thumb img{width:100%; height:100%; object-fit:cover;}
.lang-chips{display:flex; gap:6px; flex-wrap:wrap; min-width:120px;}
.lang-chip{padding:3px 10px; font-family:'JetBrains Mono',monospace; font-size:11.5px; font-weight:600;}
.lang-chip.is-missing{border-style:dashed; color:var(--navy-soft);}
.search-bar .field-btn .btn{white-space:nowrap;}

.lang-tabs{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:22px;}
.lang-tab{
  padding:8px 14px; border-radius:10px; border:2px solid var(--border-soft); background:var(--white);
  font-family:'JetBrains Mono',monospace; font-size:12.5px; font-weight:600;
}
.lang-tab:hover{border-color:var(--navy);}
.lang-tab.is-missing{border-style:dashed; color:var(--navy-soft);}
.lang-tab.is-active{background:var(--navy); color:var(--white); border-color:var(--navy);}

.pad{padding:24px;}
.editor-layout{display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:24px; align-items:start;}
.editor-side{display:flex; flex-direction:column; gap:24px; position:sticky; top:96px;}
.side-title{font-size:17px; margin-bottom:6px;}
.side-note{margin-bottom:14px; line-height:1.5;}
.field textarea{
  width:100%; padding:13px 14px; font:inherit; font-size:16px; color:var(--navy);
  background:var(--paper); border:2px solid var(--border-soft); border-radius:10px;
}
.field input[type="file"]{padding:10px; font-size:14px;}
.field-label{display:block; font-weight:600; font-size:13.5px; margin-bottom:6px;}
.check{display:flex; align-items:center; gap:10px; font-size:14.5px; font-weight:600; margin-bottom:10px; cursor:pointer;}
.check input{width:18px; height:18px; accent-color:var(--blue);}
.check input:disabled + *{opacity:.5;}
.btn-gap{margin-top:12px;}
.btn:disabled{opacity:.55; cursor:not-allowed;}

.toolbar{
  display:flex; flex-wrap:wrap; gap:4px; padding:8px; background:var(--paper);
  border:2px solid var(--border-soft); border-bottom:0; border-radius:10px 10px 0 0;
  position:sticky; top:72px; z-index:5;
}
.toolbar button{
  min-width:34px; height:36px; padding:0 7px; font:inherit; font-size:14px; font-weight:600; color:var(--navy);
  background:transparent; border:1px solid transparent; border-radius:8px; cursor:pointer;
}
.toolbar button:hover{background:var(--white); border-color:var(--border-soft);}
.toolbar button.is-on{background:var(--navy); color:var(--white);}
.tb-sep{width:1px; background:var(--border-soft); margin:4px 6px;}

.editor-surface{
  min-height:380px; padding:18px 20px; background:var(--white); color:var(--navy);
  border:2px solid var(--border-soft); border-radius:0 0 10px 10px; outline:none;
  font-size:17px; line-height:1.75; overflow-wrap:anywhere;
}
.editor-surface:focus{border-color:var(--blue);}
.editor-surface.is-empty::before{content:attr(data-placeholder); color:var(--navy-soft); opacity:.8; pointer-events:none; display:block; height:0; overflow:visible;}
.rich p{margin:0 0 1em;}
.rich h2{font-size:26px; margin:1.2em 0 .5em;}
.rich h3{font-size:20px; margin:1.1em 0 .5em;}
.rich ul,.rich ol{margin:0 0 1em; padding-inline-start:1.6em;}
.rich blockquote{margin:0 0 1em; padding:4px 16px; border-inline-start:4px solid var(--teal); color:var(--navy-soft);}
.rich a{color:var(--blue-dark); text-decoration:underline;}
.rich img{max-width:100%; height:auto; border-radius:10px; margin:6px 0;}
.editor-foot{display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-top:10px;}
.editor-foot .is-over,.editor-foot .is-error{color:var(--danger); font-weight:600;}
.thumb-preview{margin-bottom:14px;}
.thumb-preview img{width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:10px; border:1px solid var(--border-soft);}
.reference{margin-bottom:20px; border:1px solid var(--border-soft); border-radius:10px; background:var(--paper);}
.reference summary{padding:12px 16px; cursor:pointer; font-weight:600; font-size:14px;}
.reference-body{padding:4px 18px 14px; max-height:340px; overflow:auto;}
.reference-body h3{margin:6px 0 10px; font-size:20px;}
.notify-status{margin-inline-start:8px; font-weight:600;}

@media (max-width:980px){
  .editor-layout{grid-template-columns:1fr;}
  .editor-side{position:static;}
}
@media (max-width:600px){
  .pad{padding:18px;}
  .editor-surface{min-height:320px; padding:14px;}
  .toolbar{top:0; position:static;}
}


/* article blocks (new formats) */
[hidden]{display:none !important;}
.rich ul.a{list-style:none; padding-inline-start:0;}
.rich ul.a li{position:relative; padding-inline-start:1.5em; margin-bottom:.35em;}
.rich ul.a li::before{content:'✓'; position:absolute; inset-inline-start:0; color:var(--teal-dark); font-weight:700;}
.rich h4.linethrough{display:flex; align-items:center; gap:14px; font-size:18px; margin:1.4em 0 .8em;}
.rich h4.linethrough::before,.rich h4.linethrough::after{content:''; flex:1; height:1px; background:var(--border-soft);}
.rich img{display:block;}
.rich img.subimg{max-width:240px;}
.rich a[href^="../../../"]{color:var(--teal-dark); text-decoration-style:dashed;}
.rich .vid{position:relative; max-width:560px; margin:6px 0 1em; border-radius:10px; overflow:hidden; background:#000; cursor:pointer;}
.rich .vid img{width:100%; margin:0; border-radius:0; aspect-ratio:16/9; object-fit:cover; opacity:.8;}
.rich .vid span{position:absolute; inset-inline-start:12px; bottom:10px; padding:3px 10px; border-radius:99px; background:rgba(0,0,0,.7); color:#fff; font-size:13px; font-weight:600;}
.editor-surface img.is-selected,.editor-surface .vid.is-selected{outline:3px solid var(--blue); outline-offset:2px;}
.applink{display:flex; flex-wrap:wrap; gap:8px; align-items:center; padding:10px; background:var(--mint-tint); border:2px solid var(--border-soft); border-bottom:0;}
.applink select,.applink input{height:40px; padding:0 10px; font:inherit; font-size:15px; color:var(--navy); background:var(--paper); border:2px solid var(--border-soft); border-radius:8px;}
.applink input#al-id{width:110px;} .applink input#al-text{flex:1 1 180px; min-width:140px;}


/* ---------- anime ---------- */
.poster-sm{width:40px; height:56px; border-radius:6px; overflow:hidden; background:var(--paper); border:1px solid var(--border-soft); flex:0 0 auto;}
.poster-sm img{width:100%; height:100%; object-fit:cover;}
#anime-form{display:flex; flex-direction:column; gap:24px; padding-bottom:84px;}
.sec-nav{margin:0 0 22px;}
.card-title{font-size:22px; margin-bottom:6px;}
.card-title .count{font-family:'JetBrains Mono',monospace; font-size:14px; color:var(--navy-soft); font-weight:600;}
.card-help{margin-bottom:16px; line-height:1.5;}
.err-list{margin:8px 0 0; padding-inline-start:20px;}
.basics-grid{display:grid; grid-template-columns:220px minmax(0,1fr); gap:28px; margin-top:16px;}
.poster-preview{aspect-ratio:2/3; border-radius:12px; overflow:hidden; background:var(--paper); border:2px dashed var(--border-soft); margin-bottom:12px;}
.poster-preview img{width:100%; height:100%; object-fit:cover;}

/* placeholder shown when there is no image or it fails to load */
.poster-sm,.poster-preview,.thumb,.thumb-preview{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239aa0aa' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='3'/%3E%3Ccircle cx='9' cy='9' r='1.6'/%3E%3Cpath d='M21 16l-5-5-8 8'/%3E%3C/svg%3E") center/42% no-repeat var(--paper);}
.poster-sm img.is-broken,.poster-preview img.is-broken{display:none;}
.poster-sm,.poster-preview{background-color:var(--paper);}
.basics-fields{display:flex; flex-wrap:wrap; gap:14px 16px; align-content:flex-start;}
.rf{display:flex; flex-direction:column; gap:5px; min-width:0; flex:1 1 150px; max-width:100%;}
.rf-l{font-weight:600; font-size:13px;}
.rf input,.rf select,.rf textarea{
  width:100%; padding:11px 12px; font:inherit; font-size:16px; color:var(--navy); background:var(--paper);
  border:2px solid var(--border-soft); border-radius:10px;
}
.rf select{height:46px; padding:0 10px;}
.rf input:focus,.rf select:focus,.rf textarea:focus{border-color:var(--blue); outline:none;}
.rf textarea{resize:vertical; line-height:1.6;}
.rf-xl{flex:1 1 100%;} .rf-l,.rf-m{} .rf-m{flex:1 1 200px;} .rf-full{flex:1 1 100%;}
.rf .hint{font-size:12px; color:var(--navy-soft); line-height:1.4;}
.rf-checks{flex:1 1 100%; display:flex; flex-wrap:wrap; gap:8px 24px; padding-top:6px;}
.rf-check{flex-direction:row; align-items:center; gap:10px; flex:0 0 auto; font-weight:600; font-size:14.5px; cursor:pointer;}
.rf-check input{width:18px; height:18px; padding:0; accent-color:var(--blue);}
.rows{display:flex; flex-direction:column; gap:12px; margin-bottom:14px;}
.rowline{
  position:relative; display:flex; flex-wrap:wrap; gap:12px 14px; padding:14px 52px 14px 14px;
  background:var(--paper); border:1px solid var(--border-soft); border-radius:12px;
}
.rowline .rf input,.rowline .rf select,.rowline .rf textarea{background:var(--white);}
.row-del{
  position:absolute; top:10px; inset-inline-end:10px; width:34px; height:34px; border-radius:50%; font-size:22px; line-height:1;
  color:var(--danger); background:transparent; border:1px solid transparent; cursor:pointer;
}
.row-del:hover{background:var(--danger-tint); border-color:var(--danger);}
.lk{position:relative;}
.lk .lk-name{font-size:13px; font-weight:600; color:var(--teal-dark); min-height:1.2em; overflow-wrap:anywhere;}
.lk-results{
  position:absolute; top:100%; inset-inline-start:0; inset-inline-end:0; z-index:20; list-style:none; margin:4px 0 0; padding:4px;
  background:var(--white); border:2px solid var(--navy); border-radius:10px; max-height:260px; overflow:auto;
}
.lk-results button{width:100%; text-align:start; padding:9px 10px; font:inherit; font-size:14px; color:var(--navy); background:transparent; border:0; border-radius:8px; cursor:pointer;}
.lk-results button:hover{background:var(--mint-tint);}
.lk-none{padding:9px 10px; font-size:14px; color:var(--navy-soft);}
.genre-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:4px 16px;}
.savebar{
  position:fixed; inset-inline:0; bottom:0; z-index:50; display:flex; justify-content:flex-end; align-items:center; gap:16px;
  padding:12px 28px calc(12px + env(safe-area-inset-bottom)); background:var(--white); border-top:2px solid var(--navy);
}
@media (max-width:760px){
  .basics-grid{grid-template-columns:1fr;}
  .poster-box{max-width:240px;}
  .rowline{padding-right:14px; padding-top:52px;}
  .savebar{padding-inline:18px;}
  .savebar .btn{flex:1;}
}

/* ---------- responsive ---------- */
@media (max-width:980px){
  .stat-grid,.stat-grid-4{grid-template-columns:repeat(2,1fr);}
  .info-grid{grid-template-columns:1fr;}
  .ring{display:none;}
  .band{padding:64px 0;}
}
@media (max-width:860px){
  .nav{flex-wrap:wrap; min-height:64px; padding-top:10px; padding-bottom:10px; row-gap:0;}
  .nav-right{gap:10px; margin-inline-start:auto;}
  .nav-toggle{display:inline-flex; order:2;}
  .nav-right{order:1;}
  .logo{order:0;}
  .user-chip-name{display:none;}
  nav.links{display:none; order:3; width:100%; margin:10px 0 0; flex-direction:column; gap:0; border-top:1px solid var(--border-soft); padding:6px 0 10px;}
  nav.links.is-open{display:flex;}
}
@media (max-width:760px){
  .page-hero{padding:48px 0 56px;}
  .band{padding:52px 0;}
  table.data th,table.data td{padding-inline:16px;}
}
@media (max-width:600px){
  .wrap{padding-left:18px; padding-right:18px;}
  .search-bar .field{min-width:100%;}
  .search-bar .field-btn{width:100%;}
  .search-bar .field-btn .btn{width:100%;}
  .user-head{gap:16px;}
  .user-head-avatar .member-ring{width:72px; height:72px;}
  .user-head-avatar .avatar-fallback{font-size:24px;}
  .nav{gap:10px;}
  .user-chip{display:none;}
  .logo{font-size:17px; gap:8px;}
  .logo-tag{padding:3px 6px; letter-spacing:1px;}
  .nav-right .btn-sm{padding:9px 14px;}
  .auth-card{padding:30px 22px;}
  .stat-grid{gap:14px;}
  .stat-card{padding:20px 16px;}
  .stat-value{font-size:30px;}
}
@media (max-width:380px){
  .stat-grid,.stat-grid-4{grid-template-columns:1fr;}
}
@media (prefers-reduced-motion:reduce){
  body.admin-page,.btn,.theme-toggle,.member-ring{transition:none;}
}

.copy-id{cursor:pointer; border-radius:4px; padding:0 3px; margin:0 -3px;}
.copy-id:hover,.copy-id:focus-visible{background:rgba(120,170,230,.18); outline:none;}
.copy-id.is-copied{color:var(--accent,#3ecf9b);}
.poster-sm img,.poster-preview img,.thumb img{background:var(--paper);}
.danger-zone{margin-top:28px; padding-top:18px; border-top:1px solid var(--border-soft);}
.btn-danger{border-color:#e5484d; color:#e5484d; background:transparent;}
.btn-danger:hover{background:#e5484d; color:#fff;}
#dup-box{border-color:var(--border-soft); background:var(--paper);}
#dup-box a{text-decoration:underline;}

.quote-bar{display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; padding:14px 16px; margin:0 0 18px; border:2px solid var(--border-soft); border-radius:12px; background:var(--paper);}
.quote-bar-text{display:flex; flex-direction:column; gap:2px;}
.quote-bar-actions{display:flex; gap:10px; flex-wrap:wrap;}
@media (max-width:600px){.quote-bar-actions,.quote-bar-actions .btn{width:100%; text-align:center;}}

.log-filters{flex-wrap:wrap;}
.log-filters .field{min-width:150px;}
.log-totals{display:flex; gap:18px; flex-wrap:wrap; align-items:baseline; padding:12px 16px; margin:0 0 14px; border:2px solid var(--border-soft); border-radius:12px; background:var(--paper); font-size:15px;}
.amt-pos{color:#2fbf8a;}
.amt-neg{color:#e5484d;}
.chip-on{background:var(--accent,#5fb0e0); color:#0b1218; border-color:transparent;}
.log-note{max-width:320px; overflow-wrap:anywhere; font-size:13px;}
.log-orig summary{cursor:pointer; color:var(--accent,#5fb0e0);}
.log-orig pre{white-space:pre-wrap; overflow-wrap:anywhere; max-height:260px; overflow:auto; margin:6px 0 0; padding:8px 10px; border-radius:8px; background:var(--paper); border:1px solid var(--border-soft); font-size:12px;}

.gp-chips{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; min-height:8px;}
.gp-chip{display:inline-flex; align-items:center; gap:6px; padding:5px 6px 5px 12px; border-radius:999px; border:1px solid var(--border-soft); background:var(--paper); font-size:14px; font-weight:600;}
.gp-x{border:0; background:transparent; color:inherit; cursor:pointer; font-size:18px; line-height:1; padding:0 6px; border-radius:50%; opacity:.7;}
.gp-x:hover{opacity:1; color:#e5484d;}
.gp .lk{max-width:420px;}
.gp-q{width:100%;}
.lk-results{max-height:300px; overflow:auto;}
.gp-q{display:block; width:100%; padding:11px 12px; font:inherit; font-size:16px; color:var(--navy); background:var(--paper);
  border:2px solid var(--border-soft); border-radius:10px; appearance:none; -webkit-appearance:none; box-sizing:border-box;}
.gp-q:focus{border-color:var(--blue); outline:none;}
.gp-q::placeholder{color:var(--navy-soft); opacity:.8;}
.gp-q::-webkit-search-cancel-button{-webkit-appearance:none; display:none;}
.gp-name,.lk-results button{unicode-bidi:plaintext;}
.gp .lk{width:100%; max-width:460px;}
.gp .lk-results{background:var(--white); color:var(--navy);}
/* Dropdowns of the name searches must not be clipped by the card that holds them. */
.panel.pad{overflow:visible;}
.gp .lk-results,.rowline .lk-results{z-index:60;}

/* ---------- dashboard + lists: comfortable on phones, tablets and big screens ---------- */
.subs-by{margin-top:18px; display:flex; flex-wrap:wrap; gap:8px 10px; align-items:center; font-size:14px;}

/* Big screens: use the width, and keep the cards compact. */
@media (min-width:1200px){
  .wrap{max-width:1360px;}
  .stat-grid{grid-template-columns:repeat(4,1fr);}
  .panel-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));}
  .band{padding:64px 0;}
  .page-hero{padding:56px 0 60px;}
}
@media (min-width:1700px){ .stat-grid{grid-template-columns:repeat(5,1fr);} }
table.data thead th{position:sticky; top:0; z-index:1;}
table.data tbody tr:hover td{background:var(--paper);}
.table-wrap{-webkit-overflow-scrolling:touch;}

/* Tablets */
@media (max-width:980px){
  .band{padding:44px 0;}
  .page-hero{padding:40px 0 44px;}
  .sec-head{margin-bottom:26px;}
  .panel-grid{grid-template-columns:repeat(2,1fr); gap:14px;}
  .panel-link{padding:20px 18px;}
  .stat-grid{gap:14px;}
}

/* Phones */
@media (max-width:760px){
  .band{padding:32px 0;}
  .page-hero{padding:28px 0 30px;}
  .page-hero h1{font-size:30px; margin:12px 0 10px;}
  .page-hero .lede{font-size:15px;}
  .sec-head{margin-bottom:18px;}
  .sec-head h2{font-size:24px; margin-top:8px;}

  /* Dashboard: panels as a compact 2-column grid */
  .panel-grid{grid-template-columns:repeat(2,1fr); gap:10px;}
  .panel-link{padding:14px; gap:4px; border-radius:14px;}
  .panel-link .stat-mark{width:36px; height:36px; margin-bottom:6px;}
  .panel-link .stat-mark svg{width:18px; height:18px;}
  .panel-link-title{font-size:16px;}
  .panel-link-desc{display:none;}
  .panel-link-go{margin-top:2px; font-size:12.5px;}

  /* Dashboard: numbers 2 per row, small */
  .stat-grid,.stat-grid-4{grid-template-columns:repeat(2,1fr); gap:10px;}
  .stat-card{padding:14px; border-radius:14px; gap:2px;}
  .stat-mark{width:34px; height:34px; margin-bottom:6px;}
  .stat-mark svg{width:17px; height:17px;}
  .stat-value{font-size:26px;}
  .stat-label{font-size:13px;}

  /* Latest sign-ins: one swipeable row */
  .member-strip{flex-wrap:nowrap; overflow-x:auto; gap:14px; padding-bottom:6px; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch;}
  .member-card{flex:0 0 80px; width:80px; scroll-snap-align:start;}
  .member-ring{width:64px; height:64px;}

  /* Search/filter bars: fields fill the row, buttons sit side by side */
  .search-bar{gap:10px; margin-bottom:16px;}
  .search-bar .field,.search-bar .field-grow{flex:1 1 100%; min-width:100%;}
  .search-bar .field-btn{flex:1 1 calc(50% - 5px); min-width:0; width:auto;}
  .search-bar .field-btn .btn{width:100%; height:48px;}

  /* Lists: every row becomes a card */
  .panel{border-radius:14px;}
  .table-wrap{overflow:visible;}
  table.data,table.data tbody{display:block; width:100%;}
  table.data thead{display:none;}
  table.data tbody tr{display:block; padding:12px 14px; border-bottom:1px solid var(--border-soft);}
  table.data tbody tr:last-child{border-bottom:0;}
  table.data tbody tr:hover td{background:transparent;}
  table.data td{
    display:flex; justify-content:space-between; align-items:center; gap:14px;
    padding:6px 0; border:0; text-align:end; overflow-wrap:anywhere;
  }
  table.data td::before{
    content:attr(data-label); flex:0 0 auto; max-width:46%; text-align:start;
    font-family:'JetBrains Mono',monospace; font-size:10.5px; font-weight:600; letter-spacing:1.2px;
    text-transform:uppercase; color:var(--navy-soft);
  }
  /* first cell is the card title (member / anime / person ...) with no label */
  table.data td:first-child{display:block; text-align:start; padding:0 0 8px; margin-bottom:4px; border-bottom:1px dashed var(--border-soft);}
  table.data td:first-child::before{display:none;}
  table.data td:empty{display:none;}
  table.data td:not([data-label])::before{display:none;}
  table.data td.log-note,.log-note{max-width:none;}
  .member-cell{min-width:0;}
  .log-orig pre{max-width:100%;}
  .panel-foot{padding:12px 14px;}
  .empty{padding:20px 14px;}
}
@media (max-width:380px){
  .panel-grid{grid-template-columns:1fr;}
}
@media (max-width:760px){
  .search-bar .field:not(.field-grow):not(.field-btn){flex:1 1 calc(50% - 5px); min-width:0;}
}

/* ---------- dashboard v2 ---------- */
.dash-hero{padding:34px 0 8px;}
.dash-hero .wrap{display:flex; justify-content:space-between; align-items:flex-end; gap:16px; flex-wrap:wrap;}
.dash-hero h1{font-size:clamp(26px,3.4vw,40px); margin:10px 0 6px; line-height:1.15;}
.dash-hero .lede{font-size:15px; color:var(--navy-soft);}
.dash-date{color:var(--navy-soft); padding:6px 12px; border:1px solid var(--border-soft); border-radius:99px; background:var(--paper);}

.dash-stats{padding:18px 0 6px;}
.kpi-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:14px;}
.kpi{
  position:relative; padding:18px 18px 16px; border-radius:16px; background:var(--paper);
  border:1px solid var(--border-soft); overflow:hidden;
}
.kpi::before{content:''; position:absolute; inset:0 0 auto 0; height:3px; background:linear-gradient(90deg,var(--teal),var(--blue));}
.kpi-mark{position:absolute; top:16px; inset-inline-end:16px; width:34px; height:34px; border-radius:10px; display:flex; align-items:center; justify-content:center; background:var(--blue-tint);}
.kpi-mark svg{width:18px; height:18px; stroke:var(--blue);}
.kpi-value{font-family:'Sora',sans-serif; font-weight:800; font-size:34px; line-height:1.1; margin-top:6px; font-variant-numeric:tabular-nums;}
.kpi-label{margin-top:6px; font-size:13.5px; font-weight:600; color:var(--navy-soft);}

.dash-section{padding:30px 0 4px;}
.dash-section:last-of-type{padding-bottom:48px;}
.dash-sec-head{display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; margin-bottom:14px;}
.dash-sec-head h2{font-size:22px;}
.dash-sec-head .muted{font-size:14px;}

.tile-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:14px;}
.tile{
  display:flex; align-items:center; gap:16px; padding:18px; border-radius:16px; background:var(--paper);
  border:1px solid var(--border-soft); transition:transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.tile:hover{transform:translateY(-2px); border-color:var(--blue); box-shadow:0 8px 24px rgba(0,0,0,.14);}
.tile-mark{flex:0 0 auto; width:48px; height:48px; border-radius:14px; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,var(--blue),var(--blue-dark));}
.tile-manage .tile-mark{background:linear-gradient(135deg,var(--teal-dark),var(--blue));}
.tile-mark svg{width:23px; height:23px; stroke:#fff;}
.tile-body{display:flex; flex-direction:column; gap:3px; min-width:0; flex:1;}
.tile-title{font-family:'Sora',sans-serif; font-weight:700; font-size:17px;}
.tile-desc{font-size:13.5px; line-height:1.45; color:var(--navy-soft);}
.tile-go{flex:0 0 auto; font-size:20px; color:var(--navy-soft); transition:transform .15s ease, color .15s ease;}
.tile:hover .tile-go{transform:translateX(4px); color:var(--blue);}
.panel.pad-sm{padding:18px;}
.dash-section .panel{border-width:1px; border-color:var(--border-soft);}

@media (max-width:760px){
  .dash-hero{padding:22px 0 4px;}
  .dash-date{display:none;}
  .dash-stats{padding-top:12px;}
  .kpi-grid{grid-template-columns:repeat(2,1fr); gap:10px;}
  .kpi{padding:14px;}
  .kpi-value{font-size:26px;}
  .kpi-mark{width:30px; height:30px; top:12px; inset-inline-end:12px;}
  .dash-section{padding-top:22px;}
  .tile-grid{grid-template-columns:1fr; gap:10px;}
  .tile{padding:14px; gap:14px;}
  .tile-mark{width:42px; height:42px;}
  .tile-desc{display:block; font-size:13px;}
  .panel.pad-sm{padding:14px;}
}
.head-actions{margin-top:14px;}
@media (max-width:600px){.head-actions .btn{width:100%;}}

/* ---------- user profile ---------- */
.profile-top{padding-bottom:0;}
.profile-top .wrap{display:block;}
.profile-card{
  display:flex; align-items:center; gap:22px; padding:22px; border-radius:18px;
  background:var(--paper); border:1px solid var(--border-soft); position:relative; overflow:hidden;
}
.profile-card::before{content:''; position:absolute; inset:0 0 auto 0; height:4px; background:linear-gradient(90deg,var(--teal),var(--blue));}
.profile-avatar .member-ring{width:104px; height:104px; padding:4px;}
.profile-avatar .member-ring-inner{padding:4px;}
.profile-avatar .avatar-fallback{font-size:34px;}
.profile-main{flex:1; min-width:0;}
.profile-main h1{font-size:clamp(24px,3vw,34px); margin:0 0 4px; overflow-wrap:anywhere;}
.profile-main .tag-row{margin-top:10px;}
.profile-intro{margin-top:12px; font-size:14.5px; line-height:1.6; color:var(--prose-text); max-width:620px; overflow-wrap:anywhere;}
.profile-actions{display:flex; flex-direction:column; gap:10px; flex:0 0 auto;}
.profile-cols{display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:start;}
.info-rows > div{display:flex; justify-content:space-between; gap:18px; padding:14px 18px; border-bottom:1px solid var(--border-soft);}
.info-rows > div:last-child{border-bottom:0;}
.info-rows dt{font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase; color:var(--navy-soft); padding-top:3px; flex:0 0 auto;}
.info-rows dd{text-align:end; font-size:14.5px; overflow-wrap:anywhere;}
.sub-list{list-style:none;}
.sub-list li{padding:14px 18px; border-bottom:1px solid var(--border-soft);}
.sub-list li:last-child{border-bottom:0;}
.sub-top{display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:4px;}
@media (max-width:900px){.profile-cols{grid-template-columns:1fr;}}
@media (max-width:640px){
  .profile-card{flex-direction:column; align-items:flex-start; gap:14px; padding:18px;}
  .profile-avatar .member-ring{width:80px; height:80px;}
  .profile-actions{flex-direction:row; width:100%;}
  .profile-actions .btn{flex:1;}
  .info-rows > div{flex-direction:column; gap:4px;}
  .info-rows dd{text-align:start;}
}
@media (max-width:760px){.kpi-grid .kpi:last-child:nth-child(odd){grid-column:1 / -1;}}

/* tick-box list for staff / company positions */
.posbox{border:2px solid var(--border-soft); border-radius:10px; background:var(--white);}
.posbox summary{list-style:none; cursor:pointer; padding:11px 12px; font-size:15px; line-height:1.4; display:flex; align-items:center; gap:10px;}
.posbox summary::-webkit-details-marker{display:none;}
.posbox summary::after{content:'▾'; margin-inline-start:auto; color:var(--navy-soft);}
.posbox[open] summary::after{content:'▴';}
.posbox[open]{border-color:var(--blue);}
.pos-sum{overflow-wrap:anywhere;}
.pos-list{display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:2px 14px; padding:6px 12px 12px; max-height:260px; overflow:auto; border-top:1px solid var(--border-soft);}
.pos-opt{flex-direction:row; display:flex; align-items:center; gap:8px; padding:7px 0; font-size:14px; font-weight:500; cursor:pointer;}
.pos-opt input{width:18px; height:18px; padding:0; accent-color:var(--blue); flex:0 0 auto;}

/* company logo + favicon */
.poster-preview.is-logo{aspect-ratio:1/1; border-style:solid;}
.poster-preview.is-logo img{object-fit:contain; padding:10%;}
.poster-sm.logo-sm{width:48px; height:48px; border-radius:10px;}
.poster-sm.logo-sm img{object-fit:contain; padding:4px;}
.fav-row{display:flex; align-items:flex-end; gap:12px; margin-top:16px;}
.fav-row .rf{flex:1;}
.poster-preview.is-fav{width:56px; height:56px; flex:0 0 56px; margin:0; border-radius:10px;}
.poster-preview.is-fav img{padding:8px;}

/* Logos: a white rounded tile, the logo centred and fully visible inside it. */
.poster-preview.is-logo,.poster-sm.logo-sm{background:#fff; border:1px solid var(--border-soft); overflow:hidden;}
.poster-preview.is-logo img,.poster-sm.logo-sm img{width:100%; height:100%; object-fit:contain; padding:8%; background:transparent;}
.poster-preview.is-logo{border-radius:16px;}
.poster-sm.logo-sm{border-radius:12px;}
.poster-preview.is-fav{border-radius:12px;}
.poster-preview.is-fav img{padding:10%;}


/* ---------- header menu v2: grouped dropdowns ---------- */
nav.links{align-items:center; gap:6px;}
nav.links > a,.nav-trigger{
  font:inherit; font-size:14.5px; font-weight:600; color:var(--navy-soft); background:transparent; border:0; cursor:pointer;
  padding:9px 14px; border-radius:10px; display:inline-flex; align-items:center; gap:6px; border-bottom:0;
}
nav.links > a:hover,.nav-trigger:hover,.nav-group.is-open .nav-trigger{color:var(--navy); background:var(--paper);}
nav.links > a.active,.nav-group.has-active .nav-trigger{color:var(--navy); background:var(--paper); box-shadow:inset 0 -2px 0 var(--teal);}
.nav-caret{font-size:11px; transition:transform .15s ease;}
.nav-group.is-open .nav-caret{transform:rotate(180deg);}
.nav-group{position:relative;}
.nav-menu{
  position:absolute; top:calc(100% + 8px); inset-inline-start:0; min-width:210px; z-index:70; padding:6px;
  background:var(--white); border:1px solid var(--border-soft); border-radius:14px; box-shadow:0 14px 34px rgba(0,0,0,.22);
}
nav.links .nav-menu a{display:block; padding:10px 12px; border-radius:9px; border-bottom:0; font-size:14.5px; font-weight:600; color:var(--navy-soft);}
nav.links .nav-menu a:hover{background:var(--paper); color:var(--navy);}
nav.links .nav-menu a.active{color:var(--navy); background:var(--mint-tint); box-shadow:inset 3px 0 0 var(--teal);}
.nav-toggle{
  display:none; width:40px; height:40px; align-items:center; justify-content:center; border-radius:50%; flex-shrink:0;
  border:2px solid var(--navy); background:transparent; color:var(--navy); cursor:pointer; padding:0;
}
.nav-toggle svg{width:20px; height:20px;}
@media (max-width:860px){
  nav.links > a,.nav-trigger{width:100%; padding:12px 8px; border-radius:8px;}
  .nav-trigger{cursor:default; pointer-events:none; font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--navy-soft); background:transparent !important; box-shadow:none !important; padding-bottom:4px;}
  .nav-caret{display:none;}
  .nav-group{width:100%;}
  .nav-menu,.nav-menu[hidden]{display:block !important; position:static; min-width:0; padding:0 0 6px; border:0; box-shadow:none; background:transparent;}
  nav.links .nav-menu a{padding:12px 8px 12px 16px;}
}
@media (max-width:860px){.nav-toggle{display:inline-flex; order:2;}}
@media (max-width:600px){
  .nav{flex-wrap:wrap; gap:8px;}
  .nav .logo-tag{display:none;}
  .nav-right{gap:8px;}
  .nav-right .btn-sm{padding:8px 12px; font-size:13px;}
  .theme-toggle,.nav-toggle{width:38px; height:38px;}
}
@media (max-width:360px){
  .logo{font-size:15px;}
  .nav-right .btn-sm{padding:8px 10px;}
}

/* ---------- user moderation ---------- */
.flash{padding:14px 18px; border-radius:12px; border:2px solid var(--navy); font-weight:600;}
.flash-ok{background:var(--mint-tint); color:var(--navy);}
.flash-err{background:var(--danger-tint); color:var(--danger); border-color:var(--danger);}
.flash-sec{padding-top:18px; padding-bottom:0;}
.manage-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:18px; align-items:start;}
.manage-card{padding:20px;}
.manage-card h3{margin:0 0 10px; font-size:17px;}
.manage-state{margin:0 0 14px;}
.manage-wide{grid-column:1/-1;}
.manage-card .field{margin-bottom:14px;}
.manage-card .field input,.manage-card .field select,.manage-card .field textarea{width:100%;}
.manage-card .small{margin:10px 0 0;}
.btn-row{display:flex; gap:10px; flex-wrap:wrap;}
.form-row2{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.dev-bans{list-style:none; margin:0 0 14px; padding:0; display:grid; gap:8px;}
.dev-bans li{display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; font-size:14px;}
.check-row{display:flex; gap:22px; flex-wrap:wrap; margin:0 0 16px;}
.check{display:inline-flex; align-items:center; gap:8px; font-size:14px; font-weight:600; cursor:pointer;}
.check input{width:auto !important;}
@media (max-width:600px){ .form-row2{grid-template-columns:1fr;} .manage-grid{grid-template-columns:1fr;} }

/* ---------- member actions: a button row under the profile, each opens its own window ---------- */
.act-bar-wrap{padding:18px 0 4px;}
.act-bar{display:flex; flex-wrap:wrap; align-items:center; gap:10px;}
.act-title{font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--navy-soft); margin-inline-end:4px;}
.act-btn{display:inline-flex; align-items:center; gap:8px; font:inherit; font-size:14px; font-weight:700; color:var(--navy); background:var(--white); border:2px solid var(--navy); border-radius:999px; padding:9px 16px; cursor:pointer; white-space:nowrap; transition:background .15s, transform .15s;}
.act-btn svg{width:16px; height:16px; flex-shrink:0;}
.act-btn:hover{background:var(--mint-tint); transform:translateY(-1px);}
.act-btn.is-bad{border-color:var(--danger); color:var(--danger); background:var(--danger-tint);}
.act-btn.is-ok{border-color:var(--teal); background:var(--mint-tint);}
.mdlg{padding:0; border:2px solid var(--navy); border-radius:20px; background:var(--white); color:var(--navy); width:min(520px, calc(100vw - 32px)); max-height:calc(100vh - 48px); overflow:hidden; box-shadow:0 30px 70px rgba(0,0,0,.45);}
.mdlg[open]{display:flex; flex-direction:column;}
.mdlg::backdrop{background:rgba(8,12,20,.62); backdrop-filter:blur(2px);}
.mdlg-head{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 20px; border-bottom:1px solid var(--border-soft); flex-shrink:0;}
.mdlg-head h3{margin:0; font-size:18px;}
.mdlg-x{width:36px; height:36px; border-radius:50%; border:0; background:var(--paper); color:var(--navy); font-size:22px; line-height:1; cursor:pointer;}
.mdlg-x:hover{background:var(--navy); color:var(--white);}
.mdlg-body{padding:18px 20px 22px; overflow-y:auto;}
.mdlg-body .manage-state{margin:0 0 14px;}
.mdlg-body .field{margin-bottom:14px;}
.mdlg-body .field input,.mdlg-body .field select,.mdlg-body .field textarea{width:100%;}
.mdlg-body .small{margin:10px 0 0;}
.mdlg-body .btn-row{display:flex; gap:10px; flex-wrap:wrap;}
.mdlg-body .dev-bans{list-style:none; margin:0 0 14px; padding:0; display:grid; gap:8px;}
.mdlg-body .dev-bans li{display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; font-size:14px;}
.mdlg-body .form-row2{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.mdlg-body .check-row{display:flex; gap:22px; flex-wrap:wrap; margin:0 0 16px;}
.mdlg-body .check{display:inline-flex; align-items:center; gap:8px; font-size:14px; font-weight:600; cursor:pointer;}
.mdlg-body .check input{width:auto !important;}
@media (max-width:600px){
  .act-bar{gap:8px;}
  .act-title{width:100%;}
  .act-btn{padding:8px 12px; font-size:13px;}
  .mdlg{width:100vw; max-width:100vw; margin:auto 0 0; border-radius:20px 20px 0 0; border-bottom:0;}
  .mdlg-body .form-row2{grid-template-columns:1fr;}
}
.mdlg{margin:auto;}
@media (max-width:600px){ .mdlg{margin:auto 0 0;} }
.act-btn svg{stroke:currentColor;}

/* ---------- mobile menu v3: soft square button with animated bars, floating panel ---------- */
.nav-toggle .bars{position:relative; display:block; width:18px; height:14px;}
.nav-toggle .bars i{position:absolute; left:0; width:100%; height:2px; border-radius:2px; background:currentColor; transition:transform .22s ease, opacity .15s ease, top .22s ease;}
.nav-toggle .bars i:nth-child(1){top:0;}
.nav-toggle .bars i:nth-child(2){top:6px;}
.nav-toggle .bars i:nth-child(3){top:12px;}
.nav-toggle[aria-expanded="true"] .bars i:nth-child(1){top:6px; transform:rotate(45deg);}
.nav-toggle[aria-expanded="true"] .bars i:nth-child(2){opacity:0;}
.nav-toggle[aria-expanded="true"] .bars i:nth-child(3){top:6px; transform:rotate(-45deg);}
@media (max-width:860px){
  .nav-toggle{border:0; border-radius:12px; width:42px; height:42px; background:var(--mint-tint); color:var(--navy); order:3;}
  .nav-toggle[aria-expanded="true"]{background:var(--navy); color:var(--white);}
  .nav-right{order:2;}
  nav.links{
    position:absolute; top:100%; left:12px; right:12px; width:auto; margin:8px 0 0; padding:10px 8px 12px;
    max-height:calc(100vh - 90px); overflow-y:auto; border:1px solid var(--border-soft); border-radius:18px;
    background:var(--white); box-shadow:0 18px 40px rgba(0,0,0,.28);
  }
  nav.links .nav-top{font-weight:700;}
}
@media (max-width:600px){
  .theme-toggle,.nav-toggle{width:40px; height:40px;}
}

/* ---------- languages ---------- */
.lang-switch{position:relative;}
.lang-switch summary{list-style:none; display:inline-flex; align-items:center; gap:6px; height:40px; padding:0 12px; border:2px solid var(--navy); border-radius:999px; cursor:pointer; font-family:'JetBrains Mono',monospace; font-size:12px; font-weight:600; color:var(--navy); user-select:none;}
.lang-switch summary::-webkit-details-marker{display:none;}
.lang-switch summary:hover,.lang-switch[open] summary{background:var(--navy); color:var(--white);}
.lang-switch svg{width:16px; height:16px;}
.lang-menu{position:absolute; inset-inline-end:0; top:calc(100% + 8px); min-width:160px; padding:6px; z-index:80; background:var(--white); border:1px solid var(--border-soft); border-radius:14px; box-shadow:0 14px 34px rgba(0,0,0,.28); display:grid; gap:2px;}
.lang-menu a{display:block; padding:10px 12px; border-radius:9px; font-size:14.5px; font-weight:600; color:var(--navy-soft);}
.lang-menu a:hover{background:var(--paper); color:var(--navy);}
.lang-menu a.is-current{color:var(--navy); background:var(--mint-tint); box-shadow:inset 3px 0 0 var(--teal);}
html[dir="rtl"] .lang-menu a.is-current{box-shadow:inset -3px 0 0 var(--teal);}
@media (max-width:600px){ .lang-switch summary{height:40px; padding:0 10px;} .lang-switch summary span{display:none;} }

/* scripts the Latin fonts lack */
html[lang="ar"] body,html[lang="ar"] input,html[lang="ar"] select,html[lang="ar"] textarea,html[lang="ar"] button{font-family:'Noto Sans Arabic','Inter',sans-serif;}
html[lang="ja"] body,html[lang="ja"] input,html[lang="ja"] select,html[lang="ja"] textarea,html[lang="ja"] button{font-family:'Noto Sans JP','Inter',sans-serif;}
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3,html[lang="ar"] .logo{font-family:'Noto Sans Arabic','Sora',sans-serif;}
html[lang="ja"] h1,html[lang="ja"] h2,html[lang="ja"] h3{font-family:'Noto Sans JP','Sora',sans-serif;}
/* spaced capitals break Arabic letter joining and look odd in Japanese */
html[lang="ar"] *,html[lang="ja"] *{letter-spacing:normal !important;}
html[lang="ar"] .eyebrow,html[lang="ar"] th,html[lang="ar"] .logo-tag,html[lang="ar"] .nav-menu,html[lang="ar"] .act-title{text-transform:none;}

/* right-to-left */
html[dir="rtl"] .tile-go,html[dir="rtl"] .back-link,html[dir="rtl"] .panel-foot a{display:inline-block; direction:rtl;}
html[dir="rtl"] .tile-go{transform:scaleX(-1);}
html[dir="rtl"] .mono,html[dir="rtl"] input[type="number"],html[dir="rtl"] input[name="username"]{direction:ltr; unicode-bidi:plaintext;}
html[dir="rtl"] table.data th,html[dir="rtl"] table.data td{text-align:right;}
html[dir="rtl"] .nav-menu a.active,html[dir="rtl"] nav.links .nav-menu a.active{box-shadow:inset -3px 0 0 var(--teal);}
.signout svg{display:none; width:18px; height:18px;}
@media (max-width:600px){
  .signout{width:40px; height:40px; padding:0 !important; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;}
  .signout svg{display:block;}
  .signout .so-label{display:none;}
}
html[dir="rtl"] .signout svg{transform:scaleX(-1);}
html[lang="ar"] .kpi-value{font-family:'Sora',sans-serif;}
html[lang="ar"] .mono,html[lang="ar"] .dash-date{font-family:'JetBrains Mono','Noto Sans Arabic',monospace;}