.lmc-root{ --navy:#0A1636; --sky:#38B6FF; --blue:#2AA5E9; --ink:#2B3A5C; --slate:#7286A6; --mist:#F4F8FF; --circle:#D7E3FF;
  font-family:"Poppins",-apple-system,Segoe UI,Roboto,sans-serif; max-width:1120px; margin:0 auto; padding:6px 0; }
.lmc-root *{ box-sizing:border-box; }
.lmc-root .lmc-head{ text-align:center; margin-bottom:30px; }
.lmc-root .lmc-eyebrow{ font-size:13px; letter-spacing:2.5px; text-transform:uppercase; color:var(--blue); font-weight:600; margin:0 0 10px; }
.lmc-root .lmc-title{ font-size:34px; line-height:1.15; font-weight:700; color:var(--navy); margin:0 0 10px; letter-spacing:-0.5px; }
.lmc-root .lmc-sub{ font-size:16px; color:var(--slate); margin:0; }

.lmc-root .lmc-device{ position:relative; width:100%; line-height:0; margin:0 auto; }
.lmc-root .lmc-img{ width:100%; height:auto; display:block; }
.lmc-root .lmc-dot{ position:absolute; transform:translate(-50%,-50%); width:30px; height:30px; border-radius:50%;
  background:#fff; border:2px solid var(--blue); color:var(--navy); font-size:12.5px; font-weight:700; font-family:inherit;
  cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0; z-index:2;
  box-shadow:0 4px 14px rgba(10,22,54,.18); transition:transform .2s ease, background .2s, color .2s, border-color .2s; }
.lmc-root .lmc-dot::before{ content:""; position:absolute; inset:-6px; border-radius:50%; border:2px solid var(--sky); opacity:0; transform:scale(.6); transition:opacity .3s, transform .3s; }
.lmc-root .lmc-dot:hover{ background:var(--mist); }
.lmc-root .lmc-dot.is-active{ background:var(--sky); border-color:var(--sky); color:#fff; transform:translate(-50%,-50%) scale(1.15); z-index:3; }
.lmc-root .lmc-dot.is-active::before{ opacity:1; transform:scale(1); animation:lmcPulse 1.8s ease-out infinite; }
@keyframes lmcPulse{ 0%{ opacity:.85; transform:scale(.8);} 70%{ opacity:0; transform:scale(1.6);} 100%{ opacity:0; transform:scale(1.6);} }

.lmc-root .lmc-tabs{ display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin:22px auto 26px; max-width:900px; }
.lmc-root .lmc-tab{ font-family:inherit; font-size:13px; font-weight:600; color:var(--ink); background:#fff; border:1px solid #DCE7F8;
  border-radius:40px; padding:8px 14px 8px 10px; cursor:pointer; display:inline-flex; align-items:center; gap:7px; transition:all .2s; }
.lmc-root .lmc-tab b{ display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; border-radius:50%; background:var(--mist); color:var(--navy); font-size:11px; }
.lmc-root .lmc-tab:hover{ border-color:var(--sky); }
.lmc-root .lmc-tab.is-active{ background:var(--navy); border-color:var(--navy); color:#fff; }
.lmc-root .lmc-tab.is-active b{ background:var(--sky); color:#fff; }

.lmc-root .lmc-panel{ display:flex; align-items:center; gap:24px; width:100%; max-width:720px; min-height:150px; margin:0 auto;
  background:#fff; border:1px solid #E1EAF7; border-radius:18px; padding:22px 26px; box-shadow:0 18px 44px rgba(10,22,54,.08); }
.lmc-root .lmc-zoom{ flex:0 0 auto; width:140px; height:140px; border-radius:14px; overflow:hidden; border:2px solid var(--sky);
  background:#EEF4FD; background-repeat:no-repeat; }
.lmc-root .lmc-panel-body{ flex:1 1 auto; position:relative; }
.lmc-root .lmc-num{ position:absolute; top:-6px; right:0; font-size:44px; font-weight:800; line-height:1; color:var(--circle); letter-spacing:-1px; }
.lmc-root .lmc-ptitle{ font-size:20px; font-weight:700; color:var(--navy); margin:0 0 7px; padding-right:52px; }
.lmc-root .lmc-pdesc{ font-size:15.5px; line-height:1.6; color:var(--ink); margin:0; }
.lmc-root .lmc-panel.lmc-in .lmc-zoom, .lmc-root .lmc-panel.lmc-in .lmc-panel-body{ animation:lmcFade .45s ease both; }
@keyframes lmcFade{ from{ opacity:0; transform:translateY(8px);} to{ opacity:1; transform:translateY(0);} }

.lmc-root .lmc-chips{ margin-top:26px; }
.lmc-root .lmc-chip-track{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; }
.lmc-root .lmc-chip{ font-size:13px; font-weight:500; color:var(--navy); background:var(--mist); border:1px solid #DCE7F8; border-radius:40px; padding:8px 16px; white-space:nowrap; }
.lmc-root .lmc-chip.dup{ display:none; }

@media(max-width:768px){
  .lmc-root .lmc-title{ font-size:25px; }
  .lmc-root .lmc-sub{ font-size:14.5px; }
  .lmc-root .lmc-dot{ width:22px; height:22px; font-size:11px; border-width:2px; pointer-events:none; box-shadow:0 2px 8px rgba(10,22,54,.22); }
  .lmc-root .lmc-dot::before{ inset:-4px; }
  .lmc-root .lmc-tabs{ gap:7px; margin:18px auto 22px; }
  .lmc-root .lmc-tab{ font-size:12px; padding:7px 12px 7px 8px; }
  .lmc-root .lmc-panel{ flex-direction:column; align-items:flex-start; gap:16px; padding:20px; min-height:0; }
  .lmc-root .lmc-zoom{ width:100%; height:120px; }
  .lmc-root .lmc-num{ font-size:36px; }
  .lmc-root .lmc-dot[data-i="4"]{ left:40% !important; top:44% !important; }
  .lmc-root .lmc-dot[data-i="5"]{ left:50% !important; top:58% !important; }
  .lmc-root .lmc-dot[data-i="6"]{ left:60% !important; top:39% !important; }
  .lmc-root .lmc-chips{ overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); }
  .lmc-root .lmc-chip-track{ flex-wrap:nowrap; width:max-content; justify-content:flex-start; gap:10px; animation:lmcMarquee 22s linear infinite; }
  .lmc-root .lmc-chip.dup{ display:inline-flex; }
  @keyframes lmcMarquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
}
