/* d token 登录/注册页：深蓝太空风，仅作用于含 username 输入框的页面（登录、注册） */
.dt-visual{display:none}
body:has(input[name="username"]) .dt-visual{display:block}

div.h-svh:has(input[name="username"]){
  --background:#0a1228;--foreground:#eaf1ff;
  --muted-foreground:#9db0d8;--border:rgba(120,160,255,.22);--input:rgba(120,160,255,.22);
  --ring:#4cd2ff;--primary:#4cd2ff;--destructive:#ff8a9b;
  color:#eaf1ff;color-scheme:dark;
  grid-template-columns:1.15fr 1fr;
  background:radial-gradient(700px 500px at 100% 0,#1b2f6b 0,transparent 60%),radial-gradient(600px 500px at 0 100%,#1a2160 0,transparent 60%),#0a1228;
}
body:has(input[name="username"]){background:#0a1228}
div.h-svh:has(input[name="username"]) > .container{grid-column:2;grid-row:1;position:relative;z-index:1}

/* logo 叠在左侧图上 */
div.h-svh:has(input[name="username"]) > a[href="/"]{z-index:30;left:44px !important;top:36px !important}
div.h-svh:has(input[name="username"]) > a[href="/"] h1{font-size:20px;font-weight:800;letter-spacing:-.5px;color:#fff;
  text-shadow:0 0 18px rgba(76,210,255,.45)}

/* 标题与说明 */
div.h-svh:has(input[name="username"]) h2{color:#fff;font-size:30px;letter-spacing:-1px}
div.h-svh:has(input[name="username"]) form a:hover,
div.h-svh:has(input[name="username"]) h2 + p a:hover{color:#4cd2ff}

/* 输入框 */
div.h-svh:has(input[name="username"]) label{color:#9db0d8;font-weight:500}
div.h-svh:has(input[name="username"]) form input:not([type=checkbox]){
  height:46px;border-radius:12px;background:rgba(8,14,34,.7) !important;border:1px solid rgba(120,160,255,.22);
  color:#fff;font-size:15px;padding:0 14px;
}
div.h-svh:has(input[name="username"]) form input::placeholder{color:#7184ad}
div.h-svh:has(input[name="username"]) form input:focus,
div.h-svh:has(input[name="username"]) form input:focus-visible{
  border-color:#4cd2ff;box-shadow:0 0 0 3px rgba(76,210,255,.18);outline:0;
}
div.h-svh:has(input[name="username"]) form button[aria-label="Toggle password visibility"]{color:#7184ad;background:none}
div.h-svh:has(input[name="username"]) form button[aria-label="Toggle password visibility"]:hover{color:#fff;background:rgba(255,255,255,.06)}

/* 主按钮：渐变胶囊 + 光晕 */
div.h-svh:has(input[name="username"]) form button[type="submit"]{
  height:48px;justify-content:center;border:0;border-radius:999px;font-size:15px;font-weight:700;
  color:#06102a;background:linear-gradient(90deg,#4cd2ff,#8a7dff);
  box-shadow:0 0 30px rgba(76,210,255,.35);transition:box-shadow .2s,transform .2s;
}
div.h-svh:has(input[name="username"]) form button[type="submit"]:hover{
  box-shadow:0 0 44px rgba(76,210,255,.6);transform:translateY(-1px);
}

/* 其他登录方式分隔线与按钮（如开启 OAuth） */
div.h-svh:has(input[name="username"]) form ~ * button:not([type="submit"]){
  border-radius:999px;border:1px solid rgba(120,200,255,.38);background:rgba(255,255,255,.04);color:#eaf1ff;
}

/* 左侧视觉区（由 nginx 注入，位于 React 根节点之外） */
.dt-visual{position:fixed;left:0;top:0;bottom:0;width:53.5vw;overflow:hidden;background:#050b1e;z-index:20;
  font-family:-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}
.dt-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.dt-visual::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,18,40,.55),transparent 28%,transparent 58%,rgba(10,18,40,.8)),
             linear-gradient(90deg,transparent 70%,rgba(10,18,40,.9))}
.dt-bot{position:absolute;left:44px;right:44px;bottom:44px;z-index:2}
.dt-bot h2{filter:drop-shadow(0 2px 12px rgba(5,11,30,.75));font-size:clamp(26px,3vw,40px);letter-spacing:-1px;line-height:1.2;color:#fff;max-width:520px;font-weight:700;margin:0}
.dt-bot h2 b{background:linear-gradient(90deg,#4cd2ff,#8a7dff);-webkit-background-clip:text;background-clip:text;color:transparent}
.dt-bot p{text-shadow:0 1px 12px rgba(5,11,30,.95),0 0 4px rgba(5,11,30,.8);margin:12px 0 0;color:#9db0d8;max-width:440px;font-size:15px;line-height:1.6}
.dt-chips{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px}
.dt-chips span{border:1px solid rgba(120,200,255,.38);background:rgba(10,18,40,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  border-radius:99px;padding:5px 12px;color:#cfe8ff}
.dt-chips i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#5eead4;box-shadow:0 0 8px #5eead4;margin-right:8px;vertical-align:1px}

@media(max-width:900px){
  div.h-svh:has(input[name="username"]){grid-template-columns:1fr}
  div.h-svh:has(input[name="username"]) > .container{grid-column:1;padding-top:240px !important}
  body:has(input[name="username"]) .dt-visual{position:absolute;right:0;bottom:auto;width:100%;height:220px}
  .dt-visual::after{background:linear-gradient(180deg,rgba(10,18,40,.4),rgba(10,18,40,.95))}
  .dt-bot{display:none}
  div.h-svh:has(input[name="username"]) > a[href="/"]{left:24px !important;top:22px !important}
}