.operation-feedback-dialog,
.operation-toast {
  box-sizing: border-box;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: #163c64;
}

.operation-feedback-dialog {
  width: min(420px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  overflow: auto;
  margin: auto;
  padding: 30px;
  border: 1px solid #d3e4f5;
  border-radius: 24px;
  background: linear-gradient(145deg, #fff 15%, #eef6ff);
  box-shadow: 0 24px 80px #0d284a33;
  text-align: center;
  animation: operation-feedback-in 180ms ease-out;
}

.operation-feedback-dialog::backdrop {
  background: #0b25444d;
  backdrop-filter: blur(5px);
}

.operation-feedback-symbol {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  margin: 0 auto 16px;
  border: 1px solid #c3dcf6;
  border-radius: 18px;
  color: #1265ad;
  background: #deeeff;
}

.operation-feedback-symbol svg { width: 28px; height: 28px; }
.operation-feedback-brand { margin: 0 0 8px; color: #496886; font-size: 11px !important; font-weight: 700; letter-spacing: .12em; }
.operation-feedback-dialog h2 { margin: 0; color: #183a5b; font-size: 22px !important; font-weight: 650; line-height: 1.25; }
#operation-feedback-message { margin: 12px 0 24px; color: #425a73; font-size: 14px !important; line-height: 1.6; overflow-wrap: anywhere; }
.operation-feedback-continue {
  width: 100%;
  min-height: 44px;
  border: 0;
  border-radius: 12px;
  color: #fff;
  background: #1769b1;
  font: inherit;
  font-size: 14px !important;
  font-weight: 600;
  cursor: pointer;
}
.operation-feedback-continue:hover { background: #11558f; }
.operation-feedback-continue:focus-visible,
.operation-toast-dismiss:focus-visible { outline: 3px solid #1676cf; outline-offset: 3px; }

.operation-toast {
  position: fixed;
  top: max(20px, env(safe-area-inset-top));
  right: max(20px, env(safe-area-inset-right));
  z-index: 2100;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  width: min(410px, calc(100vw - 32px));
  max-height: calc(100dvh - 40px);
  overflow: auto;
  padding: 16px 12px 16px 18px;
  border: 1px solid #b8d5f2;
  border-radius: 18px;
  background: linear-gradient(135deg, #edf6fff5, #dceeffee);
  backdrop-filter: blur(18px);
  box-shadow: 0 12px 36px #1b5f9b24, 0 0 24px #2b86e015;
  animation: operation-feedback-in 180ms ease-out;
}
.operation-toast > div { min-width: 0; flex: 1; }
.operation-toast strong { font-size: 14px !important; font-weight: 650; line-height: 1.4; }
.operation-toast p { margin: 5px 0 0; font-size: 13px !important; line-height: 1.55; overflow-wrap: anywhere; }
.operation-toast-dismiss {
  flex: 0 0 38px;
  width: 38px;
  min-height: 38px;
  margin: -6px -4px 0 0;
  padding: 0;
  border: 0;
  border-radius: 10px;
  color: inherit;
  background: transparent;
  font: inherit;
  font-size: 25px !important;
  line-height: 1;
  cursor: pointer;
}
.operation-toast-dismiss:hover { background: #1769b112; }
.operation-toast[data-type="error"] { border-color: #ecc6ce; color: #762c3c; background: #fff3f5f5; box-shadow: 0 12px 36px #7521361a; }

@keyframes operation-feedback-in {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 540px) {
  .operation-feedback-dialog { padding: 24px; }
  .operation-feedback-dialog h2 { font-size: 20px !important; }
  .operation-toast { top: max(12px, env(safe-area-inset-top)); right: 16px; }
  .operation-toast-dismiss { min-height: 44px; flex-basis: 44px; width: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  .operation-feedback-dialog, .operation-toast { animation: none; }
}
@media print {
  .operation-feedback-dialog, .operation-toast { display: none !important; }
}
