/* Paragon Mission Control, phone layout (Nov 6, 2026). Loaded by index.html with media="(max-width: 820px)",
   so a computer never applies it. Same brand kit as app.css (#f5f5f7, white, #1d1d1f, orange as the only accent, Inter),
   laid out like an iPhone app: bottom tab bar, large titles, grouped lists, sheets that slide up, 44 px touch targets.
   Every class here starts with "m-" so it never collides with the computer styles. Screens: js/m/. */
:root{
  --m-bg:#f5f5f7; --m-card:#fff; --m-sep:#e5e5ea; --m-label:#636366; --m-mute:#6e6e73; --m-chev:#c7c7cc; --m-fill:#f2f2f7; --m-track:#e8e8ed;
  --m-safe-t:env(safe-area-inset-top,0px); --m-safe-b:env(safe-area-inset-bottom,0px); --m-tab:56px;
  --m-spring:cubic-bezier(.32,.72,0,1);
}
html{background:var(--m-bg)}
body.phone{font-size:17px;line-height:1.35;-webkit-tap-highlight-color:transparent;overscroll-behavior-y:none}
/* the computer menu gives way to the tab bar */
body.phone .nav{display:none !important}
body.phone .shell{display:block;min-height:100dvh}
body.phone .main{padding-bottom:calc(var(--m-tab) + var(--m-safe-b) + 20px)}
body.phone[data-route="lead"] .main{padding-bottom:calc(84px + var(--m-safe-b))}
body.phone.m-selecting .main{padding-bottom:calc(var(--m-tab) + var(--m-safe-b) + 20px)}
/* iOS zooms into any field under 16 px */
input,select,textarea{font-size:16px !important}
html.m-locked,html.m-locked body{overflow:hidden}

/* ---------- page ---------- */
.m-page{max-width:680px;margin:0 auto;padding:calc(var(--m-safe-t) + 10px) 16px 16px;display:flex;flex-direction:column;gap:18px}
.m-loading{color:var(--m-mute);padding:24px 4px;font-size:15px}
.main>div:not(.settled) .m-page>*{animation:rise 380ms var(--ease) both}
.main>div:not(.settled) .m-page>*:nth-child(3){animation-delay:40ms}
.main>div:not(.settled) .m-page>*:nth-child(n+4){animation-delay:80ms}
.m-top{display:flex;align-items:center;justify-content:flex-end;gap:10px;min-height:36px}
.m-top.sel{display:grid;grid-template-columns:1fr auto 1fr;justify-content:stretch}
.m-top.sel .m-link.end{justify-self:end}
.m-top-title{font-size:17px;font-weight:600;text-align:center;white-space:nowrap}
.m-top .m-link:first-child:not(:only-child){margin-right:auto}
.m-circle{width:36px;height:36px;border-radius:50%;background:var(--m-track);color:var(--ink);display:flex;align-items:center;justify-content:center;text-decoration:none;flex:none;transition:transform 120ms}
.m-circle:active{transform:scale(.92)}
.m-circle.me{background:var(--grad-fill);color:#1d1d1f;font:700 13px var(--display)}
.m-circle.me.seb{background:var(--ink);color:#fff}
.m-link{border:0;background:none;padding:0;min-height:44px;display:inline-flex;align-items:center;gap:6px;font:500 17px var(--display);color:var(--accent-ink);text-decoration:none;cursor:pointer}
.m-link:active{opacity:.55}
.m-link.block{align-self:flex-start;padding:0 4px;font-size:15px}
.m-title{display:flex;flex-direction:column;gap:2px;margin-top:-4px}
.m-title h1{font-size:34px;line-height:41px;font-weight:700;letter-spacing:-.022em}
.m-title.inline{flex-direction:row;align-items:baseline;gap:10px}
.m-title.split{flex-direction:row;align-items:flex-end;justify-content:space-between;gap:12px}
.m-over{font:600 13px/18px var(--display);letter-spacing:.04em;text-transform:uppercase;color:var(--m-label)}
.m-sub{font-size:15px;line-height:20px;color:var(--m-mute)}
.m-count{font-size:20px;font-weight:600;color:var(--m-mute)}
.m-eyebrow{font:700 12px/16px var(--display);letter-spacing:.18em;text-transform:uppercase;color:var(--accent-ink)}
.m-hint{font-size:13px;line-height:18px;color:var(--m-mute);padding:0 4px;margin-top:2px}
.m-p{font-size:16px;line-height:22px}
.m-warn{font-size:14px;line-height:19px;color:var(--amber);background:var(--amber-soft);padding:10px 12px;border-radius:12px}
.m-s{font-size:14px;line-height:19px;color:var(--m-mute)}
.m-s.late,.late{color:var(--red)}
.m-stack{display:flex;flex-direction:column;gap:14px}
.m-list{display:flex;flex-direction:column;gap:20px}

/* ---------- grouped lists ---------- */
.m-sec{display:flex;flex-direction:column;gap:6px}
.m-h{margin:0 0 0 4px;font:600 13px/18px var(--display);letter-spacing:.04em;text-transform:uppercase;color:var(--m-label)}
.m-h.big{margin:0;font-size:22px;line-height:28px;font-weight:700;letter-spacing:-.015em;text-transform:none;color:var(--ink)}
.m-group{background:var(--m-card);border-radius:16px;overflow:hidden;--inset:16px}
.m-group.av{--inset:68px}
.m-group.ic{--inset:58px}
.m-group.pk{--inset:52px}
.m-group.q{--inset:74px}
.m-group>*{position:relative}
.m-group>*:not(:last-child)::after{content:"";position:absolute;left:var(--inset);right:0;bottom:0;height:1px;background:var(--m-sep);z-index:2;pointer-events:none}
.m-row{display:flex;align-items:center;gap:12px;width:100%;min-height:54px;padding:0 14px 0 16px;border:0;background:var(--m-card);color:var(--ink);text-decoration:none;text-align:left;font:inherit;cursor:pointer;transition:background 150ms}
.m-row:active{background:#ebebf0}
.m-row>.m-i:last-child{color:var(--m-chev);flex:none}
.m-body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;justify-content:center;padding:9px 0}
.m-t{font-size:17px;line-height:22px;font-weight:400;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink)}
.m-t b{font-weight:600}
.m-body .m-s{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.m-group.av .m-t,.m-group.pk .m-t,.m-group.q .m-t{font-weight:500}
.m-end{flex:none;font-size:15px;color:var(--m-mute);font-variant-numeric:tabular-nums}
.m-end.small{font-size:13px}
.m-end.hot{color:var(--accent-ink);font-weight:600}
.m-end.late{color:var(--red);font-weight:600}
.m-row.soon{cursor:default}.m-row.soon .m-t{color:var(--m-mute)}
.m-row.soon:active{background:var(--m-card)}
.m-opt.danger .m-t{color:var(--red)}
.m-opt.center .m-t{text-align:center}
.m-tick{color:var(--accent-ink);flex:none;display:flex}
.m-av{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#ffe2cc,#fff4ec);color:var(--accent-deep);font:700 15px/1 var(--display);letter-spacing:-.01em;display:flex;align-items:center;justify-content:center;flex:none}
.m-av.out{background:var(--m-track);color:var(--m-mute)}
.m-av.lg{width:60px;height:60px;font-size:21px}
.m-av.me{background:var(--grad-fill);color:#1d1d1f}
.m-av.seb{background:var(--ink);color:#fff}
.m-av.xl{width:84px;height:84px;font-size:30px}
.m-ico{width:30px;height:30px;border-radius:8px;background:var(--accent);color:#1d1d1f;display:flex;align-items:center;justify-content:center;flex:none}
.m-ico.dark{background:var(--ink);color:#fff}
.m-ico.grey{background:#8e8e93;color:#fff}
.m-score{width:24px;height:24px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;font:700 12px var(--display);background:var(--m-track);color:var(--ink);flex:none}
.m-score.A{background:var(--ink);color:#fff}
.m-score.C{background:transparent;box-shadow:inset 0 0 0 1px #aeaeb2;color:var(--m-mute)}
.m-empty{display:flex;flex-direction:column;align-items:center;gap:10px;padding:48px 16px;color:var(--m-chev);text-align:center}
.m-empty .m-t{color:var(--m-mute);white-space:normal}

/* ---------- buttons ---------- */
.m-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 18px;border:0;border-radius:14px;font:600 17px/1.2 var(--display);text-decoration:none;cursor:pointer;white-space:nowrap;transition:transform 120ms,opacity 120ms,background 150ms}
.m-btn:active{transform:scale(.97);opacity:.88}
.m-btn[disabled]{opacity:.38;cursor:not-allowed;transform:none}
.m-btn.primary{background:var(--grad-button);color:#1d1d1f}
.m-btn.primary.danger{background:var(--red);color:#fff}
.m-btn.dark{background:var(--ink);color:#fff}
.m-btn.soft{background:#e9e9ee;color:var(--ink)}
.m-btn.white{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1px var(--m-sep)}
.m-btn.plain{background:none;color:var(--accent-ink);min-height:44px;font-weight:500}
.m-btn.sm{min-height:36px;padding:0 14px;border-radius:999px;font-size:15px}
.m-btn.big{min-height:54px;border-radius:15px}
.m-btn.sq{width:54px;padding:0;flex:none}
.m-btn.sq:not(.big){width:52px;min-height:52px}
.m-btn.wide{width:100%}
.m-btn.grow{flex:1 1 auto}
.m-row-btns{display:flex;gap:10px}
.m-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.m-badge{font:600 12px/16px var(--display);color:var(--accent-deep);background:var(--accent-soft);padding:4px 10px;border-radius:999px}
.m-badge.late{color:var(--red);background:var(--red-soft)}

/* ---------- cards ---------- */
.m-card{background:var(--m-card);border-radius:22px;padding:18px;display:flex;flex-direction:column;gap:14px;box-shadow:0 1px 2px rgba(0,0,0,.05),0 12px 32px rgba(0,0,0,.06)}
.m-card-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.m-next-main{display:flex;align-items:flex-start;gap:14px;text-decoration:none;color:var(--ink)}
.m-next-main .m-body{padding:0}
.m-next-time{font:700 30px/34px var(--display);letter-spacing:-.02em;font-variant-numeric:tabular-nums;flex:none}
.m-next-time.word{font-size:22px;line-height:34px}
.m-next-name{font-size:19px;line-height:24px;font-weight:600;letter-spacing:-.01em}
.m-quote{font-size:15px;line-height:21px;color:var(--ink2);background:var(--m-bg);border-radius:12px;padding:10px 12px}
.m-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.m-tile{background:var(--m-card);border-radius:16px;padding:12px 12px 10px;display:flex;flex-direction:column;gap:2px;text-decoration:none;color:var(--ink);transition:transform 120ms}
.m-tile:active{transform:scale(.97)}
.m-tile b{font:700 28px/32px var(--display);font-variant-numeric:tabular-nums}
.m-tile b.hot{color:var(--accent-ink)}
.m-tile span{font:600 13px/17px var(--display)}
.m-tile small{font-size:12px;line-height:16px;color:var(--m-mute);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.m-ev .m-s{white-space:nowrap}

/* ---------- search, chips, segmented ---------- */
.m-search{display:flex;align-items:center;gap:6px;height:38px;border-radius:11px;background:var(--m-track);padding:0 8px 0 10px;color:#8e8e93;margin-top:-8px}
.m-search input{flex:1 1 auto;min-width:0;height:38px;min-height:0 !important;border:0 !important;background:transparent !important;box-shadow:none !important;padding:0 !important;font:17px var(--display) !important;color:var(--ink);-webkit-appearance:none;appearance:none}
.m-search input::-webkit-search-cancel-button{display:none}
.m-search input:focus{box-shadow:none !important}
.m-search-x{width:20px;height:20px;border-radius:50%;border:0;background:#8e8e93;color:var(--m-track);display:flex;align-items:center;justify-content:center;padding:0;flex:none;cursor:pointer}
.m-chips{display:flex;gap:8px;overflow-x:auto;margin:-6px -16px 0;padding:2px 16px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.m-chips::-webkit-scrollbar{display:none}
.m-chip{flex:none;height:34px;padding:0 14px;border:0;border-radius:999px;background:var(--m-card);color:var(--ink);box-shadow:inset 0 0 0 1px var(--m-sep);font:500 14px var(--display);display:inline-flex;align-items:center;gap:6px;cursor:pointer;white-space:nowrap;transition:background 150ms,color 150ms}
.m-chip:active{transform:scale(.96)}
.m-chip.on{background:var(--ink);color:#fff;box-shadow:none;font-weight:600}
.m-seg{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);height:34px;border-radius:10px;background:var(--m-track);padding:2px;gap:2px}
.m-seg>*{border:0;border-radius:8px;background:transparent;font:500 13px var(--display);color:var(--ink);display:flex;align-items:center;justify-content:center;text-decoration:none;cursor:pointer;padding:0 10px;white-space:nowrap;transition:background 180ms,box-shadow 180ms}
.m-seg>[aria-selected="true"]{background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.12),0 0 0 .5px rgba(0,0,0,.04);font-weight:600}
.m-seg,.m-msg{scroll-margin-top:12px}
.m-seg.sm{height:32px;grid-auto-columns:auto;border-radius:9px;margin-bottom:4px}
.m-seg.sm>*{border-radius:7px;padding:0 12px}

/* ---------- swipe rows ---------- */
.m-swipe{overflow:hidden;background:var(--m-card)}
.m-swipe-acts{position:absolute;top:0;right:0;bottom:0;display:flex}
.m-swipe-acts button{width:76px;border:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font:600 12px var(--display);cursor:pointer}
.m-swipe-acts .sms{background:var(--accent);color:#1d1d1f}
.m-swipe-acts .call{background:var(--ink);color:#fff}
.m-swipe-acts button[disabled]{background:#c7c7cc;color:#fff}
.m-swipe-front{position:relative;z-index:1;touch-action:pan-y;transition:transform 300ms var(--m-spring);will-change:transform}
.m-pickrow{gap:14px}
.m-tickbox{width:24px;height:24px;border-radius:50%;box-shadow:inset 0 0 0 2px #c7c7cc;display:flex;align-items:center;justify-content:center;flex:none;color:#1d1d1f;transition:background 150ms}
.m-tickbox.on{background:var(--accent);box-shadow:none}
.m-tickbox .m-i{stroke-width:3.4}

/* ---------- tab bar, selection bar, action bar ---------- */
.m-tabbar,.m-selbar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));height:calc(var(--m-tab) + var(--m-safe-b));padding:7px 6px var(--m-safe-b);background:rgba(250,250,252,.84);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-top:.5px solid rgba(0,0,0,.16)}
.m-tab{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;text-decoration:none;color:var(--m-mute);font:500 10px/12px var(--display);letter-spacing:.01em}
.m-tab .m-i{color:#8e8e93;transition:transform 200ms var(--m-spring)}
.m-tab:active .m-i{transform:scale(.88)}
.m-tab[aria-current="page"]{color:var(--accent-ink);font-weight:600}
.m-tab[aria-current="page"] .m-i{color:var(--accent)}
.m-tab:hover{color:var(--m-mute)}.m-tab[aria-current="page"]:hover{color:var(--accent-ink)}
.m-tab-badge{position:absolute;top:-3px;left:calc(50% + 5px);min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--accent);color:#1d1d1f;font:700 11px/18px var(--display);text-align:center;box-shadow:0 0 0 2px rgba(250,250,252,.9)}
body[data-route="lead"] .m-tabbar,body.m-selecting .m-tabbar{display:none}
.m-selbar{display:none}
body.m-selecting .m-selbar{display:grid}
.m-selbar button{border:0;background:none;display:flex;flex-direction:column;align-items:center;gap:3px;padding:0;font:500 10px/12px var(--display);color:var(--ink2);cursor:pointer}
.m-selbar button:first-child{color:var(--accent-ink);font-weight:600}
.m-selbar button:first-child .m-i{color:var(--accent)}
.m-selbar button.danger{color:var(--red)}
.m-selbar button:active .m-i{transform:scale(.88)}
.m-actionbar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;gap:10px;padding:10px 16px calc(10px + var(--m-safe-b));background:rgba(245,245,247,.88);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-top:.5px solid rgba(0,0,0,.14)}
.m-actionbar .m-btn{min-height:52px}
.m-actionbar>*{max-width:680px}

/* ---------- lead card ---------- */
.m-navbar{display:flex;align-items:center;justify-content:space-between;min-height:44px;margin:0 -6px -8px}
.m-backbar{max-width:680px;margin:0 auto;padding:calc(var(--m-safe-t) + 4px) 10px 0}
.m-back{display:inline-flex;align-items:center;gap:2px;min-height:44px;font:500 17px var(--display);color:var(--accent-ink);text-decoration:none}
.m-back .m-i{margin-left:-2px;stroke-width:2.6}
.m-back:active{opacity:.55}
.m-hero{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.m-hero-av{position:relative}
.m-hero-score{position:absolute;right:-2px;bottom:-2px;width:28px;height:28px;border-radius:50%;background:var(--ink);color:#fff;border:3px solid var(--m-bg);display:flex;align-items:center;justify-content:center;font:700 12px var(--display);box-sizing:content-box}
.m-hero h1{font-size:26px;line-height:32px;font-weight:700;letter-spacing:-.02em;margin-top:2px;overflow-wrap:anywhere}
.m-hero .m-s{font-size:15px;line-height:20px}
.m-tags{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:2px}
.m-tag{height:30px;padding:0 10px 0 12px;border:0;border-radius:999px;font:600 13px var(--display);display:inline-flex;align-items:center;gap:5px;cursor:pointer}
.m-tag.grey{background:var(--m-track);color:var(--ink)}
.m-tag:active{transform:scale(.96)}
.m-rappel{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--accent-ink)}
.m-rappel.late{color:var(--red)}
.m-acts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.m-act{height:64px;border:0;border-radius:14px;background:var(--m-card);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;color:var(--accent-ink);font:600 12px var(--display);text-decoration:none;cursor:pointer;transition:transform 120ms,background 150ms}
.m-act .m-i{color:var(--accent)}
.m-act:active{transform:scale(.95);background:#fff6ef}
.m-act[aria-disabled="true"],.m-act.off{opacity:.38;cursor:not-allowed;transform:none;background:var(--m-card)}
.m-tabbody{display:flex;flex-direction:column;gap:14px;min-height:40vh}
.m-nextact{background:var(--m-card);border-radius:16px;padding:12px 14px 12px 16px;display:flex;align-items:center;gap:12px;box-shadow:inset 0 0 0 1px var(--accent-tint)}
.m-nextact .m-t{font-weight:600;white-space:normal}
.m-nextact.out{box-shadow:none}.m-nextact.out .m-eyebrow{color:var(--m-mute)}
.m-quote-card{background:var(--accent-soft);border-radius:16px;padding:12px 16px;display:flex;flex-direction:column;gap:4px}
.m-quote-card p{font-size:16px;line-height:22px;color:var(--ink)}
.m-kv{display:flex;align-items:center;gap:12px;min-height:46px;padding:0 14px 0 16px;color:var(--ink);text-decoration:none;cursor:default}
a.m-kv,.m-kv[role="button"]{cursor:pointer}
a.m-kv:active,.m-kv[role="button"]:active{background:#ebebf0}
.m-kv .k{font-size:15px;color:var(--m-mute);flex:none}
.m-kv .v{flex:1 1 auto;min-width:0;text-align:right;font-size:15px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-variant-numeric:tabular-nums}
.m-kv .v.chips{justify-content:flex-end}
a.m-kv .v{color:var(--accent-ink)}
.m-kv>.m-i:last-child{color:var(--m-chev);flex:none}
.m-crit{display:flex;flex-wrap:wrap;gap:6px;padding:0 2px}
.m-crit .ok{background:var(--green-soft);color:var(--green)} .m-crit .ko{background:var(--red-soft);color:var(--red)}
.m-evrow{display:flex;flex-direction:column;gap:2px;padding:10px 16px}
.m-evrow.hot{background:var(--accent-soft)}
.m-evk{display:flex;justify-content:space-between;gap:10px;font:600 11px/16px var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--m-mute)}
.m-evk time{font-weight:500;letter-spacing:0;text-transform:none;font-size:12px;flex:none}
.m-evt{font-size:15px;line-height:21px;overflow-wrap:anywhere}
.m-noteform{display:flex;gap:8px;align-items:center}
.m-noteform .m-input{flex:1 1 auto;min-width:0}
/* message cards */
.m-msg{background:var(--m-card);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:10px}
.m-msg.off{opacity:.55}
.m-msg header{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.m-msg header b{font-size:16px;font-weight:600}
.m-msg-text{white-space:pre-wrap;font-size:15px;line-height:1.5;background:var(--m-bg);border-radius:12px;padding:10px 12px;overflow-wrap:anywhere}
.m-msg-acts{display:flex;flex-wrap:wrap;gap:8px}
/* the fiche form, iOS-style grouped fields */
.m-group.form{--inset:16px}
.m-frow{display:flex;flex-direction:column;gap:1px;padding:8px 16px 6px;cursor:text}
.m-frow>span{font-size:12px;line-height:16px;font-weight:500;color:var(--m-mute)}
.m-frow input:not([type=checkbox]),.m-frow select,.m-frow textarea{border:0 !important;box-shadow:none !important;background:transparent !important;padding:0 !important;min-height:30px !important;border-radius:0;font:17px/1.35 var(--display) !important;color:var(--ink);width:100%}
.m-frow textarea{resize:none;padding-top:4px !important}
.m-frow select{-webkit-appearance:none;appearance:none}
.m-frow.switch{flex-direction:row;align-items:center;justify-content:space-between;min-height:50px;padding-top:0;padding-bottom:0;cursor:pointer}
.m-frow.switch>span{font-size:17px;font-weight:400;color:var(--ink)}
.m-frow input[type=checkbox]{-webkit-appearance:none;appearance:none;width:51px;height:31px;border-radius:999px;background:#e9e9ea;position:relative;flex:none;margin:0;cursor:pointer;transition:background 200ms}
.m-frow input[type=checkbox]::after{content:"";position:absolute;top:2px;left:2px;width:27px;height:27px;border-radius:50%;background:#fff;box-shadow:0 3px 8px rgba(0,0,0,.15),0 1px 1px rgba(0,0,0,.16);transition:transform 220ms var(--m-spring)}
.m-frow input[type=checkbox]:checked{background:var(--accent)}
.m-frow input[type=checkbox]:checked::after{transform:translateX(20px)}

/* ---------- calls ---------- */
.m-prog{height:5px;border-radius:3px;background:var(--m-track);overflow:hidden;margin-top:-6px}
.m-prog i{display:block;height:5px;border-radius:3px;background:var(--grad-button);min-width:5px;transition:width 500ms var(--ease)}
.m-focus{gap:12px}
.m-focus-name{text-decoration:none;color:var(--ink);display:flex;flex-direction:column;gap:2px}
.m-focus-name h2{font-size:24px;line-height:30px;font-weight:700;letter-spacing:-.018em}
.m-focus-name .m-s{font-size:15px;line-height:20px}
.m-phone-line{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px}
.m-phone{font:600 28px/34px var(--display);letter-spacing:.01em;font-variant-numeric:tabular-nums}
.m-last{display:flex;gap:10px;font-size:14px;line-height:19px}
.m-last .m-s{flex:none;width:70px;font-size:13px}
.m-focus.done{align-items:center;text-align:center;padding:28px 18px}
.m-focus.done h2{font-size:21px;line-height:26px}
.m-done-ico{width:52px;height:52px;border-radius:50%;background:var(--accent-soft);color:var(--accent-ink);display:flex;align-items:center;justify-content:center}
.m-qtime{width:46px;flex:none;font:600 15px var(--display);color:var(--accent-ink);font-variant-numeric:tabular-nums}
.m-qtime.soft{color:var(--m-mute);font-weight:500;font-size:13px}
.m-qtime.late{color:var(--red);font-size:13px}

/* ---------- plus ---------- */
.m-profile{display:flex;align-items:center;gap:14px;background:var(--m-card);border-radius:16px;padding:14px 16px}
.m-profile .m-t{font-size:19px;font-weight:600}
.m-foot{display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 0 4px}
.m-foot img{height:22px;width:auto;opacity:.9}
.m-foot span{font-size:12px;color:var(--m-mute);letter-spacing:.04em}
.m-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.m-steps li{display:flex;gap:12px;align-items:flex-start;font-size:16px;line-height:22px}
.m-steps .m-i{vertical-align:-3px;color:var(--accent-ink)}
.m-num{width:26px;height:26px;border-radius:50%;background:var(--ink);color:#fff;font:700 13px/26px var(--display);text-align:center;flex:none}

/* ---------- sheets ---------- */
.m-backdrop{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.34);opacity:0;transition:opacity 280ms ease}
.m-backdrop.on{opacity:1}
.m-sheet{position:fixed;left:0;right:0;bottom:0;z-index:61;max-width:680px;margin:0 auto;max-height:calc(100dvh - var(--m-safe-t) - 28px);display:flex;flex-direction:column;background:var(--m-bg);border-radius:20px 20px 0 0;box-shadow:0 -10px 40px rgba(0,0,0,.22);transform:translateY(105%);transition:transform 380ms var(--m-spring);padding-bottom:var(--m-safe-b)}
.m-sheet.on{transform:none}
.m-grab{align-self:center;width:38px;height:5px;border-radius:3px;background:#c7c7cc;margin:8px 0 0;flex:none}
.m-sheet-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:8px 16px 12px;flex:none;touch-action:none}
.m-sheet-titles{min-width:0}
.m-sheet-head h2{font-size:22px;line-height:28px;font-weight:700;letter-spacing:-.015em}
.m-sheet-head p{font-size:15px;line-height:20px;color:var(--m-mute);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.m-x{width:32px;height:32px;border-radius:50%;border:0;background:var(--m-track);color:var(--m-mute);display:flex;align-items:center;justify-content:center;flex:none;cursor:pointer;padding:0}
.m-x .m-i{stroke-width:2.6}
.m-sheet-body{overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:0 16px 16px;display:flex;flex-direction:column;gap:14px;min-height:0}
.m-sheet-foot{padding:10px 16px 12px;flex:none;display:flex;flex-direction:column;gap:4px;border-top:.5px solid rgba(0,0,0,.08)}
.m-field{display:flex;flex-direction:column;gap:6px}
.m-field>label,.m-lab{margin-left:4px;font:600 13px/18px var(--display);letter-spacing:.04em;text-transform:uppercase;color:var(--m-label)}
.m-input{width:100%;min-height:48px !important;border:0 !important;border-radius:12px !important;background:#fff !important;padding:0 14px !important;font:17px var(--display) !important;color:var(--ink);box-shadow:none !important}
textarea.m-input{padding:12px 14px !important;line-height:1.4;resize:none}
.m-input:focus{box-shadow:0 0 0 3px #ec660b3d !important}
.m-pills{display:flex;flex-wrap:wrap;gap:8px}
.m-pill{height:34px;padding:0 13px;border-radius:999px;border:1px solid #d9d9de;background:#fff;font:500 14px var(--display);color:var(--ink);cursor:pointer;transition:background 150ms,color 150ms}
.m-pill[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff;font-weight:600}
.m-pill:active{transform:scale(.96)}
.m-select select{border:0 !important;box-shadow:none !important;background:transparent !important;min-height:44px !important;width:auto;max-width:52%;padding:0 4px 0 0 !important;text-align:right;text-align-last:right;color:var(--m-mute);-webkit-appearance:none;appearance:none;font:17px var(--display) !important;direction:ltr}
.m-select .m-i{color:var(--m-chev);flex:none}
.m-select .m-body{flex:0 1 auto}
.m-select{justify-content:space-between}
/* call result rows */
.m-results{--inset:66px}
.m-res-row{display:flex;align-items:center;gap:12px;width:100%;min-height:64px;padding:0 14px;border:0;background:transparent;text-align:left;font:inherit;color:var(--ink);cursor:pointer}
.m-res-row .m-t{font-weight:600}
.m-res-row .m-s{white-space:normal}
.m-res-ico{width:38px;height:38px;border-radius:50%;background:var(--m-fill);color:var(--ink2);display:flex;align-items:center;justify-content:center;flex:none;transition:background 180ms,color 180ms}
.m-res.warm .m-res-ico{background:var(--accent-soft);color:var(--accent-ink)}
.m-res.danger .m-t{color:var(--red)}
.m-res.danger .m-res-ico{background:var(--red-soft);color:var(--red)}
.m-res .m-tick{visibility:hidden}
.m-res-more{display:none;padding:0 14px 14px 64px;flex-direction:column;gap:10px}
.m-res.on{background:#fffaf6;box-shadow:inset 3px 0 0 var(--accent)}
.m-res.on .m-tick{visibility:visible}
.m-res.on .m-res-ico{background:var(--accent);color:#1d1d1f}
.m-res.danger.on{background:#fff6f6;box-shadow:inset 3px 0 0 var(--red)}
.m-res.danger.on .m-res-ico{background:var(--red);color:#fff}
.m-res.danger.on .m-tick{color:var(--red)}
.m-res.on .m-res-more{display:flex}

/* ---------- computer screens shown on a phone (Parcours, Données, Ajouter) ---------- */
body.phone .page-head{background:transparent;padding:4px 16px 4px;max-width:680px;margin:0 auto}
body.phone .page-head::before,body.phone .page-head::after{display:none}
body.phone .page-head h1{font-size:30px;line-height:36px;letter-spacing:-.02em}
body.phone .page-body{max-width:680px;margin:0 auto;padding-top:8px}
body.phone .card,body.phone .kpi,body.phone .stage{border:0;border-radius:16px;box-shadow:none}
body.phone .loading{padding:24px 16px}
body.phone .error-box{margin:16px;border-radius:16px}

/* ---------- toasts: a pill at the top, like iOS banners ---------- */
.toasts{top:calc(var(--m-safe-t) + 8px);bottom:auto;left:16px;right:16px;max-width:none;align-items:center;z-index:120}
.toast{border-radius:999px;padding:11px 18px;font-size:15px;font-weight:500;text-align:center;max-width:100%;box-shadow:0 8px 30px rgba(0,0,0,.18);animation:m-toast 320ms var(--m-spring) both}
@keyframes m-toast{from{opacity:0;transform:translateY(-16px) scale(.96)}to{opacity:1;transform:none}}

@media (hover:hover){.m-row:hover{background:#fafafc}.m-btn.primary:hover{filter:brightness(1.03)}}