:root{
  --bg:#f2f1fb;
  --surface:#ffffff;
  --surface-2:#f3f0ff;
  --border:#e4e0f7;
  --text:#221b3d;
  --text-dim:#6b6485;
  --accent:#7c5cff;
  --accent-2:#5b3df0;
  --accent-3:#22d3ee;
  --gradient:linear-gradient(135deg, #7c5cff 0%, #5b3df0 55%, #22d3ee 120%);
  --gradient-soft:linear-gradient(135deg, rgba(124,92,255,0.14), rgba(34,211,238,0.10));
  --danger:#ef4444;
  --success:#10b981;
  --warn:#f59e0b;
  --radius:18px;
  --shadow-sm:0 2px 8px rgba(91,61,240,0.08);
  --shadow-md:0 10px 28px rgba(91,61,240,0.14);
  --shadow-glow:0 10px 30px rgba(124,92,255,0.4);
  color-scheme: light;
}

*{box-sizing:border-box;}
html,body{
  margin:0;padding:0;
  background:var(--bg);
  color:var(--text);
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  height:100%;
  overscroll-behavior-y:none;
  -webkit-font-smoothing:antialiased;
}

body{
  background-image:
    radial-gradient(560px circle at 100% -10%, rgba(124,92,255,0.16), transparent 60%),
    radial-gradient(480px circle at -10% 15%, rgba(34,211,238,0.14), transparent 55%);
  background-attachment:fixed;
}

.topbar{
  position:sticky;top:0;z-index:10;
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 16px calc(10px + env(safe-area-inset-top)) 16px;
  background:rgba(255,255,255,0.78);
  backdrop-filter:blur(14px) saturate(160%);
  border-bottom:1px solid var(--border);
}
.brand{display:flex;align-items:center;gap:9px;font-weight:800;font-size:1.2rem;letter-spacing:-0.01em;}
.brand-logo{width:28px;height:28px;filter:drop-shadow(0 3px 8px rgba(91,61,240,0.35));}
.count{font-size:0.8rem;color:var(--text-dim);margin-bottom:8px;font-weight:600;}

.topbar-right{display:flex;align-items:center;gap:8px;}
.lang-toggle{
  background:var(--surface-2);border:1px solid var(--border);border-radius:10px;
  padding:7px 10px;font-size:0.78rem;font-weight:800;color:var(--accent-2);
  cursor:pointer;letter-spacing:0.02em;transition:transform 0.15s;
}
.lang-toggle:active{transform:scale(0.92);}
.auth-card{position:relative;}
.auth-card .lang-toggle{position:absolute;top:18px;right:18px;}

.event-switcher{
  display:flex;align-items:center;gap:6px;
  background:var(--gradient-soft);border:1px solid rgba(124,92,255,0.28);
  border-radius:999px;padding:7px 14px 7px 12px;
  color:var(--accent-2);font-size:0.85rem;font-weight:700;
  max-width:52vw;cursor:pointer;transition:transform 0.15s, box-shadow 0.15s;
}
.event-switcher:active{transform:scale(0.96);}
.event-switcher span:not(.icon-sm){
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:32vw;
}
.event-switcher .icon{color:var(--accent-2);}
.icon-sm{width:14px;height:14px;flex-shrink:0;}

main{padding:12px 12px 90px 12px;max-width:640px;margin:0 auto;}

.hidden{display:none !important;}

#listView,#exportView,#eventView,#detailView,#formView{animation:viewIn 0.22s ease;}
@keyframes viewIn{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:translateY(0);}}

.toolbar{margin-bottom:10px;}
#searchBox{
  width:100%;padding:13px 16px;border-radius:14px;border:1px solid var(--border);
  background:var(--surface);color:var(--text);font-size:1rem;
  box-shadow:var(--shadow-sm);transition:box-shadow 0.15s, border-color 0.15s;
}
#searchBox:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px rgba(124,92,255,0.15);}

.empty-state{
  text-align:center;color:var(--text-dim);margin-top:60px;line-height:1.6;
}

.contact-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
.contact-card{
  display:flex;gap:12px;align-items:center;
  background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius);padding:12px 14px;
  cursor:pointer;box-shadow:var(--shadow-sm);
  transition:transform 0.15s, box-shadow 0.15s, border-color 0.15s;
}
.contact-card:active{transform:scale(0.98);background:var(--surface-2);}
@media (hover:hover){
  .contact-card:hover{box-shadow:var(--shadow-md);border-color:rgba(124,92,255,0.3);transform:translateY(-1px);}
}
.card-thumb{
  width:54px;height:54px;border-radius:14px;object-fit:cover;flex-shrink:0;background:var(--surface-2);
}
.card-thumb-placeholder{
  width:54px;height:54px;border-radius:14px;flex-shrink:0;
  background:var(--gradient-soft);display:flex;align-items:center;justify-content:center;
  font-size:1.4rem;color:var(--accent-2);
}
.card-body{flex:1;min-width:0;}
.card-name{font-weight:700;font-size:1rem;letter-spacing:-0.01em;}
.card-sub{font-size:0.85rem;color:var(--text-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.card-topic{
  font-size:0.75rem;color:var(--accent-2);margin-top:4px;font-weight:700;
  display:inline-block;background:var(--gradient-soft);padding:2px 9px;border-radius:999px;
}
.priority-flag{font-size:1.1rem;margin-left:6px;}

/* Form */
.photo-section{display:flex;flex-direction:column;align-items:center;gap:8px;margin-bottom:18px;}
.photo-capture{
  position:relative;width:100%;max-width:340px;aspect-ratio:16/10;
  border:2px dashed rgba(124,92,255,0.4);border-radius:var(--radius);
  display:flex;align-items:center;justify-content:center;
  background:var(--gradient-soft);overflow:hidden;cursor:pointer;
  text-align:center;color:var(--accent-2);font-size:0.95rem;line-height:1.5;font-weight:600;
  transition:transform 0.15s, border-color 0.15s;
}
.photo-capture:active{transform:scale(0.98);}
.photo-capture img{width:100%;height:100%;object-fit:cover;}
.photo-capture input{
  position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer;
}
.link-btn{background:none;border:none;color:var(--accent-2);font-size:0.9rem;padding:6px;cursor:pointer;font-weight:600;}
.extract-status{font-size:0.85rem;color:var(--text-dim);display:flex;align-items:center;gap:6px;font-weight:500;}
.extract-status.error{color:var(--danger);}
.extract-status.success{color:var(--success);}
.spinner{
  width:14px;height:14px;border-radius:50%;
  border:2px solid var(--border);border-top-color:var(--accent);
  animation:spin 0.7s linear infinite;flex-shrink:0;
}
@keyframes spin{to{transform:rotate(360deg);}}

.field-grid{display:flex;flex-direction:column;gap:12px;}
.field{display:flex;flex-direction:column;gap:6px;}
.field.full{width:100%;}
.field label{font-size:0.78rem;color:var(--text-dim);font-weight:700;text-transform:uppercase;letter-spacing:0.03em;}
.field input,.field textarea,.field select{
  padding:13px 14px;border-radius:12px;border:1px solid var(--border);
  background:var(--surface);color:var(--text);font-size:1rem;font-family:inherit;
  width:100%;transition:box-shadow 0.15s, border-color 0.15s;
}
.field input:focus,.field textarea:focus,.field select:focus{
  outline:none;border-color:var(--accent);box-shadow:0 0 0 4px rgba(124,92,255,0.15);
}
.field textarea{resize:vertical;}

.form-actions{display:flex;gap:10px;margin-top:20px;}
.btn{
  flex:1;padding:14px;border-radius:14px;border:none;font-size:1rem;font-weight:700;
  cursor:pointer;transition:transform 0.12s, box-shadow 0.15s, opacity 0.15s;
  letter-spacing:-0.01em;
}
.btn:active{transform:scale(0.97);}
.btn.primary{background:var(--gradient);color:#ffffff;box-shadow:var(--shadow-glow);}
.btn.secondary{background:var(--surface);color:var(--text);border:1px solid var(--border);box-shadow:var(--shadow-sm);}
.btn.danger{background:rgba(239,68,68,0.08);color:var(--danger);border:1px solid rgba(239,68,68,0.3);}
.btn.wide{flex:none;width:100%;margin-bottom:12px;}
.btn:disabled{opacity:0.6;cursor:not-allowed;transform:none;}

/* Detail */
#detailContent{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow-sm);}
#detailContent img{width:100%;border-radius:14px;margin-bottom:14px;}
.detail-row{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--border);font-size:0.95rem;gap:12px;}
.detail-row:last-child{border-bottom:none;}
.detail-row .k{color:var(--text-dim);font-weight:600;flex-shrink:0;}
.detail-row a{color:var(--accent-2);font-weight:600;text-decoration:none;}
.detail-notes{margin-top:14px;padding:14px;background:var(--gradient-soft);border-radius:14px;white-space:pre-wrap;font-size:0.95rem;}

.lead-box{
  margin-top:16px;padding:14px 16px;border-radius:16px;
  background:var(--gradient-soft);border:1.5px solid rgba(124,92,255,0.3);
}
.lead-box .detail-row{border-bottom-color:rgba(124,92,255,0.18);}
.lead-box .detail-row:last-child{border-bottom:none;}
.lead-box .detail-notes{background:rgba(255,255,255,0.6);margin-top:10px;}

.map-thumb-wrap{margin-top:12px;border-radius:14px;overflow:hidden;position:relative;cursor:pointer;
  border:1px solid var(--border);box-shadow:var(--shadow-sm);transition:transform 0.15s;height:130px;}
.map-thumb-wrap:active{transform:scale(0.98);}
.map-thumb{display:block;width:100%;height:100%;border:none;background:var(--surface-2);pointer-events:none;}
.map-thumb-overlay{position:absolute;inset:0;}
.map-thumb-hint{
  position:absolute;bottom:8px;right:8px;background:rgba(21,15,51,0.72);color:#fff;
  font-size:0.7rem;font-weight:700;padding:4px 9px;border-radius:999px;backdrop-filter:blur(4px);
}

.map-modal{
  position:fixed;inset:0;z-index:50;background:#150f33;
  display:flex;flex-direction:column;
}
.map-modal.hidden{display:none;}
.map-modal-frame{flex:1;width:100%;border:none;}
.map-modal-close{
  position:absolute;top:calc(14px + env(safe-area-inset-top));right:14px;z-index:2;
  background:rgba(255,255,255,0.95);
}
.map-modal-open{
  position:absolute;left:14px;bottom:calc(14px + env(safe-area-inset-bottom));z-index:2;
  background:var(--gradient);color:#fff;font-weight:700;font-size:0.85rem;
  padding:10px 16px;border-radius:999px;text-decoration:none;box-shadow:var(--shadow-glow);
}

/* Export view */
#exportView h2{margin-top:4px;font-weight:800;letter-spacing:-0.02em;}
.hint{color:var(--text-dim);font-size:0.9rem;margin-bottom:18px;}
#exportView hr{border:none;border-top:1px solid var(--border);margin:18px 0;}

/* FAB */
.fab{
  position:fixed;right:20px;bottom:calc(78px + env(safe-area-inset-bottom));
  width:62px;height:62px;border-radius:50%;
  background:var(--gradient);color:#ffffff;font-size:2rem;font-weight:400;
  border:none;box-shadow:var(--shadow-glow);
  display:flex;align-items:center;justify-content:center;line-height:0;
  cursor:pointer;z-index:20;transition:transform 0.15s, box-shadow 0.15s;
  animation:fabPop 0.35s cubic-bezier(0.34,1.56,0.64,1);
}
.fab:active{transform:scale(0.9);}
@keyframes fabPop{from{transform:scale(0.5);opacity:0;}to{transform:scale(1);opacity:1;}}

.bottomnav{
  position:fixed;bottom:0;left:0;right:0;z-index:15;
  display:flex;background:rgba(255,255,255,0.82);backdrop-filter:blur(14px) saturate(160%);
  border-top:1px solid var(--border);
  padding-bottom:env(safe-area-inset-bottom);
}
.navbtn{
  flex:1;background:none;border:none;color:var(--text-dim);
  display:flex;flex-direction:column;align-items:center;gap:2px;
  padding:10px 0 8px 0;font-size:1.3rem;cursor:pointer;transition:color 0.15s, transform 0.15s;
}
.navbtn:active{transform:scale(0.92);}
.navbtn span{font-size:0.7rem;font-weight:700;}
.navbtn.active{color:var(--accent-2);}

@media (min-width:480px){
  .field-grid{display:grid;grid-template-columns:1fr 1fr;}
}

.icon{width:22px;height:22px;flex-shrink:0;}
.icon-lg{width:34px;height:34px;}
.navbtn .icon{margin-bottom:1px;}
.fab .icon{width:26px;height:26px;}
.photo-capture .icon{color:var(--accent-2);}
.card-thumb-placeholder svg{width:26px;height:26px;color:var(--accent-2);}
.priority-star{color:var(--warn);filter:drop-shadow(0 1px 3px rgba(245,158,11,0.5));}

.auth-view{
  min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;
  padding:24px 16px;
  background:
    radial-gradient(700px circle at 15% -10%, rgba(124,92,255,0.35), transparent 55%),
    radial-gradient(600px circle at 100% 10%, rgba(34,211,238,0.28), transparent 50%),
    radial-gradient(800px circle at 50% 120%, rgba(91,61,240,0.3), transparent 55%),
    #150f33;
}
.auth-card{
  width:100%;max-width:380px;background:rgba(255,255,255,0.97);border:1px solid rgba(255,255,255,0.6);
  border-radius:24px;padding:30px 26px;box-shadow:0 30px 60px rgba(10,5,40,0.45);
  backdrop-filter:blur(10px);
}
.auth-brand{
  display:flex;align-items:center;justify-content:center;gap:9px;
  font-weight:800;font-size:1.4rem;margin-bottom:22px;letter-spacing:-0.02em;
}
.auth-brand .brand-logo{width:36px;height:36px;filter:drop-shadow(0 4px 10px rgba(91,61,240,0.4));}
.auth-tabs{display:flex;background:var(--surface-2);border-radius:12px;padding:4px;margin-bottom:20px;}
.auth-tab{
  flex:1;padding:10px;background:none;border:none;color:var(--text-dim);
  font-weight:700;cursor:pointer;font-size:0.9rem;border-radius:9px;transition:all 0.2s;
}
.auth-tab.active{background:var(--gradient);color:#ffffff;box-shadow:var(--shadow-glow);}
.auth-form{display:flex;flex-direction:column;gap:14px;}
.auth-form.hidden{display:none;}
.auth-error{
  background:rgba(239,68,68,0.08);border:1px solid rgba(239,68,68,0.3);
  color:var(--danger);border-radius:12px;padding:10px 12px;font-size:0.85rem;font-weight:500;
}
.auth-hint{text-align:center;color:var(--text-dim);font-size:0.78rem;margin-top:18px;margin-bottom:0;}

.sync-bar{
  display:flex;align-items:center;gap:8px;
  padding:7px 16px;font-size:0.78rem;color:var(--text-dim);font-weight:600;
  background:var(--surface-2);border-bottom:1px solid var(--border);
  max-width:640px;margin:0 auto;
}
.sync-dot{
  width:8px;height:8px;border-radius:50%;background:var(--success);flex-shrink:0;
  box-shadow:0 0 0 3px rgba(16,185,129,0.2);
}
.sync-bar.offline .sync-dot{background:var(--danger);box-shadow:0 0 0 3px rgba(239,68,68,0.2);}
.sync-bar.syncing .sync-dot{background:var(--warn);animation:pulse 1s infinite;box-shadow:0 0 0 3px rgba(245,158,11,0.2);}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:0.35;}}

.no-event-banner{
  text-align:center;background:var(--gradient-soft);border:1.5px dashed rgba(124,92,255,0.4);
  border-radius:var(--radius);padding:28px 16px;margin-bottom:16px;color:var(--text-dim);
}
.no-event-banner p{margin:0 0 14px 0;font-weight:500;}
.no-event-banner .btn{display:inline-flex;flex:none;padding:12px 22px;}

.event-view-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;}
.event-view-header h2{margin:0;font-weight:800;letter-spacing:-0.02em;}
.icon-btn{
  background:var(--surface);border:1px solid var(--border);border-radius:12px;
  padding:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text);
  box-shadow:var(--shadow-sm);transition:transform 0.15s;
}
.icon-btn:active{transform:scale(0.92);}

.event-list{list-style:none;margin:0 0 16px 0;padding:0;display:flex;flex-direction:column;gap:10px;}
.event-card{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:14px 16px;display:flex;align-items:center;gap:10px;cursor:pointer;
  box-shadow:var(--shadow-sm);transition:transform 0.15s, box-shadow 0.15s;
}
.event-card:active{transform:scale(0.98);}
.event-card.active{border-color:var(--accent);background:var(--gradient-soft);box-shadow:var(--shadow-md);}
.event-card.archived{opacity:0.5;}
.event-card-body{flex:1;min-width:0;}
.event-card-name{font-weight:700;}
.event-card-meta{font-size:0.8rem;color:var(--text-dim);}
.event-card-actions{display:flex;gap:4px;flex-shrink:0;}
.event-card-actions button{
  background:none;border:none;color:var(--text-dim);padding:8px;cursor:pointer;border-radius:9px;
  transition:background 0.15s, color 0.15s;
}
.event-card-actions button:hover{color:var(--accent-2);background:var(--surface-2);}
.active-badge{
  font-size:0.68rem;font-weight:800;color:#ffffff;background:var(--gradient);
  border-radius:999px;padding:3px 10px;flex-shrink:0;letter-spacing:0.02em;
}

.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:18px;}
.stat-card{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:16px;text-align:center;box-shadow:var(--shadow-sm);
}
.stat-value{font-size:1.8rem;font-weight:800;background:var(--gradient);-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:-0.02em;}
.stat-label{font-size:0.78rem;color:var(--text-dim);font-weight:700;text-transform:uppercase;letter-spacing:0.03em;margin-top:2px;}
#adminView h3{margin:22px 0 10px 0;font-size:1rem;font-weight:800;}
.admin-tenant-meta{font-size:0.8rem;color:var(--text-dim);display:flex;gap:12px;flex-wrap:wrap;margin-top:2px;}

#eventForm{margin-top:16px;border-top:1px solid var(--border);padding-top:16px;}
#eventForm .field-grid{display:flex;gap:12px;margin-top:12px;}
#eventForm .field-grid .field{flex:1;}

.deploy-footer{
  text-align:center;font-size:0.7rem;color:var(--text-dim);
  padding:6px 0 84px 0;opacity:0.5;
}