:root {
  color-scheme: light;
  --navy: #17365d;
  --navy-dark: #102945;
  --blue-soft: #edf3f8;
  --paper: #ffffff;
  --background: #f4f6f8;
  --text: #1c2630;
  --muted: #64717d;
  --line: #dfe5ea;
  --shadow: 0 10px 30px rgba(17, 42, 70, 0.09);
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  min-height: 100vh;
  padding: env(safe-area-inset-top) 16px env(safe-area-inset-bottom);
  background: linear-gradient(180deg, #edf2f6 0, var(--background) 240px);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
}

.portal-shell {
  width: min(100%, 520px);
  margin: 0 auto;
  padding: 14px 0 30px;
}

.hero {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 2px 4px 10px;
}

.brand-mark {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  border-radius: 11px;
  background: var(--navy);
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 23px;
  font-weight: 700;
  box-shadow: 0 5px 13px rgba(23, 54, 93, 0.22);
}

.eyebrow {
  margin: 0 0 1px;
  color: var(--navy);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .15em;
}

h1 {
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
}

.mission-card,
.section-card {
  margin-bottom: 15px;
  border: 1px solid rgba(23, 54, 93, .08);
  border-radius: 18px;
  background: var(--paper);
  box-shadow: var(--shadow);
}

.mission-card {
  padding: 16px 18px;
  text-align: center;
  background: linear-gradient(135deg, var(--navy-dark), var(--navy));
  color: #fff;
}

.section-label {
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .18em;
  opacity: .75;
}

.mission-text {
  margin: 0;
  font-size: clamp(21px, 6vw, 28px);
  font-weight: 800;
  letter-spacing: .03em;
}

.section-card { padding: 19px; }

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

.section-heading h2 {
  margin: 0;
  font-size: 18px;
}

.application-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.application-button {
  display: flex;
  min-height: 86px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 8px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  color: var(--text);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
  text-decoration: none;
  transition: transform .12s ease, border-color .12s ease, background .12s ease;
}

.application-button:active {
  transform: scale(.98);
  border-color: #a9baca;
  background: var(--blue-soft);
}

.application-icon { font-size: 25px; }

.culture-copy {
  margin: -3px 0 15px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.7;
}

.culture-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 54px;
  padding: 0 17px;
  border-radius: 13px;
  background: var(--navy);
  color: #fff;
  font-size: 15px;
  font-weight: 800;
  text-decoration: none;
}

.culture-button span { font-size: 28px; font-weight: 300; }

.footer-note {
  margin: 18px 8px 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
  text-align: center;
}

.error-message {
  margin: 15px 0 0;
  padding: 12px;
  border-radius: 10px;
  background: #fff0f0;
  color: #a22121;
  font-size: 13px;
}

@media (max-width: 340px) {
  body { padding-left: 10px; padding-right: 10px; }
  .section-card { padding: 15px; }
  .application-button { font-size: 13px; }
}

@media (min-width: 700px) {
  .portal-shell { padding-top: 40px; }
  .application-button:hover {
    border-color: #a9baca;
    background: var(--blue-soft);
  }
}

.today-mvv-label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  margin: 0 0 9px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
  opacity: .86;
}

.mvv-divider { opacity: .65; }

.line-status {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: -4px 0 15px;
  color: var(--muted);
  font-size: 12px;
}

.status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #9aa6b2;
}

.line-status[data-state="connected"] .status-dot { background: #19a463; }
.line-status[data-state="pending"] .status-dot { background: #d99b16; }
.line-status[data-state="error"] .status-dot { background: #cf3f3f; }

.auth-card {
  margin-bottom: 15px;
  padding: 19px;
  border: 1px solid rgba(23, 54, 93, .08);
  border-radius: 18px;
  background: var(--paper);
  box-shadow: var(--shadow);
}
.auth-title { margin: 0 0 8px; color: var(--navy); font-size: 18px; font-weight: 800; }
.auth-copy { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.7; }
.employee-form { display: grid; gap: 10px; margin-top: 16px; }
.employee-form label { font-size: 13px; font-weight: 800; }
.employee-form input {
  width: 100%; min-height: 48px; padding: 0 14px;
  border: 1px solid var(--line); border-radius: 12px;
  font: inherit; font-size: 16px; outline: none;
}
.employee-form input:focus { border-color: var(--navy); box-shadow: 0 0 0 3px rgba(23,54,93,.1); }
.primary-button, .secondary-button {
  width: 100%; min-height: 48px; border-radius: 12px;
  font: inherit; font-size: 15px; font-weight: 800; cursor: pointer;
}
.primary-button { border: 0; background: var(--navy); color: #fff; }
.secondary-button { margin-top: 10px; border: 1px solid var(--line); background: #fff; color: var(--navy); }
.form-message { margin: 12px 0 0; color: #a22121; font-size: 13px; line-height: 1.6; }
.employee-details { margin: 14px 0 16px; }
.employee-details div { display: grid; grid-template-columns: 72px 1fr; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--line); }
.employee-details dt { color: var(--muted); font-size: 12px; font-weight: 700; }
.employee-details dd { margin: 0; font-size: 14px; font-weight: 700; line-height: 1.5; }


.employee-welcome {
  display: grid;
  gap: 3px;
  margin: -4px 0 12px;
  padding: 12px 15px;
  border: 1px solid rgba(23, 54, 93, .10);
  border-radius: 14px;
  background: rgba(255,255,255,.82);
  box-shadow: 0 5px 18px rgba(17,42,70,.05);
}
.employee-welcome-label {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
}
.employee-welcome strong {
  color: var(--navy);
  font-size: 16px;
}
.employee-welcome span:last-child {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.confirmation-summary {
  margin: -2px 0 14px;
  color: var(--navy);
  font-size: 17px;
  font-weight: 800;
}
.confirmation-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 52px;
  padding: 0 17px;
  border: 0;
  border-radius: 13px;
  background: var(--navy);
  color: #fff;
  font: inherit;
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
}
.confirmation-button span { font-size: 28px; font-weight: 300; }
.confirmation-note {
  margin: 10px 2px 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.55;
}
.confirmation-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
}
.confirmation-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 20, 34, .55);
  backdrop-filter: blur(3px);
}
.confirmation-modal-panel {
  position: absolute;
  left: 50%;
  bottom: 0;
  width: min(100%, 560px);
  max-height: 88vh;
  padding: 20px 18px calc(22px + env(safe-area-inset-bottom));
  overflow-y: auto;
  transform: translateX(-50%);
  border-radius: 22px 22px 0 0;
  background: var(--paper);
  box-shadow: 0 -12px 42px rgba(7,20,34,.24);
}
.confirmation-modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.confirmation-modal-header h2 { margin: 0; font-size: 20px; }
.confirmation-modal-eyebrow {
  margin: 0 0 3px;
  color: var(--navy);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .14em;
}
.modal-close {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: #fff;
  color: var(--navy);
  font-size: 25px;
  line-height: 1;
  cursor: pointer;
}
.confirmation-modal-summary {
  margin: 0 0 15px;
  color: var(--navy);
  font-size: 15px;
  font-weight: 800;
}
.confirmation-group {
  margin-bottom: 10px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: #fff;
}
.confirmation-group-toggle {
  width: 100%;
  min-height: 50px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 20px;
  align-items: center;
  gap: 9px;
  padding: 11px 13px;
  border: 0;
  background: #f8fafc;
  color: var(--navy);
  text-align: left;
  cursor: pointer;
}
.confirmation-group.is-open .confirmation-group-toggle { background: #eef4f9; }
.confirmation-group-title {
  min-width: 0;
  font-size: 14px;
  font-weight: 800;
  overflow-wrap: anywhere;
}
.confirmation-group-count {
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
  white-space: nowrap;
}
.confirmation-group-chevron {
  display: inline-block;
  font-size: 20px;
  line-height: 1;
  text-align: center;
  transition: transform .18s ease;
}
.confirmation-group.is-open .confirmation-group-chevron { transform: rotate(180deg); }
.confirmation-group-members { padding: 0 13px 5px; }
.confirmation-person {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 7px 2px;
}
.confirmation-person + .confirmation-person { border-top: 1px solid #edf0f3; }
.confirmation-status-dot {
  width: 11px;
  height: 11px;
  flex: 0 0 11px;
  border-radius: 50%;
  background: #b8c0c8;
}
.confirmation-person.is-confirmed .confirmation-status-dot { background: #19a463; }
.confirmation-person-text { display: grid; gap: 2px; }
.confirmation-person-name { font-size: 14px; font-weight: 750; }
.confirmation-person-department { color: var(--muted); font-size: 10px; line-height: 1.4; }
.confirmation-modal-note {
  margin: 14px 0 0;
  color: var(--muted);
  font-size: 11px;
  text-align: center;
}
body.modal-open { overflow: hidden; }

/* Announcements v1.2 */
.section-heading-split { justify-content: space-between; }
.section-heading-main { display:flex; align-items:center; gap:8px; }
.text-button { border:0; background:transparent; color:var(--navy); font:inherit; font-size:13px; font-weight:800; cursor:pointer; }
.announcement-preview { display:grid; gap:9px; }
.announcement-item { padding:13px 14px; border:1px solid var(--line); border-radius:13px; background:#fff; }
.announcement-item.is-important { border-color:#e9b4b4; background:#fff8f8; }
.announcement-item-head { display:flex; align-items:center; gap:8px; margin-bottom:5px; }
.announcement-badge { display:inline-flex; align-items:center; min-height:21px; padding:0 7px; border-radius:999px; background:#e9eef4; color:var(--navy); font-size:10px; font-weight:800; }
.announcement-badge.important { background:#b42323; color:#fff; }
.announcement-title { margin:0; color:var(--text); font-size:14px; font-weight:800; line-height:1.45; }
.announcement-date { margin-left:auto; color:var(--muted); font-size:10px; white-space:nowrap; }
.announcement-body { margin:0; color:var(--muted); font-size:12px; line-height:1.65; white-space:pre-wrap; }
.announcement-empty { margin:0; color:var(--muted); font-size:13px; }
.announcement-list-button { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:46px; margin-top:11px; padding:0 14px; border:1px solid var(--line); border-radius:12px; background:#fff; color:var(--navy); font:inherit; font-size:13px; font-weight:800; cursor:pointer; }
.announcement-list-button span { font-size:24px; font-weight:300; }
.announcements-list { display:grid; gap:10px; }
.manager-panel { max-height:94vh; }
.announcement-form { display:grid; gap:13px; padding:14px; border:1px solid var(--line); border-radius:15px; background:#f8fafc; }
.announcement-form label { display:grid; gap:6px; color:var(--navy); font-size:12px; font-weight:800; }
.announcement-form input,.announcement-form textarea,.announcement-form select { width:100%; padding:11px 12px; border:1px solid var(--line); border-radius:10px; background:#fff; color:var(--text); font:inherit; font-size:14px; }
.announcement-form textarea { resize:vertical; }
.form-grid-two { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.manager-actions { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.manager-actions .secondary-button { margin-top:0; }
.manager-list-title { margin:20px 2px 10px; color:var(--navy); font-size:15px; }
.announcement-manager-list { display:grid; gap:9px; }
.manager-item { padding:12px 13px; border:1px solid var(--line); border-radius:12px; background:#fff; }
.manager-item-top { display:flex; gap:8px; align-items:flex-start; }
.manager-item-title { flex:1; font-size:13px; font-weight:800; line-height:1.5; }
.manager-item-meta { margin-top:6px; color:var(--muted); font-size:10px; line-height:1.5; }
.manager-edit-button { border:1px solid var(--line); border-radius:9px; background:#fff; color:var(--navy); padding:7px 10px; font:inherit; font-size:11px; font-weight:800; cursor:pointer; }
.status-pill { display:inline-flex; padding:2px 7px; border-radius:999px; background:#edf2f6; color:var(--muted); font-size:9px; font-weight:800; }
.status-pill.published { background:#e7f7ef; color:#167a4d; }
@media (max-width:380px){ .form-grid-two,.manager-actions{grid-template-columns:1fr;} }


/* v1.2.3 compact header */
.hero.hero-compact {
  min-height: 0;
  padding: 10px 13px;
  margin-bottom: 10px;
  gap: 9px;
  border-radius: 12px;
}
.hero.hero-compact .brand-mark {
  width: 30px;
  height: 30px;
  min-width: 30px;
  font-size: 15px;
}
.hero.hero-compact h1 {
  margin: 0;
  font-size: 15px;
  line-height: 1.2;
  letter-spacing: .01em;
}
.hero.hero-compact h1 span:first-child {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  opacity: .72;
}
.portal-title-divider {
  margin: 0 5px;
  opacity: .45;
}
.mission-card {
  padding-top: 16px;
  padding-bottom: 16px;
}
.today-mvv-label {
  white-space: nowrap;
  font-size: 13px;
  margin-bottom: 7px;
}


/* Thanks cards */
.thanks-card { overflow: hidden; }
.thanks-summary-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:12px 0 14px; }
.thanks-summary-item { background:#f7f9fc; border:1px solid #e5eaf1; border-radius:14px; padding:13px 12px; display:flex; flex-direction:column; gap:4px; }
.thanks-summary-label { font-size:12px; color:#667085; }
.thanks-summary-value { font-size:23px; color:#17365d; }
.thanks-home-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.primary-action-button,.secondary-action-button { border-radius:12px; padding:12px 10px; font-weight:700; font-size:14px; cursor:pointer; }
.primary-action-button { border:1px solid #17365d; background:#17365d; color:white; }
.secondary-action-button { border:1px solid #cbd5e1; background:white; color:#17365d; }
.thanks-panel { max-width:600px; }
.thanks-tabs { display:grid; grid-template-columns:1fr 1fr; gap:6px; padding:5px; background:#f3f5f8; border-radius:12px; margin:12px 0; }
.thanks-tab { border:0; background:transparent; border-radius:9px; padding:10px; font-weight:700; color:#667085; }
.thanks-tab.is-active { background:white; color:#17365d; box-shadow:0 1px 4px rgba(0,0,0,.08); }
.thanks-monthly-breakdown { display:flex; gap:8px; overflow-x:auto; padding-bottom:8px; }
.thanks-month-item { min-width:115px; background:#f8fafc; border:1px solid #e5eaf1; border-radius:11px; padding:10px; display:flex; justify-content:space-between; gap:8px; font-size:13px; }
.thanks-cards-list { display:grid; gap:10px; padding-bottom:20px; }
.thanks-message-card { position:relative; border:1px solid #e5eaf1; border-radius:14px; padding:14px; background:white; }
.thanks-message-card.is-unread { border-color:#e5b94c; background:#fffdf5; cursor:pointer; }
.thanks-message-head { display:flex; justify-content:space-between; gap:12px; margin-bottom:8px; color:#17365d; }
.thanks-message-head span { color:#7a8492; font-size:12px; white-space:nowrap; }
.thanks-message-card p { white-space:pre-wrap; margin:0; line-height:1.7; color:#333; }
.thanks-unread-badge { position:absolute; right:12px; bottom:10px; font-size:11px; background:#f5c451; color:#5f4600; padding:3px 7px; border-radius:999px; }
.thanks-form { display:grid; gap:9px; }
.thanks-form label { font-weight:700; font-size:14px; color:#344054; }
.thanks-form textarea { width:100%; border:1px solid #cfd6df; border-radius:11px; padding:11px; font:inherit; background:white; }
.thanks-character-count { text-align:right; font-size:12px; color:#7a8492; margin-top:-5px; }
.thanks-confirm-panel { padding:13px; border-radius:12px; background:#f7f9fc; border:1px solid #dce3ec; }
.thanks-confirm-label { font-size:12px; color:#667085; margin:0 0 6px; }
.thanks-confirm-panel strong { color:#17365d; }
.thanks-confirm-panel p:last-child { white-space:pre-wrap; margin-bottom:0; line-height:1.7; }
@media (max-width:420px) { .thanks-home-actions { grid-template-columns:1fr; } }

.thanks-recipient-picker { display:grid; gap:8px; max-height:360px; overflow:auto; padding:2px; }
.thanks-recipient-company { border:1px solid #dce3ec; border-radius:12px; background:#fff; overflow:hidden; }
.thanks-recipient-company-toggle { width:100%; border:0; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; font:inherit; font-weight:700; text-align:left; color:#17365d; background:#f7f9fc; }
.thanks-recipient-company-toggle::before { content:"▶"; font-size:11px; transition:transform .15s ease; }
.thanks-recipient-company.is-open .thanks-recipient-company-toggle::before { transform:rotate(90deg); }
.thanks-recipient-company-toggle span:first-child { flex:1; }
.thanks-recipient-count { color:#667085; font-size:12px; font-weight:600; }
.thanks-recipient-list { display:grid; padding:7px; gap:6px; border-top:1px solid #e5eaf1; }
.thanks-recipient-option { border:1px solid transparent; background:#fff; border-radius:10px; padding:10px 11px; text-align:left; display:flex; flex-direction:column; gap:2px; cursor:pointer; color:#25364a; }
.thanks-recipient-option:hover { background:#f7f9fc; }
.thanks-recipient-option.is-selected { border-color:#2f69a5; background:#edf5ff; box-shadow:0 0 0 1px rgba(47,105,165,.08); }
.thanks-recipient-option strong { font-size:14px; }
.thanks-recipient-option span { font-size:11px; color:#667085; line-height:1.4; }

.thanks-recipient-list[hidden] { display:none !important; }


/* v1.3.4 stable recipient picker */
.thanks-recipient-picker { max-height: 430px; overflow-y: auto; display:block; padding:2px; }
.thanks-picker-help { margin:0 0 8px; color:#667085; font-size:12px; }
.thanks-company-choice { width:100%; min-height:56px; margin-bottom:8px; padding:0 15px; border:1px solid #dce3ec; border-radius:12px; background:#f7f9fc; color:#17365d; display:flex; align-items:center; justify-content:space-between; gap:12px; font:inherit; text-align:left; cursor:pointer; }
.thanks-company-choice strong { font-size:15px; }
.thanks-company-choice span { color:#667085; font-size:12px; white-space:nowrap; }
.thanks-employee-list-header { position:sticky; top:0; z-index:2; margin-bottom:8px; padding:7px 2px 9px; background:var(--paper); display:flex; align-items:center; gap:12px; border-bottom:1px solid #e5eaf1; }
.thanks-picker-back { border:0; background:transparent; color:#17365d; padding:6px 4px; font:inherit; font-size:13px; font-weight:800; cursor:pointer; }
.thanks-employee-list-header > strong { font-size:14px; color:#17365d; }
.thanks-employee-choice-list { display:flex; flex-direction:column; gap:6px; }
.thanks-employee-choice-list .thanks-recipient-option { width:100%; min-height:54px; flex:0 0 auto; box-sizing:border-box; }

/* v1.3.5 recipient selection feedback */
.thanks-selected-recipient { margin:0 0 8px; padding:10px 12px; border:1px solid #9fc3e8; border-radius:10px; background:#edf5ff; color:#17365d; font-size:13px; font-weight:800; }
.thanks-recipient-option { position:relative; }
.thanks-recipient-option.is-selected::after { content:"選択中"; position:absolute; right:10px; top:50%; transform:translateY(-50%); padding:3px 7px; border-radius:999px; background:#17365d; color:#fff; font-size:10px; font-weight:800; }
.thanks-recipient-option.is-selected { padding-right:70px; }

.mood-gate { text-align:center; }
.mood-gate-eyebrow { margin:0 0 4px; font-size:12px; font-weight:800; letter-spacing:.12em; color:#68778a; }
.mood-gate-title { margin:0 0 8px; font-size:24px; color:#17365d; }
.mood-options { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:20px; }
.mood-option { min-height:104px; border:1px solid #dce3ec; border-radius:16px; background:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px; font:inherit; color:#17365d; cursor:pointer; }
.mood-option:active { transform:scale(.98); }
.mood-option:disabled { opacity:.55; }
.mood-icon { font-size:34px; line-height:1; }
.today-mood-card { margin:0 0 14px; padding:12px 14px; border:1px solid #dce3ec; border-radius:14px; background:#fff; display:flex; align-items:center; gap:10px; }
.today-mood-card > span { color:#68778a; font-size:13px; }
.today-mood-card > strong { color:#17365d; flex:1; }
@media (max-width:380px) { .mood-options { gap:7px; } .mood-option { min-height:94px; } }

/* Ver.1.4.1 mood selector redesign */
.mood-gate { padding:26px 18px 22px; text-align:center; }
.mood-gate-title { margin:2px 0 8px; font-size:28px; line-height:1.25; }
.mood-gate .auth-copy { margin-bottom:22px; }
.mood-options { display:flex; flex-direction:column; gap:12px; margin-top:0; }
.mood-option {
  width:100%;
  min-height:94px;
  padding:14px 16px;
  border:1px solid #d7e0ea;
  border-radius:18px;
  background:#fff;
  display:grid;
  grid-template-columns:92px 1fr 24px;
  align-items:center;
  gap:12px;
  text-align:left;
  box-shadow:0 3px 12px rgba(23,54,93,.06);
}
.mood-option:active { transform:scale(.985); background:#f7f9fc; }
.mood-symbols { display:flex; align-items:center; justify-content:center; gap:2px; font-size:31px; line-height:1; white-space:nowrap; }
.mood-option-copy { display:flex; flex-direction:column; gap:4px; min-width:0; }
.mood-option-copy strong { font-size:20px; line-height:1.2; color:#17365d; }
.mood-option-copy small { font-size:13px; line-height:1.35; color:#68778a; font-weight:500; }
.mood-chevron { font-size:30px; line-height:1; color:#8b99aa; text-align:right; }
@media (max-width:380px) {
  .mood-gate { padding-left:14px; padding-right:14px; }
  .mood-option { min-height:88px; grid-template-columns:82px 1fr 20px; padding:12px 13px; }
  .mood-symbols { font-size:28px; }
  .mood-option-copy strong { font-size:19px; }
}

/* Ver.1.5.0 personal mood history */
.today-mood-actions { display:flex; align-items:center; gap:4px; }
.mood-history-panel { max-width:560px; }
.mood-history-note { margin:0 0 14px; color:#68778a; font-size:12px; }
.mood-history-summary { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:12px; }
.mood-history-summary > div { background:#f7f9fc; border:1px solid #e3e9f0; border-radius:14px; padding:12px; display:flex; flex-direction:column; gap:4px; }
.mood-history-summary span { color:#68778a; font-size:11px; }
.mood-history-summary strong { color:#17365d; font-size:16px; }
.mood-legend { display:flex; flex-wrap:wrap; gap:7px 12px; padding:10px 0 13px; font-size:12px; color:#526173; }
.mood-history-list { display:grid; gap:7px; }
.mood-history-item { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:52px; padding:9px 13px; border:1px solid #e3e9f0; border-radius:13px; background:#fff; }
.mood-history-date { color:#526173; font-size:13px; }
.mood-history-value { font-size:14px; color:#17365d; }
@media (max-width:380px) {
  .mood-history-summary { grid-template-columns:1fr; }
}

/* Ver.1.5.3: remove duplicate in-page brand header */
.portal-shell {
  padding-top: 12px;
}
.mission-card {
  margin-top: 0;
}

/* SC Ver.1.6.0 Employee Admin */
.employee-admin-open { width:100%; border:0; cursor:pointer; }
.employee-admin-panel { max-width:640px; }
.employee-admin-toolbar { display:grid; grid-template-columns:1fr auto; gap:9px; margin-bottom:8px; }
.employee-admin-toolbar input { min-width:0; border:1px solid #d8e0e9; border-radius:12px; padding:11px 12px; font:inherit; }
.employee-admin-toolbar .primary-button { width:auto; min-width:118px; padding:0 14px; }
.employee-admin-note { margin:0 0 13px; color:#68778a; font-size:11px; line-height:1.5; }
.employee-admin-list { display:grid; gap:13px; }
.employee-admin-group { border:1px solid #e1e7ee; border-radius:14px; overflow:hidden; background:#fff; }
.employee-admin-group-title { display:flex; justify-content:space-between; gap:10px; padding:11px 13px; background:#f6f8fb; color:#17365d; }
.employee-admin-group-title span { color:#68778a; font-size:11px; }
.employee-admin-row { width:100%; border:0; border-top:1px solid #edf1f5; background:#fff; padding:11px 12px; display:flex; align-items:center; justify-content:space-between; gap:10px; text-align:left; font:inherit; cursor:pointer; }
.employee-admin-row:first-of-type { border-top:0; }
.employee-admin-row.is-inactive { opacity:.58; background:#fafafa; }
.employee-admin-row-main { min-width:0; display:flex; flex-direction:column; gap:3px; }
.employee-admin-row-main strong { color:#25364a; font-size:14px; }
.employee-admin-row-main small { color:#68778a; font-size:10px; line-height:1.4; overflow-wrap:anywhere; }
.employee-admin-row-side { flex:0 0 auto; display:flex; align-items:center; gap:7px; }
.employee-status-pill { border-radius:999px; padding:4px 7px; font-size:10px; font-weight:800; }
.employee-status-pill.active { background:#e8f6ef; color:#167a4d; }
.employee-status-pill.inactive { background:#f1f2f4; color:#687078; }
.employee-admin-chevron { font-size:22px; color:#8b99aa; }
.employee-admin-form { display:grid; gap:13px; margin-top:13px; }
.employee-admin-form label { display:grid; gap:6px; color:#25364a; font-size:12px; font-weight:700; }
.employee-admin-form input, .employee-admin-form select { width:100%; min-height:45px; border:1px solid #d8e0e9; border-radius:11px; padding:9px 11px; font:inherit; background:#fff; box-sizing:border-box; }
.employee-admin-form input[readonly] { background:#f3f5f7; color:#68778a; }
.employee-admin-form small { color:#7a8796; font-size:10px; font-weight:500; }
.employee-line-status { border-radius:11px; padding:10px 11px; background:#f6f8fb; color:#526173; font-size:11px; }
@media (max-width:440px) {
  .employee-admin-toolbar { grid-template-columns:1fr; }
  .employee-admin-toolbar .primary-button { width:100%; }
}