/*! ChewGumi Liquid Glass (mobile) v1 · MedIT */

/* ══ 모바일 하단 탭바 ══ */
@media (max-width:900px){
  .m-nav{
    left:12px !important; right:12px !important;
    bottom:calc(10px + env(safe-area-inset-bottom)) !important;
    padding:6px !important; border-radius:26px !important;
    border:1px solid rgba(255,255,255,.75) !important;
    background:linear-gradient(160deg,rgba(255,255,255,.72),rgba(255,255,255,.52)) !important;
    backdrop-filter:blur(28px) saturate(180%) !important;
    -webkit-backdrop-filter:blur(28px) saturate(180%) !important;
    box-shadow:0 12px 34px rgba(216,37,88,.16),0 2px 10px rgba(0,0,0,.06),
      inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(255,255,255,.4) !important;
    overflow:hidden;
  }
  .m-nav::before{content:"";position:absolute;left:10%;top:-42%;width:56%;height:74%;
    border-radius:50%;pointer-events:none;
    background:radial-gradient(ellipse at center,rgba(255,255,255,.85),rgba(255,255,255,0) 66%)}
  .m-nav a{position:relative;z-index:1;margin:0 !important;padding:9px 4px 8px !important;
    border-radius:20px !important;font-size:9.5px !important;letter-spacing:1.2px !important;
    color:#5a5257 !important;
    transition:transform .2s cubic-bezier(.2,.7,.3,1),background .2s,color .2s !important}
  .m-nav a span{font-size:19px !important;margin-bottom:3px !important;
    transition:transform .22s cubic-bezier(.2,.7,.3,1)}
  .m-nav a:active{transform:scale(.94)}
  .m-nav a:active span{transform:scale(1.08)}
  .m-nav a.on{color:#D82558 !important;
    background:linear-gradient(150deg,rgba(255,255,255,.95),rgba(255,228,230,.7)) !important;
    box-shadow:0 4px 14px rgba(216,37,88,.14),inset 0 1px 0 rgba(255,255,255,1) !important}

  /* ══ 상단 헤더 ══ */
  header{
    background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(255,255,255,.66)) !important;
    backdrop-filter:blur(26px) saturate(170%) !important;
    -webkit-backdrop-filter:blur(26px) saturate(170%) !important;
    border-bottom:1px solid rgba(255,255,255,.6) !important;
    box-shadow:0 1px 0 rgba(255,255,255,.7),0 6px 20px rgba(0,0,0,.045) !important}

  /* ══ 카드·패널 ══ */
  .panel,.card,.comm-card,.plan,.form,.perk,.stat,.rv-sec,.bankbox,.cardbox{
    border:1px solid rgba(255,255,255,.7) !important;
    background:linear-gradient(160deg,rgba(255,255,255,.74),rgba(255,255,255,.56)) !important;
    backdrop-filter:blur(20px) saturate(160%) !important;
    -webkit-backdrop-filter:blur(20px) saturate(160%) !important;
    box-shadow:0 10px 28px rgba(0,0,0,.07),
      inset 0 1px 0 rgba(255,255,255,.92) !important}

  /* ══ 떠 있는 버튼 ══ */
  .kko-fab,.cgbot-fab{
    border:1px solid rgba(255,255,255,.5) !important;
    box-shadow:0 10px 26px rgba(0,0,0,.18),
      inset 0 1px 0 rgba(255,255,255,.6) !important}

  /* ══ 입력 필드 ══ */
  input,select,textarea{
    border:1px solid rgba(255,255,255,.78) !important;
    background:rgba(255,255,255,.82) !important;
    backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
  input:focus,select:focus,textarea:focus{
    background:rgba(255,255,255,.96) !important;
    box-shadow:0 0 0 3px rgba(216,37,88,.1)}

  /* ══ 알약 버튼 ══ */
  .mini,.btn.ghost,.chips button,.tabs a,.sec-more{
    border:1px solid rgba(255,255,255,.8) !important;
    backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 2px 8px rgba(0,0,0,.05) !important}

  /* ══ 팝업·서랍 ══ */
  .popup,.cartp,.drawer,.detail,.kko-box,.cgbot-win{
    border:1px solid rgba(255,255,255,.72) !important;
    background:linear-gradient(165deg,rgba(255,255,255,.9),rgba(255,255,255,.78)) !important;
    backdrop-filter:blur(34px) saturate(180%) !important;
    -webkit-backdrop-filter:blur(34px) saturate(180%) !important;
    box-shadow:0 22px 54px rgba(0,0,0,.2),
      inset 0 1px 0 rgba(255,255,255,.95) !important}
}

/* 경량 모드 — 흐림 전부 해제 */
.lite .m-nav,.lite header,.lite .panel,.lite .card,.lite .comm-card,
.lite .plan,.lite .form,.lite .perk,.lite .stat,.lite .popup,
.lite .cartp,.lite .drawer,.lite .detail{
  background:rgba(255,255,255,.96) !important;
  backdrop-filter:none !important;-webkit-backdrop-filter:none !important}
.lite .m-nav::before{display:none}

/* 모션 최소화 설정 존중 */
@media (prefers-reduced-motion:reduce){
  .m-nav a,.m-nav a span{transition:none !important}
}