/* ============================================================
social-v2.css: homepage v2 look for /social (preview, ?v2=1).
Loaded after social.css and only in preview, so it just overrides.
============================================================ */
:root{
--v2-cream:#f4ead6;--v2-cream2:#ebdfc4;--v2-paper:#fbf5e8;--v2-bark:#3a2c22;--v2-bark2:#4a3a2d;
--v2-sun:#ffd54a;--v2-sun2:#ffb21f;--v2-ink:#3b2f25;--v2-muted:#8a7a66;--v2-leaf:#2f7d3a;
--serif:'Nunito',system-ui,sans-serif;--sans:'Nunito',system-ui,sans-serif;
--bg:#f4ead6;--surface:#fbf5e8;--accent:#2f7d3a;--accent-hot:#3f9a52;--cream:#3b2f25;--cream-mid:rgba(59,47,37,.72);--cream-dim:rgba(59,47,37,.5);
}
body{font-family:Nunito,system-ui,sans-serif;font-weight:700;color:var(--v2-ink);
background:var(--v2-cream) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22'%3E%3Ccircle cx='2' cy='2' r='1.4' fill='%23d9caa8'/%3E%3C/svg%3E")}
h1,h2,h3{font-family:Nunito,system-ui,sans-serif;font-weight:900;font-style:italic;letter-spacing:-.01em}
/* ---- hero band (feed / tag pages) ---- */
.hero{clip-path:ellipse(140% 100% at 50% 0%);border:0;box-shadow:none;position:relative;margin:-28px 0 0;padding:110px 24px 70px;min-height:340px;color:#fff;background:#1b2230 url(/assets/v2/spot-bg.webp) 70% 62%/cover;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#141a26e6,#141a26a6 50%,#141a2633);opacity:1;z-index:0;border-radius:0;filter:none;transform:none;width:auto;height:auto;top:0;left:0}
.hero::after{display:none}
.hero-inner{position:relative;z-index:1;max-width:1180px;margin:0 auto;text-align:left;padding-left:70px}
.hero-eyebrow{display:inline-flex;color:#e9c25a;font:900 13px Nunito;letter-spacing:.18em;text-transform:uppercase}
.hero-title{font:900 italic clamp(30px,4vw,52px)/1.05 Nunito;color:#fff;text-shadow:0 4px 0 #0004;max-width:720px;margin:10px 0 12px}
.hero-title em{font-style:italic;color:var(--v2-sun)}
.hero-sub{font:800 17px/1.6 Nunito;color:#f2f5ff;opacity:.92;max-width:560px;margin:0}
.hero-stats{justify-content:flex-start;gap:22px;margin-top:20px}
.stat{background:#ffffff1f;border:2px solid #ffffff2a;border-radius:20px;padding:10px 18px}
.stat-num{font:800 30px/1 'Baloo 2';color:#fff}
.stat-label{font:800 13px Nunito;color:#fff;opacity:.85}
.stat-dot{display:none}
.hero-cta-group{justify-content:flex-start;margin-top:22px}
/* ---- buttons ---- */
.btn-primary,.btn.btn-primary{background:linear-gradient(#ffe57a,var(--v2-sun) 55%,var(--v2-sun2));color:var(--v2-bark);border:0;border-radius:99px;font:900 italic 17px Nunito;box-shadow:0 5px 0 #c98a10;padding:.8rem 1.8rem}
.btn-primary:hover{transform:translateY(-2px);background:linear-gradient(#ffe57a,var(--v2-sun) 55%,var(--v2-sun2))}
.btn-ghost{border:2px solid #ffffff66;color:#fff;border-radius:99px;font:900 italic 16px Nunito}
.btn-link{color:#c98a10;font-weight:900;font-style:italic}
.btn-load-more{background:var(--v2-paper);border:0;border-radius:99px;box-shadow:0 5px 0 var(--v2-cream2);font:900 italic 17px Nunito;color:var(--v2-bark2)}
/* ---- layout + cards ---- */
.layout{padding-top:2.2rem;padding-left:90px}
.layout-narrow{padding-left:90px}
.cat-tabs{gap:8px}
.cat-tab{background:transparent;border:0;color:var(--v2-bark2);font:900 italic 17px Nunito;padding:8px 18px;border-radius:99px}
.cat-tab:hover{background:#ffffff80}
.cat-tab.active{background:var(--v2-sun);color:var(--v2-bark);box-shadow:0 4px 0 #c98a10;border:0}
.post-card,.rail-card,.composer-card,.profile-card,.comments-block,.plant-section,.shop-card,.empty{background:var(--v2-paper);border:0;border-radius:26px;box-shadow:0 6px 0 var(--v2-cream2),0 14px 30px #6b5a3a1f}
.post-card{border-left:0;padding:1.1rem 1.3rem;position:relative;overflow:hidden}
.post-card::before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:5px;border-radius:0 6px 6px 0;background:var(--cat,#2f7d3a)}
.post-author .user-link{font-weight:900;color:var(--v2-ink)}
.post-level{background:#efe2c4;color:var(--v2-bark2);border-radius:99px;padding:1px 8px;font-weight:900}
.post-cat{font-weight:900}
.post-body{font-size:1rem;font-weight:700;color:#4a3d30}
.post-photo{border-radius:20px;overflow:hidden}
.post-photo.post-plant{background:radial-gradient(circle at 50% 55%,#fff3c4,#f1e3c4 45%,#e7d6b0 75%);border-radius:22px}
.post-action{font-weight:900;color:var(--v2-bark2);border-radius:99px}
.post-action:hover{background:#efe2c4}
.rail-card{padding:1.3rem 1.3rem}
.rail-title{font:900 italic 20px Nunito;color:var(--v2-bark)}
.rail-cta{background:linear-gradient(160deg,#2b3f2c,#1d2b20);color:#fff;box-shadow:0 8px 0 #142016,0 20px 40px #2b3f2c44}
.rail-cta h2{color:var(--v2-sun);font:900 italic 24px Nunito}
.rail-cta p{color:#e8efe4}
.rail-cta .btn-link{color:var(--v2-sun)}
.tag-list a{font-weight:800}
.tag-list em{background:#efe2c4;border-radius:99px;padding:0 8px;font-style:normal;font-weight:900}
.composer-card textarea{font-family:Nunito,system-ui,sans-serif;font-weight:700}
.cat-pill{border-radius:99px;font-weight:900}
.join-banner{background:#2a2016f2;border-radius:24px}
.join-text h3{color:var(--v2-sun)}
.pagination a{font-weight:900;color:#c98a10}
.crumb{font-weight:800;color:var(--v2-muted)}
.crumb a{color:#c98a10}
/* ---- post page ---- */
.post-h1{font:900 italic clamp(26px,3vw,38px)/1.1 Nunito;color:var(--v2-bark)}
.comments-title{font:900 italic 24px Nunito;color:var(--v2-bark)}
/* ---- plant page ---- */
.plant-hero{background:linear-gradient(90deg,#141a26f2,#141a26b3 55%,#141a2640),url(/assets/v2/spot-bg.webp) 70% 60%/cover;color:#fff;border:0;border-radius:34px;padding:26px;box-shadow:0 10px 0 var(--v2-cream2),0 24px 50px #6b5a3a40;grid-template-columns:minmax(0,300px) 1fr}
.plant-hero h1{font:900 italic clamp(30px,4.2vw,48px)/1.05 Nunito;color:#fff;text-shadow:0 4px 0 #0004}
.plant-lede{color:#f2f5ff;opacity:.92;font-weight:800}
.plant-hero .plant-facts dt{color:#e9c25a;font-weight:900}
.plant-hero .plant-facts dd,.plant-hero .plant-facts a{color:#fff;font-weight:800}
.plant-hero .plant-facts a{text-decoration:underline;text-decoration-color:#ffffff55}
.plant-facts dt{color:#b07d1c;font-weight:900}
.plant-facts dd{color:var(--v2-ink);font-weight:800}
.plant-facts-card{background:#fff8ea;border:0;border-radius:22px;box-shadow:0 4px 0 var(--v2-cream2)}
.plant-section{padding:22px 24px;margin-top:22px}
.plant-section h2{font:900 italic 26px Nunito;color:var(--v2-bark)}
.plant-steps li,.plant-posts li{font-weight:700}
.plant-related a{background:#fff8ea;border-radius:20px;box-shadow:0 4px 0 var(--v2-cream2)}
.plant-stages li{background:#fff8ea;border-radius:18px}
.plant-rarity{font:900 italic 15px Nunito;letter-spacing:0;text-transform:none;padding:6px 16px;border-radius:99px;color:#fff;background:#7a8a7a;box-shadow:0 3px 0 #0003}
.plant-rarity.rarity-common{background:#7a8a7a}
.plant-rarity.rarity-uncommon{background:#3f9a52}
.plant-rarity.rarity-rare{background:#2f7fd0;color:#fff}
.plant-rarity.rarity-legendary{background:linear-gradient(90deg,#b8862b,#e9c25a);color:#fff}
.plant-rarity.rarity-epic{background:#8a55c9;color:#fff}
.plant-rarity.rarity-mythic{background:#ff6a4d;color:#fff}
.plant-rarity.rarity-transcendent{background:linear-gradient(90deg,#e05ad0,#5aa6ff);color:#fff}
/* plant in a premium pot (built by social-v2.js) */
.v2-potwrap{position:relative;width:62%;margin:82% auto 0;aspect-ratio:1}
.v2-potwrap .v2-pot{position:absolute;inset:0;background:center bottom/contain no-repeat;filter:drop-shadow(0 8px 10px #0008)}
.v2-potwrap .v2-soil{position:absolute;background:url(/builder-data/uploads/optimized/soil-fix-trimmed.webp) center/100% 100% no-repeat;z-index:1}
.v2-potwrap .v2-pshadow{position:absolute;border-radius:50%;z-index:1;opacity:.55;background:radial-gradient(ellipse at center,#0000008c,#00000052 35%,transparent 100%)}
.v2-potwrap img.v2-plant{position:absolute;max-width:none;height:auto;z-index:2;transform-origin:50% 100%;transition:scale .3s;filter:drop-shadow(0 0 22px #ffd97a88)!important}
.post-card:hover .v2-potwrap img.v2-plant,.plant-hero:hover .v2-potwrap img.v2-plant{scale:1.03}
.v2-potwrap img.v2-plant,.post-photo.post-plant .v2-potwrap img.v2-plant{height:auto!important;max-height:none!important;object-fit:contain}
/* ---- profile ---- */
.profile-name{font:900 italic 30px Nunito;color:var(--v2-bark)}
.profile-stat-num{font:800 28px 'Baloo 2';color:var(--v2-bark)}
.profile-section-title{font:900 italic 22px Nunito;color:var(--v2-bark)}
@media (max-width:900px){
.hero{padding:80px 16px 60px;min-height:0}
.hero-inner{padding-left:0}
.hero-stats{gap:8px;flex-wrap:wrap}
.stat{padding:8px 12px}.stat-num{font-size:24px}
.layout,.layout-narrow{padding-left:1rem;padding-right:1rem}
.plant-hero{grid-template-columns:1fr;padding:18px}
.v2-potwrap{width:56%;margin-top:74%}
}
/* ============================================================
Feed like X/Twitter: one central column of big media cards,
side columns only on wide screens.
============================================================ */
.layout{max-width:1340px;grid-template-columns:210px minmax(0,600px) 310px;gap:26px;justify-content:center;padding-left:96px;padding-right:20px;align-items:start}
.layout-narrow{grid-template-columns:minmax(0,640px);justify-content:center}
.feed-col{min-width:0}
.rail{position:sticky;top:92px;display:flex;flex-direction:column;gap:16px}
.v2-lcol{position:sticky;top:92px;display:flex;flex-direction:column;gap:6px}
.v2-lcol a{display:flex;align-items:center;gap:12px;padding:10px 16px;border-radius:99px;font:900 italic 18px Nunito;color:var(--v2-bark2)}
.v2-lcol a:hover{background:#ffffff99}
.v2-lcol a.on{background:var(--v2-paper);box-shadow:0 4px 0 var(--v2-cream2);color:var(--v2-bark)}
.v2-lcol a .ic{width:28px;text-align:center;font-style:normal}
.v2-lcol .v2-lplay{margin-top:10px;justify-content:center;background:linear-gradient(#ffe57a,var(--v2-sun) 55%,var(--v2-sun2));color:var(--v2-bark);box-shadow:0 5px 0 #c98a10}
.v2-lcol hr{border:0;border-top:2px dashed #d9caa8;margin:8px 10px}
.cat-tabs{position:sticky;top:72px;z-index:5;background:#f4ead6ee;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:10px 4px;margin:0 -4px 12px;border-radius:0 0 20px 20px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
.cat-tabs::-webkit-scrollbar{display:none}
.cat-tab{flex:0 0 auto}
.post-list{display:flex;flex-direction:column;gap:18px}
.post-card{display:flex;flex-direction:column;padding:16px 18px 10px}
.post-card .post-head{order:1}
.post-card .post-body{order:2;margin:10px 0 4px;font-size:1.04rem}
.post-card .post-photo,.post-card .post-sticker,.post-card .post-fallback{order:3}
.post-card .post-foot{order:4;border-top:2px dashed #efe2c4;margin-top:10px;padding-top:6px;justify-content:space-between}
.post-avatar{width:46px;height:46px;font-size:22px}
.post-photo{margin:10px 0 0;width:100%;aspect-ratio:auto;border-radius:22px;background:#efe2c4}
.post-photo img{width:100%;height:auto;max-height:640px;object-fit:cover;display:block}
.post-photo.post-gif img{max-height:560px;object-fit:contain;background:#000}
.post-photo.post-plant{position:relative;aspect-ratio:5/4;display:flex;align-items:flex-end;justify-content:center;background:radial-gradient(circle at 50% 58%,#fff6d6 0%,#ffe9a8 28%,#f1dcae 55%,#e5d1a6 80%);overflow:hidden}
.post-photo.post-plant::before{content:"";position:absolute;left:50%;top:58%;width:70%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:radial-gradient(circle,#fff8 0%,#ffe08a55 40%,transparent 70%)}
.post-plant .v2-potwrap{width:28%;margin:0 auto 5%}
.post-sticker{font-size:120px;text-align:center;padding:20px 0}
.post-card-detail .post-photo.post-plant{aspect-ratio:1/1}
.post-card-detail .post-plant .v2-potwrap{width:32%}
.rail .v2-daily,.rail .v2-feat{background:var(--v2-paper);border-radius:26px;box-shadow:0 6px 0 var(--v2-cream2),0 14px 30px #6b5a3a1f;overflow:hidden}
.v2-daily{color:#fff!important;background:linear-gradient(160deg,#20283a,#141a26)!important;box-shadow:0 8px 0 #0d1220,0 20px 40px #141a2644!important;padding:16px 18px;display:block}
.v2-daily .t{display:flex;align-items:center;gap:8px;font:900 12px Nunito;letter-spacing:.12em;text-transform:uppercase;color:#e9c25a}
.v2-daily .t i{width:8px;height:8px;border-radius:50%;background:#ff5a5a;box-shadow:0 0 8px #ff5a5a}
.v2-daily .row{display:flex;align-items:center;gap:12px;margin-top:10px}
.v2-daily .row img{width:84px;height:84px;object-fit:contain;filter:drop-shadow(0 0 14px #ffd97a88)}
.v2-daily h4{font:900 italic 19px/1.15 Nunito;color:#fff}
.v2-daily h4 em{color:var(--v2-sun);font-style:italic}
.v2-daily .rc{display:flex;gap:4px;margin-top:6px}
.v2-daily .rc img{width:30px;height:30px;background:#fff1;border-radius:8px}
.v2-daily .ft{display:flex;align-items:center;justify-content:space-between;margin-top:12px}
.v2-daily .ft b{font:800 22px 'Baloo 2';color:#ffe9a6}
.v2-daily .go{height:38px;padding:0 16px;border-radius:99px;display:inline-flex;align-items:center;background:linear-gradient(#ffe57a,var(--v2-sun) 55%,var(--v2-sun2));color:var(--v2-bark);font:900 italic 15px Nunito;box-shadow:0 4px 0 #c98a10}
.v2-feat{padding:16px 16px 10px}
.v2-feat h3{font:900 italic 20px Nunito;color:var(--v2-bark);margin:0 0 8px}
.v2-feat a{display:grid;grid-template-columns:56px 1fr;gap:10px;align-items:center;padding:8px;border-radius:16px}
.v2-feat a:hover{background:#efe2c4}
.v2-feat img{width:56px;height:56px;object-fit:contain}
.v2-feat b{display:block;font:900 15px/1.2 Nunito;color:var(--v2-ink)}
.v2-feat small{display:inline-block;margin-top:3px;padding:1px 9px;border-radius:99px;color:#fff;font:900 11.5px Nunito}
@media (max-width:1240px){.layout{grid-template-columns:minmax(0,600px) 320px;padding-left:96px}.v2-lcol{display:none}}
@media (max-width:1000px){.layout{grid-template-columns:minmax(0,600px);padding-left:96px}.rail{display:none}}
@media (max-width:900px){.layout{padding-left:0;padding-right:0;padding-top:1rem}.feed-col{padding:0 10px}.post-card{border-radius:22px;padding:14px 14px 8px}.cat-tabs{top:64px}}
/* tap targets >= 44px on phones */
.post-action{min-height:44px;padding:0 12px;display:inline-flex;align-items:center;gap:6px}
.cat-tab{min-height:44px;display:inline-flex;align-items:center}
.btn-load-more{min-height:50px}
.pagination a,.crumb a,.btn-link,.tag-list a{min-height:44px;display:inline-flex;align-items:center}
.v2-lcol a{min-height:44px}
/* ===== profile: Twitter-like header, big game avatar on a greenhouse cover ===== */
html.v2 .profile-card{position:relative;padding-top:0;overflow:hidden}
html.v2 .profile-card::before{content:"";display:block;height:170px;margin:0 -1.6rem;background:url(/assets/v2/spot-bg.webp) 72% 62%/cover}
html.v2 .profile-head{align-items:flex-end;margin-top:-66px;gap:18px;position:relative}
html.v2 .profile-head .profile-avatar{width:132px!important;height:132px!important;flex:0 0 132px;border:6px solid #fbf5e8;box-shadow:0 8px 20px #0003;font-size:64px;padding:6px!important}
html.v2 .profile-name{font-size:34px}
html.v2 .profile-id{padding-bottom:10px}
@media (max-width:700px){
html.v2 .profile-card::before{height:120px;margin:0 -1.2rem}
html.v2 .profile-head{margin-top:-50px;gap:12px}
html.v2 .profile-head .profile-avatar{width:100px!important;height:100px!important;flex-basis:100px;border-width:5px}
html.v2 .profile-name{font-size:26px}
}
/* game avatar in the left rail link to your own profile */
.v2-rail-av{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:radial-gradient(circle at 50% 40%,#fff8e6,#f1e3c4);overflow:hidden;vertical-align:middle;margin-right:2px;flex:0 0 30px}
.v2-rail-av img{width:100%;height:100%;object-fit:contain}
/* ===== join gate for visitors who are not logged in ===== */
.v2-gate{position:fixed;inset:0;z-index:300;display:flex;align-items:flex-end;justify-content:center;background:linear-gradient(transparent 0,#0d0a0766 30%,#0d0a07b3);opacity:0;pointer-events:none;transition:opacity .35s}
.v2-gate.open{opacity:1;pointer-events:auto}
.v2-gate-card{position:relative;width:min(1100px,100%);height:min(72vh,640px);display:grid;grid-template-columns:1.05fr 1fr;border-radius:36px 36px 0 0;overflow:hidden;background:#fbf5e8;box-shadow:0 -20px 60px #0007;translate:0 40px;transition:translate .45s cubic-bezier(.2,.8,.2,1.1)}
.v2-gate.open .v2-gate-card{translate:0 0}
.v2-gate-art{position:relative;background:url(/assets/v2/hero-desktop.webp) 50% 45%/cover}
.v2-gate-art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 60%,#fbf5e8)}
.v2-gate-body{display:flex;flex-direction:column;justify-content:center;gap:14px;padding:40px 46px 40px 20px;font-family:Nunito,system-ui,sans-serif;color:#3a2c22}
.v2-gate-eyebrow{font:900 12px Nunito;letter-spacing:.18em;text-transform:uppercase;color:#b07d1c}
.v2-gate-title{font:900 italic clamp(28px,3.2vw,42px)/1.05 Nunito;margin:0}
.v2-gate-title em{color:#2f7d3a}
.v2-gate-sub{font:700 16px/1.55 Nunito;color:#5b4c3c;margin:0}
.v2-gate-perks{list-style:none;padding:0;margin:4px 0;display:grid;gap:8px;font:800 15px Nunito}
.v2-gate-perks li{display:flex;align-items:center;gap:10px}
.v2-gate-perks img{width:30px;height:30px;object-fit:contain}
.v2-gate-cta{display:flex;align-items:center;justify-content:center;height:62px;border-radius:99px;background:linear-gradient(#ffe57a,#ffd54a 55%,#ffb21f);color:#3a2c22!important;font:900 italic 22px Nunito;text-decoration:none!important;box-shadow:0 6px 0 #c98a10}
.v2-gate-row{display:flex;gap:10px}
.v2-gate-row a{flex:1;display:grid;place-items:center;height:50px;border-radius:99px;border:2px solid #e1d4b6;background:#fff;color:#3a2c22!important;font:900 15px Nunito;text-decoration:none!important}
.v2-gate-later{align-self:center;background:none;border:0;cursor:pointer;color:#8a7a66;font:800 14px Nunito;text-decoration:underline;padding:6px;min-height:44px}
.v2-gate-x{position:absolute;right:16px;top:16px;width:44px;height:44px;border:0;border-radius:50%;background:#3a2c22cc;color:#fff;cursor:pointer;display:grid;place-items:center;z-index:2}
body.v2-gate-on .join-banner{display:none!important}
@media (max-width:800px){
.v2-gate-card{grid-template-columns:1fr;grid-template-rows:150px 1fr;height:auto;max-height:88vh;border-radius:28px 28px 0 0}
.v2-gate-art{background-image:url(/assets/v2/hero-mobile.webp);background-position:50% 40%}
.v2-gate-art::after{background:linear-gradient(transparent 50%,#fbf5e8)}
.v2-gate-body{padding:6px 20px 22px;gap:11px;overflow:auto}
.v2-gate-sub{font-size:14.5px}.v2-gate-perks{font-size:14px}
.v2-gate-cta{height:56px;font-size:20px}
}
html.v2 .profile-head{align-items:flex-start}
html.v2 .profile-head .profile-avatar{position:relative;z-index:2}
html.v2 .profile-id{padding:76px 0 0;position:relative;z-index:1}
@media (max-width:700px){html.v2 .profile-id{padding-top:56px}}
/* ===== weekly leaderboard: feed card + /social/leaderboard ===== */
.v2-lb{background:var(--v2-paper);border-radius:26px;box-shadow:0 6px 0 var(--v2-cream2),0 14px 30px #6b5a3a1f;padding:16px 16px 14px}
.v2-lb-h{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.v2-lb-h h3{font:900 italic 20px Nunito;color:var(--v2-bark);margin:0}
.v2-lb-cd{font:800 12.5px Nunito;color:var(--v2-muted);white-space:nowrap}
.v2-lb-cd b{color:var(--v2-bark)}
.v2-lb-tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:10px -4px 6px;padding:2px 4px}
.v2-lb-tabs::-webkit-scrollbar{display:none}
.v2-lb-tabs button{flex:0 0 auto;min-height:36px;padding:0 12px;border:0;border-radius:99px;background:#efe2c4;color:var(--v2-bark2);font:800 13px Nunito;cursor:pointer}
.v2-lb-tabs button.on{background:var(--v2-bark);color:#fff}
.lb-who{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:14px;color:var(--v2-ink);min-height:44px}
.lb-who:hover{background:#efe2c4}
.lb-who b{font:900 15px Nunito;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb-rank{width:28px;text-align:center;font:900 15px Nunito;color:var(--v2-muted);flex:0 0 28px}
.post-avatar.lb-av{width:34px;height:34px;flex:0 0 34px;font-size:18px}
.lb-score{font:800 13px Nunito;color:var(--v2-muted);white-space:nowrap}
.v2-lb-prize{margin:8px 4px 0;font:700 13.5px Nunito;color:var(--v2-bark2)}
.v2-lb-ft{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px}
.v2-lb-ft a{font:900 14px Nunito;color:var(--v2-bark2);min-height:44px;display:inline-flex;align-items:center}
.v2-lb-ft .go{padding:0 16px;border-radius:99px;background:linear-gradient(#ffe57a,var(--v2-sun) 55%,var(--v2-sun2));color:var(--v2-bark);font-style:italic;box-shadow:0 4px 0 #c98a10}
/* full page */
.lb-cat{padding:1.2rem 1.2rem 1rem;scroll-margin-top:140px}
.lb-cat-title{display:flex;align-items:center;gap:8px;font:900 italic 22px Nunito;color:var(--v2-bark);margin:0 0 8px}
.lb-cat-title small{margin-left:auto;font:800 12px Nunito;font-style:normal;color:var(--v2-muted);text-transform:uppercase;letter-spacing:.08em}
.lb-list{list-style:none;margin:0;padding:0}
.lb-row{display:flex;align-items:center;gap:6px;border-top:2px dashed #efe2c4}
.lb-row:first-child{border-top:0}
.lb-row .lb-who{flex:1;min-width:0}
.lb-row.lb-top .lb-who b{font-size:16px}
.lb-row .lb-score{padding-right:8px}
.lb-hof{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.lb-hof h3{font:900 15px Nunito;color:var(--v2-bark2);margin:4px 8px}
.lb-hof .lb-who em{font:800 12.5px Nunito;font-style:normal;color:#2f7fd0;white-space:nowrap}
.lb-how{margin:0;padding-left:1.1rem;display:flex;flex-direction:column;gap:8px;color:var(--v2-ink);line-height:1.45}
html:not(.v2) .v2-lb,html:not(.v2) .lb-cat{background:#fff;border-radius:16px;padding:16px}
/* ===== /social/leaderboard v2: Hall of Gardeners ===== */
.page-leaderboard .hero,.page-leaderboard .layout{display:none}
.lb2-hero{position:relative;margin:-1px 0 0;padding:70px 24px 90px;color:#fff;text-align:center;background:linear-gradient(#141a26b3,#141a26cc),url(/assets/v2/spot-bg.webp) 70% 60%/cover;clip-path:ellipse(140% 100% at 50% 0)}
.lb2-hero-in{max-width:900px;margin:0 auto}
.lb2-eyebrow{display:inline-flex;align-items:center;gap:8px;font:900 13px Nunito;letter-spacing:.18em;text-transform:uppercase;color:#e9c25a}
.lb2-eyebrow img{width:26px}
.lb2-title{font:900 italic clamp(38px,5.4vw,68px)/1 Nunito;margin:12px 0;text-shadow:0 4px 0 #0005}
.lb2-title em{color:#ffd54a}
.lb2-sub{font:800 18px/1.55 Nunito;max-width:640px;margin:0 auto;opacity:.95}
.lb2-flags{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:22px auto 4px;max-width:760px}
.lb2-flag{width:20px;height:15px;border-radius:3px;object-fit:cover;box-shadow:0 0 0 1px #0002;vertical-align:-2px;margin-right:6px}
.lb2-flag.big{width:40px;height:30px;border-radius:6px;margin:0;box-shadow:0 4px 10px #0006,0 0 0 2px #ffffff55;transition:transform .2s}
.lb2-flag.big:hover{transform:translateY(-4px) scale(1.1)}
.lb2-flag.md{width:28px;height:21px;border-radius:4px;margin:0}
.lb2-hero-row{display:flex;justify-content:center;align-items:center;gap:22px;flex-wrap:wrap;margin-top:26px}
.lb2-timer small{display:block;font:900 12px Nunito;letter-spacing:.14em;text-transform:uppercase;opacity:.8;margin-bottom:6px}
.lb2-digits{display:flex;align-items:baseline;gap:4px;justify-content:center}
.lb2-digits b{display:inline-grid;place-items:center;min-width:46px;height:54px;padding:0 6px;border-radius:12px;background:linear-gradient(#2a2016,#120c06);border:2px solid #ffffff22;font:800 30px 'Baloo 2';color:#ffe9a6}
.lb2-digits span{font:900 14px Nunito;opacity:.75;margin-right:6px}
.lb2-prizes{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.lb2-prize{display:inline-flex;align-items:center;gap:6px;background:#ffffff1a;border:2px solid #ffffff2e;border-radius:99px;padding:5px 14px 5px 6px;font:900 16px Nunito}
.lb2-prize img{width:28px}.lb2-prize img.d{width:20px}
.lb2-prize.crate{padding:5px 14px;font-size:13px}
.lb2{max-width:1180px;margin:-40px auto 0;padding:0 16px 60px;position:relative;z-index:2}
.lb2-tabs{position:sticky;top:76px;z-index:20;display:flex;gap:8px;justify-content:center;flex-wrap:wrap;padding:10px;margin:0 auto 22px;width:fit-content;max-width:100%;background:#fbf5e8ee;backdrop-filter:blur(6px);border-radius:99px;box-shadow:0 6px 0 #ebdfc4,0 14px 30px #6b5a3a26}
.lb2-tab{display:flex;align-items:center;gap:8px;padding:8px 16px 8px 8px;border-radius:99px;color:#4a3a2d!important;text-decoration:none!important;font:900 italic 17px Nunito;min-height:44px}
.lb2-tab img{width:30px;height:30px;object-fit:contain}
.lb2-tab em{font:900 12px Nunito;font-style:normal;background:#efe2c4;border-radius:99px;padding:1px 8px}
.lb2-tab.on{background:#ffd54a;box-shadow:0 4px 0 #c98a10}
.lb2-tab.on em{background:#fff6cf}
.lb2-grid{display:grid;grid-template-columns:1fr 330px;gap:24px;align-items:start}
.lb2-cat{display:none}.lb2-cat.on{display:block}
.lb2-cat,.lb2-card{background:#fbf5e8;border-radius:30px;padding:24px;box-shadow:0 8px 0 #ebdfc4,0 20px 40px #6b5a3a1f;margin-bottom:24px}
.lb2-cat-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font:900 italic 28px Nunito;color:#3a2c22;margin:0 0 16px}
.lb2-cat-title img{width:38px;height:38px;object-fit:contain}
.lb2-cat-title small{font:800 14px Nunito;font-style:normal;color:#8a7a66;margin-left:auto}
.lb2-cat-title.sm{font-size:22px;margin-bottom:4px}
.lb2-note{background:#fff1c9;border-radius:16px;padding:10px 14px;font:800 14px Nunito;color:#7a5716}
/* podium */
.lb2-podium{display:grid;grid-template-columns:1fr 1.15fr 1fr;align-items:end;gap:14px;margin:6px 0 18px}
.lb2-pod{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;color:#3a2c22!important;text-decoration:none!important;padding-top:6px}
.lb2-pod-av{position:relative;width:104px;height:104px;border-radius:50%;background:radial-gradient(circle at 50% 40%,#fff8e6,#f1e3c4);border:5px solid #d9c9a6;box-shadow:0 8px 18px #0003;transition:transform .2s}
.lb2-pod:hover .lb2-pod-av{transform:translateY(-4px)}
.lb2-pod-av>img:first-child{width:100%;height:100%;object-fit:contain;padding:6px;border-radius:50%}
.lb2-pod-av .medal{position:absolute;right:-12px;bottom:-12px;width:42px}
.lb2-pod.p1 .lb2-pod-av{width:132px;height:132px;border-color:#ffd54a;box-shadow:0 0 0 6px #ffd54a44,0 0 40px #ffd54a88,0 10px 22px #0003}
.lb2-pod.p1 .lb2-pod-av::before{content:"👑";position:absolute;top:-34px;left:50%;translate:-50% 0;font-size:34px;filter:drop-shadow(0 3px 2px #0004)}
.lb2-pod.p2 .lb2-pod-av{border-color:#c8d2df}.lb2-pod.p3 .lb2-pod-av{border-color:#e0a77a}
.lb2-pod-name{font:900 italic 19px Nunito;margin-top:10px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb2-pod-meta{font:800 13px Nunito;color:#8a7a66;display:flex;align-items:center}
.lb2-pod-score{font:800 22px 'Baloo 2';color:#2f7d3a}
.lb2-step{width:100%;margin-top:8px;border-radius:18px 18px 8px 8px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:2px;padding:10px 0;color:#fff;font:900 16px Nunito;text-shadow:0 2px 0 #0003;box-shadow:inset 0 -6px 0 #0002}
.lb2-step i{font:800 34px/1 'Baloo 2';font-style:normal}
.lb2-step img{width:16px;vertical-align:-2px}
.lb2-pod.p1 .lb2-step{height:130px;background:linear-gradient(#ffe27a,#d9a02a)}
.lb2-pod.p2 .lb2-step{height:100px;background:linear-gradient(#e8eef7,#9fb0c6)}
.lb2-pod.p3 .lb2-step{height:80px;background:linear-gradient(#f2b98a,#b9733e)}
/* movement chips */
.lb2-mv{display:inline-flex;align-items:center;gap:3px;font:900 12px Nunito;border-radius:99px;padding:2px 9px;white-space:nowrap}
.lb2-mv.up{background:#dcf3d8;color:#237a2f}
.lb2-mv.down{background:#fde2dc;color:#c0392b}
.lb2-mv.same{background:#efe8d8;color:#a99a80;font-size:9px;padding:3px 7px}
.lb2-mv.new{background:#fff1c9;color:#b07d1c;letter-spacing:.06em}
/* list */
.lb2-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.lb2-row{display:grid;grid-template-columns:42px 62px 1fr minmax(150px,230px);align-items:center;gap:10px;background:#fff;border-radius:18px;padding:8px 14px 8px 8px;box-shadow:0 3px 0 #ebdfc4;transition:transform .15s}
.lb2-row:hover{transform:translateX(4px)}
.lb2-row.me{outline:3px solid #ffd54a}
.lb2-rank{font:800 22px 'Baloo 2';color:#8a7a66;text-align:center}
.lb2-mvcol{text-align:center}
.lb2-who{display:flex;align-items:center;gap:10px;min-width:0;color:#3a2c22!important;text-decoration:none!important}
.lb2-av{flex:0 0 44px;width:44px;height:44px;border-radius:50%;background:radial-gradient(circle at 50% 40%,#fff8e6,#f1e3c4);overflow:hidden;box-shadow:0 0 0 2px #ebdfc4}
.lb2-av img{width:100%;height:100%;object-fit:contain;padding:2px}
.lb2-av.sm{flex-basis:30px;width:30px;height:30px}
.lb2-av.lg{width:96px;height:96px;flex:0 0 96px;box-shadow:0 0 0 5px #9fe0c4,0 10px 20px #0003}
.lb2-id{display:flex;flex-direction:column;min-width:0}
.lb2-id b{font:900 16px Nunito;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb2-id small{font:800 12.5px Nunito;color:#8a7a66;display:flex;align-items:center}
.lb2-score{display:flex;flex-direction:column;align-items:flex-end;gap:5px;font:800 13px Nunito;color:#8a7a66}
.lb2-score b{font:800 20px 'Baloo 2';color:#3a2c22}
.lb2-bar{display:block;width:100%;height:8px;border-radius:99px;background:#efe8d8;overflow:hidden}
.lb2-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#5fae4a,#9fe0c4)}
.lb2-empty{text-align:center;padding:20px}
.lb2-empty img{width:70px}
.lb2-empty p{font:800 16px/1.5 Nunito;color:#5b4c3c;max-width:420px;margin:10px auto 16px}
.lb2-btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;border-radius:99px;background:linear-gradient(#ffe57a,#ffd54a 55%,#ffb21f);color:#3a2c22!important;font:900 italic 19px Nunito;text-decoration:none!important;box-shadow:0 5px 0 #c98a10}
.lb2-link{display:block;margin-top:12px;font:800 14px Nunito;color:#8a7a66!important}
/* side */
.lb2-side .lb2-card{padding:20px}
.lb2-climber{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;color:#fff!important;text-decoration:none!important;background:linear-gradient(160deg,#2b3f2c,#1d2b20)!important;box-shadow:0 8px 0 #142016,0 20px 40px #2b3f2c40!important}
.lb2-climb-tag{font:900 12px Nunito;letter-spacing:.14em;text-transform:uppercase;color:#9fe0c4}
.lb2-climber b{font:900 italic 22px Nunito}
.lb2-climb-meta{font:800 13px Nunito;opacity:.85;display:flex;align-items:center}
.lb2-climb-big{font:800 46px/1 'Baloo 2';color:#7be08a;text-shadow:0 0 20px #7be08a66}
.lb2-climber small{font:800 13px Nunito;opacity:.85}
.lb2-side-sub{font:700 13px Nunito;color:#8a7a66;margin:0 0 12px}
.lb2-nations ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.lb2-nations li{display:grid;grid-template-columns:22px 30px 1fr auto;align-items:center;gap:8px;padding:6px 8px;border-radius:14px;background:#fff}
.lb2-nations li:nth-child(1){background:#fff6d6}
.lb2-nations .n{font:800 16px 'Baloo 2';color:#8a7a66;text-align:center}
.lb2-nations .c{display:flex;flex-direction:column;min-width:0}
.lb2-nations .c b{font:900 14px Nunito}
.lb2-nations .c small{font:700 11.5px Nunito;color:#8a7a66;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lb2-nations .c a{color:#b07d1c!important}
.lb2-nations .v{font:800 18px 'Baloo 2';color:#2f7d3a}
.lb2-cta{text-align:center}
.lb2-cta img{width:56px}
.lb2-cta h2{font:900 italic 22px Nunito;color:#3a2c22;margin:6px 0}
.lb2-cta p{font:700 14px/1.5 Nunito;color:#5b4c3c;margin:0 0 14px}
/* hall of fame */
.lb2-hof-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.lb2-hof-cat{background:#fff;border-radius:20px;padding:14px}
.lb2-hof-cat h3{display:flex;align-items:center;gap:8px;font:900 italic 17px Nunito;color:#3a2c22;margin:0 0 8px}
.lb2-hof-cat h3 img{width:26px;height:26px;object-fit:contain}
.lb2-hof-row{display:flex;align-items:center;gap:8px;padding:5px 0;color:#3a2c22!important;text-decoration:none!important;font:800 14px Nunito}
.lb2-hof-row .medal{width:24px}
.lb2-hof-row b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb2-hof-row em{margin-left:auto;font:900 13px Nunito;font-style:normal;color:#2f6fd0;white-space:nowrap}
.lb2-hof-row em img{width:14px;vertical-align:-2px}
.lb2-how{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:8px;font:700 15px/1.55 Nunito;color:#5b4c3c}
@media (max-width:980px){
.lb2-grid{grid-template-columns:1fr}
.lb2-side{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.lb2-side .lb2-card{margin-bottom:0}
}
@media (max-width:700px){
.lb2-hero{padding:46px 16px 76px}
.lb2-sub{font-size:15px}
.lb2-flag.big{width:32px;height:24px}
.lb2-digits b{min-width:38px;height:46px;font-size:24px}
.lb2-tabs{top:66px;flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;border-radius:22px;scrollbar-width:none;width:auto}
.lb2-tabs::-webkit-scrollbar{display:none}
.lb2-tab{flex:0 0 auto;font-size:15px;padding:6px 12px 6px 6px}
.lb2-tab img{width:26px;height:26px}
.lb2-cat,.lb2-card{padding:16px;border-radius:24px}
.lb2-cat-title{font-size:23px}
.lb2-cat-title small{margin-left:0;width:100%}
.lb2-podium{gap:6px}
.lb2-pod-av{width:76px;height:76px;border-width:4px}
.lb2-pod.p1 .lb2-pod-av{width:96px;height:96px}
.lb2-pod.p1 .lb2-pod-av::before{font-size:26px;top:-28px}
.lb2-pod-av .medal{width:32px;right:-8px;bottom:-8px}
.lb2-pod-name{font-size:14.5px}
.lb2-pod-meta{font-size:11px}
.lb2-pod-score{font-size:17px}
.lb2-step{font-size:13px}.lb2-step i{font-size:26px}
.lb2-pod.p1 .lb2-step{height:104px}.lb2-pod.p2 .lb2-step{height:80px}.lb2-pod.p3 .lb2-step{height:64px}
.lb2-row{grid-template-columns:30px 1fr auto;grid-template-areas:"rank who score" "rank mv score";row-gap:2px;padding:8px 10px 8px 6px}
.lb2-rank{grid-area:rank;font-size:18px}
.lb2-mvcol{grid-area:mv;text-align:left;padding-left:54px}
.lb2-who{grid-area:who}
.lb2-score{grid-area:score;min-width:84px}
.lb2-score b{font-size:17px}
.lb2-side{grid-template-columns:1fr}
}
.lb2-score{display:grid;grid-template-columns:auto auto;justify-content:end;align-items:baseline;column-gap:5px;row-gap:5px}
.lb2-score .lb2-bar{grid-column:1/-1}
/* leaderboard: bigger, readable prize art */
.lb2-prize{padding:6px 16px 6px 6px;font-size:19px;gap:8px}
.lb2-prize img{width:38px;height:auto}
.lb2-prize img.d{width:30px;filter:drop-shadow(0 2px 3px #0006)}
.lb2-prize.crate{font-size:15px}
.lb2-step{font-size:19px;gap:4px}
.lb2-step i{font-size:40px}
.lb2-step img{width:26px;vertical-align:-5px;filter:drop-shadow(0 2px 2px #0004)}
.lb2-pod-av .medal{width:50px;right:-14px;bottom:-14px}
.lb2-hof-row{font-size:15px}
.lb2-hof-row .medal{width:32px}
.lb2-hof-row em{font-size:15px}
.lb2-hof-row em img{width:22px;vertical-align:-5px}
.lb2-cta img{width:72px}
.lb2-tab img{width:34px;height:34px}
.lb2-cat-title img{width:44px;height:44px}
.lb2-eyebrow img{width:32px}
@media (max-width:700px){
.lb2-prize{font-size:16px}.lb2-prize img{width:32px}.lb2-prize img.d{width:24px}
.lb2-step{font-size:15px}.lb2-step i{font-size:30px}.lb2-step img{width:20px}
.lb2-pod-av .medal{width:38px;right:-10px;bottom:-10px}
.lb2-tab img{width:28px;height:28px}
}
.lb2-step .pz{display:inline-flex;align-items:center;gap:5px;background:#ffffff38;border-radius:99px;padding:3px 12px 3px 14px;font:900 20px Nunito}
.lb2-step .pz img{width:30px!important;vertical-align:0}
@media (max-width:700px){.lb2-step .pz{font-size:15px;padding:2px 8px 2px 10px}.lb2-step .pz img{width:22px!important}}
.lb2-pod.p1 .lb2-step{height:150px}.lb2-pod.p2 .lb2-step{height:122px}.lb2-pod.p3 .lb2-step{height:104px}
@media (max-width:700px){.lb2-pod.p1 .lb2-step{height:118px}.lb2-pod.p2 .lb2-step{height:96px}.lb2-pod.p3 .lb2-step{height:84px}}
/* logo inside the bar on /social (no hang below) */
html.v2 #social-nav .v2-logo img{height:64px;margin:0}
@media (max-width:900px){html.v2 #social-nav .v2-logo img{height:52px;margin:0}}
/* ---- 5.11.2026: feed sections, daily discoveries card, @mentions ---- */
.feed-sec{font:900 italic 20px Nunito;color:var(--v2-bark);margin:22px 4px 10px;display:flex;align-items:center;gap:10px}
.feed-sec::after{content:"";flex:1;height:2px;border-radius:2px;background:var(--v2-cream2)}
.post-list>.feed-sec:first-child{margin-top:6px}
.digest-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:12px 0 4px;position:relative;z-index:2}
.digest-item{display:flex;flex-direction:column;align-items:center;gap:2px;background:var(--v2-cream);border-radius:18px;padding:8px 6px 10px;text-decoration:none;color:var(--v2-bark);transition:transform .15s}
.digest-item:hover{transform:translateY(-2px)}
.digest-item img{width:100%;max-width:110px;aspect-ratio:1;object-fit:contain}
.digest-noimg{font-size:42px;line-height:96px}
.digest-name{font:900 12px/1.2 Nunito;text-align:center;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.digest-rarity{font:800 10px Nunito;color:#b07d1c;text-transform:uppercase;letter-spacing:.06em}
.digest-more{grid-column:1/-1;text-align:center;font:900 italic 14px Nunito;color:var(--v2-muted)}
.post-card .digest-grid{order:3}
@media (max-width:560px){.digest-grid{gap:6px}.digest-item{padding:6px 4px 8px;border-radius:14px}.digest-name{font-size:11px}.digest-rarity{font-size:9px}}
a.mention{color:#c98a10;font-weight:900;text-decoration:none;position:relative;z-index:2}
a.mention:hover{text-decoration:underline}
.mention-box{position:fixed;z-index:9999;width:260px;max-height:300px;overflow:auto;background:var(--v2-paper,#fbf5e8);border-radius:18px;box-shadow:0 6px 0 var(--v2-cream2,#ebdfc4),0 18px 40px #3a2c2238;padding:6px;font-family:Nunito,system-ui,sans-serif}
.mention-item{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:12px;cursor:pointer;color:var(--v2-bark,#3a2c22)}
.mention-item.on,.mention-item:hover{background:var(--v2-sun,#ffd54a)}
.mention-av{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:#fff;font:900 14px Nunito;overflow:hidden;flex:0 0 auto}
.mention-av img{width:100%;height:100%;object-fit:cover}
.mention-name{font:900 14px Nunito;flex:1;overflow:hidden;text-overflow:ellipsis}
.mention-lv{font:800 11px Nunito;color:var(--v2-muted,#8a7a66)}
/* ---- post page comments, Facebook style (Nov 2026) ----
bubble with name + text, "time · Like · Reply" under it, like count pinned to the bubble,
replies indented once (deeper replies stay at that indent) */
.comment-list{gap:12px}
.comment-item{gap:8px}
.comment-avatar{width:36px;height:36px;font-size:15px}
.comment-replies{margin-top:10px;padding-left:0;border-left:0;gap:10px}
.comment-replies .comment-avatar{width:28px;height:28px;font-size:12px}
.comment-replies .comment-replies{margin-left:-36px}
.cmt-row{display:flex;align-items:flex-end;max-width:100%}
.cmt-bubble{background:#efe4cc;border-radius:18px;padding:8px 14px 9px;min-width:0;max-width:100%}
.cmt-bubble .comment-head{margin:0 0 1px;gap:6px;font-size:13.5px}
.cmt-bubble .comment-head strong{font:900 14px Nunito;color:var(--v2-ink)}
.cmt-bubble .post-level{font-size:10.5px;padding:0 6px;background:#e2d3b0}
.cmt-bubble .comment-text{background:none;padding:0;border-radius:0;font:600 15px/1.38 Nunito;color:var(--v2-ink)}
.cmt-row:has(> .cmt-reacts:not([hidden])) > .cmt-bubble{max-width:calc(100% - 30px)}
.cmt-reacts{flex:0 0 auto;margin:0 0 -3px -12px;position:relative;z-index:1;background:#fff;border-radius:99px;
box-shadow:0 1px 4px #3a2c2233;padding:1px 7px 1px 5px;font:800 12px Nunito;color:var(--v2-muted);white-space:nowrap}
.cmt-reacts[hidden]{display:none}
.comment-media{margin-top:6px;border-radius:16px;max-width:min(280px,100%)}
.comment-meta{gap:14px;align-items:center;margin-top:5px;padding-left:12px;font:800 12.5px Nunito;color:var(--v2-muted)}
.comment-meta time{color:var(--v2-muted);font-weight:700}
.comment-meta .comment-like,.comment-meta .reply-btn{padding:0;background:none;border:0;border-radius:0;font:900 12.5px Nunito;color:var(--v2-muted)}
.comment-meta .comment-like:hover,.comment-meta .reply-btn:hover{background:none;text-decoration:underline;color:var(--v2-ink)}
.comment-item .comment-like{color:var(--v2-muted)}
.comment-item[data-liked="1"] > .comment-body > .comment-meta .comment-like{color:#e0245e}
/* write a comment: avatar + rounded box with the tools inside */
.comment-composer{display:grid;grid-template-columns:36px 1fr;gap:8px;align-items:start;background:none;border:0;padding:0;margin:16px 0 0}
.comments-block .comment-composer-guest{margin-top:16px}
.comment-composer .composer-avatar{width:36px;height:36px;font-size:15px;margin-top:2px}
.comment-composer .picker{grid-column:2}
.cmt-box{background:#efe4cc;border-radius:20px;padding:8px 10px 6px 14px;min-width:0}
.cmt-box textarea,.comment-composer .cmt-box textarea{width:100%;min-height:24px;max-height:160px;resize:none;border:0;outline:0;background:none;padding:2px 0;
font:600 15px/1.4 Nunito;color:var(--v2-ink);box-shadow:none}
.cmt-box textarea:focus{border:0}
.cmt-box .comment-toolbar{display:flex;justify-content:space-between;align-items:center;margin-top:4px;gap:6px;flex-wrap:nowrap}
.cmt-box .tool-btn{background:none;border:0;padding:4px 6px;font:900 13px Nunito;color:var(--v2-muted);border-radius:99px}
.cmt-box .tool-btn:hover{background:#e2d3b0}
.cmt-box .btn.btn-primary{padding:5px 16px;font-size:14px;box-shadow:0 3px 0 #c98a10}
/* reply box: same rounded look */
.reply-form-slot:not(:empty){margin-top:8px}
.reply-composer{background:#efe4cc;border:0;border-radius:20px;padding:8px 10px 6px 14px;gap:4px}
.reply-composer textarea{min-height:24px;resize:none;border:0;background:none;padding:2px 0;font:600 15px/1.4 Nunito;color:var(--v2-ink)}
.reply-composer textarea:focus{border:0}
.reply-composer .tool-btn{background:none;border:0;padding:4px 6px;font:900 13px Nunito;color:var(--v2-muted)}
.reply-composer .btn.btn-primary{padding:5px 16px;font-size:14px;box-shadow:0 3px 0 #c98a10}
@media (max-width:600px){
.comment-avatar{width:32px;height:32px}
.comment-replies .comment-replies{margin-left:-36px}
.cmt-bubble .comment-text{font-size:14.5px}
.comment-composer{grid-template-columns:32px 1fr}
.comment-composer .composer-avatar{width:32px;height:32px}
.cmt-box textarea,.reply-composer textarea{font-size:16px}
}
/* ===== Post reactions row, Facebook style (6.11.2026) ===== */
.post-card .post-reactions{order:4}
.post-reactions{display:flex;align-items:center;gap:8px;width:100%;min-height:40px;margin:10px 0 0;padding:4px 2px;border:0;background:none;cursor:pointer;text-align:left;color:var(--v2-muted,#8a7a66);font:700 14px/1.3 Nunito,system-ui,sans-serif}
.post-reactions[hidden]{display:none}
.post-reactions:hover .react-txt{text-decoration:underline}
.post-reactions .react-heart{font-size:16px;line-height:1}
.post-reactions .react-avs{display:inline-flex;flex:0 0 auto}
.post-reactions .react-av{width:26px!important;height:26px!important;font-size:14px!important;border:2px solid var(--v2-paper,#fbf5e8);margin-left:-8px;box-shadow:0 1px 3px #0002}
.post-reactions .react-av:first-child{margin-left:0}
.post-reactions .react-txt{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.post-reactions .react-txt b{color:var(--v2-ink,#3b2f25);font-weight:800}
.likers-overlay{position:fixed;inset:0;z-index:1000;background:rgba(30,22,12,.55);display:flex;align-items:center;justify-content:center;padding:16px}
.likers-card{width:100%;max-width:380px;max-height:70vh;display:flex;flex-direction:column;background:var(--v2-paper,#fbf5e8);border-radius:22px;box-shadow:0 6px 0 var(--v2-cream2,#ebdfc4),0 20px 50px rgba(0,0,0,.35);overflow:hidden}
.likers-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:2px dashed #efe2c4;font:900 italic 18px Nunito,system-ui,sans-serif;color:var(--v2-bark,#3a2c22)}
.likers-x{width:40px;height:40px;border:0;border-radius:50%;background:#efe2c4;color:#3a2c22;font-size:22px;cursor:pointer}
.likers-list{overflow:auto;padding:6px 8px 10px}
.liker{display:flex;align-items:center;gap:10px;min-height:48px;padding:6px 8px;border-radius:14px;color:var(--v2-ink,#3b2f25);text-decoration:none}
.liker:hover{background:#efe2c4}
.liker .react-av{width:36px!important;height:36px!important;font-size:18px!important}
.liker-name{flex:1;min-width:0;font:800 15px Nunito,system-ui,sans-serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.liker-name em{font-style:normal;color:var(--v2-muted,#8a7a66);font-weight:700}
.liker-lv{flex:0 0 auto;padding:2px 9px;border-radius:99px;background:#efe2c4;font:800 12px Nunito,system-ui,sans-serif;color:var(--v2-bark2,#4a3a2d)}
.likers-empty{padding:18px;text-align:center;color:var(--v2-muted,#8a7a66);font-weight:700}
/* ===== Post action bar, Facebook style (6.11.2026): Like / Comment / Share as three equal buttons
with drawn icons. Pure CSS over the existing markup (feed, post page, "Load more" cards):
the emoji are hidden and replaced by masks in the text colour; the heart fills when data-liked=1. */
html.v2 .post-card .post-foot{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding-top:4px}
html.v2 .post-foot .post-action{justify-content:center;gap:7px;min-height:44px;padding:0 6px;border-radius:12px;font:800 15px Nunito,system-ui,sans-serif;color:var(--v2-bark2,#4a3a2d);background:none;border:0;cursor:pointer;text-decoration:none;white-space:nowrap}
html.v2 .post-foot .post-action:hover{background:#efe2c4}
html.v2 .post-foot .post-like .like-icon,
html.v2 .post-foot .post-comments > span:first-child,
html.v2 .post-foot .post-comments-stat > span:first-child,
html.v2 .post-foot .post-share > span:first-child{font-size:0;width:21px;height:21px;flex:0 0 21px;display:inline-block;background:currentColor;-webkit-mask:center/contain no-repeat;mask:center/contain no-repeat}
html.v2 .post-foot .post-like .like-icon{-webkit-mask-image:url("data:image/svg+xml;utf8,");mask-image:url("data:image/svg+xml;utf8,")}
html.v2 .post-card[data-liked="1"] .post-foot .post-like{color:#e0245e}
html.v2 .post-card[data-liked="1"] .post-foot .post-like .like-icon{-webkit-mask-image:url("data:image/svg+xml;utf8,");mask-image:url("data:image/svg+xml;utf8,")}
html.v2 .post-foot .post-comments > span:first-child,
html.v2 .post-foot .post-comments-stat > span:first-child{-webkit-mask-image:url("data:image/svg+xml;utf8,");mask-image:url("data:image/svg+xml;utf8,")}
html.v2 .post-foot .post-share > span:first-child{-webkit-mask-image:url("data:image/svg+xml;utf8,");mask-image:url("data:image/svg+xml;utf8,")}
/* label, then the count as a small muted number */
html.v2 .post-foot .post-like::after{content:"Like";order:1}
html.v2 .post-foot .post-comments::after,html.v2 .post-foot .post-comments-stat::after{content:"Comment";order:1}
html.v2 .post-foot .post-like .like-count,html.v2 .post-foot .post-comments > span:last-child,html.v2 .post-foot .post-comments-stat > span:last-child{order:2;font-size:13px;font-weight:800;color:var(--v2-muted,#8a7a66)}
html.v2 .post-card[data-liked="1"] .post-foot .post-like .like-count{color:#e0245e}
html.v2 .post-foot .post-action.post-share span:last-child{display:inline}
html.v2 .post-foot .post-comments-stat{cursor:default}
html.v2 .post-foot .post-comments-stat:hover{background:none}
@media (max-width:380px){html.v2 .post-foot .post-action{font-size:14px;gap:5px}}
/* ===== Report / Block menu (Google Play UGC policy, 6.11.2026) ===== */
.post-head,.comment-head,.profile-head{position:relative}
.mod-more{position:absolute;top:-2px;right:-4px;width:40px;height:40px;border:0;border-radius:50%;background:none;color:var(--v2-muted,#8a7a66);font:900 22px/1 system-ui,sans-serif;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:3}
.mod-more:hover{background:#efe2c4;color:var(--v2-bark,#3a2c22)}
.comment-head .mod-more{width:32px;height:32px;top:-6px;right:-6px;font-size:18px}
.profile-head .mod-more{top:auto;bottom:6px;right:0;background:var(--v2-paper,#fbf5e8);box-shadow:0 2px 6px #0002}
.post-head .post-head-text,.post-head .post-meta{padding-right:34px}
.mod-pop{position:absolute;top:36px;right:0;z-index:20;min-width:210px;padding:6px;border-radius:16px;background:var(--v2-paper,#fbf5e8);box-shadow:0 8px 28px rgba(0,0,0,.25),0 0 0 1px #e6d8b8;display:flex;flex-direction:column}
.profile-head .mod-pop{top:auto;bottom:50px}
.mod-pop button{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 12px;border:0;border-radius:12px;background:none;text-align:left;font:800 15px Nunito,system-ui,sans-serif;color:var(--v2-ink,#3b2f25);cursor:pointer}
.mod-pop button:hover{background:#efe2c4}
.mod-form{padding:12px 16px 16px;display:flex;flex-direction:column;gap:8px}
.mod-sub{margin:0 0 4px;color:var(--v2-muted,#8a7a66);font:700 14px/1.45 Nunito,system-ui,sans-serif}
.mod-opt{display:flex;align-items:center;gap:10px;min-height:42px;padding:0 10px;border-radius:12px;font:800 15px Nunito,system-ui,sans-serif;color:var(--v2-ink,#3b2f25);cursor:pointer}
.mod-opt:hover{background:#efe2c4}
.mod-opt input{width:20px;height:20px;accent-color:#c0392b}
.mod-form textarea{min-height:70px;padding:10px 12px;border:2px solid #e6d8b8;border-radius:12px;font:700 14px Nunito,system-ui,sans-serif;resize:vertical;background:#fff}
.mod-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:4px}
.mod-btn{min-height:44px;padding:0 18px;border:0;border-radius:99px;background:#efe2c4;color:var(--v2-bark,#3a2c22);font:900 15px Nunito,system-ui,sans-serif;cursor:pointer}
.mod-danger{background:linear-gradient(#e74c3c,#c0392b);color:#fff}
.mod-btn:disabled{opacity:.5}
/* ===== Comment preview under feed posts (6.11.2026) ===== */
.post-card .post-cmts{order:5;display:flex;flex-direction:column;gap:6px;padding:8px 2px 4px;border-top:2px dashed #efe2c4;margin-top:2px}
.post-cmts .pc-more{font:800 14px Nunito,system-ui,sans-serif;color:var(--v2-muted,#8a7a66);text-decoration:none;padding:2px 4px}
.post-cmts .pc-more:hover{text-decoration:underline}
.post-cmts .pc-item{display:flex;align-items:flex-start;gap:8px;text-decoration:none;color:var(--v2-ink,#3b2f25)}
.post-cmts .pc-av{width:32px!important;height:32px!important;flex:0 0 32px;font-size:16px!important}
.post-cmts .pc-bubble{min-width:0;padding:7px 12px;border-radius:16px;background:#f3e9d2;font:700 14px/1.4 Nunito,system-ui,sans-serif;overflow-wrap:anywhere}
.post-cmts .pc-bubble b{font-weight:900;margin-right:2px}
.post-cmts .pc-media{display:block;max-width:min(180px,100%);max-height:150px;border-radius:12px;margin-top:5px}
.post-cmts .pc-tag{font-size:12px;font-weight:800;color:var(--v2-muted,#8a7a66)}
/* ---- plant page: facts card, owners, community cards (Nov 2026) ---- */
.pf-card{display:grid;gap:16px}
.pf-discoverer{display:flex;align-items:center;gap:14px;padding:12px 16px;border-radius:20px;background:linear-gradient(90deg,#fff3cf,#fbf5e8);box-shadow:0 4px 0 var(--v2-cream2);color:var(--v2-ink);text-decoration:none}
.pf-discoverer:hover{background:linear-gradient(90deg,#ffeab0,#fbf5e8)}
.pf-av{width:54px;height:54px;font-size:22px;flex:0 0 auto;box-shadow:0 0 0 3px #ffd54a}
.pf-disc-text{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.pf-label{font:800 12px Nunito;color:#b07d1c;text-transform:uppercase;letter-spacing:.06em}
.pf-disc-text strong{font:900 19px Nunito;color:var(--v2-bark);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pf-disc-text time{font:800 13px Nunito;color:var(--v2-muted)}
.pf-trophy{margin-left:auto;font-size:28px}
.pf-undiscovered{background:#f3ead6}
.pf-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.pf-stat{display:flex;flex-direction:column;align-items:center;padding:10px 6px;border-radius:16px;background:#fff8ea;box-shadow:0 3px 0 var(--v2-cream2);text-align:center}
.pf-stat b{font:900 20px Nunito;color:var(--v2-bark)}
.pf-stat small{font:800 12px Nunito;color:var(--v2-muted)}
.pf-h3{font:900 15px Nunito;color:var(--v2-bark2);margin:2px 0 -6px;font-style:normal}
.pf-species{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.pf-species a{display:inline-flex;align-items:center;gap:6px;padding:4px 12px 4px 5px;border-radius:99px;background:#fff;box-shadow:0 2px 0 var(--v2-cream2);font:800 14px Nunito;color:var(--v2-ink);text-decoration:none}
.pf-species a:hover{background:#fff3cf}
.pf-species img{width:28px;height:28px;object-fit:contain}
.pf-species em{font-style:normal;font:900 12px Nunito;color:#2f7d3a;background:#e3f1dc;border-radius:99px;padding:1px 7px}
.pf-owners{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}
.pf-owners a{display:grid;grid-template-columns:40px 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center;padding:8px 12px 8px 8px;border-radius:16px;background:#fff8ea;box-shadow:0 3px 0 var(--v2-cream2);text-decoration:none;color:var(--v2-ink);height:100%}
.pf-owners a:hover{background:#fff3cf}
.pf-oav{width:40px;height:40px;font-size:17px;grid-row:1 / 3}
.pf-oname{font:900 14px Nunito;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pf-ohas{display:flex;flex-wrap:wrap;gap:2px 8px;font:800 13px Nunito;color:var(--v2-muted)}
.pf-sale{background:#ffd54a;color:var(--v2-bark);border-radius:99px;padding:0 8px;font:900 11px/1.6 Nunito}
.pf-count{display:inline-block;vertical-align:middle;margin-left:6px;padding:2px 10px;border-radius:99px;background:#ffd54a;color:var(--v2-bark);font:900 15px Nunito;font-style:normal}
.pf-owners li[hidden]{display:none}
.pf-showall{display:block;margin:14px auto 0;padding:9px 22px;border:0;border-radius:99px;background:#fff;box-shadow:0 3px 0 var(--v2-cream2);font:900 15px Nunito;color:var(--v2-bark2);cursor:pointer}
.pf-showall:hover{background:#fff3cf}
.pf-rest{text-align:center;margin:12px 0 0;font:800 14px Nunito;color:var(--v2-muted)}
.pf-empty{font:700 15px Nunito;color:var(--v2-muted);margin:0}
.pf-posts{display:grid;gap:16px}
.pf-posts .post-card{margin:0;box-shadow:0 4px 0 var(--v2-cream2)}
.pf-posts-wrap{background:transparent!important;box-shadow:none!important;padding-left:0!important;padding-right:0!important}
@media (max-width:600px){
.pf-discoverer{padding:10px 12px}
.pf-av{width:46px;height:46px}
.pf-disc-text strong{font-size:17px}
.pf-owners{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.pf-owners a{grid-template-columns:32px 1fr;column-gap:7px;padding:6px 8px 6px 6px;border-radius:14px}
.pf-oav{width:32px;height:32px;font-size:14px}
.pf-oname{font-size:13px}
.pf-ohas{font-size:12px;gap:0 6px}
.pf-sale{font-size:10px;padding:0 6px}
}
/* ===== Feed: comments open under the post, like Facebook (6.11.2026) ===== */
.post-card .feed-thread{order:6;position:relative;z-index:2;display:flex;flex-direction:column;gap:8px;padding:10px 2px 4px;border-top:2px dashed #efe2c4;margin-top:2px}
.feed-thread .ft-list{display:flex;flex-direction:column;gap:8px}
.feed-thread .ft-more{font:800 14px Nunito,system-ui,sans-serif;color:var(--v2-muted,#8a7a66);text-decoration:none;padding:0 4px}
.feed-thread .ft-more:hover{text-decoration:underline}
.feed-thread .ft-empty{font:700 14px Nunito,system-ui,sans-serif;color:var(--v2-muted,#8a7a66);padding:2px 4px}
.feed-thread .ft-item{display:flex;align-items:flex-start;gap:8px}
.feed-thread .ft-reply{margin-left:40px}
.feed-thread .ft-av{width:32px!important;height:32px!important;flex:0 0 32px;font-size:15px!important;text-decoration:none}
.feed-thread .ft-reply .ft-av{width:26px!important;height:26px!important;flex-basis:26px;font-size:12px!important}
.feed-thread .ft-body{min-width:0;display:flex;flex-direction:column;align-items:flex-start}
.feed-thread .ft-bubble{padding:7px 12px 8px;border-radius:16px;background:#f3e9d2;font:700 14px/1.4 Nunito,system-ui,sans-serif;color:var(--v2-ink,#3b2f25);overflow-wrap:anywhere;max-width:100%}
.feed-thread .ft-name{display:block;font-weight:900;color:var(--v2-ink,#3b2f25);text-decoration:none}
.feed-thread .ft-name:hover{text-decoration:underline}
.feed-thread .ft-media{display:block;max-width:min(220px,100%);max-height:200px;border-radius:14px;margin-top:4px}
.feed-thread .ft-meta{font:800 12px Nunito,system-ui,sans-serif;color:var(--v2-muted,#8a7a66);padding:2px 12px 0}
.feed-thread .ft-form{display:flex;align-items:flex-start;gap:8px;margin-top:2px}
.feed-thread .ft-box{flex:1;min-width:0;display:flex;align-items:flex-end;gap:6px;background:#f3e9d2;border-radius:20px;padding:4px 6px 4px 14px}
.feed-thread .ft-input{flex:1;min-width:0;border:0;outline:0;background:none;resize:none;padding:6px 0;font:600 15px/1.4 Nunito,system-ui,sans-serif;color:var(--v2-ink,#3b2f25);max-height:140px}
.feed-thread .ft-send{flex:0 0 auto;width:34px;height:34px;border:0;border-radius:50%;background:linear-gradient(#ffe57a,#ffd54a 55%,#ffb21f);color:#3a2c22;font-size:15px;cursor:pointer}
.feed-thread .ft-send:disabled{opacity:.5}
.feed-thread .ft-guest{font:800 14px Nunito,system-ui,sans-serif;color:var(--v2-muted,#8a7a66);padding:6px 4px;text-align:center}
.feed-thread .ft-guest a{color:#2f7d3a;font-weight:900}
@media (max-width:600px){ .feed-thread .ft-input{font-size:16px} }
/* 7.11.2026: feed "Comment" shows the full post-page thread (comment-list + reply composer) */
.feed-thread .comment-list{margin:0;padding:0;list-style:none}
.feed-thread .comments-empty{font:700 14px Nunito,system-ui,sans-serif;color:var(--v2-muted,#8a7a66);margin:2px 4px}
.feed-thread .ft-composer .reply-composer{margin:4px 0 0}
.feed-thread .ft-composer .reply-text{min-height:44px}
/* feed: the 2-comment preview uses the post page comment markup (7.11.2026) */
.post-card .post-cmts{position:relative;z-index:2}
.post-cmts .comment-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.post-h1.post-h1-dup{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* comment boxes: grow with the text up to 6 lines, then scroll with a slim themed scrollbar (7.11.2026) */
.reply-composer textarea,.cmt-box textarea,.feed-thread .ft-composer .reply-text{max-height:calc(6 * 1.4em + 16px)!important;overflow-y:hidden;resize:none;transition:height .08s ease-out}
@supports (-moz-appearance:none){.reply-composer textarea,.cmt-box textarea{scrollbar-width:thin;scrollbar-color:#c9a96a transparent}} /* Firefox; Chrome uses the ::-webkit-scrollbar rules (no arrow buttons) */
.reply-composer textarea.pl-ta-scroll,.cmt-box textarea.pl-ta-scroll{overflow-y:auto}
.reply-composer textarea::-webkit-scrollbar,.cmt-box textarea::-webkit-scrollbar{width:6px}
.reply-composer textarea::-webkit-scrollbar-track,.cmt-box textarea::-webkit-scrollbar-track{background:transparent;margin:4px 0}
.reply-composer textarea::-webkit-scrollbar-thumb,.cmt-box textarea::-webkit-scrollbar-thumb{background:#c9a96a;border-radius:99px}
.reply-composer textarea::-webkit-scrollbar-thumb:hover,.cmt-box textarea::-webkit-scrollbar-thumb:hover{background:#a8843f}
.reply-composer textarea::-webkit-scrollbar-button,.cmt-box textarea::-webkit-scrollbar-button{display:none;height:0}
/* ---- Phones: less chrome above the feed (7.11.2026) ---- */
@media (max-width:640px){
.hero{padding:70px 16px 22px;clip-path:ellipse(170% 100% at 50% 0%)}
.hero-eyebrow,.hero-sub,.hero-stats{display:none}
.hero-title{font-size:24px;margin:2px 0 8px}
.hero-cta-group{margin-top:6px}
body:has(.v2-nav .v2-user) .hero{display:none}
}
/* ---- Inside the game: the game's own close button replaces Play / menu ---- */
.in-game .hero,.in-game .v2-play,.in-game .v2-burger,.in-game .v2-srail{display:none!important}
.in-game .v2-nav{padding-right:56px}
/* ---- Phones: a feed that is quick to read and easy to tap (7.11.2026) ---- */
@media (max-width:640px){
/* composer: one short bar until you tap it */
.composer-card:not(.open){padding:10px 12px}
.composer-card:not(.open) .cat-pills,.composer-card:not(.open) .composer-user,
.composer-card:not(.open) .char-counter,.composer-card:not(.open) .composer-toolbar{display:none}
.composer-card:not(.open) textarea{min-height:46px;height:46px;resize:none;overflow:hidden}
.composer-card.open textarea{min-height:96px}
/* category tabs: smaller, one tidy row */
.cat-tab{font-size:15px;padding:8px 14px}
/* post header: a quiet Follow next to the name */
.post-follow{padding:3px 10px;font-size:12px;line-height:1.2;background:transparent!important;box-shadow:none!important;
border:1.5px solid #e2b13c;color:#a8700f;border-radius:999px;transform:none}
.post-head{gap:8px}
/* discovery posts: 3 roomy columns, full flower names */
.digest-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.digest-name{font-size:11.5px;line-height:1.15;white-space:normal;word-break:break-word;text-align:center}
/* comments: Like / Reply big enough for a thumb */
.comment-meta{gap:6px}
.comment-meta .comment-like,.comment-meta .reply-btn{padding:8px 8px;font-size:13.5px;min-height:36px}
.post-actions button,.post-actions a{min-height:42px}
}
/* in the game the page has its own way back to the garden */
.in-game .v2-nav{position:fixed;top:0;left:0;right:0;z-index:50}
.in-game body{padding-top:64px}
.v2-back-garden{display:none}
.in-game .v2-back-garden{display:inline-flex;align-items:center;gap:6px;margin-left:8px;padding:8px 14px;border:0;border-radius:999px;cursor:pointer;
background:linear-gradient(#ffe38a,#f5b335);color:#4a2a00;font:900 14px Nunito,system-ui,sans-serif;box-shadow:0 3px 0 #a5650c}
.in-game .v2-nav{padding-right:12px}
/* ---- Phones: compact top, the first post shows up sooner (7.11.2026 evening) ---- */
@media (max-width:640px){
.v2-nav{height:52px;padding:0 10px}
.v2-logo img{width:40px;height:40px}
.v2-play{height:36px;font-size:14px;padding:0 14px}
.v2-user{height:40px;padding:3px 10px 3px 3px}
.v2-burger{width:40px;height:40px}
.in-game .v2-back-garden{padding:7px 12px;font-size:13.5px}
.in-game body{padding-top:52px}
.layout{padding-top:6px}
.cat-tabs{top:52px;padding:6px 2px;margin:0 -4px 8px;gap:6px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
.cat-tabs::-webkit-scrollbar{display:none}
.cat-tab{flex:0 0 auto;height:34px;padding:6px 12px;font-size:13.5px;white-space:nowrap}
.composer-card:not(.open){padding:8px 10px}
.composer-card:not(.open) textarea{min-height:40px;height:40px;padding:9px 12px;font-size:15px}
.post-list > .feed-sec:first-child{display:none}
.feed-sec{font-size:17px;margin:12px 4px 8px}
}
/* ---- Avatars behind the game's round frame, like in the garden HUD (7.11.2026) ----
The ring is exactly the avatar's circle; the picture is enlarged (as in the HUD) so the character
fills the opening and its own edge stays under the ring. */
.post-avatar:not(.react-av),.composer-avatar,.v2-avatar,.nav-avatar{position:relative;overflow:hidden!important;border:0!important;box-shadow:none!important;background:#f3e7c9!important;border-radius:50%}
.post-avatar:not(.react-av) img,.composer-avatar img,.v2-avatar img,.nav-avatar img{width:100%!important;height:100%!important;border-radius:50%;object-fit:cover;transform:scale(1.22)}
.post-avatar:not(.react-av)::after,.composer-avatar::after,.v2-avatar::after,.nav-avatar::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;
background:url(https://media.plantoria.net/game/uploads/optimized/User_frame---2.webp) 49% 49%/124% auto no-repeat}
/* ---- Phones, top of the feed: round avatar button, no dead space, tabs scroll with the page (7.11.2026) ---- */
@media (max-width:640px){
.v2-nav .v2-user{width:42px;height:42px;padding:0!important;border-radius:50%;display:grid;place-items:center;background:transparent!important;border:0!important;box-shadow:none!important}
.v2-nav .v2-user > span:not(.v2-avatar){display:none}
.v2-nav .v2-avatar{width:38px!important;height:38px!important;padding:0!important;margin:0}
.feed-col{gap:8px!important;row-gap:8px!important}
.cat-tabs{position:static!important;margin:0 -4px!important;padding:2px 2px 0!important}
.cat-tab{height:34px!important;min-height:0!important;line-height:1;display:inline-flex;align-items:center}
.cat-tab.active{box-shadow:0 2px 0 #c9971f!important}
#composer .fb-bar{gap:7px}
#composer .fb-bar .fb-av{position:relative;overflow:visible}
#composer .fb-bar .fb-av img{border-radius:50%;transform:scale(1.22);clip-path:circle(41% at 50% 50%)}
#composer .fb-bar .fb-av::after{content:"";position:absolute;inset:0;pointer-events:none;
background:url(https://media.plantoria.net/game/uploads/optimized/User_frame---2.webp) 49% 49%/124% auto no-repeat}
#composer .fb-tool{flex:0 0 38px;height:38px;border:0;border-radius:50%;background:#f4ead3;font:900 13px Nunito,system-ui,sans-serif;color:#7a5a1a;cursor:pointer}
#composer .fb-pill{padding:0 12px;font-size:14.5px}
}
/* ---- Phones, Create post sheet like the desktop composer (7.11.2026 night) ----
Tools + a big Post button in a bar at the bottom of the sheet; the sheet follows the visible area
(social-v2.js sets its height), so the phone keyboard never covers the bar. Pickers open above it. */
@media (max-width:640px){
#composer .fb-bar .fb-av{overflow:hidden!important;border-radius:50%}
#composer .fb-bar .fb-av img{clip-path:none!important;transform:scale(1.22)!important}
#composer.open{display:flex!important;flex-direction:column;height:var(--pl-vvh,100dvh)!important;bottom:auto!important;padding-bottom:0!important}
#composer.open .fb-post{display:none!important}
#composer.open .composer-toolbar{order:50;position:sticky;bottom:0;z-index:3;margin:auto -14px 0;padding:10px 14px calc(10px + env(safe-area-inset-bottom));
background:var(--v2-paper,#fdf8ec);border-top:1px solid #ecdcb8;display:flex!important;align-items:center;justify-content:space-between;gap:8px}
#composer.open .composer-toolbar .tool-btn{width:44px;height:44px;font-size:20px}
#composer.open .composer-toolbar #btn-post{display:inline-flex!important;align-items:center;justify-content:center;min-width:120px;height:48px;
font-size:18px;border-radius:999px}
#composer.open .picker{order:40;max-height:42vh;overflow-y:auto}
#composer.open .gif-grid img{background:linear-gradient(110deg,#efe3c6 30%,#f8efdb 50%,#efe3c6 70%);background-size:200% 100%;animation:pl-shimmer 1.2s linear infinite;min-height:90px}
body.fb-sheet-on .plc{display:none!important}
}
@keyframes pl-shimmer{to{background-position:-200% 0}}
/* frame slightly larger than the picture's circle: no sliver of the picture outside the ring */
.post-avatar:not(.react-av)::after,.composer-avatar::after,.v2-avatar::after,.nav-avatar::after{background-size:132% auto!important;background-position:49% 50%!important;z-index:3!important}
@media (max-width:640px){
#composer .fb-bar .fb-av::after{background-size:132% auto!important;background-position:49% 50%!important;z-index:3!important}
#composer.open > *{flex-shrink:0}
}
@media (max-width:640px){
#composer.open .picker{position:relative!important;inset:auto!important;z-index:1!important;width:auto!important;margin:8px 0 10px!important;box-shadow:none!important}
#composer.open .composer-toolbar{z-index:5!important}
}
/* Back button on post / profile / plant pages (7.11.2026) */
.v2-back{display:inline-flex;align-items:center;gap:2px;height:38px;padding:0 12px 0 6px;margin-right:6px;border-radius:999px;
background:rgba(255,255,255,.12);color:#fff8e6;font:900 15px Nunito,system-ui,sans-serif;text-decoration:none;flex:0 0 auto}
.v2-back:active{transform:scale(.96)}
@media (max-width:640px){
.v2-nav .v2-left:has(.v2-back) .v2-play{display:none}
.v2-nav .v2-left:has(.v2-back) .v2-logo img{width:34px;height:34px}
}
@media (max-width:640px){ body:has(.v2-back) .crumb{display:none} }
/* Post page: a single photo is shown whole, like in the feed (no 4:3 crop) (7.11.2026) */
.post-photo-gallery img:only-child{aspect-ratio:auto;height:auto;max-height:none;object-fit:contain}
/* Endless feed: the load-more button is only a quiet "loading" line; page links kept for crawlers */
.btn-load-more.pl-auto{background:none!important;border:0!important;box-shadow:none!important;color:var(--v2-muted,#9a8a6a);font-weight:800;width:100%;padding:18px 0;cursor:default}
.pagination.pl-seo-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* Reputation: best place on the leaderboard page (top 10) next to the name (8.11.2026) */
.rep-chip{position:relative;z-index:2;display:inline-flex;align-items:center;gap:4px;margin-left:6px;padding:2px 9px 2px 3px;border-radius:999px;vertical-align:middle;
font:800 12px/1.6 Nunito,system-ui,sans-serif;text-decoration:none;white-space:nowrap;color:#5a3d0c;background:linear-gradient(180deg,#fff3cf,#f6dc9a);box-shadow:inset 0 0 0 1px #e2b85a}
.rep-chip img{width:18px;height:18px;object-fit:contain;border-radius:50%}
.rep-chip.rep-r1{color:#5a3d0c;background:linear-gradient(180deg,#ffe98a,#f0b52e);box-shadow:inset 0 0 0 1px #c98a10,0 1px 4px #f0b52e66}
.rep-chip.rep-r2{color:#3d4652;background:linear-gradient(180deg,#f4f7fb,#c9d2dd);box-shadow:inset 0 0 0 1px #9aa6b4}
.rep-chip.rep-r3{color:#5a2f12;background:linear-gradient(180deg,#ffd9b8,#d98f55);box-shadow:inset 0 0 0 1px #b06a35}
.rep-chip.rep-r4{color:#6a5a3a;background:#f3ead6;box-shadow:inset 0 0 0 1px #e2d3b0}
.rep-chip:hover{filter:brightness(1.05)}
/* Feed: the whole picture, no crop (tall photos keep their shape, up to the screen height) (8.11.2026) */
.post-photo img{max-height:min(88vh,980px);object-fit:contain}
/* 8.11.2026: post header on narrow screens: name, level, reputation chip and Follow wrap onto a
second line instead of running under the ⋯ report button and off the card */
.post-head .post-head-text{flex:1;min-width:0}
.post-author{flex-wrap:wrap;row-gap:4px;min-width:0}
.post-author .rep-chip{margin-left:0;max-width:100%;overflow:hidden;text-overflow:ellipsis}
@media (max-width:560px){
.post-author{gap:6px}
.post-author .rep-chip{font-size:11px;padding:1px 8px 1px 2px}
.post-author .rep-chip img{width:16px;height:16px}
.post-author .post-follow{margin-left:0;padding:2px 11px;font-size:12px;line-height:1.3;border:1.5px solid #e2b13c!important;border-radius:999px;color:#a8700f;background:transparent!important;box-shadow:none!important}
}
/* 10.11.2026: several photos in a post, Facebook-style grid (s_render_photo_grid / photoGridHtml) */
.post-photo.photo-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:3px;background:#efe2c4}
.photo-grid .pg-cell{position:relative;grid-column:span 3;aspect-ratio:1/1;overflow:hidden;background:#e7d6b0}
.photo-grid .pg-cell img{width:100%;height:100%;max-height:none;object-fit:cover;display:block}
.photo-grid.pg-3 .pg-cell:first-child{grid-column:span 6;aspect-ratio:2/1}
.photo-grid.pg-5 .pg-cell:nth-child(n+3){grid-column:span 2}
.photo-grid.pg-6 .pg-cell{grid-column:span 2}
.photo-grid .pg-more{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.45);color:#fff;font:900 34px/1 Nunito,system-ui,sans-serif}
.photo-grid img[data-lightbox]{cursor:zoom-in}
/* composer: thumbnails of the photos added (button, several files or Ctrl+V) */
.photo-previews{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}
.photo-previews[hidden]{display:none}
.photo-thumb{position:relative;width:92px;height:92px;border-radius:12px;overflow:hidden;background:#efe2c4}
.photo-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.photo-thumb.is-uploading img{opacity:.45}
.photo-thumb.is-uploading::after{content:"";position:absolute;left:50%;top:50%;width:22px;height:22px;margin:-11px;border-radius:50%;border:3px solid #fff;border-top-color:transparent;animation:pgspin .8s linear infinite}
@keyframes pgspin{to{transform:rotate(360deg)}}
.photo-thumb .preview-remove{position:absolute;top:4px;right:4px}
/* 10.11.2026: post photos open in the lightbox from the feed too: above the card's stretched link */
.post-card .post-photo.pl-lb{position:relative;z-index:2}
.post-photo.pl-lb img,.photo-grid .pg-cell{cursor:zoom-in}
.photo-grid .pg-more{pointer-events:none}
.lightbox{z-index:2000}
.lightbox .lb-nav{position:absolute;top:50%;translate:0 -50%;width:48px;height:48px;border:0;border-radius:50%;background:rgba(255,255,255,.16);color:#fff;font:400 38px/1 system-ui,sans-serif;cursor:pointer;display:grid;place-items:center;padding:0 0 4px}
.lightbox .lb-nav:hover{background:rgba(255,255,255,.3)}
.lightbox .lb-nav[hidden]{display:none}
.lightbox .lb-prev{left:14px}
.lightbox .lb-next{right:14px}
.lightbox .lb-count{position:absolute;top:16px;left:50%;translate:-50% 0;color:#fff;font:800 14px/1 Nunito,system-ui,sans-serif;opacity:.85}
/* Sold section on profiles (10.11.2026): diagonal ribbon across the top-right corner */
.shop-card.is-sold .shop-card-art{overflow:hidden}
.shop-card.is-sold .shop-card-art img{filter:saturate(.9) drop-shadow(0 6px 16px rgba(40,50,30,.12))}
.sold-ribbon{position:absolute;top:18px;right:-38px;width:150px;rotate:45deg;text-align:center;background:linear-gradient(#e0533d,#c23a26);color:#fff;font:900 13px/1 Nunito,system-ui,sans-serif;letter-spacing:.18em;text-transform:uppercase;padding:7px 0;box-shadow:0 3px 8px rgba(120,30,10,.3);border-top:1px dashed rgba(255,255,255,.45);border-bottom:1px dashed rgba(255,255,255,.45);pointer-events:none}
.sold-section .shop-visit-link{cursor:default}
.sold-section .shop-section-head{flex-wrap:wrap;gap:2px 12px}
/* Feed = same as the post page (11.11.2026): the likes row opens "Liked by", the text can be selected and
copied; the post page opens from the time, the photo and the comment count. */
.post-card .post-body,.post-card .post-reactions,.post-card .post-time-link{position:relative;z-index:2}
.post-card .post-body{cursor:text;-webkit-user-select:text;user-select:text}
.post-time-link{color:inherit;text-decoration:none}
.post-time-link:hover{text-decoration:underline}