/* 운영 A 주황 하단 바 (a2/a2-static.css에서 빌드 때 복사) */
/* 하단 고정 바 (10/18 4차 벤치마킹 → 5차 주황 테마·남은 인원·왼쪽으로 흐르는 진행 바): 왼쪽 강조색 블록(긴급·한정) | 오른쪽 어두운 블록(라임 버튼) + 버튼 위 할인 말풍선.
   모바일은 한 줄(약 64px), PC는 같은 두 블록을 넓게. 본문 아래 여백도 바 높이에 맞춤. */
body.campaign-shell{padding-bottom:calc(84px + env(safe-area-inset-bottom))!important}
.campaign-shell .hook-bar.a2-bar{display:grid!important;grid-template-columns:1fr auto!important;gap:0!important;padding:0!important;align-items:stretch!important;background:#1b201e!important;border-top:0!important;overflow:visible!important;box-shadow:0 -8px 26px rgba(0,0,0,.28)!important}
.campaign-shell .a2-bar .a2-bar-left{display:flex;flex-direction:column;justify-content:center;gap:2px;padding:10px 12px calc(10px + env(safe-area-inset-bottom)) 16px;text-align:left!important;line-height:1.25!important}
.campaign-shell .a2-bar .a2-bar-left p{display:block!important;margin:0!important;color:#fff!important;font-size:12px!important;font-weight:800;letter-spacing:-.02em}
.campaign-shell .a2-bar .a2-bar-left p i{font-style:normal}
.campaign-shell .a2-bar .a2-bar-left strong{color:#fff!important;font-size:18px!important;font-weight:900;letter-spacing:-.04em}
.campaign-shell .a2-bar .a2-bar-left strong em{font-style:normal;margin-left:2px;padding:0 7px;border-radius:6px;background:#1b201e;color:#ffb347!important}
/* 주황 배경이 오른쪽에서 왼쪽으로 줄어듦(6차 → 7차: 현석님 "중간 말고 오른쪽 끝, '최저가로 시작' 버튼 상자 오른쪽 끝부터")
   주황 판을 바 전체 폭에 깔고, 바의 오른쪽 끝(버튼 상자 오른쪽 끝)에서 왼쪽으로 9초 동안 끝까지 줄어듦.
   8차(현석님 "끝까지 줄어들고, 다시 차는 움직임은 없애고, 끝나면 가득 찬 상태에서 다시 줄어들게"): 다 줄면 곧바로 가득 찬 상태로 돌아가 다시 줄어듦(차오르는 움직임 없음).
   바탕은 짙은 주황 갈색 — 흰 글자·흰 버튼은 두 색 모두에서 읽힘. 왼쪽·오른쪽 상자는 투명. */
.campaign-shell .hook-bar.a2-bar{isolation:isolate;background:#5a2208!important}
.campaign-shell .hook-bar.a2-bar::before{content:""!important;display:block!important;position:absolute;inset:0;z-index:-1;border-radius:inherit;background:linear-gradient(100deg,#ff8a00,#ff5e14);transform-origin:0 50%;animation:a2Drain 9s linear infinite;pointer-events:none}
.campaign-shell .hook-bar.a2-bar::after{content:none!important}
.campaign-shell .a2-bar .a2-bar-left,.campaign-shell .a2-bar .a2-bar-right{background:transparent!important}
@keyframes a2Drain{from{transform:scaleX(1)}to{transform:scaleX(0)}}
.campaign-shell .a2-bar .a2-bar-right{position:relative;display:flex;align-items:center;padding:9px 12px calc(9px + env(safe-area-inset-bottom))}
.campaign-shell .a2-bar .hook-cta{min-height:46px!important;width:auto!important;margin:0!important;padding:8px 16px!important;justify-content:center!important;border-radius:10px!important;background:#fff!important;color:#1b201e!important;box-shadow:none!important}
.campaign-shell .a2-bar .hook-cta i{color:#ff6a00}
.campaign-shell .a2-bar .hook-cta:hover{background:#fff4e8!important}
.campaign-shell .a2-bar .hook-cta-main{font-size:16px!important;font-weight:900!important;white-space:nowrap;letter-spacing:-.03em}
.campaign-shell .a2-bar .hook-cta i{font-size:16px!important;margin-left:6px!important}
.campaign-shell .a2-bar .a2-bar-bubble{position:absolute;right:10px;bottom:calc(100% - 6px);z-index:2;padding:5px 12px;border-radius:999px;background:#ff7a00;color:#fff;font-size:12px;font-weight:800;white-space:nowrap;box-shadow:0 6px 16px rgba(0,0,0,.25);letter-spacing:-.02em}
.campaign-shell .a2-bar .a2-bar-bubble b{color:#1b201e;font-weight:900}
.campaign-shell .a2-bar .a2-bar-bubble::after{content:"";position:absolute;right:30px;bottom:-4px;width:9px;height:9px;background:#ff7a00;transform:rotate(45deg)}
@media (min-width:700px){
  body.campaign-shell{padding-bottom:calc(96px + env(safe-area-inset-bottom))!important}
  .campaign-shell .hook-bar.a2-bar{grid-template-columns:1fr 300px!important;border-radius:12px 12px 0 0;overflow:visible!important}
  .campaign-shell .a2-bar .a2-bar-left{flex-direction:row;align-items:center;justify-content:flex-start;gap:24px;padding:16px 26px calc(16px + env(safe-area-inset-bottom));border-radius:12px 0 0 0}
  .campaign-shell .a2-bar .a2-bar-left p{font-size:16px!important}
  .campaign-shell .a2-bar .a2-bar-left strong{font-size:22px!important}
  .campaign-shell .a2-bar .a2-bar-right{justify-content:center;padding:14px 22px calc(14px + env(safe-area-inset-bottom));border-radius:0 12px 0 0}
  .campaign-shell .a2-bar .hook-cta{width:100%!important;min-height:50px!important}
  .campaign-shell .a2-bar .hook-cta-main{font-size:18px!important}
  .campaign-shell .a2-bar .a2-bar-bubble{right:24px;font-size:13px}
}
/* 말풍선 '80% 할인': 바탕만 2장 교대 0.35초 깜박 (부업꽁방 #062·#075 구조, 10/18 움직임 기획 권장안) — 꼬리도 같은 색 */
.campaign-shell .a2-bar .a2-bar-bubble{animation:a2BubbleBlink .7s step-end infinite}
.campaign-shell .a2-bar .a2-bar-bubble::after{background:inherit!important}
@keyframes a2BubbleBlink{0%{background-color:#ff7a00}50%{background-color:#ff3d00}}

/* 구매 버튼: 숨쉬기 없음, 은은한 빛 한 줄이 6초에 한 번 지나감 */
body .hook-cta{position:relative;overflow:hidden}
body .hook-cta::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:24%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg);animation:a2Shine 6s ease-in-out infinite;pointer-events:none}
@keyframes a2Shine{0%,82%{left:-40%}100%{left:130%}}
.hook-bar .hook-copy p.a2-warn{color:#ff8a6a;font-weight:800}