.le { --le-line: rgba(127,127,140,.25); border-radius: 18px; overflow: hidden; border: 1px solid var(--le-line); background: #fff; box-shadow: 0 40px 80px -40px rgba(0,0,0,.55); }
  .le-bar { display: flex; align-items: center; gap: 10px; padding: 10px 14px; background: #f2f4f7; border-bottom: 1px solid #e4e7ec; font: 500 13px/1 "Inter", system-ui, sans-serif; color: #475467; }
  .le-dots { display: flex; gap: 6px; } .le-dots i { width: 10px; height: 10px; border-radius: 50%; background: #d0d5dd; }
  .le-url { flex: 1; min-width: 0; background: #fff; border: 1px solid #e4e7ec; border-radius: 8px; padding: 7px 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .le-tabs { display: flex; gap: 4px; }
  .le-tabs button { all: unset; cursor: pointer; padding: 7px 12px; border-radius: 8px; font-weight: 600; color: #475467; min-height: 30px; display: grid; place-items: center; }
  .le-tabs button[aria-selected="true"] { background: #2563eb; color: #fff; }
  .le-tabs button:focus-visible { outline: 3px solid #93b4ff; }
  .le-view { position: relative; overflow: hidden; background: #fff; }
  .le-view iframe { position: absolute; top: 0; left: 0; border: 0; transform-origin: 0 0; }
  .le-open { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 14px; background: #f9fafb; border-top: 1px solid #e4e7ec; font: 500 13.5px/1.3 "Inter", system-ui, sans-serif; color: #475467; }
  .le-open a { color: #2563eb; font-weight: 700; text-decoration: none; white-space: nowrap; }
  @media (max-width: 600px) { .le-url { display: none; } .le-bar { justify-content: space-between; } }
  .le-lock { position: absolute; left: 0; right: 0; bottom: 0; top: var(--lock-top, 42%); z-index: 2; display: grid; place-items: end center; text-align: center; padding: 24px 16px; background: linear-gradient(to bottom, rgba(18,18,18,0), rgba(18,18,18,.55) 18%, rgba(18,18,18,.82)); backdrop-filter: blur(7px); -webkit-backdrop-filter: blur(7px); mask-image: linear-gradient(to bottom, transparent, #000 14%); -webkit-mask-image: linear-gradient(to bottom, transparent, #000 14%); font-family: "Inter", system-ui, sans-serif; color: #f5f4ed; }
  .le-lock-in { display: grid; justify-items: center; gap: 8px; padding-bottom: 6px; }
  .le-lock .lk { width: 56px; height: 56px; border-radius: 18px; display: grid; place-items: center; background: rgba(37,99,235,.18); border: 1px solid rgba(126,164,255,.45); box-shadow: 0 10px 30px -10px rgba(37,99,235,.9); }
  .le-lock .lk svg { width: 26px; height: 26px; color: #9db8ff; }
  .le-lock b { font: 800 18px/1.25 "Sora", "Inter", sans-serif; }
  .le-lock p { margin: 0; color: #a3a19a; font-size: 14px; max-width: 360px; }
  .le-lock a { margin-top: 6px; display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 22px; border-radius: 999px; background: #2563eb; color: #fff; font: 700 12.5px/1 "Sora", "Inter", sans-serif; letter-spacing: .04em; text-transform: uppercase; text-decoration: none; box-shadow: 0 8px 20px -8px #2563eb; transition: transform .18s, box-shadow .18s, background .18s; }
  .le-lock a:hover { background: #1d4ed8; transform: translateY(-1px); box-shadow: 0 4px 18px rgba(37,99,235,.55); }
  .le.locked .le-view iframe { pointer-events: none; }