
:root{
    --ds-ui-ink:#17181c;
    --ds-ui-muted:#6f727c;
    --ds-ui-line:#e7e3e0;
    --ds-ui-surface:#fff;
    --ds-ui-brand:#b83d38;
    --ds-ui-brand-strong:#96312d;
    --ds-ui-success:#198754;
    --ds-ui-success-bg:#eef9f3;
    --ds-ui-warning:#b26a00;
    --ds-ui-warning-bg:#fff7e8;
    --ds-ui-danger:#b42318;
    --ds-ui-danger-bg:#fff1f0;
    --ds-ui-info:#2563eb;
    --ds-ui-info-bg:#eef4ff;
}
.ds-toast-stack{
    position:fixed;
    z-index:10000;
    top:18px;
    right:18px;
    width:min(380px,calc(100vw - 28px));
    display:grid;
    gap:9px;
    pointer-events:none;
}
.ds-toast{
    display:grid;
    grid-template-columns:38px minmax(0,1fr) 30px;
    gap:10px;
    align-items:start;
    min-height:58px;
    padding:11px 10px 11px 11px;
    border:1px solid var(--ds-ui-line);
    border-radius:15px;
    background:rgba(255,255,255,.98);
    box-shadow:0 18px 48px rgba(20,22,28,.14);
    backdrop-filter:blur(18px);
    pointer-events:auto;
    animation:ds-toast-in .2s ease both;
}
.ds-toast.is-leaving{animation:ds-toast-out .18s ease both}
.ds-toast-icon{
    width:36px;height:36px;display:grid;place-items:center;border-radius:11px
}
.ds-toast-icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ds-toast.success .ds-toast-icon{color:var(--ds-ui-success);background:var(--ds-ui-success-bg)}
.ds-toast.warning .ds-toast-icon{color:var(--ds-ui-warning);background:var(--ds-ui-warning-bg)}
.ds-toast.danger .ds-toast-icon{color:var(--ds-ui-danger);background:var(--ds-ui-danger-bg)}
.ds-toast.info .ds-toast-icon{color:var(--ds-ui-info);background:var(--ds-ui-info-bg)}
.ds-toast-copy{min-width:0;padding-top:1px}
.ds-toast-copy strong{display:block;color:var(--ds-ui-ink);font-size:12.5px;line-height:1.3}
.ds-toast-copy span{display:block;margin-top:3px;color:var(--ds-ui-muted);font-size:11px;line-height:1.45;overflow-wrap:anywhere}
.ds-toast-close{
    width:30px;height:30px;display:grid;place-items:center;border:0;border-radius:9px;background:transparent;color:#858891;font-size:18px;cursor:pointer
}
.ds-toast-close:hover{background:#f5f3f2;color:#303136}

.ds-feedback-dialog{
    position:fixed;
    inset:50% auto auto 50%;
    transform:translate(-50%,-50%);
    width:min(440px,calc(100vw - 28px));
    max-width:none;
    margin:0;
    padding:22px;
    border:0;
    border-radius:20px;
    background:var(--ds-ui-surface);
    color:var(--ds-ui-ink);
    box-shadow:0 28px 90px rgba(16,18,24,.28);
    overflow:visible;
}
.ds-feedback-dialog[open]{animation:ds-dialog-in .18s ease both}
.ds-feedback-dialog::backdrop{
    background:rgba(20,22,28,.48);
    backdrop-filter:blur(4px);
}
.ds-feedback-icon{
    width:46px;height:46px;display:grid;place-items:center;border-radius:14px;background:var(--ds-ui-info-bg);color:var(--ds-ui-info)
}
.ds-feedback-icon svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ds-feedback-dialog[data-tone="danger"] .ds-feedback-icon{background:var(--ds-ui-danger-bg);color:var(--ds-ui-danger)}
.ds-feedback-dialog[data-tone="warning"] .ds-feedback-icon{background:var(--ds-ui-warning-bg);color:var(--ds-ui-warning)}
.ds-feedback-dialog[data-tone="success"] .ds-feedback-icon{background:var(--ds-ui-success-bg);color:var(--ds-ui-success)}
.ds-feedback-copy{margin-top:15px}
.ds-feedback-kicker{
    display:block;margin-bottom:5px;color:#92949c;font-size:9px;font-weight:900;letter-spacing:.12em;text-transform:uppercase
}
.ds-feedback-copy h2{margin:0;font-size:20px;line-height:1.22;letter-spacing:-.025em}
.ds-feedback-copy p{margin:7px 0 0;color:var(--ds-ui-muted);font-size:11.5px;line-height:1.58}
.ds-feedback-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:22px}
.ds-feedback-button{
    min-height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:11px;padding:0 15px;font-size:11px;font-weight:850;cursor:pointer
}
.ds-feedback-button.secondary{border:1px solid var(--ds-ui-line);background:#fff;color:#383940}
.ds-feedback-button.primary{border:1px solid #1b1c20;background:#1b1c20;color:#fff}
.ds-feedback-dialog[data-tone="danger"] .ds-feedback-button.primary{border-color:var(--ds-ui-danger);background:var(--ds-ui-danger)}
.ds-feedback-dialog[data-tone="warning"] .ds-feedback-button.primary{border-color:#a85f00;background:#a85f00}
.ds-feedback-dialog[data-tone="success"] .ds-feedback-button.primary{border-color:var(--ds-ui-success);background:var(--ds-ui-success)}

@keyframes ds-toast-in{from{opacity:0;transform:translateY(-8px) scale(.985)}to{opacity:1;transform:none}}
@keyframes ds-toast-out{to{opacity:0;transform:translateY(-6px) scale(.985)}}
@keyframes ds-dialog-in{from{opacity:0;transform:translate(-50%,-48%) scale(.985)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}

@media(max-width:640px){
    .ds-toast-stack{
        top:auto;
        right:8px;
        bottom:calc(74px + env(safe-area-inset-bottom));
        left:8px;
        width:auto;
    }
    .ds-toast{grid-template-columns:34px minmax(0,1fr) 28px;border-radius:14px}
    .ds-toast-icon{width:32px;height:32px;border-radius:10px}
    .ds-feedback-dialog{
        inset:auto 8px calc(8px + env(safe-area-inset-bottom)) 8px;
        transform:none;
        width:auto;
        border-radius:22px 22px 16px 16px;
        padding:20px 16px 16px;
    }
    .ds-feedback-dialog[open]{animation:ds-dialog-mobile-in .2s ease both}
    .ds-feedback-actions{display:grid;grid-template-columns:1fr 1fr}
    .ds-feedback-button{width:100%;min-height:44px}
}
@media(max-width:390px){
    .ds-feedback-actions{grid-template-columns:1fr}
}
@keyframes ds-dialog-mobile-in{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
    .ds-toast,.ds-toast.is-leaving,.ds-feedback-dialog[open]{animation:none}
}
