/* FoundSOS Dashboard — Profile design (scoped to .fsp) */
.fsp{
  --bg:#F4F6FB; --ink:#0B1220; --ink-2:#3A4660; --ink-3:#6B7896; --ink-4:#9AA6C0;
  --line:#E7EBF3; --card:#FFFFFF; --blue:#2C7BE5; --blue-2:#1E63D4;
  --blue-grad:linear-gradient(135deg,#3D8BF0,#1B5FCF);
  --orange:#FF7A1A; --orange-2:#F0600A;
  --orange-grad:linear-gradient(135deg,#FF9A3D,#F0600A);
  --green:#1FB67A; --red:#E6392B; --violet:#6A4FE0;
  --nav-bg:#0B1220; --nav-bg-2:#111A2E; --nav-line:rgba(255,255,255,.07);
  --nav-ink:#8893AE; --nav-ink-active:#FFFFFF;
  font-family:'Inter',system-ui,sans-serif;
  background:var(--bg); color:var(--ink);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  min-height:100vh;
}
.fsp *{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
.fsp .font-d{font-family:'Sora',sans-serif}
.fsp .mono{font-family:'JetBrains Mono',monospace}
.fsp a{color:inherit;text-decoration:none}

.fsp .app{display:flex;min-height:100vh}

/* SIDEBAR */
.fsp .sidebar{
  width:264px;flex-shrink:0;color:#fff;
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh;
  background:linear-gradient(180deg,#0B1220,#0E1730);
}
.fsp .sb-brand{display:flex;align-items:center;gap:12px;padding:26px 24px 22px}
.fsp .sb-brand .mark{width:42px;height:42px;border-radius:12px;background:var(--blue-grad);display:grid;place-items:center;box-shadow:0 8px 20px -6px rgba(44,123,229,.6)}
.fsp .sb-brand .mark svg{width:23px;height:23px}
.fsp .sb-brand .bt{font-family:'Sora';font-weight:800;font-size:19px;letter-spacing:-.4px;line-height:1}
.fsp .sb-brand .bt .s{color:#FF7A1A}
.fsp .sb-brand .bs{font-size:11px;color:var(--nav-ink);margin-top:3px;letter-spacing:.3px}
.fsp .sb-nav{padding:14px 16px;display:flex;flex-direction:column;gap:4px;flex:1;overflow-y:auto}
.fsp .sb-sec{font-size:10.5px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:#56627E;padding:16px 12px 8px}
.fsp .nav-item{display:flex;align-items:center;gap:13px;padding:12px 14px;border-radius:12px;color:var(--nav-ink);font-size:15px;font-weight:500;cursor:pointer;border:none;background:none;font-family:inherit;text-align:left;width:100%;transition:background .18s,color .18s;position:relative;text-decoration:none}
.fsp .nav-item svg{width:21px;height:21px;flex-shrink:0}
.fsp .nav-item:hover{background:rgba(255,255,255,.05);color:#fff}
.fsp .nav-item.active{background:rgba(44,123,229,.16);color:#fff}
.fsp .nav-item.active::before{content:"";position:absolute;left:-16px;top:50%;transform:translateY(-50%);width:4px;height:22px;border-radius:0 4px 4px 0;background:var(--blue)}
.fsp .nav-item .badge{margin-left:auto;background:var(--orange);color:#fff;font-size:11px;font-weight:700;min-width:20px;height:20px;border-radius:100px;display:grid;place-items:center;padding:0 6px}
.fsp .sb-user{margin:16px;padding:14px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid var(--nav-line);display:flex;align-items:center;gap:12px;cursor:pointer;transition:background .2s}
.fsp .sb-user:hover{background:rgba(255,255,255,.07)}
.fsp .sb-user .av{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#34C2F0,#2C7BE5);display:grid;place-items:center;font-weight:700;font-size:17px;color:#fff;flex-shrink:0}
.fsp .sb-user .ui{flex:1;min-width:0}
.fsp .sb-user .un{font-size:15px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fsp .sb-user .ue{font-size:12px;color:var(--nav-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fsp .sb-user .uc{color:var(--nav-ink);background:none;border:none;cursor:pointer;padding:6px;border-radius:8px}
.fsp .sb-user .uc:hover{background:rgba(255,255,255,.08);color:#fff}
.fsp .sb-user .uc svg{width:18px;height:18px}

/* MAIN */
.fsp .main{flex:1;min-width:0;display:flex;flex-direction:column}
.fsp .topbar{display:flex;align-items:center;gap:18px;padding:22px 36px;background:rgba(244,246,251,.85);backdrop-filter:blur(12px);position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line)}
.fsp .topbar .tb-search{flex:1;max-width:420px;display:flex;align-items:center;gap:11px;background:#fff;border:1px solid var(--line);border-radius:13px;padding:12px 16px;color:var(--ink-4)}
.fsp .topbar .tb-search svg{width:19px;height:19px;flex-shrink:0}
.fsp .topbar .tb-actions{margin-left:auto;display:flex;align-items:center;gap:12px;position:relative}
.fsp .tb-btn{width:46px;height:46px;border-radius:13px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;cursor:pointer;color:var(--ink-2);position:relative;transition:border-color .2s,transform .15s;font-family:inherit;font-size:13px;font-weight:600;padding:0 12px}
.fsp .tb-btn:hover{border-color:#D5DEEC}
.fsp .tb-btn.with-text{width:auto;gap:6px}
.fsp .tb-btn svg{width:21px;height:21px}
.fsp .tb-cta{display:flex;align-items:center;gap:9px;background:var(--ink);color:#fff;border:none;border-radius:13px;padding:0 20px;height:46px;font-family:inherit;font-size:15px;font-weight:600;cursor:pointer;text-decoration:none}
.fsp .tb-cta:hover{background:#1A2540}
.fsp .tb-cta svg{width:19px;height:19px}
.fsp .lang-menu{position:absolute;top:54px;right:0;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 20px 40px -16px rgba(11,18,32,.3);padding:8px;min-width:180px;z-index:30;display:flex;flex-direction:column;gap:2px}
.fsp .lang-menu button{display:flex;align-items:center;gap:10px;width:100%;background:none;border:none;border-radius:10px;padding:10px 12px;font-family:inherit;font-size:14px;color:var(--ink);cursor:pointer;text-align:left}
.fsp .lang-menu button:hover{background:#F4F6FB}
.fsp .lang-menu button.on{background:rgba(44,123,229,.1);color:var(--blue);font-weight:600}

.fsp .content{padding:32px 36px 60px;max-width:1280px;width:100%}
@keyframes fsp-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.fsp .rv{opacity:0;animation:fsp-rise .6s cubic-bezier(.22,.61,.36,1) forwards}
.fsp .d1{animation-delay:.04s}.fsp .d2{animation-delay:.1s}.fsp .d3{animation-delay:.16s}.fsp .d4{animation-delay:.22s}

/* HELLO */
.fsp .hello{margin-bottom:30px}
.fsp .hello .eyebrow{font-size:12px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--blue)}
.fsp .hello h1{font-family:'Sora';font-size:38px;font-weight:800;letter-spacing:-1.2px;margin:8px 0 0;line-height:1.05}
.fsp .hello h1 .wave{display:inline-block;animation:fsp-wave 2.4s ease-in-out infinite;transform-origin:70% 70%}
@keyframes fsp-wave{0%,60%,100%{transform:rotate(0)}10%{transform:rotate(14deg)}20%{transform:rotate(-8deg)}30%{transform:rotate(14deg)}40%{transform:rotate(-4deg)}50%{transform:rotate(10deg)}}
.fsp .hello p{font-size:17px;color:var(--ink-3);margin-top:8px}

/* STATS */
.fsp .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
.fsp .stat{position:relative;background:var(--card);border:none;border-radius:18px;padding:18px 20px;overflow:hidden;transition:transform .2s,box-shadow .2s;box-shadow:0 1px 2px rgba(11,18,32,.04),0 8px 20px -16px rgba(11,18,32,.3);display:flex;align-items:center;gap:15px}
.fsp .stat:hover{transform:translateY(-2px);box-shadow:0 1px 2px rgba(11,18,32,.04),0 16px 30px -18px rgba(11,18,32,.35)}
.fsp .stat .si{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;flex-shrink:0;box-shadow:0 8px 16px -8px rgba(11,18,32,.4)}
.fsp .stat .si svg{width:23px;height:23px;color:#fff}
.fsp .stat .stxt{min-width:0}
.fsp .stat .sv{font-family:'Sora';font-size:30px;font-weight:800;letter-spacing:-1px;line-height:1}
.fsp .stat .sl{font-size:13px;color:var(--ink-3);font-weight:500;margin-top:4px}
.fsp .stat .strend{position:absolute;top:14px;right:16px;font-size:11px;font-weight:700;padding:3px 8px;border-radius:7px}
.fsp .si-blue{background:var(--blue-grad)}
.fsp .si-slate{background:linear-gradient(135deg,#8895AE,#5A6680)}
.fsp .si-orange{background:var(--orange-grad)}
.fsp .si-green{background:linear-gradient(135deg,#2BD49B,#13A268)}
.fsp .trend-lost{background:rgba(230,57,43,.1);color:var(--red)}

/* PRIMARY ACTIONS */
.fsp .primary-actions{display:flex;flex-direction:column;gap:12px;margin-bottom:8px;max-width:420px}
.fsp .pa-add{display:flex;align-items:center;gap:12px;background:linear-gradient(100deg,#22B6F0,#2C7BE5);color:#fff;border:none;border-radius:16px;padding:18px 22px;font-family:inherit;font-size:18px;font-weight:600;cursor:pointer;box-shadow:0 12px 28px -10px rgba(44,123,229,.55);width:100%;text-align:left;text-decoration:none}
.fsp .pa-add:hover{box-shadow:0 16px 34px -10px rgba(44,123,229,.65)}
.fsp .pa-add .pa-ic{width:30px;height:30px;border-radius:9px;background:rgba(255,255,255,.22);display:grid;place-items:center;flex-shrink:0}
.fsp .pa-add .pa-ic svg{width:18px;height:18px}
.fsp .pa-buy{background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:16px;padding:18px 22px;font-family:inherit;font-size:18px;font-weight:600;cursor:pointer;box-shadow:0 1px 2px rgba(11,18,32,.04),0 8px 20px -16px rgba(11,18,32,.3);width:100%;text-align:left;text-decoration:none;display:block}
.fsp .pa-buy:hover{border-color:#D9E2F0}

/* SECTION HEAD */
.fsp .sec-head{display:flex;align-items:center;justify-content:space-between;margin:34px 0 16px}
.fsp .sec-head h2{font-family:'Sora';font-size:23px;font-weight:700;letter-spacing:-.5px;margin:0}
.fsp .sec-head .link{font-size:14px;font-weight:600;color:var(--blue);cursor:pointer;display:flex;align-items:center;gap:5px;text-decoration:none}
.fsp .sec-head .link svg{width:16px;height:16px}

/* TAG CARDS */
.fsp .tags{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.fsp .tag{display:flex;align-items:center;gap:18px;background:var(--card);border:1px solid var(--line);border-radius:20px;padding:18px;cursor:pointer;transition:transform .2s,box-shadow .2s,border-color .2s;position:relative;overflow:hidden;text-decoration:none;color:inherit}
.fsp .tag:hover{transform:translateY(-2px);box-shadow:0 18px 40px -24px rgba(11,18,32,.45);border-color:#D9E2F0}
.fsp .tag .ti{width:74px;height:74px;border-radius:17px;flex-shrink:0;display:grid;place-items:center;font-size:34px;overflow:hidden;background:linear-gradient(160deg,#EEF3FA,#E2EAF5)}
.fsp .tag .tb{flex:1;min-width:0}
.fsp .tag .tn{font-family:'Sora';font-size:19px;font-weight:700;letter-spacing:-.3px}
.fsp .tag .tmeta{display:flex;align-items:center;gap:10px;margin-top:7px;flex-wrap:wrap}
.fsp .pill{font-size:11.5px;font-weight:700;letter-spacing:.4px;padding:5px 11px;border-radius:100px;text-transform:uppercase;display:inline-flex;align-items:center;gap:6px}
.fsp .pill .pd{width:6px;height:6px;border-radius:50%}
.fsp .pill-lost{background:rgba(230,57,43,.1);color:var(--red)}
.fsp .pill-lost .pd{background:var(--red);animation:fsp-blink 1.4s infinite}
@keyframes fsp-blink{0%,100%{opacity:1}50%{opacity:.3}}
.fsp .pill-active{background:rgba(31,182,122,.12);color:#0E8A56}
.fsp .pill-active .pd{background:var(--green)}
.fsp .pill-inactive{background:rgba(107,120,150,.12);color:var(--ink-3)}
.fsp .pill-inactive .pd{background:var(--ink-4)}
.fsp .tag .tcode{font-size:13px;color:var(--ink-4);font-family:'JetBrains Mono'}
.fsp .tag .tscan{font-size:12.5px;color:var(--ink-4);margin-top:9px}
.fsp .tag .tchev{color:var(--ink-4);flex-shrink:0}
.fsp .tag .tchev svg{width:22px;height:22px}

/* empty state */
.fsp .empty{background:var(--card);border:1px dashed var(--line);border-radius:20px;padding:48px 24px;text-align:center}
.fsp .empty .ec{font-size:48px;margin-bottom:12px}
.fsp .empty h3{font-family:'Sora';font-size:20px;font-weight:700;margin:0 0 6px}
.fsp .empty p{color:var(--ink-3);font-size:14.5px;margin:0 0 18px}

/* LOST / STOLEN PANEL */
.fsp .lost-panel{
  border:1px solid #fecaca;
  background:linear-gradient(180deg,#fff7f7,#ffefef);
  border-radius:18px;
  padding:16px;
  margin:16px 0;
  box-shadow:0 6px 22px rgba(220,38,38,.08);
  overflow:hidden;
}
.fsp .lost-panel-head{
  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  align-items:center;
  gap:10px;
  margin-bottom:12px;
  min-width:0;
}
.fsp .lost-panel-alert{
  width:36px;
  height:36px;
  border-radius:12px;
  background:#dc2626;
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  line-height:1;
  flex-shrink:0;
}
.fsp .lost-panel-copy{min-width:0;display:grid;gap:3px}
.fsp .lost-panel .eyebrow{color:#991b1b;line-height:1.15;white-space:normal;overflow-wrap:break-word;text-wrap:auto}
.fsp .lost-panel-count{font-size:18px;color:#7f1d1d;line-height:1.15;white-space:normal;overflow-wrap:break-word}
.fsp .lost-panel-list{display:grid;gap:8px}
.fsp .lost-panel-item{
  display:grid;
  grid-template-columns:44px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  background:#fff;
  border:1px solid #fee2e2;
  border-radius:12px;
  text-decoration:none;
  color:inherit;
  min-width:0;
}
.fsp .lost-panel-emoji{font-size:22px;line-height:1;display:grid;place-items:center;min-width:0}
.fsp .lost-panel-tag-copy{min-width:0;display:grid;gap:2px}
.fsp .lost-panel-tag-name{font-weight:700;color:#111;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}
.fsp .lost-panel-tag-code{font-size:12px;color:#991b1b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}
.fsp .lost-panel-item .pill{justify-self:end;max-width:120px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;flex-shrink:0}

/* MOBILE */
.fsp .mobile-top{display:none}
.fsp .bottom-nav{display:none}

@media(max-width:1080px){
  .fsp .stats{grid-template-columns:repeat(2,1fr)}
  .fsp .content{padding:28px 24px 60px}
  .fsp .topbar{padding:18px 24px}
}

@media(max-width:760px){
  .fsp .sidebar{display:none}
  .fsp .topbar{display:none}
  .fsp .app{display:block}
  .fsp .content{padding:22px 18px 110px;max-width:100%}

  .fsp .mobile-top{display:block;position:sticky;top:0;z-index:60;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 8px 22px -18px rgba(15,23,42,.28)}
  .fsp .mt-bar{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 22px;gap:14px}
  .fsp .mt-brand{display:flex;align-items:center;gap:11px;min-width:0;white-space:nowrap;text-decoration:none}
  .fsp .mt-brand .mark{width:34px;height:34px;border-radius:10px;background:var(--blue-grad);display:grid;place-items:center;box-shadow:0 6px 20px -6px rgba(44,123,229,.55);flex:0 0 34px}
  .fsp .mt-brand .mark svg{width:18px;height:18px}
  .fsp .mt-brand .bt{font-family:'Work Sans','Sora',system-ui,sans-serif;font-weight:800;font-size:19px;letter-spacing:0;line-height:1;white-space:nowrap;display:inline-flex;align-items:baseline;color:var(--ink)}
  .fsp .mt-brand .bt .s{display:inline!important;line-height:1;white-space:nowrap}
  .fsp .mt-brand .bt .s{color:#FF7A1A}
  .fsp .mt-right{display:flex;align-items:center;gap:8px;position:relative;flex-shrink:0}
  .fsp .mt-icon{width:42px;height:42px;border-radius:12px;background:#F4F6FB;border:none;display:grid;place-items:center;color:var(--ink-2);position:relative;cursor:pointer;font-family:inherit;font-size:12px;font-weight:700;padding:0}
  .fsp .mt-icon svg{width:21px;height:21px}
  .fsp .mt-av{display:none!important}
  .fsp .mt-lang-btn{font-size:20px;line-height:1;touch-action:manipulation}
  .fsp .mt-lang-panel{
    position:absolute;
    top:calc(100% + 8px);
    left:14px;
    right:14px;
    z-index:80;
    display:grid;
    gap:6px;
    padding:8px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:16px;
    box-shadow:0 22px 50px -20px rgba(11,18,32,.38);
  }
  .fsp .mt-lang-panel button{
    min-width:0;
    width:100%;
    min-height:44px;
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:10px;
    padding:10px 12px;
    background:#F7F9FD;
    border:1px solid transparent;
    border-radius:12px;
    color:var(--ink);
    font-family:inherit;
    font-size:14px;
    font-weight:650;
    text-align:left;
    cursor:pointer;
  }
  .fsp .mt-lang-panel button.on{background:rgba(44,123,229,.1);border-color:rgba(44,123,229,.18);color:var(--blue)}
  .fsp .mt-lang-panel button span:nth-child(2){min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .fsp .mt-lang-code{font-size:11px;font-weight:800;color:var(--ink-4);letter-spacing:.06em}

  .fsp .hello{margin-bottom:22px}
  .fsp .hello h1{font-size:28px;letter-spacing:-.8px}
  .fsp .hello p{font-size:15px}
  .fsp .stats{gap:12px;margin-bottom:20px}
  .fsp .stat{padding:15px 16px;border-radius:16px;gap:13px}
  .fsp .stat .si{width:42px;height:42px;border-radius:12px}
  .fsp .stat .si svg{width:20px;height:20px}
  .fsp .stat .sv{font-size:26px}.fsp .stat .sl{font-size:12px}
  .fsp .primary-actions{max-width:100%;gap:11px}
  .fsp .pa-add,.fsp .pa-buy{padding:16px 18px;font-size:16px;border-radius:15px}
  .fsp .sec-head{margin:26px 0 14px}
  .fsp .sec-head h2{font-size:20px}
  .fsp .tags{grid-template-columns:1fr;gap:13px}
  .fsp .tag{padding:15px;border-radius:18px;gap:15px}
  .fsp .tag .ti{width:62px;height:62px;border-radius:15px;font-size:28px}
  .fsp .tag .tn{font-size:17px}

  .fsp .bottom-nav{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));position:fixed;bottom:0;left:0;right:0;z-index:40;background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border-top:1px solid var(--line);padding:8px 4px calc(8px + env(safe-area-inset-bottom))}
  .fsp .bn-item{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:4px 2px;border:none;background:none;cursor:pointer;color:var(--ink-4);font-family:inherit;position:relative;transition:color .2s;text-decoration:none;overflow:hidden}
  .fsp .bn-item svg{width:22px;height:22px;flex-shrink:0}
  .fsp .bn-item span{font-size:clamp(9px,2.5vw,11px);font-weight:600;line-height:1;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
  .fsp .bn-item.active{color:var(--blue)}

}

@media(prefers-reduced-motion:reduce){.fsp *{animation:none!important;transition:none!important}}

/* ============================================================
   Child route overrides — retheme legacy .ds-* classes to match
   the new .fsp Premium design (light, card-based, Sora+Inter).
   ============================================================ */

.fsp .ds-page,.fsp .ds-page-narrow{max-width:1100px;margin:0 auto;display:flex;flex-direction:column;gap:22px}
.fsp .ds-page-narrow{max-width:780px}

.fsp .ds-page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:4px}
.fsp .ds-page-head .ds-page-actions{display:flex;gap:10px;flex-wrap:wrap}
.fsp .ds-h1{font-family:'Sora',sans-serif;font-size:30px;font-weight:800;letter-spacing:-.8px;margin:0;line-height:1.1;color:var(--ink)}
.fsp .ds-h4{font-family:'Sora',sans-serif;font-size:18px;font-weight:700;letter-spacing:-.3px;margin:0 0 12px;color:var(--ink)}
.fsp .ds-sub,.fsp .ds-muted{color:var(--ink-3);font-size:14.5px;margin:6px 0 0}
.fsp .ds-eyebrow{font-size:11.5px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--blue)}
.fsp .ds-label{display:block;font-size:13px;font-weight:600;color:var(--ink-2);margin-bottom:8px;letter-spacing:.2px}

/* card / section */
.fsp .ds-card,.fsp .ds-section{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:22px;box-shadow:0 1px 2px rgba(11,18,32,.04),0 8px 20px -16px rgba(11,18,32,.3)}
.fsp .ds-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.fsp .ds-section + .ds-section,.fsp .ds-card + .ds-card{margin-top:16px}

/* form controls */
.fsp .ds-input,.fsp .ds-input-code,.fsp .ds-page input[type="text"],.fsp .ds-page input[type="email"],.fsp .ds-page input[type="tel"],.fsp .ds-page input[type="url"],.fsp .ds-page input[type="password"],.fsp .ds-page input[type="number"],.fsp .ds-page textarea,.fsp .ds-page select{
  width:100%;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;font-family:inherit;font-size:15px;color:var(--ink);transition:border-color .15s,box-shadow .15s;outline:none
}
.fsp .ds-input:focus,.fsp .ds-input-code:focus,.fsp .ds-page input:focus,.fsp .ds-page textarea:focus,.fsp .ds-page select:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(44,123,229,.12)}
.fsp .ds-input-code{font-family:'JetBrains Mono',monospace;letter-spacing:.5px}
.fsp .ds-page textarea{min-height:96px;resize:vertical}

/* buttons */
.fsp .ds-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 20px;border-radius:12px;border:1px solid var(--line);background:#fff;color:var(--ink);font-family:inherit;font-size:15px;font-weight:600;cursor:pointer;text-decoration:none;transition:border-color .15s,background .15s,transform .1s}
.fsp .ds-btn:hover{border-color:#D5DEEC}
.fsp .ds-btn:active{transform:translateY(1px)}
.fsp .ds-btn-primary{background:var(--blue-grad);border:none;color:#fff;box-shadow:0 8px 18px -8px rgba(44,123,229,.55)}
.fsp .ds-btn-primary:hover{box-shadow:0 12px 24px -10px rgba(44,123,229,.65)}
.fsp .ds-btn-ghost{background:transparent;border-color:transparent;color:var(--blue)}
.fsp .ds-btn-ghost:hover{background:rgba(44,123,229,.08);border-color:transparent}
.fsp .ds-btn-danger{background:var(--red);border:none;color:#fff}
.fsp .ds-btn-danger:hover{background:#C92F22}
.fsp .ds-btn-sm{height:36px;padding:0 14px;font-size:13.5px;border-radius:10px}

/* pills */
.fsp .ds-pill{font-size:11.5px;font-weight:700;letter-spacing:.4px;padding:5px 11px;border-radius:100px;text-transform:uppercase;display:inline-flex;align-items:center;gap:6px}
.fsp .ds-pill-active{background:rgba(31,182,122,.12);color:#0E8A56}
.fsp .ds-pill-inactive{background:rgba(107,120,150,.12);color:var(--ink-3)}
.fsp .ds-pill-lost{background:rgba(230,57,43,.1);color:var(--red)}
.fsp .ds-pill-private{background:rgba(106,79,224,.12);color:var(--violet)}

/* empty state */
.fsp .ds-empty{background:var(--card);border:1px dashed var(--line);border-radius:20px;padding:48px 24px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px}
.fsp .ds-empty-ic{font-size:46px;margin-bottom:4px}
.fsp .ds-empty h3{font-family:'Sora',sans-serif;font-size:20px;font-weight:700;margin:0}
.fsp .ds-empty p{color:var(--ink-3);font-size:14.5px;margin:0 0 12px;max-width:420px}

.fsp .ds-skeleton{height:160px;background:linear-gradient(90deg,#EEF2F8 0%,#F6F9FC 50%,#EEF2F8 100%);background-size:200% 100%;border-radius:16px;animation:fsp-skel 1.4s linear infinite}
@keyframes fsp-skel{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* tag list (legacy) */
.fsp .ds-tag-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px}
.fsp .ds-tag-row,.fsp .ds-tag-card{display:flex;align-items:center;gap:16px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px;text-decoration:none;color:inherit;transition:transform .15s,box-shadow .15s,border-color .15s}
.fsp .ds-tag-row:hover,.fsp .ds-tag-card:hover{transform:translateY(-2px);box-shadow:0 16px 34px -22px rgba(11,18,32,.4);border-color:#D9E2F0}
.fsp .ds-tag-ic{width:62px;height:62px;border-radius:15px;flex-shrink:0;display:grid;place-items:center;font-size:30px;overflow:hidden;background:linear-gradient(160deg,#EEF3FA,#E2EAF5)}
.fsp .ds-tag-ic img{width:100%;height:100%;object-fit:cover}
.fsp .ds-tag-body{flex:1;min-width:0}
.fsp .ds-tag-name{font-family:'Sora',sans-serif;font-size:17px;font-weight:700;letter-spacing:-.3px;color:var(--ink)}
.fsp .ds-tag-meta{display:flex;align-items:center;gap:8px;margin-top:6px;flex-wrap:wrap}
.fsp .ds-tag-cat,.fsp .ds-tag-slug{font-size:12.5px;color:var(--ink-4);font-family:'JetBrains Mono',monospace}
.fsp .ds-tag-scan{font-size:12.5px;color:var(--ink-4);margin-top:7px}
.fsp .ds-tag-go{color:var(--ink-4);flex-shrink:0}

/* category grid (tag new) */
.fsp .ds-cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}
.fsp .ds-cat{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 12px;background:var(--card);border:1.5px solid var(--line);border-radius:14px;cursor:pointer;transition:border-color .15s,transform .1s;text-align:center;font-family:inherit}
.fsp .ds-cat:hover{border-color:#D5DEEC}
.fsp .ds-cat.active,.fsp .ds-cat[aria-pressed="true"]{border-color:var(--blue);background:rgba(44,123,229,.06);box-shadow:0 8px 18px -10px rgba(44,123,229,.4)}
.fsp .ds-cat-emoji{font-size:30px}
.fsp .ds-cat-lbl{font-size:13px;font-weight:600;color:var(--ink-2)}

/* toggles */
.fsp .ds-toggle-grid{display:grid;grid-template-columns:1fr;gap:12px}
.fsp .ds-toggle{display:flex;align-items:center;gap:14px;padding:14px 16px;background:var(--card);border:1px solid var(--line);border-radius:14px}
.fsp .ds-toggle-text{flex:1;min-width:0}
.fsp .ds-toggle-lbl{font-size:14.5px;font-weight:600;color:var(--ink)}
.fsp .ds-toggle-hint{font-size:12.5px;color:var(--ink-3);margin-top:3px}
.fsp .ds-toggle-sw{position:relative;width:46px;height:26px;border-radius:100px;background:#D9DFEA;transition:background .15s;flex-shrink:0;cursor:pointer;border:none}
.fsp .ds-toggle-sw[aria-checked="true"],.fsp .ds-toggle-sw.on{background:var(--blue)}
.fsp .ds-toggle-knob{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 4px rgba(0,0,0,.2);transition:transform .15s}
.fsp .ds-toggle-sw[aria-checked="true"] .ds-toggle-knob,.fsp .ds-toggle-sw.on .ds-toggle-knob{transform:translateX(20px)}

/* status row */
.fsp .ds-status-row{display:flex;gap:10px;flex-wrap:wrap}
.fsp .ds-status-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border:1.5px solid var(--line);background:#fff;border-radius:100px;font-family:inherit;font-size:13.5px;font-weight:600;color:var(--ink-2);cursor:pointer;transition:border-color .15s,background .15s}
.fsp .ds-status-btn.active,.fsp .ds-status-btn[aria-pressed="true"]{border-color:var(--blue);background:rgba(44,123,229,.08);color:var(--blue)}

/* URL row */
.fsp .ds-url-row{display:flex;align-items:center;gap:10px;background:#F4F6FB;border:1px solid var(--line);border-radius:12px;padding:10px 14px}
.fsp .ds-url{flex:1;min-width:0;font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* steps */
.fsp .ds-steps{display:flex;align-items:center;gap:12px;margin-bottom:24px}
.fsp .ds-step-dot{width:32px;height:32px;border-radius:50%;background:#E7EBF3;color:var(--ink-3);display:grid;place-items:center;font-weight:700;font-size:13.5px}
.fsp .ds-step-dot.active{background:var(--blue-grad);color:#fff;box-shadow:0 6px 14px -6px rgba(44,123,229,.6)}
.fsp .ds-step-dot.done{background:var(--green);color:#fff}
.fsp .ds-step-bar{flex:1;height:2px;background:#E7EBF3;border-radius:2px}
.fsp .ds-step-bar.done{background:var(--green)}
.fsp .ds-step-lbl{font-size:12.5px;font-weight:600;color:var(--ink-3)}

/* grid helpers */
.fsp .ds-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fsp .ds-span-2{grid-column:span 2}
@media(max-width:680px){.fsp .ds-grid{grid-template-columns:1fr}.fsp .ds-span-2{grid-column:span 1}}

/* hide legacy chrome — provided by .fsp shell */
.fsp .ds-wrap{display:contents}
.fsp .ds-sidebar,.fsp .ds-topbar,.fsp .ds-tabbar,.fsp .ds-brand,.fsp .ds-brand-mobile{display:none!important}
.fsp .ds-main{flex:1;min-width:0}
.fsp .ds-content{padding:0}
.fsp .ds-hello,.fsp .ds-stats,.fsp .ds-cta-row{display:none}

/* messages thread list */
.fsp .ds-thread-list,.fsp .thread-list{display:flex;flex-direction:column;gap:10px}
.fsp .ds-thread,.fsp .thread{display:flex;align-items:center;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px 16px;cursor:pointer;text-decoration:none;color:inherit;transition:border-color .15s,transform .1s,box-shadow .15s}
.fsp .ds-thread:hover,.fsp .thread:hover{border-color:#D9E2F0;transform:translateY(-1px);box-shadow:0 12px 28px -18px rgba(11,18,32,.35)}
.fsp .thread .av{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#34C2F0,#2C7BE5);display:grid;place-items:center;color:#fff;font-weight:700;flex-shrink:0}
.fsp .thread .tb-body{flex:1;min-width:0}
.fsp .thread .tb-name{font-weight:700;font-size:15px;color:var(--ink)}
.fsp .thread .tb-last{font-size:13.5px;color:var(--ink-3);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fsp .thread .tb-badge{margin-left:auto;background:var(--orange);color:#fff;font-size:11px;font-weight:700;min-width:22px;height:22px;border-radius:100px;padding:0 7px;display:grid;place-items:center}

/* tables */
.fsp table{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.fsp th,.fsp td{padding:12px 14px;text-align:left;font-size:14px;border-bottom:1px solid var(--line)}
.fsp th{font-size:12px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--ink-3);background:#FAFBFE}
.fsp tr:last-child td{border-bottom:none}

@media(max-width:760px){
  .fsp .ds-page,.fsp .ds-page-narrow{gap:18px}
  .fsp .ds-h1{font-size:24px}
  .fsp .ds-card,.fsp .ds-section{padding:18px;border-radius:16px}
  .fsp .ds-tag-list{grid-template-columns:1fr}
  .fsp .ds-cat-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}
}

/* ============================================================
   Messages list — retheme legacy .msg-* to Premium light
   ============================================================ */
.fsp .msg-toolbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.fsp .msg-toolbar .ds-input{max-width:380px}
.fsp .msg-filters{display:flex;gap:8px;flex-wrap:wrap}
.fsp .msg-chip{background:#fff;border:1px solid var(--line);color:var(--ink-2);font-family:inherit;font-size:13.5px;font-weight:600;padding:8px 14px;border-radius:100px;cursor:pointer;transition:all .15s}
.fsp .msg-chip:hover{border-color:#D5DEEC;background:#FAFBFD}
.fsp .msg-chip.is-on{background:var(--orange);border-color:var(--orange);color:#fff}
.fsp .msg-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.fsp .msg-row{display:flex;align-items:center;gap:15px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px 18px;cursor:pointer;text-decoration:none;color:inherit;transition:transform .15s,box-shadow .15s,border-color .15s;position:relative}
.fsp .msg-row:hover{transform:translateY(-2px);box-shadow:0 16px 32px -22px rgba(11,18,32,.4);border-color:#D9E2F0;background:#fff}
.fsp .msg-row.has-unread{background:linear-gradient(100deg,rgba(44,123,229,.05),#fff)}
.fsp .msg-row-avatar{width:52px;height:52px;border-radius:15px;background:var(--orange-grad);display:grid;place-items:center;color:#fff;font-weight:700;font-size:19px;flex-shrink:0;box-shadow:0 6px 14px -6px rgba(240,96,10,.5)}
.fsp .msg-row-main{flex:1;min-width:0}
.fsp .msg-row-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.fsp .msg-row-top strong{font-family:'Sora',sans-serif;font-size:16px;font-weight:700;color:var(--ink)}
.fsp .msg-row-time{font-size:12.5px;color:var(--ink-4);flex-shrink:0;font-weight:500}
.fsp .msg-row-sub{display:flex;gap:8px;font-size:12.5px;color:var(--ink-4);margin:3px 0;align-items:center;flex-wrap:wrap}
.fsp .msg-row-finder{font-family:'JetBrains Mono',monospace;color:var(--ink-4)}
.fsp .msg-row-preview{font-size:14px;color:var(--ink-3);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fsp .msg-row.has-unread .msg-row-preview{color:var(--ink-2);font-weight:500}
.fsp .msg-badge{margin-left:auto;background:var(--blue);color:#fff;font-size:11.5px;font-weight:700;min-width:22px;height:22px;border-radius:100px;padding:0 7px;display:grid;place-items:center;flex-shrink:0;box-shadow:0 4px 10px -3px rgba(44,123,229,.5)}
.fsp .msg-status{font-size:10.5px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;padding:3px 9px;border-radius:100px}
.fsp .msg-status-muted{background:rgba(154,166,192,.18);color:var(--ink-3)}
.fsp .msg-status-closed{background:rgba(154,166,192,.18);color:var(--ink-3)}
.fsp .msg-status-blocked{background:rgba(230,57,43,.12);color:var(--red)}

/* ============================================================
   Chat thread view — retheme .chat-* to Premium light
   ============================================================ */
.fsp .chat-page{display:flex;flex-direction:column;gap:14px;height:calc(100vh - 140px);min-height:560px}
.fsp .chat-header{display:flex;align-items:center;gap:13px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:14px 16px;box-shadow:0 1px 2px rgba(11,18,32,.04),0 8px 20px -16px rgba(11,18,32,.3)}
.fsp .chat-back{width:42px;height:42px;border-radius:12px;background:#F4F6FB;border:1px solid var(--line);display:grid;place-items:center;color:var(--ink-2);cursor:pointer;flex-shrink:0;text-decoration:none;font-size:18px;font-weight:700;transition:border-color .15s,background .15s}
.fsp .chat-back:hover{border-color:#D5DEEC;background:#fff}
.fsp .chat-header-avatar{width:48px;height:48px;border-radius:14px;background:var(--orange-grad);display:grid;place-items:center;color:#fff;font-weight:700;font-size:18px;flex-shrink:0;box-shadow:0 6px 14px -6px rgba(240,96,10,.5)}
.fsp .chat-header-main{flex:1;min-width:0}
.fsp .chat-header-main strong{display:block;font-family:'Sora',sans-serif;font-size:17px;font-weight:700;color:var(--ink)}
.fsp .chat-header-sub{font-size:12.5px;color:var(--ink-4);margin-top:2px;font-family:'JetBrains Mono',monospace}
.fsp .chat-toolbar{display:flex;gap:8px;flex-wrap:wrap;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px 12px}
.fsp .chat-tool{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:10px;background:#F4F6FB;border:1px solid var(--line);color:var(--ink-2);font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:all .15s}
.fsp .chat-tool:hover{border-color:#D5DEEC;background:#fff}
.fsp .chat-tool-danger{background:rgba(230,57,43,.06);border-color:rgba(230,57,43,.2);color:var(--red)}
.fsp .chat-tool-danger:hover{background:rgba(230,57,43,.12);border-color:rgba(230,57,43,.35)}
.fsp .chat-tag-btn{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:10px;background:rgba(44,123,229,.08);border:1px solid rgba(44,123,229,.18);color:var(--blue);font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;text-decoration:none}
.fsp .chat-scroll{flex:1;min-height:0;overflow-y:auto;background:var(--card);border:1px solid var(--line);border-radius:20px;padding:20px;display:flex;flex-direction:column;gap:12px}
.fsp .chat-bubble{max-width:78%;display:flex;flex-direction:column}
.fsp .chat-bubble.in,.fsp .chat-bubble-in{align-self:flex-start;align-items:flex-start}
.fsp .chat-bubble.out,.fsp .chat-bubble-out{align-self:flex-end;align-items:flex-end}
.fsp .chat-bubble-body{padding:12px 16px;border-radius:17px;font-size:15px;line-height:1.45;word-wrap:break-word}
.fsp .chat-bubble.in .chat-bubble-body,.fsp .chat-bubble-in .chat-bubble-body{background:#EEF1F7;color:var(--ink);border-bottom-left-radius:6px}
.fsp .chat-bubble.out .chat-bubble-body,.fsp .chat-bubble-out .chat-bubble-body{background:var(--blue-grad);color:#fff;border-bottom-right-radius:6px;box-shadow:0 6px 14px -6px rgba(44,123,229,.4)}
.fsp .chat-bubble-meta{font-size:11.5px;color:var(--ink-4);margin-top:5px;padding:0 4px}
.fsp .chat-loc-cta,.fsp .chat-loc-main{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:13px;background:rgba(44,123,229,.1);color:var(--blue);font-weight:600;text-decoration:none;font-size:14px;border:1px solid rgba(44,123,229,.2)}
.fsp .chat-loc-cta:hover,.fsp .chat-loc-main:hover{background:rgba(44,123,229,.16)}
.fsp .chat-loc-ic,.fsp .chat-loc-pin{font-size:18px}
.fsp .chat-locked{background:rgba(154,166,192,.1);border:1px dashed var(--line);border-radius:14px;padding:14px 18px;color:var(--ink-3);text-align:center;font-size:14px}
.fsp .chat-composer{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:10px 12px;box-shadow:0 1px 2px rgba(11,18,32,.04),0 8px 20px -16px rgba(11,18,32,.3)}
.fsp .chat-textarea{flex:1;background:#F4F6FB;border:1.5px solid transparent;border-radius:14px;padding:12px 16px;font-family:inherit;font-size:15.5px;color:var(--ink);resize:none;outline:none;min-height:46px;max-height:140px;transition:border-color .15s,background .15s;line-height:1.4}
.fsp .chat-textarea:focus{border-color:#B8D2F5;background:#fff}
.fsp .chat-textarea::placeholder{color:var(--ink-4)}
.fsp .chat-send{width:48px;height:48px;border-radius:50%;background:var(--blue-grad);border:none;display:grid;place-items:center;color:#fff;cursor:pointer;flex-shrink:0;font-size:18px;font-weight:700;box-shadow:0 8px 18px -6px rgba(44,123,229,.5);transition:transform .15s}
.fsp .chat-send:hover{transform:scale(1.05)}
.fsp .chat-send:disabled{background:#D4DCE7;cursor:default;box-shadow:none;transform:none}
.fsp .chat-quick{display:flex;gap:8px;overflow-x:auto;padding:0 2px}
.fsp .chat-quick::-webkit-scrollbar{display:none}
.fsp .chat-quick-btn{white-space:nowrap;background:#fff;border:1.5px solid var(--line);color:var(--ink);font-family:inherit;font-size:13.5px;font-weight:600;padding:9px 15px;border-radius:100px;cursor:pointer;flex-shrink:0;transition:all .15s}
.fsp .chat-quick-btn:hover{border-color:var(--blue);color:var(--blue);background:rgba(44,123,229,.06)}

/* ============================================================
   Scans page — retheme .scan-* to Premium light
   ============================================================ */
.fsp .scan-map-card{background:var(--card);border:1px solid var(--line);border-radius:20px;overflow:hidden;margin-bottom:18px;box-shadow:0 1px 2px rgba(11,18,32,.04),0 8px 20px -16px rgba(11,18,32,.3)}
.fsp .scan-map{height:340px;width:100%}
.fsp .scan-map-empty{padding:60px 20px;text-align:center;color:var(--ink-3);font-size:14.5px}
.fsp .scan-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.fsp .scan-row{display:flex;align-items:center;gap:15px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px 18px;transition:transform .15s,box-shadow .15s,border-color .15s}
.fsp .scan-row:hover{transform:translateY(-1px);box-shadow:0 12px 28px -20px rgba(11,18,32,.4);border-color:#D9E2F0}
.fsp .scan-row-icon{width:46px;height:46px;border-radius:13px;background:linear-gradient(135deg,#EEF3FA,#E2EAF5);display:grid;place-items:center;font-size:22px;flex-shrink:0}
.fsp .scan-row-main{flex:1;min-width:0}
.fsp .scan-row-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.fsp .scan-row-top strong{font-family:'Sora',sans-serif;font-size:15.5px;font-weight:700;color:var(--ink)}
.fsp .scan-row-time{font-size:12.5px;color:var(--ink-4);flex-shrink:0}
.fsp .scan-row-sub{display:flex;gap:10px;font-size:12.5px;color:var(--ink-4);margin-top:4px;flex-wrap:wrap;align-items:center}
.fsp .scan-badge{background:rgba(44,123,229,.1);color:var(--blue);padding:3px 9px;border-radius:100px;font-weight:700;font-size:11.5px}
.fsp .scan-row-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.fsp .scan-chat-link{display:inline-flex;align-items:center;gap:6px;background:var(--blue-grad);color:#fff;text-decoration:none;padding:8px 13px;border-radius:10px;font-size:13px;font-weight:700;box-shadow:0 6px 14px -6px rgba(44,123,229,.5)}
.fsp .scan-row-link{color:var(--ink-4);text-decoration:none;font-size:22px;font-weight:700;padding:0 8px}
.fsp .scan-row-link:hover{color:var(--blue)}

/* phone preview frame — clean, light, professional */
.fsp .phone-preview-wrap{display:flex;justify-content:center;padding:18px 0}
.fsp .phone-frame{
  position:relative;
  width:300px;
  aspect-ratio: 9 / 19.5;
  background:#fff;
  border:1px solid #E5E9F0;
  border-radius:38px;
  padding:8px;
  box-shadow:
    0 1px 0 rgba(255,255,255,.9) inset,
    0 0 0 1px rgba(11,18,32,.04),
    0 30px 60px -28px rgba(11,18,32,.28),
    0 10px 24px -16px rgba(11,18,32,.18);
  overflow:hidden;
}
.fsp .phone-frame::before{
  content:"";position:absolute;inset:0;border-radius:38px;pointer-events:none;
  box-shadow:0 0 0 1px rgba(255,255,255,.6) inset;
}
.fsp .phone-notch{
  position:absolute;top:14px;left:50%;transform:translateX(-50%);
  width:96px;height:22px;background:#0B1220;border-radius:100px;z-index:2;
  box-shadow:0 1px 2px rgba(0,0,0,.25) inset;
}
.fsp .phone-iframe{
  width:100%;height:100%;border:0;border-radius:30px;background:#fff;display:block;
}


/* emergency contacts editor (ds-ec) */
.fsp .ds-ec{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.fsp .ds-ec-foot{display:flex;justify-content:flex-end;gap:10px;margin-top:8px}
.fsp .ds-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}

@media(max-width:760px){
  .fsp .chat-page{height:calc(100vh - 180px);min-height:480px}
  .fsp .chat-scroll{padding:14px}
  .fsp .chat-header{padding:12px 14px;border-radius:16px}
  .fsp .chat-header-avatar{width:42px;height:42px;border-radius:12px;font-size:16px}
  .fsp .chat-toolbar{padding:8px 10px;gap:6px}
  .fsp .chat-tool,.fsp .chat-tag-btn{padding:7px 11px;font-size:12.5px}
  .fsp .chat-bubble{max-width:88%}
  .fsp .chat-composer{padding:8px 10px;border-radius:16px}
  .fsp .chat-send{width:44px;height:44px}
  .fsp .msg-row{padding:14px 15px;border-radius:16px;gap:13px}
  .fsp .msg-row-avatar{width:46px;height:46px;border-radius:13px;font-size:17px}
  .fsp .scan-row{padding:14px;border-radius:16px;gap:12px;flex-wrap:wrap}
  .fsp .scan-row-actions{flex-direction:row;width:100%;justify-content:flex-end}
  .fsp .phone-frame{width:88vw;max-width:340px}
}

/* ============================================================
   FULL DESIGN CLASSES from foundsos-profile.html (scoped to .fsp)
   ============================================================ */

/* SCREEN HEADS */
.fsp .scr-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:24px;gap:12px;flex-wrap:wrap}
.fsp .scr-head .eyebrow{font-size:12px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--blue)}
.fsp .scr-head h1{font-family:'Sora',sans-serif;font-size:34px;font-weight:800;letter-spacing:-1px;margin-top:8px;line-height:1.05}
.fsp .scr-count{font-size:14px;color:var(--ink-3);font-weight:500}

/* MESSAGES — inbox `.msg-item` (design 1:1) */
.fsp .msg-search{display:flex;align-items:center;gap:11px;background:#fff;border:1px solid var(--line);border-radius:15px;padding:15px 18px;color:var(--ink-4);margin-bottom:16px;box-shadow:0 1px 2px rgba(11,18,32,.04),0 8px 20px -16px rgba(11,18,32,.3)}
.fsp .msg-search svg{width:20px;height:20px;flex-shrink:0}
.fsp .msg-search input{flex:1;border:none;outline:none;background:none;font-family:inherit;font-size:16px;color:var(--ink)}
.fsp .msg-search input::placeholder{color:var(--ink-4)}
.fsp .mf{white-space:nowrap;background:#fff;border:1px solid var(--line);color:var(--ink-2);font-family:inherit;font-size:14px;font-weight:600;padding:9px 16px;border-radius:100px;cursor:pointer;flex-shrink:0;transition:all .18s;display:inline-flex;align-items:center;gap:7px}
.fsp .mf:hover{border-color:#D9E2F0}
.fsp .mf.active{background:var(--orange);border-color:var(--orange);color:#fff}
.fsp .mf-n{background:var(--orange);color:#fff;font-size:11px;min-width:18px;height:18px;border-radius:100px;display:grid;place-items:center;padding:0 5px;font-weight:700}
.fsp .mf.active .mf-n{background:rgba(255,255,255,.3);color:#fff}
.fsp .msg-filters{display:flex;gap:9px;overflow-x:auto;margin-bottom:18px;padding-bottom:2px;flex-wrap:wrap}
.fsp .msg-filters::-webkit-scrollbar{display:none}
.fsp .msg-item{display:flex;align-items:center;gap:15px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px 18px;cursor:pointer;text-decoration:none;color:inherit;transition:transform .18s,box-shadow .2s,border-color .2s;position:relative}
.fsp .msg-item:hover{transform:translateY(-2px);box-shadow:0 16px 32px -22px rgba(11,18,32,.4);border-color:#D9E2F0}
.fsp .msg-item.unread{background:linear-gradient(100deg,rgba(44,123,229,.04),#fff)}
.fsp .mi-av{width:54px;height:54px;border-radius:15px;display:grid;place-items:center;font-weight:700;font-size:19px;color:#fff;flex-shrink:0;background:var(--orange-grad);box-shadow:0 6px 14px -6px rgba(240,96,10,.5)}
.fsp .mi-av.tonk{background:var(--orange-grad)}
.fsp .mi-av.dog{background:linear-gradient(135deg,#34C2F0,#2C7BE5);box-shadow:0 6px 14px -6px rgba(44,123,229,.5)}
.fsp .mi-body{flex:1;min-width:0}
.fsp .mi-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.fsp .mi-name{font-family:'Sora',sans-serif;font-size:17px;font-weight:700;color:var(--ink)}
.fsp .mi-time{font-size:12.5px;color:var(--ink-4);flex-shrink:0}
.fsp .mi-finder{font-size:12.5px;color:var(--ink-4);font-family:'JetBrains Mono',monospace;margin-top:2px}
.fsp .mi-prev{font-size:14.5px;color:var(--ink-3);margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fsp .msg-item.unread .mi-prev{color:var(--ink-2);font-weight:500}
.fsp .mi-dot{width:10px;height:10px;border-radius:50%;background:var(--blue);flex-shrink:0}

/* CONVERSATION (chat) — `.conv-*` design 1:1 */
.fsp .conv-head{display:flex;align-items:center;gap:13px;margin-bottom:18px;position:sticky;top:0;z-index:25;background:var(--bg);padding:12px 0;flex-wrap:wrap}
.fsp .conv-back,.fsp .conv-menu,.fsp .conv-del,.fsp .conv-close{width:44px;height:44px;border-radius:13px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;color:var(--ink-2);cursor:pointer;flex-shrink:0;transition:border-color .2s,background .2s}
.fsp .conv-back:hover,.fsp .conv-menu:hover{border-color:#D9E2F0}
.fsp .conv-back svg,.fsp .conv-menu svg,.fsp .conv-close svg{width:22px;height:22px}
.fsp .conv-del{background:rgba(230,57,43,.06);border-color:rgba(230,57,43,.2);color:var(--red)}
.fsp .conv-del:hover{background:rgba(230,57,43,.12);border-color:rgba(230,57,43,.35)}
.fsp .conv-close:hover{border-color:#FBD9D5;background:rgba(230,57,43,.05);color:var(--red)}
.fsp .conv-av{width:50px;height:50px;border-radius:14px;background:var(--orange-grad);display:grid;place-items:center;font-weight:700;font-size:18px;color:#fff;flex-shrink:0;box-shadow:0 6px 14px -6px rgba(240,96,10,.5)}
.fsp .conv-who{flex:1;min-width:0}
.fsp .conv-who .cn{font-family:'Sora',sans-serif;font-size:19px;font-weight:700;color:var(--ink)}
.fsp .conv-who .cf{font-size:12.5px;color:var(--ink-4);font-family:'JetBrains Mono',monospace;margin-top:2px}
.fsp .conv-who .lost-tag{color:var(--red);font-weight:600}
.fsp .conv-body{background:#fff;border:1px solid var(--line);border-radius:22px;padding:22px;display:flex;flex-direction:column;gap:12px;margin-bottom:14px;min-height:340px;overflow-y:auto;max-height:60vh}
.fsp .conv-loc{border-radius:16px;overflow:hidden;border:1px solid var(--line);margin-bottom:6px}
.fsp .conv-loc .cl-map{height:140px;background:linear-gradient(135deg,#CFE0F5,#A9C6EC);position:relative}
.fsp .conv-loc .cl-foot{display:flex;align-items:center;gap:12px;padding:13px 16px;background:#fff}
.fsp .conv-loc .cl-info{flex:1;min-width:0}
.fsp .conv-loc .cl-t{font-size:15px;font-weight:700;color:var(--ink)}
.fsp .conv-loc .cl-c{font-size:13px;color:var(--ink-4);margin-top:2px;font-family:'JetBrains Mono',monospace}
.fsp .conv-loc .cl-open{background:rgba(44,123,229,.1);color:var(--blue);border:none;border-radius:11px;padding:10px 14px;font-family:inherit;font-size:13.5px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:5px;flex-shrink:0;text-decoration:none}
.fsp .conv-loc .cl-open:hover{background:rgba(44,123,229,.18)}
@keyframes fsp-cpop{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}
.fsp .cmsg{display:flex;flex-direction:column;max-width:78%;animation:fsp-cpop .35s cubic-bezier(.22,.61,.36,1)}
.fsp .cmsg.in{align-self:flex-start;align-items:flex-start}
.fsp .cmsg.out{align-self:flex-end;align-items:flex-end}
.fsp .cmsg .cb{padding:12px 16px;border-radius:17px;font-size:15.5px;line-height:1.4;word-wrap:break-word}
.fsp .cmsg.in .cb{background:#EEF1F7;color:var(--ink);border-bottom-left-radius:6px}
.fsp .cmsg.out .cb{background:var(--blue-grad);color:#fff;border-bottom-right-radius:6px;box-shadow:0 6px 14px -6px rgba(44,123,229,.4)}
.fsp .cmsg .ct{font-size:11.5px;color:var(--ink-4);margin-top:5px;padding:0 4px}
.fsp .conv-quick{display:flex;gap:9px;overflow-x:auto;margin-bottom:12px;padding-bottom:2px}
.fsp .conv-quick::-webkit-scrollbar{display:none}
.fsp .cq{white-space:nowrap;background:#fff;border:1.5px solid #E0E8F3;color:var(--ink);font-family:inherit;font-size:14px;font-weight:600;padding:10px 16px;border-radius:100px;cursor:pointer;flex-shrink:0;transition:all .15s}
.fsp .cq:hover{border-color:var(--blue);color:var(--blue);background:rgba(44,123,229,.04)}
.fsp .conv-input{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:10px 12px}
.fsp .ci-attach{width:46px;height:46px;border-radius:13px;background:#F4F6FB;border:none;display:grid;place-items:center;color:var(--ink-3);cursor:pointer;flex-shrink:0;transition:background .2s}
.fsp .ci-attach svg{width:23px;height:23px}
.fsp .ci-field{flex:1;background:#F4F6FB;border:1.5px solid transparent;border-radius:100px;padding:0 8px;transition:border-color .2s,background .2s;display:flex;align-items:center}
.fsp .ci-field:focus-within{border-color:#B8D2F5;background:#fff}
.fsp .ci-field input,.fsp .ci-field textarea{width:100%;border:none;outline:none;font-family:inherit;font-size:16px;color:var(--ink);background:none;padding:13px 12px;resize:none;line-height:1.4}
.fsp .ci-field input::placeholder,.fsp .ci-field textarea::placeholder{color:var(--ink-4)}
.fsp .ci-send{position:relative;width:50px;height:50px;border-radius:50%;background:#D4DCE7;border:none;display:grid;place-items:center;cursor:pointer;flex-shrink:0;transition:background .3s,transform .2s cubic-bezier(.34,1.56,.64,1);color:#fff}
.fsp .ci-send svg{width:21px;height:21px}
.fsp .ci-send:disabled{cursor:default}
.fsp .ci-send.ready{background:var(--blue-grad);box-shadow:0 8px 18px -6px rgba(44,123,229,.5)}

/* TAG EDITOR — `.ed-*`, `.chip`, `.fld`, `.switch`, `.tog-row` */
.fsp .ed-head{display:flex;align-items:center;gap:13px;margin-bottom:20px;flex-wrap:wrap}
.fsp .ed-back{width:44px;height:44px;border-radius:13px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;color:var(--ink-2);cursor:pointer;flex-shrink:0;text-decoration:none}
.fsp .ed-back:hover{border-color:#D9E2F0}
.fsp .ed-htxt{flex:1;min-width:0}
.fsp .ed-htxt .eyebrow{font-size:11px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--blue)}
.fsp .ed-htxt h1{font-family:'Sora',sans-serif;font-size:26px;font-weight:800;letter-spacing:-.6px;margin-top:3px;color:var(--ink)}
.fsp .ed-save{display:inline-flex;align-items:center;gap:8px;background:var(--blue-grad);color:#fff;border:none;border-radius:13px;padding:0 18px;height:46px;font-family:inherit;font-size:15px;font-weight:700;cursor:pointer;flex-shrink:0;box-shadow:0 10px 22px -8px rgba(44,123,229,.5);text-decoration:none}
.fsp .ed-save:disabled{opacity:.6;cursor:default}
.fsp .ed-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:24px;margin-bottom:16px;box-shadow:0 1px 2px rgba(11,18,32,.03),0 10px 24px -20px rgba(11,18,32,.3)}
.fsp .ed-clbl{font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--ink-4);margin-bottom:14px}
.fsp .ed-title{font-family:'Sora',sans-serif;font-size:20px;font-weight:700;letter-spacing:-.4px;margin:0 0 18px;color:var(--ink)}
.fsp .ed-desc{font-size:14px;color:var(--ink-3);margin:-8px 0 18px;line-height:1.5}
.fsp .chips{display:flex;flex-wrap:wrap;gap:10px}
.fsp .chip{background:#fff;border:1.5px solid var(--line);color:var(--ink-2);font-family:inherit;font-size:15px;font-weight:600;padding:11px 20px;border-radius:100px;cursor:pointer;transition:all .18s}
.fsp .chip:hover{border-color:#D9E2F0}
.fsp .chip.active{background:rgba(44,123,229,.1);border-color:var(--blue);color:var(--blue)}
.fsp .chip.lost.active{background:rgba(230,57,43,.1);border-color:var(--red);color:var(--red)}
.fsp .fld{margin-bottom:16px}
.fsp .fld:last-child{margin-bottom:0}
.fsp .fld label{display:block;font-size:13.5px;font-weight:600;color:var(--ink-2);margin-bottom:8px}
.fsp .fld input,.fsp .fld textarea,.fsp .fld select{width:100%;border:1.5px solid var(--line);background:#FAFBFD;border-radius:14px;padding:15px 16px;font-family:inherit;font-size:16px;color:var(--ink);outline:none;transition:border-color .2s,background .2s}
.fsp .fld textarea{min-height:88px;resize:vertical;line-height:1.5}
.fsp .fld input:focus,.fsp .fld textarea:focus,.fsp .fld select:focus{border-color:#9FC2F5;background:#fff}
.fsp .fld input::placeholder,.fsp .fld textarea::placeholder{color:var(--ink-4)}
.fsp .tog-list{display:flex;flex-direction:column}
.fsp .tog-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--line);cursor:pointer}
.fsp .tog-list .tog-row:last-child{border-bottom:none;padding-bottom:0}
.fsp .tog-list .tog-row:first-child{padding-top:0}
.fsp .tr-txt{flex:1;min-width:0}
.fsp .tr-lbl{font-size:16px;font-weight:600;color:var(--ink)}
.fsp .tr-sub{font-size:13.5px;color:var(--ink-3);margin-top:5px;line-height:1.5}
.fsp .switch{position:relative;width:52px;height:30px;flex-shrink:0;display:inline-block}
.fsp .switch input{opacity:0;width:0;height:0;position:absolute}
.fsp .switch .slider{position:absolute;inset:0;background:#D4DCE7;border-radius:100px;transition:background .25s;cursor:pointer}
.fsp .switch .slider::before{content:"";position:absolute;width:24px;height:24px;left:3px;top:3px;background:#fff;border-radius:50%;transition:transform .25s cubic-bezier(.34,1.56,.64,1);box-shadow:0 2px 6px rgba(11,18,32,.25)}
.fsp .switch input:checked + .slider{background:linear-gradient(135deg,#34C2F0,#2C7BE5)}
.fsp .switch input:checked + .slider::before{transform:translateX(22px)}
.fsp .nfc-row{display:flex;gap:10px;flex-wrap:wrap}
.fsp .nfc-url{flex:1;min-width:200px;background:#FAFBFD;border:1.5px solid var(--line);border-radius:14px;padding:15px 16px;font-size:14px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:'JetBrains Mono',monospace}
.fsp .nfc-copy{background:var(--ink);color:#fff;border:none;border-radius:14px;padding:0 22px;height:50px;font-family:inherit;font-size:15px;font-weight:700;cursor:pointer;flex-shrink:0}
.fsp .nfc-copy:hover{background:#1A2540}
.fsp .add-contact{width:100%;display:flex;align-items:center;justify-content:center;gap:9px;background:#fff;border:1.5px dashed #C9D4E2;border-radius:15px;padding:17px;font-family:inherit;font-size:16px;font-weight:600;color:var(--ink-2);cursor:pointer;transition:all .2s;margin-top:14px}
.fsp .add-contact:hover{border-color:var(--blue);color:var(--blue);background:rgba(44,123,229,.03)}
.fsp .delete-tag{width:100%;display:flex;align-items:center;justify-content:center;gap:9px;background:rgba(230,57,43,.05);border:1.5px solid rgba(230,57,43,.25);border-radius:15px;padding:17px;font-family:inherit;font-size:16px;font-weight:700;color:var(--red);cursor:pointer;transition:background .2s}
.fsp .delete-tag:hover{background:rgba(230,57,43,.1)}

/* design tile cards in tags list */
.fsp .tag .tscan{font-size:12.5px;color:var(--ink-4);margin-top:9px}

@media(max-width:760px){
  .fsp .scr-head h1{font-size:24px}
  .fsp .ed-card{padding:18px;border-radius:18px}
  .fsp .ed-htxt h1{font-size:22px}
  .fsp .chip{padding:10px 17px;font-size:14px}
  .fsp .conv-body{padding:16px;border-radius:18px;max-height:50vh}
  .fsp .cmsg{max-width:88%}
  .fsp .mi-av{width:46px;height:46px;border-radius:13px;font-size:17px}
  .fsp .msg-item{padding:14px 15px;border-radius:16px;gap:13px}
}

/* ============================================================
   MOBILE COMPACTION LAYER — tighter, more professional sizing
   for phone widths so the UI doesn't feel zoomed in.
   ============================================================ */
@media(max-width:760px){
  .fsp{font-size:14px}
  .fsp .content{padding:20px 14px 100px}

  /* mobile top bar — compact */
  .fsp .mt-bar{height:72px;padding:0 22px}
  .fsp .mt-brand .mark{width:34px;height:34px;border-radius:10px;flex-basis:34px}
  .fsp .mt-brand .mark svg{width:18px;height:18px}
  .fsp .mt-brand .bt{font-size:19px}
  .fsp .mt-right{gap:6px}
  .fsp .mt-icon{width:34px;height:34px;border-radius:10px}
  .fsp .mt-icon svg{width:17px;height:17px}
  .fsp .mt-av{width:34px;height:34px;font-size:13px}

  /* screen heads */
  .fsp .scr-head{margin-bottom:14px;gap:8px}
  .fsp .scr-head h1{font-size:22px;letter-spacing:-.5px;margin-top:4px}
  .fsp .scr-head .eyebrow{font-size:10.5px;letter-spacing:1.3px}
  .fsp .scr-count{font-size:12px}

  /* hello / overview */
  .fsp .hello{margin-bottom:14px}
  .fsp .hello h1{font-size:22px;letter-spacing:0}
  .fsp .hello p{font-size:13.5px}
  .fsp .hello .eyebrow{font-size:10.5px}
  .fsp .stats{gap:10px;margin-bottom:14px}
  .fsp .stat{display:grid;grid-template-columns:36px minmax(0,1fr);align-items:center;min-height:94px;padding:12px;border-radius:14px;gap:10px;overflow:visible}
  .fsp .stat .si{width:36px;height:36px;border-radius:10px}
  .fsp .stat .si svg{width:17px;height:17px}
  .fsp .stat .sv{font-size:20px}
  .fsp .stat .sl{font-size:11.5px;margin-top:2px;line-height:1.22}
  .fsp .stat .strend{font-size:9.5px;padding:3px 7px;margin-top:5px;border-radius:999px}
  .fsp .primary-actions{gap:9px}
  .fsp .pa-add,.fsp .pa-buy{padding:13px 15px;font-size:14.5px;border-radius:13px}
  .fsp .sec-head{margin:18px 0 10px}
  .fsp .sec-head h2{font-size:17px}
  .fsp .sec-head .link{font-size:13px}

  /* tag cards */
  .fsp .tag{padding:12px;border-radius:15px;gap:12px}
  .fsp .tag .ti{width:52px;height:52px;border-radius:13px;font-size:24px}
  .fsp .tag .tn{font-size:15px}
  .fsp .tag .tcode{font-size:12px}
  .fsp .tag .tscan{font-size:11.5px;margin-top:6px}
  .fsp .pill{font-size:10.5px;padding:4px 9px}
  .fsp .lost-panel{padding:14px !important;border-radius:18px !important}
  .fsp .lost-panel-head{grid-template-columns:36px minmax(0,1fr);align-items:center;gap:10px;margin-bottom:12px}
  .fsp .lost-panel-item{grid-template-columns:40px minmax(0,1fr);align-items:center;row-gap:8px;padding:12px !important}
  .fsp .lost-panel-item .pill{grid-column:2;justify-self:start;margin-top:0;max-width:100%}

  /* messages inbox */
  .fsp .msg-search{padding:11px 14px;border-radius:13px;margin-bottom:12px}
  .fsp .msg-search input{font-size:14px}
  .fsp .msg-search svg{width:17px;height:17px}
  .fsp .msg-filters{gap:7px;margin-bottom:12px}
  .fsp .mf{font-size:12.5px;padding:7px 12px}
  .fsp .mf-n{font-size:10px;min-width:16px;height:16px}
  .fsp .msg-item{padding:12px 13px;border-radius:15px;gap:12px}
  .fsp .mi-av{width:42px;height:42px;border-radius:12px;font-size:15px}
  .fsp .mi-name{font-size:14.5px}
  .fsp .mi-time{font-size:11px}
  .fsp .mi-finder{font-size:11px}
  .fsp .mi-prev{font-size:12.5px;margin-top:3px}

  /* conversation (chat) — main complaint */
  .fsp .conv-head{gap:8px;margin-bottom:12px;padding:8px 0;flex-wrap:nowrap;overflow-x:auto}
  .fsp .conv-head::-webkit-scrollbar{display:none}
  .fsp .conv-back,.fsp .conv-menu,.fsp .conv-del,.fsp .conv-close{width:34px;height:34px;border-radius:10px}
  .fsp .conv-back svg,.fsp .conv-menu svg,.fsp .conv-close svg,.fsp .conv-del svg{width:17px;height:17px}
  .fsp .conv-av{width:38px;height:38px;border-radius:11px;font-size:14px}
  .fsp .conv-who .cn{font-size:15px}
  .fsp .conv-who .cf{font-size:11px}
  .fsp .conv-body{padding:14px;border-radius:18px;min-height:280px;max-height:58vh;gap:10px}
  .fsp .conv-loc .cl-map{height:110px}
  .fsp .conv-loc .cl-foot{padding:10px 12px;gap:9px}
  .fsp .conv-loc .cl-t{font-size:13px}
  .fsp .conv-loc .cl-c{font-size:11px}
  .fsp .conv-loc .cl-open{padding:8px 11px;font-size:12px;border-radius:9px}
  .fsp .cmsg{max-width:86%}
  .fsp .cmsg .cb{padding:10px 13px;font-size:14px;border-radius:14px}
  .fsp .cmsg .ct{font-size:10.5px;margin-top:3px}
  .fsp .conv-quick{gap:7px;margin-bottom:10px}
  .fsp .cq{font-size:12.5px;padding:8px 13px}
  .fsp .conv-input{padding:7px 8px;gap:8px;border-radius:14px}
  .fsp .ci-attach{width:36px;height:36px;border-radius:10px}
  .fsp .ci-attach svg{width:18px;height:18px}
  .fsp .ci-field input,.fsp .ci-field textarea{font-size:14.5px;padding:10px 10px}
  .fsp .ci-send{width:40px;height:40px}
  .fsp .ci-send svg{width:17px;height:17px}

  /* tag editor */
  .fsp .ed-head{gap:9px;margin-bottom:14px;flex-wrap:nowrap}
  .fsp .ed-back{width:34px;height:34px;border-radius:10px}
  .fsp .ed-htxt h1{font-size:18px;letter-spacing:-.3px}
  .fsp .ed-htxt .eyebrow{font-size:10px}
  .fsp .ed-save{height:36px;font-size:13px;padding:0 13px;border-radius:10px}
  .fsp .ed-card{padding:16px;border-radius:16px;margin-bottom:12px}
  .fsp .ed-title{font-size:16px;margin-bottom:12px}
  .fsp .ed-desc{font-size:12.5px;margin:-4px 0 12px}
  .fsp .ed-clbl{font-size:10.5px;margin-bottom:10px}
  .fsp .chip{font-size:13px;padding:8px 14px}
  .fsp .fld label{font-size:12.5px;margin-bottom:6px}

  /* legacy ds-* compaction */
  .fsp .ds-page,.fsp .ds-page-narrow{gap:14px}
  .fsp .ds-h1{font-size:20px;letter-spacing:-.4px}
  .fsp .ds-h4{font-size:15px}
  .fsp .ds-sub,.fsp .ds-muted{font-size:13px}
  .fsp .ds-card,.fsp .ds-section{padding:14px;border-radius:14px}
  .fsp .ds-btn{height:38px;font-size:13.5px;padding:0 14px;border-radius:10px}
  .fsp .ds-btn-sm{height:32px;font-size:12.5px;padding:0 11px}
  .fsp .ds-input,.fsp .ds-page input,.fsp .ds-page textarea,.fsp .ds-page select{font-size:14px;padding:10px 12px;border-radius:10px}

  /* bottom nav — compact */
  .fsp .bottom-nav{padding:5px 4px calc(5px + env(safe-area-inset-bottom))}
  .fsp .bn-item{gap:3px;padding:4px 0}
  .fsp .bn-item svg{width:20px;height:20px}
  .fsp .bn-item span{font-size:10.5px}
}

@media(max-width:380px){
  .fsp .stats{grid-template-columns:1fr}
  .fsp .scr-head h1,.fsp .hello h1{font-size:20px}
}

/* ============================================================
   FLUID HELLO HEADING — auto-fit per language (no overflow)
   ============================================================ */
.fsp .hello h1{
  font-size: clamp(20px, 6vw, 38px) !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
  overflow-wrap: break-word;
  word-break: break-word;
  hyphens: auto;
  text-wrap: balance;
  max-width: 100%;
}
.fsp .hello p{
  font-size: clamp(13px, 3.6vw, 17px) !important;
  overflow-wrap: break-word;
}
.fsp .hello .eyebrow{
  font-size: clamp(10px, 2.6vw, 12px) !important;
  word-spacing: .04em;
}
.fsp .hello h1 .wave{ white-space: nowrap; }
@media (min-width: 760px){
  .fsp .hello h1{ font-size: clamp(26px, 3.4vw, 38px) !important; }
}

/* ============================================================
   PLATFORM ANTI-OVERLAP LAYER — multilingual safe layout
   Prevents Bulgarian/German/long labels from mixing with buttons.
   ============================================================ */
.fsp :where(h1,h2,h3,p,span,strong,label,button,a,div){
  max-width:100%;
}
.fsp :where(h1,h2,h3,.ds-h1,.scr-head h1,.ed-htxt h1,.conv-who .cn,.mi-name,.tn,.ds-tag-name,.tr-lbl,.ds-toggle-lbl){
  overflow-wrap:anywhere;
  word-break:normal;
  hyphens:auto;
  text-wrap:balance;
}
.fsp :where(.ds-btn,.ed-save,.ed-back,.conv-back,.conv-menu,.conv-del,.conv-close,.tb-btn,.tb-cta,.mt-icon,.mt-av,.bn-item,.chip,.mf,.cq){
  min-width:0;
}
.fsp :where(.ds-btn,.ed-save,.tb-cta,.chip,.mf,.cq){
  white-space:normal;
  line-height:1.15;
  text-align:center;
}
.fsp :where(.tag,.ds-tag-row,.ds-tag-card,.msg-item,.msg-row,.scan-row,.tog-row,.ds-toggle,.stat){
  min-width:0;
}
.fsp .stat{isolation:isolate}
.fsp .stat .strend{
  position:static;
  display:inline-flex;
  width:max-content;
  max-width:100%;
  margin-top:6px;
  white-space:normal;
  overflow-wrap:anywhere;
}
.fsp .stat .stxt{
  display:flex;
  min-width:0;
  flex-direction:column;
  align-items:flex-start;
}
.fsp .stat .sl,
.fsp .pill,
.fsp .lost-panel .eyebrow{
  line-height:1.18;
  overflow-wrap:normal;
  word-break:normal;
  text-wrap:auto;
}
.fsp .lost-panel .pill{
  flex-shrink:1;
  white-space:normal;
  text-align:left;
}
.fsp .lost-panel a{min-width:0}

@media(max-width:760px){
  /* Tag editor header: fixed controls never sit over the title. */
  .fsp .ed-head{
    display:grid !important;
    grid-template-columns:34px minmax(0,1fr) auto;
    grid-template-areas:
      "back title save"
      "preview preview preview";
    align-items:center;
    column-gap:9px;
    row-gap:10px;
    flex-wrap:initial !important;
    overflow:visible;
  }
  .fsp .ed-back{grid-area:back}
  .fsp .ed-htxt{grid-area:title;min-width:0;overflow:hidden}
  .fsp .ed-htxt .eyebrow{
    display:block;
    white-space:normal;
    overflow-wrap:anywhere;
    line-height:1.15;
  }
  .fsp .ed-htxt h1{
    font-size:clamp(17px,5vw,22px) !important;
    line-height:1.05 !important;
    margin:2px 0 0 !important;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  .fsp .ed-head > .ds-btn{
    grid-area:preview;
    width:100%;
    min-height:38px;
    height:auto;
    padding:10px 14px;
    justify-self:stretch;
  }
  .fsp .ed-save{
    grid-area:save;
    min-width:88px;
    max-width:118px;
    height:36px;
    padding:0 12px;
    white-space:nowrap;
  }
  .fsp .ed-save svg{width:16px;height:16px;flex-shrink:0}

  /* Generic mobile rows with text + actions become safe grids. */
  .fsp .ds-page-head,
  .fsp .scr-head,
  .fsp .ds-section-head{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:end;
    gap:10px;
  }
  .fsp .ds-page-head > :first-child,
  .fsp .scr-head > :first-child,
  .fsp .ds-section-head > :first-child{min-width:0}
  .fsp .ds-page-actions{
    width:100%;
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(132px,1fr));
    gap:8px;
  }
  .fsp .ds-page-actions .ds-btn{width:100%;min-height:38px;height:auto;padding:10px 12px}

  /* Long card/list labels truncate cleanly instead of colliding. */
  .fsp .mi-top,.fsp .scan-row-top{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:8px;
    align-items:start;
  }
  .fsp .mi-name,.fsp .scan-row-top strong,.fsp .tag .tn,.fsp .ds-tag-name{
    min-width:0;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    line-height:1.16;
  }
  .fsp .mi-time,.fsp .scan-row-time{white-space:nowrap}

  /* Bottom tabs keep labels readable without pushing into each other. */
  .fsp .bn-item{min-width:0;overflow:hidden}
  .fsp .bn-item span{
    width:100%;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    line-height:1.1;
  }
}

@media(max-width:380px){
  .fsp .ed-head{grid-template-columns:34px minmax(0,1fr) 82px}
  .fsp .ed-save{min-width:82px;max-width:92px;font-size:12px;padding:0 10px;gap:5px}
  .fsp .ed-head > .ds-btn{font-size:12.5px;padding:9px 12px}
}

/* ============================================================
   FINAL MULTILINGUAL CONTROL SAFETY — no label/button overlap
   ============================================================ */
.fsp :where(.stat,.tag,.msg-item,.ds-card,.ds-section,.lost-panel a){
  container-type:inline-size;
}
.fsp :where(.pa-add,.pa-buy,.tb-cta,.ds-btn,.ed-save,.chip,.mf,.cq,.pill,.ds-pill,.bn-item){
  overflow:hidden;
  overflow-wrap:anywhere;
  word-break:normal;
  hyphens:auto;
}
.fsp :where(.pill,.ds-pill){
  max-width:100%;
  min-width:0;
  white-space:normal;
  text-align:left;
  line-height:1.12;
  letter-spacing:0 !important;
}
.fsp :where(.pill .pd,.ds-pill .pd){
  flex:0 0 6px;
}
.fsp .stat{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  overflow:visible;
}
.fsp .stat .stxt,
.fsp .tag .tb,
.fsp .msg-item :where(.mi-body,.mi-main),
.fsp .lost-panel a > div{
  min-width:0;
}
.fsp .stat .sl{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  line-height:1.18;
}
.fsp .stat .strend{
  grid-column:1 / -1;
  justify-self:start;
  width:auto;
  max-width:100%;
}

@media(max-width:760px){
  .fsp .stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-items:stretch;
  }
  .fsp .stat{
    grid-template-columns:38px minmax(0,1fr);
    min-height:96px;
    gap:10px;
  }
  .fsp .stat .stxt{gap:2px}
  .fsp .stat .sv{font-size:20px !important;line-height:1 !important}
  .fsp .stat .sl{font-size:11px !important;line-height:1.2 !important}
  .fsp .pill,.fsp .ds-pill{
    font-size:10px !important;
    padding:5px 8px !important;
    gap:5px;
    max-inline-size:100%;
  }
  .fsp .tag .tmeta{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    align-items:start;
    gap:6px;
  }
  .fsp .tag .tmeta .pill{justify-self:start}
  .fsp .tag .tmeta .tcode{
    min-width:0;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .fsp .lost-panel{
    padding:16px !important;
    border-radius:20px !important;
    margin:14px 0 18px !important;
  }
  .fsp .lost-panel-head{
    grid-template-columns:42px minmax(0,1fr) !important;
    gap:12px !important;
    margin-bottom:14px !important;
  }
  .fsp .lost-panel-alert{
    width:42px !important;
    height:42px !important;
    border-radius:13px !important;
    font-size:18px !important;
  }
  .fsp .lost-panel-copy{
    min-width:0 !important;
    width:100% !important;
  }
  .fsp .lost-panel .eyebrow{
    display:block !important;
    width:100% !important;
    font-size:10.5px !important;
    line-height:1.25 !important;
    letter-spacing:.08em !important;
    white-space:normal !important;
    overflow-wrap:break-word !important;
    word-break:normal !important;
    hyphens:auto !important;
  }
  .fsp .lost-panel-count{
    font-size:18px !important;
    line-height:1.15 !important;
  }
  .fsp .lost-panel-list{
    gap:10px !important;
  }
  .fsp .lost-panel-item{
    grid-template-columns:40px minmax(0,1fr) !important;
    gap:10px !important;
    padding:12px !important;
    border-radius:16px !important;
  }
  .fsp .lost-panel-emoji{
    font-size:22px !important;
  }
  .fsp .lost-panel-tag-name{
    font-size:14px !important;
  }
  .fsp .lost-panel-tag-code{
    font-size:12px !important;
  }
  .fsp .lost-panel-item .pill{
    grid-column:2 !important;
    justify-self:start !important;
    max-width:100% !important;
    white-space:nowrap !important;
    text-align:left !important;
  }
  .fsp .pa-add,.fsp .pa-buy{
    min-height:54px;
    align-items:center;
    line-height:1.15;
  }
  .fsp .bottom-nav{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
  }
  .fsp .bn-item span{
    font-size:clamp(9px,2.45vw,10.5px) !important;
    letter-spacing:0;
  }
}

@media(max-width:360px){
  .fsp .stats{gap:8px}
  .fsp .stat{grid-template-columns:34px minmax(0,1fr);padding:10px;min-height:92px}
  .fsp .stat .si{width:34px;height:34px}
  .fsp .stat .sl{font-size:10.5px !important}
  .fsp .bn-item span{font-size:9px !important}
}

/* ============================================================
   PROFESSIONAL POLISH LAYER (final)
   - Equal-height primary action buttons with icons
   - Compact, never-overlapping pill in lost panel
   - Mobile stat cards never collide with status text
   ============================================================ */

/* Primary action buttons — equal structure, icon + label */
.fsp .primary-actions{display:grid;grid-template-columns:1fr;gap:12px;max-width:520px}
.fsp .pa-add,.fsp .pa-buy{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:14px;
  min-height:60px;
  padding:14px 18px;
  border-radius:16px;
  text-align:left;
  text-decoration:none;
  font-family:inherit;
  font-size:17px;
  font-weight:600;
  letter-spacing:-.1px;
  line-height:1.2;
  border:1px solid var(--line);
}
.fsp .pa-add{
  color:#fff;
  background:linear-gradient(100deg,#22B6F0,#2C7BE5);
  border-color:transparent;
  box-shadow:0 12px 28px -12px rgba(44,123,229,.55);
}
.fsp .pa-buy{
  color:var(--ink);
  background:#fff;
  box-shadow:0 1px 2px rgba(11,18,32,.04),0 8px 20px -16px rgba(11,18,32,.3);
}
.fsp .pa-add:hover{box-shadow:0 16px 34px -10px rgba(44,123,229,.65)}
.fsp .pa-buy:hover{border-color:#D9E2F0}
.fsp .pa-add .pa-ic,.fsp .pa-buy .pa-ic{
  width:36px;height:36px;border-radius:11px;
  display:grid;place-items:center;flex-shrink:0;
}
.fsp .pa-add .pa-ic{background:rgba(255,255,255,.22);color:#fff}
.fsp .pa-buy .pa-ic-ghost{background:linear-gradient(135deg,#EEF3FA,#E2EAF5);color:var(--ink-2)}
.fsp .pa-add .pa-ic svg,.fsp .pa-buy .pa-ic svg{width:18px;height:18px}
.fsp .pa-lbl{
  min-width:0;
  display:block;
  overflow-wrap:break-word;
  word-break:normal;
  hyphens:auto;
  font-size:clamp(14px,3.9vw,17px);
}

/* Lost panel item pill — compact, no uppercase, never overlaps */
.fsp .lost-panel-item .pill,
.fsp .lost-panel-item .pill-lost{
  text-transform:none !important;
  letter-spacing:.1px !important;
  font-size:11px !important;
  padding:4px 9px !important;
  max-width:none !important;
  white-space:nowrap !important;
  flex-shrink:0;
  font-weight:700;
}

/* Remove any stray status badge ever rendered over stat cards */
.fsp .stat .strend{display:none !important}

@media(max-width:760px){
  .fsp .primary-actions{max-width:100%;gap:10px}
  .fsp .pa-add,.fsp .pa-buy{
    min-height:56px;padding:13px 15px;border-radius:14px;
    grid-template-columns:auto minmax(0,1fr);
    gap:12px;
  }
  .fsp .pa-add .pa-ic,.fsp .pa-buy .pa-ic{width:32px;height:32px;border-radius:10px}
  .fsp .pa-add .pa-ic svg,.fsp .pa-buy .pa-ic svg{width:16px;height:16px}
  .fsp .pa-lbl{font-size:clamp(13.5px,3.8vw,15.5px);line-height:1.18}

  /* Lost panel: row becomes 3-col with pill on its own line if tight */
  .fsp .lost-panel-item{
    grid-template-columns:40px minmax(0,1fr) auto !important;
    row-gap:6px !important;
    align-items:center !important;
  }
  .fsp .lost-panel-item .pill{
    grid-column:3 !important;
    grid-row:1 !important;
    justify-self:end !important;
    font-size:10px !important;
    padding:3px 8px !important;
  }
  .fsp .lost-panel-tag-copy{grid-column:2;grid-row:1}
}

@media(max-width:380px){
  .fsp .lost-panel-item{
    grid-template-columns:36px minmax(0,1fr) !important;
  }
  .fsp .lost-panel-item .pill{
    grid-column:2 !important;
    grid-row:2 !important;
    justify-self:start !important;
  }
}

/* ============================================================
   MOBILE PROFILE TABBAR — structural final fix
   Labels are always centered under their icons, multilingual-safe.
   ============================================================ */
@media(max-width:760px){
  .fsp .content{
    padding-bottom:calc(104px + env(safe-area-inset-bottom)) !important;
  }

  .fsp .bottom-nav{
    display:grid !important;
    grid-template-columns:repeat(6,minmax(0,1fr)) !important;
    gap:0 !important;
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    z-index:999 !important;
    min-height:78px !important;
    padding:8px 8px calc(8px + env(safe-area-inset-bottom)) !important;
    background:rgba(255,255,255,.96) !important;
    border-top:1px solid rgba(13,13,13,.10) !important;
    box-shadow:0 -12px 34px -24px rgba(13,13,13,.35) !important;
    backdrop-filter:blur(18px) saturate(160%) !important;
    -webkit-backdrop-filter:blur(18px) saturate(160%) !important;
  }

  .fsp .bn-item{
    min-width:0 !important;
    width:100% !important;
    height:62px !important;
    padding:6px 2px 5px !important;
    border:0 !important;
    border-radius:16px !important;
    display:grid !important;
    grid-template-rows:30px 18px !important;
    grid-template-columns:minmax(0,1fr) !important;
    place-items:center !important;
    align-content:center !important;
    justify-content:center !important;
    gap:3px !important;
    color:rgba(13,13,13,.54) !important;
    background:transparent !important;
    text-align:center !important;
    overflow:hidden !important;
    text-decoration:none !important;
    line-height:1 !important;
  }

  .fsp .bn-item.active{
    color:var(--ink-noir, #0d0d0d) !important;
    background:rgba(201,168,76,.12) !important;
  }

  .fsp .bn-ic{
    grid-row:1 !important;
    width:30px !important;
    height:30px !important;
    min-width:30px !important;
    min-height:30px !important;
    display:grid !important;
    place-items:center !important;
    border-radius:12px !important;
    color:inherit !important;
    overflow:visible !important;
    line-height:0 !important;
  }

  .fsp .bn-item.active .bn-ic{
    background:rgba(201,168,76,.20) !important;
    color:var(--gold-2, #9f7f24) !important;
  }

  .fsp .bn-ic svg{
    width:20px !important;
    height:20px !important;
    display:block !important;
    flex:0 0 auto !important;
    stroke-width:2 !important;
  }

  .fsp .bn-label{
    grid-row:2 !important;
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    padding:0 1px !important;
    margin:0 !important;
    color:inherit !important;
    font-family:'Work Sans','Sora',system-ui,sans-serif !important;
    font-size:clamp(9px,2.35vw,10.5px) !important;
    font-weight:700 !important;
    letter-spacing:0 !important;
    line-height:1.08 !important;
    text-align:center !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
    hyphens:none !important;
  }
}

@media(max-width:360px){
  .fsp .bottom-nav{padding-left:5px !important;padding-right:5px !important}
  .fsp .bn-item{height:58px !important;border-radius:14px !important;grid-template-rows:28px 17px !important}
  .fsp .bn-ic{width:28px !important;height:28px !important;min-width:28px !important;min-height:28px !important}
  .fsp .bn-ic svg{width:18px !important;height:18px !important}
  .fsp .bn-label{font-size:8.7px !important;line-height:1.05 !important}
}

/* ============ Tag creation stepper (professional) ============ */
.fs-stepper{display:flex;align-items:flex-start;gap:0;margin:6px 0 22px;padding:18px 18px 14px;background:#fff;border:1px solid #eef0f3;border-radius:18px;box-shadow:0 2px 12px -8px rgba(15,23,42,.06)}
.fs-step{flex:1;display:flex;flex-direction:column;gap:10px;min-width:0}
.fs-step-row{display:flex;align-items:center;gap:0}
.fs-step-circle{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:13px;background:#f1f5f9;color:#94a3b8;border:1.5px solid #e2e8f0;flex-shrink:0;transition:all .25s ease}
.fs-step-line{flex:1;height:2px;background:#e7ebf3;margin:0 8px;border-radius:2px;transition:background .25s ease}
.fs-step-text{padding-left:2px;min-width:0}
.fs-step-eyebrow{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#94a3b8;line-height:1}
.fs-step-label{font-size:13px;font-weight:600;color:#475569;margin-top:4px;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fs-step-active .fs-step-circle{background:linear-gradient(135deg,#2c7be5,#1e63d0);color:#fff;border-color:transparent;box-shadow:0 6px 16px -6px rgba(44,123,229,.55)}
.fs-step-active .fs-step-eyebrow{color:#2c7be5}
.fs-step-active .fs-step-label{color:#0f172a}
.fs-step-done .fs-step-circle{background:#10b981;color:#fff;border-color:transparent}
.fs-step-done .fs-step-line{background:#10b981}
.fs-step-done .fs-step-label{color:#0f172a}
@media (max-width:520px){
  .fs-stepper{padding:14px 12px 12px;border-radius:16px}
  .fs-step-circle{width:28px;height:28px;font-size:12px}
  .fs-step-line{margin:0 6px}
  .fs-step-eyebrow{font-size:9px}
  .fs-step-label{font-size:11.5px}
}

/* ============ Authenticated Shop page ============ */
.fsp .sh-page{max-width:1100px}
.fsp .sh-head{margin:4px 0 14px}
.fsp .sh-head .ds-h1{font-style:normal;margin:0}

/* TWO BUTTON TILES — orders + cart */
.fsp .sh-tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
.fsp .sh-tile{
  display:flex;align-items:center;gap:12px;
  background:#fff;border:1px solid #eaecef;border-radius:16px;
  padding:14px 14px;cursor:pointer;text-align:left;font-family:inherit;
  box-shadow:0 2px 10px -6px rgba(15,23,42,.08);
  transition:transform .15s ease,box-shadow .2s ease,border-color .2s ease,background .2s ease;
  min-height:68px;
}
.fsp .sh-tile:hover{transform:translateY(-1px);box-shadow:0 10px 22px -14px rgba(15,23,42,.22);border-color:#d8dce3}
.fsp .sh-tile.is-open{border-color:#2c7be5;background:linear-gradient(180deg,#f5faff,#fff);box-shadow:0 10px 22px -14px rgba(44,123,229,.45)}
.fsp .sh-tile-ic{
  width:42px;height:42px;border-radius:12px;flex-shrink:0;
  display:grid;place-items:center;position:relative;
  background:linear-gradient(135deg,#eef2f7,#e2e8f0);color:#0f172a;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.6);
}
.fsp .sh-tile-ic-orders{background:linear-gradient(135deg,#ede9fe,#ddd6fe);color:#5b21b6}
.fsp .sh-tile-ic-cart{background:linear-gradient(135deg,#fff7ec,#ffe7c2);color:#b8761a}
.fsp .sh-tile-cart.has-items .sh-tile-ic-cart{background:linear-gradient(135deg,#2c7be5,#1e63d0);color:#fff}
.fsp .sh-tile-dot{
  position:absolute;top:-5px;right:-5px;min-width:18px;height:18px;padding:0 5px;
  border-radius:999px;background:#ef4444;color:#fff;font-size:10.5px;font-weight:800;
  display:grid;place-items:center;border:2px solid #fff;
}
.fsp .sh-tile-txt{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.fsp .sh-tile-t{font-weight:800;font-size:14px;color:#0f172a;line-height:1.15;letter-spacing:-.1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fsp .sh-tile-s{font-size:12px;font-weight:700;color:#64748b;line-height:1.1}
.fsp .sh-tile.is-open .sh-tile-s,
.fsp .sh-tile-cart.has-items .sh-tile-s{color:#2c7be5}

/* EXPANDED PANEL below tiles */
.fsp .sh-panel{
  background:#fff;border:1px solid #eaecef;border-radius:18px;
  padding:14px 16px 18px;margin-bottom:18px;
  box-shadow:0 10px 28px -20px rgba(15,23,42,.25);
  animation:shPanelIn .22s ease both;
}
@keyframes shPanelIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.fsp .sh-panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:10px;border-bottom:1px solid #f1f5f9;margin-bottom:10px}
.fsp .sh-panel-head h2{margin:0;font-size:16px;font-weight:800;color:#0f172a;display:flex;align-items:center;gap:8px}
.fsp .sh-panel-badge{font-size:11px;font-weight:800;padding:2px 8px;border-radius:999px;background:#0f172a;color:#fff}
.fsp .sh-panel-x{width:32px;height:32px;border:0;background:#f1f5f9;color:#0f172a;border-radius:10px;font-size:20px;line-height:1;cursor:pointer;display:grid;place-items:center}
.fsp .sh-panel-x:hover{background:#e2e8f0}

.fsp .sh-empty{padding:24px 8px;text-align:center}
.fsp .sh-empty-ic{font-size:34px;margin-bottom:8px}
.fsp .sh-empty-t{font-weight:700;color:#0f172a;margin-bottom:4px}
.fsp .sh-empty-p{font-size:13.5px;color:#64748b;line-height:1.5;max-width:380px;margin:0 auto}

.fsp .sh-cart-list{list-style:none;padding:0;margin:0 0 14px;display:flex;flex-direction:column;gap:8px}
.fsp .sh-cart-row{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid #eef0f3;border-radius:12px;background:#fafbfc}
.fsp .sh-cart-emoji{width:40px;height:40px;border-radius:10px;background:#fff;border:1px solid #eef0f3;display:grid;place-items:center;font-size:20px;flex-shrink:0}
.fsp .sh-cart-info{flex:1;min-width:0}
.fsp .sh-cart-name{font-weight:700;font-size:13.5px;color:#0f172a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fsp .sh-cart-meta{font-size:12px;color:#64748b;margin-top:2px}
.fsp .sh-qty{display:inline-flex;align-items:center;border:1px solid #e2e8f0;border-radius:999px;background:#fff;overflow:hidden;flex-shrink:0}
.fsp .sh-qty button{width:28px;height:28px;border:0;background:transparent;font-size:15px;font-weight:700;color:#0f172a;cursor:pointer}
.fsp .sh-qty button:hover{background:#f1f5f9}
.fsp .sh-qty span{min-width:24px;text-align:center;font-weight:700;font-size:13px}
.fsp .sh-cart-rm{width:30px;height:30px;border-radius:8px;border:0;background:transparent;color:#94a3b8;cursor:pointer;display:grid;place-items:center;flex-shrink:0}
.fsp .sh-cart-rm:hover{background:#fee2e2;color:#dc2626}

.fsp .sh-cart-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-top:12px;border-top:1px dashed #e2e8f0;flex-wrap:wrap}
.fsp .sh-cart-sub{display:flex;flex-direction:column;gap:2px}
.fsp .sh-cart-sub span{font-size:11px;color:#64748b;text-transform:uppercase;letter-spacing:.1em;font-weight:600}
.fsp .sh-cart-sub strong{font-size:20px;color:#0f172a}
.fsp .sh-cta{display:inline-flex;align-items:center;gap:6px;padding:11px 18px;border-radius:12px;background:linear-gradient(135deg,#2c7be5,#1e63d0);color:#fff;font-weight:700;text-decoration:none;box-shadow:0 8px 18px -8px rgba(44,123,229,.55);transition:transform .15s ease}
.fsp .sh-cta:hover{transform:translateY(-1px)}

.fsp .sh-products{margin-top:18px}
.fsp .sh-products-head{display:flex;align-items:baseline;gap:10px;margin-bottom:12px}
.fsp .sh-products-head h2{font-size:18px;font-weight:800;color:#0f172a;margin:0;font-style:normal}
.fsp .sh-products-count{font-size:12px;font-weight:700;color:#64748b;padding:3px 9px;border-radius:999px;background:#f1f5f9}

.fsp .sh-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.fsp .sh-card{background:#fff;border:1px solid #eef0f3;border-radius:18px;overflow:hidden;display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.fsp .sh-card:hover{transform:translateY(-3px);box-shadow:0 14px 28px -18px rgba(15,23,42,.18);border-color:#e2e8f0}
.fsp .sh-card-art{position:relative;height:128px;background:linear-gradient(135deg,hsl(var(--hue) / .18),hsl(var(--hue) / .04));display:grid;place-items:center}
.fsp .sh-card-emoji{font-size:54px;filter:drop-shadow(0 6px 12px rgba(0,0,0,.12))}
.fsp .sh-pill{position:absolute;top:10px;right:10px;font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:4px 9px;border-radius:999px;background:#0f172a;color:#fff}
.fsp .sh-pill-popular{background:#2c7be5}
.fsp .sh-pill-best{background:#10b981}
.fsp .sh-pill-new{background:#f59e0b}

.fsp .sh-card-body{padding:14px 14px 16px;display:flex;flex-direction:column;gap:8px;flex:1}
.fsp .sh-card-title{font-size:15px;font-weight:800;color:#0f172a;margin:0;line-height:1.25;font-style:normal}
.fsp .sh-card-p{font-size:12.5px;color:#64748b;margin:0;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fsp .sh-card-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:8px;flex-wrap:wrap}
.fsp .sh-card-price{font-size:18px;font-weight:800;color:#0f172a}
.fsp .sh-card-actions{display:flex;gap:6px}
.fsp .sh-btn{display:inline-flex;align-items:center;gap:4px;padding:8px 12px;border-radius:10px;font-size:12.5px;font-weight:700;cursor:pointer;border:1px solid transparent;text-decoration:none;font-family:inherit;transition:all .15s ease}
.fsp .sh-btn-ghost{background:#fff;border-color:#e2e8f0;color:#0f172a}
.fsp .sh-btn-ghost:hover{background:#f8fafc}
.fsp .sh-btn-primary{background:#0f172a;color:#fff}
.fsp .sh-btn-primary:hover{background:#1e293b}
.fsp .sh-btn-primary.is-in{background:#10b981}

/* Mobile-top header — ensure it stays above content without overlap artifacts */
@media(max-width:760px){
  .fsp .mobile-top{
    z-index:60 !important;
    background:#fff !important;
    box-shadow:0 6px 18px -10px rgba(15,23,42,.22);
  }
  .fsp .content{padding-top:22px}
}

@media (max-width:520px){
  .fsp .sh-head{margin:2px 0 10px}
  .fsp .sh-tiles{gap:10px;margin-bottom:12px}
  .fsp .sh-tile{padding:11px 12px;min-height:60px;border-radius:14px;gap:10px}
  .fsp .sh-tile-ic{width:36px;height:36px;border-radius:10px}
  .fsp .sh-tile-ic svg{width:17px;height:17px}
  .fsp .sh-tile-t{font-size:13px}
  .fsp .sh-tile-s{font-size:11.5px}

  .fsp .sh-panel{padding:12px 12px 14px;border-radius:16px;margin-bottom:14px}
  .fsp .sh-panel-head h2{font-size:14.5px}

  .fsp .sh-grid{grid-template-columns:1fr 1fr;gap:10px}
  .fsp .sh-card-art{height:100px}
  .fsp .sh-card-emoji{font-size:42px}
  .fsp .sh-card-body{padding:10px 10px 12px;gap:6px}
  .fsp .sh-card-title{font-size:13px}
  .fsp .sh-card-p{font-size:11.5px;-webkit-line-clamp:2}
  .fsp .sh-card-price{font-size:15px}
  .fsp .sh-card-foot{gap:6px}
  .fsp .sh-btn{padding:7px 9px;font-size:11.5px}
  .fsp .sh-cart-emoji{width:34px;height:34px;font-size:18px}
  .fsp .sh-cart-name{font-size:12.5px}
  .fsp .sh-cart-meta{font-size:11.5px}
}


/* More sheet (mobile) */
.fsp .mt-more-overlay{position:fixed;inset:0;z-index:80;background:rgba(11,18,32,.55);display:flex;align-items:flex-end;animation:fsMoreFade .18s ease-out}
.fsp .mt-more-sheet{width:100%;background:#fff;border-radius:22px 22px 0 0;padding:10px 18px calc(110px + env(safe-area-inset-bottom));box-shadow:0 -20px 60px -10px rgba(11,18,32,.35);animation:fsMoreUp .22s ease-out;max-height:min(88dvh, calc(100dvh - 24px));overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;display:flex;flex-direction:column}
.fsp .mt-more-handle{width:42px;height:4px;border-radius:99px;background:#D6DCEA;margin:6px auto 12px}
.fsp .mt-more-title{font-family:'Sora',sans-serif;font-weight:800;font-size:16px;color:var(--ink);margin:2px 4px 14px}
.fsp .mt-more-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;align-content:start}
.fsp .mt-more-item{display:flex;align-items:center;gap:12px;padding:14px 14px;border-radius:14px;background:#F4F6FB;border:1px solid var(--line);color:var(--ink);font-weight:600;font-size:14px;text-decoration:none;font-family:inherit;cursor:pointer;text-align:left;min-height:56px}
.fsp .mt-more-item:active{background:#EAEFF8}
.fsp .mt-more-item.active{background:rgba(44,123,229,.1);border-color:rgba(44,123,229,.25);color:var(--blue)}
.fsp .mt-more-item.danger{color:var(--red);background:#FFF1F0;border-color:#FBD9D6}
.fsp .mt-more-ic{width:22px;height:22px;display:grid;place-items:center;flex-shrink:0}
.fsp .mt-more-ic svg{width:22px;height:22px}
@keyframes fsMoreFade{from{opacity:0}to{opacity:1}}
@keyframes fsMoreUp{from{transform:translateY(20px);opacity:.6}to{transform:translateY(0);opacity:1}}

/* Leaflet popup — solid, professional */
.leaflet-popup-content-wrapper{
  background:#fff !important;
  color:#0B1220 !important;
  border-radius:14px !important;
  box-shadow:0 18px 40px -12px rgba(11,18,32,.35),0 4px 10px -4px rgba(11,18,32,.18) !important;
  border:1px solid #E7EBF3 !important;
  padding:4px !important;
  opacity:1 !important;
}
.leaflet-popup-tip{background:#fff !important;box-shadow:0 4px 10px -4px rgba(11,18,32,.18) !important}
.leaflet-popup-content{margin:10px 12px !important;font-family:'Inter',system-ui,sans-serif;line-height:1.4;width:auto !important;min-width:220px}
.leaflet-popup-close-button{color:#3A4660 !important;font-size:22px !important;padding:6px 8px !important;font-weight:600}
.leaflet-popup-close-button:hover{color:#0B1220 !important}

.scan-pop{display:flex;flex-direction:column;gap:4px;color:#0B1220;font-size:13.5px}
.scan-pop-title{font-family:'Sora',sans-serif;font-weight:800;font-size:15px;color:#0B1220;letter-spacing:-.2px}
.scan-pop-time{font-size:12px;color:#6B7896;font-weight:500}
.scan-pop-divider{height:1px;background:#E7EBF3;margin:6px 0}
.scan-pop-loading{color:#6B7896;font-size:12.5px;font-style:italic}
.scan-pop-addr1{font-weight:700;color:#0B1220;font-size:14px}
.scan-pop-addr2{color:#3A4660;font-size:12.5px;line-height:1.45}
.scan-pop-coords{font-family:'JetBrains Mono',monospace;font-size:11px;color:#9AA6C0;margin-top:4px}
.scan-pop-cta{display:inline-flex;align-items:center;justify-content:center;margin-top:8px;padding:8px 10px;border-radius:10px;background:#2C7BE5;color:#fff !important;font-weight:700;font-size:12.5px;text-decoration:none}
.scan-pop-cta:hover{background:#1E63D4}

/* ============ ADMIN PANEL ============ */
.adm-shell { min-height: 100%; background: #f5f6fb; padding-bottom: 80px; }
.adm-loading { padding: 60px 20px; text-align: center; color: #64748b; font-size: 14px; }
.adm-header { background: linear-gradient(135deg, #1e1b4b 0%, #312e81 100%); color: #fff; padding: 18px 18px 0; }
.adm-header-inner { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.adm-title-block { display: flex; align-items: center; gap: 10px; }
.adm-pill { display: inline-block; padding: 4px 10px; border-radius: 999px; background: rgba(255,255,255,.15); font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.adm-title { font-size: 20px; font-weight: 800; margin: 0; font-family: "Sora", sans-serif; }
.adm-quick-btn { color: rgba(255,255,255,.8); text-decoration: none; font-size: 13px; padding: 6px 12px; border-radius: 8px; background: rgba(255,255,255,.08); }
.adm-quick-btn:hover { background: rgba(255,255,255,.16); }
.adm-tabs { display: flex; gap: 4px; overflow-x: auto; margin-top: 16px; padding-bottom: 0; scrollbar-width: none; }
.adm-tabs::-webkit-scrollbar { display: none; }
.adm-tab { display: inline-flex; align-items: center; gap: 6px; padding: 10px 14px; color: rgba(255,255,255,.7); text-decoration: none; border-bottom: 2px solid transparent; font-size: 13px; font-weight: 600; white-space: nowrap; }
.adm-tab.on { color: #fff; border-bottom-color: #fff; }
.adm-tab-ic { font-size: 15px; }
.adm-body { padding: 18px; max-width: 1280px; margin: 0 auto; }
.adm-page { display: flex; flex-direction: column; gap: 18px; }
.adm-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 14px; padding: 16px; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.adm-h3 { font-size: 14px; font-weight: 700; margin: 0 0 12px; color: #0f172a; font-family: "Sora", sans-serif; }
.adm-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.adm-kpis-tight { grid-template-columns: repeat(4, 1fr); }
.adm-kpi { display: flex; flex-direction: column; gap: 6px; border-left: 3px solid transparent; }
.adm-kpi.accent-rev { border-left-color: #6366f1; }
.adm-kpi.accent-cust { border-left-color: #0ea5e9; }
.adm-kpi.accent-tags { border-left-color: #14b8a6; }
.adm-kpi.accent-red { border-left-color: #dc2626; background: #fef2f2; }
.adm-kpi.accent-mute { border-left-color: #e5e7eb; }
.adm-kpi-top { display: flex; justify-content: space-between; align-items: center; }
.adm-kpi-label { font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #64748b; }
.adm-kpi-value { font-size: 26px; font-weight: 800; color: #0f172a; font-family: "Sora", sans-serif; }
.adm-kpi-value small { font-size: 12px; font-weight: 600; color: #64748b; }
.adm-kpi-sub { font-size: 12px; color: #64748b; }
.adm-range { display: inline-flex; background: #f1f5f9; border-radius: 8px; padding: 2px; }
.adm-range button { border: 0; background: transparent; font-size: 11px; padding: 3px 8px; border-radius: 6px; cursor: pointer; color: #64748b; font-weight: 600; }
.adm-range button.on { background: #fff; color: #0f172a; box-shadow: 0 1px 2px rgba(0,0,0,.08); }
.adm-link { color: #6366f1; text-decoration: none; font-weight: 600; }
.adm-grid-2 { display: grid; grid-template-columns: 1.4fr 1fr; gap: 12px; }
.adm-bars { display: flex; align-items: flex-end; gap: 2px; height: 120px; padding: 8px 0; }
.adm-bar-col { flex: 1; height: 100%; display: flex; align-items: flex-end; }
.adm-bar { width: 100%; background: linear-gradient(180deg, #6366f1, #818cf8); border-radius: 2px; min-height: 1px; transition: opacity .2s; }
.adm-bar-col:hover .adm-bar { opacity: .7; }
.adm-bars-meta { display: flex; justify-content: space-between; font-size: 10px; color: #94a3b8; margin-top: 4px; }
.adm-toplist { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.adm-toplist li { display: grid; grid-template-columns: 24px 1fr 80px 30px; align-items: center; gap: 8px; font-size: 13px; }
.adm-toplist-ic { font-size: 16px; }
.adm-toplist-name { text-transform: capitalize; color: #0f172a; }
.adm-toplist-track { background: #f1f5f9; height: 6px; border-radius: 3px; overflow: hidden; }
.adm-toplist-track div { height: 100%; background: linear-gradient(90deg, #6366f1, #14b8a6); border-radius: 3px; }
.adm-toplist-val { text-align: right; font-weight: 700; color: #0f172a; }
.adm-empty-mini { padding: 24px; text-align: center; color: #94a3b8; font-size: 13px; }
.adm-quick-actions { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.adm-action { display: flex; align-items: center; gap: 12px; padding: 14px; background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; text-decoration: none; color: inherit; transition: all .15s; }
.adm-action:hover { border-color: #6366f1; transform: translateY(-1px); box-shadow: 0 4px 12px -4px rgba(99,102,241,.3); }
.adm-action span { font-size: 22px; }
.adm-action b { display: block; font-size: 14px; color: #0f172a; }
.adm-action small { font-size: 11px; color: #64748b; }
.adm-toolbar { display: flex; gap: 8px; flex-wrap: wrap; }
.adm-input, .adm-select { padding: 10px 12px; border: 1px solid #e5e7eb; border-radius: 10px; font-size: 14px; background: #fff; font-family: inherit; }
.adm-input { flex: 1; min-width: 200px; }
.adm-input:focus, .adm-select:focus { outline: 2px solid #6366f1; outline-offset: -1px; border-color: #6366f1; }
.adm-row-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.adm-row { display: flex; align-items: center; gap: 12px; cursor: pointer; padding: 12px 14px; transition: border-color .15s; }
.adm-row:hover { border-color: #c7d2fe; }
.adm-row-link { display: flex; align-items: center; gap: 12px; flex: 1; text-decoration: none; color: inherit; }
.adm-row-main { flex: 1; min-width: 0; }
.adm-row-head { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 13px; color: #0f172a; }
.adm-row-sub { font-size: 12px; color: #475569; margin-top: 2px; }
.adm-row-meta { font-size: 11px; color: #94a3b8; margin-top: 2px; }
.adm-row-amt { font-size: 14px; font-weight: 800; color: #0f172a; white-space: nowrap; }
.adm-row-actions { display: flex; gap: 4px; }
.adm-code-mini { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 11px; background: #f1f5f9; padding: 2px 6px; border-radius: 4px; color: #0f172a; }
.adm-chip { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 10px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
.adm-chip-paid { background: #fef3c7; color: #92400e; }
.adm-chip-shipped { background: #dbeafe; color: #1e40af; }
.adm-chip-delivered { background: #dcfce7; color: #166534; }
.adm-chip-refunded, .adm-chip-cancelled { background: #fee2e2; color: #991b1b; }
.adm-chip-active { background: #dcfce7; color: #166534; }
.adm-chip-inactive { background: #f1f5f9; color: #475569; }
.adm-chip-unclaimed { background: #fef3c7; color: #92400e; }
.adm-chip-lost, .adm-chip-failed, .adm-chip-dead, .adm-chip-private { background: #fee2e2; color: #991b1b; }
.adm-chip-pending { background: #dbeafe; color: #1e40af; }
.adm-chip-mute { background: #f1f5f9; color: #64748b; }
.adm-chip-new { background: linear-gradient(135deg, #6366f1, #8b5cf6); color: #fff; }
.adm-chip-green { background: #dcfce7; color: #166534; }
.adm-chip-amber { background: #fef3c7; color: #92400e; }
.adm-chip-red { background: #fee2e2; color: #991b1b; }
.adm-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 10px; border: 1px solid transparent; cursor: pointer; font-size: 13px; font-weight: 600; font-family: inherit; text-decoration: none; transition: all .15s; }
.adm-btn-mini { padding: 5px 10px; font-size: 11px; border-radius: 8px; }
.adm-btn-primary { background: #6366f1; color: #fff; }
.adm-btn-primary:hover { background: #4f46e5; }
.adm-btn-secondary { background: #fff; color: #0f172a; border-color: #e5e7eb; }
.adm-btn-secondary:hover { border-color: #6366f1; color: #6366f1; }
.adm-btn-ghost { background: transparent; color: #6366f1; }
.adm-btn-danger { background: #fee2e2; color: #991b1b; }
.adm-btn-danger:hover { background: #fecaca; }
.adm-btn:disabled { opacity: .5; cursor: not-allowed; }
.adm-drawer-overlay { position: fixed; inset: 0; background: rgba(15,23,42,.6); z-index: 9999; display: flex; justify-content: flex-end; backdrop-filter: blur(2px); }
.adm-drawer { background: #f5f6fb; width: min(100%, 640px); height: 100%; overflow-y: auto; display: flex; flex-direction: column; }
.adm-drawer-head { display: flex; justify-content: space-between; align-items: center; padding: 18px 20px; background: #fff; border-bottom: 1px solid #e5e7eb; position: sticky; top: 0; z-index: 1; }
.adm-drawer-head h2 { font-size: 16px; font-weight: 700; margin: 0; font-family: "Sora", sans-serif; }
.adm-x { width: 36px; height: 36px; border-radius: 50%; border: 0; background: #f1f5f9; cursor: pointer; font-size: 22px; color: #475569; line-height: 1; }
.adm-x:hover { background: #e2e8f0; }
.adm-drawer-body { padding: 16px; display: flex; flex-direction: column; gap: 16px; }
.adm-section { display: flex; flex-direction: column; gap: 10px; }
.adm-section h4 { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #64748b; margin: 0; }
.adm-cust-box { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.adm-muted { color: #64748b; font-size: 12px; }
.adm-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.adm-form-grid label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: #64748b; font-weight: 600; }
.adm-form-grid label.full { grid-column: 1 / -1; }
.adm-items { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.adm-items li { display: grid; grid-template-columns: 1fr 60px 100px; gap: 8px; padding: 8px 12px; background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; font-size: 13px; }
.adm-items li span:last-child { text-align: right; font-weight: 700; }
.adm-total-row { display: flex; justify-content: space-between; padding: 10px 12px; background: #f8fafc; border-radius: 8px; font-size: 14px; }
.adm-codes { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.adm-codes li { display: flex; align-items: center; gap: 10px; padding: 10px 12px; background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; flex-wrap: wrap; }
.adm-codes li.claimed { background: #f0fdf4; border-color: #bbf7d0; }
.adm-codes code { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 13px; font-weight: 700; letter-spacing: .15em; color: #0f172a; flex: 1; }
.adm-add-codes { display: grid; grid-template-columns: 80px 1fr auto; gap: 8px; margin-top: 10px; padding-top: 12px; border-top: 1px dashed #e5e7eb; }
.adm-back { display: inline-block; font-size: 13px; color: #6366f1; text-decoration: none; margin-bottom: 4px; }
.adm-cust-header { display: flex; align-items: center; gap: 16px; }
.adm-cust-av { width: 48px; height: 48px; border-radius: 50%; background: linear-gradient(135deg, #6366f1, #8b5cf6); color: #fff; display: grid; place-items: center; font-size: 18px; font-weight: 700; flex-shrink: 0; }
.adm-cust-av.lg { width: 64px; height: 64px; font-size: 24px; }
.adm-cust-info { flex: 1; min-width: 0; }
.adm-cust-info h2 { font-size: 18px; margin: 0 0 4px; font-family: "Sora", sans-serif; }
.adm-cust-actions { display: flex; flex-direction: column; gap: 6px; }
.adm-subtabs { display: flex; gap: 4px; background: #fff; padding: 4px; border-radius: 10px; border: 1px solid #e5e7eb; width: fit-content; }
.adm-subtabs button { border: 0; background: transparent; padding: 6px 14px; border-radius: 8px; font-size: 13px; font-weight: 600; color: #64748b; cursor: pointer; text-transform: capitalize; }
.adm-subtabs button.on { background: #6366f1; color: #fff; }
.adm-mini-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; font-size: 13px; }
.adm-mini-list li { padding: 8px 0; border-bottom: 1px solid #f1f5f9; }
.adm-note-add { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }

/* Tablet */
@media (max-width: 1023px) {
  .adm-kpis, .adm-quick-actions { grid-template-columns: repeat(2, 1fr); }
  .adm-grid-2 { grid-template-columns: 1fr; }
}
/* Mobile */
@media (max-width: 640px) {
  .adm-header { padding: 14px 14px 0; }
  .adm-title { font-size: 17px; }
  .adm-body { padding: 14px; }
  .adm-kpis, .adm-kpis-tight, .adm-quick-actions { grid-template-columns: 1fr 1fr; gap: 8px; }
  .adm-kpi-value { font-size: 20px; }
  .adm-card { padding: 12px; border-radius: 12px; }
  .adm-form-grid { grid-template-columns: 1fr; }
  .adm-row { flex-wrap: wrap; }
  .adm-cust-header { flex-direction: column; align-items: flex-start; text-align: left; }
  .adm-add-codes { grid-template-columns: 1fr; }
  .adm-items li { grid-template-columns: 1fr auto; }
  .adm-items li span:nth-child(2) { display: none; }
  .adm-tab { padding: 8px 10px; font-size: 12px; }
}