:root {
      --bg: #f7f6f3;
      --surface: #ffffff;
      --border: #e8e6e0;
      --text: #2d2d2d;
      --muted: #9b9790;
      --accent: #95cbd8;
      --status-inprogress-bg: #eaf4f3;
      --status-inprogress-text: #5ba3a0;
      --status-inprogress-border: #b8dcdf;
      --mom: #e07b7b;
      --dad: #a0cece;
      --child1: #f5d87a;
      --child2: #f2c4cf;
      --child3: #a8d4e8;
      --tag-radius: 6px;
      --radius: 12px;
      --shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
      /* 헤더 로고 높이 (가로는 비율에 맞게 자동) */
      --app-logo-height: 36px;
    }

    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      -webkit-tap-highlight-color: transparent;
    }

    body {
      background: var(--bg);
      color: var(--text);
      font-family: 'Noto Sans KR', sans-serif;
      font-weight: 400;
      min-height: 100vh;
      padding-bottom: 80px;
      max-width: 430px;
      margin: 0 auto;
    }

    /* Header */
    .header {
      background: var(--surface);
      padding: 14px 20px 0;
      position: sticky;
      top: 0;
      z-index: 100;
    }

    .header-top {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 8px;
    }

    .header-top .app-logo {
      height: var(--app-logo-height);
      width: auto;
      object-fit: contain;
      display: block;
    }

    .header-title {
      font-size: 18px;
      font-weight: 700;
      color: var(--text);
    }

    .header-date {
      font-size: 13px;
      color: var(--muted);
    }

    .header-menu-btn {
      background: none;
      border: none;
      padding: 8px;
      margin: -4px -8px -4px 0;
      cursor: pointer;
      line-height: 0;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .header-hamburger {
      display: flex;
      flex-direction: column;
      gap: 4px;
    }

    .header-hamburger span {
      display: block;
      width: 18px;
      height: 1.5px;
      background: #888;
      border-radius: 2px;
    }

    .today-badge {
      background: var(--accent);
      color: white;
      font-size: 11px;
      font-weight: 500;
      padding: 3px 8px;
      border-radius: 20px;
    }

    /* Member Tabs (+ 우측 고정) */
    .member-tabs-host {
      margin: 0 -20px;
      box-sizing: border-box;
    }

    .member-tabs-row {
      display: flex;
      align-items: center;
      padding: 0 16px 0 20px;
      border-bottom: 0.5px solid #eee;
      box-sizing: border-box;
    }

    .member-tabs-scroll {
      display: flex;
      align-items: flex-end;
      gap: 2px;
      flex: 1;
      min-width: 0;
      overflow-x: auto;
      scrollbar-width: none;
      -webkit-overflow-scrolling: touch;
    }

    .member-tabs-scroll::-webkit-scrollbar {
      display: none;
    }

    /* 구성원 1명: 빈 스크롤 영역이 flex로 늘어나 + 버튼을 다중 구성원 때와 같이 우측 정렬 */
    .member-tabs-scroll.member-tabs-scroll--solo {
      overflow: hidden;
      overflow-x: hidden;
      pointer-events: none;
      gap: 0;
    }

    .member-tabs-fixed {
      flex-shrink: 0;
      display: flex;
      align-items: flex-end;
      margin-right: 2px;
    }

    .member-tabs-scroll--members {
      flex: 1;
      min-width: 0;
    }

    /* 구성원 많을 때는 탭 폭을 조금 줄여 5명 가시성 확보 */
    .member-tabs-scroll--members .member-tab {
      padding: 6px 10px 8px;
    }

    .member-tabs-scroll--members .member-tab .tab-avatar {
      width: 32px;
      height: 32px;
    }

    .member-tabs-scroll--members .member-tab .tab-name {
      max-width: 3.6em;
    }

    .member-tabs-controls-left,
    .member-tabs-controls-right {
      flex-shrink: 0;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: flex-start;
      margin-left: 2px;
      gap: 4px;
      min-height: 50px;
    }

    .member-tabs-nav {
      flex-shrink: 0;
      width: 16px;
      height: 16px;
      margin: 0;
      border: 1px solid #d8d8d8;
      border-radius: 5px;
      background: #fff;
      color: #9aa0a6;
      font-size: 11px;
      line-height: 1;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      padding: 0;
      user-select: none;
    }

    .member-tabs-add {
      flex-shrink: 0;
      margin-left: 0;
      margin-bottom: 0;
      width: 18px;
      height: 18px;
      border-radius: 5px;
      border: 1px solid #ccc;
      background: transparent;
      font-size: 13px;
      line-height: 1;
      color: #888;
      cursor: pointer;
      padding: 0 0 1px 0;
      font-family: 'Noto Sans KR', sans-serif;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .member-tab {
      flex-shrink: 0;
      padding: 6px 12px 8px;
      border: none;
      border-bottom: 2.5px solid transparent;
      background: none;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 12px;
      color: var(--muted);
      cursor: pointer;
      transition: all 0.15s;
      white-space: nowrap;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 2px;
      margin-bottom: -1px;
    }

    .member-tab .tab-avatar {
      width: 34px;
      height: 34px;
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 22px;
      overflow: hidden;
      background: var(--border);
      transition: all 0.15s;
    }

    .member-tab .tab-avatar img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .member-tab .tab-name {
      font-size: 10px;
      font-weight: 500;
      display: block;
      max-width: 4em;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
    }

    .member-tab.active {
      color: var(--text);
      border-bottom-color: var(--accent);
    }

    .member-tab.active .tab-avatar {
      opacity: 1;
    }

    .member-tab:not(.active) .tab-avatar {
      opacity: 0.5;
    }

    .member-tab[data-member="전체"].active {
      border-bottom-color: var(--text);
      color: var(--text);
    }

    .member-tab[data-member="전체"].active .tab-avatar {
      background: var(--text);
    }

    /* Main Content */
    .content {
      padding: 20px 16px;
    }

    /* Section */
    .section {
      margin-bottom: 24px;
    }

    .section-header {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 10px;
    }

    .section-title {
      font-size: 13px;
      font-weight: 700;
      color: var(--muted);
      letter-spacing: 0.5px;
      text-transform: uppercase;
    }

    .section-count {
      background: var(--border);
      color: var(--muted);
      font-size: 11px;
      padding: 1px 7px;
      border-radius: 10px;
    }

    /* Task Card */
    .task-card {
      background: var(--surface);
      border-radius: var(--radius);
      border: 1px solid var(--border);
      padding: 14px 16px;
      margin-bottom: 8px;
      display: flex;
      align-items: flex-start;
      gap: 12px;
      box-shadow: var(--shadow);
      transition: opacity 0.2s;
    }

    .task-checkbox {
      width: 20px;
      height: 20px;
      border-radius: 6px;
      border: 1.5px solid var(--border);
      background: none;
      cursor: pointer;
      flex-shrink: 0;
      margin-top: 1px;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all 0.15s;
    }

    /* 그리드 첫 줄에서 이름 태그·체크·제목만 한 축으로 맞춤 */
    .list-task-grid-row .task-checkbox {
      margin-top: 0;
    }

    .task-checkbox.checked {
      background: var(--accent);
      border-color: var(--accent);
    }

    .task-checkbox.checked::after {
      content: '✓';
      color: white;
      font-size: 12px;
      font-weight: 700;
    }

    .task-checkbox.checked.task-check-fade-in::after {
      animation: taskCheckFadeIn 150ms ease-out;
    }

    .task-checkbox.task-check-pop {
      animation: taskCheckPop 220ms cubic-bezier(0.22, 0.9, 0.32, 1.2);
      transform-origin: center;
    }

    /* 홈「오늘」카드 — 프로젝트 태스크 줄: 트리 + 체크 (이번 주·달보다 여유 있게) */
    .home-today-project-task {
      padding: 3px 10px;
      min-height: 34px;
      box-sizing: border-box;
    }

    .proj-card .home-today-project-task .proj-tree-gutter {
      min-height: 20px;
    }

    /* 홈「이번 주」「이번 달」— 프로젝트 태스크 줄 (체크 없음 → 트리 직후 번호·제목) */
    .home-period-project-task {
      box-sizing: border-box;
      padding: 3px 10px;
      min-height: 30px;
    }

    .proj-card .home-period-project-task .proj-tree-gutter {
      min-height: 18px;
    }

    /* 프로젝트 섹션 — 구성원별 묶음 + 트리 연결선(홈·캘린더 공통) */
    .proj-mem-group {
      display: flex;
      align-items: flex-start;
      gap: 8px;
      margin-bottom: 10px;
    }

    /* 홈 기간 카드·캘린더 일간: 단발/루틴/학사 행은 박스 안 좌 10px — 프로젝트 묶음만 맞춤 */
    #homeContentBody .proj-mem-group,
    #calDetail .proj-mem-group {
      padding-left: 10px;
      box-sizing: border-box;
    }

    .proj-mem-group:last-child {
      margin-bottom: 0;
    }

    .proj-mem-group--single .proj-mem-group__stack {
      width: 100%;
    }

    .proj-mem-group__badge {
      flex-shrink: 0;
      padding-top: 4px;
    }

    .proj-mem-group__stack {
      flex: 1;
      min-width: 0;
    }

    /* 홈 이번 주/달 프로젝트: 같은 구성원 프로젝트를 한 박스 안에 묶음 */
    .proj-mem-group__stack--boxed {
      background: var(--bg);
      border: 1px solid var(--border);
      border-radius: 10px;
      overflow: hidden;
    }

    .proj-mem-group__stack--boxed > .proj-card.home-period-proj-compact {
      background: transparent;
      border: none;
      border-radius: 0;
      margin-bottom: 0;
      overflow: visible;
    }

    .proj-mem-group__stack--boxed > .proj-card.home-period-proj-compact + .proj-card.home-period-proj-compact {
      border-top: 1px solid var(--border);
    }

    .proj-card {
      background: var(--bg);
      border-radius: 10px;
      border: 1px solid var(--border);
      margin-bottom: 4px;
      overflow: hidden;
    }

    .proj-mem-group__stack > .proj-card:last-child {
      margin-bottom: 0;
    }

    /* 홈 이번 주·달: 제목+·N건 한 줄만 — head 아래 구분선 없음 */
    .home-period-proj-compact .home-period-proj-compact__head {
      border-bottom: none;
    }

    .proj-card__head {
      display: flex;
      align-items: center;
      gap: 5px;
      padding: 9px 10px;
      border-bottom: 1px solid var(--border);
      min-width: 0;
      box-sizing: border-box;
    }

    .proj-card__head-main {
      display: flex;
      align-items: center;
      flex: 1;
      min-width: 0;
      gap: 6px;
    }

    .proj-tree-gutter {
      width: 20px;
      flex-shrink: 0;
      position: relative;
      align-self: stretch;
      min-height: 22px;
      box-sizing: border-box;
    }

    .proj-tree-gutter--task .proj-tree-gutter__v {
      position: absolute;
      left: 9px;
      top: 0;
      bottom: 0;
      width: 1px;
      background: #d0d0d0;
    }

    .proj-tree-gutter--task.proj-tree-gutter--last .proj-tree-gutter__v {
      bottom: 50%;
    }

    .proj-tree-gutter--task .proj-tree-gutter__h {
      position: absolute;
      left: 9px;
      top: 50%;
      width: 10px;
      height: 1px;
      background: #d0d0d0;
      transform: translateY(-50%);
    }

    .proj-card .home-today-project-task,
    .proj-card .home-period-project-task,
    .cal-project-task-row {
      border-bottom: none;
      box-sizing: border-box;
    }

    .home-today-project-checkbox.task-checkbox {
      background: #fff;
      border-color: #c5c2bc;
      margin-top: 0;
    }

    .home-today-project-checkbox.task-checkbox.checked {
      background: var(--accent);
      border-color: var(--accent);
    }

    .task-row-complete-flash {
      animation: taskRowCompleteFlash 320ms ease-out;
    }

    @keyframes taskCheckPop {
      0% {
        transform: scale(1);
      }

      45% {
        transform: scale(1.18);
      }

      75% {
        transform: scale(0.96);
      }

      100% {
        transform: scale(1);
      }
    }

    @keyframes taskCheckFadeIn {
      0% {
        opacity: 0;
        transform: scale(0.82);
      }

      100% {
        opacity: 1;
        transform: scale(1);
      }
    }

    @keyframes taskRowCompleteFlash {
      0% {
        background: rgba(149, 203, 216, 0.28);
      }

      100% {
        background: transparent;
      }
    }


    .task-body {
      flex: 1;
      min-width: 0;
    }

    .task-top {
      display: flex;
      align-items: center;
      gap: 6px;
      margin-bottom: 4px;
      flex-wrap: wrap;
    }

    .member-tag {
      font-size: 11px;
      font-weight: 500;
      line-height: 1.25;
      padding: 2px 7px;
      border-radius: var(--tag-radius);
      color: white;
      flex-shrink: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }

    /* 홈·캘린더 리스트: 한 글자 뱃지 높이를 제목 첫 줄(약 13px)과 맞춤 */
    .member-tag--short {
      box-sizing: border-box;
      height: 20px;
      min-width: 20px;
      padding: 0 6px;
      line-height: 1;
    }

    .tag-mom {
      background: var(--mom);
    }

    .tag-dad {
      background: var(--dad);
    }

    .tag-child1 {
      background: var(--child1);
    }

    .tag-child2 {
      background: var(--child2);
    }

    .tag-child3 {
      background: var(--child3);
    }

    .task-title {
      font-size: 15px;
      font-weight: 500;
      color: var(--text);
      line-height: 1.3;
    }

    .task-card.done .task-title {
      text-decoration: line-through;
    }


    .task-meta {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-top: 4px;
      flex-wrap: wrap;
    }

    .task-time {
      font-size: 12px;
      color: var(--muted);
    }

    .task-duration {
      font-size: 12px;
      color: var(--muted);
      background: var(--bg);
      padding: 1px 7px;
      border-radius: 4px;
    }

    .highlight-star {
      color: #f0c040;
      font-size: 14px;
    }

    /* Schedule List (이번 주/이번 달) */
    .schedule-list {
      background: var(--surface);
      border-radius: var(--radius);
      border: 1px solid var(--border);
      overflow: hidden;
    }

    .schedule-row {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 9px 14px;
      border-bottom: 1px solid var(--border);
      font-size: 12px;
    }

    .schedule-row:last-child {
      border-bottom: none;
    }

    .schedule-day {
      color: var(--muted);
      font-size: 11px;
      width: 54px;
      flex-shrink: 0;
      white-space: nowrap;
    }

    .schedule-title {
      flex: 1;
      color: var(--text);
      font-size: 12px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      min-width: 0;
    }

    .badge {
      font-size: 11px;
      font-weight: 500;
      padding: 1px 7px;
      border-radius: 10px;
      flex-shrink: 0;
    }

    .badge-exam {
      background: #fff8f8;
      color: #e18489;
      border: 1px solid #e18489;
      font-size: 9px;
      padding: 0px 4px;
    }

    .badge-mock {
      background: #e8f0fe;
      color: #1a56db;
    }

    .badge-event {
      background: #f0f0f0;
      color: var(--muted);
    }

    /* 학사일정 시험 말머리(TEST) — 학교 칩과 동일 글자 크기·컴팩트 */
    .exam-mark {
      display: inline-flex;
      align-items: center;
      gap: 0;
      flex-shrink: 0;
      margin-right: 2px;
      font-size: 9px;
      font-weight: 700;
      line-height: 1.2;
      color: #e18489;
      background: #fff8f8;
      border: 1px solid #e18489;
      border-radius: 6px;
      padding: 0px 3px;
      vertical-align: middle;
      font-family: 'Noto Sans KR', sans-serif;
      letter-spacing: 0.02em;
    }

    .exam-mark-icon {
      line-height: 1;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 8px;
      height: 8px;
      transform: translateY(-0.2px);
    }

    .exam-mark-icon svg {
      width: 8px;
      height: 8px;
      display: block;
    }

    .exam-dday-wrap {
      margin-left: auto;
      display: inline-flex;
      align-items: baseline;
      gap: 3px;
      flex-shrink: 0;
    }

    /* 홈 오늘/주·달·캘린더 일간: 카테고리·구글·시험 D-day를 행 오른쪽에 묶음 */
    .schedule-meta-end {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      flex-shrink: 0;
      margin-left: auto;
    }

    .schedule-meta-end .exam-dday-wrap {
      margin-left: 0;
    }

    .exam-dday-label {
      font-size: 10px;
      font-weight: 400;
      color: #d86c73;
      line-height: 1.15;
      letter-spacing: 0.01em;
    }

    .exam-dday {
      flex-shrink: 0;
      font-size: 13px;
      font-weight: 700;
      color: #d86c73;
      line-height: 1.2;
    }

    /* Empty State */
    .empty {
      text-align: center;
      padding: 30px 0;
      color: var(--muted);
      font-size: 14px;
    }

    .empty-state-img-wrap {
      text-align: center;
      padding: 8px 12px 12px;
    }

    .empty-state-img {
      display: block;
      margin: 0 auto;
      max-width: min(120px, 42%);
      height: auto;
      object-fit: contain;
    }

    /* Bottom Nav */
    .bottom-nav {
      position: fixed;
      bottom: 0;
      left: 50%;
      transform: translateX(-50%);
      width: 100%;
      max-width: 430px;
      background: var(--surface);
      border-top: 1px solid var(--border);
      display: flex;
      z-index: 100;
    }

    .nav-btn {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 10px 0;
      background: none;
      border: none;
      cursor: pointer;
      gap: 3px;
      color: #595959;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 10px;
      transition: color 0.15s;
    }

    .nav-btn.active {
      color: var(--accent);
    }

    .nav-btn .nav-icon {
      font-size: 20px;
      line-height: 1;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .nav-btn .nav-icon-svg {
      width: 22px;
      height: 22px;
      display: block;
      flex-shrink: 0;
    }

    .nav-btn.add-btn {
      color: white;
    }

    .nav-btn.add-btn .nav-icon {
      background: var(--accent);
      width: 44px;
      height: 44px;
      border-radius: 14px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 22px;
      margin-top: -10px;
      box-shadow: 0 4px 12px rgba(149, 203, 216, 0.4);
    }

    .nav-btn.add-btn .nav-icon-svg--plus {
      width: 26px;
      height: 26px;
    }

    /* Loading */
    .loading {
      text-align: center;
      padding: 40px 0;
      color: var(--muted);
      font-size: 14px;
    }

    /* 일정 등록 화면 */
    .add-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 16px 20px;
      background: var(--surface);
      border-bottom: 1px solid var(--border);
      position: sticky;
      top: 0;
      z-index: 100;
    }

    .back-btn {
      background: none;
      border: none;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 14px;
      color: var(--muted);
      cursor: pointer;
      padding: 4px 0;
    }

    .add-title {
      font-size: 16px;
      font-weight: 700;
      color: var(--text);
    }

    .save-btn {
      background: var(--accent);
      color: white;
      border: none;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 14px;
      font-weight: 500;
      padding: 7px 16px;
      border-radius: 8px;
      cursor: pointer;
    }

    .add-body {
      padding: 20px 16px;
    }

    .add-bottom-bar {
      display: flex;
      align-items: center;
      margin-top: 24px;
      padding-top: 16px;
      border-top: 1px solid var(--border);
    }

    .add-bottom-bar__spacer {
      flex: 1;
      min-width: 0;
    }

    .form-group {
      margin-bottom: 20px;
    }

    .form-label {
      display: block;
      font-size: 12px;
      font-weight: 700;
      color: var(--muted);
      letter-spacing: 0.5px;
      margin-bottom: 8px;
      text-transform: uppercase;
    }

    .form-label--with-meta {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      flex-wrap: wrap;
    }

    .form-label--with-meta .form-label-text {
      text-transform: uppercase;
      letter-spacing: 0.5px;
    }

    /* 홈 상단 공지 D-day 박스(.top-notice-dday-box) 배경색과 동일 톤 */
    .form-label-star {
      display: inline-block;
      margin-left: 4px;
      font-size: 17px;
      font-weight: 800;
      line-height: 1;
      color: #e85b63;
      vertical-align: -0.12em;
      text-transform: none;
      letter-spacing: 0;
    }

    .form-label--title-line {
      align-items: center;
    }

    .form-label--title-line .form-label-text {
      margin: 0;
      cursor: pointer;
    }

    .form-label-title-actions {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-shrink: 0;
    }

    /* 제목 줄 우측: 일정등록 알림 체크와 동일 톤의 소형 체크 */
    .form-highlight-inline {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      cursor: pointer;
      user-select: none;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 12px;
      font-weight: 600;
      color: var(--text);
      -webkit-tap-highlight-color: transparent;
    }

    .form-highlight-inline__check {
      position: relative;
      width: 16px;
      height: 16px;
      flex-shrink: 0;
    }

    .form-highlight-inline__input {
      position: absolute;
      left: 0;
      top: 0;
      width: 18px;
      height: 18px;
      margin: 0;
      opacity: 0;
      cursor: pointer;
      z-index: 1;
    }

    .form-highlight-inline__ui {
      position: absolute;
      left: 0;
      top: 0;
      width: 16px;
      height: 16px;
      border: 1.5px solid #ccc;
      border-radius: 3px;
      box-sizing: border-box;
      pointer-events: none;
    }

    .form-highlight-inline__input:checked + .form-highlight-inline__ui {
      background: #5ba3a0;
      border-color: #5ba3a0;
    }

    .form-highlight-inline__input:checked + .form-highlight-inline__ui::after {
      content: '';
      display: block;
      width: 4px;
      height: 7px;
      border: solid #fff;
      border-width: 0 1.5px 1.5px 0;
      transform: rotate(45deg);
      margin: 1px auto 0;
    }

    .form-highlight-inline__input:focus-visible + .form-highlight-inline__ui {
      outline: 2px solid #5ba3a0;
      outline-offset: 1px;
    }

    .form-highlight-inline__text {
      font-weight: 600;
      letter-spacing: 0;
      text-transform: none;
    }

    .form-input {
      width: 100%;
      padding: 11px 14px;
      border: 1.5px solid var(--border);
      border-radius: var(--radius);
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 14px;
      color: var(--text);
      background: var(--surface);
      outline: none;
      transition: border-color 0.15s;
      box-sizing: border-box;
    }

    .form-input:focus {
      border-color: var(--accent);
    }

    textarea.form-input {
      resize: none;
      line-height: 1.6;
    }

    .row-2 {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .row-2 input[type="date"] {
      flex: 1;
      min-width: 140px;
      max-width: 180px;
    }

    .row-2 .time-select-wrap {
      flex-shrink: 0;
    }


    /* 담당자 선택 */
    .member-select {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }

    .member-select--dot {
      gap: 10px 16px;
      align-items: center;
    }

    .member-chip {
      padding: 7px 14px;
      border-radius: 20px;
      border: 1.5px solid var(--border);
      background: none;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 13px;
      color: var(--muted);
      cursor: pointer;
      transition: all 0.15s;
    }

    .member-chip.selected {
      color: white;
      border-color: transparent;
    }

    .member-chip.sel-mom {
      background: var(--mom);
    }

    .member-chip.sel-dad {
      background: var(--dad);
    }

    .member-chip.sel-child1 {
      background: var(--child1);
    }

    .member-chip.sel-child2 {
      background: var(--child2);
    }

    .member-chip.sel-child3 {
      background: var(--child3);
    }

    /* 일정·프로젝트 등록: 담당자 = 색 점 + 텍스트 */
    #memberSelect .member-chip.member-chip--dot,
    #apMemberSelect .member-chip.member-chip--dot {
      padding: 4px 2px;
      border-radius: 8px;
      border: 1.5px solid transparent;
      background: transparent;
      color: #555;
      font-weight: 500;
      display: inline-flex;
      align-items: center;
      gap: 6px;
    }

    #memberSelect .member-chip.member-chip--dot .member-chip-dot,
    #apMemberSelect .member-chip.member-chip--dot .member-chip-dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      flex-shrink: 0;
      background: var(--member-dot, var(--accent));
    }

    #memberSelect .member-chip.member-chip--dot .member-chip-label,
    #apMemberSelect .member-chip.member-chip--dot .member-chip-label {
      color: inherit;
    }

    #memberSelect .member-chip.member-chip--dot:not(.selected),
    #apMemberSelect .member-chip.member-chip--dot:not(.selected) {
      opacity: 1;
    }

    #memberSelect .member-chip.member-chip--dot.selected,
    #apMemberSelect .member-chip.member-chip--dot.selected {
      opacity: 1;
      color: var(--text);
      font-weight: 700;
      background: rgba(0, 0, 0, 0.04);
    }

    /* 카테고리 선택 */
    .category-select {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }

    .category-chip {
      padding: 7px 14px;
      border-radius: 20px;
      border: 1.5px solid var(--border);
      background: white;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 13px;
      color: var(--muted);
      cursor: pointer;
      transition: all 0.15s;
    }

    .category-chip.selected {
      background: var(--accent);
      color: white;
      border-color: var(--accent);
    }

    /* 일정 등록: 카테고리 칩·추가 버튼만 컴팩트 (루틴 반복 칩 등은 기존 .category-chip 유지) */
    #categorySelect {
      gap: 5px;
    }

    #categorySelect .category-chip {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 4px 10px;
      border-radius: 14px;
      border-width: 1px;
      font-size: 12px;
    }

    #categorySelect .category-chip-dot {
      width: 12px;
      height: 12px;
      border-radius: 50%;
      flex-shrink: 0;
      border: 1px solid rgba(0, 0, 0, 0.08);
      box-sizing: border-box;
    }

    #categorySelect .category-chip.selected .category-chip-dot {
      border-color: rgba(255, 255, 255, 0.55);
      box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.35);
    }

    #categorySelect .category-chip-label {
      min-width: 0;
    }

    .category-add-circle {
      flex-shrink: 0;
      width: 36px;
      height: 36px;
      border-radius: 50%;
      border: 1.5px solid var(--border);
      background: #fff;
      color: var(--muted);
      font-size: 20px;
      font-weight: 500;
      line-height: 1;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: border-color 0.15s, color 0.15s, background 0.15s, box-shadow 0.15s;
      padding: 0;
      font-family: 'Noto Sans KR', sans-serif;
    }

    #categorySelect .category-add-circle {
      width: 30px;
      height: 30px;
      font-size: 17px;
      border-width: 1px;
    }

    .category-add-circle:hover {
      border-color: var(--accent);
      color: var(--accent);
      background: #fafcfd;
      box-shadow: 0 1px 3px rgba(149, 203, 216, 0.25);
    }

    .category-add-circle:active {
      transform: scale(0.96);
    }

    .category-add-panel {
      margin-top: 10px;
      border: 1px solid #d7e8ec;
      background: #f7fcfd;
      border-radius: 10px;
      padding: 10px;
    }

    .form-group:has(#categorySelect) .form-label {
      font-size: 11px;
      margin-bottom: 5px;
      letter-spacing: 0.35px;
    }

    .form-group:has(#categorySelect) .category-add-panel {
      margin-top: 6px;
      padding: 8px;
      border-radius: 8px;
      border-color: #cfe3e8;
    }

    .category-add-panel__row {
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .form-group:has(#categorySelect) .category-add-panel__row {
      gap: 6px;
      margin-bottom: 12px;
    }

    .category-add-panel__input {
      height: 36px;
      padding: 8px 12px;
      font-size: 13px;
      border-color: #d7e8ec;
      background: #fff;
    }

    .form-group:has(#categorySelect) .category-add-panel__input {
      height: 32px;
      padding: 6px 10px;
      font-size: 12px;
      border-radius: 8px;
      border-width: 1px;
    }

    .category-add-panel__save {
      height: 36px;
      border: none;
      border-radius: 9px;
      background: var(--accent);
      color: #fff;
      font-size: 13px;
      font-weight: 700;
      padding: 0 14px;
      cursor: pointer;
      white-space: nowrap;
      flex-shrink: 0;
    }

    .form-group:has(#categorySelect) .category-add-panel__save {
      height: 32px;
      font-size: 12px;
      padding: 0 11px;
      border-radius: 8px;
    }

    .category-add-panel__palette {
      margin-top: 4px;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
    }

    .category-add-panel__palette .cat-color-palette-root {
      width: max-content;
      max-width: 100%;
    }

    #addCategoryInlinePanel .add-cat-preset-row {
      position: relative;
    }

    /* 토글 */
    .toggle-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    .toggle-row--soft {
      border: 1px solid #efede8;
      border-radius: 10px;
      background: #fff;
      padding: 8px 10px;
    }

    .toggle-label {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 14px;
      color: var(--text);
    }

    .toggle-label-icon {
      width: 24px;
      height: 24px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      color: #8e8981;
    }

    .toggle-label-icon svg {
      width: 24px;
      height: 24px;
      display: block;
    }

    .toggle-label-icon--important {
      color: #8e8981;
    }

    .toggle-label-icon--routine {
      color: #8e8981;
    }

    /* 루틴 일정 제목 옆 반복 아이콘 (작고 흐리게) */
    .routine-inline-icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      color: #6a6a6a;
      opacity: 0.72;
      vertical-align: middle;
    }

    .routine-inline-icon svg {
      width: 10px;
      height: 10px;
      display: block;
    }

    .toggle-label-icon--alarm {
      color: #8e8981;
    }

    /* 일정 추가 폼: 루틴 상세 (토글 on 시) — 카테고리 칩 박스와 유사한 밀도 */
    .routine-options-panel {
      display: none;
      margin-top: 8px;
      margin-bottom: 20px;
      padding: 8px 12px 10px 12px;
      border-radius: var(--radius);
      background: #fff;
      border: 1px solid #efede8;
      box-shadow: var(--shadow);
    }

    .routine-options-panel .form-group {
      margin-bottom: 10px;
    }

    .routine-options-panel .form-group:last-child {
      margin-bottom: 0;
    }

    .routine-options-panel .form-label {
      color: var(--muted);
      margin-bottom: 5px;
    }

    .toggle-block--soft {
      border: 1px solid #efede8;
      border-radius: 10px;
      background: #fff;
      padding: 8px 10px;
    }

    .toggle-block--soft .alarm-options {
      margin-top: 8px;
      border-color: #ece8e2;
      background: #faf9f7;
    }

    .toggle {
      width: 44px;
      height: 26px;
      border-radius: 13px;
      background: var(--border);
      cursor: pointer;
      position: relative;
      transition: background 0.2s;
    }

    .toggle::after {
      content: '';
      position: absolute;
      width: 20px;
      height: 20px;
      border-radius: 50%;
      background: white;
      top: 3px;
      left: 3px;
      transition: left 0.2s;
      box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
    }

    .toggle.on {
      background: var(--accent);
    }

    .toggle.on::after {
      left: 21px;
    }

    /* 구성원 모달 · 학교 일정 자동등록 안내 */
    .member-student-feature {
      margin-top: 14px;
      padding: 14px 14px 12px;
      background: linear-gradient(160deg, rgba(149, 203, 216, 0.18) 0%, rgba(247, 246, 243, 0.65) 48%, var(--surface) 100%);
      border: 1px solid rgba(149, 203, 216, 0.4);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
    }

    .member-student-feature__head {
      display: flex;
      align-items: flex-start;
      gap: 12px;
    }

    .member-student-feature__icon {
      width: 56px;
      height: 56px;
      border-radius: 15px;
      background: rgba(149, 203, 216, 0.28);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .member-student-feature__icon img {
      width: 40px;
      height: 40px;
      object-fit: contain;
      opacity: 0.88;
    }

    .member-student-feature__title {
      font-size: 13px;
      font-weight: 700;
      color: var(--text);
      letter-spacing: -0.03em;
      line-height: 1.35;
      margin-bottom: 5px;
    }

    .member-student-feature__desc {
      font-size: 12px;
      line-height: 1.5;
      color: var(--muted);
      font-weight: 400;
    }

    .member-student-feature__row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin-top: 12px;
      padding-top: 12px;
      border-top: 1px solid rgba(232, 230, 224, 0.95);
    }

    .member-student-feature__toggle-label {
      font-size: 13px;
      font-weight: 600;
      color: var(--text);
      letter-spacing: -0.02em;
    }

    .member-student-feature__school {
      margin-top: 10px;
      padding-top: 12px;
      border-top: 1px solid rgba(232, 230, 224, 0.95);
    }

    /* 구성원 모달: 시/도·학교·검색 한 줄 → 검색 결과 → 학년·반·자동받기 */
    .mb-school-grid {
      display: grid;
      grid-template-columns: minmax(88px, 108px) 1fr auto;
      gap: 6px;
      align-items: stretch;
    }

    .mb-school-results {
      margin-top: 6px;
      max-height: 140px;
      overflow-y: auto;
      position: relative;
      z-index: 4;
    }

    .mb-grade-class-row {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 6px;
      margin-top: 10px;
    }

    .mb-grade-class-row #mb-grade {
      flex: 1 1 88px;
      min-width: 72px;
      max-width: 120px;
    }

    .mb-class-input-narrow {
      width: 72px;
      max-width: 72px;
      min-width: 72px;
      flex-shrink: 0;
    }

    .mb-school-auto-label {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      margin-left: auto;
      flex: 1 1 auto;
      min-width: 0;
      cursor: pointer;
      font-size: 12px;
      font-weight: 400;
      color: var(--text);
      user-select: none;
    }

    .mb-school-auto-label input {
      flex-shrink: 0;
      width: 16px;
      height: 16px;
      accent-color: var(--accent);
    }

    .mb-school-auto-text {
      line-height: 1.3;
    }

    .mb-school-grid > * {
      min-width: 0;
    }

    /* 시/도·학교명·학년·반 동일 (학년·반은 그리드 밖이라 별도 스코프로 통일) */
    .member-student-feature__school .mb-school-grid__compact,
    .member-student-feature__school .mb-school-grid__compact.form-input {
      padding: 5px 7px;
      font-size: 12px;
      line-height: 1.2;
      min-height: 30px;
      box-sizing: border-box;
    }

    .mb-school-grid .mb-school-grid__search {
      min-width: auto;
      padding: 0 8px;
      font-size: 12px;
      font-weight: 700;
      min-height: 30px;
      box-sizing: border-box;
      align-self: stretch;
    }

    .mb-color-row {
      display: flex;
      flex-wrap: wrap;
      gap: 5px;
      align-items: center;
      position: relative;
    }

    .mb-color-custom-input {
      position: absolute;
      width: 1px;
      height: 1px;
      opacity: 0;
      pointer-events: none;
      margin: 0;
      padding: 0;
      border: 0;
    }

    .mb-color-chip--custom {
      background: conic-gradient(from 90deg, #f2a8b0, #f5d87a, #c8e89a, #95cbd8, #a0c4e8, #b8a8e8, #e8a8d8, #f2a8b0);
      border: 1.5px solid rgba(0, 0, 0, 0.12);
    }

    .mb-color-chip--custom.is-selected {
      border-color: rgba(0, 0, 0, 0.35);
    }

    .mb-color-chip {
      flex-shrink: 0;
      box-sizing: border-box;
      width: 22px;
      height: 22px;
      border-radius: 50%;
      border: 2px solid transparent;
      cursor: pointer;
      padding: 0;
      transition: transform 0.12s ease, border-color 0.12s ease;
    }

    .mb-color-chip.is-selected {
      border-color: rgba(0, 0, 0, 0.3);
      transform: scale(1.12);
    }

    /* 구성원 모달 · 프로필 (미리보기 좌 / 탭·그리드 우) */
    .mb-photo-heading {
      display: flex;
      flex-wrap: wrap;
      align-items: baseline;
      gap: 4px 10px;
      margin-bottom: 8px;
    }

    .mb-photo-heading__title {
      margin-bottom: 0 !important;
    }

    .mb-photo-heading__hint {
      font-size: 11px;
      font-weight: 400;
      color: var(--muted);
      line-height: 1.35;
    }

    .mb-photo-row {
      display: flex;
      align-items: flex-start;
      gap: 16px;
    }

    .mb-photo-preview {
      width: 64px;
      height: 64px;
      border-radius: 50%;
      background: var(--border);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 28px;
      overflow: hidden;
      flex-shrink: 0;
      margin: 2px 4px 0 2px;
      box-sizing: border-box;
    }

    .mb-photo-side {
      flex: 1;
      min-width: 0;
    }

    .mb-photo-tabs {
      display: flex;
      margin-bottom: 0;
    }

    .mb-photo-tab {
      flex: 1;
      padding: 5px 2px 6px;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 11px;
      font-weight: 400;
      color: var(--muted);
      background: var(--bg);
      border: 1.5px solid var(--border);
      border-bottom: none;
      cursor: pointer;
    }

    .mb-photo-tab:first-of-type {
      border-radius: 6px 0 0 0;
    }

    .mb-photo-tab:last-of-type {
      border-radius: 0 6px 0 0;
    }

    .mb-photo-tab.mb-photo-tab--active {
      font-weight: 700;
      color: var(--accent);
      background: white;
      border-color: var(--accent);
      padding-bottom: 7px;
    }

    .mb-photo-tab:not(.mb-photo-tab--active) {
      padding-bottom: 5px;
    }

    .mb-photo-content-box {
      border: 1.5px solid var(--accent);
      border-radius: 0 10px 10px 10px;
      padding: 6px 7px;
      background: var(--bg);
    }

    .mb-photo-panel-upload {
      text-align: center;
      padding: 6px 0 4px;
    }

    .mb-photo-upload-btn {
      display: inline-block;
      padding: 7px 12px;
      background: white;
      border: 1.5px solid var(--border);
      border-radius: 8px;
      font-size: 11px;
      color: var(--text);
      cursor: pointer;
    }

    .mb-photo-upload-note {
      font-size: 10px;
      color: var(--muted);
      margin-top: 5px;
    }

    /* 구성원 모달 · 프로필 아이콘 그리드 (우측 좁은 영역, 약 2행 + 스크롤) */
    #mb-panel-icon {
      container-type: inline-size;
      container-name: mb-icon-panel;
    }

    .mb-icon-grid {
      display: grid;
      grid-template-columns: repeat(6, minmax(0, 1fr));
      gap: 2px 2px;
      max-height: 78px;
      max-height: calc((100cqw - 10px) / 6 * 2 + 2px);
      overflow-y: auto;
      overflow-x: hidden;
      padding: 0;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: thin;
    }

    .mb-icon-grid::-webkit-scrollbar {
      width: 5px;
    }

    .mb-icon-grid::-webkit-scrollbar-thumb {
      background: var(--border);
      border-radius: 4px;
    }

    /* 시험준비기간 배너 */
    .exam-banner {
      background: #fdf3f3;
      border: 1px solid #f5c6c6;
      border-radius: var(--radius);
      padding: 10px 14px;
      margin-bottom: 8px;
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 13px;
      color: #c0392b;
    }

    /* 홈: 오늘/주/달 빈 상태 카드 */
    .empty-card {
      display: flex;
      flex-direction: column;
      gap: 10px;
      font-family: 'Noto Sans KR', sans-serif;
    }

    .empty-card > div:first-child {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .empty-main {
      font-size: 13px;
      color: var(--muted);
      margin-bottom: 0;
    }

    .empty-hint {
      font-size: 13px;
      color: var(--text);
      line-height: 1.7;
    }

    .empty-hint-who {
      display: inline-flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 6px;
      vertical-align: middle;
    }

    .empty-hint-school-slot {
      display: inline-flex;
      align-items: center;
      vertical-align: middle;
    }

    .empty-hint-title {
      font-weight: 500;
      color: var(--text);
    }

    .hint-date {
      font-weight: 500;
      color: #5ba3a0;
    }

    /* 카테고리「+ 추가」 등과 동일 계열: 솔리드 액센트 */
    .empty-card-add-btn {
      width: 100%;
      padding: 10px 14px;
      border: none;
      border-radius: 10px;
      background: var(--accent);
      color: #fff;
      font-size: 12px;
      font-weight: 700;
      font-family: 'Noto Sans KR', sans-serif;
      cursor: pointer;
      margin-bottom: 0;
    }

    /* 보조 CTA: 같은 모서리·두께, 아웃라인으로 위 버튼과 짝 */
    .empty-card-gcal-btn {
      width: 100%;
      padding: 9px 14px;
      border: 1px solid var(--accent);
      border-radius: 10px;
      background: var(--surface);
      color: var(--accent);
      font-size: 12px;
      font-weight: 600;
      font-family: 'Noto Sans KR', sans-serif;
      cursor: pointer;
      text-align: center;
    }

    .empty-card-gcal-btn:hover {
      background: var(--bg);
    }

    /* 홈: 등록 일정 없음 온보딩 */
    .home-onboarding {
      padding: 8px 0 4px;
    }

    .onboarding-guide {
      background: #fff;
      margin: 12px 0 14px;
      border-radius: 14px;
      border: 0.5px solid #e8e6e0;
      padding: 14px 16px;
    }

    .ob-label {
      font-size: 11px;
      font-weight: 500;
      color: #c0b8b8;
      display: block;
      margin-bottom: 14px;
    }

    .ob-steps {
      display: flex;
      align-items: center;
    }

    .ob-step {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
    }

    .ob-icon {
      width: 44px;
      height: 44px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .ob-icon-1 { background: #fce8e8; color: #e07b7b; }
    .ob-icon-2 { background: #e8f4e8; color: #5ba35a; }
    .ob-icon-3 { background: #fdf3e3; color: #d4934a; }

    .ob-arrow {
      flex-shrink: 0;
      padding: 0 4px;
      margin-bottom: 24px;
      color: #d0ccc8;
    }

    .ob-step-text {
      font-size: 10.5px;
      color: #999;
      text-align: center;
      line-height: 1.45;
    }

    .ob-step-num {
      display: block;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.5px;
      margin-bottom: 2px;
    }

    .ob-step-text strong {
      display: block;
      font-size: 12px;
      font-weight: 500;
      color: #444;
      margin-bottom: 3px;
    }

    .home-onboarding-title {
      margin: 0 0 8px;
      font-size: 16px;
      font-weight: 700;
      color: var(--text);
      font-family: 'Noto Sans KR', sans-serif;
      letter-spacing: -0.02em;
    }

    .home-onboarding-desc {
      margin: 0 0 18px;
      font-size: 13px;
      line-height: 1.55;
      color: var(--muted);
      font-family: 'Noto Sans KR', sans-serif;
    }

    .home-onboarding-desc strong {
      color: var(--accent);
      font-weight: 700;
    }

    .home-onboarding-list {
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .home-onboarding-item {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      padding: 14px 14px;
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: 14px;
      box-shadow: var(--shadow);
    }

    .home-onboarding-icon {
      width: 40px;
      height: 40px;
      border-radius: 10px;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .home-onboarding-icon--school {
      background: #edf7f0;
    }

    .home-onboarding-icon--google {
      background: #e8f4fb;
    }

    .home-onboarding-item-text {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 4px;
      padding-top: 1px;
    }

    .home-onboarding-item-title {
      font-size: 14px;
      font-weight: 700;
      color: var(--text);
      font-family: 'Noto Sans KR', sans-serif;
    }

    .home-onboarding-item-sub {
      font-size: 12px;
      line-height: 1.45;
      color: var(--muted);
      font-family: 'Noto Sans KR', sans-serif;
    }

    .home-onboarding-btn {
      flex-shrink: 0;
      align-self: center;
      padding: 8px 12px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--bg);
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 12px;
      font-weight: 600;
      color: var(--text);
      cursor: pointer;
    }

    .home-onboarding-btn--primary {
      background: var(--accent);
      border-color: var(--accent);
      color: #fff;
    }

    /* 전체 화면 이미지 온보딩 */
    body.app-onboarding-open {
      overflow: hidden;
    }

    .app-onboarding {
      position: fixed;
      inset: 0;
      z-index: 5000;
      display: flex;
      flex-direction: column;
      align-items: center;
      width: 100%;
      max-width: 100vw;
      min-height: 100dvh;
      box-sizing: border-box;
      padding: 0 max(16px, env(safe-area-inset-left, 0px)) 0 max(16px, env(safe-area-inset-right, 0px));
      background: var(--bg);
      font-family: 'Noto Sans KR', sans-serif;
    }

    .app-onboarding__close {
      position: absolute;
      top: max(10px, env(safe-area-inset-top, 0px));
      right: max(10px, env(safe-area-inset-right, 0px));
      z-index: 2;
      width: 40px;
      height: 40px;
      padding: 0;
      border: none;
      border-radius: 10px;
      background: rgba(255, 255, 255, 0.85);
      color: var(--text);
      font-size: 26px;
      line-height: 1;
      font-weight: 300;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
    }

    .app-onboarding__close:active {
      opacity: 0.85;
    }

    /* 디자인 기준 390px 폭 — 상·하단 동일. 상단은 세로 비율로 커지지 않도록 높이 상한 */
    .app-onboarding__top {
      flex: 0 0 auto;
      width: 100%;
      max-width: 390px;
      max-height: 45dvh;
      display: flex;
      justify-content: center;
      align-items: flex-start;
      overflow: hidden;
      margin: 0;
      padding: 0;
      background: #fff;
      box-sizing: border-box;
    }

    .app-onboarding__top-img {
      display: block;
      width: 100%;
      max-width: 390px;
      height: auto;
      max-height: 45dvh;
      vertical-align: top;
      object-fit: contain;
      object-position: top center;
    }

    /* 원본 한 장을 위·아래로 나눈 틈을 메우는 고정폭(390) 흰 띠 — 상·하 이미지와 여백 없이 이어짐 */
    .app-onboarding__bridge {
      flex-shrink: 0;
      width: 100%;
      max-width: 390px;
      height: 50px;
      margin: 0;
      padding: 0;
      background: #fff;
      box-sizing: border-box;
    }

    .app-onboarding__bottom {
      flex: 1 1 auto;
      min-height: 0;
      display: flex;
      flex-direction: column;
      width: 100%;
      max-width: 390px;
      margin: 0;
      padding: 0;
      background: #fff;
      box-sizing: border-box;
    }

    /* 하단 이미지 + 마지막 슬라이드 CTA 레이어(중앙 겹침) */
    .app-onboarding__slide-stage {
      position: relative;
      flex: 0 0 auto;
      width: 100%;
      max-width: 390px;
    }

    .app-onboarding__slide-wrap {
      position: relative;
      width: 100%;
      /* 첫 슬라이드 로드 전까지 대략 비율 — onboarding.js에서 실제 픽셀 비율로 덮어씀 */
      aspect-ratio: 390 / 520;
      min-height: 0;
      margin: 0;
      padding: 0;
      touch-action: pan-x;
      background: #fff;
    }

    .app-onboarding__slide {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: contain;
      object-position: center top;
      opacity: 0;
      transition: opacity 0.2s ease;
      pointer-events: none;
    }

    .app-onboarding__slide.is-active {
      opacity: 1;
      pointer-events: auto;
    }

    .app-onboarding__dots-row {
      flex-shrink: 0;
      display: flex;
      justify-content: center;
      align-items: center;
      margin-top: auto;
      padding: 6px 16px max(12px, env(safe-area-inset-bottom, 12px));
    }

    .app-onboarding__dots {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
    }

    .app-onboarding__dot {
      width: 7px;
      height: 7px;
      padding: 0;
      border: none;
      border-radius: 50%;
      background: #c8c4be;
      cursor: pointer;
      opacity: 0.55;
      transition: opacity 0.15s ease, transform 0.15s ease;
    }

    .app-onboarding__dot.is-active {
      opacity: 1;
      background: var(--accent, #4a7c59);
      transform: scale(1.15);
    }

    .app-onboarding__cta {
      position: absolute;
      left: 16px;
      right: 16px;
      top: 50%;
      transform: translateY(-50%);
      z-index: 2;
      display: flex;
      flex-direction: column;
      align-items: stretch;
      gap: 10px;
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      pointer-events: none;
    }

    .app-onboarding__cta:not([hidden]) {
      pointer-events: auto;
    }

    .app-onboarding__cta[hidden] {
      display: none !important;
    }

    .app-onboarding__cta .app-onboarding__btn {
      box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12);
    }

    .app-onboarding__btn {
      width: 100%;
      padding: 14px 16px;
      border-radius: 12px;
      border: 1px solid var(--border);
      background: var(--surface);
      font-size: 15px;
      font-weight: 600;
      color: var(--text);
      cursor: pointer;
      font-family: inherit;
    }

    .app-onboarding__btn--primary {
      background: #41c6b7;
      border-color: #41c6b7;
      color: #fff;
    }

    .app-onboarding__btn--gcal {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
    }

    .app-onboarding__gcal-icon {
      display: flex;
      flex-shrink: 0;
      line-height: 0;
    }

    .app-onboarding__gcal-icon svg {
      display: block;
    }

    .top-notice-wrap {
      background: transparent;
      border: none;
      border-radius: 0;
      padding: 0;
      margin-bottom: 10px;
      box-shadow: none;
    }

    .top-notice-carousel {
      opacity: 0;
      transform: translateY(4px);
      transition: opacity 0.22s ease, transform 0.22s ease;
      cursor: pointer;
    }

    .top-notice-carousel.show {
      opacity: 1;
      transform: translateY(0);
    }

    .top-notice-card {
      display: flex;
      align-items: center;
      gap: 10px;
      border-radius: 14px;
      padding: 8px 10px;
      margin-bottom: 0;
      border: 1px solid transparent;
      box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
      min-width: 0;
    }

    .top-notice-dday-box {
      flex-shrink: 0;
      width: 56px;
      height: 56px;
      border-radius: 12px;
      color: #fff;
      display: inline-flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 1px;
      white-space: normal;
    }

    .top-notice-dday-label {
      font-size: 9px;
      font-weight: 700;
      letter-spacing: 0.08em;
      line-height: 1;
      color: #ffd8de;
      transform: translateY(-3px);
    }

    .top-notice-dday-value {
      font-size: 31px;
      font-weight: 800;
      letter-spacing: -0.04em;
      line-height: 0.78;
      color: #fff;
      transform: translateY(-3px);
    }

    .top-notice-dday-value--today {
      font-size: 18px;
      font-weight: 800;
      letter-spacing: -0.03em;
      line-height: 1;
      transform: translateY(-2px);
    }

    .top-notice-content {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 2px;
      overflow: hidden;
    }

    .top-notice-toprow,
    .top-notice-bottomrow {
      display: flex;
      align-items: center;
      gap: 4px;
      min-width: 0;
      white-space: nowrap;
      overflow: hidden;
    }

    .top-notice-title {
      flex: 0 1 auto;
      min-width: 0;
      max-width: calc(100% - 86px);
      font-size: 16px;
      font-weight: 700;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      line-height: 1.2;
    }

    .top-notice-kind-chip {
      flex: 0 1 auto;
      min-width: 0;
      max-width: 8em;
      overflow: hidden;
      text-overflow: ellipsis;
      font-size: 11px;
      font-weight: 600;
      line-height: 1.2;
      padding: 4px 8px;
      border-radius: 8px;
      border: 1px solid transparent;
      white-space: nowrap;
    }

    .top-notice-kind-text {
      flex: 0 1 auto;
      min-width: 0;
      max-width: 9em;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      font-size: 11px;
      font-weight: 500;
      color: #a7a29b;
      line-height: 1.2;
    }

    .top-notice-sep {
      flex: 0 0 auto;
      color: #9d9890;
      font-size: 11px;
      line-height: 1;
      margin: 0 1px;
    }

    .top-notice-date-inline {
      flex: 0 0 auto;
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-size: 12px;
      font-weight: 500;
      white-space: nowrap;
    }

    .top-notice-member-inline {
      flex: 0 0 auto;
      display: inline-flex;
      align-items: center;
      gap: 4px;
      min-width: 0;
    }

    .top-notice-member-inline--right {
      margin-left: auto;
      max-width: 44%;
      overflow: hidden;
      justify-content: flex-end;
    }

    .top-notice-member-avatar-img,
    .top-notice-member-avatar-fallback {
      width: 18px;
      height: 18px;
      border-radius: 50%;
      flex-shrink: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      object-fit: cover;
      font-size: 12px;
      line-height: 1;
      box-sizing: border-box;
    }

    .top-notice-member-avatar-img {
      border: 1px solid rgba(255, 255, 255, 0.7);
    }

    .top-notice-member-avatar-fallback {
      background: #bdbdbd;
      border: 1px solid rgba(0, 0, 0, 0.1);
    }

    .top-notice-member-inline-name {
      font-size: 12px;
      font-weight: 600;
      white-space: nowrap;
    }

    .top-notice-dots-wrap {
      margin-top: 10px;
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 5px;
    }

    .top-notice-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      flex-shrink: 0;
    }

    /* 캘린더 화면 */
    .cal-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 16px 20px;
      background: var(--surface);
      border-bottom: 1px solid var(--border);
      position: sticky;
      top: 0;
      z-index: 100;
    }

    .cal-month-title {
      font-size: 17px;
      font-weight: 700;
      color: var(--text);
    }

    .cal-nav-btn {
      background: none;
      border: none;
      font-size: 24px;
      color: var(--muted);
      cursor: pointer;
      padding: 4px 12px;
      line-height: 1;
    }

    .cal-weekdays {
      display: grid;
      grid-template-columns: repeat(7, 1fr);
      background: var(--surface);
      border-bottom: 1px solid var(--border);
      padding: 8px 0 4px;
    }

    .cal-wd {
      text-align: center;
      font-size: 11px;
      font-weight: 700;
      color: var(--muted);
      letter-spacing: 0.5px;
    }

    .cal-wd.sun {
      color: #e07b7b;
    }

    .cal-wd.sat {
      color: #95cbd8;
    }

    .cal-grid {
      display: grid;
      grid-template-columns: repeat(7, 1fr);
      padding: 8px 4px;
      gap: 2px;
    }

    .cal-cell {
      display: flex;
      flex-direction: column;
      align-items: center;
      padding: 6px 2px 4px;
      border-radius: 10px;
      cursor: pointer;
      min-height: 58px;
      transition: background 0.15s;
      gap: 2px;
    }

    .cal-cell:hover {
      background: var(--border);
    }

    .cal-cell.other-month {
      opacity: 0.3;
    }

    .cal-cell.selected {
      background: #f0f0ec;
    }

    .cal-date-host {
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: center;
      flex-shrink: 0;
      transform: translateY(-2px);
    }

    .cal-important-ring {
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(calc(-50% - 1px), calc(-50% - 2px));
      width: 50px;
      height: 50px;
      object-fit: contain;
      pointer-events: none;
      opacity: 0.85;
      z-index: 3;
    }

    .cal-date-host .cal-date {
      position: relative;
      z-index: 1;
    }

    .cal-date {
      font-size: 13px;
      font-weight: 500;
      width: 28px;
      height: 28px;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      flex-shrink: 0;
    }


    /* 오늘 날짜 */
    .cal-cell.today .cal-date {
      width: 34px;
      height: 34px;
    }

    .cal-cell.today .cal-date span {
      font-size: 18px;
      font-weight: 900;
      color: #fff;
      background: #82cbc4;
      width: 100%;
      height: 100%;
      aspect-ratio: 1 / 1;
      border-radius: 50%;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      line-height: 1;
      box-shadow: 0 2px 0 rgba(0, 0, 0, 0.03);
    }

    .cal-date.sun {
      color: #e07b7b;
    }

    .cal-date.sat {
      color: #95cbd8;
    }

    .cal-cell.today .cal-date.sun span,
    .cal-cell.today .cal-date.sat span {
      color: #fff;
    }

    .cal-dots {
      display: flex;
      gap: 2px;
      flex-wrap: wrap;
      justify-content: center;
      max-width: 40px;
      margin-top: 4px;
    }

    .cal-exam-label {
      margin-top: 1px;
      font-size: 9px;
      line-height: 1;
      font-weight: 700;
      color: #d86c73;
      text-align: center;
      letter-spacing: 0.01em;
    }

    .cal-holiday-labels {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 1px;
      margin-top: 1px;
      width: 100%;
      max-width: 100%;
    }

    .cal-holiday-label {
      font-size: 8px;
      line-height: 1.15;
      font-weight: 500;
      text-align: center;
      letter-spacing: 0.01em;
      max-width: 100%;
      width: 100%;
      padding: 0 1px;
      word-break: keep-all;
      overflow: hidden;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
    }

    .cal-holiday-label--public {
      color: #d86c73;
    }

    .cal-holiday-label--memorial {
      color: #4a8a96;
    }

    .cal-holiday-detail-row {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: 5px 8px;
    }

    .cal-holiday-detail-row--follow {
      border-top: 1px solid var(--border);
      margin: 0;
      padding-top: 5px;
    }

    .cal-holiday-detail-tag {
      flex-shrink: 0;
      font-size: 9px;
      font-weight: 700;
      letter-spacing: 0.01em;
      color: #fff;
      background: #c4707a;
      padding: 1px 4px;
      border-radius: 3px;
      border: none;
      line-height: 1.2;
    }

    .cal-holiday-detail-tag--memorial {
      color: #fff;
      background: #5f96a8;
      border: none;
    }

    .cal-holiday-detail-name {
      flex: 1;
      min-width: 0;
      font-size: 13px;
      font-weight: 600;
      color: #d86c73;
    }

    .cal-holiday-detail-name--memorial {
      color: #4a8a96;
    }

    .cal-dot {
      width: 5px;
      height: 5px;
      border-radius: 50%;
      flex-shrink: 0;
    }

    /* 중요 일정 - 빨간펜 느낌 원 */
    .cal-date.highlight::after {
      content: '';
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%) rotate(-5deg);
      width: 26px;
      height: 26px;
      border-radius: 50% 45% 55% 48% / 48% 55% 45% 52%;
      border: 2px solid #e03030;
      opacity: 0.9;
      z-index: 2;
      pointer-events: none;
    }

    /* 캘린더 상세 */
    .cal-detail {
      padding: 16px;
      min-height: 100px;
    }

    .cal-detail-title {
      font-size: 13px;
      font-weight: 700;
      color: var(--muted);
      letter-spacing: 0.5px;
      margin-bottom: 12px;
      text-transform: uppercase;
    }

    .cal-detail-item {
      background: var(--surface);
      border-radius: var(--radius);
      border: 1px solid var(--border);
      padding: 12px 14px;
      margin-bottom: 8px;
      display: flex;
      align-items: center;
      gap: 10px;
      box-shadow: var(--shadow);
    }

    .cal-detail-body {
      flex: 1;
      min-width: 0;
    }

    .cal-detail-name {
      font-size: 14px;
      font-weight: 500;
      color: var(--text);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .cal-detail-meta {
      font-size: 12px;
      color: var(--muted);
      margin-top: 3px;
    }

    .home-schedule-row {
      display: flex;
      align-items: center;
      gap: 6px;
      /* 오늘 할 일 행(.today-task-row padding 10px)과 이름 뱃지 시작선 맞춤 + 기간 카드 padding 10px과 합산 */
      padding: 7px 10px;
    }

    /* 이번 주·달: 지난 일정만 있고 접혀 있을 때 — 지난일정 보기 아래, 가운데 */
    .home-schedule-past-only-hint {
      font-size: 11px;
      color: var(--muted);
      font-weight: 400;
      line-height: 1.35;
      padding: 2px 8px 0;
      text-align: center;
    }

    .home-schedule-date {
      width: 6.5ch;
      min-width: 6.5ch;
      display: inline-block;
      font-size: 11px;
      color: var(--muted);
      line-height: 1.35;
      flex-shrink: 0;
      text-align: left;
      white-space: nowrap;
    }

    .cal-school-row {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 8px 10px;
    }

    .cal-school-row__member {
      flex-shrink: 0;
      display: flex;
      align-items: center;
      align-self: stretch;
    }

    .cal-school-row__main {
      flex: 1;
      min-width: 0;
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 13px;
      color: var(--text);
      line-height: 1.35;
    }

    .cal-school-row__titlewrap {
      flex: 1;
      min-width: 0;
      display: flex;
      align-items: center;
      gap: 2px;
      overflow: hidden;
    }

    .cal-school-row .school-sync-chip {
      align-self: center;
    }

    /* 자동 학사일정 학교명 칩 — 아이콘 없음, 연회색·모서리만 살짝 둥근 태그 */
    .school-sync-chip {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      box-sizing: border-box;
      font-size: 11px;
      font-weight: 500;
      line-height: 1.25;
      color: #666;
      padding: 2px 4px;
      border-radius: 4px;
      border: 1px solid #e6e6e6;
      background: #ececec;
      max-width: 5.5em;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    /* 홈 주·달 / 캘린더 일간 / 홈 오늘 NEIS 시간표 줄: 동일 소형 학교 태그 */
    .home-schedule-row .school-sync-chip,
    .cal-school-row .school-sync-chip,
    .home-routine-timetable-row .school-sync-chip {
      max-width: 3.1rem;
      padding: 1px 3px;
      font-size: 10px;
      font-weight: 500;
      color: #5a5a5a;
      border-color: #e4e4e4;
      background: #ebebeb;
      border-radius: 3px;
    }

    .list-impo-icon {
      width: 34px;
      height: 34px;
      object-fit: contain;
      flex-shrink: 0;
      align-self: center;
      display: block;
      margin-left: 1px;
    }

    /* 프로젝트 화면 */
    .project-card {
      background: var(--surface);
      border-radius: var(--radius);
      border: 1px solid var(--border);
      padding: 16px;
      margin-bottom: 12px;
      box-shadow: var(--shadow);
      cursor: pointer;
    }

    .project-card-top {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 10px;
      min-width: 0;
    }

    .project-card-head-left {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 6px;
      flex: 1;
      min-width: 0;
    }

    .project-card-member-row {
      flex-shrink: 0;
      line-height: 1;
    }

    .project-title-line {
      display: flex;
      align-items: center;
      min-width: 0;
      width: 100%;
    }

    .project-title-line__main {
      flex: 1;
      min-width: 0;
      display: flex;
      align-items: center;
      gap: 6px;
    }

    .project-dday {
      flex-shrink: 0;
      align-self: center;
      font-size: 12px;
      font-weight: 700;
      color: #e85b63;
      line-height: 1.25;
      letter-spacing: 0.02em;
    }

    /* 홈 학교명 칩(.school-sync-chip 소형)과 동일 규격, 글자만 #e85b63 */
    .project-exam-tag {
      flex-shrink: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      box-sizing: border-box;
      max-width: 3.6rem;
      padding: 1px 3px;
      font-size: 11px;
      font-weight: 700;
      line-height: 1.25;
      color: #e85b63;
      background: transparent;
      border: none;
      border-radius: 3px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .project-title {
      display: block;
      width: 100%;
      font-size: 15px;
      font-weight: 700;
      color: var(--text);
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .project-title-line__main .project-title {
      flex: 1;
      min-width: 0;
      width: auto;
    }

    .project-card-progress {
      flex: 1 1 auto;
      min-width: 56px;
      display: flex;
      align-items: center;
    }

    .project-progress-track {
      width: 100%;
      height: 8px;
      background: #e2e2e2;
      border-radius: 999px;
      overflow: hidden;
    }

    .project-progress-fill {
      height: 100%;
      max-width: 100%;
      border-radius: 999px;
      transition: width 0.35s ease;
      box-sizing: border-box;
    }

    .project-card-actions {
      display: flex;
      align-items: center;
      gap: 6px;
      flex-shrink: 0;
    }

    .project-body-indent {
      padding-left: 40px;
    }

    .status-badge {
      font-size: 11px;
      font-weight: 500;
      padding: 3px 9px;
      border-radius: 10px;
      flex-shrink: 0;
    }

    .status-진행중 {
      background: var(--status-inprogress-bg);
      color: var(--status-inprogress-text);
    }

    .status-대기 {
      background: #f0f0f0;
      color: var(--muted);
    }

    .status-완료 {
      background: #e8f0fe;
      color: #1a56db;
    }

    .project-meta {
      font-size: 12px;
      color: var(--muted);
    }

    /* 태스크 목록 */
    .task-list-wrap {
      display: none;
      margin-top: 12px;
      border-top: 1px solid var(--border);
      padding-top: 12px;
    }

    .task-list-wrap.open {
      display: block;
    }

    .project-task-list-hint {
      margin: 0 0 10px 0;
      padding: 0;
      font-size: 12px;
      line-height: 1.45;
      color: var(--muted);
    }

    .proj-task-item {
      background: var(--bg);
      border-radius: 8px;
      padding: 10px 12px;
      margin-bottom: 6px;
      cursor: pointer;
    }

    .proj-task-item.done .proj-task-title {
      text-decoration: line-through;
    }

    #projectPage .task-checkbox:not(.checked),
    #projectPage .todo-check:not(.checked) {
      background: var(--surface);
    }

    /* 순서 조정 버튼 */
    .task-order-btns {
      display: flex;
      flex-direction: column;
      gap: 2px;
      flex-shrink: 0;
    }

    .todo-toggle-btn {
      background: none;
      border: 1px solid var(--border);
      border-radius: 6px;
      width: 22px;
      height: 20px;
      font-size: 12px;
      line-height: 1;
      cursor: pointer;
      color: var(--muted);
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background 0.15s, color 0.15s, border-color 0.15s;
    }

    .todo-toggle-btn:hover {
      background: rgba(149, 203, 216, 0.18);
      color: var(--text);
      border-color: rgba(149, 203, 216, 0.55);
    }

    .order-btn {
      background: none;
      border: 1px solid var(--border);
      border-radius: 4px;
      width: 22px;
      height: 18px;
      font-size: 10px;
      cursor: pointer;
      color: var(--muted);
      display: flex;
      align-items: center;
      justify-content: center;
      line-height: 1;
      transition: all 0.15s;
    }

    .order-btn:hover {
      background: var(--border);
      color: var(--text);
    }

    .order-btn:disabled {
      opacity: 0.2;
      cursor: default;
    }

    .proj-task-top {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 6px;
      width: 100%;
    }

    .proj-task-num {
      flex-shrink: 0;
      min-width: 11px;
      text-align: right;
      padding-right: 1px;
    }

    .proj-task-title {
      font-size: 13px;
      font-weight: 500;
      color: var(--text);
      flex: 1;
    }

    .proj-task-meta {
      font-size: 11px;
      color: var(--muted);
      margin-top: 3px;
      /* 체크박스(20px) + .proj-task-top gap(6px) — 번호 열 시작과 정렬 */
      padding-left: calc(20px + 6px);
    }

    .task-status {
      font-size: 11px;
      padding: 2px 7px;
      border-radius: 8px;
      flex-shrink: 0;
    }

    .ts-대기 {
      /* 더 어울리는 톤의 민트(튀지 않게) */
      background: rgba(74, 158, 151, 0.14);
      color: #2d7f79;
    }

    .ts-진행중 {
      background: var(--status-inprogress-bg);
      color: var(--status-inprogress-text);
    }

    .ts-완료 {
      /* 완료는 회색 톤 */
      background: #f1f1f1;
      color: #9a9a9a;
    }

    .ts-연기 {
      background: #fff3e0;
      color: #e65100;
    }

    /* ToDo 목록 */
    .todo-list {
      display: none;
      margin-top: 8px;
      padding-left: 8px;
    }

    .todo-list.open {
      display: block;
    }

    .todo-item {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 6px 0;
      border-bottom: 1px solid var(--border);
      font-size: 12px;
    }

    .todo-item:last-child {
      border-bottom: none;
    }

    .todo-check {
      width: 16px;
      height: 16px;
      border-radius: 4px;
      border: 1.5px solid var(--border);
      cursor: pointer;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all 0.15s;
    }

    .todo-check.checked {
      background: var(--accent);
      border-color: var(--accent);
    }

    .todo-check.checked::after {
      content: '✓';
      color: white;
      font-size: 10px;
      font-weight: 700;
    }

    .todo-title {
      flex: 1;
      color: var(--text);
    }

    .todo-check.checked+.todo-title {
      text-decoration: line-through;
    }

    .todo-duration {
      color: var(--muted);
    }

    .add-task-btn {
      width: 100%;
      padding: 8px;
      background: none;
      border: 1.5px dashed var(--border);
      border-radius: 8px;
      color: var(--muted);
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 13px;
      cursor: pointer;
      margin-top: 6px;
    }

    /* 태스크 수정 버튼 */
    .task-edit-btn {
      background: none;
      border: none;
      font-size: 13px;
      cursor: pointer;
      padding: 2px 4px;
      border-radius: 4px;
      opacity: 0.6;
      transition: opacity 0.15s;
    }

    .task-edit-btn:hover {
      opacity: 1;
      background: var(--border);
    }

    /* 상태 선택 칩 */
    .status-select {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }

    .status-chip {
      padding: 7px 14px;
      border-radius: 20px;
      border: 1.5px solid var(--border);
      background: none;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 13px;
      color: var(--muted);
      cursor: pointer;
      transition: all 0.15s;
    }

    .status-chip.selected {
      font-weight: 700;
      border-color: transparent;
    }

    .status-chip.ts-대기.selected {
      background: #f0f0f0;
      color: #666;
      border-color: #ccc;
    }

    .status-chip.ts-진행중.selected {
      background: var(--status-inprogress-bg);
      color: var(--status-inprogress-text);
      border-color: var(--status-inprogress-border);
    }

    .status-chip.ts-완료.selected {
      background: #e8f0fe;
      color: #1a56db;
      border-color: #90caf9;
    }

    .status-chip.ts-연기.selected {
      background: #fff3e0;
      color: #e65100;
      border-color: #ffcc80;
    }

    .ap-status-chip {
      padding: 7px 14px;
      border-radius: 20px;
      border: 1.5px solid var(--border);
      background: none;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 13px;
      color: var(--muted);
      cursor: pointer;
      transition: all 0.15s;
    }

    .ap-status-chip.selected {
      font-weight: 700;
      border-color: transparent;
    }

    .ap-status-chip.ts-대기.selected {
      background: #f0f0f0;
      color: #666;
      border-color: #ccc;
    }

    .ap-status-chip.ts-진행중.selected {
      background: var(--status-inprogress-bg);
      color: var(--status-inprogress-text);
      border-color: var(--status-inprogress-border);
    }

    .ap-status-chip.ts-완료.selected {
      background: #e8f0fe;
      color: #1a56db;
      border-color: #90caf9;
    }

    .edit-status-chip {
      padding: 7px 14px;
      border-radius: 20px;
      border: 1.5px solid var(--border);
      background: none;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 13px;
      color: var(--muted);
      cursor: pointer;
      transition: all 0.15s;
    }

    .edit-status-chip.selected {
      font-weight: 700;
      border-color: transparent;
    }

    .edit-status-chip.ts-대기.selected {
      background: #f0f0f0;
      color: #666;
      border-color: #ccc;
    }

    .edit-status-chip.ts-진행중.selected {
      background: var(--status-inprogress-bg);
      color: var(--status-inprogress-text);
      border-color: var(--status-inprogress-border);
    }

    .edit-status-chip.ts-완료.selected {
      background: #e8f0fe;
      color: #1a56db;
      border-color: #90caf9;
    }

    .edit-status-chip.ts-연기.selected {
      background: #fff3e0;
      color: #e65100;
      border-color: #ffcc80;
    }

    /* 카드 액션 버튼 */
    .card-action-btns {
      display: flex;
      flex-direction: column;
      gap: 4px;
      flex-shrink: 0;
    }

    .card-act-btn {
      background: none;
      border: none;
      border-radius: 6px;
      width: 26px;
      height: 24px;
      font-size: 11px;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all 0.15s;
      opacity: 0.92;
    }

    /* PNG 편집·삭제 아이콘: 파일 교체 없이 채도·명암만 살짝 보강 */
    .card-act-btn img {
      filter: brightness(0.88) contrast(1.12) saturate(1.2);
    }

    .card-act-btn:hover {
      background: var(--bg);
      opacity: 1;
    }

    .card-act-btn:hover img {
      filter: brightness(0.78) contrast(1.15) saturate(1.25);
    }

    .card-act-btn.del:hover {
      background: #fde8e8;
    }

    .google-cat-block {
      margin-top: 14px;
      padding: 12px;
      border: 1px solid #bfd7ff;
      background: #f5f9ff;
      border-radius: 14px;
    }

    .google-cat-head {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 8px;
    }

    .google-cat-badge {
      display: inline-flex;
      align-items: center;
      padding: 2px 10px;
      border-radius: 999px;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.2px;
      color: #2b73d9;
      background: #e5efff;
    }

    .google-cat-import-btn {
      margin-left: auto;
      border: none;
      background: var(--accent);
      color: #fff;
      border-radius: 10px;
      padding: 7px 12px;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 12px;
      font-weight: 700;
      cursor: pointer;
      white-space: nowrap;
    }

    .cat-section-title {
      font-size: 14px;
      font-weight: 700;
      color: #565656;
      margin: 2px 0 8px;
    }

    .cat-section-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      margin-bottom: 8px;
    }

    .cat-add-toggle-btn {
      border: none;
      background: var(--accent);
      color: #fff;
      border-radius: 10px;
      padding: 7px 12px;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 12px;
      font-weight: 700;
      cursor: pointer;
      white-space: nowrap;
    }

    .cat-simple-list {
      border: 1px solid var(--border);
      border-radius: 12px;
      background: #fff;
      padding: 0 12px;
    }

    .cat-google-sep {
      height: 1px;
      margin: 18px 2px 2px;
      background: linear-gradient(
        90deg,
        rgba(155, 151, 144, 0),
        rgba(155, 151, 144, 0.32) 18%,
        rgba(155, 151, 144, 0.32) 82%,
        rgba(155, 151, 144, 0)
      );
    }

    .cat-simple-row {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 11px 0;
      border-top: 1px solid var(--border);
    }

    .cat-simple-row:first-child {
      border-top: none;
    }

    .cat-simple-dot {
      width: 12px;
      height: 12px;
      border-radius: 50%;
      background: #4f88e6;
      border: 1px solid rgba(0, 0, 0, 0.08);
      flex-shrink: 0;
    }

    .cat-simple-main {
      min-width: 0;
      flex: 1;
    }

    .cat-simple-name {
      font-size: 14px;
      color: var(--text);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      display: block;
    }

    .cat-simple-actions {
      display: flex;
      align-items: center;
      gap: 4px;
      flex-shrink: 0;
    }

    .cat-add-box {
      margin-top: 12px;
      border: 1px solid var(--border);
      border-radius: 12px;
      background: #f6fafb;
      padding: 12px;
    }

    .google-cat-dot {
      width: 14px;
      height: 14px;
      border-radius: 50%;
      background: #4f88e6;
      flex-shrink: 0;
    }

    .google-cat-name {
      font-size: 13px;
      color: var(--text);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .google-cat-gmark {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 14px;
      height: 14px;
      margin-right: 6px;
      vertical-align: -1px;
      flex-shrink: 0;
    }

    .google-cat-gmark svg {
      display: block;
      width: 13px;
      height: 13px;
    }

    .google-cat-unlink-btn {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      border: 1px solid #cfd5df;
      background: #fff;
      color: var(--text);
      border-radius: 10px;
      padding: 6px 10px;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 12px;
      font-weight: 400;
      cursor: pointer;
      white-space: nowrap;
    }

    .google-cat-unlink-icon {
      color: #111;
      line-height: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }

    .google-cat-note {
      margin: 8px 2px 0;
      font-size: 12px;
      color: var(--muted);
    }

    .google-empty-state {
      padding: 18px 10px 20px;
      text-align: center;
    }

    .google-empty-icon {
      width: 48px;
      height: 48px;
      margin: 0 auto 10px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      background: #e8f1ff;
      color: #2f7de1;
      line-height: 1;
    }

    .google-empty-title {
      font-size: 16px;
      font-weight: 600;
      color: #3f3f3f;
      margin-bottom: 6px;
    }

    .google-empty-desc {
      font-size: 12px;
      color: #6a6a6a;
      line-height: 1.45;
      margin-bottom: 12px;
    }

    .google-empty-btn {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      border: none;
      background: var(--accent);
      color: #fff;
      border-radius: 10px;
      padding: 7px 12px;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 12px;
      font-weight: 700;
      cursor: pointer;
    }

    .google-empty-btn-icon {
      line-height: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }

    .google-unlink-modal {
      position: fixed;
      inset: 0;
      background: rgba(0, 0, 0, 0.4);
      z-index: 1300;
      display: none;
      align-items: flex-end;
      justify-content: center;
      padding: 0 10px 10px;
    }

    .google-unlink-modal.open {
      display: flex;
    }

    .google-unlink-sheet {
      width: 100%;
      max-width: 430px;
      background: #fff;
      border-radius: 18px 18px 12px 12px;
      padding: 9px 14px 11px;
      box-shadow: 0 16px 40px rgba(0, 0, 0, 0.16);
    }

    .google-unlink-handle {
      width: 54px;
      height: 5px;
      border-radius: 999px;
      background: #bdbdbd;
      margin: 0 auto 12px;
    }

    .google-unlink-icon-wrap {
      width: 64px;
      height: 64px;
      margin: 0 auto 10px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      background: #fdeff0;
      color: #cf453a;
    }

    .google-unlink-title {
      margin: 0;
      font-size: 16px;
      line-height: 1.25;
      font-weight: 700;
      color: #1f1f1f;
      text-align: center;
    }

    .google-unlink-desc {
      margin: 8px 0 0;
      font-size: 13px;
      line-height: 1.45;
      color: #404040;
      text-align: center;
      word-break: break-word;
    }

    .google-unlink-warn {
      margin-top: 12px;
      border-radius: 10px;
      background: #fdf0f0;
      color: #d4473d;
      font-size: 12px;
      text-align: center;
      padding: 8px 10px;
    }

    .google-unlink-actions {
      margin-top: 14px;
      display: flex;
      gap: 10px;
    }

    .google-unlink-btn {
      flex: 1;
      min-height: 44px;
      border-radius: 12px;
      border: 1px solid #cfd5df;
      background: #fff;
      color: #1f1f1f;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 12px;
      font-weight: 500;
      cursor: pointer;
    }

    .google-unlink-btn.primary {
      font-weight: 700;
    }

    /* 계정 — 로그아웃 확인 (시트형) */
    .account-logout-modal {
      position: fixed;
      inset: 0;
      background: rgba(0, 0, 0, 0.4);
      z-index: 1310;
      display: none;
      align-items: flex-end;
      justify-content: center;
      padding: 0 10px 10px;
    }

    .account-logout-modal.open {
      display: flex;
    }

    .account-logout-sheet {
      width: 100%;
      max-width: 430px;
      background: #fff;
      border-radius: 18px 18px 12px 12px;
      padding: 9px 14px 11px;
      box-shadow: 0 16px 40px rgba(0, 0, 0, 0.16);
    }

    .account-logout-handle {
      width: 54px;
      height: 5px;
      border-radius: 999px;
      background: #bdbdbd;
      margin: 0 auto 12px;
    }

    .account-logout-icon-wrap {
      width: 56px;
      height: 56px;
      margin: 0 auto 10px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      background: rgba(149, 203, 216, 0.22);
      color: #4a8a9a;
    }

    .account-logout-title {
      margin: 0;
      font-size: 16px;
      line-height: 1.25;
      font-weight: 700;
      color: #1f1f1f;
      text-align: center;
    }

    .account-logout-desc {
      margin: 8px 0 0;
      font-size: 13px;
      line-height: 1.5;
      color: #404040;
      text-align: center;
      word-break: keep-all;
    }

    .account-logout-actions {
      margin-top: 16px;
      display: flex;
      gap: 10px;
    }

    .account-logout-btn {
      flex: 1;
      min-height: 44px;
      border-radius: 12px;
      border: 1px solid #cfd5df;
      background: #fff;
      color: #1f1f1f;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 13px;
      font-weight: 500;
      cursor: pointer;
    }

    .account-logout-btn-primary {
      border-color: var(--accent);
      background: var(--accent);
      color: #fff;
      font-weight: 600;
    }

    /* 계정 — 삭제 확인 시트 */
    .account-delete-modal {
      position: fixed;
      inset: 0;
      background: rgba(0, 0, 0, 0.45);
      z-index: 1311;
      display: none;
      align-items: flex-end;
      justify-content: center;
      padding: 0 10px 10px;
    }

    .account-delete-modal.open {
      display: flex;
    }

    .account-delete-sheet {
      width: 100%;
      max-width: 430px;
      background: #fff;
      border-radius: 18px 18px 12px 12px;
      padding: 9px 16px 14px;
      box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18);
      max-height: min(88vh, 640px);
      overflow-y: auto;
    }

    .account-delete-handle {
      width: 54px;
      height: 5px;
      border-radius: 999px;
      background: #bdbdbd;
      margin: 0 auto 12px;
    }

    .account-delete-icon-wrap {
      width: 56px;
      height: 56px;
      margin: 0 auto 10px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      background: rgba(200, 80, 80, 0.12);
      color: #c45050;
    }

    .account-delete-title {
      margin: 0;
      font-size: 17px;
      line-height: 1.25;
      font-weight: 800;
      color: #1a1a1a;
      text-align: center;
    }

    .account-delete-lead {
      margin: 8px 0 0;
      font-size: 12.5px;
      line-height: 1.45;
      color: #555;
      text-align: center;
      word-break: keep-all;
    }

    .account-delete-list {
      margin: 12px 0 0;
      padding: 0 0 0 18px;
      font-size: 12.5px;
      line-height: 1.55;
      color: #333;
      word-break: keep-all;
    }

    .account-delete-list li {
      margin-bottom: 6px;
    }

    .account-delete-agree-row {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      margin-top: 14px;
      padding: 10px 11px;
      border-radius: 10px;
      background: #faf6f4;
      border: 1px solid #eee8e4;
      font-size: 12px;
      line-height: 1.5;
      color: #3d3d3d;
      cursor: pointer;
    }

    .account-delete-agree-check {
      margin-top: 2px;
      flex-shrink: 0;
    }

    .account-delete-password-wrap {
      margin-top: 12px;
    }

    .account-delete-pwd-label {
      display: block;
      font-size: 11.5px;
      font-weight: 600;
      color: #666;
      margin-bottom: 5px;
    }

    .account-delete-password-input {
      width: 100%;
      box-sizing: border-box;
      border: 1px solid #e0ddd8;
      border-radius: 10px;
      padding: 11px 13px;
      font-size: 13px;
      font-family: inherit;
    }

    .account-delete-dual-hint {
      margin: 8px 0 0;
      font-size: 11px;
      line-height: 1.45;
      color: #8a8580;
      word-break: keep-all;
    }

    .account-delete-error {
      margin: 10px 0 0;
      font-size: 12px;
      line-height: 1.45;
      color: #b33a3a;
      word-break: keep-all;
    }

    .account-delete-actions {
      margin-top: 16px;
      display: flex;
      gap: 10px;
    }

    .account-delete-btn {
      flex: 1;
      min-height: 44px;
      border-radius: 12px;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 13px;
      font-weight: 600;
      cursor: pointer;
    }

    .account-delete-btn-cancel {
      border: 1px solid #cfd5df;
      background: #fff;
      color: #333;
    }

    .account-delete-btn-danger {
      border: 1px solid #c45050;
      background: #c45050;
      color: #fff;
    }

    .account-delete-btn-danger:disabled {
      opacity: 0.45;
      cursor: not-allowed;
    }

    /* 컨텍스트 메뉴 */
    .ctx-btn {
      display: block;
      width: 100%;
      padding: 14px 20px;
      background: none;
      border: none;
      text-align: left;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 14px;
      cursor: pointer;
      border-bottom: 1px solid var(--border);
      color: var(--text);
    }

    .ctx-btn:last-child {
      border-bottom: none;
    }

    .ctx-btn:hover {
      background: var(--bg);
    }

    .ctx-delete {
      color: #e07b7b !important;
    }


    /* 커스텀 시간 선택 */
    .time-select-wrap {
      display: inline-flex;
      align-items: center;
      border: 1.5px solid var(--border);
      border-radius: var(--radius);
      background: var(--surface);
      overflow: hidden;
      transition: border-color 0.15s;
    }

    .time-select-wrap:focus-within {
      border-color: #95cbd8;
    }

    .time-select {
      padding: 11px 6px;
      border: none;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 14px;
      color: var(--text);
      background: transparent;
      outline: none;
      cursor: pointer;
      appearance: none;
      -webkit-appearance: none;
      text-align: center;
    }

    .time-select.ampm {
      width: 52px;
      color: #95cbd8;
      font-weight: 700;
      border-right: 1px solid var(--border);
      padding-left: 10px;
    }

    .time-select.hour {
      width: 40px;
    }

    .time-select.minute {
      width: 40px;
    }

    .time-colon {
      font-size: 15px;
      font-weight: 700;
      color: var(--muted);
      padding: 0 1px;
      pointer-events: none;
    }

    /* 일정 등록: 오전/오후·시·분 숫자 한 단계 작게 */
    #addPage .time-select-wrap .time-select {
      font-size: 13px;
      padding: 9px 5px;
    }

    #addPage .time-select-wrap .time-select.ampm {
      width: 48px;
      padding-left: 8px;
    }

    #addPage .time-select-wrap .time-colon {
      font-size: 14px;
    }


    /* 알람 옵션 */
    .alarm-options {
      display: none;
      margin-top: 10px;
      padding: 12px;
      background: var(--bg);
      border-radius: 10px;
      border: 1px solid var(--border);
    }

    .alarm-options.show {
      display: block;
    }

    .alarm-row {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 8px;
      flex-wrap: wrap;
    }

    .alarm-row:last-child {
      margin-bottom: 0;
    }

    .alarm-row-label {
      font-size: 11px;
      font-weight: 700;
      color: var(--muted);
      width: 24px;
      flex-shrink: 0;
    }

    .alarm-chip {
      padding: 4px 10px;
      border-radius: 20px;
      border: 1.5px solid var(--border);
      background: none;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 12px;
      color: var(--muted);
      cursor: pointer;
      transition: all 0.15s;
    }

    .alarm-chip.selected {
      background: #e8f5f0;
      border-color: #95cbd8;
      color: #95cbd8;
      font-weight: 700;
    }

    /* 설정 · 일정등록: 기본/개별 알림 체크박스 */
    .notification-hint-card {
      background: #eaf4f3;
      border-radius: 12px;
      padding: 14px 16px;
      margin-bottom: 16px;
    }

    .notification-hint-title {
      font-size: 14px;
      font-weight: 700;
      color: #5a8a88;
      margin-bottom: 8px;
    }

    .notification-hint-desc {
      font-size: 12px;
      line-height: 1.55;
      color: #5a8a88;
      margin: 0;
    }

    .notification-group {
      display: grid;
      grid-template-columns: 1fr 1fr;
      column-gap: 10px;
      row-gap: 2px;
      align-items: start;
    }

    /* 당일 4칩: 한 줄 4열, 행 구분선 없음 */
    .notification-group--day4 {
      grid-template-columns: repeat(4, minmax(0, 1fr));
      column-gap: 4px;
    }

    .notification-group--day4 > .notification-option-row {
      border-top: none;
      padding: 4px 0 4px 32px;
      margin-top: 0;
      align-items: center;
      min-height: 30px;
    }

    .notification-group--day4 .notification-check-input,
    .notification-group--day4 .notification-check-ui {
      top: 50%;
      transform: translateY(-50%);
    }

    .notification-group--day4 .notification-option-label {
      font-size: 12px;
      line-height: 1.3;
      font-weight: 500;
      word-break: keep-all;
    }

    /* 사전 알림 3칩: 한 줄 3열 (당일과 동일한 정렬·글자 크기) */
    .notification-group--pre3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      column-gap: 4px;
    }

    .notification-group--pre3 > .notification-option-row {
      border-top: none;
      padding: 4px 0 4px 32px;
      margin-top: 0;
      align-items: center;
      min-height: 30px;
    }

    .notification-group--pre3 .notification-check-input,
    .notification-group--pre3 .notification-check-ui {
      top: 50%;
      transform: translateY(-50%);
    }

    .notification-group--pre3 .notification-option-label {
      font-size: 12px;
      line-height: 1.3;
      font-weight: 500;
      word-break: keep-all;
    }

    .notification-group--pre3 > .notification-option-row:nth-child(n + 4) {
      border-top: none;
      padding-top: 4px;
      margin-top: 0;
    }

    .notification-option-row {
      position: relative;
      display: flex;
      align-items: flex-start;
      gap: 8px;
      padding: 5px 0 6px 26px;
      border-top: none;
      cursor: pointer;
      min-width: 0;
    }

    /* 2열 그리드에서 3행부터 구분선 (day4·pre3는 아래에서 덮어씀) */
    .notification-group > .notification-option-row:nth-child(n + 4) {
      border-top: 0.5px solid #f4f2f0;
      padding-top: 8px;
      margin-top: 2px;
    }

    .notification-group--day4 > .notification-option-row:nth-child(n + 4) {
      border-top: none;
      padding-top: 3px;
      margin-top: 0;
    }

    #f-alarm-options.alarm-options {
      padding: 10px 10px;
    }

    #f-alarm-options .notification-group-sep {
      margin: 8px 10px;
    }

    .notification-option-text {
      display: flex;
      flex-direction: column;
      gap: 2px;
      min-width: 0;
      flex: 1;
    }

    .notification-option-label {
      font-size: 13px;
      color: var(--text);
      font-weight: 500;
    }

    .notification-option-sub {
      font-size: 11px;
      color: #bbb;
      line-height: 1.35;
    }

    .notification-check-input {
      position: absolute;
      left: 0;
      top: 10px;
      opacity: 0;
      width: 20px;
      height: 20px;
      margin: 0;
      cursor: pointer;
      z-index: 1;
    }

    .notification-check-ui {
      position: absolute;
      left: 0;
      top: 10px;
      width: 20px;
      height: 20px;
      border: 1.5px solid #ccc;
      border-radius: 4px;
      flex-shrink: 0;
      pointer-events: none;
      box-sizing: border-box;
    }

    .notification-check-input:checked + .notification-check-ui {
      background: #5ba3a0;
      border-color: #5ba3a0;
    }

    .notification-check-input:checked + .notification-check-ui::after {
      content: '';
      display: block;
      width: 5px;
      height: 9px;
      border: solid #fff;
      border-width: 0 2px 2px 0;
      transform: rotate(45deg);
      margin: 2px auto 0;
    }

    .notification-check-input:focus-visible + .notification-check-ui {
      outline: 2px solid #5ba3a0;
      outline-offset: 2px;
    }

    /* 프로젝트 추가 · 시험 토글 (일정등록 알림 체크와 동일) */
    .ap-exam-enable-label {
      position: relative;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding-left: 28px;
      min-height: 24px;
      cursor: pointer;
      user-select: none;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 12.5px;
      font-weight: 500;
      color: var(--text);
    }

    .ap-exam-check-input {
      position: absolute;
      left: 0;
      top: 50%;
      transform: translateY(-50%);
      opacity: 0;
      width: 22px;
      height: 22px;
      margin: 0;
      cursor: pointer;
      z-index: 1;
    }

    .ap-exam-check-ui {
      position: absolute;
      left: 0;
      top: 50%;
      transform: translateY(-50%);
      width: 20px;
      height: 20px;
      border: 1.5px solid #ccc;
      border-radius: 4px;
      flex-shrink: 0;
      pointer-events: none;
      box-sizing: border-box;
    }

    .ap-exam-check-input:checked + .ap-exam-check-ui {
      background: #5ba3a0;
      border-color: #5ba3a0;
    }

    .ap-exam-check-input:checked + .ap-exam-check-ui::after {
      content: '';
      display: block;
      width: 5px;
      height: 9px;
      border: solid #fff;
      border-width: 0 2px 2px 0;
      transform: rotate(45deg);
      margin: 2px auto 0;
    }

    .ap-exam-check-input:focus-visible + .ap-exam-check-ui {
      outline: 2px solid #5ba3a0;
      outline-offset: 2px;
    }

    /* 시험 과목 칩 안 체크 (일정등록 알림 체크와 동일 톤, 소형) */
    .ap-exam-subject-chip {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 6px 10px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: var(--bg);
      font-size: 12px;
      font-weight: 500;
      color: var(--text);
      cursor: pointer;
      user-select: none;
      font-family: 'Noto Sans KR', sans-serif;
    }

    .ap-exam-subject-check-wrap {
      position: relative;
      flex-shrink: 0;
      width: 16px;
      height: 16px;
    }

    .ap-exam-subject-check-input {
      position: absolute;
      left: 0;
      top: 0;
      width: 18px;
      height: 18px;
      margin: 0;
      opacity: 0;
      cursor: pointer;
      z-index: 1;
    }

    .ap-exam-subject-check-ui {
      position: absolute;
      left: 0;
      top: 0;
      width: 16px;
      height: 16px;
      border: 1.5px solid #ccc;
      border-radius: 3px;
      box-sizing: border-box;
      pointer-events: none;
    }

    .ap-exam-subject-check-input:checked + .ap-exam-subject-check-ui {
      background: #5ba3a0;
      border-color: #5ba3a0;
    }

    .ap-exam-subject-check-input:checked + .ap-exam-subject-check-ui::after {
      content: '';
      display: block;
      width: 4px;
      height: 7px;
      border: solid #fff;
      border-width: 0 1.5px 1.5px 0;
      transform: rotate(45deg);
      margin: 1px auto 0;
    }

    .ap-exam-subject-check-input:focus-visible + .ap-exam-subject-check-ui {
      outline: 2px solid #5ba3a0;
      outline-offset: 1px;
    }

    .ap-exam-subject-name {
      line-height: 1.2;
    }

    .ap-exam-selected-summary {
      padding-top: 10px;
      border-top: 1px solid var(--border);
      font-size: 12px;
      font-weight: 500;
      line-height: 1.5;
      color: var(--text);
      font-family: 'Noto Sans KR', sans-serif;
    }

    .notification-group-sep {
      height: 1px;
      background: #eee;
      margin: 12px 15px;
    }

    .notification-save-btn {
      width: 100%;
      margin-top: 20px;
      padding: 14px 16px;
      border: none;
      border-radius: 13px;
      background: #5ba3a0;
      color: #fff;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 15px;
      font-weight: 600;
      cursor: pointer;
    }

    .notification-save-btn:disabled {
      opacity: 0.6;
      cursor: not-allowed;
    }

    .notification-saved-modal {
      display: none;
      position: fixed;
      inset: 0;
      z-index: 3000;
      background: rgba(0, 0, 0, 0.45);
      align-items: center;
      justify-content: center;
      padding: 24px;
    }

    .notification-saved-modal.open {
      display: flex;
    }

    .notification-saved-modal__panel {
      width: 100%;
      max-width: 320px;
      background: #fff;
      border-radius: 16px;
      padding: 22px 20px 18px;
      text-align: center;
      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
    }

    .notification-saved-modal__title {
      font-size: 16px;
      font-weight: 700;
      color: var(--text);
      margin-bottom: 12px;
    }

    .notification-saved-modal__desc {
      font-size: 13px;
      line-height: 1.55;
      color: var(--muted);
      margin: 0 0 18px;
    }

    .notification-saved-modal__ok {
      width: 100%;
      padding: 12px;
      border: none;
      border-radius: 12px;
      background: #5ba3a0;
      color: #fff;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 14px;
      font-weight: 600;
      cursor: pointer;
    }

    #memberSelect .member-chip.selected:not(.member-chip--dot) {
      opacity: 1 !important;
    }

    #apMemberSelect .member-chip.selected:not(.member-chip--dot) {
      opacity: 1 !important;
    }

    /* 홈 오늘: 공휴일·기념일(캘린더 상세와 동일 태그/글자, 외곽 박스 없음) */
    .home-today-kr-holidays {
      margin-bottom: 8px;
    }

    /* 오늘 할 일(.today-task-row padding 10px)과 동일 좌우 여백 → 기념일/공휴일 태그가 이름 뱃지 시작선과 맞음 */
    .home-today-kr-holidays--task-pad {
      padding: 0 10px;
      box-sizing: border-box;
    }

    .home-today-kr-holidays .cal-holiday-detail-row {
      padding: 6px 0;
    }

    .home-today-kr-holidays .cal-holiday-detail-row--follow {
      margin: 0;
      padding-top: 8px;
    }

    /* 설정 — 계정 카드 */
    .account-wrap {
      padding: 18px 16px 28px;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .account-card {
      background: #fff;
      border-radius: 14px;
      border: 0.5px solid #e8e5e0;
      overflow: hidden;
    }

    .account-card-notice {
      background: #eaf4f3;
      padding: 12px 16px;
      border-bottom: 1px solid #d8efec;
    }

    .account-notice-title {
      font-size: 13px;
      font-weight: 500;
      color: #2d7a78;
      margin-bottom: 3px;
    }

    .account-notice-body {
      font-size: 11.5px;
      color: #5a8a88;
      line-height: 1.55;
    }

    .account-card-body {
      padding: 16px;
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .btn-google {
      width: 100%;
      background: #fff;
      color: #444;
      border: 1px solid #e0ddd8;
      border-radius: 10px;
      padding: 12px;
      font-size: 13px;
      font-weight: 500;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      font-family: inherit;
    }

    .btn-google:disabled {
      opacity: 0.65;
      cursor: not-allowed;
    }

    .account-divider {
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .account-divider-line {
      flex: 1;
      height: 1px;
      background: #e8e5e0;
    }

    .account-divider-text {
      font-size: 11px;
      color: #c0bdb8;
    }

    .account-inputs {
      display: flex;
      flex-direction: column;
      gap: 7px;
    }

    .account-input {
      width: 100%;
      box-sizing: border-box;
      border: 1px solid #e0ddd8;
      border-radius: 10px;
      padding: 11px 13px;
      font-size: 13px;
      color: #333;
      background: #fff;
      outline: none;
      font-family: inherit;
    }

    .account-input::placeholder {
      color: #c0bdb8;
    }

    .account-card-body .btn-primary {
      width: 100%;
      background: #5ba3a0;
      color: #fff;
      border: none;
      border-radius: 10px;
      padding: 13px;
      font-size: 13px;
      font-weight: 500;
      cursor: pointer;
      font-family: inherit;
    }

    .account-card-body .btn-primary.btn-primary--outline {
      background: #fff;
      color: #5ba3a0;
      border: 1px solid #5ba3a0;
    }

    .account-card-body .account-logout-btn {
      width: auto;
      min-width: 110px;
      padding: 8px 16px;
      font-size: 12px;
      border-radius: 8px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin: 4px auto 0;
    }

    .account-delete-menu-btn {
      display: block;
      width: 100%;
      margin: 10px auto 0;
      padding: 0;
      border: none;
      background: none;
      font-family: inherit;
      font-size: 12.5px;
      font-weight: 600;
      color: #c45050;
      text-decoration: underline;
      text-underline-offset: 3px;
      cursor: pointer;
      text-align: center;
    }

    .account-delete-menu-btn:hover {
      color: #a33d3d;
    }

    .account-text-links {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 4px;
      padding: 2px 0;
    }

    .account-consent-note {
      margin: 2px 0 2px;
      font-size: 11px;
      color: #97918a;
      text-align: center;
      line-height: 1.4;
    }

    .account-consent-link {
      border: none;
      background: none;
      padding: 0;
      margin: 0;
      color: #5ba3a0;
      font-size: 11px;
      text-decoration: underline;
      cursor: pointer;
      font-family: inherit;
      font-weight: 600;
    }

    .account-text-link {
      background: none;
      border: none;
      color: #999;
      font-size: 12px;
      cursor: pointer;
      font-family: inherit;
      padding: 4px 6px;
    }

    .account-text-sep {
      color: #ddd;
      font-size: 12px;
    }

    .account-helper {
      font-size: 11px;
      color: #bbb;
      text-align: center;
      line-height: 1.7;
      margin: 0;
    }

    .account-signup-panel {
      display: flex;
      flex-direction: column;
      gap: 8px;
      padding: 12px 0 4px;
      border-top: 1px solid #eee;
    }

    .account-signup-panel[hidden] {
      display: none !important;
    }

    .account-signup-title {
      font-size: 12px;
      font-weight: 600;
      color: #666;
    }

    .account-terms-wrap {
      border: 1px solid #ece8e2;
      border-radius: 10px;
      overflow: hidden;
      background: #fff;
    }

    .account-term-row {
      display: flex;
      align-items: center;
      gap: 8px;
      min-height: 40px;
      padding: 0 10px;
      font-size: 12px;
      color: #666;
      border-top: 1px solid #f1eee9;
    }

    .account-term-row:first-child {
      border-top: none;
    }

    .account-term-row--all {
      background: #f6f8f6;
      font-weight: 600;
      color: #5f6663;
    }

    .account-term-check {
      width: 16px;
      height: 16px;
      accent-color: #5ba3a0;
      flex-shrink: 0;
    }

    .account-term-link {
      margin-left: auto;
      border: none;
      background: none;
      color: #7f9ea0;
      font-size: 12px;
      text-decoration: underline;
      cursor: pointer;
      font-family: inherit;
      padding: 2px 0;
    }

    .account-connected-hint {
      margin: 0;
      font-size: 12px;
      color: #888;
      text-align: center;
      line-height: 1.5;
    }

    /* ── 홈 빠른입력 + 바텀시트 ── */
    #quickInputRoot {
      position: fixed;
      right: max(12px, env(safe-area-inset-right));
      /* 네비(72px) + 예정 광고 배너(60px) */
      bottom: calc(132px + env(safe-area-inset-bottom));
      z-index: 220;
      font-family: 'Noto Sans KR', sans-serif;
    }

    #quickInputRoot.quick-input-root--hidden {
      visibility: hidden;
      pointer-events: none;
    }

    /* 시트 열림: FAB는 겹침 방지로 숨김 (닫기는 배경 탭) */
    #quickInputRoot.quick-input-root--sheet-open {
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
    }

    .quick-input-overlay.quick-input-root--hidden,
    .quick-input-sheet.quick-input-root--hidden {
      display: none !important;
      visibility: hidden;
      pointer-events: none;
    }

    .quick-input-fab {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 10px 18px 10px 14px;
      border: none;
      border-radius: 24px;
      background: #5ba3a0;
      color: #fff;
      font-size: 14px;
      font-weight: 600;
      cursor: pointer;
      box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
      font-family: inherit;
    }

    .quick-input-fab svg {
      flex-shrink: 0;
    }

    .quick-input-overlay {
      display: none;
      position: fixed;
      inset: 0;
      background: rgba(0, 0, 0, 0.35);
      z-index: 198;
    }

    .quick-input-overlay.open {
      display: block;
    }

    .quick-input-sheet {
      display: none;
      position: fixed;
      left: 0;
      right: 0;
      bottom: 0;
      max-height: min(78vh, 520px);
      background: #fff;
      border-radius: 18px 18px 0 0;
      box-shadow: 0 -8px 28px rgba(0, 0, 0, 0.12);
      z-index: 210;
      padding: 10px 16px calc(16px + env(safe-area-inset-bottom));
      box-sizing: border-box;
      overflow: auto;
    }

    .quick-input-sheet.open {
      display: block;
    }

    .quick-input-sheet__handle {
      width: 40px;
      height: 4px;
      border-radius: 2px;
      background: #e0ddd8;
      margin: 4px auto 12px;
    }

    .quick-input-sheet__title {
      margin: 0 0 12px;
      font-size: 17px;
      font-weight: 700;
      color: var(--text);
    }

    .quick-input-member-scroll {
      display: flex;
      flex-wrap: nowrap;
      gap: 10px;
      overflow-x: auto;
      padding-bottom: 8px;
      margin-bottom: 0;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: thin;
    }

    .quick-input-member-options-row {
      display: flex;
      flex-wrap: wrap;
      align-items: flex-start;
      gap: 8px 12px;
      margin-bottom: 8px;
    }

    .quick-input-member-options-row .quick-input-member-scroll {
      flex: 1 1 140px;
      min-width: 0;
    }

    .quick-input-inline-opts {
      display: flex;
      flex-direction: row;
      flex-wrap: nowrap;
      align-items: center;
      gap: 14px;
      flex-shrink: 0;
      padding-top: 0;
      min-width: 0;
    }

    /* 알림 설정과 동일 체크 UI(notification-*) — 시트 안에서만 간격·세로 중앙 */
    .quick-input-inline-opts .quick-input-option-row.notification-option-row {
      align-items: center;
      padding: 0 0 0 26px;
      margin: 0;
      white-space: nowrap;
      min-height: 22px;
    }

    .quick-input-inline-opts .quick-input-option-row .notification-check-input,
    .quick-input-inline-opts .quick-input-option-row .notification-check-ui {
      top: 50%;
      transform: translateY(-50%);
    }

    .quick-input-inline-opts .quick-input-option-row .notification-option-text {
      display: flex;
      align-items: center;
      min-height: 20px;
    }

    .quick-input-inline-opts .quick-input-option-row .notification-option-label {
      font-size: 12.5px;
      font-weight: 600;
      line-height: 20px;
    }

    #quickInputMemberSelect .member-chip.member-chip--dot {
      padding: 4px 2px;
      border-radius: 8px;
      border: 1.5px solid transparent;
      background: transparent;
      color: #555;
      font-weight: 500;
      display: inline-flex;
      align-items: center;
      gap: 6px;
    }

    #quickInputMemberSelect .member-chip.member-chip--dot .member-chip-dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      flex-shrink: 0;
      background: var(--member-dot, var(--accent));
    }

    #quickInputMemberSelect .member-chip.member-chip--dot.selected {
      opacity: 1;
      color: var(--text);
      font-weight: 700;
      background: rgba(0, 0, 0, 0.06);
      border-color: transparent;
    }

    .quick-input-sr-only {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }

    .quick-input-format-hint {
      margin: 0 0 8px;
    }

    .quick-input-hint-roll {
      height: 1.35em;
      overflow: hidden;
      font-size: 12px;
      font-weight: 500;
      color: var(--muted);
      letter-spacing: 0.02em;
      line-height: 1.35;
    }

    .quick-input-hint-roll__track {
      display: flex;
      flex-direction: column;
      animation: quick-input-hint-roll 9s linear infinite;
      will-change: transform;
    }

    /* 7줄 한 바퀴(9초): 줄당 약 72% 정지, 나머지 구간에서 빠르게 한 칸 이동 */
    @keyframes quick-input-hint-roll {
      0%,
      10.286% {
        transform: translateY(0);
      }
      14.286%,
      24.571% {
        transform: translateY(-1.35em);
      }
      28.571%,
      38.857% {
        transform: translateY(-2.7em);
      }
      42.857%,
      53.143% {
        transform: translateY(-4.05em);
      }
      57.143%,
      67.429% {
        transform: translateY(-5.4em);
      }
      71.429%,
      81.714% {
        transform: translateY(-6.75em);
      }
      85.714%,
      96% {
        transform: translateY(-8.1em);
      }
      100% {
        transform: translateY(-9.45em);
      }
    }

    .quick-input-hint-roll__line {
      flex-shrink: 0;
      min-height: 1.35em;
      line-height: 1.35;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    /* 음성 인식 안내 롤(자연어 예시) */
    .quick-input-hint-roll--voice .quick-input-hint-roll__line {
      letter-spacing: 0.01em;
    }

    @media (prefers-reduced-motion: reduce) {
      .quick-input-hint-roll {
        height: auto;
      }

      .quick-input-hint-roll__track {
        animation: none;
      }

      .quick-input-hint-roll__line:nth-child(n + 8) {
        display: none;
      }
    }

    /* 마이크 열(44px) + 행 간격(8px)만큼 들여 인풋 시작선과 맞춤 */
    .quick-input-sheet--has-mic .quick-input-format-hint,
    .quick-input-sheet--has-mic .quick-input-hint {
      margin-left: 52px;
    }

    .quick-input-input-row {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 6px;
    }

    .quick-input-mic {
      flex-shrink: 0;
      width: 44px;
      height: 44px;
      border-radius: 12px;
      border: 1.5px solid #5ba3a0;
      background: #fff;
      color: #5ba3a0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      padding: 0;
    }

    .quick-input-mic.quick-input-mic--active {
      background: #5ba3a0;
      color: #fff;
      border-color: #5ba3a0;
    }

    .quick-input-field {
      flex: 1;
      min-width: 0;
      height: 44px;
      border: 1.5px solid var(--border);
      border-radius: 12px;
      padding: 0 12px;
      font-size: 14px;
      font-family: inherit;
      box-sizing: border-box;
    }

    .quick-input-field.quick-input-field--listening {
      border-color: #c44;
      box-shadow: 0 0 0 1px rgba(204, 68, 68, 0.2);
    }

    .quick-input-send {
      flex-shrink: 0;
      height: 44px;
      padding: 0 16px;
      border: none;
      border-radius: 12px;
      background: #5ba3a0;
      color: #fff;
      font-weight: 600;
      font-size: 14px;
      cursor: pointer;
      font-family: inherit;
    }

    .quick-input-send:disabled {
      cursor: default;
    }

    .quick-input-hint {
      font-size: 12px;
      line-height: 1.45;
      color: var(--muted);
      min-height: 0;
      margin-top: 2px;
    }

    .quick-input-listening {
      color: #c33;
      font-weight: 600;
    }

    /* 홈 오늘 — 인물별 카드(단발 + 시간표 + 루틴) */
    .home-today-member-card {
      margin-bottom: 8px;
      background: var(--surface);
      border-radius: var(--radius);
      border: 1px solid var(--border);
      overflow: hidden;
      box-shadow: var(--shadow);
    }

    /* 이름 태그 열 아래로는 선 긋지 않음 — 본문 열(.home-today-card__main)에만 구분선 */
    .home-today-card__body > .home-today-card__row--fullsep:not(:last-child),
    .home-today-card__body > .home-today-card__row--single:not(:last-child) {
      border-bottom: 0.5px solid var(--border);
    }

    .home-today-card__body > .home-today-card__row--with-mem:not(:last-child) .home-today-card__main {
      border-bottom: 0.5px solid var(--border);
    }

    .home-today-card__row--done {
      opacity: 0.4;
    }

    /* ↺ 포함 루틴 행 전체 */
    .home-today-card__row--routine {
      opacity: 0.5;
    }

    /* 이름태그 열은 원색 유지, 루틴 본문만 옅게 */
    #homeContentBody .home-today-card__row--with-mem.home-today-card__row--routine,
    #calDetail .home-today-card__row--with-mem.home-today-card__row--routine {
      opacity: 1;
    }

    #homeContentBody .home-today-card__row--with-mem.home-today-card__row--routine .home-today-card__main--routine,
    #calDetail .home-today-card__row--with-mem.home-today-card__row--routine .home-today-card__main--routine {
      opacity: 0.5;
    }

    /* 오늘 카드·캘린더 일간: NEIS 시간표 줄과 시각적 높이 맞춤 */
    #homeContentBody .home-today-card__row--routine,
    #calDetail .home-today-card__row--routine {
      padding: 5px 10px;
      box-sizing: border-box;
    }

    #homeContentBody .home-today-card__routine-titles,
    #calDetail .home-today-card__routine-titles {
      font-size: 12px;
      line-height: 1.2;
    }

    #homeContentBody .home-today-routine-glyph,
    #calDetail .home-today-routine-glyph {
      font-size: 12px;
    }

    .home-today-card__main--routine .home-today-card__routine-inner {
      min-height: 0;
    }

    .home-today-card__routine-main {
      flex: 1;
      min-width: 0;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 8px;
    }

    .home-today-card__routine-titles {
      flex: 1;
      min-width: 0;
      display: flex;
      align-items: center;
      flex-wrap: nowrap;
      gap: 8px;
      font-size: 13px;
      color: var(--text);
      line-height: 1.25;
    }

    .home-today-routine-glyph {
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      align-self: stretch;
      width: 20px;
      min-width: 20px;
      box-sizing: border-box;
      font-size: 14px;
      line-height: 1;
    }

    .home-today-routine-glyph svg {
      width: 12px;
      height: 12px;
      display: block;
    }

    .home-today-card__routine-main .schedule-meta-end {
      flex-shrink: 0;
      margin-left: auto;
    }

    /* NEIS 시간표 줄도 일반 루틴 행과 동일 톤(↺·학교칩·텍스트 일괄 0.5) */
    .home-today-card__row--timetable {
      padding: 0;
      opacity: 0.5;
    }

    /* 이름태그 열은 원색 유지, 시간표 본문만 옅게 */
    #homeContentBody .home-today-card__row--with-mem.home-today-card__row--timetable,
    #calDetail .home-today-card__row--with-mem.home-today-card__row--timetable {
      opacity: 1;
    }

    #homeContentBody .home-today-card__row--with-mem.home-today-card__row--timetable .home-today-card__main--timetable,
    #calDetail .home-today-card__row--with-mem.home-today-card__row--timetable .home-today-card__main--timetable {
      opacity: 0.5;
    }

    .home-today-card__row--timetable .home-routine-timetable-row {
      padding: 5px 10px;
      box-sizing: border-box;
    }

    .home-today-card__main--timetable .home-routine-timetable-row {
      padding: 5px 10px;
      padding-left: 0;
      box-sizing: border-box;
    }

    /* 단발일정 행은 padding 10px이라 하단 여백이 큼; 바로 아래 시간표·루틴에 상단 5px까지 더해져 윗쪽만 넓어 보임 → 상단 패딩만 제거 */
    #homeContentBody .home-today-card__body > .today-task-row + .home-today-card__row--timetable .home-routine-timetable-row,
    #calDetail .home-today-card__body > .today-task-row + .home-today-card__row--timetable .home-routine-timetable-row {
      padding-top: 0;
    }

    #homeContentBody .home-today-card__body > .today-task-row + .home-today-card__row--routine,
    #calDetail .home-today-card__body > .today-task-row + .home-today-card__row--routine {
      padding-top: 0;
    }

    /* 홈 오늘 — NEIS 시간표 (멤버 → 학교 → 과목). 캘린더 상세는 동일 마크업, 홈만 --subtle */
    .home-today-timetable-wrap {
      margin-bottom: 10px;
    }

    /* 시간표 줄: 단발 일정(.today-task-row)과 동일 — 별도 배경·하단선 없음 */
    .home-today-timetable-wrap--subtle {
      margin: 0;
      padding: 0;
      border-radius: 0;
      border: none;
      background: transparent;
    }

    /* 패딩은 .home-timetable-tasklike-row에만 (단발 일정 .today-task-row과 열 맞춤) */
    .home-today-schedule-box .home-timetable-in-member-slot.home-today-timetable-wrap--subtle {
      margin: 0;
      padding: 0;
      border-radius: 0;
      border: none;
      background: transparent;
    }

    .home-today-schedule-box .home-timetable-in-member-slot--before-tasks .home-timetable-tasklike-row {
      padding-bottom: 2px;
    }

    /* 시간표: 이름 | 체크(20px) | [학교칩+6교시·과목] — 단발 일정 행과 열 일치, 학교↔6교시 사이 빈칸 없음 */
    .home-timetable-tasklike-row {
      display: grid;
      grid-template-columns: auto 20px minmax(0, 1fr);
      column-gap: 8px;
      row-gap: 2px;
      align-items: center;
      padding: 7px 10px;
      box-sizing: border-box;
    }

    .home-timetable-tasklike-row--single {
      grid-template-columns: 20px minmax(0, 1fr);
    }

    .home-timetable-grid-mem {
      display: flex;
      align-items: center;
      align-self: stretch;
      padding-top: 0;
    }

    .home-timetable-checkbox-gap {
      width: 20px;
      min-width: 20px;
      height: 20px;
      flex-shrink: 0;
    }

    .home-timetable-body--subjects {
      min-width: 0;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 6px;
    }

    .home-timetable-body {
      min-width: 0;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 6px;
    }

    /* 홈 루틴 카드(NEIS 시간표 줄 포함) — 기본 패딩(오늘 카드 멤버 영역에서 루틴 행과 맞춤) */
    .home-routine-timetable-row {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 5px 10px;
      box-sizing: border-box;
    }

    .home-routine-tt-mem {
      flex-shrink: 0;
      display: flex;
      align-items: center;
      align-self: stretch;
      padding-top: 0;
    }

    .home-routine-tt-main {
      flex: 1;
      min-width: 0;
    }

    /* 이름 | [학교칩·N교시·과목] — 3열 그리드: 학교칩·교시·첫 줄 과목 수직 가운데 정렬 */
    .home-routine-tt-main-grid {
      display: grid;
      grid-template-columns: auto auto minmax(0, 1fr);
      column-gap: 0.4em;
      row-gap: 0.12em;
      align-items: center;
      width: 100%;
      max-width: 100%;
      min-width: 0;
    }

    .home-routine-tt-main-grid > .home-routine-tt-school {
      display: flex;
      align-items: center;
      justify-content: center;
      align-self: center;
      flex-shrink: 0;
    }

    .home-routine-tt-main-grid .tt-kicker {
      white-space: nowrap;
      font-size: 10px;
      font-weight: 600;
      color: var(--muted);
      line-height: 1.35;
    }

    .home-routine-tt-main-grid .tt-subjects-cell {
      min-width: 0;
      font-size: 11px;
      line-height: 1.42;
    }

    .home-routine-tt-main-grid .tt-subjects {
      display: inline;
      word-break: keep-all;
      overflow-wrap: anywhere;
    }

    .home-routine-tt-main-grid .tt-weekday-hint {
      display: inline;
      margin-left: 0.35em;
      font-size: 10px;
      font-weight: 400;
      color: var(--muted);
      white-space: nowrap;
      vertical-align: baseline;
    }

    /* 홈 루틴 — NEIS 시간표 한 줄(접힘): 학교·교시·요일·▼ / 탭 시 과목 pill */
    .home-routine-timetable-row--collapsible {
      align-items: center;
    }

    .home-routine-timetable-row--collapsible.is-expanded {
      align-items: flex-start;
    }

    /* 펼침 시 ↺는 전체 블록 높이에 맞춰 늘어나지 않고 학교 태그·교시 첫 줄에만 맞춤 */
    .home-routine-timetable-row--collapsible.is-expanded .home-routine-tt-leading-glyph {
      align-self: flex-start;
    }

    .home-routine-timetable-row--collapsible.is-expanded .home-routine-tt-mem {
      align-self: flex-start;
    }

    /* 학교 칩 열 | 요일·교시 열 — 펼친 과목 pill도 두 번째 열 시작선(요일 텍스트)에 맞춤 */
    .home-routine-tt-main--collapsible.home-routine-tt-collapsible-grid {
      display: grid;
      grid-template-columns: auto 1fr;
      column-gap: 6px;
      row-gap: 0;
      align-items: center;
      min-width: 0;
      flex: 1;
    }

    .home-routine-tt-school-slot,
    .home-routine-tt-head-rest {
      align-self: center;
    }

    .home-routine-tt-row2-gutter,
    .home-routine-tt-pills-outer {
      align-self: start;
    }

    /* 버튼은 그리드 박스를 만들지 않고, 학교/헤더만 1·2열에 올려 열 너비 = 학교칩 vs 요일 열 */
    .home-routine-tt-toggle.home-routine-tt-toggle--grid-contents {
      display: contents;
    }

    .home-routine-tt-school-slot {
      display: flex;
      align-items: center;
      min-width: 0;
    }

    .home-routine-tt-school-slot .school-sync-chip {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .home-routine-tt-head-rest {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 0;
      min-width: 0;
      flex: 1;
    }

    .home-routine-tt-head {
      appearance: none;
      border: none;
      background: none;
      padding: 0;
      margin: 0;
      font: inherit;
      text-align: left;
      cursor: pointer;
      color: inherit;
      -webkit-tap-highlight-color: transparent;
    }

    .home-routine-tt-row2-gutter {
      min-height: 0;
    }

    .home-routine-tt-pills-outer {
      min-width: 0;
    }

    .home-routine-tt-meta {
      display: inline-flex;
      align-items: center;
      flex-shrink: 1;
      min-width: 0;
      line-height: 1.25;
    }

    .home-routine-tt-meta .home-routine-tt-weekday,
    .home-routine-tt-meta .home-routine-tt-kicker-text,
    .home-routine-tt-meta .home-routine-tt-wd-sep {
      font-size: 11px;
      font-weight: 400;
      color: var(--muted);
      line-height: 1.25;
    }

    .home-routine-tt-meta .home-routine-tt-weekday,
    .home-routine-tt-meta .home-routine-tt-kicker-text {
      white-space: nowrap;
    }

    .home-routine-tt-meta .home-routine-tt-wd-sep {
      flex-shrink: 0;
      padding: 0 3px;
      user-select: none;
    }

    .home-routine-tt-kicker-text {
      flex-shrink: 0;
      font-size: 11px;
      font-weight: 400;
      color: var(--muted);
      line-height: 1.25;
      white-space: nowrap;
    }

    /* 홈 오늘·일간 카드: NEIS 접힘 줄의 요일·교시 줄박스를 ↺ 루틴 제목(#homeContentBody .home-today-card__routine-titles)과 동일 */
    #homeContentBody .home-today-member-card .home-routine-tt-meta,
    #calDetail .home-today-member-card .home-routine-tt-meta {
      line-height: 1.2;
    }

    #homeContentBody .home-today-member-card .home-routine-tt-meta .home-routine-tt-weekday,
    #homeContentBody .home-today-member-card .home-routine-tt-meta .home-routine-tt-kicker-text,
    #calDetail .home-today-member-card .home-routine-tt-meta .home-routine-tt-weekday,
    #calDetail .home-today-member-card .home-routine-tt-meta .home-routine-tt-kicker-text {
      font-size: 12px;
      line-height: 1.2;
    }

    .home-routine-tt-chevron {
      flex-shrink: 0;
      margin-left: auto;
      display: inline-flex;
      align-items: center;
      align-self: center;
      font-size: 10px;
      line-height: 1;
      color: var(--muted);
    }

    .home-routine-tt-chevron::after {
      content: '▼';
    }

    .home-routine-timetable-row--collapsible.is-expanded .home-routine-tt-chevron::after {
      content: '▲';
    }

    .home-routine-tt-expand {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.25s ease;
    }

    .home-routine-timetable-row--collapsible.is-expanded .home-routine-tt-expand {
      max-height: 400px;
    }

    .home-routine-tt-pills {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 6px;
      padding-top: 6px;
      box-sizing: border-box;
    }

    .home-routine-tt-pill {
      background: #f4f4f2;
      border-radius: 10px;
      font-size: 11px;
      font-weight: 400;
      color: var(--text);
      padding: 3px 8px;
      line-height: 1.35;
      max-width: 100%;
      word-break: keep-all;
      overflow-wrap: anywhere;
    }

    .cal-timetable-in-card .home-timetable-tasklike-row,
    .cal-timetable-orphan-wrap .home-timetable-tasklike-row {
      padding-top: 7px;
      padding-bottom: 7px;
    }

    .home-timetable-in-member-slot--before-tasks {
      border-bottom: none;
    }

    .home-today-timetable-wrap--subtle .home-timetable-pill {
      font-size: 0.65rem;
      padding: 1px 6px;
      background: #ececec;
      color: #949494;
      font-weight: 400;
    }

    .home-timetable-plain-text {
      flex: 1 1 0;
      min-width: 0;
      font-size: 11px;
      line-height: 1.42;
      font-weight: 400;
      color: var(--text);
      word-break: keep-all;
      overflow-wrap: anywhere;
    }

    .home-today-timetable-wrap--subtle .home-timetable-plain-text {
      font-size: 11px;
      color: var(--text);
      opacity: 1;
    }

    /* N교시 | 과목 — Grid로 2열 고정(꼬리표는 한 줄), 과목만 넓게 줄바꿈 */
    .home-timetable-plain-text--split {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      column-gap: 0.4em;
      row-gap: 0.12em;
      align-items: start;
      width: 100%;
      max-width: 100%;
      min-width: 0;
    }

    .home-timetable-plain-text--split .tt-kicker {
      grid-column: 1;
      white-space: nowrap;
      font-size: 10px;
      font-weight: 600;
      color: var(--muted);
      line-height: 1.35;
    }

    .home-timetable-plain-text--split .tt-subjects-cell {
      grid-column: 2;
      min-width: 0;
      font-size: 11px;
      line-height: 1.42;
    }

    .home-timetable-plain-text--split .tt-subjects {
      display: inline;
      word-break: keep-all;
      overflow-wrap: anywhere;
    }

    .home-timetable-plain-text--split .tt-weekday-hint {
      display: inline;
      margin-left: 0.35em;
      font-size: 10px;
      font-weight: 400;
      color: var(--muted);
      white-space: nowrap;
      vertical-align: baseline;
    }

    .cal-detail-timetable-mount {
      min-height: 0;
    }

    .cal-detail-timetable-wrap {
      margin-bottom: 10px;
    }

    .home-timetable-member-row {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 6px;
      margin-bottom: 6px;
    }

    .home-timetable-member-row:has(.home-timetable-plain-text--split) {
      align-items: center;
    }

    .home-timetable-member-row:last-child {
      margin-bottom: 0;
    }

    .home-timetable-who {
      flex-shrink: 0;
      display: inline-flex;
      align-items: center;
    }

    .home-timetable-pill {
      display: inline-block;
      padding: 2px 8px;
      border-radius: 999px;
      background: #f0f0f0;
      color: #666;
      font-size: 0.75rem;
      line-height: 1.35;
      font-weight: 500;
      max-width: 100%;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .timetable-sync-status {
      position: fixed;
      bottom: calc(88px + env(safe-area-inset-bottom, 0px));
      left: 50%;
      transform: translateX(-50%);
      z-index: 2400;
      padding: 8px 14px;
      border-radius: 10px;
      background: rgba(30, 32, 38, 0.88);
      color: #fff;
      font-size: 13px;
      font-family: 'Noto Sans KR', sans-serif;
      pointer-events: none;
      box-shadow: 0 2px 12px rgba(0, 0, 0, 0.18);
    }

    .timetable-toast-msg {
      position: fixed;
      bottom: calc(120px + env(safe-area-inset-bottom, 0px));
      left: 50%;
      transform: translateX(-50%) translateY(8px);
      z-index: 2410;
      padding: 9px 16px;
      border-radius: 10px;
      background: rgba(30, 32, 38, 0.9);
      color: #fff;
      font-size: 13px;
      font-family: 'Noto Sans KR', sans-serif;
      opacity: 0;
      transition: opacity 0.2s ease, transform 0.2s ease;
      pointer-events: none;
    }

    .timetable-toast-msg--show {
      opacity: 1;
      transform: translateX(-50%) translateY(0);
    }

    .mb-timetable-refresh-btn {
      padding: 4px 10px;
      font-size: 12px;
      border-radius: 8px;
      border: 1px solid var(--border);
      background: var(--surface);
      color: var(--muted);
      cursor: pointer;
      font-family: 'Noto Sans KR', sans-serif;
    }

    .mb-timetable-refresh-btn:active {
      opacity: 0.85;
    }