@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;600;700&display=swap");

            a,
      a:visited,
      a:hover,
      a:active {
        color: inherit;
        text-decoration: none;
      }

      * {
        -webkit-tap-highlight-color: transparent;
      }

      :root{
        --pk-border:#E5E7EB;
        --pk-text:#111827;
        --pk-muted:#6B7280;
        --pk-muted2:#9CA3AF;
        --pk-bg:#FFFFFF;

        --pk-pink:#CE8892;
        --pk-purple:#8E7AC3;
        --pk-blue:#31527E;

        --pk-user-bubble:#8F96A2;
      }

      *{ box-sizing:border-box; }
      html, body { height:100%; }
      body{
        margin:0;
        color:var(--pk-text);
        background:var(--pk-bg);
      }

      .pk-font-cn{
        font-family: "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
          Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      }
      .pk-font-ko{
        font-family: "Pretendard", "Apple SD Gothic Neo", "Noto Sans KR", -apple-system, BlinkMacSystemFont,
          "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
      }
      .pk-font-en{
        font-family: "Inter", "Segoe UI", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
      }

      .pk-app{
        min-height:100dvh;
        height:100dvh;
        display:flex;
        overflow-x:hidden;
        background:#fff;
      }

      .pk-sidebar{
        width:288px;
        border-right:1px solid var(--pk-border);
        flex:0 0 auto;
      }

      .pk-main{
        flex:1 1 auto;
        display:flex;
        min-width:0;
        overflow:hidden;
      }

      .pk-main-inner{
        flex:1 1 auto;
        display:flex;
        flex-direction:column;
        min-width:0;
        overflow:hidden;
      }

      /* responsive helpers */
      .pk-hide-on-mobile{ display:block; }
      .pk-hide-on-desktop{ display:none; }

      @media (max-width: 767px){
        .pk-hide-on-mobile{ display:none; }
        .pk-hide-on-desktop{ display:block; }
        /* ✅ show hamburger only on mobile */
        .pk-mobile-menu-btn{ display:flex; }

        /* ✅ When drawer is open, hide hamburger (so it doesn't overlap) */
        .pk-hamburger-hidden{ opacity:0; pointer-events:none; }
      }

      /* ✅ Hard-force mobile hamburger visibility via JS-added class (fixes cases where media query isn't applied as expected in embedded previews) */
      .pk-is-mobile .pk-mobile-menu-btn{ display:flex !important; }
      .pk-is-desktop .pk-mobile-menu-btn{ display:none !important; }

      /* Sidebar content */
      .pk-sidebar-inner{
        padding:20px 24px;
        display:flex;
        flex-direction:column;
        gap:12px;
      }

      .pk-logo-wrap{
        margin-bottom:16px;
        display:flex;
        justify-content:center;
      }
      .pk-logo-btn{
        width:100%;
        display:flex;
        justify-content:center;
        border:none;
        background:transparent;
        padding:0;
        cursor:pointer;
      }
      .pk-logo-img{
        width:100%;
        max-width:180px;
        height:auto;
        max-height:160px;
        object-fit:contain;
        user-select:none;
        -webkit-user-drag:none;
      }

      .pk-panel{
        border:1px solid var(--pk-border);
        border-radius:12px;
        transition: border-color .15s ease;
        overflow:hidden;
      }
      .pk-panel:hover{ border-color:#D1D5DB; }
      .pk-panel-btn{
        width:100%;
        border:none;
        background:#fff;
        padding:10px 12px;
        font-size:14px;
        font-weight:600;
        display:flex;
        align-items:center;
        gap:8px;
        text-align:left;
        cursor:pointer;
      }
      .pk-panel-btn:hover{ background:#F9FAFB; }

      .pk-help{
        margin-top:-4px;
        padding:0 4px;
        font-size:11px;
        line-height:16px;
        color:var(--pk-muted);
      }

      .pk-hr{
        margin:8px 0;
        border:none;
        border-top:1px solid var(--pk-border);
      }

      .pk-ghost-btn{
        width:100%;
        border:none;
        background:transparent;
        padding:8px 0;
        display:flex;
        align-items:center;
        gap:12px;
        font-size:14px;
        cursor:pointer;
        color:#111827;
      }
      .pk-ghost-btn:hover{ background:#F9FAFB; border-radius:10px; }

      .pk-cardlist{
        display:grid;
        gap:8px;
      }

      .pk-mini-card{
        border:none;
        background:#fff;
        border-radius:12px;
        padding:12px;
        text-align:left;
        cursor:pointer;
        transition: background .15s ease;
      }
      .pk-mini-card:hover{ background:#F9FAFB; }
      .pk-mini-row{
        display:flex;
        gap:12px;
        align-items:flex-start;
      }
      .pk-mini-icon{
        width:36px;
        height:36px;
        border-radius:12px;
        background:#F3F4F6;
        display:flex;
        align-items:center;
        justify-content:center;
        flex:0 0 auto;
        color:#111827;
      }
      .pk-mini-title{
        display:flex;
        justify-content:space-between;
        gap:10px;
        align-items:center;
        font-size:14px;
        font-weight:700;
      }
      .pk-mini-sub{
        margin-top:2px;
        font-size:12px;
        color:var(--pk-muted);
      }

      /* Mobile drawer */
      .pk-mobile-menu-btn{
        position:fixed;
        left:16px;
        top:16px;
        z-index:30;
        width:44px;
        height:44px;
        border-radius:999px;
        border:1px solid var(--pk-border);
        background:#fff;
        box-shadow: 0 2px 8px rgba(0,0,0,.06);
        /* ✅ default: hidden (desktop/tablet). Only show on <=767px */
        display:none;
        align-items:center;
        justify-content:center;
        cursor:pointer;
        color:#111827;
      }
      .pk-mobile-menu-btn:hover{ background:#F9FAFB; }

      .pk-mobile-drawer-root{
        position:fixed;
        inset:0;
        z-index:20;
        pointer-events:none;
      }
      .pk-mobile-drawer-root.is-mounted{ pointer-events:auto; }

      .pk-drawer-overlay{
        position:absolute;
        inset:0;
        background:rgba(0,0,0,.5);
        opacity:0;
        transition:opacity .2s ease-out;
      }
      .pk-drawer-overlay.is-visible{ opacity:1; }

      .pk-drawer-panel{
        position:absolute;
        left:0; top:0; bottom:0;
        width:288px;
        background:#fff;
        overflow-y:auto;
        transform: translateX(-100%);
        transition: transform .2s ease-out;
        will-change:transform;
      }
      .pk-drawer-panel.is-visible{ transform: translateX(0); }

      .pk-drawer-close{
        position:absolute;
        right:12px;
        top:12px;
        width:40px;
        height:40px;
        border-radius:999px;
        border:none;
        background:transparent;
        cursor:pointer;
        display:flex;
        align-items:center;
        justify-content:center;
        color:#111827;
      }
      .pk-drawer-close:hover{ background:#F3F4F6; }

      /* Landing */
      .pk-landing{
        flex:1 1 auto;
        display:flex;
        align-items:center;
        justify-content:center;
        padding:0 24px;
      }
      .pk-landing-inner{
        width:100%;
        max-width:672px;
        text-align:center;
      }
      .pk-h1{
        font-size:30px;
        line-height:1.2;
        font-weight:700;
        margin:0 0 24px;
      }
      .pk-suggest-row{
        margin-top:20px;
        display:flex;
        flex-wrap:wrap;
        gap:8px;
        justify-content:center;
      }
      .pk-pill{
        border:1px solid var(--pk-border);
        background:#fff;
        border-radius:999px;
        padding:10px 14px;
        font-size:14px;
        cursor:pointer;
      }
      .pk-pill:hover{ background:#F9FAFB; }

      .pk-sep{
        margin:40px 0;
        display:flex;
        align-items:center;
        justify-content:center;
        gap:12px;
        font-size:12px;
        color:#9CA3AF;
      }
      .pk-sep-line{
        height:1px;
        width:48px;
        background:var(--pk-border);
      }

      .pk-primary{
        border:none;
        background:#111827;
        color:#fff;
        border-radius:999px;
        padding:10px 16px;
        font-size:14px;
        cursor:pointer;
        display:inline-flex;
        align-items:center;
        gap:8px;
      }
      .pk-primary:hover{ opacity:.92; }

      /* Composer */
      .pk-composer{ width:100%; }
      .pk-form{ width:100%; }
      .pk-row{
        display:flex;
        align-items:center;
        gap:12px;
        width:100%;
      }
      .pk-search-grad{
        flex:1 1 auto;
        border-radius:999px;
        padding:3px;

        background: linear-gradient(90deg, var(--pk-pink) 0%, var(--pk-purple) 70%, var(--pk-blue) 100%);
        background-size:300% 300%;
        animation: pkGradShift 16s ease-in-out infinite;
      }
      @keyframes pkGradShift{
        0%{ background-position:0% 50%; }
        50%{ background-position:100% 50%; }
        100%{ background-position:0% 50%; }
      }

      .pk-input-wrap{
        background:#fff;
        border-radius:999px;
        height:48px;
        padding:0 8px;
        box-shadow: 0 1px 2px rgba(0,0,0,.06);
        display:flex;
        align-items:center;
        gap:0;
      }
      .pk-icon-btn{
        width:40px;
        height:40px;
        border:none;
        border-radius:999px;
        background:transparent !important;
        cursor:pointer;
        display:flex;
        align-items:center;
        justify-content:center;
        flex:0 0 auto;
        color:#111827;
      }
      .pk-icon-btn:hover, .pk-icon-btn:active{ background:transparent !important; }

      .pk-input{
        flex:1 1 auto;
        min-width:0;
        border:none;
        outline:none;
        font-size:14px;
        padding:0 8px;
      }

      /* Chat area */
      .pk-chat-wrap{
        flex:1 1 auto;
        overflow-y:auto;
        overscroll-behavior:contain;
        padding:24px 16px;
      }
      @media (min-width: 768px){
        .pk-chat-wrap{ padding:24px; }
      }

      .pk-chat-inner{
        width:100%;
        max-width:768px;
        margin:0 auto;
        min-height:100%;
        display:flex;
        flex-direction:column;
        gap:12px;
        justify-content:flex-end;
        padding-bottom:32px;
      }
      #bottomRef{
        height:48px;
        flex:0 0 48px;
      }

      .pk-chat-bottom{
        border-top:1px solid var(--pk-border);
        background:#fff;
        padding:16px 16px calc(env(safe-area-inset-bottom) + 16px);
      }
      @media (min-width:768px){
        .pk-chat-bottom{ padding-left:24px; padding-right:24px; }
      }
      .pk-chat-bottom-inner{
        width:100%;
        max-width:768px;
        margin:0 auto;
      }

      /* Bubble */
      .pk-bubble-row{
        width:100%;
        display:flex;
      }
      .pk-msg-in{ animation: pkMsgIn 180ms ease-out both; }
      @keyframes pkMsgIn{
        from{ opacity:0; transform: translateY(6px); }
        to{ opacity:1; transform: translateY(0); }
      }

      .pk-bubble-row.user{ justify-content:flex-end; }
      .pk-bubble-row.ai{ justify-content:flex-start; }

      .pk-bubble{
        max-width:90%;
        border-radius:16px;
        border:1px solid var(--pk-border);
        box-shadow: 0 1px 2px rgba(0,0,0,.06);
        background:#fff;
        color:var(--pk-text);
        padding:8px 16px;
      }
      .pk-bubble.user{
        background:var(--pk-user-bubble);
        border-color:var(--pk-user-bubble);
        color:#fff;
      }
      /* single-line styling is now conservative to avoid wrap-overflow */
      .pk-bubble.single{
        min-height:36px;
        display:flex;
        align-items:center;
        padding:6px 16px;
      }

      .pk-bubble-text{
        white-space:pre-line;
        font-size:14px;
        line-height:24px;
        overflow-wrap:anywhere;
        word-break:break-word;
      }
      .pk-bubble.single .pk-bubble-text{ line-height:24px; }
      .pk-section-title{
        font-weight:700;
        color:#111827;
        margin-bottom:4px;
      }
      .pk-section-body{
        color:#374151;
      }
      .pk-section-steps{
        margin:6px 0 0 18px;
        padding:0;
        color:#374151;
      }
      .pk-section-step{
        margin:4px 0;
        line-height:22px;
      }
      .pk-section-faqs{
        margin-top:6px;
      }
      .pk-section-faq{
        margin:6px 0;
        padding:6px 8px;
        border:1px solid #E5E7EB;
        border-radius:10px;
        background:#F9FAFB;
      }
      .pk-faq-q{
        font-weight:700;
        color:#111827;
        margin-bottom:4px;
      }
      .pk-faq-a{
        color:#374151;
      }

      /* Options message */
      .pk-options-wrap{ max-width:90%; }
      .pk-options-row{
        display:flex;
        flex-wrap:wrap;
        gap:8px;
      }
      .pk-opt{
        height:36px;
        border-radius:999px;
        border:1px solid var(--pk-border);
        background:#fff;
        padding:0 16px;
        font-size:14px;
        box-shadow: 0 1px 2px rgba(0,0,0,.06);
        cursor:pointer;
        transition: transform .12s ease;
      }
      .pk-opt:hover{ transform: translateY(-1px); border-color:#D1D5DB; background:#F9FAFB; }
      .pk-opt[aria-pressed="true"]{
        border-color:var(--pk-pink);
        background:var(--pk-pink);
        color:#fff;
      }

      /* Choices message (cards) */
      .pk-choice-title{ font-size:14px; font-weight:700; }
      .pk-choice-sub{ margin-top:4px; font-size:12px; color:var(--pk-muted); }

      .pk-quick-filter{
        margin-top:10px;
        margin-bottom:6px;
        display:flex;
        align-items:center;
      }
      .pk-quick-filter-input{
        width:100%;
        max-width:360px;
        height:36px;
        border:1px solid var(--pk-border);
        border-radius:999px;
        padding:0 12px;
        font-size:13px;
        outline:none;
        background:#fff;
      }

      .pk-drag-x{
        margin-top:12px;
        margin-left:-8px;
        margin-right:-8px;
        padding:0 8px;
        overflow-x:auto;
        cursor:grab;
        touch-action: pan-y;
        overscroll-behavior-x: contain;
        scrollbar-width:none;
      }
      .pk-drag-x::-webkit-scrollbar{ display:none; }
      .pk-drag-x:active{ cursor:grabbing; }
      .pk-drag-x.pk-is-dragging{ user-select:none; }

      .pk-cards-row{
        display:flex;
        gap:12px;
        padding-bottom:8px;
      }

      /* Cards */
      .pk-card{
        width:200px;
        flex:0 0 auto;
        border-radius:16px;
        border:1px solid var(--pk-border);
        background:#fff;
        cursor:pointer;
        position:relative;
        overflow:hidden;
      }
      .pk-card.padded{ padding:16px; overflow:visible; }

      /* ✅ Heart: slightly bigger (your request) + tidy touch target */
      .pk-heart{
        position:relative;
        width:42px;
        height:42px;
        border:none;
        background:transparent;
        display:flex;
        align-items:center;
        justify-content:center;
        cursor:pointer;
        transition: transform .15s ease;
      }
      .pk-heart svg{ width:28px; height:28px; }
      .pk-heart:hover{ transform: translateY(-2px); }

      .pk-pill-lite{
        display:inline-flex;
        align-items:center;
        border-radius:999px;
        background:#F9FAFB;
        padding:6px 12px;
        font-size:12px;
        color:#374151;
      }
      .pk-t-title{ margin-top:12px; font-size:15px; font-weight:700; line-height:20px; }
      .pk-t-price{ margin-top:8px; font-size:18px; font-weight:800; letter-spacing:-.01em; }
      .pk-t-hosp{ margin-top:8px; font-size:12px; color:#4B5563; }
      .pk-t-dist{ margin-top:4px; font-size:12px; color:#6B7280; }

      .pk-h-img{
        width:100%;
        aspect-ratio:1/1;
        background:#F3F4F6;
        display:flex;
        align-items:center;
        justify-content:center;
        color:#6B7280;
        font-size:12px;
        position:relative;
      }

      .pk-card-body{ padding:16px; }
      .pk-h-name{ font-size:14px; font-weight:700; line-height:20px; }
      .pk-h-addr{ margin-top:4px; font-size:12px; color:#6B7280; }

      .pk-chiprow{
        margin-top:12px;
        display:flex;
        flex-wrap:wrap;
        gap:6px;
      }
      .pk-chip{
        display:inline-flex;
        align-items:center;
        border-radius:999px;
        border:1px solid var(--pk-border);
        background:#fff;
        padding:2px 8px;
        font-size:11px;
        color:#374151;
      }

      .pk-doc-card{
        padding:0;
        display:flex;
        flex-direction:column;
        overflow:hidden;
      }
      .pk-doc-hero{
        height:110px;
        background:#FFFFFF;
        display:flex;
        align-items:center;
        justify-content:center;
        position:relative;
        padding:6px 10px;
      }
      .pk-doc-hero img{
        width:100%;
        height:100%;
        object-fit:contain;
        display:block;
      }
      .pk-doc-heart{
        position:absolute;
        top:10px;
        right:10px;
      }
      .pk-doc-name-block{ display:flex; flex-direction:column; gap:4px; }
      .pk-doc-name{ font-size:15px; font-weight:700; line-height:20px; }
      .pk-doc-dept{ font-size:12px; color:#4B5563; }
      .pk-doc-hosp{ font-size:12px; color:#6B7280; }
      .pk-doc-profile{
        margin-top:10px;
        padding-left:18px;
        color:#4B5563;
        font-size:12px;
        line-height:18px;
      }
      .pk-doc-profile li{ list-style:disc; }
      .pk-chiprow.tight{ margin-top:10px; }
      .pk-doc-skip{
        border:1px solid #E5E7EB;
        background:linear-gradient(160deg, #F8FAFF 0%, #FFFFFF 45%, #F1F5F9 100%);
        justify-content:center;
        position:relative;
        overflow:hidden;
        transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
      }
      .pk-doc-skip::after{
        content:"";
        position:absolute;
        inset:0;
        background:linear-gradient(120deg, rgba(79,70,229,0.08), rgba(14,165,233,0.06), rgba(255,255,255,0));
        opacity:0;
        transition:opacity .2s ease;
        pointer-events:none;
      }
      .pk-doc-skip:hover{
        transform:translateY(-3px);
        border-color:#C7D2FE;
        box-shadow:0 14px 28px rgba(30,41,59,0.10), 0 8px 18px rgba(79,70,229,0.12);
      }
      .pk-doc-skip:hover::after{ opacity:1; }
      .pk-doc-skip:focus-within{
        outline:2px solid #4F46E5;
        outline-offset:3px;
      }
      .pk-doc-skip-hero{
        padding:18px 16px 20px;
        display:flex;
        flex-direction:column;
        gap:8px;
        text-align:left;
      }
      .pk-doc-skip-top{
        display:flex;
        align-items:center;
        gap:8px;
      }
      .pk-doc-skip-icon{
        width:36px;
        height:36px;
        border-radius:12px;
        background:linear-gradient(135deg, #EEF2FF 0%, #DBEAFE 100%);
        color:#4338CA;
        display:flex;
        align-items:center;
        justify-content:center;
        font-size:16px;
        box-shadow:0 6px 16px rgba(59,130,246,0.20);
      }
      .pk-doc-skip-tag{
        font-size:11px;
        font-weight:700;
        color:#4F46E5;
        background:#EEF2FF;
        border:1px solid #C7D2FE;
        border-radius:999px;
        padding:2px 8px;
      }
      .pk-doc-skip-title{
        font-size:16px;
        font-weight:800;
        color:#111827;
      }
      .pk-doc-skip-sub{
        font-size:12px;
        color:#6B7280;
        line-height:18px;
      }
      .pk-doc-skip-badges{
        margin-top:4px;
        display:flex;
        gap:6px;
        flex-wrap:wrap;
      }
      .pk-doc-skip-badge{
        font-size:11px;
        font-weight:700;
        color:#111827;
        background:#F3F4F6;
        border:1px solid #E5E7EB;
        border-radius:999px;
        padding:2px 8px;
      }
      .pk-doc-skip-badge.primary{
        color:#ffffff;
        background:linear-gradient(135deg, #4F46E5 0%, #6366F1 100%);
        border-color:#4F46E5;
      }
      .pk-doc-skip-badge.subtle{
        color:#0F766E;
        background:#ECFEFF;
        border-color:#A5F3FC;
      }
      .pk-doc-skip-footer{
        margin-top:6px;
        display:flex;
        align-items:center;
        gap:6px;
        font-size:11px;
        color:#94A3B8;
        letter-spacing:.02em;
      }
      .pk-doc-skip-dot{
        color:#818CF8;
      }
      .pk-doc-skip-note{
        text-transform:uppercase;
      }

      /* Quick booking animations */
      .pk-animate-slide{ animation: pk-slide-up 0.4s ease forwards; }
      .pk-animate-fade{ animation: pk-fade 0.35s ease forwards; }
      @keyframes pk-slide-up{
        from { transform: translateY(12px); opacity: 0; }
        to { transform: translateY(0); opacity: 1; }
      }
      @keyframes pk-fade{
        from { opacity: 0; }
        to { opacity: 1; }
      }

      /* reduced motion */
      @media (prefers-reduced-motion: reduce){
        .pk-search-grad{ animation:none; }
        .pk-msg-in{ animation:none; }
      }
          /* =========================
         iOS / Mobile Safety Patches
         ========================= */

      /* iOS viewport height bug (address bar jump) */
      .pk-app{
        min-height:100vh; /* fallback */
        min-height:100svh; /* iOS 16+ */
        min-height:100dvh; /* modern */
      }

      /* Prevent iOS input zoom on focus */
      input, textarea, select{
        font-size:16px;
      }

      /* iOS momentum scroll */
      .pk-chat-wrap,
      .pk-drawer-panel{
        -webkit-overflow-scrolling: touch;
      }

      /* Prevent rubber-band scroll leaking to body */
      body{
        overscroll-behavior-y: none;
      }

      /* Fixed-position + transform iOS rendering safety */
      .pk-mobile-menu-btn,
      .pk-mobile-drawer-root{
        transform: translateZ(0);
        will-change: transform;
      }

      /* Touch highlight removal */
      button, a{
        -webkit-tap-highlight-color: transparent;
      }

      /* Safer pointer behavior for draggable rows */
      .pk-drag-x{
        touch-action: pan-x;
      }

      /* Respect iOS safe-area */
      .pk-chat-bottom{
        padding-bottom: calc(env(safe-area-inset-bottom) + 16px);
      }
