:root{
  --ink-placeholder:#9aa3af;
  --ink-ghost:#8b95a1; 

  --pk-pink:#CE8892;
  --pk-navy:#31527E;
  --ink:#1f2937;
  --muted:#6b7280;
  --line:#e5e7eb;
  --bg:#ffffff;
  --bg-page:#f7f8fa;
  --radius:0.75rem; 
  --radius-lg:1rem; 
  --shadow:0 0.375rem 1.125rem rgba(0,0,0,.06); 
}
*{box-sizing:border-box}
html,body{height:100%}
html{
  -webkit-text-size-adjust:100%;
  text-rendering:optimizeLegibility;
}
body{
  margin:0;
  font-family:'Pretendard Variable', Pretendard, -apple-system, system-ui, 'Noto Sans KR', 'Segoe UI', Roboto, Arial, sans-serif;
  font-size:0.9375rem; 
  line-height:1.6;
  color:var(--ink);
  background:var(--bg-page);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

input, select, textarea, button{ font: inherit; letter-spacing: inherit; color: inherit; }

.pk-wrap{
  width:min(40rem, 92vw); 
  margin:1.625rem auto 6.25rem;
  /* 하단 고정 탭/버튼과 겹치지 않도록 여백 확보 */
  padding-bottom: calc(110px + env(safe-area-inset-bottom, 0px));
}

.pk-title{
  margin:0 0 0.625rem; 
  font-size:1.375rem; 
  color:var(--pk-navy);
  letter-spacing:-0.01em;
  text-align:center;
  font-weight:800;
}

.pk-clinicinfo{
  border:1px solid var(--line); 
  background:#fff;
  border-radius:0.875rem; 
  padding:0.75rem 0.875rem; 
  box-shadow:var(--shadow);
  margin-bottom:0.875rem; 
}
.pk-clinicinfo__name{ font-weight:800; letter-spacing:-.01em; }
.pk-clinicinfo__loc{ font-size:0.8125rem; color:var(--muted); margin-top:0.125rem; }

.pk-form{
  background:var(--bg);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:1.125rem; 
  box-shadow:var(--shadow);
}
.pk-row{ margin-bottom:0.875rem; } 

.pk-grid-2{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0.75rem; 
}
@media (max-width:40rem){
  .pk-grid-2{ grid-template-columns:1fr; }
}

.pk-field{ display:block; }
.pk-label{
  display:block;
  font-size:0.8125rem; 
  color:#374151;
  margin-bottom:0.375rem; 
  font-weight:600;
}
.pk-label .req{ color:#d14; font-style:normal; margin-left:0.375rem; font-size:0.75rem; font-weight:600; }
.pk-label .opt{ color:#9ca3af; font-style:normal; margin-left:0.375rem; font-size:0.75rem; font-weight:600; }

.pk-input{
  width:100%;
  padding:0.75rem 0.875rem; 
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  outline:0;
  font-size:0.9375rem; 
}
.pk-input::placeholder{ color:var(--ink-placeholder); }
.pk-input:focus{ border-color:#b8c3ff; box-shadow:0 0 0 0.1875rem rgba(49,82,126,.15); } 

.pk-inputwrap{ position:relative; }
.pk-inputwrap::before{
  content:"";
  position:absolute;
  left:0.75rem; top:50%; transform:translateY(-50%);
  width:1.125rem; height:1.125rem; 
  opacity:.6;
  background-size:contain; background-repeat:no-repeat;
}
.pk-inputwrap input{ padding-left:2.5rem; } 
.icon-calendar::before{
  background-image:url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='3' y='5' width='18' height='16' rx='2' stroke='%23778' stroke-width='1.5'/%3E%3Cpath d='M8 3v4M16 3v4M3 10h18' stroke='%23778' stroke-width='1.5'/%3E%3C/svg%3E");
}
.icon-time::before{
  background-image:url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='9' stroke='%23778' stroke-width='1.5'/%3E%3Cpath d='M12 7v6l4 2' stroke='%23778' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
}

.pk-actions.pk-actions--row{
  display:flex;
  align-items:center;
  gap:0.75rem;
}
.pk-actions.pk-actions--row .pk-btn{
  width:auto;
  min-width:8.75rem; 
}
.pk-actions.pk-actions--row .pk-btn--primary{
  margin-left:auto;
}

.pk-btn{
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:0.8125rem 1rem; 
  font-weight:800;
  cursor:pointer;
}

.pk-btn--ghost{ background:#fff; color:var(--ink-ghost); border-color:var(--line); }
.pk-btn--close{ background:#fff; color:var(--ink-ghost); border-color:var(--line); }

.pk-btn--primary{
  background:var(--pk-navy);
  color:#fff; border-color:transparent;
}

.pk-btn--ghost:hover{ color:#7c8794; }

.pk-clinicinfo__row{
  display:flex;
  align-items:center;
  gap:0.5rem; 
  line-height:1.5;
}
.pk-clinicinfo__row:first-child{ margin-top:0; }
.pk-tag{
  display:inline-flex;
  align-items:center;
  gap:0.375rem;
  padding:0.125rem 0.5rem;
  border:1px solid var(--pk-navy);
  color:var(--pk-navy);
  border-radius:9999px;
  font-size:0.75rem; 
  font-weight:700;
  white-space:nowrap;
}
.pk-clinicinfo__text{
  font-size:0.8125rem; 
  color:var(--ink);
}

.pk-subtitle{
  margin: 0 0 0.875rem;
  text-align: center;
  color: var(--muted);
  font-size: 0.9375rem;
}

.pk-clinicinfo__row{
  display:flex;
  align-items:center;
  gap:0.5rem;
  line-height:1.5;
  width:100%;
  border-radius:9999px;
  padding:0.5rem 0.75rem;
  background:#fff;
}
.pk-clinicinfo__row:first-child{ margin-top:0; }

.pk-tag{
  display:inline-flex;
  align-items:center;
  gap:0.375rem;
  padding:0; 
  border:none; 
  color:var(--pk-navy);
  border-radius:0;
  font-size:0.8125rem;
  font-weight:800;
  white-space:nowrap;
}

.pk-label .req{ color: var(--pk-pink); }

@media (max-width:40rem){
  .pk-grid-2{ grid-template-columns:1fr 1fr; }
}


.pk-subtitle{margin:0 0 .875rem;text-align:center;color:var(--muted);font-size:.9375rem}
.pk-clinicinfo__text{word-break:keep-all;overflow-wrap:anywhere}
.pk-input{font-size:0.8125rem}
*{-webkit-tap-highlight-color:transparent}
.pk-error{margin-top:.25rem;color:#d14;font-size:.8125rem}
.pk-input.pk-invalid{border-color:#d14;box-shadow:0 0 0 .1875rem rgba(209,20,20,.12)}
.pk-btn[disabled]{opacity:.6;pointer-events:none}
.pk-terms{display:flex;align-items:center;gap:.5rem;justify-content:space-between;border-top:1px solid var(--line);padding-top:.75rem}
.pk-terms-check{display:flex;align-items:center;gap:.5rem;font-size:.9375rem}
.pk-terms-open{border:0;background:transparent;color:var(--pk-navy);font-weight:800;font-size:1.25rem;line-height:1;padding:.25rem .375rem;border-radius:.5rem}
.pk-terms-open:focus{outline:none;box-shadow:0 0 0 .1875rem rgba(49,82,126,.2)}
.pk-modal{position:fixed;inset:0;display:none;z-index:60}
.pk-modal.is-open{display:block}
.pk-modal__backdrop{position:absolute;inset:0;background:rgba(17,24,39,.45)}
.pk-modal__dialog{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(42rem,94vw);background:#fff;border-radius:1rem;box-shadow:0 1rem 3rem rgba(0,0,0,.25);padding:0}
.pk-modal__body{height:min(70vh,36rem);overflow:auto}
.pk-modal__body iframe{width:100%;height:100%;border:0}
.pk-modal__foot{display:flex;justify-content:flex-end;padding:.75rem .875rem;border-top:1px solid var(--line)}

.pk-modal--status{
  --modal-accent:var(--pk-navy);
  --modal-accent-soft:rgba(49,82,126,.1);
  --modal-gradient:linear-gradient(145deg,#ffffff 0%,#f6f8fc 40%,#eef3fb 100%);
}
.pk-modal--error{
  --modal-accent:#d94855;
  --modal-accent-soft:rgba(217,72,85,.1);
  --modal-gradient:linear-gradient(145deg,#ffffff 0%,#fdf3f4 45%,#f8e6e8 100%);
}
.pk-modal--status .pk-modal__dialog{
  width:min(30rem,88vw);
  padding:0;
  border-radius:1.25rem;
  background:var(--modal-gradient);
  position:relative;
  overflow:hidden;
  box-shadow:0 28px 80px rgba(15,23,42,.18);
  backdrop-filter:blur(12px);
}
.pk-modal--status .pk-modal__dialog::before{
  content:"";
  position:absolute;
  inset:auto -40% 45% 50%;
  width:240px;
  height:240px;
  border-radius:50%;
  background:radial-gradient(64% 64% at 50% 50%, var(--modal-accent-soft) 0%, rgba(255,255,255,0) 100%);
  transform:translate(-50%,-50%);
  pointer-events:none;
}
.pk-modal--status .pk-modal__body{
  padding:2.5rem 2.75rem 1.75rem;
  max-height:none;
  overflow:visible;
  text-align:center;
}
.pk-modal--status .pk-modal__message{
  margin:0 auto;
  color:#1f2937;
}
.pk-modal__badge{
  width:3.5rem;
  height:3.5rem;
  border-radius:50%;
  margin:0 auto 1.25rem;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--modal-accent-soft);
  color:var(--modal-accent);
  box-shadow:0 0 0 0.125rem rgba(255,255,255,.8) inset;
}
.pk-modal__badge svg{
  width:1.9rem;
  height:1.9rem;
}
.pk-modal__title{
  margin:0 0 .75rem;
  font-size:1.45rem;
  font-weight:800;
  letter-spacing:-.01em;
  color:#111827;
}
.pk-modal__text{
  margin:0;
  font-size:0.95rem;
  line-height:1.65;
  color:#4b5563;
}
.pk-modal__error{
  margin-top:0.9rem;
  font-size:0.85rem;
  color:var(--modal-accent);
  background:rgba(249,250,251,.9);
  border-radius:0.625rem;
  padding:0.65rem 0.875rem;
  box-shadow:0 0 0 1px var(--modal-accent-soft);
}
.pk-modal--status .pk-modal__foot{
  padding:0 0 2.25rem;
  justify-content:center;
  border-top:0;
}
.pk-modal--status .pk-modal__foot .pk-btn{
  min-width:7rem;
  font-weight:700;
  border-radius:999px;
  padding:0.65rem 1.75rem;
  box-shadow:0 12px 24px rgba(49,82,126,.24);
}
.pk-modal--success .pk-modal__foot .pk-btn{
  background:var(--pk-navy);
}
.pk-modal--success .pk-modal__foot .pk-btn:hover{
  background:#29456a;
}
.pk-modal--error .pk-modal__foot .pk-btn{
  background:var(--modal-accent);
  box-shadow:0 12px 28px rgba(217,72,85,.25);
}
.pk-modal--error .pk-modal__foot .pk-btn:hover{
  background:#c23644;
}
.pk-modal--status .pk-modal__foot .pk-btn:focus-visible{
  outline:0;
  box-shadow:0 0 0 3px rgba(49,82,126,.35);
}
.pk-modal--error .pk-modal__foot .pk-btn:focus-visible{
  box-shadow:0 0 0 3px rgba(217,72,85,.35);
}

.pk-subtitle{margin:0 0 .875rem;text-align:center;color:var(--muted);font-size:.9375rem}
.pk-clinicinfo__text{word-break:keep-all;overflow-wrap:anywhere}
.pk-input{font-size:0.8125rem}
*{-webkit-tap-highlight-color:transparent}
.pk-error{margin-top:.25rem;color:#d14;font-size:.8125rem}
.pk-input.pk-invalid{border-color:#d14;box-shadow:0 0 0 .1875rem rgba(209,20,20,.12)}
.pk-btn[disabled]{opacity:.6;pointer-events:none}
.pk-terms{display:flex;align-items:center;gap:.5rem;justify-content:space-between;border-top:1px solid var(--line);padding-top:1.5rem}
.pk-terms-check{display:flex;align-items:center;gap:.5rem;font-size:.9375rem}
.pk-terms-open{border:0;background:transparent;color:var(--pk-navy);font-weight:800;font-size:1.25rem;line-height:1;padding:.25rem .375rem;border-radius:.5rem}
.pk-terms-open:focus{outline:none;box-shadow:0 0 0 .1875rem rgba(49,82,126,.2)}
.pk-modal{position:fixed;inset:0;display:none;z-index:60}
.pk-modal.is-open{display:block}
.pk-modal__backdrop{position:absolute;inset:0;background:rgba(17,24,39,.45)}
.pk-modal__dialog{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(42rem,94vw);background:#fff;border-radius:1rem;box-shadow:0 1rem 3rem rgba(0,0,0,.25)}
.pk-modal__body{height:min(70vh,36rem);overflow:auto}
.pk-modal__body iframe{width:100%;height:100%;border:0}
.pk-modal__foot{display:flex;justify-content:flex-end;padding:.75rem .875rem;border-top:1px solid var(--line)}

.pk-terms{margin-bottom:2rem}
.pk-terms-check{font-size:1rem}
.pk-terms-open{color:var(--muted)}
.pk-termsdoc{padding:1rem}
.pk-termsdoc h3{margin:.25rem 0 .5rem;font-size:1.0625rem;color:var(--pk-navy);font-weight:800;text-align:center}
.pk-termsdoc h4{margin:.75rem 0 .25rem;font-size:1rem;color:var(--pk-navy);font-weight:700}
.pk-termsdoc p,.pk-termsdoc li{font-size:.9375rem;color:var(--ink)}
.pk-termsdoc ul{padding-left:1rem;margin:.25rem 0 .5rem}

.pk-terms{flex-wrap:wrap}
.pk-terms-link{background:transparent;border:0;color:var(--pk-navy);text-decoration:underline;font-weight:700;font-size:.9375rem;display:inline-block;width:100%;text-align:right;margin-top:.25rem;padding:0;border-radius:.25rem}
.pk-terms-link:focus{outline:none;box-shadow:0 0 0 .1875rem rgba(49,82,126,.2)}

.pk-terms{flex-wrap:nowrap}
.pk-terms-link{width:auto;text-align:right;margin-top:0;margin-left:auto;cursor:pointer}

.pk-input:not(textarea){height:2.875rem}
.pk-inputwrap input{height:2.875rem}
select.pk-input{height:2.875rem}

.pk-label--ghost{color:transparent}

@media (max-width:27.375rem){
  body{font-size:.875rem}
  .pk-title{font-size:1.25rem}
  .pk-subtitle{font-size:.875rem}
  .pk-grid-2{gap:.5rem}
  .pk-label{font-size:.75rem;margin-bottom:.3125rem}
  .pk-input{padding:.625rem .75rem;font-size:.9rem}
  .pk-input:not(textarea), select.pk-input, .pk-inputwrap input{height:2.5rem}
  .pk-inputwrap::before{left:.625rem;width:1rem;height:1rem}
  .pk-inputwrap input{padding-left:2.25rem}
  .pk-btn{padding:.6875rem .875rem}
  .pk-actions.pk-actions--row .pk-btn{min-width:7.5rem}
}

@media (max-width:27.375rem){
  .pk-input[type=time]::-webkit-calendar-picker-indicator{display:none}
  .pk-input[type=time]::-webkit-inner-spin-button{display:none}
  .pk-input[type=time]{padding-right:.75rem}
}
