:root{
  color-scheme: dark;
  --bg:#080810;
  --surface:#0f0f1a;
  --surface2:#16162a;
  --surface3:#1e1e35;
  --surface4:#282847;
  --border:rgba(255,255,255,.07);
  --border2:rgba(255,255,255,.12);
  --accent:#a78bfa;
  --accent2:#f472b6;
  --accent3:#38bdf8;
  --text:#f0eeff;
  --muted:#6b6b8a;
  --muted2:#9090b0;
  --red:#f87171;
  --green:#34d399;
  --gold:#fbbf24;
  --shadow:0 24px 70px rgba(0,0,0,.35);
}
*{margin:0;padding:0;box-sizing:border-box;}
body{
  background:
    radial-gradient(circle at top left, rgba(167,139,250,.14), transparent 24%),
    radial-gradient(circle at 85% 15%, rgba(244,114,182,.10), transparent 22%),
    linear-gradient(180deg, #080810 0%, #0b0c17 46%, #080810 100%);
  color:var(--text);font-family:'Inter',sans-serif;min-height:100vh;overflow-x:hidden;
}

/* Ambient background */
body::before{content:'';position:fixed;inset:0;
  background:
    linear-gradient(120deg, rgba(255,255,255,.03) 0, rgba(255,255,255,0) 28%),
    radial-gradient(ellipse 75% 50% at 8% 0%,rgba(167,139,250,.10) 0%,transparent 60%),
    radial-gradient(ellipse 55% 38% at 92% 14%,rgba(244,114,182,.08) 0%,transparent 52%),
    radial-gradient(ellipse 46% 60% at 45% 100%,rgba(52,211,153,.06) 0%,transparent 72%);
  pointer-events:none;z-index:0;}
body::after{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.22;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:32px 32px;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.55), transparent 85%);
}

.app{display:flex;min-height:100vh;position:relative;z-index:1;}

/* ── SIDEBAR ── */
.sidebar{
  width:250px;flex-shrink:0;
  background:linear-gradient(180deg, rgba(15,15,26,.88), rgba(14,14,24,.76));
  backdrop-filter:blur(24px);
  border-right:1px solid var(--border);
  position:sticky;top:0;height:100vh;
  overflow-y:auto;z-index:50;
  display:flex;flex-direction:column;
  box-shadow:inset -1px 0 0 rgba(255,255,255,.02);
}
.sidebar::-webkit-scrollbar{width:3px;}
.sidebar::-webkit-scrollbar-thumb{background:rgba(167,139,250,.24);border-radius:2px;}

.sb-logo{
  padding:1.3rem 1.1rem 1rem;
  font-family:'Space Grotesk',sans-serif;font-size:1.1rem;font-weight:700;
  color:var(--text);display:flex;align-items:center;gap:.72rem;
  border-bottom:1px solid var(--border);
  letter-spacing:-.02em;
}
.logo-name{background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.logo-copy{display:flex;flex-direction:column;gap:.12rem;line-height:1;}
.logo-copy small{font-family:'JetBrains Mono',monospace;font-size:.56rem;color:var(--muted);text-transform:uppercase;letter-spacing:.14em;}

.sb-sec{
  padding:.95rem .95rem .38rem;
  font-size:.6rem;text-transform:uppercase;letter-spacing:.12em;
  color:var(--muted);font-family:'JetBrains Mono',monospace;
}
.sbi{
  display:flex;align-items:center;gap:.55rem;
  margin:0 .55rem .16rem;
  padding:.58rem .72rem;font-size:.78rem;
  cursor:pointer;color:var(--muted2);
  transition:color .15s,background .15s,border-color .15s,transform .15s;
  position:relative;-webkit-tap-highlight-color:transparent;
  border-radius:14px;
  border:1px solid transparent;
}
.sbi:hover{color:var(--text);background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.05);transform:translateX(2px);}
.sbi.on{color:var(--text);background:linear-gradient(180deg, rgba(167,139,250,.14), rgba(244,114,182,.06));border-color:rgba(167,139,250,.24);box-shadow:inset 0 1px 0 rgba(255,255,255,.06);}
.sbi.on::before{
  content:'';position:absolute;left:10px;top:50%;
  width:7px;height:7px;background:linear-gradient(135deg,var(--accent),var(--accent2));
  border-radius:999px;transform:translateY(-50%);
  box-shadow:0 0 18px rgba(167,139,250,.55);
}
.sbi-ic{font-size:.82rem;width:18px;text-align:center;flex-shrink:0;opacity:.92;margin-left:14px;}
.sbi-lbl{flex:1;}
.sbi-cnt{
  font-family:'JetBrains Mono',monospace;font-size:.6rem;
  background:rgba(167,139,250,.12);color:var(--accent);
  padding:.14rem .42rem;border-radius:999px;
}
.sbi-del{opacity:0;font-size:.6rem;color:var(--red);padding:0 .1rem;background:none;border:none;cursor:pointer;transition:opacity .15s;}
.sbi:hover .sbi-del{opacity:1;}

.sb-new{margin:.28rem .65rem .6rem;display:flex;gap:.38rem;}
.sb-new input{flex:1;font-size:.72rem;padding:.34rem .5rem;border-radius:8px;background:var(--surface2);color:var(--text);}
.sb-new button{
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#fff;border:none;border-radius:10px;padding:.34rem .68rem;
  cursor:pointer;font-size:.85rem;font-weight:700;
}

.sb-foot{
  margin:1rem .75rem .75rem;padding:1rem;
  border:1px solid var(--border);
  border-radius:18px;
  font-family:'JetBrains Mono',monospace;font-size:.62rem;
  color:var(--muted);display:flex;flex-direction:column;gap:.5rem;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
}
.sb-foot strong{color:var(--text);}

/* ── MAIN ── */
.main{flex:1;min-width:0;display:flex;flex-direction:column;}

header{
  position:sticky;top:0;z-index:100;
  background:rgba(8,8,16,.72);
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  border-bottom:1px solid var(--border);
  padding:0 1.8rem;
}
.hdr{display:flex;align-items:center;justify-content:space-between;height:74px;gap:1rem;}
.hdr-left{display:flex;align-items:center;gap:.95rem;min-width:0;}
.hdr-title{
  font-size:1.22rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.03em;
  font-family:'Space Grotesk',sans-serif;
}
.sync{font-family:'JetBrains Mono',monospace;font-size:.6rem;opacity:0;transition:opacity .5s;white-space:nowrap;}
.hdr-right{display:flex;gap:.6rem;align-items:center;flex-shrink:0;}
.hdr-right select, .hdr-right input { background: var(--surface2); color: var(--text); }

main{padding:1.7rem 1.8rem 2rem;flex:1;}
.page{display:none;animation:fadeUp .3s ease both;}
.page.on{display:block;}

.hero{
  position:relative;overflow:hidden;border-radius:28px;padding:1.5rem 1.5rem 1.35rem;margin-bottom:1.3rem;
  border:1px solid rgba(180,214,255,.14);
  background:
    radial-gradient(circle at 0% 0%, rgba(167,139,250,.18), transparent 32%),
    radial-gradient(circle at 100% 20%, rgba(244,114,182,.12), transparent 28%),
    linear-gradient(135deg, rgba(22,22,42,.94), rgba(12,12,24,.88));
  box-shadow:var(--shadow), inset 0 1px 0 rgba(255,255,255,.05);
}
.hero::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(135deg, rgba(255,255,255,.05), transparent 40%);
}
.hero-kicker{
  position:relative;z-index:1;display:inline-flex;align-items:center;gap:.45rem;margin-bottom:.8rem;
  padding:.32rem .65rem;border-radius:999px;border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);font-family:'JetBrains Mono',monospace;font-size:.62rem;color:var(--accent);
  text-transform:uppercase;letter-spacing:.12em;
}
.hero-title{
  position:relative;z-index:1;max-width:700px;margin-bottom:.55rem;
  font-family:'Space Grotesk',sans-serif;font-size:2.2rem;line-height:.96;font-weight:700;letter-spacing:-.05em;
}
.hero-copy{position:relative;z-index:1;max-width:720px;color:var(--muted2);font-size:.95rem;line-height:1.55;}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.4fr .9fr;gap:1rem;margin-top:1.2rem;}
.hero-panel{
  border:1px solid rgba(255,255,255,.07);border-radius:22px;padding:1rem 1.05rem;
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
}
.hero-panel h3{
  font-size:.68rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);
  font-family:'JetBrains Mono',monospace;margin-bottom:.9rem;font-weight:500;
}
.metric-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;}
.metric{
  padding:.9rem;border-radius:18px;background:rgba(8,8,16,.42);border:1px solid rgba(255,255,255,.06);
}
.metric strong{
  display:block;font-family:'Space Grotesk',sans-serif;font-size:1.6rem;line-height:1;color:var(--text);letter-spacing:-.04em;
}
.metric span{display:block;margin-top:.3rem;font-size:.7rem;color:var(--muted2);text-transform:uppercase;letter-spacing:.09em;font-family:'JetBrains Mono',monospace;}
.hero-notes{
  display:flex;flex-direction:column;gap:.7rem;justify-content:space-between;height:100%;
}
.hero-note{
  display:flex;justify-content:space-between;gap:.8rem;align-items:flex-end;padding-bottom:.6rem;border-bottom:1px dashed rgba(255,255,255,.08);
}
.hero-note:last-child{border-bottom:none;padding-bottom:0;}
.hero-note label{font-size:.7rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-family:'JetBrains Mono',monospace;}
.hero-note b{font-size:1rem;font-weight:600;color:var(--text);}
.hero-actions{display:flex;gap:.65rem;flex-wrap:wrap;margin-top:1rem;position:relative;z-index:1;}
.hero-btn{
  border:none;cursor:pointer;border-radius:999px;padding:.62rem .95rem;font-weight:600;
  font-size:.76rem;letter-spacing:-.01em;transition:transform .15s,opacity .15s,border-color .15s;
}
.hero-btn:hover{transform:translateY(-1px);opacity:.95;}
.hero-btn.primary{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;box-shadow:0 12px 26px rgba(167,139,250,.22);}
.hero-btn.secondary{background:rgba(255,255,255,.04);color:var(--text);border:1px solid var(--border2);}
.install-banner{
  margin-top:1rem;display:none;align-items:center;justify-content:space-between;gap:.8rem;
  padding:.85rem 1rem;border-radius:18px;border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);position:relative;z-index:1;
}
.install-banner strong{display:block;font-size:.82rem;font-weight:600;letter-spacing:-.02em;}
.install-banner span{display:block;color:var(--muted2);font-size:.72rem;line-height:1.4;margin-top:.18rem;}
.install-banner button{
  border:none;border-radius:999px;padding:.58rem .9rem;background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#fff;font-weight:700;font-size:.74rem;cursor:pointer;flex-shrink:0;
}
.quick-filters{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem;}
.qf{
  border:1px solid var(--border2);background:rgba(255,255,255,.03);color:var(--muted2);
  border-radius:999px;padding:.45rem .72rem;font-size:.72rem;cursor:pointer;transition:all .15s;
}
.qf.on,.qf:hover{color:var(--text);border-color:rgba(167,139,250,.34);background:rgba(167,139,250,.1);}

.section-shell{display:flex;flex-direction:column;gap:1rem;}
.section-card{
  border:1px solid var(--border);border-radius:24px;padding:1.2rem 1.25rem;
  background:linear-gradient(180deg, rgba(22,22,42,.76), rgba(12,12,24,.72));
  box-shadow:var(--shadow);
}
.section-head{display:flex;justify-content:space-between;gap:1rem;align-items:flex-end;margin-bottom:1rem;flex-wrap:wrap;}
.section-head h2{font-family:'Space Grotesk',sans-serif;font-size:1.35rem;letter-spacing:-.04em;}
.section-head p{max-width:640px;color:var(--muted2);font-size:.9rem;line-height:1.5;}

/* ── SEARCH BOX & SKELETONS ── */
.sbox{
  background:linear-gradient(180deg, rgba(21,34,56,.78), rgba(15,26,43,.72));
  border:1px solid var(--border);
  border-radius:24px;padding:1.25rem 1.3rem;margin-bottom:1.5rem;
  backdrop-filter:blur(14px);
  box-shadow:var(--shadow);
}
.sbox-hd{font-size:.64rem;text-transform:uppercase;letter-spacing:.12em;color:var(--accent);font-family:'JetBrains Mono',monospace;margin-bottom:.8rem;}
.srow{display:flex;gap:.5rem;margin-bottom:.75rem;}
.srow input{
  flex:1;font-size:.92rem;padding:.78rem 1rem;
  border-radius:16px;
  background:var(--surface2);
  border:1px solid var(--border2);
}
.srow input:focus{border-color:var(--accent);background:rgba(167,139,250,.07);}
.sbtn{
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#fff;border:none;border-radius:16px;
  padding:.62rem 1.2rem;font-weight:700;cursor:pointer;
  font-size:.82rem;transition:opacity .2s,transform .1s;
  white-space:nowrap;letter-spacing:-.01em;box-shadow:0 10px 25px rgba(167,139,250,.18);
}
.sbtn:hover{opacity:.9;transform:translateY(-1px);}
.sbtn:disabled{opacity:.4;cursor:not-allowed;transform:none;}

.skel-bg {
  background: linear-gradient(90deg, var(--surface2) 25%, var(--surface3) 50%, var(--surface2) 75%);
  background-size: 200% 100%;
  animation: skelShimmer 1.5s infinite linear;
}
@keyframes skelShimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
.skel-card { border: 1px solid var(--border); border-radius: 10px; overflow: hidden; background: var(--surface2); }
.skel-img { aspect-ratio: 2/3; width: 100%; }
.skel-txt { height: 10px; margin-top: 6px; border-radius: 4px; }

.rgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:.8rem;max-height:460px;overflow-y:auto;padding-right:6px;}
.rgrid::-webkit-scrollbar{width:3px;}.rgrid::-webkit-scrollbar-thumb{background:rgba(167,139,250,.24);}
.rc{
  background:linear-gradient(180deg, rgba(20,34,56,.94), rgba(13,24,40,.96));border:1px solid var(--border);
  border-radius:18px;overflow:hidden;cursor:pointer;
  transition:transform .18s,border-color .2s,box-shadow .2s;position:relative;
  box-shadow:0 14px 30px rgba(0,0,0,.22);
}
.rc:hover{transform:translateY(-4px);border-color:rgba(167,139,250,.35);box-shadow:0 18px 34px rgba(0,0,0,.34);}
.rc img,.rc-ph{width:100%;aspect-ratio:2/3;object-fit:cover;display:block;}
.rc-ph{background:var(--surface3);display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--muted);font-size:1.2rem;gap:.15rem;}
.rc-ph small{font-size:.44rem;text-transform:uppercase;font-family:'JetBrains Mono',monospace;}
.rc-info{padding:.68rem;}
.rc-title{font-size:.74rem;font-weight:600;line-height:1.35;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
.rc-year{font-family:'JetBrains Mono',monospace;font-size:.56rem;color:var(--muted);margin-top:4px;}
.rc-hover{position:absolute;inset:0;background:linear-gradient(180deg, rgba(7,17,31,.08), rgba(7,17,31,.84));display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s;font-size:1.3rem;}
.rc:hover .rc-hover{opacity:1;}

/* ── QUICK ADD / MODAL ── */
.qa{
  background:linear-gradient(135deg, rgba(125,211,252,.11), rgba(52,211,153,.08));
  border:1px solid rgba(125,211,252,.2);
  border-radius:20px;padding:1rem 1.1rem;margin-top:1rem;
  display:none;gap:.8rem;align-items:center;flex-wrap:wrap;
  box-shadow:0 16px 36px rgba(0,0,0,.18);
}
.qa.on{display:flex;}
.qa-info{flex:1;min-width:120px;}
.qa-info strong{font-size:1rem;font-weight:700;display:block;margin-bottom:.16rem;letter-spacing:-.02em;font-family:'Space Grotesk',sans-serif;}
.qa-info span{font-size:.62rem;color:var(--muted2);font-family:'JetBrains Mono',monospace;}
.qa-ctrls{display:flex;gap:.6rem;align-items:flex-end;flex-wrap:wrap;}

/* Clean Numeric Input */
.sw{display:flex;flex-direction:column;gap:.3rem;}
.sw-lbl{font-size:.58rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-family:'JetBrains Mono',monospace;}
.dec{
  width:80px;font-family:'JetBrains Mono',monospace;font-size:.9rem;
  color:var(--gold);text-align:center;
  padding:.3rem .4rem;
  background:rgba(251,191,36,.08);
  border:1px solid rgba(251,191,36,.3);
  border-radius:8px;font-weight:600;
}
.dec:focus{border-color:var(--gold);outline:none;background:rgba(251,191,36,.15);}
.dec::placeholder{color:var(--muted);font-weight:400;}

/* PROVIDERS (Streaming) */
.prov-box { display:flex; flex-direction:column; gap:.2rem; margin-top:.3rem; min-height:32px; justify-content:center; }
.prov-ic { width:32px; height:32px; border-radius:8px; border:1px solid rgba(255,255,255,.1); object-fit:cover; }
.prov-none { font-size:.7rem; color:var(--muted); font-family:'Inter',sans-serif; text-transform:none; letter-spacing:normal; }

/* ── CARD SCORE ── */
.cscore{display:flex;align-items:center;gap:3px;margin-bottom:.22rem;}
.cnum{
  font-family:'JetBrains Mono',monospace;font-size:.62rem;font-weight:600;
  color:var(--gold);
  background:rgba(251,191,36,.12);
  padding:.1rem .35rem;border-radius:4px;
}
.cnone{font-family:'JetBrains Mono',monospace;font-size:.6rem;color:var(--muted);}

/* ── TAGS ── */
.gtag{
  font-size:.52rem;padding:.08rem .28rem;border-radius:4px;
  font-family:'JetBrains Mono',monospace;text-transform:uppercase;
  background:rgba(167,139,250,.1);color:var(--accent);
}
.stag{font-size:.5rem;padding:.08rem .26rem;border-radius:4px;font-family:'JetBrains Mono',monospace;text-transform:uppercase;}
.sw2{background:rgba(52,211,153,.12);color:var(--green);}
.sp2{background:rgba(244,114,182,.12);color:var(--accent2);}

/* ── GRID ── */
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:1rem;}
.mc{
  background:linear-gradient(180deg, rgba(19,33,53,.90), rgba(12,23,39,.94));
  border:1px solid var(--border);
  border-radius:20px;overflow:hidden;cursor:pointer;
  transition:transform .2s,border-color .2s,box-shadow .2s;
  animation:cardIn .3s ease both;
  backdrop-filter:blur(10px);
  box-shadow:0 16px 34px rgba(0,0,0,.24);
}
.mc.status-watched{
  border-color:rgba(52,211,153,.2);
  box-shadow:0 16px 34px rgba(0,0,0,.24), inset 0 0 0 1px rgba(52,211,153,.08);
}
.mc.status-wishlist{
  border-color:rgba(244,114,182,.2);
  box-shadow:0 16px 34px rgba(0,0,0,.24), inset 0 0 0 1px rgba(244,114,182,.08);
}
.mc:hover{
  transform:translateY(-5px);
  border-color:rgba(167,139,250,.28);
  box-shadow:0 22px 46px rgba(0,0,0,.38),0 0 0 1px rgba(167,139,250,.08);
}
.mc-img{aspect-ratio:2/3;background:var(--surface2);position:relative;overflow:hidden;}
.mc-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s;}
.mc:hover .mc-img img{transform:scale(1.04);}
.mc-badges{
  position:absolute;top:.55rem;left:.55rem;right:.55rem;z-index:2;
  display:flex;align-items:flex-start;justify-content:space-between;gap:.4rem;
  pointer-events:none;
}
.mc-badge-col{display:flex;flex-direction:column;gap:.32rem;min-width:0;}
.mc-badge{
  display:inline-flex;align-items:center;gap:.28rem;align-self:flex-start;
  padding:.28rem .48rem;border-radius:999px;
  font-family:'JetBrains Mono',monospace;font-size:.54rem;font-weight:700;line-height:1;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(8,8,16,.74);backdrop-filter:blur(10px);
  box-shadow:0 8px 20px rgba(0,0,0,.28);
  white-space:nowrap;
}
.mc-badge.state-watched{
  color:var(--green);
  border-color:rgba(52,211,153,.26);
  background:rgba(4,24,19,.82);
}
.mc-badge.state-wishlist{
  color:#f9a8d4;
  border-color:rgba(244,114,182,.26);
  background:rgba(36,11,24,.82);
}
.mc-badge.rate-on{
  color:var(--gold);
  border-color:rgba(251,191,36,.28);
  background:rgba(34,25,4,.82);
}
.mc-badge.rate-off{
  color:var(--muted2);
}
.mc-ph{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--muted);font-size:1.8rem;gap:.35rem;}
.mc-ph small{font-size:.52rem;text-transform:uppercase;font-family:'JetBrains Mono',monospace;}
.mc-ov{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(8,8,16,.97) 0%,rgba(8,8,16,.3) 55%,transparent 100%);
  opacity:0;transition:opacity .25s;
  display:flex;align-items:flex-end;padding:.6rem;gap:.28rem;
}
.mc:hover .mc-ov{opacity:1;}
.mc-btn{
  flex:1;padding:.38rem .2rem;
  border:1px solid rgba(255,255,255,.12);
  border-radius:7px;
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(8px);
  color:var(--text);font-size:.58rem;cursor:pointer;
  text-align:center;transition:background .15s,border-color .15s;
  min-height:32px;display:flex;align-items:center;justify-content:center;
  font-weight:500;
  -webkit-tap-highlight-color:transparent;
}
.mc-btn:hover{background:rgba(255,255,255,.18);}
.mc-btn.del:hover{background:rgba(248,113,113,.2);border-color:var(--red);color:var(--red);}
.mc-btn.fav.on{background:rgba(251,191,36,.18);border-color:rgba(251,191,36,.4);color:var(--gold);}
.mc-info{padding:.8rem .78rem .82rem;}
.mc-title{
  font-size:.82rem;font-weight:600;line-height:1.35;margin-bottom:.3rem;
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  letter-spacing:-.01em;
}
.mc-overview{
  margin:.42rem 0 .55rem;
  font-size:.64rem;
  line-height:1.45;
  color:var(--muted2);
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  min-height:2.75em;
}
.mc-overview.empty{display:none;}
.mc-meta{display:flex;align-items:center;justify-content:space-between;gap:.25rem;flex-wrap:wrap;}
.mc-yr{font-family:'JetBrains Mono',monospace;font-size:.57rem;color:var(--muted);}

.sentinel{ height: 20px; width: 100%; margin-top: 10px; }

/* ── RANKING ── */
.rtabs{display:flex;gap:.45rem;flex-wrap:wrap;margin-bottom:1.3rem;}
.rtab{
  padding:.45rem .85rem;border-radius:999px;font-size:.7rem;
  cursor:pointer;border:1px solid var(--border2);color:var(--muted2);
  transition:all .15s;background:rgba(255,255,255,.02);font-family:'Inter',sans-serif;
  font-weight:500;
}
.rtab.on{
  background:linear-gradient(135deg, rgba(167,139,250,.24), rgba(244,114,182,.18));
  border-color:rgba(167,139,250,.26);color:var(--text);font-weight:600;
}
.rtab:hover:not(.on){border-color:var(--border2);color:var(--text);}

.rlist{display:flex;flex-direction:column;gap:.5rem;}
.ri{
  display:flex;align-items:center;gap:.9rem;
  background:linear-gradient(180deg, rgba(20,34,56,.88), rgba(12,23,39,.90));border:1px solid var(--border);
  border-radius:18px;padding:.85rem 1rem;cursor:pointer;
  transition:border-color .2s,box-shadow .2s,transform .15s;
  position:relative;overflow:hidden;
  backdrop-filter:blur(6px);
}
.ri:hover{border-color:rgba(167,139,250,.28);box-shadow:0 14px 28px rgba(0,0,0,.25);transform:translateX(4px);}
.ri::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;}
.ri.g1::before{background:linear-gradient(180deg,#fbbf24,#f59e0b);}
.ri.g2::before{background:linear-gradient(180deg,#d1d5db,#9ca3af);}
.ri.g3::before{background:linear-gradient(180deg,#cd7f32,#92400e);}
.ri-num{font-family:'JetBrains Mono',monospace;font-size:.95rem;width:28px;text-align:center;flex-shrink:0;color:var(--muted);}
.ri-num.g1{color:#fbbf24;font-size:1.1rem;}
.ri-num.g2{color:#d1d5db;font-size:1.1rem;}
.ri-num.g3{color:#cd7f32;font-size:1.1rem;}
.ri-img{width:36px;height:54px;border-radius:6px;object-fit:cover;flex-shrink:0;background:var(--surface2);}
.ri-ph{width:36px;height:54px;border-radius:6px;background:var(--surface2);display:flex;align-items:center;justify-content:center;font-size:.9rem;flex-shrink:0;}
.ri-info{flex:1;min-width:0;}
.ri-title{font-size:.88rem;font-weight:600;line-height:1.3;margin-bottom:.18rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.01em;}
.ri-meta{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;}
.ri-yr{font-family:'JetBrains Mono',monospace;font-size:.6rem;color:var(--muted);}
.ri-rtype{
  font-family:'JetBrains Mono',monospace;
  font-size:.56rem;
  color:var(--accent3);
  background:rgba(56,189,248,.12);
  border:1px solid rgba(56,189,248,.2);
  padding:.12rem .36rem;
  border-radius:999px;
}
.ri-rtype.fallback{
  color:var(--gold);
  background:rgba(251,191,36,.12);
  border-color:rgba(251,191,36,.22);
}
.ri-score{flex-shrink:0;text-align:right;}
.ri-num2{font-family:'JetBrains Mono',monospace;font-size:1.3rem;font-weight:600;color:var(--gold);line-height:1;background:rgba(251,191,36,.1);padding:.2rem .4rem;border-radius:6px;}

.rempty{text-align:center;padding:3rem 1.5rem;color:var(--muted);}
.rempty .ei{font-size:2.2rem;margin-bottom:.7rem;opacity:.3;}
.rempty h3{font-size:.95rem;font-weight:400;opacity:.4;color:var(--text);}
.rempty p{font-size:.7rem;opacity:.35;margin-top:.25rem;}

/* ── MODAL ── */
.mbg{
  position:fixed;inset:0;
  background:rgba(0,0,0,.75);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  z-index:200;display:flex;align-items:center;justify-content:center;
  padding:1rem;opacity:0;pointer-events:none;transition:opacity .25s;
}
.mbg.on{opacity:1;pointer-events:all;}
.modal{
  background:linear-gradient(180deg, rgba(12,23,39,.98), rgba(10,18,30,.98));
  border:1px solid rgba(255,255,255,.1);
  border-radius:20px;width:100%;max-width:620px;max-height:90vh;
  overflow-y:auto;
  transform:translateY(16px) scale(.97);
  transition:transform .25s;
  display:flex;
  box-shadow:0 32px 80px rgba(0,0,0,.8),0 0 0 1px rgba(167,139,250,.1);
}
.mbg.on .modal{transform:none;}
.m-img{width:130px;flex-shrink:0;border-radius:20px 0 0 20px;overflow:hidden;background:var(--surface2);}
.m-img img{width:100%;height:100%;object-fit:cover;display:block;}
.m-img-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:2rem;color:var(--muted);}
.m-body{flex:1;padding:1.3rem;overflow-y:auto;}
.m-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:.95rem;gap:.5rem;}
.m-title{font-size:1.1rem;font-weight:700;line-height:1.2;margin-bottom:.16rem;letter-spacing:-.02em;}
.m-sub{font-family:'JetBrains Mono',monospace;font-size:.62rem;color:var(--muted2);}
.m-story{
  margin-bottom:1rem;
  padding:.9rem 1rem;
  border:1px solid rgba(255,255,255,.07);
  border-radius:16px;
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
}
.m-overview{
  font-size:.79rem;
  line-height:1.6;
  color:var(--text);
}
.m-overview.empty{color:var(--muted2);}
.m-facts{
  display:flex;
  flex-wrap:wrap;
  gap:.4rem;
  margin-top:.75rem;
}
.m-fact{
  display:inline-flex;
  align-items:center;
  gap:.3rem;
  padding:.28rem .56rem;
  border-radius:999px;
  background:rgba(167,139,250,.12);
  border:1px solid rgba(167,139,250,.22);
  color:var(--text);
  font-size:.62rem;
  font-family:'JetBrains Mono',monospace;
}
.m-fact.muted{
  background:rgba(255,255,255,.04);
  border-color:rgba(255,255,255,.08);
  color:var(--muted2);
}
.m-cast-block{margin-top:.85rem;}
.m-cast-block label{
  display:block;
  font-size:.6rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--muted);
  font-family:'JetBrains Mono',monospace;
  margin-bottom:.42rem;
}
.m-cast{
  display:flex;
  flex-wrap:wrap;
  gap:.42rem;
}
.m-person{
  display:inline-flex;
  align-items:center;
  padding:.3rem .62rem;
  border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  color:var(--text);
  font-size:.69rem;
}
.m-cast-empty{
  font-size:.72rem;
  color:var(--muted2);
}
.bx{
  background:rgba(255,255,255,.06);border:1px solid var(--border2);
  color:var(--muted2);width:26px;height:26px;border-radius:8px;
  cursor:pointer;font-size:.75rem;flex-shrink:0;
  transition:color .15s,background .15s;
  display:flex;align-items:center;justify-content:center;
}
.bx:hover{color:var(--text);background:rgba(255,255,255,.12);}
.mf{margin-bottom:.82rem;}
.mf label{
  display:block;font-size:.6rem;text-transform:uppercase;
  letter-spacing:.08em;color:var(--muted);
  font-family:'JetBrains Mono',monospace;margin-bottom:.3rem;
}
textarea{resize:vertical;min-height:60px;}
.mfoot{display:flex;gap:.45rem;margin-top:.95rem;}
.bsave{
  flex:1;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#fff;border:none;border-radius:12px;
  padding:.56rem;font-weight:600;cursor:pointer;font-size:.84rem;
  transition:opacity .2s;
}
.bsave:hover{opacity:.9;}
.bdel{
  background:none;border:1px solid rgba(248,113,113,.25);
  color:var(--red);border-radius:10px;padding:.56rem .8rem;
  cursor:pointer;font-size:.74rem;transition:background .2s;
}
.bdel:hover{background:rgba(248,113,113,.1);}
.lchips{display:flex;flex-wrap:wrap;gap:.32rem;}
.lchip{
  padding:.24rem .58rem;border-radius:20px;font-size:.67rem;
  cursor:pointer;border:1px solid var(--border2);color:var(--muted2);
  transition:all .15s;background:none;font-family:'Inter',sans-serif;
}
.lchip.on{
  background:rgba(167,139,250,.15);
  border-color:rgba(167,139,250,.4);
  color:var(--accent);
}

/* ── CONFIRM ── */
.cfmbg{position:fixed;inset:0;background:rgba(0,0,0,.75);z-index:300;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .2s;}
.cfmbg.on{opacity:1;pointer-events:all;}
.cfm{
  background:rgba(15,15,26,.98);
  border:1px solid rgba(255,255,255,.1);
  border-radius:16px;padding:1.5rem;max-width:290px;width:100%;
  text-align:center;
  box-shadow:0 20px 60px rgba(0,0,0,.8);
}
.cfm strong{display:block;font-size:.95rem;font-weight:700;color:var(--text);margin-bottom:.4rem;letter-spacing:-.01em;}
.cfm p{font-size:.8rem;margin-bottom:1rem;color:var(--muted2);}
.cfm-btns{display:flex;gap:.4rem;justify-content:center;}

/* Se fuerza el fondo oscuro a todos los inputs globales para evitar el blanco en macOS/iOS/Windows */
input,select,textarea{
  background:var(--surface2);
  border:1px solid var(--border2);
  border-radius:14px;color:var(--text);
  font-family:'Inter',sans-serif;font-size:16px;
  padding:.5rem .8rem;outline:none;
  transition:border-color .2s,background .2s;width:100%;
  -webkit-appearance:none;
}
input:focus,select:focus,textarea:focus{border-color:var(--accent);background:rgba(167,139,250,.06);}
input::placeholder{color:var(--muted);}
select option{background:#0f0f1a; color:var(--text);}

.empty{grid-column:1/-1;text-align:center;padding:3.8rem 2rem;color:var(--muted);border:1px dashed rgba(255,255,255,.08);border-radius:24px;background:rgba(255,255,255,.02);}
.empty .ei{font-size:2.4rem;margin-bottom:.8rem;opacity:.3;}
.empty h3{font-size:.95rem;font-weight:400;color:var(--text);opacity:.4;}

.spin{display:inline-block;width:14px;height:14px;border:2px solid rgba(167,139,250,.2);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite;vertical-align:middle;}
.nores{text-align:center;padding:1.3rem;color:var(--muted);font-size:.78rem;border:1px dashed var(--border2);border-radius:10px;}
.toast{
  position:fixed;bottom:1.5rem;right:1.5rem;
  background:rgba(22,22,42,.98);
  border:1px solid rgba(167,139,250,.3);
  color:var(--text);padding:.6rem 1rem;
  border-radius:10px;font-size:.74rem;z-index:400;
  transform:translateY(100px);opacity:0;
  transition:transform .3s cubic-bezier(.32,.72,0,1),opacity .3s;
  font-family:'JetBrains Mono',monospace;
  box-shadow:0 8px 24px rgba(0,0,0,.5);
}
.toast.on{transform:none;opacity:1;}

@keyframes spin{to{transform:rotate(360deg);}}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
@keyframes cardIn{from{opacity:0;transform:scale(.94);}to{opacity:1;transform:none;}}

::-webkit-scrollbar{width:5px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:rgba(167,139,250,.2);border-radius:3px;}

/* ── BOTTOM NAV BASE ── */



/* WATCHING STATUS */
.mc.status-watching{border-color:rgba(56,189,248,.22);box-shadow:0 16px 34px rgba(0,0,0,.24), inset 0 0 0 1px rgba(56,189,248,.08);}
.mc-badge.state-watching{color:var(--accent3);border-color:rgba(56,189,248,.26);background:rgba(8,20,34,.82);}
.sw3{background:rgba(56,189,248,.12);color:var(--accent3);}
.mc-progress{position:absolute;bottom:0;left:0;right:0;height:3px;background:rgba(255,255,255,.08);z-index:3;}
.mc-progress-bar{height:100%;border-radius:0 2px 2px 0;background:linear-gradient(90deg,var(--accent3),var(--accent));transition:width .3s ease;}
.mc-progress-text{position:absolute;bottom:6px;right:6px;z-index:3;font-family:'JetBrains Mono',monospace;font-size:.48rem;color:var(--accent3);background:rgba(8,8,16,.78);padding:.14rem .32rem;border-radius:4px;backdrop-filter:blur(6px);border:1px solid rgba(56,189,248,.18);}
.mf-minute-row{display:none;}
.mf-minute-row.visible{display:block;}
.mf-minute{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;}
.mf-time-part{display:flex;align-items:center;gap:.35rem;}
.mf-minute input{width:90px;font-family:'JetBrains Mono',monospace;font-size:.85rem;color:var(--accent3);text-align:center;background:rgba(56,189,248,.08);border:1px solid rgba(56,189,248,.25);border-radius:8px;padding:.32rem .5rem;}
.mf-minute input:focus{border-color:var(--accent3);background:rgba(56,189,248,.14);}
.mf-minute span{font-size:.72rem;color:var(--muted2);}

.bottom-nav{display:none;}
@media(max-width:768px){
  .sidebar{display:none;}
  .app{flex-direction:column;}
  .main{flex:1;display:flex;flex-direction:column;min-height:0;}
  header{padding:env(safe-area-inset-top) .8rem 0;}
  .hdr{min-height:auto;height:auto;padding:8px 0;flex-wrap:wrap;gap:.4rem;}
  .hdr-left{width:100%;flex-shrink:1;min-width:0;}
  .hdr-title{font-size:.88rem;}
  .hdr-right{width:100%;gap:.35rem;justify-content:flex-start;}
  .hdr-right select{font-size:.68rem;padding:.26rem .45rem;max-width:120px;flex-shrink:0;}
  .hdr-right input{max-width:none !important;flex:1;font-size:.68rem;padding:.26rem .45rem;}
  main{padding:.7rem .8rem 0;padding-bottom:calc(92px + env(safe-area-inset-bottom));}
  .hero{padding:1rem .9rem .9rem;border-radius:20px;margin-bottom:1rem;}
  .hero-kicker{font-size:.56rem;padding:.24rem .5rem;margin-bottom:.55rem;}
  .hero-title{font-size:1.35rem;line-height:1.05;margin-bottom:.4rem;}
  .hero-copy{font-size:.78rem;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
  .hero-grid{grid-template-columns:1fr;gap:.65rem;margin-top:.85rem;}
  .hero-panel{padding:.75rem .8rem;border-radius:16px;}
  .hero-panel h3{font-size:.58rem;margin-bottom:.6rem;}
  .metric-row{grid-template-columns:repeat(3,1fr);gap:.45rem;}
  .metric{padding:.6rem .5rem;border-radius:12px;}
  .metric strong{font-size:1.25rem;}
  .metric span{font-size:.55rem;margin-top:.2rem;}
  .hero-note{padding-bottom:.4rem;gap:.5rem;}
  .hero-note label{font-size:.58rem;}
  .hero-note b{font-size:.82rem;}
  .hero-actions{gap:.4rem;margin-top:.7rem;}
  .hero-btn{flex:1;justify-content:center;text-align:center;font-size:.68rem;padding:.5rem .6rem;}
  .quick-filters{overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap;padding-bottom:.2rem;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
  .quick-filters::-webkit-scrollbar{display:none;}
  .qf{white-space:nowrap;font-size:.66rem;padding:.36rem .6rem;flex-shrink:0;}
  .section-card{padding:.85rem .9rem;border-radius:18px;}
  .sbox{padding:.8rem .85rem;border-radius:16px;margin-bottom:.9rem;}
  .qa{flex-direction:column;align-items:stretch;gap:.6rem;padding:.75rem .8rem;border-radius:16px;}
  .qa-ctrls{flex-direction:column;gap:.55rem;}
  .mgrid{grid-template-columns:repeat(3,1fr);gap:.55rem;}
  .mc{border-radius:14px;}
  .mc-badges{top:.3rem;left:.3rem;right:.3rem;gap:.18rem;flex-direction:column;align-items:flex-start;}
  .mc-badge-col{gap:.18rem;}
  .mc-badge{padding:.16rem .3rem;font-size:.42rem;}
  .mc-info{padding:.5rem .45rem .55rem;}
  .mc-title{font-size:.66rem;margin-bottom:.2rem;}
  .mc-overview{-webkit-line-clamp:2;min-height:0;font-size:.56rem;margin:.28rem 0 .35rem;}
  .mc-yr{font-size:.5rem;}
  .gtag{font-size:.44rem;padding:.04rem .22rem;}
  .stag{font-size:.42rem;padding:.04rem .2rem;}
  .cscore{margin-bottom:.14rem;}
  .cnum{font-size:.54rem;padding:.06rem .26rem;}
  .rtabs{gap:.28rem;}
  .rtab{font-size:.62rem;padding:.26rem .5rem;}
  .ri{gap:.55rem;padding:.52rem .65rem;border-radius:14px;}
  .ri-title{font-size:.78rem;}
  .ri-num2{font-size:1.05rem;padding:.16rem .32rem;}
  .mbg{padding:0;align-items:flex-end;}
  .modal{flex-direction:column;border-radius:22px 22px 0 0;max-width:100%;max-height:92vh;width:100%;}
  .m-img{width:100%;height:150px;border-radius:22px 22px 0 0;}
  .m-img img{object-position:center 20%;}
  .m-body{padding:1rem 1.1rem;padding-bottom:calc(1.1rem + env(safe-area-inset-bottom));}
  .m-title{font-size:1rem;}
  .m-story{padding:.7rem .8rem;border-radius:12px;}
  .m-overview{font-size:.72rem;}
  .mf{margin-bottom:.65rem;}
  .toast{bottom:calc(84px + env(safe-area-inset-bottom));right:.8rem;left:.8rem;text-align:center;}
  .bottom-nav{display:flex;position:fixed;bottom:12px;left:14px;right:14px;background:rgba(10,20,34,.7);backdrop-filter:blur(28px) saturate(1.6);-webkit-backdrop-filter:blur(28px) saturate(1.6);border:1px solid rgba(255,255,255,.13);border-radius:100px;z-index:150;padding:6px;gap:3px;box-shadow:0 8px 40px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.1),inset 0 -1px 0 rgba(0,0,0,.2);width:auto;max-width:none;margin:0;}
  .bn-inner{display:flex;align-items:center;justify-content:space-between;width:100%;}
  .bn-tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer;color:var(--muted2);transition:color .2s;font-size:.54rem;font-family:'Inter',sans-serif;font-weight:500;border:none;background:none;-webkit-tap-highlight-color:transparent;padding:7px 3px;min-height:48px;}
  .bn-tab.on{color:var(--text);}
  .bn-ic-wrap{width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:100px;padding:3px;transition:all .3s cubic-bezier(.34,1.56,.64,1);}
  .bn-tab.on .bn-ic-wrap{background:linear-gradient(135deg,var(--accent),var(--accent2));box-shadow:0 4px 14px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.25);}
  .bn-ic{font-size:1.1rem;line-height:1;transition:transform .2s;}
  .bn-tab.on .bn-ic{transform:scale(1.08);}
  body.browser-mobile .install-banner{display:flex;}
  body.standalone-mode header{padding-top:calc(env(safe-area-inset-top) + .2rem);background:rgba(8,8,16,.92);}
  body.standalone-mode .hdr{min-height:auto;}
  body.standalone-mode .hero{padding:.85rem .85rem .8rem;border-radius:18px;}
  body.standalone-mode .hero-copy{display:none;}
  body.standalone-mode .install-banner{display:none !important;}
  body.standalone-mode .bottom-nav{bottom:8px;left:10px;right:10px;background:rgba(16,16,26,.86);}
  body.browser-mobile .bottom-nav{bottom:14px;left:14px;right:14px;}
}
@media(max-width:380px){
  .mgrid{grid-template-columns:repeat(2,1fr);gap:.5rem;}
  .hero-title{font-size:1.15rem;}
  .hero-copy{display:none;}
}
@media(min-width:769px) and (max-width:1024px){
  .sidebar{width:200px;}
  .sbi{padding:.46rem .58rem;font-size:.72rem;margin:0 .4rem .12rem;}
  header{padding:0 1.2rem;}
  main{padding:1.2rem 1.3rem 1.5rem;}
  .hero-title{font-size:1.7rem;}
  .hero-grid{grid-template-columns:1.2fr 1fr;gap:.8rem;}
  .mgrid{grid-template-columns:repeat(auto-fill,minmax(125px,1fr));gap:.8rem;}
  .modal{max-width:560px;}
  .m-img{width:110px;}
}
@media(min-width:769px){.bottom-nav{display:none;}}
.mc.status-watching{border-color:rgba(56,189,248,.22);box-shadow:0 16px 34px rgba(0,0,0,.24), inset 0 0 0 1px rgba(56,189,248,.08);}
.mc-badge.state-watching{color:var(--accent3);border-color:rgba(56,189,248,.26);background:rgba(8,20,34,.82);}
.sw3{background:rgba(56,189,248,.12);color:var(--accent3);}
.mc-progress{position:absolute;bottom:0;left:0;right:0;height:3px;background:rgba(255,255,255,.08);z-index:3;}
.mc-progress-bar{height:100%;border-radius:0 2px 2px 0;background:linear-gradient(90deg,var(--accent3),var(--accent));transition:width .3s ease;}
.mc-progress-text{position:absolute;bottom:6px;right:6px;z-index:3;font-family:'JetBrains Mono',monospace;font-size:.48rem;color:var(--accent3);background:rgba(8,8,16,.78);padding:.14rem .32rem;border-radius:4px;backdrop-filter:blur(6px);border:1px solid rgba(56,189,248,.18);}
.mf-minute-row{display:none;}
.mf-minute-row.visible{display:block;}
.mf-minute{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;}
.mf-time-part{display:flex;align-items:center;gap:.35rem;}
.mf-minute input{width:90px;font-family:'JetBrains Mono',monospace;font-size:.85rem;color:var(--accent3);text-align:center;background:rgba(56,189,248,.08);border:1px solid rgba(56,189,248,.25);border-radius:8px;padding:.32rem .5rem;}
.mf-minute input:focus{border-color:var(--accent3);background:rgba(56,189,248,.14);}
.mf-minute span{font-size:.72rem;color:var(--muted2);}
.bottom-nav{display:none;}}

/* ── LOGIN ── */
#login-screen{
  position:fixed;inset:0;
  background:var(--bg);z-index:1000;
  display:flex;align-items:center;justify-content:center;
  flex-direction:column;gap:1.5rem;
  padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}
#login-screen::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 70% 60% at 30% 20%,rgba(167,139,250,.08) 0%,transparent 60%),
    radial-gradient(ellipse 50% 50% at 80% 80%,rgba(244,114,182,.06) 0%,transparent 50%);
  pointer-events:none;
}
.login-box{
  background:linear-gradient(180deg, rgba(11,20,34,.94), rgba(9,18,31,.92));
  border:1px solid rgba(255,255,255,.1);
  border-radius:20px;padding:2.2rem 2.4rem;
  width:100%;max-width:340px;
  display:flex;flex-direction:column;gap:1rem;
  box-shadow:0 32px 80px rgba(0,0,0,.6),0 0 0 1px rgba(125,211,252,.08);
  backdrop-filter:blur(20px);
  position:relative;
}
.login-logo{font-size:1.5rem;font-weight:800;text-align:center;margin-bottom:.3rem;letter-spacing:-.03em;}
.login-logo .logo-g{background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.login-logo small{display:block;font-family:'JetBrains Mono',monospace;font-size:.62rem;color:var(--muted);margin-top:.25rem;font-style:normal;font-weight:400;}

.google-btn {
  background: #ffffff;
  color: #3c4043;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  font-family: 'Inter', sans-serif;
  font-weight: 500 !important;
  border: 1px solid #dadce0 !important;
  margin-bottom: 0.2rem;
}
.google-btn:hover { background: #f8f9fa; opacity: 1 !important; transform: none !important; }
.or-divider {
  text-align: center;
  color: var(--muted);
  font-size: 0.75rem;
  margin: 0.4rem 0;
  position: relative;
}
.or-divider::before, .or-divider::after {
  content: ''; position: absolute; top: 50%; width: 35%; height: 1px; background: var(--border2);
}
.or-divider::before { left: 0; }
.or-divider::after { right: 0; }

.linp{
  background:rgba(255,255,255,.05);
  border:1px solid var(--border2);
  border-radius:10px;color:var(--text);
  font-family:'Inter',sans-serif;font-size:.9rem;
  padding:.62rem .9rem;outline:none;width:100%;
  transition:border-color .2s,background .2s;
  -webkit-appearance:none;
}
.linp:focus{border-color:var(--accent);background:rgba(167,139,250,.06);}
.linp::placeholder{color:var(--muted);}
.lbtn{
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#fff;border:none;border-radius:10px;
  padding:.68rem;font-weight:700;cursor:pointer;
  font-size:.92rem;width:100%;font-family:'Inter',sans-serif;
  transition:opacity .2s,transform .1s;letter-spacing:-.01em;
}
.lbtn:hover{opacity:.9;transform:translateY(-1px);}
.lerr{color:var(--red);font-size:.74rem;font-family:'JetBrains Mono',monospace;text-align:center;min-height:18px;}

.more-menu{
  position:fixed;bottom:0;left:0;right:0;
  background:rgba(15,15,26,.98);
  border-top:1px solid var(--border);
  border-radius:20px 20px 0 0;z-index:200;
  transform:translateY(100%);transition:transform .3s cubic-bezier(.32,.72,0,1);
  padding-bottom:env(safe-area-inset-bottom);
  backdrop-filter:blur(20px);
}
.more-menu.on{transform:none;}
.more-menu-hd{
  padding:.95rem 1.3rem .5rem;
  font-family:'JetBrains Mono',monospace;font-size:.6rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);
  display:flex;justify-content:space-between;align-items:center;
}
.more-menu-hd button{background:none;border:none;color:var(--muted);font-size:1.1rem;cursor:pointer;padding:.2rem;}
.mm-item{
  display:flex;align-items:center;gap:.75rem;padding:.75rem 1.4rem;
  font-size:.88rem;cursor:pointer;color:var(--text);
  border:none;background:none;width:100%;text-align:left;
  -webkit-tap-highlight-color:transparent;font-family:'Inter',sans-serif;
}
.mm-item:active{background:rgba(255,255,255,.04);}
.mm-item .mm-ic{font-size:1.1rem;width:22px;text-align:center;}
.mm-item .mm-cnt{margin-left:auto;font-family:'JetBrains Mono',monospace;font-size:.62rem;color:var(--muted);background:rgba(167,139,250,.1);padding:.05rem .32rem;border-radius:20px;}
.mm-sep{height:1px;background:var(--border);margin:.3rem 0;}
.mm-overlay{position:fixed;inset:0;z-index:199;display:none;}
.mm-overlay.on{display:block;}
.mm-new{display:flex;gap:.4rem;padding:.5rem 1.4rem .85rem;align-items:center;}
.mm-new input{flex:1;font-size:.82rem;padding:.44rem .7rem;border-radius:8px;background:var(--surface2);color:var(--text);}
.mm-new button{
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#fff;border:none;border-radius:8px;padding:.44rem .7rem;cursor:pointer;font-weight:700;font-size:.85rem;
}