/* 澄清南北 · 统一模态框与 Toast 样式（token 重写版）
   类名与 ui-dialog.js 生成结构一一对应，不得更名。
   依赖 css/tokens.css；变量缺失时的回退值与 token 默认值一致，可独立工作。 */
:root{
  --ui-paper:var(--cqnb-panel,#fffdf7);
  --ui-ink:var(--cqnb-ink,#2b2620);
  --ui-muted:var(--cqnb-muted,#6b6257);
  --ui-line:var(--cqnb-line-strong,rgba(43,38,32,.24));
  --ui-accent:var(--cqnb-accent,#33566b);
  --ui-danger:var(--cqnb-danger,#a63d2a);
  --ui-success:var(--cqnb-success,#3f6b4f);
  --ui-warning:var(--cqnb-warning,#8a6420);
  --ui-info:var(--cqnb-info,#33566b);
}
body.ui-dialog-scroll-lock{overflow:hidden}
/* Safari<15.4 无 inert：降级为不可交互（配合 ui-dialog.js 的 aria-hidden）。 */
.ui-inert-fallback{pointer-events:none!important;user-select:none!important}
.ui-dialog-overlay{
  position:fixed;inset:0;z-index:var(--cqnb-z-dialog,100000);
  display:grid;place-items:center;padding:16px;box-sizing:border-box;
  background:rgba(43,38,32,.48);
}
.ui-dialog{
  width:min(560px,100%);max-height:min(84vh,760px);max-height:min(84dvh,760px);
  display:flex;flex-direction:column;overflow:hidden;box-sizing:border-box;
  background:var(--ui-paper);color:var(--ui-ink);
  border:1px solid var(--ui-line);border-top:4px solid var(--ui-accent);
  border-radius:var(--cqnb-radius-lg,6px);
  box-shadow:var(--cqnb-shadow-lg,0 12px 32px rgba(43,38,32,.18));
  font-family:var(--cqnb-font-body,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif);
}
.ui-dialog>header{
  display:flex;align-items:center;gap:10px;
  padding:14px 18px 10px;border-bottom:1px solid var(--cqnb-line,rgba(43,38,32,.14));
}
.ui-dialog>header h2{
  margin:0;font:700 var(--cqnb-text-lg,15px)/1.4 var(--cqnb-font-title,"Songti SC","STSong","Noto Serif CJK SC",serif);
  letter-spacing:.04em;
}
.ui-dialog-kicker{display:block;font-size:var(--cqnb-text-xs,11px);color:var(--ui-muted);letter-spacing:.12em}
.ui-dialog-mark{
  flex:none;width:26px;height:26px;display:grid;place-items:center;border-radius:50%;
  background:var(--cqnb-accent-soft,#e3ebf0);color:var(--ui-accent);
  font-weight:700;border:1px solid var(--ui-accent);
}
.ui-dialog-body{padding:12px 18px;overflow-y:auto;overflow-wrap:anywhere}
.ui-dialog-message{margin:0 0 8px;font-size:var(--cqnb-text-md,13px);line-height:1.7}
.ui-dialog-detail{margin:0 0 8px;font-size:var(--cqnb-text-sm,12px);color:var(--ui-muted);line-height:1.6}
.ui-dialog-details{margin:0 0 8px;display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:var(--cqnb-text-sm,12px)}
.ui-dialog-details dt{color:var(--ui-muted)}
.ui-dialog-details dd{margin:0;overflow-wrap:anywhere}
.ui-dialog-field{display:flex;flex-direction:column;gap:6px;margin:4px 0 8px;font-size:var(--cqnb-text-md,13px)}
.ui-dialog-field input,.ui-dialog-field textarea{
  width:100%;box-sizing:border-box;min-height:var(--cqnb-control-h,40px);
  border:1px solid var(--ui-line);border-radius:var(--cqnb-radius,5px);
  background:var(--cqnb-panel-raised,#fff);color:var(--ui-ink);
  padding:8px 10px;font:inherit;
}
.ui-dialog-field input:focus-visible,.ui-dialog-field textarea:focus-visible{
  outline:2px solid var(--ui-info);outline-offset:1px;border-color:var(--ui-info);
}
.ui-dialog-hint{color:var(--ui-muted);font-size:var(--cqnb-text-xs,11px)}
.ui-dialog-error{
  margin:8px 0 0;padding:8px 10px;border-radius:var(--cqnb-radius,5px);
  background:var(--cqnb-danger-soft,#f5e4de);border:1px solid var(--ui-danger);
  color:var(--ui-danger);font-size:var(--cqnb-text-sm,12px);
}
.ui-dialog>footer{
  display:flex;justify-content:flex-end;gap:10px;
  padding:12px 18px;border-top:1px solid var(--cqnb-line,rgba(43,38,32,.14));
  background:var(--cqnb-bg-soft,#efe9db);
}
.ui-dialog>footer button{
  min-height:var(--cqnb-button-h,40px);padding:8px 18px;border:0;
  border-radius:var(--cqnb-radius,5px);background:var(--ui-accent);color:var(--cqnb-on-accent,#fff);
  font:inherit;font-weight:600;cursor:pointer;
  transition:background var(--cqnb-motion-fast,150ms ease);
}
.ui-dialog>footer button:hover:not(:disabled){background:var(--cqnb-accent-strong,#264252)}
.ui-dialog>footer button:disabled{opacity:.5;cursor:not-allowed}
.ui-dialog>footer button:focus-visible{outline:2px solid var(--ui-info);outline-offset:2px}
.ui-dialog>footer .ui-dialog-cancel{background:var(--cqnb-neutral,#5c554b)}
.ui-dialog>footer .ui-dialog-cancel:hover:not(:disabled){background:var(--cqnb-ink-soft,#4c453c)}
.ui-dialog>footer .ui-dialog-danger-action{background:var(--ui-danger)!important}
.ui-dialog>footer .ui-dialog-danger-action:hover:not(:disabled){background:var(--cqnb-danger-strong,#8f3323)!important}
.ui-dialog-warning{border-top-color:var(--ui-warning)}
.ui-dialog-warning .ui-dialog-mark{background:var(--cqnb-warning-soft,#f4ecd8);color:var(--ui-warning);border-color:var(--ui-warning)}
.ui-dialog-error,.ui-dialog-danger{border-top-color:var(--ui-danger)}
.ui-dialog-error .ui-dialog-mark{background:var(--cqnb-danger-soft,#f5e4de);color:var(--ui-danger);border-color:var(--ui-danger)}
.ui-dialog-danger .ui-dialog-mark{background:var(--ui-danger);color:var(--cqnb-on-accent,#fff);border-color:var(--ui-danger)}
.ui-dialog-success{border-top-color:var(--ui-success)}
.ui-dialog-success .ui-dialog-mark{background:var(--cqnb-success-soft,#e4ede6);color:var(--ui-success);border-color:var(--ui-success)}
.ui-toast-host{
  position:fixed;right:16px;bottom:16px;z-index:var(--cqnb-z-toast,100100);
  display:flex;flex-direction:column;gap:8px;pointer-events:none;
  max-width:min(360px,calc(100vw - 32px));
}
.ui-toast{
  pointer-events:auto;display:flex;align-items:flex-start;gap:10px;
  padding:10px 12px;background:var(--ui-paper);color:var(--ui-ink);
  border:1px solid var(--ui-line);border-left:4px solid var(--ui-info);
  border-radius:var(--cqnb-radius,5px);
  box-shadow:var(--cqnb-shadow,0 2px 8px rgba(43,38,32,.10));
  font-size:var(--cqnb-text-md,13px);line-height:1.5;overflow-wrap:anywhere;
  animation:ui-toast-in var(--cqnb-motion,200ms ease);
}
.ui-toast b{display:block;font-size:var(--cqnb-text-sm,12px)}
.ui-toast-success{border-left-color:var(--ui-success)}
.ui-toast-warning{border-left-color:var(--ui-warning)}
.ui-toast-error{border-left-color:var(--ui-danger)}
.ui-toast-close{
  flex:none;margin-left:auto;min-height:32px;min-width:32px;padding:0 6px!important;
  border:0;background:none!important;color:var(--ui-muted);font-size:16px;cursor:pointer;
}
.ui-toast-close:hover{color:var(--ui-ink)}
.ui-toast-close:focus-visible{outline:2px solid var(--ui-info);outline-offset:1px}
@keyframes ui-toast-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* 小屏（系统断点 480）：弹窗变底部抽屉，按钮整行排列。 */
@media (max-width:480px){
  .ui-dialog-overlay{padding:0;place-items:end center}
  .ui-dialog{
    width:100%;max-height:88vh;max-height:88dvh;
    border-radius:var(--cqnb-radius-lg,6px) var(--cqnb-radius-lg,6px) 0 0;
    border-left:0;border-right:0;border-bottom:0;
  }
  .ui-dialog>footer{position:sticky;bottom:0;flex-direction:column}
  .ui-dialog>footer button{width:100%;min-height:44px}
  .ui-toast-host{right:8px;left:8px;bottom:8px;max-width:none}
}
@media (prefers-reduced-motion:reduce){
  .ui-toast{animation:none}
  .ui-dialog>footer button{transition:none}
}