@font-face { font-family:Support08Manrope; src:url("../fonts/manrope/manrope-variable.ttf") format("truetype"); font-weight:200 800; font-style:normal; font-display:swap; }
/* Figma 08: support screens. Scoped to the shared storefront/partner widget. */
#support-widget.yn-support08 { --s08-ink:#15171c; --s08-muted:#5c5e64; --s08-line:#ece9e3; --s08-stone:#dcd7cd; --s08-wash:#f7f6f2; --s08-orange:#f47b1b; --s08-link:#c2410c; position:fixed; right:32px; bottom:24px; z-index:1040; display:flex; flex-direction:column; align-items:flex-end; gap:14px; width:auto; left:auto; color:var(--s08-ink); font:400 12px/1.6 Support08Manrope,Manrope,sans-serif; }
body.modal-open #support-widget.yn-support08 { display:none; }
body.sidebar-open #support-widget.yn-support08 { visibility:hidden; pointer-events:none; }
#support-widget.yn-support08 *, #support-widget.yn-support08 *::before, #support-widget.yn-support08 *::after { box-sizing:border-box; }
#support-widget.yn-support08 [hidden] { display:none !important; }
#support-widget.yn-support08 p, #support-widget.yn-support08 h2, #support-widget.yn-support08 h3 { margin:0; }
#support-widget.yn-support08 button, #support-widget.yn-support08 input, #support-widget.yn-support08 textarea, #support-widget.yn-support08 select { font:inherit; }
#support-widget.yn-support08 button { cursor:pointer; }
#support-widget.yn-support08 button:disabled { cursor:wait; opacity:.6; }
#support-widget.yn-support08 :focus-visible { outline:2px solid var(--s08-link); outline-offset:3px; }
#support-widget.yn-support08 img { display:block; flex:none; max-width:none; width:auto; height:auto; }
#support-widget.yn-support08 a { color:var(--s08-link); }
#support-widget.yn-support08 #support-box { position:relative; display:flex; flex-direction:column; width:360px; height:560px; min-width:0; max-width:calc(100vw - 32px); max-height:calc(100dvh - 110px); padding:0; margin:0; overflow:hidden; border:1px solid var(--s08-line); border-radius:18px; background:#fff; box-shadow:0 4px 16px #0000001f; backdrop-filter:none; }
#support-widget.yn-support08 #support-box[data-view="request"] { height:762px; }
#support-widget.yn-support08 #support-box[data-view="success"] { height:424px; }
#support-widget.yn-support08 #support-box[data-view="privacy"] { height:542px; }
#support-widget.yn-support08 #support-box[data-view="internal"] { height:628px; }
#support-widget.yn-support08 #support-box[data-view="conversation"], #support-widget.yn-support08 #support-box[data-view="assistant"][data-assistant-expanded="true"] { height:745px; }
#support-widget.yn-support08 .yn-support08__header { display:flex; align-items:center; gap:10px; flex:none; padding:13px 14px; border-bottom:1px solid #cec8bc; background:var(--s08-stone); }
#support-widget.yn-support08 .yn-support08__heading { flex:1; min-width:0; }
#support-widget.yn-support08 .yn-support08__heading h2 { font-size:14px; line-height:20px; font-weight:700; color:var(--s08-ink); }
#support-widget.yn-support08 .yn-support08__heading p { display:flex; align-items:center; gap:6px; margin-top:3px; color:var(--s08-muted); font-size:11px; line-height:16px; }
#support-widget.yn-support08 .yn-support08__dot { flex:none; width:7px; height:7px; border-radius:50%; background:#358b19; }
#support-widget.yn-support08 .yn-support08__icon { display:flex; align-items:center; justify-content:center; flex:none; width:26px; height:28px; padding:0; border:0; border-radius:4px; background:transparent; box-shadow:none; }
#support-widget.yn-support08 .yn-support08__screen { display:flex; flex:1; flex-direction:column; min-height:0; }
#support-widget.yn-support08 .yn-support08__notice { display:flex; flex:none; gap:8px; padding:9px 14px; background:var(--s08-wash); border-bottom:1px solid var(--s08-line); color:var(--s08-muted); font-size:10.5px; line-height:16.27px; }
#support-widget.yn-support08 .yn-support08__notice img { margin-top:2px; align-self:flex-start; }
#support-widget.yn-support08 .yn-support08__notice button, #support-widget.yn-support08 .yn-support08__acknowledgement button { padding:0; border:0; background:transparent; color:var(--s08-link); font-weight:600; text-align:left; }
#support-widget.yn-support08 .yn-support08__conversation, #support-widget.yn-support08 .yn-support08__scroll { flex:1; min-height:0; padding:13px 14px; overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#dcd7cd transparent; }
#support-widget.yn-support08 .yn-support08__conversation { display:flex; flex-direction:column; align-items:stretch; gap:9px; }
#support-widget.yn-support08 .yn-support08__message { flex:none; display:flex; flex-direction:column; align-items:flex-start; gap:4px; }
#support-widget.yn-support08 .yn-support08__bubble { max-width:90%; padding:10px 12px; border:1px solid var(--s08-line); border-radius:6px; background:var(--s08-wash); color:#3a3c42; font-size:12px; line-height:19.2px; overflow-wrap:anywhere; white-space:pre-wrap; }
#support-widget.yn-support08 .yn-support08__message--user { align-items:flex-end; }
#support-widget.yn-support08 .yn-support08__message--user .yn-support08__bubble { border-color:var(--s08-orange); background:var(--s08-orange); color:#fff; }
#support-widget.yn-support08 .yn-support08__source { color:#9b9086; font-size:10px; line-height:15px; }
#support-widget.yn-support08 .yn-support08__quick { display:flex; flex-wrap:wrap; flex:none; gap:6px; padding-top:2px; }
#support-widget.yn-support08 .yn-support08__quick button { padding:5px 10px; border:1px solid var(--s08-line); border-radius:2px; background:#fff; color:#3a3c42; font-size:11px; line-height:16px; text-align:left; }
#support-widget.yn-support08 .yn-support08__quick button:hover { border-color:var(--s08-orange); }
#support-widget.yn-support08 .yn-support08__footer { flex:none; padding:11px 14px 12px; border-top:1px solid var(--s08-line); background:#fff; }
#support-widget.yn-support08 .yn-support08__compose { display:flex; align-items:flex-start; gap:8px; margin:0; }
#support-widget.yn-support08 .yn-support08__compose input, #support-widget.yn-support08 .yn-support08__compose textarea { flex:1; min-width:0; height:38px; margin:0; padding:8px 12px; border:1px solid var(--s08-line); border-radius:6px; background:#fff; color:var(--s08-ink); font-size:12px; line-height:20px; box-shadow:none; }
#support-widget.yn-support08 .yn-support08__compose textarea { height:58px; resize:vertical; max-height:100px; }
#support-widget.yn-support08 input::placeholder, #support-widget.yn-support08 textarea::placeholder { color:#9b9086; opacity:1; }
#support-widget.yn-support08 .yn-support08__send { display:flex; align-items:center; justify-content:center; flex:none; width:42px; height:38px; padding:0; border:0; border-radius:6px; background:var(--s08-orange); }
#support-widget.yn-support08 .yn-support08__footer-links { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; }
#support-widget.yn-support08 .yn-support08__footer .yn-support08__footer-links { margin-top:9px; }
#support-widget.yn-support08 .yn-support08__footer-links button, #support-widget.yn-support08 .yn-support08__back-link { padding:0; border:0; background:transparent; color:var(--s08-muted); font-size:11px; line-height:17px; text-align:left; }
#support-widget.yn-support08 .yn-support08__footer-links .yn-support08__link { display:flex; align-items:center; gap:5px; color:var(--s08-link); font-size:11.5px; font-weight:600; }
#support-widget.yn-support08 .yn-support08__request { margin:0; }
#support-widget.yn-support08 .yn-support08__request h3 { margin:10px 0 12px; color:#1e1e1e; font-size:12.5px; line-height:18px; font-weight:600; }
#support-widget.yn-support08 .yn-support08__field { margin-bottom:12px; }
#support-widget.yn-support08 .yn-support08__field label, #support-widget.yn-support08 .yn-support08__channels legend { display:block; float:none; width:auto; padding:0; margin:0 0 5px; color:#5c5e64; font-size:10px; line-height:15px; letter-spacing:.6px; font-weight:600; }
#support-widget.yn-support08 .yn-support08__field label span { text-transform:none; letter-spacing:0; font-weight:400; }
#support-widget.yn-support08 .yn-support08__field input, #support-widget.yn-support08 .yn-support08__field select, #support-widget.yn-support08 .yn-support08__field textarea { display:block; width:100%; min-width:0; padding:9px 11px; border:1px solid var(--s08-line); border-radius:6px; background:#fff; color:var(--s08-ink); font-size:12px; line-height:18px; box-shadow:none; }
#support-widget.yn-support08 .yn-support08__field textarea { min-height:80px; resize:vertical; }
#support-widget.yn-support08 .yn-support08__field input:read-only { background:var(--s08-wash); color:var(--s08-muted); }
#support-widget.yn-support08 .yn-support08__channels { min-width:0; margin:0 0 12px; padding:0; border:0; }
#support-widget.yn-support08 .yn-support08__channels > div { display:flex; flex-wrap:wrap; gap:7px; }
#support-widget.yn-support08 .yn-support08__channels label { display:flex; align-items:center; gap:6px; margin:0; padding:7px 10px; border:1px solid var(--s08-line); border-radius:6px; cursor:pointer; font-size:11px; }
#support-widget.yn-support08 .yn-support08__channels label:has(input:checked) { border-color:var(--s08-orange); background:#fff9f2; color:var(--s08-link); }
#support-widget.yn-support08 input[type=radio], #support-widget.yn-support08 input[type=checkbox] { flex:none; width:14px; height:14px; margin:1px 0 0; accent-color:var(--s08-orange); }
#support-widget.yn-support08 .yn-support08__channels p { margin-top:6px; color:#9b9086; font-size:10.5px; line-height:16px; }
#support-widget.yn-support08 .yn-support08__acknowledgement { display:flex; gap:8px; align-items:flex-start; margin:0 0 14px; color:var(--s08-muted); font-size:11px; }
#support-widget.yn-support08 .yn-support08__primary, #support-widget.yn-support08 .yn-support08__secondary { display:flex; align-items:center; justify-content:center; width:100%; min-height:40px; padding:10px 12px; border:1px solid var(--s08-orange); border-radius:6px; background:var(--s08-orange); color:#fff; font-size:13px; line-height:18px; font-weight:600; letter-spacing:.65px; }
#support-widget.yn-support08 .yn-support08__primary:hover, #support-widget.yn-support08 .yn-support08__send:hover { background:#df6910; }
#support-widget.yn-support08 .yn-support08__secondary { background:#fff; color:var(--s08-link); }
#support-widget.yn-support08 .yn-support08__back-link { display:block; margin:12px auto 0; text-align:center; }
#support-widget.yn-support08 .yn-support08__context { padding:11px 13px; border:1px solid var(--s08-line); border-radius:6px; background:var(--s08-wash); }
#support-widget.yn-support08 .yn-support08__context h3, #support-widget.yn-support08 .yn-support08__policy h3 { margin-bottom:5px; color:#9b9086; font-size:10px; line-height:15px; font-weight:600; letter-spacing:.6px; }
#support-widget.yn-support08 .yn-support08__context p { color:var(--s08-muted); font-size:11px; line-height:18.7px; overflow-wrap:anywhere; }
#support-widget.yn-support08 .yn-support08__stack { display:flex; flex-direction:column; gap:12px; }
#support-widget.yn-support08 .yn-support08__stack > * { flex:none; }
#support-widget.yn-support08 .yn-support08__receipt { padding:15px; border:1px solid var(--s08-line); border-radius:6px; }
#support-widget.yn-support08 .yn-support08__receipt-heading { display:flex; align-items:flex-start; gap:9px; }
#support-widget.yn-support08 .yn-support08__receipt-heading img { margin-top:2px; }
#support-widget.yn-support08 .yn-support08__receipt h3 { margin-bottom:3px; font-size:12.5px; line-height:19px; font-weight:600; }
#support-widget.yn-support08 .yn-support08__receipt p { color:var(--s08-muted); font-size:12px; line-height:18.6px; }
#support-widget.yn-support08 .yn-support08__reference { display:flex; justify-content:space-between; gap:8px; margin-top:14px; padding-top:11px; border-top:1px solid #f1efea; }
#support-widget.yn-support08 .yn-support08__reference span { color:#9b9086; font-size:10px; letter-spacing:.6px; }
#support-widget.yn-support08 .yn-support08__reference strong { font-size:12.5px; overflow-wrap:anywhere; }
#support-widget.yn-support08 .yn-support08__policy section + section { margin-top:16px; }
#support-widget.yn-support08 .yn-support08__policy p { color:var(--s08-muted); font-size:11px; line-height:18.7px; }
#support-widget.yn-support08 .yn-support08__policy a { display:block; margin-top:7px; font-size:11px; }
#support-widget.yn-support08 .yn-support08__alert { flex:none; padding:10px 14px; background:#fff4ee; border-bottom:1px solid #f1c4aa; color:#9c3514; font-size:11px; line-height:17px; }
#support-widget.yn-support08 .yn-support08__alert button { margin-left:6px; padding:0; border:0; background:transparent; color:inherit; text-decoration:underline; }
#support-widget.yn-support08 .yn-support08__loading { flex:none; padding:8px 14px; color:var(--s08-muted); font-size:11px; }
#support-widget.yn-support08 .yn-support08__ticket-status { display:flex; justify-content:space-between; gap:8px; padding:10px 14px; border-bottom:1px solid var(--s08-line); background:var(--s08-wash); font-size:11px; }
#support-widget.yn-support08 .yn-support08__resume { display:block; margin:9px 0 0; padding:0; border:0; background:transparent; color:var(--s08-link); font-size:11px; text-decoration:underline; }
#support-widget.yn-support08 .yn-support08__order, #support-widget.yn-support08 .yn-support08__queue-item { display:block; width:100%; padding:11px 12px; border:1px solid var(--s08-line); border-radius:6px; background:#fff; text-align:left; color:inherit; text-decoration:none; }
#support-widget.yn-support08 .yn-support08__order h3, #support-widget.yn-support08 .yn-support08__queue-item h3 { color:#1e1e1e; font-size:12px; font-weight:600; }
#support-widget.yn-support08 .yn-support08__order p, #support-widget.yn-support08 .yn-support08__queue-item p { margin-top:3px; color:var(--s08-muted); font-size:11px; line-height:17px; }
#support-widget.yn-support08 .yn-support08__section-label { color:#9b9086; font-size:10px; font-weight:600; letter-spacing:.6px; }
#support-widget.yn-support08 .yn-support08__status { display:inline-block; margin-top:5px; padding:2px 7px; border-radius:4px; background:#fff3e8; color:var(--s08-link); font-size:10px; }
#support-widget.yn-support08 .yn-support08__timeline { margin:12px 0 4px; padding:0; list-style:none; }
#support-widget.yn-support08 .yn-support08__timeline li { position:relative; margin-left:5px; padding:0 0 13px 18px; border-left:2px solid var(--s08-line); }
#support-widget.yn-support08 .yn-support08__timeline li:last-child { padding-bottom:0; border-color:transparent; }
#support-widget.yn-support08 .yn-support08__timeline li::before { position:absolute; content:""; left:-7px; top:3px; width:12px; height:12px; border:1px solid var(--s08-line); border-radius:50%; background:#fff; }
#support-widget.yn-support08 .yn-support08__timeline .is-complete { border-color:var(--s08-orange); }
#support-widget.yn-support08 .yn-support08__timeline .is-complete::before, #support-widget.yn-support08 .yn-support08__timeline .is-current::before { border-color:var(--s08-orange); background:var(--s08-orange); }
#support-widget.yn-support08 .yn-support08__timeline strong { display:block; font-size:11.5px; font-weight:600; }
#support-widget.yn-support08 .yn-support08__timeline small { display:block; color:var(--s08-muted); font-size:10.5px; }
#support-widget.yn-support08 .yn-support08__actions { display:flex; flex-wrap:wrap; gap:6px; }
#support-widget.yn-support08 .yn-support08__actions a, #support-widget.yn-support08 .yn-support08__actions button { display:inline-flex; align-items:center; min-height:30px; padding:5px 11px; border:1px solid var(--s08-orange); border-radius:6px; background:#fff; color:var(--s08-link); font-size:11.5px; font-weight:600; text-decoration:none; }
#support-widget.yn-support08 #support-toggle { display:flex; align-items:center; justify-content:center; gap:8px; width:137px; height:51px; margin:0; padding:0; border:0; border-radius:999px; background:var(--s08-orange); box-shadow:0 10px 25px #7f1d1d26; color:#fff; font:800 14px/20px Support08Manrope,Manrope,sans-serif; letter-spacing:2px; transform:none; }
#support-widget.yn-support08 #support-toggle::before { display:none; }
#support-widget.yn-support08 .yn-support08__sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width: 576px) { #support-widget.yn-support08 #support-toggle { width:48px; height:48px; gap:0; font-size:0; letter-spacing:0; } #support-widget.yn-support08 { width:min(360px,calc(100% - 32px)); right:16px; bottom:max(16px,env(safe-area-inset-bottom)); pointer-events:none; } #support-widget.yn-support08 > * { pointer-events:auto; } #support-widget.yn-support08 #support-box { width:100%; max-width:100%; max-height:calc(100dvh - 104px - env(safe-area-inset-bottom)); } #support-widget.yn-support08 .yn-support08__field input, #support-widget.yn-support08 .yn-support08__field select, #support-widget.yn-support08 .yn-support08__field textarea, #support-widget.yn-support08 .yn-support08__compose input, #support-widget.yn-support08 .yn-support08__compose textarea { font-size:16px; } }
@media (prefers-reduced-motion: reduce) { #support-widget.yn-support08 * { scroll-behavior:auto !important; } }