/* Compact, device-aware Home Screen install strip for Marginox. */
.mx-install-guide{
  --install-bg:#11161a;
  --install-ink:#f2f0ea;
  --install-muted:#9da6ac;
  --install-line:rgba(242,240,234,.13);
  --install-accent:#ff6810;
  position:relative;
  overflow:hidden;
  border-top:1px solid var(--install-line);
  border-bottom:1px solid var(--install-line);
  background:var(--install-bg);
  color:var(--install-ink);
  opacity:0;
  transform:translate3d(0,10px,0);
  transition:opacity 240ms cubic-bezier(.22,1,.36,1),transform 240ms cubic-bezier(.22,1,.36,1);
}
.mx-install-guide.is-ready{opacity:1;transform:translate3d(0,0,0)}
.mx-install-guide::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.45;
  background:linear-gradient(rgba(242,240,234,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(242,240,234,.025) 1px,transparent 1px);
  background-size:44px 44px;mask-image:linear-gradient(90deg,#000,transparent 78%);
}
html[data-theme="light"] .mx-install-guide{
  --install-bg:#f2eee6;
  --install-ink:#20262a;
  --install-muted:#667078;
  --install-line:rgba(32,38,42,.14);
  --install-accent:#e65a0a;
}
.mx-install-guide__inner{position:relative;z-index:1;width:min(960px,100%);margin:0 auto;padding:clamp(46px,6vw,72px) clamp(24px,6vw,60px)}
.mx-install-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:36px}
.mx-install-copy{min-width:0}
.mx-install-kicker{display:flex;align-items:center;gap:10px;margin-bottom:13px;color:var(--install-muted);font-size:.68rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
.mx-install-signal{position:relative;width:28px;height:1px;background:var(--install-accent)}
.mx-install-signal::before,.mx-install-signal::after{content:"";position:absolute;top:50%;width:5px;height:5px;border:1px solid var(--install-accent);transform:translateY(-50%) rotate(45deg)}
.mx-install-signal::before{left:1px}.mx-install-signal::after{right:1px}
.mx-install-guide h2{max-width:17ch;font-size:clamp(1.8rem,3.9vw,2.8rem);font-weight:600;line-height:1.03;letter-spacing:-.035em;text-wrap:balance}
.mx-install-lede{max-width:50ch;margin-top:13px;color:var(--install-muted);font-size:.94rem;line-height:1.55}
.mx-install-device-label{display:flex;align-items:center;flex:none;gap:10px;padding:9px 12px 9px 9px;border:1px solid var(--install-line);border-radius:14px;background:rgba(242,240,234,.025)}
.mx-install-device-label img{width:38px;height:38px;border-radius:10px;box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}
.mx-install-device-label span{display:flex;flex-direction:column;gap:2px}.mx-install-device-label small{color:var(--install-muted);font-size:.58rem;letter-spacing:.11em;text-transform:uppercase}.mx-install-device-label strong{font-size:.82rem;font-weight:600}

.mx-install-steps{display:grid;grid-template-columns:repeat(3,minmax(0,220px));gap:14px;list-style:none;margin:30px 0 0;padding:0}
.mx-install-steps li{position:relative;min-width:0}
.mx-install-step-number{position:absolute;z-index:5;top:8px;left:8px;display:grid;place-items:center;width:25px;height:20px;border-radius:999px;background:rgba(13,17,20,.82);color:#ff8b4a;font-size:.56rem;font-weight:700;letter-spacing:.08em;font-variant-numeric:tabular-nums;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.mx-install-step-copy{display:flex;flex-direction:column;gap:3px;margin-top:10px;min-width:0}.mx-install-step-copy strong{font-size:.85rem;font-weight:600;line-height:1.2}.mx-install-step-copy span{color:var(--install-muted);font-size:.71rem;line-height:1.4}
.mx-install-step-image{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;overflow:hidden;border:1px solid rgba(242,240,234,.13);border-radius:15px;background:#11161a;box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 12px 26px rgba(4,7,9,.16)}
.mx-install-mini-shot{position:relative;width:100%;aspect-ratio:3/2;overflow:hidden;border:1px solid rgba(242,240,234,.13);border-radius:15px;background:#e9e6df;box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 12px 26px rgba(4,7,9,.16)}
.mx-install-steps[data-install-instructions="ios"] .mx-install-mini-shot::before{content:"";position:absolute;z-index:0;inset:0;background:url('/assets/install/snapshots/marginox-iphone-safari.jpg') center 72%/cover no-repeat}
.mx-install-steps[data-install-instructions="ios"] .mx-install-shot-safari::before{background-position:center bottom}
.mx-install-steps[data-install-instructions="ios"] .mx-install-shot-menu::after,.mx-install-steps[data-install-instructions="ios"] .mx-install-shot-sheet::after{content:"";position:absolute;z-index:0;inset:0;background:rgba(13,17,20,.28)}
.mx-install-steps[data-install-instructions="ios"] .mx-install-mini-shot>*{z-index:1}
.mx-install-steps[data-install-instructions="ios"] .mx-install-shot-safari .mx-install-mini-lines,.mx-install-steps[data-install-instructions="ios"] .mx-install-shot-safari .mx-install-mini-toolbar{display:none}
.mx-install-mini-lines{position:absolute;inset:15px 12px 43px;display:flex;flex-direction:column;gap:7px}.mx-install-mini-lines i{height:9px;border-radius:5px;background:rgba(32,38,42,.08)}.mx-install-mini-lines i:nth-child(2){width:84%}.mx-install-mini-lines i:nth-child(3){width:62%}
.mx-install-mini-toolbar{position:absolute;left:7px;right:7px;bottom:7px;display:flex;align-items:center;gap:5px;height:32px;color:#f2f0ea}
.mx-install-mini-toolbar>i{flex:none;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#f7f5ef;color:#20262a;font-style:normal}
.mx-install-mini-toolbar .mx-install-mini-back{font-size:24px;font-weight:300;line-height:1}.mx-install-mini-toolbar>b{flex:1;min-width:0;height:30px;display:flex;align-items:center;justify-content:center;border-radius:999px;background:#65635d;color:#f2f0ea;font-size:7px;font-weight:500;white-space:nowrap}
.mx-install-mini-more{display:flex!important;align-items:center;justify-content:center;gap:2px}.mx-install-mini-more em{width:3px;height:3px;border-radius:50%;background:currentColor}
.mx-install-mini-target{position:relative;box-shadow:inset 0 0 0 1px var(--install-accent),0 0 0 1px var(--install-accent)!important}
.mx-install-mini-target::after{content:"";position:absolute;inset:-4px;border:1px solid var(--install-accent);border-radius:inherit;animation:mx-install-target 1.05s cubic-bezier(.22,1,.36,1) .4s 2 both;pointer-events:none}

.mx-install-shot-menu,.mx-install-shot-android-menu{background:linear-gradient(145deg,#dedbd4,#bcb9b1)}
.mx-install-mini-menu{position:absolute;top:9px;right:9px;bottom:9px;width:76%;display:flex;flex-direction:column;justify-content:center;padding:7px;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:rgba(31,34,36,.94);color:#f2f0ea;box-shadow:0 12px 24px rgba(0,0,0,.3)}
.mx-install-mini-menu>i,.mx-install-mini-menu>b{min-height:29px;display:flex;align-items:center;gap:7px;padding:0 9px;border-radius:8px;font-size:7px;font-style:normal;font-weight:500}.mx-install-mini-menu>b{background:rgba(255,104,16,.16);color:#fff}.mx-install-mini-menu svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

.mx-install-shot-sheet{background:linear-gradient(160deg,#171a1c,#323432)}
.mx-install-mini-sheet-head{position:absolute;top:10px;left:10px;right:10px;display:flex;align-items:center;gap:8px;padding-bottom:9px;border-bottom:1px solid rgba(242,240,234,.15);color:#f2f0ea}
.mx-install-mini-sheet-head img{width:31px;height:31px;border-radius:8px}.mx-install-mini-sheet-head i{display:flex;flex-direction:column;font-style:normal}.mx-install-mini-sheet-head b{font-size:8px}.mx-install-mini-sheet-head small{margin-top:2px;color:rgba(242,240,234,.55);font-size:6px}
.mx-install-mini-actions{position:absolute;left:7px;right:7px;bottom:8px;display:grid;grid-template-columns:repeat(3,1fr);gap:4px;color:#f2f0ea}
.mx-install-mini-actions>i{position:relative;display:flex;min-width:0;flex-direction:column;align-items:center;gap:4px;font-style:normal;text-align:center}.mx-install-mini-actions svg{width:27px;height:27px;padding:6px;border-radius:50%;background:rgba(242,240,234,.15);fill:none;stroke:currentColor;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round}.mx-install-mini-actions small{font-size:5.5px;line-height:1.05}.mx-install-mini-actions>.mx-install-mini-target{border-radius:8px;box-shadow:none!important}.mx-install-mini-actions>.mx-install-mini-target::after{inset:-3px;border-radius:9px}

.mx-install-shot-browser-share,.mx-install-shot-android{background:#e9e6df}.mx-install-mini-topbar{position:absolute;top:8px;left:8px;right:8px;display:flex;align-items:center;gap:5px;height:32px}.mx-install-mini-topbar>b{flex:1;height:30px;display:flex;align-items:center;padding:0 9px;border-radius:10px;background:rgba(32,38,42,.09);color:#42494e;font-size:7px;font-weight:500}.mx-install-mini-topbar>i{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:9px;background:#fff;color:#3d4449;font-style:normal}.mx-install-mini-topbar svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.mx-install-shot-android .mx-install-mini-topbar{top:8px}.mx-install-shot-android .mx-install-mini-lines{inset:51px 12px 12px}

.mx-install-shot-confirm{background:#ece9e2}.mx-install-mini-confirm{position:absolute;inset:9px;display:flex;flex-direction:column;border:1px solid rgba(32,38,42,.12);border-radius:11px;background:#faf9f5;color:#20262a;box-shadow:0 9px 20px rgba(0,0,0,.12)}.mx-install-mini-confirm>i{height:29px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 8px;border-bottom:1px solid rgba(32,38,42,.1);font-style:normal}.mx-install-mini-confirm>i>*{font-size:6px}.mx-install-mini-confirm>i>b:last-child{text-align:right;color:#d9560d}.mx-install-mini-confirm>span{display:flex;align-items:center;gap:8px;padding:12px}.mx-install-mini-confirm img{width:38px;height:38px;border-radius:10px}.mx-install-mini-confirm em{font-size:9px;font-style:normal;font-weight:600}

.mx-install-shot-android-menu{background:linear-gradient(145deg,#e5e8e9,#c9ced0)}.mx-install-shot-android-menu .mx-install-mini-menu{top:8px;right:8px;bottom:8px;background:#fafafa;color:#20262a}.mx-install-shot-android-menu .mx-install-mini-menu>b{color:#c74f0b}
.mx-install-shot-android-confirm{background:#e7eaeb}.mx-install-mini-install-card{position:absolute;left:8px;right:8px;top:18px;display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:7px;padding:10px;border-radius:12px;background:#fff;color:#20262a;box-shadow:0 10px 22px rgba(0,0,0,.16)}.mx-install-mini-install-card img{width:31px;height:31px;border-radius:8px}.mx-install-mini-install-card>i{display:flex;min-width:0;flex-direction:column;font-style:normal}.mx-install-mini-install-card b{font-size:7px}.mx-install-mini-install-card small{margin-top:2px;color:#737c82;font-size:5.5px}.mx-install-mini-install-card em,.mx-install-mini-install-card>strong{padding:6px;border-radius:6px;font-size:6px;font-style:normal}.mx-install-mini-install-card>strong{background:#ff6810;color:#fff}

.mx-install-actions{display:flex;align-items:center;gap:14px;margin-top:24px;min-height:46px}.mx-install-actions p{max-width:48ch;color:var(--install-muted);font-size:.71rem;line-height:1.45}
.mx-install-button{min-height:46px;display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:8px 17px;border:1px solid #b24605;border-radius:11px;background:linear-gradient(180deg,#ff9650 0%,#ff6810 54%,#d9560d 100%);color:#fff;font:600 .85rem/1 'Aileron',-apple-system,'Segoe UI',sans-serif;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.38),inset 0 -1px 0 rgba(0,0,0,.2),0 8px 22px rgba(7,10,12,.22);transition:transform 180ms cubic-bezier(.22,1,.36,1),filter 180ms ease}.mx-install-button img{width:28px;height:28px;border-radius:8px}.mx-install-button:active{transform:translate3d(0,1px,0) scale(.98)}.mx-install-button:disabled{cursor:wait;opacity:.68;transform:none}
@media(hover:hover) and (pointer:fine){.mx-install-button:hover{filter:brightness(1.06);transform:translate3d(0,-1px,0)}}

@keyframes mx-install-target{0%{opacity:0;transform:scale(.82)}35%{opacity:1}100%{opacity:0;transform:scale(1.18)}}
@media(max-width:700px){
  .mx-install-guide__inner{padding:38px max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}
  .mx-install-heading{align-items:flex-start;flex-direction:column;gap:20px}.mx-install-guide h2{font-size:clamp(1.85rem,8.8vw,2.35rem)}
  .mx-install-device-label{padding-block:7px}
  .mx-install-steps{width:min(100%,440px);grid-template-columns:1fr;gap:20px;margin-top:26px}
  .mx-install-steps li{padding:9px 9px 13px;border:1px solid var(--install-line);border-radius:18px;background:rgba(242,240,234,.025)}
  .mx-install-mini-shot,.mx-install-step-image{aspect-ratio:16/9;border-radius:14px}
  .mx-install-step-number{top:18px;left:18px;width:30px;height:23px;font-size:.6rem}
  .mx-install-step-copy{margin:12px 3px 0}.mx-install-step-copy strong{font-size:.92rem}.mx-install-step-copy span{font-size:.73rem;line-height:1.42}
  .mx-install-actions{align-items:flex-start;flex-direction:column;margin-top:20px}.mx-install-button{width:100%}
}
@media(prefers-reduced-motion:reduce){
  .mx-install-guide{transition:none;transform:none}.mx-install-mini-target::after{animation:none;opacity:1}.mx-install-button{transition:none}
}