:root{color-scheme:light;--bg:#fff;--c:#f4f6fb;--l:#dde3ef;--t:#0a1a3f;--m:#40507a;--a:#0b2255;--a2:#c98f0a;--me:#e3e9f7;--ok:#e3f5e9;--er:#fce6ea}
[data-theme=dark]{color-scheme:dark;--bg:#000;--c:#000;--l:#ffffff40;--t:#fff;--m:#fff;--a:#fff;--a2:#fff;--me:#000;--ok:#000;--er:#000}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--t);font:15px/1.45 system-ui,sans-serif;padding-bottom:calc(66px + env(safe-area-inset-bottom))}
a{color:inherit;text-decoration:none}.bd a,.lk,.pf a:not(.btn){color:var(--a)}main{max-width:620px;margin:0 auto;border-inline:1px solid var(--l);min-height:100vh}
input,textarea,select,button{font:inherit;color:inherit}input,textarea,select{background:var(--c);border:1px solid var(--l);border-radius:10px;padding:9px 11px;width:100%}textarea{resize:vertical}
button{cursor:pointer;background:none;border:0}.btn{display:inline-block;background:var(--c);border:1px solid var(--l);border-radius:20px;padding:7px 14px;width:auto;cursor:pointer;font-size:14px}.btn.pri{background:var(--a);border-color:var(--a);color:#fff;font-weight:700}
.nav{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-around;background:var(--c);border-top:1px solid var(--l);padding:6px 0 calc(6px + env(safe-area-inset-bottom));z-index:9}
.nav a{display:flex;flex-direction:column;align-items:center;font-size:11px;color:var(--m)}.nav a.on{color:var(--a)}.nav span{font-size:22px;position:relative}.nav i{position:absolute;top:-4px;right:-12px;background:#e0245e;color:#fff;font:700 10px/1 system-ui;padding:3px 5px;border-radius:9px}
.post{display:flex;gap:10px;padding:12px 14px;border-bottom:1px solid var(--l);flex-wrap:wrap}.post .pb{flex:1;min-width:0}.pin{width:100%;font-size:12px;color:var(--m)}.qt{border:1px solid var(--l);border-radius:12px;margin-top:8px;padding:8px}
.av{border-radius:50%;object-fit:cover;background:var(--l);display:inline-flex;align-items:center;justify-content:center;font-weight:700;flex:none}.ph{display:flex;gap:4px;align-items:baseline;flex-wrap:wrap;position:relative}.ph span,.t,.mu,small{color:var(--m);font-size:13px}.vf{color:#1d9bf0;font-size:12px;margin-left:3px}.vf.mv{color:#22a559}
.bd{white-space:pre-wrap;overflow-wrap:anywhere;margin:2px 0}.md,video{max-width:100%;border-radius:12px;margin-top:6px;max-height:480px}.lk{display:block;border:1px solid var(--l);border-radius:12px;padding:8px 10px;margin-top:6px;overflow:hidden}.lk small{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
.ac{display:flex;gap:6px;justify-content:space-between;margin-top:6px;color:var(--m)}.ac a,.ac button{color:var(--m);padding:4px 8px;border-radius:14px}.ac .on{color:#e0245e}.ac button[data-act=repost].on{color:#00ba7c}
.mn{margin-left:auto}.mn summary{cursor:pointer;color:var(--m);list-style:none;padding:0 6px}.mn div{position:absolute;right:0;top:22px;background:var(--c);border:1px solid var(--l);border-radius:10px;z-index:5;min-width:190px;display:flex;flex-direction:column}.mn div button{text-align:left;padding:10px 12px}.mn div button:hover{background:var(--l)}.bar .mn,.act .mn{position:relative}
.poll{margin-top:6px;display:grid;gap:5px}.poll button{border:1px solid var(--a);border-radius:10px;padding:7px;color:var(--a)}.pr{position:relative;border:1px solid var(--l);border-radius:10px;padding:7px 10px;display:flex;justify-content:space-between;overflow:hidden}.pr i{position:absolute;left:0;top:0;bottom:0;background:#3b82f633}.pr span,.pr b{position:relative}.pr.me{border-color:var(--a)}
.tabs{display:flex;border-bottom:1px solid var(--l);position:sticky;top:var(--hh,0px);background:var(--bg);z-index:4}.tabs a{flex:1;text-align:center;padding:12px 4px;color:var(--m)}.tabs a.on{color:var(--t);border-bottom:3px solid var(--a);font-weight:700}#rf{margin:8px 14px}
.cmp{padding:12px 14px;border-bottom:1px solid var(--l);display:grid;gap:8px}.row{display:flex;gap:8px;align-items:center;padding:8px 14px;flex-wrap:wrap}.cmp .row{padding:0}.row input,.row select{flex:1;min-width:120px}.cmp summary{cursor:pointer;color:var(--m)}
.fl{margin:10px 14px;padding:10px 12px;border-radius:10px;background:var(--ok)}.fl.err{background:var(--er)}.emp{color:var(--m);text-align:center;padding:28px 14px}.bar{padding:12px 14px;border-bottom:1px solid var(--l);display:flex;gap:10px;align-items:center;position:relative}.sec{padding:10px 14px 0;margin:0}
.ur,.nt{display:flex;gap:10px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--l)}.un{flex:1;display:flex;flex-direction:column}.nt.un{background:#3b82f612}.nt a{flex:1;display:flex;gap:10px;min-width:0}.nt q{display:block;color:var(--m);font-size:13px}.nt button{color:var(--m);padding:4px 8px}
.tr{display:flex;flex-direction:column;padding:10px 14px;border-bottom:1px solid var(--l)}.cv{display:block;padding:12px 14px;border-bottom:1px solid var(--l);position:relative}.cv span{display:block;color:var(--m);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cv i{position:absolute;right:14px;bottom:12px;background:var(--a);color:#fff;border-radius:10px;padding:1px 7px;font-style:normal;font-size:12px}.cv small{float:right}
#msgs{display:flex;flex-direction:column;gap:6px;padding:12px 14px;height:calc(100vh - 240px);overflow-y:auto}.bub{max-width:80%;padding:8px 11px;border-radius:14px;overflow-wrap:anywhere}.bub.me{align-self:flex-end;background:var(--me)}.bub.th{align-self:flex-start;background:var(--c)}.bub img,.bub video{max-width:100%;border-radius:10px}.bub small{display:block}
.ban{height:150px;background:var(--l) center/cover}.pf{padding:0 14px 8px}.pf .top{display:flex;justify-content:space-between;align-items:flex-end;margin-top:-42px}.pf .av{border:4px solid var(--bg)}.pf h1{margin:8px 0 0;font-size:20px}.act{display:flex;gap:6px;align-items:center}.act form{margin:0}
.auth{max-width:380px;margin:0 auto;padding:30px 18px;display:grid;gap:10px}.auth h1{text-align:center;color:var(--a)}.sr{display:flex;gap:8px;padding:12px 14px}
.thm{display:flex;flex-direction:column;align-items:center;font-size:11px;color:var(--m)}.nav .thm span{font-size:22px}.thm.fix{position:fixed;top:10px;right:10px;width:38px;height:38px;border-radius:50%;background:var(--c);border:1px solid var(--l);font-size:18px;z-index:10;justify-content:center;color:var(--t)}

.lsw{position:fixed;top:10px;right:56px;display:flex;gap:2px;z-index:10;background:var(--c);border:1px solid var(--l);border-radius:20px;padding:2px;height:38px;align-items:center}.lsw a{font-size:12px;font-weight:700;color:var(--m);padding:6px 9px;border-radius:16px}.lsw a.on{background:var(--a);color:#fff}

/* Shell: header selebar layar (logo di atas sidebar kiri) + sidebar kiri + konten + sidebar kanan; HP: header ringkas + navigasi bawah */
:root{--hh:60px;--side:244px;--rw:320px}
.hdr{position:sticky;top:0;z-index:10;height:var(--hh);width:100%;display:flex;align-items:center;gap:12px;padding:0 16px;background:color-mix(in srgb,var(--bg) 88%,transparent);-webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--l)}
.hdr .brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:18px;letter-spacing:-.2px;color:var(--t);white-space:nowrap;min-width:0}
.hdr .logo{flex:none;width:34px;height:34px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#60a5fa,var(--a));color:#fff;font-weight:900;font-size:19px;box-shadow:0 2px 8px #3b82f640}
.hdr .bn{overflow:hidden;text-overflow:ellipsis}
.hdr .hs{flex:1;max-width:520px;margin:0 auto;min-width:0}.hdr .hs input{border-radius:22px;padding:9px 16px;background:var(--c)}.hdr .hs input:focus{outline:2px solid var(--a);outline-offset:-1px;border-color:transparent}
.hdr .hr{display:flex;align-items:center;gap:8px;margin-left:auto;justify-content:flex-end}.hdr .lsw{position:static;height:32px}.hdr .lsw a{padding:4px 8px}
.hdr .thm.hb{flex-direction:row;width:32px;height:32px;border:1px solid var(--l);border-radius:50%;justify-content:center;font-size:16px;color:var(--t);background:var(--c)}.hdr .hav{display:flex}
.lside,.rside{display:none}
.rc{background:var(--c);border:1px solid var(--l);border-radius:16px;overflow:hidden}.rc h3{margin:0;padding:12px 14px 4px;font-size:17px}.rc .tr,.rc .ur{border-bottom:0}.rc .more{display:block;padding:12px 14px;color:var(--a)}.rf{color:var(--m);font-size:12px;padding:0 6px}
@media(max-width:700px){.hdr .hs{display:none}.hdr .bn{font-size:16px}}
@media(min-width:900px){
body{padding-bottom:0}.nav{display:none}
/* Header: kolom kiri selebar sidebar -> logo tepat di atas sidebar kiri */
.hdr{display:grid;grid-template-columns:var(--side) minmax(0,1fr) auto;gap:0 16px;padding:0 24px}
.hdr .hs{margin:0 auto;width:100%}
.hdr .hr{min-width:0}
.shell{display:grid;grid-template-columns:var(--side) minmax(0,1fr);gap:16px;width:100%;padding:0 24px;align-items:start}
.shell main{margin:0 auto;width:100%;max-width:640px;min-height:calc(100vh - var(--hh));border:1px solid var(--l);border-top:0;background:var(--bg)}
.lside{display:flex;flex-direction:column;gap:4px;position:sticky;top:var(--hh);height:calc(100vh - var(--hh));overflow-y:auto;padding:14px 0 16px;border-right:0}
.lside .sl{display:flex;align-items:center;gap:14px;padding:11px 14px;border-radius:12px;font-size:16px;color:var(--t);transition:background .15s}.lside .sl:hover{background:var(--c)}
.lside .sl.on{font-weight:700;color:var(--a);background:var(--c)}
.lside .sl span{position:relative;font-size:21px;width:28px;text-align:center}.lside .sl i{position:absolute;top:-4px;right:-8px;background:#e0245e;color:#fff;font:700 10px/1 system-ui;padding:3px 5px;border-radius:9px}
.lside .cta{justify-content:center;margin:10px 0 4px;background:var(--a);color:#fff;font-weight:700;border-radius:24px}.lside .cta:hover{background:var(--a);opacity:.9}
.lside .lme{display:flex;align-items:center;gap:10px;margin-top:auto;padding:10px 12px;border-radius:14px;border:1px solid var(--l);background:var(--c);min-width:0}.lside .lme span{display:flex;flex-direction:column;min-width:0}.lside .lme strong,.lside .lme small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
@media(min-width:1180px){
.hdr{grid-template-columns:var(--side) minmax(0,1fr) var(--rw)}
.shell{grid-template-columns:var(--side) minmax(0,1fr) var(--rw)}
.rside{display:flex;flex-direction:column;gap:12px;align-self:start;padding:14px 0 4px}
}

/* ===== Aturan GuE Trader: lonceng, laporan, moderasi, komentar, pratinjau tautan ===== */
.hdr .nf{position:relative}.hdr .hb.nfb{display:flex;align-items:center;justify-content:center;position:relative;width:32px;height:32px;border:1px solid var(--l);border-radius:50%;background:var(--c);font-size:15px;color:var(--t)}
.nfb b{position:absolute;top:-5px;right:-6px;background:#ef4444;box-shadow:0 0 0 2px var(--bg);color:#fff;font:700 10px/1 system-ui;padding:3px 5px;border-radius:9px}
.nfp{position:absolute;top:calc(100% + 10px);right:0;width:min(380px,92vw);max-height:70vh;display:flex;flex-direction:column;background:var(--bg);border:1px solid var(--l);border-radius:14px;box-shadow:0 12px 36px #0006;z-index:20;overflow:hidden}
.nfp[hidden]{display:none}.nfh{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 14px;border-bottom:1px solid var(--l)}.nfh .btn{padding:4px 10px;font-size:12px}
.nfl{overflow-y:auto;flex:1}.nfp .nt{padding:9px 14px}.nfp .more{display:block;text-align:center;padding:11px;border-top:1px solid var(--l);color:var(--a)}
@media(max-width:700px){.nfp{position:fixed;left:8px;right:8px;top:calc(var(--hh) + 6px);width:auto;max-height:calc(100vh - var(--hh) - 80px)}}
.post.gone .bd{color:var(--m);font-style:italic}.post.hidn .mh,.mh{color:var(--m);font-size:14px;padding:6px 0}.post.modh{outline:2px dashed #e0245e66;outline-offset:-3px}
.mtag{color:#e0245e;font-size:12px;font-weight:700}.ed{color:var(--m);font-size:12px}.ro{color:var(--m);padding:4px 8px}.mrep{display:block;padding:10px 12px;color:#e0245e}
.mn dialog,dialog{color:var(--t)}dialog{background:var(--bg);border:1px solid var(--l);border-radius:16px;padding:0;width:min(420px,92vw)}dialog::backdrop{background:#0009}
.dlg{display:grid;gap:10px;padding:16px}.dlg h3{margin:0}.dlg .err{color:#e0245e;min-height:1em;margin:0;font-size:13px}.dlg .row{padding:0;justify-content:flex-end}.rrs{display:grid;gap:6px}.rr{display:flex;gap:8px;align-items:center;cursor:pointer}.rr input{width:auto}
.tc{border-bottom:1px solid var(--l)}.tc .post{border-bottom:0}.tc-tg{display:block;margin:0 14px 8px 68px;color:var(--a);font-size:13px}.tc-rs{margin-left:44px;border-left:2px solid var(--l)}.tr2 .post{padding-top:8px}
.rpf{margin-left:44px;border-bottom:0}.flash{animation:fl 2s}@keyframes fl{from{background:#3b82f633}to{background:transparent}}
.lp-card{display:flex;flex-direction:column;border:1px solid var(--l);border-radius:12px;overflow:hidden;margin-top:6px;background:var(--c);color:var(--t)}.lp-img img{display:block;width:100%;max-height:220px;object-fit:cover}
.lp-text{display:flex;flex-direction:column;gap:2px;padding:8px 10px;min-width:0}.lp-text small{color:var(--m)}.lp-desc{color:var(--m);font-size:13px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lpv{position:relative}.lpv .lpx{position:absolute;top:8px;right:8px;z-index:2;width:26px;height:26px;border-radius:50%;background:#000a;color:#fff}
.chip{display:inline-block;background:var(--c);border:1px solid var(--l);border-radius:12px;padding:1px 8px;font-size:12px;margin:2px 2px 2px 0}.rc2{align-items:flex-start}.rc2 .ra{display:flex;flex-direction:column;gap:6px}.rc2 q{display:block;color:var(--m);font-size:13px}
.pub{max-width:620px;margin:0 auto;padding:18px 14px}.pbrand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:18px;margin-bottom:14px}.pbrand .logo{width:34px;height:34px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#60a5fa,var(--a));color:#fff;font-weight:900}
.cta2{margin-top:16px;padding:16px;border:1px solid var(--l);border-radius:14px;background:var(--c);text-align:center}
.rpf[hidden],.lpv[hidden],.tc-rs[hidden],.tc-tg[hidden]{display:none}
/* panel admin */
.sub .tabs{position:static;border-bottom:0;border-top:1px solid var(--l)}
.stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;padding:14px}
.stat{background:var(--c);border:1px solid var(--l);border-radius:12px;padding:12px;display:block}
a.stat:hover{border-color:var(--a)}
.stat b{display:block;font-size:24px}
.stat span{color:var(--m);font-size:13px}
.chart{padding:6px 14px 14px}.chart h4{margin:8px 0}.chart small{color:var(--m);font-weight:400}
.bars{display:flex;gap:4px;align-items:flex-end;height:120px;background:var(--c);border:1px solid var(--l);border-radius:12px;padding:10px 8px 4px}
.bc{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;gap:3px}
.bc i{display:block;width:100%;background:var(--a);border-radius:3px 3px 0 0;min-height:2px}
.bc span{font-size:10px;color:var(--m)}
.srch{display:flex;gap:8px;padding:10px 14px}.srch input{flex:1;min-width:0}
.ur{display:flex;gap:10px;align-items:flex-start;padding:10px 14px;border-bottom:1px solid var(--l)}
.ur .um{flex:1;min-width:0}.ur .um small{display:block;color:var(--m);overflow-wrap:anywhere}
.ur .ua{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;align-items:flex-start}
.chip.bad{border-color:#c0392b;color:#ff8a7a}
.bn summary{list-style:none;cursor:pointer}.bn summary::-webkit-details-marker{display:none}
.bn form{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.bn form input[name=reason]{min-width:200px}
.pgr{display:flex;justify-content:space-between;padding:14px}


.dbp{padding:14px}.mig{display:flex;gap:10px;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--l)}.mig small{display:block;color:var(--m)}.mst{text-align:right;flex:none}.chip.wrn{border-color:#d4a017;color:#f5b301}

/* v8: panel notifikasi/pesan ala GUE Trader */
.nvav{position:relative;flex:none;display:block}.nic{position:absolute;right:-5px;bottom:-4px;width:18px;height:18px;border-radius:50%;background:var(--bg);border:1px solid var(--l);display:grid;place-items:center;font-style:normal;font-size:10px;line-height:1;color:var(--a)}
.nfp .nt a{align-items:flex-start;gap:11px}.nfp .ntb{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1;font-size:13.5px;line-height:1.35}.nfp .ntb small{color:var(--m);font-size:11.5px}.nfp .nt q{font-size:12.5px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.udot{flex:none;align-self:center;width:9px;height:9px;border-radius:50%;background:var(--a)}
.nfp .cv{display:flex;align-items:flex-start;gap:11px;padding:10px 14px;border-bottom:1px solid var(--l);color:var(--t)}.nfp .cv:hover{background:#ffffff0d}.nfp .cv.un{background:#3b82f612}
.nfp .cvb{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.nfp .cvb small{color:var(--m);font-size:11.5px;order:3}.nfp .cvb span{color:var(--m);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nfp .cv>i:not(.udot){display:none}
.nfh .btn{background:none;border:0;color:var(--a);font-weight:700}.nfp .more{font-weight:700}
.cv{display:flex;align-items:flex-start;gap:11px}.cv .cvb{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.cv .cvb small{float:none;order:3;font-size:11.5px}.cv .cvb span{display:block}
.cv .nvav{display:block;flex:none;position:relative;color:inherit;overflow:visible;white-space:normal}.cv .nvav .av{display:inline-flex}
.cv i.nic{position:absolute;right:-5px;bottom:-4px;top:auto;padding:0;background:var(--bg);color:var(--a);border-radius:50%}
.cv i.udot{position:static;align-self:center;padding:0;background:var(--a);border-radius:50%}
.cv>i:not(.udot){position:absolute;right:14px;bottom:10px}
.cv.un strong{font-weight:800}

/* ===== v9: editor status/komentar/balasan ala GuE Trader ===== */
.th-compose{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-bottom:1px solid var(--l)}
.th-compose>form.cmp{flex:1;min-width:0;padding:0;border:0}
.cmp{display:flex;flex-direction:column;gap:6px}
.cmp.tc-form{padding:10px 14px}
.se{display:block;width:100%}
.se-editor{display:block;width:100%;margin:0;padding:10px 14px;border:1px solid var(--l);border-radius:14px;background:var(--c);color:var(--t);font:inherit;font-size:15px;line-height:1.45;min-height:42px;max-height:320px;overflow-y:auto;outline:none;word-break:break-word;white-space:pre-wrap;cursor:text}
.se-editor:focus{border-color:var(--a)}
.se-editor:empty:before{content:attr(data-placeholder);color:var(--m);pointer-events:none}
.se-editor p,.se-editor div{margin:0}
.th-compose .se-editor{font-size:16px;padding:10px 16px;border-radius:999px}
.th-compose form.collapsible.open .se-editor{border-radius:18px;min-height:96px}
.cmp.tc-form .se-editor{max-height:160px}
.th-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:nowrap;margin-top:2px}
form.collapsible:not(.open) .th-tools,form.collapsible:not(.open) .se-more{display:none}
.th-tools .btn{margin-left:0;flex:none;height:32px;padding:0 18px;line-height:1}
.se-tools{display:flex;align-items:center;gap:6px;flex-wrap:nowrap;flex:1;min-width:0}
.se-btn{min-width:32px;height:32px;padding:0 8px;display:inline-grid;place-items:center;border:1px solid var(--l);border-radius:999px;background:var(--c);color:var(--t);font-size:16px;cursor:pointer;line-height:1;margin:0}
.se-btn:hover,.se-btn.on{border-color:var(--a)}.se-btn.on{color:var(--a)}
.se-btn input{display:none}
.se-cat{flex:0 1 auto;width:auto;min-width:0;max-width:130px;height:32px;border:1px solid var(--l);border-radius:999px;background:var(--c);color:var(--t);padding:0 10px;font-size:13px}
.se-count{font-size:12px;color:var(--m);margin-left:auto;flex:none}.se-count.over{color:#ef4444;font-weight:700}
.se-count:not(:empty)+.btn{margin-left:0}
.se-more{display:grid;gap:6px}.se-more[hidden]{display:none}
.se-more input,.se-more textarea{width:100%;padding:8px 12px;border:1px solid var(--l);border-radius:12px;background:var(--c);color:var(--t);font:inherit;font-size:14px}
#se-pop{position:fixed;z-index:200;display:grid;grid-template-columns:repeat(7,1fr);gap:2px;padding:8px;width:268px;background:var(--bg);border:1px solid var(--l);border-radius:14px;box-shadow:0 12px 36px #0006}
#se-pop[hidden]{display:none}
#se-pop button{border:0;background:none;font-size:20px;line-height:1;padding:6px;border-radius:8px;cursor:pointer}
#se-pop button:hover{background:var(--c)}
.dlg .se-editor{min-height:110px;border-radius:14px}
.rpf.cmp{padding:6px 0 10px}

.ann{display:flex;gap:10px;align-items:flex-start;margin:10px 14px;padding:12px 14px;border:1px solid var(--a);border-radius:14px;background:var(--c)}.ann[hidden]{display:none}
.ann-i{font-size:20px;line-height:1.2}.ann-b{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px;align-items:flex-start}.ann-b p{margin:0;color:var(--m);font-size:14px}
.ann-x{background:none;border:0;color:var(--m);cursor:pointer;font-size:16px;padding:2px 6px}
.ann-f{display:grid;gap:10px}.ann-f label{display:grid;gap:4px;font-size:13px;color:var(--m)}.ann-f input:not([type=checkbox]),.ann-f textarea{padding:8px 12px;border:1px solid var(--l);border-radius:12px;background:var(--c);color:var(--t);font:inherit}.ann-f .chk{display:flex;gap:8px;align-items:center;color:var(--t)}

/* ===== modal komentar (panel geser) ===== */
.th-overlay{position:fixed;inset:0;z-index:70;background:#000b;opacity:0;pointer-events:none;transition:opacity .25s}.th-overlay.open{opacity:1;pointer-events:auto}
.th-sheet{position:fixed;z-index:71;top:0;right:0;bottom:0;width:min(520px,100vw);display:flex;flex-direction:column;background:var(--bg);border-left:1px solid var(--l);box-shadow:-18px 0 50px #000a;transform:translateX(100%);visibility:hidden;transition:transform .28s cubic-bezier(.2,.8,.2,1),visibility 0s .28s}
.th-sheet.open{transform:none;visibility:visible;transition:transform .28s cubic-bezier(.2,.8,.2,1)}
.th-sheet-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--l);font-size:16px}
.th-x{background:none;border:0;color:var(--m);font-size:18px;cursor:pointer;padding:4px 8px}.th-x:hover{color:var(--t)}
.th-sheet-body{flex:1;overflow-y:auto;padding:0;overscroll-behavior:contain}
.th-sheet-foot{border-top:1px solid var(--l);padding:8px 6px calc(8px + env(safe-area-inset-bottom,0px));background:var(--c)}
.th-sheet-foot .cmp{padding:4px 8px;border:0}
.th-lock{overflow:hidden}
.cmp.busy{opacity:.6;pointer-events:none}
#se-pop{z-index:300}
@media(max-width:700px){.th-sheet{top:auto;left:0;width:100%;height:88vh;height:88dvh;border-left:0;border-top:1px solid var(--l);border-radius:20px 20px 0 0;transform:translateY(100%)}.th-sheet.open{transform:none}}

/* ===== modal komentar: tampilan seperti GuE Trader ===== */
.th-sheet-head{padding:16px 20px;font-size:17px}
.th-x{width:36px;height:36px;border:1px solid var(--l);border-radius:50%;display:grid;place-items:center;font-size:15px;padding:0;background:var(--c)}
.th-sheet-body .post{border-bottom:0;padding:16px 20px 10px}
.th-sheet-body .post .av{width:48px!important;height:48px!important}
.th-sheet-body .bd{font-size:15px}
.sh-sep{height:1px;background:var(--l);margin:6px 20px 0}
.sh-ct{padding:14px 20px 4px;color:var(--m);font-size:14px}.sh-ct b{color:var(--t)}
.th-sheet-body .tc,.th-sheet-body .tr2{border:0}
.th-sheet-body .tc .post,.th-sheet-body .tr2 .post{padding:12px 20px 4px}
.th-sheet-body .tc .post .av,.th-sheet-body .tr2 .post .av{width:34px!important;height:34px!important}
.th-sheet-body .ac{display:flex;gap:16px;flex-wrap:wrap;font-size:13px}
.th-sheet-body .ac button,.th-sheet-body .ac a{background:none;border:0;color:var(--m);padding:2px 0}
.th-sheet-body .ac .rpi{color:#ef4444}
.th-sheet-body .tc-tg{margin:0 20px 6px 74px;background:none;border:0;color:var(--a);font-weight:600;cursor:pointer;padding:0}
.th-sheet-body .tc-rs{padding-left:34px}
.th-sheet-foot{padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));background:var(--bg)}
.th-sheet-foot .se-editor{border-radius:999px;padding:11px 18px;font-size:15px}
.th-sheet-foot form.collapsible.open .se-editor{border-radius:18px;min-height:72px}
.th-sheet-body .ac{justify-content:flex-start!important;gap:18px}
.th-sheet-body .tc-tg{margin-left:54px}

/* ===== Baris aksi feed ala GuE Trader: ♡ 💬 🔁 ↗ rapat di kiri, ⋯ di kanan ===== */
.ac{justify-content:flex-start;align-items:center;gap:22px;margin-top:8px}
.ac a,.ac button,.ac .ro{display:inline-flex;align-items:center;gap:6px;padding:4px 0;border-radius:0;font-size:15px;line-height:1;color:var(--m);background:none;border:0;transition:color .15s,transform .15s}
.ac a:hover,.ac button:hover{color:var(--t)}.ac button:active{transform:scale(.9)}
.ac button[data-act=like].on,.ac button[data-act=like]:hover{color:#e0245e}
.ac button[data-act=repost]:hover{color:#00ba7c}
.ac .mn{margin-left:auto;position:relative}
.ac .mn summary{padding:4px 6px;font-size:18px;line-height:1;color:var(--m)}
.ac .mn summary:hover{color:var(--t)}
.ac .mn div{top:auto;bottom:calc(100% + 4px);right:0}
.th-sheet-body .ac{gap:22px!important}

/* ===== Cerita (Stories) ===== */
.st-tray{display:flex;gap:14px;overflow-x:auto;padding:12px 14px;border-bottom:1px solid var(--l);scrollbar-width:none}.st-tray::-webkit-scrollbar{display:none}
.st-it{flex:none;position:relative;display:flex;flex-direction:column;align-items:center;gap:5px;width:66px;background:none;border:0;color:var(--t);padding:0;cursor:pointer}
.st-it em{font-style:normal;font-size:12px;color:var(--m);max-width:66px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st-b{background:none;border:0;padding:0;cursor:pointer;color:inherit}.st-it>.st-b{display:block}
.st-ring{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;padding:3px;background:var(--l)}
.st-ring.new,.st-ring.me{background:linear-gradient(135deg,#60a5fa,var(--a) 55%,var(--a2))}.st-ring.none{background:transparent;border:2px dashed var(--l)}
.st-ring .av{border:2px solid var(--bg);box-sizing:border-box}
.st-plus{position:absolute;top:42px;right:3px;width:22px;height:22px;border-radius:50%;border:2px solid var(--bg);background:var(--a);color:#fff;font:700 16px/1 system-ui;display:grid;place-items:center;padding:0;cursor:pointer}
.st-up{padding:16px}.st-up form{display:flex;flex-direction:column;gap:10px}.st-up input[name=caption]{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid var(--l);border-radius:12px;background:var(--c);color:var(--t);font:inherit}
.st-pv{border-radius:14px;overflow:hidden;background:#000;display:grid;place-items:center;max-height:52vh}.st-pv img,.st-pv video{display:block;max-width:100%;max-height:52vh}
.st-note{margin:0;font-size:12px;color:var(--m)}.st-act{display:flex;justify-content:flex-end;gap:8px}
#st-v{position:fixed;inset:0;z-index:400;background:#000d;display:grid;place-items:center}
#st-v .st-box{position:relative;width:min(420px,100vw);height:min(100vh,calc(100vw*16/9 + 0px),760px);max-height:100dvh;background:#000;border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
@media(max-width:560px){#st-v .st-box{height:100dvh;border-radius:0}}
.st-bars{position:absolute;top:8px;left:8px;right:8px;display:flex;gap:4px;z-index:3}.st-bars i{flex:1;height:3px;border-radius:2px;background:#fff4;overflow:hidden}.st-bars i b{display:block;height:100%;width:0;background:#fff}
.st-top{position:absolute;top:18px;left:10px;right:10px;display:flex;align-items:center;gap:8px;color:#fff;z-index:3;text-shadow:0 1px 4px #000a}.st-top small{color:#ffffffbb}.st-top .st-sp{flex:1}
.st-top button{background:none;border:0;color:#fff;font-size:20px;cursor:pointer;padding:4px 8px}
.st-med{flex:1;display:grid;place-items:center;min-height:0}.st-med img,.st-med video{max-width:100%;max-height:100%;object-fit:contain}
.st-cap{position:absolute;left:0;right:0;bottom:46px;padding:12px 16px;color:#fff;text-align:center;background:linear-gradient(transparent,#000a);z-index:2;font-size:15px}.st-cap:empty{display:none}
.st-nav{position:absolute;top:60px;bottom:60px;z-index:2;background:none;border:0;cursor:pointer}.st-nav.p{left:0;width:35%}.st-nav.n{right:0;width:65%}
.st-foot{position:absolute;left:0;right:0;bottom:0;padding:10px 14px;z-index:3;display:flex;justify-content:center}.st-foot button{background:#0008;color:#fff;border:0;border-radius:999px;padding:6px 14px;font-size:13px;cursor:pointer}
.st-vl{position:absolute;left:0;right:0;bottom:0;max-height:55%;overflow:auto;background:var(--bg);color:var(--t);z-index:5;border-radius:16px 16px 0 0;padding:14px}.st-vl h4{margin:0 0 8px}.st-vl a{display:block;padding:8px 0;border-bottom:1px solid var(--l)}

/* ===== Reels ===== */
.rl-top{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--l);position:sticky;top:var(--hh,0px);background:var(--bg);z-index:4}
.rl-feed{height:calc(100dvh - var(--hh,60px) - 56px);overflow-y:auto;scroll-snap-type:y mandatory;overscroll-behavior:contain;scrollbar-width:none}.rl-feed::-webkit-scrollbar{display:none}
@media(max-width:900px){.rl-feed{height:calc(100dvh - var(--hh,60px) - 56px - 62px)}}
.rl-item{position:relative;height:100%;scroll-snap-align:start;scroll-snap-stop:always;background:#000;overflow:hidden;display:grid;place-items:center}
.rl-v{width:100%;height:100%;object-fit:contain;background:#000}
.rl-tap{position:absolute;inset:0;background:none;border:0;cursor:pointer;z-index:1}
.rl-ico[hidden]{display:none}.rl-ico{position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-50%);font-size:46px;color:#fff;background:#0007;border-radius:50%;width:84px;height:84px;display:grid;place-items:center;pointer-events:none}
.rl-info{position:absolute;left:0;right:64px;bottom:0;z-index:2;padding:40px 14px 16px;color:#fff;background:linear-gradient(transparent,#000b);text-shadow:0 1px 4px #000a;pointer-events:none}.rl-info a{pointer-events:auto;color:#fff}
.rl-who{display:flex;align-items:center;gap:8px}.rl-cap{margin-top:8px;font-size:14px;line-height:1.4;max-height:5.6em;overflow:hidden}
.rl-rail{position:absolute;right:8px;bottom:18px;z-index:3;display:flex;flex-direction:column;align-items:center;gap:14px}
.rl-rail a,.rl-rail button{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:44px;padding:8px 4px;border-radius:14px;background:#0005;border:0;color:#fff;font-size:15px;line-height:1.1;cursor:pointer}
.rl-rail button.on{color:#ff5c7c}

/* ===== Saran akun ===== */
.sg-row .un{min-width:0}.sg-row .un strong,.sg-row .un span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sg-why{color:var(--m);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sg-row .btn{flex:none;height:32px;padding:0 14px;align-self:center}.rc .sg-row .btn{padding:0 12px;font-size:13px}.rc .sg-row .btn:not(.pri){background:var(--c)}
.sg-top{padding:12px 14px;border-bottom:1px solid var(--l);font-size:17px;position:sticky;top:var(--hh,0px);background:var(--bg);z-index:4}
.sg-strip{display:none;border-bottom:1px solid var(--l);padding:12px 0 12px}
.sg-h{display:flex;justify-content:space-between;align-items:baseline;padding:0 14px 8px}.sg-h a{color:var(--a);font-size:13px;font-weight:700}
.sg-scroll{display:flex;gap:10px;overflow-x:auto;padding:0 14px;scrollbar-width:none;scroll-snap-type:x proximity}.sg-scroll::-webkit-scrollbar{display:none}
.sg-card{flex:none;width:142px;display:flex;flex-direction:column;align-items:center;gap:5px;padding:12px 8px;border:1px solid var(--l);border-radius:14px;background:var(--c);text-align:center;scroll-snap-align:start}
.sg-card .sg-n{display:block;max-width:100%}.sg-card small{color:var(--m);font-size:11.5px;min-height:2.6em;line-height:1.3}.sg-card .btn{width:100%;height:30px;padding:0;margin-top:2px}
@media(max-width:900px){.sg-strip{display:block}}

/* ===== Cerita teks ===== */
.bg0{background:linear-gradient(135deg,#1d4ed8,#60a5fa)}.bg1{background:linear-gradient(135deg,#d97706,#fbbf24)}.bg2{background:linear-gradient(135deg,#6d28d9,#a78bfa)}.bg3{background:linear-gradient(135deg,#047857,#34d399)}
.bg4{background:linear-gradient(135deg,#be123c,#fb7185)}.bg5{background:linear-gradient(135deg,#0e7490,#22d3ee)}.bg6{background:linear-gradient(135deg,#0f172a,#475569)}.bg7{background:linear-gradient(135deg,#c2410c,#fb923c)}
.st-txtbox{border-radius:16px;min-height:200px;display:grid;place-items:center;padding:16px}
.st-txtbox textarea{width:100%;background:none;border:0;outline:0;resize:none;color:#fff;font:700 22px/1.35 inherit;font-family:inherit;text-align:center}.st-txtbox textarea::placeholder{color:#ffffffaa}
.st-sw{display:flex;gap:8px;justify-content:center;margin-top:10px;flex-wrap:wrap}.st-s{width:28px;height:28px;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0}.st-s.on{border-color:var(--t);box-shadow:0 0 0 2px var(--bg) inset}
.st-pick{align-self:flex-start}
.st-txt{width:100%;height:100%;display:grid;place-items:center;padding:60px 28px;box-sizing:border-box;color:#fff;text-align:center}
.st-txt p{margin:0;font-weight:700;font-size:clamp(22px,6vw,30px);line-height:1.35;white-space:pre-wrap;word-break:break-word}
.st-pv[hidden],#st-txtwrap[hidden],.st-pick[hidden],#st-capin[hidden]{display:none!important}

/* Lokasi (v22) */
.loc-box{display:grid;gap:8px;margin-bottom:8px}.locrow{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:8px 0;border-bottom:1px solid var(--l)}.locrow form{display:flex;gap:6px;align-items:center;margin:0}.locrow form:first-child{flex:1 1 220px}.locrow input[name=name]{flex:1;min-width:0}.locrow .btn{flex:none}.loc-add{display:grid;gap:8px;margin:14px 0}.loc-add textarea{min-height:90px}

/* ===== Marketplace (tahap 2-5) ===== */
.mkg{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;padding:10px 14px}
.mkc{display:flex;flex-direction:column;border:1px solid var(--l);border-radius:12px;overflow:hidden;background:var(--c);min-width:0}
.mkc:hover{border-color:var(--a)}
.mki{display:block;aspect-ratio:4/3;background:var(--bg);overflow:hidden}.mki img{width:100%;height:100%;object-fit:cover;display:block}
.mkph{display:flex;align-items:center;justify-content:center;height:100%;font-size:34px;opacity:.5}
.mkb{display:flex;flex-direction:column;gap:2px;padding:8px 10px 10px;min-width:0}.mkb strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mkb b{color:var(--a2)}.mkb small{color:var(--m)}
.mkcat{display:flex;flex-wrap:wrap;gap:6px;padding:4px 14px 10px}.mkcat .chip{margin:0;padding:4px 11px;font-size:13px}.mkcat .chip.on{background:var(--a);border-color:var(--a);color:#fff}
.mkpg{display:flex;justify-content:space-between;gap:8px;padding:6px 14px 16px}
.mkflt{margin:0 14px 8px;border:1px solid var(--l);border-radius:12px;padding:8px 12px;background:var(--c)}.mkflt summary{cursor:pointer;font-weight:700}
.mkff{display:grid;gap:8px;padding-top:10px}.mkff .row{padding:0}
.mkgal{display:flex;gap:6px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 0 4px}.mkgal img{flex:0 0 100%;max-height:420px;object-fit:contain;background:var(--bg);scroll-snap-align:center}
.mkgal.edit{padding:0}.mkgal.edit .mkth{flex:0 0 96px;display:grid;gap:4px;font-size:12px}.mkgal.edit img{flex:none;width:96px;height:72px;object-fit:cover}
.mkd{padding:12px 14px;display:grid;gap:8px}.mkd h1{margin:0;font-size:20px}.mkpr{font-size:22px;font-weight:700;color:var(--a2)}
.mkt{width:100%;border-collapse:collapse}.mkt th,.mkt td{text-align:left;padding:6px 4px;border-bottom:1px solid var(--l);vertical-align:top}.mkt th{width:42%;color:var(--m);font-weight:400}
.mkwarn{margin:0}.mkact{padding:12px;border:1px solid var(--l);border-radius:12px}
.mkf .mka{display:grid;gap:6px}.mkchk{display:flex;flex-wrap:wrap;gap:6px 14px}.mkchk label{display:flex;gap:6px;align-items:center}
.mka[hidden]{display:none}
.mkrow{border-bottom:1px solid var(--l);padding:0 0 8px}.mkrow .mkc{margin:10px 14px 0;flex-direction:row}.mkrow .mki{width:110px;flex:none;aspect-ratio:1}
.mkord{display:grid;gap:4px;padding:12px 14px;border-bottom:1px solid var(--l)}
@media(min-width:700px){.mkg{grid-template-columns:repeat(3,1fr)}}

/* ===== Marketplace tanpa sidebar kanan (v27): sidebar kiri tetap, konten melebar ===== */
body.nosb .rside{display:none}
@media(min-width:900px){
body.nosb .shell main{max-width:1000px}
body.nosb .mkg{grid-template-columns:repeat(3,1fr)}
}
@media(min-width:1180px){
body.nosb .hdr{grid-template-columns:var(--side) minmax(0,1fr) auto}
body.nosb .shell{grid-template-columns:var(--side) minmax(0,1fr)}
body.nosb .shell main{max-width:1100px}
body.nosb .mkg{grid-template-columns:repeat(4,1fr)}
}

/* ===== Ikon kategori utama marketplace (v28) ===== */
.mkic{display:flex;gap:10px;overflow-x:auto;padding:4px 14px 12px;scrollbar-width:none}.mkic::-webkit-scrollbar{display:none}
.mkic a{flex:1 0 76px;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:76px;text-align:center}
.mkic span{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:16px;background:var(--c);border:1px solid var(--l);font-size:28px;transition:border-color .15s,transform .15s}
.mkic a:hover span{border-color:var(--a);transform:translateY(-2px)}
.mkic a.on span{border-color:var(--a);background:var(--a)}
.mkic em{font-style:normal;font-size:12px;line-height:1.25;color:var(--t)}.mkic a.on em{color:var(--a);font-weight:700}

/* ===== Foto marketplace (v30): portrait aman (latar blur + contain), galeri detail, layar penuh ===== */
.mki{position:relative}
.mki::before{content:"";position:absolute;inset:-14px;background:var(--mkbg,none) center/cover no-repeat;filter:blur(14px) brightness(.85)}
.mki img{position:relative;object-fit:contain}
.mkn{position:absolute;right:6px;bottom:6px;background:rgba(0,0,0,.6);color:#fff;font:600 11px/1 system-ui;padding:4px 7px;border-radius:10px}
.mkgv{position:relative;display:grid;gap:8px;margin:0 0 4px}
.mkgm{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;height:min(72vh,480px);background:var(--bg)}.mkgm::-webkit-scrollbar{display:none}
.mkgs{position:relative;flex:0 0 100%;scroll-snap-align:center;overflow:hidden;border:0;padding:0;background:var(--bg);cursor:zoom-in}
.mkgs::before{content:"";position:absolute;inset:-18px;background:var(--mkbg) center/cover no-repeat;filter:blur(18px) brightness(.8)}
.mkgs img{position:relative;width:100%;height:100%;object-fit:contain;display:block}
.mkgc{position:absolute;top:10px;right:10px;background:rgba(0,0,0,.6);color:#fff;font:600 12px/1 system-ui;padding:5px 9px;border-radius:12px}
.mkgd{display:none;justify-content:center;gap:6px}.mkgd i{width:7px;height:7px;border-radius:50%;background:var(--l)}.mkgd i.on{background:var(--a)}
.mkgt{display:flex;gap:6px;overflow-x:auto;padding:0 14px;scrollbar-width:thin}
.mkgt button{flex:0 0 64px;height:64px;padding:0;border:2px solid transparent;border-radius:8px;overflow:hidden;background:var(--c);opacity:.7;cursor:pointer}
.mkgt button img{width:100%;height:100%;object-fit:cover;display:block}.mkgt button.on{border-color:var(--a);opacity:1}
@media(max-width:699px){.mkgt button{flex-basis:56px;height:56px}}
.mklb{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.94);display:flex;flex-direction:column}.mklb[hidden]{display:none}
.mklb .tr{flex:1;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.mklb .tr::-webkit-scrollbar{display:none}
.mklb .lbs{flex:0 0 100%;scroll-snap-align:center;overflow:auto;display:flex;touch-action:pan-x pan-y pinch-zoom}
.mklb .lbs img{margin:auto;max-width:100%;max-height:100%;object-fit:contain;cursor:zoom-in}
.mklb .lbs.z img{max-width:none;max-height:none;width:220%;height:auto;cursor:zoom-out}
.mklb .x,.mklb .pv,.mklb .nx{position:absolute;width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;font-size:22px;cursor:pointer;z-index:2}
.mklb .x{top:max(12px,env(safe-area-inset-top));right:12px}
.mklb .pv,.mklb .nx{top:50%;margin-top:-22px}.mklb .pv{left:12px}.mklb .nx{right:12px}
.mklb .n{position:absolute;top:max(12px,env(safe-area-inset-top));left:14px;color:#fff;font:600 14px/44px system-ui;z-index:2}
@media(max-width:699px){.mklb .pv,.mklb .nx{display:none}}
.mkgal.edit .mkth,.mkpv .mkth{display:grid;gap:4px;font-size:12px;flex:0 0 96px}
.mkgal.edit .mkth label,.mkpv label{display:flex;gap:4px;align-items:center;cursor:pointer}
.mkpv{display:flex;flex-wrap:wrap;gap:8px}.mkpv:empty{display:none}.mkpv img{width:96px;height:72px;object-fit:cover;border-radius:8px;display:block}
.mkpv .mkth{width:96px}
.mkmv{padding:0 14px 4px;align-items:center}.mkmv select{flex:1;min-width:0}

/* ===== Seret & lepas (drag and drop) untuk semua unggahan (v33) ===== */
.dz{display:grid;gap:8px;justify-items:center;padding:16px 12px;border:2px dashed var(--l);border-radius:12px;background:var(--c);text-align:center}
.dz .dzh{color:var(--m);font-size:13px}.dz input[type=file]{max-width:100%}
.dz-over{position:relative}
.dz-over::after{content:attr(data-dzmsg);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:8px;text-align:center;background:rgba(10,18,40,.78);color:#fff;font-weight:700;border:2px dashed var(--a);border-radius:inherit;z-index:5;pointer-events:none}
.dz.dz-over{border-color:var(--a)}
body.dz-over::after{position:fixed;z-index:80;border-radius:0}
.mkpv .mkth{position:relative}
.mkx{position:absolute;top:4px;right:4px;width:24px;height:24px;border:0;border-radius:50%;background:rgba(0,0,0,.65);color:#fff;font-size:13px;line-height:1;cursor:pointer;padding:0}


/* v36: tombol Keluar di sidebar kiri + 2 produk acak di sidebar kanan */
.lside form.so{margin:auto 0 0;padding-top:10px}
.lside .so button.sl{width:100%;background:none;border:0;font:inherit;color:var(--t);cursor:pointer;text-align:left}
.lside .so button.sl:hover{background:var(--c);color:#e0245e}
.rmk .mkg{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:6px 12px 4px}
.rmk .mkb{padding:7px 8px 9px}.rmk .mkb strong,.rmk .mkb b{font-size:13px}
.rmk .mkb small{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rmk .mkb .chip{align-self:flex-start;margin:4px 0 0;padding:2px 8px;font-size:11px}

/* ===== v41: Marketplace publik (tamu): header sendiri, tanpa sidebar kiri/kanan, halaman di tengah ===== */
body.gm .hdr.gh{display:flex;grid-template-columns:none;gap:12px;padding:0 max(16px,calc((100% - 1100px)/2 + 16px))}
body.gm .hdr.gh .hr{margin-left:auto;gap:8px}
body.gm .hdr .btn.gl{padding:6px 14px;font-size:14px;white-space:nowrap;border-radius:999px}
body.gm main{width:100%;max-width:1100px;margin:0 auto;box-sizing:border-box}
body.gm .mkg{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:700px){body.gm .mkg{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1000px){body.gm .mkg{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:480px){body.gm .hdr .bn{display:none}body.gm .hdr .btn.gl{padding:6px 11px;font-size:13px}}
body.gm .mkd,body.gm .mkgv{max-width:720px;margin-inline:auto}
.mkgate{margin:14px 0;padding:14px;border:1px solid var(--l);border-radius:14px;background:var(--c)}.mkgate p{margin:0 0 10px}.mkgate .row{padding:0;gap:8px}

/* v42: logo/favicon unggahan menggantikan huruf L */
.logo.has-img,.sp-logo.has-img{background:none;box-shadow:none;overflow:hidden;padding:0}.logo.has-img img,.sp-logo.has-img img{width:100%;height:100%;object-fit:cover;display:block}


/* ===== v44: tampilan lebih lembut & profesional: tipografi, bobot huruf, ikon garis SVG ===== */
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;font-size:15px;line-height:1.55;letter-spacing:-.006em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
strong,b,th{font-weight:600}h1,h2,h3{font-weight:650;letter-spacing:-.015em}
.btn{font-weight:500;border-radius:999px;padding:7px 16px;transition:background .15s,border-color .15s,color .15s,box-shadow .15s}
.btn:hover{border-color:color-mix(in srgb,var(--a) 55%,var(--l))}
.btn.pri{font-weight:600;box-shadow:0 1px 2px color-mix(in srgb,var(--a) 30%,transparent)}.btn.pri:hover{filter:brightness(1.06)}
input,textarea,select{border-radius:12px;transition:border-color .15s,box-shadow .15s}
input:focus,textarea:focus,select:focus{outline:0;border-color:var(--a);box-shadow:0 0 0 3px color-mix(in srgb,var(--a) 18%,transparent)}
:focus-visible{outline:2px solid color-mix(in srgb,var(--a) 65%,transparent);outline-offset:2px;border-radius:8px}
.tabs a{font-weight:500;transition:color .15s,background .15s}.tabs a:hover{color:var(--t);background:color-mix(in srgb,var(--c) 70%,transparent)}.tabs a.on{font-weight:600;border-bottom-width:2px}
.hdr .brand,.sp-brand{font-weight:700;letter-spacing:-.02em}
.mu,small,.t,.ph span{font-size:13px}.ph strong{font-weight:600}
.post{transition:background .15s}.post:hover{background:color-mix(in srgb,var(--c) 45%,transparent)}
.ac{color:var(--m)}.ac a,.ac button{transition:background .15s,color .15s}.ac a:hover,.ac button:hover{background:var(--c);color:var(--t)}
.rc{border-radius:18px}.rc h3{font-size:16px;font-weight:650}
/* ikon SVG */
.ic{display:block;flex:none}
.nav a span,.lside .sl span{display:flex;align-items:center;justify-content:center}
.nav a{font-weight:500;gap:2px;transition:color .15s}.nav a em{font-style:normal;font-size:11px}
.nav a span .ic{stroke-width:1.6}.nav a.on span .ic,.lside .sl.on span .ic{stroke-width:2}
.lside .sl{font-size:15.5px;font-weight:500;color:var(--m);transition:background .15s,color .15s}.lside .sl:hover{color:var(--t)}.lside .sl.on{font-weight:600;color:var(--a)}
.lside .sl span .ic{color:inherit}
.lside .so button.sl:hover{color:#d5495e}
.hdr .hb.nfb,.hdr .thm.hb{color:var(--m);border-color:var(--l);transition:color .15s,border-color .15s,background .15s}
.hdr .hb.nfb:hover,.hdr .thm.hb:hover{color:var(--a);border-color:color-mix(in srgb,var(--a) 50%,var(--l))}
.hdr .hb .ic{margin:auto}.sp-thm{display:flex;align-items:center;justify-content:center;color:var(--m)}.sp-thm:hover{color:var(--a)}
.nfb b,.nav i,.lside .sl i{background:#e5484d;font-weight:600}
.lsw a{font-weight:600}
.bar .ttl{display:inline-flex;align-items:center;gap:8px;font-weight:650}.bar .ttl .ic{color:var(--a)}
.mkic span{color:var(--m);font-size:0;transition:border-color .15s,transform .15s,color .15s,background .15s}
.mkic a:hover span{color:var(--a)}.mkic a.on span{color:#fff}.mkic em{font-weight:500}
.mkph{color:var(--m);opacity:.55}
.mkwarn{display:flex;gap:8px;align-items:flex-start}.mkwarn .ic{margin-top:2px;color:#b7791f}
.mkc{border-radius:14px;transition:border-color .15s,box-shadow .15s,transform .15s}.mkc:hover{box-shadow:0 6px 20px -10px #0004;transform:translateY(-1px)}
.mkb strong{font-weight:600}.mkb b{font-weight:650;color:var(--t)}
.chip{font-weight:500}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.lside .sl em{font-style:normal}
.ac a,.ac button,.ac .ro{display:inline-flex;align-items:center;gap:6px}.ac .ro{padding:4px 8px;color:var(--m)}
.ac span{font-size:13px;color:inherit}
.ac button[data-act=like].on .ic{fill:currentColor}.ac button[data-act=like]:hover{color:#e5484d}.ac button[data-act=repost]:hover{color:#16a37a}
.ac button[data-act=repost].on{color:#16a37a}.ac .on{color:#e5484d}

/* v46: sidebar kanan - judul + tombol Pasang iklan, ikon kategori utama, 4 produk (2x2) */
.rmk .rmk-h{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 14px 2px}.rmk .rmk-h h3{padding:0;font-size:16px}
.rmk .rmk-h .btn{padding:5px 12px;font-size:13px;white-space:nowrap}
.rmk .mkic{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;overflow:visible;padding:8px 10px 4px}
.rmk .mkic a{flex:none;min-width:0;gap:4px}
.rmk .mkic span{width:42px;height:42px;border-radius:13px}.rmk .mkic span .ic{width:21px;height:21px}
.rmk .mkic em{font-size:10.5px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* v47: pencarian AJAX (dropdown), tombol Beli | Jual, kolom cari produk di sidebar kanan */
.ajs-w{position:relative}
.ajs-pop{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:40;max-height:min(70vh,460px);overflow-y:auto;background:var(--bg);border:1px solid var(--l);border-radius:14px;box-shadow:0 10px 30px #0003;padding:4px 0;text-align:left}
.ajs-pop[hidden]{display:none}
.ajs-g{padding:8px 14px 4px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--m)}
.ajs-i{display:flex;align-items:center;gap:10px;padding:7px 14px;color:var(--t)}
.ajs-i:hover,.ajs-i.on,.ajs-all:hover,.ajs-all.on{background:var(--c)}
.ajs-th{flex:none;width:36px;height:36px;border-radius:50%;background:var(--c);border:1px solid var(--l);display:flex;align-items:center;justify-content:center;overflow:hidden;font-weight:600;color:var(--m)}
.ajs-item .ajs-th{width:46px;height:46px;border-radius:10px}
.ajs-th img{width:100%;height:100%;object-fit:cover}
.ajs-tx{min-width:0;display:flex;flex-direction:column}
.ajs-tx strong,.ajs-tx small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ajs-tx strong{font-size:14px;font-weight:600}.ajs-tx small{font-size:12px;color:var(--m)}
.ajs-none{margin:0;padding:14px;color:var(--m);font-size:14px}
.ajs-all{display:block;padding:10px 14px;border-top:1px solid var(--l);font-size:13px;font-weight:600;color:var(--a)}
.mkmode{display:inline-flex;gap:2px;padding:3px;border:1px solid var(--l);border-radius:999px;background:var(--c)}
.mkmode a{padding:5px 20px;border-radius:999px;font-size:14px;font-weight:600;text-align:center;color:var(--m);transition:background .15s,color .15s}
.mkmode a:hover{color:var(--a)}.mkmode a.on,.mkmode a.on:hover{background:var(--a);color:#fff}
.bar .mkmode{margin-left:auto}
.rmk .mks{padding:8px 12px 0}.rmk .mks input{flex:1;min-width:0;border-radius:22px;padding:8px 14px;background:var(--c)}
.rmk .mks input:focus{outline:2px solid var(--a);outline-offset:-1px;border-color:transparent}
.rmk .mkmode{display:grid;grid-template-columns:1fr 1fr;margin:8px 12px 2px}
.rmk .ajs-pop{left:12px;right:12px;top:calc(100% - 2px)}
.rc.rmk{overflow:visible}

/* v50: Jelajahi tidak lagi menu; di HP (kolom cari header tersembunyi) tersedia ikon cari di header */
.hdr .hsm{display:none;align-items:center;justify-content:center;width:32px;height:32px;border:1px solid var(--l);border-radius:50%;background:var(--c);color:var(--m)}
.hdr .hsm:hover{color:var(--a);border-color:color-mix(in srgb,var(--a) 50%,var(--l))}
@media(max-width:700px){.hdr .hsm{display:flex}}

/* v52: navigasi bawah HP tidak menyisakan celah saat halaman ditarik/dipantulkan (rubber-band) atau bilah alamat browser mengecil */
html,body{overscroll-behavior-y:none}
@media(max-width:899px){
.nav{-webkit-transform:translateZ(0);transform:translateZ(0);box-shadow:0 120px 0 var(--c)}
main{min-height:100dvh}
}

/* v53/v56 PWA: tombol instal melayang (kanan bawah, hanya HP), naik-turun pelan, tombol ✕ bulat di ujung kanan */
.pwa-i{position:fixed;right:max(12px,env(safe-area-inset-right));bottom:16px;z-index:8;display:flex;flex-direction:column;align-items:flex-end;gap:8px;max-width:calc(100vw - 24px)}
.pwa-i[hidden],.pwa-h[hidden]{display:none}
.pwa-pill{display:flex;align-items:center;gap:2px;padding:4px;border-radius:999px;background:var(--a);color:#fff;box-shadow:0 8px 24px #0005;animation:pwaFloat 2.4s ease-in-out infinite}
.pwa-go{display:flex;align-items:center;gap:7px;color:#fff;font-weight:700;font-size:14px;padding:7px 8px 7px 14px;border-radius:999px;background:none}
.pwa-ic{font-size:16px;line-height:1}
.pwa-x{flex:none;width:28px;height:28px;border-radius:50%;background:#ffffff38;color:#fff;font-size:12px;line-height:1;display:grid;place-items:center;padding:0}
.pwa-h{width:min(260px,calc(100vw - 24px));background:var(--c);border:1px solid var(--l);border-radius:14px;padding:12px 14px;box-shadow:0 8px 24px #0004;font-size:13px}
.pwa-h p{margin:4px 0 8px;color:var(--m)}
.pwa-ok{background:var(--a);color:#fff;font-weight:700;font-size:13px;padding:6px 16px;border-radius:18px}
@keyframes pwaFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@media(prefers-reduced-motion:reduce){.pwa-pill{animation:none}}
@media(min-width:900px){.pwa-i{display:none}}

/* v56: popup Cerita (Stories) proporsional & di tengah pada HP */
@media(max-width:560px){
#st-v .st-box{width:min(92vw,calc((100dvh - 40px)*9/16));height:auto;aspect-ratio:9/16;max-height:calc(100dvh - 40px);border-radius:18px;box-shadow:0 10px 40px #0008}
#st-up{margin:auto;max-height:calc(100dvh - 32px);overflow:auto}
.st-pv{max-height:38dvh}.st-pv img,.st-pv video{max-height:38dvh}
.st-txtbox{min-height:160px}
}

/* v57: header HP tidak lagi melebihi lebar layar (penyebab halaman melebar, navigasi bawah & tombol instal terpotong) */
body{overflow-x:clip}
@media(max-width:899px){
.hdr{padding:0 10px;gap:8px}
.hdr .hr{gap:5px;min-width:0;flex:none}
.hdr .brand{min-width:0}
}
@media(max-width:420px){.hdr .bn{display:none}.hdr .hr{gap:4px}}

/* pull-to-refresh (feed) — hanya konten yang turun; .hdr (z10) & .nav tidak bergerak */
.ptr{position:fixed;top:var(--hh,60px);left:50%;z-index:8;width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--c);color:var(--m);border:1px solid var(--l);box-shadow:0 4px 14px rgba(0,0,0,.14);opacity:0;pointer-events:none;transform:translate(-50%,-46px);will-change:transform,opacity}
.ptr.rdy{color:var(--a);border-color:var(--a)}
.ptr.spin svg{animation:ptrspin .7s linear infinite}
@keyframes ptrspin{to{transform:rotate(360deg)}}

/* Activity: tab bisa digeser (swipe) bila kepanjangan, terutama di mobile */
.tabs.sc{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;overscroll-behavior-x:contain}
.tabs.sc::-webkit-scrollbar{display:none}
.tabs.sc a{flex:1 0 auto;padding:12px 16px;white-space:nowrap}

/* ===== View Insight ===== */
.ins-top{display:flex;align-items:center;gap:10px;padding:12px 14px 0}
.ins-lock{position:relative;padding:14px}.ins-blur{filter:blur(5px);opacity:.6;pointer-events:none;padding:0}
.ins-lk{margin-top:14px;text-align:center;background:var(--c);border:1px solid var(--l);border-radius:14px;padding:18px 14px}
.ins-lk h3{margin:0 0 6px;display:flex;align-items:center;justify-content:center;gap:8px}.ins-lk p{color:var(--m);margin:0 0 12px}
.ins-tp{display:flex;flex-direction:column;gap:2px;padding:10px 0;border-bottom:1px solid var(--l)}.ins-tp:hover span{color:var(--a)}
.ins-tp small{color:var(--m);display:flex;align-items:center;gap:4px;flex-wrap:wrap}.ins-tp .ic{vertical-align:-2px}
.ins-au{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;margin:4px 0;border-radius:8px;background:var(--c);overflow:hidden}
.ins-au i{position:absolute;inset:0 auto 0 0;background:color-mix(in srgb,var(--a) 22%,transparent);z-index:0}.ins-au span,.ins-au b{position:relative;z-index:1}
.ins-plans{display:grid;gap:8px;margin:8px 0 14px}
.ins-plan{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--l);border-radius:12px;background:var(--c);cursor:pointer}
.ins-plan:has(input:checked){border-color:var(--a);box-shadow:0 0 0 1px var(--a)}
.ins-plan span{flex:1;display:flex;flex-direction:column}.ins-plan small{color:var(--m);font-weight:400}.ins-plan b{text-align:right;display:flex;flex-direction:column}
.ins-o{border:1px solid var(--l);border-radius:12px;padding:12px;margin:0 0 12px;background:var(--c)}.ins-o.hi{border-color:var(--a)}.ins-o.off{opacity:.6}
.ins-oh{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.ins-oh small{display:block;color:var(--m)}.ins-am{margin:8px 0}
.ins-pay{border:1px dashed var(--l);border-radius:10px;padding:10px 12px;margin:8px 0}.ins-pay h4{margin:0 0 6px}.ins-pay ol{margin:6px 0 0;padding-left:20px}.ins-pay dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:4px 12px}.ins-pay dt{color:var(--m)}.ins-pay dd{margin:0}
.ins-copy{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ins-pf{display:grid;gap:8px;margin:10px 0}.ins-pf label{display:grid;gap:4px}
.ins-sf{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.ins-sf input[name=note]{flex:1;min-width:160px}
.ins-gr{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.ins-gr h4{width:100%;margin:0}.ins-gr input{flex:1;min-width:120px}
.ins-pl .ins-pr{display:grid;grid-template-columns:minmax(120px,2fr) 70px 110px 70px 50px;gap:8px;align-items:center;margin:0 0 8px}.ins-ph{color:var(--m);font-size:12px}
@media(max-width:560px){.ins-pl .ins-pr{grid-template-columns:1fr 1fr}.ins-ph{display:none}.ins-pl .ins-pr input:first-child{grid-column:1/-1}}

/* ===== Aktivitas: geser kiri (titik 3 + tong sampah) & sheet Opsi repost ===== */
.ntw{position:relative;overflow:hidden;border-bottom:1px solid var(--l);transition:height .2s ease,opacity .2s ease}
.ntw.gone{height:0!important;opacity:0;border-bottom-width:0}
.ntw>.nt{position:relative;z-index:1;border-bottom:0;background:var(--bg);touch-action:pan-y;will-change:transform}
.ntw>.nt.un{background:linear-gradient(#3b82f612,#3b82f612),var(--bg)}
.nt-acts{position:absolute;top:0;right:0;bottom:0;width:116px;display:flex;align-items:center;justify-content:center;gap:10px;z-index:0}
.ntw .nt-acts button{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border-radius:12px;border:1px solid var(--l);background:var(--c);color:var(--m);cursor:pointer}
.ntw .nt-acts .nt-more{border-radius:50%}
.ntw .nt-acts .nt-del{background:#e5484d;border-color:#e5484d;color:#fff}
.nt-acts:not(:has(.nt-more)){justify-content:flex-end;padding-right:22px}
@media(hover:hover) and (pointer:fine){
.ntw>.nt{padding-right:132px}
.nt-acts{z-index:2;opacity:0;transition:opacity .15s}
.ntw:hover .nt-acts,.ntw:focus-within .nt-acts{opacity:1}
}
.rp-ov{position:fixed;inset:0;z-index:80;background:#000b;opacity:0;pointer-events:none;transition:opacity .25s}.rp-ov.open{opacity:1;pointer-events:auto}
.rp-sheet{position:fixed;z-index:81;left:50%;top:50%;width:min(360px,92vw);padding:8px 10px 12px;background:var(--bg);border:1px solid var(--l);border-radius:18px;box-shadow:0 18px 50px #000a;opacity:0;visibility:hidden;transform:translate(-50%,-46%) scale(.97);transition:transform .22s cubic-bezier(.2,.8,.2,1),opacity .2s,visibility 0s .22s}
.rp-sheet.open{opacity:1;visibility:visible;transform:translate(-50%,-50%);transition:transform .22s cubic-bezier(.2,.8,.2,1),opacity .2s}
.rp-grab{display:none;width:40px;height:4px;border-radius:2px;background:var(--l);margin:4px auto 2px}
.rp-t{display:block;text-align:center;padding:10px 8px 12px;font-size:15px}
.rp-list{background:var(--c);border:1px solid var(--l);border-radius:14px;overflow:hidden}
.rp-i{display:flex;align-items:center;gap:12px;width:100%;padding:15px 16px;border:0;background:none;color:inherit;font-size:15px;text-align:left;cursor:pointer}
.rp-i[hidden]{display:none}.rp-i:not([hidden])~.rp-i:not([hidden]){border-top:1px solid var(--l)}.rp-i.on{color:var(--a)}
@media(max-width:700px){
.rp-sheet{left:0;right:0;top:auto;bottom:0;width:100%;border-radius:20px 20px 0 0;border-bottom:0;padding-bottom:calc(14px + env(safe-area-inset-bottom,0px));opacity:1;transform:translateY(100%);transition:transform .28s cubic-bezier(.2,.8,.2,1),visibility 0s .28s}
.rp-sheet.open{transform:none;transition:transform .28s cubic-bezier(.2,.8,.2,1)}
.rp-grab{display:block}
}

/* kredit media + editor Markup */
.mcr{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;color:var(--m);margin-top:6px}
.mkp{position:fixed;inset:0;z-index:90;background:var(--bg);display:flex;flex-direction:column}.mkp[hidden]{display:none}
.mkp-top{display:flex;align-items:center;justify-content:space-between;padding:calc(10px + env(safe-area-inset-top,0px)) 14px 10px;border-bottom:1px solid var(--l)}
.mkp-x{background:none;border:0;color:var(--m);font-size:15px;cursor:pointer}
.mkp-stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:10px;background:#0006}
.mkp-stage canvas{max-width:100%;max-height:calc(100dvh - 270px);touch-action:none;border-radius:8px;background:#000;cursor:crosshair}
.mkp-tools{border-top:1px solid var(--l);padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:8px}
.mkp-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.mkp-row button{padding:7px 12px;border-radius:999px;border:1px solid var(--l);background:var(--c);color:inherit;font-size:13px;cursor:pointer}.mkp-row button.on{border-color:var(--a);color:var(--a)}
.mkp-cols button{width:28px;height:28px;padding:0;border:2px solid var(--l)}.mkp-cols button.on{border-color:var(--a);transform:scale(1.12)}
.mkp-cap{width:100%;padding:10px 12px;border-radius:12px;border:1px solid var(--l);background:var(--c);color:inherit;font-size:14px}

/* composer ala Threads: toolbar ikon, menu titik 3, pemilih kutipan, tombol Simpan */
.se-btn .ic{display:block}.th-attach{cursor:pointer}
.se-mw{position:relative;display:inline-flex}
.se-menu{position:fixed;z-index:95;min-width:210px;background:var(--c);border:1px solid var(--l);border-radius:14px;box-shadow:0 12px 34px #0007;overflow:hidden}.se-menu[hidden]{display:none}
.se-menu button{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;padding:14px 16px;border:0;background:none;color:inherit;font-size:15px;text-align:left;cursor:pointer}.se-menu button+button{border-top:1px solid var(--l)}.se-menu button:hover{background:var(--bg)}
.se-qt{position:relative;margin:6px 0 2px;border:1px solid var(--l);border-radius:14px;overflow:hidden}.se-qt[hidden]{display:none}.se-qt .post{border:0;margin:0;pointer-events:none}.se-qt .qt-x{position:absolute;top:6px;right:6px;z-index:2;width:26px;height:26px;border-radius:50%;border:0;background:#000a;color:#fff;cursor:pointer;line-height:1}
.qp-ov{position:fixed;inset:0;z-index:92;background:#000b;opacity:0;pointer-events:none;transition:opacity .25s}.qp-ov.open{opacity:1;pointer-events:auto}
.qp-sheet{position:fixed;z-index:93;left:50%;top:50%;width:min(560px,94vw);height:min(680px,82dvh);display:flex;flex-direction:column;background:var(--bg);border:1px solid var(--l);border-radius:18px;box-shadow:0 18px 50px #000a;opacity:0;visibility:hidden;transform:translate(-50%,-46%) scale(.97);transition:transform .22s cubic-bezier(.2,.8,.2,1),opacity .2s,visibility 0s .22s}
.qp-sheet.open{opacity:1;visibility:visible;transform:translate(-50%,-50%);transition:transform .22s cubic-bezier(.2,.8,.2,1),opacity .2s}
.qp-head{display:flex;align-items:center;gap:14px;padding:14px 16px;border-bottom:1px solid var(--l);font-size:16px}.qp-x{background:none;border:0;color:inherit;font-size:18px;cursor:pointer;padding:2px 6px}
.qp-tabs{display:flex;border-bottom:1px solid var(--l)}.qp-tabs button{flex:1;padding:12px 6px;border:0;border-bottom:2px solid transparent;background:none;color:var(--m);font-size:14.5px;cursor:pointer}.qp-tabs button.on{color:inherit;border-bottom-color:currentColor;font-weight:600}
.qp-list{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:8px 10px}.qp-row{cursor:pointer;border:1px solid var(--l);border-radius:14px;margin:8px 0;overflow:hidden}.qp-row .post{border:0;margin:0;pointer-events:none}.qp-row:hover{border-color:var(--a)}
@media(max-width:700px){.qp-sheet{left:0;right:0;top:auto;bottom:0;width:100%;height:92dvh;border-radius:20px 20px 0 0;border-bottom:0;opacity:1;transform:translateY(100%);transition:transform .28s cubic-bezier(.2,.8,.2,1),visibility 0s .28s}.qp-sheet.open{transform:none;transition:transform .28s cubic-bezier(.2,.8,.2,1)}}
.ac button.sv.on{color:var(--a)}.ac button.sv.on .ic{fill:currentColor}

/* ===== Mobile: semua menu/fungsi lewat modal geser dari bawah (seperti modal komentar) ===== */
@keyframes shUp{from{transform:translateY(100%)}to{transform:none}}
.se-done{display:none}
@media(max-width:700px){
body::after{content:"";position:fixed;inset:0;z-index:60;background:#000b;opacity:0;pointer-events:none;transition:opacity .2s}
body:has(.se-menu:not([hidden]),.se-more:not([hidden]),.mn[open],#se-pop:not([hidden]))::after{opacity:1;pointer-events:auto}
.se-menu,.se-more:not([hidden]),.mn[open]>div{position:fixed!important;left:0!important;right:0!important;top:auto!important;bottom:0!important;width:100%;max-width:100%;min-width:0;margin:0;border:0;border-top:1px solid var(--l);border-radius:20px 20px 0 0;background:var(--bg);box-shadow:0 -10px 40px #0008;padding:12px 12px calc(14px + env(safe-area-inset-bottom,0px));z-index:61;animation:shUp .26s cubic-bezier(.2,.8,.2,1)}
.se-menu::before,.mn[open]>div::before{content:"";display:block;width:40px;height:4px;border-radius:2px;background:var(--l);margin:0 auto 8px}
.se-menu button,.mn[open]>div button,.mn[open]>div a{padding:15px 14px;font-size:15px}
.se-more:not([hidden]){display:grid;gap:10px}
.se-more:not([hidden])::before{content:attr(data-t);text-align:center;font-weight:600;font-size:15px;padding:4px 0 2px}
.se-more input,.se-more textarea{width:100%;font-size:16px}
.se-done{display:block;width:100%;height:44px}
#se-pop{left:0!important;right:0!important;top:auto!important;bottom:0!important;width:100%;grid-template-columns:repeat(8,1fr);border:0;border-top:1px solid var(--l);border-radius:20px 20px 0 0;padding:16px 10px calc(16px + env(safe-area-inset-bottom,0px));max-height:52dvh;overflow:auto;animation:shUp .26s cubic-bezier(.2,.8,.2,1)}
#se-pop button{font-size:24px;padding:10px 0}
dialog[open]{position:fixed;inset:auto 0 0 0;margin:0;width:100%;max-width:100%;max-height:92dvh;overflow:auto;border:0;border-top:1px solid var(--l);border-radius:20px 20px 0 0;animation:shUp .28s cubic-bezier(.2,.8,.2,1)}
}

/* v66: HP/tablet (<900px) — navigasi bawah hanya Beranda, Marketplace, Pesan, Aktivitas; menu lain (Reels, Admin, Saran akun, Tema, Keluar) di sidebar kiri yang dibuka tombol hamburger di header */
.hdr .hmb{display:none;flex:none;align-items:center;justify-content:center;width:36px;height:36px;margin-left:-4px;border:0;border-radius:50%;background:none;color:var(--t);cursor:pointer}
.hdr .hmb:active{background:var(--c)}
@media(max-width:899px){.hdr .hmb{display:flex}}
.dw-ov,.dw{display:none}
@media(max-width:899px){
.dw-ov{display:block;position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.6);opacity:0;visibility:hidden;transition:opacity .25s,visibility 0s .25s}
.dw-ov.open{opacity:1;visibility:visible;transition:opacity .25s}
.dw{display:flex;flex-direction:column;position:fixed;top:0;bottom:0;left:0;z-index:61;width:min(82vw,360px);background:var(--bg);color:var(--t);padding:calc(14px + env(safe-area-inset-top)) 16px calc(18px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));overflow-y:auto;overscroll-behavior:contain;transform:translateX(-100%);visibility:hidden;box-shadow:8px 0 32px rgba(0,0,0,.35);transition:transform .28s cubic-bezier(.2,.8,.2,1),visibility 0s .28s}
.dw.open{transform:none;visibility:visible;transition:transform .28s cubic-bezier(.2,.8,.2,1)}
.dw-h{display:flex;align-items:center;justify-content:space-between;min-height:48px;margin:2px 0 14px 4px}
.dw-h strong{font-size:30px;font-weight:800;letter-spacing:-.02em}
.dw-x{width:40px;height:40px;border:0;border-radius:50%;background:none;color:var(--m);font-size:20px;cursor:pointer}
.dw-x:active{background:var(--c)}
.dw-pills{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
.dw-pills a{display:flex;align-items:center;justify-content:center;height:58px;border:1px solid var(--l);border-radius:20px;color:var(--t);background:var(--bg)}
.dw-pills a:active,.dw-i:active{background:var(--c)}
.dw-card{border:1px solid var(--l);border-radius:24px;overflow:hidden}
.dw-card form{margin:0}
.dw-i{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:62px;padding:0 22px;border:0;border-top:1px solid var(--l);background:none;color:var(--t);font:inherit;font-size:18px;font-weight:600;text-align:left;cursor:pointer}
.dw-card>:first-child,.dw-card>:first-child .dw-i{border-top:0}
.dw-i em{font-style:normal;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dw-i span{position:relative;display:flex;flex:none;color:var(--m)}
.dw-i.on{color:var(--a)}.dw-i.on span{color:var(--a)}
.dw-i i{position:absolute;top:-6px;right:-8px;background:#e5484d;color:#fff;font:600 10px/1 system-ui;padding:3px 5px;border-radius:9px}
.dw-out{color:#d5495e}.dw-out span{color:inherit}
/* v299: laci HP - Pengaturan + Keluar menempel di dasar layar (menu lain tetap di atas; layar pendek: laci bisa digulir) */
.dw>.dw-card:not(.dw-bot){margin-bottom:14px;flex:none}
.dw>.dw-bot{margin-top:auto;flex:none}
html.dw-lock,html.dw-lock body{overflow:hidden}
}
@media(prefers-reduced-motion:reduce){.dw,.dw-ov{transition:none!important}}

/* v67: halaman Pengaturan */
.set{padding:14px;border-bottom:1px solid var(--l)}.set h3{margin:0 0 10px;font-size:15px}
.set-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.set-row label{display:flex;align-items:center;gap:8px}.set-row input{width:auto}
.set-link{color:var(--a);font-weight:600}

/* v70: Highlight iklan Marketplace */
.hlb{position:absolute;left:6px;top:6px;z-index:2;display:inline-flex;align-items:center;gap:4px;background:#facc15;color:#1b1b1b;font:700 11px/1 system-ui;padding:4px 8px;border-radius:6px;box-shadow:0 1px 4px rgba(0,0,0,.3)}
.hlb .ic{stroke-width:2;fill:#1b1b1b}
.hlb.hlb-d{position:static;margin-right:6px}
.mkc.hl{border-color:#facc15;box-shadow:0 0 0 1px #facc15}
.hl-chip{display:inline-flex;align-items:center;gap:4px;color:#a16207;border-color:#facc15}
.hl-chip .ic{fill:#facc15}
.hl-ap{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.hl-ap select{min-width:0;flex:1}
.hl-t{display:grid;gap:6px;margin:6px 0}
.hl-p{display:grid;grid-template-columns:28px 1fr 1.6fr 1fr;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--l);border-radius:12px;background:var(--c);cursor:pointer}
.hl-p input{width:auto;margin:0}.hl-p:has(input:checked){border-color:var(--a);background:var(--me)}
.hl-p b small{display:block;font-weight:500;color:var(--m)}.hl-p .q{font-weight:700}
.hl-p.hl-h{background:none;border:0;cursor:default;font-size:12px;font-weight:700;color:var(--m);padding-block:0}
.hl-pl .ins-pr{grid-template-columns:repeat(5,1fr) 40px}
.hl-pl .ins-pr.hl-new{grid-template-columns:1.4fr repeat(4,1fr)}
@media(max-width:560px){.hl-pl .ins-pr,.hl-pl .ins-pr.hl-new{grid-template-columns:1fr 1fr}.hl-pl .ins-ph{display:none}}

/* v71: form Privasi & bahasa di Pengaturan */
.set form.set-col{display:grid;gap:10px;max-width:420px}.set form.set-col label{display:flex;align-items:center;gap:8px}.set form.set-col input[type=checkbox]{width:auto}.set form.set-col select{width:100%}

/* v72: link Pengaturan > Akun dan kartu pedagang di detail iklan */
.set .set-link{display:block;padding:6px 0}.mp{display:flex;gap:10px;align-items:flex-start;margin:10px 0;padding:10px 12px;border:1px solid var(--l);border-radius:12px}.mp p{margin:4px 0}

/* v79: tab Media Sosial / Marketplace di kartu notifikasi */
.nfp .tabs.nft{position:static;top:auto;flex:none}.nft button{flex:1;text-align:center;padding:10px 4px;background:none;border:0;border-bottom:2px solid transparent;color:var(--m);font:inherit;font-weight:500;cursor:pointer}.nft button:hover{color:var(--t)}.nft button.on{color:var(--t);border-bottom-color:var(--a);font-weight:600}.nft em{font-style:normal;font-size:11px;font-weight:700;background:var(--a);color:#fff;border-radius:9px;padding:1px 6px;margin-left:6px}.nft em[hidden]{display:none}

/* v81: tab Untuk Anda / Mengikuti di bawah kotak status (desktop); di HP pindah ke menu sidebar kiri */
@media(max-width:899px){.tabs.feedtabs{display:none}}

/* v82: cegah layout bergeser saat sheet/dialog mengunci scroll (scrollbar hilang) */
html{scrollbar-gutter:stable}

/* v83: profil pedagang */
.mpf{display:flex;gap:14px;align-items:flex-start;padding:14px}.mpf>div{min-width:0;flex:1}.mp a{color:inherit}.ur a{color:inherit;text-decoration:none}

/* v84: kartu penjual, profil pedagang, bagikan */
.mkseller{border:1px solid var(--l);border-radius:12px;padding:14px;margin:12px 0;display:grid;gap:12px}
.mks-h{display:flex;align-items:center;gap:14px;color:inherit;text-decoration:none;min-width:0}.mks-h strong{font-size:18px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mks-go{margin-left:auto;font-size:26px;color:var(--m);line-height:1}
.mks-chat{display:flex;align-items:center;justify-content:center;gap:8px;width:100%}
.mkph{display:flex;align-items:center;justify-content:center;gap:8px;margin:0;color:var(--t)}.mkph a{font-size:13px}.mkph .mkph-v{letter-spacing:.5px}
.mkpf{display:flex;flex-direction:column;border-bottom:1px solid var(--l)}.mkpf-av{padding:14px 14px 0}.mkpf-b{display:grid;gap:12px;padding:14px;background:color-mix(in srgb,var(--a) 8%,var(--bg))}
.mkpf-r{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.mkpf-n{min-width:0}.mkpf-n h2{margin:0;font-size:20px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}.mkpf-a{margin:0;font-size:14px}
.mkpf-m{font-size:13px}.mkpf-c{display:flex;align-items:center;gap:10px}.mkpf-x{justify-content:flex-start}.mkpf-x .btn{flex:1;min-width:120px;display:flex;align-items:center;justify-content:center;gap:8px}
#mksh{border:1px solid var(--l);border-radius:16px;background:var(--bg);color:var(--t);padding:0;width:min(92vw,380px)}#mksh::backdrop{background:#0008}
#mksh .shf{display:grid;gap:8px}#mksh .shf textarea{width:100%;box-sizing:border-box}#mksh .shf .btn,#mksh>.dlg>.btn.pri{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;box-sizing:border-box;padding:11px 16px;line-height:1.2;text-align:center}#mksh .shf .btn svg,#mksh>.dlg>.btn.pri svg{flex:none;display:block;margin:0}#mksh .shg{display:grid;grid-template-columns:1fr 1fr;gap:8px}#mksh .shg a,#mksh .shg .btn{display:flex;align-items:center;justify-content:center;padding:10px;border:1px solid var(--l);border-radius:12px;color:inherit;text-decoration:none;background:none;font:inherit;cursor:pointer}#mksh .shg [hidden]{display:none}

/* v85: badge profil pedagang (bukan tombol) */
.bdgs{display:flex;flex-wrap:wrap;gap:6px}.bdg{display:inline-flex;align-items:center;gap:5px;cursor:default;pointer-events:none}

/* v87: ring story = garis putus-putus berputar (warna dari garis putus) */
.st-ring,.st-ring.new,.st-ring.me{position:relative;background:transparent}
.st-ring::before{content:"";position:absolute;inset:0;border-radius:50%;border:2.5px dashed var(--l);pointer-events:none}
.st-ring.new::before,.st-ring.me::before{border-color:var(--a);animation:st-spin 9s linear infinite}
.st-ring.none::before{display:none}
@keyframes st-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.st-ring.new::before,.st-ring.me::before{animation:none}}

/* v90: tombol Terima / Tolak permintaan pesan lebih tegas */
.reqn p{margin:0 0 10px}.reqa{display:flex;gap:10px}.reqa button{flex:1;min-height:44px;border-radius:999px;font:inherit;font-weight:700;font-size:15px;cursor:pointer;border:2px solid transparent}
.reqa button:first-child{background:var(--a);color:#fff}.reqa button:last-child{background:transparent;color:#d5495e;border-color:#d5495e}.reqa button:active{opacity:.8}

/* v94: tema terang -> ikon, teks, tombol & aksen dark navy */
:root:not([data-theme=dark]) .hdr .logo,:root:not([data-theme=dark]) .pbrand .logo,:root:not([data-theme=dark]) .sp-logo,:root:not([data-theme=dark]) .lf-av{background:linear-gradient(135deg,#27468c,var(--a))}
:root:not([data-theme=dark]) .hdr .logo,:root:not([data-theme=dark]) .sp-logo{box-shadow:0 2px 8px #0b225540}
:root:not([data-theme=dark]) .nav a.on,:root:not([data-theme=dark]) .nav a.on span{color:var(--t);font-weight:700}

/* v95: menu geser tema gelap -> hanya hitam & putih */
[data-theme=dark] .dw{background:#000;color:#fff;box-shadow:8px 0 32px rgba(0,0,0,.8)}
[data-theme=dark] .dw-h strong,[data-theme=dark] .dw-x,[data-theme=dark] .dw-i,[data-theme=dark] .dw-i span,[data-theme=dark] .dw-pills a,[data-theme=dark] .dw-out,[data-theme=dark] .dw-out span{color:#fff}
[data-theme=dark] .dw-pills a{background:#000;border-color:rgba(255,255,255,.3)}
[data-theme=dark] .dw-card{border-color:rgba(255,255,255,.3)}
[data-theme=dark] .dw-i{border-top-color:rgba(255,255,255,.3);background:#000}
[data-theme=dark] .dw-pills a:active,[data-theme=dark] .dw-i:active,[data-theme=dark] .dw-x:active{background:#fff;color:#000}
[data-theme=dark] .dw-pills a:active svg,[data-theme=dark] .dw-i:active span,[data-theme=dark] .dw-i:active em{color:#000}
[data-theme=dark] .dw-i.on,[data-theme=dark] .dw-i.on span{background:#fff;color:#000}
[data-theme=dark] .dw-i i{background:#fff;color:#000}

/* v96: tema gelap seluruh aplikasi -> hitam & putih (teks putih, ikon putih) */
[data-theme=dark] .btn.pri,[data-theme=dark] .lside .cta,[data-theme=dark] .lsw a.on,[data-theme=dark] .cv i,[data-theme=dark] .sp-btn.pri{color:#000}
[data-theme=dark] .hdr .logo,[data-theme=dark] .pbrand .logo,[data-theme=dark] .sp-logo,[data-theme=dark] .lf-av{background:#fff;color:#000;box-shadow:none}
[data-theme=dark] .bub.me,[data-theme=dark] .fl{border:1px solid #ffffff59}
[data-theme=dark] .pr i{background:#ffffff33}
[data-theme=dark] .nt.un,[data-theme=dark] .nfp .cv.un,[data-theme=dark] .ntw>.nt.un{background:#ffffff14}
[data-theme=dark] .nav i,[data-theme=dark] .lside .sl i{background:#fff;color:#000}
[data-theme=dark] .nav,[data-theme=dark] .hdr{background:#000}
[data-theme=dark] .hdr{background:color-mix(in srgb,#000 88%,transparent)}

/* v98: strip "Akun untuk Anda ikuti" kini di bawah feed (HP) */
.sg-strip{border-bottom:0;border-top:1px solid var(--l)}
/* v98: tombol PWA & tanda silang mengikuti tema (tema gelap: pil putih -> teks & ✕ hitam) */
[data-theme=dark] .pwa-pill,[data-theme=dark] .pwa-go{color:#000}
[data-theme=dark] .pwa-pill{box-shadow:0 8px 24px #000a,0 0 0 1px #ffffff59}
[data-theme=dark] .pwa-x{background:#00000026;color:#000}
[data-theme=dark] .pwa-ok{color:#000}
[data-theme=dark] .lpv .lpx,[data-theme=dark] .mkx,[data-theme=dark] .se-qt .qt-x{background:#fff;color:#000;box-shadow:0 0 0 1px #00000059}

/* v105: pratinjau lampiran komposer/pesan */
.att-pv{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0}.att-pv[hidden]{display:none}
.att{position:relative;width:110px;height:110px;border-radius:12px;overflow:hidden;border:1px solid var(--l);background:var(--c)}
.att img,.att video{width:100%;height:100%;object-fit:cover;display:block}
.att-x{position:absolute;top:4px;right:4px;width:26px;height:26px;border:0;border-radius:50%;background:rgba(0,0,0,.7);color:#fff;font-size:13px;line-height:1;cursor:pointer;padding:0}

/* v106: menu samping (drawer) HP/PWA — isi tidak boleh menyusut/terpotong; bila layar pendek (landscape, zoom/ukuran font besar) panel bisa digulir sehingga tombol Keluar tetap terjangkau */
@media(max-width:899px){
.dw{height:100vh;height:100dvh;max-height:100dvh;-webkit-overflow-scrolling:touch}
.dw>*{flex-shrink:0}
.dw-card{margin-bottom:8px}
}
@media(max-width:899px) and (max-height:600px){
.dw-h{min-height:40px;margin-bottom:6px}.dw-h strong{font-size:24px}
.dw-pills{margin-bottom:10px}.dw-pills a{height:46px}
.dw-i{min-height:48px;font-size:16px}
}

/* v107: layar lipat (Samsung Z Fold) & PWA — 100vh dapat lebih tinggi dari area yang benar-benar terlihat (bar sistem/taskbar/bar alamat), sehingga sidebar kiri (Keluar, profil) dan navigasi terdorong ke bawah layar. Pakai tinggi viewport dinamis (dvh) bila didukung. */
@supports (height:100dvh){
.shell main{min-height:calc(100dvh - var(--hh))}
.lside{height:calc(100dvh - var(--hh))}
#msgs{height:calc(100dvh - 240px)}
@media(max-width:700px){.nfp{max-height:calc(100dvh - var(--hh) - 80px)}}
}
.lside{overscroll-behavior:contain}

/* v108: navigasi bawah HP/PWA — tidak lagi tertimpa bar sistem Android; area ketuk penuh per tombol */
@media(max-width:899px){
body{padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}
.nav{padding:0 0 env(safe-area-inset-bottom,0px);justify-content:stretch;align-items:stretch;min-height:56px}
.nav a{flex:1 1 0;min-width:0;min-height:56px;justify-content:center;gap:3px;padding:6px 2px;-webkit-tap-highlight-color:transparent;touch-action:manipulation;user-select:none;-webkit-user-select:none}
.nav a:active{background:color-mix(in srgb,var(--t) 8%,transparent)}
.nav a em{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2}
.nav a span{width:44px;height:28px;border-radius:14px}
.nav a.on span{background:color-mix(in srgb,var(--t) 10%,transparent)}
.nav i{right:2px;top:-2px}
}

/* v109: desain potret 728x1280 (9:16) — kolom aplikasi HP/PWA maks. 728px, diperluas penuh ke lebar layar potret, terpusat di layar lebih lebar */
@media(max-width:899px){
.shell,.hdr{max-width:728px;margin-left:auto;margin-right:auto}
.shell main{max-width:728px;margin:0 auto}
.nav{left:50%;right:auto;width:100%;max-width:728px;transform:translateX(-50%)}
}
/* HP dipegang landscape: minta putar ke potret */
@media(orientation:landscape) and (max-height:500px) and (pointer:coarse){
body::after{content:"\21BB  Putar ke potret / Rotate to portrait";position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;background:#000;color:#fff;font:600 18px system-ui,sans-serif;text-align:center;padding:24px}
}

/* v110: beranda tidak bisa digoyang kiri-kanan di HP/PWA — baris aksi posting (suka/komentar/ulang/kutip/simpan/bagikan/menu) tidak lagi melebihi lebar layar */
html,body{overflow-x:clip;max-width:100%;overscroll-behavior-x:none}
.post,.post .pb,.pb,.tc,main{min-width:0;max-width:100%}
@media(max-width:899px){
.post .ac,.pb .ac{width:100%;max-width:100%;gap:0;justify-content:space-between;flex-wrap:nowrap}
.post .ac .mn,.pb .ac .mn{margin-left:0}
.post .ac a,.post .ac button,.post .ac .ro{min-width:0;padding:4px 2px}
.post img,.post video,.post iframe,.post .qt{max-width:100%}
.post .pb p,.post .pb .bd{overflow-wrap:anywhere;word-break:break-word}
}

/* v111: tema gelap — garis/kartu lebih samar; baris aksi posting rapat rata kiri (suka, komentar, ulang, ...) seperti Threads, menu ⋯ tetap di kanan */
[data-theme=dark]{--l:#ffffff1c}
[data-theme=dark] .ac,[data-theme=dark] .ac a,[data-theme=dark] .ac button,[data-theme=dark] .ac .ro,[data-theme=dark] .ac .mn summary{color:#a8a8a8}
[data-theme=dark] .ac button[data-act=like].on,[data-theme=dark] .ac .on{color:#ff3b5c}
[data-theme=dark] .ac button[data-act=repost].on{color:#16a37a}
[data-theme=dark] .ac button.sv.on{color:#fff}
@media(max-width:899px){
.post .ac,.pb .ac{justify-content:flex-start;gap:clamp(12px,4.2vw,20px)}
.post .ac .mn,.pb .ac .mn{margin-left:auto}
.post .ac a,.post .ac button,.post .ac .ro{padding:4px 0;gap:5px}
}

/* v112: tanpa garis scroll (scrollbar) di seluruh aplikasi — tetap bisa digulir/digeser */
html,body,*{scrollbar-width:none;-ms-overflow-style:none}
html::-webkit-scrollbar,body::-webkit-scrollbar,*::-webkit-scrollbar{display:none;width:0;height:0;background:transparent}

/* v113: popup saran @ (mention) */
.mn-pop{position:fixed;z-index:100000;max-width:calc(100vw - 16px);background:var(--bg);color:var(--t);border:1px solid var(--l);border-radius:14px;box-shadow:0 10px 30px #0005;overflow:hidden}
.mn-it{display:flex;align-items:center;gap:10px;width:100%;padding:8px 12px;border:0;border-bottom:1px solid var(--l);background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}
.mn-it:last-child{border-bottom:0}.mn-it.on,.mn-it:active{background:color-mix(in srgb,var(--t) 9%,transparent)}
.mn-tx{display:flex;flex-direction:column;min-width:0;line-height:1.25}.mn-tx strong,.mn-tx small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mn-tx small{color:var(--m);font-size:12.5px}
.mn-it .av{border-radius:50%;object-fit:cover}

/* v116: Admin -> Widget */
.wg{display:grid;gap:12px}.wg label{display:grid;gap:4px}.wg-g{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.wg textarea{width:100%;font:12.5px/1.4 ui-monospace,Menlo,Consolas,monospace;resize:vertical}
.wg-pv{max-width:360px;border:1px dashed var(--l);border-radius:12px;padding:8px}.wg-pv iframe{width:100%;border:0;display:block}
/* v117: Admin -> menu dikelompokkan (General / Social Media / Marketplace), submenu di baris bawah */
.tabs.agrp a{font-weight:700;padding:13px 4px}.tabs.agrp a.on{border-bottom-width:3px}
.tabs.g2{background:color-mix(in srgb,var(--c) 45%,transparent)}.tabs.g2 a{font-size:13px;padding:10px 14px}.tabs.g2 a.on{border-bottom-width:2px}
/* v118: Admin -> Statistik trafik per wilayah */
.trbc{display:flex;flex-wrap:wrap;gap:6px;padding:4px 14px 10px;color:var(--m);font-size:13px}.trbc a{color:var(--t);font-weight:600}
.trs{padding:0 14px 14px}.trh,.trr{display:grid;grid-template-columns:minmax(0,1fr) 84px 84px;gap:8px;align-items:center;padding:10px 12px}.tr1 .trh,.tr1 .trr{grid-template-columns:minmax(0,1fr) 84px}
.trh{color:var(--m);font-size:12px;border-bottom:1px solid var(--l)}.trr{border-bottom:1px solid var(--l);color:inherit;text-decoration:none;background:linear-gradient(90deg,color-mix(in srgb,var(--a) 22%,transparent) var(--w,0%),transparent var(--w,0%))}
a.trr:hover{background-color:var(--c)}.trn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}.trv{text-align:right;font-variant-numeric:tabular-nums}
.trf{padding:6px 14px 14px;color:var(--m);font-size:12px}
/* v119: Admin -> Statistik (grafik garis, donat, tab per pengguna) */
.stc svg{width:100%;height:auto;display:block;background:var(--c);border:1px solid var(--l);border-radius:12px}
.stg{stroke:var(--l);stroke-width:1}.stt{fill:var(--m);font-size:11px}.stl{fill:none;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
polyline.stl1{stroke:var(--a)}polyline.stl2{stroke:#e0a030}circle.stl1{fill:var(--a)}circle.stl2{fill:#e0a030}circle.stp{stroke:none}.sta{fill:color-mix(in srgb,var(--a) 15%,transparent);stroke:none}
.stlg{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--m);padding-bottom:6px}.stk{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px}.stk1{background:var(--a)}.stk2{background:#e0a030}
.stdw{display:flex;gap:16px;align-items:center;flex-wrap:wrap;background:var(--c);border:1px solid var(--l);border-radius:12px;padding:14px}
.stdn{width:120px;height:120px;border-radius:50%;position:relative;flex:none}.stdn::after{content:'';position:absolute;inset:27%;border-radius:50%;background:var(--c)}
.stdl{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:13px;flex:1;min-width:140px}.stdl li{display:flex;align-items:center;gap:8px}.stdl i{width:10px;height:10px;border-radius:3px;flex:none}
.stdl span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stdl b{font-variant-numeric:tabular-nums}
.stgr{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.tr4 .trh,.tr4 .trr{grid-template-columns:minmax(0,1fr) 62px 62px 62px}.trn small{color:var(--m);font-weight:400}
/* v120: Admin -> Statistik -> Riset Pasar (kolom harga lebih lebar) */
.trm .trh,.trm .trr{grid-template-columns:minmax(0,1fr) 112px 112px}
@media(max-width:480px){.trm .trh,.trm .trr{grid-template-columns:minmax(0,1fr) 92px 92px;gap:6px}}
.rl{display:flex;gap:6px;align-items:center}.rl select{min-width:0;max-width:210px}
.mkadd{margin:8px 0}.mkadd>summary{display:inline-block;cursor:pointer;list-style:none}.mkadd>summary::-webkit-details-marker{display:none}.mkadd .ann-f{margin-top:10px;padding:12px;border:1px solid var(--l);border-radius:14px}.mkadd .ann-f select{padding:8px 12px;border:1px solid var(--l);border-radius:12px;background:var(--c);color:var(--t);font:inherit}.mkadd small.emp{display:block}
.mkphone{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 8px;margin:0;padding:10px 12px;border:1px solid var(--l);border-radius:12px;background:var(--bg);color:var(--t);font-size:15px}.mkphone svg{flex:none;color:var(--m)}.mkphone .mkph-v{font-weight:600;letter-spacing:.3px;white-space:nowrap}.mkphone a{font-size:13px;color:var(--a)}.mkphone .mkph-v a{font-size:15px;color:inherit}
.mkphone [data-showph],.mkphone>a{flex:1 0 100%;text-align:center;padding:7px 10px;border:1px solid var(--l);border-radius:999px;background:var(--c)}
.mks-ab{margin:0;font-size:13px;line-height:1.45;color:var(--m);text-align:center}.mks-vs{display:flex;justify-content:center;width:100%;box-sizing:border-box}
.mkside .mkseller{display:flex;flex-direction:column;padding:18px 16px;gap:14px}.mkside .mks-h .av,.mkside .mks-h>*:first-child{margin-inline:auto}.mkside .mks-h strong{font-size:17px}
.mkside .mks-vs{margin-top:auto}
@media(max-width:639px){.mkphone{justify-content:flex-start}.mkphone [data-showph],.mkphone>a{flex:0 0 auto}}
/* Detail produk: foto utama + kartu penjual sama tinggi; hitungan foto di bawah foto; thumbnail selebar foto + kartu */
.mkhd{display:grid;gap:0;margin:0}.mkhd .mkgv{max-width:none;margin:0}.mkside .mkseller{margin:12px 14px 0}
@media(min-width:640px){
 .mkhd{grid-template-columns:minmax(0,1fr) 260px;grid-template-rows:auto auto auto;gap:8px 14px;padding:0 14px;align-items:stretch}
 .mkhd .mkgv{display:contents}
 .mkhd .mkgm{grid-column:1;grid-row:1;height:min(74vh,540px);border-radius:12px}
 .mkhd .mkside{grid-column:2;grid-row:1;display:flex;min-width:0;padding:0}
 .mkhd .mkgc{position:static;grid-column:1/-1;grid-row:2;justify-self:start;background:none;color:var(--m);padding:0;font-size:13px}
 .mkhd .mkgd{display:none}
 .mkhd .mkgt{grid-column:1/-1;grid-row:3;padding:0}
 .mkside .mkseller{margin:0;width:100%;height:100%;box-sizing:border-box;align-content:start}
 .mkside .mks-h{flex-direction:column;text-align:center;gap:8px}.mkside .mks-h strong{max-width:100%;white-space:normal;overflow-wrap:anywhere}.mkside .mks-go{display:none}
 body.gm .mkd{max-width:none}
}

/* Tombol dengan ikon: ikon dan teks sejajar dalam satu baris (mis. tombol Bagikan) */
.btn:has(>svg){display:inline-flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap}.btn:has(>svg) svg{flex:none;display:block}
/* Kartu penjual: lokasi + tombol Bagikan mengisi ruang kosong */
.mks-ex{display:flex;align-items:center;justify-content:space-between;gap:10px}.mks-ex.noloc{justify-content:center}.mks-loc{margin:0;font-size:14px;color:var(--m);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mks-ex .mks-shi{flex:none;width:40px;height:40px;padding:0;border-radius:50%;display:inline-flex;align-items:center;justify-content:center}
.mkside .mks-ex{margin-block:auto}.mkside .mkseller>.mks-chat{margin-top:auto}.mkside .mks-ex+.mks-chat{margin-top:0}
/* Kartu penjual sama tinggi dengan foto utama (tinggi baris ditentukan foto saja) */
@media(min-width:640px){.mkhd .mkgm{height:max(360px,min(74vh,540px))}.mkhd .mkside{position:relative}.mkhd .mkside .mkseller{position:absolute;inset:0;height:auto;overflow-y:auto;scrollbar-width:none}.mkhd .mkside .mkseller::-webkit-scrollbar{display:none}}
/* Foto utama: latar blur dari foto itu sendiri (img, bukan CSS var yang URL-nya salah rujukan), bingkai sama dengan kartu penjual */
.mkgs::before{display:none}
.mkgs .mkgb{position:absolute;inset:-18px;width:calc(100% + 36px);height:calc(100% + 36px);max-width:none;object-fit:cover;filter:blur(18px) brightness(.8)}
.mkgs img:not(.mkgb){position:relative;z-index:1}
.mkgm{background:#0d1117}
@media(min-width:640px){.mkhd .mkgm{border:1px solid var(--l);border-radius:12px}}
/* ===== Reels layar penuh ala TikTok — HANYA tampilan mobile (<900px); desktop tetap seperti semula ===== */
.rl-bar,.rl-rail2,.rl-loc{display:none}
@media(max-width:899px){
body.rls{background:#000;color:#fff}
body.rls .hdr,body.rls .lside,body.rls .rside,body.rls .rl-top{display:none!important}
body.rls .shell{display:block;width:100%;padding:0;margin:0}
body.rls main,body.rls .shell main{display:block;max-width:none;width:100%;min-height:0;margin:0;border:0;background:transparent}
.rls .rl-feed{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:auto;margin:0;padding:0;transform:none;z-index:1;background:#000}
.rls .rl-v{object-fit:cover}
.rls .rl-ico{background:#0005}
.rls .emp{color:#fff;text-align:center;padding:140px 28px 0}
/* atas: pencarian transparan + tab Mengikuti / Untuk Anda */
.rl-bar{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;flex-direction:column;gap:6px;padding:calc(8px + env(safe-area-inset-top)) 12px 6px;background:transparent;pointer-events:none}
.rl-bar>*{pointer-events:auto}
.rl-row{display:flex;align-items:center;gap:6px}
.rl-b{flex:none;width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:50%;background:none;color:#fff;font-size:26px;line-height:1;cursor:pointer;filter:drop-shadow(0 1px 4px rgba(0,0,0,.7))}
.rl-b svg{display:block}
.rl-s{position:relative;flex:1;min-width:0;margin:0}
.rl-s input[type=search]{width:100%;box-sizing:border-box;padding:9px 16px 9px 40px;border-radius:22px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.16);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font-size:15px}
.rl-s input::placeholder{color:rgba(255,255,255,.8)}
.rl-s input:focus{outline:2px solid rgba(255,255,255,.7);outline-offset:-1px}
.rl-si{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:#fff;display:flex;pointer-events:none;filter:drop-shadow(0 1px 3px rgba(0,0,0,.6))}
.rl-tabs{display:flex;justify-content:center;gap:24px}
.rl-tabs a{position:relative;padding:4px 2px 6px;color:rgba(255,255,255,.72);font-size:17px;font-weight:600;text-shadow:0 1px 4px rgba(0,0,0,.7)}
.rl-tabs a.on{color:#fff;font-weight:700}
.rl-tabs a.on::after{content:"";position:absolute;left:50%;bottom:0;width:24px;height:3px;border-radius:2px;background:#fff;transform:translateX(-50%)}
/* bawah-kiri: lokasi, nama, keterangan */
.rls .rl-info{left:0;right:84px;bottom:calc(62px + env(safe-area-inset-bottom));padding:40px 14px 14px;background:linear-gradient(transparent,#0004)}
.rls .rl-info .rl-who .av{display:none}
.rls .rl-info .rl-who strong{font-size:18px}
.rl-loc{display:inline-block;margin-bottom:8px;padding:3px 9px;border-radius:7px;background:rgba(0,0,0,.35);font-size:13px}
/* kanan: rail ikon vektor + angka di bawahnya */
.rls .rl-rail{display:none}
.rls .rl-rail2{position:absolute;right:6px;bottom:calc(70px + env(safe-area-inset-bottom));z-index:3;display:flex;flex-direction:column;align-items:center;gap:14px}
.rl-rail2 a,.rl-rail2 button{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:48px;padding:0;border:0;background:none;color:#fff;font-size:13px;font-weight:600;line-height:1.1;cursor:pointer;text-shadow:0 1px 4px rgba(0,0,0,.7);filter:drop-shadow(0 1px 3px rgba(0,0,0,.55))}
.rl-rail2 svg{display:block}
.rl-rail2 button.on svg{fill:#ff2d55;stroke:#ff2d55}
.rl-rail2 .sv.on svg{fill:#ffc107;stroke:#ffc107}
.rl-rail2 .rl-mute{font-size:22px}
.rl-ava{position:relative;width:52px;height:62px;margin-bottom:4px}
.rl-ava>a{display:block;width:52px;height:52px}
.rl-ava .av{width:52px!important;height:52px!important;border:2px solid #fff;border-radius:50%;object-fit:cover;box-sizing:border-box;display:flex;align-items:center;justify-content:center;background:var(--c);color:var(--t)}
.rl-rail2 .rl-fol{position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:22px;height:22px;min-width:0;padding:0;border-radius:50%;background:#fe2c55;color:#fff;font-size:16px;line-height:22px;text-shadow:none;filter:none;align-items:center;justify-content:center}
/* bawah: navigasi transparan + tombol ＋ di tengah */
body.rls .nav{background:transparent!important;border:0!important;box-shadow:none!important;-webkit-backdrop-filter:none;backdrop-filter:none;pointer-events:none}
body.rls .nav a{pointer-events:auto;filter:drop-shadow(0 1px 4px rgba(0,0,0,.7))}
body.rls .nav a,body.rls .nav a.on,body.rls .nav a.on span,body.rls .nav a em{color:#fff!important}
body.rls .nav a.on span{background:rgba(255,255,255,.2)}
body.rls .nav a:active{background:none}
body.rls .nav a.nav-c span,body.rls .nav a.nav-c.on span{background:#fff;color:#000!important;box-shadow:-3px 0 0 #25f4ee,3px 0 0 #fe2c55}
}

/* Menu CONNECT (Reels) sebagai pusat navigasi bawah — hanya mobile; desktop memakai sidebar kiri */
@media(max-width:899px){
.nav a.nav-c span{width:52px;height:32px;border-radius:12px;background:var(--a);color:#fff}
.nav a.nav-c.on span{background:var(--a)}
:root:not([data-theme=dark]) .nav a.nav-c span,:root:not([data-theme=dark]) .nav a.nav-c.on span{color:#fff}
[data-theme=dark] .nav a.nav-c span{background:#fff;color:#000}
.nav a.nav-c em{font-weight:700;letter-spacing:.2px}
}

/* v144: Reels — video layar penuh yang aman untuk WebView/HP lama (tanpa inset/dvh/:has), video diposisikan absolut mengisi seluruh item; tombol ＋ berbentuk persegi membulat merah (seperti logo YouTube), tanda ＋ putih, menggantikan hamburger */
@media(max-width:899px){
body.rls{padding:0!important;margin:0;overflow:hidden;background:#000}
body.rls main,body.rls .shell main,body.rls .shell{transform:none!important;transition:none!important;border-radius:0!important;overflow:visible}
body.rls .rl-feed{position:fixed!important;top:0!important;right:0!important;bottom:0!important;left:0!important;width:100%;width:var(--rlw,100%)!important;height:100%;height:var(--rlh,100%);margin:0!important;padding:0!important;border:0!important;border-radius:0!important;z-index:1;background:#000}
body.rls .rl-item{display:block;position:relative;height:100%;height:var(--rlh,100%);min-height:100%;width:100%;border-radius:0;overflow:hidden}
body.rls .rl-v{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;border-radius:0}
body.rls .rl-bar{background:linear-gradient(rgba(0,0,0,.45),transparent)}
body.rls .rl-b.rl-add{width:56px;height:40px;border-radius:12px;background:#ff0033;color:#fff;font-size:30px;font-weight:300;line-height:1;filter:none;box-shadow:0 2px 8px rgba(0,0,0,.4)}
body.rls .rl-b.rl-add:active{background:#d6002b}
/* ikut ukuran layar HP (mis. 728x1280): bar atas & navigasi bawah juga selebar layar penuh */
body.rls .nav{left:0;right:0;width:100%;max-width:none;transform:none;margin:0}
body.rls .rl-bar{left:0;right:0;width:100%;max-width:none;box-sizing:border-box}
body.rls .rl-info{left:0}
/* penyebab video terpotong: aturan global video{max-height:480px;margin-top:6px;border-radius:12px} — dinetralkan untuk video Reels */
body.rls video.rl-v,.rl-v{max-height:none!important;max-width:none!important;margin:0!important;border-radius:0!important}
}

/* v148: desktop — tombol unggah Reel jadi persegi membulat merah dengan tanda ＋ putih (seperti di mobile) */
.rl-add-d{display:inline-flex;align-items:center;justify-content:center;width:56px;height:40px;padding:0;border:0;border-radius:12px;background:#ff0033;color:#fff;font-size:30px;font-weight:300;line-height:1;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.rl-add-d:hover{background:#e6002e}.rl-add-d:active{background:#d6002b}

/* v152: Suara Reels */
.rl-snd{display:block;margin-top:8px;max-width:100%;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rl-snd.off{opacity:.75}
.rl-sb{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(76px + env(safe-area-inset-bottom));z-index:40;display:flex;align-items:center;gap:8px;max-width:92vw;padding:8px 10px 8px 14px;border-radius:14px;background:#000d;color:#fff;font:600 13px system-ui,sans-serif}.rl-sb span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.snd-h{display:flex;gap:14px;align-items:center;padding:16px;border-bottom:1px solid var(--l)}
.snd-th{position:relative;flex:none;width:112px;aspect-ratio:9/16;border-radius:12px;overflow:hidden;background:#000;display:block}
.snd-th video,.snd-t video{display:block;width:100%;height:100%;object-fit:cover;max-height:none;margin:0;border-radius:0;pointer-events:none}
.snd-i{min-width:0;flex:1}.snd-i h1{margin:0 0 4px;font-size:18px}.snd-i a:not(.btn){color:var(--t)}.snd-i small{color:var(--m)}
.snd-act{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.snd-ls{padding:12px 16px 8px;font-weight:700}
.snd-g{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;padding:0 2px 2px}
.snd-t{position:relative;display:block;aspect-ratio:9/16;background:#000;overflow:hidden}
.snd-t span{position:absolute;left:6px;right:6px;bottom:6px;color:#fff;font:600 12px system-ui,sans-serif;text-shadow:0 1px 3px #000;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.snd-t b{position:absolute;top:6px;left:6px;background:#fe2c55;color:#fff;font:700 11px system-ui,sans-serif;padding:2px 7px;border-radius:6px}
.snd-pg{display:flex;justify-content:space-between;padding:12px 16px}

/* v153: menu suara asli video (bisukan / pertahankan) */
.rl-mx{display:flex;align-items:center;gap:10px;margin:8px 0;font-size:14px}.rl-mx span{flex:none;font-weight:600}.rl-mx select{flex:1;min-width:0;padding:8px;border:1px solid var(--l);border-radius:8px;background:var(--bg);color:var(--t);font:inherit}

/* v154: balon 'beta' di tombol CONNECT (merah, tulisan putih, melayang kecil; tidak menangkap ketukan) */
.bt-beta{position:relative;display:inline-block;pointer-events:none;background:#e11d2e;color:#fff;font:800 9px/1 system-ui,sans-serif;letter-spacing:.5px;text-transform:uppercase;padding:3px 6px;border-radius:7px;box-shadow:0 1px 4px #0004;animation:bt-bob 2.4s ease-in-out infinite}
.nav a.nav-c{position:relative}
.nav a.nav-c .bt-beta{position:absolute;left:calc(50% + 32px);top:-7px;z-index:2;--bx:0px}
.lside .sl .bt-beta{flex:none;align-self:flex-start;margin:2px 0 0 2px;--bx:0px}
@keyframes bt-bob{0%,100%{transform:translate(var(--bx,0),0)}50%{transform:translate(var(--bx,0),-3px)}}
@media (prefers-reduced-motion:reduce){.bt-beta{animation:none;transform:translate(var(--bx,0),0)}}
body.rls .nav a.nav-c .bt-beta{top:-7px}

/* ===== v157: layar editor unggah Reel (potong, suara, suara asli, keterangan) ===== */
.ed{position:fixed;inset:0;z-index:99998;background:#0b0b0f;color:#fff;display:flex;flex-direction:column;font:500 15px system-ui,sans-serif}
.ed.ed-sh{z-index:99999}
.ed-top{display:flex;align-items:center;gap:10px;padding:10px 12px;padding-top:calc(10px + env(safe-area-inset-top,0px));border-bottom:1px solid rgba(255,255,255,.12)}
.ed-top strong{flex:1;text-align:center}.ed-sp{width:36px;flex:none}
.ed-x{flex:none;width:36px;height:36px;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-size:16px;cursor:pointer}
.ed-go{flex:none;padding:9px 20px;border:0;border-radius:999px;background:#ff0033;color:#fff;font:inherit;font-weight:700;cursor:pointer}.ed-go:disabled{opacity:.6;cursor:default}
.ed-body{flex:1;overflow:auto;display:flex;flex-direction:column;gap:14px;width:100%;max-width:520px;margin:0 auto;box-sizing:border-box;padding:12px 14px calc(18px + env(safe-area-inset-bottom,0px))}
.ed-stage{position:relative;align-self:center;border-radius:14px;overflow:hidden;background:#000;line-height:0;cursor:pointer;flex:none}
.ed-stage video{display:block;max-width:100%;max-height:40vh;max-height:40dvh;margin:0;border-radius:0}
.ed-mt{position:absolute;right:8px;bottom:8px;width:36px;height:36px;border:0;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;font-size:16px;cursor:pointer}
.ed-sec{display:flex;flex-direction:column;gap:8px}.ed-sec h4{margin:0;font-size:13px;letter-spacing:.04em;text-transform:uppercase;opacity:.7}
.ed-hint{margin:0;font-size:12px;opacity:.7;font-weight:400}
.ed-trk{position:relative;height:10px;border-radius:5px;background:rgba(255,255,255,.25)}.ed-win{position:absolute;top:0;height:100%;border-radius:5px;background:#ff0033}
.ed-rg{display:flex;align-items:center;gap:10px}.ed-rg span{flex:none;width:64px;font-weight:500;opacity:.85}.ed-rg input{flex:1;min-width:0;accent-color:#ff0033}
.ed-lab{font-size:13px;opacity:.85;text-align:center}
.ed-snd{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ed-chip{flex:1 1 100%;padding:9px 12px;border-radius:12px;background:rgba(255,255,255,.1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-b{padding:9px 16px;border:1px solid rgba(255,255,255,.35);border-radius:999px;background:none;color:#fff;font:inherit;cursor:pointer}.ed-b.pri{background:#ff0033;border-color:#ff0033;font-weight:700}
.ed-mix{display:flex;align-items:center;gap:10px}.ed-mix span{flex:none;font-weight:600}.ed-mix select{flex:1;min-width:0;padding:8px;border:1px solid rgba(255,255,255,.3);border-radius:8px;background:#16161c;color:#fff;font:inherit}
.ed-cap,.ed-q{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid rgba(255,255,255,.3);border-radius:12px;background:#16161c;color:#fff;font:inherit}
.ed-tabs{display:flex;gap:8px}.ed-tabs button{flex:1;padding:9px;border:1px solid rgba(255,255,255,.3);border-radius:999px;background:none;color:#fff;font:inherit;cursor:pointer}.ed-tabs button.on{background:#fff;color:#0b0b0f;font-weight:700}
.ed-list{display:flex;flex-direction:column;gap:6px}
.ed-row{display:flex;align-items:center;gap:10px;padding:8px;border-radius:12px;background:rgba(255,255,255,.07)}
.ed-pl{flex:none;width:40px;height:40px;border:0;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;font-size:15px;cursor:pointer}.ed-pl.on{background:#ff0033}
.ed-ri{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.ed-ri b,.ed-ri small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ed-ri small{opacity:.65;font-weight:400}
.ed-row .ed-b{flex:none;padding:7px 14px}
.ed-more{align-self:center;padding:9px 22px;border:1px solid rgba(255,255,255,.35);border-radius:999px;background:none;color:#fff;font:inherit;cursor:pointer}.ed-more[hidden]{display:none}
.ed-emp{text-align:center;opacity:.7;margin:18px 0}
@media (prefers-reduced-motion:reduce){.ed *{transition:none!important}}

/* v161: balon 'beta' di tombol Wisata + tombol dummy Jelajah dengan balon 'soon' */
.bt-soon{background:#f59e0b;color:#1a1a1a}
.nav a.nav-w{position:relative}
.nav a.nav-w .bt-beta{position:absolute;left:calc(50% + 12px);top:-4px;z-index:2;--bx:0px}
.lside .sl-soon{cursor:default;opacity:.85}
.lside .sl-soon:hover{background:none;color:var(--m)}
.dw-soon{cursor:default;opacity:.85}
.dw-l2{display:flex;align-items:center;gap:8px;min-width:0}
.dw-l2 .bt-beta{flex:none;--bx:0px}

/* v162: tombol dummy Jelajah (balon muncul saat diklik) + badge pesan di tombol hamburger */
.lside button.sl-soon{width:100%;background:none;border:0;font:inherit;font-size:15.5px;font-weight:500;color:var(--m);text-align:left;cursor:pointer;position:relative}
.lside button.sl-soon:hover{background:var(--c);color:var(--t)}
.dw-soon{position:relative}
.sl-soon .bt-pop{position:absolute;right:10px;top:-8px;z-index:3;--bx:0px}
.dw-soon .bt-pop{position:absolute;right:64px;top:12px;z-index:3;--bx:0px}
.hmb{position:relative}.hmb-b{position:absolute;top:2px;right:0;background:#e0245e;color:#fff;font:700 10px/1 system-ui;font-style:normal;padding:3px 5px;border-radius:9px;box-shadow:0 0 0 2px var(--bg)}

/* v163: tombol dummy Jelajah di navigasi bawah HP (menu kelima, CONNECT tetap di tengah) */
.nav button.nvb{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1 1 0;min-width:0;min-height:56px;gap:3px;padding:6px 2px;background:none;border:0;font:inherit;font-size:11px;font-weight:500;color:var(--m);cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.nav button.nvb span{position:relative;display:flex;align-items:center;justify-content:center;width:44px;height:28px;border-radius:14px;font-size:22px}
.nav button.nvb em{font-style:normal;font-size:11px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2}
.nav button.nvb:active{background:color-mix(in srgb,var(--t) 8%,transparent)}
.nav .nvb .bt-pop{position:absolute;left:50%;top:-22px;z-index:3;--bx:-50%}
body.rls .nav button.nvb{pointer-events:auto;color:#fff;filter:drop-shadow(0 1px 4px rgba(0,0,0,.7))}

/* v171: kartu profil mini (hover desktop / tahan di HP) */
.hcard{position:fixed;z-index:1200;max-width:calc(100vw - 24px);background:var(--bg,#0a1228);color:var(--t);border:1px solid var(--b,rgba(128,128,128,.3));border-radius:16px;box-shadow:0 12px 40px rgba(0,0,0,.45);overflow:hidden;opacity:0;transform:translateY(4px) scale(.98);transition:opacity .14s,transform .14s;pointer-events:auto;font-size:14px}
.hcard.on{opacity:1;transform:none}.hcard[hidden]{display:none}
.hc-ld{padding:28px;text-align:center;color:var(--m)}
.hc-ban{height:54px;background:var(--l,#1b2540) center/cover no-repeat}
.hc-top{display:flex;justify-content:space-between;align-items:flex-end;padding:0 14px;margin-top:-28px}
.hc-top .av{border:3px solid var(--bg,#0a1228);box-sizing:content-box}
.hc-nm,.hc-un,.hc-bio,.hc-loc,.hc-ct,.hc-go{margin:0;padding:0 14px}
.hc-nm{margin-top:8px;font-size:16px;line-height:1.25}.hc-un{display:block}
.hc-bio{margin-top:6px;line-height:1.4;word-break:break-word}.hc-loc{display:block;margin-top:4px}
.hc-ct{margin-top:8px;color:var(--m);font-size:13px}.hc-ct b{color:var(--t)}
.hc-go{display:block;margin:10px 0 0;padding:11px 14px;border-top:1px solid var(--b,rgba(128,128,128,.25));color:var(--a);font-weight:600;text-decoration:none}
.hc-act .btn{padding:6px 14px}
/* HP: foto profil tidak memunculkan menu 'simpan gambar/pratinjau tautan' saat ditahan */
a:has(>.av),[data-hc] .av,.av{-webkit-touch-callout:none}
a:has(>.av){-webkit-user-select:none;user-select:none}
.av{-webkit-user-drag:none;user-drag:none}
@media(hover:none){.hcard{box-shadow:0 14px 44px rgba(0,0,0,.6)}.hc-act,.hc-go{pointer-events:none}}
/* v171b: badge + reputasi di kartu profil */
.hc-bd{padding:0 14px;margin-top:8px}.hc-bd .chip{display:inline-flex;align-items:center;gap:4px}.hc-bd .vf{margin:0}
.hcard .xpp{margin:8px 14px 0;padding:8px 10px;background:var(--c,rgba(128,128,128,.12));border-radius:10px}
.hcard{max-height:calc(100vh - 24px);overflow:hidden}
/* v171c: bar progres The Explorer di kartu profil (warna sekarang -> warna tingkat berikutnya) */
.hc-xp{margin:8px 14px 0;padding:9px 11px;background:var(--c,rgba(128,128,128,.12));border-radius:10px}
.hc-xh{display:flex;align-items:center;gap:7px}.hc-xh b{font-size:14px}.hc-xh small{color:var(--m)}.hc-xs{margin-left:auto}
.hc-xbar{height:8px;margin:8px 0 5px;border-radius:99px;background:color-mix(in srgb,var(--c2) 18%,rgba(128,128,128,.25));overflow:hidden}
.hc-xbar i{display:block;height:100%;width:var(--w);min-width:6px;border-radius:99px;background:linear-gradient(90deg,var(--c1),var(--c2))}
.hc-xf{display:flex;justify-content:space-between;gap:8px}.hc-xf small,.hc-xc{font-size:12px;color:var(--m)}.hc-xc{display:block;margin-top:4px}
.hcard .hc-xp .xpb{flex:none}
/* v171d: kartu profil ringkas (hanya identitas, badge, reputasi, Ikuti) */
.hc-ban{height:36px}.hc-top{margin-top:-24px}.hcard{padding-bottom:14px}
/* v171e: progres 0 = bar kosong */
.hc-xbar[aria-valuenow="0"] i{min-width:0}
/* v171f: kartu hanya berisi reward (badge + reputasi) dan tombol Ikuti */
.hcard{padding-top:12px}.hc-bd{margin-top:0}.hc-fo{padding:10px 14px 0}.hc-fo .btn{width:100%;justify-content:center;text-align:center}
/* v171g: reputasi ringkas (ikon + judul kecil + bar pendek, tanpa teks poin) */
.hc-xp{margin:6px 12px 0;padding:7px 9px}
.hc-xh{gap:5px;flex-wrap:nowrap;white-space:nowrap}.hc-xh b{font-size:11px;font-weight:600;color:var(--m)}
.hc-xbar{height:5px;margin:6px 0 0;max-width:120px}
.hc-bd{padding:0 12px}.hc-fo{padding:8px 12px 0}

/* v173: pilihan Teman online | Teman dekat di profil */
.cfseg{display:inline-flex;margin:8px 0 2px;border:1px solid var(--l);border-radius:999px;overflow:hidden}
.cfb{display:inline-flex;align-items:center;gap:4px;padding:5px 13px;border:0;background:none;color:var(--m);font:inherit;font-size:13px;cursor:pointer}
.cfb.on{background:var(--a);color:#fff;font-weight:600;cursor:default;opacity:1}.cfb:not(.on):active{background:var(--c)}

.pf p a{color:inherit}.pf p a:hover{text-decoration:underline}.expg{display:flex;justify-content:space-between;padding:12px 14px}

/* v174: Si Penjelajah - tulisan lebih kecil */
.xpp b{font-size:12px}.xpp small{font-size:11px}.hc-xh b{font-size:10px}
/* v174: Reels desktop - panah atas/bawah di dalam bingkai, di bawah tombol merah; garis transparan berlawanan dengan latar */
.rl-wrap{position:relative}.rl-nav{display:none}
@media(min-width:900px){.rl-nav{display:flex;flex-direction:column;gap:10px;position:absolute;top:12px;right:12px;z-index:5}
.rl-nav button{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;padding:0;border:2px solid #fff;border-radius:50%;background:transparent;color:#fff;cursor:pointer;mix-blend-mode:difference}
.rl-nav button:hover{background:#fff4}.rl-nav button:focus-visible{outline:2px solid #fff;outline-offset:2px}}

/* v175: Bisnis (Pengaturan > Bisnis: Pedagang | Page) */
.biz-sub{position:static;margin:0 0 6px}
.biz-terms{margin:10px 0;padding:10px 14px;border:1px solid var(--l);border-radius:12px;background:var(--c);font-size:13px}.biz-terms h4{margin:0 0 6px;font-size:14px}.biz-terms ol{margin:0;padding-left:20px;display:grid;gap:5px}

/* v179: Page saya di profil */
.pgs{margin:0 14px 10px;border:1px solid var(--l);border-radius:12px;padding:10px 12px}
.pgs-h{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:4px}
.pgs-r{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:6px 0;border-top:1px solid var(--l)}
.pgs-h + .pgs-r{border-top:0}.pgs-n{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--t)}.pgs .mu{margin:4px 0 0}
/* v283: ikon kategori marketplace polos seperti kategori Spot/Jelajah (tile netral berbingkai, tanpa gradasi warna per kategori). Aktif = bingkai dan latar aksen tipis */
.mkic span{font-size:28px;line-height:1;color:inherit;background:var(--c);border:1px solid var(--l);box-shadow:none}
.mkic a:hover span{border-color:var(--a);transform:translateY(-2px);color:inherit}
.mkic a.on span{border-color:var(--a);background:color-mix(in srgb,var(--a) 22%,var(--c));box-shadow:none;transform:none;color:inherit}

/* v223: mode tamu - navigasi atas (desktop), lebar halaman, gerbang masuk */
.gnav{display:none}
@media(min-width:900px){.gnav{display:flex;align-items:center;gap:6px;max-width:1100px;margin:0 auto;padding:8px 16px;box-sizing:border-box}.gnav a{padding:7px 14px;border-radius:999px;font-weight:600;color:var(--m);text-decoration:none}.gnav a:hover{background:var(--c)}.gnav a.on{background:var(--c);color:var(--a)}.gnav form{margin:0 0 0 auto}.gnav input[type=search]{width:220px;max-width:100%;background:var(--c);color:var(--t);border:1px solid var(--l);border-radius:999px;padding:7px 14px;font:inherit}}
body.gv.gvw:not(.rls) main{max-width:1100px}
.gvgate{margin:12px 14px}
.gv-ov{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;padding:16px}
.gv-box{position:relative;width:100%;max-width:360px;background:var(--c);color:var(--t);border:1px solid var(--l);border-radius:18px;padding:22px 18px 18px;text-align:center;box-shadow:0 12px 40px rgba(0,0,0,.35)}
.gv-box p{margin:6px 0 16px;font-weight:600}
.gv-row{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.gv-row .btn{min-width:110px;text-align:center}
.gv-x{position:absolute;top:8px;right:8px;width:32px;height:32px;border:0;border-radius:50%;background:transparent;color:var(--m);font-size:16px;cursor:pointer}

/* v229: 4 tab notifikasi (Media Sosial, Marketplace, Jelajah, Wisata): muat di panel header, geser bila sempit */
.nft{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch}.nft::-webkit-scrollbar{display:none}.nft button{flex:1 0 auto;white-space:nowrap;padding:10px 8px;font-size:13px}.nft em{margin-left:4px}
.tabs.ag4{background:var(--bg)}.tabs.ag4 a{font-weight:600}.tabs.ag4 em{font-style:normal;font-size:11px;font-weight:700;background:var(--a);color:#fff;border-radius:9px;padding:1px 6px;margin-left:4px}
/* v233: kartu iklan di pesan Marketplace, ukuran kecil (inset) */
.bub .mkmc{display:flex;gap:8px;align-items:center;max-width:280px;margin:6px 0;padding:6px;border:1px solid var(--l);border-radius:10px;background:var(--bg);color:inherit;text-decoration:none;overflow:hidden}.bub .mkmc:hover{border-color:var(--a)}.bub .mkmi{flex:none;width:56px;height:56px;border-radius:6px;overflow:hidden;background:var(--c);display:flex;align-items:center;justify-content:center;color:var(--m)}.bub .mkmi img{width:56px;height:56px;max-width:none;max-height:none;object-fit:cover;display:block;margin:0;border-radius:0}.bub .mkmb{min-width:0;flex:1;display:flex;flex-direction:column;gap:1px}.bub .mkmb strong,.bub .mkmb small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bub .mkmb strong{font-size:13px;line-height:1.25}.bub .mkmp{display:block;font-size:13px;color:var(--a)}.bub .mkmb small{font-size:11.5px;color:var(--m)}

/* ===== v227: Modal posting ala Facebook (popup desktop, bottom sheet HP; terpisah dari modal komentar #th-sheet) ===== */
.th-compose{align-items:center}
.pm-open{flex:1;min-width:0;min-height:44px;padding:11px 18px;border:1px solid var(--l);border-radius:999px;background:var(--c);color:var(--m);font:inherit;font-size:16px;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.pm-open:hover{border-color:var(--a)}
.pm-lock{overflow:hidden}
.pm-ov{position:fixed;inset:0;z-index:72;background:#000b;opacity:0;pointer-events:none;transition:opacity .25s}
.pm-ov.open{opacity:1;pointer-events:auto}
.pm-modal{position:fixed;z-index:73;inset:0;margin:auto;width:min(560px,94vw);height:fit-content;max-height:90vh;max-height:90dvh;display:flex;flex-direction:column;background:var(--bg);color:var(--t);border:1px solid var(--l);border-radius:14px;box-shadow:0 18px 50px #000a;visibility:hidden;opacity:0;transition:opacity .2s,visibility 0s .2s}
.pm-modal.open{visibility:visible;opacity:1;transition:opacity .2s;animation:pmIn .22s cubic-bezier(.2,.8,.2,1)}
@keyframes pmIn{from{transform:translateY(14px) scale(.98)}}
.pm-head{position:relative;flex:none;display:flex;align-items:center;justify-content:center;padding:16px 56px;border-bottom:1px solid var(--l);font-size:18px}
.pm-x{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:36px;height:36px;display:grid;place-items:center;border:0;border-radius:50%;background:var(--c);color:var(--t);font-size:16px;line-height:1;cursor:pointer}
.pm-x:hover{background:var(--l)}
.pm-modal form.pm-form{flex:1;min-height:0;display:flex;flex-direction:column;gap:10px;padding:14px 16px 0;border:0;overflow-y:auto;overscroll-behavior:contain}
.pm-au{display:flex;align-items:center;gap:10px;font-size:15px}.pm-au .av{flex:none}
.pm-modal .se-editor{border:0;background:none;border-radius:0;padding:4px 0;font-size:22px;line-height:1.35;min-height:130px;max-height:min(46vh,360px);max-height:min(46dvh,360px)}
.pm-modal .th-tools{order:9;position:sticky;bottom:0;margin-top:auto;flex-wrap:wrap;gap:10px;padding:6px 0 calc(16px + env(safe-area-inset-bottom,0px));background:var(--bg)}
.pm-modal .se-tools{order:1;flex:1 0 100%;gap:4px;padding:6px 10px 6px 14px;border:1px solid var(--l);border-radius:10px;box-shadow:0 1px 3px #0003}
.pm-modal .se-tools::before{content:attr(data-lbl);flex:1;min-width:0;font-weight:600;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pm-modal .se-btn{min-width:38px;height:38px;border-color:transparent;background:none}
.pm-modal .se-btn:hover{border-color:transparent;background:var(--c)}
.pm-modal .se-count{order:2}.pm-modal .se-count:empty{display:none}
.pm-modal .se-editor:focus,.pm-modal .se-editor:focus-visible{outline:0;box-shadow:none}
.pm-modal .th-tools>.btn{order:3;flex:1 0 0;height:42px;padding:0 18px;font-size:15px;font-weight:600;border-radius:8px}
.pm-modal .th-tools>.btn:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:700px){
.pm-modal{inset:auto 0 0 0;margin:0;width:100%;height:auto;max-height:92vh;max-height:92dvh;border:0;border-top:1px solid var(--l);border-radius:20px 20px 0 0;opacity:1;transition:visibility 0s .28s}
.pm-modal.open{transition:none;animation:shUp .28s cubic-bezier(.2,.8,.2,1)}
.pm-head{padding:18px 52px 14px;font-size:17px}
.pm-head::before{content:"";position:absolute;top:7px;left:50%;width:40px;height:4px;margin-left:-20px;border-radius:2px;background:var(--l)}
.pm-modal .se-editor{font-size:18px;min-height:110px;max-height:34vh;max-height:34dvh}
/* panel GIF/polling/menu "…" milik modal posting harus di atas modalnya */
.pm-modal .se-menu,.pm-modal .se-more:not([hidden]){z-index:76}
}

/* v236: kartu profil popup: Ikuti/Mengikuti hanya berupa ikon di pojok kanan bawah (userplus / usercheck -> userminus saat disorot), tanpa tombol berkotak */
.hc-fo{display:flex;justify-content:flex-end;padding:4px 10px 0}
.hc-ic{display:inline-grid;place-items:center;width:36px;height:36px;padding:0;border:0;border-radius:50%;background:none;color:var(--m);cursor:pointer}
.hc-ic.pri{color:var(--a)}
.hc-ic .hcf{display:inline-flex}.hc-ic .ic{display:block}.hc-ic .hcf-off{display:none}
@media(hover:hover){.hc-ic:hover{background:var(--c)}.hc-ic:not(.pri):hover{color:#ef4444}.hc-ic:hover .hcf-on{display:none}.hc-ic:hover .hcf-off{display:inline-flex}}

/* v238: THE EXPLORER (tab ketiga Beranda). Kartu check-in dengan aksi khusus, filter chip, pil drawer 3 kolom */
.dw-pills{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:1fr}   /* v331: Ikuti + Mengikuti selalu memenuhi lebar laci (tanpa kolom kosong) */
.xf-hd{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:14px 16px;border-bottom:1px solid var(--l);background:color-mix(in srgb,var(--a) 7%,transparent)}
.xf-t{display:flex;align-items:center;gap:10px;color:var(--a)}.xf-t strong{color:var(--t);font-size:16px;line-height:1.2}
.xf-go{display:flex;gap:8px}.xf-go .btn{display:inline-flex;align-items:center;gap:5px}
.xf-chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:10px 16px;border-bottom:1px solid var(--l)}.xf-chips::-webkit-scrollbar{display:none}
.xf-chips a{flex:0 0 auto;padding:6px 14px;border:1px solid var(--l);border-radius:999px;color:var(--m);font-size:14px;white-space:nowrap}
.xf-chips a.on{background:var(--a);border-color:var(--a);color:#fff;font-weight:600}
.post.xf .extag{padding:3px 10px;border:1px solid color-mix(in srgb,var(--a) 35%,transparent);border-radius:999px;background:color-mix(in srgb,var(--a) 8%,transparent);font-weight:600}
.ac button.xrec.on,.ac button.xrec:hover{color:var(--a2,var(--a))}.ac .xrec-ro{color:var(--m)}
.ac button.xrec.on svg{fill:currentColor;fill-opacity:.18}
.ac a.xrt{color:var(--a)}.ac a.xrt:hover{color:var(--t)}
.ac .sv.on{color:var(--a)}
@media(max-width:480px){.ac a.xrt span{display:none}}
/* v238: daftar 'terdekat' di dalam tab Penjelajah */
.xf-go .btn.on{background:var(--a);border-color:var(--a);color:#fff}
#xf-near[hidden],#tl[hidden],#more[hidden]{display:none!important}
.xdist{display:inline-flex;align-items:center;gap:3px;margin-left:auto;color:var(--a);font-size:13px;font-weight:600;white-space:nowrap}
.xf-ns{height:1px}
/* v238: daftar tempat terdekat (Wisata/Jelajah) di tab Penjelajah, Rute di sebelah jarak */
.xf-h{margin:0;padding:12px 16px 6px;font-size:15px}
.xf-pl{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid var(--l)}
.xf-pm{display:flex;align-items:center;gap:12px;flex:1;min-width:0;color:var(--t)}.xf-pm:hover .xf-pn strong{text-decoration:underline}
.xf-pi{display:grid;place-items:center;flex:0 0 40px;height:40px;border-radius:50%;background:color-mix(in srgb,var(--a) 10%,transparent);color:var(--a)}
.xf-pn{flex:1;min-width:0}.xf-pn strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.xf-pn small{display:block;color:var(--m);font-size:13px}
.xf-pl em{font-style:normal;color:var(--a);font-weight:600;font-size:14px;white-space:nowrap}
.xf-rt{display:inline-flex;align-items:center;gap:4px;padding:5px 10px;border:1px solid var(--l);border-radius:999px;color:var(--a);font-size:13px;font-weight:600;white-space:nowrap}.xf-rt:hover{background:var(--c)}
@media(max-width:420px){.xf-rt span{display:none}}

/* v239: pemutar YouTube di feed */
.yt{position:relative;margin-top:6px;border-radius:12px;overflow:hidden;background:#000;aspect-ratio:16/9;max-width:100%}
.yt.yt-v{aspect-ratio:9/16;max-width:280px;max-height:480px}
.yt-play{display:block;position:relative;width:100%;height:100%;padding:0;border:0;background:#000;cursor:pointer}
.yt-play img{display:block;width:100%;height:100%;object-fit:cover}
.yt-btn{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;transition:transform .15s}.yt-play:hover .yt-btn{transform:scale(1.08)}
.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.yt-src{position:absolute;left:8px;bottom:8px;padding:3px 9px;border-radius:999px;background:#000b;color:#fff;font-size:12px}.yt.on .yt-src{display:none}

/* v240: lencana check-in baru di tab Penjelajah */
.tabs.feedtabs a,.dw-pills a{position:relative}
.xf-bd{display:inline-grid;place-items:center;min-width:18px;height:18px;margin-left:6px;padding:0 5px;border-radius:9px;background:#ef4444;color:#fff;font-size:11px;font-weight:700;line-height:1}
.dw-pills a .xf-bd{position:absolute;top:6px;right:10px;margin:0}

/* v245: tamu memakai kerangka yang sama dengan pengguna masuk (sidebar kiri + menu); tanpa kolom kanan */
body.gs .lside .sl.so{margin-top:auto}
body.gs .hdr .hr{gap:6px}body.gs .hdr .btn.gl{padding:6px 14px;font-size:14px;white-space:nowrap;border-radius:999px}
@media(max-width:700px){body.gs .hdr .gl:not(.pri){display:none}body.gs .hdr .gl.pri{padding:6px 12px}}
@media(max-width:420px){body.gs .hdr .gl{display:none}}
body.gs .rside .rjn{margin:4px 0 10px;color:var(--m);font-size:14px}
body.gs .rside .gv-row{justify-content:flex-start}

/* v254: tombol Explore (Peta) di baki Cerita, hanya HP; desktop memakai kartu Peta di sidebar kanan */
.st-ex{text-decoration:none}
.st-ex .st-ring{background:linear-gradient(135deg,#06b6d4,#f59e0b)}
.st-ex .st-ring::before{display:none}
.st-exc{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:#0b1630;overflow:hidden}
@media(min-width:900px){.st-ex{display:none}}

/* v260: karakter penjelajah (pria) = sprite sheet 9 frame (8 jalan + 1 diam), tiap frame rasio 1:2. Dipakai tombol Explore (baki Cerita) dan penanda posisi di Peta (map.css). */
.xsp{--h:50px;--w:calc(var(--h)*.5);display:block;width:var(--w);height:var(--h);background:url(char/explorer-pria/explorer-pria-sheet.png) 0 0/calc(var(--w)*9) 100% no-repeat;animation:xsp-walk .9s steps(8) infinite}
.xsp.f{background-image:url(char/explorer-wanita/explorer-wanita-sheet.png)}   /* v261: karakter wanita (akun jenis kelamin Wanita) */
.xsp.idle{animation:none;background-position:calc(var(--w)*-8) 0}
.xbob{display:block;animation:xsp-bob .45s ease-in-out infinite}
.xfl{display:block}
@keyframes xsp-walk{from{background-position:0 0}to{background-position:calc(var(--w)*-8) 0}}
@keyframes xsp-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@media(prefers-reduced-motion:reduce){.xsp{animation:none}.xbob{animation:none}}
.st-exc .xsp{--h:50px}

/* v261: pilihan jenis kelamin (Daftar + Pengaturan > Profil): dua kartu bergambar karakter penjelajah, nilai tersimpan di users.gender */
.sp-gd{border:0;margin:4px 0 6px;padding:0;min-width:0}
.sp-gd legend{padding:0 0 6px;font-size:14px;color:var(--m)}
.sp-gd-r{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sp-gd-o{position:relative;display:block;cursor:pointer;margin:0}
.sp-gd-o input{position:absolute;opacity:0;width:1px;height:1px;margin:0;padding:0;pointer-events:none}
.sp-gd-c{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 8px 8px;border-radius:14px;border:1px solid var(--l);background:var(--bg);color:var(--t);transition:border-color .15s,box-shadow .15s,background .15s}
.sp-gd-c img{display:block;height:74px;width:auto;object-fit:contain}
.sp-gd-c b{font-size:14px;font-weight:700}
.sp-gd-o:hover .sp-gd-c{border-color:var(--a)}
.sp-gd-o input:checked+.sp-gd-c{border-color:var(--a);box-shadow:0 0 0 3px #3b82f633;background:var(--c)}
.sp-gd-o input:focus-visible+.sp-gd-c{outline:2px solid var(--a);outline-offset:2px}
@media(prefers-reduced-motion:reduce){.sp-gd-c{transition:none}}


/* v262: lokasi bertingkat di form Daftar */
.sp-lb{display:block;margin:4px 0 -4px;font-size:14px;color:var(--m)}
.sp-card .loc-box{display:grid;gap:8px}
.sp-card .loc-box select{width:100%;box-sizing:border-box;padding:12px 14px;border-radius:14px;border:1px solid var(--l);background:var(--bg);color:var(--t);font:inherit}
.sp-card .loc-box select:focus{outline:0;border-color:var(--a);box-shadow:0 0 0 4px #3b82f624}

/* v264: Impor CSV Wisata (Admin) */
.exi-w{overflow-x:auto;margin:0 14px 12px}
.exi-t{width:100%;border-collapse:collapse;font-size:13px}
.exi-t th,.exi-t td{padding:6px 8px;border-bottom:1px solid var(--l);text-align:left;vertical-align:top}
.exi-t th{color:var(--m);font-weight:600;white-space:nowrap}
.exi-n{color:#16a34a}.exi-d{color:#d97706}.exi-e{color:#dc2626}
.exi-help ul{margin:6px 0 0;padding-left:18px;display:grid;gap:4px}

/* ===== v267: jendela chat mengambang (desktop) ===== */
.cw-dock{position:fixed;right:16px;bottom:0;z-index:60;display:flex;flex-direction:row-reverse;align-items:flex-end;gap:10px;pointer-events:none}
.cw-dock[hidden]{display:none}
.cw{pointer-events:auto;width:328px;height:440px;display:flex;flex-direction:column;background:var(--bg);color:var(--t);border:1px solid var(--l);border-bottom:0;border-radius:12px 12px 0 0;box-shadow:0 4px 22px rgba(10,26,63,.22);overflow:hidden}
.cw.min{height:auto}.cw.min .cw-b,.cw.min .cw-f,.cw.min .cw-n{display:none}
.cw-h{display:flex;align-items:center;gap:8px;padding:8px 8px 8px 10px;border-bottom:1px solid var(--l);cursor:pointer;background:var(--bg)}
.cw.min .cw-h{border-bottom:0}.cw.new .cw-h{background:var(--me)}.cw.new .cw-t::after{content:"";display:inline-block;width:8px;height:8px;margin-left:6px;border-radius:50%;background:#e0245e}
.cw-av{display:inline-flex;flex:none}.cw-av .av{border-radius:50%;object-fit:cover}
.cw-t{flex:1;min-width:0;font-size:14px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cw-i{border:0;background:none;color:var(--m);width:28px;height:28px;border-radius:50%;cursor:pointer;font-size:15px;line-height:28px;text-align:center;text-decoration:none;padding:0}
.cw-i:hover{background:var(--c);color:var(--t)}
.cw-b{flex:1;display:flex;flex-direction:column;gap:6px;padding:10px;overflow-y:auto;min-height:0}
.cw-b .bub{max-width:84%;font-size:13.5px}.cw-b .bub img,.cw-b .bub video{max-width:100%;border-radius:8px}
.cw-emp{margin:auto;color:var(--m);font-size:13px;text-align:center}
.cw-n{padding:10px 12px;font-size:12.5px;color:var(--m);border-top:1px solid var(--l);background:var(--c)}
.cw-f{display:flex;align-items:flex-end;gap:6px;padding:8px;border-top:1px solid var(--l)}
.cw-f[hidden],.cw-n[hidden]{display:none}
.cw-f textarea{flex:1;min-width:0;resize:none;max-height:84px;padding:7px 10px;border:1px solid var(--l);border-radius:16px;background:var(--c);color:var(--t);font:inherit;font-size:13.5px}
.cw-a{cursor:pointer;width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;font-size:15px}
.cw-a:hover,.cw-a.has{background:var(--me)}
.cw-s{border:0;background:var(--a);color:var(--bg);border-radius:16px;padding:7px 12px;font-size:13px;font-weight:600;cursor:pointer}
.cw-f.busy{opacity:.6;pointer-events:none}
@media(max-width:899px){.cw-dock{display:none}}
@media(max-height:520px){.cw{height:calc(100vh - 80px)}}

/* v268: toast aksi tanpa muat ulang */
#st-toast{position:fixed;left:50%;bottom:calc(76px + env(safe-area-inset-bottom,0px));transform:translate(-50%,12px);max-width:86vw;padding:9px 16px;border-radius:999px;background:var(--a);color:#fff;font-size:14px;z-index:9999;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}#st-toast.show{opacity:1;transform:translate(-50%,0)}#st-toast.err{background:#b3261e}form.busy{opacity:.6;pointer-events:none}

/* v270: baki Cerita menampilkan isi cerita (gambar / cuplikan video / teks), bukan foto profil */
.st-th{display:block;width:54px;height:54px;border-radius:50%;overflow:hidden;border:2px solid var(--bg);box-sizing:border-box;background:var(--c);position:relative}
.st-th img,.st-th video{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.st-th.st-tx{display:grid;place-items:center;padding:4px;color:#fff;text-align:center}
.st-th.st-tx>span{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;font:700 8px/1.15 system-ui,sans-serif;word-break:break-word}

/* v271: perbaikan — warna latar cerita teks di baki. .st-th (background:var(--c)) ada di bawah .bgN sehingga menimpanya; naikkan spesifisitas agar warna pilihan pengguna tampil. */
.st-th.st-tx.bg0{background:linear-gradient(135deg,#1d4ed8,#60a5fa)}
.st-th.st-tx.bg1{background:linear-gradient(135deg,#d97706,#fbbf24)}
.st-th.st-tx.bg2{background:linear-gradient(135deg,#6d28d9,#a78bfa)}
.st-th.st-tx.bg3{background:linear-gradient(135deg,#047857,#34d399)}
.st-th.st-tx.bg4{background:linear-gradient(135deg,#be123c,#fb7185)}
.st-th.st-tx.bg5{background:linear-gradient(135deg,#0e7490,#22d3ee)}
.st-th.st-tx.bg6{background:linear-gradient(135deg,#0f172a,#475569)}
.st-th.st-tx.bg7{background:linear-gradient(135deg,#c2410c,#fb923c)}

/* v271: Ikuti dari Saran akun (AJAX): spinner proses, status "Mengikuti", lalu baris/kartu menghilang */
.sg-busy{pointer-events:none}
.sg-sp{display:inline-block;width:14px;height:14px;box-sizing:border-box;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:sg-spin .7s linear infinite;vertical-align:-3px}
@keyframes sg-spin{to{transform:rotate(360deg)}}
.btn.pri.sg-done,[data-theme=dark] .btn.pri.sg-done{background:var(--c);color:var(--t);box-shadow:none;pointer-events:none}
.sg-row.sg-out{opacity:0;max-height:0!important;padding-top:0;padding-bottom:0;border-bottom-width:0;overflow:hidden;transition:max-height .35s ease,opacity .25s ease,padding .35s ease}
.sg-card.sg-out{opacity:0;transform:scale(.9);width:0!important;min-width:0;padding-left:0;padding-right:0;margin-right:-10px;border-width:0;overflow:hidden;transition:width .35s ease,opacity .25s ease,transform .25s ease,padding .35s ease,margin .35s ease}
@media(prefers-reduced-motion:reduce){.sg-sp{animation-duration:1.6s}.sg-row.sg-out,.sg-card.sg-out{transition:none}}

/* v299: sidebar desktop - Admin, Pengaturan, Keluar menempel di dasar */
.lside .lbot{display:flex;flex-direction:column;gap:4px;margin-top:auto;padding-top:10px;flex:none}
.lside .lbot form.so{margin:0;padding-top:0}

/* v299: pemilih bahasa 1 bendera + menu tarik-turun */
.lsw{display:block;padding:0;gap:0;height:auto;border-radius:20px}
.lsw>summary{list-style:none;display:flex;align-items:center;justify-content:center;height:36px;min-width:44px;padding:0 10px;cursor:pointer;border-radius:20px;-webkit-tap-highlight-color:transparent}
.lsw>summary::-webkit-details-marker{display:none}
.lsw .lflag{display:block;width:24px;height:16px;border-radius:3px;box-shadow:0 0 0 1px rgba(0,0,0,.18);flex:none}
.lsw .lflag-t{display:flex;align-items:center;justify-content:center;font:700 11px/16px system-ui;box-shadow:none;width:auto}
.lsw-m{position:absolute;top:calc(100% + 6px);right:0;min-width:150px;background:var(--bg);border:1px solid var(--l);border-radius:14px;box-shadow:0 8px 28px rgba(0,0,0,.18);padding:4px;z-index:70;display:flex;flex-direction:column}
.lsw .lsw-m a{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:10px;font-size:14px;font-weight:600;color:var(--t);white-space:nowrap}
.lsw .lsw-m a:hover{background:var(--c)}
.hdr .lsw.lsw,.sp-prefs .lsw.lsw{position:relative;top:auto;right:auto;left:auto;height:auto;flex:none}
.hdr .lsw>summary,.sp-prefs .lsw>summary{height:32px;min-width:40px;padding:0 8px}

/* v302: Admin > Cache */
.cc-row{cursor:pointer}.cc-row .cc-l{display:block;min-width:0}.cc-row input[type=checkbox]{width:auto;margin:0 6px 0 0;accent-color:var(--a);vertical-align:-2px}.cc-row small{margin-left:24px}.cc-btns{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 6px}.cc-btns .btn{width:auto}

/* v306: tombol unduh APK (sidebar kiri & laci): logo Android dalam kotak + "loekepo CONNECT" */

/* v310: logo huruf "LC" (dua huruf) di header / halaman publik; logo unggahan admin (has-img) tidak berubah */
.hdr .logo:not(.has-img),.pbrand .logo:not(.has-img){font-size:15px;letter-spacing:-.03em}

/* v312: tombol unduh aplikasi di sidebar/laci - baris menu biasa, ikon garis monokrom (tanpa kotak hijau/logo kartun); pemisah tipis di atas grup bawah sidebar */
.apkbtn{display:flex;align-items:center;gap:14px;padding:11px 14px;border-radius:12px;font-size:15.5px;font-weight:500;line-height:1.2;color:var(--m);text-decoration:none;transition:background .15s,color .15s}
.apkbtn:hover{background:var(--c);color:var(--t)}
.apkbtn .apk-ic{flex:none;display:flex;align-items:center;justify-content:center;width:28px;color:inherit}
.apkbtn em{font-style:normal;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lside .lbot{border-top:1px solid var(--l);margin-top:auto;padding-top:8px}
.dw-card .apkbtn{width:100%;box-sizing:border-box;min-height:62px;margin:0;padding:0 22px;border:0;border-top:1px solid var(--l);border-radius:0;background:none;font-size:18px;font-weight:600;color:var(--t);justify-content:space-between}
.dw-card .apkbtn:hover{background:none}
.dw-card .apkbtn em{order:0;flex:1;text-align:left}
.dw-card .apkbtn .apk-ic{order:1;width:auto;color:var(--m)}
.dw-card>.apkbtn:first-child{border-top:0}

/* v316: tombol mata password (global; splash.css punya salinan sendiri) */
.pw-w{position:relative;display:block}
.pw-w input{padding-right:46px;width:100%;box-sizing:border-box}
.pw-w input::-ms-reveal,.pw-w input::-ms-clear{display:none}
.pw-t{position:absolute;right:5px;top:50%;transform:translateY(-50%);width:38px;height:38px;border:0;border-radius:50%;background:transparent;color:var(--m,#6b7280);cursor:pointer;display:grid;place-items:center;padding:0}
.pw-t:hover,.pw-t[aria-pressed=true]{color:var(--a,#3b82f6)}

/* v336 */
.mkadd1{display:inline-block;margin:6px 0;cursor:pointer}