/* Atlas Meydan deneme · tema değişkenleri theme.js tarafından ayarlanır */
*{box-sizing:border-box}
:root{color-scheme:dark;--bg:#0b0912;--text:#e7e2f5;--accent:#8f78d9;--on-accent:#fff;--rs:1;--font:'Segoe UI Variable Text','Segoe UI',system-ui,sans-serif;--stars:1;
--muted:color-mix(in srgb,var(--text),var(--bg) 38%);--soft:color-mix(in srgb,var(--text),var(--bg) 52%);
--glass:color-mix(in srgb,var(--text) 5%,transparent);--glass2:color-mix(in srgb,var(--text) 3%,transparent);--hover:color-mix(in srgb,var(--text) 8%,transparent);
--free:#7fd6a0;--game:#8fb8ff;--busy:#e0a46a;--live:#e88aa8;--r:calc(18px*var(--rs))}
body{margin:0;min-height:100vh;color:var(--text);font:14.5px/1.5 var(--font);
background:radial-gradient(1100px 700px at 15% 0%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 70%),radial-gradient(900px 700px at 95% 100%,color-mix(in srgb,var(--accent) 11%,transparent),transparent 70%),var(--bg);background-attachment:fixed}
#sky{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:calc(var(--stars)*.55)}#sky i{position:absolute;border-radius:50%;background:var(--text)}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer;border:0;border-radius:calc(12px*var(--rs));padding:8px 13px;background:var(--hover)}
button:hover{background:color-mix(in srgb,var(--text) 13%,transparent)}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.primary{background:var(--accent);color:var(--on-accent);font-weight:600}.primary:hover{background:color-mix(in srgb,var(--accent),#fff 12%)}
input,textarea,select{display:block;width:100%;margin-top:6px;padding:10px 12px;border-radius:calc(12px*var(--rs));border:1px solid color-mix(in srgb,var(--text) 12%,transparent);background:color-mix(in srgb,var(--bg),transparent 30%)}
textarea{resize:vertical}label{display:block;margin:12px 0}small,.muted{color:var(--muted)}small{font-size:12.5px}
h1{font-size:24px;font-weight:600;margin:0}h2{font-size:18px;font-weight:600;margin:0 0 6px}h3{font-size:15px;font-weight:600;margin:0}p{margin:6px 0}
.row{display:flex;align-items:center;gap:10px}.between{justify-content:space-between}.end{justify-content:flex-end;margin-top:14px}.wrap{flex-wrap:wrap}
.eyebrow{font-size:11px;letter-spacing:.14em;color:var(--muted)}

/* yan menü: yüzen cam panel */
.side{position:fixed;top:14px;bottom:14px;left:14px;width:220px;display:flex;flex-direction:column;padding:20px 14px;border-radius:calc(22px*var(--rs));background:var(--glass);backdrop-filter:blur(14px);box-shadow:0 10px 36px #0006;z-index:5}
.brand{font-size:20px;font-weight:700;padding:0 10px 20px;color:color-mix(in srgb,var(--accent),var(--text) 55%)}
nav{display:flex;flex-direction:column;gap:3px}
nav a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:calc(12px*var(--rs));color:var(--muted);font-size:15px}
nav a:hover{background:var(--hover);color:var(--text)}nav a.active{background:var(--hover);color:var(--text)}
.ni{width:20px;text-align:center;font-size:16px}
.count{margin-left:auto;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--live);color:#1a0d14;font-size:11.5px;display:grid;place-items:center}
.side-foot{margin-top:auto;display:flex;gap:8px;align-items:center}
.me-chip{flex:1;display:flex;gap:10px;align-items:center;text-align:left;padding:8px 10px;min-width:0}.me-chip b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.me-chip small{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.icon-btn{padding:8px 10px;font-size:15px}
.st{width:10px;height:10px;border-radius:50%;display:inline-block;flex:none;background:var(--free)}
.st.free{background:var(--free)}.st.game{background:var(--game)}.st.busy{background:var(--busy)}.st.hidden{background:transparent;box-shadow:inset 0 0 0 2px var(--soft)}.st.live{background:var(--live)}

main{margin-left:248px;padding:18px 28px 120px}
.topbar{display:flex;justify-content:space-between;align-items:center;min-height:30px;margin-bottom:8px;color:var(--muted);font-size:13px}
.badge{font-size:11.5px;padding:4px 10px;border-radius:999px;background:var(--glass2);color:var(--soft)}

.panel{background:var(--glass);border-radius:calc(20px*var(--rs));padding:16px 18px;box-shadow:0 10px 30px #0005;backdrop-filter:blur(12px)}
.ph{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:12px}.ph small{font-size:12.5px}
.inner{background:var(--glass2);border-radius:calc(14px*var(--rs));padding:10px}
.grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px;align-items:start}
.col{display:flex;flex-direction:column;gap:20px;min-width:0}
.hello{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;margin-bottom:18px;flex-wrap:wrap}.hello p{color:var(--muted);margin:2px 0 0}

.av{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-weight:600;font-size:14px;flex:none;color:#fff;position:relative}
.av.sm{width:26px;height:26px;font-size:11px}.av.lg{width:84px;height:84px;font-size:32px}
.av .st{position:absolute;right:-1px;bottom:-1px;width:11px;height:11px;border:2px solid var(--bg)}
.people{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.per{display:flex;gap:10px;align-items:center;text-align:left;padding:10px;background:var(--glass2);border-radius:calc(14px*var(--rs))}
.per:hover{background:var(--hover)}.per b{display:block;font-size:14px}
.tag{display:inline-block;font-size:11.5px;padding:2px 8px;border-radius:999px;margin-top:3px;background:var(--hover);color:var(--muted)}
.tag.free{background:color-mix(in srgb,var(--free) 14%,transparent);color:var(--free)}.tag.game{background:color-mix(in srgb,var(--game) 14%,transparent);color:var(--game)}
.tag.busy{background:color-mix(in srgb,var(--busy) 14%,transparent);color:var(--busy)}.tag.live{background:color-mix(in srgb,var(--live) 14%,transparent);color:var(--live)}

.plans{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.plan{display:flex;flex-direction:column;padding:14px;background:var(--glass2);border-radius:calc(16px*var(--rs))}
.plan.top{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 45%,transparent)}
.plan .ico{font-size:20px}.plan b{margin:6px 0 2px;font-size:14.5px}.plan .faces{display:flex;align-items:center;gap:8px;margin:10px 0;font-size:12.5px;color:var(--muted);min-height:26px}
.stack{display:flex}.stack .av{margin-right:-7px;border:2px solid color-mix(in srgb,var(--bg),var(--text) 6%)}
.plan button{margin-top:auto;width:100%}
.addrow{display:flex;gap:8px;margin-top:12px}.addrow input{margin:0}.addrow button{flex:none}

.shared{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.sh{display:flex;gap:12px;align-items:center;padding:10px;background:var(--glass2);border-radius:calc(14px*var(--rs))}
.th{width:64px;height:46px;border-radius:calc(10px*var(--rs));flex:none;display:grid;place-items:center;font-size:18px}
.sh b{display:block;font-size:13.5px;line-height:1.35}.sh a{text-decoration:underline;text-underline-offset:2px}

.ntf{display:flex;gap:10px;align-items:center;width:100%;text-align:left;padding:7px 6px;background:none;font-size:13.5px}
.ntf:hover{background:var(--hover)}.ntf small{margin-left:auto;white-space:nowrap}
.ntf.new{font-weight:600}.ntf.new::after{content:'';width:7px;height:7px;border-radius:50%;background:var(--live);flex:none}
.vote{display:block;width:100%;text-align:left;padding:8px 10px;margin:6px 0;background:var(--glass2)}
.vote .row{font-size:13.5px}.vote.mine{box-shadow:inset 0 0 0 1px var(--accent)}
.bar{height:6px;border-radius:6px;background:var(--hover);margin-top:6px;overflow:hidden}.bar i{display:block;height:100%;background:var(--accent);border-radius:6px;transition:width .3s}

/* mesajlar */
.dm{display:grid;grid-template-columns:280px minmax(0,1fr);gap:20px;height:calc(100vh - 110px);min-height:420px}
.dm-list{display:flex;flex-direction:column;gap:4px;overflow:auto}
.conv{display:flex;gap:10px;align-items:center;text-align:left;padding:10px;background:none;width:100%}
.conv:hover,.conv.on{background:var(--hover)}.conv span.t{min-width:0;flex:1}.conv b{display:block;font-size:14px}
.conv small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.conv .count{margin:0}
.chat{display:flex;flex-direction:column;min-height:0}
.chat-head{display:flex;gap:12px;align-items:center;padding-bottom:12px}
.msgs{flex:1;overflow:auto;display:flex;flex-direction:column;gap:8px;padding:6px 2px}
.msg{max-width:70%;padding:8px 12px;border-radius:16px;background:var(--glass2);align-self:flex-start;word-wrap:break-word}
.msg.me{align-self:flex-end;background:color-mix(in srgb,var(--accent) 30%,transparent)}.msg small{display:block;font-size:11px;margin-top:2px}
.typing{font-size:12.5px;color:var(--muted);min-height:20px;padding:2px}
.send{display:flex;gap:8px;padding-top:8px}.send input{margin:0}
.empty{color:var(--muted);text-align:center;padding:40px 10px}

/* profil */
.cover{height:120px;border-radius:calc(20px*var(--rs));background:linear-gradient(120deg,color-mix(in srgb,var(--accent) 45%,var(--bg)),color-mix(in srgb,var(--accent) 12%,var(--bg)))}
.prof-head{display:flex;gap:18px;align-items:flex-end;margin:-42px 0 0 22px;flex-wrap:wrap}
.prof-head .av.lg{border:4px solid var(--bg)}.prof-head .actions{margin-left:auto;margin-right:12px;display:flex;gap:8px}
.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{font-size:12.5px;padding:4px 10px;border-radius:999px;background:var(--hover)}
.links a{display:inline-block;margin:4px 8px 0 0;padding:6px 12px;border-radius:999px;background:var(--hover);font-size:13px}
.now{display:flex;gap:10px;align-items:center}

/* odalar */
.rooms{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.room{display:flex;flex-direction:column;gap:6px}.room .row{min-height:28px}.room button{margin-top:8px}
.room.in{box-shadow:0 10px 30px #0005,inset 0 0 0 1px color-mix(in srgb,var(--accent) 55%,transparent)}

/* AtlasBot */
.bot{position:fixed;right:22px;bottom:20px;display:flex;align-items:flex-end;gap:10px;z-index:6}
.bubble{position:relative;max-width:280px;padding:10px 30px 10px 14px;border-radius:16px 16px 4px 16px;background:color-mix(in srgb,var(--bg) 88%,var(--accent));box-shadow:0 10px 30px #0007;font-size:13.5px}
.bubble small{display:block;font-size:11.5px}.bubble .x{position:absolute;top:4px;right:4px;padding:2px 7px;background:none;color:var(--muted)}
.bot.closed .bubble{display:none}
.botav{width:46px;height:46px;border-radius:16px;padding:0;font-size:22px;background:linear-gradient(145deg,var(--accent),color-mix(in srgb,var(--accent),#000 45%));box-shadow:0 6px 18px #0006}

dialog{width:min(460px,94vw);border:0;border-radius:calc(18px*var(--rs));background:color-mix(in srgb,var(--bg) 92%,var(--accent));color:var(--text);padding:20px;box-shadow:0 20px 60px #000a}
dialog::backdrop{background:#0009}.st-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:10px}
.st-grid label{display:flex;gap:8px;align-items:center;margin:0;padding:8px 10px;border-radius:12px;background:var(--glass2);cursor:pointer}
.st-grid input{width:auto;margin:0}.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.two label{margin:4px 0}
#toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);padding:10px 16px;border-radius:12px;background:color-mix(in srgb,var(--bg) 85%,var(--accent));box-shadow:0 10px 30px #0008;display:none;z-index:9}

/* tema paneli (theme.js) */
#theme-dialog .tgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.tpre{display:flex;gap:9px;align-items:center;text-align:left;font-size:12.5px;padding:8px}.tpre.on{box-shadow:inset 0 0 0 1px var(--accent)}
.tsw{display:inline-flex;gap:3px;padding:5px;border:2px solid;border-radius:8px}.tsw i{width:11px;height:11px;border-radius:50%}
.tcols{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.tcols input{height:38px;padding:2px;cursor:pointer}
.check{display:flex;gap:10px;align-items:center}.check input{width:auto;margin:0}

@media(max-width:1100px){.grid{grid-template-columns:1fr}}
@media(max-width:760px){
.side{top:auto;bottom:0;left:0;right:0;width:auto;flex-direction:row;padding:6px;border-radius:18px 18px 0 0}
.brand,.side-foot .me-chip{display:none}nav{flex-direction:row;flex:1}nav a{flex:1;flex-direction:column;gap:2px;padding:6px 4px;font-size:11.5px;position:relative}
nav a .count{position:absolute;top:2px;right:18%}.side-foot{margin:0}
main{margin:0;padding:14px 14px 150px}.bot{bottom:84px;right:12px}.bubble{max-width:220px}
.dm{grid-template-columns:1fr;height:auto}.dm.open .dm-list{display:none}.dm:not(.open) .chat{display:none}
.prof-head{margin-left:10px}.two{grid-template-columns:1fr}}
/* küçük düzeltmeler (ilk test) */
.me-chip>span:last-child{min-width:0}.tag{white-space:nowrap}.vote .bar{display:block}
.plans{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.shared{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.prof-head h1{text-shadow:0 2px 12px #0008}

/* ===== canlı sürüm ekleri ===== */
body{background:radial-gradient(1100px 700px at 15% 0%,color-mix(in srgb,var(--accent) 20%,transparent),transparent 70%),radial-gradient(900px 700px at 95% 100%,color-mix(in srgb,var(--accent) 14%,transparent),transparent 70%),var(--bg);background-attachment:fixed}
#sky{opacity:calc(var(--stars)*.75)}
.notebar{margin:0 0 14px;padding:10px 14px;border-radius:14px;background:color-mix(in srgb,var(--busy) 14%,transparent);color:var(--text);font-size:13.5px}
button.link{background:none;padding:2px 4px;color:var(--muted);font-size:12.5px;text-decoration:underline;text-underline-offset:2px}
.per{border:0;color:inherit;font:inherit;width:100%;cursor:pointer}
.list{display:flex;flex-direction:column;gap:8px}
.per.wide{cursor:default;justify-content:space-between;flex-wrap:wrap}.per.wide:hover{background:var(--glass2)}
.pl{display:flex;gap:10px;align-items:center;text-align:left;background:none;padding:0}.pl:hover{background:none}.pl b{display:block}
.acts{display:flex;gap:8px;flex-wrap:wrap}
.plan .link{margin-top:6px;align-self:center;width:auto}
.ntf{color:inherit;font:inherit}
.mob-back{display:none}
@media(max-width:760px){.mob-back{display:inline-block;font-size:18px;text-decoration:none}.per.wide .acts{width:100%}}
.count[hidden]{display:none}
@media(max-width:760px){.addrow{flex-wrap:wrap}.addrow input{flex:1 1 100%}.addrow button{flex:1}}

.msg .who{display:block;font-size:12px;opacity:.75;margin-bottom:2px}
.dm-list .addrow{margin-top:auto;padding-top:10px}

/* sesli odalar */
#voice-list{margin-bottom:14px}
.vch{padding:10px;border-radius:12px;margin-bottom:6px;background:color-mix(in srgb,var(--text) 4%,transparent)}
.vch.on{background:color-mix(in srgb,var(--accent) 16%,transparent)}
.vch small{display:block;margin-top:4px}
.vppl{display:flex;flex-direction:column;gap:4px;margin-top:8px}
.vp{display:flex;gap:8px;align-items:center;font-size:13px}
.vp .av{transition:box-shadow .15s}.vp.talk .av{box-shadow:0 0 0 2px #6fd39a}
button.sm{padding:5px 10px;font-size:12.5px}
.verr{color:#f0a3a3;font-size:13px;margin:8px 0}
.meter{display:block;height:4px;border-radius:4px;background:color-mix(in srgb,var(--text) 10%,transparent);overflow:hidden;margin:6px 0}
.meter i{display:block;height:100%;width:0;background:#6fd39a;transition:width .1s}
.tag.vtag{margin-left:6px;background:color-mix(in srgb,#6fd39a 18%,transparent)}
.voice-bar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:10px;margin:10px 0;border-radius:14px;background:color-mix(in srgb,var(--accent) 16%,transparent)}
.voice-bar[hidden]{display:none}
.voice-bar .vb-t{flex:1 1 100%;min-width:0}.voice-bar b{display:block;font-size:13.5px}.voice-bar small{display:block;font-size:12px}.voice-bar small.bad{color:#f0a3a3}
.voice-bar .meter{flex:1 1 100%;margin:2px 0}
@media(max-width:760px){.voice-bar{position:fixed;left:10px;right:10px;bottom:76px;margin:0;z-index:6;backdrop-filter:blur(14px);background:color-mix(in srgb,var(--bg) 70%,var(--accent) 30%)}.voice-bar .vb-t{flex:1 1 auto}.voice-bar .meter{display:none}}
@media(max-width:760px){body.in-voice .bot{bottom:150px}body.in-voice main{padding-bottom:210px}}
.verr{white-space:pre-line}
.dm-list #voice-list .vch{margin-bottom:6px}

/* bedava oyun radarı */
.fglist{display:flex;flex-direction:column;gap:10px;margin-bottom:10px}
.fg{display:flex;gap:10px;align-items:center}.fg b{display:block;font-size:14px}.fg small{display:block}
.fg .th{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:none}

.vsoon{font-size:12.5px;margin:8px 0}.verr{color:var(--muted,#b9aedd)}
.freeform{display:flex;flex-direction:column;gap:8px;margin-top:8px}.freeform input,.freeform select{margin:0;width:100%;min-width:0}.freeform .frow{display:flex;gap:8px}.freeform .frow select{flex:0 0 90px}.freeform .frow input{flex:1}.freeform .frow button{flex:0 0 auto}

/* tepkiler, karşılama, yayında */
.rx{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
button.rxc{padding:1px 8px;min-height:0;font-size:12px;border-radius:10px;background:color-mix(in srgb,var(--text) 8%,transparent);line-height:1.6}
button.rxc.mine{background:color-mix(in srgb,var(--accent) 35%,transparent)}
button.rxc.pick{font-size:14px}
.welcome{margin-bottom:16px}.welcome ol{margin:6px 0 14px;padding-left:20px;display:flex;flex-direction:column;gap:6px}
.btnlink{padding:7px 12px;border-radius:10px;background:color-mix(in srgb,var(--accent) 30%,transparent);text-decoration:none;white-space:nowrap}

/* oyunlar */
.gtabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
button.gtab{padding:8px 14px;border-radius:999px;background:color-mix(in srgb,var(--text) 6%,transparent)}
button.gtab.on{background:color-mix(in srgb,var(--accent) 32%,transparent)}.gtab small{opacity:.7;margin-left:4px}
.gfilter{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}.gfilter input[type=search]{margin:0}
.gtags{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
button.chip{border:0;cursor:pointer}button.chip.on{background:color-mix(in srgb,var(--accent) 38%,transparent)}
.games{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.gcard{padding:14px;border-radius:14px;background:color-mix(in srgb,var(--text) 5%,transparent);display:flex;flex-direction:column;gap:8px}
.gh{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.gh b{font-size:15px}
.gbadge{padding:1px 8px;border-radius:999px;font-size:12px;background:color-mix(in srgb,#6fd39a 22%,transparent)}.gbadge.soft{background:color-mix(in srgb,var(--text) 10%,transparent)}
.gnote{margin:0;font-size:13.5px}.grow{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:2px}
.gtagpick{border:0;padding:0;margin:6px 0;display:flex;flex-wrap:wrap;gap:6px}.gtagpick legend{padding:0;margin-bottom:6px}
.tp{display:inline-flex;gap:6px;align-items:center;padding:4px 10px;border-radius:999px;background:color-mix(in srgb,var(--text) 7%,transparent);font-size:13px;margin:0}.tp input{width:auto;margin:0}
.st-grid label{margin:0}
.st-grid.g3{grid-template-columns:repeat(3,1fr)}.gcard small{color:color-mix(in srgb,var(--text) 62%,transparent)}.gcard small .link{color:inherit}
@media(max-width:760px){button.gtab{padding:7px 12px}.games{grid-template-columns:1fr}}

/* ===== görünüm turu (9 Kasım) ===== */
.topbar{display:none}main{padding-top:26px}
.ni{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tag{line-height:1.5;vertical-align:middle}

/* Şimdi */
.statuschip{display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px}.statuschip small{margin-left:4px;font-size:11.5px}
.people{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
.per{position:relative}.per .pl{flex:1;min-width:0}.per .pl span{min-width:0}
.per.here{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--free) 35%,transparent)}
.poke{flex:none;padding:5px 8px;font-size:15px;border-radius:10px;background:color-mix(in srgb,var(--accent) 22%,transparent)}
.poke:hover{background:color-mix(in srgb,var(--accent) 40%,transparent)}
.plans{display:flex;flex-direction:column;gap:8px}
.plan{flex-direction:row;align-items:center;gap:12px;padding:10px 12px;border-radius:calc(14px*var(--rs))}
.plan .pinfo{flex:1;min-width:0}.plan .pinfo b{display:block;margin:0;font-size:14.5px}.plan .pinfo small{display:block}
.plan .pinfo .link{margin:0;padding:0 2px;font-size:12px}
.plan button.vbtn{width:auto;margin:0;flex:none;min-width:86px}
.plan.top{background:color-mix(in srgb,var(--accent) 10%,transparent)}
.th{width:40px;height:40px}
button.fg{width:100%;text-align:left;background:none;padding:4px;border-radius:12px}button.fg:hover{background:var(--hover)}
.vote.mine{background:color-mix(in srgb,var(--accent) 14%,transparent)}

/* mesaj balonları */
.msgs{gap:0;padding:6px 40px}
.msg{position:relative;margin-top:10px;padding:7px 12px 6px;line-height:1.45}
.msg.cont{margin-top:3px}
.msg.me.cont{border-top-right-radius:6px}.msg:not(.me).cont{border-top-left-radius:6px}
.msg .tm{display:inline-block;float:right;margin:5px 0 0 10px;font-size:10.5px;line-height:1;color:var(--soft)}
.msg .rx{clear:both;padding-top:4px}
.rxa{position:absolute;top:50%;transform:translateY(-50%);right:-34px;width:28px;height:28px;padding:0;border-radius:50%;font-size:14px;line-height:28px;text-align:center;background:var(--glass);color:var(--muted);opacity:0;transition:opacity .12s}
.msg.me .rxa{right:auto;left:-34px}
@media(hover:hover){.msg:hover .rxa,.rxa:focus-visible{opacity:1}}
@media(hover:none){.rxa{opacity:.55}}
body[data-page=mesajlar] main,body[data-page=odalar] main{padding-bottom:18px}
.dm{height:calc(100vh - 44px)}

/* oyun kartları */
.gcard{box-shadow:inset 3px 0 0 var(--sc)}
.gh a{text-decoration:none}.gh a:hover{text-decoration:underline}
.store{display:inline-flex;align-items:center;gap:5px}.store i{width:8px;height:8px;border-radius:50%;background:var(--sc)}
.gbadge.sale{background:color-mix(in srgb,var(--busy) 26%,transparent)}
.gwho{display:flex;align-items:center;gap:10px;min-height:26px}.gwho .stack{margin-right:6px}
.grow{margin-top:auto;padding-top:4px}
.gchip{cursor:pointer}.gchip:hover{background:color-mix(in srgb,var(--accent) 30%,transparent)}

@media(max-width:1100px){
  .grid.nowg>.col{display:contents}.grid.nowg{display:flex;flex-direction:column;gap:20px;align-items:stretch}
  .s-ntf{order:1}.s-live{order:2}.s-who{order:3}.s-plans{order:4}.s-radar{order:5}.s-poll{order:6}.s-shared{order:7}
  .s-ntf.is-empty{display:none}
}
@media(max-width:760px){
  main{padding-top:16px}
  .side-foot{display:none}
  nav a{font-size:10.5px;padding:6px 2px}.ni{width:22px;height:22px}
  .botav{width:38px;height:38px;font-size:18px;border-radius:13px}.bot{bottom:80px;right:10px}
  body[data-page=mesajlar] main,body[data-page=odalar] main{padding-bottom:84px}
  .dm.open{height:calc(100dvh - 100px)}.dm.open .chat{height:100%}
  .msgs{padding:6px 34px}.msg{max-width:82%}
  .hello h1{font-size:21px}
  .people{grid-template-columns:1fr}
  .plan{flex-wrap:wrap}.plan .stack{order:3}
}
body[data-page=mesajlar] .bot,body[data-page=odalar] .bot{display:none}

/* ---------- oda kategorileri ---------- */
.cat{margin-bottom:6px}
.cathead{display:flex;align-items:center;gap:8px;width:100%;text-align:left;background:none;padding:8px 10px;font-size:12px;letter-spacing:.06em;font-weight:700;color:var(--muted)}
.cathead:hover:not(.static){color:var(--text)}.cathead .car{font-size:10px;width:10px}.cathead small{margin-left:auto;font-size:11.5px;letter-spacing:0}
.cathead .count{margin:0}.cathead.static{cursor:default;margin-top:8px;border-top:1px solid var(--line, rgba(255,255,255,.08));padding-top:14px;border-radius:0}
.cat .conv{padding-left:22px}
.addrow select{flex:1 1 100%;margin:0}
#voice-list .vch,#voice-list .muted,#voice-list .verr,#voice-list .link{margin-left:10px;margin-right:10px}
#room-form{flex-wrap:wrap}#room-form input{flex:1 1 0;min-width:0}
.conv .count,.cathead .count{min-width:10px;width:10px;height:10px;padding:0;font-size:0;border-radius:50%}
.dm-list .addrow{position:sticky;bottom:0;z-index:2;padding:10px 0 2px;background:color-mix(in srgb,var(--bg) 92%,transparent)}

/* ---------- genel sohbet paneli + sesli odalar sayfası ---------- */
.gfab{position:fixed;right:22px;bottom:84px;width:46px;height:46px;border-radius:16px;padding:0;font-size:21px;z-index:7;background:var(--accent);color:#fff;box-shadow:0 6px 18px #0006;display:grid;place-items:center}
.gfab.on{display:none}.gfab .count{position:absolute;top:-4px;right:-4px;min-width:12px;width:12px;height:12px;padding:0;font-size:0;border-radius:50%;border:2px solid var(--bg)}
.gchat{position:fixed;top:14px;right:14px;bottom:14px;width:380px;max-width:calc(100vw - 28px);z-index:9;display:flex;flex-direction:column;padding:16px;border-radius:calc(20px*var(--rs));background:color-mix(in srgb,var(--bg) 94%,var(--text) 6%);border:1px solid color-mix(in srgb,var(--text) 12%,transparent);box-shadow:0 12px 40px #000a}
.gchat[hidden]{display:none}.gchat .gh{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding-bottom:10px;border-bottom:1px solid color-mix(in srgb,var(--text) 10%,transparent);margin-bottom:6px}
.gchat .msgs{padding:6px 2px}
.vpage{max-width:760px;margin:0 auto}
.vpage .vch{margin-bottom:8px}.vpage .addrow{margin-top:14px}
@media(max-width:760px){
  .gfab{right:10px;bottom:128px;width:40px;height:40px;font-size:19px;border-radius:13px}
  body.in-voice .gfab{bottom:198px}
  body[data-page=mesajlar] .gfab{display:none}
  .gchat{inset:0;width:auto;max-width:none;border-radius:0;z-index:30;padding:14px}
}
.vpage .cathead.static{border-top:0;margin-top:0;padding-top:4px}
.vch .vby{display:block;font-weight:400;margin-top:1px}.vch .vact{display:flex;align-items:center;gap:12px;flex:none}

/* ---------- oda gizliliği, yönetim ---------- */
.vch .vdesc{margin:6px 0 0;font-size:13.5px}.vch .vnow{margin:4px 0 0;font-size:13px;color:var(--free)}
.vch .vrej{margin:6px 0 0;font-size:13px;color:var(--muted)}.vch .vcnt{display:block;margin-top:4px}
.vch.lock{opacity:.92;border:1px dashed color-mix(in srgb,var(--text) 18%,transparent)}
.vreq{display:flex;align-items:center;gap:10px;margin-top:10px;padding:8px 10px;border-radius:12px;background:color-mix(in srgb,var(--accent) 14%,transparent)}
.vreq>span:nth-child(2){flex:1;min-width:0;font-size:13.5px}.vact{display:flex;align-items:center;gap:10px;flex:none;flex-wrap:wrap;justify-content:flex-end}
.privpick{border:0;padding:0;margin:12px 0 4px;display:grid;gap:6px}.privpick legend{font-size:13px;margin-bottom:4px;padding:0}
.privpick .tp{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;padding:8px 10px;border-radius:12px;background:color-mix(in srgb,var(--text) 5%,transparent)}.privpick .tp input{width:auto;margin:0}
#room-dialog{width:min(560px,94vw);max-height:92vh;overflow:auto}#room-dialog h3{margin:18px 0 4px;font-size:15px}
.rdrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px;padding:6px 0}.rdrow>b{flex:1;min-width:90px}.rdrow select{flex:1;margin:0;min-width:0}.rdrow.end{justify-content:flex-end;margin-top:18px}
.rdrow .tp{font-size:12.5px;display:flex;gap:4px;align-items:center}.rdrow .tp input{width:auto;margin:0}
button.danger{background:color-mix(in srgb,var(--busy) 24%,transparent);color:var(--text)}
.vnow .vsub{display:block;font-weight:400}.s-voice .ntf.vnow{width:100%}
@media(max-width:760px){.vch .row.between{flex-wrap:wrap;gap:8px}}
#rd-pw[hidden],#rj-custom[hidden],#g-discount[hidden],#g-until[hidden]{display:none}

/* ---------- sesli oda kartları (oyun kartı düzeni) ---------- */
.vpage{max-width:1100px}
.vtop{align-items:center;margin-bottom:16px}.vtop h2{margin:0 0 4px;font-size:22px}
.vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px}
.vcard{min-height:170px}.vcard.on{background:color-mix(in srgb,var(--free) 10%,transparent)}
.vcard.lock{border:1px dashed color-mix(in srgb,var(--text) 16%,transparent)}
.vcard .gh b{flex:1;min-width:0}.vcard .vset{margin-left:auto;font-size:12.5px}
.vcard .vnowline{margin:0;font-size:13px;color:var(--free)}
.vcard .vrej{margin:0;font-size:13px;color:color-mix(in srgb,var(--text) 62%,transparent)}
.vcard .vreq{margin-top:0}
.vstack .vp{position:relative;display:inline-flex;border-radius:50%}
.vstack .vp.talk .av{box-shadow:0 0 0 2px var(--free)}
.vstack .vmuted{position:absolute;right:-4px;bottom:-4px;font-size:9px;font-style:normal;line-height:1;background:var(--bg);border-radius:50%;padding:1px}
#voice-list .vsoon{margin-top:14px}
@media(max-width:760px){.vtop{flex-direction:column;align-items:stretch;gap:10px}.vgrid{grid-template-columns:1fr}}

/* ---------- salonlar: müzik + yayın ---------- */
.salon{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:14px;align-items:start}
.salon .smain{display:flex;flex-direction:column;gap:14px;min-width:0}
.schat{display:flex;flex-direction:column;position:sticky;top:14px}.schat .msgs{min-height:260px;max-height:58vh}
.vtop .link{padding:0;margin-bottom:6px}
.btnlink{display:inline-block;padding:8px 14px;border-radius:calc(12px*var(--rs));background:color-mix(in srgb,var(--text) 10%,transparent);text-decoration:none;color:var(--text);font-size:14px}
.btnlink.primary{background:var(--accent);color:#fff}
.nowplay{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:4px 0 8px}.nowplay b{display:block;font-size:17px}.nowplay small{display:block}
.qrow{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid color-mix(in srgb,var(--text) 8%,transparent)}.qrow>span:nth-child(2),.qrow>span:first-child:not(.av){flex:1;min-width:0}.qrow b{display:block;font-size:14px}.qrow small{display:block}.qrow.dim{opacity:.7}
.qform{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;margin-top:12px}.qform input{margin:0;min-width:0}
.bigscreen{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:18px;border-radius:16px;background:color-mix(in srgb,var(--live) 12%,transparent);margin-bottom:8px}.bs-t{flex:1;min-width:140px}.bs-t b{display:block;font-size:18px}
.ssince{display:flex;align-items:center;gap:8px}
@media(max-width:900px){.salon{grid-template-columns:1fr}.schat{position:static}.qform{grid-template-columns:1fr}}

/* profil sekmeleri, ayarlar, yapımcı */
.ptabs{display:flex;gap:6px;margin:16px 0 0;flex-wrap:wrap}
.ptabs button{background:transparent;border:1px solid var(--line,#ffffff1f);border-radius:999px;padding:6px 14px}
.ptabs button.on{background:var(--accent);color:var(--on-accent,#fff);border-color:transparent}
.fld{margin:10px 0}.fld label{display:block;font-size:13px;color:var(--muted);margin-bottom:4px}
.fld select,.fld input[type=range]{width:100%}
.sw{display:flex;gap:10px;align-items:flex-start;margin:10px 0;cursor:pointer}.sw input{margin-top:4px}
.sw small{display:block;color:var(--muted);font-size:12px;font-weight:400}
.meter{height:8px;border-radius:99px;background:var(--hover);margin:8px 0;overflow:hidden}.meter i{display:block;height:100%;width:0;background:var(--accent);transition:width .1s}
.tag.ctag{margin-left:6px;background:color-mix(in srgb,#e9b24a 20%,transparent);color:#e9b24a}
.crit{display:grid;gap:10px;margin:12px 0}.cr{display:flex;gap:10px}.cr .ck{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--hover);flex:none;font-size:13px}
.cr.ok .ck{background:color-mix(in srgb,#6fd39a 30%,transparent);color:#6fd39a}.cr small{display:block;color:var(--muted)}
.qt{margin:8px 0;padding:8px 12px;border-left:3px solid var(--accent);background:var(--hover);border-radius:6px;font-size:14px}
.cform{display:grid;gap:8px}.cform label{display:grid;gap:3px;font-size:13px;color:var(--muted)}
#capply textarea{width:100%;margin:6px 0}.capp{padding:10px 0;border-top:1px solid var(--line,#ffffff1a)}
.capp .rsn{width:100%;margin:6px 0}.rej{color:#e07a7a}.lnk{background:none;border:0;padding:0;color:var(--accent);text-decoration:underline;cursor:pointer}

/* keşfet */
#ask-text{white-space:pre-line}
.kd-top{display:flex;gap:8px;align-items:baseline}.kd-k{opacity:.7}.kd-act{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto;align-items:center}
.kd-act button.on{color:#e0679a}.kd-hid{opacity:.55}.kd-bar{display:flex;gap:8px}.kd-bar input{flex:1}
.chip.own{background:color-mix(in srgb,#e9b24a 20%,transparent);color:#e9b24a}button.chip{border:0;cursor:pointer}button.chip.on{background:var(--accent);color:var(--on-accent,#fff)}

/* ayarlar düzeni + açma/kapama + durum menüsü */
.sw{display:flex;gap:12px;align-items:center;margin:12px 0;cursor:pointer}.sw.r{justify-content:space-between}
.sw span{min-width:0}.sw b{display:block;font-weight:600}.sw small{display:block;color:var(--muted);font-weight:400}
.sw input[type=radio]{width:auto;margin:0;flex:none}
.sw input[type=checkbox]{appearance:none;-webkit-appearance:none;width:42px;height:24px;flex:none;margin:0;padding:0;border:0;border-radius:99px;background:color-mix(in srgb,var(--text) 18%,transparent);position:relative;cursor:pointer;transition:background .15s}
.sw input[type=checkbox]::after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .15s}
.sw input[type=checkbox]:checked{background:var(--accent)}.sw input[type=checkbox]:checked::after{left:21px}
.fld input[type=range]{margin:8px 0 0}
.aset{display:grid;grid-template-columns:200px minmax(0,640px);gap:20px;margin-top:16px;align-items:start}
.asub{display:flex;flex-direction:column;gap:4px;position:sticky;top:12px}
.asub button{text-align:left;background:transparent;border:0;padding:10px 12px;border-radius:12px}.asub button.on{background:var(--hover);font-weight:600}
.apane{display:grid;gap:14px}
@media(max-width:760px){.aset{grid-template-columns:1fr}.asub{flex-direction:row;overflow-x:auto;position:static}.asub button{white-space:nowrap}}
#me-pop{position:fixed;left:14px;bottom:82px;width:296px;max-height:calc(100vh - 100px);overflow:auto;z-index:60;padding:14px;border-radius:18px;background:color-mix(in srgb,var(--bg) 92%,var(--text));border:1px solid color-mix(in srgb,var(--text) 14%,transparent);box-shadow:0 12px 40px #0008}
#me-pop .mp-head{display:flex;gap:10px;align-items:center;margin-bottom:10px}#me-pop .mp-head b{display:block}#me-pop .mp-head small{display:block}
.mp-st{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:8px}.mp-st button{display:flex;gap:8px;align-items:center;justify-content:flex-start;padding:8px 10px}
.mp-st button.on{outline:2px solid var(--accent)}#me-pop form input{margin:0 0 8px}
.mp-sep{height:1px;background:color-mix(in srgb,var(--text) 12%,transparent);margin:10px 0}
.mp-i{display:block;width:100%;text-align:left;border:0;background:transparent;padding:8px 10px;border-radius:10px}.mp-i:hover{background:var(--hover)}
button:disabled,textarea:disabled{opacity:.45;cursor:not-allowed}
.cform label.sw{display:flex;color:var(--text)}.cform label.sw small{color:var(--muted)}

/* etkinlik paneli */
#evp{position:fixed;right:14px;bottom:14px;width:370px;max-width:calc(100vw - 28px);max-height:82vh;overflow:auto;z-index:58;border-radius:18px;background:color-mix(in srgb,var(--bg) 92%,var(--text));border:1px solid color-mix(in srgb,var(--text) 14%,transparent);box-shadow:0 12px 40px #0009}
.evh{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid color-mix(in srgb,var(--text) 10%,transparent)}.evh .x{border:0;background:transparent;font-size:20px}.evb{padding:14px}
.evgames{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}.evg{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 6px;text-align:center}.evg span{font-size:22px}.evg b{font-size:12.5px}.evg.soon{opacity:.45}
.evrow{display:flex;gap:8px;align-items:center;padding:5px 0}.evrow span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.evrow.head{margin-top:8px;color:var(--muted)}
.evq h4{margin:4px 0 10px;font-size:17px}.evbar{height:6px;border-radius:9px;background:var(--hover);overflow:hidden;margin-bottom:10px}.evbar i{display:block;height:100%;width:100%;background:var(--accent);transition:width .5s linear}
.evopts{display:grid;gap:8px}.evo{text-align:left;padding:10px 12px}.evo.pick{outline:2px solid var(--accent)}.evo.ok{background:color-mix(in srgb,#6fd39a 28%,transparent)}.evo.bad{background:color-mix(in srgb,#e07a7a 28%,transparent)}.evo:disabled{opacity:1}
.evrow .av{flex:none;width:26px;height:26px}
.side-foot .me-chip{width:100%;flex:1;padding:10px 12px}.me-chip .chev{margin-left:auto;opacity:.55;font-style:normal;font-size:13px;flex:none}
.chip.kk{background:var(--hover);color:var(--muted)}

/* kelime */
.wword{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0;justify-content:center}.wl{min-width:26px;text-align:center;font-size:22px;font-weight:700;border-bottom:2px solid var(--accent);padding:0 2px}.wl.miss{color:#e07a7a}
.wlives{text-align:center;letter-spacing:2px}.wkeys{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}.wk{padding:7px 0;text-align:center}.wk.ok{background:color-mix(in srgb,#6fd39a 30%,transparent)}.wk.bad{background:color-mix(in srgb,#e07a7a 30%,transparent)}
.evrow.turn{font-weight:700}.evcfg{margin:6px 0}.evcfg summary{cursor:pointer;color:var(--muted);font-size:13px}

/* giriş kapısı + üyeler (kendi site) */
#gate{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:20px;background:radial-gradient(900px 600px at 30% 10%,color-mix(in srgb,var(--accent) 22%,transparent),transparent 70%),var(--bg)}
#gate[hidden]{display:none}
#gate .gbox{width:min(400px,100%);padding:28px;border-radius:calc(22px*var(--rs));background:var(--glass);border:1px solid color-mix(in srgb,var(--text) 10%,transparent);backdrop-filter:blur(14px);display:flex;flex-direction:column;gap:10px;text-align:center}
#gate .gbrand{font-size:26px;font-weight:700;color:color-mix(in srgb,var(--accent),var(--text) 55%);margin-bottom:4px}
#gate .gbtn{padding:12px 16px;font-size:15px}
#gate .gmsg{min-height:1.4em;margin:0}
.uylink{display:flex;gap:8px;margin-top:12px}.uylink input{margin:0}
.uyrow{padding:8px 0;border-top:1px solid color-mix(in srgb,var(--text) 8%,transparent);gap:10px}
.uyrow code{font-size:12.5px}
.vcard .vnote{margin:2px 0 0;font-size:12.5px;color:color-mix(in srgb,var(--busy),var(--text) 35%)}
.uytree{padding:5px 0 5px calc(var(--d)*18px);border-top:1px solid color-mix(in srgb,var(--text) 6%,transparent);font-size:13.5px}
.panel .vnote{margin:8px 0 0;font-size:13px;color:color-mix(in srgb,var(--busy),var(--text) 35%)}