/* 大西瓜博客 - 后台共享样式 */
:root{
  --bg:#f7f8fa; --card:#fff; --text:#1a202c; --sub:#718096;
  --line:#edf0f4; --accent:#ff6b6b; --accent-soft:#fff5f5;
  --radius:14px; --radius-lg:16px;
  --green:#10b981; --amber:#f59e0b; --red:#ef4444; --blue:#5b8def;
}
/* 暗黑模式 */
html[data-theme="dark"]{
  --bg:#0f1419; --card:#1a2128; --text:#e8e6e3; --sub:#8b9aa8;
  --line:#262f38; --accent:#ff7b7b; --accent-soft:rgba(255,123,123,.14);
  --green:#4ade80; --amber:#fbbf24; --red:#f87171; --blue:#7fa8f0;
}
html[data-theme="dark"] .blob{opacity:.18;}
html[data-theme="dark"] .field input{background:#1f272f;color:var(--text);}
html[data-theme="dark"] .alert{background:rgba(190,100,100,.14);border-color:rgba(190,100,100,.3);color:#e0a0a0;}
html[data-theme="dark"] .alert.ok{background:rgba(107,168,143,.14);border-color:rgba(107,168,143,.3);color:#8fc9b0;}
html[data-theme="dark"] .login-card{box-shadow:0 1px 2px rgba(0,0,0,.3),0 24px 60px -28px rgba(0,0,0,.7);}
*{margin:0;padding:0;box-sizing:border-box;}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  background:var(--bg);color:var(--text);line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;}

/* ===== 登录页 ===== */
body.login-body{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  padding:24px;position:relative;overflow:hidden;
}
.blob{position:fixed;border-radius:50%;filter:blur(70px);opacity:.35;pointer-events:none;}
.blob1{width:340px;height:340px;background:#ffd3a5;top:-90px;left:-70px;}
.blob2{width:300px;height:300px;background:#a8edea;bottom:-80px;right:-60px;}

.login-card{
  position:relative;z-index:2;width:100%;max-width:380px;
  background:var(--card);border-radius:var(--radius-lg);padding:38px 32px 30px;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 24px 60px -28px rgba(16,24,40,.28);
}
.logo{text-align:center;margin-bottom:26px;}
.logo .av{
  width:64px;height:64px;border-radius:50%;margin:0 auto 14px;
  background:linear-gradient(135deg,#ff9a76,#ff6b6b);
  display:flex;align-items:center;justify-content:center;font-size:32px;
  box-shadow:0 8px 20px -8px rgba(255,107,107,.6);
}
.logo h1{font-size:19px;font-weight:800;letter-spacing:-.3px;}
.logo p{font-size:13px;color:var(--sub);margin-top:4px;}

.field{margin-bottom:16px;}
.field label{display:block;font-size:13px;font-weight:600;color:#4a5568;margin-bottom:7px;}
.input-wrap{position:relative;}
.input-wrap .ic{
  position:absolute;left:13px;top:50%;transform:translateY(-50%);
  font-size:15px;opacity:.55;pointer-events:none;
}
.field input{
  width:100%;padding:12px 14px 12px 38px;border:1px solid var(--line);
  border-radius:11px;font-size:15px;font-family:inherit;background:#fcfcfd;
  color:var(--text);outline:none;transition:.2s;
}
.field input:focus{border-color:#ffc9c9;background:#fff;box-shadow:0 0 0 3px rgba(255,107,107,.1);}
.field input::placeholder{color:#c3cad5;}

.toggle-pw{
  position:absolute;right:11px;top:50%;transform:translateY(-50%);
  background:none;border:none;cursor:pointer;font-size:15px;opacity:.5;
  padding:4px;line-height:1;transition:.2s;
}
.toggle-pw:hover{opacity:.9;}

.row{display:flex;align-items:center;justify-content:flex-start;margin-bottom:22px;font-size:13px;}
.remember{display:flex;align-items:center;gap:6px;color:var(--sub);cursor:pointer;user-select:none;}
.remember input{width:15px;height:15px;accent-color:var(--accent);cursor:pointer;}

.btn{
  width:100%;padding:13px;border:none;border-radius:11px;
  background:linear-gradient(135deg,#ff9a76,#ff6b6b);color:#fff;
  font-size:15.5px;font-weight:700;cursor:pointer;transition:.2s;
  box-shadow:0 8px 20px -8px rgba(255,107,107,.7);
}
.btn:hover{transform:translateY(-1px);box-shadow:0 12px 26px -8px rgba(255,107,107,.75);}
.btn:active{transform:translateY(0);}
.btn:disabled{opacity:.6;cursor:not-allowed;transform:none;}

.alert{
  display:none;align-items:center;gap:8px;
  background:var(--accent-soft);color:#c53030;border:1px solid #fed7d7;
  padding:10px 14px;border-radius:10px;font-size:13.5px;margin-bottom:16px;
}
.alert.show{display:flex;animation:shake .4s;}
.alert.ok{background:#f0fdf4;color:#166534;border-color:#bbf7d0;}
@keyframes shake{
  0%,100%{transform:translateX(0);} 25%{transform:translateX(-5px);} 75%{transform:translateX(5px);}
}

.foot-note{text-align:center;margin-top:22px;font-size:12px;color:#c3cad5;}

@media(max-width:420px){
  .login-card{padding:30px 22px 24px;}
  .logo .av{width:56px;height:56px;font-size:28px;}
}
