/* =====================================================================
   항공권 최저가 — 화면 스타일 (fe-shell)
   디자인 원본: ref/index.html (아름다운메디컬요양원) 의 토큰·뉴모피즘을 그대로 옮김.
   폰(360~430px) 우선. 가로 스크롤은 사이트 단추 줄 안쪽에서만 허용.
   ===================================================================== */

/* ===== 토큰 (원본 그대로 + 이 앱에 필요한 몇 개 추가) ===== */
:root{
  --surface:#f0f2ee;
  --ink:#2d332a;
  --primary:#4a5446;
  --outline:#8a9187;
  --gold:#d89f2a;
  --track:#e2e4df;
  --sh-dark:#d6d9d3;
  --sh-light:#ffffff;
  --track-in-dark:#cccfca;
  --track-in-light:#f9fbf7;
  --footer-bg:#2d332a;
  --footer-ink:#e8ebe4;
  --logo-green:#6b7a52;
  --logo-mark:#8faf2b;
  --logo-sub:#8d8d8d;
  /* 추가 — 금색 위 글자(대비 확보), 금빛 옅은 바탕, 예시 경고 띠 */
  --on-gold:#2a2414;
  --gold-soft:rgba(216,159,42,.14);
  --gold-line:rgba(216,159,42,.55);
  --muted:#6f766c;
  --demo-a:#2d332a;
  --demo-b:#3b4337;
  --demo-ink:#ffd77a;
  --warn-ink:#8a5a12;
  /* 금색 '글자'용(라이트 바탕 대비 5.25:1, WCAG AA). 테두리·채움은 --gold 그대로 */
  --gold-ink:#8a5a12;
}
html[data-theme="dark"]{
  --surface:#2a2e28;
  --ink:#e3e7de;
  --primary:#cdd4c6;
  --outline:#99a191;
  --gold:#e0ab3c;
  --track:#242822;
  --sh-dark:#21251f;
  --sh-light:#343a31;
  --track-in-dark:#1d211c;
  --track-in-light:#31372e;
  --footer-bg:#20241e;
  --footer-ink:#d7dccf;
  --logo-green:#a8bb8a;
  --logo-mark:#a9cc55;
  --logo-sub:#9aa192;
  --on-gold:#1f1b10;
  --gold-soft:rgba(224,171,60,.16);
  --gold-line:rgba(224,171,60,.6);
  --muted:#aab2a2;
  --demo-a:#151813;
  --demo-b:#20251d;
  --demo-ink:#ffd77a;
  --warn-ink:#f0c46a;
  --gold-ink:#e0ab3c;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;}
body{
  background:var(--surface);
  color:var(--ink);
  font-family:"Segoe UI","Malgun Gothic","Apple SD Gothic Neo","Noto Sans KR",system-ui,sans-serif;
  min-height:100vh;
  line-height:1.45;
  word-break:keep-all;
  overflow-wrap:break-word;
  transition:background .3s,color .3s;
  overflow-x:hidden;
  -webkit-tap-highlight-color:transparent;
}
a{text-decoration:none;color:inherit;}
button{font-family:inherit;font-size:inherit;border:none;background:none;color:inherit;cursor:pointer;}
input,select{font-family:inherit;}
svg{display:block;flex:0 0 auto;}
[hidden]{display:none!important;}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;}

.wrap{max-width:46rem;margin:0 auto;
      padding:max(1rem,env(safe-area-inset-top)) 1rem calc(2rem + env(safe-area-inset-bottom));}
.wrap>*{min-width:0;}

/* ===== 뉴모피즘 공용 (원본 그대로) ===== */
.neu-card{background:var(--surface);border-radius:2rem;box-shadow:12px 12px 24px var(--sh-dark),-12px -12px 24px var(--sh-light);}
.neu-circle{background:var(--surface);border-radius:50%;box-shadow:6px 6px 12px var(--sh-dark),-6px -6px 12px var(--sh-light);}
.neu-pill{background:var(--surface);border-radius:9999px;box-shadow:4px 4px 8px var(--sh-dark),-4px -4px 8px var(--sh-light);}
.neu-inset{box-shadow:inset 4px 4px 8px var(--sh-dark),inset -4px -4px 8px var(--sh-light);}

/* ===== 1. 탑바 ===== */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-bottom:1.4rem;flex-wrap:wrap;}
.topbar-left{display:flex;align-items:center;gap:.55rem;min-width:0;}
.top-date{font-size:1.05rem;font-weight:700;letter-spacing:.05em;font-variant-numeric:tabular-nums;}
.vdiv{width:1px;height:1.4rem;background:var(--outline);opacity:.35;}
.bell{position:relative;color:var(--outline);width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:color .2s;}
.bell.on{color:var(--gold);}
.bell-badge{position:absolute;top:-3px;right:-9px;min-width:1.15rem;height:1.15rem;padding:0 .28rem;border-radius:9999px;
            background:var(--gold);color:var(--on-gold);font-size:.62rem;font-weight:800;line-height:1.15rem;text-align:center;
            box-shadow:0 2px 5px rgba(0,0,0,.18);font-variant-numeric:tabular-nums;}
.btn-call{display:inline-flex;align-items:center;gap:.45rem;min-height:44px;padding:.55rem 1.05rem;font-size:.875rem;font-weight:700;color:var(--gold);transition:transform .2s;white-space:nowrap;}
.btn-call:active{box-shadow:inset 4px 4px 8px var(--sh-dark),inset -4px -4px 8px var(--sh-light);}
.btn-call.busy svg{animation:spin 1s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
.topbar-right{display:flex;align-items:center;gap:.8rem;margin-left:auto;}
.btn-theme{width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:var(--outline);transition:transform .2s;}
.btn-theme:active{box-shadow:inset 4px 4px 8px var(--sh-dark),inset -4px -4px 8px var(--sh-light);}
.dots{display:flex;gap:.4rem;}
.dot{width:.55rem;height:.55rem;border-radius:50%;}
.dot1{background:#d89f2a;}.dot2{background:#8a9187;}.dot3{background:#4a5446;}.dot4{background:#b7bfb2;}
html[data-theme="dark"] .icon-sun{display:none;}
html[data-theme="light"] .icon-moon,html:not([data-theme]) .icon-moon{display:none;}

/* ===== 2. 제목 행 ===== */
.logo-row{display:flex;align-items:center;gap:.9rem 1rem;margin-bottom:1.5rem;flex-wrap:wrap;}
.logo-fallback{display:flex;align-items:center;gap:.8rem;min-width:0;flex:1 1 15rem;}
.logo-mark{flex:0 0 auto;width:3.1rem;height:3.1rem;display:flex;align-items:center;justify-content:center;color:var(--gold);}
.logo-mark svg{width:1.6rem;height:1.6rem;}
.logo-texts{display:flex;flex-direction:column;gap:.15rem;min-width:0;}
.logo-tag{font-size:.74rem;font-weight:600;color:var(--logo-sub);letter-spacing:.01em;line-height:1.35;}
.logo-word{font-size:1.6rem;font-weight:800;letter-spacing:-.015em;color:var(--logo-green);line-height:1.15;position:relative;padding-bottom:.35rem;}
.logo-word::after{content:"";position:absolute;left:0;bottom:0;width:2rem;height:3px;border-radius:9999px;background:var(--gold);}
.clock-pill{display:flex;align-items:center;gap:.55rem;min-height:44px;padding:.55rem 1.1rem;margin-left:auto;max-width:100%;text-align:left;}
.clock-label{display:flex;align-items:center;color:var(--outline);flex:0 0 auto;}
.clock-text{font-size:.82rem;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;line-height:1.35;}
.clock-pill.stale .clock-text{color:var(--warn-ink);}
.clock-pill.none .clock-text{color:var(--outline);}

/* ===== 3. 상단 사이트 단추 줄 — 이 줄만 안쪽에서 옆으로 민다 ===== */
.site-bar{display:flex;flex-wrap:nowrap;align-items:center;gap:.7rem;overflow-x:auto;overflow-y:hidden;
          margin:0 -1rem 1.2rem;padding:.6rem 1rem 1.1rem;
          scroll-snap-type:x proximity;scroll-padding-inline:1rem;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;
          scrollbar-width:thin;scrollbar-color:var(--track-in-dark) transparent;}
.site-bar::-webkit-scrollbar{height:5px;}
.site-bar::-webkit-scrollbar-thumb{background:var(--track-in-dark);border-radius:9999px;}
.site-btn{flex:0 0 auto;display:inline-flex;align-items:center;gap:.5rem;min-height:46px;padding:.55rem 1.05rem;
          border-radius:9999px;background:var(--surface);color:var(--ink);font-size:.9rem;font-weight:700;white-space:nowrap;
          box-shadow:4px 4px 8px var(--sh-dark),-4px -4px 8px var(--sh-light);scroll-snap-align:start;
          transition:box-shadow .2s,color .2s,transform .15s;}
.site-btn .bdot{width:.6rem;height:.6rem;border-radius:50%;flex:0 0 auto;box-shadow:0 0 0 2px var(--surface);}
.site-btn[aria-pressed="true"]{box-shadow:inset 4px 4px 8px var(--sh-dark),inset -4px -4px 8px var(--sh-light);color:var(--primary);}
.site-btn.site-best{min-height:54px;padding:.7rem 1.4rem;font-size:1.05rem;font-weight:800;background:var(--gold);color:var(--on-gold);
                    box-shadow:5px 5px 10px var(--sh-dark),-5px -5px 10px var(--sh-light);}
.site-btn.site-best[aria-pressed="true"]{color:var(--on-gold);
                    box-shadow:inset 4px 4px 9px rgba(0,0,0,.22),inset -4px -4px 9px rgba(255,255,255,.28);}
.site-btn.site-missing{opacity:.55;}

/* ===== 4. 조건 카드 ===== */
.cond-card{margin-bottom:1.6rem;border-radius:1.6rem;}
.cond-head{width:100%;display:flex;align-items:center;justify-content:space-between;gap:.8rem;min-height:56px;padding:1rem 1.3rem;text-align:left;border-radius:1.6rem;}
.cond-head-texts{display:flex;flex-direction:column;gap:.2rem;min-width:0;}
.stat-title{font-size:.86rem;font-weight:700;color:var(--outline);letter-spacing:.02em;}
.cond-summary{font-size:.84rem;font-weight:600;color:var(--ink);line-height:1.45;}
.cond-chev{width:36px;height:36px;display:flex;align-items:center;justify-content:center;color:var(--outline);border-radius:50%;
           box-shadow:3px 3px 6px var(--sh-dark),-3px -3px 6px var(--sh-light);transition:transform .25s;flex:0 0 auto;}
.cond-head[aria-expanded="true"] .cond-chev{transform:rotate(180deg);}
.cond-body{padding:.2rem 1.3rem 1.3rem;display:flex;flex-direction:column;gap:1.05rem;}
.f-row{display:flex;flex-direction:column;gap:.5rem;min-width:0;}
.f-label{font-size:.8rem;font-weight:700;color:var(--outline);display:flex;justify-content:space-between;gap:.5rem;flex-wrap:wrap;}
.f-label .f-hint{font-weight:600;opacity:.9;}
.chips{display:flex;flex-wrap:wrap;gap:.55rem;}
.chip{min-height:44px;padding:.5rem .95rem;border-radius:9999px;background:var(--surface);color:var(--muted);font-size:.86rem;font-weight:700;
      box-shadow:3px 3px 6px var(--sh-dark),-3px -3px 6px var(--sh-light);transition:box-shadow .15s,color .15s;white-space:nowrap;}
.chip[aria-pressed="true"]{color:var(--ink);box-shadow:inset 3px 3px 6px var(--track-in-dark),inset -3px -3px 6px var(--track-in-light);}
.chip[aria-pressed="true"]::before{content:"";display:inline-block;width:.45rem;height:.45rem;border-radius:50%;background:var(--gold);margin-right:.4rem;vertical-align:.1em;}
.chip.small{min-height:44px;padding:.45rem .8rem;font-size:.8rem;}
.stepper{display:flex;align-items:center;gap:.8rem;}
.step-btn{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--primary);font-size:1.3rem;font-weight:700;
          box-shadow:4px 4px 8px var(--sh-dark),-4px -4px 8px var(--sh-light);}
.step-btn:active{box-shadow:inset 3px 3px 6px var(--sh-dark),inset -3px -3px 6px var(--sh-light);}
.step-btn:disabled{opacity:.4;cursor:default;}
.step-val{min-width:4.2rem;text-align:center;font-size:1.05rem;font-weight:800;font-variant-numeric:tabular-nums;}
.in-box{display:flex;align-items:center;gap:.5rem;padding:.2rem 1rem;border-radius:1rem;min-height:48px;max-width:100%;
        box-shadow:inset 4px 4px 8px var(--track-in-dark),inset -4px -4px 8px var(--track-in-light);}
.in-box input{flex:1 1 auto;min-width:0;width:100%;border:none;outline:none;background:transparent;color:var(--ink);
              font-size:1.05rem;font-weight:700;padding:.55rem 0;min-height:44px;font-variant-numeric:tabular-nums;}
.in-box input::placeholder{color:var(--outline);opacity:.6;font-weight:600;}
.in-box .unit{font-size:.85rem;font-weight:700;color:var(--outline);flex:0 0 auto;}
.in-box input[type="date"]{font-size:1rem;min-height:44px;color-scheme:light;}
html[data-theme="dark"] .in-box input[type="date"]{color-scheme:dark;}
.f-sub{font-size:.76rem;color:var(--outline);line-height:1.5;}
.date-line{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;}
.date-line .in-box{flex:1 1 11rem;}
.dest-groups{display:flex;flex-direction:column;gap:.8rem;}
.dest-group-t{font-size:.76rem;font-weight:700;color:var(--muted);margin-bottom:.35rem;}
.cond-foot{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:space-between;align-items:center;padding-top:.3rem;}
.gold-divider{height:4px;border-radius:9999px;background:var(--gold);opacity:.85;box-shadow:2px 0 5px rgba(0,0,0,.1);}
.cond-body .gold-divider{width:3rem;margin-top:.2rem;}

/* ===== 공용 단추 ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:46px;padding:.65rem 1.15rem;border-radius:9999px;
     background:var(--surface);color:var(--primary);font-size:.9rem;font-weight:700;text-align:center;line-height:1.3;
     box-shadow:4px 4px 8px var(--sh-dark),-4px -4px 8px var(--sh-light);transition:box-shadow .15s,transform .15s;}
.btn:active{box-shadow:inset 4px 4px 8px var(--sh-dark),inset -4px -4px 8px var(--sh-light);}
.btn.gold{background:var(--gold);color:var(--on-gold);}
.btn.gold:active{box-shadow:inset 4px 4px 9px rgba(0,0,0,.22),inset -4px -4px 9px rgba(255,255,255,.28);}
.btn.ghost{color:var(--outline);}
.btn.block{width:100%;}
.btn-row{display:flex;flex-wrap:wrap;gap:.7rem;}
.btn-row>.btn{flex:1 1 9rem;}

/* ===== 5. 본문 공용 ===== */
#main{display:flex;flex-direction:column;gap:1.5rem;margin-bottom:1.8rem;min-width:0;}
#main>*{min-width:0;}
.sec-title{font-size:.9rem;font-weight:700;color:var(--outline);letter-spacing:.02em;margin:0 .3rem .8rem;display:flex;justify-content:space-between;align-items:baseline;gap:.5rem;flex-wrap:wrap;}
.sec-title .sub{font-size:.74rem;font-weight:600;opacity:.85;}
.info-card{padding:1.4rem 1.3rem;}
.info-title{font-size:1.05rem;font-weight:800;color:var(--ink);margin-bottom:.45rem;line-height:1.4;}
.info-text{font-size:.86rem;color:var(--muted);line-height:1.65;margin-bottom:1rem;}
.info-text:last-child{margin-bottom:0;}
.info-text b{color:var(--ink);}
.info-list{font-size:.84rem;color:var(--muted);line-height:1.6;margin:0 0 1rem 1.1rem;}
.info-list li{margin-bottom:.25rem;}

/* 예시(가짜) 가격 경고 띠 */
.demo-band{border-radius:1.4rem;padding:1.05rem 1.2rem;color:var(--demo-ink);
           background:repeating-linear-gradient(-45deg,var(--demo-a) 0 14px,var(--demo-b) 14px 28px);
           box-shadow:6px 6px 14px var(--sh-dark),-6px -6px 14px var(--sh-light);}
.demo-band .db-t{font-size:1.15rem;font-weight:900;letter-spacing:-.01em;line-height:1.35;}
.demo-band .db-d{font-size:.8rem;color:#f2ead2;margin-top:.35rem;line-height:1.55;}
.demo-band a{color:#fff;text-decoration:underline;text-underline-offset:3px;font-weight:700;display:inline-flex;align-items:center;min-height:44px;margin-top:.2rem;font-size:.86rem;}

/* 목표가 이하 금빛 띠 */
.target-band{display:flex;align-items:center;gap:.8rem;padding:1rem 1.2rem;border-radius:1.4rem;background:var(--gold);color:var(--on-gold);
             box-shadow:6px 6px 14px var(--sh-dark),-6px -6px 14px var(--sh-light);}
.target-band .tb-ic{width:2.4rem;height:2.4rem;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.35);flex:0 0 auto;}
.target-band .tb-t{font-size:1.1rem;font-weight:900;line-height:1.3;}
.target-band .tb-d{font-size:.8rem;font-weight:600;opacity:.85;line-height:1.4;}

/* 추천 최저가 큰 카드 */
.best-card{padding:1.4rem 1.3rem 1.3rem;position:relative;}
.best-card.under{box-shadow:12px 12px 24px var(--sh-dark),-12px -12px 24px var(--sh-light),inset 0 0 0 2px var(--gold-line);}
.best-kicker{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.9rem;flex-wrap:wrap;}
.kicker-t{font-size:.84rem;font-weight:800;color:var(--gold-ink);letter-spacing:.04em;display:flex;align-items:center;gap:.4rem;}
.region-chip{font-size:.7rem;font-weight:700;color:var(--gold-ink);border:1px solid var(--gold);border-radius:9999px;padding:.12rem .55rem;letter-spacing:.03em;white-space:nowrap;}
.best-city{font-size:1.7rem;font-weight:900;line-height:1.2;color:var(--ink);letter-spacing:-.02em;}
.best-city .country{font-size:.95rem;font-weight:700;color:var(--outline);margin-left:.35rem;letter-spacing:0;}
.best-route{font-size:.84rem;font-weight:600;color:var(--muted);margin-top:.3rem;}
.best-dates{display:flex;align-items:center;flex-wrap:wrap;gap:.4rem .6rem;margin-top:.8rem;font-size:1rem;font-weight:800;color:var(--ink);}
.nights-chip{font-size:.74rem;font-weight:800;padding:.18rem .6rem;border-radius:9999px;color:var(--primary);
             box-shadow:inset 2px 2px 4px var(--track-in-dark),inset -2px -2px 4px var(--track-in-light);}
.best-airline{font-size:.82rem;color:var(--muted);margin-top:.4rem;font-weight:600;}
.price-box{margin-top:1.1rem;padding:1rem 1.1rem;border-radius:1.2rem;
           box-shadow:inset 4px 4px 8px var(--track-in-dark),inset -4px -4px 8px var(--track-in-light);}
.price-lab{font-size:.74rem;font-weight:700;color:var(--outline);}
.price-big{font-size:2.15rem;font-weight:900;color:var(--ink);letter-spacing:-.02em;line-height:1.15;font-variant-numeric:tabular-nums;}
.price-big .won{font-size:1.1rem;font-weight:800;margin-left:.1rem;}
.price-total{font-size:.86rem;font-weight:700;color:var(--muted);margin-top:.2rem;font-variant-numeric:tabular-nums;}
.badge-under{display:inline-flex;align-items:center;gap:.3rem;font-size:.76rem;font-weight:800;color:var(--on-gold);background:var(--gold);
             border-radius:9999px;padding:.22rem .65rem;white-space:nowrap;}
.badge-over{display:inline-flex;align-items:center;font-size:.76rem;font-weight:700;color:var(--muted);border:1px solid var(--outline);
            border-radius:9999px;padding:.18rem .6rem;white-space:nowrap;font-variant-numeric:tabular-nums;}
.badge-demo{display:inline-flex;font-size:.7rem;font-weight:800;color:var(--demo-ink);background:var(--demo-a);border-radius:9999px;padding:.15rem .55rem;white-space:nowrap;}
.price-flags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.6rem;}
.best-card .btn-row{margin-top:1.1rem;}

/* 순위 목록 */
.rank-list{display:flex;flex-direction:column;gap:.75rem;list-style:none;}
.rank-item{display:flex;align-items:center;gap:.8rem;width:100%;min-height:64px;padding:.8rem 1rem;border-radius:1.3rem;text-align:left;
           background:var(--surface);box-shadow:5px 5px 10px var(--sh-dark),-5px -5px 10px var(--sh-light);transition:box-shadow .15s;}
.rank-item:active{box-shadow:inset 4px 4px 8px var(--sh-dark),inset -4px -4px 8px var(--sh-light);}
.rank-item.under{box-shadow:5px 5px 10px var(--sh-dark),-5px -5px 10px var(--sh-light),inset 0 0 0 2px var(--gold);}
.rank-no{width:2rem;height:2rem;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:0 0 auto;font-size:.8rem;font-weight:800;color:var(--outline);
         box-shadow:inset 2px 2px 4px var(--track-in-dark),inset -2px -2px 4px var(--track-in-light);font-variant-numeric:tabular-nums;}
.rank-item.under .rank-no{color:var(--on-gold);background:var(--gold);box-shadow:none;}
.rank-main{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:.15rem;}
.rank-city{font-size:.95rem;font-weight:800;color:var(--ink);line-height:1.3;}
.rank-city .cc{font-size:.74rem;font-weight:700;color:var(--outline);margin-left:.25rem;}
.rank-meta{font-size:.76rem;font-weight:600;color:var(--muted);line-height:1.4;}
.rank-side{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-end;gap:.25rem;}
.rank-price{font-size:1.02rem;font-weight:900;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap;}
.rank-side .badge-under{font-size:.66rem;padding:.12rem .45rem;}
.rank-more{margin-top:.2rem;}

/* 목적지별 최저가 칸 */
.dest-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(9.2rem,100%),1fr));gap:.85rem;}
.dest-cell{display:flex;flex-direction:column;align-items:flex-start;gap:.2rem;min-height:96px;padding:.9rem 1rem;border-radius:1.3rem;text-align:left;
           background:var(--surface);box-shadow:5px 5px 10px var(--sh-dark),-5px -5px 10px var(--sh-light);min-width:0;}
.dest-cell:active{box-shadow:inset 4px 4px 8px var(--sh-dark),inset -4px -4px 8px var(--sh-light);}
.dest-cell.under{box-shadow:5px 5px 10px var(--sh-dark),-5px -5px 10px var(--sh-light),inset 0 0 0 2px var(--gold);}
.dest-cell .dc-city{font-size:.92rem;font-weight:800;color:var(--ink);line-height:1.25;}
.dest-cell .dc-country{font-size:.7rem;font-weight:700;color:var(--outline);}
.dest-cell .dc-price{font-size:1.02rem;font-weight:900;color:var(--ink);margin-top:auto;font-variant-numeric:tabular-nums;}
.dest-cell.under .dc-price{color:var(--warn-ink);}
.dest-cell .dc-date{font-size:.7rem;font-weight:600;color:var(--muted);}
.dest-cell.none .dc-price{font-size:.78rem;font-weight:700;color:var(--outline);}

.note-line{font-size:.76rem;color:var(--outline);line-height:1.55;padding:0 .4rem;}

/* ===== 사이트 화면 ===== */
.site-head{padding:1.3rem 1.3rem 1.2rem;}
.site-head-top{display:flex;align-items:center;gap:.7rem;margin-bottom:.6rem;}
.site-logo-dot{width:2.6rem;height:2.6rem;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:0 0 auto;
               box-shadow:inset 3px 3px 6px var(--track-in-dark),inset -3px -3px 6px var(--track-in-light);}
.site-logo-dot i{display:block;width:.95rem;height:.95rem;border-radius:50%;}
.site-head-t{font-size:1.25rem;font-weight:900;color:var(--ink);line-height:1.3;}
.site-head-d{font-size:.84rem;color:var(--muted);line-height:1.6;margin-bottom:.8rem;}
.honor-list{list-style:none;display:flex;flex-direction:column;gap:.4rem;margin-bottom:.9rem;}
.honor-list li{font-size:.8rem;font-weight:600;color:var(--warn-ink);background:var(--gold-soft);border-radius:.8rem;padding:.5rem .75rem;line-height:1.5;}
.honor-list li.ok{color:var(--muted);background:transparent;padding:.1rem .2rem;}
.verify-note{font-size:.74rem;color:var(--outline);line-height:1.5;margin-bottom:.4rem;}
.verify-memo{margin-bottom:.8rem;}
.verify-memo>summary{display:inline-flex;align-items:center;min-height:44px;font-size:.74rem;font-weight:700;color:var(--outline);text-decoration:underline;text-underline-offset:3px;}
.verify-memo p{font-size:.72rem;color:var(--outline);line-height:1.55;padding:.1rem 0 .3rem;}
.nw{white-space:nowrap;}

.region-acc{border-radius:1.5rem;}
.acc{display:block;}
.acc>summary{list-style:none;cursor:pointer;}
.acc>summary::-webkit-details-marker{display:none;}
.region-acc>summary{display:flex;align-items:center;justify-content:space-between;gap:.6rem;min-height:56px;padding:.9rem 1.3rem;border-radius:1.5rem;}
.region-t{font-size:1rem;font-weight:800;color:var(--ink);}
.region-t .cnt{font-size:.78rem;font-weight:700;color:var(--outline);margin-left:.35rem;}
.acc-chev{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--outline);flex:0 0 auto;
          box-shadow:3px 3px 6px var(--sh-dark),-3px -3px 6px var(--sh-light);transition:transform .25s;}
.acc[open]>summary .acc-chev{transform:rotate(180deg);}
.region-body{padding:.2rem .9rem 1rem;display:flex;flex-direction:column;gap:.7rem;}
.dest-acc{border-radius:1.2rem;background:var(--surface);box-shadow:4px 4px 8px var(--sh-dark),-4px -4px 8px var(--sh-light);}
.dest-acc>summary{display:flex;align-items:center;gap:.6rem;min-height:56px;padding:.7rem .9rem;border-radius:1.2rem;}
.dest-acc[open]>summary{box-shadow:inset 3px 3px 6px var(--track-in-dark),inset -3px -3px 6px var(--track-in-light);}
.dest-sum-main{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:.1rem;}
.dest-sum-city{font-size:.95rem;font-weight:800;color:var(--ink);line-height:1.3;}
.dest-sum-city .code{font-size:.74rem;font-weight:700;color:var(--outline);margin-left:.3rem;letter-spacing:.03em;}
.dest-sum-meta{font-size:.72rem;font-weight:600;color:var(--muted);}
.dest-sum-price{flex:0 0 auto;font-size:.86rem;font-weight:800;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums;}
.dest-sum-price.under{color:var(--on-gold);background:var(--gold);border-radius:9999px;padding:.15rem .55rem;}
.dest-body{padding:.6rem .6rem .8rem;}
.origin-t{font-size:.76rem;font-weight:800;color:var(--outline);margin:.5rem .3rem .4rem;}
.pat-list{list-style:none;display:flex;flex-direction:column;gap:.15rem;}
.pat-row{display:flex;align-items:center;gap:.6rem;padding:.35rem .3rem;border-bottom:1px dashed var(--track-in-dark);}
.pat-row:last-child{border-bottom:none;}
.pat-main{flex:1 1 auto;min-width:0;}
.pat-date{font-size:.86rem;font-weight:700;color:var(--ink);line-height:1.35;}
.pat-sub{font-size:.72rem;font-weight:600;color:var(--muted);}
.pat-price{flex:0 0 auto;font-size:.84rem;font-weight:800;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums;text-align:right;}
.pat-price.under{color:var(--warn-ink);}
.pat-price.none{font-weight:600;color:var(--outline);font-size:.72rem;}
.open-btn{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;gap:.25rem;min-width:64px;min-height:44px;padding:.45rem .8rem;border-radius:9999px;
          font-size:.82rem;font-weight:800;color:var(--gold-ink);background:var(--surface);
          box-shadow:3px 3px 6px var(--sh-dark),-3px -3px 6px var(--sh-light);white-space:nowrap;}
.open-btn:active{box-shadow:inset 3px 3px 6px var(--sh-dark),inset -3px -3px 6px var(--sh-light);}
.empty-small{font-size:.8rem;color:var(--outline);padding:.6rem .4rem;line-height:1.55;}

/* ===== 6. 하단 알약 + 7. 푸터 (원본 그대로) ===== */
.bottom-pill{display:flex;align-items:flex-start;justify-content:space-between;gap:.8rem;padding:.9rem 1.2rem;margin-bottom:1.6rem;border-radius:1.6rem;}
.bottom-pill .txt{font-size:.78rem;font-weight:600;color:var(--outline);line-height:1.55;word-break:keep-all;}
.bottom-pill .chev{color:var(--outline);flex:0 0 auto;margin-top:.1rem;}
footer{margin-top:.5rem;}
.footer-card{position:relative;background:var(--footer-bg);color:var(--footer-ink);border-radius:2rem;padding:1.4rem 1.4rem;box-shadow:12px 12px 24px var(--sh-dark),-12px -12px 24px var(--sh-light);}
.footer-name{font-family:Georgia,"Nanum Myeongjo",Batang,serif;font-weight:700;font-size:.98rem;letter-spacing:.1em;margin-bottom:.45rem;}
.footer-info{font-size:.74rem;line-height:1.65;opacity:.85;word-break:keep-all;}
.footer-copy{font-size:.68rem;opacity:.55;margin-top:.55rem;}

/* ===== 비교 시트 ===== */
.sheet-layer{position:fixed;inset:0;z-index:60;display:flex;align-items:flex-end;justify-content:center;
             background:rgba(45,51,42,.45);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);}
.sheet{width:min(46rem,100%);max-height:88vh;display:flex;flex-direction:column;background:var(--surface);
       border-radius:1.8rem 1.8rem 0 0;padding:.6rem 1.1rem calc(1rem + env(safe-area-inset-bottom));
       box-shadow:0 -10px 30px rgba(0,0,0,.22);animation:sheetUp .22s ease-out;}
@keyframes sheetUp{from{transform:translateY(30px);opacity:.4;}to{transform:none;opacity:1;}}
.sheet-grip{width:2.6rem;height:5px;border-radius:9999px;background:var(--track-in-dark);margin:.2rem auto .8rem;}
.sheet-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.8rem;margin-bottom:.9rem;}
.sheet-texts{min-width:0;}
.sheet-title{font-size:1.1rem;font-weight:900;color:var(--ink);line-height:1.35;}
.sheet-sub{font-size:.8rem;font-weight:600;color:var(--muted);line-height:1.5;margin-top:.2rem;}
.sheet-close{width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:var(--outline);flex:0 0 auto;}
.sheet-body{overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:.65rem;padding:.4rem .8rem .6rem;margin:0 -.6rem;}
.cmp-row{display:flex;align-items:center;gap:.7rem;min-height:56px;padding:.6rem .9rem;border-radius:1.1rem;background:var(--surface);
         box-shadow:4px 4px 8px var(--sh-dark),-4px -4px 8px var(--sh-light);}
.cmp-row:active{box-shadow:inset 3px 3px 6px var(--sh-dark),inset -3px -3px 6px var(--sh-light);}
.cmp-row .bdot{width:.7rem;height:.7rem;border-radius:50%;flex:0 0 auto;}
.cmp-main{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:.1rem;}
.cmp-name{font-size:.95rem;font-weight:800;color:var(--ink);}
.cmp-note{font-size:.72rem;font-weight:600;color:var(--warn-ink);line-height:1.4;}
.cmp-go{flex:0 0 auto;font-size:.82rem;font-weight:800;color:var(--gold-ink);white-space:nowrap;}
.cmp-row.primary{background:var(--gold);}
.cmp-row.primary .cmp-name,.cmp-row.primary .cmp-go{color:var(--on-gold);}
.cmp-row.primary .cmp-note{color:var(--on-gold);opacity:.8;}

/* ===== 토스트 (원본 그대로) ===== */
#toast{position:fixed;left:50%;bottom:calc(2.2rem + env(safe-area-inset-bottom));transform:translateX(-50%) translateY(20px);max-width:calc(100% - 2rem);
       background:var(--primary);color:#fff;font-size:.82rem;font-weight:600;line-height:1.45;padding:.65rem 1.3rem;border-radius:1.4rem;text-align:center;
       opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;z-index:80;box-shadow:0 6px 18px rgba(0,0,0,.25);word-break:keep-all;}
html[data-theme="dark"] #toast{background:#4a5446;}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

.noscript{padding:1rem;text-align:center;font-weight:700;}

/* ===== 반응형 ===== */
@media(min-width:600px){
  .wrap{padding-left:1.6rem;padding-right:1.6rem;}
  .site-bar{margin-left:-1.6rem;margin-right:-1.6rem;padding-left:1.6rem;padding-right:1.6rem;}
  .best-card{padding:1.8rem 1.8rem 1.6rem;}
}
@media(max-width:380px){
  .wrap{padding-left:.85rem;padding-right:.85rem;}
  .site-bar{margin-left:-.85rem;margin-right:-.85rem;padding-left:.85rem;padding-right:.85rem;}
  .topbar-left{gap:.35rem;}
  .topbar-right{gap:.55rem;}
  .btn-call{padding:.5rem .85rem;}
  .logo-word{font-size:1.42rem;}
  .best-city{font-size:1.5rem;}
  .price-big{font-size:1.9rem;}
  .cond-head{padding:.9rem 1.05rem;}
  .cond-body{padding:.2rem 1.05rem 1.2rem;}
  .best-card{padding:1.2rem 1.05rem 1.1rem;}
  .rank-item{padding:.75rem .8rem;gap:.6rem;}
  .region-body{padding:.2rem .6rem .9rem;}
  .dest-body{padding:.5rem .35rem .7rem;}
  .pat-row{gap:.45rem;}
  .pat-date{font-size:.8rem;letter-spacing:-.01em;}
  .pat-price{font-size:.8rem;}
  .open-btn{min-width:56px;padding:.45rem .65rem;font-size:.78rem;}
  .dots{gap:.3rem;}
  .dot{width:.5rem;height:.5rem;}
}
@media(hover:hover){
  .site-btn:hover,.btn:hover,.chip:hover{transform:translateY(-1px);}
  .rank-item:hover .rank-city,.dest-cell:hover .dc-city,.cmp-row:hover .cmp-name{color:var(--gold);}
}
@media(prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important;}
}