survey-react 1.9.112 → 1.9.113

package/defaultV2.css

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v1.9.112
+ * surveyjs - Survey JavaScript library v1.9.113
  * Copyright (c) 2015-2023 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -496,7 +496,7 @@ sv-popup {
   max-width: 100vw;
 }
 
-.sv-popup.sv-popup--modal {
+.sv-popup--modal {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -504,7 +504,7 @@ sv-popup {
   padding: calc(11 * (var(--sjs-base-unit, var(--base-unit, 8px)))) calc(15 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   box-sizing: border-box;
 }
-.sv-popup.sv-popup--modal .sv-popup__body-content {
+.sv-popup--modal .sv-popup__body-content {
   padding: calc(4 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   height: auto;
 }
@@ -526,7 +526,8 @@ sv-popup {
   font-size: var(--sjs-font-size, 16px);
   font-style: normal;
   font-weight: 400;
-  line-height: calc(1.5 * (var(--sjs-font-size, 16px))); /* 150% */
+  line-height: calc(1.5 * (var(--sjs-font-size, 16px)));
+  /* 150% */
 }
 .sv-popup--confirm-delete .sv-popup__scrolling-content {
   display: none;
@@ -538,15 +539,15 @@ sv-popup {
   gap: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
 
-.sv-popup.sv-popup--modal > .sv-popup__container {
+.sv-popup--modal > .sv-popup__container {
   position: static;
 }
 
-.sv-popup--overlay.sv-popup--overlay {
+.sv-popup--overlay {
   width: 100%;
   height: var(--sv-popup-overlay-height, 100vh);
 }
-.sv-popup--overlay.sv-popup--overlay .sv-popup__container {
+.sv-popup--overlay .sv-popup__container {
   background: var(--background-semitransparent, rgba(144, 144, 144, 0.5));
   max-width: 100vw;
   max-height: calc(var(--sv-popup-overlay-height, 100vh) - 1 * var(--sjs-base-unit, var(--base-unit, 8px)));
@@ -555,7 +556,7 @@ sv-popup {
   padding-top: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   border: unset;
 }
-.sv-popup--overlay.sv-popup--overlay .sv-popup__body-content {
+.sv-popup--overlay .sv-popup__body-content {
   max-height: var(--sv-popup-overlay-height, 100vh);
   max-width: 100vw;
   border-radius: calc(4 * (var(--sjs-corner-radius, 4px))) calc(4 * (var(--sjs-corner-radius, 4px))) 0px 0px;
@@ -564,25 +565,25 @@ sv-popup {
   padding: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px)))) calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px)))) calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   height: calc(100% - 1 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
-.sv-popup--overlay.sv-popup--overlay .sv-popup__scrolling-content {
+.sv-popup--overlay .sv-popup__scrolling-content {
   height: calc(100% - 10 * var(--base-unit, 8px));
 }
-.sv-popup--overlay.sv-popup--overlay .sv-popup__body-footer {
+.sv-popup--overlay .sv-popup__body-footer {
   margin-top: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
-.sv-popup--overlay.sv-popup--overlay .sv-popup__body-footer .sv-action-bar {
+.sv-popup--overlay .sv-popup__body-footer .sv-action-bar {
   width: 100%;
 }
-.sv-popup--overlay.sv-popup--overlay .sv-popup__body-footer-item {
+.sv-popup--overlay .sv-popup__body-footer-item {
   width: 100%;
 }
-.sv-popup--overlay.sv-popup--overlay .sv-popup__button {
+.sv-popup--overlay .sv-popup__button.sv-popup__button {
   background-color: var(--sjs-primary-backcolor, var(--primary, #19b394));
   border: 2px solid var(--sjs-primary-backcolor, var(--primary, #19b394));
   color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
 }
 
-.sv-popup--overlay.sv-popup--overlay:not(.sv-dropdown-popup) .sv-popup__body-footer .sv-action {
+.sv-popup--overlay .sv-popup__body-footer .sv-action {
   flex: 1 0 0;
 }
 
@@ -685,66 +686,97 @@ sv-popup {
   top: calc(2.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
 
-.sv-dropdown-popup.sv-popup--overlay {
+.sv-popup--dropdown .sv-list__filter {
+  margin-bottom: var(--sjs-base-unit, var(--base-unit, 8px));
+}
+.sv-popup--dropdown .sv-popup__shadow {
+  box-shadow: var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1));
+}
+.sv-popup--dropdown .sv-popup__body-content {
+  background-color: var(--sjs-general-backcolor, var(--background, #fff));
+  padding: var(--sjs-base-unit, var(--base-unit, 8px)) 0;
+  height: 100%;
+}
+
+.sv-dropdown-popup .sv-popup__body-content {
+  padding: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) 0;
+}
+.sv-dropdown-popup .sv-list__filter {
+  margin-bottom: 0;
+}
+
+.sv-popup--modal .sv-popup__body-content {
+  box-shadow: var(--sjs-shadow-large, 0px 8px 16px 0px rgba(0, 0, 0, 0.1));
+  background-color: var(--sjs-general-backcolor-dim-light, var(--background-dim-light, #f9f9f9));
+}
+.sv-popup--modal .sv-popup__body-footer {
+  padding-bottom: 2px;
+}
+
+.sv-popup--overlay .sv-popup__body-content {
+  background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
+}
+
+.sv-popup--dropdown-overlay {
   z-index: 2001;
   padding: 0;
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-popup__body-content {
+.sv-popup--dropdown-overlay .sv-popup__body-content {
   padding: 0;
   border-radius: 0;
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-popup__body-footer .sv-action-bar .sv-action {
-  width: auto;
+.sv-popup--dropdown-overlay .sv-popup__body-footer .sv-action-bar .sv-action {
+  flex: 0 0 auto;
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-popup__button {
+.sv-popup--dropdown-overlay .sv-popup__button.sv-popup__button {
   background-color: transparent;
   color: var(--sjs-primary-backcolor, var(--primary, #19b394));
   border: none;
   box-shadow: none;
-  padding: var(--sjs-base-unit, var(--base-unit, 8px)) calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  padding: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   border-radius: calc(12.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   margin: 0;
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-popup__container {
+.sv-popup--dropdown-overlay .sv-popup__container {
   max-height: calc(var(--sv-popup-overlay-height, 100vh));
   height: calc(var(--sv-popup-overlay-height, 100vh));
   padding-top: 0;
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-popup__body-content {
+.sv-popup--dropdown-overlay .sv-popup__body-content {
   height: calc(var(--sv-popup-overlay-height, 100vh));
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-popup__body-footer {
-  background-color: var(--sjs-general-backcolor-dim-light, var(--background-dim-light, #f9f9f9));
+.sv-popup--dropdown-overlay .sv-popup__body-footer {
+  background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
   margin-top: 0;
-  padding-top: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-  padding-bottom: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  padding-top: var(--sjs-base-unit, var(--base-unit, 8px));
+  padding-bottom: var(--sjs-base-unit, var(--base-unit, 8px));
   border-top: 1px solid var(--sjs-border-light, var(--border-light, #eaeaea));
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-popup__scrolling-content {
+.sv-popup--dropdown-overlay .sv-popup__scrolling-content {
   height: calc(100% - 6 * var(--base-unit, 8px));
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-list__filter-icon .sv-svg-icon {
-  width: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-  height: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+.sv-popup--dropdown-overlay .sv-list__filter-icon .sv-svg-icon {
+  width: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  height: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-list__container {
+.sv-popup--dropdown-overlay .sv-list__container {
   padding: 0;
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-list {
+.sv-popup--dropdown-overlay .sv-list {
   flex-grow: 1;
-  padding: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  padding: var(--sjs-base-unit, var(--base-unit, 8px)) 0;
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-list__filter {
+.sv-popup--dropdown-overlay .sv-list__filter {
   display: flex;
   align-items: center;
-  padding: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) var(--sjs-base-unit, var(--base-unit, 8px)) calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) calc(2.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  margin-bottom: 0;
+  padding: calc(1.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) var(--sjs-base-unit, var(--base-unit, 8px)) calc(1.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-list__filter-icon {
+.sv-popup--dropdown-overlay .sv-list__filter-icon {
   position: static;
-  top: calc(1.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-  height: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  height: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-list__empty-container {
+.sv-popup--dropdown-overlay .sv-list__empty-container {
   display: flex;
   flex-direction: column;
   justify-content: center;
@@ -752,12 +784,12 @@ sv-popup {
   padding: var(--sjs-base-unit, var(--base-unit, 8px)) calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   background-color: var(--sjs-general-backcolor, var(--background, #fff));
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-popup__button:disabled {
+.sv-popup--dropdown-overlay .sv-popup__button:disabled {
   pointer-events: none;
   color: var(--sjs-general-forecolor, var(--foreground, #161616));
   opacity: 0.25;
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-list__filter-clear-button {
+.sv-popup--dropdown-overlay .sv-list__filter-clear-button {
   height: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   width: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   padding: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
@@ -766,42 +798,70 @@ sv-popup {
   border-radius: 100%;
   background-color: transparent;
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-list__filter-clear-button svg {
+.sv-popup--dropdown-overlay .sv-list__filter-clear-button svg {
   height: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   width: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-list__filter-clear-button svg use {
+.sv-popup--dropdown-overlay .sv-list__filter-clear-button svg use {
   fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-list__input {
+.sv-popup--dropdown-overlay .sv-list__input {
   color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
   font-size: var(--sjs-font-size, 16px);
   line-height: calc(1.5 * (var(--sjs-font-size, 16px)));
   font-family: var(--font-family);
-  padding: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) 0 calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) var(--sjs-base-unit, var(--base-unit, 8px));
+  padding: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) 0 calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-list__item:hover .sv-list__item-body,
-.sv-dropdown-popup.sv-popup--overlay .sv-list__item:focus .sv-list__item-body,
-.sv-dropdown-popup.sv-popup--overlay .sv-list__item--focused .sv-list__item-body {
+.sv-popup--dropdown-overlay .sv-list__item:hover .sv-list__item-body,
+.sv-popup--dropdown-overlay .sv-list__item:focus .sv-list__item-body,
+.sv-popup--dropdown-overlay .sv-list__item--focused .sv-list__item-body {
   background: var(--sjs-general-backcolor, var(--background, #fff));
 }
-.sv-dropdown-popup.sv-popup--overlay .sv-list__item:hover.sv-list__item--selected .sv-list__item-body,
-.sv-dropdown-popup.sv-popup--overlay .sv-list__item:focus.sv-list__item--selected .sv-list__item-body,
-.sv-dropdown-popup.sv-popup--overlay .sv-list__item--focused.sv-list__item--selected .sv-list__item-body {
+.sv-popup--dropdown-overlay .sv-list__item:hover.sv-list__item--selected .sv-list__item-body,
+.sv-popup--dropdown-overlay .sv-list__item:focus.sv-list__item--selected .sv-list__item-body,
+.sv-popup--dropdown-overlay .sv-list__item--focused.sv-list__item--selected .sv-list__item-body {
   background: var(--sjs-primary-backcolor, var(--primary, #19b394));
   color: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
   font-weight: 600;
 }
+.sv-popup--dropdown-overlay .sv-popup__body-footer .sv-action-bar {
+  justify-content: flex-start;
+}
 
-.sv-dropdown-popup.sv-popup--overlay.sv-multi-select-list .sv-list__item:hover.sv-list__item--selected .sv-list__item-body,
-.sv-dropdown-popup.sv-popup--overlay.sv-multi-select-list .sv-list__item:focus.sv-list__item--selected .sv-list__item-body,
-.sv-dropdown-popup.sv-popup--overlay.sv-multi-select-list .sv-list__item--focused.sv-list__item--selected .sv-list__item-body {
+.sv-dropdown-popup.sv-popup--dropdown-overlay .sv-list__filter {
+  padding: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) var(--sjs-base-unit, var(--base-unit, 8px)) calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) calc(2.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+}
+.sv-dropdown-popup.sv-popup--dropdown-overlay .sv-list {
+  padding: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+}
+.sv-dropdown-popup.sv-popup--dropdown-overlay .sv-popup__button.sv-popup__button {
+  padding: var(--sjs-base-unit, var(--base-unit, 8px)) calc(2.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+}
+.sv-dropdown-popup.sv-popup--dropdown-overlay .sv-popup__body-footer {
+  padding-top: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  padding-bottom: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  background-color: var(--sjs-general-backcolor-dim-light, var(--background-dim-light, #f9f9f9));
+}
+.sv-dropdown-popup.sv-popup--dropdown-overlay .sv-list__filter-icon .sv-svg-icon {
+  width: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  height: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+}
+.sv-dropdown-popup.sv-popup--dropdown-overlay .sv-list__filter-icon {
+  height: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+}
+.sv-dropdown-popup.sv-popup--dropdown-overlay .sv-list__input {
+  padding: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) 0 calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) var(--sjs-base-unit, var(--base-unit, 8px));
+}
+
+.sv-popup--dropdown-overlay.sv-multi-select-list .sv-list__item:hover.sv-list__item--selected .sv-list__item-body,
+.sv-popup--dropdown-overlay.sv-multi-select-list .sv-list__item:focus.sv-list__item--selected .sv-list__item-body,
+.sv-popup--dropdown-overlay.sv-multi-select-list .sv-list__item--focused.sv-list__item--selected .sv-list__item-body {
   background: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
   color: var(--sjs-general-forecolor, var(--foreground, #161616));
   font-weight: 400;
 }
 
-.sv-dropdown-popup.sv-popup--overlay.sv-popup--tablet .sv-popup__body-content {
+.sv-popup--dropdown-overlay.sv-popup--tablet .sv-popup__body-content {
   --sv-popup-overlay-max-height: calc(var(--sv-popup-overlay-height, 100vh) - var(--sjs-base-unit, var(--base-unit, 8px)) * 8);
   --sv-popup-overlay-max-width: calc(100% - var(--sjs-base-unit, var(--base-unit, 8px)) * 8);
   position: absolute;
@@ -809,7 +869,7 @@ sv-popup {
   left: 50%;
   top: 50%;
   max-height: var(--sv-popup-overlay-max-height);
-  min-height: min(var(--sv-popup-overlay-max-height), 31 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  min-height: min(var(--sv-popup-overlay-max-height), 30 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   height: auto;
   width: auto;
   min-width: min(40 * (var(--sjs-base-unit, var(--base-unit, 8px))), var(--sv-popup-overlay-max-width));
@@ -818,9 +878,9 @@ sv-popup {
   overflow: hidden;
   margin: 0;
 }
-.sv-dropdown-popup.sv-popup--overlay.sv-popup--tablet .sv-popup__content,
-.sv-dropdown-popup.sv-popup--overlay.sv-popup--tablet .sv-popup__scrolling-content,
-.sv-dropdown-popup.sv-popup--overlay.sv-popup--tablet .sv-list__container {
+.sv-popup--dropdown-overlay.sv-popup--tablet .sv-popup__content,
+.sv-popup--dropdown-overlay.sv-popup--tablet .sv-popup__scrolling-content,
+.sv-popup--dropdown-overlay.sv-popup--tablet .sv-list__container {
   flex-grow: 1;
 }
 
@@ -1140,7 +1200,7 @@ sv-popup {
   align-items: center;
   justify-content: center;
   background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
-  color: var(--sjs-general-forecolor, var(--foreground, #161616));
+  color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
   font-size: var(--sjs-font-size, 16px);
   border-radius: 100%;
   border: calc(0.25 * (var(--sjs-base-unit, var(--base-unit, 8px)))) solid transparent;
@@ -1163,19 +1223,19 @@ sv-popup {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-  color: var(--sjs-general-forecolor, var(--foreground, #161616));
+  color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
   font-size: var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px));
   line-height: calc(1.5 * (var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px))));
   margin: 0 calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
 
 .sd-ranking--disabled .sv-ranking-item__text {
-  color: var(--sjs-general-forecolor, var(--foreground, #161616));
+  color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
   opacity: 0.25;
 }
 
 .sv-ranking-item--disabled .sv-ranking-item__text {
-  color: var(--sjs-general-forecolor, var(--foreground, #161616));
+  color: var(--sjs-font-questiondescription-color, var(--sjs-general-forecolor-light, rgba(0, 0, 0, 0.45)));
   opacity: 0.25;
 }
 
@@ -1313,7 +1373,7 @@ sv-popup {
 }
 
 .sv-ranking__container-placeholder {
-  color: var(--sjs-general-dim-forecolor-light, rgba(0, 0, 0, 0.45));
+  color: var(--sjs-font-questiondescription-color, var(--sjs-general-dim-forecolor-light, rgba(0, 0, 0, 0.45)));
   font-family: var(--font-family, var(--font-family));
   font-style: normal;
   font-size: var(--sjs-font-size, 16px);
@@ -1335,7 +1395,7 @@ sv-popup {
 }
 
 .sv-ranking__containers-divider {
-  background: var(--sjs-border-inside, var(--border-inside, rgba(0, 0, 0, 0.16)));
+  background: var(--sjs-border-default, var(--sjs-border-inside, var(--border-inside, rgba(0, 0, 0, 0.16))));
 }
 
 .sv-ranking__container--from .sv-ranking-item__icon--focus {
@@ -1387,7 +1447,7 @@ sv-popup {
   padding-block: var(--sjs-base-unit, var(--base-unit, 8px));
   padding-inline-end: calc(8 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   padding-inline-start: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-  color: var(--sjs-general-forecolor, var(--foreground, #161616));
+  color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
   font-weight: normal;
   font-size: var(--sjs-font-size, 16px);
   line-height: calc(1.5 * (var(--sjs-font-size, 16px)));
@@ -1480,7 +1540,7 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
 .sv-multi-select-list .sv-list__item.sv-list__item--selected .sv-list__item-body,
 .sv-multi-select-list .sv-list__item.sv-list__item--selected:hover .sv-list__item-body {
   background-color: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
-  color: var(--sjs-general-forecolor, var(--foreground, #161616));
+  color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
   font-weight: 400;
 }
 
@@ -1768,117 +1828,6 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
   background: var(--sjs-questionpanel-backcolor, var(--sjs-question-background, var(--sjs-general-backcolor, var(--background, #fff))));
   box-shadow: var(--sjs-shadow-small, 0px 1px 2px 0px rgba(0, 0, 0, 0.15));
 }
-.sd-element--with-frame.sd-question--paneldynamic {
-  padding-bottom: 0;
-}
-.sd-element--with-frame.sd-question--paneldynamic > .sd-question__erbox--below-question {
-  bottom: 0;
-  margin-top: 0;
-}
-
-.sd-element--complex.sd-element--complex > .sd-question__erbox--above-question {
-  margin-top: 0;
-  margin-bottom: 0;
-}
-.sd-element--complex > .sd-element__header--location-top {
-  margin-top: 0;
-}
-.sd-element--complex > .sd-element__header--location-top:after {
-  content: " ";
-  display: block;
-  position: relative;
-  height: 1px;
-  background: var(--sjs-border-light, var(--border-light, #eaeaea));
-  bottom: 0;
-}
-.sd-element--complex.sd-element--with-frame {
-  padding-top: 0;
-}
-.sd-element--complex.sd-element--with-frame > .sd-element__header--location-top {
-  margin-top: 0;
-  padding-top: var(--sd-base-vertical-padding);
-  padding-bottom: var(--sd-base-vertical-padding);
-}
-.sd-element--complex.sd-element--with-frame > .sd-element__header--location-top:after {
-  bottom: calc(-1 * var(--sd-base-vertical-padding));
-  left: calc(-1 * var(--sd-base-padding));
-  width: calc(100% + 2 * var(--sd-base-padding));
-}
-
-.sd-element--expanded > .sd-element__header,
-.sd-element--collapsed > .sd-element__header {
-  cursor: pointer;
-}
-
-.sd-element--collapsed > .sd-element__header {
-  padding: calc(0 * (var(--sjs-base-unit, var(--base-unit, 8px)))) var(--sd-base-padding);
-  box-sizing: border-box;
-  background-color: var(--sjs-general-backcolor, var(--background, #fff));
-}
-.sd-element--collapsed.sd-element--complex > .sd-element__header--location-top:after {
-  display: none;
-}
-.sd-element--collapsed > .sd-element__header--location-top {
-  margin-top: 0;
-}
-.sd-element--collapsed.sd-element--with-frame {
-  padding-top: 0;
-  padding-bottom: 0;
-}
-.sd-element--collapsed.sd-element--with-frame > .sd-element__header {
-  padding-top: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-  padding-bottom: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-  border-radius: var(--sjs-questionpanel-cornerRadius, var(--sjs-corner-radius, 4px));
-}
-.sd-element--collapsed > .sd-element__header:focus-within, .sd-element--collapsed > .sd-element__header:hover {
-  background-color: var(--sjs-general-backcolor-dim-light, var(--background-dim-light, #f9f9f9));
-}
-
-.sd-element--collapsed > .sd-element__header {
-  margin-left: calc(-1 * var(--sd-base-padding));
-  width: calc(100% + 2 * var(--sd-base-padding));
-}
-
-.sd-element--nested.sd-element--complex > .sd-element__header--location-top:after {
-  bottom: calc(-0.5 * var(--sd-base-vertical-padding));
-}
-.sd-element--nested.sd-element--collapsed > .sd-element__header:hover, .sd-element--nested.sd-element--collapsed > .sd-element__header:focus-within {
-  box-shadow: 0 calc(-2 * (var(--sjs-base-unit, var(--base-unit, 8px)))) 0 0 var(--sjs-general-backcolor-dim-light, var(--background-dim-light, #f9f9f9)), 0 calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px)))) 0 var(--sjs-general-backcolor-dim-light, var(--background-dim-light, #f9f9f9));
-}
-.sd-element--nested.sd-panel, .sd-element--nested.sd-question--paneldynamic {
-  border: 1px solid var(--sjs-border-light, var(--border-light, #eaeaea));
-  border-radius: calc(var(--sjs-corner-radius, 4px) - 4px);
-  box-sizing: border-box;
-  padding-left: var(--sd-base-padding);
-  padding-right: var(--sd-base-padding);
-}
-.sd-element--nested.sd-panel > .sd-element__header--location-top, .sd-element--nested.sd-question--paneldynamic > .sd-element__header--location-top {
-  padding-top: calc(0.5 * var(--sd-base-vertical-padding));
-  padding-bottom: calc(0.5 * var(--sd-base-vertical-padding));
-}
-.sd-element--nested.sd-panel > .sd-element__header--location-top:after, .sd-element--nested.sd-question--paneldynamic > .sd-element__header--location-top:after {
-  left: calc(-1 * var(--sd-base-padding));
-  width: calc(100% + 2 * var(--sd-base-padding));
-  bottom: calc(-0.5 * var(--sd-base-vertical-padding));
-}
-.sd-element--nested.sd-panel > .sd-question__erbox--outside-question, .sd-element--nested.sd-question--paneldynamic > .sd-question__erbox--outside-question {
-  margin-left: calc(-1 * var(--sd-base-padding));
-  margin-right: calc(-1 * var(--sd-base-padding));
-  width: calc(100% + 2 * var(--sd-base-padding));
-}
-.sd-element--nested.sd-panel > .sd-question__erbox--below-question, .sd-element--nested.sd-question--paneldynamic > .sd-question__erbox--below-question {
-  bottom: 0;
-  margin-top: 0;
-}
-.sd-element--nested.sd-panel.sd-element--collapsed > .sd-element__header--location-top:after, .sd-element--nested.sd-question--paneldynamic.sd-element--collapsed > .sd-element__header--location-top:after {
-  display: none;
-}
-.sd-element--nested.sd-panel.sd-element--collapsed > .sd-element__header--location-top:hover, .sd-element--nested.sd-panel.sd-element--collapsed > .sd-element__header--location-top:focus-within, .sd-element--nested.sd-question--paneldynamic.sd-element--collapsed > .sd-element__header--location-top:hover, .sd-element--nested.sd-question--paneldynamic.sd-element--collapsed > .sd-element__header--location-top:focus-within {
-  box-shadow: none;
-}
-.sd-element--nested > .sd-panel__content {
-  padding-bottom: var(--sd-base-padding);
-}
 
 .sd-element--with-frame.sd-element--compact {
   border: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
@@ -1892,13 +1841,15 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
 }
 
 .sd-question__erbox {
+  display: block;
   padding: var(--sjs-base-unit, var(--base-unit, 8px)) calc(1.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   border-radius: var(--sjs-corner-radius, 4px);
-  font-weight: 600;
   line-height: var(--sjs-font-size, 16px);
   font-size: calc(0.75 * (var(--sjs-font-size, 16px)));
-  white-space: normal;
   text-align: left;
+  color: var(--sjs-special-red, var(--red, #e60a3e));
+  font-weight: 600;
+  white-space: normal;
 }
 
 .sd-question__erbox--outside-question {
@@ -1909,26 +1860,39 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
 }
 
 .sd-question__erbox--above-question {
-  margin-bottom: var(--sd-base-vertical-padding);
+  margin-bottom: var(--sjs-base-unit, var(--base-unit, 8px));
 }
 
 .sd-question__erbox--below-question {
   margin-top: var(--sjs-base-unit, var(--base-unit, 8px));
 }
 
+.sd-question--title-top > .sd-question__erbox--above-question {
+  margin-bottom: calc(0.5 * var(--sd-base-vertical-padding));
+}
+
+.sd-question--description-under-input > .sd-question__erbox--below-question,
+.sd-question--title-bottom > .sd-question__erbox--below-question {
+  margin-top: calc(0.25 * var(--sd-base-vertical-padding) + 0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
+}
+
 .sd-element--with-frame > .sd-question__erbox--above-question {
+  margin-bottom: var(--sd-base-padding);
   border-radius: var(--sjs-corner-radius, 4px) var(--sjs-corner-radius, 4px) 0 0;
 }
 
 .sd-element--with-frame > .sd-question__erbox--below-question {
-  position: relative;
-  margin-top: 0;
-  bottom: calc(-1 * var(--sd-base-padding));
+  margin-top: var(--sd-base-padding);
   border-radius: 0 0 var(--sjs-corner-radius, 4px) var(--sjs-corner-radius, 4px);
 }
 
-.sd-root-modern--mobile .sd-question__erbox--below-question {
-  margin-top: var(--sjs-base-unit, var(--base-unit, 8px));
+.sd-element--with-frame.sd-question--title-top > .sd-question__erbox--above-question {
+  margin-bottom: calc(0.5 * var(--sd-base-vertical-padding) + var(--sjs-base-unit, var(--base-unit, 8px)));
+}
+
+.sd-element--with-frame.sd-question--description-under-input > .sd-question__erbox--below-question,
+.sd-element--with-frame.sd-question--title-bottom > .sd-question__erbox--below-question {
+  margin-top: calc(0.5 * var(--sd-base-vertical-padding) + var(--sjs-base-unit, var(--base-unit, 8px)));
 }
 
 .sd-question__header {
@@ -1936,25 +1900,27 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
 }
 
 .sd-question__header--location-top {
-  margin-top: calc(-0.25 * var(--sd-base-vertical-padding));
   padding-bottom: calc(0.5 * var(--sd-base-vertical-padding));
 }
 
 .sd-question__header--location--bottom {
-  padding-top: calc(0.5 * var(--sd-base-vertical-padding));
+  padding-top: calc(0.375 * var(--sd-base-vertical-padding));
 }
 
+.sd-element--with-frame.sd-question--title-top {
+  padding-top: var(--sd-base-vertical-padding);
+}
+.sd-element--with-frame.sd-question--error-top {
+  padding-top: 0;
+}
+.sd-element--with-frame.sd-question--error-bottom {
+  padding-bottom: 0;
+}
 .sd-element--with-frame > .sd-question__erbox--outside-question {
   margin-left: calc(-1 * var(--sd-base-padding));
   margin-right: calc(-1 * var(--sd-base-padding));
   width: calc(100% + 2 * var(--sd-base-padding));
 }
-.sd-element--with-frame > .sd-question__erbox--above-question {
-  margin-top: calc(-1 * var(--sd-base-padding));
-}
-.sd-element--with-frame > .sd-question__content > .sd-question__header--location--bottom {
-  margin-bottom: calc(-1 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-}
 
 .sd-scrollable .sd-question__content {
   overflow-x: auto;
@@ -1995,39 +1961,6 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
   white-space: normal;
 }
 
-.sd-question__erbox--tooltip {
-  display: none;
-  position: fixed;
-  height: auto;
-  width: auto;
-  max-width: calc(29 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-  background-color: var(--sjs-general-backcolor, var(--background, #fff));
-  color: var(--sjs-general-forecolor, var(--foreground, #161616));
-  opacity: 0.75;
-  box-shadow: var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1));
-  z-index: 1000;
-}
-
-.sd-question__content:hover:not(:focus-within) > .sd-question__erbox--tooltip {
-  display: block;
-}
-
-.sd-question__erbox--location--top,
-.sd-question__erbox--location--bottom {
-  display: block;
-  color: var(--sjs-special-red, var(--red, #e60a3e));
-  padding-left: 0;
-  padding-right: 0;
-  text-align: left;
-}
-
-.sd-question--empty.sd-question--complex > .sd-question__header--location-top {
-  padding-bottom: calc(0.5 * var(--sd-base-vertical-padding));
-}
-.sd-question--empty.sd-question--complex > .sd-question__header--location-top:after {
-  display: none;
-}
-
 .sd-question__placeholder {
   display: flex;
   flex-direction: column;
@@ -2044,14 +1977,6 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
   white-space: pre-line;
 }
 
-.sd-question--empty.sd-question--complex > .sd-question__content {
-  padding-top: 0;
-  padding-bottom: 0;
-}
-.sd-question--empty.sd-question--complex > .sd-question__content:first-child {
-  padding-top: var(--sd-base-padding);
-}
-
 .sd-scrollable-container:not(.sd-scrollable-container--compact) {
   width: max-content;
   overflow: visible;
@@ -2063,6 +1988,116 @@ li:focus .sv-list__item.sv-list__item--selected .sv-list__item-icon use {
   height: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
 
+.sd-element--expanded > .sd-element__header,
+.sd-element--collapsed > .sd-element__header {
+  cursor: pointer;
+}
+
+.sd-element--collapsed > .sd-element__header {
+  padding: calc(0 * (var(--sjs-base-unit, var(--base-unit, 8px)))) var(--sd-base-padding);
+  box-sizing: border-box;
+  background-color: var(--sjs-general-backcolor, var(--background, #fff));
+  margin-left: calc(-1 * var(--sd-base-padding));
+  width: calc(100% + 2 * var(--sd-base-padding));
+}
+.sd-element--collapsed.sd-element--with-frame {
+  padding-top: 0;
+  padding-bottom: 0;
+}
+.sd-element--collapsed.sd-element--with-frame > .sd-element__header {
+  padding-top: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  padding-bottom: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  border-radius: var(--sjs-questionpanel-cornerRadius, var(--sjs-corner-radius, 4px));
+}
+.sd-element--collapsed > .sd-element__header:focus-within, .sd-element--collapsed > .sd-element__header:hover {
+  background-color: var(--sjs-general-backcolor-dim-light, var(--background-dim-light, #f9f9f9));
+}
+.sd-element--collapsed.sd-element--nested > .sd-element__header:hover, .sd-element--collapsed.sd-element--nested > .sd-element__header:focus-within {
+  box-shadow: 0 calc(-2 * (var(--sjs-base-unit, var(--base-unit, 8px)))) 0 0 var(--sjs-general-backcolor-dim-light, var(--background-dim-light, #f9f9f9)), 0 calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px)))) 0 var(--sjs-general-backcolor-dim-light, var(--background-dim-light, #f9f9f9));
+}
+
+.sd-element--complex.sd-element--with-frame {
+  padding-top: 0;
+}
+
+.sd-element--complex.sd-element--nested-with-borders > .sd-question__erbox--outside-question,
+.sd-element--complex.sd-element--with-frame > .sd-question__erbox--outside-question {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
+.sd-element--complex > .sd-element__header:after {
+  content: " ";
+  display: block;
+  position: relative;
+  height: 1px;
+  background: var(--sjs-border-light, var(--border-light, #eaeaea));
+  bottom: 0;
+}
+
+.sd-element--complex.sd-element--with-frame > .sd-element__header {
+  padding-top: var(--sd-base-vertical-padding);
+  padding-bottom: var(--sd-base-vertical-padding);
+}
+
+.sd-element--collapsed.sd-element--complex > .sd-element__header {
+  padding-top: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  padding-bottom: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+}
+
+.sd-element--nested.sd-element--complex > .sd-element__header--location-top:after {
+  bottom: calc(-0.5 * var(--sd-base-vertical-padding));
+}
+
+.sd-element--nested-with-borders {
+  border: 1px solid var(--sjs-border-light, var(--border-light, #eaeaea));
+  border-radius: calc(var(--sjs-corner-radius, 4px) - 4px);
+  box-sizing: border-box;
+  padding-left: var(--sd-base-padding);
+  padding-right: var(--sd-base-padding);
+}
+.sd-element--nested-with-borders > .sd-element__header--location-top {
+  padding-top: calc(0.5 * var(--sd-base-vertical-padding));
+  padding-bottom: calc(0.5 * var(--sd-base-vertical-padding));
+}
+.sd-element--nested-with-borders > .sd-question__erbox--outside-question {
+  margin-left: calc(-1 * var(--sd-base-padding));
+  margin-right: calc(-1 * var(--sd-base-padding));
+  width: calc(100% + 2 * var(--sd-base-padding));
+}
+.sd-element--nested-with-borders > .sd-question__erbox--below-question {
+  bottom: 0;
+  margin-top: 0;
+}
+.sd-element--nested-with-borders.sd-element--collapsed > .sd-element__header--location-top:hover, .sd-element--nested-with-borders.sd-element--collapsed > .sd-element__header--location-top:focus-within {
+  box-shadow: none;
+}
+
+.sd-element--nested-with-borders > .sd-element__header--location-top:after,
+.sd-element--complex.sd-element--with-frame > .sd-element__header--location-top:after {
+  bottom: calc(-1 * var(--sd-base-vertical-padding));
+  left: calc(-1 * var(--sd-base-padding));
+  width: calc(100% + 2 * var(--sd-base-padding));
+}
+
+.sd-element--collapsed.sd-element--complex > .sd-element__header--location-top:after {
+  display: none;
+}
+
+.sd-question--empty.sd-question--complex > .sd-question__content {
+  padding-top: 0;
+  padding-bottom: 0;
+}
+.sd-question--empty.sd-question--complex > .sd-question__content:first-child {
+  padding-top: var(--sd-base-padding);
+}
+.sd-question--empty.sd-question--complex > .sd-question__header--location-top {
+  padding-bottom: calc(0.5 * var(--sd-base-vertical-padding));
+}
+.sd-question--empty.sd-question--complex > .sd-question__header--location-top:after {
+  display: none;
+}
+
 .sd-input {
   -webkit-appearance: none;
   -moz-appearance: none;
@@ -2220,7 +2255,7 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
 
 .sd-panel.sd-panel--as-page > .sd-panel__header.sd-panel__header {
   padding-top: 0;
-  padding-bottom: 0;
+  padding-bottom: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
 .sd-panel.sd-panel--as-page > .sd-panel__header.sd-panel__header:after {
   content: none;
@@ -2233,7 +2268,7 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
   color: var(--sjs-font-pagetitle-color, var(--sjs-general-dim-forecolor, rgba(0, 0, 0, 0.91)));
   position: static;
   line-height: calc(1.33 * (var(--page-title-font-size)));
-  margin: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) 0px;
+  margin: 0 0 calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) 0px;
 }
 .sd-panel.sd-panel--as-page > .sd-panel__header.sd-panel__header .sd-panel__title span {
   font-family: inherit;
@@ -2251,15 +2286,12 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
   line-height: calc(1.5 * (var(--sjs-font-pagedescription-size, var(--sjs-font-size, 16px))));
   margin: 0 0 calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) 0;
 }
-.sd-panel.sd-panel--as-page .sd-panel__header + .sd-panel__content {
-  margin-top: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-}
 .sd-panel.sd-panel--as-page > .sd-panel__content {
   padding-top: 0;
 }
 
 .sd-row ~ .sd-row .sd-panel--as-page {
-  padding-top: calc(5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  padding-top: calc(4 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
 
 .sd-panel__required-text {
@@ -2281,6 +2313,10 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
   padding-top: var(--sd-base-padding);
 }
 
+.sd-panel.sd-element--nested > .sd-panel__content {
+  padding-bottom: var(--sd-base-padding);
+}
+
 .sjs_sp_placeholder {
   color: var(--sjs-font-questiondescription-color, var(--sjs-general-forecolor-light, rgba(0, 0, 0, 0.45)));
   font-size: var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px));
@@ -2441,28 +2477,37 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
   padding-top: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
 
-.sd-panel__content .sd-table--no-header {
+.sd-panel:not(.sd-panel--as-page) > .sd-panel__content .sd-table--no-header {
   padding-top: 0;
 }
-.sd-panel__content .sd-question--table .sd-question__content {
-  padding-top: calc(0 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+.sd-panel:not(.sd-panel--as-page) > .sd-panel__content .sd-question--table .sd-question__content {
+  padding-bottom: calc(0.25 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  margin-bottom: calc(-0.25 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  padding-top: var(--sjs-base-unit, var(--base-unit, 8px));
+  margin-top: calc(-1 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
-.sd-panel__content .sd-question--table > .sd-question__header + .sd-question__content {
+.sd-panel:not(.sd-panel--as-page) > .sd-panel__content .sd-question--table > .sd-question__header + .sd-question__content {
   padding-top: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
-.sd-panel__content .sd-question--table > .sd-question__header + .sd-question__content .sd-table--no-header {
+.sd-panel:not(.sd-panel--as-page) > .sd-panel__content .sd-question--table > .sd-question__header + .sd-question__content .sd-table--no-header {
   padding-top: calc(4 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
-.sd-panel__content .sd-question--table > .sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) {
+.sd-panel:not(.sd-panel--as-page) > .sd-panel__content .sd-question--table > .sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) {
   margin-top: calc(-3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
-.sd-panel__content > .sd-row:not(:first-of-type) .sd-question--table > .sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) {
+.sd-panel:not(.sd-panel--as-page) > .sd-panel__content .sd-question--table.sd-question--error-top > .sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) {
+  margin-top: 0;
+}
+.sd-panel:not(.sd-panel--as-page) > .sd-panel__content > .sd-row:not(:first-of-type) .sd-question--table > .sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) {
   margin-top: calc(-2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
-.sd-panel__content .sd-question--table > .sd-question__header + .sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) {
+.sd-panel:not(.sd-panel--as-page) > .sd-panel__content > .sd-row:not(:first-of-type) .sd-question--table.sd-question--error-top > .sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) {
+  margin-top: calc(0 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+}
+.sd-panel:not(.sd-panel--as-page) > .sd-panel__content .sd-question--table > .sd-question__header + .sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) {
   margin-top: var(--sjs-base-unit, var(--base-unit, 8px));
 }
-.sd-panel__content > .sd-row:not(:first-of-type) .sd-question--table > .sd-question__header + .sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) {
+.sd-panel:not(.sd-panel--as-page) > .sd-panel__content > .sd-row:not(:first-of-type) .sd-question--table > .sd-question__header + .sd-question__content .sd-table-wrapper .sd-table:not(.sd-table--no-header) {
   margin-top: var(--sjs-base-unit, var(--base-unit, 8px));
 }
 
@@ -2556,6 +2601,7 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
 .sd-table__cell--header span {
   font-size: var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px));
   line-height: calc(1.5 * (var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px))));
+  font-weight: var(--sjs-font-questiontitle-weight, 600);
 }
 
 .sd-table__cell--header {
@@ -2617,7 +2663,7 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
   display: block;
   width: var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px));
   height: var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px));
-  fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
+  fill: var(--sjs-font-questiondescription-color, var(--sjs-general-forecolor-light, rgba(0, 0, 0, 0.45)));
 }
 .sd-table__cell--detail-button:hover {
   background: var(--sjs-primary-backcolor-light, var(--primary-light, rgba(25, 179, 148, 0.1)));
@@ -2634,7 +2680,7 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
 }
 
 .sd-table__cell--row-text {
-  font-weight: 600;
+  font-weight: var(--sjs-font-questiontitle-weight, 600);
   color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
   text-align: left;
   min-width: calc(12 * (var(--sjs-base-unit, var(--base-unit, 8px))));
@@ -2648,9 +2694,6 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
 .sd-table__question-wrapper:not(:focus-within):hover {
   position: relative;
 }
-.sd-table__question-wrapper:not(:focus-within):hover .sd-question__erbox--tooltip {
-  display: inline-block;
-}
 
 .sd-table__cell--actions:not(.sd-table__cell--vertical),
 .sd-table__cell--empty,
@@ -2726,19 +2769,10 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
   padding-top: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   min-width: min-content;
 }
-.sd-question--table.sd-element--nested > .sd-question__erbox--above-question {
-  margin-bottom: var(--sd-base-vertical-padding);
-}
 .sd-question--table.sd-element--nested > .sd-question__content {
   min-width: auto;
   overflow-x: auto;
 }
-.sd-question--table.sd-element--nested > .sd-question__content {
-  padding-bottom: calc(0.25 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-  margin-bottom: calc(-0.25 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-  padding-top: var(--sjs-base-unit, var(--base-unit, 8px));
-  margin-top: calc(-1 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-}
 .sd-question--table.sd-element--nested > .sd-question__content, .sd-question--table:not(.sd-element--with-frame):not(.sd-element--nested) {
   padding-right: var(--sd-base-padding);
   margin-right: calc(-1 * var(--sd-base-padding));
@@ -2759,6 +2793,10 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
   margin: auto;
 }
 
+.sd-root-modern--mobile .sd-table__question-wrapper .sd-boolean-root {
+  margin: initial;
+}
+
 .sd-table.sd-matrixdynamic {
   table-layout: auto;
 }
@@ -2785,8 +2823,7 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
   color: var(--sjs-font-pagetitle-color, var(--sjs-general-dim-forecolor, rgba(0, 0, 0, 0.91)));
   position: static;
   line-height: calc(1.33 * (var(--page-title-font-size)));
-  margin: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) 0px;
-  margin-top: 0;
+  margin: 0 0 calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px)))) 0px;
 }
 
 .sd-page .sd-page__description {
@@ -2978,11 +3015,11 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
 }
 
 .sd-description.sd-question__description--under-input {
-  padding-top: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  padding-top: calc(0.375 * var(--sd-base-vertical-padding));
 }
 
 .sd-element__header .sd-description {
-  margin-top: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  margin-top: calc(0.25 * var(--sd-base-vertical-padding) - 0.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
 }
 
 .sd-item {
@@ -3029,7 +3066,7 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
   font-weight: var(--sjs-font-editorfont-weight, 400);
   line-height: calc(1.5 * (var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px))));
   font-size: var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px));
-  color: var(--sjs-font-editorfont-color, var(--sjs-general-forecolor, rgba(0, 0, 0, 0.91)));
+  color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
   white-space: normal;
   word-break: break-word;
   width: 100%;
@@ -3037,12 +3074,12 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
 }
 
 .sd-item--disabled .sd-item__control-label {
-  color: var(--sjs-general-forecolor, var(--foreground, #161616));
+  color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
   opacity: 0.25;
 }
 
 .sd-root--readonly .sd-item--disabled .sd-item__control-label {
-  color: var(--sjs-general-forecolor, var(--foreground, #161616));
+  color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
 }
 
 .sd-item--error .sd-item__decorator {
@@ -3177,7 +3214,7 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
 }
 
 .sd-matrix__cell:first-of-type {
-  font-weight: 600;
+  font-weight: var(--sjs-font-questiontitle-weight, 600);
   text-align: left;
 }
 
@@ -3470,7 +3507,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 .sd-rating__item-text.sd-rating__item-text {
   font-family: var(--sjs-font-editorfont-family, var(--font-family));
   font-weight: var(--sjs-font-editorfont-weight, 400);
-  color: var(--sjs-font-editorfont-color, var(--sjs-general-forecolor, rgba(0, 0, 0, 0.91)));
+  color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
   font-size: var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px));
   line-height: calc(1.5 * (var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px))));
   display: inline-block;
@@ -3479,7 +3516,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   margin-top: calc(1.25 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   margin-bottom: calc(1.25 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   border: 2px solid transparent;
-  color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
+  color: var(--sjs-font-questiondescription-color, var(--sjs-general-forecolor-light, rgba(0, 0, 0, 0.45)));
 }
 .sd-rating__item-text.sd-rating__item-text.sd-rating__min-text {
   margin-right: var(--sjs-base-unit, var(--base-unit, 8px));
@@ -3556,7 +3593,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 }
 
 .sv-dropdown_select-wrapper use {
-  fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
+  fill: var(--sjs-font-editorfont-placeholdercolor, var(--sjs-general-forecolor-light, var(--foreground-light, #909090)));
 }
 
 .sd-dropdown {
@@ -3700,7 +3737,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   text-overflow: ellipsis;
 }
 
-.sv-popup.sv-popup--dropdown.sv-popup--dropdown .sd-list__item-body {
+.sv-dropdown-popup .sd-list__item-body {
   line-height: calc(1.5 * (var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px))));
   font-size: var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px));
 }
@@ -3930,7 +3967,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   font-size: var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px));
   line-height: calc(1.5 * (var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px))));
   margin-top: var(--sjs-base-unit, var(--base-unit, 8px));
-  color: var(--sjs-general-forecolor, var(--foreground, #161616));
+  color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
 }
 
 .sd-imagepicker__no-image {
@@ -3992,9 +4029,22 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   white-space: initial;
 }
 
+.sd-html {
+  color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
+  font-size: var(--sjs-article-font-default-fontSize, var(--sjs-font-size, 16px));
+  text-decoration: var(--sjs-article-font-default-textDecoration, "none");
+  font-family: var(--font-family);
+  font-weight: var(--sjs-article-font-default-fontWeight, 400);
+  font-style: var(--sjs-article-font-default-fontStyle, "normal");
+  font-stretch: var(--sjs-article-font-default-fontStretch, "normal");
+  letter-spacing: var(--sjs-article-font-default-letterSpacing, 0);
+  line-height: var(--sjs-article-font-default-lineHeight, 28px);
+  text-indent: var(--sjs-article-font-default-paragraphIndent, 0px);
+  text-transform: var(--sjs-article-font-default-textCase, "none");
+}
 .sd-html h1 {
   color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
-  font-size: var(--sjs-article-font-xx-large-fontSize, 64px);
+  font-size: var(--sjs-article-font-xx-large-fontSize, calc(4 * (var(--sjs-font-size, 16px))));
   text-decoration: var(--sjs-article-font-xx-large-textDecoration, "none");
   font-family: var(--font-family);
   font-weight: var(--sjs-article-font-xx-large-fontWeight, 700);
@@ -4007,7 +4057,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 }
 .sd-html h2 {
   color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
-  font-size: var(--sjs-article-font-x-large-fontSize, 48px);
+  font-size: var(--sjs-article-font-x-large-fontSize, calc(3 * (var(--sjs-font-size, 16px))));
   text-decoration: var(--sjs-article-font-x-large-textDecoration, "none");
   font-family: var(--font-family);
   font-weight: var(--sjs-article-font-x-large-fontWeight, 700);
@@ -4020,7 +4070,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 }
 .sd-html h3 {
   color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
-  font-size: var(--sjs-article-font-large-fontSize, 32px);
+  font-size: var(--sjs-article-font-large-fontSize, calc(2 * (var(--sjs-font-size, 16px))));
   text-decoration: var(--sjs-article-font-large-textDecoration, "none");
   font-family: var(--font-family);
   font-weight: var(--sjs-article-font-large-fontWeight, 700);
@@ -4035,7 +4085,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 .sd-html h5,
 .sd-html h6 {
   color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
-  font-size: var(--sjs-article-font-medium-fontSize, 24px);
+  font-size: var(--sjs-article-font-medium-fontSize, calc(1.5 * (var(--sjs-font-size, 16px))));
   text-decoration: var(--sjs-article-font-medium-textDecoration, "none");
   font-family: var(--font-family);
   font-weight: var(--sjs-article-font-medium-fontWeight, 700);
@@ -4051,7 +4101,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 .sd-html div,
 .sd-html p {
   color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
-  font-size: var(--sjs-article-font-default-fontSize, 16px);
+  font-size: var(--sjs-article-font-default-fontSize, var(--sjs-font-size, 16px));
   text-decoration: var(--sjs-article-font-default-textDecoration, "none");
   font-family: var(--font-family);
   font-weight: var(--sjs-article-font-default-fontWeight, 400);
@@ -4099,10 +4149,15 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 }
 
 .sd-expression {
-  color: var(--sjs-general-forecolor, var(--foreground, #161616));
+  color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
   font-size: var(--sjs-font-size, 16px);
 }
 
+.sd-question__content--left .sd-expression {
+  line-height: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  margin-top: calc(1.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+}
+
 .sd-progress {
   height: 2px;
   background-color: var(--sjs-border-light, var(--border-light, #eaeaea));
@@ -4167,7 +4222,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   font-family: var(--sjs-font-editorfont-family, var(--font-family));
   font-weight: var(--sjs-font-editorfont-weight, 400);
   font-size: var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px));
-  color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
+  color: var(--sjs-font-editorfont-placeholdercolor, var(--sjs-general-forecolor-light, var(--foreground-light, #909090)));
   line-height: calc(1.5 * (var(--sjs-font-editorfont-size, var(--sjs-font-size, 16px))));
   padding: var(--sjs-base-unit, var(--base-unit, 8px)) calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
@@ -4332,7 +4387,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 .sd-paneldynamic__progress-text {
   font-size: var(--sjs-font-questiontitle-size, var(--sjs-font-size, 16px));
   line-height: calc(1.5 * (var(--sjs-font-questiontitle-size, var(--sjs-font-size, 16px))));
-  color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
+  color: var(--sjs-font-questiondescription-color, var(--sjs-general-forecolor-light, rgba(0, 0, 0, 0.45)));
   margin: 0;
   margin-right: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
@@ -4485,6 +4540,10 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   bottom: 0;
 }
 
+.sd-question--paneldynamic.sd-element--with-frame {
+  padding-bottom: 0;
+}
+
 .sd-file {
   position: relative;
   font-size: var(--sjs-font-size, 16px);
@@ -4648,7 +4707,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 .sd-file__sign a {
   display: block;
   text-decoration: none;
-  color: var(--sjs-general-forecolor, var(--foreground, #161616));
+  color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
   white-space: normal;
   word-break: break-all;
   width: calc(12 * (var(--sjs-base-unit, var(--base-unit, 8px))));
@@ -4933,9 +4992,6 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 .sd-body.sd-body--responsive .sd-page {
   padding: 0;
 }
-.sd-body.sd-body--responsive .sd-page.sd-page__empty-header {
-  padding-top: calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-}
 .sd-body.sd-body--responsive .sd-body__timer,
 .sd-body.sd-body--responsive .sd-body__navigation {
   padding: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px)))) 0;
@@ -4984,7 +5040,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 .sd-body--empty h1,
 .sd-body--loading h1 {
   color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
-  font-size: var(--sjs-article-font-xx-large-fontSize, 64px);
+  font-size: var(--sjs-article-font-xx-large-fontSize, calc(4 * (var(--sjs-font-size, 16px))));
   text-decoration: var(--sjs-article-font-xx-large-textDecoration, "none");
   font-family: var(--font-family);
   font-weight: var(--sjs-article-font-xx-large-fontWeight, 700);
@@ -4998,7 +5054,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 .sd-body--empty h2,
 .sd-body--loading h2 {
   color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
-  font-size: var(--sjs-article-font-x-large-fontSize, 48px);
+  font-size: var(--sjs-article-font-x-large-fontSize, calc(3 * (var(--sjs-font-size, 16px))));
   text-decoration: var(--sjs-article-font-x-large-textDecoration, "none");
   font-family: var(--font-family);
   font-weight: var(--sjs-article-font-x-large-fontWeight, 700);
@@ -5012,7 +5068,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 .sd-body--empty h3,
 .sd-body--loading h3 {
   color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
-  font-size: var(--sjs-article-font-large-fontSize, 32px);
+  font-size: var(--sjs-article-font-large-fontSize, calc(2 * (var(--sjs-font-size, 16px))));
   text-decoration: var(--sjs-article-font-large-textDecoration, "none");
   font-family: var(--font-family);
   font-weight: var(--sjs-article-font-large-fontWeight, 700);
@@ -5030,7 +5086,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 .sd-body--loading h5,
 .sd-body--loading h6 {
   color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
-  font-size: var(--sjs-article-font-medium-fontSize, 24px);
+  font-size: var(--sjs-article-font-medium-fontSize, calc(1.5 * (var(--sjs-font-size, 16px))));
   text-decoration: var(--sjs-article-font-medium-textDecoration, "none");
   font-family: var(--font-family);
   font-weight: var(--sjs-article-font-medium-fontWeight, 700);
@@ -5050,7 +5106,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 .sd-body--loading div,
 .sd-body--loading p {
   color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
-  font-size: var(--sjs-article-font-default-fontSize, 16px);
+  font-size: var(--sjs-article-font-default-fontSize, var(--sjs-font-size, 16px));
   text-decoration: var(--sjs-article-font-default-textDecoration, "none");
   font-family: var(--font-family);
   font-weight: var(--sjs-article-font-default-fontWeight, 400);
@@ -5167,7 +5223,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   border-right: 1px solid var(--sjs-border-default, var(--border, #d6d6d6));
   word-break: break-word;
   white-space: normal;
-  color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
+  color: var(--sjs-font-editorfont-placeholdercolor, var(--sjs-general-forecolor-light, var(--foreground-light, #909090)));
 }
 
 .sd-multipletext__item {
@@ -5185,10 +5241,6 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   background-color: transparent;
 }
 
-.sd-multipletext__item-container:hover:not(:focus-within) > .sd-question__erbox--tooltip {
-  display: inline-block;
-}
-
 .sd-multipletext__cell {
   padding-left: 0;
   padding-right: 0;
@@ -5218,6 +5270,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   appearance: none;
   border: none;
   display: flex;
+  align-items: center;
   gap: var(--sjs-base-unit, var(--base-unit, 8px));
   background: transparent;
   padding: var(--sjs-base-unit, var(--base-unit, 8px)) calc(3 * (var(--sjs-base-unit, var(--base-unit, 8px))));
@@ -5250,11 +5303,11 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   margin-left: 0;
 }
 .sd-action--icon use {
-  fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
+  fill: var(--sjs-font-questiondescription-color, var(--sjs-general-forecolor-light, rgba(0, 0, 0, 0.45)));
 }
 
 svg.sd-action--icon {
-  fill: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
+  fill: var(--sjs-font-questiondescription-color, var(--sjs-general-forecolor-light, rgba(0, 0, 0, 0.45)));
 }
 
 .sd-action:disabled,
@@ -5280,6 +5333,10 @@ svg.sd-action--icon {
 .sd-action:not(.sd-action--pressed):focus.sd-action--negative {
   background-color: var(--sjs-special-red-light, var(--red-light, rgba(230, 10, 62, 0.1)));
 }
+.sd-action:not(.sd-action--pressed):hover.sd-action--negative.sd-action--icon use,
+.sd-action:not(.sd-action--pressed):focus.sd-action--negative.sd-action--icon use {
+  fill: var(--sjs-special-red, var(--red, #e60a3e));
+}
 .sd-action:not(.sd-action--pressed):hover:active,
 .sd-action:not(.sd-action--pressed):focus:active {
   opacity: 0.5;
@@ -5348,7 +5405,7 @@ svg.sd-action--icon {
 .sd-completedpage h1,
 .sd-completed-before-page h1 {
   color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
-  font-size: var(--sjs-article-font-xx-large-fontSize, 64px);
+  font-size: var(--sjs-article-font-xx-large-fontSize, calc(4 * (var(--sjs-font-size, 16px))));
   text-decoration: var(--sjs-article-font-xx-large-textDecoration, "none");
   font-family: var(--font-family);
   font-weight: var(--sjs-article-font-xx-large-fontWeight, 700);
@@ -5362,7 +5419,7 @@ svg.sd-action--icon {
 .sd-completedpage h2,
 .sd-completed-before-page h2 {
   color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
-  font-size: var(--sjs-article-font-x-large-fontSize, 48px);
+  font-size: var(--sjs-article-font-x-large-fontSize, calc(3 * (var(--sjs-font-size, 16px))));
   text-decoration: var(--sjs-article-font-x-large-textDecoration, "none");
   font-family: var(--font-family);
   font-weight: var(--sjs-article-font-x-large-fontWeight, 700);
@@ -5376,7 +5433,7 @@ svg.sd-action--icon {
 .sd-completedpage h3,
 .sd-completed-before-page h3 {
   color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
-  font-size: var(--sjs-article-font-large-fontSize, 32px);
+  font-size: var(--sjs-article-font-large-fontSize, calc(2 * (var(--sjs-font-size, 16px))));
   text-decoration: var(--sjs-article-font-large-textDecoration, "none");
   font-family: var(--font-family);
   font-weight: var(--sjs-article-font-large-fontWeight, 700);
@@ -5394,7 +5451,7 @@ svg.sd-action--icon {
 .sd-completed-before-page h5,
 .sd-completed-before-page h6 {
   color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
-  font-size: var(--sjs-article-font-medium-fontSize, 24px);
+  font-size: var(--sjs-article-font-medium-fontSize, calc(1.5 * (var(--sjs-font-size, 16px))));
   text-decoration: var(--sjs-article-font-medium-textDecoration, "none");
   font-family: var(--font-family);
   font-weight: var(--sjs-article-font-medium-fontWeight, 700);
@@ -5414,7 +5471,7 @@ svg.sd-action--icon {
 .sd-completed-before-page div,
 .sd-completed-before-page p {
   color: var(--sjs-font-questiontitle-color, var(--sjs-general-forecolor, var(--foreground, #161616)));
-  font-size: var(--sjs-article-font-default-fontSize, 16px);
+  font-size: var(--sjs-article-font-default-fontSize, var(--sjs-font-size, 16px));
   text-decoration: var(--sjs-article-font-default-textDecoration, "none");
   font-family: var(--font-family);
   font-weight: var(--sjs-article-font-default-fontWeight, 400);
@@ -5599,10 +5656,11 @@ svg.sd-action--icon {
   padding-left: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
 
-.sd-list__item.sd-list__item {
+.sd-list__item {
   padding: 0;
 }
-.sd-list__item.sd-list__item .sd-list__item-body {
+
+.sd-list__item-body {
   padding-block: calc(1.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   border-radius: var(--sjs-corner-radius, 4px);
   font-size: var(--sjs-font-size, 16px);
@@ -5688,26 +5746,27 @@ svg.sd-action--icon {
 }
 
 .sv-cover {
-  padding: calc(5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-  box-sizing: border-box;
   position: relative;
   background-color: var(--sjs-cover-backcolor);
 }
 
 .sv-conver__overlap {
-  margin-bottom: calc(-13 * (var(--sjs-base-unit, var(--base-unit, 8px))));
-  padding-bottom: calc(13 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  margin-bottom: calc(-14 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  padding-bottom: calc(8 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
 
 .sv-conver__overlap.sv-conver__without-background {
   margin-bottom: 0;
+  padding-bottom: 0;
 }
 
-.sv-conver__without-background {
+.sv-conver__without-background .sv-conver__content {
   padding-bottom: 0;
 }
 
 .sv-conver__content {
+  padding: calc(5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  box-sizing: border-box;
   height: 100%;
   position: relative;
   display: grid;
@@ -5717,7 +5776,7 @@ svg.sd-action--icon {
 }
 
 .sv-conver__content--static {
-  max-width: calc(80 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  max-width: calc(88 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   margin-left: auto;
   margin-right: auto;
 }
@@ -5748,7 +5807,6 @@ svg.sd-action--icon {
   width: max-content;
   top: 0;
   bottom: 0;
-  gap: var(--sjs-base-unit, var(--base-unit, 8px));
 }
 
 .sv-cover__cell--left .sv-cover__cell-content {
@@ -5765,7 +5823,6 @@ svg.sd-action--icon {
 
 .sv-cover__logo {
   display: flex;
-  margin-bottom: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
 
 .sv-cover__title {
@@ -5782,6 +5839,18 @@ svg.sd-action--icon {
   font-weight: var(--sjs-font-surveytitle-weight, 700);
 }
 
+.sv-cover__logo ~ .sv-cover__title {
+  margin-top: calc(4 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+}
+
+.sv-cover__logo ~ .sv-cover__description {
+  margin-top: calc(4 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+}
+
+.sv-cover__title ~ .sv-cover__description {
+  margin-top: var(--sjs-base-unit, var(--base-unit, 8px));
+}
+
 .sv-cover__description {
   display: flex;
 }
@@ -5919,6 +5988,8 @@ sv-components-container,
 .sd-root-modern.sd-root-modern--mobile .sd-table__cell.sd-matrix__cell {
   display: flex;
   align-items: flex-start;
+  border-top: none;
+  border-bottom: none;
 }
 .sd-root-modern.sd-root-modern--mobile .sd-table__cell.sd-matrix__cell .sd-matrix__responsive-title {
   margin-left: var(--sjs-base-unit, var(--base-unit, 8px));
@@ -5934,8 +6005,8 @@ sv-components-container,
 .sd-root-modern.sd-root-modern--mobile .sd-table tr {
   display: block;
 }
-.sd-root-modern.sd-root-modern--mobile .sd-matrix__table tr + tr {
-  margin-top: var(--sjs-base-unit, var(--base-unit, 8px));
+.sd-root-modern.sd-root-modern--mobile .sd-matrix__table .sd-table__row {
+  padding-top: var(--sjs-base-unit, var(--base-unit, 8px));
 }
 .sd-root-modern.sd-root-modern--mobile .sd-table:not(.sd-matrix__table) tr {
   padding-bottom: var(--sjs-base-unit, var(--base-unit, 8px));
@@ -6201,25 +6272,4 @@ body {
   background-color: var(--sjs-general-forecolor-light, var(--foreground-light, #909090));
 }
 
-.sv-popup.sv-popup--dropdown.sv-popup--dropdown .sv-popup__shadow {
-  box-shadow: var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1));
-}
-.sv-popup.sv-popup--dropdown.sv-popup--dropdown .sv-popup__body-content {
-  background-color: var(--sjs-general-backcolor, var(--background, #fff));
-  padding: var(--sjs-base-unit, var(--base-unit, 8px)) 0;
-  height: 100%;
-}
-
-.sv-popup.sv-popup--modal .sv-popup__body-content {
-  box-shadow: var(--sjs-shadow-large, 0px 8px 16px 0px rgba(0, 0, 0, 0.1));
-  background-color: var(--sjs-general-backcolor-dim-light, var(--background-dim-light, #f9f9f9));
-}
-.sv-popup.sv-popup--modal .sv-popup__body-footer {
-  padding-bottom: 2px;
-}
-
-.sv-popup.sv-popup--overlay .sv-popup__body-content {
-  background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
-}
-
 /*# sourceMappingURL=defaultV2.css.map*/