#study-feedback { font: 14px/1.5 'Be Vietnam Pro',system-ui,sans-serif; color: #243c34; }
#study-feedback * { box-sizing: border-box; }
#study-feedback [hidden] { display: none !important; }
#study-feedback button, #study-feedback select, #study-feedback textarea { font: inherit; }
#study-feedback button { cursor: pointer; }
#study-feedback :is(button,a,textarea,select):focus-visible { outline: 3px solid #48a58c; outline-offset: 3px; }
#study-feedback .sf-launch { position: fixed; z-index: 180; right: 22px; bottom: calc(20px + env(safe-area-inset-bottom,0px)); display: flex; align-items: center; gap: 9px; min-height: 48px; padding: 12px 18px; border: 1px solid #ffffff40; border-radius: 28px !important; background: #176e5c; color: white; box-shadow: 0 6px 24px #153e342b; font-weight: 600; font-size: 12px; }
#study-feedback .sf-launch:hover { background: #115646; }
#study-feedback .sf-launch svg { fill: none; stroke: currentColor; stroke-width: 1.6; }
#sf-panel { position: fixed; z-index: 210; right: 22px; bottom: calc(82px + env(safe-area-inset-bottom,0px)); width: 370px; max-width: calc(100vw - 24px); max-height: calc(100dvh - 108px); display: flex; flex-direction: column; background: white; border: 1px solid #d9e6df; border-radius: 22px !important; overflow: auto; box-shadow: 0 16px 70px #13362833; }
#study-feedback .sf-header { display: flex; align-items: center; gap: 12px; background: #e8f4ee; padding: 18px; flex-shrink: 0; }
#study-feedback .sf-header img { object-fit: contain; }
#study-feedback .sf-header h2 { font-family: inherit; font-size: 15px; font-weight: 700; line-height: 1.4; letter-spacing: 0; text-transform: none; margin: 0; }
#study-feedback .sf-header p { margin: 3px 0 0; font-size: 11px; color: #567269; }
#study-feedback .sf-close { margin-left: auto; flex-shrink: 0; width: 34px; height: 34px; border: 0; border-radius: 50% !important; background: #fff9; color: #31594c; font-size: 24px; line-height: 1; }
#study-feedback .sf-conversation { padding: 18px; overflow-y: auto; min-height: 100px; max-height: 260px; background: #f8fbf9; }
#study-feedback .sf-welcome { margin: 0 25px 14px 0; padding: 12px 14px; background: white; border: 1px solid #e4ebe6; border-radius: 14px 14px 14px 3px !important; font-size: 12px; line-height: 1.8; }
#study-feedback .sf-message { margin: 12px 0 0 22px; padding: 12px 14px; border-radius: 14px 14px 3px 14px !important; background: #e0efe7; overflow-wrap: anywhere; }
#study-feedback .sf-message p { margin: 4px 0 8px; white-space: pre-wrap; font-size: 12px; }
#study-feedback .sf-message small { display: block; color: #4b6a5c; font-size: 10px; }
#study-feedback .sf-form { flex-shrink: 0; padding: 14px 18px 6px; }
#study-feedback .sf-form label { display: block; font-size: 11px; font-weight: 600; margin: 0 0 5px; }
#study-feedback .sf-form select, #study-feedback .sf-form textarea { width: 100%; padding: 9px 12px; border: 1px solid #d6e1d9; border-radius: 10px !important; color: #254637; background: white; font-size: 12px; }
#study-feedback .sf-form select { margin-bottom: 10px; }
#study-feedback .sf-form textarea { resize: vertical; min-height: 75px; max-height: 160px; display: block; }
#study-feedback .sf-context { font-size: 10px; line-height: 1.5; color: #708278; margin: 8px 0 12px; }
#study-feedback .sf-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
#sf-count { font-size: 10px; color: #6b7d72; }
#study-feedback .sf-send, #study-feedback .sf-account a { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 8px 16px; border: 0; border-radius: 10px !important; background: #176e5c; color: white; text-decoration: none; font-size: 12px; font-weight: 600; }
#study-feedback .sf-send:disabled { opacity: .5; cursor: wait; }
#sf-status { flex-shrink: 0; color: #326747; font-size: 11px; line-height: 1.6; margin: 8px 18px 14px; }
#sf-status:empty { margin: 0 0 12px; }
#sf-status[data-error=true] { color: #b63838; }
#study-feedback .sf-retry { margin: 0 18px 16px; padding: 8px; border: 1px solid #ccdbd2; border-radius: 8px !important; color: #285641; background: white; }
#study-feedback .sf-account { padding: 18px; font-size: 12px; }
#study-feedback .sf-account p { margin: 0 0 14px; }
@media(max-width:600px) { #study-feedback .sf-launch { right: 12px; bottom: calc(14px + env(safe-area-inset-bottom,0px)); } #sf-panel { right: 12px; bottom: calc(76px + env(safe-area-inset-bottom,0px)); } #study-feedback .sf-form textarea { font-size: 16px; } }
@media(max-height:600px) { #sf-panel { top: 8px; bottom: 8px; max-height: calc(100dvh - 16px); } #study-feedback .sf-conversation { max-height: 120px; } }
@media print { #study-feedback { display: none !important; } }
/* 3 Nov 2026: the labelled pill covered page content and drew rage clicks; it is now a small round icon. */
#study-feedback .sf-launch { width: 42px; min-height: 0; height: 42px; padding: 0; justify-content: center; gap: 0; border-radius: 50% !important; opacity: .82; box-shadow: 0 4px 14px #153e3426; }
#study-feedback .sf-launch:hover, #study-feedback .sf-launch[aria-expanded="true"] { opacity: 1; }
#study-feedback .sf-launch [data-sf-text="launch"] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
#sf-panel { bottom: calc(72px + env(safe-area-inset-bottom,0px)); }
@media(max-width:600px) { #study-feedback .sf-launch { width: 38px; height: 38px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom,0px)); } #sf-panel { bottom: calc(58px + env(safe-area-inset-bottom,0px)); } }
