/* The silver look: brushed-metal tones for the yantra, the wordmark and the logo.
   On when <html> has class "silver" (every page); ?theme=red shows the earlier red look.
   The pookalam status colours and the colourful last step stay as they are. */
html.silver {
  --ink: #eef0f3;
  --muted: #a4a9b0;
  --red: #c9ced6;        /* the main line colour, now mid silver */
  --red-hi: #f6f8fb;     /* highlights */
  --red-lo: #6f757e;     /* shadows */
  --g1: #858b94;         /* darker band, gives the lines a brushed-metal sheen */
  --g3: #e9edf2;         /* lighter band */
  --white-hot: #ffffff;
  --line-soft: rgba(201, 206, 214, 0.32);
  --hair: rgba(226, 231, 238, 0.26);
  --rule: rgba(201, 206, 214, 0.26);
  --pattern: rgba(201, 206, 214, 0.03);
  --glow: rgba(226, 232, 240, 0.45);
}

/* petals: faint silver tones instead of red */
html.silver .yantra .tone-a { fill: rgba(214, 220, 228, 0.13); }
html.silver .yantra .tone-b { fill: rgba(214, 220, 228, 0.05); }

/* wordmark: polished metal, light at the top edge, darker band through the middle */
html.silver .hero h1,
html.silver .wordmark {
  color: transparent;
  background: linear-gradient(180deg, #ffffff 0%, #e4e8ed 30%, #8d939c 52%, #d5dae1 70%, #f7f9fb 100%);
  -webkit-background-clip: text;
  background-clip: text;
}
html.silver .wordmark:hover { filter: brightness(1.15); }

/* buttons and links: silver bar with dark text */
html.silver button,
html.silver .button {
  color: #0d0f12;
  background: linear-gradient(180deg, #f5f7fa 0%, #cfd4db 48%, #9aa1aa 52%, #d9dde3 100%);
}
html.silver button:hover,
html.silver .button:hover { background: linear-gradient(180deg, #ffffff 0%, #dde1e7 48%, #aeb4bc 52%, #e6e9ee 100%); }
html.silver input:hover,
html.silver textarea:hover { border-bottom-color: rgba(214, 220, 228, 0.6); }