/* Shared feedback design tokens: use AppToast/AppDialog for new features. */
:root { --feedback-radius:20px; --feedback-ink:#1e293b; --feedback-muted:#64748b; --feedback-shadow:0 24px 80px #15244326,0 2px 8px #1524430a; }
.toast-region { top:24px; right:24px; gap:12px; width:min(420px,calc(100vw - 32px)); padding:4px; overflow-x:hidden; }
.app-toast { --toast-color:#3564dc; --toast-soft:#edf3ff; position:relative; align-items:flex-start; gap:13px; padding:18px; border:1px solid #e5eaf2; border-left:1px solid #e5eaf2; border-radius:16px; background:#fff; box-shadow:0 12px 36px #20304714,0 2px 6px #20304708; }
.app-toast--success { --toast-color:#128464; --toast-soft:#eaf8f2; }
.app-toast--error { --toast-color:#c34242; --toast-soft:#fff0ef; }
.app-toast--warning { --toast-color:#a36a12; --toast-soft:#fff6e7; }
.app-toast__icon { flex:0 0 36px; width:36px; height:36px; border:0; border-radius:11px; background:var(--toast-soft); color:var(--toast-color); font-size:19px; font-weight:700; }
.app-toast__content { flex:1; min-width:0; }
.app-toast__title { display:block; margin:0 0 3px; color:var(--feedback-ink); font-size:15px; line-height:1.5; font-weight:650; }
.app-toast__message { color:#59687c; font-size:14px; line-height:1.65; overflow-wrap:anywhere; }
.app-toast__close { flex:0 0 26px; width:26px; height:26px; border-radius:8px; color:#8a97aa; }
.app-toast__close:hover { background:#f0f3f8; color:#334155; }
.app-dialog { --dialog-accent:#3564dc; --dialog-soft:#edf3ff; box-sizing:border-box; position:fixed; inset:0; margin:auto; width:min(440px,calc(100vw - 32px)); max-width:calc(100vw - 32px); max-height:calc(100dvh - 40px); padding:0; border:1px solid #ffffffc9; border-radius:var(--feedback-radius); background:#fff; color:var(--feedback-ink); box-shadow:var(--feedback-shadow); overflow:auto; }
.app-dialog:not([open]) { display:none; }
.app-dialog[open] { animation:feedback-dialog-enter .18s ease-out; }
.app-dialog::backdrop { background:#18263b66; backdrop-filter:blur(4px); }
.app-dialog[data-type="danger"], .app-dialog[data-type="error"] { --dialog-accent:#cc4545; --dialog-soft:#fff0ef; }
.app-dialog[data-type="warning"] { --dialog-accent:#a76b16; --dialog-soft:#fff6e7; }
.app-dialog[data-type="success"] { --dialog-accent:#128464; --dialog-soft:#eaf8f2; }
.app-dialog__surface { position:relative; padding:30px; }
.app-dialog__close { position:absolute; top:16px; right:16px; display:grid; place-items:center; width:32px; height:32px; padding:0; border:0; border-radius:10px; background:transparent; color:#8390a5; font-size:24px; line-height:1; font-family:inherit; cursor:pointer; }
.app-dialog__close:hover { background:#f1f4f9; color:#334155; }
.app-dialog__icon { display:grid; place-items:center; width:52px; height:52px; margin-bottom:20px; border:1px solid color-mix(in srgb,var(--dialog-accent) 12%,transparent); border-radius:16px; background:var(--dialog-soft); color:var(--dialog-accent); }
.app-dialog__icon::before { content:""; width:26px; height:26px; background:currentColor; mask:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v5m0-9h.01'/%3E%3C/svg%3E"); }
.app-dialog[data-type="danger"] .app-dialog__icon::before { mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16M9 7V4h6v3M6 7l1 13h10l1-13M10 11v5m4-5v5'/%3E%3C/svg%3E"); }
.app-dialog[data-type="success"] .app-dialog__icon::before { mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='m8 12 3 3 5-6'/%3E%3C/svg%3E"); }
.app-dialog__title { margin:0 32px 10px 0; color:var(--feedback-ink); font-size:21px; font-weight:650; line-height:1.4; letter-spacing:-.3px; overflow-wrap:anywhere; }
.app-dialog__message { margin:0; color:#647186; font-size:15px; line-height:1.85; white-space:pre-line; overflow-wrap:anywhere; }
.app-dialog__actions { display:flex; justify-content:flex-end; gap:10px; margin-top:28px; padding-top:22px; border-top:1px solid #eef1f6; }
.app-dialog__button { display:inline-flex; align-items:center; justify-content:center; min-width:98px; min-height:44px; padding:10px 18px; border:1px solid transparent; border-radius:11px; font-size:14px; font-weight:600; line-height:1.5; cursor:pointer; transition:filter .15s,background .15s; }
.app-dialog__button--cancel { background:#fff; border-color:#e2e8f0; color:#526175; }
.app-dialog__button--cancel:hover { background:#f6f8fc; }
.app-dialog__button--confirm { background:var(--dialog-accent); color:#fff; box-shadow:0 3px 8px #20304712; }
.app-dialog__button--confirm:hover { filter:brightness(.93); }
.app-dialog [hidden] { display:none!important; }
.app-dialog button:focus-visible { outline:3px solid #90b3f5; outline-offset:3px; }
@keyframes feedback-dialog-enter { from { opacity:0; transform:translateY(10px) scale(.98); } to { opacity:1; transform:none; } }
@media(max-width:600px) { .toast-region { top:12px; right:12px; left:12px; width:auto; } .app-toast { padding:15px; } .app-dialog__surface { padding:25px 22px; } .app-dialog__actions { gap:10px; } .app-dialog__button { flex:1; } }
@media(prefers-reduced-motion:reduce) { .app-dialog[open], .app-toast { animation:none; } .app-dialog__button { transition:none; } }