/* Big Bathroom Day Magazine — Jazz Cup Palette (teal, purple, white) */
:root{
  --teal:#27B6D4;
  --purple:#A05EB5;
  --white:#ffffff;
  --tile:#f3fbfd;
  --muted:#f7f5fb;
  --ink:#111114;
  --accent:#ffd6e8;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:"Comic Sans MS", "Arial", sans-serif;background:var(--tile);color:var(--ink);}
.container{max-width:1100px;margin:20px auto;padding:18px;background:linear-gradient(180deg,var(--white),#f8feff);border:6px solid var(--purple);box-shadow:8px 10px 0 rgba(0,0,0,0.06);}
.header{display:flex;gap:12px;align-items:center}
.logo{width:120px;height:120px;}
.masthead{font-size:34px;line-height:1;margin:0;color:var(--purple);text-shadow:2px 2px 0 rgba(0,0,0,0.05);font-weight:bold;}
.tagline{font-size:14px;color:var(--teal);font-weight:bold}
.nav{margin-top:12px;display:flex;gap:8px;flex-wrap:wrap}
.nav a{background:linear-gradient(180deg,var(--white),#f0fcff);padding:8px 12px;border-radius:6px;text-decoration:none;color:var(--ink);font-weight:bold;border:3px solid rgba(160,94,181,0.12);box-shadow:2px 2px 0 rgba(0,0,0,0.04);}
.cover{display:flex;gap:18px;align-items:stretch;margin-top:16px}
.cover .lead{flex:2;padding:18px;border:6px solid rgba(39,182,212,0.08);background:linear-gradient(180deg,#ffffff,#f1fcff);border-radius:8px}
.cover .side{width:320px;padding:12px;border-radius:8px;background:linear-gradient(180deg,#fefcff,#f7f7ff);border:4px solid rgba(160,94,181,0.06)}
.h1{font-size:38px;margin:0;color:var(--purple);letter-spacing:1px}
.lede{font-size:16px;color:#222;margin-top:8px}
.section{margin:18px 0;padding:12px;background:linear-gradient(180deg,#ffffff,#fbfdff);border-radius:6px;border:2px solid rgba(39,182,212,0.06)}
.article-title{font-size:20px;margin:6px 0 10px 0;color:var(--teal)}
.grid{display:grid;grid-template-columns:2fr 340px;gap:16px;align-items:start}
.sidebar{padding:12px;border-left:6px solid rgba(160,94,181,0.04)}
.ad-banner{width:100%;padding:10px;border-radius:6px;background:linear-gradient(90deg,var(--purple),var(--teal));color:white;font-weight:bold;text-align:center;border:4px solid rgba(255,255,255,0.06);box-shadow:2px 2px 0 rgba(0,0,0,0.06);}
.pixel-art{image-rendering:pixelated;border:4px solid rgba(160,94,181,0.06);background:var(--white);padding:6px;border-radius:6px}
.footer{margin-top:22px;padding:12px;text-align:center;font-size:13px;color:#4b4b4b;border-top:2px dashed rgba(39,182,212,0.08);}
button.pulse{background:var(--teal);color:white;border:none;padding:8px 12px;border-radius:8px;font-weight:bold;cursor:pointer;box-shadow:2px 2px 0 rgba(0,0,0,0.06)}
.counter{font-weight:bold;color:var(--purple);font-size:18px}
.masthead-small{font-size:12px;color:#333}
.pixel-border{border:6px solid rgba(160,94,181,0.08);padding:8px;background:linear-gradient(180deg,#fff,#fffefc);border-radius:6px}
.cover-image{width:100%;height:280px;object-fit:cover;border-radius:6px;display:block}
/* responsive */
@media(max-width:980px){.grid{grid-template-columns:1fr} .cover{flex-direction:column} .logo{width:96px;height:96px}.masthead{font-size:28px}}