/* PnBeyond redesign layer — "world-class mobile CRM" polish.
   Loaded LAST so it overrides the base + phase stylesheets.
   Principles: larger type, softer lines, generous touch targets,
   bottom-sheet modals on mobile, one soft shadow recipe. */

:root{
  --line:#e9edf4;
  --canvas:#f7f9fc;
  --shadow-soft:0 1px 2px rgba(23,38,71,.04),0 10px 30px rgba(23,38,71,.05);
  --radius-card:16px;
}

/* ---------- Surfaces ---------- */
.panel,.metric-card,.org-card{border-radius:var(--radius-card);border-color:#eaf0f6;box-shadow:var(--shadow-soft)}
.btn{border-radius:10px}
.btn.primary{box-shadow:0 6px 16px rgba(66,104,245,.22)}

/* ---------- Activity rows (everywhere: Home, popup, Activities) ---------- */
.activity-row{min-height:62px;gap:12px;border-top-color:#f0f3f8;padding:7px 2px}
.activity-check{width:26px;height:26px;border:2px solid #d3dcee;transition:background .15s,border-color .15s,transform .1s}
.activity-check:active{transform:scale(.9)}
.activity-check.checked{background:linear-gradient(145deg,#5d79ee,#4268f5);border-color:#4268f5;box-shadow:0 4px 10px rgba(66,104,245,.28)}
.activity-check svg{width:13px;height:13px;stroke-width:2.4}
.activity-type{width:36px;height:36px;border-radius:11px}
.activity-type svg{width:17px;height:17px}
.activity-copy{gap:3px}
.activity-copy b{font-size:13.5px;font-weight:620;letter-spacing:-.15px;color:#22314e}
.activity-copy small{font-size:11.5px;color:#8b96a9}
.activity-row time{font-size:11px;font-weight:600;color:#7c879c;font-variant-numeric:tabular-nums}
.activity-row.is-done .activity-copy b{color:#9aa5b5}
.activity-list .activity-row{min-height:64px}

/* ---------- Panels & headings ---------- */
.panel-heading h2{font-size:14.5px;letter-spacing:-.2px}
.panel-heading p{font-size:11px}
.page-heading h1,.welcome-row h1{letter-spacing:-.9px}

/* ---------- Home calendar ---------- */
.cal-panel{border-radius:18px}
.cal-day{min-height:47px;border-radius:12px}
.cal-num{font-size:14px;font-weight:600}
.cal-dots{gap:3px}
.cal-dots i,.cal-dots span{width:5px;height:5px}

/* ---------- Tables ---------- */
tbody td{font-size:11.5px}
.person-cell b{font-size:12px}
.person-cell small{font-size:10.5px}

/* ---------- Deal cards ---------- */
.deal-card{border-radius:12px;padding:12px 12px 11px}
.deal-card h3{font-size:12.5px}

/* ==================================================================
   MOBILE (<=700px) — the primary surface
   ================================================================== */
@media (max-width:700px){
  body{font-size:14.5px}

  /* Top bar: frosted glass */
  .topbar{height:62px;background:rgba(255,255,255,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom-color:#edf1f7}
  .profile-trigger{border-radius:12px}

  .page-content{padding:22px 16px 44px}
  .page-heading h1,.welcome-row h1{font-size:25px}
  .page-subtitle{font-size:12px}

  /* Touch targets */
  .btn{min-height:44px;border-radius:12px;font-size:13px;padding:0 16px}
  .icon-button{width:38px;height:38px;border-radius:11px}
  .nav-item{height:49px;border-radius:12px;font-size:14px}
  .sidebar{border-radius:0 22px 22px 0}

  /* Metric cards */
  .metric-card{border-radius:16px;padding:15px}
  .metric-card>strong{font-size:25px}
  .metric-card>small{font-size:10px}
  .metric-top{font-size:10.5px}

  /* Activity rows — roomy, readable */
  .activity-row{min-height:68px;gap:13px}
  .activity-check{width:28px;height:28px}
  .activity-type{width:38px;height:38px;border-radius:12px}
  .activity-copy b{font-size:14.5px}
  .activity-copy small{font-size:12.5px}
  .activity-row time{font-size:12px}
  .up-next-list{padding:0 16px 12px}
  .activity-list{padding:0 14px}
  .activity-list .activity-row{min-height:70px}

  /* Panels */
  .panel-heading{padding:17px 16px 13px}
  .panel-heading h2{font-size:15px}
  .panel-heading p{font-size:11.5px}

  /* Home calendar cells */
  .cal-day{min-height:50px}
  .cal-num{font-size:15px}

  /* Tables */
  tbody td{height:66px;font-size:12.5px}
  .person-cell b{font-size:13.5px}
  .person-cell small{font-size:11px}
  thead th{font-size:9px}

  /* Deal cards */
  .deal-card h3{font-size:13.5px}
  .deal-card-org{font-size:10.5px}
  .deal-card-bottom>b{font-size:11.5px}

  /* ---------- Bottom-sheet modals ---------- */
  .modal-backdrop{align-items:flex-end;padding:0;background:rgba(13,22,41,.52);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
  .modal-card{width:100%;max-height:93dvh;border-radius:24px 24px 0 0;box-shadow:0 -12px 44px rgba(13,22,41,.28);animation:sheetUp .3s cubic-bezier(.32,.72,.24,1);padding-top:6px}
  .modal-card::before{content:"";display:block;width:42px;height:5px;border-radius:99px;background:#dde4ee;margin:4px auto 2px;position:sticky;top:4px;z-index:3}
  @keyframes sheetUp{from{opacity:.4;transform:translateY(46px)}to{opacity:1;transform:translateY(0)}}
  .modal-head{padding:14px 20px 13px;position:sticky;top:10px;background:#fff;z-index:2}
  .modal-head h2{font-size:20px;letter-spacing:-.5px}
  .modal-body{padding:16px 20px 20px;gap:14px}
  .modal-body input,.modal-body select,.modal-body textarea,.form-stack input{height:48px;border-radius:12px;font-size:16px;padding:0 13px}
  .modal-body textarea{height:auto;padding:11px 13px}
  .modal-body label,.form-stack label{font-size:12px}
  .modal-footer{padding:13px 16px calc(13px + env(safe-area-inset-bottom));position:sticky;bottom:0;background:#fff;gap:10px}
  .modal-footer .btn{flex:1;min-height:50px;border-radius:13px;font-size:14px}
  .modal-footer .footer-spacer{display:none}
  .search-backdrop{padding:12px}
  .search-dialog{border-radius:18px}

  /* Day popup specifics */
  .home-day-body{max-height:none;gap:20px}
  .home-day-sec-head{margin-bottom:6px;align-items:center}
  .home-day-sec-head h3{font-size:16.5px;font-weight:720;letter-spacing:-.3px}
  .home-day-sec-head span{background:#f0f4fb;color:#64748f;border-radius:99px;padding:4px 10px;font-size:11.5px;font-weight:650}
  .home-day-sec + .home-day-sec{border-top-color:#eef1f6;padding-top:18px}
  .home-day-empty{font-size:13px;color:#93a0b4}
  .home-day-more{font-size:12.5px}
  .home-day-card .activity-list{padding:0}

  /* LINE / calendar-sync cards */
  .gcp-card{border-radius:16px}
  .gcp-button{min-height:48px;border-radius:12px;font-size:14px}

  /* People page — one simple search + sort, list right below */
  .contacts-toolbar{padding:14px 14px 12px;gap:10px}
  .contacts-search{display:grid;grid-template-columns:1fr;gap:9px;flex-basis:100%}
  .contacts-search .table-filter{width:100%;height:46px;border-radius:12px}
  .contacts-sort-control{margin-left:auto}
  .contacts-search .table-filter input{font-size:14px}
  .contacts-search select,.contacts-sort-control select,.people-views-controls select,.people-views-controls input{min-height:46px;border-radius:12px;font-size:14px}
  .contacts-more{grid-column:1/-1;width:100%}
  .contacts-more summary{min-height:46px;display:flex;align-items:center;justify-content:center;border-radius:12px;font-size:14px}
  .contacts-advanced{border-radius:14px}
  .contacts-sort-control{font-size:13px}
  .people-saved-views{padding:13px 14px}
  .people-views-heading b{font-size:15px}
  .people-views-heading p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:11.5px;margin:5px 0 9px}
  .people-views-controls{gap:9px}
  .people-views-controls button,.people-views-confirm button{min-height:46px;border-radius:12px}

  /* People table — name + phone fit the phone screen, no sideways scroll */
  .contacts-results table{min-width:0}
  .contacts-results th:nth-child(2),.contacts-results td:nth-child(2),
  .contacts-results th:nth-child(3),.contacts-results td:nth-child(3),
  .contacts-results th:nth-child(5),.contacts-results td:nth-child(5),
  .contacts-results th:nth-child(6),.contacts-results td:nth-child(6){display:none}
  .contacts-results td{white-space:normal}
}

/* ---------- Activities phase rows: readable long subjects ----------
   The phase row reuses .activity-row's grid (built for short titles),
   which squeezed the text into a sliver. Give it its own layout:
   check | main (title <=2 lines, meta 1 line) | menu, time under meta. */
.phase-activity.activity-row{
  display:grid;grid-template-columns:32px minmax(0,1fr) 32px;
  grid-template-areas:"check main more" "check time more";
  column-gap:10px;row-gap:3px;align-items:start;
  padding:13px 12px;border-radius:14px;
}
.phase-activity .activity-check{grid-area:check;margin-top:1px}
.phase-activity>span{grid-area:main;min-width:0;display:grid;gap:3px}
.phase-activity>span b{
  font-size:14.5px;font-weight:630;line-height:1.38;letter-spacing:-.15px;color:#22314e;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  overflow-wrap:break-word;white-space:normal;
}
.phase-activity>span small{
  display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  font-size:12px;color:#8b96a9;line-height:1.35;
}
.phase-activity time{grid-area:time;justify-self:start;font-size:12px;font-weight:600;color:#7c879c;font-variant-numeric:tabular-nums}
.phase-activity .activity-more{grid-area:more;justify-self:end;width:32px;height:32px}
.phase-activity.is-done>span b{color:#9aa5b5}

/* Desktop sheet nicety: softer modal entrance */
@media (min-width:701px){
  .modal-card{border-radius:18px}
  .modal-footer .btn{min-height:40px}
}

/* ==================================================================
   BRAND TOP BAR (rd2) — logo blue, minimal: menu · logo · bell · avatar
   ================================================================== */
:root{--brand-blue:#0070C0;--brand-blue-deep:#0063A6;--brand-yellow:#FFEB00}
.topbar{
  position:fixed;top:0;left:0;right:0;height:62px;z-index:40;
  display:flex;align-items:center;gap:6px;padding:0 14px;
  background:linear-gradient(180deg,#0E80D2 0%,var(--brand-blue) 58%,#006BB4 100%);
  border-bottom:0;box-shadow:0 8px 24px rgba(0,84,143,.28);
  animation:barIn .38s cubic-bezier(.22,.8,.3,1);
}
@keyframes barIn{from{transform:translateY(-100%)}to{transform:translateY(0)}}
.main-area{margin-top:62px}
.sidebar{padding-top:78px;z-index:30}
.topbar-menu{color:#fff;width:42px;height:42px;border-radius:12px;flex:none;transition:background .18s ease,transform .12s ease}
.topbar-menu:hover{background:rgba(255,255,255,.16);color:#fff}
.topbar-menu:active{transform:scale(.9)}
.topbar-menu svg{width:21px;height:21px}
.topbar-brand{display:flex;align-items:center;gap:9px;background:none;border:0;padding:5px 8px 5px 2px;border-radius:12px;cursor:pointer;transition:background .18s ease;min-width:0}
.topbar-brand:hover{background:rgba(255,255,255,.10)}
.topbar-brand img{height:34px;width:auto;max-width:none;flex:none;object-fit:contain;display:block;filter:drop-shadow(0 2px 5px rgba(0,45,86,.35))}
.topbar-wordmark{color:#fff;font-size:16.5px;font-weight:780;letter-spacing:-.35px;white-space:nowrap}
.topbar-wordmark i{font-style:normal;color:var(--brand-yellow)}
.topbar .top-actions{margin-left:auto;display:flex;align-items:center;gap:9px}
.topbar .notification-trigger{position:relative;color:#fff;width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.14);transition:background .18s ease,transform .12s ease}
.topbar .notification-trigger:hover{background:rgba(255,255,255,.24);color:#fff}
.topbar .notification-trigger:active{transform:scale(.9)}
.topbar .notification-trigger svg{width:20px;height:20px}
.topbar .notification-count{background:var(--brand-yellow);color:#0B4A7C;font-weight:800;box-shadow:0 2px 6px rgba(0,45,86,.35)}
.topbar .profile-trigger{background:transparent;border:0;padding:0;box-shadow:none;border-radius:50%}
.topbar .profile-circle{display:block;width:41px;height:41px;border-radius:50%;cursor:pointer}
.topbar .profile-trigger-avatar{width:41px;height:41px;border-radius:50%;background:var(--brand-yellow);color:#00548F;border:2px solid rgba(255,255,255,.9);display:grid;place-items:center;font-size:13px;font-weight:800;letter-spacing:.2px;box-shadow:0 3px 10px rgba(0,45,86,.3);transition:transform .15s ease}
.topbar .profile-trigger:active .profile-trigger-avatar{transform:scale(.92)}
.profile-menu{border-radius:14px;animation:menuPop .16s cubic-bezier(.2,.8,.3,1)}
@keyframes menuPop{from{opacity:0;transform:translateY(-4px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
/* Drawer tools (search + create moved off the bar) */
.drawer-tools{display:flex;flex-direction:column;gap:9px;padding:2px 4px 16px}
.drawer-search{width:100%;height:42px;background:#22355C;border:1px solid #31497A;border-radius:11px;color:#9FB0CC;justify-content:flex-start;padding:0 12px;gap:9px}
.drawer-search .search-label{display:inline;font-size:12.5px;color:#C4D0E6}
.drawer-search kbd{display:inline-block;margin-left:auto;background:#24365C;border-color:#33497A;color:#93A7CC}
.drawer-create{width:100%;min-height:42px;border-radius:11px;font-size:13px}
.sidebar{transition:transform .45s cubic-bezier(.32,.72,0,1),box-shadow .45s ease}
@media (max-width:700px){
  #sidebar{z-index:36}
  .sidebar.open{box-shadow:26px 0 64px rgba(9,20,42,.38)}
  /* Blurred, dimmed backdrop over the page while the drawer is open */
  body::before{content:"";position:fixed;inset:0;z-index:28;background:rgba(11,23,44,.34);
    -webkit-backdrop-filter:blur(7px) saturate(1.15);backdrop-filter:blur(7px) saturate(1.15);
    opacity:0;visibility:hidden;transition:opacity .38s ease,visibility 0s linear .38s;pointer-events:none}
  html.mobile-nav-open body::before{opacity:1;visibility:visible;transition:opacity .38s ease}
  /* Nav items glide in one after another */
  .sidebar.open .nav-label{animation:drawerIn .45s cubic-bezier(.32,.72,0,1) both}
  .sidebar.open .nav-item{animation:drawerIn .5s cubic-bezier(.32,.72,0,1) both}
  .sidebar.open .nav-item:nth-child(1){animation-delay:.05s}
  .sidebar.open .nav-item:nth-child(2){animation-delay:.09s}
  .sidebar.open .nav-item:nth-child(3){animation-delay:.13s}
  .sidebar.open .nav-item:nth-child(4){animation-delay:.17s}
  .sidebar.open .nav-item:nth-child(5){animation-delay:.21s}
  .sidebar.open .nav-item:nth-child(6){animation-delay:.25s}
  .sidebar.open .nav-item:nth-child(7){animation-delay:.29s}
  .sidebar.open .nav-item:nth-child(8){animation-delay:.33s}
}
@keyframes drawerIn{from{opacity:0;transform:translateX(-14px)}to{opacity:1;transform:translateX(0)}}
@media (max-width:700px){
  .topbar{height:60px;padding:0 10px;gap:4px}
  .main-area{margin-top:60px}
  .sidebar{padding-top:74px}
  .topbar-brand{gap:7px;padding-right:2px}
  .topbar-brand img{height:30px}
  .topbar-wordmark{font-size:15px;letter-spacing:-.5px}
  .topbar .top-actions{gap:7px;flex:none}
  .topbar-menu{flex:none}
  .notification-panel{top:66px;right:12px}
}
@media (max-width:352px){
  .topbar-wordmark{display:none}
}

/* Profile photo + identity (rd7) */
.profile-avatar-img{width:41px;height:41px;border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,.9);box-shadow:0 3px 10px rgba(0,45,86,.3);display:block;background:#fff}
.profile-trigger:active .profile-avatar-img{transform:scale(.92)}
.profile-menu-identity{display:flex;flex-direction:column;gap:2px}
.profile-menu-identity b{font-size:13px;color:var(--ink)}
.profile-menu-identity span{font-size:11px;color:var(--muted)}
.profile-form{display:flex;flex-direction:column;gap:12px;padding:2px 20px 18px}
.profile-form label{display:flex;flex-direction:column;gap:6px;color:#647188;font-size:11px;font-weight:650}
.profile-form input{height:44px;border:1px solid #dfe5ee;border-radius:9px;background:#fff;padding:0 12px;color:#35435a;font-size:14px;outline:0}
.profile-form input:focus{border-color:#8399f5;box-shadow:0 0 0 3px #edf0ff}
.profile-form-head{display:flex;align-items:center;gap:13px}
.profile-big-avatar{width:56px;height:56px;border-radius:50%;background:var(--brand-yellow);color:#00548F;display:grid;place-items:center;font-size:16px;font-weight:800;overflow:hidden;flex:none;border:2px solid #fff;box-shadow:0 3px 10px rgba(0,45,86,.18)}
.profile-big-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.profile-form-meta{display:flex;flex-direction:column;gap:2px;min-width:0}
.profile-form-meta b{font-size:14.5px;color:var(--ink)}
.profile-form-meta span{font-size:12px;color:var(--muted)}
.profile-form-meta small{font-size:11px;color:var(--muted);line-height:1.45}

/* Auth hero — logo + welcome on sign-in screens (rd9) */
.auth-hero{display:none}
.auth-aside-logo{height:46px;width:auto;display:block}
@media (max-width:700px){
  .auth-hero{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;margin:10px 0 24px;animation:authHeroIn .5s cubic-bezier(.22,.8,.3,1)}
  .auth-hero-logo{height:66px;width:auto;filter:drop-shadow(0 8px 18px rgba(0,84,143,.20))}
  .auth-welcome{margin:0;font-size:20px;font-weight:650;color:#5B6B84;letter-spacing:-.2px}
  .auth-welcome b{color:var(--brand-blue);font-weight:800}
}
@keyframes authHeroIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ==================================================================
   RD11 — side menu matches the sky-blue top bar, bigger nav buttons,
   drawer header, Home day popup detail/compact modes
   ================================================================== */
.sidebar{
  background:linear-gradient(180deg,#0E80D2 0%,#0070C0 58%,#006BB4 100%);
  box-shadow:10px 0 34px rgba(0,84,143,.18);
}
.nav-label{color:rgba(255,255,255,.62);font-size:10.5px;letter-spacing:1.4px;padding:0 14px 10px}
.main-nav{gap:6px}
.nav-item{height:52px;border-radius:12px;padding:0 14px;gap:14px;font-size:15px;color:rgba(255,255,255,.86)}
.nav-item:hover{background:rgba(255,255,255,.13);color:#fff}
.nav-item .nav-icon{color:rgba(255,255,255,.78)}
.nav-icon svg{width:21px;height:21px}
.nav-item.active{background:#fff;color:#006BB4;font-weight:700;box-shadow:0 8px 18px rgba(0,60,110,.28)}
.nav-item.active .nav-icon{color:#0070C0}
.nav-count{background:rgba(255,255,255,.22);color:#fff;font-size:11px;min-width:24px;height:24px;border-radius:12px;padding:0 7px}
.nav-item.active .nav-count{background:#E8F3FB;color:#006BB4}
.drawer-head{display:none}
@media (max-width:700px){
  #sidebar{z-index:45;padding:calc(10px + env(safe-area-inset-top,0px)) 14px calc(14px + env(safe-area-inset-bottom,0px))}
  .drawer-head{display:flex;align-items:center;gap:10px;padding:2px 4px 16px}
  .drawer-head img{height:31px;width:auto;display:block;filter:drop-shadow(0 3px 8px rgba(0,60,110,.30))}
  .drawer-head span{color:#fff;font-weight:800;font-size:16.5px;letter-spacing:-.2px}
  .drawer-close{margin-left:auto;width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.16);color:#fff;display:grid;place-items:center;flex:none}
  .drawer-close svg{width:17px;height:17px}
  .drawer-close:active{background:rgba(255,255,255,.3)}
}
/* Home day popup — detail cards (few) / compact rows (many) / detail view */
.home-day-sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.hd-hint{font-size:11px;color:#93A0B4;font-weight:600}
.hd-cards{display:flex;flex-direction:column;gap:10px}
.hd-card{border:1px solid #E6ECF5;border-radius:14px;padding:13px 14px;background:#FBFCFE;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.hd-card:active{border-color:#B9CFF5;box-shadow:0 4px 14px rgba(0,84,143,.10)}
.hd-card.is-done{opacity:.72}
.hd-card-top{display:flex;align-items:flex-start;gap:9px}
.hd-card-top h4{margin:1px 0 0;font-size:15px;line-height:1.35;color:#1E2B43;font-weight:700;flex:1;min-width:0}
.hd-card.is-done h4{text-decoration:line-through;color:#8A96A9}
.hd-meta{display:flex;flex-wrap:wrap;gap:4px 12px;margin:9px 0 0 37px;color:#71809A;font-size:12px;line-height:1.45}
.hd-meta-time{color:#43516A;font-weight:650}
.hd-note{margin:8px 0 0 37px;font-size:13px;line-height:1.55;color:#43516A;white-space:pre-wrap}
.hd-more{display:block;margin:9px 0 0 37px;font-size:12px;font-weight:700;color:var(--brand-blue)}
.hd-badge{flex:none;font-size:10px;font-weight:800;letter-spacing:.4px;padding:4px 8px;border-radius:99px;text-transform:uppercase}
.hd-badge.open{background:#E8F3FB;color:#0070C0}
.hd-badge.overdue{background:#FDECEA;color:#C0453E}
.hd-badge.done{background:#E7F6EE;color:#1E9E6A}
.hd-list .activity-row{cursor:pointer}
.hd-compact .activity-copy b{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:14px;line-height:1.35}
.hd-compact .activity-copy small{font-size:11.5px}
.hd-detail-subject{font-size:19px;line-height:1.3}
.hd-detail-status{display:flex;gap:8px;margin-bottom:12px}
.hd-detail-note{border:1px solid #E6ECF5;background:#FBFCFE;border-radius:12px;padding:11px 13px;margin-bottom:14px}
.hd-detail-note b{font-size:11px;letter-spacing:.6px;text-transform:uppercase;color:#71809A}
.hd-detail-note p{margin:6px 0 0;font-size:13.5px;line-height:1.6;color:#2A3852;white-space:pre-wrap}
.hd-fields{margin:0;display:flex;flex-direction:column}
.hd-fields>div{display:flex;gap:14px;padding:9px 2px;border-top:1px solid #EFF3F8}
.hd-fields dt{flex:0 0 96px;font-size:11px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:#93A0B4;padding-top:1px}
.hd-fields dd{margin:0;font-size:13.5px;color:#2A3852;font-weight:600;line-height:1.45}

/* ---------- RD12: side-menu buttons genuinely bigger (owner round 2) ----------
   styles.css caps #sidebar .nav-item at 34px/12px inside its mobile block;
   these rules match that specificity and come later, so they win. */
.nav-item{height:56px;font-size:16px}
.nav-icon svg{width:21px;height:21px}
@media (max-width:700px){
  #sidebar .main-nav{gap:6px}
  #sidebar .nav-item{min-height:58px;height:58px;padding:0 14px;gap:14px;font-size:16.5px;border-radius:13px}
  #sidebar .nav-icon{width:24px;height:24px;flex:0 0 24px}
  #sidebar .nav-icon svg{width:23px;height:23px}
  #sidebar .nav-label{font-size:10.5px;margin:2px 10px 8px}
  #sidebar .nav-count{min-width:24px;height:24px;font-size:11.5px;border-radius:12px}
  #sidebar .profile-row{min-height:52px}
  .drawer-head span{font-size:18px}
  .drawer-head img{height:34px}
  .drawer-close{width:44px;height:44px}
}
.av-head-actions{display:flex;gap:4px;align-items:flex-start;flex:none}

/* RD18b: phase activity rows are flex (text left, check right), not the old 3-col grid. */
.phase-activity.activity-row{display:flex;align-items:center;grid-template-columns:none;grid-template-areas:none}
.phase-activity>span{grid-area:auto}
.phase-activity .activity-check{grid-area:auto}

/* RD20: profile menu — bigger, photo header, uniform icon rows. */
.profile-menu{width:min(312px,calc(100vw - 24px));padding:10px;border-radius:16px}
.profile-menu button{min-height:52px;font-size:15.5px;border-radius:10px;padding:0 12px}
.profile-menu [data-view],.profile-menu [data-action]{flex-direction:row;align-items:center}
.profile-menu .profile-menu-identity{display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;margin-bottom:6px;border-bottom:1px solid var(--line);border-radius:12px;background:transparent;color:var(--ink)}
.pm-avatar{width:46px;height:46px;border-radius:50%;overflow:hidden;flex:none;background:#E8F3FC;color:#0070C0;font-weight:800;font-size:16px;display:grid;place-items:center}
.pm-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.pm-id-text{display:grid;gap:1px;min-width:0;flex:1;text-align:left}
.pm-id-text b{font-size:16.5px;color:var(--ink)}
.pm-id-text small{font-size:12.5px;color:#768196;overflow-wrap:anywhere}
.pm-chevron{width:18px;height:18px;color:#9AA5B5;flex:none;display:grid;place-items:center}
.pm-chevron svg{width:100%;height:100%}
.pm-item{display:flex;align-items:center;gap:12px}
.pm-icon{width:21px;height:21px;flex:none;color:#5A6B84;display:grid;place-items:center}
.pm-icon svg{width:100%;height:100%}
.profile-menu .profile-menu-logout{color:#C0392B}
.profile-menu .profile-menu-logout .pm-icon{color:#C0392B}
.team-position-edit{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.team-position-edit input{flex:1 1 170px;min-height:42px;border:1px solid var(--line,#E4E8EF);border-radius:9px;padding:7px 10px;font:inherit;background:#fff;color:var(--ink)}

/* rd21 — Home: slim date header, readable calendar, metric bricks, entrance motion */
.home-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:2px 0 14px}
.home-date{font-size:16.5px;font-weight:750;color:#22314A;margin:0}
@keyframes pnbDashIn{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
.dash-in{animation:pnbDashIn .38s cubic-bezier(.22,.8,.32,1) both}
section.metric-grid.dash-in{animation-delay:.05s}
section.dashboard-grid.dash-in{animation-delay:.1s}
section.tip-banner.dash-in{animation-delay:.15s}
.brick-grid{gap:12px}
.metric-card.brick{font:inherit;text-align:left;cursor:pointer;border-radius:18px;padding:16px;min-height:118px;transition:transform .16s ease,box-shadow .16s ease;box-shadow:0 2px 10px rgba(23,51,84,.06)}
.metric-card.brick:active{transform:scale(.96)}
.metric-card.brick strong{font-size:28px;line-height:1.1}
.metric-card.brick.tone-orange{background:#FFF6EC;border-color:#F5DFC4}
.metric-card.brick.tone-blue{background:#EEF5FD;border-color:#CBDEF5}
.metric-card.brick.tone-purple{background:#F4F0FE;border-color:#DDD2F7}
.metric-card.brick.tone-green{background:#EBF8F0;border-color:#C4E8D2}
/* home calendar — bigger day numbers, one clear count pill, no tiny dots */
.home-cal-heading h2{font-size:20px}
.home-cal-weekdays span{font-size:12px;letter-spacing:.3px;color:#5F7189;padding:9px 0 7px}
.home-cal-grid{gap:5px;padding:4px 12px 14px}
.home-cal-day{min-height:63px;border-radius:13px;gap:5px;padding:7px 2px 6px}
.home-cal-num{width:33px;height:33px;font-size:17px;font-weight:750}
.home-cal-day.today .home-cal-num{background:#0E80D2;box-shadow:0 3px 9px rgba(14,128,210,.35)}
.home-cal-day.selected{border-color:#0E80D2;background:#EAF4FC;box-shadow:inset 0 0 0 1px #0E80D2}
.home-cal-day.outside{color:#A3B0C1}
.home-cal-count{display:inline-flex;align-items:center;justify-content:center;min-width:25px;height:19px;padding:0 6px;border-radius:999px;background:#E2F3E9;color:#146C43;font-size:12px;font-weight:800;line-height:1}
.home-cal-count.all-done{background:#EDF1F6;color:#7A8798}
.home-cal-day.selected .home-cal-count{background:#0E80D2;color:#fff}
.home-cal-agenda-head b{font-size:14.5px}
/* Calendar sync + LINE: one tidy duo, visible without scrolling */
.gcp-page{padding-top:22px}
.gcp-header{margin-bottom:6px}
.gcp-header h1{font-size:27px}
.gcp-subtitle{font-size:14.5px;line-height:1.45;max-width:560px}
.gcp-duo{display:grid;gap:12px;margin:14px 0 4px}
.gcp-duo .gcp-card{margin:0}
@media(min-width:920px){.gcp-duo{grid-template-columns:1fr 1fr;align-items:start}}
@media(max-width:600px){
  .gcp-duo .gcp-card{padding:16px}
  .gcp-duo .gcp-actions{display:flex;flex-wrap:wrap;gap:9px;margin:14px 0 2px}
  .gcp-duo .gcp-actions .gcp-button{flex:1 1 0;width:auto;min-height:47px}
  .gcp-duo .gcp-details{gap:8px 26px;margin-top:14px;padding-top:13px}
  .gcp-duo .gcp-details div{min-width:0}
  .gcp-duo .gcp-details dd{font-size:15px}
  .gcp-line-card .gcp-muted{font-size:13.5px;line-height:1.5}
  .gcp-duo .gcp-status-line p{font-size:13.5px;margin-top:3px}
}
@media(prefers-reduced-motion:reduce){.dash-in{animation:none}}
@media(max-width:700px){.contacts-results th:nth-child(4),.contacts-results td:nth-child(4){display:none}}

/* rd22 — home calendar, reference layout: month title + chevrons, weekday pill strip,
   borderless grid; activity days = filled green disc, today = filled blue disc + outer ring */
.home-cal-panel{border-radius:26px;box-shadow:0 12px 32px rgba(23,51,84,.08)}
.home-cal-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:18px 20px 4px}
.home-cal-title{display:flex;align-items:center;gap:8px;min-width:0}
.home-cal-title h2{font-size:23px;font-weight:800;letter-spacing:-.02em;margin:0}
.home-cal-year{color:#98A5B8;font-weight:650;font-size:19px}
.home-cal-nav-arrows{display:flex;gap:0}
.home-cal-nav-arrows .icon-button{width:32px;height:32px;font-size:21px;color:#5B6B82}
.home-cal-today{border:1.5px solid #D8E1EC;background:#fff;border-radius:999px;min-height:35px;padding:0 16px;font-size:13px;font-weight:700;color:#22314A}
.home-cal-weekdays{background:#F1F4F8;border-radius:999px;margin:12px 14px 2px;padding:0 4px}
.home-cal-weekdays span{font-size:12.5px;font-weight:650;letter-spacing:.2px;color:#68788E;padding:8px 0}
.home-cal-weekdays span:last-child{color:#22314A;font-weight:800}
.home-cal-grid{gap:2px;padding:8px 10px 12px}
.home-cal-day{min-height:64px;border:1px solid transparent;background:transparent;border-radius:14px;gap:3px;padding:5px 0}
.home-cal-day.selected{background:#F2F8FD;border-color:transparent;box-shadow:none}
.home-cal-num{width:40px;height:40px;font-size:17px;font-weight:600;background:transparent;color:var(--ink);box-shadow:none}
.home-cal-day.has-open .home-cal-num{background:#1FA855;color:#fff;font-weight:800;box-shadow:0 3px 8px rgba(31,168,85,.32)}
.home-cal-day.has-done .home-cal-num{background:#DFF2E4;color:#177245;font-weight:750;box-shadow:none}
.home-cal-day.selected .home-cal-num{box-shadow:0 0 0 2px #fff,0 0 0 4.5px rgba(14,128,210,.55)}
.home-cal-day.has-open.selected .home-cal-num{background:#1FA855;color:#fff}
.home-cal-day.has-done.selected .home-cal-num{background:#DFF2E4;color:#177245}
.home-cal-day.today .home-cal-num{background:#0E80D2;color:#fff;font-weight:800;box-shadow:0 0 0 3px #fff,0 0 0 6px #0E80D2}
.home-cal-day.outside:not(.today):not(.selected) .home-cal-num{opacity:.45}
.home-cal-day.outside:not(.today):not(.selected) .home-cal-count{opacity:.55}
.home-cal-count{display:inline-flex;align-items:center;justify-content:center;background:transparent;min-width:0;height:15px;padding:0;font-size:11.5px;font-weight:800;color:#177245;line-height:1}
.home-cal-count.all-done{background:transparent;color:#8A97A8}
.home-cal-day.selected .home-cal-count{background:transparent;color:#0E80D2}
.home-cal-day.today .home-cal-count{background:transparent;color:#0E80D2}
/* rd22b — today wins over has-open/has-done even when selected (the default view) */
.home-cal-title{flex:1}
.home-cal-title h2{white-space:nowrap}
.home-cal-day.today.selected .home-cal-num,
.home-cal-day.today.has-open .home-cal-num,
.home-cal-day.today.has-done .home-cal-num{background:#0E80D2;color:#fff;font-weight:800;box-shadow:0 0 0 3px #fff,0 0 0 6px #0E80D2}

/* rd23 — activity detail sheet: visual cards instead of a plain text table */
.hd-head-main{display:flex;gap:12px;align-items:flex-start;min-width:0}
.hd-head-icon{width:42px;height:42px;border-radius:13px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center}
.hd-head-icon svg{width:21px;height:21px}
.hd-detail-status{align-items:center;flex-wrap:wrap}
.hd-rel{font-size:12px;font-weight:750;padding:4px 10px;border-radius:999px;background:#EEF3F9;color:#526176}
.hd-rel.overdue{background:#FDECEA;color:#C23325}
.hd-rel.today{background:#E3F0FB;color:#0B65AD}
.hd-due-card{display:flex;align-items:center;gap:12px;background:#F2F7FD;border:1px solid #E1EDF9;border-radius:16px;padding:13px 15px;margin-bottom:12px}
.hd-due-card.overdue{background:#FDF0EE;border-color:#F6D9D4}
.hd-due-card.done{background:#F0F7F2;border-color:#DCEDE2}
.hd-due-icon{width:38px;height:38px;border-radius:11px;background:#fff;display:inline-flex;align-items:center;justify-content:center;color:#0E80D2;flex:0 0 auto;box-shadow:0 1px 3px rgba(23,51,84,.08)}
.hd-due-icon svg{width:19px;height:19px}
.hd-due-card.overdue .hd-due-icon{color:#C23325}
.hd-due-card.done .hd-due-icon{color:#177245}
.hd-due-text{display:flex;flex-direction:column;gap:1px;min-width:0}
.hd-due-text small{font-size:11px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:#71809A}
.hd-due-card.overdue .hd-due-text small{color:#C23325}
.hd-due-text b{font-size:15px;color:#1D2B44}
.hd-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.hd-info-card{background:#F6F8FB;border-radius:14px;padding:10px 12px;display:flex;flex-direction:column;gap:5px;min-width:0}
.hd-info-label{font-size:10.5px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:#93A0B4}
.hd-info-value{display:flex;align-items:center;gap:7px;font-size:13.5px;font-weight:650;color:#2A3852;line-height:1.35;min-width:0}
.hd-info-value .activity-type{width:24px;height:24px;border-radius:8px;flex:0 0 auto}
.hd-avatar{width:24px;height:24px;border-radius:50%;background:#DCE9F7;color:#0B65AD;font-size:10.5px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.hd-ic{display:inline-flex;color:#71809A;flex:0 0 auto}
.hd-ic svg{width:17px;height:17px}

/* rd24 — activity form tidy: plain colour block, Auto + 3 colours, uniform swatches */
.activity-color-field{border:0;padding:0;margin:0}
.activity-color-label{display:block;font-size:13.5px;font-weight:650;color:#3D4E68;margin-bottom:9px}
.activity-color-palette{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-start}
.activity-color-palette .activity-color-opt{display:inline-flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;position:relative;font-size:12px;font-weight:600;color:#5B6B82}
.activity-color-palette .activity-color-opt i{width:38px;height:38px;box-shadow:inset 0 0 0 1px rgba(16,42,80,.12)}
.activity-color-palette .activity-color-opt input:checked+i{outline:3px solid #0E80D2;outline-offset:2px}
.activity-color-palette .activity-color-opt input:checked~span{color:#0B65AD;font-weight:700}

/* rd25 — Google Sheets card on the integrations page */
.gcp-actions a.gcp-button{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}
.gcp-sheets{margin-top:14px}

/* rd26 — LINE link in 2 big steps, no checkbox */
.line-steps{display:grid;gap:10px}
.line-add-btn{background:#06C755!important;color:#fff!important;border:0;min-height:52px;border-radius:14px;font-size:16px;font-weight:700;display:flex;align-items:center;justify-content:center;text-decoration:none;padding:0 16px}
.line-steps .line-connect-btn{min-height:52px;font-size:16px;width:100%}
.line-step-note{margin:0;font-size:13px;line-height:1.5;color:#66788E}
.line-consent-note{margin:0;font-size:12.5px;line-height:1.55;color:#66788E}

/* rd27 — LINE link: a single button (friend add happens on LINE's screen) */
.line-friend-help{margin:0;font-size:13px;line-height:1.5;color:#66788E}
.line-friend-link{color:#06C755;font-weight:700;text-decoration:none}

/* rd28 — Team directory (profile menu → Team) */
.team-dir-list{display:grid;gap:10px}
.team-card{display:flex;gap:12px;align-items:center;background:#fff;border:1px solid #E3EAF3;border-radius:16px;padding:12px 14px}
.team-avatar{width:52px;height:52px;border-radius:50%;overflow:hidden;flex:none;background:#E8F2FB;color:#0E80D2;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:18px}
.team-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.team-main{flex:1;min-width:0;display:grid;gap:2px}
.team-name{font-size:16.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.team-sub{font-size:12.5px;color:#66788E;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.team-phone{font-size:14.5px;color:#0E80D2;text-decoration:none;font-weight:700}
.team-nophone{font-size:13px;color:#98A6B5}
.team-line{flex:none;font-size:11.5px;font-weight:700;padding:5px 9px;border-radius:999px;text-align:center}
.team-line.on{background:#DFF7E8;color:#0B7A3E}
.team-line.off{background:#EEF2F6;color:#7A8794}
.team-group-btn{margin-top:14px;width:100%}

/* rd30: Facebook-style notifications — unread bold on a tinted row, read normal */
.notification-item{padding:12px;border-radius:12px;border-bottom:0;margin-bottom:2px}
.notification-item b{font-size:14px;line-height:1.45}
.notification-item small{font-size:12px}
.notification-item:not(.unread) b{font-weight:500;color:#43536A}
.notification-item.unread{background:#E8F1FB}
.notification-item.unread b{font-weight:800;color:#0B2B4A}
.notification-item.unread small{color:#3E6DA3}

/* rd31: premium property pipeline — journey stages, funnel hero, rich cards */
.kanban-board{grid-template-columns:repeat(6,minmax(238px,82vw))}
@media (min-width:900px){.kanban-board{grid-template-columns:repeat(6,minmax(225px,1fr))}}
.pipe-hero{background:linear-gradient(120deg,#0A2547,#0E5FA8 70%,#0E80D2);border-radius:18px;padding:18px;color:#fff;box-shadow:0 10px 26px rgba(10,37,71,.22);margin-bottom:12px}
.pipe-hero-label{font-size:11px;font-weight:700;letter-spacing:.14em;color:#F2C94C;margin:0 0 4px}
.pipe-hero-value{font-size:31px;font-weight:800;line-height:1.1;margin:0}
.pipe-hero-sub{font-size:13px;color:rgba(255,255,255,.82);margin:3px 0 0}
.funnel-bar{display:flex;gap:2px;height:10px;border-radius:99px;overflow:hidden;background:rgba(255,255,255,.16);margin:14px 0 9px}
.funnel-seg{display:block;height:100%}
.funnel-legend{display:flex;flex-wrap:wrap;gap:6px 14px}
.funnel-key{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:rgba(255,255,255,.88)}
.funnel-key b{color:#fff}
.funnel-dot{width:9px;height:9px;border-radius:50%;flex:none}
.board-hint-line{font-size:12.5px;color:#687792;margin:0 0 10px}
.kanban-column{border-top:4px solid var(--stage,#0E80D2);background:#F5F8FC;border-radius:14px}
.stage-dot{width:11px;height:11px;border-radius:50%;background:var(--stage,#0E80D2);flex:none;box-shadow:0 0 0 3px #fff}
.column-title{display:flex;align-items:center;gap:9px}
.column-title b{font-size:16px}
.pdeal{border-radius:14px;border-left:5px solid var(--stage,#0E80D2);padding:12px;box-shadow:0 3px 10px rgba(20,50,90,.07)}
.pdeal h3{font-size:16px;font-weight:700;line-height:1.35;margin:8px 0 2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pdeal-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.source-chip{display:inline-flex;align-items:center;gap:5px;background:#EAF2FC;color:#0E5FA8;font-size:11px;font-weight:700;letter-spacing:.02em;padding:4px 9px;border-radius:99px}
.source-chip.muted-chip{background:#EEF1F5;color:#687792}
.pdeal-value{font-size:21px;font-weight:800;color:#0A2547;margin-top:8px}
.pdeal-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.close-chip,.age-chip{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;padding:4px 9px;border-radius:99px;background:#EEF1F5;color:#43536A}
.close-chip svg,.pdeal-next svg{width:13px;height:13px}
.age-chip.stale-warm{background:#FEF3C7;color:#92400E}
.age-chip.stale-hot{background:#FDE8E8;color:#B42318}
.pdeal-next{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;margin-top:11px;min-height:39px;border:0;border-radius:11px;background:#EAF2FC;color:#0E5FA8;font-size:13.5px;font-weight:700;cursor:pointer}
.pdeal-next:active{background:#D8E8FA}
.pdeal-next:disabled{opacity:.55}

/* rd32: Trash */
.trash-panel{padding:8px 14px}
.trash-row{display:flex;align-items:center;gap:12px;padding:13px 4px;border-bottom:1px solid #EDF1F6;flex-wrap:wrap}
.trash-row:last-child{border-bottom:0}
.trash-kind{flex:none;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;background:#EEF2F7;color:#43536A;padding:5px 10px;border-radius:99px}
.trash-main{flex:1;min-width:150px}
.trash-main b{display:block;font-size:15.5px;color:#12263F}
.trash-main small{display:block;font-size:12px;color:#687792;margin-top:2px}
.trash-actions{display:flex;gap:8px}
.trash-empty{font-size:14px;color:#687792;padding:18px 6px}
.pm-icon svg{width:19px;height:19px}

/* rd36: completed-records link on Home */
.panel-foot{padding:10px 16px 14px;border-top:1px solid var(--line,#e3e7ed)}
.panel-foot .text-link{font-size:13.5px;font-weight:600}

/* rd39: fixed per-member colours */
.team-dot{display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:7px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}

/* rd41: Team hub — invite + member editing on demand */
.team-card{flex-wrap:wrap}
.team-edit-btn{margin-top:6px}
.team-editor{flex:1 1 100%;border-top:1px solid #E3EAF3;margin-top:10px;padding-top:10px}
.team-editor .team-member-actions{display:flex;flex-direction:column;align-items:stretch;gap:8px}
.team-editor-email{font-size:12.5px;color:#66788E}
.team-invite-btn{width:100%;margin-bottom:12px}
.team-invite-panel{display:grid;gap:12px;margin-bottom:14px}
.team-invite-panel[hidden]{display:none}
.team-log-panel{margin-top:14px}

/* rd42: profile colour picker */
.profile-color-grid{display:flex;flex-wrap:wrap;gap:10px}
.profile-color-swatch{display:flex;flex-direction:column;align-items:center;gap:5px;width:60px;padding:9px 2px 7px;border:2px solid transparent;border-radius:14px;background:#F4F8FC;cursor:pointer}
.profile-color-swatch i{width:32px;height:32px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.profile-color-swatch span{font-size:10.5px;color:var(--muted,#687386);max-width:56px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-height:13px}
.profile-color-swatch.selected{border-color:#0E80D2;background:#EAF4FC}
.profile-color-swatch:disabled{opacity:.38;cursor:not-allowed}

/* rd43: Team toolbar + collapsible activity log */
.team-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}
.team-dir-list:not(.editing) .team-edit-btn{display:none}
#team-edit-toggle[aria-expanded="true"]{background:#EAF4FC;border-color:#0E80D2;color:#0B5FA5}
.team-log-tools{display:flex;justify-content:flex-end;margin-bottom:8px}
.team-log-body[hidden]{display:none}

/* rd44: pro activity detail — clean definition list */
.hd-pro-list{margin:2px 0 0;display:flex;flex-direction:column}
.hd-pro-row{display:flex;gap:14px;padding:11px 1px;border-top:1px solid #EDF1F6;align-items:flex-start}
.hd-pro-row:first-child{border-top:0;padding-top:2px}
.hd-pro-row dt{flex:0 0 86px;font-size:11.5px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:#8494AB;padding-top:3px}
.hd-pro-row dd{margin:0;flex:1;min-width:0;font-size:15px;line-height:1.45;color:#22314E;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.hd-pro-due{font-weight:750}
.hd-pro-due.overdue{color:#C23325}
.hd-pro-due.today{color:#0B65AD}
.hd-pro-dot{width:10px;height:10px;border-radius:50%;flex:0 0 auto}
.hd-pro-note{white-space:pre-wrap;line-height:1.55}
.hd-by{display:inline-flex;align-items:center;gap:5px}
.hd-by i{width:8px;height:8px;border-radius:50%;display:inline-block}
.hd-head-icon{color:#fff}