:root{--bg:#F6F5FB;--card:#fff;--ink:#262046;--sub:#6C678A;--line:#E7E4F4;--violet:#5B45D8;--violet-dk:#262046;--violet-deep:#1C1736;--gold:#F2B01E;--gold-dk:#D89A0C;--coral:#F4536E;--mint:#1FA98A}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Sora',system-ui,sans-serif;background:var(--bg);color:var(--ink);font-size:15px;line-height:1.55}
h1,h2,h3{font-family:'Bricolage Grotesque','Sora',sans-serif}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
a{color:var(--violet);text-decoration:none}
.linky:hover{text-decoration:underline}
.topbar{background:var(--violet-deep);color:#BFB9E0;font-size:12.5px}
.topbar .wrap{display:flex;justify-content:space-between;padding:7px 20px;gap:12px;flex-wrap:wrap}
.topbar b{color:var(--gold)}
.hdr{background:var(--violet-dk);color:#fff;position:sticky;top:0;z-index:50;box-shadow:0 2px 14px rgba(28,23,54,.35)}
.hdr .wrap{display:flex;align-items:center;gap:26px;padding-top:14px;padding-bottom:14px;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:10px}
.logo .tick{width:38px;height:30px;background:var(--gold);border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:17px;position:relative}
.logo .tick:before,.logo .tick:after{content:'';position:absolute;width:10px;height:10px;background:var(--violet-dk);border-radius:50%;top:10px}
.logo .tick:before{left:-5px}.logo .tick:after{right:-5px}
.logo .wm{font-family:'Bricolage Grotesque';font-weight:800;font-size:22px;letter-spacing:-.5px;color:#fff}
.logo .wm i{color:var(--gold);font-style:normal}
.nav{display:flex;gap:4px;flex-wrap:wrap;flex:1}
.nav a{color:#CFCAEA;font-size:14px;font-weight:500;padding:8px 12px;border-radius:8px}
.nav a:hover{background:rgba(255,255,255,.09);color:#fff}
.nav a.on{background:rgba(242,176,30,.15);color:var(--gold)}
.auth{display:flex;gap:10px;align-items:center}
.btn{display:inline-block;border:0;border-radius:10px;padding:10px 18px;font-weight:600;font-size:14px;cursor:pointer;font-family:inherit;text-align:center}
.btn-gold{background:var(--gold);color:#241C05;box-shadow:0 3px 0 var(--gold-dk)}
.btn-gold:hover{filter:brightness(1.05)}
.btn-vio{background:var(--violet);color:#fff}
.btn-line{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.35)}
.btn-ghost{background:#EFEDFA;color:var(--violet)}
.btn-danger{background:#FDECEF;color:#C22643}
.btn.sm{padding:6px 12px;font-size:13px;border-radius:8px}
.flash{background:#E5F6F1;border-bottom:1px solid #9ADFC9;color:#0E7A62;font-weight:600;font-size:14px}
.flash .wrap{padding:10px 20px}
.hero{background:linear-gradient(135deg,#2A2352 0%,#3B2E7E 55%,#5B45D8 100%);color:#fff}
.hero .wrap{padding-top:46px;padding-bottom:52px}
.hero h1{font-size:clamp(30px,4.6vw,50px);font-weight:800;letter-spacing:-1.2px;line-height:1.08;max-width:640px}
.hero h1 em{font-style:normal;color:var(--gold)}
.hero p{color:#CFC9EE;max-width:540px;margin-top:14px;font-size:16px}
.hero .cta{margin-top:24px;display:flex;gap:12px;flex-wrap:wrap}
.statline{background:var(--gold);color:#241C05;font-weight:600;font-size:13.5px}
.statline .wrap{display:flex;gap:28px;padding:9px 20px;flex-wrap:wrap}
.ad{border:2px dashed #CFC8EC;background:repeating-linear-gradient(-45deg,#FBFAFE,#FBFAFE 12px,#F4F2FC 12px,#F4F2FC 24px);border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#9A93BF;font-size:12px;gap:3px}
.ad b{font-size:13px;color:#7A72A8;letter-spacing:.4px}
.ad.leader,.ad-live.leader{min-height:92px;margin:22px 0}
.ad.box,.ad-live.box{min-height:250px}
.ad.half,.ad-live.half{min-height:600px}
.ad.infeed,.ad-live.infeed{min-height:240px;height:100%}
.ad-live{display:flex;align-items:center;justify-content:center;overflow:hidden}
.cols{display:grid;grid-template-columns:1fr 300px;gap:26px;align-items:start;padding:26px 0 50px}
@media(max-width:960px){.cols{grid-template-columns:1fr}}
.side{display:flex;flex-direction:column;gap:18px}
.panel{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px}
.panel h3{font-size:16px;margin-bottom:12px}
.cat-list a{display:flex;justify-content:space-between;padding:8px 10px;border-radius:8px;font-size:13.5px;color:var(--ink)}
.cat-list a:hover{background:#F1EFFA}
.cat-list a span{color:var(--sub)}
.sechead{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:8px 0 16px;flex-wrap:wrap}
.sechead h1,.sechead h2{font-size:24px;letter-spacing:-.5px}
.sechead .kick{color:var(--sub);font-size:13.5px}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.chip{border:1.5px solid var(--line);background:#fff;color:var(--sub);border-radius:999px;padding:7px 14px;font-size:13px;font-weight:600}
.chip.on{background:var(--violet);border-color:var(--violet);color:#fff}
.chip:hover:not(.on){border-color:#C9C2E8;color:var(--ink)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(255px,1fr));gap:18px}
.tcard{background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;position:relative;display:flex;flex-direction:column;transition:transform .15s,box-shadow .15s;color:var(--ink)}
.tcard:hover{transform:translateY(-4px);box-shadow:0 12px 26px rgba(38,32,70,.13)}
.tcard .art{height:110px;display:flex;align-items:center;justify-content:center;font-size:46px;position:relative}
.tcard .badges{position:absolute;top:10px;left:10px;display:flex;gap:6px}
.badge{font-size:10.5px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;padding:4px 8px;border-radius:6px;background:#fff;color:var(--ink)}
.badge.new{background:var(--mint);color:#fff}
.badge.hot{background:var(--gold);color:#241C05}
.badge.give{background:var(--coral);color:#fff}
.fav{position:absolute;top:8px;right:8px;background:rgba(255,255,255,.92);width:32px;height:32px;border-radius:50%;font-size:15px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(0,0,0,.12)}
.perf{position:relative;border-top:2px dashed #D9D4EF}
.perf:before,.perf:after{content:'';position:absolute;top:-8px;width:16px;height:16px;border-radius:50%;background:var(--bg);border:1px solid var(--line)}
.perf:before{left:-9px}.perf:after{right:-9px}
.tcard .body{padding:13px 15px 15px;display:flex;flex-direction:column;gap:7px;flex:1}
.tcard .spon{font-size:11px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--sub)}
.tcard h3{font-size:15.5px;line-height:1.3}
.tcard .short{font-size:13px;color:var(--sub);flex:1}
.meta{display:flex;gap:6px;flex-wrap:wrap}
.pill{font-size:11.5px;font-weight:600;padding:4px 9px;border-radius:999px;background:#F1EFFA;color:#584FA0}
.pill.time{background:#FFF4DB;color:#8A6205}
.pill.time.urgent{background:#FDE7EC;color:#C22643}
.pill.val{background:#E5F6F1;color:#0E7A62}
.crumb{padding:18px 0 0;font-size:13px;color:var(--sub)}
.detail{display:grid;grid-template-columns:1fr 300px;gap:26px;align-items:start;padding:18px 0 50px}
@media(max-width:960px){.detail{grid-template-columns:1fr}}
.dhead{background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.dhead .art{height:170px;display:flex;align-items:center;justify-content:center;font-size:76px}
.dhead .inner{padding:22px 24px}
.dhead h1{font-size:27px;letter-spacing:-.6px;line-height:1.15;margin:4px 0 10px}
.dgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin:16px 0}
.dstat{background:#F6F5FB;border-radius:10px;padding:10px 12px}
.dstat b{display:block;font-size:14px}
.dstat span{font-size:11px;color:var(--sub);text-transform:uppercase;letter-spacing:.5px}
.rules,.cmt{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px 24px;margin-top:18px}
.rules h2,.cmt h2{font-size:18px;margin-bottom:10px}
.rules p{color:#4B4569;margin-bottom:10px;white-space:pre-line}
.enterbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:6px}
.note{font-size:12.5px;color:var(--sub)}
.cmt-item{display:flex;gap:12px;padding:12px 0;border-top:1px solid var(--line)}
.avatar{width:36px;height:36px;border-radius:50%;background:var(--violet);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex-shrink:0}
.cmt-item .who{font-size:13px;font-weight:700}
.cmt-item .when{font-size:11.5px;color:var(--sub);font-weight:400;margin-left:6px}
.cmt-item p{font-size:14px;color:#4B4569;margin-top:2px}
textarea,input,select{font-family:inherit;font-size:14px;border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;width:100%;background:#fff;color:var(--ink)}
textarea:focus,input:focus,select:focus{outline:2px solid #C7BEF5;border-color:var(--violet)}
textarea{resize:vertical;min-height:74px}
.frow{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.frow label{font-size:12.5px;font-weight:700;color:#4B4569}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:640px){.f2{grid-template-columns:1fr}}
.thread{display:flex;gap:14px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-bottom:10px;color:var(--ink)}
.thread:hover{border-color:#C9C2E8;box-shadow:0 4px 12px rgba(38,32,70,.07)}
.thread .tt{flex:1}
.thread h3{font-size:15px}
.thread .sub{font-size:12.5px;color:var(--sub);margin-top:2px}
.thread .cnt{text-align:center;background:#F1EFFA;border-radius:10px;padding:6px 12px;font-size:12px;color:#584FA0;min-width:64px}
.thread .cnt b{display:block;font-size:16px}
.reply{display:flex;gap:12px;padding:14px 0;border-top:1px solid var(--line)}
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin:20px 0}
.tabs a{background:#EFEDFA;color:#584FA0;font-weight:600;font-size:13.5px;padding:9px 16px;border-radius:10px}
.tabs a.on{background:var(--violet);color:#fff}
.table{width:100%;border-collapse:collapse;font-size:13.5px}
.table th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--sub);padding:8px 10px;border-bottom:2px solid var(--line)}
.table td{padding:10px;border-bottom:1px solid var(--line);vertical-align:middle}
.empty{padding:40px;text-align:center;color:var(--sub)}
.empty .big{font-size:40px;margin-bottom:8px}
.authbox{max-width:420px;margin:46px auto 70px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:30px}
.authbox h1{font-size:24px;margin-bottom:4px}
.authbox .sub{color:var(--sub);font-size:13.5px;margin-bottom:20px}
.err{color:#C22643;font-size:13px;margin-bottom:12px}
.page{max-width:760px;margin:0 auto;padding:34px 20px 70px}
.page h1{font-size:30px;letter-spacing:-.6px;margin-bottom:6px}
.page .lede{color:var(--sub);margin-bottom:24px}
.page h2{font-size:19px;margin:24px 0 8px}
.page p,.page li{color:#4B4569;margin-bottom:10px}
.page ul{padding-left:20px}
.ftr{background:var(--violet-deep);color:#A59ECB;margin-top:30px}
.ftr .wrap{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px;padding-top:40px;padding-bottom:30px}
@media(max-width:800px){.ftr .wrap{grid-template-columns:1fr 1fr}}
.ftr h4{color:#fff;font-size:14px;margin-bottom:12px}
.ftr a{display:block;color:#A59ECB;font-size:13.5px;padding:3px 0}
.ftr a:hover{color:var(--gold)}
.ftr .base{border-top:1px solid rgba(255,255,255,.1);font-size:12px;padding:16px 20px;text-align:center}