:root {
      --dp-topbar-green-dark: #07412e;
      --dp-topbar-green-mid: #29724f;
      --dp-topbar-green-light: #37a184;
      --dp-topbar-panel-dark: #093023;
      --dp-topbar-panel-mid: #074833;
      --dp-topbar-border: #135643;
      --dp-topbar-title: #bad8ca;
      --dp-topbar-green: #2e7d32;
      --dp-topbar-orange: #ff9f0a;
      --dp-topbar-grey: #6d645e;
    }

    .dp-topbar,
    .dp-topbar * {
      box-sizing: border-box;
    }

    .dp-topbar {
      position: relative;
      z-index: 100;
      display: flex;
      align-items: center;
      justify-content: space-between;
      min-height: 48px;
      height: 48px;
      padding: 0 22px 0 20px;
      background: linear-gradient(0deg,
          var(--dp-topbar-green-dark) 0%,
          var(--dp-topbar-green-mid) 80%,
          var(--dp-topbar-green-light) 100%);
      border-bottom: 1px solid var(--dp-topbar-border);
      color: #fff;
      box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
      font-family: inherit;
      letter-spacing: normal;
      line-height: normal;
    }

    .dp-topbar button {
      border: 0;
      font: inherit;
    }

    .dp-side-left-group {
      display: flex;
      align-items: center;
      gap: 16px;
      height: 100%;
    }

    .dp-side-title-container,
    .dp-side-title-wrap {
      display: flex;
      align-items: center;
    }

    .dp-side-title-wrap {
      gap: 6px;
      font-size: 19px;
      font-weight: 800;
    }

    .dp-side-title-main {
      color: var(--dp-topbar-title);
      font-size: 20px;
      font-weight: 700;
      letter-spacing: -0.5px;
      text-shadow: 1px 1px 1px rgba(0, 48, 36, 0.5);
      white-space: nowrap;
    }

    .dp-side-polygon-stats {
      position: absolute;
      top: 0;
      left: 50%;
      z-index: 100;
      display: inline-flex;
      align-items: center;
      height: 40px;
      margin: 0;
      padding: 0 48px;
      transform: translateX(-50%);
      background: linear-gradient(90deg, var(--dp-topbar-panel-dark) 20%, var(--dp-topbar-panel-mid) 50%, var(--dp-topbar-panel-dark) 80%);
      border-bottom: 1px solid var(--dp-topbar-border);
      border-radius: 0 0 16px 16px;
      filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
    }

    .dp-side-polygon-stats::before,
    .dp-side-polygon-stats::after {
      content: "";
      position: absolute;
      top: 0;
      z-index: 101;
      width: 36px;
      height: 30px;
      background: transparent;
      pointer-events: none;
    }

    .dp-side-polygon-stats::before {
      left: -35px;
      border-top-right-radius: 20px;
      box-shadow: 18px 0 0 0 var(--dp-topbar-panel-dark);
    }

    .dp-side-polygon-stats::after {
      right: -35px;
      border-top-left-radius: 20px;
      box-shadow: -18px 0 0 0 var(--dp-topbar-panel-dark);
    }

    .dp-poly-stat-item {
      display: flex;
      align-items: center;
      gap: 8px;
      color: #eeeae3;
      font-size: 18px;
      font-weight: 700;
      letter-spacing: -0.3px;
      white-space: nowrap;
    }

    .dp-period-label {
      color: #ffffffc4;
      font-weight: 600;
    }

    .dp-dot-separator {
      color: rgba(238, 234, 227, 0.4);
    }

    .dp-filter-summary-chip {
      padding: 2px 8px;
      border-radius: 4px;
      background: rgba(255, 255, 255, 0.12);
      color: rgba(255, 255, 255, 0.85);
      font-size: 12px;
    }

    .dp-topbar-divider {
      width: 1px;
      height: 16px;
      margin: 0 4px;
      background-color: rgba(238, 234, 227, 0.4);
    }

    .dp-poly-click-stat {
      display: inline-flex;
      align-items: baseline;
      gap: 2px;
      padding: 2px 6px;
      border: 1px solid #1d6947;
      border-radius: 4px;
      background: linear-gradient(180deg, #337c5f 0%, #1c4638 100%);
      color: #ffffffcc;
      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
      cursor: pointer;
      font-size: 18px;
      font-weight: 850;
      user-select: none;
    }

    .dp-poly-click-stat:hover {
      border-color: #1d6947;
      background: #1b543b;
      color: #fff;
      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
    }

    .dp-poly-click-stat.active {
      border-color: #000000db;
      background: linear-gradient(#0000008a 0%, #00000040 20%, #00000017 80%, #0000008a 100%);
      color: #fff;
      box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.3);
      font-weight: 600;
    }

    .dp-stat-value {
      font-weight: 800;
    }

    .dp-stat-total {
      color: #ffdb3a;
    }

    .dp-stat-ongoing {
      color: #0284c7; /* 진행: Sky 600 */
    }

    .dp-stat-planned {
      color: #475569; /* 예정: Slate 600 */
    }

    .dp-stat-hold {
      color: #d97706; /* 보류: Amber 600 */
    }

    .dp-stat-completed {
      color: #059669; /* 완료: Emerald 600 */
    }

    .dp-stat-issue {
      color: #dc2626; /* 이슈: Red 600 */
    }

    .dp-stat-unit {
      font-size: 14px;
      font-weight: 500;
      opacity: 0.5;
    }

    .dp-side-right-actions {
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .dp-header-filter-group {
      display: none;
      align-items: center;
      gap: 4px;
      height: 28px;
      margin-right: 6px;
      padding: 3px 6px;
      border-radius: 99px;
      background: #ece9e2;
    }

    .dp-topbar.show-filter-badges .dp-header-filter-group {
      display: flex;
    }

    .dp-filter-badge {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      height: 22px;
      padding: 0 12px;
      border: 1px solid transparent;
      border-radius: 99px;
      background: transparent;
      color: #7c7a75;
      cursor: pointer;
      font-size: 14px;
      font-weight: 700;
      transition: all 0.2s ease;
    }

    .dp-filter-badge:hover {
      filter: brightness(0.96);
    }

    .dp-filter-badge .dp-filter-bullet {
      display: inline-block;
      width: 6px;
      height: 6px;
      border-radius: 50%;
    }

    .dp-filter-badge.active[data-filter="all"] {
      border-color: #d4d3cf;
      background: #fff;
      color: #333;
    }

    .dp-filter-badge.active[data-filter="진행"] {
      border-color: #1b6e4c;
      background: #eef7f2;
      color: #1b6e4c;
    }

    .dp-filter-badge[data-filter="진행"] .dp-filter-bullet {
      background: var(--dp-topbar-green);
    }

    .dp-filter-badge.active[data-filter="보류"] {
      border-color: #ad692e;
      background: #fdf4eb;
      color: #ad692e;
    }

    .dp-filter-badge[data-filter="보류"] .dp-filter-bullet {
      background: var(--dp-topbar-orange);
    }

    .dp-filter-badge.active[data-filter="완료"] {
      border-color: #73726f;
      background: #f5f4f0;
      color: #73726f;
    }

    .dp-filter-badge[data-filter="완료"] .dp-filter-bullet {
      background: var(--dp-topbar-grey);
    }

    .dp-icon-btn {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      width: 32px;
      height: 32px;
      border: 1.5px solid #1a4d42;
      border-radius: 50%;
      background: linear-gradient(180deg, #0d3f34 0%, #051f19 100%);
      color: rgb(206, 241, 235);
      box-shadow:
        0 0 0 1px #000,
        0 2px 2px rgba(0, 0, 0, 0.6);
      cursor: pointer;
      transition: all 0.2s ease-in-out;
    }

    .dp-icon-btn svg {
      width: 16px;
      height: 16px;
      color: inherit;
      stroke: currentColor;
      filter: none;
    }

    .dp-icon-btn:hover {
      border-color: #36816d;
      background: linear-gradient(180deg, #115244 0%, #072b23 100%);
      color: #fff;
      box-shadow:
        0 0 0 1px #000,
        0 0 8px rgba(36, 204, 158, 0.4),
        0 4px 8px rgba(0, 0, 0, 0.7);
      transform: translateY(-1px);
    }

    .dp-icon-btn:active,
    .dp-icon-btn.active {
      border-color: #1a4d42;
      background: linear-gradient(180deg, #072b23 0%, #051f19 100%);
      color: rgb(206, 241, 235);
      box-shadow:
        0 0 0 1px #000,
        0 1px 2px rgba(0, 0, 0, 0.6);
      transform: translateY(0);
    }

    .dp-topbar .dp-side-title-main,
    .dp-topbar .dp-poly-stat-item,
    .dp-topbar .dp-poly-stat-item span,
    .dp-topbar .dp-poly-click-stat,
    .dp-topbar .dp-filter-badge {
      text-shadow:
        -1px -1px 0 #00000040,
        1px -1px 0 #00000040,
        -1px 1px 0 #00000040,
        1px 1px 0 #00000040;
    }

    @media (max-width: 1500px) {
      .dp-topbar {
        gap: 10px;
        padding-inline: 12px;
      }

      .dp-side-left-group,
      .dp-side-right-actions {
        gap: 8px;
      }

      .dp-side-title-main {
        font-size: 18px;
      }

      .dp-side-polygon-stats {
        position: static;
        flex: 1 1 auto;
        min-width: 0;
        justify-content: center;
        padding: 0 10px;
        transform: none;
      }

      .dp-side-polygon-stats::before,
      .dp-side-polygon-stats::after {
        display: none;
      }

      .dp-poly-stat-item {
        gap: 4px;
        font-size: 15px;
      }

      .dp-poly-click-stat {
        padding: 2px 5px;
        font-size: 15px;
      }

      .dp-date-indicator {
        margin-right: 0;
        padding: 4px 7px;
        font-size: 13px;
      }
    }

    @media (max-width: 1350px) {
      .dp-period-label,
      .dp-dot-separator,
      .dp-filter-summary-chip {
        display: none;
      }
    }

    @media (max-width: 960px) {
      .dp-topbar {
        flex-wrap: wrap;
        height: auto;
        min-height: 48px;
        padding-block: 8px;
      }

      .dp-side-polygon-stats {
        order: 3;
        width: 100%;
        overflow-x: auto;
      }

      .dp-poly-stat-item {
        min-width: max-content;
      }
    }

    .dashboard-shell {
      display: flex;
      flex-direction: column;
    }

    #dashboardMain {
      align-items: center;
      justify-content: center;
      flex: 1 1 auto;
      height: auto !important;
      min-height: 0;
      padding: 0 !important;
    }

    .dashboard-background-image {
      width: 100% !important;
      height: 100% !important;
      object-fit: cover;
    }

    .dashboard-content {
      min-height: 0;
      overflow: hidden !important;
      margin-top: 0 !important;
    }

    .dashboard-grid {
      grid-template-columns: minmax(0, 1fr) minmax(260px, 28vw) minmax(0, 1fr) !important;
      gap: clamp(18px, 2vw, 38px) !important;
      padding-inline: clamp(8px, 1.2vw, 22px) !important;
    }

    .dashboard-column {
      min-width: 0;
      overflow: hidden;
    }

    .dashboard-column-spacer {
      height: clamp(34px, 7vh, 74px) !important;
    }

    .dashboard-column-heading {
      height: clamp(42px, 5.6vh, 60px) !important;
    }

    .dashboard-column-heading h2 {
      transform: none !important;
      font-size: clamp(22px, 1.8vw, 32px) !important;
      line-height: 1.1;
      text-align: center;
      white-space: nowrap;
      text-shadow: 0 3px 10px rgba(0, 35, 95, .42);
    }

    .dashboard-column-strategy .dashboard-column-heading {
      justify-content: center !important;
      padding-left: 0;
    }

    .dashboard-column-strategy .dashboard-column-heading h2 {
      margin-left: 0;
      text-align: center;
    }

    .dashboard-column-business .dashboard-column-heading {
      justify-content: center !important;
      padding-right: 0;
    }

    .dashboard-column-business .dashboard-column-heading h2 {
      margin-right: 0;
      text-align: center;
    }

    .dashboard-column-focus {
      isolation: isolate;
      justify-content: flex-start;
      overflow: visible;
      padding-bottom: clamp(12px, 2vh, 24px);
    }

    .dashboard-column-focus .dashboard-column-heading {
      position: relative;
      z-index: 1;
      flex: 0 0 auto;
      width: 100%;
    }

    .dashboard-column-focus .dashboard-column-gap {
      position: relative;
      z-index: 1;
      flex: 0 0 clamp(8px, 1.2vh, 14px);
      height: auto !important;
    }

    .dashboard-column-focus .dashboard-list-shell {
      position: relative;
      z-index: 1;
      flex: 0 1 auto;
      width: 100%;
      height: auto;
      max-height: min(43vh, 350px) !important;
      overflow: hidden !important;
      padding-top: clamp(12px, 2vh, 22px) !important;
    }

    .dashboard-column-focus #routine-list {
      position: relative !important;
      inset: auto !important;
      height: auto !important;
      max-height: min(52vh, 430px) !important;
    }

    .dashboard-column-gap {
      height: clamp(6px, 1.1vh, 12px) !important;
    }
    .dashboard-column-strategy .dashboard-column-gap,
    .dashboard-column-business .dashboard-column-gap {
      height: clamp(60px, 9vh, 100px) !important;
    }

    .dashboard-list-shell {
      min-height: 0;
      overflow: hidden;
    }

    #strategy-tasks,
    #routine-list,
    #business-tasks {
      inset: 0 !important;
      width: 100% !important;
      height: 100% !important;
      min-height: 0 !important;
      max-height: none !important;
      padding: 6px clamp(7px, .75vw, 14px) 14px !important;
      gap: clamp(5px, 0.8vh, 10px) !important;
      transform: none !important;
      align-items: stretch !important;
      justify-content: flex-start !important;
    }

    #strategy-tasks article,
    #business-tasks article {
      position: relative;
      isolation: isolate;
      width: 100% !important;
      max-width: none !important;
      height: auto !important;
      min-height: 0 !important;
      margin: 0 !important;
      overflow: hidden;
      padding: 8px clamp(72px, 5.6vw, 94px) 8px clamp(48px, 4vw, 64px) !important;
      border: 1px solid rgba(205, 228, 249, .95);
      border-radius: 999px !important;
      background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(235,247,255,.96)) !important;
      box-shadow:
        0 10px 20px rgba(15, 82, 173, .22),
        inset 0 1px 0 rgba(255,255,255,.95) !important;
    }

    #business-tasks article {
      box-shadow:
        0 10px 20px rgba(0, 109, 124, .22),
        inset 0 1px 0 rgba(255,255,255,.95) !important;
    }

    #strategy-tasks article > b,
    #business-tasks article > b {
      position: absolute;
      top: 50%;
      left: clamp(8px, .75vw, 14px);
      z-index: 2;
      width: clamp(30px, 2.45vw, 42px) !important;
      height: clamp(30px, 2.45vw, 42px) !important;
      transform: translateY(-50%);
      border: 2px solid rgba(255,255,255,.94);
      font-size: clamp(11px, .85vw, 15px) !important;
      box-shadow: 0 5px 10px rgba(0, 40, 120, .25);
    }

    #strategy-tasks article > div:first-of-type,
    #business-tasks article > div:first-of-type {
      min-width: 0;
      margin-left: 0 !important;
      padding-right: 0 !important;
    }

    #strategy-tasks article > div:last-child,
    #business-tasks article > div:last-child {
      position: absolute;
      top: 50%;
      right: clamp(8px, .75vw, 14px);
      width: clamp(62px, 5vw, 76px) !important;
      height: clamp(62px, 5vw, 76px) !important;
      transform: translateY(-50%);
      margin: 0 !important;
    }

    #strategy-tasks article > div:last-child > div,
    #business-tasks article > div:last-child > div {
      width: 84% !important;
      height: 84% !important;
      color: #07306c;
      font-size: clamp(11px, .8vw, 14px) !important;
    }

    #business-tasks article > div:last-child > div {
      color: #045c65;
    }

    #strategy-tasks article h3,
    #business-tasks article h3 {
      color: #061f63;
      font-size: clamp(16px, 1.15vw, 21px) !important;
      line-height: 1.12 !important;
      letter-spacing: -.035em;
    }

    #business-tasks article h3 {
      color: #062f48;
    }

    #strategy-tasks article p,
    #business-tasks article p {
      font-size: clamp(14px, 1.02vw, 18px) !important;
      line-height: 1.14 !important;
      letter-spacing: -.025em;
      white-space: nowrap !important;
      overflow: hidden !important;
      text-overflow: ellipsis !important;
    }

    #routine-list {
      gap: clamp(9px, 1.2vh, 14px) !important;
      padding-inline: clamp(8px, .9vw, 16px) !important;
    }

    #routine-list .focus-project-card {
      position: relative;
      display: flex;
      flex-direction: column;
      flex: 0 0 auto;
      width: 100%;
      height: clamp(190px, 24vh, 220px) !important;
      min-height: clamp(190px, 24vh, 220px) !important;
      margin: 0;
      padding: clamp(10px, 1.15vh, 14px) clamp(11px, .95vw, 16px) !important;
      overflow: hidden;
      border: 1px solid rgba(132, 151, 232, .5);
      border-radius: 16px !important;
      background:
        linear-gradient(145deg, rgba(255,255,255,.98) 0%, rgba(244,246,255,.98) 48%, rgba(232,245,255,.96) 100%) !important;
      box-shadow:
        0 10px 22px rgba(63, 81, 181, .2),
        inset 0 1px 0 rgba(255,255,255,.95) !important;
      cursor: pointer;
      transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
    }

    #routine-list .focus-project-card:hover {
      z-index: 2;
      border-color: rgba(83, 103, 224, .72);
      box-shadow:
        0 14px 28px rgba(63, 81, 181, .28),
        inset 0 1px 0 rgba(255,255,255,.98) !important;
      transform: translateY(-2px);
    }

    .focus-card-header {
      display: flex;
      align-items: center;
      gap: 9px;
      min-width: 0;
    }

    .focus-card-header::before {
      content: "✓";
      display: grid;
      flex: 0 0 auto;
      width: 22px;
      height: 22px;
      place-items: center;
      border-radius: 50%;
      background: linear-gradient(145deg, #6c88bd, #91a6c9);
      color: #fff;
      font-size: 14px;
      font-weight: 900;
      box-shadow: 0 2px 5px rgba(71, 91, 140, .22);
    }

    #routine-list .focus-card-header h3 {
      flex: 1 1 auto;
      min-width: 0;
      margin: 0;
      overflow: hidden;
      color: #14245e;
      font-size: clamp(20px, 1.34vw, 24px) !important;
      font-weight: 850;
      line-height: 1.15 !important;
      letter-spacing: -.035em;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .focus-card-progress-value {
      flex: 0 0 auto;
      min-width: 58px;
      padding: 6px 11px;
      border: 1px solid rgba(84, 101, 217, .2);
      border-radius: 999px;
      background: linear-gradient(90deg, #315ee9, #7654dc);
      color: #fff;
      font-size: clamp(15px, .95vw, 17px);
      font-weight: 850;
      line-height: 1.1;
      text-align: center;
      box-shadow: 0 3px 8px rgba(70, 81, 190, .2);
    }

    .focus-card-period {
      margin-top: 5px;
      padding-left: 31px;
      overflow: hidden;
      color: #536386;
      font-size: clamp(15px, .98vw, 17px);
      font-weight: 750;
      line-height: 1.15;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .focus-card-issue {
      display: flex;
      align-items: center;
      gap: 5px;
      min-width: 0;
      margin-top: 8px;
      padding: 7px 0 7px 31px;
      border-top: 1px dashed rgba(115, 130, 195, .3);
      border-bottom: 1px dashed rgba(115, 130, 195, .22);
      font-size: clamp(14px, .92vw, 16px);
      line-height: 1.15;
    }

    .focus-card-issue > span {
      flex: 0 0 auto;
      padding: 3px 6px;
      border-radius: 4px;
      background: #fff0ed;
      color: #c54135;
      font-weight: 800;
    }

    .focus-card-issue > strong {
      min-width: 0;
      overflow: hidden;
      color: #5e4960;
      font-weight: 700;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .focus-card-current {
      display: flex;
      flex-direction: column;
      gap: 5px;
      margin-top: 8px;
      padding: 0 0 0 31px;
    }

    .focus-card-current > div {
      position: relative;
      display: grid;
      grid-template-columns: 72px minmax(0, 1fr);
      align-items: center;
      gap: 7px;
      min-width: 0;
      padding: 0;
      background: transparent;
    }

    .focus-card-current > div::before {
      content: "";
      position: absolute;
      top: 50%;
      left: -15px;
      width: 6px;
      height: 6px;
      transform: translateY(-50%);
      border-radius: 50%;
      background: #aebbd3;
    }

    .focus-card-current span,
    .focus-card-current strong {
      overflow: hidden;
      line-height: 1.25;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .focus-card-current span {
      color: #8291ad;
      font-size: clamp(13px, .82vw, 15px);
      font-weight: 800;
    }

    .focus-card-current strong {
      color: #40547f;
      font-size: clamp(14px, .9vw, 16px);
      font-weight: 800;
    }

    .dashboard-bottom-bar {
      width: min(88%, 1500px) !important;
      height: clamp(64px, 9.5vh, 94px) !important;
      min-height: 64px;
      margin-top: -8vh !important;
      margin-bottom: 0 !important;
      padding-inline: clamp(18px, 2vw, 36px) !important;
      position: relative;
      z-index: 50;
    }

    .dashboard-bottom-inner {
      width: 100%;
      justify-content: flex-start;
    }

    .dashboard-bottom-bar .text-\[24px\] {
      font-size: clamp(16px, 1.25vw, 23px) !important;
    }

    #routine-more-indicator,
    #strategy-more-indicator,
    #business-more-indicator {
      bottom: 4px !important;
    }

    @media (max-width: 1000px) {
      .dashboard-grid {
        grid-template-columns: minmax(0, 1fr) minmax(210px, 27vw) minmax(0, 1fr) !important;
        gap: 10px !important;
        padding-inline: 0 !important;
      }

      #strategy-tasks article,
      #business-tasks article {
        padding-right: 42px !important;
        padding-left: 38px !important;
      }

      #strategy-tasks article > div:last-child,
      #business-tasks article > div:last-child {
        width: 36px !important;
        height: 36px !important;
        right: 5px;
      }

      #routine-list .focus-project-card {
        height: 190px !important;
        min-height: 190px !important;
        padding-inline: 9px !important;
      }

      .focus-card-current > div {
        grid-template-columns: 66px minmax(0, 1fr);
      }
    }

    .routine-scroll {
      overflow-y: auto;
      scrollbar-width: none;
    }

    .routine-scroll.is-scrolled {
      mask-image: linear-gradient(to bottom, transparent 0%, black 8%, black 100%);
      -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 8%, black 100%);
    }

    .routine-scroll.has-more {
      mask-image: linear-gradient(to bottom, black 85%, transparent 100%);
      -webkit-mask-image: linear-gradient(to bottom, black 85%, transparent 100%);
    }

    .routine-scroll.is-scrolled.has-more {
      mask-image: linear-gradient(to bottom, transparent 0%, black 8%, black 85%, transparent 100%);
      -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 8%, black 85%, transparent 100%);
    }

    .routine-scroll::-webkit-scrollbar {
      width: 6px;
    }

    .routine-scroll::-webkit-scrollbar-track {
      background: transparent;
    }

    .routine-scroll::-webkit-scrollbar-thumb {
      background: transparent;
      border-radius: 999px;
      transition: background 0.3s ease;
    }

    .routine-scroll.is-scrolling::-webkit-scrollbar-thumb {
      background: rgba(18, 104, 223, 0.4);
    }

    .dp-date-indicator {
      display: inline-flex;
      align-items: center;
      padding: 4px 10px;
      margin-right: 8px;
      border: 1px solid rgba(255, 255, 255, 0.3);
      border-radius: 4px;
      background: rgba(255, 255, 255, 0.15);
      color: #fff;
      font-size: 15px;
      font-weight: 600;
      letter-spacing: -0.3px;
      text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
      white-space: nowrap;
    }

    .dp-calendar-dropdown {
      position: absolute;
      top: 56px;
      right: 20px;
      z-index: 1000;
      width: 340px;
      background: #fff;
      border: 1px solid #e2e8f0;
      border-radius: 16px;
      padding: 16px;
      box-shadow: 0 10px 40px rgba(0, 0, 100, 0.15);
      color: #1e293b;
      display: none;
    }

    .dp-calendar-dropdown.show {
      display: block;
    }

    .dp-cal-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 12px;
    }

    .dp-cal-nav-btn {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 32px;
      height: 32px;
      border-radius: 8px;
      border: 1px solid #e2e8f0;
      color: #3b82f6;
      background: transparent;
      cursor: pointer;
    }

    .dp-cal-nav-btn:hover {
      background: #f8fafc;
    }

    .dp-cal-title {
      font-size: 18px;
      font-weight: 700;
      color: #0f172a;
    }

    .dp-cal-quarters {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 6px;
      margin-bottom: 12px;
    }

    .dp-cal-q-btn {
      display: flex;
      flex-direction: column;
      align-items: center;
      padding: 6px 0;
      border-radius: 8px;
      border: 1px solid #e2e8f0;
      background: #fff;
      cursor: pointer;
    }

    .dp-cal-q-btn:hover {
      background: #eff6ff;
      border-color: #bfdbfe;
    }

    .dp-cal-q-btn.active {
      border-color: #2563eb;
      background: #dbeafe;
      box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.18);
    }

    .dp-cal-q-btn .q-name {
      font-size: 13px;
      font-weight: 700;
      color: #1e40af;
    }

    .dp-cal-q-btn .q-date {
      font-size: 10px;
      color: #94a3b8;
    }

    .dp-cal-grid-header {
      display: grid;
      grid-template-columns: 2.5fr repeat(7, 1fr);
      text-align: center;
      font-size: 12px;
      font-weight: 600;
      color: #64748b;
      margin-bottom: 8px;
    }

    .dp-cal-grid-header>div:first-child {
      text-align: left;
      padding-left: 8px;
    }

    .dp-cal-week-row {
      display: grid;
      grid-template-columns: 2.5fr repeat(7, 1fr);
      align-items: center;
      text-align: center;
      padding: 4px 0;
      border-radius: 8px;
      cursor: pointer;
      font-size: 13px;
      color: #334155;
      margin-bottom: 2px;
    }

    .dp-cal-week-row:hover {
      background: #f1f5f9;
    }

    .dp-cal-week-row.active {
      background: #eff6ff;
      border: 1px solid #bfdbfe;
      color: #1e40af;
      font-weight: 600;
    }

    .dp-cal-week-label {
      text-align: left;
      padding-left: 8px;
      color: #3b82f6;
      font-weight: 600;
    }

    .dp-cal-day {
      padding: 4px 0;
    }

    .dp-cal-day.other-month {
      color: #cbd5e1;
    }

    .dp-cal-footer {
      display: flex;
      justify-content: flex-end;
      gap: 8px;
      margin-top: 12px;
      padding-top: 12px;
      border-top: 1px solid #e2e8f0;
    }

    .dp-cal-footer-btn {
      padding: 6px 12px;
      border-radius: 6px;
      border: 1px solid #e2e8f0;
      background: #fff;
      font-size: 13px;
      font-weight: 600;
      color: #3b82f6;
      cursor: pointer;
    }

    .dp-cal-footer-btn:hover {
      background: #f8fafc;
    }

    .dp-icon-btn[data-tooltip]::after {
      content: attr(data-tooltip);
      position: absolute;
      top: calc(100% + 12px);
      left: 50%;
      transform: translateX(-50%);
      background-color: rgba(15, 35, 60, 0.95);
      color: #fff;
      font-size: 18px;
      font-weight: 500;
      padding: 6px 14px;
      border-radius: 8px;
      white-space: nowrap;
      pointer-events: none;
      opacity: 0;
      visibility: hidden;
      transition: opacity 0.2s ease, transform 0.2s ease;
      z-index: 1000;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
      border: 1px solid rgba(255, 255, 255, 0.1);
      letter-spacing: -0.5px;
    }

    .dp-icon-btn[data-tooltip]:hover::after {
      opacity: 1;
      visibility: visible;
      transform: translateX(-50%) translateY(2px);
    }

    .dp-side-right-actions .dp-icon-btn[data-action="calendar"][data-tooltip]::after {
      left: auto;
      right: 0;
      transform: translateX(0);
    }

    .dp-side-right-actions .dp-icon-btn[data-action="calendar"][data-tooltip]:hover::after {
      transform: translateX(0) translateY(2px);
    }
    
    .org-tasks-list::-webkit-scrollbar { width: 4px; }
    .org-tasks-list::-webkit-scrollbar-track { background: transparent; }
    .org-tasks-list::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }

    .project-modal-overlay {
      position: fixed;
      inset: 0;
      z-index: 1000;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 32px;
      background: rgba(5, 18, 32, 0.62);
      backdrop-filter: blur(3px);
    }

    .project-modal-overlay.is-open {
      display: flex;
    }

    .project-modal-dialog {
      position: relative;
      width: 92vw;
      height: 88vh;
      max-width: 1600px;
      overflow: hidden;
      border: 1px solid rgba(215, 222, 232, 0.9);
      border-radius: 20px;
      background: #fff;
      box-shadow: 0 28px 80px rgba(3, 15, 28, 0.35);
    }

    .project-modal-close {
      position: absolute;
      top: 14px;
      right: 14px;
      z-index: 2;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 38px;
      height: 38px;
      border: 1px solid #d7dee8;
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.95);
      color: #0f172a;
      box-shadow: 0 8px 22px rgba(15, 23, 42, 0.16);
      cursor: pointer;
      font-size: 26px;
      font-weight: 700;
      line-height: 1;
    }

    .project-modal-close:hover {
      border-color: #0f766e;
      color: #047857;
      background: #f0fdfa;
    }

    .js-open-project-detail {
      cursor: pointer;
      text-decoration: none;
      transition: color 0.18s ease, transform 0.18s ease;
    }

    .js-open-project-detail:hover {
      color: #10b981 !important;
      text-shadow: none !important;
    }

    body.project-modal-open {
      overflow: hidden !important;
    }

    .dashboard-shell #routine-more-indicator,
    .dashboard-shell #routine-more-indicator span {
      font-size: 20px !important;
    }

    .dashboard-shell #routine-list .focus-project-card {
      height: 230px !important;
      min-height: 230px !important;
    }

    .dashboard-shell #routine-list .focus-card-header h3,
    .dashboard-shell .focus-card-progress-value,
    .dashboard-shell .focus-card-period,
    .dashboard-shell .focus-card-issue,
    .dashboard-shell .focus-card-issue > span,
    .dashboard-shell .focus-card-issue > strong,
    .dashboard-shell .focus-card-current span,
    .dashboard-shell .focus-card-current strong {
      font-size: 20px !important;
    }

    .dashboard-shell .focus-card-progress-value {
      min-width: 70px;
      padding: 7px 13px;
    }

    .dashboard-shell .focus-card-current > div {
      grid-template-columns: 92px minmax(0, 1fr);
      min-height: 25px;
    }

    .dashboard-shell .dashboard-bottom-bar,
    .dashboard-shell .dashboard-bottom-bar div,
    .dashboard-shell .dashboard-bottom-bar span {
      font-size: 20px !important;
    }

    .dashboard-column-focus #routine-list[data-focus-count]:not([data-focus-count="0"]):not([data-focus-count="1"]) {
      display: grid !important;
      grid-template-columns: repeat(var(--focus-columns), minmax(0, 1fr));
      grid-template-rows: repeat(var(--focus-rows), minmax(0, 1fr));
      align-items: stretch !important;
      justify-content: stretch !important;
      width: 100% !important;
      height: min(68vh, var(--focus-list-height)) !important;
      max-height: calc(100% - 2px) !important;
      overflow: hidden !important;
      gap: 8px !important;
      padding: 5px 8px !important;
      mask-image: none !important;
      -webkit-mask-image: none !important;
    }

    .dashboard-column-focus #routine-list[data-focus-count]:not([data-focus-count="0"]):not([data-focus-count="1"]) .focus-project-card {
      width: 100% !important;
      height: 100% !important;
      min-height: 0 !important;
    }

    .dashboard-column-focus #routine-list[data-focus-density="compact"] .focus-project-card {
      padding: 6px 8px !important;
      border-radius: 12px !important;
    }

    .dashboard-column-focus #routine-list[data-focus-density="compact"] .focus-card-header {
      gap: 5px;
    }

    .dashboard-column-focus #routine-list[data-focus-density="compact"] .focus-card-header::before {
      width: 20px;
      height: 20px;
      font-size: 12px;
    }

    .dashboard-column-focus #routine-list[data-focus-density="compact"] .focus-card-period {
      margin-top: 1px;
      padding-left: 25px;
    }

    .dashboard-column-focus #routine-list[data-focus-density="compact"] .focus-card-issue {
      margin-top: 3px;
      padding: 3px 0 3px 25px;
    }

    .dashboard-column-focus #routine-list[data-focus-density="compact"] .focus-card-current {
      gap: 0;
      margin-top: 3px;
      padding-left: 25px;
    }

    .dashboard-column-focus #routine-list[data-focus-density="compact"] .focus-card-current > div {
      grid-template-columns: 90px minmax(0, 1fr);
      min-height: 20px;
    }

    .dashboard-column-focus #routine-list[data-focus-columns="2"] .focus-card-header::before {
      display: none;
    }

    .dashboard-column-focus #routine-list[data-focus-columns="2"] .focus-card-period,
    .dashboard-column-focus #routine-list[data-focus-columns="2"] .focus-card-issue,
    .dashboard-column-focus #routine-list[data-focus-columns="2"] .focus-card-current {
      padding-left: 0;
    }

    .dashboard-column-focus #routine-list[data-focus-columns="2"] .focus-card-current > div {
      grid-template-columns: 72px minmax(0, 1fr);
    }

.global-data-status {
  position: fixed;
  top: 74px;
  right: 18px;
  z-index: 80;
  max-width: 420px;
  padding: 7px 11px;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  background: rgba(239, 246, 255, 0.96);
  color: #1d4ed8;
  box-shadow: 0 8px 24px rgba(30, 64, 175, 0.12);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: -0.02em;
  pointer-events: none;
  transition: opacity 0.2s ease;
}

/* 경영전략·사업관리 프로젝트 카드의 기간/내용 정렬 */
#strategy-tasks .bp-project-card-meta,
#business-tasks .bp-project-card-meta {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  column-gap: 4px;
  align-items: baseline;
  min-width: 0;
}

#strategy-tasks .bp-project-card-meta-bullet,
#business-tasks .bp-project-card-meta-bullet {
  display: block;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.15;
  text-align: center;
}

#strategy-tasks .bp-project-card-meta-text,
#business-tasks .bp-project-card-meta-text {
  display: block;
  min-width: 0;
}

.global-data-status.is-success {
  border-color: #a7f3d0;
  background: rgba(236, 253, 245, 0.96);
  color: #047857;
}

.global-data-status.is-warning {
  border-color: #fde68a;
  background: rgba(255, 251, 235, 0.98);
  color: #92400e;
}

.global-data-status.is-error {
  border-color: #fecaca;
  background: rgba(254, 242, 242, 0.98);
  color: #b91c1c;
}

.dashboard-period-empty {
  display: grid;
  width: 100%;
  min-height: 92px;
  place-items: center;
  padding: 16px;
  border: 1px dashed rgba(148, 163, 184, 0.55);
  border-radius: 18px;
  color: #64748b;
  background: rgba(255, 255, 255, 0.68);
  font-size: 15px;
  font-weight: 750;
  text-align: center;
}

/* Team organization chart */
#team-modal {
  background-color: #f2efe9;
  color: #26352f;
}

#team-modal > div:nth-child(2) {
  padding-top: 24px;
  padding-bottom: 14px;
}

#team-modal h2 {
  font-size: 26px !important;
  letter-spacing: -0.04em;
}

#team-modal #toggle-tasks-btn {
  min-height: 42px;
  padding: 10px 18px;
  border-radius: 11px;
  font-size: 15px !important;
}

#team-modal #close-team-modal {
  width: 42px;
  height: 42px;
}

#org-chart-container {
  width: min(1120px, calc(100vw - 52px));
  margin: 0 auto;
  padding-top: 10px !important;
}

#team-modal .org-card {
  width: 500px !important;
  height: 112px !important;
  border-color: #dbe5df !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 8px 22px rgba(48, 73, 62, 0.07) !important;
}

#team-modal .org-card:hover {
  border-color: #9fc7b6 !important;
  box-shadow: 0 12px 30px rgba(38, 91, 69, 0.14) !important;
  transform: translateY(-2px);
}

#team-modal .org-card-container > .org-card {
  width: 440px !important;
  height: 132px !important;
  border-color: #c7ddd3 !important;
  border-radius: 21px !important;
}

#team-modal .org-card > div:first-child {
  width: 100% !important;
  gap: 20px !important;
  padding: 20px 26px !important;
}

#team-modal .org-card > div:first-child > div:first-child {
  width: 66px !important;
  height: 66px !important;
  font-size: 23px !important;
  box-shadow: inset 0 0 0 1px rgba(31, 80, 65, 0.08);
}

#team-modal .org-card-container .org-card > div:first-child > div:first-child {
  width: 76px !important;
  height: 76px !important;
  font-size: 26px !important;
}

#team-modal .org-card > div:first-child > div:last-child > div:first-child {
  color: #202b27 !important;
  font-size: 21px !important;
  line-height: 1.3;
  letter-spacing: -0.035em;
}

#team-modal .org-card-container .org-card > div:first-child > div:last-child > div:first-child {
  font-size: 23px !important;
}

#team-modal .org-card > div:first-child > div:last-child > div:first-child span {
  margin-left: 7px;
  color: #33725b !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

#team-modal .team-member-work-count {
  margin-top: 7px !important;
  color: #6d7772 !important;
  font-size: 15px !important;
  font-weight: 600;
}

#org-line-h {
  width: 532px !important;
  border-color: #779f8e !important;
}

#org-chart-container > div:nth-child(2),
#org-cells-container > div > div:first-child {
  background-color: #779f8e !important;
}

#org-cells-container {
  width: 1032px;
  gap: 32px !important;
}

#org-cells-container > div {
  width: 500px;
}

#org-cells-container > div > div:nth-child(2) {
  width: 500px !important;
  min-height: 60px;
  margin-bottom: 14px !important;
  padding: 14px 22px !important;
  border-color: #c8dbd2 !important;
  border-radius: 15px !important;
  background: rgba(247, 251, 249, 0.96) !important;
  box-shadow: 0 5px 15px rgba(48, 73, 62, 0.05) !important;
}

#org-cells-container > div > div:nth-child(2) > span:first-child {
  color: #353f3b !important;
  font-size: 21px !important;
  letter-spacing: -0.035em;
}

#org-cells-container > div > div:nth-child(2) > span:last-child {
  padding: 4px 11px !important;
  font-size: 14px !important;
}

#org-cells-container > div > div:last-child {
  width: 100%;
  gap: 12px !important;
}

.team-hover-popover {
  position: fixed;
  z-index: 2500;
  display: grid;
  grid-template-columns: 176px minmax(0, 1fr);
  width: min(650px, calc(100vw - 36px));
  min-height: 294px;
  padding: 17px;
  overflow: hidden;
  border: 1px solid #bdd6ca;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.99);
  box-shadow: 0 22px 55px rgba(35, 69, 54, 0.2);
  opacity: 1;
  transition: opacity 0.18s ease, transform 0.18s ease;
}

.team-hover-popover.hidden {
  display: none !important;
}

.team-hover-popover.opacity-0 {
  opacity: 0;
  transform: translateY(5px);
}

.team-hover-popover.opacity-100 {
  opacity: 1;
  transform: translateY(0);
}

.team-hover-profile {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 15px;
  min-width: 0;
  padding: 10px 18px 10px 4px;
}

.team-hover-profile > div:first-child {
  display: grid !important;
  width: 74px !important;
  height: 74px !important;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 999px;
  font-size: 25px !important;
}

.team-hover-profile > div:last-child > div:first-child {
  color: #16221d !important;
  font-size: 22px !important;
  font-weight: 850 !important;
  line-height: 1.25;
}

.team-hover-profile > div:last-child > div:first-child span {
  display: block;
  margin: 6px 0 0 !important;
  color: #33725b !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

.team-hover-profile .team-member-work-count {
  margin-top: 7px !important;
  color: #6c746f !important;
  font-size: 14px !important;
  line-height: 1.45;
}

.team-hover-tasks {
  min-width: 0;
  padding: 14px 15px;
  border: 1px solid #d7e4de;
  border-radius: 12px;
  background: #f8fbf9;
}

.team-hover-tasks h4 {
  margin: 0 0 8px;
  padding-bottom: 10px;
  border-bottom: 1px solid #d8e4de;
  color: #173d2f;
  font-size: 18px;
  font-weight: 850;
  letter-spacing: -0.025em;
}

.team-hover-task-list {
  max-height: 220px;
  overflow-y: auto;
  padding-right: 4px;
}

.team-hover-task-list > div {
  min-height: 31px;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
  border-color: #e3ebe7 !important;
}

.team-hover-task-list .text-\[12px\] {
  color: #26352f !important;
  font-size: 15px !important;
}

.team-hover-task-list .text-\[10px\] {
  font-size: 12px !important;
}

.team-hover-task-list .h-1\.5 {
  width: 7px !important;
  height: 7px !important;
  background: #18b981 !important;
}

#team-modal.tasks-expanded {
  overflow-x: auto;
}

#team-modal.tasks-expanded #org-chart-container {
  width: 1180px;
  min-width: 1180px;
}

#team-modal.tasks-expanded .org-card {
  width: 100% !important;
  height: 208px !important;
}

#team-modal.tasks-expanded .org-card-container > .org-card {
  width: 760px !important;
  height: 196px !important;
}

#team-modal.tasks-expanded .org-card > div:first-child {
  flex-direction: column;
  align-items: flex-start !important;
  justify-content: center;
  width: 176px !important;
  gap: 8px !important;
  padding: 14px 18px !important;
}

#team-modal.tasks-expanded .org-card-container > .org-card > div:first-child {
  width: 190px !important;
  padding: 16px 20px !important;
}

#team-modal.tasks-expanded .org-card > div:first-child > div:first-child {
  width: 58px !important;
  height: 58px !important;
  font-size: 21px !important;
}

#team-modal.tasks-expanded .org-card-container > .org-card > div:first-child > div:first-child {
  width: 66px !important;
  height: 66px !important;
  font-size: 23px !important;
}

#team-modal.tasks-expanded .org-card > div:first-child > div:last-child > div:first-child {
  font-size: 19px !important;
}

#team-modal.tasks-expanded .org-card-container > .org-card > div:first-child > div:last-child > div:first-child {
  font-size: 21px !important;
}

#team-modal.tasks-expanded .org-card > div:first-child > div:last-child > div:first-child span {
  display: block;
  margin: 3px 0 0 !important;
  font-size: 14px !important;
}

#team-modal.tasks-expanded .team-member-work-count {
  margin-top: 4px !important;
  font-size: 13px !important;
  line-height: 1.35;
}

#team-modal.tasks-expanded .org-tasks {
  min-width: 0;
  padding: 17px 18px !important;
  border-color: #dce7e1 !important;
  background: #f8fbf9 !important;
}

#team-modal.tasks-expanded .org-tasks h4 {
  margin-bottom: 8px !important;
  color: #173d2f !important;
  font-size: 17px !important;
}

#team-modal.tasks-expanded .org-tasks-list {
  height: 145px !important;
}

#team-modal.tasks-expanded .org-tasks-list .text-\[12px\] {
  font-size: 13px !important;
}

#team-modal.tasks-expanded .org-tasks-list .text-\[10px\] {
  font-size: 11px !important;
}

#team-modal.tasks-expanded #org-line-h,
#team-modal.tasks-expanded #org-cells-container > div > div:first-child {
  display: block !important;
}

#team-modal.tasks-expanded #org-line-h {
  width: 602px !important;
}

#team-modal.tasks-expanded #org-cells-container {
  flex-direction: row;
  align-items: flex-start;
  width: 1180px;
  gap: 24px !important;
  padding-top: 32px !important;
}

#team-modal.tasks-expanded #org-cells-container > div {
  width: 578px !important;
}

#team-modal.tasks-expanded #org-cells-container > div > div:nth-child(2) {
  width: 578px !important;
}

@media (max-width: 1100px) {
  #team-modal .org-card,
  #org-cells-container > div,
  #org-cells-container > div > div:nth-child(2) {
    width: 430px !important;
  }

  #org-cells-container {
    width: 884px;
    gap: 24px !important;
  }

  #org-line-h {
    width: 454px !important;
  }
}

@media (max-width: 900px) {
  #team-modal > div:nth-child(2) {
    padding-right: 20px;
    padding-left: 20px;
  }

  #org-cells-container {
    flex-direction: column;
    align-items: center;
    width: 100%;
    gap: 30px !important;
  }

  #org-line-h,
  #org-cells-container > div > div:first-child {
    display: none;
  }

  #team-modal .org-card,
  #team-modal .org-card-container > .org-card,
  #org-cells-container > div,
  #org-cells-container > div > div:nth-child(2) {
    width: min(560px, calc(100vw - 40px)) !important;
  }

  .team-hover-popover {
    grid-template-columns: 150px minmax(0, 1fr);
  }
}

/* Main dashboard: center routine work / bottom focus projects */
.dashboard-column-focus .dashboard-column-heading h2 {
  background: none !important;
  color: #0d347e !important;
  -webkit-text-fill-color: #0d347e !important;
  font-size: clamp(28px, 2.25vw, 38px) !important;
  letter-spacing: -0.045em !important;
  text-shadow: 0 3px 10px rgba(38, 91, 181, 0.18) !important;
  filter: none !important;
}

.dashboard-column-focus .dashboard-column-spacer {
  display: block;
  height: clamp(82px, 12.5vh, 108px) !important;
}

.dashboard-column-focus .dashboard-column-heading::after {
  content: "";
  position: absolute;
  bottom: -6px;
  left: 50%;
  width: min(74%, 270px);
  height: 2px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, #83abe7 12%, #83abe7 88%, transparent);
}

.dashboard-column-focus .dashboard-column-heading > div::after {
  display: none;
}

#routine-list.center-routine-list {
  position: relative !important;
  inset: auto !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: min(43vh, 350px) !important;
  padding: clamp(8px, 1.2vh, 14px) clamp(20px, 2.8vw, 46px) 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

.center-routine-items {
  display: flex;
  flex-direction: column;
  gap: clamp(10px, 1.4vh, 16px);
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

.center-routine-item {
  display: grid;
  grid-template-columns: 9px minmax(0, 1fr);
  align-items: center;
  gap: 11px;
  min-width: 0;
  color: #132e67;
  font-size: clamp(17px, 1.22vw, 21px);
  font-weight: 750;
  line-height: 1.3;
  letter-spacing: -0.035em;
}

.center-routine-item .js-open-project-detail {
  color: inherit !important;
}

.center-routine-item .js-open-project-detail:hover {
  color: #1268df !important;
}

.center-routine-bullet {
  width: 4.9px;
  height: 4.9px;
  border-radius: 50%;
  background: #145ecb;
  box-shadow: 0 0 0 2.1px rgba(20, 94, 203, 0.09);
}

.dashboard-column-focus #routine-more-indicator {
  bottom: 0 !important;
  font-size: 14px !important;
}

.dashboard-bottom-bar.bottom-focus-panel {
  width: min(58vw, 860px) !important;
  height: clamp(108px, 16.5vh, 148px) !important;
  min-height: 108px;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: clamp(10px, 1.4vh, 16px) clamp(42px, 5vw, 78px) clamp(14px, 2vh, 20px) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: translateY(-4px);
}

.bottom-focus-panel .dashboard-bottom-inner {
  width: 100%;
  height: 100%;
  gap: clamp(8px, 1.3vh, 13px) !important;
  overflow: visible;
}

.bottom-focus-heading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex: 0 0 auto;
  color: #1551bd;
  font-size: clamp(21px, 1.65vw, 29px) !important;
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: -0.045em;
  text-shadow: 0 2px 6px rgba(43, 93, 180, 0.13);
}

.bottom-focus-heading svg {
  width: clamp(26px, 2.1vw, 36px);
  height: clamp(26px, 2.1vw, 36px);
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#bottom-focus-list {
  display: flex;
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  gap: clamp(18px, 3vw, 46px) !important;
  overflow-x: auto;
  color: #183b7d !important;
}

.bottom-focus-item {
  justify-content: center;
  min-width: 0;
  max-width: min(48vw, 680px);
  color: #183b7d !important;
  font-size: clamp(17px, 1.25vw, 22px) !important;
  text-shadow: none !important;
}

.bottom-focus-item:hover {
  color: #075ecf !important;
}

.bottom-focus-item > span:first-child {
  color: #1766d1 !important;
  font-size: 27px !important;
}

.bottom-focus-item > span:last-child {
  display: block;
  max-width: min(42vw, 620px) !important;
}

@media (max-width: 900px) {
  .dashboard-bottom-bar.bottom-focus-panel {
    width: min(68vw, 700px) !important;
    padding-right: 28px !important;
    padding-left: 28px !important;
  }
}

/* Responsive 16:9 dashboard stage: background and contents scale together */
.dashboard-stage {
  container-type: size;
  position: relative;
  flex: 1 1 auto;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}


.dashboard-stage .dashboard-background-image {
  width: 100% !important;
  height: 100% !important;
  object-fit: fill !important;
}

.dashboard-right-panel-mirror {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: fill;
  pointer-events: none;
  z-index: 2;
}

.dashboard-connection-layer {
  position: absolute;
  inset: 0;
  z-index: 18;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.dashboard-connection-path-base,
.dashboard-connection-path {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.dashboard-connection-path-base {
  stroke-width: 7;
  opacity: 0.9;
  transform: translateY(2.5px);
  filter: drop-shadow(0 4px 6px rgba(36, 91, 184, 0.2));
}

.dashboard-connection-path {
  stroke: rgba(255, 255, 255, 0.96) !important;
  stroke-width: 4.8;
  opacity: 1;
  filter: drop-shadow(0 1px 2px rgba(17, 78, 166, 0.12));
}

.dashboard-connection-node-halo {
  fill: rgba(255, 255, 255, 0.96);
  stroke: rgba(180, 212, 255, 0.72);
  stroke-width: 2;
  filter: drop-shadow(0 3px 6px rgba(19, 81, 183, 0.22));
}

.dashboard-connection-node-ring {
  fill: #ffffff;
  stroke-width: 3.2;
  filter: drop-shadow(0 2px 4px rgba(17, 78, 166, 0.18));
}

.dashboard-connection-node-core {
  opacity: 0.96;
  filter: drop-shadow(0 1px 2px rgba(17, 78, 166, 0.22));
}
.dashboard-stage .dashboard-content {
  position: absolute !important;
  inset: 0 0 18cqh !important;
  width: 100%;
  height: auto !important;
}

.dashboard-stage .dashboard-grid {
  display: grid !important;
  grid-template-columns: 31.5cqw 28cqw 31.5cqw !important;
  column-gap: 4.5cqw !important;
  width: 100%;
  height: 100%;
  padding: 0 !important;
}

.dashboard-stage .dashboard-column-strategy .dashboard-column-spacer,
.dashboard-stage .dashboard-column-business .dashboard-column-spacer {
  flex: 0 0 calc(102cqh / 10) !important;
  height: calc(102cqh / 10) !important;
}

.dashboard-stage .dashboard-column-strategy .dashboard-column-heading,
.dashboard-stage .dashboard-column-business .dashboard-column-heading {
  flex: 0 0 6.2cqh !important;
  width: 58% !important;
  height: 6.2cqh !important;
  margin: 0 auto;
  background: transparent !important;
}

.dashboard-stage .dashboard-column-heading h2 {
  font-size: 35px !important;
  color: #ffffff !important;
  text-shadow: 0 3px 8px rgba(0, 42, 105, 0.38) !important;
}

.dashboard-stage .dashboard-column-strategy .dashboard-column-heading {
  transform: translate(1.5cqw, 1.5cqh) !important;
  width: 100% !important;
  margin: 0 !important;
}

.dashboard-stage .dashboard-column-business .dashboard-column-heading {
  transform: translate(-1.5cqw, 1.5cqh) !important;
}

.dashboard-stage .dashboard-column-strategy .dashboard-column-gap,
.dashboard-stage .dashboard-column-business .dashboard-column-gap {
  flex: 0 0 3.5cqh !important;
  height: 3.5cqh !important;
}

.dashboard-stage .dashboard-column-strategy .dashboard-list-shell,
.dashboard-stage .dashboard-column-business .dashboard-list-shell {
  position: absolute !important;
  top: 20.2cqh;
  right: 2.4cqw;
  left: 2.4cqw;
  flex: none !important;
  width: auto;
  height: 59.8cqh !important;
  max-height: 59.8cqh !important;
  overflow: hidden !important;
  clip-path: inset(0 round 1.2cqw);
}

.dashboard-stage .dashboard-column-strategy .dashboard-list-shell {
  right: 0;
  left: 3.2cqw;
}

.dashboard-stage .dashboard-column-business .dashboard-list-shell {
  right: 3.2cqw;
  left: 0;
}

.dashboard-stage #strategy-tasks,
.dashboard-stage #business-tasks {
  align-items: center !important;
  height: 48.9cqh !important;
  gap: 1.1cqh !important;
  padding: 0 1.8cqw 0 !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain;
  scroll-snap-type: y proximity;
  scroll-behavior: smooth;
}

.dashboard-stage #strategy-tasks.has-more,
.dashboard-stage #business-tasks.has-more {
  mask-image: none !important;
  -webkit-mask-image: none !important;
}

.dashboard-stage #strategy-tasks.is-scrolled,
.dashboard-stage #business-tasks.is-scrolled {
  mask-image: linear-gradient(to bottom, transparent 0%, black 8%, black 100%) !important;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 8%, black 100%) !important;
}

.dashboard-stage #strategy-tasks article,
.dashboard-stage #business-tasks article {
  width: 27.4cqw !important;
  height: 11.4cqh !important;
  min-height: 11.4cqh !important;
  padding: .8cqh 5.25cqw .8cqh 4.35cqw !important;
  overflow: hidden !important;
  border-radius: 6.2cqw !important;
  scroll-snap-align: start;
}


.dashboard-stage #strategy-tasks article,
.dashboard-stage #business-tasks article,
.dashboard-stage #strategy-tasks article:hover,
.dashboard-stage #business-tasks article:hover,
.dashboard-stage #strategy-tasks article.is-card-hover,
.dashboard-stage #business-tasks article.is-card-hover {
  box-shadow: none !important;
}

.dashboard-stage #strategy-tasks article:hover .js-open-project-detail,
.dashboard-stage #business-tasks article:hover .js-open-project-detail,
.dashboard-stage #strategy-tasks article.is-card-hover .js-open-project-detail,
.dashboard-stage #business-tasks article.is-card-hover .js-open-project-detail {
  color: #10b981 !important;
  text-shadow: none !important;
}
.dashboard-stage #strategy-tasks article:first-child,
.dashboard-stage #business-tasks article:first-child {
  transform-origin: center top !important;
}

.dashboard-stage #strategy-tasks article:first-child:hover,
.dashboard-stage #business-tasks article:first-child:hover {
  transform: scale(1.02) !important;
  transform-origin: center top !important;
}

.dashboard-stage #strategy-tasks article > b,
.dashboard-stage #business-tasks article > b {
  top: 0 !important;
  left: 0 !important;
  width: 3.45cqw !important;
  height: 5cqh !important;
  transform: none !important;
  border: 0 !important;
  border-radius: 0 0 2.6cqw 0 !important;
  font-size: clamp(16px, 1.55cqw, 30px) !important;
  font-weight: 500 !important;
  box-shadow: 3px 4px 10px rgba(0, 49, 145, .18) !important;
}

.dashboard-stage #business-tasks article > b {
  box-shadow: 3px 4px 10px rgba(0, 105, 120, .18) !important;
}

.dashboard-stage #strategy-tasks article > div:last-child,
.dashboard-stage #business-tasks article > div:last-child {
  right: .6cqw;
  width: 4.05cqw !important;
  height: 4.05cqw !important;
}

.dashboard-stage #strategy-tasks article > div:last-child > div,
.dashboard-stage #business-tasks article > div:last-child > div {
  font-size: clamp(11px, 1.05cqw, 20px) !important;
}

.dashboard-stage #strategy-tasks article h3,
.dashboard-stage #business-tasks article h3 {
  margin-bottom: 2px !important;
  font-size: clamp(15px, 1.4cqw, 26px) !important;
  line-height: 1.08 !important;
}

.dashboard-stage #strategy-tasks article p,
.dashboard-stage #business-tasks article p {
  margin-bottom: 1px !important;
  font-size: clamp(12px, 1.12cqw, 21px) !important;
  line-height: 1.08 !important;
}

.dashboard-stage #strategy-more-indicator,
.dashboard-stage #business-more-indicator {
  bottom: 0 !important;
  z-index: 30 !important;
  min-height: 2.8cqh;
  padding: .35cqh 1cqw !important;
  cursor: pointer;
  font-size: clamp(13px, 1.12cqw, 21px) !important;
  pointer-events: none;
  user-select: none;
}

.dashboard-stage #strategy-more-indicator span,
.dashboard-stage #business-more-indicator span {
  font-size: inherit !important;
}

.dashboard-stage .dashboard-column-focus .dashboard-column-spacer {
  flex: 0 0 23.5cqh !important;
  height: 23.5cqh !important;
}

.dashboard-stage .dashboard-column-focus .dashboard-column-heading {
  flex: 0 0 6cqh !important;
  width: 78% !important;
  height: 6cqh !important;
  margin: 0 auto;
}

.dashboard-stage .dashboard-column-focus .dashboard-column-heading h2 {
  font-size: 35px !important;
  transform: translateY(-6px) !important;
  text-shadow: none !important;
  filter: none !important;
}

.dashboard-stage .dashboard-column-focus .dashboard-column-gap {
  flex: 0 0 1.1cqh !important;
  height: 1.1cqh !important;
}

.dashboard-stage .dashboard-column-focus .dashboard-list-shell {
  width: 78% !important;
  max-height: 34cqh !important;
  margin: 0 auto;
  padding-top: 1.1cqh !important;
  overflow: visible !important;
}

.dashboard-stage .dashboard-column-focus #routine-more-indicator {
  bottom: -4.2cqh !important;
}

.dashboard-stage #routine-list.center-routine-list {
  max-height: 34cqh !important;
  padding: 1cqh 1.1cqw 1.5cqh !important;
}

.dashboard-stage #routine-list.center-routine-list[data-visible-limit="6"] {
  height: var(--routine-visible-height) !important;
  max-height: var(--routine-visible-height) !important;
}

.dashboard-stage .center-routine-items {
  gap: 1.35cqh;
}

.dashboard-stage .center-routine-item {
  grid-template-columns: .7cqw minmax(0, 1fr);
  gap: .8cqw;
  font-size: clamp(15px, 1.4cqw, 26px);
}

.dashboard-stage .center-routine-bullet {
  width: .385cqw;
  height: .385cqw;
  box-shadow: 0 0 0 2.1px rgba(20, 94, 203, 0.09);
}

.dashboard-stage .dashboard-bottom-bar.bottom-focus-panel {
  position: absolute !important;
  top: auto;
  bottom: 7cqh;
  left: 50%;
  width: 34cqw !important;
  height: 16.5cqh !important;
  min-height: 0;
  padding: 1cqh 4.5cqw 2.4cqh !important;
  transform: translateX(-50%) !important;
}

.dashboard-stage .bottom-focus-panel .dashboard-bottom-inner {
  gap: .55cqh !important;
  justify-content: flex-start !important;
}

.dashboard-stage .bottom-focus-heading {
  gap: .7cqw;
  font-size: 35px !important;
}

.dashboard-stage .bottom-focus-heading svg {
  width: 2cqw;
  height: 2cqw;
}

.dashboard-stage #bottom-focus-list {
  gap: 3cqw !important;
  flex: 0 1 auto;
  min-height: 0;
}

.dashboard-stage .bottom-focus-item {
  max-width: 40cqw;
  font-size: clamp(20px, 2cqw, 38px) !important;
}

.dashboard-stage .bottom-focus-item > span:first-child {
  font-size: clamp(20px, 2cqw, 38px) !important;
}

.dashboard-stage .bottom-focus-item > span:last-child {
  max-width: 37cqw !important;
}

.dashboard-shell .dashboard-stage .bottom-focus-heading,
.dashboard-shell .dashboard-stage .bottom-focus-heading span,
.dashboard-shell .dashboard-stage .bottom-focus-item,
.dashboard-shell .dashboard-stage .bottom-focus-item > span:last-child {
  font-size: clamp(20px, 2cqw, 38px) !important;
}


/* dashboard-heading-size-35px */
.dashboard-shell .dashboard-stage .bottom-focus-heading,
.dashboard-shell .dashboard-stage .bottom-focus-heading span {
  font-size: 35px !important;

}

/* bottom-focus-summary-layout-v3 */
.dashboard-shell .dashboard-stage #bottom-focus-list {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow-x: auto;
  transform: translateY(0);
}

.dashboard-shell .dashboard-stage .bottom-focus-panel .dashboard-bottom-inner {
  justify-content: flex-start !important;
  padding-top: 0.5vh !important;
  gap: 0 !important;
}

.dashboard-shell .dashboard-stage .bottom-focus-item {
  display: flex;
  width: min(20cqw, 340px);
  min-width: min(18cqw, 280px);
  max-width: none;
  flex-direction: column;
  align-items: stretch;
  gap: .2cqh;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #25335e !important;
  text-align: left;
  text-shadow: none !important;
  cursor: pointer;
  transform: none;
  transition: transform .18s ease;
}

.dashboard-shell .dashboard-stage .bottom-focus-item:hover {
  color: #25335e !important;
  transform: translateY(-1px);
  background: transparent;
  box-shadow: none;
}

.dashboard-shell .dashboard-stage .bottom-focus-kicker {
  color: #1851b4;
  font-size: 35px !important;
  font-weight: 950;
  line-height: 1;
  letter-spacing: .04em;
  text-align: center;
}

.dashboard-shell .dashboard-stage .bottom-focus-project-name {
  overflow: hidden;
  color: #111111 !important;
  font-size: clamp(15px, 1.4cqw, 26px) !important;
  font-weight: 800 !important;
  line-height: 1.08 !important;
  letter-spacing: -.035em !important;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: color 0.18s ease;
}


.dashboard-shell .dashboard-stage .bottom-focus-item:hover .bottom-focus-project-name,
.dashboard-shell .dashboard-stage .bottom-focus-item.is-card-hover .bottom-focus-project-name {
  color: #111111 !important;
  text-shadow: none !important;
}

.dashboard-shell .dashboard-stage .bottom-focus-item,
.dashboard-shell .dashboard-stage .bottom-focus-item:hover,
.dashboard-shell .dashboard-stage .bottom-focus-item.is-card-hover {
  box-shadow: none !important;
}
.dashboard-shell .dashboard-stage .bottom-focus-project-period {
  color: #657295;
  font-size: 20px !important;
  font-weight: 800;
  line-height: 1.12;
  white-space: nowrap;
}

.bottom-focus-progress-row {
  display: grid;
  grid-template-columns: minmax(100px, 1fr) auto;
  align-items: center;
  gap: .55cqw;
  margin-top: .18cqh;
  color: #6c7592;
}

.dashboard-shell .dashboard-stage .bottom-focus-progress-row > span {
  font-size: clamp(10px, .66cqw, 12px) !important;
  font-weight: 850;
}

.dashboard-shell .dashboard-stage .bottom-focus-progress-row > strong {
  color: #d13b71;
  font-size: clamp(12px, .85cqw, 16px) !important;
  font-weight: 950;
}

.bottom-focus-progress-track {
  width: 100%;
  height: .82cqh;
  min-height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: #eadfeb;
}

.bottom-focus-progress-track span {
  display: block;
  width: var(--focus-progress);
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #7a4bc7, #d13b71);
}
/* bottom-focus-kicker-size-lock */
.dashboard-shell .dashboard-stage .bottom-focus-item > .bottom-focus-kicker:first-child {
  font-size: 35px !important;
  line-height: 1 !important;
  text-align: center !important;
}

/* dashboard-heading-icons-35 */
.dashboard-shell .dashboard-stage .dashboard-column-heading h2,
.dashboard-shell .dashboard-stage .bottom-focus-heading {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  font-size: 36px !important;
}

.dashboard-stage .dashboard-column-strategy .dashboard-column-heading h2,
.dashboard-stage .dashboard-column-business .dashboard-column-heading h2 {
  font-size: 45px !important;
}

.dashboard-heading-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  font-size: 0.9em;
  line-height: 1;
}

.dashboard-shell .dashboard-stage .bottom-focus-heading {
  width: 100%;
  flex: 0 0 auto;
  margin: 0 0 .55cqh;
  transform: translateY(-1.5vh);
  color: #1551bd;
  font-weight: 950;
  line-height: 1;
  letter-spacing: -0.045em;
  text-align: center;
  text-shadow: 0 2px 6px rgba(43, 93, 180, 0.13);
}

.dashboard-stage .focus-project-heading-text {
  color: #0a48bf !important;
  font-size: 42px !important;
  -webkit-text-fill-color: #0a48bf !important;
  -webkit-text-stroke: 2px #ffffff;
  paint-order: stroke fill;
  text-shadow: none !important;
}

.dashboard-shell .dashboard-stage .bottom-focus-panel .dashboard-bottom-inner {
  justify-content: flex-start !important;
  gap: .35cqh !important;
}

.dashboard-shell .dashboard-stage #bottom-focus-list {
  flex: 1 1 auto !important;
  height: auto !important;
  align-items: flex-start !important;
}

.ellipsis-hover-tooltip {
  position: fixed;
  z-index: 9999;
  display: none;
  width: max-content;
  max-width: min(520px, calc(100vw - 32px));
  padding: 10px 14px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  background: rgba(15, 35, 60, 0.95);
  color: #ffffff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
  font-size: 18px;
  font-weight: 500;
  line-height: 1.45;
  letter-spacing: -0.025em;
  overflow-wrap: anywhere;
  pointer-events: none;
}

.ellipsis-hover-tooltip.is-visible {
  display: block;
}
.project-detail-popup-notice {
  position: fixed;
  top: 72px;
  left: 50%;
  z-index: 10000;
  max-width: min(620px, calc(100vw - 32px));
  padding: 12px 18px;
  border: 1px solid rgba(254, 202, 202, 0.95);
  border-radius: 10px;
  background: rgba(127, 29, 29, 0.96);
  color: #ffffff;
  box-shadow: 0 12px 32px rgba(69, 10, 10, 0.3);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.45;
  text-align: center;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -12px);
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.project-detail-popup-notice.is-visible {
  opacity: 1;
  transform: translate(-50%, 0);
}
/* routine-overview-label */
.dashboard-stage .routine-overview-label {
  position: absolute;
  top: 4cqh;
  bottom: auto;
  left: 50%;
  z-index: 26;
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(36cqw, 620px);
  max-width: 620px;
  transform: translateX(-50%);
  color: #173f92;
  font-size: 32px;
  font-weight: 550;
  line-height: 1;
  letter-spacing: -0.035em;
  text-align: center;
  text-shadow: 0 2px 5px rgba(52, 88, 158, 0.13);
  pointer-events: none;
  user-select: none;
}

.dashboard-stage .routine-overview-text {
  flex: 0 0 auto;
  padding: 0 .8cqw;
  white-space: nowrap;
}

.dashboard-stage .routine-overview-line {
  flex: 1 1 70px;
  height: 2px;
  min-width: 42px;
  border-radius: 999px;
}

.dashboard-stage .routine-overview-line-left {
  background: linear-gradient(90deg, rgba(105, 148, 244, 0), rgba(86, 134, 240, 0.52));
}

.dashboard-stage .routine-overview-line-right {
  background: linear-gradient(90deg, rgba(36, 184, 190, 0.54), rgba(36, 184, 190, 0));
}

.dashboard-stage .routine-overview-dot {
  width: 9px;
  height: 9px;
  flex: 0 0 9px;
  border-radius: 50%;
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.78), 0 2px 5px rgba(50, 92, 160, 0.18);
}

.dashboard-stage .routine-overview-dot-blue {
  background: #1f63dc;
}

.dashboard-stage .routine-overview-dot-teal {
  background: #16a7b3;
}
/* dashboard-column-heading-size-28-shadowless */
.dashboard-shell .dashboard-stage .dashboard-column-strategy .dashboard-column-heading h2,
.dashboard-shell .dashboard-stage .dashboard-column-business .dashboard-column-heading h2 {
  font-size: 45px !important;
  text-shadow: none !important;
  filter: none !important;
}

.dashboard-shell .dashboard-stage .dashboard-column-focus .dashboard-column-heading h2 {
  font-size: 40px !important;
  text-shadow: none !important;
  filter: none !important;
}
/* dashboard circular scroll controls */
#routine-more-indicator.dashboard-scroll-control,
#strategy-more-indicator.dashboard-scroll-control,
#business-more-indicator.dashboard-scroll-control {
  position: absolute !important;
  top: auto !important;
  bottom: clamp(10px, 1.5vh, 20px) !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: max-content !important;
  height: clamp(32px, 2.5cqw, 42px) !important;
  min-height: 0 !important;
  padding: 0 10px 0 14px !important;
  gap: 2px !important;
  white-space: nowrap !important;
  border: 1.5px solid rgba(148, 163, 184, .5) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .98) !important;
  box-shadow: 0 4px 12px rgba(100, 116, 139, .1) !important;
  color: #64748b !important;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  user-select: none;
  appearance: none;
  z-index: 46 !important;
  transition: opacity .18s ease, transform .18s ease, box-shadow .18s ease, background .18s ease;
}

#routine-more-indicator.dashboard-scroll-control {
  bottom: clamp(0px, 0.5vh, 8px) !important;
}

#routine-more-indicator.dashboard-scroll-control[aria-hidden="false"],
#strategy-more-indicator.dashboard-scroll-control[aria-hidden="false"],
#business-more-indicator.dashboard-scroll-control[aria-hidden="false"] {
  opacity: 1 !important;
}

#routine-more-indicator.dashboard-scroll-control:hover,
#strategy-more-indicator.dashboard-scroll-control:hover,
#business-more-indicator.dashboard-scroll-control:hover,
#routine-more-indicator.dashboard-scroll-control:focus-visible,
#strategy-more-indicator.dashboard-scroll-control:focus-visible,
#business-more-indicator.dashboard-scroll-control:focus-visible {
  transform: translateX(-50%) scale(1.05) !important;
  background: #f8fafc !important;
  border-color: rgba(148, 163, 184, .8) !important;
  box-shadow: 0 6px 16px rgba(100, 116, 139, .2) !important;
  outline: none;
}

/* SVG Icon styling */
.dashboard-scroll-control svg {
  transition: transform 0.3s ease;
  width: 18px !important;
  height: 18px !important;
  flex-shrink: 0;
}

.dashboard-scroll-control.is-at-bottom svg {
  transform: rotate(180deg);
}

.dashboard-scroll-count {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
/* dashboard circular scroll controls end */

/* Issue #707: 통합시스템 메인 카드와 프로젝트명·설명 타이포만 통일한다. */
.dashboard-stage #strategy-tasks article h3.wd-page__project-title,
.dashboard-stage #business-tasks article h3.wd-page__project-title {
  font-family: var(--wd-font-sans) !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1.12 !important;
  letter-spacing: 0 !important;
}

#strategy-tasks .bp-project-card-meta:not(.wd-page__project-meta) .bp-project-card-meta-text,
#business-tasks .bp-project-card-meta:not(.wd-page__project-meta) .bp-project-card-meta-text {
  font-family: var(--wd-font-sans) !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
}

/* strategy heading and cards alignment */
.dashboard-shell .dashboard-stage .dashboard-column-strategy .dashboard-column-heading {
  transform: translate(2cqw, 1.5cqh) !important;
}

.dashboard-shell .dashboard-stage .dashboard-column-strategy .dashboard-list-shell {
  transform: translateX(0.5cqw) !important;
}

.dashboard-scroll-count {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
/* dashboard circular scroll controls end */
