:root {
  font-family:Inter,"Noto Sans JP","Yu Gothic UI",Meiryo,sans-serif;
  color:#263d38;
  background:#f6f8f7;
  font-size:13px;
  font-synthesis:none;
  --green:#26725b;
  --muted:#83918b;
  --border:#e6ebe7;
  --surface:#fff}
* {
  box-sizing:border-box}
body {
  margin:0}
button,input,textarea,select {
  font:inherit}
button,a,input,select,textarea {
  -webkit-tap-highlight-color:transparent}
button,a {
  touch-action:manipulation}
button {
  cursor:pointer}
button:disabled {
  cursor:wait;
  opacity:.55}
a {
  color:inherit;
  text-decoration:none}
button:focus-visible,a:focus-visible {
  outline:3px solid #a6c8b1;
  outline-offset:3px}
[hidden] {
  display:none!important}
.sidebar {
  position:fixed;
  width:238px;
  inset:0 auto 0 0;
  background:#fff;
  border-right:1px solid var(--border);
  padding:34px 22px;
  display:flex;
  flex-direction:column;
  z-index:2}
.brand {
  display:flex;
  align-items:center;
  gap:13px;
  font-size:27px;
  font-weight:780;
  letter-spacing:-1.2px}
.brand small {
  display:block;
  font-size:8px;
  letter-spacing:2px;
  margin-top:5px;
  color:#85958d;
  font-weight:500}
.brand-symbol {
  position:relative;
  background:#24634f;
  color:#fff;
  width:42px;
  height:43px;
  border-radius:13px;
  text-align:center;
  line-height:41px;
  font-size:34px;
  font-family:Georgia;
  letter-spacing:-3px}
.brand-symbol span {
  position:absolute;
  right:1px;
  top:-12px;
  font-size:20px;
  color:#c6e4a8}
.workspace {
  display:flex;
  align-items:center;
  gap:10px;
  border:1px solid var(--border);
  padding:12px 10px;
  border-radius:9px;
  margin-top:37px;
  font-size:11px;
  font-weight:600}
.workspace>span:last-child {
  margin-left:auto}
.workspace-icon {
  display:grid;
  place-items:center;
  background:#ecf0eb;
  width:31px;
  height:31px;
  border-radius:8px;
  color:#497358}
.workspace small,.profile small,.bot-status small {
  display:block;
  color:var(--muted);
  font-size:10px;
  font-weight:400;
  margin-top:4px}
.nav-caption {
  font-size:9px;
  letter-spacing:1.8px;
  color:#9aa49f;
  margin:31px 12px 12px}
.nav {
  border:0;
  background:none;
  width:100%;
  padding:13px 12px;
  display:flex;
  align-items:center;
  gap:13px;
  color:#748078;
  text-align:left;
  border-radius:7px;
  margin-bottom:5px;
  font-size:12px}
.nav>span {
  font-size:19px;
  line-height:19px;
  width:20px;
  text-align:center}
.nav.active {
  background:#eaf3ed;
  color:#27654e;
  font-weight:700}
.nav:hover {
  background:#f0f5f1}
.nav b {
  margin-left:auto;
  font-size:10px;
  background:#d8e8dc;
  border-radius:5px;
  padding:2px 7px}
.nav i {
  margin-left:auto;
  width:6px;
  height:6px;
  border-radius:50%;
  background:#d79c53}
.sidebar-bottom {
  margin-top:auto}
.bot-status {
  display:flex;
  gap:10px;
  align-items:center;
  padding:17px 9px;
  border-bottom:1px solid var(--border);
  font-size:11px}
.status-dot {
  height:7px;
  width:7px;
  background:#7da990;
  border-radius:50%}
.profile {
  display:flex;
  align-items:center;
  gap:11px;
  padding:20px 5px 0;
  font-size:12px}
.avatar {
  width:34px;
  height:34px;
  border-radius:50%;
  display:inline-grid;
  place-items:center;
  background:#e6eee7;
  color:#52755c;
  font-size:12px;
  flex-shrink:0}
.avatar.small {
  width:29px;
  height:29px;
  font-size:10px}
.avatar.tone-1 {
  background:#f5e9e3;
  color:#b0836e}
.avatar.tone-2 {
  background:#e6eaf5;
  color:#7689b3}
.avatar.tone-3 {
  background:#f2e7ed;
  color:#a67891}
.avatar.tone-4 {
  background:#f0ecd9;
  color:#9e915c}
.shell {
  margin-left:238px}
.topbar {
  height:70px;
  background:#fff;
  border-bottom:1px solid var(--border);
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:0 38px;
  font-size:11px}
.separator {
  margin:0 15px;
  color:#c5cdc7}
.topbar-right {
  display:flex;
  gap:21px;
  align-items:center}
.mode {
  font-size:9px;
  letter-spacing:1px;
  color:#64856e;
  background:#eff4ef;
  border:1px solid #dce7dd;
  padding:5px 8px;
  border-radius:4px}
main {
  max-width:1560px;
  padding:36px 38px 20px;
  margin:auto}
.heading {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:25px;
  gap:20px}
.eyebrow {
  font-size:9px;
  letter-spacing:1.8px;
  color:#8b9b91;
  font-weight:600;
  margin:0 0 12px}
h1 {
  font-size:27px;
  letter-spacing:1px;
  margin:0;
  font-weight:650}
.title-dot {
  color:#73a688;
  margin-left:4px}
.heading p:not(.eyebrow) {
  font-size:11px;
  color:#87948b;
  margin:11px 0 0}
.heading-actions {
  display:flex;
  align-items:center;
  gap:18px;
  font-size:10px;
  color:#87948b}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:10px 15px;
  border-radius:6px;
  font-size:11px;
  font-weight:600;
  border:1px solid transparent;
  white-space:nowrap}
.secondary {
  border-color:#dfe6df;
  background:#fff;
  color:#65776a}
.primary {
  background:#28654e;
  color:#fff}
.button:hover {
  filter:brightness(.97)}
.demo-banner {
  display:flex;
  gap:17px;
  align-items:center;
  padding:11px 15px;
  border:1px solid #e0e9df;
  background:#f0f5ee;
  color:#83937e;
  font-size:10px;
  margin-bottom:22px;
  border-radius:7px}
.demo-banner span {
  font-weight:600;
  color:#648064}
.metrics {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:17px;
  margin-bottom:24px}
.metric {
  border:1px solid var(--border);
  background:#fff;
  border-radius:10px;
  padding:21px 21px 17px}
.metric-top {
  display:flex;
  justify-content:space-between;
  align-items:center;
  color:#7c8b80;
  font-size:11px}
.metric-icon {
  display:grid;
  place-items:center;
  background:#f0f5f0;
  color:#7e9f87;
  border-radius:7px;
  width:28px;
  height:28px;
  font-size:16px}
.metric-value {
  font-size:33px;
  font-weight:600;
  letter-spacing:-1px;
  margin:11px 0}
.metric-value small {
  font-size:11px;
  font-weight:400;
  color:#9ba59e;
  margin-left:6px}
.metric-note {
  font-size:10px;
  color:#92a094}
.metric-note.attention {
  color:#b78c4e}
.metric-note.danger {
  color:#c97f6b}
.middle-grid {
  display:grid;
  grid-template-columns:minmax(0,1.65fr) minmax(300px,1fr);
  gap:22px;
  margin-bottom:26px}
.panel {
  background:white;
  border:1px solid var(--border);
  border-radius:10px;
  overflow:hidden}
.panel-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:22px 23px 17px;
  gap:10px}
.panel-header h2 {
  font-size:13px;
  font-weight:650;
  letter-spacing:.4px;
  margin:0}
.panel-header p {
  font-size:10px;
  color:#95a197;
  margin:7px 0 0}
.text-button {
  border:0;
  background:none;
  color:#72917c;
  font-size:10px;
  white-space:nowrap}
.overview-chart {
  display:flex;
  align-items:center;
  gap:40px;
  padding:6px 28px 24px;
  min-height:181px}
.chart {
  height:152px;
  width:152px;
  flex-shrink:0;
  position:relative}
.chart svg {
  width:100%;
  height:100%;
  transform:rotate(-90deg)}
.chart circle {
  fill:none;
  stroke-width:11}
.chart-label {
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  font-size:10px;
  color:#95a096;
  gap:4px}
.chart-label strong {
  font-size:32px;
  line-height:35px;
  font-weight:600;
  color:#3f594a}
.legend {
  flex:1;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px 26px}
.legend-item {
  display:flex;
  align-items:center;
  gap:8px;
  font-size:10px;
  color:#7a897e}
.legend-item strong {
  margin-left:auto;
  color:#48604e;
  font-size:13px;
  font-weight:600}
.swatch {
  width:7px;
  height:7px;
  border-radius:2px;
  background:#679b7e}
.swatch.s0 {
  background:#c9d3c7}
.swatch.s1 {
  background:#6a997f}
.swatch.s2 {
  background:#d9bd82}
.swatch.s3 {
  background:#b6a6c3}
.swatch.s4 {
  background:#a5c5c0}
.swatch.s5 {
  background:#d9ddd9}
.swatch.s6 {
  background:#adbac5}
.alert-panel {
  background:#fffefb}
.alert-panel .panel-header {
  padding-bottom:11px}
.alert-icon {
  font-size:13px;
  color:#c09756;
  margin-right:7px}
.attention-list {
  padding:0 23px 13px}
.attention-row {
  display:flex;
  align-items:center;
  gap:11px;
  padding:13px 0;
  border-bottom:1px solid #f1eee7}
.attention-row:last-child {
  border:0}
.attention-row .attention-copy {
  min-width:0;
  flex:1}
.attention-copy strong {
  font-size:11px;
  font-weight:550;
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  max-width:240px}
.attention-copy small {
  font-size:10px;
  color:#a5a697;
  display:block;
  margin-top:5px}
.risk-dot {
  height:6px;
  width:6px;
  border-radius:50%;
  background:#d8ae6b}
.risk-dot.high {
  background:#cf8a78}
.tag {
  display:inline-flex;
  padding:4px 8px;
  border-radius:4px;
  font-size:9px;
  white-space:nowrap;
  align-items:center;
  gap:5px;
  line-height:15px}
.status-0 {
  background:#f0f2ee;
  color:#8c9788}
.status-1 {
  background:#edf4ee;
  color:#648a70}
.status-2 {
  background:#fbf4e6;
  color:#b49758}
.status-3 {
  background:#f1edf5;
  color:#a08bae}
.status-4 {
  background:#edf5f3;
  color:#78a49b}
.status-5,.status-6 {
  background:#eff1f3;
  color:#929aa4}
.tag.high {
  background:#fbefea;
  color:#c78874}
.tag.medium {
  background:#fbf5e7;
  color:#baa16c}
.tag.low {
  background:#eef4ef;
  color:#819e86}
.projects {
  margin-bottom:24px}
.projects .panel-header {
  padding-bottom:19px}
.count-label {
  font-size:10px;
  background:#eff3ee;
  color:#82937f;
  border-radius:4px;
  padding:3px 7px;
  margin-left:9px;
  font-weight:400}
.filters {
  display:flex;
  justify-content:space-between;
  gap:12px;
  border-top:1px solid #f1f3f0;
  padding:13px 23px}
.filter-tabs {
  display:flex;
  gap:5px}
.filter-tab {
  border:0;
  background:none;
  color:#96a08f;
  padding:7px 11px;
  border-radius:5px;
  font-size:10px}
.filter-tab.active {
  background:#edf3ec;
  color:#50765a;
  font-weight:600}
.search-controls {
  display:flex;
  gap:8px}
.search-controls input,.search-controls select {
  border:1px solid #e4e9e2;
  border-radius:5px;
  padding:7px 10px;
  color:#788773;
  background:#fff;
  font-size:10px}
.search-controls input {
  width:180px}
.table-wrap {
  overflow:auto}
table {
  border-collapse:collapse;
  width:100%;
  text-align:left;
  white-space:nowrap}
th {
  font-size:9px;
  color:#98a491;
  background:#fafbf9;
  padding:12px 20px;
  font-weight:500;
  border-block:1px solid #edf0e9}
td {
  padding:17px 20px;
  border-bottom:1px solid #edf0e9;
  font-size:11px;
  color:#687963}
tbody tr:last-child td {
  border:0}
tbody tr:hover {
  background:#fcfdfb}
.project-title {
  font-size:11px;
  font-weight:600;
  color:#455d42;
  border:0;
  background:transparent;
  padding:0;
  text-align:left;
  max-width:300px;
  white-space:normal;
  line-height:1.6}
.project-sub {
  font-size:9px;
  color:#a0aa99;
  margin-top:4px;
  max-width:290px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis}
.person {
  display:flex;
  align-items:center;
  gap:9px;
  font-size:10px}
.person .avatar {
  height:28px;
  width:28px;
  font-size:10px}
.date-overdue {
  color:#c5846d}
.due-sub {
  display:block;
  font-size:9px;
  color:#a9b0a2;
  margin-top:4px}
.date-overdue .due-sub {
  color:#c99986}
.table-footer {
  padding:12px 23px;
  background:#fcfdfb;
  border-top:1px solid #edf0e9;
  font-size:9px;
  color:#a0aa99;
  display:flex;
  justify-content:space-between}
.empty {
  text-align:center;
  padding:42px 20px;
  color:#94a18d;
  font-size:12px;
  line-height:2}
.empty strong {
  display:block;
  color:#55744d;
  font-size:15px}
.upcoming {
  margin-top:23px}
.deadlines {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0;
  padding:0 22px 22px}
.deadline {
  display:flex;
  align-items:center;
  gap:15px;
  padding:10px 19px;
  border-right:1px solid var(--border)}
.deadline:first-child {
  padding-left:0}
.deadline:last-child {
  border:0}
.date-tile {
  background:#f2f5ed;
  border:1px solid #e9eee1;
  border-radius:7px;
  min-width:46px;
  height:53px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  color:#7b8e69;
  gap:2px}
.date-tile small {
  font-size:8px}
.date-tile b {
  font-size:20px;
  font-weight:500}
.deadline strong {
  font-size:10px;
  font-weight:500;
  display:block;
  line-height:1.7}
.deadline p {
  font-size:9px;
  color:#99a38f;
  margin:5px 0 0}
footer {
  display:flex;
  justify-content:space-between;
  margin-top:34px;
  color:#a3ada0;
  font-size:9px}
footer b {
  font-weight:600;
  letter-spacing:.5px}
.creator-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px}
.creator-card {
  padding:24px}
.creator-card .person {
  font-size:14px}
.creator-card .person .avatar {
  width:42px;
  height:42px;
  font-size:15px}
.creator-card p {
  color:#95a08e;
  font-size:11px}
.creator-stats {
  display:flex;
  gap:35px;
  margin-top:23px}
.creator-stats strong {
  display:block;
  font-size:24px;
  color:#507046}
.creator-stats span {
  font-size:10px;
  color:#9aa58f}
.risk-intro {
  background:#eef3e9;
  border:1px solid #e0e8d7;
  border-radius:9px;
  padding:21px 24px;
  font-size:11px;
  line-height:1.9;
  color:#718568;
  margin-bottom:23px}
.risk-intro strong {
  display:block;
  font-size:14px;
  color:#4d7243;
  margin-bottom:4px}
.risk-list {
  display:grid;
  gap:13px}
.risk-card {
  padding:23px;
  display:flex;
  gap:23px;
  align-items:flex-start}
.risk-score {
  width:53px;
  flex-shrink:0;
  text-align:center;
  color:#b5945b;
  padding:8px;
  background:#fbf5e8;
  border-radius:7px;
  font-size:24px}
.risk-score.high {
  background:#faefea;
  color:#c68773}
.risk-score small {
  font-size:8px;
  display:block;
  margin-top:4px}
.risk-card h3 {
  margin:0 0 8px;
  font-size:13px}
.risk-card p {
  font-size:10px;
  color:#94a08b;
  margin:0}
.risk-card ul {
  padding-left:17px;
  color:#839279;
  font-size:11px;
  line-height:2}
.risk-card .text-button {
  margin-left:auto}
.settings-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) 300px;
  gap:23px}
.settings-section {
  padding:25px;
  margin-bottom:20px}
.settings-section h2 {
  font-size:14px;
  margin:0 0 7px}
.settings-section>p {
  font-size:11px;
  color:#8e9e83;
  margin:0 0 23px;
  line-height:1.8}
.settings-row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
  padding:16px 0;
  border-bottom:1px solid #edf1e8}
.settings-row:last-child {
  border:0}
.settings-row label {
  margin:0}
.settings-row small {
  display:block;
  color:#98a58d;
  font-size:10px;
  font-weight:400;
  margin-top:6px}
.settings-row input[type=number] {
  width:87px;
  margin:0}
.settings-row input[type=checkbox] {
  width:18px;
  height:18px;
  accent-color:#508252}
.settings-aside {
  padding:24px;
  height:fit-content;
  background:#f0f4eb;
  color:#849577;
  font-size:11px;
  line-height:2}
.settings-aside h3 {
  color:#577b48;
  font-size:13px}
.settings-actions {
  display:flex;
  justify-content:flex-end;
  gap:12px;
  align-items:center}
.error {
  padding:12px 16px;
  background:#fff0e9;
  border:1px solid #edc4b3;
  color:#a4664e;
  border-radius:6px;
  margin-bottom:18px;
  line-height:1.7;
  font-size:12px}
.muted {
  color:var(--muted)}
dialog {
  border:1px solid #e0e7da;
  border-radius:14px;
  padding:28px;
  width:570px;
  max-width:calc(100% - 32px);
  max-height:90vh;
  color:#3e5839;
  box-shadow:0 22px 100px #1f361d26}
dialog::backdrop {
  background:#263e314f;
  backdrop-filter:blur(3px)}
.dialog-heading {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  margin-bottom:18px}
.dialog-heading h2 {
  font-size:19px;
  line-height:1.6;
  margin:0}
.icon-button {
  border:0;
  background:#f3f5ef;
  border-radius:6px;
  font-size:23px;
  color:#839777;
  padding:0 9px}
.form-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px}
label {
  display:block;
  font-size:11px;
  font-weight:600;
  margin:21px 0 0}
input,select,textarea {
  outline:none}
label input,label select,label textarea {
  display:block;
  width:100%;
  border:1px solid #dfe7d7;
  background:#fbfcf9;
  border-radius:6px;
  padding:10px;
  margin-top:9px;
  color:#56704a}
input:focus,textarea:focus,select:focus {
  border-color:#81a474;
  box-shadow:0 0 0 3px #a8c89822}
textarea {
  resize:vertical;
  line-height:1.8}
.dialog-footer {
  display:flex;
  justify-content:flex-end;
  gap:12px;
  margin-top:25px}
.dialog-footer a {
  margin-right:auto}
#status-note {
  font-size:10px;
  line-height:1.8}
#detail-risk {
  font-size:11px;
  background:#f8f5ed;
  color:#a18f6f;
  border-radius:6px;
  padding:12px;
  line-height:1.8;
  margin-top:15px}
#detail-risk:empty {
  display:none}
#detail-meta {
  font-size:11px;
  color:#92a084}
.toast {
  position:fixed;
  bottom:30px;
  left:50%;
  transform:translateX(-50%);
  padding:13px 24px;
  background:#355c3c;
  color:white;
  border-radius:8px;
  box-shadow:0 5px 30px #314b3226;
  z-index:10;
  font-size:12px}

@media(min-width:1500px) {
  main {
  padding-top:44px}
.metric {
  padding:24px}
.overview-chart {
  gap:65px}
.chart {
  height:163px;
  width:163px}
td {
  padding-block:20px}
}

@media(max-width:1150px) {
  .sidebar {
  width:200px;
  padding:29px 15px}
.shell {
  margin-left:200px}
main {
  padding:27px 24px}
.topbar {
  padding-inline:24px}
.heading-actions {
  flex-direction:column;
  gap:9px;
  align-items:flex-end}
.middle-grid {
  grid-template-columns:1.35fr 1fr;
  gap:16px}
.overview-chart {
  gap:18px;
  padding-inline:20px}
.chart {
  width:125px;
  height:125px}
.legend {
  grid-template-columns:1fr;
  gap:9px}
.attention-copy strong {
  max-width:170px}
.filters {
  flex-wrap:wrap}
.creator-grid {
  grid-template-columns:repeat(2,1fr)}
.settings-grid {
  grid-template-columns:1fr}
.deadlines {
  grid-template-columns:1fr}
.deadline {
  border:0;
  border-bottom:1px solid var(--border);
  padding:13px 0}
}

@media(max-width:780px) {
  .sidebar {
  width:68px;
  padding:21px 10px}
.brand {
  justify-content:center}
.brand>span:last-child,.workspace,.nav-caption,.nav b,.nav i,.sidebar-bottom {
  display:none}
.brand-symbol {
  min-width:38px}
.sidebar nav {
  margin-top:33px}
.nav {
  font-size:0;
  justify-content:center;
  padding:14px 0;
  gap:0}
.nav>span {
  font-size:21px}
.shell {
  margin-left:68px}
main {
  padding:24px 17px}
.topbar {
  padding:0 19px;
  height:58px}
.heading {
  align-items:flex-start}
h1 {
  font-size:23px}
.eyebrow {
  font-size:7px}
.heading p:not(.eyebrow) {
  font-size:10px;
  max-width:225px;
  line-height:1.8}
.heading-actions #today {
  display:none}
.heading-actions .button {
  padding:9px;
  font-size:10px}
.metrics {
  grid-template-columns:1fr 1fr;
  gap:10px}
.metric {
  padding:15px}
.metric-value {
  font-size:28px}
.middle-grid {
  grid-template-columns:1fr}
.overview-chart {
  justify-content:center;
  gap:30px}
.legend {
  grid-template-columns:1fr 1fr;
  max-width:250px;
  gap:15px}
.chart {
  width:140px;
  height:140px}
.demo-banner {
  display:block;
  line-height:1.8;
  font-size:9px}
.demo-banner span {
  display:block;
  margin-bottom:3px}
.attention-copy strong {
  max-width:none}
.filters {
  padding:12px}
.search-controls {
  width:100%}
.search-controls input {
  flex:1;
  min-width:0;
  width:100px}
.panel-header {
  padding:18px}
.creator-grid {
  grid-template-columns:1fr}
.risk-card {
  gap:13px;
  padding:17px;
  flex-wrap:wrap}
.risk-card>div:nth-child(2) {
  flex:1;
  min-width:150px}
.risk-card .text-button {
  margin-left:65px}
.settings-section {
  padding:18px}
.form-grid {
  gap:12px}
footer {
  gap:12px;
  line-height:1.8}
footer span:last-child {
  text-align:right}
}

@media(max-width:500px) {
  .heading { flex-direction:column; gap:14px; }
  .heading-actions { align-self:flex-end; }
  .heading p:not(.eyebrow) { max-width:none; }
  .overview-chart { flex-direction:column; gap:20px; }
  .legend { width:100%; max-width:none; gap:14px 18px; }
  .legend-item { white-space:nowrap; }
  .topbar > div:first-child .muted, .topbar .separator { display:none; }
  .topbar-right { gap:8px; }
  .topbar .mode { font-size:7px; }
  .filter-tabs { gap:0; }
  .filter-tab { padding-inline:8px; }
  .metric-icon { width:23px; height:23px; flex-shrink:0; }
  .metric-top { font-size:10px; }
}
.checklist { border:1px solid var(--border); border-radius:8px; margin:23px 0 0; padding:15px; }
.checklist legend { font-size:12px; font-weight:600; padding:0 7px; }
.checklist legend span { font-size:10px; margin-left:12px; color:var(--green); }
.checklist p { font-size:10px; line-height:1.8; margin:0 0 8px; }
.check-item { display:flex; align-items:center; gap:10px; margin:0; padding:10px 0; }
.check-item input { width:17px; height:17px; margin:0; accent-color:var(--green); }
.calendar-toolbar { flex-wrap:wrap; }
.calendar-controls { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.calendar-controls select { padding:9px; border:1px solid var(--border); border-radius:6px; background:#fff; color:var(--green); font-size:11px; }
.calendar-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); min-width:700px; }
.calendar-scroll { overflow-x:auto; }
.calendar-weekday { text-align:center; background:#f3f6f0; padding:12px; color:#81917a; font-size:11px; }
.calendar-day { min-height:125px; padding:10px 7px; border-top:1px solid var(--border); border-right:1px solid var(--border); }
.calendar-day:nth-child(7n) { border-right:0; }
.calendar-day.outside { background:#f8faf6; }
.day-heading { display:flex; justify-content:space-between; align-items:center; margin-bottom:9px; padding:0 3px; }
.day-heading span { font-size:9px; color:#99a38f; }
.is-today .day-heading time { background:var(--green); color:#fff; border-radius:50%; width:24px; height:24px; display:grid; place-items:center; }
.calendar-event { border:0; border-left:3px solid currentColor; border-radius:4px; padding:7px; margin:0 0 6px; width:100%; text-align:left; }
.calendar-event strong { display:block; font-size:10px; line-height:1.7; overflow-wrap:anywhere; }
.calendar-event small { display:block; font-size:9px; line-height:1.7; margin-top:3px; }
.undated-list { display:flex; flex-wrap:wrap; gap:10px; padding:0 23px 23px; font-size:11px; }
.login-page { min-height:100vh; display:grid; place-items:center; padding:24px; }
.login-card { width:460px; max-width:100%; padding:48px 38px; margin:0; }
.login-card h1 { line-height:1.8; }
.login-card p:not(.eyebrow) { color:#768b79; font-size:12px; line-height:2; margin:23px 0; }
.login-card .button { width:100%; padding:15px; }
.login-card small { color:#899888; font-size:10px; line-height:2; }