/* SpillHour v3.0 — Complete Stylesheet */
:root {
  --p:#7B2FFF;--p2:#9B59FF;--cyan:#00D4FF;--amber:#FFB800;--green:#00E5A0;--red:#FF4757;
  --grad:linear-gradient(135deg,#7B2FFF 0%,#00D4FF 100%);
  --bg0:#07071A;--bg1:#0E0E28;--bg2:#151530;--bg3:#1C1C3A;
  --s1:#242448;--s2:#2E2E58;
  --border:rgba(123,47,255,0.18);--bord2:rgba(123,47,255,0.35);
  --t1:#F2EEFF;--t2:#B0A8D0;--t3:#6A6490;
  --glow:0 4px 32px rgba(123,47,255,0.22);--r:12px;
  --nav-h:58px;--card-bg:#151530;--input-bg:#1C1C3A;--shadow:0 2px 12px rgba(0,0,0,0.4);
}
body.sh-theme-light {
  --bg0:#F4F2FF;--bg1:#EDE9FF;--bg2:#FFFFFF;--bg3:#F0EEFF;
  --s1:#E8E3FF;--s2:#DDD6FF;
  --border:rgba(123,47,255,0.15);--bord2:rgba(123,47,255,0.30);
  --t1:#160A2E;--t2:#3D2C6A;--t3:#7C6BA0;
  --card-bg:#FFFFFF;--input-bg:#F0EEFF;--shadow:0 2px 8px rgba(123,47,255,0.08);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:'DM Sans',sans-serif;background:var(--bg0);color:var(--t1);min-height:100vh;overflow-x:hidden;line-height:1.5;transition:background .25s,color .25s}
a{color:inherit;text-decoration:none}
button{cursor:pointer;font-family:inherit}
img{max-width:100%;height:auto;display:block}
::-webkit-scrollbar{width:4px;height:4px}
::-webkit-scrollbar-track{background:var(--bg1)}
::-webkit-scrollbar-thumb{background:var(--s2);border-radius:20px}
h1,h2,h3{font-family:'Syne',sans-serif}
.sh-grad-text{background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}

/* NAV */
.sh-nav{position:fixed!important;top:0;left:0;right:0;height:var(--nav-h);z-index:999;background:rgba(7,7,26,0.97);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-bottom:1px solid var(--border);transition:background .25s}
body.sh-theme-light .sh-nav{background:rgba(255,255,255,0.97)}
.sh-nav-inner{max-width:1280px;margin:0 auto;height:100%;padding:0 16px;display:flex;align-items:center;gap:10px}
.sh-body-pad{padding-top:var(--nav-h)}
.sh-logo{font-family:'Syne',sans-serif;font-size:20px;font-weight:800;letter-spacing:-.8px;flex-shrink:0;display:flex;align-items:center}
.sh-logo-s{background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.sh-nav-search{flex:1;max-width:320px;position:relative}
.sh-search-icon{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--t3);pointer-events:none;font-size:13px}
.sh-search-inp{width:100%;background:var(--bg3);border:1px solid var(--border);color:var(--t1);padding:8px 12px 8px 32px;border-radius:10px;font-size:13px;font-family:'DM Sans',sans-serif;outline:none;transition:border-color .2s}
.sh-search-inp:focus{border-color:var(--p2)}
.sh-search-inp::placeholder{color:var(--t3)}
.sh-nav-tabs{display:flex;gap:2px;background:var(--bg3);border:1px solid var(--border);border-radius:11px;padding:3px;flex-shrink:0}
.sh-nav-tab{padding:6px 14px;border-radius:8px;font-size:13px;font-weight:600;color:var(--t3);white-space:nowrap;transition:all .2s}
.sh-nav-tab:hover:not(.active){color:var(--t1);background:var(--s1)}
.sh-nav-tab.active{background:var(--grad);color:#fff}
.sh-nav-right{margin-left:auto;display:flex;align-items:center;gap:7px}
.sh-btn-ghost{background:transparent;border:1px solid var(--bord2);color:var(--t2);padding:7px 14px;border-radius:9px;font-size:13px;font-weight:500;transition:all .2s;white-space:nowrap}
.sh-btn-ghost:hover{border-color:var(--p2);color:var(--t1)}
.sh-btn-primary{background:var(--grad);border:none;color:#fff;padding:7px 16px;border-radius:9px;font-size:13px;font-weight:700;transition:opacity .2s,transform .15s;white-space:nowrap;display:inline-block;text-align:center}
.sh-btn-primary:hover{opacity:.88;transform:scale(1.02)}
.sh-btn-primary:active{transform:scale(.97)}
.sh-btn-ask{background:linear-gradient(135deg,var(--cyan),var(--p2));border:none;color:#fff;padding:7px 16px;border-radius:9px;font-size:13px;font-weight:700;white-space:nowrap}
.sh-theme-toggle{display:flex;gap:2px;background:var(--bg3);border:1px solid var(--border);border-radius:9px;padding:2px}
.sh-t-opt{width:28px;height:28px;border-radius:7px;font-size:12px;border:none;background:transparent;color:var(--t3);display:flex;align-items:center;justify-content:center;transition:all .2s}
.sh-t-opt.active{background:var(--grad)}
.sh-notif-wrap{position:relative}
.sh-notif-btn{background:var(--bg3);border:1px solid var(--border);color:var(--t2);width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:16px;position:relative;transition:border-color .2s}
.sh-notif-btn:hover{border-color:var(--p2)}
.sh-notif-badge{position:absolute;top:-4px;right:-4px;background:var(--red);color:#fff;border-radius:20px;font-size:9px;font-weight:800;padding:1px 5px;min-width:15px;text-align:center}
.sh-notif-drop{display:none;position:absolute;right:0;top:calc(100% + 8px);width:290px;background:var(--bg2);border:1px solid var(--bord2);border-radius:12px;box-shadow:var(--glow);z-index:500;overflow:hidden}
.sh-notif-wrap.open .sh-notif-drop{display:block;animation:shFadeUp .2s ease}
.sh-notif-head{display:flex;align-items:center;justify-content:space-between;padding:11px 14px;border-bottom:1px solid var(--border);font-size:13px;font-weight:700}
.sh-notif-mark{font-size:11px;color:var(--p2);background:transparent;border:none;cursor:pointer}
.sh-notif-item{display:flex;gap:9px;padding:10px 14px;border-bottom:1px solid rgba(255,255,255,0.04);transition:background .15s;text-decoration:none}
.sh-notif-item:hover{background:var(--bg3)}
.sh-notif-item.unread{background:rgba(123,47,255,0.07)}
.sh-notif-ico{font-size:16px;flex-shrink:0}
.sh-notif-txt{flex:1;font-size:12px;color:var(--t2);line-height:1.45}
.sh-notif-time{font-size:10px;color:var(--t3);margin-top:2px}
.sh-notif-empty{padding:18px;text-align:center;color:var(--t3);font-size:13px}
.sh-user-menu{position:relative}
.sh-user-btn{display:flex;align-items:center;gap:6px;background:var(--bg3);border:1px solid var(--border);color:var(--t1);padding:4px 10px 4px 4px;border-radius:9px;font-size:13px;font-weight:600;transition:border-color .2s}
.sh-user-btn:hover{border-color:var(--p2)}
.sh-uname{max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sh-udrop{display:none;position:absolute;right:0;top:calc(100% + 8px);min-width:200px;background:var(--bg2);border:1px solid var(--bord2);border-radius:11px;padding:4px;box-shadow:var(--glow);z-index:500}
body.sh-theme-light .sh-udrop{background:#FFFFFF}
.sh-user-menu.open .sh-udrop{display:block;animation:shFadeUp .2s ease}
.sh-udrop a,.sh-udrop button{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:7px;font-size:13px;color:var(--t2);transition:all .15s;width:100%;text-align:left;border:none;background:transparent;cursor:pointer;font-family:inherit}
.sh-udrop a:hover,.sh-udrop button:hover{background:var(--s1);color:var(--t1)}
.sh-udrop-div{height:1px;background:var(--border);margin:3px 8px}
.sh-v-badge{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;background:var(--p);border-radius:50%;font-size:8px;color:#fff;font-weight:900;vertical-align:middle;margin-left:2px;flex-shrink:0}
.sh-p-badge{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;background:var(--amber);border-radius:50%;font-size:8px;color:#000;font-weight:900;vertical-align:middle;margin-left:2px;flex-shrink:0}
.sh-ham{display:none;flex-direction:column;gap:5px;background:transparent;border:1px solid var(--border);padding:6px 8px;border-radius:8px}
.sh-ham span{width:18px;height:2px;background:var(--t2);border-radius:2px;transition:all .25s;display:block}
.sh-ham.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.sh-ham.open span:nth-child(2){opacity:0}
.sh-ham.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.sh-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.55);z-index:150}
.sh-overlay.open{display:block}

/* LAYOUT */
.sh-layout{display:grid;grid-template-columns:220px 1fr 268px;gap:16px;max-width:1280px;margin:0 auto;padding:18px 16px 60px;position:relative;z-index:1}
.sh-center{min-width:0}

/* SIDEBAR LEFT */
.sh-sidebar-l{position:sticky;top:calc(var(--nav-h) + 14px);align-self:start;max-height:calc(100vh - var(--nav-h) - 28px);overflow-y:auto;display:flex;flex-direction:column;gap:1px;scrollbar-width:none}
.sh-sidebar-l::-webkit-scrollbar{display:none}
.sh-sl-label{font-size:10px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--t3);padding:10px 10px 3px}
.sh-sl-item{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:9px;font-size:13px;font-weight:500;color:var(--t2);transition:all .15s;text-decoration:none;border:none;background:transparent;width:100%;text-align:left;cursor:pointer}
.sh-sl-item:hover{background:var(--bg3);color:var(--t1)}
.sh-sl-item.active{background:rgba(123,47,255,0.15);color:var(--p2);font-weight:600}
.sh-sl-ico{font-size:14px;width:18px;text-align:center;flex-shrink:0}
.sh-sl-badge{margin-left:auto;font-size:10px;font-weight:700;padding:2px 6px;border-radius:20px;background:var(--s1);color:var(--t3)}
.sh-sl-item.active .sh-sl-badge{background:rgba(123,47,255,0.25);color:var(--p2)}
.sh-sl-div{height:1px;background:var(--border);margin:4px 10px}
.sh-sl-action{background:var(--bg3)!important;border:1px solid var(--border)!important;border-radius:9px!important;margin:1px 4px!important;font-weight:600!important}
.sh-sl-action:hover{background:var(--s1)!important;border-color:var(--p2)!important}

/* SIDEBAR RIGHT */
.sh-sidebar-r{position:sticky;top:calc(var(--nav-h) + 14px);align-self:start;max-height:calc(100vh - var(--nav-h) - 28px);overflow-y:auto;display:flex;flex-direction:column;gap:12px;scrollbar-width:none}
.sh-sidebar-r::-webkit-scrollbar{display:none}

/* WIDGETS */
.sh-widget{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--r);padding:14px;transition:background .25s,border-color .25s}
.sh-whead{font-family:'Syne',sans-serif;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:1px;color:var(--t3);margin-bottom:11px;display:flex;align-items:center;gap:5px}

/* HERO */
.sh-hero{background:linear-gradient(135deg,rgba(123,47,255,0.12),rgba(0,212,255,0.06));border:1px solid var(--bord2);border-radius:16px;padding:18px 20px;margin-bottom:14px;display:flex;align-items:center;gap:14px;position:relative;overflow:hidden}
.sh-hero-txt h1{font-family:'Syne',sans-serif;font-size:18px;font-weight:800;margin-bottom:5px;line-height:1.25}
.sh-hero-txt p{font-size:13px;color:var(--t2);line-height:1.55}
.sh-hero-actions{margin-left:auto;display:flex;gap:7px;flex-shrink:0;flex-wrap:wrap}

/* COMPOSE */
.sh-compose{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--r);padding:10px 12px;display:flex;align-items:center;gap:8px;margin-bottom:12px;cursor:pointer;transition:border-color .2s}
.sh-compose:hover{border-color:var(--p2)}
.sh-compose-inp{flex:1;background:transparent;border:none;color:var(--t3);font-size:13px;font-family:'DM Sans',sans-serif;outline:none;pointer-events:none}
.sh-ava{width:32px;height:32px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;flex-shrink:0;color:#fff;font-family:'Syne',sans-serif;overflow:hidden}
.sh-ava-g{background:var(--grad)}

/* SORT TABS */
.sh-sort-tabs{display:flex;gap:2px;margin-bottom:12px;background:var(--bg3);border:1px solid var(--border);border-radius:10px;padding:3px;overflow-x:auto;scrollbar-width:none;transition:background .25s}
.sh-sort-tabs::-webkit-scrollbar{display:none}
.sh-sort-tab{flex:1;text-align:center;padding:6px 4px;border-radius:8px;font-size:12px;font-weight:600;color:var(--t3);transition:all .2s;white-space:nowrap;flex-shrink:0;text-decoration:none;display:block}
.sh-sort-tab.active{background:var(--s2);color:var(--t1)}
.sh-sort-tab:hover:not(.active){color:var(--t2)}

/* SEC LABEL */
.sh-sec-label{display:flex;align-items:center;gap:8px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--t3);margin-bottom:10px}
.sh-sec-label::after{content:'';flex:1;height:1px;background:var(--border)}

/* POST CARD */
.sh-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--r);padding:14px;margin-bottom:8px;animation:shFadeUp .3s ease both;transition:border-color .2s,box-shadow .2s,transform .15s,background .25s}
.sh-card:hover{border-color:var(--p2);box-shadow:var(--glow);transform:translateY(-1px)}
@keyframes shFadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.sh-card[data-type="question"]{border-left:3px solid var(--cyan)}
.sh-card[data-type="spill"]{border-left:3px solid var(--p)}
.sh-card[data-type="post"]{border-left:3px solid var(--amber)}
.sh-card-meta{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.sh-meta-info{flex:1;min-width:0}
.sh-meta-user{font-size:12px;font-weight:700;color:var(--t1);display:flex;align-items:center;gap:3px;flex-wrap:wrap}
.sh-meta-user a:hover{color:var(--p2)}
.sh-meta-comm{font-size:11px;color:var(--p2);font-weight:500}
.sh-meta-comm a:hover{text-decoration:underline}
.sh-meta-time{font-size:11px;color:var(--t3);flex-shrink:0}
.sh-type-label{display:inline-flex;align-items:center;gap:2px;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;padding:2px 7px;border-radius:20px;flex-shrink:0;white-space:nowrap}
.sh-type-spill{background:rgba(123,47,255,0.12);color:var(--p2)}
.sh-type-question{background:rgba(0,212,255,0.1);color:var(--cyan)}
.sh-type-post{background:rgba(255,184,0,0.1);color:var(--amber)}
.sh-card-title{font-family:'Syne',sans-serif;font-size:15px;font-weight:700;line-height:1.35;margin-bottom:7px;word-break:break-word}
.sh-card-title a:hover{color:var(--p2)}
.sh-qa-qmark{color:var(--cyan);font-weight:900;margin-right:3px;-webkit-text-fill-color:var(--cyan)}
.sh-card-body{font-size:13px;color:var(--t2);line-height:1.6;margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}
.sh-card-tags{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:9px}
.sh-tag{background:rgba(123,47,255,0.1);color:var(--p2);border:1px solid rgba(123,47,255,0.18);padding:2px 8px;border-radius:20px;font-size:11px;font-weight:600;transition:background .15s}
.sh-tag:hover{background:rgba(123,47,255,0.2)}
.sh-tag.c{background:rgba(0,212,255,0.08);color:var(--cyan);border-color:rgba(0,212,255,0.16)}
.sh-qa-ans-box{background:var(--bg3);border-radius:9px;padding:9px 12px;margin-bottom:8px;border-left:3px solid var(--cyan)}
.sh-qa-ans-lbl{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.9px;color:var(--cyan);margin-bottom:3px}
.sh-qa-ans-txt{font-size:12px;color:var(--t2);line-height:1.55}

/* CARD FOOTER */
.sh-card-foot{display:flex;align-items:center;gap:5px;flex-wrap:wrap;padding-top:9px;border-top:1px solid rgba(255,255,255,0.05)}
body.sh-theme-light .sh-card-foot{border-top-color:rgba(123,47,255,0.08)}
.sh-votes{display:flex;align-items:center;gap:1px;background:var(--bg3);border:1px solid var(--border);border-radius:8px;padding:2px}
.sh-vbtn{width:24px;height:24px;border:none;background:transparent;color:var(--t3);font-size:10px;border-radius:6px;display:flex;align-items:center;justify-content:center;transition:all .15s}
.sh-vbtn:hover{background:rgba(123,47,255,0.15);color:var(--p2)}
.sh-vbtn.voted-up{background:rgba(123,47,255,0.2);color:var(--p2)}
.sh-vbtn.voted-down{background:rgba(255,71,87,0.15);color:var(--red)}
.sh-vscore{font-size:12px;font-weight:800;color:var(--t1);padding:0 5px;font-family:'Syne',sans-serif;min-width:20px;text-align:center}
.sh-act-btn{display:flex;align-items:center;gap:4px;border:1px solid var(--border);background:var(--bg3);color:var(--t3);font-size:11px;padding:4px 8px;border-radius:7px;transition:all .15s;white-space:nowrap;cursor:pointer;font-family:inherit}
.sh-act-btn:hover{color:var(--t1);border-color:var(--p2)}
.sh-ai-btn{display:flex;align-items:center;gap:3px;background:linear-gradient(90deg,rgba(123,47,255,0.12),rgba(0,212,255,0.08));border:1px solid rgba(0,212,255,0.18);color:var(--cyan);font-size:10px;font-weight:700;padding:3px 8px;border-radius:20px;white-space:nowrap;cursor:pointer;font-family:inherit}
.sh-ai-btn:hover{background:linear-gradient(90deg,rgba(123,47,255,0.2),rgba(0,212,255,0.14))}
.sh-wa-btn{background:rgba(37,211,102,0.09)!important;color:#25D366!important;border-color:rgba(37,211,102,0.18)!important}
.sh-anon-tag{background:rgba(0,229,160,0.08);border:1px solid rgba(0,229,160,0.16);color:var(--green);font-size:10px;font-weight:700;padding:2px 8px;border-radius:20px}
.sh-ans-badge{background:rgba(0,229,160,0.08);color:var(--green);border:1px solid rgba(0,229,160,0.16);font-size:10px;font-weight:700;padding:2px 8px;border-radius:20px;margin-left:auto}
.sh-pend-badge{background:rgba(255,184,0,0.08);color:var(--amber);border:1px solid rgba(255,184,0,0.16);font-size:10px;font-weight:700;padding:2px 8px;border-radius:20px;margin-left:auto}
.sh-report-btn{font-size:11px;color:var(--t3);background:transparent;border:none;padding:3px 6px;border-radius:6px;margin-left:auto}
.sh-report-btn:hover{color:var(--red)}

/* MEDIA */
.sh-post-img{width:100%;border-radius:10px;max-height:340px;object-fit:cover;margin-bottom:9px}
.sh-post-gif{width:100%;border-radius:10px;max-height:260px;object-fit:contain;background:var(--bg3);margin-bottom:9px}
.sh-embed-wrap{position:relative;width:100%;padding-bottom:56.25%;border-radius:10px;overflow:hidden;background:var(--bg3);margin-bottom:9px}
.sh-embed-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:none}
.sh-embed-link-wrap{display:flex;align-items:center;justify-content:center;min-height:56px;border:1px solid var(--border);border-radius:10px}
.sh-embed-ext-link{font-size:13px;font-weight:700;color:var(--p2);padding:14px;display:block;width:100%;text-align:center}
.sh-quote-embed{display:block;background:var(--bg3);border:1px solid var(--border);border-left:3px solid var(--p2);border-radius:9px;padding:10px 12px;margin-bottom:9px;transition:border-color .2s}
.sh-quote-embed:hover{border-color:var(--p2)}
.sh-quote-title{font-size:13px;font-weight:700;color:var(--t1);margin-bottom:3px}
.sh-quote-body{font-size:11px;color:var(--t2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sh-feed-embed{cursor:pointer}
.sh-social-embed{max-width:100%;overflow:hidden;border-radius:10px;margin-bottom:9px}

/* BLOG CARD */
.sh-blog-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;margin-bottom:8px;display:flex;animation:shFadeUp .3s ease both;transition:border-color .2s,transform .15s,background .25s;border-left:3px solid var(--amber)}
.sh-blog-card:hover{border-color:var(--p2);transform:translateY(-1px);box-shadow:var(--glow)}
.sh-blog-thumb{width:140px;min-height:100px;flex-shrink:0;overflow:hidden}
.sh-blog-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.sh-blog-card:hover .sh-blog-thumb img{transform:scale(1.04)}
.sh-blog-content{padding:12px;flex:1;display:flex;flex-direction:column;min-width:0}
.sh-blog-title{font-family:'Syne',sans-serif;font-size:14px;font-weight:700;margin-bottom:5px;line-height:1.35;word-break:break-word}
.sh-blog-title a:hover{color:var(--p2)}
.sh-blog-excerpt{font-size:12px;color:var(--t2);line-height:1.5;flex:1;margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sh-blog-foot{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.sh-read-more{font-size:12px;font-weight:700;color:var(--p2);margin-left:auto}
.sh-read-more:hover{color:var(--cyan)}
.sh-read-time{font-size:11px;color:var(--t3)}

/* ADS */
.sh-ad-unit{background:var(--card-bg);border:1px solid var(--border);border-left:3px solid var(--p);border-radius:var(--r);padding:13px 14px;margin:7px 0;position:relative;animation:shFadeUp .3s ease both}
.sh-ad-label{position:absolute;top:9px;right:11px;font-size:8px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--t3);background:var(--bg3);padding:2px 7px;border-radius:20px;border:1px solid var(--border)}
.sh-ad-house{display:flex;align-items:flex-start;gap:11px;padding-right:50px}
.sh-ad-house-icon{font-size:24px;flex-shrink:0;margin-top:2px}
.sh-ad-title{font-family:'Syne',sans-serif;font-size:14px;font-weight:700;color:var(--t1);margin-bottom:4px}
.sh-ad-body{font-size:12px;color:var(--t2);line-height:1.5;margin-bottom:7px}
.sh-ad-cta{font-size:12px;font-weight:700;color:var(--p2)}
.sh-ad-footer{display:flex;align-items:center;justify-content:space-between;margin-top:9px;padding-top:7px;border-top:1px solid var(--border);font-size:10px;color:var(--t3)}
.sh-ad-footer a{color:var(--t3)}

/* TRENDING */
.sh-trend-row{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid rgba(255,255,255,0.04);transition:color .15s;text-decoration:none}
.sh-trend-row:last-child{border-bottom:none}
.sh-trend-row:hover .sh-trend-name{color:var(--p2)}
.sh-trend-n{font-size:10px;font-weight:800;color:var(--t3);width:14px;flex-shrink:0}
.sh-trend-d{flex:1;min-width:0}
.sh-trend-name{font-size:12px;font-weight:700;color:var(--t1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sh-trend-cnt{font-size:10px;color:var(--t3)}
.sh-theat{font-size:9px;font-weight:700;padding:2px 7px;border-radius:20px;flex-shrink:0}
.sh-theat.hot{background:rgba(255,71,87,0.1);color:var(--red)}
.sh-theat.rising{background:rgba(255,184,0,0.09);color:var(--amber)}
.sh-theat.new{background:rgba(0,229,160,0.08);color:var(--green)}

/* SPILL SCORE */
.sh-ss-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.sh-ss-ava{width:40px!important;height:40px!important;border-radius:11px!important;font-size:16px!important}
.sh-ss-name{font-size:13px;font-weight:700;color:var(--t1)}
.sh-ss-handle{font-size:11px;color:var(--t3)}
.sh-ss-bar-row{display:flex;justify-content:space-between;font-size:11px;margin-bottom:3px}
.sh-ss-bar-row span:last-child{color:var(--p2);font-weight:700}
.sh-ss-track{background:var(--bg3);border-radius:20px;height:4px;margin-bottom:8px;overflow:hidden}
.sh-ss-fill{height:100%;border-radius:20px;background:var(--grad);transition:width .6s ease}
.sh-ss-badges{display:flex;gap:4px;flex-wrap:wrap}
.sh-ss-badge{background:var(--bg3);border:1px solid var(--border);border-radius:6px;padding:3px 7px;font-size:11px;color:var(--t2)}

/* LEADERBOARD */
.sh-leaderboard-wrap{background:var(--card-bg);border:1px solid var(--border);border-radius:16px;padding:18px}
.sh-lb-tabs{display:flex;gap:2px;background:var(--bg3);border-radius:9px;padding:3px;margin-bottom:16px}
.sh-lb-tab{flex:1;text-align:center;padding:7px;border-radius:7px;font-size:12px;font-weight:700;border:none;background:transparent;color:var(--t3);transition:all .2s;cursor:pointer;font-family:inherit}
.sh-lb-tab.active{background:var(--grad);color:#fff}
.sh-lb-row{display:flex;align-items:center;gap:11px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,0.04)}
.sh-lb-row:last-child{border-bottom:none}
.sh-lb-rank{font-family:'Syne',sans-serif;font-size:16px;font-weight:800;width:28px;text-align:center;flex-shrink:0}
.sh-lb-ava{width:36px;height:36px;border-radius:10px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:800;color:#fff;font-family:'Syne',sans-serif;overflow:hidden}
.sh-lb-info{flex:1;min-width:0}
.sh-lb-name{font-size:13px;font-weight:700;color:var(--t1);display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.sh-lb-name a{color:var(--t1)}
.sh-lb-name a:hover{color:var(--p2)}
.sh-lb-level{font-size:11px;color:var(--t3);margin-top:1px}
.sh-lb-score{text-align:right;flex-shrink:0}
.sh-lb-sv{font-family:'Syne',sans-serif;font-size:15px;font-weight:800;background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.sh-lb-sl{font-size:10px;color:var(--t3);text-transform:uppercase;letter-spacing:.8px}

/* MODALS */
.sh-modal{display:none;position:fixed;inset:0;z-index:600;background:rgba(7,7,26,0.88);backdrop-filter:blur(8px);align-items:center;justify-content:center;padding:14px}
.sh-modal.open{display:flex}
body.sh-theme-light .sh-modal{background:rgba(100,80,160,0.5)}
.sh-modal-box{background:var(--bg2);border:1px solid var(--bord2);border-radius:16px;padding:20px;max-width:530px;width:100%;box-shadow:var(--glow);animation:shFadeUp .28s ease;max-height:90vh;overflow-y:auto}
body.sh-theme-light .sh-modal-box{background:#FFFFFF}
.sh-modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}
.sh-modal-head h2{font-family:'Syne',sans-serif;font-size:17px;font-weight:800}
.sh-modal-close{background:var(--bg3);border:1px solid var(--border);color:var(--t3);width:28px;height:28px;border-radius:7px;font-size:13px;display:flex;align-items:center;justify-content:center;transition:all .2s}
.sh-modal-close:hover{color:var(--t1);border-color:var(--p2)}
.sh-form-title{width:100%;background:var(--input-bg);border:1px solid var(--border);color:var(--t1);padding:10px 12px;border-radius:9px;font-size:15px;font-weight:600;font-family:'Syne',sans-serif;outline:none;transition:border-color .2s;margin-bottom:8px;display:block}
.sh-form-title:focus{border-color:var(--p2)}
.sh-form-title::placeholder{color:var(--t3);font-family:'DM Sans',sans-serif;font-weight:400;font-size:13px}
.sh-form-body{width:100%;background:var(--input-bg);border:1px solid var(--border);color:var(--t1);padding:10px 12px;border-radius:9px;font-size:13px;font-family:'DM Sans',sans-serif;outline:none;resize:vertical;transition:border-color .2s;margin-bottom:8px;display:block}
.sh-form-body:focus{border-color:var(--p2)}
.sh-form-body::placeholder{color:var(--t3)}
.sh-form-select{width:100%;background:var(--input-bg);border:1px solid var(--border);color:var(--t2);padding:9px 11px;border-radius:9px;font-size:13px;font-family:'DM Sans',sans-serif;outline:none;margin-bottom:8px;display:block}
.sh-media-toolbar{display:flex;gap:5px;flex-wrap:wrap;padding:7px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin-bottom:9px}
.sh-mbtn{display:flex;align-items:center;gap:4px;background:var(--bg3);border:1px solid var(--border);color:var(--t2);padding:5px 10px;border-radius:7px;font-size:11px;font-weight:600;transition:all .2s;cursor:pointer;font-family:inherit}
.sh-mbtn:hover,.sh-mbtn.active{border-color:var(--p2);color:var(--t1)}
.sh-anon-chk{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--t2);margin-left:auto;cursor:pointer}
.sh-anon-chk input{accent-color:var(--p)}
.sh-media-panel{margin-top:8px;animation:shFadeUp .2s ease}
.sh-char-count{font-size:10px;color:var(--t3);text-align:right;margin:-5px 0 7px}
.sh-form-submit{width:100%;padding:11px;font-size:14px;margin-top:4px}

/* AI SUMMARY MODAL */
.sh-sum-modal{display:none;position:fixed;inset:0;z-index:700;background:rgba(7,7,26,0.9);backdrop-filter:blur(10px);align-items:center;justify-content:center;padding:14px}
.sh-sum-modal.open{display:flex}
.sh-sum-box{background:var(--bg2);border:1px solid var(--bord2);border-radius:16px;padding:24px;max-width:400px;width:100%;box-shadow:var(--glow);animation:shFadeUp .28s ease}
.sh-sum-pt{display:flex;gap:9px;margin-bottom:9px;font-size:13px;color:var(--t2);line-height:1.5}
.sh-sum-dot{width:6px;height:6px;border-radius:50%;background:var(--grad);flex-shrink:0;margin-top:6px}
.sh-sum-close{margin-top:15px;width:100%;background:var(--grad);border:none;color:#fff;padding:10px;border-radius:9px;font-size:13px;font-weight:700;font-family:'DM Sans',sans-serif;cursor:pointer}

/* TOGGLE */
.sh-toggle{width:36px;height:20px;border-radius:20px;background:var(--p);position:relative;cursor:pointer;flex-shrink:0;transition:background .2s;border:none}
.sh-toggle::after{content:'';position:absolute;width:16px;height:16px;background:#fff;border-radius:50%;top:2px;right:2px;transition:all .2s}
.sh-toggle.off{background:var(--s2)}
.sh-toggle.off::after{right:unset;left:2px}

/* SINGLE POST */
.sh-single-post{background:var(--card-bg);border:1px solid var(--border);border-radius:16px;padding:20px;margin-bottom:14px}
.sh-single-title{font-family:'Syne',sans-serif;font-size:22px;font-weight:800;line-height:1.28;margin-bottom:13px;word-break:break-word}
.sh-single-body{font-size:15px;color:var(--t2);line-height:1.78;margin-bottom:13px;word-break:break-word}
.sh-single-body p{margin-bottom:11px}
.sh-single-body a{color:var(--p2);text-decoration:underline}
.sh-single-acts{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding-top:13px;border-top:1px solid var(--border)}
.sh-comments-section{background:var(--card-bg);border:1px solid var(--border);border-radius:16px;padding:16px}
.sh-comment{background:var(--bg3);border-radius:10px;padding:12px;margin-bottom:8px;border:1px solid rgba(255,255,255,0.03)}
.sh-comment.top-answer{border-color:rgba(0,212,255,0.2)}
.sh-comment-meta{display:flex;align-items:center;gap:7px;margin-bottom:8px;flex-wrap:wrap}
.sh-comment-author{font-size:12px;font-weight:700;color:var(--t1)}
.sh-comment-body{font-size:13px;color:var(--t2);line-height:1.6;word-break:break-word}
.sh-reply-inp{flex:1;background:transparent;border:none;color:var(--t1);font-size:13px;font-family:'DM Sans',sans-serif;outline:none;resize:none;min-height:34px}
.sh-breadcrumb{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--t3);margin-bottom:13px;flex-wrap:wrap}
.sh-breadcrumb a{color:var(--t3)}
.sh-breadcrumb a:hover{color:var(--p2)}

/* PROFILE */
.sh-profile-header{background:var(--card-bg);border:1px solid var(--border);border-radius:16px;overflow:hidden;margin-bottom:14px}
.sh-profile-cover{height:72px;background:linear-gradient(135deg,rgba(123,47,255,0.4),rgba(0,212,255,0.22))}
.sh-profile-info{display:flex;align-items:flex-start;gap:13px;padding:0 16px 16px;flex-wrap:wrap}
.sh-profile-ava{width:64px;height:64px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:800;color:#fff;margin-top:-26px;border:3px solid var(--card-bg);flex-shrink:0;font-family:'Syne',sans-serif;overflow:hidden}
.sh-profile-name{font-family:'Syne',sans-serif;font-size:18px;font-weight:800;margin-bottom:3px;display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.sh-profile-handle{font-size:12px;color:var(--t3);margin-bottom:7px}
.sh-profile-stats{display:flex;gap:16px}
.sh-pstat{font-size:12px;color:var(--t3);display:flex;flex-direction:column;gap:1px}
.sh-pstat span{font-size:15px;font-weight:800;color:var(--t1);font-family:'Syne',sans-serif}

/* AUTH FORMS */
.sh-auth-form-wrap{max-width:420px;margin:0 auto;padding:20px}
.sh-auth-tabs{display:flex;gap:3px;background:var(--bg3);border-radius:12px;padding:3px;margin-bottom:18px}
.sh-auth-tab{flex:1;padding:9px;border-radius:9px;font-size:14px;font-weight:700;cursor:pointer;border:none;background:transparent;color:var(--t3);font-family:'DM Sans',sans-serif;transition:all .2s}
.sh-auth-tab.active{background:var(--grad);color:white}
.sh-auth-inp{width:100%;background:var(--input-bg);border:1px solid var(--border);color:var(--t1);padding:12px 14px;border-radius:10px;font-size:14px;font-family:'DM Sans',sans-serif;outline:none;margin-bottom:10px;transition:border-color .2s;display:block}
.sh-auth-inp:focus{border-color:var(--p2)}
.sh-auth-inp::placeholder{color:var(--t3)}
.sh-auth-msg{font-size:13px;padding:8px 12px;border-radius:8px;margin-bottom:10px;display:none}
.sh-auth-msg.error{background:rgba(255,71,87,0.1);color:var(--red);border:1px solid rgba(255,71,87,0.2);display:block}
.sh-auth-msg.success{background:rgba(0,229,160,0.1);color:var(--green);border:1px solid rgba(0,229,160,0.2);display:block}

/* GIF GRID */
.sh-gif-item{border-radius:7px;overflow:hidden;cursor:pointer;aspect-ratio:16/9;background:var(--bg3)}
.sh-gif-item img{width:100%;height:100%;object-fit:cover;transition:transform .2s}
.sh-gif-item:hover img{transform:scale(1.05)}

/* EMPTY STATE */
.sh-empty{text-align:center;padding:48px 20px;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--r)}
.sh-empty-ico{font-size:42px;margin-bottom:13px}
.sh-empty h3{font-family:'Syne',sans-serif;font-size:18px;margin-bottom:6px}
.sh-empty p{color:var(--t2);font-size:13px;margin-bottom:16px}

/* PAGINATION */
.sh-pagination{margin-top:20px;display:flex;justify-content:center}
.sh-pagination .page-numbers{display:flex;gap:4px;list-style:none;flex-wrap:wrap;justify-content:center}
.sh-pagination .page-numbers li a,.sh-pagination .page-numbers li span{padding:7px 12px;border-radius:8px;font-size:13px;font-weight:600;background:var(--card-bg);border:1px solid var(--border);color:var(--t2);display:block;transition:all .2s}
.sh-pagination .page-numbers li a:hover{border-color:var(--p2);color:var(--t1)}
.sh-pagination .page-numbers li span.current{background:var(--grad);color:#fff;border-color:transparent}

/* FOOTER */
.sh-footer{background:var(--bg1);border-top:1px solid var(--border);margin-top:40px;position:relative;z-index:1}
.sh-footer-inner{max-width:1280px;margin:0 auto;padding:36px 16px 24px;display:grid;grid-template-columns:1fr 2fr;gap:36px}
.sh-footer-brand p{font-size:13px;color:var(--t2);line-height:1.6;margin-top:8px;max-width:250px}
.sh-footer-socials{display:flex;gap:11px;margin-top:13px}
.sh-footer-socials a{font-size:17px;transition:transform .2s}
.sh-footer-socials a:hover{transform:scale(1.2)}
.sh-footer-links{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.sh-footer-col h4{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--t3);margin-bottom:10px}
.sh-footer-col a{display:block;font-size:13px;color:var(--t2);padding:3px 0;transition:color .15s}
.sh-footer-col a:hover{color:var(--p2)}
.sh-footer-bottom{border-top:1px solid var(--border);padding:13px 16px;text-align:center;font-size:12px;color:var(--t3)}

/* TOAST */
#sh-toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(60px);background:var(--bg2);border:1px solid var(--bord2);color:var(--t1);padding:11px 20px;border-radius:11px;font-size:13px;font-weight:600;z-index:9999;transition:transform .3s,opacity .3s;opacity:0;pointer-events:none;box-shadow:var(--glow);white-space:nowrap;max-width:90vw;text-align:center}
#sh-toast.show{transform:translateX(-50%) translateY(0);opacity:1}

/* MOBILE SEARCH BAR */
.sh-mobile-search{display:none;position:fixed;top:var(--nav-h);left:0;right:0;z-index:998;background:rgba(7,7,26,0.97);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border);padding:5px 10px;height:44px;align-items:center;gap:6px}
body.sh-theme-light .sh-mobile-search{background:rgba(255,255,255,0.97)}
.sh-mobile-feed-tabs{display:flex;gap:3px;flex-shrink:0}
.sh-mobile-feed-tab{padding:5px 10px;font-size:11px;font-weight:700;border-radius:7px;text-decoration:none;border:1px solid var(--border);color:var(--t2);background:var(--bg2);white-space:nowrap;transition:all .15s;display:inline-block}
.sh-mobile-feed-tab.active,.sh-mobile-feed-tab:hover{background:var(--grad);color:white;border-color:transparent}
.sh-mobile-search-inp-wrap{flex:1;position:relative;min-width:0}
.sh-mobile-search-inp-wrap .sh-search-icon{position:absolute;left:8px;top:50%;transform:translateY(-50%);font-size:11px;pointer-events:none}
.sh-mobile-search input{width:100%;background:var(--bg3);border:1px solid var(--border);color:var(--t1);padding:7px 9px 7px 26px;border-radius:8px;font-size:13px;font-family:'DM Sans',sans-serif;outline:none}
.sh-mobile-search input:focus{border-color:var(--p2)}
.sh-mobile-search input::placeholder{color:var(--t3)}

/* ANIMATIONS */
@keyframes shFadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

/* LIGHT MODE OVERRIDES */
body.sh-theme-light .sh-card,body.sh-theme-light .sh-widget,body.sh-theme-light .sh-single-post,body.sh-theme-light .sh-comments-section,body.sh-theme-light .sh-blog-card,body.sh-theme-light .sh-profile-header,body.sh-theme-light .sh-compose,body.sh-theme-light .sh-leaderboard-wrap{background:#FFFFFF;border-color:rgba(123,47,255,0.12)}
body.sh-theme-light .sh-hero{background:linear-gradient(135deg,rgba(123,47,255,0.08),rgba(0,212,255,0.05))}
body.sh-theme-light .sh-sort-tabs,body.sh-theme-light .sh-lb-tabs{background:#EDE9FF;border-color:rgba(123,47,255,0.12)}
body.sh-theme-light .sh-sort-tab.active{background:var(--s2);color:var(--t1)}
body.sh-theme-light .sh-votes,body.sh-theme-light .sh-act-btn{background:var(--bg3);border-color:rgba(123,47,255,0.12)}
body.sh-theme-light .sh-footer{background:#EDE9FF;border-top-color:rgba(123,47,255,0.12)}
body.sh-theme-light .sh-sidebar-l{background:var(--bg1)}
body.sh-theme-light .sh-comment{background:var(--bg3);border-color:rgba(123,47,255,0.07)}
body.sh-theme-light .sh-notif-drop,body.sh-theme-light #sh-toast{background:#FFFFFF}
body.sh-theme-light .sh-qa-ans-box{background:rgba(0,212,255,0.06)}
body.sh-theme-light .sh-modal-box{background:#FFFFFF}

/* RESPONSIVE */
@media(max-width:1100px){.sh-layout{grid-template-columns:200px 1fr 250px;gap:12px}}
@media(max-width:860px){
  .sh-mobile-search{display:flex!important}
  .sh-body-pad{padding-top:calc(var(--nav-h) + 44px)!important}
  .sh-nav-search,.sh-nav-tabs,.sh-theme-toggle{display:none!important}
  .sh-ham{display:flex!important}
  .sh-layout{grid-template-columns:1fr!important;padding:10px 10px 40px}
  .sh-sidebar-l{position:fixed!important;left:-262px;top:calc(var(--nav-h) + 44px)!important;bottom:0;width:258px;background:var(--bg1);border-right:1px solid var(--border);z-index:160;padding:10px 8px 24px;transition:left .28s cubic-bezier(.4,0,.2,1);max-height:calc(100vh - var(--nav-h) - 44px)!important;overflow-y:auto;scrollbar-width:none}
  .sh-sidebar-l::-webkit-scrollbar{display:none}
  .sh-sidebar-l.open{left:0!important;box-shadow:4px 0 24px rgba(0,0,0,0.5)!important}
  .sh-sidebar-r{position:static!important;max-height:none!important;overflow-y:visible!important}
  .sh-notif-drop{position:fixed!important;top:calc(var(--nav-h) + 44px)!important;left:0!important;right:0!important;width:100%!important;max-width:100vw!important;border-radius:0 0 14px 14px;max-height:60vh;overflow-y:auto;z-index:997}
  .sh-footer-inner{grid-template-columns:1fr;gap:20px}
  .sh-footer-links{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:600px){
  * {max-width:100%;box-sizing:border-box}
  .sh-layout{padding:8px 8px 36px}
  .sh-card,.sh-widget,.sh-single-post,.sh-comments-section,.sh-hero,.sh-compose,.sh-blog-card,.sh-profile-header{overflow:hidden}
  .sh-card-title,.sh-single-title,.sh-blog-title,.sh-card-body,.sh-single-body,.sh-comment-body{word-break:break-word;overflow-wrap:break-word}
  .sh-card-foot{flex-wrap:wrap;gap:4px}
  .sh-blog-card{flex-direction:column}
  .sh-blog-thumb{width:100%;height:140px}
  .sh-hero{flex-direction:column;gap:10px;padding:13px}
  .sh-hero-actions{margin-left:0}
  .sh-compose .sh-btn-primary{display:none}
  .sh-single-title{font-size:17px!important}
  .sh-single-acts{flex-wrap:wrap;gap:5px}
  .sh-profile-stats{gap:10px;flex-wrap:wrap}
  .sh-sort-tabs{overflow-x:auto}
  .sh-sort-tab{min-width:60px}
  .sh-footer-links{grid-template-columns:1fr}
  .sh-modal-box{padding:14px}
}
@media(min-width:861px){.sh-mobile-search{display:none!important}.sh-mobile-feed-tabs{display:none!important}}

/* ── DARK/LIGHT MODE — apply to :root AND html for full coverage ── */
html.sh-theme-light,
html.sh-theme-light body {
  --bg0:#F4F2FF;--bg1:#EDE9FF;--bg2:#FFFFFF;--bg3:#F0EEFF;
  --s1:#E8E3FF;--s2:#DDD6FF;
  --border:rgba(123,47,255,0.15);--bord2:rgba(123,47,255,0.30);
  --t1:#160A2E;--t2:#3D2C6A;--t3:#7C6BA0;
  --card-bg:#FFFFFF;--input-bg:#F0EEFF;
  --shadow:0 2px 8px rgba(123,47,255,0.08);
  background:#F4F2FF;
  color:#160A2E;
}
html.sh-theme-light .sh-nav { background:rgba(255,255,255,0.97)!important; border-bottom-color:rgba(123,47,255,0.12)!important; }
html.sh-theme-light .sh-mobile-search { background:rgba(255,255,255,0.97)!important; }
html.sh-theme-light .sh-sidebar-l { background:#EDE9FF!important; }
html.sh-theme-light .sh-card,
html.sh-theme-light .sh-widget,
html.sh-theme-light .sh-single-post,
html.sh-theme-light .sh-comments-section,
html.sh-theme-light .sh-blog-card,
html.sh-theme-light .sh-profile-header,
html.sh-theme-light .sh-compose,
html.sh-theme-light .sh-leaderboard-wrap { background:#FFFFFF!important; border-color:rgba(123,47,255,0.12)!important; }
html.sh-theme-light .sh-hero { background:linear-gradient(135deg,rgba(123,47,255,0.08),rgba(0,212,255,0.05))!important; }
html.sh-theme-light .sh-sort-tabs,
html.sh-theme-light .sh-lb-tabs { background:#EDE9FF!important; border-color:rgba(123,47,255,0.12)!important; }
html.sh-theme-light .sh-votes,
html.sh-theme-light .sh-act-btn { background:#F0EEFF!important; border-color:rgba(123,47,255,0.12)!important; }
html.sh-theme-light .sh-footer { background:#EDE9FF!important; border-top-color:rgba(123,47,255,0.12)!important; }
html.sh-theme-light .sh-comment { background:#F0EEFF!important; border-color:rgba(123,47,255,0.07)!important; }
html.sh-theme-light .sh-notif-drop,
html.sh-theme-light .sh-udrop,
html.sh-theme-light .sh-modal-box,
html.sh-theme-light #sh-toast { background:#FFFFFF!important; }
html.sh-theme-light .sh-search-inp,
html.sh-theme-light .sh-form-body,
html.sh-theme-light .sh-form-title,
html.sh-theme-light .sh-form-select { background:#F0EEFF!important; color:#160A2E!important; border-color:rgba(123,47,255,0.2)!important; }
html.sh-theme-light body::before { display:none!important; }
html.sh-theme-light .sh-sort-tab.active { background:#DDD6FF!important; color:#160A2E!important; }
html.sh-theme-light .sh-qa-ans-box { background:rgba(0,212,255,0.06)!important; }

/* Ensure dark mode is the default — explicit */
html.sh-theme-dark,
html.sh-theme-dark body {
  --bg0:#07071A;--bg1:#0E0E28;--bg2:#151530;--bg3:#1C1C3A;
  --s1:#242448;--s2:#2E2E58;
  --border:rgba(123,47,255,0.18);--bord2:rgba(123,47,255,0.35);
  --t1:#F2EEFF;--t2:#B0A8D0;--t3:#6A6490;
  --card-bg:#151530;--input-bg:#1C1C3A;
  background:#07071A;color:#F2EEFF;
}

/* ════════════════════════════════════════════════════════════════
   PATCH 4 — Searchable community picker as a top-level bottom sheet.
   Triggers are simple buttons; sheets sit at document root so they
   can never inherit a broken flex containing-block from a parent.
   ════════════════════════════════════════════════════════════════ */
.sh-comm-trigger {
  background: var(--input-bg);
  border: 1px solid var(--border);
  color: var(--t2);
  padding: 9px 11px;
  border-radius: 9px;
  font-size: 13px;
  font-family: 'DM Sans', sans-serif;
  cursor: pointer;
  display: block;
}
.sh-comm-trigger:focus { border-color: var(--p2); outline: none; }
.sh-comm-trigger.has-value { color: var(--t1); font-weight: 600; }

.sh-comm-sheet {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 800;
  background: rgba(7,7,26,0.7);
  backdrop-filter: blur(4px);
  align-items: flex-end;
  justify-content: center;
}
.sh-comm-sheet.open { display: flex; }
.sh-comm-sheet-box {
  background: var(--bg2);
  width: 100%;
  max-width: 530px;
  max-height: 75vh;
  border-radius: 18px 18px 0 0;
  padding: 16px;
  display: flex;
  flex-direction: column;
  animation: shSheetUp .25s ease;
}
body.sh-theme-light .sh-comm-sheet-box,
html.sh-theme-light .sh-comm-sheet-box { background: #FFFFFF; }
@keyframes shSheetUp { from{transform:translateY(30px);opacity:0} to{transform:translateY(0);opacity:1} }
.sh-comm-sheet-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 15px;
  font-weight: 800;
  font-family: 'Syne', sans-serif;
  margin-bottom: 12px;
  flex-shrink: 0;
}
.sh-comm-sheet .sh-comm-filter {
  width: 100%;
  background: var(--bg3);
  border: 1px solid var(--border);
  color: var(--t1);
  padding: 10px 12px;
  border-radius: 9px;
  font-size: 13px;
  outline: none;
  margin-bottom: 10px;
  flex-shrink: 0;
}
.sh-comm-sheet .sh-comm-filter:focus { border-color: var(--p2); }
.sh-comm-sheet-list {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  flex: 1;
  min-height: 0;
}
.sh-comm-option {
  padding: 12px 10px;
  font-size: 14px;
  color: var(--t2);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 7px;
  touch-action: manipulation;
  border-radius: 8px;
}
.sh-comm-option:hover, .sh-comm-option.highlighted { background: var(--bg3); color: var(--t1); }
.sh-comm-option.selected { color: var(--p2); font-weight: 700; background: rgba(123,47,255,0.1); }
.sh-comm-empty { padding: 20px; text-align: center; color: var(--t3); font-size: 13px; }

/* PATCH 5 — general share button (replaces WhatsApp-only green styling) */
.sh-share-btn { background:rgba(123,47,255,0.08)!important; color:var(--p2)!important; border-color:rgba(123,47,255,0.18)!important; }
.sh-share-btn:hover { background:rgba(123,47,255,0.16)!important; }
