@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700;800&family=Inter:wght@400;500;600;700;800;900&display=swap');

:root{
  --cos-bg:#050809;
  --cos-bg-2:#071214;
  --cos-panel:#0b1618;
  --cos-panel-2:#0f2022;
  --cos-panel-3:#10272a;
  --cos-gold:#d4ad61;
  --cos-gold-2:#f1d58f;
  --cos-gold-soft:rgba(212,173,97,.15);
  --cos-teal:#1a3940;
  --cos-teal-2:#214850;
  --cos-sage:#97a95f;
  --cos-sage-2:#b4c97d;
  --cos-text:#edf0eb;
  --cos-muted:#a8b1ab;
  --cos-dim:#7d8a83;
  --cos-line:rgba(212,173,97,.22);
  --cos-shadow:0 22px 64px rgba(0,0,0,.45);
  --cos-glow:0 0 0 1px rgba(212,173,97,.08), 0 0 24px rgba(212,173,97,.08);
  --green:#8d9f5d;
  --green-2:#a0b46b;
  --lime:#b5c87d;
  --gold:#d4ad61;
  --text:#edf0eb;
  --muted:#a8b1ab;
  --line:rgba(212,173,97,.22);
  --shadow:var(--cos-shadow);
}

html{background:var(--cos-bg);color-scheme:dark}
body{
  background:
    radial-gradient(circle at 18% 12%, rgba(40,103,102,.14), transparent 30%),
    radial-gradient(circle at 82% 18%, rgba(212,173,97,.12), transparent 30%),
    radial-gradient(circle at 50% 100%, rgba(96,121,63,.08), transparent 35%),
    linear-gradient(180deg,#030506 0%,#071214 22%,#091719 65%,#040708 100%);
  color:var(--cos-text);
  font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
body::before{
  content:"";
  position:fixed; inset:0; pointer-events:none; z-index:-1; opacity:.3;
  background-image:
    radial-gradient(circle at 7% 14%, rgba(255,255,255,.9) 0 1px, transparent 1.6px),
    radial-gradient(circle at 22% 31%, rgba(232,207,145,.9) 0 1px, transparent 1.6px),
    radial-gradient(circle at 38% 9%, rgba(255,255,255,.9) 0 1px, transparent 1.6px),
    radial-gradient(circle at 52% 24%, rgba(179,201,136,.9) 0 1px, transparent 1.6px),
    radial-gradient(circle at 71% 13%, rgba(255,255,255,.9) 0 1px, transparent 1.6px),
    radial-gradient(circle at 91% 29%, rgba(232,207,145,.9) 0 1px, transparent 1.6px),
    radial-gradient(circle at 11% 77%, rgba(255,255,255,.85) 0 1px, transparent 1.6px),
    radial-gradient(circle at 63% 83%, rgba(255,255,255,.85) 0 1px, transparent 1.6px),
    radial-gradient(circle at 87% 71%, rgba(179,201,136,.85) 0 1px, transparent 1.6px);
  background-size:420px 380px,540px 480px,610px 560px,760px 650px,850px 760px,980px 820px,520px 460px,740px 640px,920px 780px;
}

h1,h2,h3,.brand,.movie-detail-copy h1,.section-head h2,.stock-top h2,.critical-mover-card h3,.portfolio-panel h2,.portfolio-hero h1,.page-hero h1,.hero h1{
  font-family:'Cinzel',Georgia,'Times New Roman',serif;
  letter-spacing:-.02em;
}

.topbar{
  background:linear-gradient(180deg,rgba(4,9,10,.98),rgba(6,14,15,.94));
  border-bottom:1px solid var(--cos-line);
  box-shadow:0 16px 40px rgba(0,0,0,.38);
  position:sticky;
  backdrop-filter:blur(12px);
}
.topbar::before,
.topbar::after{
  content:""; position:absolute; left:0; right:0; height:1px; pointer-events:none;
  background:linear-gradient(90deg,transparent, rgba(212,173,97,.45), transparent);
}
.topbar::before{top:0}
.topbar::after{bottom:0; opacity:.65}
.brand{
  color:#f3efe5;
  gap:14px;
  align-items:center;
}
.brand span:last-child{display:flex; align-items:baseline; gap:8px; flex-wrap:wrap}
.brand::after{
  content:"MOVIES · MARKETS · STOCK AI";
  display:block;
  font-family:'Inter',sans-serif;
  font-size:11px;
  letter-spacing:.24em;
  color:#c5a967;
  opacity:.85;
  margin-left:56px;
  margin-top:2px;
}
.brand-mark{
  width:48px; height:48px; border-radius:50%;
  background:
    radial-gradient(circle at 33% 31%, #fde3a9 0%, #d9b76f 34%, #8e6b2d 62%, #4c3818 100%);
  color:#10100d;
  box-shadow:0 0 0 1px rgba(244,211,143,.22), 0 0 28px rgba(212,173,97,.18), inset 0 0 0 7px rgba(7,10,11,.85), inset 0 0 0 9px rgba(212,173,97,.6);
  font-size:0;
  position:relative;
}
.brand-mark::before,
.brand-mark::after{content:"";position:absolute;inset:50%;transform:translate(-50%,-50%);border-radius:50%}
.brand-mark::before{width:18px;height:18px;border:2px solid #14130e}
.brand-mark::after{width:28px;height:28px;border:1px solid rgba(20,19,14,.55)}
.brand em{color:var(--cos-sage-2)}
.nav a{color:#dbe0dc; font-weight:700; letter-spacing:.04em; font-size:14px}
.nav a:hover,.nav a.active{color:var(--cos-gold-2); border-bottom-color:var(--cos-gold)}
.search-shell{
  background:rgba(8,18,20,.8);
  border:1px solid rgba(212,173,97,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}
.search-shell input{color:#ecefe9}
.search-shell input::placeholder{color:#79867f}
.menu-toggle{background:linear-gradient(135deg,#d7b466,#b48a42); color:#0d0e0c}

.hero,
.page-hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-bottom:1px solid rgba(212,173,97,.18);
}
.hero{
  padding:78px 5% 72px;
  background:
    linear-gradient(90deg, rgba(4,7,9,.96) 0%, rgba(5,9,10,.76) 34%, rgba(5,9,10,.28) 64%, rgba(4,7,9,.86) 100%),
    radial-gradient(circle at 18% 18%, rgba(212,173,97,.18), transparent 26%),
    url('images/divine-hero-rich.png') center center / cover no-repeat;
}
.hero::before{
  content:"";
  position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(5,10,11,.18), rgba(5,10,11,.55));
}
.hero::after,
.page-hero::after{
  content:"";
  position:absolute; right:-120px; top:50%; transform:translateY(-50%);
  width:min(560px,42vw); aspect-ratio:1; opacity:.26; pointer-events:none;
  background:url('images/lokha-cosmic-ornament.svg') center/contain no-repeat;
  filter:drop-shadow(0 0 28px rgba(212,173,97,.16));
}
.hero-inner{position:relative; max-width:780px; margin:0; text-align:left}
.hero .eyebrow,
.page-hero .eyebrow{
  display:inline-flex;
  padding:10px 16px;
  background:rgba(11,24,26,.78);
  border:1px solid rgba(212,173,97,.25);
  color:#e0c37d;
  border-radius:999px;
  box-shadow:var(--cos-glow);
}
.hero h1,
.page-hero h1{color:#f6f1e6; text-shadow:0 8px 28px rgba(0,0,0,.42)}
.hero h1{font-size:clamp(44px,5.8vw,80px); line-height:.95; max-width:760px; margin:0 0 16px}
.hero h1 span,
.page-hero h1 span{color:var(--cos-gold-2)}
.hero p,
.page-hero p{color:#d0d8d3; max-width:700px; font-size:19px; line-height:1.72}
.hero-actions{gap:14px; justify-content:flex-start}
.btn,
.view-more-btn,
.reviews-load-more,
button.tab,
.threshold-tabs button,
.slider-controls button{
  border-radius:14px!important;
  background:linear-gradient(180deg,#122225,#0c181a)!important;
  color:#dcc17d!important;
  border:1px solid rgba(212,173,97,.28)!important;
  box-shadow:0 12px 28px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.04)!important;
}
.btn.primary,
.reviews-load-more,
.threshold-tabs button.active,
.tab.active,
.movie-detail-actions .btn.primary{
  background:linear-gradient(135deg,#e5c174,#a97f36)!important;
  color:#0a0d0b!important;
  border-color:#f1d58f!important;
}
.btn:hover,
.view-more-btn:hover,
.reviews-load-more:hover,
button.tab:hover,
.threshold-tabs button:hover,
.slider-controls button:hover{transform:translateY(-1px); filter:brightness(1.05)}

.page-hero{
  padding:64px 5% 46px;
  text-align:left;
  background:
    linear-gradient(90deg, rgba(4,8,9,.95) 0%, rgba(7,18,20,.86) 45%, rgba(8,20,21,.88) 100%),
    radial-gradient(circle at 16% 10%, rgba(212,173,97,.15), transparent 26%),
    radial-gradient(circle at 82% 18%, rgba(101,139,135,.16), transparent 25%),
    linear-gradient(180deg,#071214,#091719);
}
.page-hero h1{font-size:clamp(34px,5vw,64px); margin:0 0 8px}
.page-hero p{margin:0}

.section{max-width:1380px; padding:40px 5%; position:relative}
.section-head h2{color:#f1f3ef; font-size:34px}
.section-head p,.meta,.movie-body p,.review-card p,.reviews-toolbar span,.reviews-message{color:var(--cos-muted)}
.section-head h2::after,
.stock-top h2::after,
.portfolio-head h2::after,
.detail-card h2::after{
  content:""; display:block; width:58px; height:1px; margin-top:10px;
  background:linear-gradient(90deg,var(--cos-gold),transparent);
}
.view-link{color:#d7bc78; font-weight:800}

.movie-card,
.review-card,
.trailer-card,
.video-box,
.table-panel,
.stock-panel,
.modal-card,
.search-card,
.news-row,
.portfolio-panel,
.earnings-slide,
.detail-card,
.critical-mover-card,
.ai-status-card,
.ai-learning-card,
.macro-card,
.market-change-panel,
.stock-ai-home-card,
.smart-money-card,
.sentiment-card,
.pre-earnings,
.news-card,
.stocks-redirect-card{
  background:linear-gradient(180deg, rgba(12,25,27,.96), rgba(9,18,20,.98))!important;
  border:1px solid rgba(212,173,97,.2)!important;
  box-shadow:0 18px 46px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.03)!important;
  color:var(--cos-text);
}
.movie-card::before,.review-card::before,.video-box::before,.portfolio-panel::before,.stock-panel::before,.table-panel::before,.detail-card::before,.critical-mover-card::after{
  content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit;
  background:linear-gradient(135deg, rgba(241,213,143,.05), transparent 22%, transparent 80%, rgba(120,153,107,.03));
}
.movie-card,.review-card,.video-box,.portfolio-panel,.stock-panel,.table-panel,.detail-card,.critical-mover-card{position:relative; overflow:hidden}
.movie-card:hover,.review-card:hover,.video-box:hover{
  transform:translateY(-4px);
  border-color:rgba(212,173,97,.36)!important;
  box-shadow:0 26px 60px rgba(0,0,0,.36), 0 0 26px rgba(212,173,97,.05)!important;
}
.movie-card img,.review-card img{filter:saturate(1.05) contrast(1.02)}
.movie-body h3,.review-card h3,.video-box h3,.detail-card h2,.portfolio-panel h2,.stock-panel h2,.stock-top h2{color:#f1f3ee}
.badge,.verdict{background:#162c24!important; color:#c8d58d!important; border:1px solid rgba(151,169,95,.25)!important}
.rating,.stars .on,.stars .half,.detail-rating,.movie-detail-page .detail-rating{color:#e4b85b!important}

.news-list{display:grid; gap:16px}
.news-row{padding:16px 18px; border-radius:18px}
.news-tag{display:inline-flex; padding:6px 10px; border-radius:999px; background:#152727; color:#dcbc71; border:1px solid rgba(212,173,97,.22); font-weight:800; margin-right:10px}
.news-row p{margin:.35rem 0 0; color:#c7cfca; line-height:1.65}

.search-card{max-width:1120px; margin:-24px auto 24px; padding:18px 18px; border-radius:24px}
.search-card input,.portfolio-search{background:transparent!important; color:#eff1ec!important; border:0!important; outline:0!important}
.search-card input::placeholder,.portfolio-search::placeholder{color:#7d8a83}
.tabs{gap:10px}
.tab{color:#d8dfdb}
.tab.active{color:#09100c}
.reviews-toolbar{display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; margin:0 0 18px; color:#d5ddd7}
.reviews-toolbar strong{color:#f0f2ed}
.reviews-message{padding:18px 20px; border-radius:18px; background:rgba(12,22,24,.72); border:1px solid rgba(212,173,97,.15)}
.reviews-load-more-wrap{display:flex; justify-content:center; margin-top:24px}

.table-panel,.stock-panel,.portfolio-panel{border-radius:24px; padding:24px}
.data-table th{background:#102123; color:#e0c27a; border-bottom-color:#284038}
.data-table td{border-bottom-color:#21332d; color:#d6ddd9}
.data-table tr:hover td{background:#0f1d1f}
.note,.portfolio-note,.fine-print{color:#aab3ad}
.note{background:#102120; border:1px solid #274139}
.updated,.section-collected-time{background:#122422; color:#c6d88a; border:1px solid rgba(151,169,95,.2)}
.positive{color:#92c966!important; font-weight:800}
.negative{color:#f17b70!important; font-weight:800}

/* Home page richness */
main > .section:first-of-type{padding-top:34px}
.hero-note{
  margin-top:16px; display:inline-flex; flex-direction:column; gap:4px; padding:12px 14px; border-radius:16px;
  background:rgba(8,17,19,.66); border:1px solid rgba(212,173,97,.18); color:#d4dcd7; box-shadow:var(--cos-glow)
}
.hero-note strong{color:#efd28a; font-size:14px; letter-spacing:.08em; text-transform:uppercase}
.hero-note span{font-size:13px; color:#b3bdb8}

/* Stock AI + critical movers readability */
.critical-market-section .section-head h2,
.critical-market-section .section-head p{color:#f0f2ed}
.critical-movers-grid{gap:14px}
.critical-mover-card{padding:18px!important; min-height:240px; border-radius:20px!important}
.critical-mover-card::before{width:4px!important; box-shadow:0 0 18px currentColor}
.critical-mover-card.bullish::before{background:#8fbd5c}
.critical-mover-card.bearish::before{background:#d36b60}
.critical-mover-card.mixed::before{background:#d0a85a}
.critical-rank{color:#e7d19b!important; font-family:'Cinzel',serif; font-size:2rem!important}
.critical-direction,.critical-impact{background:#132224!important; border:1px solid #334843!important; color:#e4e8e3!important}
.critical-mover-card h3{color:#f0f2ed!important; font-size:1.06rem!important; line-height:1.28}
.critical-mover-card p{color:#c7d0ca!important; line-height:1.55}
.critical-mover-card summary{color:#e0c27a!important; font-weight:800}
.market-change-panel{background:linear-gradient(135deg,#102123,#0d1c1d)!important}
.market-change-panel strong{color:#f2d896}

/* Portfolio page */
.portfolio-page .portfolio-hero,
.portfolio-hero{background:linear-gradient(90deg, rgba(4,8,9,.96), rgba(7,18,20,.88)), radial-gradient(circle at 82% 18%, rgba(212,173,97,.16), transparent 26%), linear-gradient(180deg,#071214,#091719)!important; border-bottom:1px solid rgba(212,173,97,.18)}
.portfolio-hero h1,.stock-ai-page .page-hero h1,.market-page .page-hero h1{color:#f4f0e6}
.portfolio-stat,.macro-card,.ai-status-card,.ai-learning-card,.smart-money-card,.sentiment-card{background:linear-gradient(180deg,#102123,#0d1d1f)!important;border-color:rgba(212,173,97,.20)!important}
.portfolio-stat .label,.portfolio-stat .value,.macro-card p,.ai-status-card span,.ai-learning-card p{color:#d0d7d2}
.threshold-tabs{margin:18px 0 20px}
.threshold-tabs button{padding:11px 16px}
.slider-controls button{width:42px;height:42px;border-radius:50%!important}

/* Movie detail pages */
.movie-detail-page .movie-detail-hero,
.generic-movie-hero{
  background:
    linear-gradient(135deg, rgba(10,21,23,.96), rgba(13,27,29,.96)),
    radial-gradient(circle at 85% 15%, rgba(212,173,97,.13), transparent 30%)!important;
  border:1px solid rgba(212,173,97,.22)!important;
  box-shadow:0 26px 64px rgba(0,0,0,.34)!important;
}
.movie-detail-page .movie-detail-copy h1,.generic-movie-copy h1{color:#f4f1ea!important}
.movie-detail-page .movie-detail-copy p,.generic-summary,.generic-card p{color:#c9d1cc!important}
.movie-detail-page .movie-detail-copy .eyebrow,.generic-meta span{background:#132523!important; color:#dfc47f!important; border-color:rgba(212,173,97,.24)!important}
.movie-detail-page .meta-pill,.generic-meta span{background:#122224!important; color:#d3dbd5!important; border-color:#334842!important}
.movie-detail-page .detail-card,.generic-card{background:linear-gradient(180deg,#102123,#0d1d1f)!important; border:1px solid rgba(212,173,97,.18)!important; color:#e7ece8!important}
.movie-detail-page .movie-facts li{border-bottom-color:#243934!important}
.generic-movie-loading{color:#9eaba5!important}
.generic-back{background:linear-gradient(135deg,#e5c174,#a97f36)!important; color:#08100c!important}

.footer{background:linear-gradient(180deg,#061011,#030607); border-top:1px solid rgba(212,173,97,.2)}
.footer h3,.footer h4{color:#f0d490}
.footer a{color:#b8c1bb}
.socials a{background:#0f1b1c; border:1px solid rgba(212,173,97,.18)}
.legal-note{border-color:rgba(212,173,97,.14); color:#93a09a}
.modal-card{background:linear-gradient(180deg,#102123,#0d1d1f)!important}
.modal-head h2{color:#f1e6c0}
.modal-card p,.modal-card li{color:#c7cfca}
.close{background:#142224; color:#f0d490}

/* Redirect page */
.stocks-redirect-wrap{min-height:100vh; display:grid; place-items:center; padding:40px 18px}
.stocks-redirect-card{max-width:720px; text-align:center; border-radius:24px; padding:34px}
.stocks-redirect-card h1{color:#f3efe6; margin-top:0}
.stocks-redirect-card p{color:#bcc5bf}
.stocks-redirect-actions{display:flex; gap:12px; flex-wrap:wrap; justify-content:center; margin-top:18px}

/* Mobile */
@media (max-width:1000px){
  .hero{background-position:center center}
  .hero::after,.page-hero::after{width:420px; right:-160px; opacity:.18}
  .brand::after{display:none}
}
@media (max-width:720px){
  .topbar{padding:14px 4%}
  .nav{background:#091719; border:1px solid rgba(212,173,97,.18)}
  .hero{padding:56px 4% 52px; background-position:62% center}
  .hero-inner{max-width:100%; text-align:left}
  .hero h1{font-size:clamp(36px,12vw,56px)}
  .page-hero{padding:48px 4% 36px}
  .search-card{margin-left:4%; margin-right:4%}
  .section{padding:32px 4%}
  .brand{font-size:22px}
}