/* Global Patreon support button and dialog */
.course-support-trigger{
  position:fixed;
  top:max(14px,env(safe-area-inset-top));
  right:max(14px,env(safe-area-inset-right));
  z-index:10050;
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,122,160,.58);
  border-radius:50%;
  background:linear-gradient(145deg,rgba(28,9,20,.96),rgba(91,20,48,.96));
  color:#fff;
  font-size:21px;
  line-height:1;
  cursor:pointer;
  box-shadow:0 8px 28px rgba(0,0,0,.34),0 0 20px rgba(255,76,128,.16);
  transition:transform .18s ease,filter .18s ease,box-shadow .18s ease,opacity .16s ease;
}
.course-support-trigger.course-support-suspended{opacity:0;visibility:hidden;pointer-events:none;transform:scale(.86)}
.course-support-trigger:hover{transform:translateY(-2px) scale(1.05);filter:brightness(1.08);box-shadow:0 11px 34px rgba(0,0,0,.38),0 0 25px rgba(255,76,128,.24)}
.course-support-trigger:focus-visible{outline:3px solid #4ae9ff;outline-offset:3px}
.course-support-trigger::after{
  content:"Поддержать курс";
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  transform:translateY(-4px);
  width:max-content;
  max-width:180px;
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:8px;
  background:rgba(3,7,13,.96);
  color:#f5f8fb;
  font:800 11px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;
  letter-spacing:.025em;
  opacity:0;
  pointer-events:none;
  transition:opacity .15s ease,transform .15s ease;
  box-shadow:0 8px 24px rgba(0,0,0,.28);
}
.course-support-trigger:hover::after,.course-support-trigger:focus-visible::after{opacity:1;transform:translateY(0)}
.course-support-trigger.course-support-first-visit{animation:courseSupportHello 1.4s ease 1 .7s}
@keyframes courseSupportHello{0%,100%{transform:scale(1)}18%{transform:scale(1.15) rotate(-7deg)}34%{transform:scale(.96) rotate(5deg)}52%{transform:scale(1.12) rotate(-4deg)}72%{transform:scale(1.01) rotate(0)}}

.course-support-backdrop{
  position:fixed;
  inset:0;
  z-index:10060;
  display:grid;
  place-items:center;
  padding:20px;
  background:rgba(0,4,9,.76);
  backdrop-filter:blur(7px);
  opacity:0;
  visibility:hidden;
  transition:opacity .18s ease,visibility .18s ease;
}
.course-support-backdrop.is-open{opacity:1;visibility:visible}
.course-support-dialog{
  width:min(100%,500px);
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,130,168,.38);
  border-radius:18px;
  background:linear-gradient(155deg,#101a28 0%,#07101b 55%,#210b18 100%);
  color:#eef7ff;
  box-shadow:0 28px 90px rgba(0,0,0,.58),0 0 45px rgba(255,75,129,.12);
  transform:translateY(12px) scale(.975);
  transition:transform .18s ease;
}
.course-support-backdrop.is-open .course-support-dialog{transform:translateY(0) scale(1)}
.course-support-dialog::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,#ff4f8a,#ffcf54,#4ae9ff)}
.course-support-close{
  position:absolute;
  top:12px;
  right:12px;
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.16);
  border-radius:50%;
  background:rgba(255,255,255,.06);
  color:#fff;
  font-size:19px;
  cursor:pointer;
}
.course-support-close:hover{background:rgba(255,255,255,.12)}
.course-support-close:focus-visible{outline:3px solid #4ae9ff;outline-offset:2px}
.course-support-content{padding:31px 30px 28px}
.course-support-emoji{width:62px;height:62px;display:grid;place-items:center;margin:0 0 17px;border:1px solid rgba(255,124,162,.34);border-radius:18px;background:rgba(255,79,138,.1);font-size:31px;box-shadow:inset 0 0 28px rgba(255,79,138,.05)}
.course-support-kicker{display:block;margin-bottom:8px;color:#ffb1c9;font:900 11px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.09em;text-transform:uppercase}
.course-support-dialog h2{margin:0 42px 12px 0;color:#fff;font-size:clamp(23px,5vw,31px);line-height:1.1;text-transform:none}
.course-support-dialog p{margin:0;color:#cad8e4;font-size:14px;line-height:1.65}
.course-support-note{margin-top:15px!important;padding:12px 13px;border-left:3px solid #ffcf54;background:rgba(255,207,84,.075);color:#eff5fa!important;font-size:13px!important}
.course-support-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.course-support-primary,.course-support-later{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:11px 17px;
  border-radius:10px;
  font:900 13px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;
  text-decoration:none;
  cursor:pointer;
}
.course-support-primary{border:1px solid rgba(255,171,198,.72);background:linear-gradient(135deg,#ff4f8a,#b7235d);color:#fff;box-shadow:0 10px 28px rgba(183,35,93,.25)}
.course-support-primary:hover{filter:brightness(1.08);transform:translateY(-1px)}
.course-support-later{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.055);color:#dce8f1}
.course-support-later:hover{background:rgba(255,255,255,.1)}
.course-support-primary:focus-visible,.course-support-later:focus-visible{outline:3px solid #4ae9ff;outline-offset:3px}
body.course-support-lock{overflow:hidden}

html[data-theme="light"] .course-support-trigger{border-color:#df7296;background:linear-gradient(145deg,#fff,#ffe7ef);color:#b51f55;box-shadow:0 8px 24px rgba(81,31,50,.16)}
html[data-theme="light"] .course-support-trigger::after{background:#fff;color:#24313b;border-color:#d6e0e7}
html[data-theme="light"] .course-support-backdrop{background:rgba(26,34,42,.46)}
html[data-theme="light"] .course-support-dialog{border-color:#e6a1b8;background:linear-gradient(155deg,#fff 0%,#fff7fa 60%,#f6fbff 100%);color:#16232d;box-shadow:0 28px 80px rgba(46,55,64,.28)}
html[data-theme="light"] .course-support-close{border-color:#d8e1e8;background:#f7fafc;color:#273741}
html[data-theme="light"] .course-support-kicker{color:#b42058}
html[data-theme="light"] .course-support-dialog h2{color:#17242e}
html[data-theme="light"] .course-support-dialog p{color:#526572}
html[data-theme="light"] .course-support-note{background:#fff8df;color:#354550!important}
html[data-theme="light"] .course-support-later{border-color:#cfdbe3;background:#fff;color:#334651}

@media(max-width:600px){
  .course-support-trigger{top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));width:44px;height:44px;font-size:20px}
  .course-support-trigger::after{display:none}
  .course-support-backdrop{padding:12px;place-items:end center}
  .course-support-dialog{width:100%;border-radius:18px 18px 12px 12px}
  .course-support-close{width:42px;height:42px}
  .course-support-content{padding:27px 20px 21px}
  .course-support-emoji{width:54px;height:54px;font-size:27px}
  .course-support-actions{display:grid;grid-template-columns:1fr}
  .course-support-primary,.course-support-later{width:100%}
}
@media(prefers-reduced-motion:reduce){
  .course-support-trigger,.course-support-backdrop,.course-support-dialog,.course-support-primary{transition:none!important;animation:none!important}
}