/* WeirdMarkets · green-glass theme layer
   Loads after the design's inline styles. `!important` is used only where an
   inline style="" attribute on a design element has to be overridden.
   Background art: "Solar Harvest Green Glass Gradient" (assets/glass-*.jpg). */

:root{
  --accent:#f3dc86;            /* solar yellow (from the glass highlights) */
  --lime:#a3df58;              /* glass lime · positive / up */
  --glass:rgba(14,24,15,.58);  /* frosted panel */
  --glass-2:rgba(12,20,13,.74);
  --line:rgba(255,255,255,.09);
  --ink:#070c08;
}

html{background:var(--ink)}
body{
  margin:0;min-height:100vh;
  background:
    radial-gradient(90% 60% at 50% -10%,rgba(163,223,88,.10),transparent 60%),
    linear-gradient(rgba(6,11,7,.56),rgba(6,11,7,.56)),
    url('/assets/glass-hero.jpg') center/cover no-repeat fixed var(--ink)!important;
}
::selection{background:rgba(243,220,134,.32)!important}
*::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14)!important;border-radius:4px}

/* screens */
.screen-app{min-height:100vh;background:linear-gradient(rgba(6,11,7,.30),rgba(6,11,7,.30))}
/* landing: the hero carries its own vivid copy of the art; everything below it gets an extra dark layer */
.screen-landing{position:relative;z-index:0;background:transparent}
.screen-landing::before{content:"";position:absolute;left:0;right:0;top:92vh;bottom:0;z-index:-1;pointer-events:none;background:rgba(6,11,7,.42)}
.site-footer{background:rgba(5,9,5,.55);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line)}

/* frosted glass panels: terminal panels, markets table, featured cards, hero float card */
.panel,.fade-block,.fcard,.float-card{
  background:var(--glass)!important;
  border:1px solid var(--line)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 30px 70px -40px rgba(0,0,0,.75);
  backdrop-filter:blur(22px) saturate(1.2);-webkit-backdrop-filter:blur(22px) saturate(1.2);
}
.float-card{background:var(--glass-2)!important}
.fcard:hover{border-color:rgba(243,220,134,.45)!important}

/* hero */
.hero-l,.hero-r{text-shadow:0 2px 26px rgba(0,0,0,.55),0 0 1px rgba(0,0,0,.35)}
.hero-mark-wrap{position:absolute;left:50%;top:calc(34% + 14px);transform:translate(-50%,-50%);width:clamp(150px,19vw,290px);pointer-events:none}
.hero-mark{display:block;width:100%;filter:drop-shadow(0 26px 40px rgba(0,0,0,.5));animation:markIn 1.1s cubic-bezier(.22,1,.36,1) both .15s,floatY 7s ease-in-out 1.5s infinite}
@keyframes markIn{from{opacity:0;transform:translateY(26px) scale(.94)}to{opacity:1;transform:none}}

/* solar CTA: yellow → lime */
.cta-gold{background:linear-gradient(135deg,#fff3bd 0%,#f3dc86 48%,#c9e574 100%)!important;color:#1d1a0b!important}
.cta-gold:hover{box-shadow:0 10px 28px rgba(243,220,134,.35)!important}

/* docs + methodology (class-based pages) */
header{position:sticky;top:0;z-index:5;background:rgba(8,14,9,.55);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
body>main{max-width:960px;margin:40px auto 56px;padding:52px 48px 64px;background:rgba(8,14,9,.72);border:1px solid var(--line);border-radius:26px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 40px 90px -50px rgba(0,0,0,.8);backdrop-filter:blur(26px) saturate(1.15);-webkit-backdrop-filter:blur(26px) saturate(1.15)}
body>main table,body>main .formula{background:rgba(255,255,255,.035)}
@media (max-width:700px){body>main{margin:16px 12px 32px;padding:32px 20px 40px;border-radius:18px}}
table,.formula{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.note{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}

@media (max-width:900px){body{background-attachment:scroll!important}}
@media (prefers-reduced-motion:reduce){.hero-mark{animation:none}}
