/* ===== pinaystories.com — mobile-first dark reading theme ===== */
:root{
  --bg:#0d0b12;
  --card:#161320;
  --text:#ece7f0;
  --muted:#9d94ac;
  --gold:#e8c168;
  --accent:#c9455f;
  --line:#241f30;
  --maxw:680px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  background:var(--bg);
  color:var(--text);
  font-family:Georgia,"Times New Roman",serif;
  line-height:1.75;
  font-size:19px;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--gold);text-decoration:none}

/* Header */
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(13,11,18,.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
  text-align:center;padding:14px 16px;
}
.brand{
  font-family:Georgia,serif;font-weight:bold;font-size:22px;
  letter-spacing:.5px;color:var(--text);
}
.brand span{color:var(--gold)}
.tagline{font-family:system-ui,sans-serif;font-size:11px;color:var(--muted);
  text-transform:uppercase;letter-spacing:2px;margin-top:2px}

/* Layout */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 18px}

/* Article */
.hero-title{
  font-size:30px;line-height:1.25;font-weight:bold;
  margin:26px 0 10px;color:#fff;
}
.byline{font-family:system-ui,sans-serif;font-size:13px;color:var(--muted);
  margin-bottom:22px;border-bottom:1px solid var(--line);padding-bottom:16px}
.byline .cat{color:var(--accent);font-weight:600}
article p{margin:0 0 18px}
.dropcap:first-letter{
  font-size:52px;float:left;line-height:.8;padding:4px 10px 0 0;
  color:var(--gold);font-weight:bold;
}
.divider{text-align:center;color:var(--gold);margin:26px 0;letter-spacing:8px;opacity:.6}
.pullquote{
  font-size:23px;font-style:italic;color:var(--gold);
  border-left:3px solid var(--accent);padding:6px 0 6px 18px;margin:26px 0;
  line-height:1.5;
}

/* ===== AD SLOTS ===== */
.ad-slot{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:100px;margin:30px auto;padding:8px;
  background:var(--card);border:1px dashed var(--line);border-radius:8px;
  overflow:hidden;
}
.ad-label{font-family:system-ui,sans-serif;font-size:10px;color:var(--muted);
  text-transform:uppercase;letter-spacing:2px;margin-bottom:4px}
/* Sticky bottom anchor ad */
.ad-sticky{
  position:fixed;bottom:0;left:0;right:0;z-index:60;
  background:var(--card);border-top:1px solid var(--line);
  display:flex;flex-direction:column;align-items:center;
  padding:4px 0 6px;min-height:60px;
}
.ad-sticky .ad-close{position:absolute;top:2px;right:8px;color:var(--muted);
  font-size:16px;font-family:sans-serif}

/* CTA / next */
.cta-box{
  background:linear-gradient(135deg,#1a1526,#241a2e);
  border:1px solid var(--line);border-radius:12px;
  padding:22px;margin:34px 0;text-align:center;
}
.cta-box p{font-size:16px;color:var(--muted);margin-bottom:14px;font-family:system-ui,sans-serif}
.btn{
  display:inline-block;background:var(--accent);color:#fff;
  font-family:system-ui,sans-serif;font-weight:600;font-size:16px;
  padding:14px 26px;border-radius:40px;
}
.btn.gold{background:var(--gold);color:#20160a}

/* Story list (homepage) */
.story-card{
  display:block;background:var(--card);border:1px solid var(--line);
  border-radius:14px;overflow:hidden;margin:18px 0;
}
.story-card .thumb{
  height:170px;background:linear-gradient(135deg,#2a1520,#0d0b12);
  display:flex;align-items:flex-end;padding:14px;
}
.story-card .cat{font-family:system-ui,sans-serif;font-size:11px;color:#fff;
  background:var(--accent);padding:4px 10px;border-radius:20px;letter-spacing:1px}
.story-card .body{padding:16px 18px 20px}
.story-card h2{font-size:21px;line-height:1.3;color:#fff;margin-bottom:8px}
.story-card p{font-size:15px;color:var(--muted);font-family:system-ui,sans-serif;line-height:1.5}
.story-card .read{color:var(--gold);font-family:system-ui,sans-serif;font-size:14px;
  font-weight:600;margin-top:12px;display:inline-block}

/* ===== Recommended / Shopee affiliate box ===== */
/* LAUNCH TOGGLE: affiliate boxes are hidden until real Shopee links are added.
   To SHOW them, delete the ".reco{display:none}" line just below. */
.reco{display:none}
.reco{margin:34px 0}
.reco-head{
  font-size:20px;color:#fff;font-weight:bold;margin-bottom:4px;
  display:flex;align-items:center;gap:8px;
}
.reco-sub{font-family:system-ui,sans-serif;font-size:13px;color:var(--muted);margin-bottom:16px}
.reco-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.product-card{
  display:flex;flex-direction:column;background:var(--card);
  border:1px solid var(--line);border-radius:12px;overflow:hidden;
  transition:border-color .2s;
}
.product-card:hover{border-color:var(--gold)}
.product-img{width:100%;aspect-ratio:1/1;background:#0f0d16;overflow:hidden}
.product-img img{width:100%;height:100%;object-fit:cover;display:block}
.product-info{padding:12px;display:flex;flex-direction:column;gap:6px;flex:1}
.product-title{
  font-family:system-ui,sans-serif;font-size:14px;line-height:1.35;color:var(--text);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.product-price{font-family:system-ui,sans-serif;font-size:17px;font-weight:700;color:var(--gold)}
.shopee-btn{
  margin-top:auto;text-align:center;background:#ee4d2d;color:#fff;
  font-family:system-ui,sans-serif;font-weight:600;font-size:13px;
  padding:9px 8px;border-radius:8px;
}
.aff-disclosure{
  font-family:system-ui,sans-serif;font-size:11px;color:var(--muted);
  margin-top:12px;font-style:italic;line-height:1.5;
}

/* Footer */
.site-footer{
  border-top:1px solid var(--line);margin-top:40px;padding:26px 18px 90px;
  text-align:center;font-family:system-ui,sans-serif;font-size:12px;color:var(--muted);
}
.site-footer a{color:var(--muted);margin:0 8px}