/* FindMyPhone (T71) fx-kit v2 — «бумага и картография» по образцу device-locator.org (Walrus 06.11: «дизайн новый, ближе к
   device-locator»; «карты, фоны, визуализации, анимации — на высшем уровне»). Свои растры карт (выдуманная география, без подписей,
   генератор stand/visuals/gen), свой бренд-акцент (фиолетовый FMP, не бирюза DL) — сайты флота не делят картинки и цвет.
   Здесь только примитивы: токены, типографика, карточки, телефон, карта-панель, ореол, плавающая карточка места, переключатели,
   анимации. Композиция каждой страницы — в её блейде. v1 (S-day) — fx.css.s-day-v1 на стенде. */
.fp-root .fx{--canvas:#F7F9FC;--surface:#fff;--surface-2:#F1F4F9;--edge:#E0E4EC;--edge-2:#C8CED8;
 --ink:#0F172A;--mut:#526072;--faint:#556274;
 --acc:#3366D6;--acc-ink:#2350B5;--acc-rgb:51,102,214;--acc-soft:#EAF0FC;
 --ok:#0F7A45;--ok-bg:#16A34A;--ok-soft:#E7F6EE;--warn:#8A4B00;--warn-bg:#F59F00;--warn-soft:#FFF4E0;--bad:#B42318;--bad-bg:#D92D20;--bad-soft:#FEF0EE;
 --r-s:6px;--r-m:12px;--r-l:18px;--r-xl:24px;
 --shadow:0 1px 2px rgba(15,23,42,.05),0 10px 28px -14px rgba(15,23,42,.18);
 --shadow-lift:0 2px 4px rgba(15,23,42,.06),0 22px 44px -22px rgba(15,23,42,.28);
 --card-shadow:0 0 0 1px rgba(0,0,0,.02),0 1px 1px .5px rgba(0,0,0,.02),0 3px 3px 1.5px rgba(0,0,0,.02),0 6px 6px -3px rgba(0,0,0,.02),0 12px 12px -6px rgba(0,0,0,.02),0 24px 24px -12px rgba(0,0,0,.02),0 18px 40px -18px rgba(15,23,42,.18);
 --phone-shadow:0 50px 100px -20px rgba(50,50,93,.25),0 30px 60px -30px rgba(0,0,0,.3),inset 0 -2px 6px 0 rgba(10,37,64,.35);
 --soft:var(--surface-2);--shadow-s:var(--shadow);
 --mono:ui-monospace,SFMono-Regular,Menlo,monospace;
 --map-hero:url('/themes/t71/img/fx/map-hero-light.webp');--map-screen:url('/themes/t71/img/fx/map-screen-light.webp');
 --map-band:url('/themes/t71/img/fx/map-band-light.webp');--map-a:url('/themes/t71/img/fx/map-mini-a-light.webp');
 --map-b:url('/themes/t71/img/fx/map-mini-b-light.webp');--map-c:url('/themes/t71/img/fx/map-mini-c-light.webp');
 font:400 16px/1.6 Inter,system-ui,sans-serif;color:var(--ink);background:var(--canvas)}
.fp-root .fx *{box-sizing:border-box}
.fp-root .fx a{color:var(--acc-ink);text-underline-offset:3px}
.fp-root .fx b,.fp-root .fx strong{font-weight:600}
.fp-root .fx p{margin:0}
.fp-root .fx .fx-w{max-width:1180px;margin:0 auto;padding:0 24px;position:relative}
/* type */
.fp-root .fx h1{font-size:clamp(28px,3.2vw,40px);font-weight:600;line-height:1.14;letter-spacing:-.025em;margin:0 0 14px;color:var(--ink);max-width:18ch}
.fp-root .fx h2{font-size:clamp(23px,2.4vw,30px);font-weight:600;line-height:1.2;letter-spacing:-.012em;margin:0 0 12px;color:var(--ink);max-width:28ch}
.fp-root .fx h3{font-size:17px;font-weight:600;line-height:1.3;margin:0 0 6px;color:var(--ink)}
.fp-root .fx .fx-mute{color:var(--faint)}
.fp-root .fx .fx-line{font-size:18px;line-height:1.5;color:#243247;max-width:42ch}
.fp-root .fx .fx-kick{display:inline-flex;align-items:center;gap:8px;font:500 12.5px/1.2 var(--mono);color:var(--acc-ink);text-transform:lowercase;letter-spacing:.01em;margin:0 0 14px}
.fp-root .fx .fx-kick::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 3px rgba(var(--acc-rgb),.15)}
.fp-root .fx .fx-p{font-size:16px;line-height:1.58;color:#435166}
.fp-root .fx .fx-crumb{font:500 12.5px/1.2 var(--mono);color:var(--faint);margin:0 0 18px;text-transform:lowercase}
.fp-root .fx .fx-crumb a{text-decoration:none}
.fp-root .fx .fx-sec{padding:68px 0}
.fp-root .fx .fx-sec.soft{background:var(--surface)}
.fp-root .fx .fx-sec.tight{padding:56px 0}
/* surfaces */
.fp-root .fx .fx-card{background:var(--surface);border:1px solid rgba(15,23,42,.07);border-radius:var(--r-m);box-shadow:0 2px 6px rgba(15,23,42,.05);padding:20px}
.fp-root .fx .fx-panel{background:var(--surface);border-radius:var(--r-l);box-shadow:0 0 0 1px rgba(15,23,42,.04),0 4px 8px rgba(15,23,42,.05),0 16px 32px -12px rgba(15,23,42,.22);padding:22px}
/* buttons */
.fp-root .fx a.fx-btn,.fp-root .fx button.fx-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:500 14.5px/1.2 Inter,system-ui,sans-serif;border-radius:10px;min-height:44px;padding:11px 16px;text-decoration:none;border:0;cursor:pointer;white-space:nowrap;transition:transform .15s ease,box-shadow .15s ease,background .15s}
.fp-root .fx a.fx-btn--p,.fp-root .fx button.fx-btn--p{background:#3366D6;color:#fff;box-shadow:0 4px 10px rgba(51,102,214,.18)}
.fp-root .fx a.fx-btn--p:hover{background:#2350B5;transform:translateY(-1px)}
.fp-root .fx a.fx-btn--g,.fp-root .fx button.fx-btn--g{background:var(--surface);color:var(--ink);box-shadow:inset 0 0 0 1px var(--edge)}
.fp-root .fx a.fx-btn--g:hover{box-shadow:inset 0 0 0 1px var(--edge-2),var(--shadow);transform:translateY(-1px)}
/* chips */
.fp-root .fx .fx-chip{display:inline-flex;align-items:center;gap:6px;font:500 12.5px/1.2 Inter,system-ui,sans-serif;border-radius:999px;padding:5px 10px;background:var(--surface-2);color:var(--mut)}
.fp-root .fx .fx-chip.ok{background:var(--ok-soft);color:var(--ok)}
.fp-root .fx .fx-chip.warn{background:var(--warn-soft);color:var(--warn)}
.fp-root .fx .fx-chip.bad{background:var(--bad-soft);color:var(--bad)}
.fp-root .fx .fx-chip.acc{background:var(--acc-soft);color:var(--acc-ink)}
/* segmented control */
.fp-root .fx .fx-seg{display:inline-flex;gap:4px;padding:4px;border-radius:12px;background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--edge);flex-wrap:wrap}
.fp-root .fx .fx-seg button{font:500 13.5px/1.15 Inter,system-ui,sans-serif;color:var(--mut);background:transparent;border:0;border-radius:9px;padding:9px 12px;cursor:pointer;transition:background .2s,color .2s,box-shadow .2s}
.fp-root .fx .fx-seg button[aria-pressed="true"]{background:var(--surface);color:var(--acc-ink);font-weight:600;box-shadow:inset 0 0 0 1.5px var(--acc),0 4px 10px -4px rgba(15,23,42,.18)}
.fp-root .fx .fx-seg button:focus-visible,.fp-root .fx .fx-btn:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.fp-root .fx [hidden]{display:none!important}
/* stage: raster map panel bleeding to the right edge + halo (home-hero language of device-locator, our own rasters) */
.fp-root .fx .fx-stage{position:relative;isolation:isolate}
.fp-root .fx .fx-mappanel{position:absolute;z-index:0;top:0;bottom:0;left:24%;right:calc(-1 * (100vw - 100%) / 2 - 24px);border-radius:24px 0 0 24px;background:#E9EEF4 var(--map-hero) 62% 48%/cover no-repeat;box-shadow:none;overflow:hidden}
.fp-root .fx .fx-mappanel::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(247,249,252,.15),rgba(247,249,252,0) 18%)}
.fp-root .fx .fx-halo{position:absolute;z-index:-1;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(56,189,248,.20),rgba(51,102,214,.10) 60%,transparent 70%);filter:blur(90px);pointer-events:none}
/* phone: white bezel + layered theme shadow; screen = raster map */
.fp-root .fx .fx-phone{position:relative;z-index:2;width:270px;border-radius:44px;background:#fff;padding:10px;box-shadow:var(--phone-shadow)}
.fp-root .fx .fx-screen{position:relative;border-radius:35px;overflow:hidden;min-height:540px;background:#EEF2F5 var(--map-screen) center/cover no-repeat;font-size:12.5px;color:#0F172A}
.fp-root .fx .fx-screen--plain{background:#F8FAFC}
.fp-root .fx .fx-sbar{position:relative;z-index:3;display:flex;justify-content:space-between;align-items:center;padding:13px 22px 8px;font:600 12px/1 Inter,system-ui,sans-serif;background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,0))}
.fp-root .fx .fx-sbar i{width:70px;height:20px;border-radius:12px;background:#0F172A;position:absolute;left:50%;top:9px;transform:translateX(-50%)}
.fp-root .fx .fx-sheet{position:absolute;z-index:3;left:10px;right:10px;bottom:10px;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-radius:24px;padding:14px 16px;box-shadow:var(--card-shadow)}
.fp-root .fx .fx-sheet::before{content:"";display:block;width:36px;height:4px;border-radius:2px;background:#CBD5E1;margin:0 auto 10px}
/* floating location card (home-hero card of device-locator) */
.fp-root .fx .fx-loc{display:flex;align-items:center;gap:12px;background:var(--surface);border-radius:16px;padding:13px 15px;box-shadow:0 0 0 1px rgba(15,23,42,.04),0 4px 8px rgba(15,23,42,.05),0 16px 32px -12px rgba(15,23,42,.22)}
.fp-root .fx .fx-loc__ic{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--ok-bg);color:#fff}
.fp-root .fx .fx-loc__ic svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.fp-root .fx .fx-loc__ic.warn{background:var(--warn-bg)}.fp-root .fx .fx-loc__ic.bad{background:var(--bad-bg)}.fp-root .fx .fx-loc__ic.acc{background:var(--acc)}
.fp-root .fx .fx-loc__t{display:block;min-width:0}
.fp-root .fx .fx-loc__t b{display:block;font-size:14px;font-weight:600;line-height:1.3}
.fp-root .fx .fx-loc__t span{display:block;font-size:12.5px;color:var(--mut);line-height:1.4}
/* pin + accuracy ring (animated) */
.fp-root .fx .fx-pin{position:absolute;z-index:2;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;background:var(--acc);border:3px solid #fff;box-shadow:0 4px 12px rgba(15,23,42,.35)}
.fp-root .fx .fx-pin::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px solid rgba(var(--acc-rgb),.6);animation:fx-ping 2.4s cubic-bezier(.2,.6,.3,1) 2;opacity:0}
.fp-root .fx .fx-pin.grey{background:#8796AB}.fp-root .fx .fx-pin.grey::after{animation:none;opacity:0}
.fp-root .fx .fx-ring{position:absolute;z-index:1;border-radius:50%;background:rgba(var(--acc-rgb),.13);border:1.5px solid rgba(var(--acc-rgb),.32);transform:translate(-50%,-50%);transition:width .6s cubic-bezier(.2,.7,.2,1),height .6s cubic-bezier(.2,.7,.2,1),background .4s,border-color .4s}
@keyframes fx-ping{0%{transform:scale(1);opacity:.9}100%{transform:scale(3.4);opacity:0}}
@keyframes fx-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes fx-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes fx-dash{to{stroke-dashoffset:-48}}
.fp-root .fx .fx-rise{animation:fx-rise .7s cubic-bezier(.2,.7,.2,1) both}
.fp-root .fx .fx-rise.d1{animation-delay:.12s}.fp-root .fx .fx-rise.d2{animation-delay:.24s}.fp-root .fx .fx-rise.d3{animation-delay:.36s}
.fp-root .fx .fx-float{animation:fx-float 4s ease-in-out 1}
.fp-root .fx .fx-dash{stroke-dasharray:6 6;animation:fx-dash 2.2s linear 2}
/* reveal on scroll (fx.js adds .is-in); without JS everything stays visible */
.fx-js .fp-root .fx [data-fx-reveal]{opacity:0;transform:translateY(18px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.fx-js .fp-root .fx [data-fx-reveal].is-in{opacity:1;transform:none}
/* map card: raster mini map */
.fp-root .fx .fx-mapcard{position:relative;border-radius:var(--r-l);overflow:hidden;background:#E9EEF4 var(--map-a) center/cover no-repeat;box-shadow:var(--card-shadow)}
/* in short */
.fp-root .fx .fx-short{display:grid;grid-template-columns:150px minmax(0,1fr);gap:24px;align-items:start;padding:28px 0;border-bottom:1px solid var(--edge)}
.fp-root .fx .fx-short h2{font:500 12.5px/1.6 var(--mono);color:var(--acc-ink);text-transform:lowercase;margin:2px 0 0;letter-spacing:.01em}
.fp-root .fx .fx-short p{font-size:17px;line-height:1.55;color:var(--ink);max-width:62ch}
/* limits: dark band with a map underneath */
.fp-root .fx .fx-limit{position:relative;overflow:hidden;border-radius:var(--r-xl);padding:32px;background:#0F172A;color:#CBD5E1;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:28px}
.fp-root .fx .fx-limit::before{content:"";position:absolute;inset:0;background:url('/themes/t71/img/fx/map-band-dark.webp') center/cover no-repeat;opacity:.35}
.fp-root .fx .fx-limit>*{position:relative}
.fp-root .fx .fx-limit h2{color:#fff;margin:0}
.fp-root .fx .fx-limit p{color:#CBD5E1;font-size:16px;line-height:1.7}
/* sources + next */
.fp-root .fx .fx-sources{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin-top:18px}
.fp-root .fx .fx-sources a{display:block;background:var(--surface);border:1px solid var(--edge);border-radius:12px;padding:14px 16px;text-decoration:none;color:var(--ink);font-size:14px;line-height:1.4;transition:border-color .15s,box-shadow .15s}
.fp-root .fx .fx-sources a:hover{border-color:var(--edge-2);box-shadow:var(--shadow)}
.fp-root .fx .fx-sources a span{display:block;font:400 12px/1.4 var(--mono);color:var(--faint);margin-top:4px;word-break:break-all}
.fp-root .fx .fx-next{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-top:18px}
.fp-root .fx .fx-next a{position:relative;display:flex;flex-direction:column;gap:6px;background:var(--surface);border:1px solid var(--edge);border-radius:14px;padding:16px 16px 40px;text-decoration:none;color:var(--ink);font-size:15px;line-height:1.35;transition:border-color .15s,box-shadow .15s,transform .15s}
.fp-root .fx .fx-next a:hover{border-color:var(--acc);box-shadow:var(--shadow);transform:translateY(-2px)}
.fp-root .fx .fx-next a small{font:500 12px/1.2 var(--mono);color:var(--acc-ink);text-transform:lowercase}
.fp-root .fx .fx-next a::after{content:"";position:absolute;right:18px;bottom:18px;width:9px;height:9px;border-top:2px solid var(--faint);border-right:2px solid var(--faint);transform:rotate(45deg)}
@media (max-width:860px){
 .fp-root .fx .fx-w{padding:0 16px}
 .fp-root .fx .fx-line{font-size:16.5px}
 .fp-root .fx h1{font-size:28px;line-height:1.18}
 .fp-root .fx .fx-sec{padding:56px 0}
 .fp-root .fx .fx-short{grid-template-columns:1fr;gap:6px}
 .fp-root .fx .fx-limit{grid-template-columns:1fr;padding:22px}
 .fp-root .fx .fx-mappanel{left:12%;right:-16px;border-radius:20px 0 0 20px}
 .fp-root .fx .fx-phone{width:236px;border-radius:40px;padding:9px}
 .fp-root .fx .fx-screen{min-height:470px;border-radius:32px}
}

/* trust row under the first screen copy: checked date + number of official sources */
.fp-root .fx .fx-trust{display:flex;flex-wrap:wrap;gap:8px 18px;margin:20px 0 0;padding:0;list-style:none;font-size:13px;color:var(--mut)}
.fp-root .fx .fx-trust li{display:inline-flex;align-items:center;gap:6px}
.fp-root .fx .fx-trust svg{width:15px;height:15px;stroke:var(--acc-ink);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* backgrounds v2 (visuals/out: bg-mesh, bg-streak, bg-contours — generated, no real places) */
.fp-root .fx .fx-wash{position:relative;overflow:hidden;background:radial-gradient(ellipse at 66% 30%,#E6EEFC 0%,#F7F9FC 68%)}
.fp-root .fx .fx-wash::before{content:"";position:absolute;z-index:0;left:-6%;top:6%;width:70%;height:78%;background:url('/themes/t71/img/fx/bg-streak.svg') 0 50%/contain no-repeat;opacity:.35;pointer-events:none}
.fp-root .fx .fx-wash>.fx-w{position:relative;z-index:1}
.fp-root .fx .fx-topo{background:var(--canvas)}
.fp-root .fx .fx-topo.alt{background-color:#fff}
@media print{.fp-root .fx [data-fx-reveal]{opacity:1!important;transform:none!important}}
@media (prefers-reduced-motion:reduce){.fp-root .fx *,.fp-root .fx *::after{animation:none!important;transition:none!important}.fx-js .fp-root .fx [data-fx-reveal]{opacity:1;transform:none}}
