/* ============================================
   gangwan 文章 CMS · 蓝白主题样式
   无图标，矩形直角按钮，响应式 H5 兼容
   ============================================ */

:root {
  --blue: #2563EB;
  --blue-dark: #1d4ed8;
  --blue-light: #eff6ff;
  --bg: #F0F7FF;
  --white: #ffffff;
  --ink: #1a1a1a;
  --gray: #666666;
  --gray-light: #9ca3af;
  --line: #d0d5dd;
  --line-light: #e5e7eb;
  --red: #c41e24;
  --red-light: #fef2f2;
  --green: #166534;
  --green-light: #f0fdf4;
  --radius: 0;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  font:15px/1.7 'PingFang SC','Microsoft YaHei','Helvetica Neue',system-ui,sans-serif;
  color:var(--ink);background:var(--bg);
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}
input,select,textarea,button{font-family:inherit;font-size:inherit}

/* ── 布局 ── */
.gw-container{max-width:1100px;margin:0 auto;padding:0 16px}
.gw-header{
  background:var(--white);border-bottom:1px solid var(--line);
  padding:14px 0;position:sticky;top:0;z-index:100;
}
.gw-header .gw-container{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}
.gw-logo{font-size:22px;font-weight:800;color:var(--blue)}
.gw-logo:hover{text-decoration:none}
.gw-nav{display:flex;gap:6px;flex-wrap:wrap}
.gw-nav a,.gw-nav span{
  display:inline-block;padding:6px 14px;font-size:14px;color:var(--ink);
  border:1px solid var(--line);background:var(--white);
  transition:.15s;
}
.gw-nav a:hover,.gw-nav a.active,.gw-nav span.active{
  background:var(--blue);color:#fff;border-color:var(--blue);text-decoration:none
}
.gw-main{padding:24px 0 48px}
.gw-footer{
  text-align:center;padding:24px 0;font-size:12px;color:var(--gray-light);
  border-top:1px solid var(--line-light);margin-top:40px
}

/* ── 文章列表 ── */
.gw-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px}
.gw-card{
  background:var(--white);border:1px solid var(--line);
  overflow:hidden;transition:.15s;display:flex;flex-direction:column
}
.gw-card:hover{border-color:var(--blue)}
.gw-card-img{
  width:100%;height:180px;object-fit:cover;background:var(--line-light);
  display:block
}
.gw-card-body{padding:16px 18px;flex:1;display:flex;flex-direction:column}
.gw-card-title{font-size:17px;font-weight:700;line-height:1.4;margin-bottom:8px}
.gw-card-title a{color:var(--ink)}
.gw-card-title a:hover{color:var(--blue);text-decoration:none}
.gw-card-summary{font-size:13px;color:var(--gray);line-height:1.6;flex:1;margin-bottom:10px;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.gw-card-meta{font-size:12px;color:var(--gray-light);display:flex;gap:16px;flex-wrap:wrap}
.gw-card-meta span{white-space:nowrap}

/* ── 分页 ── */
.gw-pagination{display:flex;justify-content:center;gap:6px;margin-top:32px;flex-wrap:wrap}
.gw-pagination a,.gw-pagination span{
  display:inline-block;padding:8px 14px;border:1px solid var(--line);
  font-size:14px;color:var(--ink);background:var(--white);min-width:40px;text-align:center
}
.gw-pagination a:hover{background:var(--blue);color:#fff;border-color:var(--blue);text-decoration:none}
.gw-pagination .current{background:var(--blue);color:#fff;border-color:var(--blue);font-weight:600}

/* ── 文章详情 ── */
.gw-article{background:var(--white);padding:32px;border:1px solid var(--line);max-width:860px;margin:0 auto}
.gw-article h1{font-size:24px;line-height:1.4;margin-bottom:12px}
.gw-article .meta{font-size:13px;color:var(--gray);margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid var(--line-light);display:flex;gap:20px;flex-wrap:wrap}
.gw-article .content{font-size:16px;line-height:1.9;word-wrap:break-word}
.gw-article .content h1,.gw-article .content h2,.gw-article .content h3{font-size:20px;margin:24px 0 12px;color:var(--blue-dark)}
.gw-article .content p{margin-bottom:14px}
.gw-article .content img{max-width:100%;height:auto;margin:12px 0}
.gw-article .content table{width:100%;border-collapse:collapse;margin:14px 0;font-size:14px}
.gw-article .content td,.gw-article .content th{border:1px solid var(--line);padding:8px 12px}
.gw-article .content th{background:var(--blue-light);font-weight:600}
.gw-article .content blockquote{border-left:3px solid var(--blue);padding:8px 16px;margin:14px 0;background:var(--blue-light);color:var(--gray)}
.gw-article .content pre{background:#f5f5f5;padding:14px;overflow-x:auto;font-size:13px;line-height:1.5;margin:14px 0}
.gw-article .content code{background:#f5f5f5;padding:2px 6px;font-size:13px}
.gw-article .content a{color:var(--blue);text-decoration:underline}
.gw-back-link{display:inline-block;margin-top:24px;font-size:14px;color:var(--blue)}
.gw-no-cover{width:100%;height:180px;background:var(--blue-light);display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--gray-light)}

/* ── 后台布局（左侧边栏） ── */
.gw-admin-layout{display:flex;min-height:100vh}
.gw-admin-sidebar{
  width:220px;background:var(--white);border-right:1px solid var(--line);
  display:flex;flex-direction:column;position:fixed;left:0;top:0;bottom:0;z-index:100
}
.gw-admin-sidebar-brand{
  padding:20px 24px;border-bottom:1px solid var(--line);
  font-size:18px;font-weight:800;color:var(--blue)
}
.gw-admin-sidebar-brand a{color:var(--blue)}
.gw-admin-sidebar-brand a:hover{text-decoration:none}
.gw-admin-sidebar-menu{flex:1;padding:12px 0;overflow-y:auto}
.gw-admin-sidebar-menu a{
  display:block;padding:13px 24px;font-size:14px;color:var(--ink);border-left:3px solid transparent
}
.gw-admin-sidebar-menu a:hover,.gw-admin-sidebar-menu a.active{
  background:var(--blue-light);color:var(--blue);border-left-color:var(--blue);text-decoration:none
}
.gw-admin-sidebar-user{
  padding:16px 24px;border-top:1px solid var(--line);
  font-size:13px;color:var(--gray)
}
.gw-admin-sidebar-user a{color:var(--red);margin-left:8px}
.gw-admin-content{
  flex:1;margin-left:220px;min-width:0;
  background:var(--bg);min-height:100vh;padding:28px 32px 48px
}
.gw-admin-title{
  font-size:22px;font-weight:700;margin-bottom:22px;padding-bottom:14px;
  border-bottom:1px solid var(--line);background:var(--white);margin:-28px -32px 24px;padding:20px 32px
}

/* ── 仪表盘卡片 ── */
.gw-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px;margin-bottom:30px}
.gw-stat-card{background:var(--white);border:1px solid var(--line);padding:24px 20px;text-align:center}
.gw-stat-num{font-size:38px;font-weight:800;color:var(--blue);line-height:1.2}
.gw-stat-label{font-size:13px;color:var(--gray);margin-top:6px}

/* ── 表格 ── */
.gw-table-wrap{overflow-x:auto}
.gw-table{width:100%;border-collapse:collapse;font-size:14px;background:var(--white);border:1px solid var(--line)}
.gw-table th{background:#f8fafc;padding:10px 14px;text-align:left;font-weight:600;border-bottom:2px solid var(--line);white-space:nowrap}
.gw-table td{padding:10px 14px;border-bottom:1px solid var(--line-light)}
.gw-table tr:hover td{background:var(--blue-light)}
.gw-table .actions{display:flex;gap:8px;flex-wrap:wrap}
.gw-table .actions a,.gw-table .actions button{
  padding:4px 10px;font-size:12px;border:1px solid var(--line);background:var(--white);color:var(--ink);cursor:pointer
}
.gw-table .actions a:hover{background:var(--blue);color:#fff;border-color:var(--blue);text-decoration:none}
.gw-table .actions .del{color:var(--red);border-color:var(--red)}
.gw-table .actions .del:hover{background:var(--red);color:#fff}
.gw-table input[type="checkbox"]{width:16px;height:16px;cursor:pointer}

/* ── 表单 ── */
.gw-form{background:var(--white);border:1px solid var(--line);padding:28px;max-width:860px}
.gw-field{margin-bottom:18px}
.gw-field label{display:block;font-size:13px;font-weight:600;margin-bottom:6px}
.gw-field .req{color:var(--red)}
.gw-field input[type="text"],
.gw-field input[type="password"],
.gw-field input[type="number"],
.gw-field input[type="url"],
.gw-field select,
.gw-field textarea{
  width:100%;padding:10px 12px;border:1px solid var(--line);font-size:14px;outline:none;background:var(--white)
}
.gw-field input:focus,.gw-field select:focus,.gw-field textarea:focus{border-color:var(--blue)}
.gw-field textarea{min-height:120px;resize:vertical}
.gw-field .hint{font-size:12px;color:var(--gray);margin-top:4px}

/* ── 按钮 ── */
.gw-btn{
  display:inline-block;padding:10px 22px;font-size:14px;font-weight:600;
  border:1px solid var(--line);background:var(--white);color:var(--ink);cursor:pointer;
  text-align:center;line-height:1.4;transition:.15s
}
.gw-btn:hover{text-decoration:none}
.gw-btn-primary{background:var(--blue);color:#fff;border-color:var(--blue)}
.gw-btn-primary:hover{background:var(--blue-dark);border-color:var(--blue-dark)}
.gw-btn-danger{background:var(--red);color:#fff;border-color:var(--red)}
.gw-btn-danger:hover{opacity:.9}
.gw-btn-sm{padding:6px 14px;font-size:12px}
.gw-btn-block{display:block;width:100%}
.gw-btn-group{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}
.gw-btn-group form{display:inline}

/* ── 消息提示 ── */
.gw-msg{padding:12px 16px;margin-bottom:18px;font-size:14px}
.gw-msg-success{background:var(--green-light);color:var(--green);border:1px solid #bbf7d0}
.gw-msg-error{background:var(--red-light);color:var(--red);border:1px solid #fecaca}

/* ── 搜索栏 ── */
.gw-search-bar{display:flex;gap:10px;margin-bottom:18px;flex-wrap:wrap}
.gw-search-bar input,.gw-search-bar select{
  padding:8px 12px;border:1px solid var(--line);font-size:14px;outline:none;background:var(--white)
}
.gw-search-bar input:focus,.gw-search-bar select:focus{border-color:var(--blue)}
.gw-search-bar input{flex:1;min-width:200px}

/* ── 登录页 ── */
.gw-login{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:var(--bg);padding:20px
}
.gw-login-card{background:var(--white);padding:36px 32px;max-width:400px;width:100%;border:1px solid var(--line)}
.gw-login-card h1{font-size:20px;text-align:center;margin-bottom:24px;color:var(--blue)}
.gw-captcha{display:flex;gap:10px;align-items:center}
.gw-captcha img{height:42px;border:1px solid var(--line);cursor:pointer}
.gw-captcha input{flex:1}

/* ── 文件上传区域 ── */
.gw-upload-zone{
  border:2px dashed var(--line);padding:32px;text-align:center;
  background:var(--white);cursor:pointer;transition:.15s;margin-bottom:18px
}
.gw-upload-zone:hover,.gw-upload-zone.dragover{border-color:var(--blue);background:var(--blue-light)}
.gw-upload-zone p{font-size:14px;color:var(--gray)}
.gw-upload-zone p strong{color:var(--blue)}
.gw-upload-list{margin-top:14px}
.gw-upload-item{
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 12px;background:var(--white);border:1px solid var(--line-light);margin-bottom:6px;font-size:13px
}
.gw-upload-item .name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gw-upload-item .size{color:var(--gray);margin:0 12px;white-space:nowrap}
.gw-upload-item .ok{color:var(--green)}
.gw-upload-item .err{color:var(--red)}
.gw-progress{height:4px;background:var(--line-light);margin-top:6px}
.gw-progress-bar{height:100%;background:var(--blue);transition:.3s}

/* ── 编辑器容器 ── */
.gw-editor-wrap{border:1px solid var(--line);background:var(--white)}

/* ── 弹窗（图片选择器等） ── */
.gw-modal-mask{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:200;align-items:center;justify-content:center}
.gw-modal-mask.show{display:flex}
.gw-modal{background:var(--white);max-width:700px;width:90%;max-height:80vh;overflow-y:auto;padding:24px;border:1px solid var(--line)}
.gw-modal-title{font-size:16px;font-weight:700;margin-bottom:14px}
.gw-image-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin-bottom:14px}
.gw-image-grid img{width:100%;height:100px;object-fit:cover;border:2px solid transparent;cursor:pointer}
.gw-image-grid img:hover,.gw-image-grid img.selected{border-color:var(--blue)}

/* ── 响应式 ── */
@media (max-width: 768px) {
  .gw-list{grid-template-columns:1fr}
  .gw-article{padding:18px}
  .gw-article h1{font-size:20px}
  .gw-form{padding:16px}
  .gw-stats{grid-template-columns:repeat(2,1fr)}
  .gw-stat-num{font-size:28px}
  .gw-table{font-size:13px}
  .gw-table th,.gw-table td{padding:8px 10px}
  .gw-header .gw-container{flex-direction:column;align-items:flex-start}
  .gw-nav{overflow-x:auto;width:100%;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}
  .gw-nav a,.gw-nav span{flex-shrink:0}
  /* 移动端侧边栏变顶部 */
  .gw-admin-sidebar{position:relative;width:100%;height:auto;border-right:none;border-bottom:1px solid var(--line)}
  .gw-admin-content{margin-left:0;padding:18px 16px 32px}
  .gw-admin-title{margin:-18px -16px 18px;padding:16px}
  .gw-admin-sidebar-menu{display:flex;overflow-x:auto;padding:8px 12px;-webkit-overflow-scrolling:touch}
  .gw-admin-sidebar-menu a{white-space:nowrap;border-left:none;border-bottom:2px solid transparent;padding:10px 14px}
  .gw-admin-sidebar-menu a:hover,.gw-admin-sidebar-menu a.active{border-left-color:transparent;border-bottom-color:var(--blue);background:transparent}
  .gw-admin-sidebar-user{text-align:center}
}
@media (max-width: 480px) {
  .gw-stats{grid-template-columns:1fr 1fr}
  .gw-card-img{height:160px}
  .gw-pagination a,.gw-pagination span{padding:6px 10px;font-size:12px;min-width:32px}
  .gw-login-card{padding:24px 20px}
}