/* P5 candle flow UI (dark, warm) */
:root {
  --bg1:#2a1306; --bg2:#3b240f; --accent:#f5b01a; --text:#fff7ea; --muted:#d7c7b3; --panel:#1a0d06; --shadow:rgba(0,0,0,.35);
}
*{box-sizing:border-box}
body.bg{margin:0;min-height:100vh;background:radial-gradient(60% 60% at 30% 20%, #603813 0%, var(--bg1) 30%, var(--bg2) 100%);color:var(--text);font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,"Helvetica Neue",Arial}
a{color:#ffd271;text-decoration:none} a:hover{opacity:.9}
.container{max-width:1100px;margin:0 auto;padding:28px}
.btn{display:inline-block;background:var(--accent);color:#3b240f;border:none;padding:12px 18px;border-radius:8px;font-weight:600;cursor:pointer;box-shadow:0 6px 16px var(--shadow)}
.btn.alt{background:#ffffff;color:#3b240f}
.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.hint{color:var(--muted);font-size:.95rem}
.grid{display:grid;gap:16px;grid-template-columns:repeat(4, minmax(0,1fr));}
.card{background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.07);backdrop-filter:blur(2px);border-radius:14px;overflow:hidden;box-shadow:0 10px 26px var(--shadow)}
.card .pad{padding:14px}
.candle{height:160px;background:linear-gradient(#2f1509,#0e0704);display:flex;align-items:center;justify-content:center}
.candle.off{background:#0e0704}
.candle img{max-height:150px;filter:drop-shadow(0 14px 40px rgba(255,150,40,.35))}
.meta{font-size:.9rem;color:#f2e4d1}
.step{max-width:800px;margin:0 auto;padding:60px 24px;text-align:left}
.big{font-size:2.2rem;font-weight:700;margin-bottom:20px}
.progress{height:8px;background:rgba(255,255,255,.2);border-radius:50px;overflow:hidden;margin:12px 0 24px}
.progress .bar{height:8px;background:var(--accent);width:0%}
.form label{display:block;margin:14px 0 6px;color:#ffe9c5}
.form input[type=text], .form input[type=email], .form select, .form textarea{
  width:100%;padding:12px 14px;border-radius:8px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.1);color:#fff;outline:none;
}
.form textarea{min-height:160px;resize:vertical}
.inline{display:flex;gap:14px;align-items:center}
.candle-big{display:flex;align-items:center;gap:24px}
.candle-big .wick{width:80px;height:160px;margin-right:12px;background:#eee;border-radius:8px;position:relative;cursor:pointer;box-shadow:0 20px 30px var(--shadow)}
.wick:after{content:"";position:absolute;left:50%;top:8px;width:6px;height:30px;background:#ad6a10;border-radius:4px;transform:translateX(-50%)}
.flame{position:absolute;left:50%;top:-6px;transform:translateX(-50%);width:14px;height:24px;border-radius:50% 50% 50% 50%;background:radial-gradient(#fff, #ffb84c);box-shadow:0 0 24px 8px rgba(255,160,40,.55);animation:flicker .12s infinite alternate;display:none}
@keyframes flicker{from{transform:translateX(-50%) rotate(-2deg)}to{transform:translateX(-50%) rotate(2deg)}}
.small{font-size:.92rem;color:#ffe6b3}
.footer-actions{display:flex;gap:12px;margin-top:22px}
.country-flag{width:18px;height:12px;object-fit:cover;vertical-align:middle;margin-right:8px;border-radius:2px;border:1px solid rgba(255,255,255,.4)}
.badge{display:inline-block;padding:.15rem .5rem;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);font-size:.8rem}
@media (max-width:900px){.grid{grid-template-columns:repeat(2, minmax(0,1fr));}.candle-big{flex-direction:column;align-items:flex-start}.wick{margin-bottom:10px}}