/* EG Solar — "ice + cascade" look (live default since 2026-10-06, Moses: "the starry one with the stars in the back").
   Source: Partiful Pre-Seed VC + Founder Mixer, theme "ice", effect "cascade"
   (spec: ~/Desktop/Terminal Tasks/_sf-look/examples/EXAMPLES.md section 3).
   Navy #091520 with a steel-blue glow at both edges, gold light falling behind the content (fx.js),
   Libre Baskerville titles, white alpha tiers, outlines at white/40, and ONE white "underglow" CTA per screen.
   Scoped to html[data-look="ice"]; remove the attribute in layout.html to fall back to watercolor. */

html[data-look="ice"] {
  --paper: #091520;
  --text: #fff;
  --t90: rgba(255,255,255,.9);
  --t80: rgba(255,255,255,.8);
  --t60: rgba(255,255,255,.7);
  --t50: rgba(255,255,255,.64);
  --t40: rgba(255,255,255,.5);
  --hair: rgba(255,255,255,.1);
  --hair-25: rgba(255,255,255,.4);
  --glass: rgba(255,255,255,.05);
  --glass-hover: rgba(255,255,255,.1);
  --card: rgba(255,255,255,.045);
  --link: #86e9ff;
  --serif: "Libre Baskerville", "Times New Roman", serif;
  --g1: #2a89e0; --g2: #5b83be; --g3: #87deff; --g4: #7ce2fb; --g5: #1a1ac9;
  color-scheme: dark;
}
[data-look="ice"] body { background: #091520; color: var(--t80); }
[data-look="ice"] ::selection { background: rgba(134,233,255,.35); }
[data-look="ice"] :focus-visible { outline-color: #86e9ff; }
[data-look="ice"] .skip { background: #fff; color: #000; }

/* ---------- backdrop: static atmosphere (reverse vignette, steel-blue edges) ---------- */
[data-look="ice"] .backdrop {
  background-color: #0b1622;
  background-image:
    radial-gradient(48% 80% at -6% 68%, rgba(97,128,174,.78), rgba(97,128,174,.2) 46%, transparent 72%),
    radial-gradient(48% 80% at 106% 68%, rgba(97,128,174,.78), rgba(97,128,174,.2) 46%, transparent 72%),
    linear-gradient(180deg, #091520 0%, #0b1622 45%, #060d15 100%);
}
[data-look="ice"] .backdrop::before { background: radial-gradient(70% 45% at 50% -5%, rgba(42,137,224,.16), transparent 70%); }
[data-look="ice"] .bloom, [data-look="ice"] .grain { display: none; }
.fx { position: fixed; inset: 0; z-index: 0; pointer-events: none; width: 100%; height: 100%; }

/* ---------- header, nav, sheet ---------- */
[data-look="ice"] .top.scrolled { background: rgba(9,21,32,.72); box-shadow: 0 1px 0 var(--hair); }
[data-look="ice"] .nav a[aria-current="page"], [data-look="ice"] .nav a:hover { background: rgba(255,255,255,.08); }
[data-look="ice"] .sheet .scrim { background: rgba(9,21,32,.7); }
[data-look="ice"] .sheet nav { background: rgba(14,28,42,.92); box-shadow: 0 20px 60px rgba(0,0,0,.5); }
[data-look="ice"] .sheet nav a { color: #fff; }

/* ---------- type ---------- */
[data-look="ice"] h1, [data-look="ice"] h2, [data-look="ice"] h3, [data-look="ice"] h4 { color: #fff; }
[data-look="ice"] .title {
  font: 700 clamp(40px, 5.2vw, 66px)/1.16 var(--serif); letter-spacing: 0; color: #fff; margin-right: 0;
}
[data-look="ice"] .h2 { font: 700 clamp(30px, 3.6vw, 44px)/1.18 var(--serif); letter-spacing: 0; max-width: 20ch; }
[data-look="ice"] .doc h1 { font: 700 clamp(34px, 4.4vw, 52px)/1.15 var(--serif); letter-spacing: 0; }
[data-look="ice"] .doc h2 { font: 700 22px/1.3 var(--serif); }
[data-look="ice"] .result .eg { font: 700 32px/1.15 var(--serif); color: #fff; letter-spacing: 0; }
[data-look="ice"] .stat b { font: 700 clamp(28px, 3.2vw, 40px)/1.05 var(--serif); color: #fff; letter-spacing: 0; }
[data-look="ice"] .result .kv b, [data-look="ice"] .result .rec b { color: #fff; }
[data-look="ice"] .kicker { color: var(--t60); }
[data-look="ice"] .kicker::before { background: #86e9ff; opacity: 1; box-shadow: 0 0 10px rgba(134,233,255,.7); }

/* ---------- buttons ---------- */
[data-look="ice"] .pill { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.4); color: #fff; }
[data-look="ice"] .pill:hover { background: rgba(255,255,255,.1); }
[data-look="ice"] .pill:active { background: rgba(255,255,255,.25); border-color: rgba(255,255,255,.4); }
[data-look="ice"] .pill[aria-pressed="true"], [data-look="ice"] .pill.on { background: rgba(255,255,255,.15); border-color: rgba(255,255,255,.6); }

/* the one solid object: white bar melting into the icy gradient at its lower edge ("Get on the list") */
[data-look="ice"] .capsule {
  color: #000; border: 0; border-radius: 4px; box-shadow: 0 10px 40px rgba(42,137,224,.25);
  background:
    linear-gradient(180deg, #fff, rgba(255,255,255,.9) 78%, rgba(255,255,255,.6) 87%, rgba(255,255,255,.4) 91%, rgba(255,255,255,.3) 97%, transparent),
    linear-gradient(90deg, var(--g4) 0, var(--g2) 40%, rgba(42,137,224,.9) 90%);
}
[data-look="ice"] .capsule a, [data-look="ice"] .capsule button { color: #000; min-height: 52px; padding: 0 24px; }
[data-look="ice"] .capsule .div { background: rgba(0,0,0,.22); height: 18px; }
[data-look="ice"] .capsule.submit { padding: 0 28px; min-height: 52px; min-width: 240px; justify-content: center; color: #000; }
[data-look="ice"] .event-rail .capsule { min-width: 280px; justify-content: center; }

/* ---------- hero ---------- */
[data-look="ice"] .status-pill { border-color: rgba(255,255,255,.12); background-image: linear-gradient(transparent, rgba(255,255,255,.08)); color: #fff; }
[data-look="ice"] .status-pill .dot { background: #86e9ff; box-shadow: 0 0 0 3px rgba(134,233,255,.18), 0 0 12px rgba(134,233,255,.8); }
[data-look="ice"] .flyer svg { color: #fff; filter: drop-shadow(0 0 18px rgba(134,233,255,.12)); }
[data-look="ice"] .flyer svg g[fill="none"] { stroke: #fff; }
[data-look="ice"] .flyer svg [fill="#000"] { fill: #fff; }
[data-look="ice"] .flyer svg [fill="#f2f1ef"] { fill: #0b1622; fill-opacity: .85; }
[data-look="ice"] .flyer svg g[filter] { mix-blend-mode: screen !important; opacity: .5; }
[data-look="ice"] .flyer svg circle[cx="350"][cy="70"][r="28"], [data-look="ice"] .flyer svg path[d^="M350 26"] { stroke: #ffe3a3; }
[data-look="ice"] .face { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.14); color: #fff; }

/* ---------- cards ---------- */
[data-look="ice"] .card {
  background: linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.025));
  border: 1px solid rgba(255,255,255,.1);
  -webkit-backdrop-filter: blur(22px) saturate(1.15); backdrop-filter: blur(22px) saturate(1.15);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
[data-look="ice"] a.card:hover { background: linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,.04)); border-color: rgba(255,255,255,.2); }
[data-look="ice"] .tier .art, [data-look="ice"] .product .art { color: #fff; }
[data-look="ice"] .tier .art svg, [data-look="ice"] .product .art svg { filter: drop-shadow(0 0 14px rgba(134,233,255,.18)); }
[data-look="ice"] .product .art::before {
  inset: 22% 8% 4%; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(124,226,251,.22), rgba(42,137,224,.1) 55%, rgba(42,137,224,0));
  filter: blur(14px);
}
[data-look="ice"] .tier .range { background: rgba(255,255,255,.07); }
[data-look="ice"] .specs li span:first-child { color: var(--t60); }

/* product photos (when /assets/products/*.webp exist) */
.product .art img { position: relative; width: 84%; height: 100%; object-fit: contain; }
[data-look="ice"] .product .art img { filter: drop-shadow(0 22px 30px rgba(0,0,0,.55)) drop-shadow(0 0 30px rgba(124,226,251,.12)); }

[data-look="ice"] .faces figure { font-size: 13px; color: var(--t80); }
[data-look="ice"] .appl.off .ctl { opacity: .7; }

/* ---------- FAQ, steps, stats ---------- */
[data-look="ice"] .faq summary::after { border-color: #fff; }
[data-look="ice"] .step::before { font-family: var(--serif); color: rgba(134,233,255,.8); }

/* ---------- forms ---------- */
[data-look="ice"] .input, [data-look="ice"] select.input, [data-look="ice"] textarea.input {
  color: #fff; background-color: rgba(255,255,255,.06); border-color: rgba(255,255,255,.25);
}
[data-look="ice"] .input::placeholder { color: rgba(255,255,255,.4); }
[data-look="ice"] .input:focus { border-color: #86e9ff; background-color: rgba(255,255,255,.1); }
[data-look="ice"] select.input { background-image: linear-gradient(45deg, transparent 50%, #fff 50%), linear-gradient(135deg, #fff 50%, transparent 50%); }
[data-look="ice"] select.input option { background: #0e1c2a; color: #fff; }
[data-look="ice"] .check input, [data-look="ice"] .appl input[type=checkbox] { accent-color: #86e9ff; }
[data-look="ice"] .appl .ctl input { color: #fff; background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.25); }
[data-look="ice"] .plan-box { background: rgba(255,255,255,.05); }
[data-look="ice"] .form-msg.ok { background: rgba(124,242,176,.08); color: #8ff3bd; border-color: rgba(124,242,176,.3); }
[data-look="ice"] .form-msg.err { background: rgba(255,120,140,.08); color: #ff9aa9; border-color: rgba(255,120,140,.3); }

/* ---------- reading pages ---------- */
[data-look="ice"] .narrow.doc { background: rgba(9,21,32,.62); border-color: rgba(255,255,255,.08); -webkit-backdrop-filter: blur(26px); backdrop-filter: blur(26px); }
[data-look="ice"] .doc .callout { background: rgba(134,233,255,.06); border-color: rgba(134,233,255,.2); }

/* ---------- footer ---------- */
[data-look="ice"] .foot { background: linear-gradient(180deg, transparent, rgba(6,13,21,.6)); }

@media (max-width: 720px) {
  [data-look="ice"] .title { font-size: 36px; letter-spacing: -.02em; line-height: 1.2; }
  [data-look="ice"] .event-rail .capsule { min-width: 0; width: 100%; }
}