/* 工程蓝图主题 — 多爱力CMS */
:root {
  --bg:          #0a1628;
  --bg-panel:    #0e1f40;
  --bg-card:     #122347;
  --bg-hover:    #1a3060;
  --blue-dark:   #1a3a6b;
  --blue-mid:    #1d4ed8;
  --blue-bright: #3b82f6;
  --accent:      #60a5fa;
  --accent-2:    #93c5fd;
  --grid:        rgba(96,165,250,0.10);
  --border:      rgba(96,165,250,0.25);
  --border-hi:   rgba(96,165,250,0.6);
  --white:       #f0f6ff;
  --muted:       #7ca8cc;
  --success:     #22c55e;
  --error:       #ef4444;
  --warn:        #f59e0b;
  --top-badge:   #d97706;
  --radius:      3px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px}
body{
  background:var(--bg);
  color:var(--white);
  font-family:'Courier New',Courier,monospace;
  min-height:100vh;
  background-image:
    linear-gradient(var(--grid) 1px,transparent 1px),
    linear-gradient(90deg,var(--grid) 1px,transparent 1px);
  background-size:40px 40px;
}

a{color:var(--accent);text-decoration:none;}
a:hover{color:var(--accent-2);}
img{display:block;max-width:100%;}
ul,ol{list-style:none;}

/* ─── Layout ─────────────────────────── */
.container{max-width:1280px;margin:0 auto;padding:0 20px;}
.page-wrap{min-height:calc(100vh - 200px);padding-bottom:60px;}

/* ─── Header ─────────────────────────── */
.site-header{
  background:var(--bg-panel);
  border-bottom:1px solid var(--border);
  position:sticky;top:0;z-index:100;
}
.header-inner{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:8px 20px;min-height:64px;height:auto;max-width:1280px;margin:0 auto;
}
.site-logo{
  font-size:1.2rem;font-weight:700;color:var(--accent);letter-spacing:.12em;white-space:nowrap;
}
.site-logo span{color:var(--muted);font-size:.75rem;display:block;letter-spacing:.15em;margin-top:2px;}
.main-nav{display:flex;gap:4px;flex:1;flex-wrap:wrap;padding:0 16px;align-items:center;}
.main-nav a{
  color:var(--muted);font-size:.82rem;padding:6px 12px;border-radius:var(--radius);
  letter-spacing:.06em;transition:all .2s;border:1px solid transparent;white-space:nowrap;
}
.main-nav a:hover,.main-nav a.active{
  color:var(--accent);background:var(--bg-card);border-color:var(--border);
}
.header-search{display:flex;gap:0;flex:0 0 260px;}
.header-search input{
  flex:1;background:var(--bg-card);border:1px solid var(--border);border-right:none;
  color:var(--white);padding:8px 14px;font-family:inherit;font-size:.85rem;
  border-radius:var(--radius) 0 0 var(--radius);outline:none;
}
.header-search input:focus{border-color:var(--blue-bright);}
.header-search button{
  background:var(--blue-mid);color:#fff;border:none;padding:0 16px;
  font-family:inherit;font-size:.85rem;cursor:pointer;
  border-radius:0 var(--radius) var(--radius) 0;transition:background .2s;
}
.header-search button:hover{background:var(--blue-bright);}
.header-actions{display:flex;gap:8px;align-items:center;flex-shrink:0;}
.btn{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--blue-mid);color:#fff;border:none;
  padding:8px 18px;font-family:inherit;font-size:.85rem;font-weight:700;
  letter-spacing:.06em;border-radius:var(--radius);cursor:pointer;transition:background .2s;
  white-space:nowrap;
}
.btn:hover{background:var(--blue-bright);}
.btn-sm{padding:5px 12px;font-size:.78rem;}
.btn-outline{background:transparent;border:1px solid var(--border);color:var(--accent);}
.btn-outline:hover{background:var(--bg-card);}
.btn-danger{background:#7f1d1d;border:1px solid var(--error);color:#fca5a5;}
.btn-danger:hover{background:var(--error);}
.btn-success{background:#14532d;}
.btn-success:hover{background:var(--success);color:#fff;}

/* ─── Footer ─────────────────────────── */
.site-footer{
  background:var(--bg-panel);border-top:1px solid var(--border);
  padding:28px 20px;margin-top:60px;text-align:center;
}
.site-footer p{font-size:.78rem;color:var(--muted);line-height:2;}
.site-footer a{color:var(--muted);}
.site-footer a:hover{color:var(--accent);}

/* ─── Page Title ─────────────────────── */
.page-title{
  padding:28px 0 20px;border-bottom:1px solid var(--border);margin-bottom:28px;
}
.page-title h1{font-size:1.5rem;color:var(--accent);letter-spacing:.1em;}
.page-title p{font-size:.82rem;color:var(--muted);margin-top:4px;letter-spacing:.06em;}

/* ─── Cards & Panels ─────────────────── */
.card{
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);
  position:relative;overflow:hidden;
}
.card-header{
  padding:16px 20px;border-bottom:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;
}
.card-header h3{font-size:.95rem;color:var(--accent);letter-spacing:.08em;}
.card-body{padding:20px;}
.panel{
  background:var(--bg-panel);border:1px solid var(--border);
  border-radius:var(--radius);padding:20px;
}

/* ─── Site Grid ──────────────────────── */
.site-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;}
.site-card{
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);
  padding:14px;display:flex;flex-direction:column;gap:8px;transition:all .2s;cursor:pointer;
  position:relative;
}
.site-card:hover{border-color:var(--border-hi);background:var(--bg-hover);}
.site-card.top-card{border-color:var(--top-badge);}
.site-card.top-card::before{
  content:'TOP';position:absolute;top:0;right:0;
  background:var(--top-badge);color:#fff;font-size:.65rem;font-weight:700;
  padding:2px 7px;border-radius:0 var(--radius) 0 var(--radius);letter-spacing:.08em;
}
.site-card-head{display:flex;align-items:center;gap:10px;}
.site-favicon{width:32px;height:32px;border-radius:4px;object-fit:cover;background:var(--bg-panel);flex-shrink:0;}
.site-title{font-size:.9rem;font-weight:700;color:var(--white);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.site-domain{font-size:.72rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.site-desc{font-size:.78rem;color:var(--muted);line-height:1.5;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
.site-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:.7rem;color:var(--muted);}
.site-meta span{display:flex;align-items:center;gap:3px;}
.badge{display:inline-block;padding:2px 7px;border-radius:var(--radius);font-size:.7rem;font-weight:700;letter-spacing:.05em;}
.badge-pending{background:rgba(245,158,11,.15);color:var(--warn);border:1px solid rgba(245,158,11,.3);}
.badge-approved{background:rgba(34,197,94,.15);color:var(--success);border:1px solid rgba(34,197,94,.3);}
.badge-rejected{background:rgba(239,68,68,.15);color:var(--error);border:1px solid rgba(239,68,68,.3);}
.badge-top{background:rgba(217,119,6,.2);color:#fbbf24;border:1px solid rgba(217,119,6,.4);}

/* ─── Category Tabs ─────────────────── */
.cat-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px;}
.cat-tab{
  display:flex;align-items:center;gap:6px;
  background:var(--bg-panel);border:1px solid var(--border);
  color:var(--muted);font-size:.82rem;padding:8px 16px;
  border-radius:var(--radius);cursor:pointer;transition:all .2s;text-decoration:none;
  letter-spacing:.04em;
}
.cat-tab:hover,.cat-tab.active{
  background:var(--bg-card);border-color:var(--blue-bright);color:var(--accent);
}
.cat-tab .count{
  background:var(--blue-dark);color:var(--accent-2);font-size:.7rem;
  padding:1px 6px;border-radius:10px;
}

/* ─── Section ────────────────────────── */
.section-title{
  display:flex;align-items:center;gap:10px;margin-bottom:16px;padding-bottom:8px;
  border-bottom:1px solid var(--border);
}
.section-title h2{font-size:1rem;color:var(--accent);letter-spacing:.1em;}
.section-title::before{content:'//';color:var(--muted);font-size:.85rem;}
.section-title .more-link{margin-left:auto;font-size:.78rem;color:var(--muted);}
.section-title .more-link:hover{color:var(--accent);}

/* ─── Table ──────────────────────────── */
.data-table{width:100%;border-collapse:collapse;font-size:.85rem;}
.data-table th{
  background:var(--bg-panel);color:var(--muted);
  padding:10px 14px;text-align:left;border-bottom:1px solid var(--border);
  letter-spacing:.06em;font-size:.78rem;white-space:nowrap;
}
.data-table td{
  padding:10px 14px;border-bottom:1px solid var(--grid);
  vertical-align:middle;
}
.data-table tr:hover td{background:var(--bg-hover);}
.data-table td .actions-group{display:flex;gap:6px;flex-wrap:wrap;}

/* ─── Forms ──────────────────────────── */
.form-group{margin-bottom:20px;}
.form-label{display:block;font-size:.78rem;color:var(--muted);margin-bottom:6px;letter-spacing:.1em;text-transform:uppercase;}
.form-control{
  width:100%;background:var(--bg-panel);border:1px solid var(--border);
  color:var(--white);padding:10px 14px;font-family:inherit;font-size:.92rem;
  border-radius:var(--radius);outline:none;transition:border-color .2s;
}
.form-control:focus{border-color:var(--blue-bright);}
.form-control::placeholder{color:var(--muted);}
textarea.form-control{resize:vertical;min-height:100px;line-height:1.6;}
select.form-control{cursor:pointer;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.form-hint{font-size:.75rem;color:var(--muted);margin-top:4px;letter-spacing:.04em;}
.input-group{display:flex;gap:0;}
.input-group .form-control{border-radius:var(--radius) 0 0 var(--radius);border-right:none;}
.input-group .btn{border-radius:0 var(--radius) var(--radius) 0;flex-shrink:0;}

/* ─── Alert/Flash ────────────────────── */
.alert{padding:12px 16px;border-radius:var(--radius);font-size:.88rem;margin-bottom:20px;border-left:3px solid;}
.alert-error{background:rgba(239,68,68,.1);border-color:var(--error);color:#fca5a5;}
.alert-success{background:rgba(34,197,94,.1);border-color:var(--success);color:#86efac;}
.alert-warn{background:rgba(245,158,11,.1);border-color:var(--warn);color:#fde68a;}
.flash-error{background:rgba(239,68,68,.1);border-left:3px solid var(--error);color:#fca5a5;padding:12px 16px;margin-bottom:16px;border-radius:var(--radius);}
.flash-success{background:rgba(34,197,94,.1);border-left:3px solid var(--success);color:#86efac;padding:12px 16px;margin-bottom:16px;border-radius:var(--radius);}

/* ─── Pager ──────────────────────────── */
.pager{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;margin-top:32px;}
.page-btn{
  min-width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;
  background:var(--bg-panel);border:1px solid var(--border);color:var(--muted);
  border-radius:var(--radius);font-size:.82rem;transition:all .2s;text-decoration:none;padding:0 10px;
}
.page-btn:hover,.page-btn.active{background:var(--blue-mid);border-color:var(--blue-bright);color:#fff;}

/* ─── Referrer Badge ─────────────────── */
.referrer-badge{
  display:inline-flex;align-items:center;gap:4px;
  background:rgba(96,165,250,.15);border:1px solid var(--border);
  color:var(--accent);font-size:.7rem;padding:2px 8px;border-radius:10px;white-space:nowrap;
}

/* ─── Modal ──────────────────────────── */
.modal-overlay{
  display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:500;
  align-items:center;justify-content:center;padding:20px;
}
.modal-overlay.open{display:flex;}
.modal{
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);
  width:100%;max-width:520px;max-height:90vh;overflow-y:auto;
}
.modal-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 20px;border-bottom:1px solid var(--border);
}
.modal-head h3{font-size:1rem;color:var(--accent);}
.modal-close{background:none;border:none;color:var(--muted);cursor:pointer;font-size:1.2rem;padding:4px;}
.modal-close:hover{color:var(--white);}
.modal-body{padding:24px 20px;}
.modal-foot{padding:16px 20px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:10px;}

/* ─── User Center ────────────────────── */
.uc-wrap{display:grid;grid-template-columns:220px 1fr;gap:24px;padding:28px 0;}
.uc-sidebar{
  background:var(--bg-panel);border:1px solid var(--border);
  border-radius:var(--radius);padding:16px 0;height:fit-content;position:sticky;top:80px;
}
.uc-user-info{padding:16px 20px;border-bottom:1px solid var(--border);text-align:center;}
.uc-avatar{width:64px;height:64px;border-radius:50%;border:2px solid var(--border);margin:0 auto 10px;background:var(--bg-card);object-fit:cover;}
.uc-username{font-size:.95rem;font-weight:700;}
.uc-group{font-size:.75rem;color:var(--muted);margin-top:3px;}
.uc-nav a{
  display:flex;align-items:center;gap:8px;padding:11px 20px;
  color:var(--muted);font-size:.85rem;border-left:3px solid transparent;transition:all .2s;
}
.uc-nav a:hover,.uc-nav a.active{color:var(--accent);border-left-color:var(--blue-bright);background:var(--bg-card);}
.uc-content{min-width:0;}

/* ─── Admin ──────────────────────────── */
.admin-layout{display:flex;min-height:100vh;}
.admin-sidebar{
  width:220px;flex-shrink:0;background:var(--bg-panel);border-right:1px solid var(--border);
  position:sticky;top:0;height:100vh;overflow-y:auto;
}
.admin-sidebar .logo{
  padding:20px 16px;border-bottom:1px solid var(--border);
  font-size:1rem;font-weight:700;color:var(--accent);letter-spacing:.1em;
}
.admin-sidebar .logo span{font-size:.7rem;color:var(--muted);display:block;margin-top:3px;}
.admin-nav-group{padding:12px 0;}
.admin-nav-group-title{padding:6px 16px;font-size:.68rem;color:var(--muted);letter-spacing:.15em;text-transform:uppercase;}
.admin-nav a{
  display:flex;align-items:center;gap:8px;padding:9px 16px;
  color:var(--muted);font-size:.83rem;border-left:3px solid transparent;transition:all .2s;
}
.admin-nav a:hover,.admin-nav a.active{color:var(--accent);border-left-color:var(--blue-bright);background:rgba(96,165,250,.06);}
.admin-main{flex:1;min-width:0;display:flex;flex-direction:column;}
.admin-topbar{
  background:var(--bg-panel);border-bottom:1px solid var(--border);
  padding:0 24px;height:56px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;
}
.admin-topbar h1{font-size:.95rem;color:var(--white);letter-spacing:.08em;}
.admin-content{padding:24px;flex:1;}

/* ─── Stats Row ──────────────────────── */
.stats-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:24px;}
.stat-card{
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);
  padding:18px 20px;position:relative;overflow:hidden;
}
.stat-card::after{
  content:'';position:absolute;bottom:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--blue-mid),var(--accent));
}
.stat-label{font-size:.72rem;color:var(--muted);letter-spacing:.1em;text-transform:uppercase;}
.stat-value{font-size:2rem;font-weight:700;color:var(--accent);margin-top:4px;line-height:1;}
.stat-delta{font-size:.75rem;color:var(--muted);margin-top:4px;}

/* ─── Toggle Switch ──────────────────── */
.toggle{display:flex;align-items:center;gap:10px;cursor:pointer;}
.toggle input{display:none;}
.toggle-track{
  width:44px;height:24px;background:var(--bg-panel);border:1px solid var(--border);
  border-radius:12px;position:relative;transition:all .2s;flex-shrink:0;
}
.toggle input:checked + .toggle-track{background:var(--blue-mid);border-color:var(--blue-bright);}
.toggle-track::after{
  content:'';position:absolute;left:3px;top:3px;width:16px;height:16px;
  background:var(--muted);border-radius:50%;transition:all .2s;
}
.toggle input:checked + .toggle-track::after{left:23px;background:#fff;}
.toggle-label{font-size:.88rem;color:var(--white);}

/* ─── Annotation / Blueprint decor ──── */
.bp-note{
  font-size:.72rem;color:var(--muted);letter-spacing:.05em;
  border-left:2px solid var(--border);padding-left:10px;margin:8px 0;
}
.bp-ruler{
  display:flex;align-items:center;gap:8px;
  font-size:.7rem;color:var(--muted);letter-spacing:.1em;margin:16px 0;
}
.bp-ruler::before,.bp-ruler::after{content:'';flex:1;height:1px;background:var(--border);}

/* ─── Mobile ─────────────────────────── */
.mobile-menu-btn{display:none;background:none;border:none;color:var(--accent);font-size:1.5rem;cursor:pointer;padding:8px;}
@media(max-width:900px){
  .main-nav,.header-search{display:none;}
  .main-nav.open{display:flex;flex-direction:column;position:fixed;inset:64px 0 0;background:var(--bg-panel);z-index:200;padding:16px;gap:0;overflow-y:auto;}
  .main-nav.open a{padding:12px 16px;border-bottom:1px solid var(--border);}
  .mobile-menu-btn{display:block;}
  .uc-wrap{grid-template-columns:1fr;}
  .uc-sidebar{position:static;height:auto;}
  .form-row{grid-template-columns:1fr;}
  .admin-sidebar{display:none;}
  .site-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));}
}
@media(max-width:600px){
  .stats-row{grid-template-columns:1fr 1fr;}
  .site-grid{grid-template-columns:repeat(2,1fr);}
}
