.signin { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px; background: var(--bg, #0f1115); }
.signin__box { width: min(420px, 100%); text-align: center; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.signin__logo { width: 56px; height: 56px; object-fit: contain; }
.signin h1 { font-size: 1.2rem; font-weight: 800; margin: 0; }
.signin__bar { width: 220px; height: 4px; border-radius: 2px; background: var(--line, rgba(128,128,128,.3)); overflow: hidden; }
.signin__bar i { display: block; height: 100%; width: 40%; background: var(--brand, #5865f2); animation: sibar 1.3s ease-in-out infinite alternate; }
@keyframes sibar { from { margin-left: 0; } to { margin-left: 60%; } }
.signin__sub { margin: 0; font-size: .85rem; color: var(--ink-mute, #888); }
.signin__tip { margin-top: 10px; width: 100%; border: 1px solid var(--line, rgba(128,128,128,.3)); border-radius: 14px; padding: 14px 16px; background: var(--panel, transparent); }
.signin__tiph { font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-mute, #888); margin-bottom: 6px; }
.signin__tip p { margin: 0; font-size: .95rem; line-height: 1.5; }
.signin__tipn { margin-top: 8px; font-size: .75rem; color: var(--ink-mute, #888); }
@media (prefers-reduced-motion: reduce) { .signin__bar i { animation: none; width: 100%; } }