/* ==========================================================================
   CalDAV 网页日历 —— 样式
   纸张质感 + 衬线标题 + 等宽标注；每个账号一个主色（--c）
   ========================================================================== */
:root{
  --cream:#f5f0e8; --cream-dark:#ece6d8;
  --ink:#1a1612; --ink-mid:#4a4035; --ink-light:#8a7d6e;
  --rule:rgba(26,22,18,0.09); --rule-strong:rgba(26,22,18,0.20);
  --busy-fg:#c0392b; --busy-bg:rgba(192,57,43,0.10);
  --free-fg:#2d6a4f; --free-bg:rgba(45,106,79,0.08);
  --free-off-bg:rgba(0,0,0,0.03); --free-off-bar:#c8c0b4;
  --gold:#b8860b;
  --font-display:'DM Serif Display','Noto Serif SC',serif;
  --font-body:'Noto Serif SC',serif;
  --font-mono:'DM Mono','Courier New',monospace;
  --hour-px:46px;              /* 周视图每小时高度，由 app.js 按屏幕高度自动调整 */
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{font-size:16px;}
body{background:var(--cream);color:var(--ink);font-family:var(--font-body);min-height:100vh;
  background-image:repeating-linear-gradient(0deg,transparent,transparent 31px,var(--rule) 31px,var(--rule) 32px);
  background-attachment:fixed;}
button,input,select,textarea{font-family:inherit;}

/* ── 登录页 ─────────────────────────────────────────────── */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;}
.login-box{background:rgba(255,255,255,0.6);border:1px solid var(--rule);border-radius:8px;
  padding:38px 42px;width:min(380px,92vw);box-shadow:0 6px 28px rgba(0,0,0,0.08);}
.login-title{font-family:var(--font-display);font-size:1.5rem;font-style:italic;text-align:center;}
.login-sub{font-family:var(--font-mono);font-size:0.64rem;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--ink-light);text-align:center;margin:6px 0 26px;}
.login-label{font-family:var(--font-mono);font-size:0.66rem;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--ink-mid);display:block;margin-bottom:6px;}
.login-input{width:100%;padding:9px 12px;border:1.5px solid var(--rule);border-radius:4px;
  background:var(--cream);font-family:var(--font-mono);font-size:0.9rem;color:var(--ink);outline:none;}
.login-input:focus{border-color:var(--busy-fg);}
.login-error{font-family:var(--font-mono);font-size:0.68rem;color:var(--busy-fg);margin-top:8px;}
.login-expired{font-family:var(--font-mono);font-size:0.68rem;color:#8a6412;background:#fffaf0;
  border-left:3px solid #b8860b;border-radius:2px;padding:7px 10px;margin-bottom:12px;line-height:1.5;}
.login-btn{width:100%;margin-top:20px;padding:10px;background:var(--ink);color:var(--cream);border:none;
  border-radius:4px;font-family:var(--font-mono);font-size:0.73rem;letter-spacing:0.14em;
  text-transform:uppercase;cursor:pointer;transition:background .15s;}
.login-btn:hover{background:var(--busy-fg);}
.login-hint{margin-top:16px;font-family:var(--font-mono);font-size:0.6rem;color:var(--ink-light);
  line-height:1.7;text-align:center;}
.lang-switch{text-align:center;margin-top:14px;font-family:var(--font-mono);font-size:0.62rem;}
.lang-switch a{color:var(--ink-light);text-decoration:none;margin:0 5px;}
.lang-switch a.active{color:var(--ink);font-weight:500;}

/* ── 浏览器兼容性自检 ─────────────────────────────────────
   排版大量使用 CSS 自定义属性（var/calc）。IE 内核（含 Edge 的 IE 模式）
   不支持它们，页面会整体错乱 —— 这里默认显示警告，支持 CSS 变量的浏览器
   会被下面的 @supports 自动隐藏，用户无需做任何事。 */
.css-alert{display:block;padding:10px 18px;background:#fff5f5;color:#8f2018;
  border-left:4px solid #c0392b;font-size:0.75rem;line-height:1.6;font-family:monospace;}
@supports (--css: 0){ .css-alert{display:none;} }

/* ── 顶栏 ───────────────────────────────────────────────── */
.header{background:var(--ink);position:sticky;top:0;z-index:200;border-bottom:3px solid var(--busy-fg);}
.header-inner{max-width:100%;margin:0 auto;display:flex;align-items:center;justify-content:space-between;
  padding:11px 18px;gap:12px;flex-wrap:wrap;}
.site-title{font-family:var(--font-display);font-size:clamp(0.9rem,2vw,1.15rem);font-style:italic;
  letter-spacing:0.04em;color:var(--cream);opacity:0.88;white-space:nowrap;}
.period-nav{display:flex;align-items:center;gap:12px;}
.nav-btn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;
  background:transparent;border:1.5px solid rgba(245,240,232,0.38);border-radius:50%;
  color:var(--cream);text-decoration:none;font-size:0.95rem;transition:all .15s;cursor:pointer;line-height:1;}
.nav-btn:hover{background:rgba(245,240,232,0.14);border-color:var(--cream);}
.nav-btn.disabled{opacity:0.25;pointer-events:none;}
.nav-btn--text{width:auto;padding:0 12px;border-radius:3px;font-family:var(--font-mono);
  font-size:0.72rem;letter-spacing:0.1em;}
.period-label{font-family:var(--font-display);font-size:clamp(0.95rem,3vw,1.5rem);font-style:italic;
  color:var(--cream);text-align:center;min-width:150px;}
.period-label .sub{font-family:var(--font-mono);font-size:0.46em;font-style:normal;font-weight:300;
  letter-spacing:0.18em;display:block;opacity:0.68;margin-bottom:1px;}
.view-toggle{display:flex;gap:5px;}
.toggle-btn,.lane-btn{font-family:var(--font-mono);font-size:0.7rem;letter-spacing:0.08em;padding:5px 12px;
  border-radius:3px;cursor:pointer;border:none;background:rgba(245,240,232,0.16);color:var(--cream);
  text-transform:uppercase;transition:all .15s;}
.toggle-btn:hover,.lane-btn:hover{background:rgba(245,240,232,0.26);}
.toggle-btn.is-active,.lane-btn.is-active{background:var(--busy-fg);color:#fff;}
/* 泳道开关排布比视图切换次要，压小一点、再收一点字距，别把头部撑宽 */
.lane-toggle{margin-right:2px;}
.lane-btn{padding:5px 9px;font-size:0.62rem;letter-spacing:0.06em;}
.lang-btn{font-family:var(--font-mono);font-size:0.66rem;letter-spacing:0.08em;padding:4px 9px;
  border-radius:3px;text-decoration:none;color:rgba(245,240,232,0.78);
  border:1px solid rgba(245,240,232,0.32);}
.lang-btn.active{color:var(--ink);border-color:var(--cream);background:var(--cream);}

/* ── 图例 ───────────────────────────────────────────────── */
.legend{max-width:100%;margin:0 auto;padding:7px 18px;display:flex;align-items:center;
  flex-wrap:wrap;gap:8px 14px;font-family:var(--font-mono);font-size:0.7rem;color:var(--ink-mid);
  letter-spacing:0.04em;border-bottom:1px solid var(--rule-strong);}
.legend-group{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;}
.legend-title{font-size:0.66rem;letter-spacing:0.1em;text-transform:uppercase;opacity:0.75;}
.acct-toggle{display:flex;align-items:center;gap:5px;cursor:pointer;user-select:none;}
.acct-toggle input{width:13px;height:13px;cursor:pointer;accent-color:var(--c,#888);margin:0;}
.acct-toggle.off{opacity:0.45;text-decoration:line-through;}
.mini-link{background:none;border:none;font-family:var(--font-mono);font-size:0.66rem;
  color:var(--ink-mid);cursor:pointer;text-decoration:underline;padding:0;}
.mini-link:hover{color:var(--ink);}

/* ── 顶部的权限输入框 ─────────────────────────────────────── */
.header-right{display:flex;align-items:center;gap:10px;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end;}
.auth-box{display:flex;align-items:center;gap:6px;}
.auth-input{width:150px;padding:6px 10px;border-radius:3px;border:1px solid rgba(245,240,232,0.42);
  background:rgba(245,240,232,0.16);color:var(--cream);font-family:var(--font-mono);font-size:0.75rem;outline:none;}
/* 输入口令后按回车提交；这里只放一个视觉上不可见但仍存在的 submit，
   保证各浏览器的「隐式提交」行为一致，同时界面上不出现按钮。 */
.auth-btn-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;background:transparent;color:transparent;}
.auth-box{position:relative;}
.auth-input::placeholder{color:rgba(245,240,232,0.62);}
.auth-input:focus{border-color:var(--cream);background:rgba(245,240,232,0.24);}
.auth-badge{font-family:var(--font-mono);font-size:0.7rem;letter-spacing:0.06em;padding:5px 10px;border-radius:3px;
  border:1px solid currentColor;background:rgba(245,240,232,0.1);white-space:nowrap;}
.auth-logout,.auth-act{font-family:var(--font-mono);font-size:0.7rem;color:rgba(245,240,232,0.82);text-decoration:none;}
.auth-logout:hover,.auth-act:hover{color:#fff;text-decoration:underline;}
/* 口令输入框旁的状态提示：错误红 / 成功绿 / 到期橙，同一时刻只显示一条。
   ★ 之前只有彩色小字、没有底色，深色背景上很费眼 —— 现在加同色系半透明底，
     既提高对比度，也让这块「状态区」在视觉上独立出来。 */
.auth-note{font-family:var(--font-mono);font-size:0.7rem;letter-spacing:0.03em;white-space:nowrap;
  padding:4px 9px;border-radius:3px;}
.auth-note.err{color:#ffc9c9;background:rgba(192,57,43,0.32);}
.auth-note.ok{color:#c8ecd2;background:rgba(45,106,79,0.38);}
.auth-note.warn{color:#ffe4ad;background:rgba(184,134,11,0.3);}
/* 等级徽章里的小圆点与倒计时 */
.auth-badge{display:inline-flex;align-items:center;gap:5px;}
.auth-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;display:inline-block;}
.auth-exp{font-variant-numeric:tabular-nums;opacity:0.85;padding-left:6px;margin-left:1px;border-left:1px solid currentColor;}
.auth-exp.urgent{opacity:1;animation:auth-blink 1s steps(2,start) infinite;}
@keyframes auth-blink{50%{opacity:0.35;}}
.legend-item{display:flex;align-items:center;gap:5px;}
.l-bar{width:3px;height:13px;border-radius:2px;flex-shrink:0;}
.l-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;display:inline-block;}
.l-today{width:13px;height:13px;border-radius:50%;background:var(--ink);border:2px solid var(--busy-fg);}
.legend-sep{width:1px;height:14px;background:var(--rule-strong);}
.legend-right{margin-left:auto;display:flex;align-items:center;gap:12px;}
.badge-lv{font-family:var(--font-mono);font-size:0.68rem;letter-spacing:0.06em;padding:3px 8px;
  border-radius:3px;border:1px solid;}

/* ── 提示条 ─────────────────────────────────────────────── */
.bar{max-width:1400px;margin:10px auto 0;padding:8px 20px;border-radius:2px;
  font-family:var(--font-mono);font-size:0.7rem;letter-spacing:0.03em;border-left:4px solid;}
.bar a{text-decoration:underline;}
.bar--err{background:#fff5f5;border-color:var(--busy-fg);color:var(--busy-fg);}
.bar--ok{background:rgba(45,106,79,0.08);border-color:var(--free-fg);color:var(--free-fg);}
.bar--warn{background:#fffaf0;border-color:#b8860b;color:#8a6412;}

/* ── 视图容器 ───────────────────────────────────────────── */
.view{display:none;}
.view.is-active{display:block;animation:fadeIn .22s ease;}
/* 宽度随屏幕自适应铺开，不再限制在 1400px */
.cal-wrap,.week-wrap{max-width:100%;margin:14px auto 40px;padding:0 14px;}
.list-wrap{max-width:960px;margin:14px auto 40px;padding:0 14px;}
@keyframes fadeIn{from{opacity:0;transform:translateY(4px);}to{opacity:1;transform:none;}}

/* ── 月视图 ─────────────────────────────────────────────── */
.weekdays{display:grid;grid-template-columns:repeat(7,1fr);border-bottom:2px solid var(--rule-strong);margin-bottom:3px;}
.weekday-label{text-align:center;font-family:var(--font-mono);font-size:0.6rem;font-weight:500;
  letter-spacing:0.16em;text-transform:uppercase;color:var(--ink-light);padding:5px 4px 7px;}
.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px;}
/* 高度随视口自适应：整月尽量一屏放下，不出现滚动条 */
/* 高度自适应：内容少时占位，日程多时整格自然撑高。
   ★ 这里原来是 overflow:hidden，超出的日程会被直接裁掉看不见，
     和 PHP 里「只显示 3 条」叠加在一起，就成了「还有 N 条但看不到那段」。 */
.day-cell{min-height:clamp(94px,calc((100vh - 300px) / 6),210px);background:var(--cream);border:1px solid var(--rule);border-radius:3px;
  padding:5px 6px 6px;position:relative;cursor:pointer;}
.day-cell.other-month{background:transparent;border-color:transparent;cursor:default;}
.day-cell.is-today{border-color:var(--ink);border-width:1.5px;}
.day-cell.has-busy{background:#f7edec;border-color:rgba(192,57,43,0.15);}
.day-cell.has-busy.is-today{border-color:var(--busy-fg);border-width:2px;}
.day-cell.is-past{opacity:0.4;}
.day-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px;}
.day-number{font-family:var(--font-mono);font-size:0.7rem;color:var(--ink-mid);width:20px;height:20px;
  display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;}
.is-today .day-number{background:var(--ink);color:var(--cream);border-radius:50%;}
.has-busy .day-number{color:var(--busy-fg);font-weight:500;}
.has-busy.is-today .day-number{background:var(--busy-fg);color:#fff;border-radius:50%;}
.badge-allday{font-family:var(--font-mono);font-size:0.46rem;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--busy-fg);background:rgba(192,57,43,0.11);border:1px solid rgba(192,57,43,0.25);
  border-radius:2px;padding:1px 4px;}
.slot-list{display:flex;flex-direction:column;gap:2px;}
.slot{display:flex;align-items:stretch;border-radius:2px;overflow:hidden;
  font-family:var(--font-mono);font-size:0.52rem;line-height:1.35;}
.slot-bar{width:3px;flex-shrink:0;}
.slot-body{padding:2px 4px;flex:1;min-width:0;}
.slot-row{display:flex;align-items:baseline;gap:3px;}
.slot-time{opacity:0.8;white-space:nowrap;}
.slot-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;
  font-size:0.53rem;margin-top:1px;opacity:0.85;}
.slot--free{background:var(--free-bg);color:var(--free-fg);}
.slot--free .slot-bar{background:var(--free-fg);}
.slot--busy{background:var(--busy-bg);color:var(--busy-fg);}
.slot--busy .slot-bar{background:var(--busy-fg);}
.ev-pill{border-left:3px solid var(--c,#c0392b);
  background:rgba(192,57,43,0.08);                                   /* 老浏览器兜底 */
  background:color-mix(in srgb,var(--c,#c0392b) 12%,transparent);
  border-radius:2px;padding:2px 5px;margin-bottom:2px;overflow:hidden;}
.ev-pill .t{font-family:var(--font-mono);font-size:0.5rem;color:var(--ink-mid);opacity:0.75;}
.ev-pill .s{font-size:0.58rem;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;}
.ad-pill{background:rgba(192,57,43,0.12);border-left:3px solid var(--c,#c0392b);border-radius:2px;
  padding:1px 5px;margin-bottom:2px;font-family:var(--font-mono);font-size:0.5rem;color:var(--busy-fg);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* ── 周视图 ─────────────────────────────────────────────── */
.week-grid-outer{display:flex;border:1px solid var(--rule-strong);border-radius:4px;overflow:hidden;background:var(--cream);}
.week-time-col{width:46px;flex-shrink:0;border-right:1px solid var(--rule-strong);background:var(--cream-dark);
  overflow:hidden;}
.week-time-head{height:52px;border-bottom:1px solid var(--rule-strong);}
.week-time-allday{height:26px;border-bottom:1px solid var(--rule-strong);}
.week-time-label{height:var(--hour-px);display:flex;align-items:flex-start;justify-content:flex-end;
  padding:3px 6px 0 0;font-family:var(--font-mono);font-size:0.52rem;color:var(--ink-light);
  border-bottom:1px solid var(--rule);overflow:hidden;}
/* 紧缩时段（夜间）的刻度很矮，数字要再收一点才不至于挤成一团 */
.week-time-label.compact{padding-top:1px;font-size:0.44rem;line-height:1.1;}
/* 不再用内部滚动容器：整个周视图铺开，由页面本身滚动 */
.week-days-area{flex:1;min-width:0;overflow:visible;}
.week-days-grid{display:grid;grid-template-columns:repeat(var(--wdays,7),minmax(0,1fr));}
.week-col-head{padding:7px 4px 6px;text-align:center;border-bottom:2px solid var(--rule-strong);
  border-right:1px solid var(--rule);background:var(--cream-dark);position:relative;z-index:20;}
.week-col-head:last-child{border-right:none;}
.week-col-dow{font-family:var(--font-mono);font-size:0.58rem;font-weight:500;letter-spacing:0.14em;
  text-transform:uppercase;color:var(--ink-light);}
.week-col-date{font-family:var(--font-mono);font-size:1.05rem;color:var(--ink-mid);
  display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;
  border-radius:50%;margin-top:2px;}
.week-col-head.is-today .week-col-dow{color:var(--busy-fg);}
.week-col-head.is-today .week-col-date{background:var(--ink);color:var(--cream);}
.week-col-head.is-today.has-busy .week-col-date{background:var(--busy-fg);color:#fff;}
.week-allday-row{display:grid;grid-template-columns:repeat(var(--wdays,7),minmax(0,1fr));
  border-bottom:1px solid var(--rule-strong);}
.week-allday-cell{padding:2px 3px;border-right:1px solid var(--rule);min-height:26px;cursor:pointer;}
.week-allday-cell:last-child{border-right:none;}
.week-body{display:grid;grid-template-columns:repeat(var(--wdays,7),minmax(0,1fr));position:relative;}
.week-day-col{position:relative;border-right:1px solid var(--rule);cursor:copy;min-width:0;}
.week-day-col:last-child{border-right:none;}
.week-day-col.is-past{opacity:0.45;}
.week-hour-line{height:var(--hour-px);border-bottom:1px solid var(--rule);}
.week-hour-line.work-start{border-top:2px solid rgba(45,106,79,0.22);}
.week-hour-line.work-end{border-bottom:2px solid rgba(45,106,79,0.22);}
.week-work-bg{position:absolute;left:0;right:0;background:rgba(45,106,79,0.04);pointer-events:none;z-index:0;}
.ev-block{position:absolute;z-index:2;border-radius:2px;overflow:hidden;cursor:pointer;
  border-left:3px solid var(--c,#c0392b);
  top:calc(var(--t,0) * var(--hour-px) / 60);
  height:calc(var(--h,15) * var(--hour-px) / 60);
  background:rgba(255,255,255,0.9);                                  /* 老浏览器兜底 */
  background:color-mix(in srgb,var(--c,#c0392b) 14%,#fff);
  box-shadow:0 1px 2px rgba(0,0,0,0.06);}
/* 日程太短或被挤成窄条时，隐去时间行，保证标题还能露出来 */
.ev-block.tiny .tm,.ev-block.narrow .tm{display:none;}
.ev-block.tiny .inner{padding:1px 4px;}
.ev-block.narrow .ow{display:none;}
.ev-block.narrow .inner{padding:2px 3px;}
/* 通道多到极致时（≥6 条）：标题已经不可能读出来，反过来只保留开始时间，
   至少还能靠位置确定「谁在什么时候有空」。注意要写在 narrow 之后覆盖掉它的隐藏规则。 */
.ev-block.dense .tm{display:block;font-size:0.46rem;line-height:1.1;letter-spacing:0;}
.ev-block.dense .ti{display:none;}
.ev-block.dense .inner{padding:1px 2px;}
.ev-block:hover{filter:brightness(0.97);box-shadow:0 2px 6px rgba(0,0,0,0.12);}
.ev-block .inner{padding:2px 5px;}
.ev-block .tm{font-family:var(--font-mono);font-size:0.5rem;color:var(--ink-mid);opacity:0.8;display:block;}
.ev-block .ti{font-size:0.6rem;color:var(--ink);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ev-block .ow{font-family:var(--font-mono);font-size:0.5rem;opacity:0.6;display:block;}
.busy-block{position:absolute;z-index:1;left:2px;right:2px;border-radius:2px;
  top:calc(var(--t,0) * var(--hour-px) / 60);
  height:calc(var(--h,14) * var(--hour-px) / 60);
  background:var(--busy-bg);border-left:3px solid var(--busy-fg);}
.busy-block .lbl{display:block;}
.busy-block .inner{padding:2px 5px;font-family:var(--font-mono);font-size:0.5rem;color:var(--busy-fg);
  letter-spacing:0.1em;text-transform:uppercase;}
.busy-block .who{font-size:0.5rem;opacity:0.75;text-transform:none;letter-spacing:0;display:block;}
.free-block{position:absolute;z-index:1;left:2px;right:2px;border-radius:2px;
  background:var(--free-bg);border-left:3px solid var(--free-fg);}
.free-block.off{background:var(--free-off-bg);border-left-color:var(--free-off-bar);}
.now-line{position:absolute;left:0;right:0;height:2px;background:var(--busy-fg);z-index:30;pointer-events:none;
  top:calc(var(--t,0) * var(--hour-px) / 60);}
.now-line::before{content:'';position:absolute;left:-1px;top:-4px;width:10px;height:10px;
  border-radius:50%;background:var(--busy-fg);}

/* ── 列表视图 ───────────────────────────────────────────── */
.list-month-bar{display:flex;align-items:center;justify-content:space-between;padding:12px 0 9px;
  border-bottom:2px solid var(--rule-strong);margin-bottom:11px;}
.list-month-title{font-family:var(--font-display);font-size:1.35rem;font-style:italic;}
.list-month-sub{font-family:var(--font-mono);font-size:0.6rem;color:var(--ink-light);letter-spacing:0.1em;}
.list-day{margin-bottom:9px;border:1px solid var(--rule);border-radius:6px;overflow:hidden;background:var(--cream);}
.list-day.has-busy{border-color:rgba(192,57,43,0.22);background:#faf3f2;}
.list-day.is-today{border-color:var(--ink);border-width:2px;}
.list-day.is-past{opacity:0.45;}
.list-day-head{display:flex;align-items:center;gap:11px;padding:8px 12px;border-bottom:1px solid var(--rule);
  background:rgba(255,255,255,0.4);cursor:pointer;}
.list-day-num{font-family:var(--font-mono);font-size:1.3rem;color:var(--ink-mid);width:32px;text-align:center;flex-shrink:0;}
.list-day.is-today .list-day-num{background:var(--ink);color:var(--cream);border-radius:50%;
  width:32px;height:32px;display:flex;align-items:center;justify-content:center;}
.list-day-meta{flex:1;}
.list-day-dow{font-family:var(--font-mono);font-size:0.66rem;letter-spacing:0.1em;color:var(--ink-light);}
.list-day-date{font-size:0.72rem;color:var(--ink-mid);}
.list-badge{font-family:var(--font-mono);font-size:0.5rem;letter-spacing:0.1em;border-radius:2px;padding:2px 6px;}
.list-badge--today{color:var(--cream);background:var(--ink);}
.list-slots{padding:7px 9px;display:flex;flex-direction:column;gap:4px;}
.list-ev{display:flex;align-items:stretch;border-radius:3px;overflow:hidden;cursor:pointer;
  background:rgba(192,57,43,0.07);                                   /* 老浏览器兜底 */
  background:color-mix(in srgb,var(--c,#c0392b) 10%,transparent);}
.list-ev-bar{width:4px;flex-shrink:0;background:var(--c,#c0392b);}
.list-ev-body{padding:5px 9px;display:flex;align-items:center;gap:9px;flex:1;min-width:0;}
.list-ev-time{font-family:var(--font-mono);font-size:0.76rem;flex-shrink:0;color:var(--ink-mid);}
.list-ev-title{font-size:0.76rem;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.list-ev-who{font-family:var(--font-mono);font-size:0.55rem;opacity:0.7;flex-shrink:0;}
.list-free-note{padding:8px 12px;font-family:var(--font-mono);font-size:0.64rem;color:var(--ink-light);}

/* ── 弹窗 ───────────────────────────────────────────────── */
.modal-backdrop{position:fixed;inset:0;background:rgba(26,22,18,0.45);display:none;
  align-items:center;justify-content:center;z-index:1000;padding:18px;}
.modal-backdrop.open{display:flex;}
.modal{background:var(--cream);border-radius:8px;width:min(540px,96vw);max-height:92vh;overflow:auto;
  box-shadow:0 12px 40px rgba(0,0,0,0.25);}
.modal-head{padding:14px 20px;border-bottom:1px solid var(--rule-strong);display:flex;
  align-items:center;justify-content:space-between;}
.modal-title{font-family:var(--font-display);font-size:1.15rem;font-style:italic;}
.modal-close{background:none;border:none;font-size:1.2rem;color:var(--ink-light);cursor:pointer;line-height:1;}
.modal-close:hover{color:var(--busy-fg);}
.modal-body{padding:16px 20px;}
.modal-foot{padding:12px 20px 18px;display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
.f-row{display:flex;gap:10px;margin-bottom:11px;flex-wrap:wrap;}
.f-row>label{flex:1;min-width:130px;}
.f-label{font-family:var(--font-mono);font-size:0.6rem;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--ink-mid);display:block;margin-bottom:4px;}
.f-input,.f-select,.f-textarea{width:100%;padding:7px 10px;border:1.5px solid var(--rule);border-radius:4px;
  background:#fff;font-size:0.82rem;color:var(--ink);outline:none;}
.f-input:focus,.f-select:focus,.f-textarea:focus{border-color:var(--busy-fg);}
.f-textarea{min-height:62px;resize:vertical;}
.f-check{display:flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:0.66rem;color:var(--ink-mid);}
.btn{padding:8px 16px;border-radius:4px;border:1.5px solid transparent;cursor:pointer;
  font-family:var(--font-mono);font-size:0.66rem;letter-spacing:0.1em;text-transform:uppercase;transition:all .15s;}
.btn--primary{background:var(--ink);color:var(--cream);}
.btn--primary:hover{background:var(--busy-fg);}
.btn--ghost{background:transparent;color:var(--ink-mid);border-color:var(--rule-strong);}
.btn--ghost:hover{border-color:var(--ink);}
.btn--danger{background:transparent;color:var(--busy-fg);border-color:rgba(192,57,43,0.4);}
.btn--danger:hover{background:var(--busy-fg);color:#fff;}
.btn:disabled{opacity:0.5;cursor:not-allowed;}
.foot-right{margin-left:auto;display:flex;gap:10px;}
.form-msg{font-family:var(--font-mono);font-size:0.66rem;min-height:1em;}
.form-msg.err{color:var(--busy-fg);}
.form-msg.ok{color:var(--free-fg);}
.repeat-box{border:1px dashed var(--rule-strong);border-radius:4px;padding:10px;margin-bottom:11px;}
.hint{font-family:var(--font-mono);font-size:0.6rem;color:var(--ink-light);line-height:1.6;}

/* ── 页脚 / 响应式 ──────────────────────────────────────── */
.footer{border-top:1px solid var(--rule-strong);padding:12px 22px;text-align:center;
  font-family:var(--font-mono);font-size:0.56rem;color:var(--ink-light);letter-spacing:0.12em;text-transform:uppercase;}
@media(max-width:760px){
  .view[data-v="week"],.view[data-v="month"]{display:none!important;}
  .view[data-v="list"].is-active{display:block!important;}
  .view-toggle,.lang-btn,.site-title{display:none;}
  .header-inner{padding:9px 12px;}
  .legend{padding:5px 12px;font-size:0.56rem;}
}