:root {
  --bg: #050506;
  --surface: #09090c;
  --surface-2: #0d0d11;
  --surface-3: #121217;
  --line: rgba(255,255,255,.09);
  --line-strong: rgba(255,255,255,.16);
  --text: #fff8f8;
  --muted: #918b91;
  --brand: #ff334b;
  --brand-2: #ff5a4f;
  --red-glow: rgba(255,42,67,.28);
  --green: #35dbab;
  --radius: 13px;
  --shadow: 0 22px 70px rgba(0,0,0,.42);
}

html, body { background:#050506; color:var(--text); }
body { background:radial-gradient(circle at 48% -20%,rgba(121,12,26,.17),transparent 34rem),#050506; }
.ambient { display:none; }
.topbar { height:64px; border-color:rgba(255,255,255,.075); background:rgba(5,5,6,.88); }
.topbar-inner { padding:0 20px; gap:9px; }
.brand-mark,.auth-logo { background:linear-gradient(145deg,#ff5664,#b70f2a); box-shadow:0 0 28px rgba(255,39,67,.24); }
.brand-copy strong { color:#fff; }
.brand-copy small { color:#a69ba0; }
.main-nav button.active { background:rgba(255,48,70,.12); color:#ffd9dc; }
.main-nav button:hover { color:#fff; }
.topbar-add-title,.library-alerts-button,.online-signout {
  border-color:rgba(255,62,82,.42)!important;
  background:rgba(255,42,66,.035)!important;
  color:#ffb6bd!important;
  box-shadow:inset 0 0 16px rgba(255,32,55,.035),0 0 0 transparent;
}
.topbar-add-title:hover,.library-alerts-button:hover,.online-signout:hover {
  border-color:#ff5365!important; background:rgba(255,42,66,.11)!important;
  color:#fff!important; box-shadow:0 0 20px rgba(255,36,60,.13);
}
.page { padding:27px 20px 52px; }
.page-heading,.home-heading,.library-heading,.discover-heading { margin-bottom:20px; }
.page-heading h1,.home-heading h1,.library-heading h1,.discover-heading h1,.add-title-intro h1 {
  color:#fff; font-size:clamp(30px,2.45vw,45px); letter-spacing:-.055em;
}
.eyebrow { color:#ff7d87!important; }
.section { margin-top:25px; }
.section-header { margin-bottom:10px; }

/* Containers disappear into the page; controls remain clearly interactive. */
.panel,.form-panel,.dashboard-panel,.settings-card,.unified-add-panel,
.library-toolbar,.discover-category-bar,.rich-detail-hero,.detail-hero,
.episode-season-row,.season-row,.movie-progress-card,.more-title-info,
.media-info-section,.about-title-section {
  border-color:rgba(255,255,255,.075); background:rgba(11,11,14,.72); box-shadow:none;
}
.library-toolbar { padding:14px; }
.library-overview { border-color:rgba(255,255,255,.075); background:transparent; }
.library-overview-item { border-color:rgba(255,255,255,.075); padding:11px 14px; }
.library-overview-icon { background:rgba(255,42,65,.09); color:#ff6573; }
.input,.select,.search-field input,.tmdb-search-field input,.library-search-fields input,.library-select-shell select {
  height:42px; border-color:rgba(255,255,255,.11); background:#08080b;
}
.input:focus,.select:focus,.search-field input:focus,.tmdb-search-field input:focus {
  border-color:#f43b52; box-shadow:0 0 0 3px rgba(244,59,82,.1);
}
.button,.icon-button,.choice-button,.filter-chip,.back-button {
  min-height:37px; border-color:rgba(255,255,255,.11); border-radius:10px; background:#0b0b0f;
}
.button:hover,.icon-button:hover,.choice-button:hover,.filter-chip:hover,.back-button:hover {
  border-color:rgba(255,70,90,.65); background:rgba(255,40,64,.075); box-shadow:0 0 18px rgba(255,35,60,.08);
}
.button-primary,.library-open-action {
  border:1px solid #ff4b60!important; background:linear-gradient(135deg,#f8324d,#ac0b27)!important;
  color:#fff!important; box-shadow:0 8px 24px rgba(229,24,52,.18)!important;
}
.choice-button.active,.filter-chip.active { border-color:#f4495e; background:rgba(244,51,76,.14); color:#ffd8dc; }
.status-pill.upcoming,.library-status { border-color:rgba(255,71,91,.28); background:rgba(255,41,64,.08); color:#ff9ca5; }

.continue-group { margin-top:22px; }
.continue-group-heading { margin-bottom:10px; }
.continue-group-heading>div:first-child { border-color:rgba(255,70,90,.25); background:rgba(255,40,60,.05); color:#ff6b78; }
.continue-grid { gap:12px; }
.continue-card { min-height:218px; border-color:rgba(255,255,255,.13); background:#0b0b0f; box-shadow:none; }
.continue-card:hover { border-color:rgba(255,75,94,.52); box-shadow:0 16px 42px rgba(0,0,0,.36),0 0 24px rgba(255,25,50,.055); }
.continue-card.ready { border-color:rgba(53,219,171,.44); box-shadow:inset 0 2px #35dbab; }
.continue-card-main { padding:14px; }
.continue-card-artwork { background:#050506; }
.continue-title { margin:8px 0 7px; }
.continue-progress-panel { padding:8px 0; }
.continue-card-progress,.progress-track,.library-progress { background:#242126; }
.continue-card-progress span,.progress-track span,.library-progress span { background:linear-gradient(90deg,#ed2442,#ff6154); }
.continue-release-line { padding-top:8px; }

.discover-grid { gap:10px; }
.discover-card,.library-card { border-color:rgba(255,255,255,.085); background:#0b0b0f; }
.discover-card:hover,.library-card:hover { border-color:rgba(255,73,94,.45); box-shadow:0 14px 34px rgba(0,0,0,.34); }
.discover-card-body { min-height:145px; padding:10px; }
.library-list { gap:11px; }
.library-card>div:not(.library-progress) { padding:11px; }
.library-progress { margin:7px 11px; }
.library-open-action { margin:auto 11px 11px; }

.unified-result,.tmdb-results>button,.add-progress-season,.preview-compact-season-row,
.episode-compact-card,.episode-info-card,.modal,.modal-header,.modal-close {
  border-color:rgba(255,255,255,.1); background:#0b0b0f;
}
.unified-result:hover { border-color:rgba(255,73,94,.52); background:#111014; }
.unified-selection-card { border-color:rgba(255,67,87,.35); background:#0d0c10; }
.episode-compact-card:hover { border-color:#e84257; }
.media-tagline { color:#ffb4ba; }
.modal-backdrop { background:rgba(0,0,0,.82); }
.toast { border-color:rgba(255,255,255,.13); background:#0d0d11; }
.skeleton,.discover-loading-card,.library-skeleton { background:linear-gradient(90deg,#09090c,#151217,#09090c); background-size:240% 100%; }
.loading-bar,.page-loading { display:none!important; }

.auth-gate { background:radial-gradient(circle at center,rgba(135,9,27,.16),transparent 28rem),#050506; }
.auth-panel { border-color:rgba(255,255,255,.1); background:rgba(11,11,14,.93); }
.auth-submit { background:linear-gradient(135deg,#f8324d,#ac0b27); box-shadow:0 10px 28px rgba(220,20,48,.2); }

@media(max-width:1100px){.page{padding-inline:15px}.continue-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.topbar-inner{padding-inline:12px}.page{padding:20px 12px 82px}.continue-grid{grid-template-columns:1fr}}

/* Cinematic boot: the actual interface renders and decodes underneath it. */
.boot-splash.dragon-intro {
  isolation:isolate; display:grid; overflow:hidden; place-items:center; background:#030304;
  transition:opacity .65s cubic-bezier(.22,1,.36,1),visibility .65s ease;
}
.dragon-intro::before {
  width:100%; height:100%; border:0; border-radius:0;
  background:radial-gradient(ellipse at 50% 62%,rgba(151,10,29,.23),transparent 37%),linear-gradient(180deg,#020203,#080407 74%,#020203);
  box-shadow:none; animation:intro-breathe 4s ease-in-out infinite;
}
.dragon-sky { position:absolute; z-index:1; inset:0; overflow:hidden; }
.intro-dragon {
  position:absolute; top:14%; left:50%; width:min(64vw,920px); opacity:0;
  transform:translate3d(-115vw,-9vh,0) scale(.48) rotate(-5deg);
  animation:dragon-flight 4.15s cubic-bezier(.2,.68,.18,1) .15s both;
}
.dragon-body { transform-origin:46% 50%; animation:dragon-glide 1.1s ease-in-out infinite alternate; }
.dragon-wing { transform-box:fill-box; transform-origin:bottom center; animation:wing-beat .72s cubic-bezier(.44,.02,.55,.98) infinite alternate; }
.dragon-wing-right { animation-delay:-.22s; }
.dragon-fire { opacity:0; transform-box:fill-box; transform-origin:left center; animation:fire-breath 1.15s 2.22s ease-out both; }
.fire-trail { position:absolute; z-index:-1; top:57%; left:50%; width:min(60vw,760px); height:2px; opacity:0; transform:translateX(-50%) scaleX(0); border-radius:99px; background:linear-gradient(90deg,transparent,#ff263f 18%,#ffbd55 50%,#ff263f 82%,transparent); box-shadow:0 0 12px #ff263f,0 0 42px rgba(255,35,60,.7); animation:fire-write 1.25s 2.48s cubic-bezier(.16,1,.3,1) both; }
.dragon-title-card { z-index:3; min-width:min(90vw,520px); opacity:0; transform:translateY(18px); animation:title-reveal .78s 3.08s cubic-bezier(.16,1,.3,1) both; }
.dragon-title-card strong { margin:0; font-size:clamp(24px,3vw,38px); letter-spacing:-.05em; text-shadow:0 0 30px rgba(255,35,59,.24); }
.dragon-title-card>span:not(.boot-progress):not(.dragon-monogram) { margin-top:8px; color:#9d9398; letter-spacing:.06em; }
.dragon-monogram { display:grid; width:54px; height:54px; margin-bottom:18px; place-items:center; border:1px solid #ff4a5e; border-radius:16px; background:linear-gradient(145deg,#e72b45,#780a20); color:white; font-size:23px; font-weight:900; box-shadow:0 0 34px rgba(255,35,60,.28); }
.dragon-title-card .boot-progress { width:min(62vw,340px); margin-top:24px; background:rgba(255,255,255,.08); }
.dragon-title-card .boot-progress::after { width:100%; background:linear-gradient(90deg,transparent,#ff2d47,#ffc263,#ff2d47,transparent); animation:dragon-progress 1.4s 3.18s cubic-bezier(.2,.8,.2,1) both; }
.ember { position:absolute; bottom:-12px; width:3px; height:3px; border-radius:50%; background:#ff7358; box-shadow:0 0 10px #ff3048; animation:ember-rise 3.2s linear infinite; }
.ember-one{left:17%;animation-delay:-.4s}.ember-two{left:38%;animation-delay:-1.9s}.ember-three{left:67%;animation-delay:-1.1s}.ember-four{left:84%;animation-delay:-2.6s}
@keyframes dragon-flight{0%{opacity:0;transform:translate3d(-115vw,-9vh,0) scale(.48) rotate(-5deg)}16%{opacity:1}68%{opacity:1;transform:translate3d(-44%,-1vh,0) scale(.93) rotate(1deg)}88%,100%{opacity:0;transform:translate3d(76vw,-16vh,0) scale(.74) rotate(8deg)}}
@keyframes dragon-glide{to{transform:translateY(-5px) rotate(.6deg)}}
@keyframes wing-beat{from{transform:rotateX(52deg) skewX(-4deg)}to{transform:rotateX(-18deg) skewX(3deg)}}
@keyframes fire-breath{0%{opacity:0;transform:scaleX(.05) scaleY(.3)}24%{opacity:1}72%{opacity:1;transform:scaleX(1.25) scaleY(1.12)}100%{opacity:0;transform:scaleX(1.6) scaleY(.35)}}
@keyframes fire-write{0%{opacity:0;transform:translateX(-50%) scaleX(0)}20%{opacity:1}70%{opacity:1;transform:translateX(-50%) scaleX(1)}100%{opacity:.42;transform:translateX(-50%) scaleX(1)}}
@keyframes title-reveal{to{opacity:1;transform:none}}
@keyframes dragon-progress{from{transform:translateX(-105%)}to{transform:translateX(105%)}}
@keyframes ember-rise{from{opacity:0;transform:translateY(0) scale(.5)}18%{opacity:.8}to{opacity:0;transform:translateY(-70vh) translateX(32px) scale(1.6)}}
@keyframes intro-breathe{50%{opacity:.72;transform:scale(1.035)}}
@media(prefers-reduced-motion:reduce){.intro-dragon,.dragon-sky .ember,.dragon-fire,.dragon-wing,.dragon-body,.fire-trail{display:none}.dragon-title-card{opacity:1;transform:none;animation:none}}