
:root{
  --gold:#E7C46A; --deep:#0B0F1A; --sky:#162036; --blue:#3D7FFF; --danger:#D86B6B;
  --text:#E6EAF6; --muted:#9AA7C7; --glass:rgba(255,255,255,.06);
  --shadow:0 10px 40px rgba(0,0,0,.35);
  --radius:14px;
}
*{box-sizing:border-box}
html,body{height:100%}
body.theme-cosmos{
  margin:0; color:var(--text); background: radial-gradient(80vw 80vh at 60% 20%, rgba(231,196,106,.08), transparent 60%), linear-gradient(180deg,var(--deep) 0%, #0A1226 100%);
  background-attachment: fixed;
  font: 16px/1.5 system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji";
}
body::before{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:-1;
  background:
    radial-gradient(2px 2px at 10% 20%, #fff8, transparent 40%),
    radial-gradient(1.2px 1.2px at 30% 40%, #fff6, transparent 40%),
    radial-gradient(1.8px 1.8px at 80% 30%, #fff5, transparent 40%),
    radial-gradient(1.5px 1.5px at 60% 70%, #fff5, transparent 40%);
  filter: drop-shadow(0 0 2px #fff3);
}
.gold{color:var(--gold)}
.container{max-width:1100px;margin:0 auto;padding:20px}
.glass{background:var(--glass); backdrop-filter: blur(8px); border:1px solid rgba(231,196,106,.18); border-radius:var(--radius); box-shadow:var(--shadow)}

.hero{padding:64px 16px 40px; position:relative; text-align:center}
.hero__content{max-width:920px;margin:0 auto}
.hero h1{font-size:40px; margin:0 0 8px; letter-spacing:.5px}
.hero .sub{color:var(--muted); margin:0 0 16px}
.hero .trust{color:var(--muted); font-size:14px}
.hero__cta{display:flex; gap:12px; justify-content:center; margin:16px 0 10px}

.btn{appearance:none;border:1px solid transparent;border-radius:12px;padding:12px 18px;font-weight:600;cursor:pointer;transition:transform .08s ease, box-shadow .2s ease, background .2s}
.btn:active{transform:translateY(1px)}
.btn-gold{background:linear-gradient(180deg,#F4E4B3,#D5B65A); color:#2c2203; box-shadow:0 4px 16px rgba(231,196,106,.35)}
.btn-ghost{background:transparent;border-color:#ffffff30;color:var(--text)}
.btn-gold:hover{box-shadow:0 6px 22px rgba(231,196,106,.45)}
.btn-ghost:hover{background:#ffffff10}

.panel{padding:16px;margin:16px 0}
.form{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:12px;align-items:end}
.field{display:flex;flex-direction:column;gap:6px}
.field span{font-size:13px;color:var(--muted)}
input,select{background:#0E162A;color:var(--text);border:1px solid #ffffff22;border-radius:10px;padding:10px 12px;outline:none}
input:focus,select:focus{border-color:#7aa2ff; box-shadow:0 0 0 3px #3D7FFF33}

.legend{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px;color:var(--muted)}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%}
.dot.power{background:linear-gradient(#FFD66E,#F3B94E); box-shadow:0 0 8px #F3B94E88}
.dot.karmic{background:#B87333;border:1px dashed #FFCA8A}
.dot.neutral{background:#7b8cb7}
.demo-chip{margin-left:auto;background:#102046cc;border:1px solid #3D7FFF66;color:#bcd1ff;padding:6px 8px;border-radius:8px;font-size:12px}

.calendar{padding:16px;margin:20px 0}
.cal-head{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:6px}
.cal-head div{opacity:.7;text-align:center;font-size:12px;color:#b7c3e8}
.grid{display:grid;grid-template-columns:repeat(7,1fr);grid-auto-rows:112px;gap:6px}
.day{position:relative;background:rgba(255,255,255,.04);border:1px solid #ffffff14;border-radius:12px;padding:8px;overflow:hidden;transition:transform .1s ease, box-shadow .2s}
.day:hover{transform:translateY(-1px); box-shadow:0 8px 18px rgba(0,0,0,.25)}
.day.locked{filter:blur(.6px) grayscale(.2); position:relative}
.day.locked::after{content:"🔒 Открой доступ"; position:absolute; inset:auto 0 0 0; background:linear-gradient(180deg,transparent,rgba(0,0,0,.6)); color:#fff; font-size:12px; padding:8px 6px; text-align:center}
.day.demo{box-shadow:0 0 0 2px #3D7FFFaa inset}
.day.karmic{border:1px dashed #FFC989}
.day .num{font-weight:700;color:#dfe7ff}
.day .icon{width:18px;height:18px;vertical-align:-3px;margin-right:6px;opacity:.9}
.badge{position:absolute; right:6px; bottom:6px; font-size:11px; padding:4px 6px; border-radius:6px; color:#08111f}
.badge.power{background:linear-gradient(180deg,#ffe9a8,#e7c46a); color:#1d1202}
.badge.neutral{background:#223052; color:#bcd1ff}
.badge.karmic{border:1px dashed #FFCA8A; color:#ffd9a7; background:#2c1f10}

.tooltip{position:absolute; left:8px; bottom:8px; font-size:11px; color:#bcd1ff; opacity:.85}

.offers{padding:14px; position:sticky; bottom:10px; z-index:6}
.offers__buttons{display:flex; gap:8px; flex-wrap:wrap}
.offers__timer{color:#ffdd99; margin-bottom:8px; font-size:14px}
.offers .btn{flex:1 0 200px}

.reviews{padding:16px}
.reviews__list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.review{background:#0E162A;border:1px solid #ffffff22;border-radius:12px;padding:12px}

.modal{border:none;border-radius:14px;padding:0;width:min(680px,95vw);background:#0b1224;color:var(--text);box-shadow:var(--shadow)}
.modal::backdrop{background:rgba(3,8,18,.65);backdrop-filter: blur(2px)}
.modal__head{display:flex;align-items:center;gap:10px;padding:16px;border-bottom:1px solid #ffffff18}
.modal__icon{width:28px;height:28px;border-radius:50%;background:#162036;border:1px solid #ffffff22}
.meta{color:#a7b4d7;font-size:13px}
.modal__text{padding:16px}
.modal__footer{display:grid;gap:8px;padding:16px;border-top:1px solid #ffffff18;background:#0c1428}
.modal__actions{display:flex;gap:8px;flex-wrap:wrap}
.modal__close{position:absolute;top:6px;right:8px;background:#0e172c;border:1px solid #ffffff22;color:#dfe7ff;border-radius:10px;cursor:pointer;padding:6px 10px}

.hidden{display:none !important}

#confetti{position:fixed;inset:0;pointer-events:none}

@media (max-width:780px){
  .form{grid-template-columns:1fr 1fr; gap:10px}
  .grid{grid-auto-rows:90px}
  .offers{margin:0 8px}
}
