:root{
  --bg:#050505;
  --ink:#f4efe6;
  --muted:#aaa39a;
  --gold:#d1ab4f;
  --gold2:#8d6e28;
  --panel:#0d0d0d;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,system-ui,sans-serif;min-height:100%}
body{overflow-x:hidden}
button{font:inherit}
.page{min-height:100vh;background:radial-gradient(circle at 50% 120%,rgba(209,171,79,.12),transparent 35%),#050505}
.hero{min-height:100vh;display:flex;flex-direction:column;justify-content:space-between;padding:28px clamp(24px,5vw,80px) 34px}
.brand{font-family:Georgia,'Times New Roman',serif;font-size:18px;letter-spacing:.02em;opacity:.78}
.quote-wrap{max-width:1150px;margin:auto 0;transform:translateY(-2vh)}
.eyebrow,.kicker{font-size:12px;letter-spacing:.22em;color:var(--gold);margin-bottom:18px}
blockquote{font-family:Georgia,'Times New Roman',serif;font-size:clamp(42px,7.3vw,108px);line-height:.98;margin:0;max-width:1150px;letter-spacing:-.035em;text-wrap:balance;opacity:0;transform:translateY(18px);animation:reveal 1.1s .2s forwards}
@keyframes reveal{to{opacity:1;transform:none}}
.fuel-row{display:flex;align-items:center;gap:24px;margin-top:34px;flex-wrap:wrap}
.gauge{display:flex;align-items:center;gap:9px;font-size:12px;letter-spacing:.1em;color:#d8d1c6}
.bars{display:flex;gap:5px}
.bars i{display:block;width:26px;height:8px;border:1px solid #514834;background:transparent;transition:.5s ease}
.bars i.fill{background:linear-gradient(90deg,#8c6b1f,#e3c368);box-shadow:0 0 14px rgba(209,171,79,.22)}
.status{font-family:Georgia,'Times New Roman',serif;color:#d8c18d;opacity:0;transition:.7s}
.status.show{opacity:1}
.actions{display:flex;gap:18px;flex-wrap:wrap;opacity:0;transform:translateY(10px);transition:.8s}
.actions.show{opacity:1;transform:none}
.actions button,.secondary{background:transparent;color:#d8d1c6;border:0;border-bottom:1px solid #4c4433;padding:5px 0;cursor:pointer}
.actions button:hover,.secondary:hover{color:var(--gold);border-color:var(--gold)}
.panel{position:fixed;inset:0;background:rgba(5,5,5,.985);z-index:20;padding:clamp(24px,5vw,72px);overflow:auto}
.close{position:fixed;right:24px;top:18px;border:0;background:transparent;color:#aaa;font-size:36px;cursor:pointer}
.panel h2{font-family:Georgia,'Times New Roman',serif;font-size:clamp(34px,5vw,72px);font-weight:400;max-width:900px;margin:.2em 0 .55em}
.chips{display:flex;gap:10px;flex-wrap:wrap;max-width:760px;margin:20px 0 26px}
.chips button{background:#101010;border:1px solid #312c22;color:#ddd4c7;border-radius:999px;padding:10px 14px;cursor:pointer}
.chips button.active{border-color:var(--gold);color:#f7e6b6}
.primary{background:var(--gold);color:#0a0a0a;border:0;border-radius:999px;padding:13px 20px;font-weight:700;cursor:pointer}
.result{margin-top:18px;color:#bbb;max-width:760px;word-break:break-all}
.greeting-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;max-width:1100px}
.greeting-card{aspect-ratio:4/5;border:1px solid #2b261d;background:radial-gradient(circle at 50% 0%,rgba(209,171,79,.18),transparent 42%),linear-gradient(160deg,#131313,#050505);padding:24px;display:flex;flex-direction:column;justify-content:space-between}
.greeting-card strong{font-family:Georgia,'Times New Roman',serif;font-size:30px;font-weight:400;line-height:1.05}
.greeting-card small{color:#95876a}
.premium{padding:0}
.premium .close{z-index:30}
.premium-scene{min-height:100vh;position:relative;display:grid;place-items:center;background:radial-gradient(circle at 72% 30%,rgba(216,174,68,.28),transparent 19%),radial-gradient(circle at 25% 30%,rgba(88,107,135,.14),transparent 30%),linear-gradient(135deg,#17120b 0%,#080808 55%,#020202 100%);overflow:hidden}
.premium-scene:before{content:"";position:absolute;inset:-10%;background:repeating-linear-gradient(125deg,rgba(255,255,255,.015) 0 12px,rgba(255,255,255,0) 12px 28px);filter:blur(1px);animation:drift 16s linear infinite}
@keyframes drift{to{transform:translate3d(3%,2%,0)}}
.premium-overlay{position:absolute;inset:0;background:rgba(0,0,0,.34)}
.premium-content{position:relative;z-index:2;max-width:900px;text-align:center;padding:40px 24px}
.gold{color:var(--gold)}
.care-line{font-family:Georgia,'Times New Roman',serif;font-size:clamp(18px,2vw,26px);color:#e7ddcb;max-width:760px;margin:0 auto 32px}
.day{font-size:11px;letter-spacing:.22em;color:var(--gold);margin-bottom:14px}
.premium-content h2{font-family:Georgia,'Times New Roman',serif;font-size:clamp(46px,6vw,88px);line-height:1;margin:0 auto 24px;max-width:900px;font-weight:400}
.premium-copy{font-family:Georgia,'Times New Roman',serif;font-size:clamp(19px,2vw,28px);line-height:1.45;max-width:760px;margin:0 auto 30px;color:#e8e0d4}
.fueled-by{color:#c9ad70;margin-bottom:24px}
.archive{background:#0a0a0a;padding:34px clamp(22px,5vw,72px) 60px}
.archive article{max-width:800px;border-top:1px solid #27231b;padding:20px 0}
.archive span{font-size:11px;letter-spacing:.16em;color:var(--gold)}
.archive p{font-family:Georgia,'Times New Roman',serif;font-size:24px;margin:.4em 0 0}
@media(max-width:640px){
 .hero{padding:22px 20px 28px}
 blockquote{font-size:clamp(42px,14vw,72px)}
 .bars i{width:20px}
 .actions{gap:12px;font-size:14px}
 .panel{padding:72px 20px 28px}
 .premium{padding:0}
 .premium-content{padding:80px 20px 36px}
 .premium-content h2{font-size:clamp(42px,12vw,68px)}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}blockquote,.actions,.status{opacity:1;transform:none}}
