/* Solar Pilot glass reskin - COLOURS AND MATERIALS ONLY.
   No layout properties (no position, margin, padding, size, display or font-size changes):
   every image and text stays exactly where the live app puts it. */
:root { --glass: linear-gradient(165deg, rgba(255,255,255,.12), rgba(255,255,255,.045) 55%, rgba(255,255,255,.02));
        --glass-edge: rgba(255,255,255,.14);
        --glass-hi: inset 0 1px 0 rgba(255,255,255,.12);
        --lime: #b8f542; }

/* scene */
html.dk body {
  background:
    radial-gradient(1000px 600px at 30% 30%, rgba(80,100,112,.42), transparent 62%),
    radial-gradient(800px 500px at 85% 90%, rgba(120,180,60,.14), transparent 55%),
    linear-gradient(150deg, #161c22 0%, #0c1115 55%, #0d1216 100%);
  color: #f2f4f1;
}
body {
  background:
    radial-gradient(1000px 600px at 30% 30%, rgba(120,140,155,.18), transparent 60%),
    linear-gradient(180deg, #eef1f5 0%, #e2e6ec 100%);
}

/* glass cards (border widths unchanged - colour only where a border already exists) */
html.dk .card, html.dk .acard, html.dk .scard, html.dk .connect .card, html.dk .lcard {
  background: var(--glass);
  border-color: var(--glass-edge);
  box-shadow: var(--glass-hi), 0 12px 32px rgba(0,0,0,.3);
  backdrop-filter: blur(16px) saturate(1.25);
  -webkit-backdrop-filter: blur(16px) saturate(1.25);
  color: #eef2ec;
}
.card, .acard, .scard, .connect .card, .lcard {
  background: linear-gradient(165deg, rgba(255,255,255,.65), rgba(255,255,255,.35));
  border-color: rgba(255,255,255,.7);
  box-shadow: var(--glass-hi), 0 12px 32px rgba(30,40,50,.12);
  backdrop-filter: blur(16px) saturate(1.25);
  -webkit-backdrop-filter: blur(16px) saturate(1.25);
}

/* nav pills */
html.dk .tabs button { background: rgba(255,255,255,.07); color: #cfd6cd; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
html.dk .tabs button.on { background: var(--lime); color: #10160a; }
.tabs button { background: rgba(255,255,255,.5); color: #565b63; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.tabs button.on { background: #10160a; color: #d9f99d; }

/* solar / house button */
html.dk .solar { background: var(--glass); box-shadow: var(--glass-hi), 0 12px 32px rgba(0,0,0,.3); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); outline: 1px solid var(--glass-edge); }
html.dk .solar .snums span, html.dk .solar small { color: #a9b1a7; }
html.dk .solar .snums strong { color: #f7faf2; }
html.dk .solar .snums strong.red { color: #e8b34a; }
html.dk .solar .act { color: var(--lime); }

/* numbers and bars */
html.dk .nums strong { color: #f7faf2; text-shadow: 0 0 12px rgba(240,255,225,.35); }
html.dk .nums span { color: #a9b1a7; }
html.dk .bar { background: rgba(255,255,255,.12); }
html.dk .bar i { background: var(--lime); box-shadow: 0 0 10px rgba(184,245,66,.55); }
html.dk .bar b { background: #f2f4f1; }

/* primary CTA + links */
html.dk .plan { background: linear-gradient(180deg, #3b82f6, #2563eb); color: #fff; box-shadow: 0 10px 30px rgba(59,130,246,.35); }
html.dk .slink, html.dk a { color: #7fb3f5; }
html.dk .gsp { background: linear-gradient(180deg, #3b82f6, #2563eb); color: #fff; }

/* dock / ARA bar */
html.dk .dock { background: linear-gradient(180deg, rgba(9,11,13,0), rgba(9,11,13,.88) 40%); }
html.dk .dock form, html.dk .dock input { background: rgba(255,255,255,.07); color: #eef2ec; border-color: rgba(255,255,255,.14); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
html.dk .dock input::placeholder { color: #78807a; }
html.dk .arahint, html.dk .grab span { color: #98a09a; }

/* sheets overlay keeps its dim, slightly grey */
html.dk #connect { background: linear-gradient(160deg, rgba(34,42,50,.9), rgba(16,20,24,.78) 55%, rgba(22,28,34,.9)) !important; backdrop-filter: blur(14px) !important; -webkit-backdrop-filter: blur(14px) !important; }

/* TV frame */
html.dk .tvframe, html.dk .tvframe.tvgarden { border-color: var(--glass-edge); }

/* green accents move to the approved lime */
html.dk .act, html.dk .on { }
html.dk .cg path { stroke: #3aa572; }
@media (max-width:600px){ #sp-banner{ font-size:10px !important; padding:4px 8px !important; max-width:70vw; } }