/* 月报多平台 M1（v2.1.9）：首页「📈 月报 ▾」按钮 + 下拉菜单。**只挂 index.html**
   （⛔ 不进 app.css：否则 6 个 html 都要 bump ?v=，finance.html 就动了 —— 本批 SC 页面逐字不变）。
   class 一律 `fin-menu` / `fin-tag` 前缀，先 grep 过 app.css / tasks.css 无同名（批 B `.btn-menu` 撞车教训）。
   .fin-menu 的定位取值照 weekly.css 的 .wk-drop-menu（absolute / top:calc(100% + 5px) / z-index:42 / min-width:200px），
   ⛔ 不复制整段、不动 weekly.css / finance.css。贴顶栏右侧展开 ⇒ right:0 而不是 left:0（DOM-CSS 六查之「贴右边缘别用默认 left:0」）。 */
.fin-menu-wrap { position: relative; }
/* .btn-weekly（app.css）是给 <a> 写的：<button> 要抹掉 UA 的边框 / 字体族 / 行高才与原 <a> 外观一致。
   ⚠️ 只重置 font-family 不写 font:inherit —— 后者会把 .btn-weekly 的 13px / 600 一起盖掉（特异性更高）。 */
button.btn-weekly { font-family: inherit; line-height: inherit; cursor: pointer; border: 0; }
.fin-menu { position: absolute; right: 0; top: calc(100% + 5px); z-index: 42; min-width: 200px;
            background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 7px;
            box-shadow: 0 6px 20px rgba(0, 0, 0, .16); text-align: left; }
.fin-menu-item { display: flex; align-items: center; gap: 8px; padding: 5px 8px; border-radius: 7px;
                 font-size: 13px; color: var(--text); text-decoration: none; white-space: nowrap; }
.fin-menu-item:hover { background: var(--hover); }
.fin-menu-item.is-planned { opacity: .55; }
.fin-tag { margin-left: auto; font-size: 11px; color: var(--muted); background: var(--bg);
           padding: 1px 6px; border-radius: 10px; }
.fin-menu-note { font-size: 11px; color: var(--muted); padding: 4px 8px 2px; }

/* M1.1（v2.1.10）：多渠道平台 = 一行「平台 ▸」父项（<button>），子菜单在**右侧**飞出。
   开启条件三选一：wrapper :hover / :focus-within（键盘 Tab）/ .is-open（点击，main.js 切）。
   子菜单 top:-8px 抵消它自身 padding 7 + 边框 1，让第一行与父项行平齐；left:calc(100% + 12px) = 父菜单 8px 内边距 + 4px 视觉间隙。
   右飞不会出屏：顶栏右侧固定让 172px 给浮标 + 两颗图标，菜单右缘到 .main 右缘 >= 212px（专稿 §1.2 实测），子菜单 160 + 4 装得下。
   父项按钮：只重置 font-family / line-height，⛔ 不写 font:inherit（会把 .fin-menu-item 的 13px 盖掉，M1 §9.1 第 2 条同坑）。 */
.fin-menu-has-sub { position: relative; }
.fin-menu-parent { width: 100%; background: none; border: 0; font-family: inherit; line-height: inherit;
                   color: var(--text); text-align: left; cursor: pointer; }
.fin-caret { margin-left: auto; font-size: 11px; color: var(--muted); transition: transform .15s; }
.fin-menu-sub { display: none; position: absolute; top: -8px; left: calc(100% + 12px); min-width: 160px;
                background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 7px;
                box-shadow: 0 6px 20px rgba(0, 0, 0, .16); }
/* 悬停桥：盖住父菜单 8px 内边距 + 4px 视觉间隙 = 12px，再多 2px 压进子菜单边框 => 14px；鼠标从父项横移到子菜单途中 wrapper 的 :hover 不断 */
.fin-menu-sub::before { content: ""; position: absolute; top: 0; bottom: 0; left: -14px; width: 14px; }
.fin-menu-has-sub:hover > .fin-menu-sub,
.fin-menu-has-sub:focus-within > .fin-menu-sub,
.fin-menu-has-sub.is-open > .fin-menu-sub { display: block; }
.fin-menu-has-sub:hover > .fin-menu-parent,
.fin-menu-has-sub.is-open > .fin-menu-parent { background: var(--hover); }

/* 移动端（app.css 的 768 断点）：仍贴右，限高可滚 */
@media (max-width: 768px) {
  .fin-menu { right: 0; max-height: 60vh; overflow: auto; }
  /* 无悬停 + 上面的 overflow:auto 会裁掉绝对定位子元素 => 子菜单进文档流、在父项下方展开，只认 .is-open */
  .fin-menu-has-sub:hover > .fin-menu-sub,
  .fin-menu-has-sub:focus-within > .fin-menu-sub { display: none; }
  .fin-menu-has-sub.is-open > .fin-menu-sub { display: block; }
  .fin-menu-sub { position: static; min-width: 0; border: 0; box-shadow: none; background: none; padding: 0 0 0 12px; }
  .fin-menu-sub::before { display: none; }
  .fin-menu-has-sub.is-open .fin-caret { transform: rotate(90deg); }
}
