.tcmy-host { min-width: 0; }
.tcmy { border: 0; min-height: 420px; }
.tcmy-toolbar { position: sticky; top: 0; z-index: 4; display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: .75rem; background: #fff; }
.tcmy-heading { display: grid; min-width: 13rem; }
.tcmy-toolbar h4 { margin: 0; }
.tcmy-toolbar [data-tcmy-summary] { color: #667085; font-size: .82rem; }
.tcmy-toolbar [data-tcmy-viewer] { color: #344054; font-size: .78rem; font-weight: 600; }
.tcmy-toolbar [data-tcmy-viewer].is-foreign { color: #b54708; }
.tcmy-toolbar-left { display: flex; align-items: center; gap: .5rem; min-width: 0; flex-wrap: wrap; }
.tcmy-toolbar-right { display: flex; align-items: center; justify-content: flex-end; gap: .5rem; min-width: 18rem; }
.tcmy-account { width: min(16rem, 100%); }
.tcmy-mode { white-space: nowrap; }
.tcmy-date-actions { white-space: nowrap; flex-wrap: nowrap; }
.tcmy-date { width: 10rem; }
.tcmy-plan-tools { flex: 0 0 auto; white-space: nowrap; }
.tcmy-state { display: grid; gap: .05rem; min-width: 10rem; text-align: right; color: #475467; }
.tcmy-state small { color: #667085; max-width: 18rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tcmy-state strong { color: #8a4b00; }
.tcmy-state:not(.is-paused) strong { color: #344054; }
.tcmy-actions { min-width: 0; }
.tcmy-actions:empty { display: none; }
.tcmy-error { margin: .75rem 1rem 0; }
.tcmy-loading { padding: 2rem; text-align: center; color: #667085; }
.tcmy-scroll { overflow: auto; max-height: calc(100vh - 17rem); padding: 1rem 1rem 2rem 4.5rem; }
.tcmy-timeline { position: relative; min-width: 36rem; border-left: 2px solid #d0d5dd; background: repeating-linear-gradient(to bottom,#fff 0,#fff 74px,#f7f8fa 75px); }
.tcmy-tick { position: absolute; left: -4.4rem; right: 0; border-top: 1px solid #e4e7ec; pointer-events: none; }
.tcmy-tick span { display: inline-block; width: 3.8rem; transform: translateY(-50%); color: #667085; font-size: .75rem; text-align: right; padding-right: .5rem; background: #fff; }
.tcmy-availability { position: absolute; left: 0; right: 0; background: #f8fafc; border-left: .25rem solid #d0d5dd; }
.tcmy-block { position: absolute; left: 0; right: 0; z-index: 1; background: repeating-linear-gradient(135deg,#edf1f6,#edf1f6 6px,#dfe5ec 6px,#dfe5ec 12px); color: #475467; padding: .2rem .5rem; overflow: hidden; }
.tcmy-task { position: absolute; z-index: 2; left: 1rem; right: 1rem; display: grid; grid-template-columns: 7.5rem 1fr auto; gap: .65rem; align-items: start; text-align: left; border: 1px solid #84adff; border-left: .3rem solid #1570ef; border-radius: .35rem; background: #eff4ff; color: #1849a9; padding: .35rem .55rem; overflow: hidden; cursor: pointer; }
.tcmy-task.is-fixed { border-color: #f79009; border-left-color: #dc6803; background: #fffaeb; color: #93370d; }
.tcmy-task span,.tcmy-task small { white-space: nowrap; }
.tcmy-now { position: absolute; z-index: 3; left: -.35rem; right: 0; border-top: 2px solid #d92d20; pointer-events: none; }
.tcmy-now::before { content: ""; position: absolute; width: .65rem; height: .65rem; left: 0; top: -.38rem; background: #d92d20; border-radius: 50%; }
.tcmy-now span { position: absolute; left: -4rem; top: -.7rem; color: #d92d20; font-size: .75rem; font-weight: 700; }
.tcmy-month-weekdays { position: sticky; top: 0; z-index: 3; display: grid; grid-template-columns: repeat(7,minmax(9rem,1fr)); min-width: 70rem; border: 1px solid #d0d5dd; border-bottom: 0; background: #f8fafc; }
.tcmy-month-weekdays span { padding: .4rem .6rem; color: #667085; font-size: .72rem; font-weight: 700; text-align: center; text-transform: uppercase; }
.tcmy-month { display: grid; grid-template-columns: repeat(7,minmax(9rem,1fr)); min-width: 70rem; border-top: 1px solid #d0d5dd; border-left: 1px solid #d0d5dd; }
.tcmy-month-day { min-height: 12rem; border-right: 1px solid #d0d5dd; border-bottom: 1px solid #d0d5dd; background: #fff; overflow: hidden; }
.tcmy-month-day.is-outside-month { background: #f8fafc; opacity: .72; }
.tcmy-month-day.is-today { box-shadow: inset 0 0 0 2px #1570ef; }
.tcmy-month-day > header { min-height: 3.8rem; border-bottom: 1px solid #e4e7ec; background: #f8fafc; }
.tcmy-month-day > header > button { width: 100%; display: flex; justify-content: space-between; gap: .35rem; padding: .42rem .5rem .2rem; border: 0; background: transparent; text-align: left; color: #344054; }
.tcmy-month-day > header > button:hover { background: #eff4ff; }
.tcmy-month-day > header small { color: #667085; font-size: .68rem; white-space: nowrap; }
.tcmy-month-now { display: block; margin: 0 .5rem .32rem; color: #b42318; font-size: .68rem; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tcmy-month-day-body { display: grid; gap: .28rem; padding: .38rem; }
.tcmy-month-task { display: grid; grid-template-columns: auto minmax(0,1fr); gap: .35rem; min-width: 0; padding: .28rem .35rem; border: 0; border-left: .2rem solid #1570ef; border-radius: .2rem; background: #eff4ff; color: #1849a9; text-align: left; }
.tcmy-month-task.is-fixed { border-left-color: #dc6803; background: #fffaeb; color: #93370d; }
.tcmy-month-task.is-current { box-shadow: 0 0 0 2px #1570ef; }
.tcmy-month-task.is-past { opacity: .48; }
.tcmy-month-task span { font-size: .64rem; opacity: .78; white-space: nowrap; }
.tcmy-month-task strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .72rem; }
.tcmy-month-block { padding: .28rem .35rem; border-radius: .2rem; background: repeating-linear-gradient(135deg,#edf1f6,#edf1f6 6px,#dfe5ec 6px,#dfe5ec 12px); color: #475467; font-size: .7rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tcmy-month-empty { padding: .55rem .2rem; color: #98a2b3; font-size: .7rem; }
.tcmy-month-more { padding: .2rem; border: 0; background: transparent; color: #175cd3; font-size: .7rem; text-align: left; }
.tcmy-month-more:hover { text-decoration: underline; }
.tcmy-host.is-paused .tcmy-task,.tcmy-host.is-paused .tcmy-month-task { opacity: .55; border-style: dashed; }
.tcmy-modal .tcm-dialog { width: min(1100px,calc(100vw - 2rem)); height: min(900px,calc(100vh - 2rem)); }
.tcmy-modal .tcm-body { overflow: hidden; }
.tcmy-modal .tcmy,.tcmy-modal .tcmy-host { height: 100%; }
.tcmy-modal .tcmy-scroll { max-height: calc(100vh - 15rem); }
.tcmy-setting { display: grid; grid-template-columns: auto 1fr; gap: .75rem; align-items: start; padding: .75rem; border: 1px solid #e4e7ec; border-radius: .45rem; cursor: pointer; }
.tcmy-setting + .tcmy-setting { margin-top: .75rem; }
.tcmy-setting span { display: grid; }
.tcmy-setting small { color: #667085; }
@media (max-width: 1180px) { .tcmy-toolbar { grid-template-columns: auto minmax(0,1fr); } .tcmy-toolbar-right { grid-column: 1 / -1; justify-content: flex-end; } }
@media (max-width: 800px) { .tcmy-toolbar { display: flex; align-items: stretch; flex-wrap: wrap; } .tcmy-heading { width: 100%; } .tcmy-toolbar-left,.tcmy-toolbar-right { width: 100%; } .tcmy-toolbar-right { justify-content: space-between; } .tcmy-state { text-align: left; } .tcmy-account { width: 100%; } .tcmy-date-actions { order: 3; width: 100%; } .tcmy-date-actions .btn { flex: 1; } .tcmy-task { grid-template-columns: 5.5rem 1fr; } .tcmy-task small { display: none; } }