/* TARO-BUILD-22 — 인앱 브라우저 안내 배너
   Threads·인스타·카톡 등 인앱 브라우저에서 Google 로그인·결제가 막히므로
   앱 화면에만 짧은 안내를 띄운다. 블로그 글에는 이 파일을 싣지 않는다.
   레이아웃을 밀지 않도록 fixed 로 띄우고, 닫으면 3일 기억한다. */
.inapp-notice{
  position:fixed;top:0;left:0;right:0;z-index:80;
  display:flex;align-items:center;gap:10px;
  padding:calc(8px + env(safe-area-inset-top, 0px)) 12px 8px;
  background:linear-gradient(180deg,rgba(18,14,8,.98),rgba(14,11,7,.96));
  border-bottom:1px solid rgba(191,147,78,.45);
  box-shadow:0 10px 30px -18px rgba(0,0,0,.9);
  font-family:inherit;
}
.inapp-notice .inapp-text{
  flex:1 1 auto;margin:0;font-size:12px;line-height:1.45;color:#f2ead9;
}
.inapp-notice .inapp-open{
  flex:0 0 auto;padding:7px 12px;border-radius:999px;border:1px solid rgba(191,147,78,.6);
  background:rgba(191,147,78,.14);color:#f3ecdf;font-size:12px;font-weight:600;
  white-space:nowrap;cursor:pointer;
}
.inapp-notice .inapp-open:hover{background:rgba(191,147,78,.24)}
.inapp-notice .inapp-close{
  flex:0 0 auto;width:28px;height:28px;border:0;background:transparent;color:#b7ac9b;
  font-size:18px;line-height:1;cursor:pointer;padding:0;
}
.inapp-notice .inapp-close:hover{color:#f2ead9}
@media (max-width:400px){
  .inapp-notice{gap:8px;padding-left:10px;padding-right:8px}
  .inapp-notice .inapp-text{font-size:11.5px}
  .inapp-notice .inapp-open{padding:6px 10px;font-size:11.5px}
}