/* Страница расширения ALPARTA: поверх общего /site.css. Сцена в первом экране: курсор выделяет номер, меню, выезжает карточка. */
.xhero .container{grid-template-columns:1fr 1fr}
.xhero h1{font-size:46px}
.installed{margin-top:22px;background:rgba(18,166,96,.16);border:1px solid rgba(18,166,96,.45);color:#d9ffe9;border-radius:14px;padding:14px 18px;line-height:1.6}
.installed b{color:#7ee2a8}
.kbd{font:700 12.5px ui-monospace,Consolas,monospace;background:#eef2f8;color:#0f1b33;border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;padding:1px 6px}
/* сцена */
.scene{position:relative;height:440px}
.browser{position:absolute;left:0;top:30px;width:88%;background:#fff;border-radius:14px;box-shadow:0 30px 70px rgba(0,0,0,.35);overflow:hidden;color:#0f1b33}
.bbar{display:flex;align-items:center;gap:6px;background:#eef2f8;padding:9px 12px;border-bottom:1px solid #dde4ef}
.bbar i{width:10px;height:10px;border-radius:50%;background:#cfd8e6}
.bbar .url{flex:1;margin-left:8px;background:#fff;border-radius:8px;padding:4px 10px;font-size:12px;color:#5d6b85}
.bbar .ext{width:24px;height:24px;border-radius:6px;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 2px rgba(10,91,216,0);animation:extpulse 9s infinite}
.bbar .ext img{width:16px}
.bpage{position:relative;padding:14px;display:grid;gap:10px;min-height:330px}
.ad{display:flex;gap:12px;padding:10px;border:1px solid #e6ebf3;border-radius:10px;font-size:13px}
.ad.dim{opacity:.55}.adimg{width:64px;height:64px;border-radius:8px;background:linear-gradient(135deg,#dfe6f1,#f3f6fb);flex:0 0 64px}
.ad b{font-size:14px}.ad p{margin:3px 0;color:#5d6b85}.ad em{font-style:normal;font-weight:800}
mark.pn{background:transparent;color:inherit;border-radius:4px;padding:0 2px;animation:sel 9s infinite}
.ctx{position:absolute;left:150px;top:96px;background:#fff;border:1px solid #dde4ef;border-radius:10px;box-shadow:0 14px 34px rgba(10,26,63,.2);padding:6px;font-size:13px;display:grid;opacity:0;transform:scale(.95);transform-origin:top left;animation:ctx 9s infinite}
.ctx span{padding:7px 12px;border-radius:7px;display:flex;align-items:center;gap:8px}
.ctx .hl{animation:ctxhl 9s infinite;font-weight:700}.ctx img{width:14px}
.cursor{position:absolute;width:18px;height:18px;left:250px;top:230px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 2l15 11-7 1-3 7z' fill='%23111' stroke='%23fff' stroke-width='1.5'/%3E%3C/svg%3E") center/contain no-repeat;animation:cur 9s infinite;z-index:3}
.scene .card{position:absolute;right:0;top:0;width:250px;border-radius:14px;box-shadow:0 30px 70px rgba(0,0,0,.45);opacity:0;transform:translateX(30px) scale(.96);animation:card 9s infinite;max-height:440px;object-fit:cover;object-position:top}
@keyframes cur{0%{left:250px;top:230px}18%{left:178px;top:92px}30%{left:240px;top:92px}40%{left:240px;top:92px}50%{left:200px;top:140px}56%{left:200px;top:140px}70%,100%{left:260px;top:260px}}
@keyframes sel{0%,24%{background:transparent;color:inherit}30%,62%{background:#2b6ef5;color:#fff}70%,100%{background:transparent;color:inherit}}
@keyframes ctx{0%,38%{opacity:0;transform:scale(.95)}42%,58%{opacity:1;transform:none}62%,100%{opacity:0;transform:scale(.95)}}
@keyframes ctxhl{0%,48%{background:transparent;color:inherit}52%,60%{background:#e6efff;color:#0a5bd8}}
@keyframes card{0%,58%{opacity:0;transform:translateX(30px) scale(.96)}66%,94%{opacity:1;transform:none}100%{opacity:0;transform:translateX(30px) scale(.96)}}
@keyframes extpulse{0%,56%,100%{box-shadow:0 0 0 2px rgba(10,91,216,0)}60%{box-shadow:0 0 0 4px rgba(24,176,245,.6)}}
/* карточки возможностей */
.xcards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.xc{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px;position:relative;overflow:hidden;transition:transform .25s,box-shadow .25s,opacity .7s}
.xc:hover{transform:translateY(-4px);box-shadow:0 18px 44px rgba(10,26,63,.09)}
.xc .ic{width:48px;height:48px;border-radius:14px;background:var(--grad);display:flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:14px;box-shadow:0 8px 20px rgba(10,91,216,.25);transition:transform .3s}
.xc:hover .ic{transform:rotate(-6deg) scale(1.06)}
.xc h3{font-size:18px;font-weight:800;margin-bottom:6px}.xc p{color:var(--muted);margin:0}
.steps.s3{grid-template-columns:repeat(3,1fr)}
.privacy{display:flex;gap:26px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:22px;padding:30px}
.privacy .pic{width:72px;height:72px;border-radius:20px;background:#e6f7ee;display:flex;align-items:center;justify-content:center;font-size:34px;flex:0 0 72px}
.privacy h2{font-size:26px;margin-bottom:8px}.privacy p{color:var(--muted);margin:0 0 8px}
.getbox{position:relative;z-index:1}
/* окно «пришлём ссылку» */
.modal{position:fixed;inset:0;z-index:60;background:rgba(6,15,40,.55);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:16px;opacity:0;transition:opacity .2s}
.modal.on{opacity:1}.modal[hidden]{display:none!important}
.mbox{background:#fff;border-radius:22px;padding:30px;max-width:440px;width:100%;position:relative;text-align:center;transform:translateY(10px) scale(.98);transition:transform .25s}
.modal.on .mbox{transform:none}
.mbox h3{font-size:21px;margin:14px 0 8px}.mbox form{display:grid;gap:10px;margin-top:16px;text-align:left}
.mic{width:64px;height:64px;margin:0 auto;border-radius:18px;background:#fff;box-shadow:0 10px 30px rgba(10,26,63,.15);display:flex;align-items:center;justify-content:center}.mic img{width:40px}
.mclose{position:absolute;right:14px;top:12px;border:0;background:#eef2f8;width:34px;height:34px;border-radius:50%;cursor:pointer;font-size:14px}
.mbox .ok{margin-top:16px}
@media(max-width:1020px){.xhero .container{grid-template-columns:1fr}.scene{display:none}.xcards{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.xhero h1{font-size:32px}.xcards,.steps.s3{grid-template-columns:1fr}.privacy{flex-direction:column;text-align:center}}

.xsrc{margin:16px 0 0;color:#9fb6de;font-size:14px}.xsrc a{color:#fff;font-weight:700;border-bottom:1px dashed rgba(255,255,255,.4)}