@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@400;500;600;700&family=Noto+Serif+Thai:wght@600;700&display=swap");:root{--slot-free-bg:oklch(95% 0.05 150);--slot-free-line:oklch(70% 0.11 150);--slot-free-ink:oklch(38% 0.09 150);--slot-booked-bg:oklch(94% 0.08 92);--slot-booked-line:oklch(76% 0.14 85);--slot-booked-ink:oklch(40% 0.09 75);--slot-arrived-bg:oklch(89% 0.11 80);--slot-arrived-line:oklch(66% 0.16 62);--slot-done-bg:oklch(93% 0.04 250);--slot-done-line:oklch(64% 0.12 250);--slot-done-ink:oklch(40% 0.11 255);--slot-off-bg:oklch(96% 0.02 25);--slot-off-line:oklch(86% 0.05 25);--slot-block-bg:oklch(90% 0.07 25);--slot-block-line:oklch(62% 0.17 26);--slot-block-ink:oklch(42% 0.14 26);--slot-noshow-bg:oklch(94% 0.005 90)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--slot-free-bg:oklch(32% 0.05 150);--slot-free-line:oklch(52% 0.09 150);--slot-free-ink:oklch(86% 0.08 150);--slot-booked-bg:oklch(35% 0.06 85);--slot-booked-line:oklch(62% 0.12 85);--slot-booked-ink:oklch(90% 0.08 90);--slot-arrived-bg:oklch(42% 0.09 70);--slot-arrived-line:oklch(72% 0.14 70);--slot-done-bg:oklch(32% 0.05 250);--slot-done-line:oklch(58% 0.1 250);--slot-done-ink:oklch(86% 0.07 250);--slot-off-bg:oklch(25% 0.02 25);--slot-off-line:oklch(35% 0.04 25);--slot-block-bg:oklch(34% 0.08 25);--slot-block-line:oklch(60% 0.14 26);--slot-block-ink:oklch(88% 0.07 25);--slot-noshow-bg:oklch(28% 0.005 90)}}.board-wrap{overflow:auto;max-height:calc(100dvh - 14rem);border:1px solid var(--hairline);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-2)}.board{--lane-w:11.5rem;--slot-w:3.4rem;display:grid;grid-template-columns:var(--lane-w) repeat(var(--slots),minmax(var(--slot-w),1fr));grid-template-rows:auto;grid-auto-rows:3.1rem;min-width:calc(var(--lane-w) + var(--slots) * var(--slot-w))}.board-corner,.board-time{position:-webkit-sticky;position:sticky;top:0;z-index:3;background:var(--surface-2);border-bottom:1px solid var(--hairline-strong)}.board-corner{left:0;z-index:4;border-right:1px solid var(--hairline-strong);padding:var(--space-2) var(--space-3);align-self:stretch;display:flex;align-items:flex-end}.board-time{padding:var(--space-2) .3rem;border-left:1px solid var(--hairline);font-feature-settings:"tnum";font-variant-numeric:tabular-nums;font-weight:600;font-size:var(--text-xs);color:var(--ink-3);text-align:start}.board-time[data-hour=true]{color:var(--ink);font-weight:800;font-size:var(--text-sm);border-left-color:var(--hairline-strong)}.board-head{position:-webkit-sticky;position:sticky;left:0;z-index:2;display:flex;align-items:center;gap:.5rem;min-width:0;padding:.25rem var(--space-3);background:var(--surface-2);border-right:1px solid var(--hairline-strong);border-top:1px solid var(--hairline)}.board-head[data-leave=true]{background:var(--slot-block-bg)}.board-head-text{display:flex;flex-direction:column;align-items:flex-start;gap:.15rem;min-width:0}.board-head-name{max-width:100%;font-weight:700;font-size:var(--text-xs);line-height:1.25}.board-leave{padding:0 .45rem;border-radius:var(--r-pill);border:1px solid var(--hairline-strong);background:var(--surface);color:var(--ink-3);font-size:.68rem;font-weight:600;line-height:1.5;cursor:pointer}.board-leave:hover{color:var(--slot-block-ink);border-color:var(--slot-block-line)}.board-leave[data-on=true]{background:var(--slot-block-line);border-color:transparent;color:#fff}.board-leave:disabled{opacity:.4;cursor:not-allowed}.slot-cell{position:relative;margin:2px;border-radius:var(--r-xs);border:1.5px solid transparent;display:flex;align-items:center;justify-content:center;gap:.35rem;min-width:0;cursor:pointer;transition:filter var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out)}.slot-cell:hover{filter:brightness(.96) saturate(1.15);box-shadow:var(--shadow-1)}.slot-cell:focus-visible{z-index:2}.slot-cell[data-state=leave],.slot-cell[data-state=off]{cursor:default}.slot-cell[data-state=leave]:hover,.slot-cell[data-state=off]:hover{filter:none;box-shadow:none}.slot-cell[data-state=free]{background:var(--slot-free-bg);border-color:var(--slot-free-line)}.slot-cell[data-state=free]:after{content:"+";color:var(--slot-free-line);font-weight:700;opacity:0;transition:opacity var(--dur-fast)}.slot-cell[data-state=free]:hover:after{opacity:1}.slot-cell[data-state=booked]{background:var(--slot-booked-bg);border-color:var(--slot-booked-line)}.slot-cell[data-state=booked][data-pending=true]{border-style:dashed}.slot-cell[data-state=arrived]{background:var(--slot-arrived-bg);border-color:var(--slot-arrived-line)}.slot-cell[data-state=completed]{background:var(--slot-done-bg);border-color:var(--slot-done-line);color:var(--slot-done-ink)}.slot-cell[data-state=no_show]{background:var(--slot-noshow-bg);border-color:var(--hairline-strong);color:var(--ink-3)}.slot-cell[data-state=blocked],.slot-cell[data-state=leave]{background:var(--slot-block-bg);border-color:var(--slot-block-line);color:var(--slot-block-ink)}.slot-cell[data-state=off]{background:repeating-linear-gradient(135deg,var(--slot-off-bg) 0 5px,transparent 5px 10px);border-color:transparent}.slot-icon{font-size:1.05rem;line-height:1}.slot-cell[data-narrow=true]{gap:2px}.slot-cell[data-narrow=true] .slot-check,.slot-cell[data-narrow=true] .slot-person{width:1.45rem;height:1.45rem;font-size:.8rem}.slot-cell[data-narrow=true] .slot-icon{font-size:.85rem}.slot-person{position:relative;display:inline-flex;align-items:center;justify-content:center;width:1.9rem;height:1.9rem;border-radius:var(--r-pill);background:var(--surface);box-shadow:var(--shadow-1)}.slot-badge{position:absolute;right:-.25rem;bottom:-.2rem;width:.95rem;height:.95rem;display:grid;place-items:center;background:var(--slot-arrived-line);color:#fff;font-size:.6rem}.slot-badge,.slot-check{border-radius:var(--r-pill);font-weight:800}.slot-check{width:1.9rem;height:1.9rem;border:1.5px solid var(--slot-booked-line);background:var(--surface);color:var(--slot-booked-ink);font-size:.95rem;line-height:1;cursor:pointer;box-shadow:var(--shadow-1);transition:background var(--dur-fast),color var(--dur-fast),transform var(--dur-fast) var(--ease-out)}.slot-check:hover{background:var(--slot-arrived-line);border-color:transparent;color:#fff;transform:scale(1.08)}.slot-check[data-kind=arrived]{border-color:var(--slot-done-line);color:var(--slot-done-ink)}.slot-check[data-kind=arrived]:hover{background:var(--slot-done-line);color:#fff}.slot-check:disabled{opacity:.5;cursor:progress}.slot-tip{position:absolute;top:calc(100% + 6px);left:0;z-index:20;display:flex;flex-direction:column;gap:.1rem;width:max-content;max-width:15rem;padding:var(--space-2) var(--space-3);border-radius:var(--r-sm);background:var(--ink);color:var(--ink-inverse);font-size:var(--text-xs);line-height:1.45;text-align:start;white-space:nowrap;box-shadow:var(--shadow-3);opacity:0;visibility:hidden;transform:translateY(-3px);pointer-events:none;transition:opacity var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out)}.slot-person[data-align=right] .slot-tip{left:auto;right:0}.slot-person[data-above=true] .slot-tip{top:auto;bottom:calc(100% + 6px);transform:translateY(3px)}.slot-tip b{font-size:var(--text-sm)}.slot-tip-time{opacity:.7}.slot-tip-club{color:var(--gold);font-weight:700}.slot-cell:focus-visible .slot-tip,.slot-person:hover .slot-tip{opacity:1;visibility:visible;transform:translateY(0)}.slot-person:hover{z-index:5}.slot-cell:has(.slot-person:hover){z-index:5}.legend{display:flex;flex-wrap:wrap;gap:var(--space-2)}.legend-item{display:inline-flex;align-items:center;gap:.4rem;font-size:var(--text-xs);color:var(--ink-2)}.legend-swatch{width:1.1rem;height:1.1rem;border-radius:4px;border:1.5px solid}@media (hover:none){.slot-tip{display:none}}.plan{flex-direction:column}.plan,.plan-head{display:flex;gap:var(--space-3)}.plan-head{flex-wrap:wrap;align-items:center;justify-content:space-between}.plan-title{font-family:var(--font-display);font-size:var(--text-xl);min-width:10ch;text-align:center}.plan-legend{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-3);font-size:var(--text-xs);color:var(--ink-2)}.plan-legend li{display:inline-flex;align-items:center;gap:.35rem}.plan-legend i{width:1rem;height:1rem;border-radius:4px;border:1.5px solid transparent}.plan-legend i[data-state=work]{background:var(--slot-free-bg);border-color:var(--slot-free-line)}.plan-legend i[data-state=off]{background:repeating-linear-gradient(135deg,var(--slot-off-line) 0 1.5px,var(--surface) 1.5px 5px);border-color:var(--hairline)}.plan-legend i[data-state=leave]{background:var(--slot-block-bg);border-color:var(--slot-block-line)}.plan-legend i[data-state=closed]{background:var(--slot-block-line)}.plan-legend i[data-state=holiday]{background:var(--gold-soft);border-color:var(--gold)}.plan-wrap{overflow:auto;max-height:calc(100dvh - 16rem);border:1px solid var(--hairline);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-2)}.plan-grid{--name-w:12rem;--day-w:2.6rem;--head-h:3.6rem;display:grid;grid-template-columns:var(--name-w) repeat(var(--days),minmax(var(--day-w),1fr));grid-template-rows:var(--head-h);grid-auto-rows:3rem;min-width:calc(var(--name-w) + var(--days) * var(--day-w))}.plan-row{display:contents}.plan-corner,.plan-day{position:-webkit-sticky;position:sticky;top:0;z-index:3;background:var(--surface-2);border:0;border-bottom:1px solid var(--hairline-strong)}.plan-corner{left:0;z-index:4;display:flex;align-items:flex-end;padding:var(--space-2) var(--space-3);border-right:1px solid var(--hairline-strong);font-size:var(--text-xs);color:var(--ink-2)}.plan-day{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;border-left:1px solid var(--hairline);color:var(--ink);cursor:pointer;font:inherit;transition:background var(--dur-fast)}.plan-day small{font-size:.68rem;color:var(--ink-2)}.plan-day b{font-size:var(--text-sm);font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.plan-day:hover{background:var(--accent-soft)}.plan-day[data-weekend=true] small{color:var(--danger)}.plan-day[data-holiday=true]{background:var(--gold-soft);box-shadow:inset 0 -3px 0 var(--gold)}.plan-day[data-closed=true]{background:var(--slot-block-bg);box-shadow:inset 0 -3px 0 var(--slot-block-line)}.plan-day[data-today=true] b{display:inline-grid;place-items:center;width:1.7rem;height:1.7rem;border-radius:var(--r-pill);background:var(--accent);color:var(--ink-inverse)}.plan-name{position:-webkit-sticky;position:sticky;left:0;z-index:2;display:flex;align-items:center;gap:.5rem;min-width:0;padding:.2rem var(--space-3);background:var(--surface-2);border-right:1px solid var(--hairline-strong);border-top:1px solid var(--hairline)}.plan-name-text{display:flex;flex-direction:column;min-width:0;font-size:var(--text-xs);line-height:1.3}.plan-cell{position:relative;margin:2px;display:grid;place-items:center;border-radius:var(--r-xs);border:1.5px solid transparent;font:inherit;cursor:pointer;transition:transform var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast)}.plan-cell[data-state=work]{background:var(--slot-free-bg);border-color:var(--slot-free-line)}.plan-cell[data-state=off]{background:repeating-linear-gradient(135deg,var(--slot-off-line) 0 1.5px,var(--surface) 1.5px 8px);border-color:var(--hairline)}.plan-cell[data-state=leave]{background:var(--slot-block-bg);border-color:var(--slot-block-line);color:var(--slot-block-ink)}.plan-cell[data-state=closed]{background:var(--slot-block-line);opacity:.55}.plan-cell:hover:not(:disabled){transform:scale(1.06);box-shadow:var(--shadow-1)}.plan-cell:disabled{cursor:not-allowed;opacity:.45}.plan-cell:focus-visible{outline:3px solid var(--info);outline-offset:1px}.plan-dot{position:absolute;top:2px;right:2px;min-width:1.05rem;height:1.05rem;padding:0 .2rem;border-radius:var(--r-pill);display:inline-grid;place-items:center;background:var(--slot-booked-line);color:oklch(20% .04 70);font-size:.66rem;font-weight:800;line-height:1}.plan-legend .plan-dot{position:static}.plan-extra{position:absolute;left:4px;top:1px;font-weight:800;font-size:.8rem;color:var(--slot-free-ink)}.plan-cell[data-state=leave]{font-size:1rem}.plan-cell[data-pending=true]{box-shadow:0 0 0 3px var(--accent-soft);animation:plan-pulse .9s var(--ease-out) infinite alternate}@keyframes plan-pulse{0%{filter:none}to{filter:brightness(.94)}}.plan-flow{color:var(--ink);font-weight:700}.plan-status{min-height:1.4em;font-weight:600;color:var(--ink-2);transition:opacity var(--dur)}.plan-status[data-status=saved]{color:var(--success)}.plan-status[data-status=error]{color:var(--danger)}.plan-day-actions{display:grid;grid-gap:var(--space-3);gap:var(--space-3)}.plan-day-actions .btn{flex-direction:column;align-items:flex-start;gap:.1rem;text-align:start}.plan-day-actions .btn small{font-size:var(--text-xs);font-weight:500;opacity:.85}.view-switch{max-width:26rem}@media (max-width:48rem){.plan-grid{--name-w:8.5rem;--day-w:2.4rem}.plan-name .avatar{display:none}}.plan-cell[data-state=leave] .plan-dot{top:auto;bottom:2px}