/* ============================================================================
   AI 안내방송 랜딩 — 앱 시연 구역(views/include/announce_app_demo.ejs) 전용 스타일
   · 구역: 시안 A안 "한 무대" — 왼쪽 글·기기 선택, 오른쪽 무대(기기 화면 + 자막 + 단계 막대). 안내데스크 히어로와 같은 문법.
   · 목업: 세 앱의 실제 색·배치 — 앱 브랜드색은 #3157FF(사이트 인디고 #4F37FF 가 아님), 앱 그라데이션은 앱 그대로.
   · 모든 선택자는 .ad 아래 — site.css 의 p·h2 전역 글꼴 규칙(p { font: … })을 .ad 안에서 먼저 되돌린다.
   · CSS 기본값 = 각 장의 "결과 장면"(동작 줄이기·스크립트 없음). 움직임은 announce-app-demo.js 가 Web Animations 로.
   · 무대 밖 장식 움직임 없음(2026-09-15 피드백) — 움직이는 것은 제품 시연 하나.
   파일을 고치면 preview_broadcast.ejs 의 ?v= 를 올린다(서비스워커가 CSS 를 영구 캐시한다).
   ============================================================================ */

.ad {
  --ad-ink: #181a1f;
  --ad-strong: rgba(0, 0, 0, 0.95);
  --ad-fg: #171719;
  --ad-sub: rgba(46, 47, 51, 0.88);
  --ad-muted: rgba(55, 56, 60, 0.74);
  --ad-line: rgba(112, 115, 124, 0.16);
  --ad-stagebg: #eceef2;
  --ad-brand: #4f37ff;
  --ad-font: var(--font-sans, "Pretendard Variable", "Pretendard", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", sans-serif);
  position: relative;
  padding: 112px 0 104px;
  background: #fff;
  color: var(--ad-fg);
  font-family: var(--ad-font);
  overflow: hidden;
}
html:lang(ko) .ad { word-break: keep-all; }
.ad p, .ad h2, .ad h3, .ad li { margin: 0; font: inherit; letter-spacing: inherit; color: inherit; }
.ad .ad-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.ad .ad-ic { display: inline-block; flex: none; width: 1em; height: 1em; fill: currentColor; vertical-align: -0.125em; overflow: visible; }
.ad .ad-flag { display: inline-block; flex: none; width: 21px; height: 14px; border-radius: 3px; overflow: hidden; box-shadow: 0 0 0 0.5px rgba(15, 23, 42, 0.2); vertical-align: middle; }
.ad .ad-flag svg { display: block; width: 100%; height: 100%; }
.ad .ad-flag.is-s { width: 18px; height: 12px; border-radius: 2.5px; }
.ad .ad-flag.is-r { width: 18px; height: 18px; border-radius: 50%; }

/* ── 구역 배치 ─────────────────────────────────────────────── */
.ad .ad-wrap { max-width: 1200px; margin: 0 auto; padding: 0 24px; display: grid; grid-template-columns: minmax(0, 440px) minmax(0, 1fr); gap: 64px; align-items: center; }
.ad .ad-copy { min-width: 0; }
.ad .ad-kick { display: flex; align-items: center; gap: 10px; font: 600 14px/1.4 var(--ad-font); color: var(--ad-muted); letter-spacing: -0.01em; }
.ad .ad-kick::before { content: ""; width: 26px; height: 1.5px; background: currentColor; }
.ad .ad-kick b { font-weight: 700; color: var(--ad-fg); font-feature-settings: "tnum"; }
.ad .ad-h2 { margin-top: 20px; font: 800 clamp(34px, 3.5vw, 48px)/1.2 var(--ad-font); letter-spacing: -0.045em; color: var(--ad-strong); }
.ad .ad-h2 > span { display: block; text-wrap: balance; }
.ad .ad-h2 .is-q { color: #a4a6ad; }
html:not(:lang(ko)) .ad .ad-h2 { font-size: clamp(30px, 3vw, 42px); letter-spacing: -0.03em; }
.ad .ad-lead { margin-top: 20px; font: 500 17px/1.72 var(--ad-font); color: var(--ad-sub); letter-spacing: -0.01em; text-wrap: pretty; }
.ad .ad-devsel { margin-top: 32px; display: inline-flex; gap: 2px; padding: 4px; border-radius: 14px; background: #f1f2f4; }
.ad .ad-devsel button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 44px; padding: 0 16px; border-radius: 10px; background: transparent; color: #4b4d55; font: 600 15px/1 var(--ad-font); letter-spacing: -0.01em; white-space: nowrap; transition: background-color 0.15s ease, color 0.15s ease; }
.ad .ad-devsel button .ad-ic { font-size: 19px; }
.ad .ad-devsel button:hover { color: var(--ad-ink); }
.ad .ad-devsel button.is-on { background: #fff; color: var(--ad-ink); box-shadow: 0 1px 3px rgba(15, 23, 42, 0.12), 0 0 0 0.5px rgba(15, 23, 42, 0.05); }
.ad .ad-devsel button:focus-visible, .ad .ad-step:focus-visible, .ad .ad-pause:focus-visible, .ad .ad-getlink:focus-visible { outline: 3px solid #b3a8ff; outline-offset: 2px; }
.ad .ad-devnote { margin-top: 10px; font: 500 13.5px/1.5 var(--ad-font); color: var(--ad-muted); }
.ad .ad-get { margin-top: 14px; min-height: 22px; }
.ad .ad-getlink { display: none; align-items: center; gap: 7px; padding: 0; background: none; border: 0; color: var(--ad-fg); font: 700 14.5px/1.4 var(--ad-font); text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1.5px; cursor: pointer; }
.ad .ad-getlink .ad-ic { font-size: 18px; }
.ad[data-dev="ios"] .ad-getlink[data-ad-for="ios"], .ad[data-dev="and"] .ad-getlink[data-ad-for="and"], .ad[data-dev="win"] .ad-getlink[data-ad-for="win"] { display: inline-flex; }
.ad .ad-cta { margin-top: 32px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; }
.ad a.ad-link { font: 700 15.5px/1 var(--ad-font); color: var(--ad-strong); text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 1.5px; }
.ad .ad-hint { display: none; }

/* ── 무대 ───────────────────────────────────────────────────── */
.ad .ad-stage { position: relative; height: 780px; border-radius: 28px; background: var(--ad-stagebg); overflow: hidden; touch-action: pan-y; --k-ios: 0.62; --k-and: 0.575; --k-win: 0.47; }
.ad .ad-devs { position: absolute; left: 0; right: 0; top: 30px; display: flex; justify-content: center; }
.ad .ad-dev { position: relative; display: none; flex: none; }
.ad[data-dev="ios"] .ad-dev.is-ios, .ad[data-dev="and"] .ad-dev.is-and, .ad[data-dev="win"] .ad-dev.is-win { display: block; }
.ad .ad-dev.is-ios { width: calc(414px * var(--k-ios)); height: calc(868px * var(--k-ios)); }
.ad .ad-dev.is-and { width: calc(436px * var(--k-and)); height: calc(939px * var(--k-and)); }
.ad .ad-dev.is-win { width: calc(1280px * var(--k-win)); height: calc(832px * var(--k-win)); margin-top: 64px; }
.ad .ad-frame { position: absolute; left: 0; top: 0; transform-origin: 0 0; }
.ad .ad-dev.is-ios .ad-frame { transform: scale(var(--k-ios)); }
.ad .ad-dev.is-and .ad-frame { transform: scale(var(--k-and)); }
.ad .ad-dev.is-win .ad-frame { transform: scale(var(--k-win)); }
.ad .ad-dev.is-ios .ad-bez { position: relative; width: 414px; height: 868px; padding: 12px; border-radius: 68px; background: #16171b; box-shadow: inset 0 0 0 1.5px #4a4b50, inset 0 0 0 4px #0b0c0f, 0 60px 100px -48px rgba(15, 23, 42, 0.5), 0 20px 40px -18px rgba(15, 23, 42, 0.22); }
.ad .ad-dev.is-ios .ad-bez::before { content: ""; position: absolute; left: -3px; top: 176px; width: 3px; height: 32px; border-radius: 2px 0 0 2px; background: #2b2c31; box-shadow: 0 58px 0 0 #2b2c31, 0 126px 0 0 #2b2c31; }
.ad .ad-dev.is-ios .ad-bez::after { content: ""; position: absolute; right: -3px; top: 262px; width: 3px; height: 104px; border-radius: 0 2px 2px 0; background: #2b2c31; }
.ad .ad-dev.is-and .ad-bez { position: relative; width: 436px; height: 939px; padding: 12px; border-radius: 50px; background: #1d1e22; box-shadow: inset 0 0 0 1.5px #45464b, inset 0 0 0 4px #0c0d10, 0 60px 100px -48px rgba(15, 23, 42, 0.5), 0 20px 40px -18px rgba(15, 23, 42, 0.22); }
.ad .ad-dev.is-and .ad-bez::after { content: ""; position: absolute; right: -3px; top: 200px; width: 3px; height: 70px; border-radius: 0 2px 2px 0; background: #2b2c31; box-shadow: 0 96px 0 0 #2b2c31; }
.ad .ad-dev.is-win .ad-bez { position: relative; width: 1280px; height: 832px; border-radius: 12px; overflow: hidden; background: #f4f4f4; box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.16), 0 60px 120px -50px rgba(15, 23, 42, 0.5), 0 20px 40px -20px rgba(15, 23, 42, 0.2); }
.ad .ad-scr { position: relative; overflow: hidden; }
.ad .mi-scr { width: 390px; height: 844px; border-radius: 56px; background: #000; }
.ad .ma-scr { width: 412px; height: 915px; border-radius: 38px; background: #EEF1F5; }
.ad .mw-scr { width: 1280px; height: 800px; background: #f4f4f4; }
.ad .ad-ch { position: absolute; inset: 0; display: none; }
.ad .ad-stage[data-ch="1"] .ad-ch[data-ch="1"], .ad .ad-stage[data-ch="2"] .ad-ch[data-ch="2"], .ad .ad-stage[data-ch="3"] .ad-ch[data-ch="3"], .ad .ad-stage[data-ch="4"] .ad-ch[data-ch="4"] { display: block; }
.ad .ad-l { position: absolute; inset: 0; opacity: 0; }
.ad .ad-l.is-res { opacity: 1; }
.ad .ad-tap { position: absolute; left: 50%; top: 50%; z-index: 30; width: 50px; height: 50px; margin: -25px 0 0 -25px; border-radius: 50%; background: rgba(60, 60, 67, 0.28); box-shadow: 0 0 0 2.5px rgba(255, 255, 255, 0.95), 0 2px 10px rgba(0, 0, 0, 0.22); opacity: 0; pointer-events: none; }
.ad .ad-dev.is-win .ad-tap { width: 60px; height: 60px; margin: -30px 0 0 -30px; }
.ad .ad-stage.is-paused *, .ad .ad-stage.is-paused *::before, .ad .ad-stage.is-paused *::after { animation-play-state: paused !important; }

/* 자막 — 안내데스크 히어로 자막과 같은 문법(어두운 반투명 띠 + 말한 쪽 이름) */
.ad .ad-subs { position: absolute; left: 24px; right: 24px; bottom: 98px; height: 0; }
.ad .ad-cue { position: absolute; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; align-items: center; gap: 6px; opacity: 0; }
.ad .ad-sub { max-width: 100%; padding: 7px 14px; border-radius: 7px; background: rgba(12, 13, 17, 0.84); color: #fff; font: 600 17px/1.5 var(--ad-font); letter-spacing: -0.015em; text-align: center; text-wrap: balance; }
.ad .ad-sub b { margin-right: 10px; font-weight: 800; color: #b7adff; }
.ad .ad-sub.is-in { font-size: 14.5px; color: #e4e6ea; }
.ad .ad-sub.is-in b { color: #aeb2ba; }
.ad .ad-stage[data-ch="1"] [data-cue="1b"], .ad .ad-stage[data-ch="2"] [data-cue="2b"], .ad .ad-stage[data-ch="3"] [data-cue="3a"], .ad .ad-stage[data-ch="4"] [data-cue="4c"] { opacity: 1; }

/* 단계 막대 = 탭 */
.ad .ad-steps { position: absolute; left: 24px; right: 24px; bottom: 24px; height: 54px; display: flex; align-items: center; gap: 4px; padding: 0 8px; border-radius: 27px; background: rgba(12, 13, 17, 0.82); }
.ad .ad-step { position: relative; flex: 1; min-width: 0; height: 44px; display: flex; align-items: center; justify-content: center; gap: 7px; border-radius: 22px; background: transparent; color: rgba(255, 255, 255, 0.5); font: 700 14px/1 var(--ad-font); letter-spacing: -0.01em; white-space: nowrap; cursor: pointer; }
.ad .ad-step:hover { color: rgba(255, 255, 255, 0.85); }
.ad .ad-step em { flex: none; display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: rgba(255, 255, 255, 0.14); font-style: normal; font-size: 11.5px; font-feature-settings: "tnum"; }
.ad .ad-step .l, .ad .ad-step .s { overflow: hidden; text-overflow: ellipsis; }
.ad .ad-step .s { display: none; }
.ad .ad-step i { position: absolute; left: 16px; right: 16px; bottom: 5px; height: 2px; border-radius: 1px; background: rgba(255, 255, 255, 0.18); overflow: hidden; }
.ad .ad-step i b { position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: #fff; }
.ad .ad-step.is-done { color: rgba(255, 255, 255, 0.72); }
.ad .ad-step.is-done i b { width: 100%; background: rgba(255, 255, 255, 0.55); }
.ad .ad-step.is-on { color: #fff; }
.ad .ad-step.is-on em { background: #fff; color: #0c0d11; }
.ad .ad-time { flex: none; padding: 0 6px 0 8px; font: 700 12.5px/1 var(--ad-font); color: rgba(255, 255, 255, 0.7); font-feature-settings: "tnum"; white-space: nowrap; }
.ad .ad-pause { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: rgba(255, 255, 255, 0.14); color: #fff; cursor: pointer; }
.ad .ad-pause .ad-ic { font-size: 20px; }
.ad .ad-pause .is-play, .ad .ad-pause.is-paused .is-pause { display: none; }
.ad .ad-pause.is-paused .is-play { display: inline-block; }
.ad:not(.is-js) .ad-time, .ad:not(.is-js) .ad-pause, .ad.is-static .ad-time, .ad.is-static .ad-pause { display: none; }

/* ── iPhone(iOS 26 모양) ───────────────────────────────────── */
.ad .mi { --a-brand: #3157FF; --a-line: #E2E8F0; --a-text: #0F172A; --a-muted: #64748B; --a-grad: linear-gradient(135deg, #8B5CF6 0%, #6366F1 55%, #3B82F6 100%); --a-hero: linear-gradient(135deg, #4F46E5, #6366F1);
  overflow: hidden; background: #EEF1F5; color: var(--a-text); font: 400 17px/1.32 var(--ad-font); letter-spacing: -0.02em; }
.ad .mi.has-sheet { background: #000; }
.ad .mi-di { position: absolute; z-index: 40; top: 11px; left: 50%; width: 124px; height: 36px; margin-left: -62px; border-radius: 18px; background: #000; }
.ad .mi-hi-bar { position: absolute; z-index: 40; left: 50%; bottom: 8px; width: 138px; height: 5px; margin-left: -69px; border-radius: 3px; background: #0b0b0f; }
.ad .mi-sb { position: absolute; z-index: 30; left: 0; right: 0; top: 0; height: 54px; display: flex; align-items: center; justify-content: space-between; padding: 4px 30px 0 54px; color: #000; }
.ad .mi-sb.is-light { color: #fff; }
.ad .mi-sb-t { display: inline-grid; font-weight: 600; font-size: 17px; font-feature-settings: "tnum"; }
.ad .mi-sb-t > span { grid-area: 1 / 1; }
.ad .mi-sb-t > [data-a="t49"], .ad .ma-sb-t > [data-a="t49"] { opacity: 0; }
.ad .mi-sb-r { display: flex; align-items: center; gap: 6px; }
.ad .mi-sbi { fill: currentColor; height: 12px; }
.ad .mi-sbi.is-sig { width: 18px; }
.ad .mi-sbi.is-wifi { width: 16px; }
.ad .mi-sbi.is-bat { width: 27px; height: 13px; }
.ad .mi-nav { position: absolute; z-index: 5; left: 0; right: 0; top: 54px; height: 52px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 16px; }
.ad .mi-nav > :first-child { justify-self: start; }
.ad .mi-nav > :last-child { justify-self: end; }
.ad .mi-navt { font-size: 17px; font-weight: 600; }
.ad .mi-nav.is-logo { display: flex; justify-content: center; }
.ad .mi-nav.is-logo img { height: 17px; width: auto; }
.ad .mi-gb { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 16px; height: 44px; min-width: 44px; padding: 0 16px; border-radius: 22px; background: rgba(255, 255, 255, 0.88); box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 6px 16px rgba(15, 23, 42, 0.06), inset 0 0 0 0.5px rgba(15, 23, 42, 0.06); font-size: 17px; font-weight: 500; white-space: nowrap; }
.ad .mi-gb .ad-ic { font-size: 22px; }
.ad .mi-gb.is-c { width: 44px; padding: 0; }
.ad .mi-gb.is-pri { background: var(--a-brand); color: #fff; font-weight: 600; }
.ad .mi-body { position: absolute; left: 0; right: 0; top: 106px; bottom: 0; overflow: hidden; padding: 0 16px; }
.ad .mi-search { display: flex; align-items: center; gap: 6px; height: 38px; padding: 0 10px; border-radius: 12px; background: rgba(118, 118, 128, 0.12); color: #8a8f99; font-size: 17px; white-space: nowrap; overflow: hidden; }
.ad .mi-search .ad-ic { font-size: 20px; }
.ad .mi-search.is-sheet { margin-bottom: 14px; }
.ad .mi-chips { display: flex; gap: 8px; margin-top: 12px; overflow: hidden; white-space: nowrap; }
.ad .mi-chips.is-wrap { flex-wrap: wrap; white-space: normal; }
.ad .mi-chip { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px; border-radius: 17px; background: #fff; box-shadow: inset 0 0 0 1px var(--a-line); font-size: 15px; font-weight: 500; white-space: nowrap; }
.ad .mi-chip.is-on { background: var(--a-grad); box-shadow: none; color: #fff; font-weight: 600; }
.ad .mi-chips.is-s .mi-chip { height: 32px; padding: 0 11px; font-size: 14px; gap: 5px; }
.ad .mi-fh { margin: 22px 4px 8px; font-size: 13px; font-weight: 500; color: #6b7280; }
.ad .mi-card { position: relative; background: #fff; border-radius: 18px; overflow: hidden; }
.ad .mi-card + .mi-card { margin-top: 12px; }
.ad .mi-row { position: relative; display: flex; align-items: center; gap: 12px; padding: 12px 14px 12px 16px; }
.ad .mi-row + .mi-row::before, .ad .mi-frow + .mi-frow::before, .ad .mi-fwheel + .mi-frow::before, .ad .mi-sr + .mi-sr::before { content: ""; position: absolute; left: 16px; right: 0; top: 0; height: 0.5px; background: rgba(60, 60, 67, 0.2); }
.ad .mi-row.is-new { background: rgba(49, 87, 255, 0.06); }
.ad .mi-rowm { flex: 1; min-width: 0; }
.ad .mi-rt { display: flex; align-items: center; gap: 6px; font-size: 17px; font-weight: 600; white-space: nowrap; }
.ad .mi-rt b { overflow: hidden; text-overflow: ellipsis; }
.ad .mi-pin { font-size: 15px; color: var(--a-brand); transform: rotate(30deg); }
.ad .mi-flags { display: inline-flex; align-items: center; gap: 2px; margin-left: 2px; }
.ad .mi-flags i { margin-left: 2px; font-style: normal; font-size: 11px; font-weight: 700; color: var(--a-muted); }
.ad .mi-rs { margin-top: 3px; font-size: 13px; line-height: 1.38; color: var(--a-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ad .mi-play { font-size: 30px; color: var(--a-brand); }
.ad .mi-tab { position: absolute; z-index: 14; left: 22px; right: 22px; bottom: 26px; height: 62px; border-radius: 31px; display: flex; align-items: center; padding: 0 5px; background: rgba(255, 255, 255, 0.92); box-shadow: 0 10px 30px rgba(15, 23, 42, 0.14), 0 1px 2px rgba(15, 23, 42, 0.08); }
.ad .mi-ti { flex: 1; min-width: 0; height: 52px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; border-radius: 26px; color: #1f2937; }
.ad .mi-ti .ad-ic { font-size: 24px; }
.ad .mi-ti b { max-width: 100%; font-size: 10px; font-weight: 600; letter-spacing: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad .mi-ti.is-on { color: var(--a-brand); background: rgba(15, 23, 42, 0.06); }
.ad .mi-scrim { position: absolute; z-index: 10; inset: 0; background: rgba(0, 0, 0, 0.18); opacity: 0; }
.ad .mi-fabmenu { position: absolute; z-index: 12; right: 16px; bottom: 172px; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.ad .mi-fabopt { position: relative; display: flex; align-items: center; gap: 10px; padding: 8px 18px 8px 8px; border-radius: 28px; background: #fff; box-shadow: 0 4px 14px rgba(15, 23, 42, 0.16); opacity: 0; }
.ad .mi-fabopt i { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: var(--a-brand); color: #fff; }
.ad .mi-fabopt i .ad-ic { font-size: 20px; }
.ad .mi-fabopt b { display: block; font-size: 15px; font-weight: 600; }
.ad .mi-fabopt small { display: block; font-size: 12px; color: var(--a-muted); }
.ad .mi-fab { position: absolute; z-index: 12; right: 16px; bottom: 108px; display: inline-flex; align-items: center; gap: 6px; height: 52px; padding: 0 20px 0 16px; border-radius: 26px; background: var(--a-grad); color: #fff; font-size: 16px; font-weight: 600; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2); white-space: nowrap; }
.ad .mi-fabplus { display: inline-grid; place-items: center; }
.ad .mi-fabplus .ad-ic { font-size: 24px; }
.ad .mi-fablab { display: inline-grid; }
.ad .mi-fablab > b { grid-area: 1 / 1; font-weight: 600; }
.ad .mi-fablab > b.is-close { opacity: 0; }
.ad .mi-under { position: absolute; inset: 0; overflow: hidden; background: #EEF1F5; border-radius: 44px; transform: translateY(14px) scale(0.93); transform-origin: 50% 0; }
.ad .mi-under::after { content: ""; position: absolute; inset: 0; z-index: 50; background: rgba(0, 0, 0, 0.3); }
.ad .mi-under .mi-sb { display: none; }
.ad .mi-sheet { position: absolute; z-index: 20; left: 0; right: 0; top: 62px; bottom: 0; background: #F2F3F7; border-radius: 38px 38px 0 0; overflow: hidden; }
.ad .mi-shnav { height: 66px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 8px 16px 0; }
.ad .mi-shnav > :first-child { justify-self: start; }
.ad .mi-shnav > :last-child { justify-self: end; }
.ad .mi-sht { font-size: 17px; font-weight: 600; white-space: nowrap; }
.ad .mi-shbody { padding: 10px 20px 140px; }
.ad .mi-shbody.is-form { padding: 6px 16px 140px; }
.ad .mi-shfoot { position: absolute; left: 0; right: 0; bottom: 0; padding: 12px 20px 34px; background: #F2F3F7; }
.ad .mi-shfoot.is-bar { background: rgba(248, 249, 251, 0.97); box-shadow: 0 -0.5px 0 rgba(60, 60, 67, 0.2); padding-top: 14px; }
.ad .mi-mainbtn { position: relative; }
.ad .mi-mainbtn > * + * { position: absolute; inset: 0; }
.ad .mi-btng { position: relative; display: flex; align-items: center; justify-content: center; gap: 8px; height: 54px; border-radius: 14px; background: var(--a-grad); color: #fff; font-size: 17px; font-weight: 600; white-space: nowrap; }
.ad .mi-btng .ad-ic { font-size: 20px; }
.ad .mi-btng.is-busy { background: linear-gradient(135deg, #a78bfa 0%, #818cf8 55%, #60a5fa 100%); opacity: 0; }
.ad .mi-btnstop { display: flex; align-items: center; justify-content: center; gap: 8px; height: 54px; border-radius: 14px; background: #EF4444; color: #fff; font-size: 17px; font-weight: 600; }
.ad .mi-btnstop .ad-ic { font-size: 20px; }
.ad .mi-mainbtn.is-play [data-a="btnAir"] { opacity: 0; }
.ad .mi-md2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; margin-top: 10px; }
.ad .mi-btn2 { position: relative; display: flex; align-items: center; justify-content: center; gap: 6px; height: 46px; padding: 0 8px; border-radius: 12px; background: rgba(49, 87, 255, 0.09); color: var(--a-brand); font-size: 16px; font-weight: 600; white-space: nowrap; overflow: visible; }
.ad .mi-btn2 .ad-ic { font-size: 19px; }
.ad .mi-btn2.is-full { margin-top: 12px; }
.ad .mi-spin, .ad .ma-spin, .ad .mw-spin { display: inline-block; flex: none; width: 18px; height: 18px; border-radius: 50%; border: 2.5px solid rgba(255, 255, 255, 0.4); border-top-color: #fff; animation: ad-spin 0.8s linear infinite; }
.ad .mi-spin.is-s { width: 13px; height: 13px; border-width: 2px; border-color: rgba(100, 116, 139, 0.35); border-top-color: #64748B; }
@keyframes ad-spin { to { transform: rotate(360deg); } }
.ad .mi-caret, .ad .ma-caret, .ad .mw-caret { display: inline-block; width: 2px; height: 1.1em; margin-left: 1px; vertical-align: -0.18em; background: #3157FF; border-radius: 1px; animation: ad-blink 1s steps(1) infinite; }
@keyframes ad-blink { 50% { opacity: 0; } }
.ad .mi-aihead, .ad .ma-aihead { display: flex; gap: 12px; align-items: center; }
.ad .mi-aitile, .ad .ma-aitile { display: grid; place-items: center; flex: none; width: 44px; height: 44px; border-radius: 13px; background: linear-gradient(135deg, #8B5CF6 0%, #6366F1 55%, #3B82F6 100%); color: #fff; }
.ad .mi-aitile .ad-ic, .ad .ma-aitile .ad-ic { font-size: 24px; }
.ad .mi-aihead b, .ad .ma-aihead b { font-size: 18px; font-weight: 700; }
.ad .mi-aihead p, .ad .ma-aihead p { margin-top: 2px; font-size: 13px; line-height: 1.4; color: #64748B; }
.ad .mi-flab { margin: 22px 0 8px; font-size: 15px; font-weight: 600; }
.ad .mi-aifield { min-height: 110px; padding: 14px; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1.5px var(--a-brand); }
.ad .mi-aityped { font-size: 17px; line-height: 1.45; }
.ad .mi-flyer { display: flex; align-items: center; gap: 10px; margin-top: 14px; padding: 12px 14px; border-radius: 16px; background: #fff; }
.ad .mi-flyer > .ad-ic:first-child { font-size: 22px; color: var(--a-brand); }
.ad .mi-flyer > span { flex: 1; min-width: 0; }
.ad .mi-flyer b { display: block; font-size: 15px; font-weight: 600; }
.ad .mi-flyer small { display: block; margin-top: 1px; font-size: 12px; color: var(--a-muted); }
.ad .mi-chev { font-size: 20px; color: #c4c7cc; margin-right: -6px; }
.ad .mi-frow { position: relative; display: flex; align-items: center; gap: 10px; min-height: 50px; padding: 0 16px; }
.ad .mi-fl { flex: 1; min-width: 0; font-size: 17px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad .mi-fv { color: #8a8f99; font-size: 17px; white-space: nowrap; }
.ad .mi-fv.is-ink { color: var(--a-text); }
.ad .mi-frow.is-link .mi-fl { color: var(--a-brand); font-weight: 600; }
.ad .mi-fai { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: var(--a-grad); color: #fff; }
.ad .mi-fai .ad-ic { font-size: 18px; }
.ad .mi-ftext { min-height: 118px; padding: 14px 16px; font-size: 17px; line-height: 1.5; }
.ad .mi-fst { color: var(--a-muted); }
.ad .mi-ffoot { margin: 8px 4px 0; display: flex; align-items: center; gap: 6px; font-size: 13px; color: #6b7280; }
.ad .mi-ffoot.is-prog { position: relative; display: grid; }
.ad .mi-ffoot.is-prog > span { grid-area: 1 / 1; display: inline-flex; align-items: center; gap: 6px; }
.ad .mi-ffoot.is-prog > span[data-a^="p"] { opacity: 0; }
.ad .mi-stepper { display: inline-flex; height: 32px; border-radius: 16px; background: rgba(118, 118, 128, 0.12); }
.ad .mi-stepper i { width: 44px; display: grid; place-items: center; font-style: normal; font-size: 20px; }
.ad .mi-stepper i + i { border-left: 0.5px solid rgba(60, 60, 67, 0.3); }
.ad .mi-sw { position: relative; flex: none; width: 51px; height: 31px; border-radius: 16px; background: rgba(120, 120, 128, 0.16); }
.ad .mi-sw::after { content: ""; position: absolute; top: 2px; left: 2px; width: 27px; height: 27px; border-radius: 50%; background: #fff; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15), 0 1px 1px rgba(0, 0, 0, 0.16); }
.ad .mi-sw.is-on { background: #34C759; }
.ad .mi-sw.is-on::after { left: 22px; }
.ad .mi-pick { position: relative; display: inline-grid; height: 34px; padding: 0 12px; align-items: center; border-radius: 8px; background: rgba(118, 118, 128, 0.12); font-size: 17px; white-space: nowrap; }
.ad .mi-pick > span { grid-area: 1 / 1; }
.ad .mi-pick > [data-a="pick0"] { opacity: 0; }
.ad .mi-pick > [data-a="pick1"] { color: var(--a-brand); }
.ad .mi-frow > .ad-tap { left: auto; right: 44px; }
.ad .mi-seg { display: flex; padding: 2px; margin: 4px 0 16px; border-radius: 18px; background: rgba(118, 118, 128, 0.12); }
.ad .mi-seg span { flex: 1; min-width: 0; height: 32px; display: grid; place-items: center; border-radius: 16px; font-size: 15px; font-weight: 500; white-space: nowrap; overflow: hidden; }
.ad .mi-seg span.is-on { background: #fff; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12), 0 0 0 0.5px rgba(0, 0, 0, 0.04); font-weight: 600; }
.ad .mi-fwheel { position: relative; max-height: 0; overflow: hidden; padding: 0 16px; }
.ad .mi-wheel { position: relative; display: flex; justify-content: center; gap: 22px; height: 176px; padding: 3px 0; align-items: center; overflow: hidden; }
.ad .mi-whband { position: absolute; left: 0; right: 0; top: 50%; height: 34px; margin-top: -17px; border-radius: 9px; background: rgba(118, 118, 128, 0.12); }
.ad .mi-whcol { position: relative; display: flex; flex-direction: column; align-items: center; width: 64px; }
.ad .mi-whcol i { display: block; height: 34px; line-height: 34px; font-style: normal; font-size: 17px; color: #9ca3af; opacity: 0.55; white-space: nowrap; }
.ad .mi-whcol i.is-sel { color: #000; font-size: 22px; opacity: 1; }
/* 요일 칩 — 앱 weekdayChips: 선택 전 surfaceHigh(#F1F5F9)+textPrimary, 선택 brandGradient+흰 글씨, 모서리 9, 간격 6, callout 굵게 */
.ad .mi-card.is-days { padding: 9px 14px; overflow: visible; }
.ad .mi-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.ad .mi-day { position: relative; height: 40px; display: grid; place-items: center; border-radius: 9px; background: #F1F5F9; color: var(--a-text); font-size: 16px; font-weight: 600; white-space: nowrap; }
.ad .mi-day.is-on, .ad .mi-dayon { background: var(--a-grad); color: #fff; }
.ad .mi-dayon { position: absolute; inset: 0; display: grid; place-items: center; border-radius: 9px; }
.ad .mi-sr { position: relative; display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 0 14px; }
.ad .mi-sr > b { font-size: 17px; font-weight: 700; font-feature-settings: "tnum"; }
.ad .mi-sr > b.br { color: var(--a-brand); }
.ad .mi-sr .t { flex: 1; min-width: 0; font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad .mi-sr.is-past { opacity: 0.5; }
.ad .mi-sr.is-past > b, .ad .mi-sr.is-past .t { text-decoration: line-through; }
.ad .mi-sr.is-next { background: rgba(49, 87, 255, 0.07); }
.ad .mi-tp { flex: none; display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 11px; font-size: 11.5px; font-weight: 700; white-space: nowrap; }
.ad .mi-tp.is-loop { background: #E6E7FE; color: #1E1B4B; }
.ad .mi-tp.is-once { background: #F1F5F9; color: #475569; }
.ad .mi-tp.is-week { background: #FEF3C7; color: #78350F; }
.ad .mi-nx, .ad .mi-ok { flex: none; display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 11px; background: #DCFCE7; color: #14532D; font-size: 11.5px; font-weight: 700; white-space: nowrap; }
.ad .mi-seg.is-top { margin-top: 4px; }
.ad .mi-sc { padding: 14px 16px; }
.ad .mi-sc b { font-size: 17px; font-weight: 600; }
.ad .mi-sc p { margin-top: 4px; font-size: 14px; color: var(--a-muted); }
.ad .mi-sc p.nx { color: var(--a-brand); font-weight: 600; }
.ad .mi-toast { position: absolute; z-index: 16; left: 0; right: 0; bottom: 176px; width: max-content; max-width: 330px; margin: 0 auto; display: flex; align-items: center; gap: 6px; height: 44px; padding: 0 18px; border-radius: 22px; background: var(--a-brand); color: #fff; font-size: 15px; font-weight: 600; white-space: nowrap; box-shadow: 0 8px 20px rgba(49, 87, 255, 0.3); opacity: 0; }
.ad .mi-toast .ad-ic { font-size: 18px; }
.ad .mi-greet { display: flex; justify-content: space-between; align-items: flex-start; margin-top: 4px; }
.ad .mi-hi { display: flex; align-items: center; gap: 4px; font-size: 15px; color: var(--a-muted); }
.ad .mi-wave { color: #f59e0b; font-size: 18px; }
.ad .mi-name { display: block; margin-top: 2px; font-size: 28px; font-weight: 700; letter-spacing: -0.03em; }
.ad .mi-role, .ad .ma-role { display: inline-flex; align-items: center; gap: 5px; margin-top: 8px; height: 24px; padding: 0 9px; border-radius: 12px; background: #DCFCE7; color: #14532D; font-size: 12px; font-weight: 600; white-space: nowrap; }
.ad .mi-role i, .ad .ma-role i { width: 6px; height: 6px; border-radius: 50%; background: #16A34A; }
.ad .mi-ill { width: 76px; height: 76px; object-fit: contain; }
.ad .mi-heros { position: relative; height: 204px; margin-top: 14px; }
.ad .mi-hero { position: absolute; inset: 0; display: flex; flex-direction: column; padding: 18px; border-radius: 16px; background: var(--a-hero); color: #fff; }
.ad .mi-hero[data-a="hNext"], .ad .mi-hero[data-a="hTmr"] { opacity: 0; }
.ad .mi-herok { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; opacity: 0.92; }
.ad .mi-herok .ad-ic { font-size: 18px; }
.ad .mi-herok .dot { width: 8px; height: 8px; border-radius: 50%; background: #fff; animation: ad-pulse 1.1s ease-in-out infinite; }
@keyframes ad-pulse { 0%, 100% { box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.28); } 50% { box-shadow: 0 0 0 8px rgba(255, 255, 255, 0); } }
.ad .mi-heroc { display: inline-grid; margin-top: 6px; font-size: 30px; font-weight: 800; letter-spacing: -0.02em; font-feature-settings: "tnum"; }
.ad .mi-heroc > span { grid-area: 1 / 1; }
.ad .mi-heroc > [data-a="c2"], .ad .mi-heroc > [data-a="c1"] { opacity: 0; }
.ad .mi-herot { display: block; margin-top: 4px; font-size: 18px; font-weight: 700; }
.ad .mi-hero.is-live .mi-herot { margin-top: 10px; font-size: 22px; }
.ad .mi-heros-s { margin-top: 2px; font-size: 13px; opacity: 0.82; }
.ad .mi-herobtn { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: auto; height: 44px; border-radius: 12px; background: #fff; color: #4F46E5; font-size: 16px; font-weight: 700; white-space: nowrap; }
.ad .mi-herobtn .ad-ic { font-size: 19px; }
.ad .mi-herobtn.is-stop { color: #EF4444; }
.ad .mi-hh { margin: 22px 2px 10px; font-size: 20px; font-weight: 700; }
.ad .mi-qk { display: flex; gap: 10px; overflow: hidden; }
.ad .mi-qc { flex: none; width: 132px; height: 124px; padding: 12px; border-radius: 14px; background: #fff; display: flex; flex-direction: column; justify-content: space-between; }
.ad .mi-qc img { width: 42px; height: 42px; object-fit: contain; }
.ad .mi-qc b { font-size: 15px; font-weight: 600; line-height: 1.3; }
.ad .mi-cards2 { position: relative; height: 120px; }
.ad .mi-c2 { position: absolute; left: 0; right: 0; top: 0; }
.ad .mi-c2[data-a="recent"] { opacity: 0; }
.ad .mi-live { position: absolute; z-index: 15; left: 16px; right: 16px; bottom: 100px; height: 58px; display: flex; align-items: center; gap: 12px; padding: 0 10px 0 18px; border-radius: 14px; background: var(--a-hero); color: #fff; box-shadow: 0 10px 24px rgba(79, 70, 229, 0.35); }
.ad .mi-live .dot { flex: none; width: 9px; height: 9px; border-radius: 50%; background: #fff; animation: ad-pulse 1.1s ease-in-out infinite; }
.ad .mi-live > span:not(.mi-lbstop) { flex: 1; min-width: 0; }
.ad .mi-live b { display: block; font-size: 15px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad .mi-live small { display: block; font-size: 12px; opacity: 0.85; }
.ad .mi-lbstop { flex: none; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: #fff; color: #4F46E5; }
.ad .mi-lbstop .ad-ic { font-size: 18px; }
.ad .mi-mdt { font-size: 22px; font-weight: 700; letter-spacing: -0.03em; }
.ad .mi-pills { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.ad .mi-pill { display: inline-flex; align-items: center; gap: 4px; height: 26px; padding: 0 10px; border-radius: 13px; background: #fff; box-shadow: inset 0 0 0 1px var(--a-line); font-size: 12px; font-weight: 600; color: #334155; white-space: nowrap; }
.ad .mi-pill .ad-ic { font-size: 14px; color: var(--a-brand); }
.ad .mi-multi { position: relative; display: flex; align-items: center; gap: 10px; margin-top: 16px; padding: 12px 14px; border-radius: 16px; background: #fff; }
.ad .mi-multi > .ad-ic:first-child { font-size: 22px; color: var(--a-brand); }
.ad .mi-multi > span { flex: 1; min-width: 0; }
.ad .mi-multi b { display: block; font-size: 15px; font-weight: 600; }
.ad .mi-multi small { display: block; margin-top: 2px; font-size: 12px; color: var(--a-muted); }
.ad .mi-multi > .ad-tap { left: auto; right: 10px; }
.ad .mi-lang { margin-top: 16px; padding: 14px; border-radius: 16px; background: #fff; }
.ad .mi-lh { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.ad .mi-lh b { font-size: 15px; font-weight: 600; }
.ad .mi-lh span { font-size: 14px; font-weight: 600; color: var(--a-brand); white-space: nowrap; }
.ad .mi-lang .mi-chips { margin-top: 10px; }
.ad .mi-cap { margin-top: 8px; font-size: 12px; color: var(--a-muted); }
.ad .mi-mdtext { margin-top: 14px; padding: 14px 16px; border-radius: 16px; background: #fff; font-size: 16px; line-height: 1.55; }
.ad .mi-note { display: flex; gap: 8px; margin-top: 12px; padding: 10px 12px; border-radius: 10px; background: #E6E7FE; color: #1E1B4B; font-size: 12.5px; line-height: 1.45; }
.ad .mi-note .ad-ic { flex: none; margin-top: 1px; font-size: 16px; color: #6366F1; }
.ad .mi-lg .ad-flag { width: 28px; height: 19px; border-radius: 4px; }
.ad .mi-lg .mi-fl small { margin-left: 8px; font-size: 14px; color: #8a8f99; }
.ad .mi-lg > .ad-tap { left: auto; right: 22px; }
.ad .mi-ck { font-size: 22px; color: var(--a-brand); }
.ad .mi-cnt { display: inline-grid; }
.ad .mi-cnt > b { grid-area: 1 / 1; font-weight: 600; }
.ad .mi-cnt > b:not([data-a="n3"]) { opacity: 0; }

/* ── Android(Material 3) ────────────────────────────────────── */
.ad .ma { overflow: hidden; background: #EEF1F5; color: #0F172A; font: 400 14px/1.4 var(--ad-font); letter-spacing: -0.01em; }
.ad .ma-sb { position: absolute; z-index: 30; top: 0; left: 0; right: 0; height: 38px; display: flex; align-items: center; justify-content: space-between; padding: 0 22px 0 26px; font-size: 14px; font-weight: 500; }
.ad .ma-sb-t { display: inline-grid; font-feature-settings: "tnum"; }
.ad .ma-sb-t > span { grid-area: 1 / 1; }
.ad .ma-sb-r { display: flex; gap: 3px; }
.ad .ma-sb-r .ad-ic { font-size: 17px; }
.ad .ma-cam { position: absolute; z-index: 31; top: 12px; left: 50%; width: 13px; height: 13px; margin-left: -6.5px; border-radius: 50%; background: #0b0b0f; }
.ad .ma-gest { position: absolute; z-index: 40; left: 50%; bottom: 6px; width: 108px; height: 4px; margin-left: -54px; border-radius: 2px; background: rgba(15, 23, 42, 0.5); }
.ad .ma-top { position: absolute; z-index: 5; top: 38px; left: 0; right: 0; height: 60px; display: flex; align-items: center; gap: 10px; padding: 0 16px 0 20px; }
.ad .ma-app { width: 30px; height: 30px; border-radius: 10px; }
.ad .ma-top b { flex: 1; min-width: 0; font-size: 18px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad .ma-wm { height: 14px; width: auto; margin-right: auto; }
.ad .ma-rf { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: #F1F5F9; }
.ad .ma-rf .ad-ic { font-size: 20px; color: #475569; }
.ad .ma-top.is-ed { gap: 12px; padding: 0 16px; }
.ad .ma-back { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 50%; background: #fff; box-shadow: inset 0 0 0 1px #E2E8F0; }
.ad .ma-back .ad-ic { font-size: 22px; }
.ad .ma-pill { flex: none; display: inline-flex; align-items: center; height: 34px; padding: 0 14px; border-radius: 17px; background: #fff; box-shadow: inset 0 0 0 1px #E2E8F0; font-size: 13px; font-weight: 600; color: #3157FF; white-space: nowrap; }
.ad .ma-body { position: absolute; left: 0; right: 0; top: 98px; bottom: 80px; padding: 4px 20px 20px; overflow: hidden; }
.ad .ma-body.is-ed { bottom: 96px; padding-top: 10px; }
.ad .ma-nav { position: absolute; z-index: 14; left: 0; right: 0; bottom: 0; height: 80px; padding-bottom: 16px; display: flex; background: #fff; border-top: 1px solid #E2E8F0; }
.ad .ma-ni { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; color: #64748B; }
.ad .ma-ni i { display: grid; place-items: center; width: 40px; height: 30px; border-radius: 15px; }
.ad .ma-ni .ad-ic { font-size: 22px; }
.ad .ma-ni b { max-width: 100%; font-size: 11px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad .ma-ni.is-on { color: #3157FF; }
.ad .ma-ni.is-on i { width: 56px; background: rgba(49, 87, 255, 0.14); }
.ad .ma-search { display: flex; align-items: center; gap: 8px; height: 48px; padding: 0 14px; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1px #E2E8F0; color: #94A3B8; font-size: 14px; white-space: nowrap; overflow: hidden; }
.ad .ma-search .ad-ic { font-size: 20px; color: #64748B; }
.ad .ma-search.is-sheet { margin-top: 12px; }
.ad .ma-fchips { display: flex; gap: 8px; margin-top: 12px; overflow: hidden; white-space: nowrap; }
.ad .ma-fchips span { flex: none; display: inline-flex; align-items: center; height: 32px; padding: 0 12px; border-radius: 8px; background: #fff; box-shadow: inset 0 0 0 1px #CBD5E1; font-size: 13px; font-weight: 600; color: #334155; }
.ad .ma-fchips span.is-on { background: rgba(49, 87, 255, 0.14); box-shadow: none; color: #3157FF; }
.ad .ma-sec { display: flex; align-items: baseline; gap: 6px; margin: 18px 2px 4px; }
.ad .ma-sec b { font-size: 14px; font-weight: 700; color: #334155; }
.ad .ma-sec span { font-size: 12px; color: #64748B; }
.ad .ma-mrow { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid #E2E8F0; }
.ad .ma-mrow > i { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 50%; background: rgba(49, 87, 255, 0.12); color: #3157FF; }
.ad .ma-mrow > i .ad-ic { font-size: 20px; }
.ad .ma-mrow > span { min-width: 0; }
.ad .ma-mrow b { display: flex; align-items: center; gap: 6px; font-size: 16px; font-weight: 600; white-space: nowrap; }
.ad .ma-mrow small { display: block; font-size: 13px; color: #64748B; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad .ma-flags { display: inline-flex; align-items: center; gap: 2px; font-style: normal; font-size: 11px; font-weight: 700; color: #64748B; }
.ad .ma-scrim { position: absolute; z-index: 18; inset: 0; background: rgba(15, 23, 42, 0.36); }
.ad .ma-scrim[data-a="scrim"] { z-index: 10; background: rgba(0, 0, 0, 0.18); opacity: 0; }
.ad .ma-fabmenu { position: absolute; z-index: 12; right: 16px; bottom: 164px; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.ad .ma-fabopt { position: relative; display: flex; align-items: center; gap: 10px; padding: 8px 18px 8px 8px; border-radius: 28px; background: #fff; box-shadow: 0 4px 14px rgba(15, 23, 42, 0.18); opacity: 0; }
.ad .ma-fabopt i { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: #3157FF; color: #fff; }
.ad .ma-fabopt i .ad-ic { font-size: 20px; }
.ad .ma-fabopt b { display: block; font-size: 14px; font-weight: 600; }
.ad .ma-fabopt small { display: block; font-size: 12px; color: #64748B; }
.ad .ma-fab { position: absolute; z-index: 12; right: 16px; bottom: 96px; display: inline-flex; align-items: center; gap: 6px; height: 54px; padding: 0 20px 0 16px; border-radius: 27px; background: linear-gradient(135deg, #8B5CF6 0%, #6366F1 55%, #3B82F6 100%); color: #fff; font-size: 15px; font-weight: 700; box-shadow: 0 6px 16px rgba(99, 102, 241, 0.35); white-space: nowrap; }
.ad .ma-fabplus { display: inline-grid; place-items: center; }
.ad .ma-fabplus .ad-ic { font-size: 24px; }
.ad .ma-field { position: relative; margin-top: 18px; padding: 16px 14px 14px; border-radius: 10px; background: #fff; box-shadow: inset 0 0 0 1px #CBD5E1; }
.ad .ma-field.is-focus { box-shadow: inset 0 0 0 2px #3157FF; }
.ad .ma-flab { position: absolute; top: -9px; left: 10px; padding: 0 4px; background: #EEF1F5; font-size: 12px; font-weight: 600; color: #3157FF; white-space: nowrap; }
.ad .ma-flab.is-g { color: #64748B; }
.ad .ma-field p { min-height: 72px; font-size: 16px; line-height: 1.5; }
.ad .ma-field p.is-one { min-height: 0; }
.ad .ma-field.is-text p { min-height: 96px; }
.ad .ma-count { display: block; margin-top: 6px; text-align: right; font-style: normal; font-size: 12px; color: #64748B; font-feature-settings: "tnum"; }
.ad .ma-field.is-pick { display: flex; align-items: center; justify-content: space-between; gap: 6px; height: 52px; margin-top: 0; padding: 0 14px; }
.ad .ma-field.is-pick p { min-height: 0; font-size: 15px; white-space: nowrap; overflow: hidden; }
.ad .ma-field.is-pick .ad-ic { font-size: 22px; color: #64748B; }
.ad .ma-stack { display: inline-grid; }
.ad .ma-stack > * { grid-area: 1 / 1; }
.ad .ma-field [data-a="pick0"] { opacity: 0; }
.ad .ma-dict { display: flex; align-items: center; justify-content: center; gap: 6px; height: 52px; margin-top: 12px; border-radius: 26px; background: #fff; box-shadow: inset 0 0 0 1px #E2E8F0; color: #3157FF; font-size: 15px; font-weight: 600; }
.ad .ma-dict .ad-ic { font-size: 20px; }
.ad .ma-lab { margin: 18px 2px 8px; font-size: 14px; font-weight: 600; color: #334155; }
.ad .ma-lab.is-first { margin-top: 4px; }
.ad .ma-tones { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.ad .ma-tones span { height: 40px; display: grid; place-items: center; padding: 0 4px; border-radius: 10px; background: #fff; box-shadow: inset 0 0 0 1px #E2E8F0; font-size: 13.5px; font-weight: 600; color: #475569; white-space: nowrap; overflow: hidden; }
.ad .ma-tones span.is-on { background: rgba(49, 87, 255, 0.14); box-shadow: none; color: #3157FF; }
.ad .ma-card { position: relative; margin-top: 14px; padding: 14px 16px; border-radius: 14px; background: #fff; box-shadow: 0 0 0 1px #E2E8F0, 0 1.5px 3px rgba(15, 23, 42, 0.05); }
.ad .ma-card.is-flyer { display: flex; align-items: center; gap: 10px; }
.ad .ma-card.is-flyer .ad-ic { font-size: 22px; color: #3157FF; }
.ad .ma-card b { display: block; font-size: 14px; font-weight: 600; }
.ad .ma-card small { display: block; font-size: 12px; color: #64748B; }
.ad .ma-card.is-reai { display: flex; align-items: center; gap: 10px; margin-top: 0; }
.ad .ma-card.is-reai .ad-ic:first-child { font-size: 20px; color: #7C3AED; }
.ad .ma-card.is-reai b { flex: 1; color: #3157FF; }
.ad .ma-card.is-reai .ad-ic:last-child { font-size: 20px; color: #94A3B8; }
.ad .ma-card.is-opt { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
.ad .ma-optl { flex: none; font-size: 13px; font-weight: 600; color: #64748B; }
.ad .ma-card.is-opt b { flex: 1; min-width: 0; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad .ma-chg { flex: none; height: 28px; padding: 0 12px; display: inline-flex; align-items: center; border-radius: 14px; background: rgba(49, 87, 255, 0.1); color: #3157FF; font-size: 12px; font-weight: 700; }
.ad .ma-slider { flex: 1; display: flex; align-items: center; gap: 8px; font-size: 11px; color: #64748B; }
.ad .ma-slider i { position: relative; flex: 1; height: 4px; border-radius: 2px; background: #E2E8F0; }
.ad .ma-slider b { position: absolute; left: 50%; top: 50%; width: 16px; height: 16px; margin: -8px 0 0 -8px; border-radius: 50%; background: #3157FF; }
.ad .ma-sticky { position: absolute; z-index: 14; left: 0; right: 0; bottom: 0; padding: 12px 20px 30px; background: #fff; border-top: 1px solid #E2E8F0; }
.ad .ma-mainbtn { position: relative; }
.ad .ma-mainbtn > * + * { position: absolute; inset: 0; }
.ad .ma-gbtn { position: relative; display: flex; align-items: center; justify-content: center; gap: 8px; height: 52px; border-radius: 12px; background: linear-gradient(135deg, #8B5CF6 0%, #6366F1 55%, #3B82F6 100%); color: #fff; font-size: 16px; font-weight: 700; box-shadow: 0 6px 18px rgba(99, 102, 241, 0.35); white-space: nowrap; }
.ad .ma-gbtn .ad-ic { font-size: 20px; }
.ad .ma-gbtn.is-busy { background: linear-gradient(135deg, #a78bfa 0%, #818cf8 55%, #60a5fa 100%); opacity: 0; }
.ad .ma-seg { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 4px; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1px #E2E8F0; }
.ad .ma-seg span { height: 36px; display: grid; place-items: center; border-radius: 9px; font-size: 13.5px; font-weight: 600; color: #64748B; white-space: nowrap; overflow: hidden; }
.ad .ma-seg span.is-on { background: #3157FF; color: #fff; }
.ad .ma-2col { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
.ad .ma-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
/* 요일 칩 — 앱 WeekdayChips: 선택 전 surfaceVariant+onSurfaceVariant(Medium), 선택 primary+onPrimary(Bold), 높이 44·모서리 10 */
.ad .ma-days > span { position: relative; height: 44px; display: grid; place-items: center; border-radius: 10px; background: #F1F5F9; font-size: 14px; font-weight: 500; color: #475569; white-space: nowrap; }
.ad .ma-days > span.is-on, .ad .ma-dayon { background: #3157FF; color: #fff; font-weight: 700; }
.ad .ma-days em { font-style: normal; }
.ad .ma-dayon { position: absolute; inset: 0; display: grid; place-items: center; border-radius: 10px; }
.ad .ma-schtop { display: flex; align-items: center; gap: 10px; }
.ad .ma-tog { flex: 1; display: grid; grid-template-columns: 1fr 1fr; padding: 4px; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1px #E2E8F0; }
.ad .ma-tog b { height: 34px; display: grid; place-items: center; border-radius: 9px; font-size: 13.5px; font-weight: 600; color: #64748B; }
.ad .ma-tog b.is-on { background: rgba(49, 87, 255, 0.14); color: #3157FF; }
.ad .ma-calbtn { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1px #E2E8F0; color: #334155; }
.ad .ma-calbtn .ad-ic { font-size: 20px; }
.ad .ma-card.is-list { padding: 4px 0; }
.ad .ma-sr { display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 14px; }
.ad .ma-sr + .ma-sr { border-top: 1px solid #EDF1F6; }
.ad .ma-sr > b { font-size: 16px; font-weight: 700; font-feature-settings: "tnum"; }
.ad .ma-sr > b.br { color: #3157FF; }
.ad .ma-sr .t { flex: 1; min-width: 0; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad .ma-sr.is-past { opacity: 0.45; }
.ad .ma-sr.is-past > b { text-decoration: line-through; }
.ad .ma-sr.is-next { background: rgba(49, 87, 255, 0.07); }
.ad .ma-tp { flex: none; display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 11px; font-size: 11.5px; font-weight: 700; white-space: nowrap; }
.ad .ma-tp.is-loop { background: #E6E7FE; color: #3730A3; }
.ad .ma-tp.is-once { background: #F1F5F9; color: #475569; }
.ad .ma-tp.is-week { background: #FEF3C7; color: #78350F; }
.ad .ma-nx, .ad .ma-ok { flex: none; display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 11px; background: #DCFCE7; color: #14532D; font-size: 11.5px; font-weight: 700; white-space: nowrap; }
.ad .ma-sct { display: block; font-size: 15px; font-weight: 700; }
.ad .ma-scs { margin-top: 4px; font-size: 13px; color: #64748B; }
.ad .ma-scn { margin-top: 2px; font-size: 13px; font-weight: 600; color: #3157FF; }
.ad .ma-snack { position: absolute; z-index: 16; left: 16px; right: 16px; bottom: 162px; /* 앱처럼 '새 예약' 버튼 위(버튼 윗변 150px + 12px) */ display: flex; align-items: center; height: 48px; padding: 0 16px; border-radius: 8px; background: #1E293B; color: #fff; font-size: 14px; font-weight: 500; box-shadow: 0 6px 16px rgba(15, 23, 42, 0.25); opacity: 0; }
.ad .ma-greet { display: flex; justify-content: space-between; align-items: flex-start; }
.ad .ma-greet p { font-size: 14px; color: #64748B; }
.ad .ma-greet b { display: block; margin-top: 2px; font-size: 22px; font-weight: 700; }
.ad .ma-greet img { width: 76px; height: 76px; object-fit: contain; }
.ad .ma-heros { position: relative; height: 196px; margin-top: 12px; }
.ad .ma-hero { position: absolute; inset: 0; display: flex; flex-direction: column; padding: 20px 22px; border-radius: 18px; background: linear-gradient(135deg, #4F46E5, #6366F1); color: #fff; }
.ad .ma-hero[data-a="hNext"], .ad .ma-hero[data-a="hTmr"] { opacity: 0; }
.ad .ma-hero .k { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; }
.ad .ma-hero .dot { width: 9px; height: 9px; border-radius: 50%; background: #fff; animation: ad-pulse 1.1s ease-in-out infinite; }
.ad .ma-hero .bars { display: inline-flex; align-items: center; gap: 3px; height: 16px; margin-left: 4px; }
.ad .ma-hero .bars i { width: 3px; border-radius: 2px; background: #fff; animation: ad-bar 0.9s ease-in-out infinite; transform-origin: 50% 50%; }
.ad .ma-hero .bars i:nth-child(1) { height: 6px; } .ad .ma-hero .bars i:nth-child(2) { height: 12px; animation-delay: -0.2s; } .ad .ma-hero .bars i:nth-child(3) { height: 16px; animation-delay: -0.4s; } .ad .ma-hero .bars i:nth-child(4) { height: 10px; animation-delay: -0.1s; } .ad .ma-hero .bars i:nth-child(5) { height: 7px; animation-delay: -0.3s; }
@keyframes ad-bar { 0%, 100% { transform: scaleY(0.5); } 50% { transform: scaleY(1); } }
.ad .ma-hero .t { display: block; margin-top: 10px; font-size: 20px; font-weight: 700; }
.ad .ma-hero .c { display: inline-grid; margin-top: 6px; font-size: 28px; font-weight: 700; font-feature-settings: "tnum"; }
.ad .ma-hero .c > span { grid-area: 1 / 1; }
.ad .ma-hero .c > [data-a="c2"], .ad .ma-hero .c > [data-a="c1"] { opacity: 0; }
.ad .ma-hero .s { margin-top: 4px; font-size: 13px; opacity: 0.85; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad .ma-hero .hb { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: auto; height: 46px; border-radius: 10px; background: rgba(255, 255, 255, 0.18); font-size: 15px; font-weight: 700; white-space: nowrap; }
.ad .ma-hero .hb .ad-ic { font-size: 19px; }
.ad .ma-hero .hb.is-w { background: #fff; color: #4F46E5; }
.ad .ma-sec2 { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin: 20px 2px 10px; }
.ad .ma-sec2 b { font-size: 18px; font-weight: 700; }
.ad .ma-sec2 span { font-size: 13px; font-weight: 600; color: #3157FF; white-space: nowrap; }
.ad .ma-quick { display: flex; gap: 10px; overflow: hidden; }
.ad .ma-quick span { flex: none; width: 150px; padding: 14px; border-radius: 14px; background: #fff; box-shadow: 0 0 0 1px #E2E8F0; }
.ad .ma-quick i { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: rgba(49, 87, 255, 0.12); color: #3157FF; }
.ad .ma-quick i .ad-ic { font-size: 20px; }
.ad .ma-quick b { display: block; margin-top: 10px; font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad .ma-cards2 { position: relative; height: 110px; }
.ad .ma-cards2 > div { position: absolute; left: 0; right: 0; top: 0; }
.ad .ma-cards2 > [data-a="recent"] { opacity: 0; }
.ad .ma-cards2 .ma-card { margin-top: 0; }
.ad .ma-live { position: absolute; z-index: 15; left: 14px; right: 14px; bottom: 92px; display: flex; align-items: center; gap: 12px; padding: 10px; border-radius: 14px; background: #fff; box-shadow: 0 8px 24px rgba(15, 23, 42, 0.16), 0 0 0 1px #E2E8F0; }
.ad .ma-live .tile { display: flex; align-items: center; justify-content: center; gap: 3px; width: 42px; height: 42px; border-radius: 12px; background: linear-gradient(135deg, #8B5CF6 0%, #6366F1 55%, #3B82F6 100%); }
.ad .ma-live .tile i { width: 3px; border-radius: 2px; background: #fff; animation: ad-bar 0.9s ease-in-out infinite; }
.ad .ma-live .tile i:nth-child(1) { height: 10px; } .ad .ma-live .tile i:nth-child(2) { height: 18px; animation-delay: -0.3s; } .ad .ma-live .tile i:nth-child(3) { height: 14px; animation-delay: -0.15s; } .ad .ma-live .tile i:nth-child(4) { height: 8px; animation-delay: -0.45s; }
.ad .ma-live .tx { flex: 1; min-width: 0; }
.ad .ma-live small { display: flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 700; color: #EF4444; }
.ad .ma-live small .dot { width: 7px; height: 7px; border-radius: 50%; background: #EF4444; }
.ad .ma-live b { display: block; font-size: 15px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad .ma-live .st { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: #FEE2E2; color: #EF4444; }
.ad .ma-live .st .ad-ic { font-size: 20px; }
.ad .ma-sheet { position: absolute; z-index: 20; left: 0; right: 0; bottom: 0; padding: 10px 20px 30px; border-radius: 28px 28px 0 0; background: #fff; }
.ad .ma-grab { display: block; width: 36px; height: 4px; margin: 0 auto 14px; border-radius: 2px; background: #CBD5E1; }
.ad .ma-csk { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: #64748B; }
.ad .ma-cslive { display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 9px; border-radius: 11px; background: #FEE2E2; color: #EF4444; font-size: 12px; font-weight: 700; }
.ad .ma-cslive .dot { width: 6px; height: 6px; border-radius: 50%; background: #EF4444; }
.ad .ma-cst { display: block; margin-top: 6px; font-size: 20px; font-weight: 700; }
.ad .ma-csb { margin-top: 6px; max-height: 63px; overflow: hidden; font-size: 14px; line-height: 1.5; color: #64748B; }
.ad .ma-csban { display: flex; align-items: center; gap: 6px; margin-top: 12px; padding: 10px 12px; border-radius: 10px; background: #E6E7FE; color: #1E1B4B; font-size: 13px; font-weight: 600; }
.ad .ma-csban .ad-ic { font-size: 17px; color: #6366F1; }
.ad .ma-cslh { display: flex; justify-content: space-between; gap: 8px; margin-top: 16px; }
.ad .ma-cslh b { font-size: 14px; font-weight: 700; }
.ad .ma-cslh span { font-size: 13px; font-weight: 600; color: #3157FF; white-space: nowrap; }
.ad .ma-cschips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.ad .ma-cschips span { display: inline-flex; align-items: center; gap: 5px; height: 32px; padding: 0 12px; border-radius: 16px; background: #fff; box-shadow: inset 0 0 0 1px #E2E8F0; font-size: 13px; font-weight: 600; white-space: nowrap; }
.ad .ma-cschips span.is-on { background: #3157FF; box-shadow: none; color: #fff; }
.ad .ma-csnote { margin-top: 6px; font-size: 12px; color: #64748B; }
.ad .ma-csmulti { position: relative; display: flex; align-items: center; gap: 10px; margin-top: 14px; padding: 12px 14px; border-radius: 12px; background: #F8FAFC; box-shadow: inset 0 0 0 1px #E2E8F0; }
.ad .ma-csmulti > .ad-ic:first-child { font-size: 22px; color: #3157FF; }
.ad .ma-csmulti > span { flex: 1; min-width: 0; }
.ad .ma-csmulti b { display: block; font-size: 14px; font-weight: 700; }
.ad .ma-csmulti small { display: block; font-size: 12px; color: #64748B; }
.ad .ma-csmulti > .ad-ic:last-of-type { font-size: 20px; color: #94A3B8; }
.ad .ma-csmulti > .ad-tap { left: auto; right: 12px; }
.ad .ma-cssync { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
.ad .ma-cssync > span:first-child { flex: 1; min-width: 0; }
.ad .ma-cssync b { display: block; font-size: 14px; font-weight: 600; }
.ad .ma-cssync small { display: block; font-size: 12px; color: #64748B; }
.ad .ma-sw { position: relative; flex: none; width: 52px; height: 32px; border-radius: 16px; background: #E2E8F0; box-shadow: inset 0 0 0 2px #94A3B8; }
.ad .ma-sw::after { content: ""; position: absolute; top: 8px; left: 8px; width: 16px; height: 16px; border-radius: 50%; background: #64748B; }
.ad .ma-sw.is-on { background: #3157FF; box-shadow: none; }
.ad .ma-sw.is-on::after { top: 4px; left: 24px; width: 24px; height: 24px; background: #fff; }
.ad .ma-csmain { position: relative; margin-top: 14px; }
.ad .ma-csmain > * + * { position: absolute; inset: 0; }
.ad .ma-csmain.is-play [data-a="btnAir"] { opacity: 0; }
.ad .ma-csplay { display: flex; align-items: center; gap: 10px; height: 64px; margin-top: -6px; padding: 0 9px 0 18px; border-radius: 14px; background: linear-gradient(135deg, #8B5CF6 0%, #6366F1 55%, #3B82F6 100%); }
.ad .ma-csmain.is-play > .ma-csplay { position: relative; margin-top: 0; }
.ad .ma-csmain.is-play > .ma-gbtn { position: absolute; inset: 0; }
.ad .ma-csplay .w { flex: 1; display: flex; align-items: center; gap: 5px; height: 30px; }
.ad .ma-csplay .w i { width: 4px; height: 24px; border-radius: 2px; background: #fff; animation: ad-bar 0.9s ease-in-out infinite; }
.ad .ma-csplay .w i:nth-child(2n) { animation-delay: -0.3s; height: 16px; } .ad .ma-csplay .w i:nth-child(3n) { animation-delay: -0.55s; height: 28px; }
.ad .ma-csplay .stop { display: inline-flex; align-items: center; gap: 6px; height: 46px; padding: 0 16px; border-radius: 10px; background: #EF4444; color: #fff; font-size: 14px; font-weight: 700; white-space: nowrap; }
.ad .ma-csplay .stop .ad-ic { font-size: 18px; }
.ad .ma-cs2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; margin-top: 10px; }
.ad .ma-cs2 span { position: relative; display: flex; align-items: center; justify-content: center; gap: 6px; height: 46px; padding: 0 6px; border-radius: 10px; box-shadow: inset 0 0 0 1px #CBD5E1; font-size: 14px; font-weight: 600; color: #334155; white-space: nowrap; overflow: visible; }
.ad .ma-cs2 .ad-ic { font-size: 18px; }
.ad .ma-sheet.is-lang { padding-bottom: 24px; }
.ad .ma-lst { display: block; font-size: 18px; font-weight: 700; }
.ad .ma-lrows { margin-top: 8px; }
.ad .ma-lrow { position: relative; display: flex; align-items: center; gap: 12px; height: 54px; border-bottom: 1px solid #EDF1F6; }
.ad .ma-lrow .ad-flag { width: 28px; height: 19px; border-radius: 4px; }
.ad .ma-lrow > span:nth-of-type(2) { flex: 1; min-width: 0; }
.ad .ma-lrow b { display: block; font-size: 15px; font-weight: 600; }
.ad .ma-lrow small { display: block; font-size: 12px; color: #64748B; }
.ad .ma-lck { position: relative; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #F1F5F9; color: #64748B; }
.ad .ma-lck .ad-ic { font-size: 20px; }
.ad .ma-lck b { position: absolute; inset: 0; display: grid; place-items: center; border-radius: 50%; background: #3157FF; color: #fff; }
.ad .ma-lrow > .ad-tap { left: auto; right: -9px; }
.ad .ma-lsw { display: flex; align-items: center; gap: 12px; margin-top: 14px; }
.ad .ma-lsw > span:first-child { flex: 1; min-width: 0; }
.ad .ma-lsw b { display: block; font-size: 14px; font-weight: 600; }
.ad .ma-lsw small { font-size: 12px; color: #64748B; }
.ad .ma-lsw small [data-a^="p"] { opacity: 0; color: #3157FF; font-weight: 600; }
.ad .ma-lfoot { display: flex; align-items: center; gap: 8px; margin-top: 16px; }
.ad .ma-lcnt { flex: 1; min-width: 0; }
.ad .ma-lcnt .ma-stack b { display: inline-flex; align-items: center; height: 28px; padding: 0 10px; border-radius: 14px; background: rgba(49, 87, 255, 0.1); color: #3157FF; font-size: 12px; font-weight: 700; white-space: nowrap; }
.ad .ma-lcnt .ma-stack b:not([data-a="n3"]) { opacity: 0; }
.ad .ma-lcancel { height: 44px; padding: 0 14px; display: inline-flex; align-items: center; font-size: 14px; font-weight: 600; color: #475569; }
.ad .ma-ladd { position: relative; height: 44px; padding: 0 16px; display: inline-flex; align-items: center; border-radius: 10px; background: #3157FF; color: #fff; font-size: 14px; font-weight: 700; white-space: nowrap; }
.ad .ma-ladd [data-a="busy"] { opacity: 0; }

/* ── PC 앱 창 ───────────────────────────────────────────────── */
.ad .mw-bar { height: 32px; display: flex; align-items: center; gap: 8px; padding-left: 12px; background: #fff; border-bottom: 1px solid #e5e5e5; font: 400 12px/1 var(--ad-font); color: #374151; }
.ad .mw-bar img { width: 16px; height: 16px; border-radius: 4px; }
.ad .mw-bar > span:nth-child(2) { flex: 1; }
.ad .mw-ctl { display: flex; height: 100%; }
.ad .mw-ctl i { width: 46px; display: grid; place-items: center; }
.ad .mw-ctl .ad-ic { font-size: 16px; color: #374151; }
.ad .mw-ctl .max { width: 10px; height: 10px; border: 1.2px solid #374151; border-radius: 1px; }
.ad .mw-cam { position: absolute; left: 0; top: 0; width: 1280px; height: 800px; transform-origin: 0 0; }
.ad .mw-scr .ad-l { background: #f4f4f4; color: #111827; font: 400 14px/1.4 var(--ad-font); letter-spacing: -0.01em; }
.ad .mw-ws { position: absolute; inset: 0; display: flex; }
.ad .mw-rail { width: 52px; flex: none; display: flex; flex-direction: column; align-items: center; gap: 4px; padding-bottom: 14px; background: #f5f5f5; border-right: 1px solid #e5e5e5; }
.ad .mw-logo { height: 48px; display: grid; place-items: center; }
.ad .mw-logo img { width: 26px; height: 26px; border-radius: 7px; }
.ad .mw-ri { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 9px; color: #4a4d53; }
.ad .mw-ri .ad-ic { font-size: 19px; }
.ad .mw-ri.is-on { background: rgba(49, 87, 255, 0.1); color: #3157ff; }
.ad .mw-sep { width: 24px; height: 1px; margin: 6px 0; background: #dedede; }
.ad .mw-me { margin-top: auto; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #e0e7ff; color: #3157ff; font-size: 13px; font-weight: 700; }
.ad .mw-list { width: 280px; flex: none; display: flex; flex-direction: column; background: #fafafa; border-right: 1px solid #d6d6d6; }
.ad .mw-lh { height: 48px; display: flex; align-items: center; gap: 8px; padding: 0 8px 0 12px; border-bottom: 1px solid #e5e5e5; }
.ad .mw-lh > .ad-ic { font-size: 18px; color: #6b7280; }
.ad .mw-lh b { flex: 1; min-width: 0; font-size: 15px; font-weight: 700; white-space: nowrap; overflow: hidden; }
.ad .mw-ltools { display: flex; }
.ad .mw-ltools .ad-ic { font-size: 17px; margin: 0 5px; color: #4b5563; }
.ad .mw-ls { height: 53px; display: flex; align-items: center; padding: 0 12px; border-bottom: 1px solid #eee; }
.ad .mw-ls span { flex: 1; display: flex; align-items: center; gap: 6px; height: 34px; padding: 0 10px; border-radius: 8px; background: #fff; box-shadow: inset 0 0 0 1px #d7d7d7; color: #9ca3af; font-size: 13px; white-space: nowrap; overflow: hidden; }
.ad .mw-ls .ad-ic { font-size: 17px; }
.ad .mw-groups { padding: 10px; }
.ad .mw-gl { display: flex; justify-content: space-between; margin: 6px 4px; font-size: 12px; font-weight: 700; color: #6b7280; }
.ad .mw-gl.is-c { color: #2563eb; }
.ad .mw-gl span { font-weight: 600; color: #9ca3af; }
.ad .mw-grp { margin-bottom: 10px; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1px rgba(226, 232, 240, 0.9); overflow: hidden; }
.ad .mw-row { display: flex; gap: 10px; padding: 10px; }
.ad .mw-row + .mw-row { border-top: 1px solid #f1f5f9; }
.ad .mw-row.is-sel { background: #eef3ff; }
.ad .mw-rico { display: grid; place-items: center; flex: none; width: 30px; height: 30px; border-radius: 50%; background: #eef2ff; color: #3157ff; }
.ad .mw-rico .ad-ic { font-size: 16px; }
.ad .mw-rm { flex: 1; min-width: 0; }
.ad .mw-rt { display: flex; align-items: center; gap: 6px; }
.ad .mw-rt b { font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad .mw-rt .au { flex: none; width: 6px; height: 6px; border-radius: 50%; background: #10b981; }
.ad .mw-rt .d { margin-left: auto; font-size: 12px; color: #9ca3af; font-feature-settings: "tnum"; white-space: nowrap; }
.ad .mw-draft { flex: none; height: 18px; padding: 0 6px; display: inline-flex; align-items: center; border-radius: 9px; background: #eef2ff; color: #3157ff; font-size: 10.5px; font-weight: 700; animation: ad-soft 1.6s ease-in-out infinite; }
@keyframes ad-soft { 50% { opacity: 0.55; } }
.ad .mw-rs { margin-top: 2px; font-size: 13px; color: #4a4d53; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad .mw-rb { display: flex; align-items: center; gap: 6px; margin-top: 6px; min-height: 20px; }
.ad .mw-bdg { height: 20px; padding: 0 7px; display: inline-flex; align-items: center; border-radius: 6px; background: #fef3c7; color: #92400e; font-size: 11px; font-weight: 700; }
.ad .mw-fstack { display: inline-flex; align-items: center; }
.ad .mw-fstack .ad-flag { margin-left: -5px; box-shadow: 0 0 0 1.5px #fff; }
.ad .mw-fstack .ad-flag:first-child { margin-left: 0; }
.ad .mw-fstack i { margin-left: 4px; font-style: normal; font-size: 11px; font-weight: 600; color: #6b7280; }
.ad .mw-ed { flex: 1; min-width: 0; display: flex; flex-direction: column; background: #fff; }
.ad .mw-eh { height: 48px; flex: none; display: flex; align-items: center; gap: 10px; padding: 0 12px 0 20px; border-bottom: 1px solid #d6d6d6; }
.ad .mw-title { flex: 1; min-width: 0; font-size: 16px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad .mw-title.is-ph { color: #9ca3af; font-weight: 500; }
.ad .mw-tools { display: flex; align-items: center; gap: 6px; }
.ad .mw-ai, .ad .mw-tb { position: relative; display: inline-flex; align-items: center; gap: 5px; height: 32px; padding: 0 10px; border-radius: 8px; box-shadow: inset 0 0 0 1px #d6d6d6; background: #fff; font-size: 13px; font-weight: 600; color: #1f2937; white-space: nowrap; }
.ad .mw-ai .ad-ic:first-child { font-size: 16px; color: #7c3aed; }
.ad .mw-ai em { padding: 1px 6px; border-radius: 5px; background: #f3f4f6; color: #6b7280; font-style: normal; font-size: 11px; }
.ad .mw-ai .ad-ic:last-of-type { margin: 0 -4px; font-size: 18px; }
.ad .mw-tb .ad-ic { font-size: 16px; color: #4b5563; }
.ad .mw-tb.is-on { box-shadow: inset 0 0 0 1px #3157ff; background: rgba(49, 87, 255, 0.06); color: #3157ff; }
.ad .mw-tb.is-on .ad-ic { color: #3157ff; }
.ad .mw-ib { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 8px; color: #4b5563; }
.ad .mw-ib .ad-ic { font-size: 18px; }
.ad .mw-langs { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px 20px 0; }
.ad .mw-lt { display: inline-flex; align-items: center; gap: 5px; height: 28px; padding: 0 10px; border-radius: 7px; box-shadow: inset 0 0 0 1px #e5e7eb; font-size: 12.5px; font-weight: 600; color: #374151; white-space: nowrap; }
.ad .mw-lt.is-on { box-shadow: inset 0 0 0 1px #3157ff; background: rgba(49, 87, 255, 0.08); color: #3157ff; }
.ad .mw-lt.is-add { border: 1px dashed #cbd5e1; box-shadow: none; color: #6b7280; }
.ad .mw-lt .ad-ic { font-size: 14px; }
.ad .mw-lnote { display: flex; align-items: center; gap: 4px; padding: 8px 20px 0; font-size: 12px; font-weight: 600; color: #059669; }
.ad .mw-lnote .ad-ic { font-size: 14px; }
.ad .mw-text { flex: 1; min-height: 0; padding: 24px 32px; }
.ad .mw-se { display: flex; align-items: center; gap: 8px; font-size: 15px; color: #6b7280; }
.ad .mw-se .ad-ic { font-size: 18px; color: #9ca3af; }
.ad .mw-se.is-ph { color: #c0c4cc; }
.ad .mw-text .mw-se:first-child { padding-bottom: 14px; border-bottom: 1px dashed #e8e8e8; }
.ad .mw-text .mw-se:last-child { padding-top: 14px; border-top: 1px dashed #e8e8e8; }
.ad .mw-body { padding: 18px 0 6px; font-size: 20px; line-height: 1.75; color: #111827; letter-spacing: -0.02em; }
.ad .mw-body.is-ph { color: #b8bcc4; }
.ad .mw-cnt { padding-bottom: 12px; text-align: right; font-size: 12px; color: #9ca3af; font-feature-settings: "tnum"; }
.ad .mw-eb { height: 60px; flex: none; display: flex; align-items: center; gap: 8px; padding: 0 16px; border-top: 1px solid #eee; }
.ad .mw-eb .grow { flex: 1; }
.ad .mw-save { display: inline-flex; align-items: center; height: 36px; padding-left: 14px; border-radius: 8px; background: #3157ff; color: #fff; font-size: 13px; font-weight: 600; white-space: nowrap; }
.ad .mw-save i { display: grid; place-items: center; width: 26px; height: 36px; margin-left: 10px; border-left: 1px solid rgba(255, 255, 255, 0.3); }
.ad .mw-save .ad-ic { font-size: 18px; }
.ad .mw-ob { display: inline-flex; align-items: center; gap: 2px; height: 36px; padding: 0 8px 0 12px; border-radius: 8px; box-shadow: inset 0 0 0 1px #d6d6d6; font-size: 13px; font-weight: 600; color: #374151; }
.ad .mw-ob.is-i { padding: 0 8px; }
.ad .mw-ob .ad-ic { font-size: 18px; }
.ad .mw-ebstack { display: grid; justify-items: end; }
.ad .mw-ebv { grid-area: 1 / 1; display: flex; align-items: center; gap: 8px; }
.ad .mw-ebstack.is-play [data-a="barIdle"] { opacity: 0; }
.ad .mw-play { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 40px; min-width: 120px; padding: 0 16px; border-radius: 10px; background: #3157ff; color: #fff; font-size: 14px; font-weight: 700; white-space: nowrap; }
.ad .mw-play .ad-ic { font-size: 18px; }
.ad .mw-live { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 10px; border-radius: 14px; background: rgba(239, 68, 68, 0.1); color: #dc2626; font-size: 12.5px; font-weight: 700; white-space: nowrap; }
.ad .mw-live i { width: 7px; height: 7px; border-radius: 50%; background: #ef4444; animation: ad-ping 1.2s ease-out infinite; }
@keyframes ad-ping { 0% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.5); } 100% { box-shadow: 0 0 0 7px rgba(239, 68, 68, 0); } }
.ad .mw-stop { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 40px; min-width: 120px; padding: 0 16px; border-radius: 10px; background: #ef4444; color: #fff; font-size: 14px; font-weight: 700; white-space: nowrap; }
.ad .mw-stop .ad-ic { font-size: 17px; }
.ad .mw-panel { position: relative; width: 340px; flex: none; background: #fafafa; border-left: 1px solid #d6d6d6; }
.ad .mw-pv { position: absolute; left: 0; right: 0; top: 0; opacity: 0; }
.ad .mw-pv.is-res { opacity: 1; }
.ad .mw-pttap { position: absolute; left: 170px; top: 24px; width: 0; height: 0; }
.ad .mw-pt { height: 48px; display: flex; align-items: center; gap: 4px; padding: 0 10px; background: #fff; border-bottom: 1px solid #e5e5e5; }
.ad .mw-pt span { flex: 1; height: 32px; display: grid; place-items: center; border-radius: 8px; font-size: 13.5px; font-weight: 600; color: #6b7280; white-space: nowrap; }
.ad .mw-pt span.is-on { background: #eef2ff; color: #3157ff; }
.ad .mw-pb { padding: 14px; }
.ad .mw-ph { margin: 14px 2px 8px; font-size: 12.5px; font-weight: 700; color: #374151; }
.ad .mw-pb > .mw-ph:first-child { margin-top: 2px; }
.ad .mw-voice { display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 12px; border-radius: 9px; background: #fff1f2; box-shadow: inset 0 0 0 1px #fecdd3; color: #9f1239; font-size: 13.5px; font-weight: 600; white-space: nowrap; }
.ad .mw-voice .ad-ic:first-child { font-size: 16px; }
.ad .mw-voice .ad-ic:last-child { margin-left: auto; font-size: 18px; }
.ad .mw-slider { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: #6b7280; }
.ad .mw-slider i { position: relative; flex: 1; height: 4px; border-radius: 2px; background: #e5e7eb; }
.ad .mw-slider b { position: absolute; left: 50%; top: 50%; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; background: #3157ff; box-shadow: 0 0 0 3px rgba(49, 87, 255, 0.2); }
.ad .mw-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ad .mw-chips span { display: inline-flex; align-items: center; height: 28px; padding: 0 10px; border-radius: 14px; background: #fff; box-shadow: inset 0 0 0 1px #e5e7eb; font-size: 12px; font-weight: 600; color: #374151; white-space: nowrap; }
.ad .mw-chips span.is-on { box-shadow: inset 0 0 0 1px #3157ff; background: rgba(49, 87, 255, 0.06); color: #3157ff; }
.ad .mw-card { margin-bottom: 10px; padding: 12px 14px; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1px #e5e7eb; }
.ad .mw-card.is-ok { display: flex; align-items: center; gap: 10px; }
.ad .mw-card.is-ok .ad-ic { font-size: 22px; color: #10b981; }
.ad .mw-card b { display: block; font-size: 13.5px; font-weight: 700; }
.ad .mw-card.is-cd .k { font-size: 12px; font-weight: 700; color: #3157ff; }
.ad .mw-card.is-cd b { margin-top: 3px; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad .mw-card.is-cd .m { margin-top: 2px; font-size: 12px; color: #6b7280; }
.ad .mw-card .mono { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-weight: 700; color: #111827; }
.ad .mw-dg { display: inline-grid; }
.ad .mw-dg > span { grid-area: 1 / 1; }
.ad .mw-dg > [data-a="d2"], .ad .mw-dg > [data-a="d1"] { opacity: 0; }
.ad .mw-cdstack { display: grid; }
.ad .mw-cdstack > div { grid-area: 1 / 1; }
.ad .mw-cdstack > [data-a="cdA"] { opacity: 0; }
.ad .mw-card.is-list { padding: 4px 0; }
.ad .mw-sr { display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 12px; font-size: 13px; }
.ad .mw-sr b { font-weight: 700; font-feature-settings: "tnum"; }
.ad .mw-sr .t { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad .mw-sr.is-past { opacity: 0.5; }
.ad .mw-sr.is-past b, .ad .mw-sr.is-past .t { text-decoration: line-through; }
.ad .mw-sr.is-next, .ad .mw-sr.is-play { background: #eef3ff; }
.ad .mw-sr em { display: inline-flex; align-items: center; gap: 4px; height: 20px; padding: 0 7px; border-radius: 6px; background: #ef4444; color: #fff; font-style: normal; font-size: 11px; font-weight: 700; white-space: nowrap; }
.ad .mw-sr em i { width: 5px; height: 5px; border-radius: 50%; background: #fff; animation: ad-soft 1s ease-in-out infinite; }
.ad .mw-srstack { display: grid; }
.ad .mw-srstack > .mw-sr { grid-area: 1 / 1; }
.ad .mw-srstack > [data-a="rowNext"], .ad .mw-srstack > [data-a="rowDone"] { opacity: 0; }
.ad .mw-tp { flex: none; display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 6px; background: #f3f4f6; color: #4b5563; font-size: 11px; font-weight: 700; white-space: nowrap; }
.ad .mw-tp.is-loop { background: #dbeafe; color: #1e40af; }
.ad .mw-tp.is-week { background: #fef9c3; color: #854d0e; }
.ad .mw-add { position: relative; display: flex; align-items: center; justify-content: center; gap: 4px; height: 38px; border-radius: 10px; border: 1px dashed #cbd5e1; color: #3157ff; font-size: 13px; font-weight: 600; }
.ad .mw-add .ad-ic { font-size: 16px; }
.ad .mw-seg { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 3px; border-radius: 10px; background: #eef0f3; }
.ad .mw-seg > * { grid-row: 1; }
.ad .mw-seg > span { position: relative; z-index: 1; height: 30px; display: grid; place-items: center; font-size: 12.5px; font-weight: 600; color: #374151; white-space: nowrap; }
.ad .mw-seg > span:nth-of-type(1) { grid-column: 1; } .ad .mw-seg > span:nth-of-type(2) { grid-column: 2; } .ad .mw-seg > span:nth-of-type(3) { grid-column: 3; } .ad .mw-seg > span:nth-of-type(4) { grid-column: 4; }
.ad .mw-segpill { grid-column: 1; border-radius: 8px; background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); }
.ad .mw-segpill.is-w { grid-column: 3; }
.ad .mw-segpill[data-a="segLoop"] { opacity: 0; }
.ad .mw-fl { margin: 12px 2px 6px; font-size: 12px; font-weight: 700; color: #374151; }
.ad .mw-2f { display: flex; align-items: center; gap: 6px; }
.ad .mw-2f span, .ad .mw-1f { display: flex; align-items: center; flex: 1; height: 34px; padding: 0 10px; border-radius: 8px; background: #fff; box-shadow: inset 0 0 0 1px #d7d7d7; font-size: 12.5px; color: #111827; font-feature-settings: "tnum"; }
.ad .mw-2f i { font-style: normal; color: #9ca3af; }
.ad .mw-1f { position: relative; }
.ad .mw-tstack { display: inline-grid; }
.ad .mw-tstack > span { grid-area: 1 / 1; }
.ad .mw-tstack > [data-a="t0"] { color: #9ca3af; opacity: 0; }
.ad .mw-days { display: flex; align-items: center; gap: 4px; }
/* 요일 버튼 — 앱(NewScheduleForm): 28×28, 선택 전 secondary+진한 글씨, 선택 primary(일=red-500·토=blue-500)+흰 글씨, '전체'는 다 고르면 primary.
   선택 칸(b)이 자기 흰 글씨를 갖고 선택 전 칸 위에 겹친다 — 박자표가 b 만 켠다 */
.ad .mw-dall, .ad .mw-day { position: relative; height: 28px; display: grid; place-items: center; border-radius: 8px; background: #F0F2F5; font-size: 12px; font-weight: 500; color: #171717; white-space: nowrap; }
.ad .mw-dall { padding: 0 8px; }
.ad .mw-day { flex: none; width: 28px; }
.ad .mw-dall b, .ad .mw-day b { position: absolute; inset: 0; display: grid; place-items: center; border-radius: 8px; background: #3157ff; color: #fff; font-weight: 500; }
.ad .mw-day.is-sun b { background: #ef4444; }
.ad .mw-day.is-sat b { background: #3b82f6; }
.ad .mw-hint { display: flex; align-items: flex-start; gap: 6px; margin-top: 12px; padding: 8px 10px; border-radius: 8px; background: #fffbeb; color: #92400e; font-size: 11.5px; line-height: 1.45; }
.ad .mw-hint .ad-ic { flex: none; margin-top: 1px; font-size: 14px; }
.ad .mw-addbtn { position: relative; display: flex; align-items: center; justify-content: center; height: 38px; margin-top: 12px; border-radius: 9px; background: #3157ff; color: #fff; font-size: 13px; font-weight: 700; }
.ad .mw-mini { position: absolute; left: 0; right: 0; bottom: 0; height: 110px; display: flex; align-items: center; gap: 12px; padding: 0 16px; background: #fff; border-top: 1px solid #e5e5e5; }
.ad .mw-mini .bar { position: absolute; left: 0; right: 0; top: 0; height: 3px; background: #eee; }
.ad .mw-mini .bar i { position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: #3157ff; }
.ad .mw-mini .disc { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 12px; background: #111827; color: #fff; }
.ad .mw-mini .disc .ad-ic { font-size: 30px; }
.ad .mw-mini .tx { flex: 1; min-width: 0; }
.ad .mw-mini .tx b { display: block; font-size: 13.5px; font-weight: 700; }
.ad .mw-mini .tx small { font-size: 12px; color: #6b7280; }
.ad .mw-mini .pl { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: #111827; color: #fff; }
.ad .mw-mini .pl .ad-ic { font-size: 24px; }
/* AI 글쓰기 대화상자 */
.ad .mw-dlgwrap { position: absolute; inset: 0; z-index: 20; opacity: 0; }
.ad .mw-dim { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.4); }
.ad .mw-dlg { position: absolute; left: 352px; top: 64px; width: 576px; border-radius: 14px; background: #fff; box-shadow: 0 24px 60px rgba(0, 0, 0, 0.3); overflow: hidden; }
.ad .mw-dh { display: flex; align-items: center; gap: 8px; height: 56px; padding: 0 18px; }
.ad .mw-dh > .ad-ic { font-size: 20px; color: #7c3aed; }
.ad .mw-dh b { flex: 1; font-size: 17px; font-weight: 700; }
.ad .mw-dhist, .ad .mw-dx { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 8px; color: #6b7280; }
.ad .mw-dhist .ad-ic, .ad .mw-dx .ad-ic { font-size: 19px; }
.ad .mw-dtabs { display: flex; gap: 18px; padding: 0 18px; border-bottom: 1px solid #eee; }
.ad .mw-dtabs span { height: 36px; display: flex; align-items: center; font-size: 13px; font-weight: 600; color: #6b7280; white-space: nowrap; }
.ad .mw-dtabs span.is-on { color: #111827; box-shadow: inset 0 -2px 0 #3157ff; }
.ad .mw-dpanes { display: grid; }
.ad .mw-dpane { grid-area: 1 / 1; padding: 16px 18px 18px; }
.ad .mw-dpane[data-a="dIn"] { opacity: 0; }
.ad .mw-dlab { margin: 4px 0 8px; font-size: 13px; font-weight: 700; color: #374151; }
.ad .mw-dchips { display: flex; flex-wrap: wrap; gap: 6px; }
.ad .mw-dchips span { display: inline-flex; align-items: center; height: 28px; padding: 0 11px; border-radius: 14px; background: #f3f4f6; font-size: 12.5px; font-weight: 600; color: #374151; white-space: nowrap; }
.ad .mw-dchips.is-tone span { background: #fff; box-shadow: inset 0 0 0 1px #e5e7eb; }
.ad .mw-dchips.is-tone span.is-on { box-shadow: inset 0 0 0 1px #3157ff; background: rgba(49, 87, 255, 0.1); color: #3157ff; }
.ad .mw-dta { margin: 12px 0 14px; padding: 12px 14px; min-height: 96px; border-radius: 10px; box-shadow: inset 0 0 0 1.5px #3157ff; }
.ad .mw-dta p { font-size: 15px; line-height: 1.55; }
.ad .mw-dta em { display: block; margin-top: 8px; text-align: right; font-style: normal; font-size: 11.5px; color: #9ca3af; font-feature-settings: "tnum"; }
.ad .mw-dta.is-out { margin-top: 8px; min-height: 124px; box-shadow: inset 0 0 0 1px #e5e7eb; }
.ad .mw-dadv { display: flex; align-items: center; gap: 4px; margin-top: 12px; font-size: 12.5px; font-weight: 600; color: #6b7280; }
.ad .mw-dadv .ad-ic { font-size: 18px; }
.ad .mw-dbtn { position: relative; margin-top: 14px; }
.ad .mw-dbtn > * + * { position: absolute; inset: 0; }
.ad .mw-dmake { position: relative; display: flex; align-items: center; justify-content: center; gap: 6px; height: 44px; border-radius: 10px; background: #3157ff; color: #fff; font-size: 14px; font-weight: 700; white-space: nowrap; }
.ad .mw-dmake .ad-ic { font-size: 17px; }
.ad .mw-dmake.is-busy { background: #6b83ff; opacity: 0; }
.ad .mw-dback { display: inline-flex; align-items: center; gap: 2px; font-size: 12.5px; font-weight: 600; color: #6b7280; }
.ad .mw-dback .ad-ic { font-size: 17px; }
.ad .mw-dfield { height: 38px; display: flex; align-items: center; padding: 0 12px; border-radius: 8px; box-shadow: inset 0 0 0 1px #e5e7eb; font-size: 14px; font-weight: 600; }
.ad .mw-dmeta { font-size: 12px; color: #6b7280; font-feature-settings: "tnum"; }
.ad .mw-dact { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }
.ad .mw-dre, .ad .mw-dapply { position: relative; display: inline-flex; align-items: center; gap: 5px; height: 38px; padding: 0 14px; border-radius: 9px; font-size: 13px; font-weight: 700; white-space: nowrap; }
.ad .mw-dre { box-shadow: inset 0 0 0 1px #d6d6d6; color: #374151; }
.ad .mw-dre .ad-ic { font-size: 16px; }
.ad .mw-dapply { background: #3157ff; color: #fff; }
.ad .mw-dcap { margin-top: 8px; text-align: right; font-size: 11.5px; color: #9ca3af; }
/* 다국어 팝오버 */
.ad .mw-pop { position: absolute; z-index: 20; left: 470px; top: 44px; width: 468px; padding: 16px; border-radius: 14px; background: #fff; box-shadow: 0 20px 50px rgba(15, 23, 42, 0.22), 0 0 0 1px rgba(15, 23, 42, 0.06); opacity: 0; }
.ad .mw-poph { font-size: 13.5px; font-weight: 700; color: #111827; }
.ad .mw-popsearch { display: flex; align-items: center; gap: 6px; height: 34px; margin-top: 10px; padding: 0 10px; border-radius: 8px; box-shadow: inset 0 0 0 1px #d7d7d7; color: #9ca3af; font-size: 12.5px; }
.ad .mw-popsearch .ad-ic { font-size: 16px; }
.ad .mw-popgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: 10px; }
.ad .mw-pl { position: relative; display: flex; align-items: center; gap: 7px; height: 36px; padding: 0 9px; border-radius: 8px; box-shadow: inset 0 0 0 1px #eceef1; font-size: 12.5px; font-weight: 600; color: #374151; white-space: nowrap; }
.ad .mw-pl em { position: relative; z-index: 1; font-style: normal; overflow: hidden; text-overflow: ellipsis; }
.ad .mw-pl .ad-flag { position: relative; z-index: 1; }
.ad .mw-plon { position: absolute; inset: 0; border-radius: 8px; background: rgba(49, 87, 255, 0.1); box-shadow: inset 0 0 0 1px #3157ff; }
.ad .mw-popck { display: flex; align-items: center; gap: 8px; margin-top: 12px; font-size: 12.5px; color: #374151; }
.ad .mw-cb { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 4px; background: #3157ff; color: #fff; }
.ad .mw-cb .ad-ic { font-size: 14px; }
.ad .mw-popf { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 14px; }
.ad .mw-stack { display: inline-grid; }
.ad .mw-stack > * { grid-area: 1 / 1; }
.ad .mw-popf > .mw-stack b { font-size: 12.5px; font-weight: 600; color: #6b7280; }
.ad .mw-popf > .mw-stack b:not([data-a="n3"]) { opacity: 0; }
.ad .mw-popadd { position: relative; display: inline-flex; align-items: center; height: 34px; padding: 0 16px; border-radius: 8px; background: #3157ff; color: #fff; font-size: 13px; font-weight: 700; white-space: nowrap; }
.ad .mw-popadd [data-a="busy"] { opacity: 0; }

/* ── 반응형 ─────────────────────────────────────────────────── */
@media (max-width: 1099px) {
  .ad { padding: 88px 0 80px; }
  .ad .ad-wrap { grid-template-columns: minmax(0, 1fr); gap: 36px; max-width: 760px; }
  .ad .ad-copy { max-width: 620px; }
}
@media (max-width: 720px) {
  .ad { padding: 64px 0 56px; }
  .ad .ad-wrap { padding: 0 20px; gap: 24px; }
  .ad .ad-h2 { font-size: 31px; line-height: 1.26; margin-top: 14px; }
  html:not(:lang(ko)) .ad .ad-h2 { font-size: 28px; }
  .ad .ad-lead { margin-top: 14px; font-size: 15.5px; }
  .ad .ad-devsel { display: flex; margin-top: 22px; }
  .ad .ad-devsel button { flex: 1; min-width: 0; padding: 0 6px; font-size: 14px; gap: 5px; }
  .ad .ad-cta { margin-top: 22px; }
  .ad .ad-cta .btn { flex: 1 1 100%; justify-content: center; }
  .ad .ad-stage { height: 620px; border-radius: 22px; --k-ios: 0.5; --k-and: 0.465; }
  .ad .ad-devs { top: 20px; }
  .ad .ad-dev.is-win { margin-top: 90px; }
  .ad .ad-subs { left: 12px; right: 12px; bottom: 80px; }
  .ad .ad-sub { padding: 6px 10px; font-size: 14px; }
  .ad .ad-sub.is-in { font-size: 12.5px; }
  .ad .ad-cue[data-cue="1b"] .ad-sub.is-in { display: none; } /* 좁은 화면: AI 초안 줄만(두 줄이면 기기 아래와 겹친다) */
  .ad .ad-steps { left: 10px; right: 10px; bottom: 12px; height: 52px; padding: 0 5px; gap: 2px; }
  .ad .ad-step { gap: 4px; height: 42px; font-size: 12.5px; }
  .ad .ad-step .l { display: none; }
  .ad .ad-step .s { display: inline; }
  .ad .ad-step em { width: 18px; height: 18px; font-size: 10.5px; }
  .ad .ad-step i { left: 10px; right: 10px; bottom: 4px; }
  .ad .ad-time { display: none; }
  .ad .ad-pause { width: 36px; height: 36px; }
  .ad .ad-hint { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 12px; font: 600 13px/1 var(--ad-font); color: var(--ad-muted); }
  .ad .ad-hint .ad-ic { font-size: 16px; }
  .ad.is-static .ad-hint { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .ad .mi-spin, .ad .ma-spin, .ad .mw-spin, .ad .mi-caret, .ad .ma-caret, .ad .mw-caret, .ad .mi-herok .dot, .ad .mi-live .dot, .ad .ma-hero .dot, .ad .ma-hero .bars i, .ad .ma-live .tile i, .ad .ma-csplay .w i, .ad .mw-live i, .ad .mw-sr em i, .ad .mw-draft { animation: none !important; }
}