:root{
  --bg:#0b0b0c; --bg2:#111113; --panel:#161618; --panel2:#1e1e21; --line:#27272b; --line2:#36363c;
  --text:#f2f0ec; --muted:#9a989f; --dim:#6f6d75;
  --glow:#ffb35c; --glow2:#ff7a59; --ink:#1a0f04; --danger:#ff7468; --ok:#6fd49a;
  --r:18px; --r-sm:12px;
  --logo-l:#ff8b4a; --logo-t:#f3ece2; --logo-a:#ffa24f;
  --sans: ui-sans-serif,-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --display: ui-sans-serif,-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font:16px/1.5 var(--sans);-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased}
body{min-height:100vh;overflow-x:hidden;background:radial-gradient(1200px 600px at 85% -10%,rgba(255,150,70,.09),transparent 60%),var(--bg)}
a{color:var(--glow);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;display:block}
:focus-visible{outline:2px solid var(--glow);outline-offset:2px;border-radius:8px}
button,input,textarea,select{font:inherit;color:inherit}
.ico{width:1.05em;height:1.05em;flex:none;vertical-align:-.15em}
.muted{color:var(--muted)} .small{font-size:.86rem} .center{text-align:center}

/* top bar */
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:12px 20px;padding-top:max(12px,env(safe-area-inset-top));background:rgba(11,11,12,.8);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid rgba(255,255,255,.06)}
.brand{display:flex;align-items:center;gap:10px;color:var(--text);min-width:0}
.brand:hover{text-decoration:none}
.brand-mark{width:24px;height:24px;border-radius:50%;flex:none;background:radial-gradient(circle at 50% 50%,#fff3df 0 18%,var(--glow) 34%,var(--glow2) 62%,transparent 64%);box-shadow:0 0 18px rgba(255,160,80,.55)}
.brand-name{font-family:var(--display);font-weight:700;font-size:1.3rem;letter-spacing:-.02em;white-space:nowrap}
/* logo (round 8 wordmark); the name stays for screen readers and for app.js */
.brand .brand-name{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.brand-logo{display:block;height:30px;width:auto;flex:none;overflow:visible}
.brand-logo .lg-l{fill:var(--logo-l)} .brand-logo .lg-t{fill:var(--logo-t)} .brand-logo .lg-a{fill:var(--logo-a)}
.welcome-logo{height:52px;margin:0 0 18px}
.card-logo{height:34px;margin:0 0 14px}
.nav{display:flex;align-items:center;gap:4px;flex:none}
.nav a{color:var(--muted);padding:8px 11px;border-radius:999px;font-size:.94rem;font-weight:500;position:relative;display:inline-flex;align-items:center}
.nav a:hover{color:var(--text);background:var(--panel);text-decoration:none}
.nav .nav-cta{background:var(--text);color:var(--bg)}
.nav .nav-cta:hover{background:#fff;color:var(--bg)}
.nav .nav-me{padding:4px}
.nav .badge{position:absolute;top:0;right:-2px;background:var(--glow);color:var(--ink);font-size:.68rem;font-weight:800;border-radius:999px;min-width:18px;height:18px;padding:0 5px;display:grid;place-items:center}
.av{--h:30;display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;flex:none;font-size:.82rem;font-weight:700;letter-spacing:.02em;
  color:hsl(var(--h) 60% 88%);background:linear-gradient(140deg,hsl(var(--h) 45% 32%),hsl(calc(var(--h) + 40) 45% 20%))}
.av.sm{width:30px;height:30px;font-size:.72rem}

main{max-width:1180px;margin:0 auto;padding:26px 20px 90px;outline:none}
.loading{color:var(--muted);padding:70px 0;text-align:center}
h1,h2,h3{font-family:var(--display);font-weight:700;letter-spacing:-.025em;margin:0 0 .35em;line-height:1.12}
h1{font-size:clamp(1.75rem,4.6vw,2.6rem)}
.kicker{font-size:.76rem;text-transform:uppercase;letter-spacing:.16em;color:var(--glow);font-weight:600;margin-bottom:8px}
.lede{font-size:1.08rem;color:#c9c6cf;max-width:34em}
.lede-sm{margin:.2em 0 0;max-width:42em}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line2);background:var(--panel2);color:var(--text);
  padding:11px 18px;border-radius:999px;cursor:pointer;font-weight:600;font-size:.95rem;min-height:44px;text-decoration:none;white-space:nowrap}
.btn:hover{border-color:#4a4a52;text-decoration:none}
.btn.primary{background:linear-gradient(135deg,#ffc477,var(--glow) 45%,var(--glow2));color:var(--ink);border-color:transparent;box-shadow:0 6px 22px -8px rgba(255,140,60,.6)}
.btn.primary:hover{filter:brightness(1.05)}
.btn.danger{color:var(--danger);border-color:#4b2623;background:transparent}
.btn.ghost{background:transparent}
.btn.sm{padding:7px 13px;min-height:36px;font-size:.86rem}
.btn.wide{width:100%;margin-top:6px}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.linkbtn{background:none;border:0;color:var(--muted);cursor:pointer;font-size:.84rem;padding:4px 6px;border-radius:8px}
.linkbtn:hover{color:var(--text)}
.linkbtn.del:hover{color:var(--danger)}

.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:22px}
.notice{background:linear-gradient(135deg,rgba(255,170,80,.12),rgba(255,120,80,.06));border:1px solid rgba(255,170,80,.28);color:#f6e2c4;border-radius:var(--r-sm);padding:13px 15px;margin:0 0 22px;font-size:.93rem}
.notice.info{background:#121820;border-color:#243446;color:#cfe0f2;margin-top:20px}
.empty{text-align:center;padding:56px 20px;color:var(--muted);border:1px dashed var(--line2);border-radius:var(--r)}

/* forms */
label{display:block;font-size:.85rem;color:var(--muted);margin:16px 0 6px;font-weight:500}
input[type=text],input[type=email],input[type=password],textarea{width:100%;background:var(--bg2);border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;font-size:16px;color:var(--text);transition:border-color .15s}
textarea{min-height:110px;resize:vertical}
input:focus,textarea:focus{border-color:var(--glow);outline:none}
.hint{font-size:.82rem;color:var(--dim);margin:6px 0 0}
.form-actions{margin-top:20px;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.error{color:var(--danger);font-size:.9rem;margin-top:10px;min-height:1.2em}
.form{max-width:760px}

/* welcome */
.welcome{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center;min-height:calc(100vh - 180px)}
.welcome h1{font-size:clamp(2.2rem,6vw,3.8rem);letter-spacing:-.035em}
.glow{background:linear-gradient(90deg,#ffd29a,var(--glow),var(--glow2));-webkit-background-clip:text;background-clip:text;color:transparent}
.steps{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:12px;counter-reset:s}
.steps li{counter-increment:s;display:grid;grid-template-columns:34px 1fr;column-gap:12px;align-items:start}
.steps li::before{content:counter(s);grid-row:span 2;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:.85rem;color:var(--glow);border:1px solid rgba(255,170,80,.4)}
.steps b{font-weight:600}
.steps span{color:var(--muted);font-size:.93rem}
.auth{width:100%;max-width:440px;justify-self:end}
.auth.narrow{margin:6vh auto 0;justify-self:auto}
.tabs{display:flex;background:var(--bg2);border:1px solid var(--line);border-radius:999px;padding:4px;margin:0 0 6px}
.tabs button{flex:1;border:0;background:none;padding:9px 14px;border-radius:999px;color:var(--muted);cursor:pointer;font-weight:600;font-size:.93rem}
.tabs button[aria-selected="true"]{background:var(--panel2);color:var(--text);box-shadow:0 1px 0 rgba(255,255,255,.05) inset}
.tabs.inline{display:inline-flex;margin-bottom:22px}

/* page head & crumbs */
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.crumbs{display:flex;gap:8px;align-items:center;font-size:.88rem;color:var(--dim);margin-bottom:14px;flex-wrap:wrap}
.crumbs a{color:var(--muted)}
.section{margin-bottom:36px}
.section-title{font-size:1.02rem;font-weight:600;color:var(--muted);letter-spacing:0;text-transform:none;margin:30px 0 14px;display:flex;align-items:center;gap:10px}
.section-title::after{content:"";flex:1;height:1px;background:var(--line)}

/* spaces */
.spaces{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.space{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;color:var(--text);transition:transform .18s,border-color .18s,box-shadow .18s}
.space:hover{text-decoration:none;transform:translateY(-3px);border-color:var(--line2);box-shadow:0 18px 40px -20px rgba(0,0,0,.8)}
.mosaic{aspect-ratio:16/9;display:grid;gap:2px;background:#0d0d0f;overflow:hidden}
.mosaic img{width:100%;height:100%;object-fit:cover}
.mosaic.n2{grid-template-columns:1fr 1fr}
.mosaic.n3{grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr}
.mosaic.n3 img:first-child{grid-row:span 2}
.mosaic.empty{aspect-ratio:16/6;place-items:center;color:var(--dim);font-size:1.8rem;background:radial-gradient(circle at 30% 20%,rgba(255,170,80,.10),transparent 60%),#121214}
.mosaic.locked{aspect-ratio:16/7;place-items:center;background:radial-gradient(circle at 70% 30%,rgba(255,150,70,.16),transparent 55%),repeating-linear-gradient(135deg,#121214 0 16px,#151518 16px 32px)}
.lockmark{display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--glow);font-size:1.6rem}
.lockmark em{font-style:normal;font-size:.8rem;color:#e9cfae;letter-spacing:.04em}
.space-meta{padding:14px 16px 16px}
.space-name{font-weight:700;font-size:1.08rem;letter-spacing:-.01em;display:flex;align-items:center;gap:7px}
.lock-badge{color:var(--glow);display:inline-flex}
.lock-badge.lg{font-size:.8em;margin-right:8px}
.space-desc{color:var(--muted);font-size:.9rem;margin-top:3px}
.space-stats{color:var(--dim);font-size:.8rem;margin-top:10px}
.space-last{color:var(--muted);font-size:.84rem;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.space-last b{color:var(--text);font-weight:600}
.locked-page{max-width:520px;margin:6vh auto;text-align:center;padding:36px 26px}
.lock-big{font-size:2.4rem;color:var(--glow);margin-bottom:10px}

/* post grid in a space */
.posts-grid{columns:3 280px;column-gap:16px}
.pcard{break-inside:avoid;display:block;margin:0 0 16px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;color:var(--text);transition:border-color .15s,transform .15s}
.pcard:hover{text-decoration:none;border-color:var(--line2);transform:translateY(-2px)}
.pimg{position:relative;background:#0d0d0f}
.pimg img{width:100%;height:auto;max-height:520px;object-fit:cover}
.pimg.text{padding:26px 20px;font-size:1.15rem;font-weight:600;letter-spacing:-.01em;color:#ddd8d0;background:radial-gradient(circle at 20% 0,rgba(255,170,80,.12),transparent 60%),#141416}
.chip{position:absolute;top:10px;right:10px;display:inline-flex;align-items:center;gap:5px;font-size:.76rem;font-weight:600;padding:4px 9px;border-radius:999px;background:rgba(0,0,0,.6);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.14)}
.pmeta{padding:12px 14px 14px}
.ptitle{font-weight:650;line-height:1.3;overflow-wrap:anywhere}
.psub{color:var(--dim);font-size:.82rem;margin-top:3px}
.pin{color:var(--glow);margin-right:6px;display:inline-flex}

/* new post */
.drop{display:flex;flex-direction:column;align-items:center;gap:4px;border:1.5px dashed var(--line2);border-radius:var(--r);padding:28px 18px;text-align:center;color:var(--muted);cursor:pointer;margin:0;font-size:.95rem;transition:border-color .15s,background .15s}
.drop:hover{border-color:var(--glow);background:rgba(255,170,80,.04)}
.drop .ico{font-size:1.8rem;color:var(--glow)}
.drop b{color:var(--text)}
.drop span{font-size:.82rem;color:var(--dim)}
.file-btn{position:relative;overflow:hidden}
.file-btn input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.thumbs{display:flex;gap:8px;flex-wrap:wrap}
.picker.has .thumbs{margin-top:12px}
.thumbs .t{position:relative;width:78px;height:78px;border-radius:10px;overflow:hidden;background:#000}
.thumbs .t img{width:100%;height:100%;object-fit:cover}
.thumbs .t button{position:absolute;top:3px;right:3px;width:24px;height:24px;border-radius:50%;border:0;background:rgba(0,0,0,.75);color:#fff;cursor:pointer;line-height:24px;padding:0;font-size:16px}
.progress{height:4px;background:var(--panel2);border-radius:4px;overflow:hidden;margin-top:12px}
.progress>div{height:100%;width:0;background:linear-gradient(90deg,var(--glow),var(--glow2));transition:width .2s}

/* thread */
.thread-head{margin-bottom:18px}
.thread-head h1{display:flex;align-items:baseline;gap:4px;flex-wrap:wrap;overflow-wrap:anywhere}
.byline{color:var(--muted);font-size:.9rem;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.byline b{color:var(--text);font-weight:600}
.mod-bar{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.photos{display:flex;flex-direction:column;gap:14px;margin:6px 0 0}
.photo{margin:0;background:#070708;border-radius:var(--r);overflow:hidden;border:1px solid var(--line)}
.photo img{width:100%;height:auto;max-height:86vh;object-fit:contain;cursor:zoom-in}
.photo figcaption{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 12px;background:var(--panel);font-size:.84rem;color:var(--dim)}
.photo .fb{color:var(--glow);font-weight:600}
.photos.multi{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin-top:10px}
.photos.multi .photo img{aspect-ratio:1;object-fit:cover;max-height:none}
.photos.multi figcaption{padding:6px 8px}
.msg .photos:not(.multi){margin-top:10px}
.msg .photos:not(.multi) .photo img{max-height:70vh}
.op-body{margin:18px 0 0;font-size:1.04rem;color:#dcd9e0;max-width:46em}
.body-text{white-space:pre-wrap;overflow-wrap:anywhere}
.stream{display:flex;flex-direction:column;gap:12px}
.msg{display:flex;gap:12px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px}
.msg-main{min-width:0;flex:1}
.msg-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:4px}
.msg-head .who{font-weight:650}
.msg-head .when{color:var(--dim);font-size:.82rem}
.msg-head .del{margin-left:auto}
.role{font-size:.66rem;text-transform:uppercase;letter-spacing:.09em;font-weight:700;padding:2px 7px;border-radius:6px;background:var(--panel2);color:var(--muted)}
.role.admin{background:rgba(255,170,80,.14);color:var(--glow)}
.role.new{background:#14202b;color:#98c4ea}
.ref{display:inline-flex;align-items:center;gap:9px;font-size:.82rem;color:var(--glow);margin:2px 0 8px;padding:4px 10px 4px 4px;border-radius:10px;background:rgba(255,170,80,.08)}
.ref img{width:36px;height:36px;object-fit:cover;border-radius:7px}
.composer{margin-top:22px;background:var(--panel);border:1px solid var(--line2);border-radius:var(--r);padding:12px;scroll-margin-bottom:20px}
.composer textarea{min-height:64px}
.composer .row{display:flex;gap:8px;align-items:center;justify-content:space-between;margin-top:6px;flex-wrap:wrap}
.composer .error{margin-top:4px;min-height:0}
.refchip{display:flex;align-items:center;gap:9px;font-size:.86rem;color:var(--glow);margin-bottom:8px;font-weight:600}
.refchip[hidden]{display:none}
.refchip img{width:34px;height:34px;object-fit:cover;border-radius:7px}

/* admin */
.users{display:flex;flex-direction:column;gap:10px}
.urow{display:flex;align-items:center;gap:12px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;flex-wrap:wrap}
.urow .who{min-width:0;flex:1 1 200px}
.urow .who b{display:block;overflow-wrap:anywhere}
.urow .who span{color:var(--dim);font-size:.84rem;overflow-wrap:anywhere}
.acts{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.status{font-size:.66rem;text-transform:uppercase;letter-spacing:.08em;padding:2px 7px;border-radius:6px;margin-left:8px;vertical-align:middle;font-weight:700}
.status.pending{background:rgba(255,170,80,.14);color:var(--glow)}
.status.approved{background:#132619;color:var(--ok)}
.status.declined,.status.blocked{background:#2a1514;color:var(--danger)}
.more{position:relative}
.more summary{list-style:none}
.more summary::-webkit-details-marker{display:none}
.more .menu{position:absolute;right:0;top:calc(100% + 6px);z-index:5;background:var(--panel2);border:1px solid var(--line2);border-radius:var(--r-sm);padding:6px;min-width:220px;box-shadow:0 18px 40px -12px rgba(0,0,0,.8)}
.more .menu button{display:block;width:100%;text-align:left;background:none;border:0;padding:10px 12px;border-radius:8px;cursor:pointer;font-size:.9rem}
.more .menu button:hover{background:var(--panel)}
.more .menu .danger{color:var(--danger)}
.copybox{display:flex;gap:8px;width:100%}
.copybox[hidden]{display:none}
.copybox input{flex:1;font-size:.86rem;min-width:0}
.admsec{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:14px;margin:0 0 16px}
.admsec-head{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.admsec-head input{flex:1 1 200px;font-weight:700}
.admf{display:flex;gap:10px;align-items:center;flex-wrap:wrap;border-top:1px solid var(--line);padding:12px 0}
.admf-fields{flex:1 1 280px;display:grid;gap:6px}
.admf-fields input{padding:9px 12px}
.switch{display:inline-flex;align-items:center;gap:7px;margin:0 6px 0 0;color:var(--text);font-size:.86rem;cursor:pointer}
.switch input{width:18px;height:18px;accent-color:var(--glow)}
.addf{display:flex;gap:8px;border-top:1px solid var(--line);padding-top:12px}
.addf input{padding:9px 12px}
.addc label{margin-top:0}

/* toast + lightbox */
#toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);background:#f6f3ee;color:#111;padding:10px 18px;border-radius:999px;font-size:.92rem;font-weight:500;opacity:0;pointer-events:none;transition:all .25s;z-index:60;max-width:90vw;text-align:center;box-shadow:0 10px 30px rgba(0,0,0,.4)}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
#lightbox{position:fixed;inset:0;background:rgba(0,0,0,.96);z-index:50;display:flex;align-items:center;justify-content:center}
#lightbox[hidden]{display:none}
#lightbox img{max-width:100vw;max-height:100vh;object-fit:contain}
#lightbox .lb-close,#lightbox .lb-nav{position:absolute;background:rgba(255,255,255,.12);border:0;color:#fff;width:46px;height:46px;border-radius:50%;font-size:24px;cursor:pointer;line-height:46px;padding:0}
#lightbox .lb-close{top:max(14px,env(safe-area-inset-top));right:14px}
#lightbox .lb-prev{left:12px;top:calc(50% - 23px)}
#lightbox .lb-next{right:12px;top:calc(50% - 23px)}
#lightbox .lb-count{position:absolute;bottom:max(16px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);color:#ccc;font-size:.86rem}

@media (max-width:860px){
  .welcome{grid-template-columns:1fr;gap:28px;min-height:0}
  .auth{justify-self:stretch;max-width:none}
}
@media (max-width:600px){
  main{padding:18px 14px 90px}
  .top{padding:10px 14px}
  .brand-name{font-size:1.18rem}
  .brand-logo{height:24px}
  .welcome-logo{height:44px;margin-bottom:14px}
  .nav a{padding:7px 9px;font-size:.9rem}
  .spaces{grid-template-columns:1fr;gap:14px}
  .posts-grid{columns:2;column-gap:10px}
  .pcard{margin-bottom:10px;border-radius:14px}
  .pmeta{padding:9px 10px 11px}
  .ptitle{font-size:.92rem}
  .photo{border-radius:12px}
  .photos.opening .photo{margin:0 -14px;border-radius:0;border-left:0;border-right:0}
  .msg{padding:12px;gap:10px}
  .msg .av{width:32px;height:32px;font-size:.72rem}
  .card{padding:18px}
}
@media (max-width:370px){.posts-grid{columns:1}}

.thread-col{max-width:960px;margin:0 auto}

/* ---------- light theme ---------- */
html[data-theme="light"]{
  --bg:#f6f4f0; --bg2:#efece6; --panel:#ffffff; --panel2:#f1eee8; --line:#e4e0d8; --line2:#d3cec4;
  --text:#18171a; --muted:#6c6873; --dim:#9a96a0;
  --glow:#d9701f; --glow2:#e2513a; --ink:#ffffff;
  --logo-l:#f47a3c; --logo-t:#211c22; --logo-a:#f7913f; --danger:#c8352a; --ok:#1f8a4c;
  color-scheme:light;
}
html[data-theme="dark"]{color-scheme:dark}
html[data-theme="light"] body{background:radial-gradient(1200px 600px at 85% -10%,rgba(255,150,70,.12),transparent 60%),var(--bg)}
html[data-theme="light"] .top{background:rgba(246,244,240,.82);border-bottom-color:rgba(0,0,0,.07)}
html[data-theme="light"] .nav .nav-cta:hover{background:#000;color:#fff}
html[data-theme="light"] .lede{color:#4a4750}
html[data-theme="light"] .op-body{color:#2a282e}
html[data-theme="light"] .btn:hover{border-color:#bdb7ac}
html[data-theme="light"] .btn.primary{color:#fff;background:linear-gradient(135deg,#f08a35,var(--glow) 45%,var(--glow2))}
html[data-theme="light"] .btn.danger{border-color:#efc9c4}
html[data-theme="light"] .notice{color:#6b3d0e;background:linear-gradient(135deg,rgba(255,170,80,.18),rgba(255,120,80,.08));border-color:rgba(217,112,31,.35)}
html[data-theme="light"] .notice.info{background:#eaf2fb;border-color:#c8dbef;color:#22415f}
html[data-theme="light"] .glow{background:linear-gradient(90deg,#e48a2f,var(--glow),var(--glow2));-webkit-background-clip:text;background-clip:text}
html[data-theme="light"] .space:hover{box-shadow:0 18px 40px -22px rgba(60,40,20,.35)}
html[data-theme="light"] .mosaic,html[data-theme="light"] .pimg{background:#e9e5de}
html[data-theme="light"] .mosaic.empty{background:radial-gradient(circle at 30% 20%,rgba(255,170,80,.18),transparent 60%),#ece8e1}
html[data-theme="light"] .mosaic.locked{background:radial-gradient(circle at 70% 30%,rgba(255,150,70,.22),transparent 55%),repeating-linear-gradient(135deg,#ebe7e0 0 16px,#e4dfd7 16px 32px)}
html[data-theme="light"] .lockmark em{color:#8a4b12}
html[data-theme="light"] .pimg.text{color:#2d2a30;background:radial-gradient(circle at 20% 0,rgba(255,170,80,.18),transparent 60%),#f3f0ea}
html[data-theme="light"] .photo{background:#e9e5de}
html[data-theme="light"] .role.new{background:#e3eef9;color:#2f6497}
html[data-theme="light"] .status.approved{background:#dff3e6}
html[data-theme="light"] .status.declined,html[data-theme="light"] .status.blocked{background:#f9e1de}
html[data-theme="light"] .more .menu{box-shadow:0 18px 40px -12px rgba(60,40,20,.3)}
html[data-theme="light"] #toast{background:#1b1a1d;color:#fff}
html[data-theme="light"] .tabs button[aria-selected="true"]{box-shadow:0 1px 3px rgba(0,0,0,.08)}

/* theme toggle */
.top-right{display:flex;align-items:center;gap:6px;flex:none}
.theme-btn{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--panel);color:var(--text);display:grid;place-items:center;cursor:pointer;padding:0;flex:none}
.theme-btn:hover{border-color:var(--line2)}
.theme-btn svg{width:18px;height:18px}
.theme-btn .sun{display:none}
html[data-theme="light"] .theme-btn .sun{display:block}
html[data-theme="light"] .theme-btn .moon{display:none}

/* pending banner */
.notice.pending{display:flex;gap:12px;align-items:flex-start}
.notice.pending .dot{width:10px;height:10px;border-radius:50%;background:var(--glow);margin-top:6px;flex:none;box-shadow:0 0 0 4px rgba(255,170,80,.22);animation:pulse 1.8s ease-in-out infinite}
.notice.pending b{display:block;font-size:1rem;margin-bottom:2px}
.notice.pending span{display:block}
@keyframes pulse{50%{box-shadow:0 0 0 8px rgba(255,170,80,0)}}

/* space rules */
.rule{display:flex;flex-direction:column;gap:3px;border-left:3px solid var(--glow);background:var(--panel);border-radius:0 var(--r-sm) var(--r-sm) 0;padding:12px 15px;margin:0 0 18px;font-size:.93rem}
.rule b{font-size:.72rem;text-transform:uppercase;letter-spacing:.14em;color:var(--glow)}
.confirm{display:flex;gap:10px;align-items:flex-start;margin:14px 0 4px;padding:12px 14px;border:1px solid var(--line2);border-radius:var(--r-sm);background:var(--panel2);font-size:.92rem;cursor:pointer;line-height:1.4}
.confirm input{width:20px;height:20px;flex:none;margin:0;accent-color:var(--glow)}
.confirm-wrap .rule{margin:10px 0 0}
.shake{animation:shake .35s}
@keyframes shake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.switch.inner{margin-top:6px;font-size:.85rem}
.admf-fields textarea{min-height:64px}

.howto{margin:6px 0 14px;padding-left:1.3em;font-size:.92rem;line-height:1.5;color:var(--muted)}
.howto li{margin:0 0 8px}
.howto b{color:var(--text)}
.badge-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--glow);vertical-align:middle;margin-left:3px}
.status.verified{background:transparent;color:var(--muted);border:1px solid var(--line2)}
.notice.ok-n{background:rgba(111,212,154,.10);border-color:rgba(111,212,154,.35);color:var(--text)}
select{width:100%;padding:12px 14px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--bg2);color:var(--text);font-size:1rem;margin-bottom:12px}
.mrow .who span{word-break:break-word}


/* ---------- v4: sidebar / drawer ---------- */
.top-left{display:flex;align-items:center;gap:6px;min-width:0}
.menu-btn{display:none;width:40px;height:40px;border-radius:12px;border:0;background:none;color:var(--text);padding:0;place-items:center;cursor:pointer;margin-left:-8px;flex:none}
.menu-btn svg{width:22px;height:22px}
.layout{display:flex;align-items:flex-start;max-width:1440px;margin:0 auto}
.layout main{flex:1;min-width:0;margin:0 auto}
.side{display:none}
body.signed .side{display:block;width:236px;flex:none;position:sticky;top:64px;max-height:calc(100vh - 64px);overflow:auto;padding:22px 6px 30px 16px}
.side-nav{display:flex;flex-direction:column;gap:2px}
.side-nav a{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:12px;color:var(--muted);font-weight:550;font-size:.95rem;line-height:1.25}
.side-nav a:hover{background:var(--panel);color:var(--text);text-decoration:none}
.side-nav a.cur{background:var(--panel2);color:var(--text);box-shadow:inset 3px 0 0 var(--glow)}
.side-nav .ico{width:20px;height:20px}
.side-nav .sname{flex:1;min-width:0;overflow-wrap:anywhere}
.side-nav .scount{font-size:.75rem;color:var(--dim);font-weight:600}
.side-nav .scount.hot{background:var(--glow);color:var(--ink);border-radius:999px;padding:1px 7px}
.side-h{font-size:.7rem;text-transform:uppercase;letter-spacing:.14em;color:var(--dim);font-weight:700;margin:18px 12px 6px}
.sdot{width:20px;height:20px;border-radius:7px;flex:none;display:grid;place-items:center;font-size:.72rem;color:#fff;background:linear-gradient(140deg,hsl(var(--h,30) 55% 48%),hsl(calc(var(--h,30) + 40) 55% 34%))}
.sdot .ico{width:12px;height:12px}
.sdot.plain{background:var(--panel2);color:var(--muted);font-size:.85rem}
.av.xs{width:20px;height:20px;font-size:.55rem}
.scrim{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:39;-webkit-tap-highlight-color:transparent}
.scrim[hidden]{display:none}
@media (max-width:899px){
  body.signed .menu-btn{display:grid}
  body.signed .side{position:fixed;top:0;left:0;bottom:0;max-height:none;height:100%;width:min(290px,84vw);z-index:40;background:var(--bg2);border-right:1px solid var(--line);
    padding:max(18px,env(safe-area-inset-top)) 10px 30px;transform:translateX(-102%);transition:transform .22s ease,visibility 0s .22s;visibility:hidden}
  body.side-open .side{transform:none;visibility:visible;transition:transform .22s ease;box-shadow:20px 0 50px -20px rgba(0,0,0,.6)}
  .side-nav a{padding:12px 12px;font-size:1rem}
}

/* ---------- v4: spaces stack one under another ---------- */
.spaces{grid-template-columns:1fr}
@media (min-width:601px){
  .space{flex-direction:row}
  .space .mosaic{width:clamp(180px,32%,300px);flex:none;aspect-ratio:auto;min-height:150px}
  .space-meta{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center}
}

/* ---------- v4: post list (one post per row) ---------- */
.tlist{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.trow{display:flex;gap:14px;align-items:center;padding:12px 14px;color:var(--text);border-top:1px solid var(--line);transition:background .12s}
.trow:first-child{border-top:0}
.trow:hover{background:var(--panel2);text-decoration:none}
.tthumb{position:relative;width:72px;height:72px;flex:none;border-radius:12px;overflow:hidden;background:#0d0d0f}
.tthumb img{width:100%;height:100%;object-fit:cover}
.tcount{position:absolute;right:4px;bottom:4px;font-size:.66rem;font-weight:700;background:rgba(0,0,0,.65);color:#fff;border-radius:6px;padding:1px 5px}
.tletter{width:100%;height:100%;display:grid;place-items:center;font-size:1.6rem;font-weight:700;color:hsl(var(--h) 70% 88%);background:linear-gradient(140deg,hsl(var(--h) 40% 30%),hsl(calc(var(--h) + 40) 40% 18%))}
.tinfo{min-width:0;flex:1}
.ttitle{font-weight:650;line-height:1.3;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tsub{color:var(--dim);font-size:.82rem;margin-top:3px}
.tsub .b{color:var(--muted);font-weight:600}
.tstats{display:flex;gap:12px;align-items:center;flex-wrap:wrap;color:var(--dim);font-size:.8rem;margin-top:5px}
.tstats>span{display:inline-flex;align-items:center;gap:4px}
.t-rx{gap:3px!important}
.t-rx b{font-weight:600;margin-left:2px;color:var(--muted)}
.t-lock{color:#e5534b}
.t-lock .ico{width:15px;height:15px}
@media (max-width:600px){
  .tlist{border-radius:14px;margin:0 -4px}
  .trow{padding:11px 12px;gap:12px}
  .tthumb{width:64px;height:64px;border-radius:10px}
}

/* ---------- v4: thread header ⋯ menu + lock ---------- */
.th-top{display:flex;align-items:flex-start;gap:10px;justify-content:space-between}
.th-top h1{flex:1;min-width:0;display:flex;align-items:baseline;gap:4px;flex-wrap:wrap;overflow-wrap:anywhere}
.th-more{flex:none;margin-top:4px}
.th-more summary{width:40px;padding:0}
.th-more .menu button{display:flex;align-items:center;gap:10px}
.locked-tag{display:inline-flex;align-items:center;gap:5px;font-size:.78rem;font-weight:700;color:var(--glow);background:rgba(255,170,80,.12);border-radius:999px;padding:3px 10px}
.locked-bar{display:flex;align-items:center;gap:12px;margin-top:22px;padding:14px 16px;border:1px solid var(--line2);border-radius:var(--r);background:var(--panel2);font-size:.93rem}
.locked-bar .lk{width:36px;height:36px;border-radius:50%;flex:none;display:grid;place-items:center;background:rgba(255,170,80,.16);color:var(--glow);font-size:1.05rem}
.locked-bar>div{flex:1;min-width:0}
.locked-bar b{display:block}
.locked-bar span{color:var(--muted);font-size:.86rem}

/* ---------- v4: emoji picker ---------- */
.pop-root{position:relative}
.pop{display:none}
.pop-root.open>.pop{display:grid}
.emo-field input{padding-right:48px}
.emo-field textarea{padding-right:48px}
.emo-btn{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;border:0;background:none;color:var(--muted);cursor:pointer;display:grid;place-items:center;padding:0;font-size:1.25rem}
.emo-field.ta .emo-btn{top:auto;bottom:8px;transform:none}
.emo-btn:hover,.emo-field.open .emo-btn{color:var(--glow);background:rgba(255,170,80,.12)}
.emo-pop{position:absolute;right:0;top:calc(100% + 6px);z-index:30;width:min(300px,calc(100vw - 28px));
  grid-template-columns:repeat(6,1fr);gap:4px;padding:10px;background:var(--panel2);border:1px solid var(--line2);border-radius:16px;box-shadow:0 18px 40px -12px rgba(0,0,0,.8)}
.emo-pop button{border:0;background:none;font-size:1.6rem;line-height:1;padding:8px 0;border-radius:10px;cursor:pointer;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif}
.emo-pop button:hover,.emo-pop button:active{background:var(--panel)}

/* ---------- v4: reactions ---------- */
.rx{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:10px}
.op-rx .rx{margin-top:14px}
.rx-pill{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line2);background:var(--panel2);color:var(--text);border-radius:999px;padding:4px 10px 4px 8px;min-height:32px;font-size:.95rem;cursor:pointer;line-height:1}
.rx-pill .n{font-size:.8rem;font-weight:700;color:var(--muted)}
.rx-pill.on{border-color:var(--glow);background:rgba(255,170,80,.14)}
.rx-pill.on .n{color:var(--glow)}
.rx-add{width:36px;height:32px;border-radius:999px;border:1px dashed var(--line2);background:none;color:var(--muted);display:grid;place-items:center;cursor:pointer;padding:0;font-size:1.1rem}
.rx-add:hover,.rx-more.open .rx-add{color:var(--glow);border-color:var(--glow)}
.rx-pop{position:absolute;left:0;bottom:calc(100% + 6px);z-index:30;grid-auto-flow:column;gap:2px;padding:6px;background:var(--panel2);border:1px solid var(--line2);border-radius:999px;box-shadow:0 12px 30px -10px rgba(0,0,0,.7)}
.rx-pop button{border:0;background:none;font-size:1.5rem;line-height:1;width:42px;height:42px;border-radius:50%;cursor:pointer;padding:0;transition:transform .12s}
.rx-pop button:hover{transform:scale(1.18)}
.rx-pop button.on{background:rgba(255,170,80,.18)}
.rx{position:relative}
.rx .rx-more{position:static}
@media (max-width:420px){.rx-pop button{width:38px;height:38px;font-size:1.35rem}}

/* ---------- v4: member card ---------- */
.who-link{cursor:pointer;border-radius:4px}
.who-link:hover{text-decoration:underline;text-underline-offset:2px}
.msg-head .who-link{font-weight:650}
.byline .who-link.b{color:var(--text);font-weight:600}
.who-av{cursor:pointer;display:inline-flex;border-radius:50%}
.ucard{position:absolute;z-index:55;width:min(310px,calc(100vw - 20px));background:var(--panel);border:1px solid var(--line2);border-radius:18px;padding:16px;box-shadow:0 22px 50px -14px rgba(0,0,0,.85)}
.ucard[hidden]{display:none}
.ucard.profile{position:static;width:auto;max-width:520px;box-shadow:none;margin-bottom:8px}
.uc-load{color:var(--muted);font-size:.9rem;padding:6px}
.uc-top{display:flex;gap:14px;align-items:center}
.av.lg{width:60px;height:60px;font-size:1.15rem}
.uc-id{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.uc-id b{font-size:1.1rem;overflow-wrap:anywhere;line-height:1.2}
.uc-joined{color:var(--dim);font-size:.8rem}
.uc-email{color:var(--muted);font-size:.78rem;overflow-wrap:anywhere}
.uc-stats{display:grid;grid-template-columns:repeat(3,1fr);margin:14px 0 12px;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.uc-stats div{display:flex;flex-direction:column;align-items:center;padding:8px 4px;border-left:1px solid var(--line)}
.uc-stats div:first-child{border-left:0}
.uc-stats b{font-size:1.05rem}
.uc-stats span{font-size:.72rem;color:var(--dim);text-transform:uppercase;letter-spacing:.06em}
.uc-acts{display:flex;gap:8px;flex-wrap:wrap}

/* ---------- v4: light theme bits ---------- */
html[data-theme="light"] .side-nav a.cur{background:#fff}
@media (max-width:899px){html[data-theme="light"] body.signed .side{background:var(--bg)}}
html[data-theme="light"] .scrim{background:rgba(30,20,10,.3)}
html[data-theme="light"] .tthumb{background:#e9e5de}
html[data-theme="light"] .emo-pop,html[data-theme="light"] .rx-pop,html[data-theme="light"] .ucard{box-shadow:0 18px 40px -12px rgba(60,40,20,.3)}
html[data-theme="light"] .emo-pop{background:#fff}
html[data-theme="light"] .rx-pop{background:#fff}
html[data-theme="light"] .t-lock{color:#c8352a}

/* ---------- v5: spaces as plain text rows (no pictures) ---------- */
.srows{display:flex;flex-direction:column;gap:10px}
.srow{--h:30;position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto minmax(0,250px);align-items:center;gap:16px;
  padding:16px 18px;background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden;color:var(--text);transition:background .15s,border-color .15s}
.srow::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,hsl(var(--h) 75% 60%),hsl(calc(var(--h) + 40) 80% 62%))}
.srow:hover{text-decoration:none;background:var(--panel2);border-color:var(--line2)}
.srow-ico{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;font-size:1.25rem;color:hsl(var(--h) 70% 66%);background:hsl(var(--h) 60% 55% / .12);flex:none}
.srow-main{min-width:0}
.srow-name{font-weight:700;font-size:1.08rem;letter-spacing:-.01em;line-height:1.3}
.srow-desc{color:var(--muted);font-size:.88rem;margin-top:2px;line-height:1.4}
.srow-stats{display:flex;gap:18px;text-align:center}
.srow-stats div{display:flex;flex-direction:column;min-width:52px}
.srow-stats b{font-size:1rem;font-weight:700;line-height:1.2}
.srow-stats span{font-size:.72rem;color:var(--dim);letter-spacing:.02em}
.srow-last{display:flex;align-items:center;gap:9px;min-width:0;padding-left:16px;border-left:1px solid var(--line);font-size:.84rem}
.srow-last .av{flex:none}
.srow-last-txt{display:flex;flex-direction:column;min-width:0}
.srow-last-txt b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.srow-last-txt span{color:var(--dim);font-size:.76rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.srow-none{color:var(--dim)}
.srow-locked{color:var(--glow)}
.srow-locked span{color:var(--muted)}
html[data-theme="light"] .srow-ico{color:hsl(var(--h) 60% 40%);background:hsl(var(--h) 70% 50% / .12)}
@media (max-width:900px){
  .srow{grid-template-columns:auto minmax(0,1fr) auto}
  .srow-last{grid-column:2 / -1;padding-left:0;border-left:0;padding-top:10px;border-top:1px solid var(--line)}
}
@media (max-width:600px){
  .srow{grid-template-columns:auto minmax(0,1fr);gap:4px 12px;padding:14px 14px 13px;align-items:start}
  .srow-ico{width:36px;height:36px;font-size:1.1rem;grid-row:span 2}
  .srow-name{font-size:1.02rem}
  .srow-stats{grid-column:2;gap:14px;text-align:left;margin-top:4px}
  .srow-stats div{flex-direction:row;align-items:baseline;gap:4px;min-width:0}
  .srow-stats b{font-size:.86rem}
  .srow-stats span{font-size:.78rem}
  .srow-last{grid-column:2;margin-top:6px;padding-top:9px}
}

/* ---------- v7: New / Hot posts ---------- */
.feedbtns{display:flex;gap:10px;margin:-4px 0 18px;flex-wrap:wrap}
.feedbtns .btn{flex:1 1 0;justify-content:center;min-width:140px}
.feedbtns .ico,.page-head h1 .ico{width:1.05em;height:1.05em;vertical-align:-.12em}
.side-nav a .ico{flex:none}

/* ---------- v7: the admin's own ads ---------- */
.ad{display:block;position:relative;border-radius:var(--r-sm);overflow:hidden;border:1px solid var(--line);background:var(--panel2);line-height:0;isolation:isolate}
.ad img{display:block;width:100%;height:auto;position:relative}
.ad:hover{text-decoration:none;border-color:var(--line2)}
.ad-tag{position:absolute;z-index:2;top:8px;left:8px;line-height:1;font-size:.62rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:3px 6px;border-radius:6px;background:rgba(0,0,0,.55);color:#fff;backdrop-filter:blur(4px)}
.ad-blur{position:absolute;inset:-20px;background-size:cover;background-position:center;filter:blur(18px) saturate(1.1);opacity:.75}
/* v8: tall ad columns in the empty space beside the page (only where that space is really there) */
.adcol{display:none}
.ad-slot{display:none}
@media (min-width:1720px){
  body.signed .adcol.has{display:block;position:fixed;top:64px;bottom:0;z-index:5;width:calc((100% - 1440px) / 2);padding:22px 12px 22px 22px}
  body.signed .adcol.right.has{right:0;padding:22px 22px 22px 12px}
  body.signed .adcol.left.has{left:0}
  .adcol.left .adgrid{margin-left:auto}
  .adgrid{height:100%;max-width:380px;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:14px}
  .adgrid .ad-cell{height:100%;min-height:0;box-shadow:0 16px 36px -22px rgba(0,0,0,.7);transition:transform .18s,border-color .18s}
  .adgrid .ad-cell:hover{transform:translateY(-2px)}
  .adgrid .ad-cell img{width:100%;height:100%;object-fit:cover}
  .adgrid .ad-cell.fit-contain img{object-fit:contain}
  .ad-ph{display:grid;place-items:center;text-align:center;min-height:0;border:1.5px dashed var(--line2);border-radius:var(--r-sm);color:var(--dim);font-size:.78rem;font-weight:600;padding:10px;opacity:.7}
  .ad-ph:hover{opacity:1;text-decoration:none;color:var(--muted)}
}
/* medium and phone screens: a banner in the page flow (under the spaces, and after every 6 posts) */
@media (max-width:1719px){
  body.signed .ad-slot.filled{display:block;margin:18px 0 0}
  body.signed .tlist .ad-slot.filled{margin:0;padding:10px 14px;border-top:1px solid var(--line)}
  .ad-banner img{max-height:180px;object-fit:contain;margin:0 auto}
}
@media (min-width:900px) and (max-width:1719px){
  .ad-banner img{max-height:240px}
}
.ad-admin{display:flex;flex-direction:column;gap:10px}
.ad-arow{display:flex;gap:14px;align-items:flex-start;padding:12px;border:1px solid var(--line);border-radius:var(--r);background:var(--panel)}
.ad-arow img{width:96px;height:96px;object-fit:contain;border-radius:10px;background:var(--panel2);flex:none}
.ad-ainfo{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.ad-ainfo .small{overflow-wrap:anywhere}
.ad-actl{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:6px}
.ad-actl select{width:auto}

/* v8: admin ads map + picker */
.admap{margin:0 0 16px;padding:16px}
.admap-cols{display:grid;grid-template-columns:1fr 1.5fr 1fr;gap:12px;align-items:stretch;max-width:480px;margin:0 auto}
.admap-col{display:flex;flex-direction:column;gap:6px;min-width:0}
.admap-h{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;color:var(--dim);font-weight:700;text-align:center}
.admap-grid{display:grid;grid-template-rows:repeat(3,120px);gap:6px}
.admap-cell{position:relative;display:grid;place-items:center;min-height:0;border-radius:10px;border:1.5px dashed var(--line2);background:none;color:var(--dim);font:inherit;font-size:.74rem;font-weight:600;cursor:pointer;padding:4px;text-align:center}
.admap-cell:hover{color:var(--text);border-color:var(--glow)}
.admap-cell.full{border:1px solid var(--line2);overflow:hidden;cursor:default;background:var(--panel2)}
.admap-cell.full img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.admap-cell.full img.contain{object-fit:contain}
.admap-cell.full span{position:absolute;left:4px;right:4px;bottom:4px;line-height:1.2;font-size:.66rem;color:#fff;background:rgba(0,0,0,.6);border-radius:6px;padding:3px 5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.admap-page{margin-top:22px;border-radius:10px;border:1px solid var(--line);background:repeating-linear-gradient(180deg,var(--panel2) 0 14px,transparent 14px 24px);display:grid;place-items:center;color:var(--dim);font-size:.74rem;font-weight:600;opacity:.8}
.ad-pick{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.ad-pick label{margin-top:12px}
.ad-pick select{width:100%}
.ad-note{color:var(--glow)}
@media (max-width:700px){.ad-pick{grid-template-columns:1fr 1fr}.admap-grid{grid-template-rows:repeat(3,96px)}.admap-cols{grid-template-columns:1fr .8fr 1fr;gap:8px}}
.admap>p{text-align:center;margin:12px 0 0}

/* v9: tells the admin that admin-only things are visible to her alone */
.adminview{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:999px;font-size:.62rem;font-weight:700;letter-spacing:.02em;text-transform:none;line-height:1.5;vertical-align:middle;background:color-mix(in srgb,var(--glow) 22%,transparent);color:var(--glow);border:1px solid color-mix(in srgb,var(--glow) 55%,transparent);white-space:nowrap}
.kicker .adminview{margin-left:8px}


/* ---------- v10: profile photos + feed rows (writing first, then the picture, large) ---------- */
.av.pic{background:var(--panel2);overflow:hidden;padding:0}
.av.pic img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.av.pic.broken{background:linear-gradient(140deg,#3a3540,#211e25)}
.av.xl{width:84px;height:84px;font-size:1.5rem}
.av-edit{display:flex;gap:16px;align-items:center;margin-bottom:14px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.av-edit-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.av-btns{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.ucard.profile .av-btns{margin-top:12px}
/* v11: compact rows (writing on the left, small square photo on the right) */
.trow{align-items:flex-start;gap:12px;padding:11px 14px}
.trow .tinfo{min-width:0;flex:1}
.trow .ttitle{font-size:.98rem;-webkit-line-clamp:2}
.texcerpt{margin-top:2px;color:var(--muted);font-size:.87rem;line-height:1.38;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tmeta{display:flex;align-items:center;gap:6px;margin-top:6px;min-width:0;font-size:.78rem;color:var(--dim)}
.tmeta .who-av{flex:none}
.tmeta .tsub{margin:0;font-size:.78rem;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tmeta .tstats{margin:0 0 0 auto;flex:none;gap:9px;font-size:.78rem}
.tmeta .tstats .ico{width:14px;height:14px}
.trow .tthumb{width:76px;height:76px;margin-top:2px}
.op-body + .photos.opening{margin-top:16px}
.avmodal{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.72);display:flex;align-items:center;justify-content:center;padding:16px}
.avm-card{background:var(--panel);border:1px solid var(--line2);border-radius:18px;padding:20px;width:min(340px,100%);display:flex;flex-direction:column;align-items:center;gap:8px;box-shadow:0 22px 50px -14px rgba(0,0,0,.85)}
.avm-card h3{margin:0;font-size:1.1rem}
.avm-card p{margin:0}
.avm-stage{position:relative;margin:8px 0 4px;border-radius:14px;overflow:hidden;background:#111}
.avm-stage canvas{display:block;touch-action:none;cursor:grab}
.avm-stage canvas:active{cursor:grabbing}
.avm-ring{position:absolute;inset:0;pointer-events:none;border-radius:50%;box-shadow:0 0 0 999px rgba(0,0,0,.55);outline:2px solid rgba(255,255,255,.85);outline-offset:-2px}
.avm-zoom{display:flex;align-items:center;gap:10px;width:100%;color:var(--muted);font-size:1.1rem;margin:0}
.avm-zoom input{flex:1;accent-color:var(--glow)}
.avm-card .error{min-height:0;text-align:center}
.avm-acts{display:flex;gap:10px;justify-content:flex-end;width:100%;margin-top:4px}
html[data-theme="light"] .avm-card{box-shadow:0 18px 40px -12px rgba(60,40,20,.3)}
@media (max-width:600px){
  .trow{padding:10px 12px;gap:10px}
  .trow .tthumb{width:68px;height:68px}
  .tmeta .tforum{display:none}
  .av.xl{width:72px;height:72px}
}


/* ---------- v11: My account tabs, private messages, admin activity ---------- */
.tabs.inline{max-width:100%;flex-wrap:wrap;border-radius:20px}
.tabs.inline button{flex:1 1 auto;white-space:nowrap}
.tab-n{display:inline-block;margin-left:6px;font-size:.72rem;font-weight:700;color:var(--dim);background:var(--panel);border-radius:999px;padding:0 6px;line-height:1.5}
.tab-n.hot{background:var(--glow);color:var(--ink)}
.acc-head{display:flex;align-items:center;gap:16px;margin:0 0 18px}
.acc-head h1{margin:0 0 4px;overflow-wrap:anywhere}
.acc-head .kicker{margin-bottom:4px}
.acc-id{min-width:0}
.tmine{margin-top:10px;padding:8px 11px;border-left:3px solid var(--glow);background:var(--panel2);border-radius:0 10px 10px 0;font-size:.86rem;display:flex;flex-direction:column;gap:2px}
.tmine b{font-weight:650;color:var(--text);font-size:.8rem}
.tmine span{color:var(--muted);overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rrow{display:flex;gap:12px;align-items:flex-start;padding:13px 16px;color:var(--text);border-top:1px solid var(--line)}
.rrow:first-child{border-top:0}
.rrow:hover{background:var(--panel2);text-decoration:none}
.rr-emo{font-size:1.45rem;line-height:1.2;flex:none;min-width:34px;text-align:center}
.rr-main{flex:1;min-width:0}
.rr-title{font-weight:650;overflow-wrap:anywhere}
.rr-sub{display:flex;align-items:center;gap:6px;color:var(--dim);font-size:.82rem;margin-top:3px}
.rr-sub b{color:var(--muted);font-weight:600}
.rr-text{color:var(--muted);font-size:.9rem;margin-top:4px;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rr-img{width:64px;height:64px;border-radius:10px;object-fit:cover;flex:none;background:#0d0d0f}
.nav .nav-msg{padding:8px 9px}
.nav .nav-msg .ico{width:21px;height:21px}
.clist{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.crow{display:flex;align-items:center;gap:12px;padding:12px 16px;color:var(--text);border-top:1px solid var(--line)}
.crow:first-child{border-top:0}
.crow:hover{background:var(--panel2);text-decoration:none}
.crow-main{flex:1;min-width:0}
.crow-top{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.crow-top b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.crow-top span{color:var(--dim);font-size:.78rem;flex:none}
.crow-last{color:var(--muted);font-size:.88rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:2px}
.crow.unread .crow-last{color:var(--text);font-weight:600}
.cbadge{background:var(--glow);color:var(--ink);font-size:.72rem;font-weight:800;border-radius:999px;min-width:20px;height:20px;padding:0 6px;display:grid;place-items:center;flex:none}
.chat-pair{display:flex;flex:none}
.chat-pair .av + .av{margin-left:-10px;box-shadow:0 0 0 2px var(--panel)}
.chat-col{max-width:760px;margin:0 auto}
.chat-head{display:flex;align-items:center;gap:12px;padding:0 0 14px;border-bottom:1px solid var(--line);margin-bottom:14px}
.chat-who{display:flex;flex-direction:column;gap:2px;min-width:0}
.chat-who b{font-size:1.05rem;overflow-wrap:anywhere}
.chat-who .adminview{margin-left:0;align-self:flex-start}
.dm-list{display:flex;flex-direction:column;gap:10px;min-height:120px;padding:4px 0 8px}
.dm-empty{text-align:center;padding:30px 0}
.dm{display:flex;gap:8px;align-items:flex-end;max-width:min(560px,86%)}
.dm.me{align-self:flex-end;flex-direction:row-reverse}
.dm-b{background:var(--panel2);border:1px solid var(--line);border-radius:18px 18px 18px 6px;padding:8px 12px;min-width:0}
.dm.me .dm-b{background:linear-gradient(135deg,var(--glow),var(--glow2));color:var(--ink);border-color:transparent;border-radius:18px 18px 6px 18px}
.dm-t{font-size:.97rem;line-height:1.4}
.dm-who{font-size:.76rem;font-weight:700;color:var(--muted);margin-bottom:2px}
.dm-img{display:block;max-width:100%;width:auto;max-height:340px;height:auto;border-radius:12px;margin:2px 0 4px;cursor:zoom-in;object-fit:cover}
.dm-meta{font-size:.72rem;color:var(--dim);margin-top:3px}
.dm.me .dm-meta{color:rgba(26,15,4,.7);text-align:right}
.dm.me .dm-meta .linkbtn{color:inherit;text-decoration:underline}
.dm-meta .linkbtn{font-size:inherit;padding:0}
.dm-composer{position:sticky;bottom:10px;margin-top:12px;box-shadow:0 10px 30px -12px rgba(0,0,0,.6)}
.dm-composer textarea{min-height:44px;resize:none}
.dm-pv{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.dm-pv img{width:64px;height:64px;object-fit:cover;border-radius:10px}
.dm-pv .linkbtn{font-size:1.2rem;padding:4px 8px}
.dm-note{display:flex;align-items:center;gap:6px;justify-content:center;color:var(--dim);font-size:.8rem;margin:16px 0 6px;text-align:center}
.dm-note .ico{width:14px;height:14px;flex:none}
.agrid{display:grid;grid-template-columns:1fr 1fr;gap:0 26px}
.asec .section-title{margin-top:18px}
.alist{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.arow{display:flex;gap:10px;align-items:flex-start;padding:10px 13px;border-top:1px solid var(--line);font-size:.9rem}
.arow:first-child{border-top:0}
.arow-main{min-width:0;flex:1;overflow-wrap:anywhere;display:flex;flex-direction:column;gap:2px}
.aq{color:var(--muted)}
.aemo{font-size:1.1rem}
.empty.small{padding:22px 14px;font-size:.9rem}
html[data-theme="light"] .dm-composer{box-shadow:0 10px 30px -14px rgba(60,40,20,.35)}
html[data-theme="light"] .rr-img{background:#e9e5de}
@media (max-width:900px){.agrid{grid-template-columns:1fr}}
@media (max-width:600px){
  .acc-head{gap:12px}
  .acc-head h1{font-size:1.45rem}
  .dm{max-width:92%}
  .rrow{padding:12px 13px}
  .crow{padding:12px 13px}
  .nav .nav-msg{padding:7px 7px}
}

@media (max-width:600px){
  .nav a[href="#/"]{display:none}
}
@media (max-width:430px){
  .nav .nav-admin .adminview{display:none}
}

/* v14: Messages as a tab inside My account; 4 account tabs on one line on phones */
.acc-lede{margin:-8px 0 14px}
.acc-chat{margin-bottom:0}
@media (max-width:600px){
  .tabs.inline.acc-tabs{display:flex;width:100%;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;border-radius:999px;padding:3px}
  .tabs.inline.acc-tabs::-webkit-scrollbar{display:none}
  .tabs.inline.acc-tabs button{flex:1 0 auto;padding:8px 9px;font-size:.84rem}
  .acc-tabs .tab-n{margin-left:4px;padding:0 5px}
}
@media (max-width:360px){
  .tabs.inline.acc-tabs button{padding:7px 7px;font-size:.8rem}
}

/* v14: chat panel — fills the screen, messages scroll inside, write box pinned at the bottom */
.chat-panel{display:flex;flex-direction:column;min-height:300px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r)}
.chat-panel .dm-list{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:14px 14px 10px;-webkit-overflow-scrolling:touch}
.chat-panel .dm-list>.dm:first-child{margin-top:auto}
.chat-panel .dm-empty{margin:auto 0}
.chat-panel .dm-composer{position:relative;bottom:auto;flex:none;margin:0;border:0;border-top:1px solid var(--line);border-radius:0 0 var(--r) var(--r);box-shadow:none;background:var(--bg2);padding:10px 12px}
.chat-panel .dm-composer textarea{min-height:44px}
.chat-panel .dm-composer .row{margin-top:6px}
.chat-panel .dm-composer .emo-pop{top:auto;bottom:calc(100% + 6px)}
.chat-panel + .dm-note{margin:8px 0 0;font-size:.74rem}
html[data-theme="light"] .chat-panel .dm-composer{box-shadow:none}
@media (max-width:600px){
  .chat-panel .dm-list{padding:10px 10px 8px}
  .chat-panel .dm-composer{padding:8px 10px}
  .chat-head{padding-bottom:10px;margin-bottom:10px}
}

/* v14: one-row write box like a chat app — [Photo] [message + emoji] [Send] */
.chat-panel .dm-composer{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"pv pv pv" "ph ta send" "err err err";column-gap:8px;align-items:end}
.chat-panel .dm-composer .dm-pv{grid-area:pv}
.chat-panel .dm-composer .emo-field{grid-area:ta;min-width:0}
.chat-panel .dm-composer .error{grid-area:err}
.chat-panel .dm-composer .error:empty{display:none}
.chat-panel .dm-composer .row{display:contents}
.chat-panel .dm-composer .file-btn{grid-area:ph;height:44px;margin:0}
.chat-panel .dm-composer button[type=submit]{grid-area:send;height:44px;margin:0}
.chat-panel .dm-composer textarea{margin:0;display:block}
@media (max-width:600px){
  .chat-panel .dm-composer{column-gap:6px}
  .chat-panel .dm-composer .file-btn{font-size:0;width:44px;padding:0;justify-content:center}
  .chat-panel .dm-composer .file-btn .ico{width:20px;height:20px;margin:0}
  .chat-panel .dm-composer button[type=submit]{padding:0 16px}
}
.pre-head ~ .chat-col{margin-left:0}

/* v15: Lumo Circle wordmark is wider; keep the phone header roomy on small screens */
@media (max-width:374px){.brand-logo{height:21px}.top-left{gap:2px}}


/* ---------- v16: report, suspend/ban, notifications bell, search, saved, @mentions, drafts, security, backups ---------- */
.hp-field{position:absolute!important;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.msg-head .msg-acts{margin-left:auto;display:inline-flex;align-items:center;gap:2px}
.msg-head .msg-acts .del{margin-left:0}
.linkbtn.rep{display:inline-flex;align-items:center;gap:4px;color:var(--dim)}
.linkbtn.rep .ico{width:14px;height:14px}
.linkbtn.rep:hover{color:var(--danger)}
.th-more .menu button[disabled]{color:var(--dim);cursor:default}
.th-top .th-save{flex:none;margin-top:4px;width:40px;padding:0}
.th-top .th-save .ico{width:19px;height:19px}
.th-save.on{color:var(--glow);border-color:rgba(255,170,80,.45)}
.mention{color:var(--glow);font-weight:600;cursor:pointer;border-radius:4px}
.mention:hover{text-decoration:underline}
.mention-pop{position:absolute;left:0;top:calc(100% + 6px);z-index:35;min-width:220px;max-width:min(320px,calc(100vw - 28px));background:var(--panel2);border:1px solid var(--line2);border-radius:var(--r-sm);padding:5px;box-shadow:0 18px 40px -12px rgba(0,0,0,.8);display:flex;flex-direction:column}
.mention-pop[hidden]{display:none}
.mention-pop.up{top:auto;bottom:calc(100% + 6px)}
.mention-pop button{display:flex;align-items:center;gap:9px;background:none;border:0;border-radius:8px;padding:8px 10px;text-align:left;cursor:pointer;font-size:.92rem}
.mention-pop button.on,.mention-pop button:hover{background:var(--panel)}
.draft-note{margin-left:auto;margin-right:10px;font-size:.78rem}
.composer .row button[type=submit]{margin-left:auto}
.composer .row .draft-note:not([hidden])+button{margin-left:0}
@keyframes flash{0%{background:rgba(255,170,80,.22)}100%{background:transparent}}
.msg.flash{animation:flash 2.4s ease-out;border-radius:12px}

/* report sheet */
.avmodal.sheet{align-items:center}
.rep-card{width:min(440px,100%);align-items:stretch;gap:10px;text-align:left}
.rep-card h3{display:flex;align-items:center;gap:8px}
.rep-card h3 .ico{color:var(--danger)}
.rep-opts{display:flex;flex-direction:column;gap:6px;margin-top:4px}
.rep-opt{display:flex;align-items:center;gap:10px;margin:0;padding:11px 13px;border:1px solid var(--line2);border-radius:var(--r-sm);color:var(--text);font-size:.95rem;cursor:pointer;background:var(--bg2)}
.rep-opt input{width:18px;height:18px;accent-color:var(--glow);margin:0}
.rep-opt:has(input:checked){border-color:var(--glow);background:rgba(255,170,80,.08)}
.rep-card textarea{min-height:76px}
.rep-card .error{min-height:0;margin:0}
.rep-card .error:empty{display:none}
@media (max-width:600px){
  .avmodal.sheet{align-items:flex-end;padding:0}
  .avmodal.sheet .rep-card{width:100%;border-radius:20px 20px 0 0;padding:20px 18px calc(18px + env(safe-area-inset-bottom))}
}

/* suspend / warn panels */
.susp,.warnbox{width:100%;background:var(--bg2);border:1px solid var(--line);border-radius:var(--r-sm);padding:4px 14px 14px;margin-top:4px}
.susp[hidden],.warnbox[hidden]{display:none}
.susp label,.warnbox label{margin-top:12px}
.susp .switch,.warnbox .switch{margin-top:12px}
.susp-len{display:flex;gap:8px;flex-wrap:wrap}
.susp-len select,.susp-len input[type=date]{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-sm);padding:10px 12px;font-size:16px;color:var(--text);min-height:44px}
.warnbox textarea{min-height:64px}
.susp .form-actions,.warnbox .form-actions{margin-top:12px}
.ban-why{display:block;color:var(--danger)!important;font-size:.82rem}

/* cards with small headings (account prefs, security, backups) */
.card-h{font-size:1.12rem;display:flex;align-items:center;gap:8px;margin:0 0 6px}
.card-h .ico{color:var(--glow)}
.card-sub{font-size:.95rem;margin:18px 0 8px;color:var(--text)}
.card.prefs{margin-top:16px}
.prefs-note{margin:0 0 12px}
.prefs-list{display:flex;flex-direction:column;gap:2px}
.switch.pref{padding:9px 0;border-top:1px solid var(--line);margin:0;width:100%}
.switch.pref:first-child{border-top:0}

/* notifications + search result rows */
.nlist{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.nrow{display:flex;align-items:flex-start;gap:12px;padding:13px 15px;border-top:1px solid var(--line);color:var(--text);position:relative}
.nrow:first-child{border-top:0}
a.nrow:hover{background:var(--panel2);text-decoration:none}
.nrow.unread{background:linear-gradient(90deg,rgba(255,170,80,.10),transparent 70%)}
.n-av{flex:none}
.n-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.n-txt{font-size:.95rem;line-height:1.4;overflow-wrap:anywhere}
.n-title{font-weight:600;color:var(--text)}
.n-quote{color:var(--muted);font-size:.88rem;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.n-quote.warn{color:var(--text);background:rgba(255,116,104,.08);border-left:3px solid var(--danger);padding:7px 10px;border-radius:0 10px 10px 0;-webkit-line-clamp:unset;display:block}
.n-quote mark{background:rgba(255,170,80,.28);color:inherit;border-radius:3px;padding:0 1px}
.n-when{color:var(--dim);font-size:.78rem}
.n-dot{position:absolute;right:14px;top:18px;width:9px;height:9px;border-radius:50%;background:var(--glow);box-shadow:0 0 0 3px rgba(255,170,80,.2)}
.av.n-sys{--h:140;color:var(--ok);background:rgba(111,212,154,.14);font-size:1rem}
.av.n-sys.warn{color:var(--danger);background:rgba(255,116,104,.12)}
.av.n-sys .ico{width:19px;height:19px}
.nrow.mrow{align-items:center}
.nrow.mrow .btn{flex:none}
.searchbar{display:flex;align-items:center;gap:8px;background:var(--bg2);border:1px solid var(--line);border-radius:999px;padding:5px 5px 5px 16px;margin:0 0 18px}
.searchbar:focus-within{border-color:var(--glow)}
.searchbar .sb-ico{color:var(--muted);display:grid}
.searchbar input{flex:1;min-width:0;border:0;background:none;padding:9px 4px;font-size:16px;color:var(--text);outline:none}
.searchbar input::-webkit-search-cancel-button{filter:grayscale(1)}
.searchbar .btn{min-height:40px}
.page-head h1 .ico{margin-right:2px}

/* admin tabs: 9 now — one scrolling row on phones */
@media (max-width:600px){
  .tabs.inline.adm-tabs{display:flex;width:100%;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;border-radius:999px;padding:3px}
  .tabs.inline.adm-tabs::-webkit-scrollbar{display:none}
  .tabs.inline.adm-tabs button{flex:1 0 auto;padding:8px 11px;font-size:.84rem}
}

/* admin: reports */
.rep-list{display:flex;flex-direction:column;gap:14px}
.rep-item{padding:16px 18px;display:flex;flex-direction:column;gap:12px}
.rep-top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.rep-kind{display:inline-flex;align-items:center;gap:6px;font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--danger);background:rgba(255,116,104,.10);padding:4px 10px;border-radius:999px}
.rep-kind .ico{width:13px;height:13px}
.rep-body{display:flex;gap:12px;align-items:flex-start}
.rep-main{flex:1;min-width:0}
.rep-who{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 6px}
.rep-who .status{margin-left:0}
.rep-quote{margin:8px 0 0;padding:9px 12px;border-left:3px solid var(--line2);background:var(--bg2);border-radius:0 10px 10px 0;color:var(--text);font-size:.93rem;overflow-wrap:anywhere;white-space:pre-wrap}
.rep-img{margin-top:8px;max-height:160px;width:auto;border-radius:10px}
.rep-why{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.rchip{display:inline-block;font-size:.72rem;font-weight:700;padding:2px 8px;border-radius:6px;background:var(--panel2);color:var(--muted)}
.rchip.spam{background:#2b2210;color:#f0c46b}
.rchip.rude{background:#2a1514;color:var(--danger)}
.rchip.rules{background:#14202b;color:#98c4ea}
.rep-note{color:var(--muted);font-size:.86rem;margin:3px 0 0 2px;overflow-wrap:anywhere}
.rep-acts{display:flex;gap:8px;flex-wrap:wrap}
html[data-theme="light"] .rchip.spam{background:#fbf0d8;color:#8a5a00}
html[data-theme="light"] .rchip.rude{background:#f9e1de}
html[data-theme="light"] .rchip.rules{background:#e3eef9;color:#2f6497}

/* admin: security + backups */
.sec-card,.bk-card{margin-bottom:16px}
.sec-card form{margin-top:6px}
.limits{margin:6px 0 0;padding-left:20px;color:var(--text);font-size:.92rem;line-height:1.7}
.alist.fails{max-height:420px;overflow-y:auto}
.bk-head{display:flex;gap:16px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap}
.bk-head>div{flex:1 1 300px}
.bk-list{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.bk-row{display:flex;align-items:center;gap:12px;padding:12px 15px;border-top:1px solid var(--line);flex-wrap:wrap}
.bk-row:first-child{border-top:0}
.bk-main{flex:1 1 220px;min-width:0;display:flex;flex-wrap:wrap;align-items:center;gap:4px 0}
.bk-main .muted{flex-basis:100%}
html[data-theme="light"] .mention-pop{background:#fff;box-shadow:0 18px 40px -12px rgba(60,40,20,.3)}
html[data-theme="light"] .nrow.unread{background:linear-gradient(90deg,rgba(217,112,31,.10),transparent 70%)}
@media (max-width:600px){
  .nrow{padding:12px 13px;gap:10px}
  .rep-item{padding:14px}
  .rep-acts .btn{flex:1 1 auto}
  .nav .nav-search{display:none}
}

.nav .nav-admin .ico{display:none}
.nrow.unread{padding-right:34px}
@media (max-width:600px){
  .nav .nav-admin{padding:8px 9px}
  .nav .nav-admin .na-t,.nav .nav-admin .adminview{display:none}
  .nav .nav-admin .ico{display:inline-block;width:21px;height:21px}
}
@media (max-width:374px){.nav .nav-msg,.nav .nav-admin{padding:7px 5px}.nav{gap:2px}}
.alist .status{white-space:nowrap}

/* ============ v17: levels, new-since markers, tags, polls, best feedback, first-post review, invites ============ */
.role.lvl{white-space:nowrap}
.role.lvl.new{background:var(--panel2);color:var(--muted)}
.role.lvl.regular{background:#132233;color:#8cc2f2}
.role.lvl.trusted{background:rgba(255,190,90,.16);color:#ffc46b}
.role.lvl.admin{background:rgba(255,170,80,.14);color:var(--glow)}
html[data-theme="light"] .role.lvl.new{background:#eeebe5;color:#6c6873}
html[data-theme="light"] .role.lvl.regular{background:#e2eefa;color:#245d92}
html[data-theme="light"] .role.lvl.trusted{background:#fdf0d8;color:#9a5a06}
.uc-badges{display:inline-flex;gap:6px;flex-wrap:wrap}
.byline .role{font-size:.62rem}
.newpill{display:inline-flex;align-items:center;font-size:.64rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:2px 7px;border-radius:999px;background:var(--glow);color:var(--ink);margin-right:7px;vertical-align:.18em;line-height:1.5;flex:none}
.newpill.sm{font-size:.6rem;padding:1px 6px;margin:0}
h1 .newpill{margin:0 0 0 10px;vertical-align:.45em;font-size:.7rem}
.t-poll{color:var(--glow)}
.t-poll .ico{width:14px;height:14px}
.ttags{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.tagchips{display:inline-flex;flex-wrap:wrap;gap:6px}
.tagchip{display:inline-flex;align-items:center;font-size:.78rem;font-weight:600;padding:3px 10px;border-radius:999px;background:var(--panel2);border:1px solid var(--line);color:var(--muted);text-decoration:none;white-space:nowrap}
a.tagchip:hover{color:var(--text);border-color:var(--line2);text-decoration:none}
.tagchip::before{content:"#";opacity:.55;margin-right:2px}
.tagchip.xs{font-size:.68rem;padding:1px 7px}
.th-tags{margin-top:10px}
.tagbar{display:flex;gap:6px;align-items:center;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin:-8px 0 16px;padding:2px 0}
.tagbar::-webkit-scrollbar{display:none}
.tb-l{color:var(--dim);display:inline-flex;flex:none;margin-right:2px}
.tagf{flex:none;display:inline-flex;align-items:center;font-size:.84rem;font-weight:600;padding:6px 12px;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--muted);cursor:pointer;text-decoration:none;white-space:nowrap;min-height:34px}
.tagf:hover{color:var(--text);border-color:var(--line2);text-decoration:none}
.tagf.on{background:var(--text);color:var(--bg);border-color:var(--text)}
.tagpick{display:flex;flex-wrap:wrap;gap:7px;margin:4px 0 2px}
.flabel{display:flex;align-items:center;gap:6px;font-size:.85rem;color:var(--muted);margin:16px 0 8px;font-weight:500}
.flabel .muted{font-weight:400}
.tag-edit{margin-top:12px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel)}
.tag-edit .flabel{margin-top:0}
/* poll builder */
.pollbox{margin-top:18px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg2)}
.pollbox>summary{list-style:none;cursor:pointer;padding:12px 14px;display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center}
.pollbox>summary::-webkit-details-marker{display:none}
.pollbox>summary .pb-t{display:inline-flex;align-items:center;gap:7px;font-weight:650;color:var(--text)}
.pollbox>summary .pb-t .ico{color:var(--glow)}
.pollbox[open]>summary{border-bottom:1px solid var(--line)}
.pb-body{padding:2px 14px 12px}
.popts{display:flex;flex-direction:column;gap:8px;margin:12px 0 10px}
.popt{display:flex;align-items:center;gap:8px}
.popt .pl{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:.8rem;background:var(--panel2);color:var(--muted);flex:none}
.popt input[type=text]{flex:1;min-width:0;padding:10px 12px}
.pimg-btn{margin:0;flex:none;padding:7px 10px}
.popt.has-img .pimg-btn{display:none}
.pthumb{position:relative;width:44px;height:44px;flex:none;border-radius:9px;overflow:hidden}
.pthumb[hidden]{display:none}
.pthumb img{width:100%;height:100%;object-fit:cover}
.pthumb button{position:absolute;top:0;right:0;background:rgba(0,0,0,.6);color:#fff;padding:0 5px;font-size:.9rem;line-height:1.3;border-radius:0 0 0 8px}
.prm{font-size:1.2rem;flex:none}
.prm[hidden]{display:none}
/* poll in a post */
.poll{max-width:640px;margin:18px 0 6px;padding:16px;border:1px solid var(--line);border-radius:var(--r);background:var(--panel)}
.poll-h{display:flex;align-items:flex-start;gap:9px;margin-bottom:12px;font-size:1.02rem;line-height:1.35}
.poll-h b{flex:1;min-width:0;overflow-wrap:anywhere}
.poll-i{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:rgba(255,170,80,.14);color:var(--glow);flex:none}
.poll-opts{display:flex;flex-direction:column;gap:8px}
.poll.has-img .poll-opts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.popt-b{position:relative;display:flex;flex-direction:column;gap:7px;text-align:left;width:100%;padding:11px 12px;border:1px solid var(--line2);border-radius:var(--r-sm);background:var(--bg2);color:var(--text);cursor:pointer;font:inherit}
.popt-b:hover:not([disabled]){border-color:var(--glow)}
.popt-b[disabled]{cursor:default}
.popt-b.mine{border-color:var(--glow);box-shadow:0 0 0 1px var(--glow) inset}
.po-img{position:relative;display:block;border-radius:9px;overflow:hidden;background:#0d0d0f;aspect-ratio:4/3}
.po-img img{width:100%;height:100%;object-fit:cover}
.po-row{display:flex;align-items:center;gap:8px;min-width:0}
.po-label{flex:1;min-width:0;font-weight:600;font-size:.94rem;overflow-wrap:anywhere;display:flex;align-items:center;gap:8px}
.po-k{width:24px;height:24px;border-radius:50%;display:inline-grid;place-items:center;font-size:.76rem;font-weight:800;background:var(--panel2);color:var(--muted);flex:none}
.po-k.on-img{position:absolute;top:7px;left:7px;background:rgba(0,0,0,.65);color:#fff}
.po-pct{font-weight:800;font-size:.92rem;flex:none}
.po-bar{display:block;height:8px;border-radius:999px;background:var(--panel2);overflow:hidden}
.po-bar span{display:block;height:100%;border-radius:999px;background:var(--line2);transition:width .4s ease}
.popt-b.lead .po-bar span,.popt-b.mine .po-bar span{background:linear-gradient(90deg,#ffc477,var(--glow) 55%,var(--glow2))}
.po-mine{font-size:.74rem;font-weight:700;color:var(--glow)}
.poll-f{display:flex;flex-wrap:wrap;align-items:center;gap:2px 10px;margin-top:12px}
.poll-f .linkbtn{padding:2px 0;color:var(--glow);font-weight:600}
html[data-theme="light"] .po-img{background:#e9e5de}
html[data-theme="light"] .po-k.on-img{background:rgba(255,255,255,.9);color:#18171a}
/* best feedback */
.best-card{display:block;margin:16px 0 4px;padding:14px 16px;border-radius:var(--r);border:1px solid rgba(255,190,90,.45);background:linear-gradient(135deg,rgba(255,190,90,.13),rgba(255,140,80,.05));color:var(--text);text-decoration:none}
.best-card:hover{text-decoration:none;border-color:var(--glow)}
.bc-h{display:flex;align-items:center;gap:7px;font-weight:750;color:#ffc46b;font-size:.92rem;flex-wrap:wrap}
.bc-who{display:flex;align-items:center;gap:7px;margin:9px 0 4px;font-size:.9rem}
.bc-text{font-size:.95rem;line-height:1.5;overflow-wrap:anywhere;color:var(--text)}
html[data-theme="light"] .best-card{border-color:rgba(217,140,31,.4);background:linear-gradient(135deg,#fff4dd,#fffaf1)}
html[data-theme="light"] .bc-h,html[data-theme="light"] .best-flag{color:#9a5a06}
.msg.is-best{border-color:rgba(255,190,90,.55);box-shadow:0 0 0 1px rgba(255,190,90,.25) inset}
.best-flag{display:flex;align-items:center;gap:6px;font-size:.76rem;font-weight:750;color:#ffc46b;margin-bottom:6px}
.best-flag .ico,.bc-h .ico{width:15px;height:15px}
.linkbtn.bestbtn{display:inline-flex;align-items:center;gap:4px;color:var(--dim)}
.linkbtn.bestbtn .ico{width:14px;height:14px}
.linkbtn.bestbtn:hover,.linkbtn.bestbtn.on{color:var(--glow)}
.linkbtn.bestbtn.on .ico{fill:currentColor}
/* new since your last visit */
.new-div{display:flex;align-items:center;gap:10px;margin:4px 0 2px;color:var(--glow);font-size:.78rem;font-weight:750;text-transform:uppercase;letter-spacing:.08em}
.new-div::before,.new-div::after{content:"";flex:1;height:1px;background:rgba(255,170,80,.45)}
.msg.is-new{border-left:3px solid var(--glow)}
/* waiting for review */
.waitpill{display:inline-flex;align-items:center;font-size:.64rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:2px 8px;border-radius:999px;background:rgba(255,170,80,.16);color:var(--glow);margin-right:7px;vertical-align:.15em;white-space:nowrap}
.msg.is-waiting{opacity:.78;border-style:dashed}
.w-photos{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.w-photos img{width:110px;height:110px;object-fit:cover;border-radius:10px;cursor:zoom-in}
.w-note{margin:8px 0 0}
.held-done{text-align:center;max-width:520px;margin:30px auto}
.held-done .hd-i{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;margin:0 auto 14px;background:rgba(255,170,80,.14);color:var(--glow)}
.held-done .hd-i .ico{width:26px;height:26px}
.held-done .form-actions{justify-content:center}
.wlist{display:flex;flex-direction:column;gap:14px}
.wcard{padding:16px}
.w-head{display:flex;gap:10px;align-items:center}
.w-who{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;min-width:0}
.w-who .muted{flex-basis:100%}
.w-title{margin:12px 0 4px;font-size:1.1rem}
.w-text{margin-top:6px}
.w-tags{display:flex;gap:5px;flex-wrap:wrap;margin-top:10px}
.w-poll{margin-top:10px;padding:10px 12px;border-radius:var(--r-sm);background:var(--bg2);border:1px solid var(--line);font-size:.88rem;display:flex;flex-direction:column;gap:3px}
.w-poll b{display:flex;align-items:center;gap:6px}
.w-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.w-reject textarea{min-height:70px}
.switch.big{font-size:.95rem;font-weight:600;margin:8px 0 4px}
/* invite links */
.invite-note{display:flex;gap:11px;align-items:flex-start;margin:14px 0 4px;padding:12px 14px;border-radius:var(--r-sm);background:rgba(111,212,154,.10);border:1px solid rgba(111,212,154,.35)}
.invite-note[hidden]{display:none}
.invite-note b{display:block}
.invite-note span{display:block;font-size:.88rem;color:var(--muted)}
.inv-i{color:var(--ok);display:inline-flex;margin-top:2px}
.inv-i .ico{width:22px;height:22px}
.invite-card{margin-top:16px}
.inv-copy{margin-top:10px}
.inv-copy .btn{flex:none}
.inv-friends{display:flex;flex-wrap:wrap;gap:8px}
.inv-f{display:inline-flex;align-items:center;gap:7px;padding:4px 10px 4px 4px;border-radius:999px;background:var(--panel2);font-size:.86rem}
.inv-f .status{margin-left:0}
.lv-set{display:flex;align-items:center;gap:8px;margin:8px 0 0;font-size:.82rem;flex-wrap:wrap}
.lv-set select{width:auto;margin:0;padding:6px 10px;font-size:.84rem}
.inv-by{font-weight:600;color:var(--text)}
.lv-grid{display:grid;grid-template-columns:auto repeat(3,minmax(0,1fr));gap:8px 10px;align-items:center;margin:14px 0 4px;font-size:.8rem}
.lv-grid b{color:var(--muted);font-weight:600;line-height:1.2}
.lv-grid input{width:100%;background:var(--bg2);border:1px solid var(--line);border-radius:var(--r-sm);padding:9px 10px;font-size:16px;color:var(--text)}
.tag-admin{margin-top:12px}
.tag-admin .arow{align-items:center}
.tag-admin .arow-main{flex-direction:row;align-items:center;gap:10px;flex-wrap:wrap}
.tag-admin .arow-main .muted{white-space:nowrap}
.tag-admin input[type=text]{padding:8px 11px;max-width:220px}
.tg-acts{display:flex;gap:4px;flex:none}
.tg-acts .btn{padding:6px 10px;min-height:34px}
.tag-add{display:flex;gap:8px;margin-top:12px}
.tag-add input{flex:1;min-width:0}
.tag-add .btn{flex:none}
.digest-prev{margin-top:12px}
.digest-prev iframe{width:100%;height:520px;border:1px solid var(--line);border-radius:var(--r-sm);background:#f6f4f0;margin-top:8px}
@media (max-width:560px){
  .poll{padding:13px}
  .poll.has-img .poll-opts{gap:8px}
  .popt-b{padding:9px}
  .tag-admin .arow{flex-wrap:wrap}
  .tag-admin .arow-main{flex-basis:100%}
  .tag-admin input[type=text]{max-width:none;flex:1;min-width:0}
  .tg-acts{margin-left:auto}
  .lv-grid{font-size:.74rem;gap:7px}
  .w-photos img{width:88px;height:88px}
  .best-card{padding:12px 14px}
}

/* v18: Sign in with Google + email alert settings */
.btn.google{background:#fff;color:#1f1f1f;border:1px solid #dadce0;font-weight:600;gap:10px;margin:2px 0 4px}
.btn.google:hover{background:#f7f8f8;border-color:#c6c9cc}
.g-logo{width:18px;height:18px;flex:none}
.card-h .g-logo{width:1.05em;height:1.05em;vertical-align:-.15em;margin-right:2px}
.or-line{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.84rem;margin:14px 0 6px}
.or-line::before,.or-line::after{content:"";flex:1;height:1px;background:var(--line2)}
.gsec .card-h .status{margin-left:6px;font-size:.72rem;vertical-align:middle}
.gsec form label:not(.switch){display:block;margin-top:12px}
.gsec .copybox{margin-top:4px}
.g-steps{margin:16px 0 10px;padding-left:1.3em;color:var(--muted);line-height:1.55}
.g-steps li{margin:0 0 5px}
.g-steps b{color:var(--text);font-weight:600}

/* v18: member profile pages */
.av.xl{width:84px;height:84px;font-size:1.5rem}
.prof-head{max-width:760px}
.ph-top{display:flex;gap:16px;align-items:center}
.ph-id{min-width:0}
.ph-id h1{font-size:1.55rem;margin:0 0 6px;overflow-wrap:anywhere}
.ph-badges{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:4px}
.ph-bio{margin:16px 0 0;white-space:pre-line;color:var(--text);line-height:1.55;overflow-wrap:anywhere}
.ph-bio.muted{color:var(--muted);font-size:.92rem}
.ph-links{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:12px}
.ph-links a{display:inline-flex;align-items:center;gap:6px;font-size:.92rem;font-weight:500;min-height:32px}
.ph-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:18px 0 0;padding:14px 0 0;border-top:1px solid var(--line)}
.ph-stats div{display:flex;flex-direction:column;align-items:center;text-align:center}
.ph-stats b{font-size:1.2rem;font-family:var(--display)}
.ph-stats span{font-size:.74rem;color:var(--muted);line-height:1.2;margin-top:2px}
.ph-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;align-items:center}
.ph-acts .av-btns{margin:0;display:flex;gap:8px;flex-wrap:wrap}
.prof-admin{max-width:760px;margin-top:14px;border-style:dashed}
.pa-grid{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:.92rem;margin:4px 0 2px}
.pa-grid span{color:var(--muted)} .pa-grid b{font-weight:600;overflow-wrap:anywhere}
.prof-admin select{max-width:280px}
.pa-acts{flex-wrap:wrap;gap:8px}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.pgrid.feat{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.ptile{position:relative;border-radius:var(--r-sm);overflow:hidden;background:var(--panel2);aspect-ratio:1/1}
.pgrid.feat .ptile{aspect-ratio:4/3}
.ptile>a{display:block;width:100%;height:100%;color:#fff}
.ptile>a:hover{text-decoration:none}
.ptile img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.ptile:hover img{transform:scale(1.03)}
.pt-meta{position:absolute;left:0;right:0;bottom:0;padding:22px 9px 7px;background:linear-gradient(transparent,rgba(0,0,0,.72));display:flex;flex-direction:column;gap:1px}
.pt-t{font-size:.8rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pt-n{font-size:.72rem;opacity:.9;display:flex;align-items:center;gap:3px}
.pt-pin{position:absolute;top:6px;right:6px;width:34px;height:34px;border-radius:50%;border:0;display:grid;place-items:center;cursor:pointer;background:rgba(0,0,0,.45);color:#fff;backdrop-filter:blur(6px)}
.pt-pin.on{background:var(--glow);color:var(--ink)}
.pin-hint{margin:10px 0 0}
.pcomments{padding:4px 0}
.pc-row{display:flex;flex-direction:column;gap:3px;padding:12px 18px;border-top:1px solid var(--line);color:var(--text)}
.pc-row:first-child{border-top:0}
.pc-row:hover{text-decoration:none;background:var(--panel2)}
.pc-on b{color:var(--text);font-weight:600}
.pc-x{font-size:.94rem;line-height:1.45;overflow-wrap:anywhere}
@media (max-width:520px){
  .pgrid{grid-template-columns:repeat(3,1fr);gap:6px}
  .pgrid.feat{grid-template-columns:repeat(2,1fr)}
  .pt-meta{padding:16px 6px 5px} .pt-t{font-size:.7rem} .pt-n{font-size:.66rem}
  .av.xl{width:72px;height:72px}
  .ph-id h1{font-size:1.35rem}
  .pc-row{padding:11px 14px}
}
html[data-theme="light"] .pt-pin:not(.on){background:rgba(0,0,0,.4)}

/* ---------- v19: camera settings, feedback wanted, before/after slider, photo challenges ---------- */
.exif{display:flex;align-items:center;gap:6px;padding:7px 12px;font-size:.8rem;line-height:1.35;color:var(--muted);background:var(--panel);border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}
.exif .ico{color:var(--glow);width:1em;height:1em;flex:none;align-self:flex-start;margin-top:.12em}
.exif span{flex:1 1 0;min-width:0}
.exif .linkbtn{font-size:.76rem;color:var(--dim);margin-left:auto}
.exif.off{color:var(--dim);font-style:italic}
.exif.off .linkbtn{color:var(--glow);font-style:normal}
.chentry .exif{background:transparent;border:0;padding:4px 0 0}
.exif-opt{margin:12px 0 0;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg2)}
.exif-opt .exif-prev{display:flex;gap:6px;align-items:flex-start;font-size:.8rem;color:var(--muted);margin-top:6px}
.exif-opt .exif-prev .ico{color:var(--glow)}
.fbw-box .flabel .ico{color:var(--glow)}
.fbpick{display:flex;flex-wrap:wrap;gap:7px;margin:2px 0 8px}
.fbopt{display:inline-flex;align-items:center;gap:6px;font-size:.84rem;font-weight:600;padding:6px 12px;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--muted);cursor:pointer;min-height:34px;user-select:none}
.fbopt input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.fbopt:hover{color:var(--text);border-color:var(--line2)}
.fbopt.on{background:var(--glow);border-color:var(--glow);color:var(--ink)}
.fbopt.on span::before{content:"✓ "}
.fbopt:has(input:focus-visible){outline:2px solid var(--glow);outline-offset:2px}
.fbnote{width:100%}
.fbwant{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:12px 0 0;padding:10px 12px;border-radius:var(--r-sm);background:linear-gradient(135deg,rgba(255,170,80,.10),rgba(255,120,80,.04));border:1px solid rgba(255,170,80,.25)}
.fbw-h{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;font-weight:750;color:var(--glow);margin-right:4px}
.fbchip{font-size:.8rem;font-weight:650;padding:3px 10px;border-radius:999px;background:var(--panel2);color:var(--text);border:1px solid var(--line2)}
.fbw-note{flex-basis:100%;font-size:.88rem;color:var(--text);opacity:.85}
.fb-edit{margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg2)}
.fb-edit .flabel{margin-top:0}
.babox .pb-body{padding:12px 14px}
.bpick{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.bthumb{position:relative;display:inline-block}
.bthumb img{width:64px;height:64px;object-fit:cover;border-radius:10px;border:1px solid var(--line)}
.bthumb button{position:absolute;top:-8px;right:-8px;width:24px;height:24px;border-radius:50%;background:var(--panel2);border:1px solid var(--line2);color:var(--text);display:grid;place-items:center;line-height:1}
.ba{position:relative;width:100%;overflow:hidden;background:#070708;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:ew-resize;max-height:86vh}
.ba-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;-webkit-user-drag:none}
.photo .ba-img{max-height:none;cursor:ew-resize}
.ba-clip{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--p)) 0 0)}
.ba-line{position:absolute;top:0;bottom:0;left:var(--p);width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 8px rgba(0,0,0,.45)}
.ba-knob{position:absolute;top:50%;left:50%;width:42px;height:42px;margin:-21px 0 0 -21px;border-radius:50%;background:#fff;color:#1a1a1a;display:grid;place-items:center;box-shadow:0 2px 12px rgba(0,0,0,.4)}
.ba-knob svg{width:22px;height:22px}
.ba-lab{position:absolute;top:10px;font-size:.7rem;font-weight:750;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:rgba(0,0,0,.55);padding:3px 8px;border-radius:6px;pointer-events:none}
.ba-lab.l{left:10px} .ba-lab.r{right:10px}
.photo figcaption .ico{color:var(--glow)}
/* challenges */
.side-nav .scount.live{background:rgba(255,170,80,.16);color:var(--glow);border-radius:999px;padding:1px 7px;font-size:.68rem;text-transform:uppercase;letter-spacing:.05em}
.ch-banner{display:flex;align-items:center;gap:12px;margin:0 0 22px;padding:12px 14px;border-radius:var(--r);border:1px solid rgba(255,170,80,.32);background:linear-gradient(135deg,rgba(255,170,80,.16),rgba(255,120,80,.05));color:var(--text)}
.ch-banner:hover{text-decoration:none;border-color:var(--glow)}
.chb-i{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--glow);color:var(--ink);flex:none}
.chb-i .ico{width:22px;height:22px}
.chb-t{display:flex;flex-direction:column;min-width:0;flex:1}
.chb-t b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chb-k{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--glow);font-weight:700}
.chb-l{font-size:.8rem;color:var(--muted);white-space:nowrap}
.chph{display:inline-flex;align-items:center;gap:5px;font-size:.72rem;font-weight:750;text-transform:uppercase;letter-spacing:.07em;padding:3px 9px;border-radius:999px;background:var(--panel2);color:var(--muted)}
.chph.open{background:rgba(111,212,154,.14);color:var(--ok)}
.chph.voting{background:rgba(255,170,80,.16);color:var(--glow)}
.chlist{display:grid;gap:12px}
.chcard{display:flex;gap:14px;padding:12px;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);color:var(--text)}
.chcard:hover{text-decoration:none;border-color:var(--line2)}
.chc-img{width:96px;height:96px;flex:none;border-radius:12px;overflow:hidden;background:var(--panel2);display:grid;place-items:center}
.chc-img img{width:100%;height:100%;object-fit:cover}
.chc-ph .ico{width:34px;height:34px;color:var(--glow)}
.chc-body{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0}
.chc-t{font-size:1.06rem}
.chc-d{font-size:.9rem;color:var(--muted)}
.chc-win{font-size:.84rem;font-weight:650;color:var(--glow);display:inline-flex;gap:5px;align-items:center}
.ch-head{padding:0;overflow:hidden}
.ch-cover img{width:100%;height:auto;max-height:300px;object-fit:cover}
.ch-hb{padding:18px 20px}
.ch-pills{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ch-head h1{margin:10px 0 6px}
.ch-desc{margin:0 0 12px;white-space:pre-wrap}
.ch-steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0 8px;padding:0}
.ch-steps li{padding:8px 10px;border-radius:10px;background:var(--bg2);border:1px solid var(--line);display:flex;flex-direction:column;font-size:.78rem;color:var(--muted);min-width:0}
.ch-steps li b{font-size:.86rem;color:var(--text)}
.ch-steps li.now{border-color:var(--glow);background:rgba(255,170,80,.10)}
.ch-steps li.now b{color:var(--glow)}
.ch-steps li.done b::after{content:" ✓";color:var(--ok)}
.ch-rule{margin:6px 0 0}
.ch-admin{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:14px;padding-top:12px;border-top:1px dashed var(--line2)}
.ch-winner{border-color:rgba(255,170,80,.45);background:linear-gradient(160deg,rgba(255,170,80,.16),rgba(255,120,80,.03) 60%),var(--panel)}
.chw-h{display:flex;gap:12px;align-items:center;margin-bottom:12px}
.chw-h>.ico{width:40px;height:40px;padding:8px;border-radius:12px;background:var(--glow);color:var(--ink)}
.chw-k{font-size:.74rem;text-transform:uppercase;letter-spacing:.09em;color:var(--glow);font-weight:750}
.chw-h b{font-size:1.2rem}
.chw-photos{display:grid;gap:10px}
.chw-photos figure{margin:0;border-radius:var(--r-sm);overflow:hidden;background:#070708}
.chw-photos img{width:100%;height:auto;max-height:70vh;object-fit:contain;cursor:zoom-in}
.chw-photos figcaption{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:8px 12px;font-size:.86rem;background:var(--panel2)}
.chgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.chentry{position:relative;margin:0;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--panel);display:flex;flex-direction:column}
.chentry img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;cursor:zoom-in;background:#070708}
.chentry figcaption{padding:10px 12px;display:flex;flex-direction:column;gap:4px;flex:1}
.chentry.voted{border-color:var(--glow);box-shadow:0 0 0 1px var(--glow)}
.chentry.win{border-color:var(--glow);box-shadow:0 0 0 2px rgba(255,170,80,.55)}
.che-win{position:absolute;top:10px;left:10px;z-index:1;display:inline-flex;gap:5px;align-items:center;background:var(--glow);color:var(--ink);font-weight:800;font-size:.76rem;padding:4px 10px;border-radius:999px;box-shadow:0 2px 10px rgba(0,0,0,.35)}
.che-who{display:flex;align-items:center;gap:7px;font-size:.9rem}
.che-cap{font-size:.88rem;color:var(--muted)}
.che-acts{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:auto;padding-top:6px}
.che-acts .btn{min-width:96px}
.che-votes{font-weight:700;font-size:.88rem}
.ch-votenote .linkbtn{color:inherit;text-decoration:underline;font-weight:600}
.ch-enter .picker.one .drop{min-height:110px}
.ch-dates{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ch-dates input{width:100%}
.adm-ch{display:grid;gap:8px;margin-top:14px}
.adm-chr{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg2)}
.role.chwin{background:rgba(255,170,80,.18);color:var(--glow);display:inline-flex;align-items:center;gap:4px}
@media (max-width:640px){
  .chgrid{grid-template-columns:1fr 1fr;gap:8px}
  .chentry figcaption{padding:8px 9px}
  .che-acts .btn{min-width:0;flex:1}
  .chc-img{width:72px;height:72px}
  .ch-hb{padding:14px}
  .ch-dates{grid-template-columns:1fr}
  .ch-steps li{padding:7px 8px}
}
html[data-theme="light"] .ba,html[data-theme="light"] .chentry img,html[data-theme="light"] .chw-photos figure{background:#e9e5de}
html[data-theme="light"] .fbwant{background:linear-gradient(135deg,rgba(255,170,80,.16),rgba(255,120,80,.06));border-color:rgba(217,112,31,.32)}
html[data-theme="light"] .fbw-h,html[data-theme="light"] .chb-k,html[data-theme="light"] .chw-k,html[data-theme="light"] .chc-win,html[data-theme="light"] .ch-steps li.now b{color:#b4580d}
html[data-theme="light"] .chph.voting,html[data-theme="light"] .role.chwin,html[data-theme="light"] .side-nav .scount.live{color:#a3500b;background:#fdebd3}
html[data-theme="light"] .chph.open{color:#1f7a47;background:#dcf3e6}
html[data-theme="light"] .ch-banner{background:linear-gradient(135deg,rgba(255,170,80,.22),rgba(255,120,80,.07))}
html[data-theme="light"] .exif .ico,html[data-theme="light"] .photo figcaption .ico{color:#c8650f}
