/* V2 Birds design, immutable production asset release v3. Native pages stay untouched. */
:root { --roban-login-overlay-ready: 1; }
body.roban-login-enhanced { margin: 0; min-width: 320px; overflow: hidden; background: #f8f8fb; }
.roban-login-app, .roban-login-app * { box-sizing: border-box; }
.roban-login-app {
  position: fixed; inset: 0; z-index: 9990; min-width: 320px; overflow: auto;
  color: #333238; background: #f8f8fb; font-family: "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  font-synthesis: none; line-height: 1.5; letter-spacing: normal; text-align: left;
}
.roban-login-app h1, .roban-login-app h2, .roban-login-app p { margin: 0; padding: 0; }
.roban-login-app a { color: inherit; }
.roban-login-app button, .roban-login-app input { font: inherit; }
.roban-login-app svg { fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.roban-login-app button, .roban-login-app a { -webkit-tap-highlight-color: transparent; }
.roban-login-app button:focus-visible, .roban-login-app a:focus-visible { outline: 3px solid #9b8ed4; outline-offset: 6px; }
.roban-screen { position: relative; display: flex; flex-direction: column; min-height: 100vh; min-height: 100svh; overflow: clip; isolation: isolate; }
.roban-birds { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; background: #f8f8fb; }
.roban-birds canvas { position: absolute !important; inset: 0; display: block; width: 100% !important; height: 100% !important; opacity: .9; }
.roban-birds::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: radial-gradient(ellipse at 50% 48%, rgba(255,255,255,.86) 0%, rgba(255,255,255,.65) 31%, rgba(248,248,251,.18) 72%, rgba(248,248,251,.06) 100%);
}
.roban-birds-fallback { background: radial-gradient(ellipse at 50% 68%, #eceaf8 0%, #f5f4fb 42%, #f8f8fb 78%); }
.roban-birds-fallback::after { background: radial-gradient(ellipse at 50% 48%, rgba(255,255,255,.72), rgba(255,255,255,.22) 65%, transparent); }
.roban-header { position: relative; z-index: 3; padding: 34px clamp(24px,4.5vw,72px); }
.roban-brand { display: inline-flex; align-items: center; gap: 11px; text-decoration: none !important; white-space: nowrap; }
.roban-brand img { width: 36px; height: 36px; object-fit: cover; border-radius: 50%; }
.roban-brand strong { font-size: 19px; letter-spacing: .07em; font-weight: 750; }
.roban-brand i { height: 22px; width: 1px; background: currentColor; opacity: .2; margin: 0 2px; }
.roban-brand .roban-gitlab-name { font-size: 20px; letter-spacing: -.03em; font-weight: 650; }
.roban-main { position: relative; z-index: 2; flex: 1; display: grid; grid-template-columns: minmax(0,1fr); place-items: center; min-height: 560px; }
.roban-copy { min-width: 0; width: min(100%,760px); padding: 0 24px 54px; text-align: center; }
.roban-login-app .roban-title { font-size: clamp(34px,3.8vw,56px); line-height: 1.35; letter-spacing: -.045em; font-weight: 600; color: #333238; }
.roban-features { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; list-style: none; margin: 30px auto 0; padding: 0; max-width: 560px; text-align: left; }
.roban-features li { min-width: 0; padding: 20px 18px; background: rgba(255,255,255,.78); border: 1px solid rgba(220,220,222,.9); border-radius: 10px; box-shadow: 0 10px 28px rgba(38,34,75,.06); backdrop-filter: blur(4px); }
.roban-features svg { display: block; width: 25px; height: 25px; color: #6262b9; margin-bottom: 15px; }
.roban-features h2 { font-size: 18px; line-height: 1.4; font-weight: 600; letter-spacing: -.02em; color: #333238; }
.roban-features p { font-size: 12px; line-height: 1.5; margin-top: 7px; color: #626168; }
.roban-sso-slot { width: min(310px,100%); margin: 30px auto 0; }
.roban-sso-slot form { margin: 0; padding: 0; width: 100%; }
.roban-login-app .roban-sso-button {
  width: 100%; min-height: 56px; height: auto; display: grid; grid-template-columns: 28px 1fr 22px; align-items: center; gap: 12px;
  padding: 12px 18px; border: 0; border-radius: 40px; background: #6262b9; color: #fff; font-size: 14px; font-weight: 600; line-height: 1.5;
  cursor: pointer; box-shadow: 0 10px 28px rgba(98,98,185,.14); transition: background .18s, box-shadow .18s, transform .18s;
}
.roban-login-app .roban-sso-button:hover { background: #5252a3; color: #fff; box-shadow: 0 12px 30px rgba(98,98,185,.24); transform: translateY(-2px); }
.roban-login-app .roban-sso-button:active { transform: translateY(0); }
.roban-login-app .roban-sso-button:disabled { opacity: .7; cursor: wait; transform: none; }
.roban-sso-button > svg { width: 22px; height: 22px; }
.roban-feishu-mark { display: block; width: 27px; height: 27px; overflow: hidden; background: #fff; border-radius: 6px; }
.roban-feishu-mark img { display: block; width: 87px; height: 27px; max-width: none; object-fit: contain; object-position: left center; }
.roban-login-app .roban-company-vision { font-size: 13px; line-height: 1.6; margin: 24px 0 0; color: #737278; letter-spacing: .02em; }
.roban-footer { position: relative; z-index: 3; padding: 24px clamp(24px,4.5vw,72px); font-size: 10px; color: #737278; }
.roban-feedback { padding: 12px 16px; margin: 0 auto 24px; max-width: 560px; border: 1px solid #dcdcde; border-radius: 8px; background: #fff; font-size: 14px; text-align: left; }
.roban-toast { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); z-index: 10; max-width: calc(100vw - 32px); width: max-content; padding: 13px 18px; border-radius: 8px; background: #333238; color: #fff; box-shadow: 0 6px 30px rgba(0,0,0,.13); font-size: 13px; line-height: 1.6; }
.roban-toast[hidden] { display: none; }
@media (max-width: 680px) {
  .roban-header { padding: 25px 24px; }
  .roban-brand { gap: 9px; }
  .roban-brand img { width: 32px; height: 32px; }
  .roban-brand strong { font-size: 17px; }
  .roban-brand .roban-gitlab-name { font-size: 18px; }
  .roban-main { min-height: 500px; }
  .roban-copy { width: 100%; padding: 22px 24px 40px; }
  .roban-login-app .roban-title { font-size: clamp(26px,6.8vw,40px); line-height: 1.4; }
  .roban-features { margin-top: 24px; gap: 8px; }
  .roban-features li { padding: 16px 10px; border-radius: 6px; }
  .roban-features svg { width: 22px; height: 22px; margin-bottom: 12px; }
  .roban-features h2 { font-size: 14px; }
  .roban-features p { font-size: 11px; margin-top: 5px; }
  .roban-sso-slot { margin-top: 25px; }
  .roban-login-app .roban-company-vision { font-size: 11px; margin-top: 21px; letter-spacing: 0; }
  .roban-footer { padding: 20px 24px; font-size: 9px; }
}
@media (max-width: 360px) {
  .roban-features li { padding: 15px 9px; }
  .roban-features h2 { font-size: 13px; }
  .roban-features p { font-size: 10px; }
  .roban-copy { padding-bottom: 32px; }
}
@media (prefers-reduced-motion: reduce) {
  .roban-birds canvas { display: none; }
  .roban-login-app .roban-sso-button { transition: none; }
}