/* kalyanchartlive.org - page stylesheet. Supplies the design tokens the inline results-board block
   already references (var(--color-surface), var(--color-brand-primary), ...) plus a page shell
   for the markup this site actually has: .container > .content, h1, h2, p, ol, footer, .gtr-*.
   Replaces the legacy 143-byte file whose only rule was the full-viewport overlay iframe. */
:root{
  --color-brand-primary:#c81e3a;--color-brand-secondary:#5a1522;--color-cta:#c81e3a;--color-header-bg:#1e0710;
  --color-surface:#ffffff;--color-bg:#ffffff;--color-bg-alt:#fdf4f6;--color-border:#e6e3e3;
  --color-text:#1a1a1a;--color-text-muted:#5a5a5a;
  --font-sans:"Roboto",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --shadow-sm:0 1px 2px rgba(0,0,0,.06);--shadow-md:0 4px 12px rgba(0,0,0,.08);
  --radius-sm:.375rem;--radius-md:.625rem;--radius-lg:1rem;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font-sans);color:var(--color-text);background:var(--color-bg-alt);
  line-height:1.6;-webkit-font-smoothing:antialiased}

/* page shell -- this markup uses .container > .content (no <main>, no <header>) */
.container{max-width:820px;margin:0 auto;padding:0 0 2rem;background:var(--color-bg);
  box-shadow:var(--shadow-md);min-height:100vh}
.content{opacity:1!important;padding:0 1.15rem}

/* branded band standing in for the header this markup does not have */
.content>h1:first-child{margin:0 -1.15rem 1.25rem;padding:1.5rem 1.15rem;
  background:linear-gradient(135deg,var(--color-header-bg),var(--color-brand-secondary));
  color:#fff;font-size:1.5rem;line-height:1.25;font-weight:800;letter-spacing:-.01em;
  border-bottom:4px solid var(--color-brand-primary)}
h1{font-size:1.5rem;line-height:1.25;font-weight:800;margin:0 0 .75rem}
h2{font-size:1.3rem;line-height:1.25;font-weight:700;color:var(--color-header-bg);
  margin:2.25rem 0 .9rem;position:relative;padding-left:.75rem}
h2::before{content:"";position:absolute;left:0;top:.2rem;bottom:.2rem;width:4px;border-radius:2px;
  background:linear-gradient(180deg,var(--color-brand-primary),var(--color-brand-secondary))}
p{margin:.85rem 0}
ol,ul{margin:.85rem 0;padding-left:1.35rem}
li{margin:.4rem 0}
a{color:var(--color-brand-primary)}
a:hover{color:var(--color-brand-secondary)}
strong,b{color:var(--color-header-bg)}

/* results board polish (the inline block sizes it; these add contrast the tokens alone cannot) */
.gtr-res{margin:1.75rem 0}
.gtr-sub{color:var(--color-text-muted)}
.gtr-nums span{background:var(--color-bg-alt);border:1px solid var(--color-border)}
.gtr-note{color:var(--color-text-muted);border-top:1px solid var(--color-border);padding-top:.75rem}
.gtr-sponsor{background:var(--color-bg-alt)}

/* footer band, mirroring the family's .site-footer treatment */
footer{margin:2.5rem -1.15rem 0;padding:1.75rem 1.15rem;background:var(--color-header-bg);
  color:rgba(255,255,255,.85);font-size:.875rem;text-align:center}
footer a{color:#fff}

@media(max-width:640px){
  .container{box-shadow:none}
  .content{padding:0 .9rem}
  .content>h1:first-child{margin:0 -.9rem 1rem;padding:1.15rem .9rem;font-size:1.25rem}
  h2{font-size:1.15rem}
  footer{margin:2rem -.9rem 0;padding:1.5rem .9rem}
}
