:root{--navy:#2a3b54;--white:#ffffff;--muted:#b0b7c3;--accent:#f2545b}
body{margin:0;font-family:Inter,system-ui,sans-serif;background:var(--navy);color:var(--white)}
.container{max-width:640px;margin:0 auto;padding:20px 14px}
.site-header{text-align:center;padding:20px 14px 10px}
.logo{max-width:320px;max-height:50px;width:auto;height:auto;margin-bottom:24px}
.actions{display:flex;justify-content:center;gap:14px;margin-bottom:20px}
.pill{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 14px;border-radius:999px;font-weight:600;text-decoration:none;min-width:100px}
.pill-primary{background:transparent;border:1px solid var(--white);color:var(--white)}
.pill-primary .icon-heart{height:14px;width:14px;fill:var(--accent)}
.date-block{margin-bottom:0}
.h1{margin:0;font-size:1.6rem;font-weight:800}
.reading-line{margin-top:2px;margin-bottom:0;color:var(--muted);font-size:.95rem}
.player{margin-top:0;display:flex;justify-content:center}
.player-card{background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);border-radius:18px;padding:20px;width:100%;max-width:420px;text-align:center;box-shadow:0 0 20px rgba(0,0,0,.4)}
.controls-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}
.play{
  position: relative;
  height: 72px;
  width: 72px;
  border-radius: 50%;
  border: none;
  background: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 0 15px rgba(255,255,255,.4);
  font-size: 0;
}
.play::before{
  content: "▶";
  font-size: 32px;
  line-height: 1;
  color: var(--navy);
}
.play.is-playing::before{
  content: "";
  display: block;
  width: 22px;
  height: 22px;
  background: var(--navy);
  margin: auto;
  border-radius:2px;
}
.ctrl-btn{flex:1;padding:10px;border-radius:8px;border:1px solid var(--white);background:transparent;color:var(--white);font-weight:600;cursor:pointer}
.time{display:flex;justify-content:space-between;color:var(--muted);font-size:.9rem;font-variant-numeric:tabular-nums}
.reading-list,.announcement-list{margin-top:12px;border:1px solid rgba(255,255,255,0.1);border-radius:12px;overflow-y:auto;max-height:400px}
.reading-list::-webkit-scrollbar,.announcement-list::-webkit-scrollbar{width:0;height:0}
.reading-item,.announcement-item{padding:14px;display:flex;flex-direction:column;gap:4px;cursor:pointer}
.reading-item+.reading-item,.announcement-item+.announcement-item{border-top:1px solid rgba(255,255,255,0.15)}
.reading-item:hover,.announcement-item:hover{background:rgba(255,255,255,0.05)}
.reading-date{font-weight:800}
.reading-refs{color:var(--muted);font-size:.95rem}
.announcement-item .announcement-label{color:var(--accent);font-weight:600}
.site-footer{text-align:center;color:var(--muted);padding:20px 14px;font-size:.85rem}
.toggle-wrap{display:flex;justify-content:center;margin:12px 0;gap:8px}
.toggle-btn{background:transparent;border:1px solid var(--white);color:var(--white);padding:6px 14px;border-radius:20px;cursor:pointer;font-weight:600}
.toggle-btn.active{background:var(--accent);border-color:var(--accent)}
.hidden{display:none}