:root {
  --bg: #0b0f14;
  --panel: #121821;
  --text: #e6edf3;
  --muted: #9fb1c3;
  --primary: #4ea1ff;
  --accent: #7c5cff;
  --border: #1e2a3a;
  --danger: #ff5577;
  --success: #3ddc97;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
body.dark{background:var(--bg);color:var(--text)}
.container{max-width:1100px;margin:0 auto;padding:16px}
.site-header{background:var(--panel);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:10}
.header-inner{display:flex;align-items:center;justify-content:space-between}
.brand{font-weight:700;color:var(--text);text-decoration:none;letter-spacing:.3px}
.nav a{color:var(--muted);text-decoration:none;margin-left:14px}
.nav a:hover{color:var(--text)}
.site-footer{border-top:1px solid var(--border);background:var(--panel);color:var(--muted)}
.card{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:16px}
.btn{background:var(--primary);border:none;color:#fff;padding:10px 14px;border-radius:10px;cursor:pointer}
.btn.secondary{background:transparent;color:var(--text);border:1px solid var(--border)}
.btn.danger{background:var(--danger)}
.btn.success{background:var(--success);color:#0b0f14}
.input,textarea,select{width:100%;background:#0f1520;border:1px solid var(--border);color:var(--text);border-radius:10px;padding:10px}
.label{display:block;font-size:12px;color:var(--muted);margin-bottom:6px}
.mt-2{margin-top:8px}.mt-3{margin-top:12px}.mt-4{margin-top:16px}.mt-6{margin-top:24px}
.mb-2{margin-bottom:8px}.mb-4{margin-bottom:16px}
.grid{display:grid;gap:16px}.grid-2{grid-template-columns:1fr 1fr}.grid-3{grid-template-columns:repeat(3,1fr)}
.toolbar{display:flex;gap:6px;flex-wrap:wrap;background:#0f1621;border:1px solid var(--border);border-radius:12px;padding:6px}
.toolbar button{background:#0d141e;color:var(--text);border:1px solid var(--border);border-radius:8px;padding:6px 10px;cursor:pointer}
.toolbar input[type=file]{display:none}
.editor{background:#0b111a;border:1px solid var(--border);min-height:300px;padding:12px;border-radius:12px}
.editor:focus{outline:2px solid #2a76ff44}
.news-list a{color:var(--primary);text-decoration:none}
.news-item{padding:12px 0;border-bottom:1px solid var(--border)}
.badge{display:inline-block;background:#0e1a2a;border:1px solid var(--border);color:var(--muted);padding:4px 8px;border-radius:999px;font-size:12px}
.small{font-size:12px;color:var(--muted)}
.logo{max-width:100%;height:64px;object-fit:contain}
.cover{width:100%;max-height:380px;object-fit:cover;border-radius:12px;border:1px solid var(--border)}

/* Banner: edge-to-edge cover */
.banner-card{padding:0;overflow:hidden}
.banner-img{display:block;width:100%;height:260px;object-fit:cover}

/* Link colors override */
a, a:visited{color:#cfe2ff;text-decoration:none}
a:hover{color:#ffffff;text-decoration:underline}
.news-item a, .news-item a:visited{color:#cfe2ff}

/* Image drag-resize overlay */
.img-resizer-overlay{
  position:absolute;
  border:1px dashed var(--border);
  border-radius:6px;
  pointer-events:none;
  z-index:9999;
}
.img-resizer-overlay .img-resizer-handle{
  position:absolute;
  width:10px;height:10px;
  background:#cfe2ff;
  border:1px solid #1f2937;
  border-radius:2px;
  pointer-events:auto;
}
.img-resizer-overlay .img-nw{ left:-6px; top:-6px; cursor:nwse-resize; }
.img-resizer-overlay .img-ne{ right:-6px; top:-6px; cursor:nesw-resize; }
.img-resizer-overlay .img-sw{ left:-6px; bottom:-6px; cursor:nesw-resize; }
.img-resizer-overlay .img-se{ right:-6px; bottom:-6px; cursor:nwse-resize; }

.editor img{ max-width:100%; height:auto; }

/* Touch-friendly resizer */
.img-resizer-overlay{ touch-action:none; }
.img-resizer-overlay, .img-resizer-overlay *{
  -webkit-user-select:none; user-select:none;
  -webkit-touch-callout:none;
}
.img-resizer-overlay .img-resizer-handle{
  width:16px;height:16px;
}
@media (max-width:640px){
  .img-resizer-overlay .img-resizer-handle{ width:20px;height:20px; }
}
.editor img{ -webkit-user-drag:none; }


/* Mobile layout */
@media (max-width: 640px){
  .grid-2, .grid-3 { grid-template-columns: 1fr; }
  .banner-img{ height: 220px; }
}