/* Support extends the existing CHIK cabinet and its locally hosted Onest font. */
.support-launcher { position:fixed; z-index:35; right:max(28px,env(safe-area-inset-right)); bottom:max(26px,env(safe-area-inset-bottom)); display:flex; align-items:center; gap:10px; min-height:52px; border:1px solid var(--line-strong); border-radius:18px; padding:12px 18px; background:var(--surface); color:var(--text); box-shadow:0 10px 35px #0005; font-size:15px; font-weight:550; cursor:pointer; transition:transform .18s,background .18s; }
.support-launcher:hover { transform:translateY(-2px); background:var(--surface-hover,var(--surface)); }
.support-launcher b,.support-unread { min-width:23px; border-radius:8px; padding:2px 6px; background:var(--accent,#d8e4a4); color:var(--bg); text-align:center; font-size:12px; }
.support-panel { --support-panel-gap:calc(max(26px,env(safe-area-inset-bottom)) + 64px); position:fixed; z-index:36; right:max(28px,env(safe-area-inset-right)); bottom:calc(var(--support-panel-gap) + var(--support-viewport-offset,0px)); width:min(420px,calc(100vw - 32px)); height:min(680px,max(0px,calc(var(--support-viewport-height,100dvh) - var(--support-panel-gap) - 20px))); display:flex; flex-direction:column; min-height:0; overflow:hidden; container:support-corner / size; border:1px solid var(--line-strong); border-radius:22px; color:var(--text); background:var(--surface); box-shadow:0 18px 55px rgb(0 0 0/.34); opacity:0; transform:translateY(12px); transition:opacity .2s cubic-bezier(.2,.7,.2,1),transform .2s cubic-bezier(.2,.7,.2,1); }
.support-panel[data-state="open"] { opacity:1; transform:translateY(0); }
.support-panel.is-closing { pointer-events:none; }
.support-panel[hidden] { display:none; }
.support-panel-header { display:flex; flex-shrink:0; align-items:center; justify-content:space-between; gap:16px; padding:17px 18px 13px 20px; }
.support-panel-header h2 { margin:0; font-size:20px; line-height:1.35; font-weight:600; letter-spacing:-.02em; }
.support-panel-close { flex:0 0 auto; width:40px; height:40px; min-height:40px; border-radius:11px; }
.support-panel .support-window { display:flex; flex:1; flex-direction:column; min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-gutter:stable; padding:0 18px 18px 20px; }
.support-panel .support-intro { flex-shrink:0; margin-bottom:14px; font-size:14px; }
.support-panel .support-thread { flex:1 0 300px; min-height:0; }
.support-panel .support-transcript { flex:1; min-height:100px; max-height:none; }
.support-panel .support-composer { flex-shrink:0; }
.support-panel .support-composer textarea { min-height:84px; max-height:160px; }
.support-panel .support-telegram { flex-shrink:0; margin-top:16px; padding-top:14px; }
@container support-corner (max-height:480px) {
  .support-panel-header { padding:12px 14px 10px; }
  .support-panel .support-window { padding:0 14px 14px; }
  .support-panel .support-intro { display:none; }
  .support-panel .support-thread { flex-basis:260px; }
  .support-panel .support-transcript { min-height:60px; }
  .support-panel .support-composer textarea { min-height:64px; max-height:80px; }
}
.support-intro { margin:0 0 18px; color:var(--muted); font-size:15px; line-height:1.6; }
.support-thread { display:flex; flex-direction:column; gap:14px; min-width:0; }
.support-transcript { min-height:190px; max-height:45dvh; overflow:auto; overscroll-behavior:contain; padding:4px 9px 6px 0; scrollbar-gutter:stable; }
.support-message { width:fit-content; max-width:92%; border:1px solid var(--line); border-radius:16px 16px 16px 5px; background:rgb(255 255 255/.035); padding:13px 16px; margin:0 0 14px; }
.support-message-visitor { margin-left:auto; background:rgb(210 222 180/.065); border-radius:16px 16px 5px 16px; }
.support-message-system { max-width:100%; background:transparent; }
.support-message header { display:flex; flex-wrap:wrap; gap:5px 10px; align-items:center; color:var(--muted); font-size:12px; }
.support-message header strong { color:var(--text); font-size:13px; font-weight:550; }
.support-message p { white-space:pre-wrap; overflow-wrap:anywhere; font-size:16px; line-height:1.65; margin:7px 0 0; }
.support-delivery { display:flex; flex-wrap:wrap; gap:6px 12px; margin-top:10px; font-size:12px; color:var(--muted); }
.support-delivery .text-button { font-size:12px; }
.support-composer { display:flex; flex-direction:column; gap:9px; padding-top:13px; border-top:1px solid var(--line); }
.support-composer > label { font-size:14px; font-weight:550; }
.support-composer textarea { resize:vertical; min-height:92px; max-height:240px; width:100%; border:1px solid var(--line-strong); border-radius:13px; padding:13px 15px; font-size:16px; line-height:1.6; color:var(--text); background:rgb(255 255 255/.025); }
.support-composer > div { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.support-composer small { max-width:38ch; font-size:12px; line-height:1.6; color:var(--muted); }
.support-composer .button { flex-shrink:0; min-height:46px; }
.support-telegram { margin-top:23px; border-top:1px solid var(--line); padding-top:19px; }
.support-telegram h3 { margin:0 0 8px; font-size:15px; }
.support-telegram p { color:var(--muted); font-size:13px; line-height:1.65; margin:8px 0; }
.support-telegram a:not(.button) { font-size:14px; text-decoration:underline; text-underline-offset:3px; }
.support-retry p { margin-bottom:12px; }.support-retry .text-button { margin-left:14px; }
.support-inbox-layout { display:grid; grid-template-columns:minmax(280px,.8fr) minmax(0,1.5fr); gap:22px; align-items:start; }
.support-inbox { overflow:hidden; }.support-inbox-filters { padding:21px; border-bottom:1px solid var(--line); display:flex; flex-direction:column; gap:14px; }
.support-inbox-filters > label { display:flex; flex-direction:column; gap:8px; font-size:14px; }
.support-inbox-filters input:not([type=checkbox]),.support-inbox-filters select { width:100%; padding:11px 12px; border:1px solid var(--line-strong); border-radius:10px; background:var(--bg); color:var(--text); font-size:14px; }
.support-inbox-filters > div { display:flex; flex-wrap:wrap; align-items:center; gap:12px; }.support-inbox-filters select { width:auto; flex:1; }.support-inbox-filters .checkbox-field { font-size:12px; }
.support-inbox-list { list-style:none; margin:0; padding:0; max-height:65dvh; overflow:auto; }
.support-inbox-list li+li { border-top:1px solid var(--line); }.support-inbox-list button { width:100%; text-align:left; padding:20px 21px; border:0; background:transparent; color:var(--text); cursor:pointer; display:flex; flex-direction:column; gap:8px; transition:background .18s; }
.support-inbox-list button:hover,.support-inbox-list button[aria-pressed=true] { background:rgb(255 255 255/.045); }.support-inbox-top { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; }.support-inbox-top strong { font-size:16px; overflow-wrap:anywhere; }
.support-inbox-preview { font-size:14px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }.support-inbox-meta { display:flex; justify-content:space-between; gap:12px; width:100%; color:var(--muted); font-size:12px; }
.support-owner-detail { padding:25px; min-height:540px; min-width:0; }.support-detail-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding-bottom:20px; margin-bottom:18px; border-bottom:1px solid var(--line); }.support-detail-heading h2 { font-size:22px; margin:0 0 6px; overflow-wrap:anywhere; }.support-detail-heading p,.support-detail-heading small { font-size:13px; color:var(--muted); overflow-wrap:anywhere; }.support-detail-heading small { display:block; margin-top:7px; font-size:11px; }.support-detail-heading .button { font-size:13px; padding:10px 13px; min-height:42px; }.support-owner-detail .support-transcript { min-height:250px; max-height:48dvh; }.support-back { display:none; }.support-older { display:block; margin:10px auto 18px; font-size:13px; }.support-unread-total { color:var(--muted); font-size:14px; }
@media(max-width:800px) { .support-inbox-layout { grid-template-columns:1fr; }.support-inbox-layout.has-selected .support-inbox { display:none; }.support-inbox-layout:not(.has-selected) .support-owner-detail { display:none; }.support-back { display:block; margin-bottom:17px; }.support-owner-detail { min-height:0; padding:20px; }.support-detail-heading { flex-wrap:wrap; }.support-launcher { right:max(16px,env(safe-area-inset-right)); bottom:max(20px,env(safe-area-inset-bottom)); }.support-panel { right:max(16px,env(safe-area-inset-right)); --support-panel-gap:calc(max(20px,env(safe-area-inset-bottom)) + 64px); }.support-transcript { max-height:40dvh; }.support-inbox-list { max-height:none; } }
@media(max-width:480px) { .support-composer > div { gap:12px; align-items:flex-start; }.support-composer small { font-size:11px; }.support-composer .button { padding:11px 14px; }.support-message { max-width:96%; padding:11px 13px; }.support-launcher { bottom:max(18px,env(safe-area-inset-bottom)); padding:12px 14px; }.support-panel { --support-panel-gap:calc(max(18px,env(safe-area-inset-bottom)) + 64px); left:max(12px,env(safe-area-inset-left)); right:max(12px,env(safe-area-inset-right)); width:auto; border-radius:19px; }.support-owner-detail { padding:16px; } }
@media(prefers-reduced-motion:reduce) { .support-panel,.support-launcher,.support-inbox-list button { transition:none; }.support-panel { transform:none; } }