/* 线上才有的几样的版面（上线与往返设计 3.137–3.140）。取值照旧在 tokens.css，构件照旧在 ui.css；
   这里只放线上页头、数据来源面板、登录与提案的弹框、账号与提案页独有的那几处。本机页面不加载这一份。 */

.ol-hd { display: flex; align-items: center; gap: var(--sp1); flex-wrap: wrap; }
.ol-hd .vsep { width: 1px; align-self: stretch; background: var(--line); margin: 0 var(--sp1); }
.ol-hd label { font-size: var(--fs2); color: var(--fg2); display: inline-flex; gap: var(--sp1); align-items: center; }
.ol-hd select { font: inherit; font-size: var(--fs2); }
.ol-src[aria-expanded="true"] { border-color: var(--acc); background: var(--acc-soft); }

.ol-panel__grid { display: grid; gap: var(--sp3); grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.ol-blk { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--sp3); display: flex; flex-direction: column; gap: var(--sp1); }
.ol-blk__hd { display: flex; align-items: baseline; gap: var(--sp2); flex-wrap: wrap; }
.ol-blk__big { font-size: var(--fs5); font-variant-numeric: tabular-nums; line-height: 1.2; }
.ol-bar { flex: 1 1 140px; height: .6em; background: var(--surface2); border-radius: var(--r-sm); overflow: hidden; }
.ol-bar > i { display: block; height: 100%; background: var(--acc); }

.ol-dlg { width: min(560px, calc(100% - var(--sp4) * 2)); }
.ol-dlg form, .ol-dlg .sheet__body { display: flex; flex-direction: column; gap: var(--sp3); }
.ol-dlg label.ol-f { display: flex; flex-direction: column; gap: 2px; font-size: var(--fs2); color: var(--fg2); }
.ol-dlg input { font: inherit; }
.ol-dlg dl { margin: 0; display: grid; grid-template-columns: max-content 1fr; gap: var(--sp1) var(--sp3); font-size: var(--fs2); }
.ol-dlg dt { color: var(--fg3); }
.ol-dlg dd { margin: 0; }
.ol-way { border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--sp2); font-size: var(--fs2); display: flex; flex-direction: column; gap: 2px; }
.ol-acts { display: flex; gap: var(--sp2); justify-content: flex-end; flex-wrap: wrap; }
.ol-err { color: var(--bad); background: var(--bad-soft); border: 1px solid var(--bad-line); border-radius: var(--r-sm); padding: var(--sp1) var(--sp2); font-size: var(--fs2); }

/* 账号与提案页：左边一列节的目录，右边内容自己滚 */
.adm { flex: 1 1 auto; min-height: 0; display: flex; }
.adm__nav { flex: 0 0 15em; border-right: 1px solid var(--line); background: var(--surface); padding: var(--sp3); display: flex; flex-direction: column; gap: 2px; overflow: auto; }
.adm__nav a { display: flex; justify-content: space-between; gap: var(--sp2); padding: var(--sp1) var(--sp2); border-radius: var(--r-sm); color: var(--fg); font-size: var(--fs2); }
.adm__nav a:hover { background: var(--hover); text-decoration: none; }
.adm__main { flex: 1 1 auto; min-width: 0; overflow: auto; padding: var(--sp4); display: flex; flex-direction: column; gap: var(--sp4); }
.adm__main > section { max-width: 1100px; }
.adm-prop { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--sp3); display: flex; flex-direction: column; gap: var(--sp2); }
.adm-prop[data-live="true"] { border-color: var(--acc-line); }
.adm-prop__hd { display: flex; align-items: baseline; gap: var(--sp2); flex-wrap: wrap; }
.adm-prop__hd h3 { font-size: var(--fs3); font-weight: 400; }
.adm-two { display: grid; gap: var(--sp3); grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.adm-log { margin: 0; padding-left: 1.4em; font-size: var(--fs2); font-variant-numeric: tabular-nums; display: flex; flex-direction: column; gap: 2px; }
.adm-form { display: flex; gap: var(--sp2); flex-wrap: wrap; align-items: flex-end; }
.adm-form label { display: flex; flex-direction: column; gap: 2px; font-size: var(--fs1); color: var(--fg3); }
.adm-form input, .adm-form select { font: inherit; font-size: var(--fs2); }
@media (max-width: 720px) {
  .adm { flex-direction: column; overflow: auto; }
  .adm__nav { flex: 0 0 auto; border-right: 0; border-bottom: 1px solid var(--line); flex-direction: row; flex-wrap: wrap; }
  .adm__main { overflow: visible; }
}
input[type="password"] {
  font: inherit; font-size: var(--fs2); color: var(--fg);
  background: var(--surface2); border: 1px solid var(--line);
  border-radius: var(--r-sm); padding: 2px var(--sp1);
}
.ol-dlg input[type="text"], .ol-dlg input[type="password"] { font-size: var(--fs3); padding: var(--sp1) var(--sp2); }
/* 窄屏：线上页头多了几样，让动作那一处换到标题下面一整行，标题不被挤成一列 */
@media (max-width: 720px) {
  html[data-online] .hd { flex-wrap: wrap; }
  html[data-online] .hd__actions { flex: 1 1 100%; margin-left: 0; flex-wrap: wrap; }
}