*{box-sizing:border-box;margin:0;padding:0}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0}
body{font-family:var(--sans);background:var(--page);color:var(--text);-webkit-font-smoothing:antialiased}
.ic{display:inline-flex;width:18px;height:18px;flex:none}
.ic svg,.nb svg,.logo svg,.pp svg,.fav svg,.mclose svg,.pctl svg,.disc svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
h1,h3,blockquote,.num,.big-date,.dnum,.tn{font-family:var(--serif);font-weight:600}
h1{font-size:30px;line-height:1.08;letter-spacing:-.01em}
h3{font-size:21px;line-height:1.2;margin:4px 0 6px}
.eyebrow{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:6px}
.muted{color:var(--muted);font-size:14px;line-height:1.45}.small{font-size:13px}
.lead{color:var(--muted);font-size:14px;line-height:1.55;margin:4px 0 16px}
.hint{color:var(--muted);font-size:12px;text-align:center;margin:10px 0}
.h2{font-family:var(--serif);font-size:22px;font-weight:600;margin:26px 0 12px}
.h2row{display:flex;justify-content:space-between;align-items:center;margin:26px 0 12px}.h2row .h2{margin:0}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:14px}.row .btn.gold:last-child{margin-left:auto}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 18px;border-radius:var(--rb);font-weight:600;font-size:14px;transition:.2s;white-space:nowrap}
.btn .ic{width:16px;height:16px}
.btn.sm{height:36px;padding:0 14px;font-size:13px}
.btn.wide{width:100%;margin-top:12px}
.btn.gold{background:var(--goldg);color:var(--onGold);box-shadow:0 6px 18px -8px var(--gold)}
.btn.gold:hover{filter:brightness(1.07);transform:translateY(-1px)}
.btn.line{border:1px solid var(--line2);color:var(--text)}.btn.line:hover{border-color:var(--gold);color:var(--gold)}
.link{color:var(--gold);font-weight:600;font-size:13px;display:inline-flex;align-items:center;gap:4px}
.link.back{margin-bottom:12px}
.tag{display:flex;align-items:center;gap:7px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);font-weight:700}
.tag .ic{width:15px;height:15px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:18px;position:relative}
.cards{display:grid;gap:14px}
blockquote{font-size:22px;line-height:1.3;font-style:italic;margin:10px 0 2px}
.okmark{display:inline-flex;align-items:center;gap:5px;color:var(--ok);font-size:13px;font-weight:600}
.okmark .ic{width:16px;height:16px}

/* hero */
.prog{height:5px;border-radius:5px;background:var(--line2);overflow:hidden;margin:14px 0 6px}.prog i{display:block;height:100%;background:var(--goldg);border-radius:5px}
.hero-meta{font-size:15px;margin-top:8px}.hero-small{font-size:12px;opacity:.75}
.meet-mini{margin-top:16px;display:flex;flex-direction:column;gap:12px}
.meet-mini>div{display:flex;gap:10px;align-items:center}.meet-mini span:not(.ic){font-size:12px;opacity:.85}.meet-mini b{display:block;font-size:15px;opacity:1}
.notice{display:flex;gap:10px;align-items:center;background:var(--soft);border-radius:12px;padding:12px;margin:12px 0 0;font-size:13px}
.notice b{display:block}.notice>span:not(.ic){flex:1;color:var(--muted)}.notice b{color:var(--text)}.notice>.ic{color:var(--gold)}

/* tarot */
.deck{display:flex;gap:10px;margin:14px 0 4px}
.tarot{flex:1;max-width:96px;aspect-ratio:2/3.2;border-radius:10px;padding:5px;background:var(--goldg);cursor:zoom-in;transition:.25s;box-shadow:0 10px 24px -12px rgba(0,0,0,.6)}
.tarot:hover{transform:translateY(-4px) rotate(-1deg)}
.tarot-in{height:100%;border-radius:7px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:14px 4px 10px;color:#f4dfa6;border:1px solid rgba(244,223,166,.55)}
.t0 .tarot-in{background:radial-gradient(circle at 50% 35%,#3a4f9a,#0d1838 70%)}
.t1 .tarot-in{background:radial-gradient(circle at 50% 35%,#5b3f8a,#170f33 70%)}
.t2 .tarot-in{background:radial-gradient(circle at 50% 35%,#8a5b2a,#2a170a 70%)}
.sym{font-size:34px;margin-top:10%;text-shadow:0 0 18px #f4dfa6}.tn{font-size:13px;letter-spacing:.06em}
.deck.lg .tarot{max-width:130px}.tarot.big .sym{font-size:44px}.tarot.big .tn{font-size:15px}
.cardview .tarot{max-width:220px;margin:6px auto 0;cursor:default}.cardview h3{text-align:center;margin:12px 0}

/* seg */
.seg{display:flex;gap:4px;padding:4px;border-radius:var(--rb);background:var(--soft);margin:14px 0 18px;overflow-x:auto}
.seg button{flex:1;padding:9px 10px;border-radius:calc(var(--rb) - 3px);font-size:13px;font-weight:600;color:var(--muted);white-space:nowrap}
.seg button.on{background:var(--surface);color:var(--text);box-shadow:0 2px 8px -3px rgba(0,0,0,.35)}

/* weeks */
.weeks{display:grid;gap:10px}
.week{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.week-h{width:100%;display:flex;gap:14px;align-items:center;padding:16px;text-align:left}
.wn{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-family:var(--serif);font-size:20px;font-weight:700;border:1px solid var(--line2);flex:none}
.wn .ic{width:18px;height:18px}
.week.done .wn{background:var(--soft);color:var(--ok);border-color:transparent}
.week.now{border-color:var(--gold)}.week.now .wn{background:var(--goldg);color:var(--onGold);border:0}
.week.lock{opacity:.55}
.wt{flex:1}.wt small{display:block;color:var(--muted);font-size:12px}.wt b{font-family:var(--serif);font-size:19px;font-weight:600}
.wt em{font-style:normal;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;background:var(--goldg);color:var(--onGold);padding:3px 7px;border-radius:20px;margin-left:8px;vertical-align:3px}
.chev{color:var(--muted);transition:.2s}.week.open .chev{transform:rotate(90deg)}
.week-b{padding:0 16px 14px 70px;display:grid;gap:2px}
.wi{display:flex;gap:10px;align-items:center;padding:10px 0;border-top:1px solid var(--line);cursor:pointer;font-size:14px}
.wi .ic{color:var(--gold)}.wi>span:not(.ic){flex:1}.wi small{color:var(--muted);font-size:12px}

/* list items */
.item{display:flex;gap:12px;align-items:center;padding:12px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);margin-bottom:8px;width:100%;text-align:left}
.thumb{width:46px;height:46px;border-radius:12px;background:var(--soft);display:grid;place-items:center;color:var(--gold);flex:none}
.it{flex:1;min-width:0}.it b{display:block;font-size:14px;font-weight:600}.it small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.meet-next .big-date{font-size:26px;color:var(--gold);margin:2px 0}

/* energy days */
.days{display:grid;gap:8px}
.dayrow{display:flex;gap:12px;align-items:center;padding:12px;border-radius:var(--r);background:var(--surface);border:1px solid var(--line)}
.dnum{width:48px;text-align:center;font-size:24px;line-height:1;flex:none;color:var(--gold)}.dnum small{display:block;font-family:var(--sans);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:3px;font-weight:600}
.dayrow.today{border-color:var(--gold);background:var(--todayBg)}.dayrow i{color:var(--gold);font-style:normal;font-weight:700}
.dayrow.lock{opacity:.5}.dayrow.lock>.ic{color:var(--muted)}
.dayrow .okmark{margin-right:2px}

/* library */
.lib{display:grid;gap:12px}
.libtop{display:flex;justify-content:space-between;align-items:center}
.fav{width:34px;height:34px;padding:7px;border-radius:50%;color:var(--muted)}.fav.on{color:var(--gold)}

/* players */
.pp{width:38px;height:38px;border-radius:50%;padding:10px;background:var(--soft);color:var(--text);flex:none}
.pp.gold{background:var(--goldg);color:var(--onGold)}
.pp.big{width:64px;height:64px;padding:19px}
.mini-player,.vmsg{display:flex;gap:12px;align-items:center;padding:10px;border-radius:14px;background:var(--soft);cursor:pointer;margin:12px 0}
.mini-player>small,.vmsg>small{color:var(--muted);font-size:12px}
.wave{height:18px;margin-top:4px;background:repeating-linear-gradient(90deg,var(--gold) 0 2px,transparent 2px 5px);opacity:.65;clip-path:polygon(0 40%,5% 20%,10% 55%,15% 10%,20% 45%,25% 25%,30% 60%,35% 5%,40% 40%,45% 20%,50% 50%,55% 15%,60% 45%,65% 30%,70% 55%,75% 20%,80% 40%,85% 30%,90% 50%,95% 35%,100% 45%,100% 100%,0 100%)}
.field{display:block;margin:14px 0 4px}.field span{display:block;font-size:12px;color:var(--muted);margin-bottom:6px;font-weight:600}
input,textarea,select{width:100%;background:var(--input);border:1px solid var(--line2);border-radius:12px;padding:12px 14px;font-size:14px;outline:none;resize:vertical}
input:focus,textarea:focus{border-color:var(--gold)}

/* day */
.bigbtn{width:100%;display:flex;gap:16px;align-items:center;text-align:left;padding:20px;border-radius:var(--r);background:var(--goldg);color:var(--onGold);box-shadow:0 14px 30px -14px var(--gold)}
.bigbtn>.ic{width:46px;height:46px;padding:11px;border-radius:50%;background:rgba(255,255,255,.25)}
.bigbtn b{display:block;font-family:var(--serif);font-size:22px}.bigbtn small{opacity:.8;font-size:13px}
.feed{display:grid;gap:18px;margin-top:8px}
.fdate{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:8px}
.msg{border-radius:16px;padding:12px 14px;margin-bottom:8px;max-width:92%;font-size:14px;line-height:1.5}
.msg small{color:var(--muted);font-size:11px;display:block;margin-bottom:3px}
.msg.me{background:var(--soft);margin-left:auto;border-bottom-right-radius:4px}
.msg.el{background:var(--surface);border:1px solid var(--gold);border-bottom-left-radius:4px}
.msg .vmsg{margin:0;padding:0;background:none}
.msg.wait{display:flex;gap:8px;align-items:center;color:var(--muted);border:1px dashed var(--line2);font-size:13px}.msg.wait .ic{color:var(--gold)}

/* reality */
.pair{display:grid;gap:12px}.pair p:not(.tag){font-size:14px;line-height:1.55;margin:8px 0}
.was .tag{color:var(--muted)}
.want{border-color:var(--gold)}
.timeline{position:relative;padding-left:22px}
.timeline:before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:1px;background:var(--line2)}
.tl{position:relative;padding:0 0 16px}.tl i{position:absolute;left:-22px;top:4px;width:11px;height:11px;border-radius:50%;background:var(--goldg);box-shadow:0 0 0 4px var(--soft)}
.tl small{color:var(--muted);font-size:12px}.tl p{font-size:15px;margin-top:2px}
.final{display:flex;gap:12px;align-items:flex-start;margin-top:10px}.final b{display:block}.final small{color:var(--muted);font-size:13px;line-height:1.45}.final>.ic{color:var(--gold);margin-top:2px}
.th-list{display:grid;gap:12px}.tday{border-color:var(--gold);background:var(--todayBg)}

/* admin */
.sh{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.stream{width:auto;padding:8px 12px;font-size:13px;border-radius:30px}
.agrid{display:grid;gap:12px}
.acard{cursor:pointer}.acard .num{font-size:56px;line-height:1;color:var(--gold);margin:10px 0 2px}
.acard.hot{border-color:var(--gold);background:var(--todayBg)}
.plan{list-style:none;margin-top:10px;display:grid;gap:8px}
.plan li{display:flex;gap:8px;align-items:center;font-size:14px}.plan li>span:not(.ic){flex:1}.plan li small{font-size:11px;color:var(--muted)}
.plan li.pub .ic{color:var(--ok)}.plan li.todo .ic{color:var(--gold)}.plan li.todo small{color:var(--gold);font-weight:700}
.fab{position:sticky;bottom:12px;margin:18px 0 0 auto;display:flex;align-items:center;gap:8px;height:52px;padding:0 22px;border-radius:30px;background:var(--goldg);color:var(--onGold);font-weight:700;box-shadow:0 12px 26px -10px var(--gold)}
.av{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--goldg);color:var(--onGold);font-family:var(--serif);font-weight:700;font-size:17px;flex:none}
.rev{display:grid;gap:12px;grid-template-columns:minmax(0,1fr)}
.only-b{display:none}
.rq{display:flex;flex-direction:column;gap:6px}
.rqi{display:flex;gap:10px;align-items:center;padding:10px;border-radius:14px;border:1px solid var(--line);background:var(--surface);text-align:left}
.rqi small:last-child{font-size:11px;color:var(--muted)}
.rqi.on{border-color:var(--gold)}.rqi.done{opacity:.5}
.rqi .it small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.quoteline{font-size:16px;line-height:1.55;margin:10px 0;padding-left:14px;border-left:2px solid var(--gold)}
.reply{margin-top:12px}
.plist .item{cursor:pointer}
.dot{width:8px;height:8px;border-radius:50%;background:var(--line2)}.dot.on{background:var(--ok)}
.flabel{font-size:12px;font-weight:700;color:var(--muted);margin:6px 0 10px;letter-spacing:.04em}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.chip{display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border-radius:30px;border:1px solid var(--line2);font-size:13px;font-weight:600;cursor:pointer}
.chip input{display:none}.chip .ic{width:15px;height:15px}
.chip.on{background:var(--goldg);color:var(--onGold);border-color:transparent}
.drop{border:1.5px dashed var(--line2);border-radius:var(--r);padding:22px;text-align:center;margin:14px 0;display:flex;flex-direction:column;align-items:center;gap:6px}
.drop>.ic{width:30px;height:30px;color:var(--gold)}.drop small{color:var(--muted)}.drop u{color:var(--gold);cursor:pointer}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}

/* modal */
#modal{position:fixed;inset:0;z-index:50;display:none}#modal.on{display:block}
.mbg{position:absolute;inset:0;background:rgba(5,10,25,.6);backdrop-filter:blur(4px);animation:fade .2s}
.sheet{position:absolute;left:0;right:0;bottom:0;max-height:92%;overflow:auto;background:var(--sheet);border-radius:26px 26px 0 0;padding:26px 20px 30px;animation:up .28s cubic-bezier(.2,.8,.2,1)}
.mclose{position:absolute;right:14px;top:14px;width:34px;height:34px;padding:8px;border-radius:50%;background:var(--soft)}
@keyframes up{from{transform:translateY(40px);opacity:0}}@keyframes fade{from{opacity:0}}
.player{text-align:center}.player h3{margin-bottom:16px}
.disc{width:170px;height:170px;margin:4px auto 20px;border-radius:50%;background:conic-gradient(from 0deg,#f6dc9a,#b8873c,#f6dc9a,#8f6328,#f6dc9a);padding:4px;animation:spin 14s linear infinite;box-shadow:0 0 50px -10px var(--gold)}
.disc-in{width:100%;height:100%;border-radius:50%;background:radial-gradient(circle,#24366e,#0a1430 70%);display:grid;place-items:center;color:#f4dfa6}.disc-in svg{width:56px;height:56px}
@keyframes spin{to{transform:rotate(360deg)}}
.vscreen{aspect-ratio:16/9;border-radius:16px;background:linear-gradient(135deg,#1c2c5e,#0a1430);display:grid;place-items:center;color:#f4dfa6;margin-bottom:18px}.vscreen .ic{width:48px;height:48px}
.bar{height:6px;border-radius:6px;background:var(--line2);cursor:pointer;overflow:hidden}.bar i{display:block;height:100%;width:0;background:var(--goldg)}
.ptime{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin:6px 0 14px}
.pctl{display:flex;justify-content:center;align-items:center;gap:26px;margin-bottom:20px}
.pctl>button:not(.pp){width:40px;height:40px;color:var(--muted);display:flex;flex-direction:column;align-items:center;font-size:10px}.pctl>button svg{width:24px;height:24px}
.compose h3{margin-bottom:4px}.compose textarea{margin-top:14px}
.rec.on{border-color:#e05858;color:#e05858}.recdot{width:9px;height:9px;border-radius:50%;background:#e05858;animation:blink 1s infinite}@keyframes blink{50%{opacity:.2}}

/* toast */
#toast{position:fixed;left:50%;bottom:96px;transform:translate(-50%,20px);background:var(--toast);color:var(--toastT);padding:12px 18px;border-radius:30px;font-size:13px;font-weight:600;opacity:0;pointer-events:none;transition:.3s;z-index:60;white-space:nowrap;box-shadow:0 10px 30px -10px rgba(0,0,0,.5)}
#toast.on{opacity:1;transform:translate(-50%,0)}

/* login */
.login-in .field input{background:var(--input)}
.dotn{width:8px;height:8px;border-radius:50%;background:#e05858;position:absolute;top:8px;right:calc(50% - 16px)}
.nb{position:relative}
.nb em{font-style:normal;position:absolute;top:4px;right:calc(50% - 22px);background:#e05858;color:#fff;font-size:10px;font-weight:700;min-width:17px;height:17px;border-radius:9px;display:grid;place-items:center;padding:0 4px}

/* demo bar */
.demo-t b{font-family:var(--serif);font-size:20px;font-weight:600;display:block}.demo-t small{display:block;color:var(--muted);font-size:13px;line-height:1.5;margin-top:6px}
.roles{display:flex;gap:6px;margin-top:14px}
.roles .sw{display:inline-flex;align-items:center;padding:8px 14px;border-radius:30px;font-size:13px;font-weight:600;color:var(--gold);text-decoration:none;border:1px dashed var(--line2)}
.roles{flex-wrap:wrap}
.roles button{padding:8px 14px;border-radius:30px;border:1px solid var(--line2);font-size:13px;font-weight:600}
.roles button.on{background:var(--goldg);color:var(--onGold);border-color:transparent}

/* --- v2 --- */
.hero{position:relative}
.bellbtn{position:absolute;top:16px;right:16px;z-index:3;width:44px;height:44px;border-radius:50%;padding:11px;background:rgba(10,19,48,.55);backdrop-filter:blur(8px);border:1px solid #f6dc9655;color:#f6dc96}
.bellbtn svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.bellbtn em{position:absolute;top:-3px;right:-3px;background:#e05858;color:#fff;font-style:normal;font-size:10px;font-weight:700;min-width:18px;height:18px;border-radius:9px;display:grid;place-items:center}
.spread{position:relative;border-radius:14px;overflow:hidden;cursor:zoom-in;margin:14px 0 4px;box-shadow:0 14px 30px -16px #000}
.cloth{aspect-ratio:4/3;display:flex;gap:6%;align-items:center;justify-content:center;padding:8% 6%;background:radial-gradient(circle at 20% 15%,#ffcf7a55,transparent 35%),radial-gradient(ellipse at 50% 60%,#5a1f3a,#24081a 75%);position:relative}
.cloth:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(45deg,#ffffff06 0 2px,transparent 2px 6px);pointer-events:none}
.cloth .tarot{max-width:none;flex:0 0 26%;cursor:inherit}
.cloth .tarot:nth-child(2){transform:rotate(-6deg)}.cloth .tarot:nth-child(3){transform:translateY(-6%)}.cloth .tarot:nth-child(4){transform:rotate(7deg)}
.cloth .tarot:hover{transform:none}
.cloth .sym{font-size:min(30px,7vw)}.cloth .tn{font-size:11px}
.candle{position:absolute;left:5%;top:6%;width:10px;height:26px;border-radius:3px;background:#f3e6c8;box-shadow:0 -14px 22px 6px #ffcf7a66}
.candle:before{content:"";position:absolute;left:2px;top:-11px;width:6px;height:10px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:#ffd36b;box-shadow:0 0 10px #ffb53a}
.zoom{position:absolute;right:10px;bottom:10px;background:rgba(0,0,0,.55);color:#fff;font-size:11px;padding:4px 9px;border-radius:20px}
.spread.big .cloth .tn{font-size:13px}
.cardview .spread{cursor:default}.cardview h3{text-align:left;margin:0 0 4px}
.soon{display:flex;gap:12px;align-items:flex-start;margin-bottom:14px;border-style:dashed}.soon>.ic{color:var(--gold);margin-top:2px}.soon b{display:block;font-size:14px}.soon small{display:block;color:var(--muted);font-size:13px;line-height:1.45;margin-top:2px}
.pills{display:flex;gap:8px;margin:-4px 0 16px;flex-wrap:wrap}
.pills button{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:30px;border:1px solid var(--line2);font-size:13px;font-weight:600;color:var(--muted)}
.pills button .ic{width:14px;height:14px}.pills button.on{border-color:var(--gold);color:var(--gold);background:var(--todayBg)}
.final{width:100%;text-align:left;cursor:pointer;align-items:center}.final>div{flex:1}
.compare{display:grid;gap:10px}.compare p:not(.tag){font-size:14px;line-height:1.55;margin:8px 0}.compare textarea{margin-top:8px}
.arrow{display:grid;place-items:center;color:var(--gold)}.arrow .ic{transform:rotate(90deg);width:24px;height:24px}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:10px}.stats .card{padding:14px}.stats b{display:block;font-family:var(--serif);font-size:34px;color:var(--gold);line-height:1}.stats small{color:var(--muted);font-size:12px}
.cprog{display:grid;grid-template-columns:1fr auto;gap:4px 16px;align-items:center;margin-bottom:12px}.cprog>b{font-family:var(--serif);font-size:40px;color:var(--gold);line-height:1}.cprog>b small{font-size:16px;color:var(--muted)}.cprog .prog{grid-column:1/-1;margin:8px 0 0}
.st{width:10px;height:10px;border-radius:50%;border:2px solid var(--gold);flex:none}.st.ok{background:var(--ok);border-color:var(--ok)}
.drop{cursor:pointer}.drop.slim{padding:14px;margin-top:0}
.cardnote{margin:-2px 0 6px;font-size:12px}.cardnote .ic{vertical-align:-3px;margin-right:4px}.cardnote .ic{color:var(--gold);width:15px;height:15px}.cardnote .link{font-size:12px}
.chk{display:flex;gap:10px;align-items:center;font-size:14px;margin:12px 0}.chk input{width:18px;height:18px;accent-color:var(--gold)}
.plan li[onclick]{cursor:pointer}
.wvideo{display:flex;gap:14px;align-items:center;padding:14px;border-radius:var(--r);background:var(--surface);border:1px solid var(--gold);cursor:pointer;margin:16px 0}.wvideo b{display:block;font-family:var(--serif);font-size:19px}.wvideo small{color:var(--muted);font-size:12px}
.prog-list{list-style:none;display:grid;gap:8px}.prog-list li{display:flex;gap:12px;align-items:center;font-size:14px}.prog-list span{width:28px;height:28px;border-radius:50%;border:1px solid var(--gold);color:var(--gold);display:grid;place-items:center;font-family:var(--serif);font-weight:700;flex:none}
.meet1{display:flex;gap:12px;align-items:center;margin-top:16px}.meet1 small{display:block;color:var(--muted);font-size:12px}.meet1>.ic{color:var(--gold);width:22px;height:22px}
.note .nt{font-size:11px;color:var(--muted);white-space:nowrap;align-self:flex-start}
#push{position:absolute;left:10px;right:10px;top:-120px;z-index:70;display:flex;gap:12px;align-items:center;padding:12px 14px;border-radius:20px;background:rgba(245,240,228,.97);color:#13204a;box-shadow:0 18px 40px -12px rgba(0,0,0,.6);transition:top .45s cubic-bezier(.2,.9,.2,1.1);cursor:pointer}
#push.on{top:48px}
#push .logo{width:40px;height:40px;border-radius:11px;padding:9px;background:linear-gradient(135deg,#f6dc96,#c8964a);color:#13204a;flex:none}
#push .logo svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8}
#push small{display:block;font-size:10px;letter-spacing:.06em;color:#6c7088}#push b{display:block;font-size:14px}#push span{font-size:12px;color:#4a4f68}
.rdetail .spread{max-width:440px}

#pv{position:fixed;inset:0;z-index:300;display:none}#pv.on{display:grid;place-items:center}
.pv-bg{position:absolute;inset:0;background:rgba(3,6,15,.75);backdrop-filter:blur(6px)}
.pv-box{position:relative;display:flex;flex-direction:column;align-items:center;gap:14px}
.pv-phone{width:390px;height:min(820px,calc(100vh - 90px));border-radius:50px;border:11px solid #03060f;overflow:hidden;background:#000;box-shadow:0 0 0 1px #dcb76c55,0 40px 120px -20px #000}
.pv-phone iframe{width:100%;height:100%;border:0;display:block}
.pv-x{padding:10px 18px;border-radius:30px;background:#fff;color:#13204a;font-weight:700;font-size:13px}
.embed .demo{display:none}.embed .app{min-height:100vh}
.embed #nav{height:auto}
@media (max-width:900px){.pvb{display:none}}
@media (max-width:900px){.roles{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-top:8px}.roles::-webkit-scrollbar{display:none}.roles button,.roles .sw{padding:6px 11px;font-size:12px;white-space:nowrap;flex:none}.demo{display:block}.demo-t b{font-size:16px}}
:root{--page:#f5efe3;--surface:#fffdf8;--soft:#f0e8d7;--line:#e8dec9;--line2:#d8c9a8;--text:#13204a;--muted:#6c7088;--gold:#b0803a;--goldg:linear-gradient(135deg,#dcb562,#a7732e);--onGold:#fff;--ok:#2f8a63;--todayBg:#fff6e3;--input:#fff;--sheet:#fffdf8;--toast:#13204a;--toastT:#f3d991;--r:20px;--rb:30px;--serif:'Playfair Display',Georgia,serif;--sans:'Manrope',system-ui,sans-serif;--navy:#101a40}
body{background:var(--page)}
.demo{background:var(--navy);color:#f4ecd8;padding:12px 28px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.demo .eyebrow{display:none}
.demo-t{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}.demo-t b{font-size:18px;color:#f3d991}.demo-t small{margin:0;color:#aab0c8}
.demo ul{display:none}.roles{margin:0}.roles button{border-color:#ffffff33;color:#f4ecd8}.roles .sw{color:#f3d991;border-color:#ffffff33}
.app{display:grid;grid-template-columns:268px 1fr;min-height:calc(100vh - 56px)}
#nav{background:var(--navy);color:#e9e2cf;padding:26px 16px;display:flex;flex-direction:column;gap:4px;position:sticky;top:0;height:calc(100vh - 56px);background-image:radial-gradient(400px 300px at 0 100%,#dcb56222,transparent 70%)}
.brand{display:flex;gap:12px;align-items:center;padding:0 8px 26px;margin-bottom:12px;border-bottom:1px solid #ffffff1a}
.brand b{display:block;font-family:var(--serif);font-size:17px;line-height:1.15;color:#f3d991}.brand small{font-size:11px;color:#9da3bd;letter-spacing:.06em}
.logo{width:44px;height:44px;border-radius:14px;padding:10px;background:var(--goldg);color:var(--navy);flex:none}
.nb{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:14px;font-size:15px;font-weight:600;color:#c3c7d8;text-align:left}
.nb .ic{width:21px;height:21px}
.nb:hover{background:#ffffff0d}
.nb.on{background:#ffffff14;color:#f3d991;box-shadow:inset 3px 0 0 #dcb562}
.nb em{position:static;margin-left:auto}.dotn{position:static!important;margin-left:auto}
.nav-foot{margin-top:auto;display:flex;gap:10px;align-items:center;padding:14px 8px 0;border-top:1px solid #ffffff1a}
.nav-foot b{display:block;font-size:14px}.nav-foot small{font-size:11px;color:#9da3bd}
#main{padding:40px 48px 60px;max-width:1180px;width:100%}
h1{font-size:36px}
.btn.gold{box-shadow:0 8px 20px -10px #a7732e}
/* hero */
.hero{display:grid;grid-template-columns:1.25fr 1fr;background:var(--navy);color:#f4ecd8;border-radius:28px;overflow:hidden;margin-bottom:22px;min-height:330px}
.hero-in{padding:34px 36px;order:-1}.hero h1{color:#fff7e0;font-size:40px}
.hero-img{background:url(/static/door.jpg) center 30%/cover;position:relative}
.hero-img:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--navy),transparent 35%)}
.hero .prog{background:#ffffff22;max-width:420px}
.meet-mini{flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap;background:#ffffff0f;border:1px solid #ffffff1f;border-radius:18px;padding:14px 16px}
.meet-mini>div .ic{color:#f3d991;width:24px;height:24px}
.cards{grid-template-columns:repeat(3,1fr)}
.c-day{grid-column:span 2}.c-cards{grid-row:span 1}
.c-thought{background:var(--navy);color:#f4ecd8;border:0}.c-thought blockquote{color:#f3d991}
.c-thought .btn.line{border-color:#ffffff33;color:#f4ecd8}
.card{box-shadow:0 1px 0 #e8dec9,0 14px 30px -24px #13204a55}
.seg{max-width:560px;border-radius:30px}.seg button{border-radius:30px}
.weeks,.days,.feed,.timeline,.th-list{max-width:820px}
.lib{grid-template-columns:repeat(2,1fr)}
.pair{grid-template-columns:1fr 1fr}
.want{background:var(--todayBg)}
.th-list{grid-template-columns:1fr 1fr;max-width:none}.tday{grid-column:span 2;background:var(--navy);color:#f4ecd8}.tday blockquote{color:#f3d991;font-size:28px}.tday .btn.line{border-color:#ffffff33;color:#f4ecd8}.tday .muted{color:#aab0c8}
.cardset{max-width:820px}
.bigbtn{max-width:820px}
.agrid{grid-template-columns:repeat(2,1fr)}
.rev{grid-template-columns:340px minmax(0,1fr);align-items:start}
.only-b{display:flex}.only-b>.vmsg{flex:1}
.plist{max-width:820px}
.addf{max-width:760px}
.fab{position:fixed;right:36px;bottom:30px}
.disc-in{background:radial-gradient(circle,#24366e,#101a40 70%)}
/* modal centered on desktop */
.sheet{left:50%;top:50%;bottom:auto;right:auto;transform:translate(-50%,-50%);width:min(500px,94vw);border-radius:26px;animation:pop .25s}
@keyframes pop{from{opacity:0;transform:translate(-50%,-46%)}}
/* login */
.login-mode{grid-template-columns:1fr}.login-mode #nav{display:none}.login-mode #main{padding:0;max-width:none}
.login{display:grid;grid-template-columns:1fr 1fr;min-height:calc(100vh - 56px)}
.login-img{background:url(/static/door.jpg) center 35%/cover}
.login-in{padding:60px;align-self:center;max-width:520px}
.login-in h1{font-size:54px;line-height:1;margin-bottom:14px}
@media (max-width:1100px){.cards{grid-template-columns:1fr 1fr}.c-day{grid-column:span 2}}
@media (max-width:900px){
  .demo{padding:10px 16px}.demo-t small{display:none}
  .app{display:block}
  #nav{position:fixed;left:0;right:0;bottom:0;top:auto;height:76px;flex-direction:row;padding:6px 6px 14px;background:rgba(255,253,248,.96);backdrop-filter:blur(12px);border-top:1px solid var(--line);z-index:30;color:var(--muted)}
  .brand,.nav-foot{display:none}
  .nb{flex:1;flex-direction:column;gap:4px;padding:6px 0;font-size:10px;color:var(--muted);text-align:center;justify-content:center;border-radius:12px}
  .nb.on{background:none;color:var(--gold);box-shadow:none}.nb .ic{width:23px;height:23px}
  .nb em{position:absolute;margin:0}.dotn{position:absolute!important}
  #main{padding:22px 16px 110px}
  h1{font-size:30px}
  .hero{grid-template-columns:1fr;border-radius:24px}.hero-img{height:190px;order:-2}.hero-img:before{background:linear-gradient(0deg,var(--navy),transparent 50%)}.hero-in{padding:6px 20px 22px}.hero h1{font-size:32px}
  .cards,.lib,.pair,.th-list,.agrid,.rev{grid-template-columns:minmax(0,1fr)}.c-day,.tday{grid-column:auto}
  .fab{right:16px;bottom:92px}
  .sheet{left:0;right:0;bottom:0;top:auto;transform:none;width:auto;border-radius:26px 26px 0 0;animation:up .28s}
  .login{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto;align-content:start;min-height:0}.login-img{height:280px}.login .login-in{padding:28px 20px 40px;max-width:none;align-self:start}.login-in h1{font-size:42px}
  #toast{bottom:92px}
}
#push{position:fixed;left:auto;right:24px;width:380px;top:-140px}#push.on{top:76px}
.welcome .login-img{position:sticky;top:0;height:calc(100vh - 56px)}
.welcome .login-in{align-self:start;padding-top:50px}
.compare{grid-template-columns:1fr 40px 1fr;max-width:900px}.arrow .ic{transform:none}
.stats{grid-template-columns:repeat(4,1fr);max-width:900px}
.c-cards .spread{margin-top:10px}
.cardset .spread,.cardview .spread{max-width:560px}
@media (max-width:900px){#push{left:10px;right:10px;width:auto}#push.on{top:60px}.compare{grid-template-columns:1fr}.arrow .ic{transform:rotate(90deg)}.stats{grid-template-columns:1fr 1fr}.welcome .login-img{position:static;height:240px}}
/* ===== чат ===== */
.av.sm{width:32px;height:32px;font-size:14px}.av.xs{width:24px;height:24px;font-size:12px}
.ctabs{display:flex;gap:6px;margin:14px 0 12px;flex-wrap:wrap}
.ctabs button{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:30px;border:1px solid var(--line2);font-weight:600;font-size:14px;color:var(--muted);background:var(--surface)}
.ctabs button.on{background:var(--navy);color:#f3d991;border-color:var(--navy)}
.ctabs em{font-style:normal;background:#e05858;color:#fff;font-size:10px;font-weight:700;min-width:18px;height:18px;border-radius:9px;display:grid;place-items:center;padding:0 5px}
.cwin{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;height:calc(100vh - 290px);min-height:420px}
.pinbar{display:flex;gap:10px;align-items:center;padding:10px 14px;background:var(--todayBg);border-bottom:1px solid var(--line);font-size:13px;line-height:1.4}
.pinbar>.ic{color:var(--gold)}.pinbar>span:not(.ic):not(.av){flex:1}.pinbar b{display:block;font-size:11px;color:var(--gold);letter-spacing:.04em}
.pinbar.soft{background:var(--soft);color:var(--muted)}.pinbar.soft b{display:inline;color:var(--text);font-size:13px;letter-spacing:0}
.mclose.sm{position:static;width:28px;height:28px;padding:6px;flex:none}
.cmsgs{flex:1;overflow-y:auto;padding:16px 14px;display:flex;flex-direction:column;gap:12px;background:radial-gradient(circle at 100% 0,#f6ecd8,transparent 50%),#fbf7ef}
.cm{display:flex;gap:8px;align-items:flex-end;position:relative;max-width:82%}
.cm.mine{align-self:flex-end;flex-direction:row-reverse}
.cb{background:#fff;border:1px solid var(--line);border-radius:18px 18px 18px 6px;padding:9px 12px 7px;font-size:14px;line-height:1.45;min-width:0;box-shadow:0 2px 6px -4px #13204a33}
.cm.mine .cb{background:var(--navy);color:#f4ecd8;border-color:var(--navy);border-radius:18px 18px 6px 18px}
.cm.host:not(.mine) .cb{border-color:var(--gold);background:#fffaf0}
.cb.bare{background:none!important;border:0!important;box-shadow:none;padding:0}
.cb.wide{width:300px;max-width:100%}
.cn{display:block;font-size:12px;color:var(--gold);margin-bottom:2px}.cn i{font-style:normal;font-size:9px;letter-spacing:.08em;text-transform:uppercase;background:var(--goldg);color:#fff;padding:1px 6px;border-radius:8px;margin-left:4px;vertical-align:1px}
.ct{display:block;text-align:right;font-size:10px;color:var(--muted);margin-top:2px}.cm.mine .ct{color:#aab0c8}
.ctag{display:inline-block;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gold);margin-bottom:4px}
.cm.mine .ctag{color:#f3d991}
.creply{border-left:2px solid var(--gold);padding:2px 8px;margin:2px 0 6px;font-size:12px;color:var(--muted);background:#f6eedd;border-radius:0 8px 8px 0}
.cphoto{border-radius:12px;overflow:hidden;width:220px;max-width:100%;margin:4px 0}.cphoto .cloth{aspect-ratio:4/3}.cphoto .tarot{flex:0 0 34%}
.cb .spread{margin:4px 0;width:100%}
.cvoice{display:flex;gap:10px;align-items:center;cursor:pointer;min-width:190px}.cvoice .wave{flex:1;margin:0}.cvoice small{font-size:11px;opacity:.7}
.cvoice .pp{width:34px;height:34px;padding:9px}
.vcircle{width:150px;height:150px;border-radius:50%;position:relative;cursor:pointer;background:radial-gradient(circle at 35% 30%,#f5d9a6,#b0803a 45%,#3a2a4a 80%);box-shadow:0 0 0 3px #fff,0 8px 20px -8px #13204a88;display:grid;place-items:center}
.vc-in{width:44px;height:44px;border-radius:50%;background:rgba(0,0,0,.35);color:#fff;padding:13px}.vc-in svg{width:100%;height:100%}
.vcircle small{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,.5);color:#fff;font-size:10px;padding:2px 7px;border-radius:10px}
.reacts{display:flex;gap:4px;flex-wrap:wrap;margin-top:5px}
.rc{font-size:12px;padding:2px 8px;border-radius:12px;background:var(--soft);border:1px solid transparent;color:var(--text)}.rc.on{border-color:var(--gold);background:#fff4dc}
.cm.mine .rc{background:#ffffff1f;color:#f4ecd8}.cm.mine .rc.on{border-color:#f3d991}
.mact{display:flex;gap:2px;opacity:0;transition:.15s;align-self:center}
.cm:hover .mact{opacity:1}
.mact button{width:28px;height:28px;padding:6px;border-radius:50%;color:var(--muted);background:var(--surface);border:1px solid var(--line)}
.mact button:hover{color:var(--gold)}.mact svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.rpick{position:absolute;bottom:100%;left:40px;z-index:5;display:flex;gap:2px;background:#fff;border:1px solid var(--line);border-radius:30px;padding:4px 6px;box-shadow:0 10px 24px -10px #13204a66}
.cm.mine .rpick{left:auto;right:0}
.rpick button{font-size:20px;width:34px;height:34px;border-radius:50%}.rpick button:hover{background:var(--soft);transform:scale(1.15)}
.csep{text-align:center;margin:6px 0}.csep span{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--gold);background:#fff;border:1px solid var(--line);border-radius:20px;padding:4px 12px}
.csys{align-self:center;max-width:90%;text-align:center;font-size:12px;color:var(--muted);background:var(--soft);border-radius:14px;padding:8px 12px;line-height:1.45}
.cstatus{align-self:flex-end;display:flex;gap:6px;align-items:center;font-size:12px;color:var(--muted)}.cstatus .ic{color:var(--gold);width:14px;height:14px}
.composer{display:flex;gap:6px;align-items:center;padding:10px;border-top:1px solid var(--line);background:var(--surface)}
.composer input{flex:1;border-radius:30px;padding:11px 16px}
.cbtn{width:40px;height:40px;border-radius:50%;padding:10px;color:var(--muted);flex:none;display:grid;place-items:center}
.cbtn svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.cbtn:hover{color:var(--gold);background:var(--soft)}
.cbtn.send{background:var(--goldg);color:#fff}
.cbtn.rec{background:#fde8e8}.cbtn .recdot{width:12px;height:12px}
.dlgs{display:grid;grid-template-columns:300px minmax(0,1fr);gap:12px}
.amod{display:flex;gap:6px;align-items:center;margin-top:6px}.amod .ic{color:var(--gold);width:15px;height:15px}
.circrec{text-align:center}.cam{width:240px;height:240px;margin:14px auto;border-radius:50%;position:relative;overflow:hidden;box-shadow:0 0 0 4px var(--gold)}
.cam-in{position:absolute;inset:0;background:radial-gradient(circle at 50% 40%,#e9c9a0 0 22%,#7d5a46 23% 30%,transparent 31%),radial-gradient(ellipse at 50% 100%,#8c6a55 0 38%,transparent 39%),linear-gradient(160deg,#cdb79a,#5e4a5c);animation:breathe 3s ease-in-out infinite}
@keyframes breathe{50%{transform:scale(1.04)}}
.rectime{position:absolute;top:14px;left:50%;transform:translateX(-50%);display:flex;gap:6px;align-items:center;background:rgba(0,0,0,.5);color:#fff;font-size:12px;padding:3px 10px;border-radius:20px}
/* быстрый чат слева внизу */
#chatfab{position:fixed;left:292px;bottom:26px;z-index:40;display:flex;align-items:center;gap:8px;height:54px;padding:0 20px 0 16px;border-radius:30px;background:var(--navy);color:#f3d991;font-weight:700;box-shadow:0 14px 30px -12px #101a40;border:1px solid #dcb56255}
#chatfab svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#chatfab em{position:absolute;top:-4px;left:30px;font-style:normal;background:#e05858;color:#fff;font-size:10px;min-width:18px;height:18px;border-radius:9px;display:grid;place-items:center}
#chatpop{position:fixed;left:292px;bottom:24px;z-index:45;width:400px;height:min(620px,calc(100vh - 110px));background:var(--surface);border:1px solid var(--line2);border-radius:24px;box-shadow:0 30px 70px -20px #101a4088;display:none;flex-direction:column;padding:12px 12px 0;overflow:hidden}
#chatpop.on{display:flex}
.cpop-h{display:flex;align-items:center;gap:4px}.cpop-h b{flex:1;display:flex;gap:8px;align-items:center;font-family:var(--serif);font-size:20px}.cpop-h b .ic{color:var(--gold)}
#chatpop .ctabs{margin:8px 0}#chatpop .ctabs button{padding:7px 11px;font-size:12px}
#chatpop .cwin{height:auto;flex:1;min-height:0;border-radius:18px 18px 0 0;margin:0 -12px;border-width:1px 0 0}
#chatpop .cm{max-width:88%}#chatpop .vcircle{width:120px;height:120px}
.chatpage #main{padding-bottom:30px}
/* ===== игры ===== */
.gchip{display:flex;align-items:center;gap:10px;padding:8px 12px 8px 10px;border-radius:16px;background:var(--surface);border:1px solid var(--line2);text-align:left}
.gchip>.ic:first-child{color:var(--gold)}.gchip small{display:block;font-size:10px;color:var(--muted);letter-spacing:.06em;text-transform:uppercase}.gchip b{font-size:14px}
.gst{width:9px;height:9px;border-radius:50%;background:var(--line2)}.gst.live{background:var(--ok);box-shadow:0 0 0 3px #2f8a6333}.gst.set{background:var(--gold)}
.gcard{margin:0 4px 14px;padding:12px 14px;border-radius:14px;background:#ffffff0d;border:1px solid #dcb56244;text-align:left;color:#e9e2cf}
.gcard small{display:block;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#9da3bd}.gcard b{display:block;color:#f3d991;font-size:14px;margin:2px 0}.gcard span{font-size:11px;color:#9da3bd}
.games{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.game.cur{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold),0 14px 30px -24px #13204a55}
.gtop{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.pill{font-size:11px;font-weight:700;padding:4px 10px;border-radius:20px;background:var(--soft);color:var(--muted)}
.pill.live{background:#e3f3ea;color:var(--ok)}.pill.set{background:#fff1d6;color:var(--gold)}.pill.now{background:var(--navy);color:#f3d991}
.gweeks{display:flex;gap:4px;margin:12px 0}.gweeks i{flex:1;height:6px;border-radius:4px;background:var(--line)}.gweeks i.d{background:var(--gold)}.gweeks i.n{background:var(--goldg);box-shadow:0 0 0 2px #dcb56244}
.gstats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:10px 0;border-top:1px solid var(--line)}
.gstats span{font-size:11px;color:var(--muted);line-height:1.3}.gstats b{display:block;font-family:var(--serif);font-size:22px;color:var(--text)}
.setg{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}
.wrow{display:flex;gap:10px;align-items:center;margin-top:10px}.wrow .wn{width:32px;height:32px;font-size:16px}.wrow input{flex:1;padding:9px 12px}.wrow small{color:var(--muted);font-size:12px;width:46px}
.inrow{display:flex;gap:8px}.inrow .btn{height:auto}
.setbtns{position:sticky;bottom:0;background:linear-gradient(transparent,var(--page) 30%);padding:16px 0 6px}
/* ===== итоги-дашборд ===== */
.sum-hero{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center;background:var(--navy);color:#f4ecd8;border-radius:28px;padding:32px 36px;margin-bottom:14px;background-image:radial-gradient(500px 300px at 100% 0,#dcb56233,transparent 70%)}
.sum-hero h2{font-family:var(--serif);font-size:34px;color:#fff7e0;font-weight:600;line-height:1.15;margin-bottom:12px}
.sum-hero p{font-size:15px;line-height:1.65;color:#d9d6e6}.sum-hero p b{color:#f3d991}
.sum-hero small{display:block;margin-top:12px;font-size:12px;color:#9da3bd}
.ring{position:relative;width:170px;height:170px}.ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.ring .rb{fill:none;stroke:#ffffff1a;stroke-width:10}.ring .rf{fill:none;stroke:url(#none);stroke:#dcb562;stroke-width:10;stroke-linecap:round;filter:drop-shadow(0 0 8px #dcb56288)}
.ring>div{position:absolute;inset:0;display:grid;place-content:center;text-align:center}.ring b{font-family:var(--serif);font-size:40px;color:#f3d991;line-height:1}.ring small{margin:4px 0 0;font-size:11px;max-width:90px}
.kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:14px}
.kpi b{display:block;font-family:var(--serif);font-size:30px;color:var(--gold);line-height:1}.kpi small{color:var(--muted);font-size:12px;line-height:1.35;display:block;margin-top:4px}
.sum-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:10px}
.sg-weeks{grid-row:span 2}.sg-badges{grid-column:span 2}
.sw-row{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--line)}.sw-row:first-of-type{border-top:0;margin-top:6px}
.sw-row .wn{width:30px;height:30px;font-size:15px;background:var(--goldg);color:#fff;border:0}.sw-row small{display:block;font-size:11px;color:var(--muted)}.sw-row b{font-size:14px;font-weight:600;line-height:1.35}
.chart{width:100%;height:auto;margin-top:8px}.chart text{font-size:10px;fill:#6c7088;font-family:var(--sans)}
.scale{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}
.qq{border-radius:14px;padding:12px 14px;margin-top:10px}.qq small{font-size:11px;color:var(--muted)}.qq p{font-family:var(--serif);font-style:italic;font-size:17px;line-height:1.35;margin-top:2px}
.qq.was{background:var(--soft)}.qq.now{background:var(--todayBg);border:1px solid var(--gold)}.qarrow{text-align:center;color:var(--gold);font-size:18px;margin-top:6px}
.cloud{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:baseline;margin-top:12px}.cloud span{font-family:var(--serif);color:var(--text)}
.cloud .w5{font-size:28px;color:var(--gold)}.cloud .w4{font-size:23px}.cloud .w3{font-size:19px;color:#4a5280}.cloud .w2{font-size:15px;color:var(--muted)}
.badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin-top:12px}
.badge{display:flex;gap:10px;align-items:center;padding:10px;border-radius:14px;background:var(--todayBg);border:1px solid var(--line)}.badge>span{font-size:24px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#fff;box-shadow:0 4px 10px -6px #b0803a;flex:none}
.badge b{display:block;font-size:13px}.badge small{font-size:11px;color:var(--muted)}
.sg-elm{background:var(--navy);color:#f4ecd8;border:0;grid-column:span 3}.sg-elm blockquote{color:#f3d991}.sg-elm .vmsg{background:#ffffff12}.sg-elm .vmsg small{color:#aab0c8}
@media (max-width:1100px){.games,.setg{grid-template-columns:1fr}.sum-grid{grid-template-columns:1fr 1fr}.sg-weeks{grid-row:auto}.sg-elm{grid-column:span 2}.kpis{grid-template-columns:repeat(3,1fr)}}
@media (max-width:900px){
  .nb.xm{display:none}.gcard{display:none}
  .sh{align-items:flex-start}.gchip{width:100%}.gchip b{font-size:13px}
  .cwin{height:calc(100dvh - 330px);min-height:380px}
  .dlgs{grid-template-columns:minmax(0,1fr)}.dlgs .rq{flex-direction:row;overflow-x:auto}.dlgs .rqi{flex:none;width:200px}
  .mact{opacity:1}.cm{max-width:92%}
  #chatfab{left:14px;bottom:90px;height:52px;padding:0 14px}#chatfab span{display:none}#chatfab em{left:34px}
  #chatpop{left:0;right:0;bottom:0;top:0;width:auto;height:auto;border-radius:0;z-index:45}
  .gstats{grid-template-columns:1fr 1fr}
  .sum-hero{grid-template-columns:1fr;padding:24px 20px;text-align:left}.sum-hero h2{font-size:26px}.ring{margin:0 auto}
  .kpis{grid-template-columns:1fr 1fr}.sum-grid{grid-template-columns:minmax(0,1fr)}.sg-badges,.sg-elm{grid-column:auto}
}
/* чат справа */
#chatfab{left:auto;right:28px}
#chatpop{left:auto;right:24px}
.fab{bottom:96px}
@media (max-width:900px){#chatfab{left:auto;right:14px}#chatpop{right:0}.fab{bottom:156px}}

/* ===== production overrides ===== */
.app{min-height:100vh}
#nav{top:0;height:100vh}
.login{min-height:100vh}.welcome .login-img{height:100vh}
.nav-foot .cbtn{margin-left:auto;color:#9da3bd}.nav-foot .cbtn:hover{background:#ffffff14;color:#f3d991}
.bellbtn.inl{position:relative;top:auto;right:auto;background:var(--navy);color:#f3d991}
.photo{display:block;width:100%;max-width:560px;border-radius:14px;margin:12px 0 6px;cursor:zoom-in;box-shadow:0 14px 30px -16px #000}
.c-cards .photo{max-height:240px;object-fit:cover}
.vid{width:100%;max-width:520px;border-radius:14px;margin:8px 0;background:#000}
.cimg{display:block;max-width:240px;width:100%;border-radius:12px;margin:4px 0;cursor:zoom-in}
.caud{width:240px;max-width:100%;height:40px;margin:2px 0}
.vcirc{width:160px;height:160px;border-radius:50%;object-fit:cover;cursor:pointer;box-shadow:0 0 0 3px #fff,0 8px 20px -8px #13204a88;background:#000}
#chatpop .vcirc{width:130px;height:130px}
.cam video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}
.cam{background:#111}
.ann{display:flex;gap:12px;align-items:flex-start;margin-bottom:14px;border-color:var(--gold);background:var(--todayBg)}.ann>.ic{color:var(--gold);margin-top:3px}.ann p{margin-top:4px;font-size:14px;line-height:1.5}
.invite{display:flex;gap:12px;align-items:center;margin-bottom:14px}.invite>.ic{color:var(--gold)}.invite>div{flex:1;min-width:0}.invite b{display:block}.invite small{color:var(--muted);font-size:12px;word-break:break-all}
details.past{margin-bottom:10px}details.past summary{cursor:pointer;list-style:none;display:flex;gap:10px;align-items:baseline}details.past summary small{color:var(--muted)}
.cmsgs.empty{display:grid;place-items:center;color:var(--muted);font-size:14px}
.note.unread{border-color:var(--gold);background:var(--todayBg)}
.replying:not(:empty){padding:6px 14px;font-size:12px;color:var(--muted);background:var(--soft);border-top:1px solid var(--line)}.replying button{margin-left:6px;color:var(--gold)}
#chatpop .replying:not(:empty){margin:0 -12px}
label.cbtn{cursor:pointer}
.mact button svg{width:100%;height:100%}
.plan li.todo{cursor:pointer}
.rdetail .vmsg{margin:10px 0}
.drop{cursor:pointer}
@media (max-width:900px){#nav{height:76px}.login{min-height:100dvh}.welcome .login-img{height:240px}.bellbtn.inl{width:40px;height:40px}.sh .row{width:100%}.gchip{flex:1}}
.cardset .photo,.past .photo{max-width:440px}.rdetail .photo{max-width:340px}
@media (max-width:900px){#nav{top:auto;bottom:0}.mact{opacity:0;pointer-events:none}.cm.act .mact{opacity:1;pointer-events:auto}}
