:root {
  --pv-control-bg:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035)),rgba(10,21,37,.78);
  --pv-control-bg-light:linear-gradient(180deg,rgba(255,255,255,.96),rgba(246,250,254,.92));
}

.theme-switch {
  --toggle-size:16px;
  position:relative;
  display:inline-block;
  width:7.5em;
  height:4em;
  flex:0 0 auto;
  font-size:var(--toggle-size);
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.theme-switch__checkbox {
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}

.theme-switch__container {
  position:absolute;
  inset:0;
  overflow:hidden;
  border-radius:3em;
  background:#3D7EAE;
  box-shadow:inset 0 -.08em .08em rgba(0,0,0,.18),inset 0 .08em .16em rgba(255,255,255,.34),0 .3em .75em rgba(36,176,233,.22);
  transition:background .5s cubic-bezier(.4,0,.2,1), box-shadow .5s cubic-bezier(.4,0,.2,1);
}

.theme-switch__container::before {
  content:"";
  position:absolute;
  inset:.22em;
  border-radius:inherit;
  border:.08em solid rgba(255,255,255,.28);
  pointer-events:none;
}

.theme-switch__circle-container {
  position:absolute;
  top:.35em;
  left:.35em;
  width:3.3em;
  height:3.3em;
  border-radius:50%;
  filter:drop-shadow(0 .38em .55em rgba(0,0,0,.22));
  transition:transform .5s cubic-bezier(.2,.8,.24,1);
}

.theme-switch__sun-moon-container {
  position:absolute;
  inset:0;
  overflow:hidden;
  border-radius:50%;
  background:radial-gradient(circle at 35% 28%,#fff7b8 0 17%,#ffd65a 18% 43%,#f7a928 44% 100%);
  box-shadow:inset .12em .12em .18em rgba(255,255,255,.65),inset -.18em -.18em .24em rgba(170,96,0,.22);
  transition:background .5s cubic-bezier(.2,.8,.24,1), transform .5s cubic-bezier(.2,.8,.24,1);
}

.theme-switch__moon {
  position:absolute;
  inset:0;
  border-radius:50%;
  background:#d9e6f7;
  transform:translateX(100%);
  transition:transform .5s cubic-bezier(.2,.8,.24,1);
}

.theme-switch__spot {
  position:absolute;
  display:block;
  border-radius:50%;
  background:#a8bdd3;
  box-shadow:inset .04em .05em .08em rgba(30,45,64,.24);
}

.theme-switch__spot:nth-child(1) { width:.55em; height:.55em; left:.78em; top:.72em; }
.theme-switch__spot:nth-child(2) { width:.36em; height:.36em; right:.78em; top:1.15em; }
.theme-switch__spot:nth-child(3) { width:.68em; height:.68em; left:1.48em; bottom:.62em; }

.theme-switch__clouds {
  position:absolute;
  left:.75em;
  bottom:.55em;
  width:5.6em;
  height:1.45em;
  color:#fff;
  background:currentColor;
  border-radius:999px;
  opacity:.9;
  box-shadow:1.25em -.34em 0 -.16em currentColor,2.35em -.08em 0 .04em currentColor,3.35em -.42em 0 -.12em currentColor;
  transition:transform .5s cubic-bezier(.2,.8,.24,1), opacity .35s ease;
}

.theme-switch__stars-container {
  position:absolute;
  inset:.6em .65em auto auto;
  width:4.7em;
  height:1.8em;
  color:#fff;
  opacity:0;
  transform:translateY(-.4em);
  transition:opacity .35s ease, transform .5s cubic-bezier(.2,.8,.24,1);
}

.theme-switch__checkbox:checked + .theme-switch__container {
  background:#0A1525;
  box-shadow:inset 0 .18em .45em rgba(0,0,0,.44),0 .35em .85em rgba(0,0,0,.28);
}

.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__circle-container {
  transform:translateX(3.5em);
}

.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__sun-moon-container {
  background:#d9e6f7;
  transform:rotate(-18deg);
}

.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__moon {
  transform:translateX(0);
}

.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__clouds {
  opacity:0;
  transform:translateX(-2em);
}

.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__stars-container {
  opacity:1;
  transform:translateY(0);
}

.theme-switch:focus-within .theme-switch__container {
  outline:3px solid rgba(74,198,245,.92);
  outline-offset:4px;
}

.pv-tooltip {
  position:relative;
  display:inline-flex;
  align-items:center;
  isolation:isolate;
}

.pv-tooltip__bubble,
[data-pv-tooltip]::after {
  position:absolute;
  z-index:40;
  left:calc(100% + 14px);
  top:50%;
  width:232px;
  min-height:64px;
  padding:14px 16px;
  border-radius:22px;
  color:#F6FAFE;
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035)),linear-gradient(135deg,rgba(10,21,37,.98),rgba(15,30,39,.98));
  border:1px solid rgba(184,203,217,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 18px 40px rgba(0,0,0,.34);
  opacity:0;
  pointer-events:none;
  transform:translate(-8px,-50%) scale(.96);
  transform-origin:left center;
  transition:opacity .24s ease, transform .34s cubic-bezier(.2,.8,.24,1);
}

[data-pv-tooltip] {
  position:relative;
}

[data-pv-tooltip]::after {
  content:attr(data-pv-tooltip);
  font-size:.78rem;
  font-weight:800;
  line-height:1.28;
}

.pv-tooltip:hover .pv-tooltip__bubble,
.pv-tooltip:focus-within .pv-tooltip__bubble,
[data-pv-tooltip]:hover::after,
[data-pv-tooltip]:focus-visible::after {
  opacity:1;
  transform:translate(0,-50%) scale(1);
}

.pv-form-container {
  width:100%;
  padding:22px;
  border-radius:30px;
  background:var(--pv-control-bg);
  border:1px solid rgba(184,203,217,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 18px 44px rgba(0,0,0,.22);
}

textarea,
.pv-textarea,
.preview-text,
.answer,
.answer-input,
.ext-textarea {
  min-height:180px !important;
  padding:16px !important;
  border:1px solid rgba(184,203,217,.16) !important;
  border-radius:20px !important;
  background:var(--pv-control-bg-light) !important;
  color:var(--pv-ink-950,#0A1525) !important;
  font-family:var(--pv-font-rounded) !important;
  font-size:1rem !important;
  font-weight:720 !important;
  line-height:1.52 !important;
  letter-spacing:0 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.90),0 12px 28px rgba(10,21,37,.06) !important;
  transition:border-color .22s ease, box-shadow .22s ease, transform .22s cubic-bezier(.2,.8,.24,1), background .22s ease;
}

textarea:focus,
.pv-textarea:focus,
.preview-text:focus,
.answer:focus,
.answer-input:focus,
.ext-textarea:focus {
  transform:translateY(-1px);
  border-color:rgba(36,176,233,.42) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.94),0 0 0 4px rgba(36,176,233,.11),0 18px 38px rgba(10,21,37,.08) !important;
}

[data-theme="dark"] textarea,
[data-theme="dark"] .pv-textarea,
[data-theme="dark"] .preview-text,
[data-theme="dark"] .answer,
[data-theme="dark"] .answer-input,
[data-theme="dark"] .ext-textarea {
  background:linear-gradient(180deg,rgba(255,255,255,.095),rgba(255,255,255,.035)),rgba(10,21,37,.82) !important;
  color:#fff !important;
  border-color:rgba(184,203,217,.16) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 28px rgba(0,0,0,.16) !important;
}

.pv-radio-inputs,
.auth-tabs,
.profile-tabs,
.seg,
.input-switch {
  position:relative !important;
  display:inline-grid !important;
  grid-auto-flow:column;
  grid-auto-columns:1fr;
  width:fit-content;
  max-width:100%;
  padding:5px !important;
  gap:4px !important;
  border-radius:22px !important;
  background:var(--pv-control-bg-light) !important;
  border:1px solid rgba(10,21,37,.08) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.90),0 14px 30px rgba(10,21,37,.08) !important;
  overflow:auto;
}

.auth-tabs,
.profile-tabs,
.input-switch {
  width:100%;
}

.pv-radio .name,
.auth-tabs button,
.profile-tabs button,
.seg button,
.input-switch button {
  min-height:42px !important;
  padding:12px 18px !important;
  border:0 !important;
  border-radius:17px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  color:rgba(10,21,37,.62) !important;
  background:transparent !important;
  font-family:var(--pv-font-rounded) !important;
  font-size:.92rem !important;
  font-weight:900 !important;
  letter-spacing:0 !important;
  white-space:nowrap !important;
  cursor:pointer;
  transition:color .22s ease, background .22s ease, box-shadow .22s ease, transform .22s cubic-bezier(.2,.8,.24,1);
}

.pv-radio input:checked + .name,
.auth-tabs button.active,
.profile-tabs button.active,
.seg button.active,
.input-switch button.active {
  color:var(--pv-ink-950) !important;
  background:var(--pv-brand-gradient) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.42),0 10px 24px rgba(36,176,233,.20) !important;
  transform:translateY(-1px);
}

[data-theme="dark"] .pv-radio-inputs,
[data-theme="dark"] .auth-tabs,
[data-theme="dark"] .profile-tabs,
[data-theme="dark"] .seg,
[data-theme="dark"] .input-switch {
  background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.035)),rgba(10,21,37,.82) !important;
  border-color:rgba(184,203,217,.16) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 14px 34px rgba(0,0,0,.20) !important;
}

[data-theme="dark"] .auth-tabs button,
[data-theme="dark"] .profile-tabs button,
[data-theme="dark"] .seg button,
[data-theme="dark"] .input-switch button {
  color:var(--pv-text-soft) !important;
}

.pv-file-upload,
.custum-file-upload,
.dropzone {
  position:relative !important;
  width:100% !important;
  min-height:190px !important;
  padding:24px !important;
  border-radius:28px !important;
  display:grid !important;
  place-items:center !important;
  gap:14px !important;
  text-align:center !important;
  cursor:pointer;
  overflow:hidden !important;
  color:rgba(10,21,37,.62) !important;
  background:radial-gradient(circle at 50% 20%,rgba(36,176,233,.10),transparent 48%),var(--pv-control-bg-light) !important;
  border:2px dashed rgba(36,176,233,.26) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.90),0 14px 30px rgba(10,21,37,.08) !important;
  transition:transform .24s cubic-bezier(.2,.8,.24,1), border-color .24s ease, box-shadow .24s ease, background .24s ease;
}

.pv-file-upload:hover,
.custum-file-upload:hover,
.dropzone:hover,
.pv-file-upload:focus-within,
.custum-file-upload:focus-within,
.dropzone:focus-within {
  transform:translateY(-2px);
  border-color:rgba(101,210,107,.58) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.94),0 22px 50px rgba(36,176,233,.16) !important;
}

[data-theme="dark"] .pv-file-upload,
[data-theme="dark"] .custum-file-upload,
[data-theme="dark"] .dropzone {
  color:var(--pv-text-soft) !important;
  background:radial-gradient(circle at 50% 20%,rgba(36,176,233,.14),transparent 48%),var(--pv-control-bg) !important;
  border-color:rgba(74,198,245,.32) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 16px 36px rgba(0,0,0,.18) !important;
}

.action_has {
  --btn-size:54px;
  position:relative !important;
  width:var(--btn-size) !important;
  height:var(--btn-size) !important;
  border:1px solid rgba(184,203,217,.14) !important;
  border-radius:19px !important;
  display:grid !important;
  place-items:center !important;
  cursor:pointer;
  color:var(--pv-text-soft) !important;
  background:var(--pv-control-bg) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 14px 30px rgba(0,0,0,.18) !important;
  transition:transform .18s cubic-bezier(.2,.8,.24,1), border-color .18s ease, color .18s ease, background .18s ease, box-shadow .18s ease;
  isolation:isolate;
  overflow:visible !important;
}

.action_has:hover {
  transform:translateY(-2px);
  color:#F6FAFE !important;
  border-color:rgba(74,198,245,.34) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 18px 38px rgba(36,176,233,.14) !important;
}

.action_has.has_liked {
  color:white !important;
  background:var(--pv-brand-gradient) !important;
  border-color:rgba(255,255,255,.26) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.44),0 16px 34px rgba(36,176,233,.22),0 0 36px rgba(101,210,107,.14) !important;
}

.action_has svg {
  width:25px !important;
  height:25px !important;
  display:block;
}

.action_has span[data-icon] {
  position:relative;
  z-index:2;
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  transform-origin:50% 80%;
}

.like-burst,
.like-ring {
  position:absolute;
  pointer-events:none;
  z-index:1;
  opacity:0;
}

.like-burst {
  inset:50% auto auto 50%;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#F6FAFE;
  box-shadow:0 -27px 0 #4AC6F5,19px -19px 0 #65D26B,27px 0 0 #4AC6F5,19px 19px 0 #65D26B,0 27px 0 #4AC6F5,-19px 19px 0 #65D26B,-27px 0 0 #4AC6F5,-19px -19px 0 #65D26B;
  transform:translate(-50%,-50%) scale(.15);
}

.like-ring {
  inset:6px;
  border-radius:inherit;
  border:2px solid rgba(246,250,254,.58);
  transform:scale(.55);
}

.action_has.is-popping span[data-icon] { animation:thumb-pop .58s cubic-bezier(.18,.9,.24,1.25) both; }
.action_has.is-popping .like-burst { animation:like-burst .62s ease-out both; }
.action_has.is-popping .like-ring { animation:like-ring .62s ease-out both; }

@keyframes thumb-pop {
  0% { transform:translateY(0) rotate(0deg) scale(.78); }
  38% { transform:translateY(-3px) rotate(-14deg) scale(1.25); }
  64% { transform:translateY(1px) rotate(5deg) scale(.94); }
  100% { transform:translateY(0) rotate(-4deg) scale(1); }
}

@keyframes like-burst {
  0% { transform:translate(-50%,-50%) scale(.12) rotate(0deg); opacity:0; }
  28% { opacity:1; }
  100% { transform:translate(-50%,-50%) scale(1.08) rotate(22deg); opacity:0; }
}

@keyframes like-ring {
  0% { transform:scale(.52); opacity:.62; }
  100% { transform:scale(1.26); opacity:0; }
}

@media (max-width:720px) {
  .theme-switch { --toggle-size:13px; }
  .pv-radio-inputs,.auth-tabs,.profile-tabs,.seg,.input-switch { width:100%; grid-auto-flow:row; }
}

@media (prefers-reduced-motion:reduce) {
  .theme-switch *,
  .pv-tooltip *,
  .pv-tooltip__bubble,
  [data-pv-tooltip]::after,
  .pv-file-upload,
  .custum-file-upload,
  .dropzone,
  .action_has,
  .action_has * {
    transition:none !important;
    animation:none !important;
  }
}