/* Smart Z optional login + cloud sync */
.smart-auth-btn {
    border: 1px solid rgba(255,255,255,.45);
    background: rgba(255,255,255,.18);
    color: #fff;
    padding: 10px 14px;
    border-radius: 12px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: .25s ease;
    backdrop-filter: blur(10px);
}
.smart-auth-btn:hover { background: rgba(255,255,255,.3); transform: translateY(-1px); }
.smart-user-area { display:flex; align-items:center; gap:8px; flex-wrap:wrap; justify-content:center; }
.smart-user-chip {
    display:flex; align-items:center; gap:9px; padding:6px 10px 6px 7px;
    border:1px solid rgba(255,255,255,.4); border-radius:14px;
    background:rgba(255,255,255,.17); backdrop-filter:blur(10px);
}
.smart-user-avatar { width:34px; height:34px; border-radius:50%; object-fit:cover; background:#fff; border:2px solid rgba(255,255,255,.7); }
.smart-user-avatar-fallback { width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:#fff; color:#2563eb; font-weight:800; }
.smart-user-name { font-size:13px; font-weight:700; max-width:130px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.smart-sync-mini { display:block; font-size:10px; opacity:.85; font-weight:500; }
.smart-icon-btn { width:39px; height:39px; border-radius:12px; display:grid; place-items:center; background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.38); transition:.25s; }
.smart-icon-btn:hover { background:rgba(255,255,255,.3); transform:translateY(-1px); }
.smart-mode-bar {
    margin-top:-10px; margin-bottom:18px; border-radius:14px; padding:11px 14px;
    display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
    border:1px solid #bfdbfe; background:linear-gradient(135deg,#eff6ff,#f5f3ff); color:#1e3a8a;
    box-shadow:0 6px 20px rgba(37,99,235,.08);
}
.smart-mode-bar.cloud { border-color:#a7f3d0; background:linear-gradient(135deg,#ecfdf5,#f0fdfa); color:#065f46; }
.smart-mode-main { display:flex; align-items:center; gap:10px; font-size:13px; }
.smart-mode-icon { width:34px; height:34px; border-radius:10px; display:grid; place-items:center; background:rgba(255,255,255,.8); box-shadow:0 3px 10px rgba(0,0,0,.08); }
.smart-mode-action { border:0; border-radius:10px; padding:8px 13px; font-size:12px; font-weight:700; background:#2563eb; color:#fff; }
.smart-mode-bar.cloud .smart-mode-action { background:#059669; }
.smart-auth-modal { position:fixed; inset:0; z-index:10000; display:flex; align-items:center; justify-content:center; padding:16px; background:rgba(15,23,42,.68); backdrop-filter:blur(7px); }
.smart-auth-modal.hidden { display:none !important; }
.smart-auth-card { width:100%; max-width:440px; max-height:94vh; overflow:auto; border-radius:24px; padding:22px; background:rgba(255,255,255,.97); color:#111827; box-shadow:0 28px 80px rgba(2,6,23,.35); border:1px solid rgba(255,255,255,.8); position:relative; }
.smart-auth-close { position:absolute; right:14px; top:14px; width:36px; height:36px; border-radius:50%; background:#f1f5f9; color:#475569; display:grid; place-items:center; }
.smart-auth-logo { width:54px; height:54px; border-radius:16px; display:grid; place-items:center; margin:0 auto 10px; color:#fff; font-size:23px; background:linear-gradient(135deg,#2563eb,#7c3aed); box-shadow:0 10px 25px rgba(37,99,235,.28); }
.smart-auth-title { text-align:center; font-size:22px; font-weight:800; }
.smart-auth-subtitle { text-align:center; font-size:12px; color:#64748b; margin:4px 20px 16px; }
.smart-auth-tabs { display:grid; grid-template-columns:1fr 1fr; padding:4px; background:#f1f5f9; border-radius:12px; margin-bottom:16px; }
.smart-auth-tab { padding:9px; border-radius:9px; font-size:13px; font-weight:700; color:#64748b; }
.smart-auth-tab.active { background:#fff; color:#2563eb; box-shadow:0 3px 10px rgba(15,23,42,.08); }
.smart-auth-field { margin-bottom:12px; }
.smart-auth-field label { display:block; font-size:12px; font-weight:700; color:#334155; margin-bottom:5px; }
.smart-auth-field input { width:100%; border:1px solid #cbd5e1; border-radius:11px; padding:11px 12px; outline:none; background:#fff; color:#111827; }
.smart-auth-field input:focus { border-color:#2563eb; box-shadow:0 0 0 3px rgba(37,99,235,.12); }
.smart-auth-submit { width:100%; border:0; padding:12px; border-radius:12px; color:#fff; font-weight:800; background:linear-gradient(135deg,#2563eb,#4f46e5); box-shadow:0 8px 20px rgba(37,99,235,.22); }
.smart-auth-submit:disabled { opacity:.6; cursor:not-allowed; }
.smart-auth-divider { display:flex; align-items:center; gap:10px; color:#94a3b8; font-size:11px; margin:15px 0; }
.smart-auth-divider:before,.smart-auth-divider:after { content:""; height:1px; flex:1; background:#e2e8f0; }
.smart-google-wrap { min-height:44px; display:flex; justify-content:center; overflow:hidden; }
.smart-google-note { text-align:center; font-size:11px; color:#b45309; background:#fffbeb; border:1px solid #fde68a; padding:8px; border-radius:10px; }
.smart-guest-continue { width:100%; margin-top:12px; border:1px solid #cbd5e1; padding:10px; border-radius:11px; font-weight:700; color:#475569; background:#fff; }
.smart-auth-foot { margin-top:12px; padding:10px; border-radius:10px; background:#eff6ff; color:#1e40af; font-size:11px; line-height:1.55; }
.smart-auth-error { display:none; margin-bottom:12px; border-radius:10px; padding:9px 10px; font-size:12px; background:#fef2f2; color:#b91c1c; border:1px solid #fecaca; }
.smart-auth-error.show { display:block; }
.smart-offline-dot,.smart-online-dot { width:7px; height:7px; border-radius:50%; display:inline-block; margin-right:4px; }
.smart-online-dot { background:#34d399; box-shadow:0 0 0 3px rgba(52,211,153,.18); }
.smart-offline-dot { background:#fbbf24; box-shadow:0 0 0 3px rgba(251,191,36,.18); }
@media (max-width:767px){
    .smart-user-name { max-width:95px; }
    .smart-mode-bar { margin-top:-10px; }
    .smart-auth-card { padding:20px 16px; border-radius:20px; }
}
.smart-label-row { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.smart-label-row label { margin-bottom:5px; }
.smart-forgot-link { border:0; background:transparent; color:#2563eb; font-size:11px; font-weight:800; padding:0 0 5px; }
.smart-forgot-link:hover { text-decoration:underline; }
.smart-auth-field small { display:block; margin-top:5px; color:#64748b; font-size:10.5px; line-height:1.45; }
.smart-required { color:#dc2626; }
.smart-auth-notice { display:none; margin-bottom:12px; border-radius:10px; padding:9px 10px; font-size:12px; background:#ecfdf5; color:#047857; border:1px solid #a7f3d0; line-height:1.5; }
.smart-auth-notice.show { display:block; }
.smart-reset-icon { width:52px; height:52px; margin:0 auto 14px; border-radius:16px; display:grid; place-items:center; background:linear-gradient(135deg,#dbeafe,#ede9fe); color:#4f46e5; font-size:22px; }
.smart-back-login { width:100%; margin-top:9px; border:0; background:transparent; color:#475569; font-size:12px; font-weight:800; padding:8px; }
.smart-back-login:hover { color:#2563eb; }