@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700;900&family=Roboto:wght@300;400;500;700&display=swap');
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth}
body{font-family:'Roboto','Noto Sans SC','Source Han Sans SC','PingFang SC','Microsoft YaHei',sans-serif;color:#333;background:#f4f6f9;line-height:1.8;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:#0A2A4E;text-decoration:none;transition:color .3s}
a:hover{color:#FF8C00}
ul,ol{list-style:none}
h1,h2,h3,h4,h5,h6{font-family:'Noto Sans SC','Source Han Sans SC',sans-serif;font-weight:700;color:#0A2A4E;line-height:1.4}
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 20px}
.grid{display:grid;gap:24px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}

/* Header */
.site-header{background:linear-gradient(135deg,#0A2A4E,#0d3a6b,#0A2A4E);color:#fff}
.header-top{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.1);font-size:.85rem}
.header-top .contact-info span{margin-right:18px;opacity:.8}
.site-logo{display:flex;align-items:center;gap:12px}
.site-logo .logo-icon{width:46px;height:46px;background:linear-gradient(135deg,#FF8C00,#ff6a00);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;font-weight:900;color:#fff}
.site-logo .logo-text{font-family:'Noto Sans SC',sans-serif;font-size:1.4rem;font-weight:700;color:#fff}
.site-logo .logo-text small{display:block;font-size:.72rem;font-weight:400;opacity:.7}
.nav-header{display:flex;justify-content:space-between;align-items:center}
.main-nav ul{display:flex;align-items:center}
.main-nav ul li a{display:block;padding:15px 18px;color:#fff;font-size:.93rem;font-weight:500;transition:all .3s;position:relative}
.main-nav ul li a:hover,.main-nav ul li a.active{color:#FF8C00;background:rgba(255,140,0,.1)}
.main-nav ul li a::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:0;height:3px;background:#FF8C00;transition:width .3s}
.main-nav ul li a:hover::after,.main-nav ul li a.active::after{width:60%}
.mobile-toggle{display:none;background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;padding:10px}

/* Breadcrumb */
.breadcrumb{padding:12px 0;background:#fff;border-bottom:1px solid #e8ecf1}
.breadcrumb ol{display:flex;align-items:center;gap:8px;font-size:.85rem}
.breadcrumb ol li::after{content:'>';margin-left:8px;color:#999}
.breadcrumb ol li:last-child::after{content:''}
.breadcrumb ol li a{color:#666}
.breadcrumb ol li:last-child a{color:#0A2A4E;font-weight:500}

/* Hero */
.hero-section{background:linear-gradient(135deg,#0A2A4E,#0d3a6b,#1a4a7a);color:#fff;padding:60px 0;position:relative;overflow:hidden}
.hero-section::before{content:'';position:absolute;top:-50%;right:-20%;width:600px;height:600px;background:radial-gradient(circle,rgba(255,140,0,.15),transparent 70%);border-radius:50%}
.hero-content{position:relative;z-index:2;text-align:center}
.hero-content h1{font-size:2.4rem;color:#fff;margin-bottom:16px;font-weight:900}
.hero-content p{font-size:1.1rem;opacity:.9;max-width:700px;margin:0 auto 28px}
.hero-stats{display:flex;justify-content:center;gap:40px;margin-top:28px}
.hero-stats .stat-item{text-align:center}
.hero-stats .stat-num{font-size:2.4rem;font-weight:900;color:#FF8C00;display:block}
.hero-stats .stat-label{font-size:.88rem;opacity:.8}

/* Section */
.section{padding:60px 0}
.section-alt{background:#fff}
.section-title{text-align:center;margin-bottom:40px}
.section-title h2{font-size:1.75rem;margin-bottom:12px;position:relative;display:inline-block}
.section-title h2::after{content:'';position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);width:60px;height:3px;background:#FF8C00}
.section-title p{color:#666;margin-top:16px}

/* Live Draw */
.live-draw{background:linear-gradient(135deg,#0A2A4E,#1a4a7a);border-radius:16px;padding:40px;color:#fff;text-align:center;position:relative;overflow:hidden}
.live-draw::before{content:'';position:absolute;top:-30%;left:-10%;width:300px;height:300px;background:radial-gradient(circle,rgba(255,140,0,.2),transparent 70%);border-radius:50%}
.draw-numbers{display:flex;justify-content:center;gap:16px;margin:28px 0;flex-wrap:wrap}
.draw-number{width:70px;height:70px;background:linear-gradient(135deg,#FF8C00,#ff6a00);border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:2rem;font-weight:900;color:#fff;box-shadow:0 8px 24px rgba(255,140,0,.3);animation:numPulse 2s ease-in-out infinite}
.draw-number.sum-number{background:linear-gradient(135deg,#0A2A4E,#1a4a7a);border:3px solid #FF8C00;width:86px;height:86px;font-size:2.1rem}
@keyframes numPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}
.draw-info{display:flex;justify-content:center;gap:36px;margin-top:18px;font-size:.93rem}
.draw-info span{display:flex;align-items:center;gap:6px}
.countdown-timer{font-size:1.5rem;font-weight:700;color:#FF8C00;margin:14px 0}
.live-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(255,0,0,.2);padding:4px 16px;border-radius:20px;font-size:.85rem;margin-bottom:14px}
.live-badge::before{content:'';width:8px;height:8px;background:#f00;border-radius:50%;animation:livePulse 1.5s ease-in-out infinite}
@keyframes livePulse{0%,100%{opacity:1}50%{opacity:.3}}

/* Search */
.search-module{background:#fff;border-radius:16px;padding:36px;box-shadow:0 4px 20px rgba(0,0,0,.06)}
.search-form{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:16px;align-items:end}
.form-group{display:flex;flex-direction:column;gap:6px}
.form-group label{font-size:.85rem;font-weight:500;color:#666}
.form-group input,.form-group select{padding:11px 15px;border:2px solid #e8ecf1;border-radius:10px;font-size:.93rem;transition:border-color .3s;outline:none}
.form-group input:focus,.form-group select:focus{border-color:#FF8C00}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 26px;border:none;border-radius:10px;font-size:.93rem;font-weight:600;cursor:pointer;transition:all .3s}
.btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.15)}
.btn-primary{background:linear-gradient(135deg,#FF8C00,#ff6a00);color:#fff}
.btn-secondary{background:#0A2A4E;color:#fff}
.btn-outline{background:transparent;border:2px solid #0A2A4E;color:#0A2A4E}

/* Data Table */
.data-table-wrapper{overflow-x:auto;margin-top:24px}
.data-table{width:100%;border-collapse:collapse;font-size:.88rem}
.data-table thead{background:#0A2A4E;color:#fff}
.data-table th{padding:13px 15px;text-align:left;font-weight:600}
.data-table td{padding:11px 15px;border-bottom:1px solid #e8ecf1}
.data-table tbody tr:hover{background:rgba(255,140,0,.05)}
.data-table tbody tr:nth-child(even){background:#f8f9fb}
.number-ball{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:#0A2A4E;color:#fff;font-weight:700;font-size:.78rem;margin:0 2px}
.number-ball.highlight{background:#FF8C00}

/* Chart Card */
.chart-card{background:#fff;border-radius:16px;padding:24px;box-shadow:0 4px 20px rgba(0,0,0,.06);transition:all .3s}
.chart-card:hover{transform:translateY(-4px);box-shadow:0 8px 30px rgba(0,0,0,.1)}
.chart-card h3{font-size:1.05rem;margin-bottom:14px;padding-bottom:12px;border-bottom:2px solid #f0f0f0}
.chart-placeholder{height:200px;background:linear-gradient(135deg,#f4f6f9,#e8ecf1);border-radius:10px;display:flex;align-items:center;justify-content:center;color:#999;font-size:.88rem}

/* Article Card */
.article-card{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,.06);transition:all .3s}
.article-card:hover{transform:translateY(-4px);box-shadow:0 8px 30px rgba(0,0,0,.1)}
.article-card-img{height:190px;background:linear-gradient(135deg,#0A2A4E,#1a4a7a);display:flex;align-items:center;justify-content:center;color:#fff;font-size:2.8rem}
.article-card-body{padding:22px}
.article-card-body h3{font-size:1.05rem;margin-bottom:10px;line-height:1.5}
.article-card-body p{color:#666;font-size:.88rem;line-height:1.7;margin-bottom:14px}
.article-meta{display:flex;align-items:center;gap:12px;font-size:.8rem;color:#999}
.article-meta .author-avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#FF8C00,#ff6a00);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:.83rem}

/* Post List */
.post-list{display:flex;flex-direction:column;gap:12px}
.post-item{display:flex;justify-content:space-between;align-items:center;padding:15px 18px;background:#fff;border-radius:12px;box-shadow:0 2px 10px rgba(0,0,0,.04);transition:all .3s}
.post-item:hover{transform:translateX(4px);box-shadow:0 4px 16px rgba(0,0,0,.08)}
.post-item .post-title{font-weight:500;color:#333;flex:1}
.post-item .post-tag{display:inline-block;padding:2px 10px;border-radius:20px;font-size:.73rem;font-weight:600;margin-right:12px}
.post-item .post-tag.hot{background:rgba(255,140,0,.1);color:#FF8C00}
.post-item .post-tag.new{background:rgba(10,42,78,.1);color:#0A2A4E}
.post-item .post-replies{font-size:.83rem;color:#999;white-space:nowrap}

/* Tool Card */
.tool-card{background:#fff;border-radius:16px;padding:28px;text-align:center;box-shadow:0 4px 20px rgba(0,0,0,.06);transition:all .3s}
.tool-card:hover{transform:translateY(-4px);box-shadow:0 8px 30px rgba(0,0,0,.1)}
.tool-card .tool-icon{width:62px;height:62px;margin:0 auto 14px;background:linear-gradient(135deg,rgba(255,140,0,.1),rgba(255,140,0,.05));border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:1.7rem}
.tool-card h3{font-size:1.02rem;margin-bottom:8px}
.tool-card p{color:#666;font-size:.83rem;line-height:1.6}

/* Article Detail */
.article-detail{background:#fff;border-radius:16px;padding:46px;box-shadow:0 4px 20px rgba(0,0,0,.06);margin:28px 0}
.article-detail h1{font-size:1.9rem;margin-bottom:18px;line-height:1.5}
.article-detail .article-info{display:flex;align-items:center;gap:18px;padding-bottom:22px;border-bottom:2px solid #f0f0f0;margin-bottom:28px;font-size:.88rem;color:#666;flex-wrap:wrap}
.article-detail .content-body{font-size:1rem;line-height:2;color:#333}
.article-detail .content-body h2{font-size:1.45rem;margin:34px 0 14px;padding-left:16px;border-left:4px solid #FF8C00}
.article-detail .content-body h3{font-size:1.15rem;margin:26px 0 12px}
.article-detail .content-body p{margin-bottom:15px}
.article-detail .content-body table{width:100%;border-collapse:collapse;margin:18px 0}
.article-detail .content-body table th,.article-detail .content-body table td{padding:10px 13px;border:1px solid #e8ecf1;text-align:center}
.article-detail .content-body table th{background:#0A2A4E;color:#fff}
.article-detail .content-body pre{background:#1a1a2e;color:#e0e0e0;padding:22px;border-radius:10px;overflow-x:auto;margin:18px 0;font-size:.88rem;line-height:1.6}
.article-detail .content-body code{background:#f4f6f9;padding:2px 7px;border-radius:4px;font-size:.88em;color:#FF8C00}
.article-detail .content-body blockquote{border-left:4px solid #FF8C00;padding:15px 22px;background:rgba(255,140,0,.05);margin:18px 0;border-radius:0 10px 10px 0}

/* Page Layout */
.page-layout{display:grid;grid-template-columns:1fr 300px;gap:28px;margin:28px 0}
.sidebar .widget{background:#fff;border-radius:16px;padding:22px;box-shadow:0 4px 20px rgba(0,0,0,.06);margin-bottom:22px}
.sidebar .widget h3{font-size:1.02rem;margin-bottom:14px;padding-bottom:12px;border-bottom:2px solid #f0f0f0}
.sidebar .widget ul li{padding:7px 0;border-bottom:1px solid #f4f6f9}
.sidebar .widget ul li:last-child{border-bottom:none}
.sidebar .widget ul li a{font-size:.88rem;color:#333;display:flex;justify-content:space-between}
.sidebar .widget ul li a:hover{color:#FF8C00}

/* Footer */
.site-footer{background:#0A2A4E;color:#fff;padding:55px 0 0}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:36px;padding-bottom:36px;border-bottom:1px solid rgba(255,255,255,.1)}
.footer-col h4{font-size:1.05rem;color:#fff;margin-bottom:18px;position:relative;padding-bottom:12px}
.footer-col h4::after{content:'';position:absolute;bottom:0;left:0;width:38px;height:3px;background:#FF8C00}
.footer-col p{font-size:.88rem;opacity:.7;line-height:1.8}
.footer-col ul li{margin-bottom:9px}
.footer-col ul li a{color:rgba(255,255,255,.7);font-size:.88rem;transition:all .3s}
.footer-col ul li a:hover{color:#FF8C00;padding-left:4px}
.footer-social{display:flex;gap:12px;margin-top:18px}
.footer-social a{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;color:#fff;transition:all .3s}
.footer-social a:hover{background:#FF8C00;transform:translateY(-2px)}
.footer-bottom{padding:18px 0;text-align:center;font-size:.83rem;opacity:.6}
.footer-disclaimer{background:rgba(0,0,0,.2);padding:15px 0;text-align:center;font-size:.78rem;opacity:.6;line-height:1.6}

/* Animations */
.fade-in{opacity:0;transform:translateY(20px);transition:opacity .6s,transform .6s}
.fade-in.visible{opacity:1;transform:translateY(0)}

/* Pagination */
.pagination{display:flex;justify-content:center;gap:8px;margin-top:28px}
.pagination a,.pagination span{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 11px;border-radius:10px;font-size:.88rem;font-weight:500;transition:all .3s}
.pagination a{background:#fff;color:#333;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.pagination a:hover,.pagination span.current{background:#FF8C00;color:#fff}

/* APP */
.app-hero{background:linear-gradient(135deg,#0A2A4E,#1a4a7a);color:#fff;padding:75px 0;text-align:center}
.app-features{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:36px}
.app-feature-card{background:rgba(255,255,255,.1);border-radius:16px;padding:28px;text-align:center}
.download-buttons{display:flex;justify-content:center;gap:18px;margin-top:28px;flex-wrap:wrap}
.download-btn{display:inline-flex;align-items:center;gap:12px;padding:15px 30px;border-radius:12px;font-size:1rem;font-weight:600;color:#fff;transition:all .3s}
.download-btn.ios{background:linear-gradient(135deg,#333,#555)}
.download-btn.android{background:linear-gradient(135deg,#34a853,#2d8f47)}
.download-btn:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.2);color:#fff}

/* Tags */
.tag{display:inline-block;padding:3px 11px;border-radius:20px;font-size:.73rem;font-weight:600;background:rgba(10,42,78,.08);color:#0A2A4E;margin:2px}
.tag.big{background:rgba(255,140,0,.1);color:#FF8C00}
.tag.small{background:rgba(10,42,78,.08);color:#0A2A4E}

/* Responsive */
@media(max-width:1024px){.grid-4{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:repeat(2,1fr)}.page-layout{grid-template-columns:1fr}.search-form{grid-template-columns:1fr 1fr}}
@media(max-width:768px){.grid-2,.grid-3{grid-template-columns:1fr}.hero-content h1{font-size:1.7rem}.hero-stats{flex-wrap:wrap;gap:18px}.draw-numbers{gap:10px}.draw-number{width:54px;height:54px;font-size:1.4rem}.draw-number.sum-number{width:66px;height:66px}.live-draw{padding:22px}.search-form{grid-template-columns:1fr}.article-detail{padding:22px}.article-detail h1{font-size:1.4rem}.footer-grid{grid-template-columns:1fr}.app-features{grid-template-columns:1fr}.mobile-toggle{display:block}.main-nav ul{display:none;flex-direction:column;width:100%;background:#0A2A4E}.main-nav ul.show{display:flex}.main-nav ul li a{padding:13px 18px;border-bottom:1px solid rgba(255,255,255,.05)}.draw-info{flex-direction:column;gap:8px}.section{padding:38px 0}.container{padding:0 15px}.header-top{flex-direction:column;gap:8px;text-align:center}}
@media(max-width:480px){html{font-size:14px}.grid-4{grid-template-columns:1fr}.hero-section{padding:38px 0}.download-buttons{flex-direction:column;align-items:center}}
.text-center{text-align:center}.text-orange{color:#FF8C00}.text-blue{color:#0A2A4E}.mt-20{margin-top:20px}.mb-20{margin-bottom:20px}.mt-40{margin-top:40px}.mb-40{margin-bottom:40px}