:root{
  --bg:#070A12;
  --panel:#0B1020;
  --text:#EAF0FF;
  --muted:#71717a;
  --line:rgba(255,255,255,.09);
  --gold:#F7C94B;
  --green:#4CFF9B;
  --red:#FF4C7A;
  --shadow: 0 18px 55px rgba(0,0,0,.55);
  --radius2: 12px;
}
:root {
    --bg: #070A12;
    --panel: #0B1020;
    --text: #EAF0FF;
    --muted: #71717a;
    --line: rgba(255,255,255,.09);
    --gold: #F7C94B;
    --green: #4CFF9B;
    --red: #FF4C7A;
    --cyan: #56F2FF;
    --shadow: 0 18px 55px rgba(0,0,0,.55);
    --radius: 12px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, "PingFang SC", "Noto Sans CJK SC";
  color:var(--text);
  background: #0A0A0A !important;
}
a{color:inherit;text-decoration:none}
.muted{color:var(--muted)}
.small{font-size:12px}
.h1{margin:0;font-size:22px;letter-spacing:.2px}
.app{display: block}
.sidebar {
    border-right: 1px solid var(--line);
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    background: linear-gradient(180deg, rgba(255,255,255,.03), transparent 40%);
    overflow: auto;
    width: 320px;
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
}
.main {
    padding: 0 0 20px 0;
    width: min(1200px,92vw);
	margin: 0 auto
}
.card1{
  border: 1px solid #2d2d2d;
  border-radius: 1rem;
  background: #1a1a1a;
  box-shadow: none;
  padding:14px;
}
.card-lite{border:1px solid var(--line);background:rgba(255,255,255,.02);border-radius:10px;padding:12px}
.brand{display:flex;align-items:center;gap:12px;padding:6px 4px}
.name{font-weight:950;letter-spacing:.6px}
.sub{color:var(--muted);font-size:12px;margin-top:2px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:11px 12px;border-radius:10px;font-weight:900;border:1px solid transparent}
.btn-sm{padding:8px 10px;border-radius:8px;font-size:12px}
.btn-primary{border:0;background:linear-gradient(135deg, rgba(86,242,255,.95), rgba(247,201,75,.95));color:#061018;box-shadow:0 12px 28px rgba(86,242,255,.10)}
.btn-ghost{background:transparent;border:1px solid var(--line);color:var(--text)}
.btn-ghost.danger{border-color:rgba(255,76,122,.35);color:#ffd6df}
.searchBox{display:flex;gap:10px}
.searchBox input{ float: left; width: 223px !important; height: 39px !important; line-height: 39px !important; flex:1;background:var(--panel) !important;border:1px solid var(--line) !important;border-radius:10px !important;padding:11px 12px !important; margin: 0 10px 0 0 !important
; color:var(--text) !important;outline:none}
.searchBox button{ float: left; width:44px !important;border-radius:10px;border:1px solid var(--line) !important;background:var(--panel);color:var(--text); display: inline-block !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 39px !important;
    font-size: 12px !important;
    line-height: 30px !important}
.sectionTitle{margin-top:6px;color:var(--muted);font-size:12px;letter-spacing:.7px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{background:var(--panel);border:1px solid var(--line);color:var(--text);padding:8px 10px;border-radius:999px;font-size:12px}
.chip.isActive{border-color:rgba(86,242,255,.55);box-shadow:0 0 0 3px rgba(86,242,255,.12)}
.nav{display:flex;flex-direction:column;gap:10px}
.navItem{
  position:relative;overflow:hidden;display:flex;align-items:center;gap:12px;border:1px solid var(--line);
  background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
  padding:12px 12px 12px 14px;border-radius:12px;transition:all .28s ease;box-shadow:0 10px 26px rgba(0,0,0,.20);
}
.navItem::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(120deg, transparent 10%, rgba(86,242,255,.22) 42%, rgba(247,201,75,.14) 58%, transparent 85%);
  transform:translateX(-120%);opacity:0;transition:transform .7s ease, opacity .25s ease;pointer-events:none;
}
.navItem:hover::before{transform:translateX(120%);opacity:.9}
.navItem:hover{
  border-color:rgba(86,242,255,.28);background:linear-gradient(90deg, rgba(86,242,255,.08), rgba(255,255,255,.02));
  transform:translateX(4px);box-shadow:0 16px 34px rgba(0,0,0,.28), 0 0 0 1px rgba(86,242,255,.08);
}
.navAccent{
  position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:3px;
  background:linear-gradient(180deg, var(--cyan), var(--gold));opacity:0;transform:scaleY(.35);transition:.28s ease;
}
.navItem:hover .navAccent,.navItem.isActive .navAccent{opacity:1;transform:scaleY(1)}
.navItem.isActive{
  border-color:rgba(86,242,255,.34);background:linear-gradient(90deg, rgba(86,242,255,.14), rgba(86,242,255,.04));
  box-shadow:0 16px 34px rgba(0,0,0,.28), 0 0 0 1px rgba(86,242,255,.08);
}
.i{
  position:relative;z-index:2;width:34px;height:34px;display:grid;place-items:center;border-radius:10px;
  border:1px solid var(--line);
  background:radial-gradient(140px 60px at 30% 20%, rgba(86,242,255,.16), transparent 60%), rgba(255,255,255,.02);
  transition:transform .22s ease, border-color .22s ease;flex:0 0 34px;
}
.navItem:hover .i{transform:scale(1.12) rotate(-4deg);border-color:rgba(86,242,255,.26)}
.navText{min-width:0;display:flex;flex-direction:column;gap:3px;flex:1}
.navMain{font-weight:950;line-height:1.1}
.navSub{color:var(--muted);font-size:12px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.navMeta{
  position:relative;z-index:2;font-size:11px;font-weight:900;padding:5px 8px;border-radius:999px;
  border:1px solid rgba(247,201,75,.24);background:rgba(247,201,75,.10);color:#ffe7a7;
}
.navMeta.ghost{border-color:rgba(86,242,255,.24);background:rgba(86,242,255,.08);color:#c8fbff}
.navMeta.secure{border-color:rgba(76,255,155,.24);background:rgba(76,255,155,.08);color:#bfffdc}
.quickEntry{display:flex;flex-direction:column;gap:10px}
.quickCard{
  display:flex;align-items:center;gap:10px;padding:11px 12px;border:1px solid var(--line);
  border-radius:10px;background:rgba(255,255,255,.02);transition:.24s ease;
}
.quickCard:hover{border-color:rgba(86,242,255,.22);background:rgba(86,242,255,.05);transform:translateX(3px)}
.quickIcon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;border:1px solid var(--line);background:rgba(255,255,255,.02)}
.quickText{display:flex;flex-direction:column;gap:3px}
.quickMain{font-weight:900}
.quickSub{font-size:12px;color:var(--muted)}
.links{display:flex;flex-direction:column;gap:8px}
.link{color:var(--muted);padding:8px 10px;border-radius:8px;border:1px dashed var(--line)}
.userBox .userTop{display:flex;align-items:center;gap:10px}
.avatar{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;border:1px solid var(--line);background:rgba(255,255,255,.02);font-weight:950}
.userMeta .uName{font-weight:950}
.userMeta .uSub{color:var(--muted);font-size:12px;margin-top:2px}
.userBtns{display:flex;gap:10px;margin-top:10px}
.userBtns .btn{flex:1}
.footer{margin-top:auto;display:flex;align-items:center;gap:10px}
.dot{width:8px;height:8px;border-radius:50%}
.dot.ok{background:var(--green);box-shadow:0 0 18px rgba(76,255,155,.45)}
.footer .btn{margin-left:auto}
.crumb{display:flex;align-items:center;gap:10px}
.topbar{
  display:flex;flex-direction:column;gap:14px;padding:16px 18px;border:1px solid var(--line);border-radius:16px;
  background:linear-gradient(135deg, rgba(86,242,255,.06), rgba(247,201,75,.04)), rgba(255,255,255,.02);
  box-shadow:var(--shadow);
}
.topbarMain{display: block}
.topbarLeft{ float: left; height: 44px; line-height: 44px; min-width:0;display: flex; gap:6px}
.crumbLine{display:flex;align-items:center;gap:10px;font-size:12px}
.crumbHome{padding:5px 10px;border-radius:999px;border:1px dashed rgba(255,255,255,.15);color:var(--muted)}
.crumbCurrent{color:var(--text)}
.sep{opacity:.45}
.topbarTitle{ float: left; font-size:26px;font-weight:980;line-height: 44px}
.topbarSub{color:var(--muted);font-size:13px}
.topbarRight{ float: right; display:flex;flex-direction:column;gap:12px;align-items:flex-end}
.langSwitch{ float: left; display:flex;gap:8px;flex-wrap:wrap; margin: 5px 0 0 20px}
.langBtn{
  display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.025);color:var(--muted);cursor:pointer;transition:.22s ease;
}
.langBtn:hover{color:var(--text);border-color:rgba(86,242,255,.22);background:rgba(86,242,255,.06)}
.langBtn.isActive{
  color:var(--text);border-color:rgba(86,242,255,.34);background:linear-gradient(90deg, rgba(86,242,255,.12), rgba(247,201,75,.08));
  box-shadow:0 0 0 3px rgba(86,242,255,.08);
}
.langIcon{font-size:13px;line-height:1}
.langCode{font-size:12px;font-weight:900;letter-spacing:.3px}
.sep{opacity:.45}
.topActions{display:flex;gap:10px;flex-wrap:wrap}
.pill{padding:6px 10px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.02)}
.pill.soft{border-style:dashed}
.pill.gold{border-color:rgba(247,201,75,.35);color:#ffe7a7}
.badge{font-size:12px;font-weight:950;padding:6px 10px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.02)}
.badge.warn{border-color:rgba(247,201,75,.45);color:#ffe7a7}
.badge.ok{border-color:rgba(76,255,155,.35);color:#bfffdc}
.badge.danger{border-color:rgba(255,76,122,.45);color:#ffd6df}
.badge.info{border-color:rgba(86,242,255,.35);color:#c8fbff}
.hero{margin-top:14px;display:flex;flex-direction:column}
.notice{
  display:flex;align-items:center;gap:10px;padding:12px 14px;
  border:1px solid rgba(247,201,75,.22);
  background:linear-gradient(90deg, rgba(247,201,75,.12), rgba(86,242,255,.06), transparent);
  border-radius:var(--radius2);box-shadow:var(--shadow)
}
.noticeText{flex:1;opacity:.92}
.noticeLink{color:#dffcff;opacity:.9}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.stat{padding:12px;border-radius:10px;border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow)}
.stat .k{color:var(--muted);font-size:12px}
.stat .v{font-size:22px;font-weight:980;margin-top:4px}
.ads{margin-top:14px}
.cardHead{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.cardTitle{font-weight:980}
.adGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.ad1{
  position:relative;height:76px;border-radius:10px;border:1px solid var(--line);
  background:radial-gradient(600px 250px at 10% 20%, rgba(86,242,255,.16), transparent 55%),
           radial-gradient(600px 250px at 90% 40%, rgba(247,201,75,.14), transparent 55%),
           rgba(255,255,255,.02);
  display:flex;align-items:flex-end;padding:12px;overflow:hidden
}
.adTag{position:absolute;top:10px;left:10px;font-size:10px;padding:4px 6px;border-radius:10px;border:1px solid var(--line);color:var(--muted);background:rgba(0,0,0,.20)}
.adTxt{font-weight:950}
.feedHead{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:12px}
.feedControls{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.tabs{display:flex;gap:8px;flex-wrap:wrap;padding:6px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.02)}
.tab{border:1px solid transparent;background:transparent;color:var(--muted);padding:8px 10px;border-radius:8px;font-weight:950;font-size:12px}
.tab.isActive{color:var(--text);border-color:rgba(86,242,255,.45);box-shadow:0 0 0 3px rgba(86,242,255,.10)}
.select{display:flex;align-items:center;gap:10px}
select{background:var(--panel);border:1px solid var(--line);color:var(--text);padding:10px 12px;border-radius:8px;outline:none}
.feedList{display:flex;flex-direction:column;gap:12px}
.post{border: 1px solid #2d2d2d;border-radius: 1rem;background: #1a1a1a;box-shadow: none;padding:14px;box-shadow:var(--shadow)}
.postTop{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.postTitle{display:flex;align-items:center;gap:10px;min-width:0}
.postTitle a{font-size:16px;font-weight:980;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hotPill{padding:7px 10px;border-radius:999px;border:1px solid rgba(247,201,75,.35);background:rgba(247,201,75,.10);color:#ffe7a7;font-weight:950;font-size:12px;white-space:nowrap}
.meta{margin-top:10px;display:flex;flex-wrap:wrap;gap:8px;color:var(--muted);font-size:12px}
.snip{margin-top:10px;opacity:.92;line-height:1.6}
.postActions{margin-top:12px;display:flex;gap:10px;flex-wrap:wrap}
.right{display:flex;flex-direction:column;gap:12px}
.goldCard{background:linear-gradient(180deg, rgba(247,201,75,.12), transparent 65%), var(--panel);border-color:rgba(247,201,75,.22)}
.price{font-size:26px;font-weight:980;margin:10px 0 12px;color:#ffe7a7;font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace}
.list{display:flex;flex-direction:column;gap:10px}
.row{display:flex;align-items:center;gap:10px}
.row .dot{width:10px;height:10px;border-radius:50%}
.dot.info{background:rgba(86,242,255,.95)}
.dot.danger{background:rgba(255,76,122,.95)}
.rank{display:flex;flex-direction:column;gap:10px}
.rankRow{display:flex;align-items:center;gap:10px;padding:10px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.02)}
.rk{width:24px;height:24px;border-radius:10px;display:grid;place-items:center;border:1px solid var(--line);color:var(--muted);font-weight:950}
.lv{margin-left:auto;color:#ffe7a7;font-weight:980}
.tags{display:flex;flex-wrap:wrap;gap:8px}
.tag{font-size:12px;padding:8px 10px;border-radius:999px;border:1px solid var(--line);color:var(--muted);background:rgba(255,255,255,.01)}
.miniStats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.mini{border:1px solid var(--line);background:rgba(255,255,255,.02);border-radius:10px;padding:12px;text-align:center}
.miniK{color:var(--muted);font-size:12px}
.miniV{font-size:18px;font-weight:980;margin-top:6px}
.miniV.ok{color:#bfffdc}
.loadRow{display:flex;align-items:center;gap:12px;padding:6px 2px}
.pageFoot{margin-top:16px;padding:10px 4px}
.compactLinks{
  margin-top:18px;padding:0;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.02);box-shadow:var(--shadow);
}
.friendBar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.06)}
.friendBarLeft{display:flex;align-items:center;gap:10px;min-width:0;flex-wrap:wrap}
.friendTitle{font-size:13px;font-weight:900;color:var(--text)}
.friendSplit{width:1px;height:12px;background:rgba(255,255,255,.12)}
.friendDesc{font-size:12px;color:var(--muted)}
.friendApply{font-size:12px;color:var(--muted);padding:4px 0}
.friendApply:hover{color:var(--text)}
.friendInline ul{display:flex;flex-wrap:wrap;gap:8px;padding:12px 14px 14px}
.friendInline ul li {
  display:inline-flex;align-items:center;justify-content:center;padding:7px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.025);color:var(--muted);font-size:12px;line-height:1;transition:all .22s ease;
}
.friendInline ul li a { color:var(--muted)}
.friendInline ul li:hover{color:var(--text);border-color:rgba(86,242,255,.24);background:rgba(86,242,255,.06)}
.friendInline ul li:hover a { color:var(--text)}
.pageFoot{margin-top:16px;padding:10px 4px}
@media (max-width:1180px){
  .layout{grid-template-columns:1fr}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .adGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:1500px){
}
@media (max-width:980px){
  .layout { display: block}
  .app{grid-template-columns:1fr}
  .sidebar{display:none}
  .main { width: 100% !important; margin-left: 0 !important}
  .adGrid{grid-template-columns:1fr}
  .topbarRight { float: left}
  .topActions{ float: left !important; margin: 15px 0 0 0; font-size: 14px}
}
@media (max-width:680px){
  .topbarTitle { font-size: 20px}
  .osHead { display: block !important}
  .osBadges { margin-top: 12px}
  .feedHead { display: block}
  .feedControls { margin-top: 12px}
  .btn { padding: 8px 10px}
  .postActions { font-size: 12px}
  .snip { font-size: 14px}
  .langSwitch { margin: 0}
  .langBtn { padding: 6px 10px}
}


/* ============ 18 横幅广告布局（合理安排） ============ */
/* 桌面：3列 * 6行；平板：2列；手机：1列 */
.ads-wrapper{
  margin-top: 2px;
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.ad-container{
  display:block;
  margin:0;
  padding:0;
  border:1px solid var(--line);
  background: rgba(255,255,255,.02);
  height: 86px;
  border-radius: 6px; /* 少圆角 */
  overflow:hidden;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.ad-container img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* 适配 */
@media (max-width:1680px){
  .ads-wrapper{grid-template-columns: repeat(2, minmax(0, 1fr));}
}
@media (max-width:980px){
  .ads-wrapper{grid-template-columns: 1fr;}
  .ad-container{height: 92px;}
}


/* ============ Hover Glow / 流光效果 ============ */
.glow, .card1, .post, .navItem, .ad-container, .stat, .notice, .topbar, .userBox, .tab, .chip, .tag {
  position: relative;
  overflow: hidden;
}

/* 光带（hover 才出现） */
.glow::before,
.ad-container::before{
  content:"";
  position:absolute;
  inset:-2px;
  background: linear-gradient(120deg,
    rgba(86,242,255,0) 10%,
    rgba(86,242,255,.45) 35%,
    rgba(247,201,75,.35) 55%,
    rgba(86,242,255,0) 80%);
  transform: translateX(-120%);
  opacity: 0;
  filter: blur(10px);
  pointer-events:none;
}

.glow:hover::before,
.ad-container:hover::before{
  opacity: 1;
  transform: translateX(120%);
  transition: transform .9s ease, opacity .25s ease;
}

/* 轻微提亮与边框强化 */
.ad-container:hover{
  border-color: rgba(86,242,255,.28);
  box-shadow: 0 18px 55px rgba(0,0,0,.55), 0 0 0 1px rgba(247,201,75,.12);
}

/* 广告：保持你的放大逻辑，但改成更柔和 */
.ad-container:hover{
  transform: translateY(-1px) scale(1.02);
}

/* ============ V1.1 右侧更全面：模块样式与美化 ============ */
.right{
  position: sticky;
  top: 18px;
  align-self: start;
}

/* Tool grid */
.toolGrid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:10px;
}
.toolBtn{
  border:1px solid var(--line);
  background: rgba(255,255,255,.02);
  border-radius: 8px;
  padding:10px 10px;
  display:flex;
  align-items:center;
  gap:10px;
  box-shadow: 0 10px 26px rgba(0,0,0,.28);
}
.toolBtn .tI{
  width:32px;height:32px;border-radius:8px;
  display:grid;place-items:center;
  border:1px solid var(--line);
  background: radial-gradient(120px 60px at 30% 25%, rgba(86,242,255,.18), transparent 55%), rgba(0,0,0,.18);
}
.toolBtn .tT{font-weight:950}
.toolBtn .tS{
  margin-left:auto;
  font-size:12px;
  color: var(--muted);
}
.toolBtn:hover{border-color: rgba(86,242,255,.26)}

/* Hot list */
.hotList{display:flex;flex-direction:column;gap:10px}
.hotItem{
  display:flex;align-items:center;gap:10px;
  padding:10px 10px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.02);
  border-radius: 8px;
}
.hRank{
  width:26px;height:26px;border-radius:8px;
  display:grid;place-items:center;
  border:1px solid var(--line);
  color: var(--muted);
  font-weight:950;
}
.hMain{min-width:0;display:flex;flex-direction:column;gap:3px;flex:1}
.hTitle{
  font-weight:950;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.hMeta{font-size:12px;color:var(--muted)}
.hTag{
  font-size:12px;
  font-weight:950;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.02);
  white-space:nowrap;
}
.hTag.ok{border-color: rgba(76,255,155,.35); color:#bfffdc}
.hTag.warn{border-color: rgba(247,201,75,.35); color:#ffe7a7}
.hTag.danger{border-color: rgba(255,76,122,.35); color:#ffd6df}
.hTag.info{border-color: rgba(86,242,255,.35); color:#c8fbff}

/* Official module */
.glassCard{
  background:
    radial-gradient(800px 220px at 10% 10%, rgba(86,242,255,.16), transparent 55%),
    radial-gradient(800px 220px at 90% 30%, rgba(247,201,75,.12), transparent 55%),
    rgba(255,255,255,.02);
}
.official{display:flex;flex-direction:column;gap:12px}
.officialRow{
  display:flex;align-items:center;gap:10px;
  padding:10px 10px;
  border:1px solid var(--line);
  background: rgba(0,0,0,.18);
  border-radius: 8px;
}
.oIcon{
  width:34px;height:34px;border-radius:8px;
  display:grid;place-items:center;
  border:1px solid var(--line);
  background: rgba(255,255,255,.02);
}
.oMain{flex:1;min-width:0}
.oTitle{font-weight:950}
.oSub{font-size:12px;color:var(--muted);margin-top:2px}

/* Risk box */
.riskBox{
  border:1px dashed rgba(247,201,75,.28);
  background: rgba(247,201,75,.06);
  border-radius: 8px;
  padding:10px 10px;
}
.riskTitle{font-weight:950;color:#ffe7a7}
.riskText{margin-top:6px;font-size:12px;color:rgba(234,240,255,.86);line-height:1.55}

/* Small screen: disable sticky to avoid awkward scroll */
@media (max-width:1180px){
  .right{position: static}
}


/* ============ 1.2 FINAL 布局修复：广告归左列，右侧无空隙 ============ */
.leftCol{
  display:flex;
  flex-direction:column;
  gap: 0;
  min-width:0;
}
.leftCol .ads{margin-top:0;}
.layout{align-items:start;}

@media (max-width:1180px){
  .leftCol{gap:12px}
}


/* ============ 1.3 顶部平台化头部 ============ */
.marketStrip{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:14px;
  padding:12px 12px;
}
.msLeft{display:flex;flex-direction:column;gap:2px}
.msK{font-size:12px;color:var(--muted);letter-spacing:.6px}
.msV{font-size:14px;font-weight:980}
.msUp{
  display:inline-grid;place-items:center;
  width:18px;height:18px;border-radius:6px;
  border:1px solid rgba(76,255,155,.22);
  background: rgba(76,255,155,.10);
  color:#bfffdc;
  margin-right:6px;
}
.msMid{
  flex:1;
  display:flex;
  align-items:center;
  gap:10px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.02);
  border-radius: 8px;
  padding:10px 10px;
  overflow:hidden;
  white-space:nowrap;
}
.msItem{font-size:12px;color:rgba(234,240,255,.90)}
.msDot{color:rgba(255,255,255,.22)}
.msTag{
  display:inline-flex;align-items:center;gap:6px;
  font-weight:980;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.18);
  margin-right:6px;
  color:var(--muted);
}
.msTag.ok{border-color:rgba(76,255,155,.22);color:#bfffdc}
.msTag.warn{border-color:rgba(247,201,75,.22);color:#ffe7a7}
.msTag.info{border-color:rgba(86,242,255,.22);color:#c8fbff}
.msRight{display:flex;gap:10px;flex-wrap:wrap}

.trustRow{
  margin-top:14px;
  margin-bottom: 14px;
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:14px;
}
.trustCard{padding:14px}
.trustHead{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin-bottom:10px;
}
.trustTitle{font-weight:980}
.trustBadge{
  font-size:12px;
  font-weight:980;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.18);
}
.trustBadge.ok{border-color:rgba(76,255,155,.22);color:#bfffdc}
.trustBadge.warn{border-color:rgba(247,201,75,.22);color:#ffe7a7}
.trustBadge.info{border-color:rgba(86,242,255,.22);color:#c8fbff}
.trustText{
  color: rgba(234,240,255,.88);
  height: 40px;
  line-height: 20px;
  font-size:12px;
}
.trustActions{margin-top:12px;display:flex;gap:10px;flex-wrap:wrap}

@media (max-width:1180px){
  .trustRow{grid-template-columns: 1fr}
  .marketStrip{flex-direction:column;align-items:stretch}
  .msMid{order:3}
  .msRight{justify-content:flex-start}
}

.officialServices{margin-top:14px}
.osHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.osTitle{
  font-size:16px;
  font-weight:980;
  letter-spacing:.2px;
}
.osBadges{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.osBadge{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.16);
  color: rgba(234,240,255,.86);
  font-size:12px;
  font-weight:900;
}
.osIcon{opacity:.9}

.osGrid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:12px;
}
.osCard{
  border:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(650px 220px at 10% 15%, rgba(86,242,255,.12), transparent 60%),
    radial-gradient(650px 220px at 90% 35%, rgba(247,201,75,.10), transparent 60%),
    rgba(255,255,255,.02);
  border-radius: 8px;
  padding:12px 12px;
  box-shadow: 0 14px 40px rgba(0,0,0,.30);
  display:flex;
  flex-direction:column;
  gap:10px;
  min-width:0;
}
.osTop{display:flex;align-items:center;justify-content:space-between;gap:10px}
.osMark{
  font-size:10px;
  letter-spacing:1px;
  padding:5px 8px;
  border-radius:999px;
  border:1px solid rgba(86,242,255,.20);
  color:#c8fbff;
  background: rgba(86,242,255,.06);
  font-weight:950;
}
.osPill{
  font-size:12px;
  font-weight:950;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.18);
  color: var(--muted);
}
.osPill.ok{border-color:rgba(76,255,155,.22);color:#bfffdc}
.osPill.warn{border-color:rgba(247,201,75,.22);color:#ffe7a7}
.osPill.info{border-color:rgba(86,242,255,.22);color:#c8fbff}

.osName{font-size:15px;font-weight:980}
.osDesc{font-size:12px;color: rgba(234,240,255,.86);line-height:1.55;min-height:38px}
.osTags{display:flex;flex-wrap:wrap;gap:8px}
.tagMini{
  font-size:12px;
  padding:7px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.18);
  color: var(--muted);
}

.osCTA{
  margin-top:auto;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.osHint{
  font-size:12px;
  color: rgba(159,176,208,.92);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.osCard:hover{
  border-color: rgba(86,242,255,.28);
  transform: translateY(-2px);
  transition: transform .25s ease, border-color .25s ease;
}

/* å"åº"（你说暂不考è™'移动端，但这里保底不炸） */
@media (max-width:1180px){
  .trustRow{grid-template-columns: 1fr}
  .marketStrip{flex-direction:column;align-items:stretch}
  .msMid{order:3}
  .msRight{justify-content:flex-start}
  .osGrid{grid-template-columns: repeat(2, minmax(0, 1fr));}
}
@media (max-width:980px){
  .osGrid{grid-template-columns: 1fr;}
  .osBadges{justify-content:flex-start}
}

/* 在线状态卡 */

.online-status-card{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;

padding:14px 16px;

border-radius:10px;

border:1px solid rgba(255,255,255,.08);

background:
linear-gradient(180deg, rgba(255,255,255,.03), transparent 70%),
rgba(255,255,255,.02);

box-shadow:0 10px 24px rgba(0,0,0,.25);

transition:.2s;
}

.online-status-card:hover{
border-color:rgba(76,255,155,.25);
}

/* 左侧 */

.online-left{
display:flex;
align-items:center;
gap:10px;
}

/* 在线状态点 */

.online-dot{
width:10px;
height:10px;
border-radius:50%;

background:#4cff9b;

box-shadow:
0 0 0 4px rgba(76,255,155,.08),
0 0 12px rgba(76,255,155,.55);

animation:onlinePulse 2.5s infinite;
}

/* 呼吸效果 */

@keyframes onlinePulse{

0%{
box-shadow:
0 0 0 4px rgba(76,255,155,.05),
0 0 10px rgba(76,255,155,.4);
}

50%{
box-shadow:
0 0 0 6px rgba(76,255,155,.1),
0 0 16px rgba(76,255,155,.7);
}

100%{
box-shadow:
0 0 0 4px rgba(76,255,155,.05),
0 0 10px rgba(76,255,155,.4);
}

}

/* 文本 */

.online-info{
display:flex;
flex-direction:column;
}

.online-title{
font-size:13px;
font-weight:700;
color:#eaf1ff;
}

.online-desc{
font-size:11px;
color:#8fa3c8;
}

/* 数字 */

.online-count{
min-width:44px;

height:34px;

display:flex;
align-items:center;
justify-content:center;

padding:0 12px;

border-radius:999px;

background:rgba(76,255,155,.08);

border:1px solid rgba(76,255,155,.2);

color:#bfffdc;

font-weight:800;

font-size:14px;
}


.forum-board-hero{
  position:relative;
  overflow:hidden;
  margin: 0 0 12px 0;
  border:1px solid #2d2d2d;
  border-radius: 1rem;
  background: #1a1a1a;
  box-shadow: none;
}

.forum-board-hero::before{}

.forum-board-hero:hover::before{}

.board-topline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding: 14px;
  border-bottom:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.015);
}

.board-kicker{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:0 10px;
  border-radius:999px;
  border:1px solid rgba(86,242,255,.16);
  background:rgba(86,242,255,.05);
  color:#c8fbff;
  font-size:12px;
  font-weight:800;
  letter-spacing:.3px;
}

.board-rule-link{
  color:var(--muted);
  font-size:13px;
  text-decoration:none;
  transition:.2s ease;
}

.board-rule-link:hover{
  color:#ffffff;
}

.board-main{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:16px;
}

.board-main-left{
  min-width:0;
  flex:1;
}

.board-title{
  margin:0;
  font-size:26px;
  line-height:1.1;
  font-weight:900;
  color:var(--text);
}

.board-desc{
  margin:10px 0 0;
  color:var(--muted);
  font-size:14px;
  line-height:1.8;
}

.board-actions{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:10px;
}

.board-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:42px;
  padding:0 16px;
  border-radius:12px;
  text-decoration:none;
  font-size:13px;
  font-weight:800;
  transition:.2s ease;
}

.board-btn-primary{
  background: color-mix(in oklab, var(--color-primary)10%, transparent);
  color:#EC5B13;
  height: 32px;
  line-height: 32px;
  border-radius: 34px;
  border: 1px solid #EC5B13;
  border-color: color-mix(in oklab, var(--color-primary)40%, transparent);
  box-shadow: none;
}

.board-note{
  margin:0 14px 14px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.02), transparent 70%),
    var(--panel-soft);
  overflow:hidden;
}

.board-note-label{
  padding:12px 16px;
  border-bottom:1px solid rgba(255,255,255,.06);
  color:#ffe7a7;
  font-size:12px;
  font-weight:800;
  letter-spacing:.3px;
  background:rgba(255,255,255,.015);
}

.board-note-content{
  padding:14px 16px 16px;
}

.board-note-content p{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.9;
}

.board-note-content p + p{
  margin-top:8px;
}

@media (max-width:900px){
  .board-main{
    flex-direction:column;
    align-items:flex-start;
  }

  .board-actions{
    width:100%;
  }
}

@media (max-width:768px){
  .page-wrap{
    padding:16px;
  }

  .forum-board-hero{
    border-radius:16px;
  }

  .board-topline,
  .board-main{
    padding-left:16px;
    padding-right:16px;
  }

  .board-note{
    margin:0 16px 16px;
  }

  .board-title{
    font-size:20px;
  }

  .board-desc{
    font-size:13px;
    line-height:1.8;
  }

  .board-note-content p{
    font-size:12px;
    line-height:1.8;
  }
}


.topbar{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:18px;
  min-height:76px;
  padding:14px 18px;
  border-radius:10px;
  border:1px solid var(--line);
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), transparent 70%),
    linear-gradient(90deg, rgba(86,242,255,.03), transparent 30%, transparent 70%, rgba(247,201,75,.03)),
    var(--panel);
  box-shadow:var(--shadow);
}

/* 左侧 */

.topbar-left{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
}

/* LOGO */

.logo{
  display:flex;
  align-items:center;
  text-decoration:none;
  letter-spacing:.3px;
  white-space:nowrap;
  flex:0 0 auto;
}

.logo-katu,
.logo-sms,
.logo-forum{
  font-size:28px;
  line-height: 44px;
}

.logo-katu{
  color:#ff4308;
  font-weight:900;
  text-shadow:0 0 8px rgba(255,123,29,.20);
}

.logo-sms{
  color:#ffffff;
  font-weight:900;
}

.logo-forum{
  margin-left:10px;
  color:#ffffff;
  font-weight:700;
}

.logo:hover .logo-katu{
  text-shadow:0 0 14px rgba(255,123,29,.38);
}

.logo:hover .logo-sms{
  text-shadow:0 0 10px rgba(255,255,255,.26);
}

/* 多语言图标 */

.lang-switch{
  display:flex;
  align-items:center;
  gap:8px;
  flex:0 0 auto;
}

.lang-btn{
  width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  transition:.2s ease;
  opacity:.92;
}

.lang-btn:hover{
  transform:translateY(-1px) scale(1.04);
  opacity:1;
}

.lang-btn.is-active{
  opacity:1;
}

.lang-img{
  width:24px;
  height:24px;
  display:block;
  object-fit:contain;
  border-radius:50%;
  box-shadow:0 0 0 1px rgba(255,255,255,.08);
}

/* 中间公告：增强版 */

.topbar-center{
  min-width:0;
}

.notice-bar-pro{
  position:relative;
  display:grid;
  grid-template-columns:96px 1fr;
  align-items:center;
  min-height:44px;
  border:1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.02), transparent 75%),
    linear-gradient(90deg, rgba(0,255,170,.03), transparent 28%, transparent 72%, rgba(255,77,77,.03)),
    rgba(255,255,255,.015);
  overflow:hidden;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.015),
    0 0 20px rgba(0,0,0,.12);
}

/* 呼吸灯 */

@keyframes noticeBreath{
  0%{
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.015),
      0 0 10px rgba(86,242,255,.05);
    border-color:rgba(255,255,255,.08);
  }
  50%{
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.02),
      0 0 22px rgba(86,242,255,.10);
    border-color:rgba(86,242,255,.14);
  }
  100%{
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.015),
      0 0 10px rgba(86,242,255,.05);
    border-color:rgba(255,255,255,.08);
  }
}

.notice-bar-pro{
  animation:noticeBreath 3.6s ease-in-out infinite;
}

/* 分割线 */

.notice-bar-pro::before{
  content:"";
  position:absolute;
  left:96px;
  top:0;
  bottom:0;
  width:1px;
  background:rgba(255,255,255,.08);
}

/* 扫描流光 */

.notice-bar-pro::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(
    90deg,
    transparent 0%,
    rgba(86,242,255,.03) 48%,
    rgba(86,242,255,.08) 50%,
    rgba(86,242,255,.03) 52%,
    transparent 100%
  );
  transform:translateX(-100%);
  animation:noticeScanPro 4.8s linear infinite;
  opacity:.45;
}

@keyframes noticeScanPro{
  0%{transform:translateX(-100%)}
  100%{transform:translateX(100%)}
}

/* 左侧标签 */

.notice-pro-label{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  height:100%;
  color:#ffffff;
  font-size:12px;
  font-weight:900;
  letter-spacing:.8px;
  background:
    linear-gradient(90deg, rgb(6 0 255 / 14%), rgba(255, 123, 29, .04));
}

.notice-pro-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#00ff16;
  box-shadow:0 0 10px rgba(255,123,29,.55);
}

/* 右侧滚动区 */

.notice-pro-track{
  position:relative;
  min-width:0;
  overflow:hidden;
  height:42px;
  z-index:2;
}

.notice-pro-move{
  display:inline-block;
  white-space:nowrap;
  line-height:42px;
  font-size:13px;
  padding-left:100%;
  animation:noticeFlowPro 15s linear infinite;
}

@keyframes noticeFlowPro{
  0%{
    transform:translateX(0);
  }
  100%{
    transform:translateX(-100%);
  }
}

.notice-pro-item{
  font-weight:600;
}

/* 分色文案 */

.notice-ty{
  color:var(--ty);
}

.notice-blue{
  color:var(--blue);
}

.notice-red{
  color:var(--red);
}

.notice-gold{
  color:#ffd98f;
}

.notice-pro-divider{
  display:inline-block;
  margin:0 14px;
  color:rgba(255,123,29,.75);
  font-weight:700;
}

/* 右侧按钮 */

.topbar-right{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}

.nav-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:64px;
  height:46px;
  padding:0 14px;
  border-radius:4px;
  border:1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,.02), transparent 70%),
    rgba(255,255,255,.02);
  color:#eef4ff;
  font-size:13px;
  font-weight:800;
  text-decoration:none;
  transition:.2s ease;
}

.nav-btn:hover{
  transform:translateY(-1px);
  border-color:rgba(86,242,255,.18);
  background:rgba(86,242,255,.05);
  box-shadow:0 8px 18px rgba(86,242,255,.08);
}

.nav-post{
  border:0;
  color:#061018;
  background:linear-gradient(135deg, rgba(86,242,255,.96), rgba(247,201,75,.96));
  box-shadow:0 12px 24px rgba(86,242,255,.12);
}

.nav-post:hover{
  box-shadow:0 14px 26px rgba(86,242,255,.18);
}

/* 额外优化：悬停时公告暂停，方便阅读 */

.notice-bar-pro:hover .notice-pro-move{
  animation-play-state:paused;
}

/* 响应式 */

@media (max-width:1280px){
  .topbar{
    grid-template-columns:1fr;
    align-items:flex-start;
  }

  .topbar-left,
  .topbar-center,
  .topbar-right{
    width:100%;
  }

  .topbar-right{
    justify-content:flex-start;
  }
}

@media (max-width:768px){
  body{
    padding:10px;
  }

  .topbar{
    padding:14px;
  }

  .topbar-left{
    flex-wrap:wrap;
  }

  .logo-katu,
  .logo-sms{
    font-size:24px;
  }

  .logo-forum{
    font-size:20px;
    margin-left:8px;
  }

  .notice-bar-pro{
    grid-template-columns:82px 1fr;
    min-height:42px;
  }

  .notice-bar-pro::before{
    left:82px;
  }

  .notice-pro-label{
    font-size:11px;
    letter-spacing:.5px;
  }

  .notice-pro-track{
    height:42px;
  }

  .notice-pro-move{
    line-height:42px;
    font-size:12px;
    animation-duration:20s;
  }
}