/* 다운로드 페이지 설치 안내 그림 (2026-09-25) · 2026-10-09 시안: .sgx(스마트 앱 컨트롤 칸·다운로드 안내 창)도 같은 모양
   크롬 경고·윈도우 파란 창(스마트스크린)을 손님 언어로 그려 누를 곳을 짚는다. 사이트 CSS 와 안 부딪히게 :is(#sg,.sgx) 아래만. */
#sg{margin-top:18px}
:is(#sg,.sgx) .sg-h{font-size:19px;font-weight:800;margin:0 0 6px}
:is(#sg,.sgx) .sg-sub{font-size:13.5px;color:var(--tx-2,#A8A9BA);line-height:1.65;margin:0 0 18px}
:is(#sg,.sgx) .sg-step{position:relative;margin:0 0 26px}
:is(#sg,.sgx) .sg-cap{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:700;margin-bottom:10px;line-height:1.4}
:is(#sg,.sgx) .sg-cap .n{flex:none;width:28px;height:28px;border-radius:50%;background:#E2A33D;color:#07070B;display:grid;place-items:center;font-size:14px;font-weight:800}
:is(#sg,.sgx) .sg-cap b{color:#ECC88E}
:is(#sg,.sgx) .sg-stage{position:relative;border-radius:12px;overflow:hidden;background:#15151c;padding:18px;display:flex;justify-content:center}
:is(#sg,.sgx) .sg-stage.low{padding-bottom:78px}

/* 크롬 다운로드 경고 (다크) */
:is(#sg,.sgx) .sg-cr{width:100%;max-width:470px;background:#28292c;border-radius:14px;padding:16px 18px 18px;color:#e3e3e3;font-family:'Segoe UI',system-ui,sans-serif;box-shadow:0 12px 40px rgba(0,0,0,.5)}
:is(#sg,.sgx) .sg-cr .t{display:flex;align-items:center;gap:12px;font-size:16px;font-weight:600;margin-bottom:12px}
:is(#sg,.sgx) .sg-cr .t i{font-style:normal;color:#aaa;font-size:18px}
:is(#sg,.sgx) .sg-cr .t span{flex:1}
:is(#sg,.sgx) .sg-cr .w{display:flex;gap:12px;font-size:13.5px;line-height:1.45;margin-bottom:6px}
:is(#sg,.sgx) .sg-cr .w em{font-style:normal;flex:none;width:20px;height:20px;display:grid;place-items:center;color:#ccc}
:is(#sg,.sgx) .sg-cr .lk{font-size:12.5px;color:#a8c7fa;text-decoration:underline;margin:0 0 14px 32px}
:is(#sg,.sgx) .sg-cr .bt{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
:is(#sg,.sgx) .sg-cr .bt span{border-radius:99px;padding:10px 18px;font-size:13.5px;font-weight:600}
:is(#sg,.sgx) .sg-cr .b1{background:#a8c7fa;color:#062e6f}
:is(#sg,.sgx) .sg-cr .b2{background:#0b57d0;color:#fff}

/* 윈도우 스마트스크린 (파란 창) */
:is(#sg,.sgx) .sg-ss{width:100%;max-width:400px;aspect-ratio:1.06/1;background:#0063B1;color:#fff;font-family:'Segoe UI','Pretendard',sans-serif;position:relative;padding:22px 22px 18px;box-shadow:0 12px 40px rgba(0,0,0,.5);display:flex;flex-direction:column}
:is(#sg,.sgx) .sg-ss .x{position:absolute;right:0;top:0;width:40px;height:32px;background:#fff;color:#333;display:grid;place-items:center;font-size:16px}
:is(#sg,.sgx) .sg-ss h3{font-size:clamp(20px,5vw,28px);font-weight:300;line-height:1.2;margin:4px 40px 14px 0;color:#fff}
:is(#sg,.sgx) .sg-ss p{font-size:clamp(11.5px,2.8vw,13.5px);line-height:1.5;opacity:.95;margin:0;color:#fff}
:is(#sg,.sgx) .sg-ss .more{margin-top:10px;font-size:clamp(11.5px,2.8vw,13.5px);text-decoration:underline;display:inline-block;position:relative}
:is(#sg,.sgx) .sg-ss .kv{display:grid;grid-template-columns:auto 1fr;gap:4px 18px;font-size:clamp(11.5px,2.8vw,13.5px);margin-top:12px}
:is(#sg,.sgx) .sg-ss .sp{flex:1}
:is(#sg,.sgx) .sg-ss .bt{display:flex;gap:12px;justify-content:flex-end}
:is(#sg,.sgx) .sg-ss .bt span{background:#fff;color:#000;font-weight:600;font-size:clamp(11.5px,2.8vw,14px);padding:9px 16px;min-width:96px;text-align:center}

/* 누를 곳 표시 */
:is(#sg,.sgx) .sg-hit{position:relative;z-index:2}
:is(#sg,.sgx) .sg-hit::before{content:"";position:absolute;inset:-8px -10px;border:3px solid #E2A33D;border-radius:10px;box-shadow:0 0 0 4px rgba(226,163,61,.25),0 0 24px rgba(226,163,61,.6);animation:sg-pulse 1.4s ease-in-out infinite}
@keyframes sg-pulse{50%{transform:scale(1.06);opacity:.55}}
:is(#sg,.sgx) .sg-cur{position:absolute;z-index:3;width:30px;height:30px;pointer-events:none;animation:sg-tap 1.4s ease-in-out infinite;filter:drop-shadow(0 2px 3px rgba(0,0,0,.6))}
@keyframes sg-tap{0%,100%{transform:translate(0,0)}50%{transform:translate(-4px,-4px) scale(.92)}}
:is(#sg,.sgx) .sg-arrow{position:absolute;z-index:3;pointer-events:none}
:is(#sg,.sgx) .sg-tag{position:absolute;z-index:4;background:#E2A33D;color:#07070B;font-weight:800;font-size:17px;width:32px;height:32px;display:grid;place-items:center;border-radius:50%;box-shadow:0 6px 18px rgba(0,0,0,.45)}

:is(#sg,.sgx) .sg-foot{margin-top:6px;padding:14px 16px;border-radius:12px;background:rgba(74,99,224,.08);border:1px solid rgba(110,134,242,.3);font-size:13.5px;line-height:1.7;color:var(--tx-2,#A8A9BA)}
:is(#sg,.sgx) .sg-foot b{color:var(--tx,#EEEEF3)}
@media (prefers-reduced-motion:reduce){.sgx *,:is(#sg,.sgx) *,.sgx *,:is(#sg,.sgx) *::before{animation:none!important}}