/* prototype interaction layer — theme-agnostic, consumes theme tokens */
.btn,.nav .it,.tabs .tab,.seg .s,.switch,.chk,.radio,.pg .p,.hbtn,.tag[data-nav],tr[data-nav],.card[data-nav],.tree .tn,.dd .op{cursor:pointer;user-select:none}
tr[data-nav]:hover td{background:var(--hover)!important}
.btn,.hbtn,.pg .p{transition:all .15s ease}
.btn:active{transform:scale(.97)}

@keyframes rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.enter{animation:rise .3s cubic-bezier(.2,.8,.3,1) both}
html.shot .enter{animation:none}

/* toast (antd message) */
.toast{position:fixed;top:16px;left:50%;transform:translate(-50%,-10px);display:flex;gap:8px;align-items:center;
  background:var(--bg2);color:var(--t1);padding:9px 14px;border-radius:var(--r);font-size:13.5px;box-shadow:var(--shadow2);
  opacity:0;z-index:200;transition:all .25s cubic-bezier(.2,.8,.3,1);pointer-events:none;border:1px solid var(--stroke)}
.toast.show{opacity:1;transform:translate(-50%,0)}
.toast svg{color:var(--green)}.toast.err svg{color:var(--red)}.toast.info svg{color:var(--primary)}.toast.warn svg{color:var(--amber)}

/* backdrop */
.backdrop{position:fixed;inset:0;background:rgba(0,0,0,.45);opacity:0;transition:opacity .2s;z-index:100}
.backdrop.show{opacity:1}
/* modal */
.modal{position:fixed;left:50%;top:100px;transform:translate(-50%,-8px) scale(.98);width:520px;background:var(--bg2);border-radius:var(--r);
  box-shadow:var(--shadow2);z-index:101;opacity:0;transition:all .2s cubic-bezier(.2,.8,.3,1)}
.modal.show{opacity:1;transform:translate(-50%,0)}
.modal.w640{width:640px}.modal.w760{width:760px}.modal.w420{width:420px}
.modal .mh{padding:16px 24px 8px;font-size:16px;font-weight:600;display:flex;align-items:center;gap:8px}
.modal .mh .x{margin-left:auto;color:var(--t3);cursor:pointer;display:flex}
.modal .mb{padding:8px 24px 16px;font-size:14px;color:var(--t1)}
.modal .mf{padding:8px 24px 20px;display:flex;justify-content:flex-end;gap:8px}
.modal .mb .form{margin-top:8px}
/* drawer */
.drawer{position:fixed;top:0;right:0;bottom:0;width:560px;background:var(--bg2);z-index:101;box-shadow:var(--shadow2);
  transform:translateX(100%);transition:transform .28s cubic-bezier(.2,.8,.3,1);display:flex;flex-direction:column}
.drawer.show{transform:none}
.drawer.w720{width:720px}.drawer.w880{width:880px}
.drawer .dh{padding:16px 24px;border-bottom:1px solid var(--stroke);display:flex;align-items:center;gap:10px}
.drawer .dh .t{font-size:16px;font-weight:600}
.drawer .dh .x{margin-left:auto;color:var(--t3);cursor:pointer;display:flex}
.drawer .db{padding:20px 24px;overflow:auto;flex:1;display:flex;flex-direction:column;gap:16px}
.drawer .df{padding:12px 24px;border-top:1px solid var(--stroke);display:flex;justify-content:flex-end;gap:8px;background:var(--bg2)}
/* popconfirm */
.pop{position:absolute;z-index:120;background:var(--bg2);border-radius:var(--r);box-shadow:var(--shadow2);padding:12px 14px;width:260px;font-size:13.5px;border:1px solid var(--stroke)}
.pop .pt{display:flex;gap:8px;align-items:flex-start}.pop .pt svg{color:var(--amber);flex:none;margin-top:2px}
.pop .pf{display:flex;justify-content:flex-end;gap:6px;margin-top:10px}
/* dropdown */
.dd{position:absolute;z-index:120;background:var(--bg2);border-radius:var(--r);box-shadow:var(--shadow2);padding:4px;min-width:160px;border:1px solid var(--stroke);font-size:13.5px}
.dd .op{padding:6px 10px;border-radius:4px;display:flex;align-items:center;gap:8px}
.dd .op:hover{background:var(--hover)}
.dd .op.danger{color:var(--red)}
.dd .sep{height:1px;background:var(--stroke);margin:4px 0}

.spin{animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.skeleton{background:linear-gradient(90deg,var(--bg) 25%,var(--hover) 50%,var(--bg) 75%);background-size:200% 100%;animation:sk 1.2s infinite;border-radius:4px;height:14px}
@keyframes sk{to{background-position:-200% 0}}
.hide{display:none!important}
.jsonv .k{color:var(--t2)}
