:root{--primary:#0b2a4a;--accent:#f39c12;--light:#f5f7fa;--border:#e0e6ed;--text:#2c3e50;--muted:#6b7c93}
*{box-sizing:border-box}
body{font-family:'Segoe UI',Arial,sans-serif;margin:0;color:var(--text);background:var(--light);line-height:1.6}
.container{max-width:1200px;margin:0 auto;background:#fff;box-shadow:0 0 20px rgba(0,0,0,.06);min-height:100vh}
header.site{background:linear-gradient(135deg,var(--primary) 0%,#1a4a7a 100%);padding:22px 30px;border-bottom:4px solid var(--accent)}
header.site h1{margin:0;color:#fff;font-size:1.5em}
header.site h1 span{color:var(--accent)}
header.site p{margin:4px 0 0;color:#cde1f5;font-size:.85em}
.user-nav{list-style:none;padding:0;margin:12px 0 0;display:flex;gap:10px;flex-wrap:wrap}
.user-nav a{color:#fff;text-decoration:none;background:rgba(255,255,255,.15);padding:5px 12px;border-radius:15px;font-size:.82em}
.user-nav a:hover{background:var(--accent)}
nav.main{background:#0a1f35;padding:10px 30px;display:flex;gap:18px;flex-wrap:wrap}
nav.main a{color:#b8cfe3;text-decoration:none;font-size:.82em;font-weight:600;text-transform:uppercase;letter-spacing:.4px}
nav.main a:hover,nav.main a.active{color:var(--accent)}
.trending{background:#fff8e6;border-left:5px solid var(--accent);padding:12px 30px;font-size:.85em}
main{padding:30px}
main h2{color:var(--primary);border-bottom:2px solid var(--primary);padding-bottom:6px}
main a{color:#1a4a7a}
.btn{display:inline-block;background:var(--primary);color:#fff!important;text-decoration:none;padding:7px 14px;border-radius:3px;font-size:.82em;font-weight:600;margin:2px}
.btn:hover{background:#0a1f35}
.btn-accent{background:var(--accent)}
.btn-accent:hover{background:#d68910}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.card{border:1px solid var(--border);border-radius:6px;overflow:hidden;background:#fff}
.card .cover{height:160px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;text-align:center;padding:15px;font-size:.9em}
.card .body{padding:15px}
.card h3{margin:0 0 8px;font-size:1em}
.card p{font-size:.85em;color:var(--muted);margin:6px 0}
.article-list{list-style:none;padding:0}
.article-list li{margin-bottom:14px;padding-bottom:14px;border-bottom:1px solid var(--border)}
.article-list .title{font-weight:600;color:var(--primary);text-decoration:none;font-size:1em}
.article-list .meta{font-size:.82em;color:var(--muted);margin-top:4px}
footer.site{background:#0a1f35;color:#b8cfe3;padding:25px 30px;text-align:center;font-size:.82em;margin-top:40px}
footer.site a{color:var(--accent);text-decoration:none}
.breadcrumb{font-size:.82em;color:var(--muted);margin-bottom:15px}
.breadcrumb a{color:var(--primary);text-decoration:none}
.sidebar-layout{display:grid;grid-template-columns:1fr 280px;gap:30px}
.sidebar-layout .side{font-size:.85em}
.sidebar-layout .side h3{font-size:.95em;border-bottom:1px solid var(--border);padding-bottom:5px;color:var(--primary)}
.sidebar-layout .side ul{list-style:none;padding:0}
.sidebar-layout .side li{margin:6px 0}
input[type=text],input[type=email],input[type=password],textarea,select{width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:3px;font-family:inherit;font-size:.9em;margin-bottom:10px}
button,input[type=submit]{background:var(--primary);color:#fff;border:0;padding:8px 18px;border-radius:3px;cursor:pointer;font-weight:600}
button:hover{background:#0a1f35}
.form-box{max-width:450px;margin:0 auto;border:1px solid var(--border);padding:25px;border-radius:6px}
.form-box label{display:block;font-size:.85em;font-weight:600;margin-bottom:4px}
.notice{background:#eaf3fb;border-left:4px solid var(--primary);padding:15px 20px;border-radius:4px;margin-bottom:20px}
table{width:100%;border-collapse:collapse;font-size:.88em}
th,td{padding:8px 10px;border-bottom:1px solid var(--border);text-align:left}
th{background:var(--light);color:var(--primary)}
@media(max-width:768px){.sidebar-layout{grid-template-columns:1fr}main{padding:20px}}