/* Menu, dialogs and toast. */
/* menu, dialogs, toast */
.menu{position:fixed;z-index:60;min-width:190px;max-width:320px;background:var(--raised);border-radius:var(--r3);box-shadow:var(--shadow);padding:5px;display:flex;flex-direction:column;animation:pop .1s ease-out}
.menu[hidden]{display:none}
.menu .mt{padding:6px 10px 4px;font-size:11px;font-weight:600;letter-spacing:var(--caps);text-transform:uppercase;color:var(--faint)}
.mi{display:flex;align-items:center;gap:10px;padding:6px 10px;border-radius:var(--r2);min-height:30px}
.mi .mnote{color:var(--faint);font-size:11px}
.mi .ml{flex:1;min-width:0} .mi .mnote{flex:none;margin-left:auto;padding-left:14px} .mi:hover,.mi:focus{background:var(--hover);outline:0}
.mi.danger{color:var(--danger)} .mi:disabled{opacity:.4;cursor:default} .mi:disabled:hover{background:none}
.msep{height:1px;background:var(--line-soft);margin:4px 6px}
.menu.ctxm{min-width:240px}
.ctx{outline:1px solid var(--accent);outline-offset:-1px}
.mi:focus-visible{background:var(--sel)}
.mi.on{color:var(--accent)}
.mi .dot{width:8px;height:8px;border-radius:50%;background:var(--faint);flex:none}
.mi .dot.p-critical{background:var(--crit)} .mi .dot.p-high{background:var(--high)} .mi .dot.p-medium{background:var(--med)}
.menu input[type=date]{margin:4px 5px 5px;background:var(--stage);border:1px solid var(--line);border-radius:var(--r2);padding:4px 8px;min-height:30px}
dialog{border:0;padding:0;background:var(--raised);color:var(--text);border-radius:var(--r4);box-shadow:var(--shadow);width:min(640px,calc(100vw - 24px));max-height:calc(100vh - 40px);overflow:auto}
dialog[open]{animation:pop .14s ease-out}
dialog::backdrop{background:rgba(0,0,0,.5)}
dialog[open]::backdrop{animation:fade .14s ease-out}
dialog:focus{outline:none}
@keyframes pop{from{opacity:0;transform:translateY(4px) scale(.985)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
dialog.top{margin-top:12vh}
.dlg{padding:16px 18px 18px}
.dlg h2{margin:0 0 10px;font-size:15px}
.dlg h3{margin:16px 0 6px;font-size:11px;letter-spacing:var(--caps);text-transform:uppercase;color:var(--muted)}
#capIn{width:100%;height:42px;font-size:15px;background:var(--stage);border:1px solid var(--line);border-radius:var(--r3);padding:0 12px;outline:0}
#capIn:focus{border-color:var(--accent)}
.chips{display:flex;flex-wrap:wrap;gap:6px;min-height:26px;margin:10px 0 4px;align-items:center}
.chip{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;border-radius:11px;background:var(--stage);border:1px solid var(--line);color:var(--muted);font-size:12px}
.chip.warn{border-color:var(--warn);color:var(--warn)}
.hint{color:var(--faint);font-size:12px;line-height:1.6}
.hint .k{white-space:nowrap;display:inline-block;margin-right:10px}
.dlg select.pin{width:auto;margin-left:8px;border-color:var(--line);background-color:var(--stage);padding-left:10px}
.filebtn{position:relative;overflow:hidden}
.filebtn input{position:absolute;inset:0;opacity:0;cursor:pointer;font-size:0}
.filebtn:focus-within{outline:2px solid var(--accent);outline-offset:1px}
.kgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}
.kgrid h3:first-child{margin-top:4px}
.dlg-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.dlg-h h2{margin:0}
.kv{display:grid;grid-template-columns:88px 1fr;gap:5px 12px;margin:0;align-items:baseline}
.kv dt{color:var(--muted);text-align:right} .kv dd{margin:0}
.toasts{position:fixed;left:50%;bottom:36px;transform:translateX(-50%);display:flex;flex-direction:column;gap:6px;align-items:center;z-index:80;pointer-events:none}
.toast{pointer-events:auto;display:flex;align-items:center;gap:12px;background:var(--raised);box-shadow:var(--shadow);border-radius:var(--r3);padding:7px 8px 7px 14px;animation:pop .16s ease-out}
.toast button{color:var(--accent);font-weight:700;padding:3px 8px;border-radius:5px}
.toast button:hover{background:var(--hover)}
.toast button{border-radius:var(--r1)}
.bannerbar{position:absolute;left:12px;right:12px;top:44px;z-index:20;padding:8px 12px;border-radius:var(--r3);background:color-mix(in srgb,var(--danger) 18%,var(--raised));color:var(--text);box-shadow:var(--shadow)}
.bannerbar[hidden]{display:none}