.modal{
  padding:20px;
  background:rgba(14,17,23,.68);
  backdrop-filter:none;
}
.modal-card{
  width:min(760px,100%);
  max-height:calc(100svh - 40px);
  overflow:hidden;
  border:1px solid var(--ink,#14161A);
  border-radius:0;
  background:#fff;
  box-shadow:10px 10px 0 rgba(20,22,26,.18);
  animation:bqDialogIn .22s var(--ease,cubic-bezier(.2,.8,.2,1)) both;
}
.modal-head{
  min-height:62px;
  height:auto;
  padding:0 14px 0 20px;
  border-bottom:1px solid var(--ink,#14161A);
  background:
    linear-gradient(90deg,rgba(20,22,26,.055) 1px,transparent 1px) 0 0/32px 32px,
    linear-gradient(0deg,rgba(20,22,26,.04) 1px,transparent 1px) 0 0/32px 32px,
    #fff;
}
.modal-head h2{
  margin:0;
  font-size:20px;
  line-height:1.1;
  font-weight:900;
  letter-spacing:0;
}
.modal .close{
  width:36px;
  height:36px;
  padding:0;
  display:grid;
  place-items:center;
  border:1px solid var(--line-2,#C8C2B6);
  border-radius:0;
  background:#fff;
  color:var(--ink,#14161A);
  font-size:21px;
  line-height:1;
  transition:transform .18s var(--ease,cubic-bezier(.2,.8,.2,1)),box-shadow .18s var(--ease,cubic-bezier(.2,.8,.2,1)),background .18s var(--ease,cubic-bezier(.2,.8,.2,1)),color .18s var(--ease,cubic-bezier(.2,.8,.2,1));
}
.modal .close:hover,.modal .close:focus-visible{
  border-color:var(--ink,#14161A);
  background:var(--ink,#14161A);
  color:#fff;
  outline:0;
  transform:translate(-2px,-2px);
  box-shadow:4px 4px 0 var(--blue,#175CFF);
}

#signinModal .modal-card{width:min(560px,100%)}
#signinModal .modal-body{
  display:block;
  padding:0;
  background:#fff;
}
#signinModal .dialog-fields{display:grid;background:#fff}
#signinModal .dialog-fields .field{
  margin:0;
  padding:18px 20px 20px;
}
#signinModal .dialog-fields .field+.field{border-top:1px solid var(--line-2,#C8C2B6)}
.modal .field{
  min-width:0;
  display:grid;
  gap:7px;
}
.modal .field label{
  color:var(--ink,#14161A);
  font:800 11px/1.2 var(--font,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.modal .field input,.modal .field textarea{
  width:100%;
  border:0;
  border-bottom:1px solid var(--line-2,#C8C2B6);
  border-radius:0;
  background:transparent;
  color:var(--ink,#14161A);
  outline:0;
  transition:border-color .18s var(--ease,cubic-bezier(.2,.8,.2,1)),box-shadow .18s var(--ease,cubic-bezier(.2,.8,.2,1));
}
.modal .field input{height:44px;padding:9px 0 6px;font-size:16px}
.modal .field textarea{min-height:92px;padding:11px 0 8px;font-size:16px;line-height:1.45;resize:vertical}
.modal .field input::placeholder,.modal .field textarea::placeholder{color:#7B828D;opacity:1}
.modal .field input:hover,.modal .field textarea:hover{border-color:var(--ink,#14161A)}
.modal .field input:focus,.modal .field textarea:focus{
  border-color:var(--blue,#175CFF);
  box-shadow:0 2px 0 var(--blue,#175CFF);
  outline:0;
}
#signinModal .modal-actions{
  min-height:74px;
  margin:0;
  padding:14px 16px;
  border-top:1px solid var(--ink,#14161A);
  display:flex;
  justify-content:flex-end;
  background:var(--paper-2,#F1EFEA);
}
#signinModal .modal-actions button,#conversationModal .modal-actions button{
  min-height:46px;
  padding:0 20px;
  border:1px solid var(--ink,#14161A);
  border-radius:0;
  background:var(--ink,#14161A);
  color:#fff;
  font:800 14px/1 var(--font,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif);
  letter-spacing:0;
  text-transform:none;
  transition:transform .18s var(--ease,cubic-bezier(.2,.8,.2,1)),box-shadow .18s var(--ease,cubic-bezier(.2,.8,.2,1)),background .18s var(--ease,cubic-bezier(.2,.8,.2,1));
}
#signinModal .modal-actions button:hover,#signinModal .modal-actions button:focus-visible,
#conversationModal .modal-actions button:hover,#conversationModal .modal-actions button:focus-visible{
  border-color:var(--ink,#14161A);
  background:var(--blue,#175CFF);
  color:#fff;
  outline:0;
  transform:translate(-2px,-2px);
  box-shadow:5px 5px 0 var(--ink,#14161A);
}
#signinModal .modal-actions button:disabled,#conversationModal .modal-actions button:disabled{
  background:#69717D;
  cursor:wait;
  transform:none;
  box-shadow:none;
}

#conversationModal .calendar-card{width:min(760px,100%);max-height:calc(100svh - 40px)}
#conversationModal .modal-body{
  display:block;
  min-height:0;
  padding:0;
  overflow:hidden;
}
#conversationModal .calendar-panel{
  min-height:0;
  padding:24px;
  overflow:hidden;
  background:
    linear-gradient(90deg,rgba(20,22,26,.045) 1px,transparent 1px) 0 0/32px 32px,
    linear-gradient(0deg,rgba(20,22,26,.035) 1px,transparent 1px) 0 0/32px 32px,
    #fff;
}
#conversationModal .cal-step-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin:0 0 16px;
}
#conversationModal .calendar-panel h3{
  margin:0;
  color:var(--ink,#14161A);
  font-size:26px;
  line-height:1;
  font-weight:900;
  letter-spacing:0;
}
#conversationModal .duration-group{display:grid;gap:6px}
#conversationModal .duration-group>span,#conversationModal .slot-label{
  color:var(--muted,#4B515C);
  font:800 10px/1.2 var(--font,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif);
  letter-spacing:.08em;
  text-transform:uppercase;
}
#conversationModal .duration-row{display:flex;gap:0;margin:0}
#conversationModal .duration-row .slot{min-width:76px}
#conversationModal .duration-row .slot+.slot{border-left:0}
#conversationModal .slot-label{margin:13px 0 7px}
#conversationModal .slot-grid{display:grid;gap:8px}
#conversationModal #cvDays{grid-template-columns:repeat(3,minmax(0,1fr))}
#conversationModal #cvSlots{
  grid-template-columns:repeat(4,minmax(0,1fr));
  max-height:188px;
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:2px 6px 4px 2px;
  align-content:start;
  scrollbar-width:thin;
}
#conversationModal #cvSlots::-webkit-scrollbar{width:8px}
#conversationModal #cvSlots::-webkit-scrollbar-thumb{background:var(--line-2,#C8C2B6)}
#conversationModal .slot{
  height:40px!important;
  padding:0 10px;
  border:1px solid var(--line-2,#C8C2B6);
  border-radius:0;
  background:#fff;
  color:var(--ink,#14161A);
  font:800 12px/1 var(--font,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif);
  box-shadow:none;
  transition:transform .16s var(--ease,cubic-bezier(.2,.8,.2,1)),box-shadow .16s var(--ease,cubic-bezier(.2,.8,.2,1)),border-color .16s var(--ease,cubic-bezier(.2,.8,.2,1)),background .16s var(--ease,cubic-bezier(.2,.8,.2,1));
}
#conversationModal .slot:hover,#conversationModal .slot:focus-visible{
  z-index:1;
  border-color:var(--ink,#14161A);
  color:var(--blue,#175CFF);
  outline:0;
  transform:translate(-2px,-2px);
  box-shadow:4px 4px 0 rgba(20,22,26,.14);
}
#conversationModal .slot.active{
  border-color:var(--blue,#175CFF);
  background:var(--blue,#175CFF);
  color:#fff;
  box-shadow:3px 3px 0 var(--ink,#14161A);
}
#conversationModal .slot-status{
  grid-column:1/-1;
  min-height:64px;
  padding:16px;
  display:grid;
  place-items:center;
  border:1px solid var(--line-2,#C8C2B6);
  background:var(--paper-2,#F1EFEA);
  color:var(--muted,#4B515C);
  font-size:13px;
  font-weight:700;
}
#conversationModal .cal-summary{
  min-height:54px;
  margin:16px 0;
  padding:10px 12px;
  border:1px solid var(--ink,#14161A);
  border-radius:0;
  background:var(--paper-2,#F1EFEA);
}
#conversationModal .cal-summary span{font-size:13px;font-weight:800}
#conversationModal .cal-change{
  min-height:34px;
  padding:0 10px;
  border:1px solid var(--line-2,#C8C2B6);
  border-radius:0;
  background:#fff;
  color:var(--ink,#14161A);
  font-size:12px;
  font-weight:800;
}
#conversationModal .cal-change:hover,#conversationModal .cal-change:focus-visible{border-color:var(--ink,#14161A);outline:2px solid var(--blue,#175CFF);outline-offset:2px}
#conversationModal .conversation-fields{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0;
  margin:0;
  border:1px solid var(--ink,#14161A);
  background:#fff;
}
#conversationModal .conversation-fields .field{margin:0;padding:16px 18px 18px}
#conversationModal .conversation-fields .field:nth-child(2){border-left:1px solid var(--line-2,#C8C2B6)}
#conversationModal .conversation-fields .field-wide{grid-column:1/-1;border-top:1px solid var(--line-2,#C8C2B6)}
#conversationModal #calStep2>.modal-actions{
  min-height:74px;
  margin:0;
  padding:14px 16px;
  border:1px solid var(--ink,#14161A);
  border-top:0;
  display:flex;
  justify-content:flex-end;
  background:var(--paper-2,#F1EFEA);
}

@keyframes bqDialogIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media(max-width:700px){
  .modal{padding:14px}
  .modal-card,#conversationModal .calendar-card{max-height:calc(100svh - 28px);box-shadow:7px 7px 0 rgba(20,22,26,.18)}
  .modal-head{min-height:54px;padding:0 10px 0 15px}
  .modal-head h2{font-size:18px}
  .modal .close{width:34px;height:34px}
  #signinModal .dialog-fields .field{padding:14px 16px 16px}
  #signinModal .modal-actions{padding:12px 14px}
  #signinModal .modal-actions button,#conversationModal .modal-actions button{width:100%}
  #conversationModal .calendar-panel{padding:18px}
  #conversationModal .cal-step-head{align-items:flex-start;gap:14px;margin-bottom:12px}
  #conversationModal .calendar-panel h3{font-size:22px}
  #conversationModal .duration-row .slot{min-width:66px;padding:0 8px}
  #conversationModal #cvDays{grid-template-columns:repeat(2,minmax(0,1fr))}
  #conversationModal #cvSlots{grid-template-columns:repeat(3,minmax(0,1fr));max-height:170px}
  #conversationModal .conversation-fields{grid-template-columns:1fr}
  #conversationModal .conversation-fields .field:nth-child(2){border-left:0;border-top:1px solid var(--line-2,#C8C2B6)}
  #conversationModal .conversation-fields .field-wide{grid-column:auto}
  #conversationModal .conversation-fields .field{padding:12px 14px 14px}
  #conversationModal .field textarea{min-height:72px}
  #conversationModal .cal-summary{margin:13px 0}
  #conversationModal #calStep2>.modal-actions{padding:12px 14px}
}
@media(prefers-reduced-motion:reduce){.modal-card{animation:none}.modal *{transition:none!important}}