:root{
  --paper:#f6f1e7; --ink:#2b2620; --muted:#8a8172; --line:#d8cfbe;
  --red:#a83232; --redsoft:#c25b4a; --card:#fffdf8; --gold:#d3a24a;
  --night:#15110c; --night2:#241c13;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--night);color:var(--ink);
  font-family:-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased}

/* ---------- RITUAL (overlay) ---------- */
.ritual{
  position:fixed;inset:0;z-index:20;
  background:radial-gradient(120% 90% at 50% 42%, var(--night2), var(--night));
  color:#efe6d4;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:24px;transition:opacity 1.4s ease;
}
.ritual.gone{opacity:0;pointer-events:none}
.skip{position:absolute;top:16px;right:18px;background:transparent;border:none;
  color:#9a8f77;font-size:13px;letter-spacing:.5px;cursor:pointer;z-index:2}
.ritual-center{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1}
.breathe{
  width:150px;height:150px;border-radius:50%;
  background:radial-gradient(circle at 50% 45%, rgba(211,162,74,.5), rgba(211,162,74,.05) 65%, transparent 72%);
  border:1px solid rgba(211,162,74,.32);display:flex;align-items:center;justify-content:center;
  animation:breathe 6s ease-in-out infinite;
}
.breathe-label{font-size:12px;letter-spacing:3px;color:#d9c79c;text-transform:uppercase}
@keyframes breathe{0%,100%{transform:scale(.72);opacity:.6}50%{transform:scale(1.06);opacity:1}}
.ritual-text{
  font-family:Georgia,"Times New Roman",serif;font-size:24px;line-height:1.45;
  margin:30px 12px 0;max-width:420px;color:#eaddba;min-height:70px;
  transition:opacity .6s ease;
}
.start-wrap{position:absolute;bottom:64px;left:0;right:0}
.start-btn{
  border:1px solid rgba(211,162,74,.55);color:#e8d6ab;background:transparent;
  border-radius:26px;padding:12px 26px;font-size:14px;letter-spacing:.5px;cursor:pointer;
  transition:background .3s,color .3s;
}
.start-btn:hover{background:rgba(211,162,74,.14)}
.start-hint{font-size:11px;color:#9a8f77;margin-top:12px}
.wave-wrap{position:absolute;bottom:64px;left:0;right:0;display:flex;justify-content:center}
.wave-wrap[hidden]{display:none}
.wave{display:flex;gap:4px;height:26px;align-items:flex-end}
.wave span{width:3px;background:var(--gold);border-radius:3px;animation:wave 1.1s ease-in-out infinite}
.wave span:nth-child(2){animation-delay:.15s}.wave span:nth-child(3){animation-delay:.3s}
.wave span:nth-child(4){animation-delay:.45s}.wave span:nth-child(5){animation-delay:.6s}
.wave span:nth-child(6){animation-delay:.2s}.wave span:nth-child(7){animation-delay:.4s}
@keyframes wave{0%,100%{height:5px}50%{height:24px}}

/* ---------- ESTANTE ---------- */
.estante{min-height:100vh;background:var(--paper);color:var(--ink);
  max-width:560px;margin:0 auto}
.shelf-top{padding:22px 20px 14px;text-align:center;border-bottom:1px solid var(--line)}
.brand-mark{width:34px;height:34px;display:block;margin:0 auto 6px}
.brand{font-family:Georgia,serif;font-size:22px}
.brand-sub{font-size:12px;color:var(--muted);font-style:italic;margin-top:4px}
.rise-in{padding:34px 24px 6px;text-align:center}
.rise-line{font-family:Georgia,serif;font-size:20px;line-height:1.5;color:#4a3f2c;margin:0}
.shelf{padding:22px 20px 60px}
.kick{font-size:10.5px;letter-spacing:1.5px;text-transform:uppercase;font-weight:700;margin:0 0 10px}
.kick.red{color:var(--redsoft)}
.kick.muted{color:var(--muted);margin-top:26px}
.hero-card{display:block;text-decoration:none;color:inherit;
  background:linear-gradient(120deg,#fff,#f3ead6);border:1px solid var(--line);
  border-left:3px solid var(--red);border-radius:16px;padding:18px;
  box-shadow:0 10px 22px rgba(40,32,20,.1);transition:transform .2s,box-shadow .2s}
.hero-card:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(40,32,20,.15)}
.hero-title{font-family:Georgia,serif;font-size:20px}
.hero-desc{font-size:13px;color:#5f584b;margin:6px 0 14px;line-height:1.5}
.hero-cta{display:block;background:var(--red);color:#fff;border-radius:24px;
  padding:12px;text-align:center;font-size:14px;font-weight:600}
.soon{background:var(--card);border:1px dashed var(--line);border-radius:12px;
  padding:12px 14px;display:flex;justify-content:space-between;align-items:center;
  color:#6b6355;margin-top:8px}
.soon-name{font-family:Georgia,serif;font-size:14px}
.soon-tag{font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:1px}
.foot-sig{text-align:center;font-family:Georgia,serif;font-style:italic;
  color:#7a5636;font-size:13px;margin-top:34px}

/* respeita quem prefere menos animacao */
@media (prefers-reduced-motion: reduce){
  .breathe{animation:none}
  .wave span{animation:none;height:14px}
}