
.fk-cover-file {
  display: none;
}
.fk-thumbnail-upload {
  display: contents;
}

.fk-dialog-preparing {
  visibility: hidden;
  pointer-events: none;
}
.fk-dialog-preparing > [role="dialog"] {
  animation: none !important;
}
.fk-dialog-reveal > [role="dialog"] {
  animation: fk-dialog-scale-in 0.3s cubic-bezier(0.18, 0.89, 0.32, 1.15);
}
.fk-dialog-enter-active {
  transition: opacity 0.2s ease-out;
}
.fk-dialog-enter-active > [role="dialog"],
[role="dialog"].fk-dialog-enter-active {
  transform-origin: center;
  animation: fk-dialog-scale-in 0.3s cubic-bezier(0.18, 0.89, 0.32, 1.15);
}
.fk-dialog-leave-active {
  transition: opacity 0.2s ease-in;
}
.fk-dialog-leave-active > [role="dialog"] {
  transition: transform 0.2s ease-in;
}
.fk-dialog-enter-from,
.fk-dialog-leave-to {
  opacity: 0;
}
.fk-dialog-enter-from > [role="dialog"],
.fk-dialog-leave-to > [role="dialog"],
[role="dialog"].fk-dialog-enter-from,
[role="dialog"].fk-dialog-leave-to {
  transform: scale(0.5);
}
@keyframes fk-dialog-scale-in {
from {
    transform: scale(0.5);
}
to {
    transform: scale(1);
}
}
@media (max-width: 760px) {
  .search-select-mobile-backdrop.modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 2100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: #0006;
  }
  .search-select-mobile-dialog.modal-panel {
    width: 100%;
    max-height: min(70dvh, 560px);
    display: flex;
    flex-direction: column;
    margin: 0;
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
  }
  .search-select-mobile-dialog .modal-header {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    border-bottom: 1px solid #edf0f5;
  }
  .search-select-mobile-dialog .modal-header h2 {
    margin: 0;
    font-size: 16px;
  }
  .search-select-mobile-dialog .modal-body {
    overflow: hidden;
    padding: 12px 16px max(16px, env(safe-area-inset-bottom));
    min-height: 0;
    display: flex;
  }
  .search-select-mobile-content {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    min-height: 0;
  }
  .search-select-mobile-content > .fk-input {
    flex: none;
    width: 100%;
    height: 36px;
    font-size: 16px;
  }
  .search-select-mobile-options.search-select-options {
    position: static;
    box-shadow: none;
    border: 0;
    padding: 0;
    max-height: 42dvh;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .search-select-mobile-options > .fk-button {
    min-height: 44px;
    height: auto;
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.5;
    border-radius: 6px;
  }
  .search-select-mobile-options > .fk-button[aria-selected="true"] {
    background: #edf2ff;
  }
  .search-select-mobile-options
    > .fk-button.active:not([aria-selected="true"]) {
    background: transparent;
  }
}

/* Original payment certificate selector, shared without changing its appearance. */
.fk-file-picker {
  display: flex;
  flex: 1;
  min-width: 0;
  width: 100%;
}
.fk-file-picker > input[readonly] {
  min-width: 0;
  flex: 1;
  padding: 8px 10px;
  border: 1px solid #dcdfe6;
  background: white;
  color: #606266;
  outline: none;
  font: inherit;
}
.fk-file-picker-upload {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 8px 14px;
  border-radius: 0;
  font: inherit;
  background: #f5f7fa;
  border: 1px solid #dcdfe6;
  border-left: 0;
  color: #909399;
  cursor: pointer;
  white-space: nowrap;
}
@media (min-width: 761px) {
.fk-file-picker-upload:hover {
    color: #409eff;
}
}
.fk-file-picker-upload:focus-within {
  color: #409eff;
  outline: 1px solid #165dff;
  outline-offset: -1px;
}
.fk-file-picker > input[type="file"] {
  display: none;
}
.fk-file-picker.is-disabled {
  opacity: 0.5;
}
.fk-file-picker.is-disabled .fk-file-picker-upload,
.fk-file-picker.is-disabled input {
  cursor: not-allowed;
}
.date-range {
  width: 320px;
  height: 29px;
  max-width: 100%;
  background: #f2f3f5;
  border-radius: 2px;
  color: #4e5969;
}
.date-range.active {
  box-shadow: inset 0 0 0 1px #165dff;
}
.date-range > button {
  width: 100%;
  height: 100%;
  padding: 0 12px;
  display: flex;
  align-items: center;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  gap: 10px;
  cursor: pointer;
}
.date-range span:not(.separator) {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.placeholder,
.separator {
  color: #86909c;
}
.date-range svg {
  flex: none;
}
.range-picker {
  position: fixed;
  z-index: 2200;
  background: white;
  border: 1px solid #e5e6eb;
  border-radius: 3px;
  box-shadow: 0 2px 9px #0002;
  color: #4e5969;
  font-size: 14px;
  overflow: auto;
  outline: none;
  animation: range-show 0.15s ease-out;
}
@keyframes range-show {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.range-months {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.range-month header {
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #e5e6eb;
  padding: 0 12px;
}
.range-month header > div {
  display: flex;
  min-width: 52px;
}
.range-month button {
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
  padding: 0;
}
.range-month header button {
  width: 26px;
  height: 30px;
  color: #6b778c;
}
@media (min-width: 761px) {
  .range-month button:hover {
    background: #f2f3f5;
  }
}
.range-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  padding: 14px 16px;
}
.range-days > * {
  height: 36px;
  display: grid;
  place-items: center;
  position: relative;
}
.range-weekday {
  color: #86909c;
}
.range-days .outside {
  color: #c9cdd4;
}
.range-days .between {
  background: #e8f3ff;
}
@media (min-width: 761px) {
  .range-days .selected:hover {
    background: #165dff;
    color: white;
    border-radius: 2px;
  }
}
.range-days .selected {
  background: #165dff;
  color: white;
  border-radius: 2px;
}
.range-days .today:after {
  content: "";
  position: absolute;
  bottom: 3px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #165dff;
}
.range-days .selected:after {
  background: white;
}
.range-times {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-block: 1px solid #e5e6eb;
}
.range-times label {
  min-width: 0;
  border-right: 1px solid #e5e6eb;
  padding: 14px 5px;
}
.range-times input {
  width: 100%;
  min-width: 0;
  border: 0;
  padding: 0;
  background: white;
  color: #4e5969;
  font: inherit;
  font-size: 12px;
}
.range-picker footer {
  display: flex;
  justify-content: space-between;
  padding: 8px;
  align-items: center;
}
.range-picker footer .fk-button {
  height: 26px;
  min-height: 26px;
  padding: 2px 10px;
  font-size: 12px;
}
@media (max-width: 480px) {
  .range-months {
    grid-template-columns: 1fr;
  }
  .range-days {
    padding: 4px 16px;
  }
  .range-days > * {
    height: 28px;
  }
  .range-times {
    grid-template-columns: repeat(2, 1fr);
  }
}
:root,
:host {
  --w-e-textarea-bg-color: #fff;
  --w-e-textarea-color: #333;
  --w-e-textarea-border-color: #ccc;
  --w-e-textarea-slight-border-color: #e8e8e8;
  --w-e-textarea-slight-color: #d4d4d4;
  --w-e-textarea-slight-bg-color: #f5f2f0;
  --w-e-textarea-selected-border-color: #B4D5FF;
  --w-e-textarea-handler-bg-color: #4290f7;
  --w-e-toolbar-color: #595959;
  --w-e-toolbar-bg-color: #fff;
  --w-e-toolbar-active-color: #333;
  --w-e-toolbar-active-bg-color: #f1f1f1;
  --w-e-toolbar-disabled-color: #999;
  --w-e-toolbar-border-color: #e8e8e8;
  --w-e-modal-button-bg-color: #fafafa;
  --w-e-modal-button-border-color: #d9d9d9;
}

.w-e-text-container *,.w-e-toolbar *{box-sizing:border-box;margin:0;outline:none;padding:0}.w-e-text-container blockquote,.w-e-text-container li,.w-e-text-container p,.w-e-text-container td,.w-e-text-container th,.w-e-toolbar *{line-height:1.5}.w-e-text-container{background-color:var(--w-e-textarea-bg-color);color:var(--w-e-textarea-color);height:100%;position:relative}.w-e-text-container .w-e-scroll{-webkit-overflow-scrolling:touch;height:100%}.w-e-text-container [data-slate-editor]{word-wrap:break-word;border-top:1px solid transparent;min-height:100%;outline:0;padding:0 10px;white-space:pre-wrap}.w-e-text-container [data-slate-editor] p{margin:15px 0}.w-e-text-container [data-slate-editor] h1,.w-e-text-container [data-slate-editor] h2,.w-e-text-container [data-slate-editor] h3,.w-e-text-container [data-slate-editor] h4,.w-e-text-container [data-slate-editor] h5{margin:20px 0}.w-e-text-container [data-slate-editor] img{cursor:default;display:inline!important;max-width:100%;min-height:20px;min-width:20px}.w-e-text-container [data-slate-editor] span{text-indent:0}.w-e-text-container [data-slate-editor] [data-selected=true]{box-shadow:0 0 0 2px var(--w-e-textarea-selected-border-color)}.w-e-text-placeholder{font-style:italic;left:10px;top:17px;width:90%}.w-e-max-length-info,.w-e-text-placeholder{color:var(--w-e-textarea-slight-color);pointer-events:none;position:absolute;-webkit-user-select:none;-moz-user-select:none;user-select:none}.w-e-max-length-info{bottom:.5em;right:1em}.w-e-bar{background-color:var(--w-e-toolbar-bg-color);color:var(--w-e-toolbar-color);font-size:14px;padding:0 5px}.w-e-bar svg{fill:var(--w-e-toolbar-color);height:14px;width:14px}.w-e-bar-show{display:flex}.w-e-bar-hidden{display:none}.w-e-hover-bar{border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 5px #0000001f;position:absolute}.w-e-toolbar{flex-wrap:wrap;position:relative}.w-e-bar-divider{background-color:var(--w-e-toolbar-border-color);display:inline-flex;height:40px;margin:0 5px;width:1px}.w-e-bar-item{display:flex;height:40px;padding:4px;position:relative;text-align:center}.w-e-bar-item,.w-e-bar-item button{align-items:center;justify-content:center}.w-e-bar-item button{background:transparent;border:none;color:var(--w-e-toolbar-color);cursor:pointer;display:inline-flex;height:32px;overflow:hidden;padding:0 8px;white-space:nowrap}.w-e-bar-item button:hover{background-color:var(--w-e-toolbar-active-bg-color);color:var(--w-e-toolbar-active-color)}.w-e-bar-item button .title{margin-left:5px}.w-e-bar-item .active{background-color:var(--w-e-toolbar-active-bg-color);color:var(--w-e-toolbar-active-color)}.w-e-bar-item .disabled{color:var(--w-e-toolbar-disabled-color);cursor:not-allowed}.w-e-bar-item .disabled svg{fill:var(--w-e-toolbar-disabled-color)}.w-e-bar-item .disabled:hover{background-color:var(--w-e-toolbar-bg-color);color:var(--w-e-toolbar-disabled-color)}.w-e-bar-item .disabled:hover svg{fill:var(--w-e-toolbar-disabled-color)}.w-e-menu-tooltip-v5:before{background-color:var(--w-e-toolbar-active-color);border-radius:5px;color:var(--w-e-toolbar-bg-color);content:attr(data-tooltip);font-size:.75em;opacity:0;padding:5px 10px;position:absolute;text-align:center;top:40px;transition:opacity .6s;visibility:hidden;white-space:pre;z-index:1}.w-e-menu-tooltip-v5:after{border:5px solid transparent;border-bottom:5px solid var(--w-e-toolbar-active-color);content:"";opacity:0;position:absolute;top:30px;transition:opacity .6s;visibility:hidden}.w-e-menu-tooltip-v5:hover:after,.w-e-menu-tooltip-v5:hover:before{opacity:1;visibility:visible}.w-e-menu-tooltip-v5.tooltip-right:before{left:100%;top:10px}.w-e-menu-tooltip-v5.tooltip-right:after{border-bottom-color:transparent;border-left-color:transparent;border-right-color:var(--w-e-toolbar-active-color);border-top-color:transparent;left:100%;margin-left:-10px;top:16px}.w-e-bar-item-group .w-e-bar-item-menus-container{background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 10px #0000001f;display:none;left:0;margin-top:40px;position:absolute;top:0;z-index:1}.w-e-bar-item-group:hover .w-e-bar-item-menus-container{display:block}.w-e-select-list{background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 10px #0000001f;left:0;margin-top:40px;max-height:350px;min-width:100px;overflow-y:auto;position:absolute;top:0;z-index:1}.w-e-select-list ul{line-height:1;list-style:none}.w-e-select-list ul .selected{background-color:var(--w-e-toolbar-active-bg-color)}.w-e-select-list ul li{cursor:pointer;padding:7px 0 7px 25px;position:relative;text-align:left;white-space:nowrap}.w-e-select-list ul li:hover{background-color:var(--w-e-toolbar-active-bg-color)}.w-e-select-list ul li svg{left:0;margin-left:5px;margin-top:-7px;position:absolute;top:50%}.w-e-bar-bottom .w-e-select-list{bottom:0;margin-bottom:40px;margin-top:0;top:inherit}.w-e-drop-panel{background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 10px #0000001f;margin-top:40px;min-width:200px;padding:10px;position:absolute;top:0;z-index:1}.w-e-bar-bottom .w-e-drop-panel{bottom:0;margin-bottom:40px;margin-top:0;top:inherit}.w-e-modal{background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-toolbar-border-color);border-radius:3px;box-shadow:0 2px 10px #0000001f;color:var(--w-e-toolbar-color);font-size:14px;min-height:40px;min-width:100px;padding:20px 15px 0;position:absolute;text-align:left;z-index:1}.w-e-modal .btn-close{cursor:pointer;line-height:1;padding:5px;position:absolute;right:8px;top:7px}.w-e-modal .btn-close svg{fill:var(--w-e-toolbar-color);height:10px;width:10px}.w-e-modal .babel-container{display:block;margin-bottom:15px}.w-e-modal .babel-container span{display:block;margin-bottom:10px}.w-e-modal .button-container{margin-bottom:15px}.w-e-modal button{background-color:var(--w-e-modal-button-bg-color);border:1px solid var(--w-e-modal-button-border-color);border-radius:4px;color:var(--w-e-toolbar-color);cursor:pointer;font-weight:400;height:32px;padding:4.5px 15px;text-align:center;touch-action:manipulation;transition:all .3s cubic-bezier(.645,.045,.355,1);-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap}.w-e-modal input[type=number],.w-e-modal input[type=text],.w-e-modal textarea{font-feature-settings:"tnum";background-color:var(--w-e-toolbar-bg-color);border:1px solid var(--w-e-modal-button-border-color);border-radius:4px;color:var(--w-e-toolbar-color);font-variant:tabular-nums;padding:4.5px 11px;transition:all .3s;width:100%}.w-e-modal textarea{min-height:60px}body .w-e-modal,body .w-e-modal *{box-sizing:border-box}.w-e-progress-bar{background-color:var(--w-e-textarea-handler-bg-color);height:1px;position:absolute;transition:width .3s;width:0}.w-e-full-screen-container{bottom:0!important;display:flex!important;flex-direction:column!important;height:100%!important;left:0!important;margin:0!important;padding:0!important;position:fixed;right:0!important;top:0!important;width:100%!important}.w-e-full-screen-container [data-w-e-textarea=true]{flex:1!important}
.w-e-text-container [data-slate-editor] code{background-color:var(--w-e-textarea-slight-bg-color);border-radius:3px;font-family:monospace;padding:3px}.w-e-panel-content-color{list-style:none;text-align:left;width:230px}.w-e-panel-content-color li{border:1px solid var(--w-e-toolbar-bg-color);border-radius:3px 3px;cursor:pointer;display:inline-block;padding:2px}.w-e-panel-content-color li:hover{border-color:var(--w-e-toolbar-color)}.w-e-panel-content-color li .color-block{border:1px solid var(--w-e-toolbar-border-color);border-radius:3px 3px;height:17px;width:17px}.w-e-panel-content-color .active{border-color:var(--w-e-toolbar-color)}.w-e-panel-content-color .clear{line-height:1.5;margin-bottom:5px;width:100%}.w-e-panel-content-color .clear svg{height:16px;margin-bottom:-4px;width:16px}.w-e-text-container [data-slate-editor] blockquote{background-color:var(--w-e-textarea-slight-bg-color);border-left:8px solid var(--w-e-textarea-selected-border-color);display:block;font-size:100%;line-height:1.5;margin:10px 0;padding:10px}.w-e-panel-content-emotion{font-size:20px;list-style:none;text-align:left;width:300px}.w-e-panel-content-emotion li{border-radius:3px 3px;cursor:pointer;display:inline-block;padding:0 5px}.w-e-panel-content-emotion li:hover{background-color:var(--w-e-textarea-slight-bg-color)}.w-e-textarea-divider{border-radius:3px;margin:20px auto;padding:20px}.w-e-textarea-divider hr{background-color:var(--w-e-textarea-border-color);border:0;display:block;height:1px}.w-e-text-container [data-slate-editor] pre>code{background-color:var(--w-e-textarea-slight-bg-color);border:1px solid var(--w-e-textarea-slight-border-color);border-radius:4px 4px;display:block;font-size:14px;padding:10px;text-indent:0}.w-e-text-container [data-slate-editor] .w-e-image-container{display:inline-block;margin:0 3px}.w-e-text-container [data-slate-editor] .w-e-image-container:hover{box-shadow:0 0 0 2px var(--w-e-textarea-selected-border-color)}.w-e-text-container [data-slate-editor] .w-e-selected-image-container{overflow:hidden;position:relative}.w-e-text-container [data-slate-editor] .w-e-selected-image-container .w-e-image-dragger{background-color:var(--w-e-textarea-handler-bg-color);height:7px;position:absolute;width:7px}.w-e-text-container [data-slate-editor] .w-e-selected-image-container .left-top{cursor:nwse-resize;left:0;top:0}.w-e-text-container [data-slate-editor] .w-e-selected-image-container .right-top{cursor:nesw-resize;right:0;top:0}.w-e-text-container [data-slate-editor] .w-e-selected-image-container .left-bottom{bottom:0;cursor:nesw-resize;left:0}.w-e-text-container [data-slate-editor] .w-e-selected-image-container .right-bottom{bottom:0;cursor:nwse-resize;right:0}.w-e-text-container [data-slate-editor] .w-e-selected-image-container:hover{box-shadow:none}.w-e-text-container [contenteditable=false] .w-e-image-container:hover{box-shadow:none}

.w-e-text-container [data-slate-editor] .table-container{border:1px dashed var(--w-e-textarea-border-color);border-radius:5px;margin-top:10px;overflow-x:auto;padding:10px;width:100%}.w-e-text-container [data-slate-editor] table{border-collapse:collapse}.w-e-text-container [data-slate-editor] table td,.w-e-text-container [data-slate-editor] table th{border:1px solid var(--w-e-textarea-border-color);line-height:1.5;min-width:30px;padding:3px 5px;text-align:left}.w-e-text-container [data-slate-editor] table th{background-color:var(--w-e-textarea-slight-bg-color);font-weight:700;text-align:center}.w-e-panel-content-table{background-color:var(--w-e-toolbar-bg-color)}.w-e-panel-content-table table{border-collapse:collapse}.w-e-panel-content-table td{border:1px solid var(--w-e-toolbar-border-color);cursor:pointer;height:15px;padding:3px 5px;width:20px}.w-e-panel-content-table td.active{background-color:var(--w-e-toolbar-active-bg-color)}
.w-e-textarea-video-container{background-image:linear-gradient(45deg,#eee 25%,transparent 0,transparent 75%,#eee 0,#eee),linear-gradient(45deg,#eee 25%,#fff 0,#fff 75%,#eee 0,#eee);background-position:0 0,10px 10px;background-size:20px 20px;border:1px dashed var(--w-e-textarea-border-color);border-radius:5px;margin:10px auto 0;padding:10px 0;text-align:center}

.w-e-text-container [data-slate-editor] pre>code{word-wrap:normal;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;-webkit-hyphens:none;hyphens:none;line-height:1.5;margin:.5em 0;overflow:auto;padding:1em;-moz-tab-size:4;-o-tab-size:4;tab-size:4;text-align:left;text-shadow:0 1px #fff;white-space:pre;word-break:normal;word-spacing:normal}.w-e-text-container [data-slate-editor] pre>code .token.cdata,.w-e-text-container [data-slate-editor] pre>code .token.comment,.w-e-text-container [data-slate-editor] pre>code .token.doctype,.w-e-text-container [data-slate-editor] pre>code .token.prolog{color:#708090}.w-e-text-container [data-slate-editor] pre>code .token.punctuation{color:#999}.w-e-text-container [data-slate-editor] pre>code .token.namespace{opacity:.7}.w-e-text-container [data-slate-editor] pre>code .token.boolean,.w-e-text-container [data-slate-editor] pre>code .token.constant,.w-e-text-container [data-slate-editor] pre>code .token.deleted,.w-e-text-container [data-slate-editor] pre>code .token.number,.w-e-text-container [data-slate-editor] pre>code .token.property,.w-e-text-container [data-slate-editor] pre>code .token.symbol,.w-e-text-container [data-slate-editor] pre>code .token.tag{color:#905}.w-e-text-container [data-slate-editor] pre>code .token.attr-name,.w-e-text-container [data-slate-editor] pre>code .token.builtin,.w-e-text-container [data-slate-editor] pre>code .token.char,.w-e-text-container [data-slate-editor] pre>code .token.inserted,.w-e-text-container [data-slate-editor] pre>code .token.selector,.w-e-text-container [data-slate-editor] pre>code .token.string{color:#690}.w-e-text-container [data-slate-editor] pre>code .language-css .token.string,.w-e-text-container [data-slate-editor] pre>code .style .token.string,.w-e-text-container [data-slate-editor] pre>code .token.entity,.w-e-text-container [data-slate-editor] pre>code .token.operator,.w-e-text-container [data-slate-editor] pre>code .token.url{color:#9a6e3a}.w-e-text-container [data-slate-editor] pre>code .token.atrule,.w-e-text-container [data-slate-editor] pre>code .token.attr-value,.w-e-text-container [data-slate-editor] pre>code .token.keyword{color:#07a}.w-e-text-container [data-slate-editor] pre>code .token.class-name,.w-e-text-container [data-slate-editor] pre>code .token.function{color:#dd4a68}.w-e-text-container [data-slate-editor] pre>code .token.important,.w-e-text-container [data-slate-editor] pre>code .token.regex,.w-e-text-container [data-slate-editor] pre>code .token.variable{color:#e90}.w-e-text-container [data-slate-editor] pre>code .token.bold,.w-e-text-container [data-slate-editor] pre>code .token.important{font-weight:700}.w-e-text-container [data-slate-editor] pre>code .token.italic{font-style:italic}.w-e-text-container [data-slate-editor] pre>code .token.entity{cursor:help}
.confirmation-dialog .modal-footer {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  border-top: 1px solid #edf0f5;
}
.confirmation-dialog .modal-footer button {
  min-width: 68px;
  height: 32px;
  min-height: 32px;
  padding: 5px 16px;
  border-radius: 4px;
}
.confirmation-dialog .modal-body p {
  margin: 0;
  line-height: 1.8;
}
.blacklist-confirmation {
  border-radius: 8px;
}
.blacklist-confirmation .modal-header {
  justify-content: center;
  height: auto;
  min-height: 0;
  padding: 28px 32px 0;
  border: 0;
}
.blacklist-confirmation .modal-header h2 {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: var(--heading-dialog-size);
  font-weight: var(--heading-weight);
  color: #1d2129;
  line-height: 1.5;
}
.blacklist-confirmation .modal-header h2::before {
  content: "!";
  display: inline-grid;
  place-items: center;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #ff7d00;
  color: white;
  font-size: 12px;
  font-weight: 600;
}
.blacklist-confirmation .modal-header .fk-action-icon {
  display: none;
}
.blacklist-confirmation .modal-body {
  padding: 26px 32px 0;
  color: #1d2129;
  font-size: 14px;
}
.blacklist-confirmation .modal-body p {
  line-height: 22px;
}
.blacklist-confirmation .modal-footer {
  display: flex;
  justify-content: center;
  gap: 12px;
  padding: 32px;
  border: 0;
}
.blacklist-confirmation .modal-footer button {
  height: 32px;
  min-height: 32px;
  padding: 5px 16px;
  border: 0;
  border-radius: 2px;
}
.blacklist-confirmation .fk-action-secondary {
  background: #f2f3f5;
  color: #4e5969;
}
@media (min-width: 761px) {
.blacklist-confirmation .fk-action-secondary:hover {
    background: #e5e6eb;
}
}
.blacklist-confirmation .fk-action-primary {
  background: #f53f3f;
  color: white;
}
@media (min-width: 761px) {
.blacklist-confirmation .fk-action-primary:hover {
    background: #f76560;
}
}

.fk-switch.fk-switch-primary.on {
  background: var(--fk-primary);
}
@media (min-width: 761px) {
.fk-switch.fk-switch-primary.on:hover:not(:disabled) {
    background: var(--fk-primary-hover);
}
}
.fk-switch.fk-switch-primary.on:focus-visible {
  background: var(--fk-primary-hover);
}

.fk-animated-number[data-v-4d5500da] {
  font-variant-numeric: tabular-nums;
}

.complaint-chat[data-v-f9dd17a3] {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  position: relative;
  background: white;
}
.room-status[data-v-f9dd17a3] {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 8px 35px;
  border-bottom: 1px solid #f5f5f5;
  min-height: 36px;
  font-size: 12px;
  color: #4e5969;
  flex-shrink: 0;
}
.connection-state[data-v-f9dd17a3] {
  color: #86909c;
}
.connection-state.live[data-v-f9dd17a3] {
  color: #00b42a;
}
.connection-state.retrying[data-v-f9dd17a3],
.connection-state.expired[data-v-f9dd17a3] {
  color: #ff7d00;
}
.complaint-scroll[data-v-f9dd17a3] {
  min-height: 0;
  overflow-y: auto;
  flex: 1;
  padding: 16px 35px 36px;
  scrollbar-gutter: stable;
  overflow-anchor: none;
}
.complaint-message[data-v-f9dd17a3] {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  margin-top: 32px;
}
.complaint-message.is-self[data-v-f9dd17a3],
.complaint-message.system[data-v-f9dd17a3] {
  align-items: flex-end;
}
.complaint-message header[data-v-f9dd17a3] {
  color: #86909c;
  margin-bottom: 18px;
  font-size: 13px;
}
.complaint-role[data-v-f9dd17a3] {
  margin-left: 8px;
  background: #3370ff;
  color: white;
  border-radius: 3px;
  padding: 2px 7px;
}
.merchant .complaint-role[data-v-f9dd17a3] {
  background: #fff7e8;
  color: #ff7d00;
}
.buyer .complaint-role[data-v-f9dd17a3] {
  background: #e8ffea;
  color: #00b42a;
}
.complaint-bubble[data-v-f9dd17a3] {
  background: #fafafa;
  border: 1px solid #eee;
  border-radius: 3px;
  padding: 10px 16px;
  max-width: 80%;
  overflow-wrap: anywhere;
}
.complaint-bubble p[data-v-f9dd17a3] {
  white-space: pre-wrap;
  margin: 0;
  line-height: 1.7;
}
.evidence-thumbs[data-v-f9dd17a3] {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.evidence-thumbs img[data-v-f9dd17a3] {
  display: block;
  width: 80px;
  height: 80px;
  object-fit: contain;
  border-radius: 8px;
}
.complaint-compose[data-v-f9dd17a3] {
  border-top: 1px solid #f5f5f5;
  padding: 12px 35px 20px;
  flex-shrink: 0;
}
.complaint-compose form[data-v-f9dd17a3] {
  display: flex;
  gap: 8px;
  align-items: center;
}
.reply-images.has-images[data-v-f9dd17a3] {
  margin-bottom: 10px;
}
.complaint-ended[data-v-f9dd17a3] {
  padding: 20px 35px;
  color: #86909c;
  border-top: 1px solid #f2f3f5;
}
.chat-full-image[data-v-f9dd17a3] {
  display: block;
  max-width: 100%;
  max-height: 70vh;
  margin: auto;
  object-fit: contain;
}
@media (max-width: 700px) {
.complaint-scroll[data-v-f9dd17a3] {
    padding: 12px 16px 24px;
}
.room-status[data-v-f9dd17a3] {
    padding: 8px 16px;
    gap: 10px;
}
.complaint-compose[data-v-f9dd17a3] {
    padding: 12px 16px;
}
.complaint-compose form[data-v-f9dd17a3] {
    flex-wrap: wrap;
}
.complaint-bubble[data-v-f9dd17a3] {
    max-width: 95%;
}
}

.complaints-list[data-v-eceb6d21] {
  padding: 24px 20px;
}
.complaint-history-unread[data-v-eceb6d21] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 9px;
  background: #f53f3f;
  color: #fff;
  font-size: 12px;
  line-height: 18px;
}
.green[data-v-eceb6d21] {
  color: #00b42a;
  background: #e8ffea;
}
.red[data-v-eceb6d21] {
  color: #f53f3f;
  background: #ffece8;
}
.gray[data-v-eceb6d21] {
  color: #86909c;
  background: #f2f3f5;
}
.time-label[data-v-eceb6d21] {
  color: #3491fa;
  background: #e8f4ff;
  margin-right: 8px;
}
.orange[data-v-eceb6d21] {
  color: #ff7d00;
  background: #fff7e8;
}
.complaint-workspace[data-v-eceb6d21] {
  height: calc(100dvh - 112px);
  min-height: 420px;
  display: flex;
  flex-direction: column;
  background: white;
}
.complaint-heading[data-v-eceb6d21] {
  min-height: 60px;
  display: flex;
  align-items: center;
  padding: 12px 20px;
  gap: 8px;
  flex-shrink: 0;
}
.complaint-countdown[data-v-eceb6d21] {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 14px;
  color: #4e5969;
}
.complaint-countdown > span[data-v-eceb6d21] {
  font-size: 30px;
}
.complaint-countdown strong[data-v-eceb6d21] {
  display: block;
  margin-top: 5px;
}
.complaint-summary[data-v-eceb6d21] {
  background: #f7f8fa;
  border-radius: 8px;
  padding: 14px 12px;
  color: #1d3554;
}
.complaint-summary-grid[data-v-eceb6d21] {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr) 56px minmax(0, 0.95fr);
  gap: 10px 0;
  align-items: start;
  line-height: 20px;
}
.complaint-amount[data-v-eceb6d21] {
  color: #f53f3f;
}
.complaint-product[data-v-eceb6d21],
.complaint-wide[data-v-eceb6d21] {
  grid-column: 2 / -1;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.complaint-case[data-v-eceb6d21] {
  border-top: 1px solid #edf0f5;
  margin-top: 8px;
  padding-top: 8px;
}
.evidence-thumbs[data-v-eceb6d21] {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.evidence-thumbs img[data-v-eceb6d21] {
  display: block;
  width: 80px;
  height: 80px;
  object-fit: contain;
  border-radius: 12px;
}
.complaint-full-image[data-v-eceb6d21] {
  display: block;
  max-width: 100%;
  max-height: 70vh;
  margin: auto;
  object-fit: contain;
}
.complaint-refund-form[data-v-eceb6d21] {
  display: grid;
  gap: 20px;
}
.complaint-refund-form p[data-v-eceb6d21] {
  line-height: 1.8;
  margin: 0;
  color: #86909c;
}
.complaint-refund-form strong[data-v-eceb6d21] {
  color: #f53f3f;
}
@media (max-width: 700px) {
.complaint-summary-grid[data-v-eceb6d21] {
    grid-template-columns: 70px minmax(0, 1fr);
}
.complaint-product[data-v-eceb6d21],
  .complaint-wide[data-v-eceb6d21] {
    grid-column: 2;
}
.complaint-workspace[data-v-eceb6d21] {
    height: calc(100dvh - 90px);
}
}

.buyer-summary-page[data-v-e81a20f8] {
  min-height: 100vh;
  background: #f5f6f8;
}
.buyer-summary-card[data-v-e81a20f8] {
  max-width: 1104px;
  width: calc(100% - 32px);
  margin: 24px auto;
  background: white;
  border-radius: 8px;
  padding: 16px;
}
.buyer-summary-card header[data-v-e81a20f8] {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 34px;
}
.buyer-summary-card h2[data-v-e81a20f8] {
  font-size: var(--heading-section-size);
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 18px;
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
.buyer-summary-card h2 svg[data-v-e81a20f8] {
  color: #3491fa;
}
.payment-unlock[data-v-e81a20f8] {
  margin: 0 0 24px;
}

.modal-backdrop:has(.human-captcha-dialog) {
  z-index: 2300;
}
.human-captcha-dialog {
  border-radius: 8px;
}
.human-captcha-dialog .fk-action-secondary {
  background: #f2f3f5;
  color: #4e5969;
}
.human-captcha-dialog .fk-action-primary {
  background: #165dff;
}
@media (min-width: 761px) {
.human-captcha-dialog .fk-action-primary:hover {
    background: #4080ff;
}
}
.human-captcha-error,
.human-inline-error {
  font-size: 12px;
  color: #f53f3f;
  margin: 8px 0 0;
}

.plugin-widget-controls[data-v-7bb6411c] {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-bottom: 8px;
}
.plugin-widget-frame[data-v-7bb6411c] {
  display: block;
  width: 100%;
  border: 0;
}

.support-error[data-v-971dabc6] {
  position: fixed;
  bottom: 84px;
  right: 24px;
  z-index: 20;
  background: white;
  color: #e34d59;
  padding: 12px;
  border: 1px solid #edf0f6;
  border-radius: 8px;
  max-width: 280px;
}
.support-launcher[data-v-971dabc6] {
  position: fixed;
  z-index: 101;
  touch-action: none;
  user-select: none;
}
.plugin-modules[data-v-e1b9c586] { display: contents;
}.buyer-theme-loading[data-v-57b2c60d] { padding: 32px; text-align: center; color: var(--text-secondary, #718096);
}
.login-result[data-v-94003646] {
  display: inline-block;
  padding: 2px 8px;
  white-space: nowrap;
}
.login-result.success[data-v-94003646] {
  background: #e8ffea;
  color: #00b42a;
}
.login-result.failed[data-v-94003646] {
  background: #ffece8;
  color: #f53f3f;
}
.login-result.blocked[data-v-94003646] {
  background: #fff7e8;
  color: #ff7d00;
}
.login-log-detail[data-v-94003646] {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  gap: 0;
  border: 1px solid #e5e6eb;
  border-radius: 4px;
  overflow: hidden;
  margin: 0;
  line-height: 1.6;
}
.login-log-detail dt[data-v-94003646],
.login-log-note[data-v-94003646] {
  color: #86909c;
}
.login-log-detail dt[data-v-94003646] {
  background: #f7f8fa;
  border-right: 1px solid #e5e6eb;
}
.login-log-detail dt[data-v-94003646],
.login-log-detail dd[data-v-94003646] {
  padding: 10px 14px;
  border-bottom: 1px solid #e5e6eb;
}
.login-log-detail dt[data-v-94003646]:nth-last-child(2),
.login-log-detail dd[data-v-94003646]:last-child {
  border-bottom: 0;
}
.login-log-detail dd[data-v-94003646] {
  margin: 0;
  overflow-wrap: anywhere;
}
.login-log-note[data-v-94003646] {
  font-size: 12px;
  margin-top: 22px;
}

.complaint-reminder[data-v-473cd092] {
  position: fixed;
  right: 24px;
  bottom: 28px;
  z-index: 60;
  color: #4e5969;
  font-size: 14px;
}
.complaint-reminder.above-chat[data-v-473cd092] {
  bottom: 100px;
}
.pending-panel header[data-v-473cd092] {
  cursor: grab;
  touch-action: none;
  user-select: none;
}
.is-dragging .pending-panel header[data-v-473cd092] {
  cursor: grabbing;
}
h2 svg[data-v-473cd092] {
  color: #ff9b38;
}
.pending-panel[data-v-473cd092] {
  width: 300px;
  max-width: calc(100vw - 32px);
  padding: 20px;
  border-radius: 8px;
  background: linear-gradient(#bddfff, white 62px);
  box-shadow: 0 12px 32px #165dff26;
}
.pending-panel header[data-v-473cd092] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
}
.pending-panel h2[data-v-473cd092] {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 14px;
  font-weight: 600;
}
.pending-row[data-v-473cd092] {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 54px;
  padding: 10px 12px;
  border: 1px solid #e5e6eb;
  background: white;
}
.pending-alert[data-v-473cd092] {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #fff3e8;
  color: #ff7d00;
  font-weight: 700;
}
@keyframes pending-arrival-473cd092 {
from {
    opacity: 0;
    transform: translateY(8px);
}
to {
    opacity: 1;
    transform: translateY(0);
}
}
@media (max-width: 600px) {
.complaint-reminder[data-v-473cd092] {
    right: 16px;
    bottom: 16px;
}
}

.system-update-trigger[data-v-5c59e3cf] {
  position: relative;
  display: inline-flex;
}
.system-update-trigger .notification-count[data-v-5c59e3cf] {
  top: -7px;
  right: -9px;
  pointer-events: none;
}
.system-update[data-v-5c59e3cf] {
  color: #4e5969;
  line-height: 1.7;
}
.update-overview[data-v-5c59e3cf] {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 2px 0 22px;
}
.update-overview-copy[data-v-5c59e3cf] {
  flex: 1;
  min-width: 0;
}
.update-overview h3[data-v-5c59e3cf] {
  margin: 0;
  color: var(--fk-text);
  font-size: 17px;
  font-weight: 600;
}
.update-overview p[data-v-5c59e3cf] {
  margin: 4px 0 0;
  font-size: 12px;
  color: var(--fk-muted);
}
.update-versions[data-v-5c59e3cf] {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 18px 20px;
  background: var(--fk-hover-bg);
  border: 1px solid var(--fk-border);
  border-radius: var(--fk-radius);
  color: #c9cdd4;
}
.update-version-item[data-v-5c59e3cf] {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.update-version-item span[data-v-5c59e3cf] {
  font-size: 12px;
  color: var(--fk-muted);
}
.update-version-item strong[data-v-5c59e3cf] {
  color: var(--fk-text);
  font-size: 20px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
.update-version-item .update-new[data-v-5c59e3cf] {
  color: var(--fk-primary);
}
.update-release-notes[data-v-5c59e3cf] {
  margin-top: 24px;
}
.update-notes-heading[data-v-5c59e3cf] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}
.update-notes-heading h4[data-v-5c59e3cf] {
  margin: 0;
  font-size: 14px;
  color: var(--fk-text);
  font-weight: 500;
}
.update-notes-heading span[data-v-5c59e3cf] {
  font-size: 12px;
  color: var(--fk-muted);
}
.update-notes[data-v-5c59e3cf] {
  max-height: 240px;
  overflow: auto;
  overflow-wrap: anywhere;
  margin-top: 10px;
  font-size: 13px;
}
.update-notes ul[data-v-5c59e3cf] {
  margin: 0;
  padding-left: 20px;
}
.update-notes li[data-v-5c59e3cf] {
  padding: 5px 0 5px 2px;
}
.update-notes li[data-v-5c59e3cf]::marker {
  color: var(--fk-primary);
}
.update-backup[data-v-5c59e3cf] {
  display: grid;
  gap: 6px;
  margin-top: 18px;
  font-size: 12px;
  color: var(--fk-muted);
}
.update-backup code[data-v-5c59e3cf] {
  overflow-wrap: anywhere;
}
.update-confirm[data-v-5c59e3cf] {
  padding: 10px 12px;
  background: #fff7e8;
  color: #ad6800;
  border-radius: var(--fk-radius);
  font-size: 13px;
}
.update-error[data-v-5c59e3cf] {
  color: var(--fk-danger);
  padding: 10px 12px;
  background: #fff1f0;
  border-radius: var(--fk-radius);
  font-size: 13px;
  overflow-wrap: anywhere;
}
.update-history[data-v-5c59e3cf] {
  margin-top: 20px;
  border-top: 1px solid var(--fk-border);
  padding-top: 14px;
  font-size: 13px;
}
.update-history summary[data-v-5c59e3cf] {
  cursor: pointer;
  color: var(--fk-text);
}
.update-history summary span[data-v-5c59e3cf],
.update-history time[data-v-5c59e3cf] {
  color: var(--fk-muted);
  font-size: 12px;
}
.update-history-list[data-v-5c59e3cf] {
  max-height: 260px;
  overflow: auto;
  overflow-wrap: anywhere;
  margin-top: 8px;
}
.update-history-item[data-v-5c59e3cf] {
  padding: 12px 0;
  border-bottom: 1px solid var(--fk-border);
}
.update-history-item strong[data-v-5c59e3cf] {
  color: var(--fk-primary);
  font-weight: 500;
}
.update-history-item p[data-v-5c59e3cf] {
  margin: 6px 0 0;
  white-space: pre-wrap;
}
@media (max-width: 480px) {
.update-versions[data-v-5c59e3cf] {
    gap: 12px;
    padding: 14px;
}
.update-overview[data-v-5c59e3cf] {
    gap: 10px;
}
}

.transaction-trend[data-v-899bed40] {
  position: relative;
  height: 294px;
  margin-top: 26px;
  padding: 10px 10px 36px 44px;
}
.transaction-y-axis[data-v-899bed40] {
  position: absolute;
  top: 10px;
  bottom: 36px;
  left: 0;
  width: 36px;
  font-size: 12px;
  color: #86909c;
}
.transaction-y-axis span[data-v-899bed40] {
  position: absolute;
  right: 0;
  transform: translateY(-50%);
}
.transaction-plot[data-v-899bed40] {
  position: relative;
  height: 100%;
}
.transaction-plot svg[data-v-899bed40] {
  width: 100%;
  height: 100%;
  overflow: visible;
  display: block;
}
.transaction-grid line[data-v-899bed40] {
  stroke: #dfe6f3;
  stroke-width: 1;
  stroke-dasharray: 3 3;
  vector-effect: non-scaling-stroke;
}
.transaction-series[data-v-899bed40] {
  clip-path: inset(-8px 100% -8px -8px);
}
.transaction-series.revealed[data-v-899bed40] {
  animation: transaction-reveal-899bed40 1.2s cubic-bezier(0.22, 0.61, 0.36, 1) both;
}
@keyframes transaction-reveal-899bed40 {
from {
    clip-path: inset(-8px 100% -8px -8px);
}
to {
    clip-path: inset(-8px -8px -8px -8px);
}
}
@media (prefers-reduced-motion: reduce) {
.transaction-series.revealed[data-v-899bed40] {
    animation: none;
    clip-path: none;
}
}
.transaction-x-axis[data-v-899bed40] {
  position: absolute;
  top: calc(100% + 12px);
  left: 0;
  right: 0;
  color: #86909c;
  font-size: 12px;
}
.transaction-x-axis span[data-v-899bed40] {
  position: absolute;
  white-space: nowrap;
  transform: translateX(-50%);
}
.transaction-x-axis .first[data-v-899bed40] {
  transform: none;
}
.transaction-x-axis .last[data-v-899bed40] {
  transform: translateX(-100%);
}
.transaction-guide[data-v-899bed40] {
  position: absolute;
  top: 0;
  bottom: 0;
  border-left: 1px dashed #20adff;
  pointer-events: none;
}
.transaction-point[data-v-899bed40] {
  position: absolute;
  width: 13px;
  height: 13px;
  transform: translate(-50%, -50%);
  border: 2px solid #5867ff;
  border-radius: 50%;
  background: white;
  pointer-events: none;
}
.transaction-tooltip[data-v-899bed40] {
  position: absolute;
  z-index: 2;
  padding: 16px 12px;
  color: #666;
  background: #fff;
  border-radius: 4px;
  box-shadow: 0 2px 10px #0003;
  font-size: 13px;
  line-height: 1.5;
  white-space: nowrap;
  pointer-events: none;
}
.transaction-tooltip.to-left[data-v-899bed40] {
  transform: translateX(-100%);
}
.transaction-tooltip p[data-v-899bed40] {
  margin: 12px 0 0;
}
@media (max-width: 760px) {
.transaction-trend[data-v-899bed40] {
    height: 250px;
    padding-left: 36px;
}
.transaction-y-axis[data-v-899bed40] {
    width: 30px;
}
.transaction-x-axis span[data-v-899bed40]:not(.first):not(.last) {
    display: none;
}
}

.dashboard-plugin-widgets[data-v-d9b7feb3] {
  grid-column: 1 / -1;
  display: grid;
  gap: 20px;
  min-width: 0;
}
.dashboard-plugin-panel[data-v-d9b7feb3] {
  padding: 24px;
}
@media (max-width: 700px) {
.dashboard-plugin-panel[data-v-d9b7feb3] {
    padding: 16px;
}
}

.inventory-heading[data-v-e310d3bb] {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 54px;
  padding: 12px 18px;
  flex-wrap: wrap;
  color: #4e5969;
}
.inventory-heading strong[data-v-e310d3bb] {
  font-weight: 500;
}
.inventory-divider[data-v-e310d3bb] {
  color: #c9cdd4;
}
.inventory-count[data-v-e310d3bb] {
  white-space: nowrap;
}
.inventory-panel[data-v-e310d3bb] {
  padding: 16px;
}
.inventory-toolbar[data-v-e310d3bb] {
  display: flex;
  align-items: center;
  gap: 8px 12px;
  flex-wrap: wrap;
  margin-bottom: 18px;
}
.inventory-search[data-v-e310d3bb] {
  display: flex;
  align-items: center;
  gap: 8px;
}
.inventory-content[data-v-e310d3bb] {
  overflow-wrap: anywhere;
}
.inventory-content small[data-v-e310d3bb] {
  margin-left: 8px;
  color: #00b42a;
  font-size: 11px;
}
@media (max-width: 700px) {
.inventory-panel[data-v-e310d3bb] {
    padding: 12px;
}
.inventory-toolbar[data-v-e310d3bb] {
    align-items: stretch;
}
.inventory-search[data-v-e310d3bb] {
    width: 100%;
}
}

.order-detail-content {
  color: #4e5969;
}
.order-detail-content section + section {
  margin-top: 24px;
}
.order-detail-content h3 {
  font-size: var(--heading-section-size);
  font-weight: var(--heading-weight);
  margin: 0 0 12px;
  line-height: 1.5;
}
.detail-method {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.detail-method img {
  width: 20px;
  height: 20px;
  object-fit: contain;
}
.detail-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.detail-warning {
  color: #f53f3f;
}
.detail-card-title {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.detail-card-title .status-pill {
  font-size: 12px;
}
.detail-delivery {
  border: 1px solid #e5e6eb;
}
.detail-delivery h4 {
  font-weight: 400;
  font-size: 16px;
  margin: 0;
  padding: 10px 16px;
  border-bottom: 1px solid #e5e6eb;
}
.detail-delivery > div {
  padding: 12px 16px;
}
.detail-delivery pre {
  border: 1px solid #e5e6eb;
  border-radius: 3px;
  margin: 0 0 8px;
  padding: 12px 20px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font: inherit;
}
.detail-delivery pre:last-child {
  margin-bottom: 0;
}
.detail-history {
  margin-top: 20px;
  font-size: 13px;
}
.detail-history summary {
  cursor: pointer;
  color: #86909c;
}
.detail-history article {
  border-bottom: 1px solid #e5e6eb;
  padding: 12px;
}
.detail-history pre {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  background: #f7f8fa;
  padding: 8px;
}
.reissue-selection { display: grid; gap: 12px; max-height: 320px; overflow: auto; overflow-wrap: anywhere;
}
.reissue-card-option { display: flex; align-items: flex-start; gap: 8px;
}
.reissue-quantity {
  display: flex;
  align-items: center;
  gap: 16px;
  white-space: nowrap;
}
@media (max-width: 600px) {
.reissue-quantity {
    gap: 8px;
}
}

.plugin-page-metrics[data-v-73ecf671] {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}
.plugin-page-metrics dd[data-v-73ecf671] {
  margin: 8px 0;
  font-size: 22px;
  font-weight: 600;
}
.plugin-page-table[data-v-73ecf671] {
  max-width: 100%;
  overflow-x: auto;
  margin: 16px 0;
}
.plugin-page-actions[data-v-73ecf671] {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 12px;
}

.plugin-workspace[data-v-0868f766] {
  padding-top: 20px;
}
.plugin-theme-settings[data-v-0868f766] {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 20px;
}
.plugin-workspace-actions[data-v-0868f766] {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: flex-end;
}

.registration-time-tag[data-v-3b754419] {
  display: inline-block;
  padding: 4px 8px;
  background: #e8f3ff;
  color: #165dff;
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  white-space: nowrap;
}
.verification-options[data-v-3b754419] {
  display: flex;
  align-items: center;
  gap: 32px;
  padding: 10px 0;
}

.scheduler-page[data-v-848fec15] { min-width: 0; padding: 24px;
}
.scheduler-heading[data-v-848fec15] { display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.scheduler-setup[data-v-848fec15] { margin: 20px 0; padding: 16px; background: #f5f7fb; border-radius: 8px;
}
.scheduler-setup pre[data-v-848fec15] { white-space: pre-wrap; overflow-wrap: anywhere;
}
.scheduler-table[data-v-848fec15] { overflow-x: auto; margin: 20px 0;
}
.scheduler-cards[data-v-848fec15] { display: grid; gap: 12px; margin: 20px 0;
}
.scheduler-task[data-v-848fec15] { padding: 16px; border: 1px solid #e9edf3; border-radius: 8px;
}
.scheduler-task > span[data-v-848fec15] { float: right;
}
.scheduler-task p[data-v-848fec15], .scheduler-page > p[data-v-848fec15] { color: #738096; font-size: 13px; line-height: 1.7;
}
@media (max-width: 760px) {
.scheduler-page[data-v-848fec15] { padding: 16px;
}
}

.checkout-discounts[data-v-e72cbd12] {
  margin: 14px 0;
  padding: 12px 14px;
  background: #f7f9fc;
  border-radius: 6px;
  font-size: 12px;
}
.checkout-discounts > div[data-v-e72cbd12] {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  line-height: 1.9;
}
.checkout-discounts strong[data-v-e72cbd12] {
  color: #f53f3f;
  font-weight: 500;
}
.quote-muted[data-v-e72cbd12],
del[data-v-e72cbd12] {
  color: #86909c;
}
.quote-error[data-v-e72cbd12] {
  color: #f53f3f;
}

.buyer-contact-links[data-v-c9d6bd08] {
  display: grid;
  gap: 6px;
  width: max-content;
  max-width: min(260px, calc(100vw - 80px));
}
.buyer-contact-links img[data-v-c9d6bd08] {
  width: 18px;
  height: 18px;
  object-fit: contain;
  flex-shrink: 0;
}
.buyer-contact-links span[data-v-c9d6bd08] {
  min-width: 0;
  overflow-wrap: anywhere;
}

.marketing-badges[data-v-57fde61a] {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
}
.marketing-badges > span[data-v-57fde61a] {
  display: inline-flex;
  align-items: center;
  box-sizing: border-box;
  height: 24px;
  color: #ff7d00;
  background: #fff7e8;
  font-size: 12px;
  font-weight: 400;
  padding: 4px 8px;
  line-height: 16px;
  white-space: nowrap;
  border-radius: 1px;
}

.resource-reader[data-v-8ac0d29b] {
  margin-top: 24px;
}
.resource-introduction[data-v-8ac0d29b] {
  padding: 8px 0 24px;
}
.resource-downloads[data-v-8ac0d29b] {
  scroll-margin-top: 20px;
}
.resource-download-label[data-v-8ac0d29b] {
  display: inline-block;
  color: #1683ff;
  background: #f0f7ff;
  padding: 4px 8px;
  font-size: 12px;
  margin: 0 0 26px;
  border-radius: 3px;
}
.resource-download-box[data-v-8ac0d29b] {
  border: 2px dashed #d8dde7;
  padding: 18px;
  color: #4e5969;
  overflow-wrap: anywhere;
}
.resource-locked[data-v-8ac0d29b] {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
}
.resource-locked span[data-v-8ac0d29b] {
  color: #ffb000;
  background: #fff9e9;
  padding: 3px 5px;
  border-radius: 4px;
}
.resource-order-note[data-v-8ac0d29b] {
  background: #f7f7f7;
  font-size: 12px;
  color: #86909c;
  padding: 5px;
  margin: 16px 0 0;
}
.resource-disclaimer[data-v-8ac0d29b] {
  color: #86909c;
  font-size: 12px;
  line-height: 1.8;
}

.order-lookup-page[data-v-20cdd94d] {
  background: #f5f6f8;
  min-height: 100vh;
}
.order-lookup-page .buyer-main[data-v-20cdd94d] {
  margin-top: 16px;
  margin-bottom: 0;
}
.lookup-card[data-v-20cdd94d] {
  min-height: max(840px, calc(100dvh - 76px));
  padding-bottom: 80px;
  border-radius: 8px 8px 0 0;
}
.lookup-card[data-v-20cdd94d]::before {
  height: 500px;
  width: calc(100% - 72px);
  left: 52px;
  opacity: 0.55;
}
.lookup-card .lookup-subtitle[data-v-20cdd94d] {
  color: #86909c;
  line-height: 22px;
}
.lookup-history[data-v-20cdd94d] {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 8px;
  margin-top: 14px;
  text-align: left;
  color: #86909c;
  font-size: 12px;
}
.lookup-card .buyer-error[data-v-20cdd94d] {
  margin: 12px 0 0;
  text-align: left;
  font-size: 13px;
}
.lookup-advisory[data-v-20cdd94d] {
  margin-top: 16px;
  color: #4e5969;
}
.lookup-advisory > p[data-v-20cdd94d] {
  color: #86909c;
}
.lookup-speaker[data-v-20cdd94d] {
  color: #ffb65b;
}
.lookup-advisory > div[data-v-20cdd94d] {
  background: rgb(255 250 240 / 90%);
}
.lookup-advisory h2[data-v-20cdd94d] {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
  color: #ff7d00;
}
.lookup-advisory h2 span[data-v-20cdd94d] {
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  width: 12px;
  height: 12px;
  background: #ff7d00;
  color: white;
  font-size: 10px;
}
@media (max-width: 760px) {
.order-lookup-page[data-v-20cdd94d] {
    background: #fff;
}
.order-lookup-page .buyer-main[data-v-20cdd94d] {
    margin-top: 0;
}
}
@media (max-width: 600px) {
.lookup-content[data-v-20cdd94d] {
    padding-top: 60px;
}
.lookup-card .lookup-subtitle[data-v-20cdd94d] {
    margin-bottom: 32px;
}
.lookup-card form[data-v-20cdd94d] {
    flex-direction: column;
    gap: 10px;
}
.lookup-card form .fk-action-primary[data-v-20cdd94d] {
    width: 100%;
}
.lookup-card[data-v-20cdd94d]::before {
    top: 40px;
    left: 0;
    width: 100%;
}
}
.buyer-order-list[data-v-20cdd94d] {
  width: calc(100% - 32px);
  max-width: 1104px;
  margin: 24px auto 60px;
  background: white;
  border-radius: 8px;
  padding: 16px;
}
.buyer-order-list > header[data-v-20cdd94d] {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.buyer-list-status[data-v-20cdd94d] {
  background: #f2f3f5;
  color: #86909c;
  padding: 3px 8px;
  font-size: 12px;
  white-space: nowrap;
}
.buyer-list-status.paid[data-v-20cdd94d] {
  background: #e8ffea;
  color: #00b42a;
}
.buyer-list-actions[data-v-20cdd94d] {
  display: flex;
  justify-content: center;
  gap: 10px;
  white-space: nowrap;
}

@media (max-width: 760px) {
.portal-home > .buyer-header[data-v-41d3fd41],
  .portal-home > main[data-v-41d3fd41],
  .portal-home > .portal-footer[data-v-41d3fd41] {
    display: none;
}
}

.after-sales-form[data-v-01c766ab] {
  padding-top: 14px;
}
.buyer-chat-main[data-v-01c766ab] {
  height: calc(100dvh - 108px);
  min-height: 420px;
  display: flex;
  flex-direction: column;
  margin-bottom: 24px;
}
.buyer-chat-main .after-sales-header[data-v-01c766ab] {
  flex-shrink: 0;
}
.buyer-room-heading[data-v-01c766ab] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px 10px;
  color: #86909c;
  font-size: 12px;
}
.buyer-room-summary[data-v-01c766ab] {
  background: #f7f8fa;
  border-radius: 8px;
  padding: 12px 16px;
  color: #86909c;
  line-height: 1.8;
  overflow-wrap: anywhere;
}
.buyer-room-summary summary[data-v-01c766ab] {
  cursor: pointer;
}
.buyer-room-summary summary span[data-v-01c766ab] {
  margin-left: 12px;
  color: #165dff;
}
@media (max-width: 700px) {
.buyer-chat-main[data-v-01c766ab] {
    height: calc(100dvh - 96px);
    width: calc(100% - 16px);
    margin: 12px auto;
}
}

.ledger-wallet[data-v-97d7d339] {
  display: flex;
  align-items: center;
  gap: 14px;
}

.cashier-discounts[data-v-d9f0b2c2] {
  width: min(100%, 420px);
  margin: 0 auto;
  text-align: left;
}
:root {
  --fk-primary: #165dff;
  --fk-primary-hover: #4080ff;
  --fk-primary-active: #0e42d2;
  --fk-danger: #f53f3f;
  --fk-success: #00b42a;
  --fk-text: #1d2129;
  --fk-muted: #86909c;
  --fk-border: #e5e6eb;
  --fk-field-bg: #f2f3f5;
  --fk-field-hover: #e5e6eb;
  --fk-hover-bg: #f7f8fa;
  --fk-radius: 3px;
  --fk-control-height: 32px;
  --fk-overlay-layer: 2000;
  --fk-popover-layer: 2100;
  --fk-toast-layer: 2200;
}

/* Mobile taps use each control's actual state, without a browser overlay. */
@media (max-width: 760px) {
  * {
    -webkit-tap-highlight-color: transparent;
  }
}
:root {
  font-family: "Noto Sans SC", "Microsoft YaHei", sans-serif;
  color: #18243a;
  background: #f6f9ff;
  font-size: 14px;
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  min-width: 320px;
}
h2,
h3,
p {
  margin-top: 0;
}
.page-error,
.buyer-error {
  color: #d44444;
  margin: 12px 0;
}

/* 商家登录 */
.login-page {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 61.8% 38.2%;
  background: white;
}
.login-form-side {
  position: relative;
  min-height: 700px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.brand-mark {
  font-size: 20px;
}
.login-center {
  width: 402px;
  min-height: 380px;
  border: 1px solid #dbe1eb;
  box-shadow: 0 7px 22px #20396312;
  border-radius: 11px;
  padding: 38px 40px;
  transform: translateY(-20px);
}
.login-heading {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 36px;
}
.login-heading span {
  background: #f3f5f8;
  padding: 4px 8px;
  font-size: 12px;
  color: #1d2939;
}
.field-label {
  display: none;
}
.form-error {
  font-size: 12px;
  color: #d33;
  margin: -9px 0 8px;
}
@keyframes button-spin {
  to {
    transform: rotate(360deg);
  }
}
.login-extra {
  display: flex;
  justify-content: flex-end;
  gap: 24px;
  color: #2161e8;
  font-size: 12px;
  margin-top: 20px;
}
.login-toast {
  position: fixed;
  top: 38px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 30;
  background: white;
  box-shadow: 0 5px 18px #1c2f4c24;
  padding: 12px 20px;
  border-radius: 3px;
  color: #d74343;
}
.login-copyright {
  position: absolute;
  bottom: 11px;
  color: #34445f;
  text-align: center;
}
.login-feature-side {
  background: #2156cc url("/app/assets/login-background-b-pOy2-b.jpg") center/cover
    no-repeat;
  color: white;
  display: flex;
  justify-content: center;
}
.login-feature-inner {
  width: 100%;
  text-align: center;
  position: relative;
  padding-top: 240px;
}
.login-feature-inner h2 {
  font-size: 23px;
  margin-bottom: 12px;
}
.login-feature-inner.no-illustration h2 {
  margin-top: 160px;
}
.login-feature-inner p {
  font-size: 14px;
}
.login-illustration {
  width: min(370px, 80%);
  max-height: 330px;
  object-fit: contain;
  margin-top: 18px;
}
.login-carousel-arrows {
  position: absolute;
  left: 12px;
  right: 12px;
  top: 48%;
  display: flex;
  justify-content: space-between;
  font-size: 26px;
  color: #fff9;
}
.login-carousel-dots {
  position: absolute;
  bottom: 12px;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  gap: 7px;
}

/* 商家后台 */
.merchant-shell {
  min-height: 100vh;
  background: #f7faff;
}
.merchant-header {
  height: 80px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 22px 31px 0;
}
.merchant-header-left {
  display: flex;
  align-items: center;
  gap: 65px;
}
.header-popup-wrap {
  position: relative;
}
.header-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}
.account-popover {
  min-width: 105px;
}
.login-success-toast {
  position: fixed;
  z-index: 20;
  top: 40px;
  left: 50%;
  transform: translateX(-50%);
  background: white;
  padding: 10px 18px;
  box-shadow: 0 4px 16px #31436328;
  display: flex;
  align-items: center;
  gap: 9px;
}
.login-success-toast span {
  background: #19b75b;
  color: white;
  border-radius: 50%;
  display: grid;
  place-items: center;
  width: 17px;
  height: 17px;
}
.header-popover {
  position: absolute;
  right: 0;
  top: 32px;
  z-index: 15;
  min-width: 140px;
  background: white;
  box-shadow: 0 6px 25px #2739612b;
  border: 1px solid #e9eef5;
  border-radius: 4px;
  padding: 7px 0;
}
.notification-popover {
  padding: 16px;
  text-align: center;
  color: #9aa5b5;
  width: 220px;
}
.header-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  color: #3a4556;
  font-size: 13px;
}
.header-divider {
  height: 13px;
  border-left: 1px solid #d6deed;
}
.header-avatar {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #ecf1f9;
  color: #567ad4;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
}
.logout-button {
  padding: 0;
  transform: rotate(90deg);
}
.merchant-body {
  display: flex;
  align-items: stretch;
  gap: 16px;
  padding: 0 16px 16px;
  min-height: calc(100vh - 80px);
}
.merchant-sidebar {
  width: 128px;
  flex: 0 0 128px;
  background: white;
  border-radius: 16px;
  display: flex;
  align-self: stretch;
  overflow: hidden;
}
.merchant-sidebar.expanded {
  width: 248px;
  flex-basis: 248px;
}
.major-nav {
  width: 128px;
  flex: 0 0 128px;
  padding: 16px;
}
.sub-nav {
  border-left: 1px solid #f0f2f7;
  width: 120px;
  padding: 18px 8px;
}
.sub-nav h2 {
  padding: 0 12px;
  margin: 0 0 28px;
  font-size: 16px;
}
.sub-heading {
  display: block;
  padding: 0 12px;
  color: #9ca7b9;
  font-size: 12px;
  font-weight: 400;
  margin: 20px 0 6px;
}
.merchant-main-wrap {
  min-width: 0;
  flex: 1;
}
.notification-count {
  position: absolute;
  top: 2px;
  right: 2px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 10px;
  background: #f53f3f;
  color: white;
  font-size: 11px;
  font-weight: 600;
  line-height: 18px;
  text-align: center;
}
.surface-card {
  background: white;
  border-radius: 7px;
}
.dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 16px;
  align-items: start;
}
.dashboard-left {
  align-self: stretch;
  min-height: 710px;
  padding: 19px 20px;
}
.dashboard-greeting p {
  font-size: 12px;
  margin: 0 0 22px;
}
.summary-strip {
  height: 64px;
  border-radius: 12px;
  background: linear-gradient(110deg, #2466e8, #3872ed);
  color: #e9f3ff;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  align-items: center;
  margin-bottom: 23px;
  overflow: hidden;
}
.dashboard-section {
  padding: 0;
}
.section-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.section-heading h2 {
  font-size: var(--heading-section-size);
  font-weight: var(--heading-weight);
  margin: 0 0 20px;
  line-height: 1.5;
}
.metric-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.metric {
  background: #f6f8fc;
  height: 65px;
  border-radius: 12px;
  padding: 13px 17px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 12px;
}
.metric small {
  font-size: 12px;
}
.transaction-card {
  border-top: 1px solid #e9eef7;
  margin-top: 20px;
  padding-top: 43px;
}
.dashboard-right {
  display: grid;
  align-content: start;
  align-items: start;
  gap: 16px;
}
.dashboard-right .dashboard-section {
  padding: 22px 20px;
}
.dashboard-reminder-list {
  display: grid;
  max-height: 330px;
  overflow-y: auto;
}
.dashboard-reminder-type {
  flex: none;
  padding: 2px 5px;
  border-radius: 3px;
  font-size: 11px;
  color: #165dff;
  background: #e8f3ff;
}
.dashboard-reminder-type.complaint {
  color: #ff7d00;
  background: #fff7e8;
}
.dashboard-reminder-copy {
  flex: 1;
  min-width: 0;
  font-size: 12px;
}
.dashboard-reminder-copy > span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dashboard-reminder-copy small {
  display: block;
  margin-top: 4px;
  color: #86909c;
  font-size: 11px;
}
.dashboard-reminder-unread {
  flex: none;
  min-width: 18px;
  line-height: 18px;
  padding: 0 5px;
  border-radius: 9px;
  background: #f53f3f;
  color: white;
  font-size: 12px;
  text-align: center;
}
.dashboard-right .notice-list {
  max-height: 220px;
  overflow-y: auto;
}
.dashboard-reminder .simple-empty {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
}
.shortcut-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  row-gap: 18px;
  text-align: center;
}
.shortcut-grid svg {
  box-sizing: content-box;
  background: #f4f5f7;
  padding: 8px;
  border-radius: 3px;
  color: #596678;
}
.simple-empty {
  color: #a2aab7;
  text-align: center;
  padding-top: 4px;
}
.notice-list p {
  color: #9ca7b4;
  margin: 0;
}
.service-card {
  min-height: 160px;
  border-radius: 8px;
  color: white;
  background: linear-gradient(115deg, #3156da, #2d85ee);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.service-card strong {
  font-size: 17px;
}

/* 列表、表单和弹窗 */
.page-stack {
  display: grid;
  gap: 16px;
}
.page-title-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  background: white;
  border-radius: 7px;
}
.page-title-row p {
  font-size: 12px;
  color: #919dad;
  margin: 0;
}
.list-panel {
  min-height: 380px;
  padding: 0 20px;
}
.goods-page .list-panel {
  min-height: 313px;
}
.goods-type-row {
  min-height: 56px;
  padding: 0 25px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.goods-tools {
  display: flex;
  gap: 8px;
}
.goods-status-row {
  height: 45px;
  display: flex;
  align-items: stretch;
  gap: 31px;
  border-bottom: 1px solid #e5eaf3;
}
.goods-filter-row {
  background: none;
  margin: 0;
  padding: 15px 0;
  gap: 8px;
  flex-wrap: nowrap;
}
.goods-page .check-column {
  width: 44px;
}
.filter-row {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #f8faff;
  margin: 16px 0;
  padding: 15px;
  flex-wrap: wrap;
}
.filter-hint {
  color: #98a3b3;
  font-size: 12px;
}
.select-inline {
  display: flex;
  align-items: center;
  gap: 12px;
}
.table-scroll {
  overflow-x: auto;
}
.product-cell {
  display: flex;
  gap: 10px;
  align-items: center;
}
.product-cell strong,
.product-cell small {
  display: block;
}
.product-cell small {
  font-size: 11px;
  color: #9da7b7;
  margin-top: 4px;
}
.product-thumb {
  width: 42px;
  height: 42px;
  background: #f6f8fc;
  display: grid;
  place-items: center;
  color: #94a7c9;
}
.product-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.price-cell {
  color: #e56b4f;
}
.status-pill {
  font-size: 12px;
  padding: 4px 8px;
  border-radius: 3px;
}
.status-pill.enabled {
  background: #eaf8f0;
  color: #2aa568;
}
.status-pill.disabled {
  background: #f3f4f6;
  color: #8994a4;
}
.table-actions {
  display: flex;
  gap: 12px;
}
.table-footer {
  text-align: right;
  color: #8794aa;
  font-size: 12px;
  padding: 18px 0;
}
.monospace {
  font-family: Consolas, monospace;
}
.edit-form {
  display: grid;
  gap: 16px;
}
.edit-form small {
  font-size: 12px;
  color: #9ba6b6;
}
.settings-panel {
  padding: 0 20px 25px;
}
.settings-form {
  max-width: 760px;
  padding-top: 16px;
}
.settings-form h2 {
  font-size: var(--heading-section-size);
  font-weight: var(--heading-weight);
  margin: 16px 0 24px;
  line-height: 1.5;
}
.settings-actions {
  padding-left: 136px;
}

/* 买家页面 */
.buyer-page {
  min-height: 100vh;
  background: white;
}
.buyer-header {
  height: 60px;
  border-bottom: 1px solid #f1f2f5;
  position: sticky;
  top: 0;
  z-index: 100;
}
.buyer-header-inner {
  width: min(1160px, calc(100% - 64px));
  margin: auto;
  padding: 0;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.buyer-brand-symbol {
  color: #2161e8;
  font-weight: 700;
}
.buyer-powered {
  font-size: 12px;
  color: #4a5b70;
  border: 1px solid #e2e7ee;
  border-radius: 4px;
  padding: 5px 7px;
  margin-left: 38px;
}
.buyer-main {
  width: min(1200px, calc(100% - 40px));
  margin: 30px auto 70px;
}
.buyer-footer {
  text-align: center;
  color: #afb8c7;
  font-size: 12px;
  padding: 25px;
}
.shop-profile {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 28px 30px;
  background: #f5f8ff;
  border-radius: 7px;
  margin-bottom: 25px;
}
.shop-avatar {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: #2461ed;
  color: white;
  display: grid;
  place-items: center;
  font-size: 28px;
  overflow: hidden;
}
.shop-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.shop-profile p {
  margin: 0;
  color: #8896a9;
}
.shop-content {
  min-height: 350px;
}
.buyer-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  margin: 16px 0;
}
.buyer-categories {
  display: flex;
  gap: 16px;
}
.buyer-goods-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}
.buyer-good-image {
  height: 180px;
  background: #f7f9fc;
  display: grid;
  place-items: center;
  color: #abc0e6;
}
.buyer-good-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.buyer-good-content {
  padding: 15px;
}
.buyer-good-content h2 {
  font-size: 16px;
  margin-bottom: 8px;
}
.buyer-good-content p {
  color: #8d9aae;
  font-size: 12px;
  margin-bottom: 22px;
}
.buyer-good-bottom {
  display: flex;
  justify-content: space-between;
  color: #e35a47;
  align-items: end;
}
.buyer-good-bottom strong {
  font-size: 21px;
}
.buyer-good-bottom small {
  color: #9faab9;
}
.buyer-empty,
.buyer-loading {
  padding: 45px 0;
  text-align: center;
}
.buyer-breadcrumb {
  display: flex;
  gap: 9px;
  align-items: center;
  color: #8a98a9;
  margin: 10px 0 25px;
}
.good-detail {
  display: grid;
  grid-template-columns: 380px 1fr;
  gap: 38px;
}
.good-detail-image {
  height: 380px;
  background: #f6f8fb;
  display: grid;
  place-items: center;
  color: #9db6e5;
}
.good-detail-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.good-detail-subtitle,
.detail-tip {
  color: #8e9aab;
}
.good-price-box {
  background: #fff5f2;
  padding: 15px;
  display: flex;
  gap: 25px;
  align-items: center;
}
.good-price-box strong {
  color: #e65041;
  font-size: 28px;
}
.good-detail-row {
  display: flex;
  align-items: center;
  gap: 28px;
  padding: 18px 15px;
}
.good-detail-row > span {
  color: #8995a5;
}
.buy-button {
  width: 200px;
  margin: 15px;
}
.good-description {
  margin-top: 30px;
  border: 1px solid #edf1f5;
  padding: 20px;
}
.good-description h2 {
  font-size: 17px;
}
.lookup-card {
  width: min(570px, 100%);
  margin: 90px auto;
  padding: 40px;
  border: 1px solid #e9eef5;
  border-radius: 8px;
  text-align: center;
}
.lookup-card p {
  color: #8a98a9;
}
.lookup-card form {
  display: flex;
  gap: 10px;
}

/* 按原站操作路径补充的页面 */
.goods-page .table-actions {
  gap: 10px;
}
.goods-page .list-panel {
  padding: 0 14px;
}
.goods-table {
  table-layout: fixed;
  min-width: 1180px;
  color: #4e5969;
  font-size: 13px;
}
.goods-table .goods-col-check {
  width: 3.3%;
}
.goods-table .goods-col-info {
  width: 42.2%;
}
.goods-table-no-stock .goods-col-info {
  width: 52.7%;
}
.goods-table .goods-col-price {
  width: 6.5%;
}
.goods-table .goods-col-status {
  width: 8.5%;
}
.goods-table .goods-col-sales {
  width: 5%;
}
.goods-table .goods-col-stock {
  width: 10.5%;
}
.goods-table .goods-col-created {
  width: 9.5%;
}
.goods-table .goods-col-actions {
  width: 14.5%;
}
.goods-product-info {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.goods-product-image {
  width: 64px;
  height: 64px;
  flex: none;
  object-fit: cover;
}
.goods-product-cell {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}
.goods-type-tag {
  color: #1682ee;
  background: #e8f5ff;
  padding: 3px 8px;
  line-height: 17px;
  font-size: 12px;
}
.goods-type-tag.resource {
  color: #86909c;
  background: #f2f3f5;
}
.goods-price-cell {
  color: #4e5969;
}
.goods-status-actions {
  display: flex;
  align-items: center;
  white-space: nowrap;
}
.goods-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  height: 24px;
  line-height: 24px;
}
.goods-status::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #00b42a;
}
.goods-status.disabled::before {
  background: #a9b0bb;
}
.goods-stock-actions {
  display: flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}
.goods-stock-count {
  color: #00b42a;
  background: #e8ffea;
  padding: 3px 7px;
  line-height: 17px;
}
.goods-created-cell span {
  display: block;
  line-height: 19px;
}
.goods-page .table-actions {
  gap: 0;
  white-space: nowrap;
}
.share-link-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.share-link-label,
.share-qr-label {
  font-size: 12px;
  line-height: 24px;
  padding: 0 8px;
}
.share-link-label {
  color: #165dff;
  background: #e8f3ff;
}
.share-qr-label {
  color: #f59a12;
  background: #fff7e8;
  margin: 9px 0 8px;
}
.share-link-address {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 7px;
  color: #165dff;
  font-size: 14px;
  max-width: 100%;
}
.share-link-qr {
  width: 100px;
  height: 100px;
  image-rendering: pixelated;
}
.share-link-invalid {
  max-width: 520px;
  margin: 15vh auto;
  padding: 28px;
  border-radius: 8px;
  background: #fff;
  text-align: center;
}
.create-page {
  min-height: 274px;
  padding: 21px 20px 36px;
}
.create-tip {
  background: #eaf4ff;
  padding: 12px 16px;
  margin-bottom: 17px;
}
.create-tip span {
  color: #2461ed;
  margin-right: 9px;
}
.create-page h2 {
  font-size: var(--heading-section-size);
  font-weight: var(--heading-weight);
  margin: 0 0 24px;
  line-height: 1.5;
}
.product-type-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
.type-chevron {
  color: #b6c1d1;
  margin-left: auto;
  font-size: 22px;
}
.create-breadcrumb {
  display: flex;
  gap: 10px;
  align-items: center;
  color: #8793a4;
  margin-bottom: 20px;
}
.goods-create-form {
  max-width: 800px;
  padding: 6px 30px;
}
.goods-create-form h2 {
  border-bottom: 1px solid #e8edf5;
  padding: 12px 0 18px;
  font-size: var(--heading-section-size);
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
.goods-create-actions {
  margin: 26px 0 0 119px;
  display: flex;
  gap: 10px;
}
.card-publish-page {
  gap: 16px;
}
.card-publish-back {
  min-height: 60px;
  padding: 0 22px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.card-publish-back span {
  color: #c9cdd4;
}
.card-publish-back strong {
  font-weight: 400;
}
.card-publish-panel {
  padding: 19px 20px 30px;
}
.card-publish-row {
  display: grid;
  grid-template-columns: 100px minmax(0, 1fr);
  align-items: start;
  gap: 16px;
  margin: 0 0 20px;
}
.card-publish-label {
  padding-top: 7px;
  text-align: right;
  color: #4e5969;
}
.card-publish-control,
.card-publish-prices {
  width: min(100%, 933px);
}
.card-publish-row small {
  display: block;
  margin-top: 6px;
  color: #86909c;
  font-size: 12px;
}
.card-publish-prices {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) auto minmax(0, 1fr) auto minmax(
      0,
      1fr
    );
  align-items: start;
  gap: 16px;
}
.rich-link-form {
  display: grid;
  gap: 16px;
}
.rich-product-content {
  margin: 12px 0;
  line-height: 1.7;
  overflow-wrap: anywhere;
}
.rich-product-content p {
  margin: 0 0 10px;
}
.rich-product-content img {
  max-width: 100%;
  height: auto;
}
.rich-product-content video,
.rich-product-content audio {
  max-width: 100%;
}
.rich-product-content blockquote {
  border-left: 4px solid #ddd;
  padding: 8px 12px;
  background: #f7f8fa;
  margin: 10px 0;
}
.rich-product-content pre {
  background: #f5f6f7;
  padding: 12px;
  overflow-x: auto;
  border-radius: 3px;
  white-space: pre;
}
.rich-product-content code {
  font-family: Consolas, monospace;
  background: #f5f6f7;
}
.rich-product-content ul,
.rich-product-content ol {
  padding-left: 24px;
}
.rich-product-content ul {
  list-style: disc;
}
.rich-product-content ol {
  list-style: decimal;
}
.rich-product-content [data-w-e-type="todo"] {
  display: flex;
  gap: 8px;
  align-items: baseline;
}
.rich-product-content hr {
  border: 0;
  border-top: 1px solid #ddd;
  margin: 16px 0;
}
.goods-stock-warning {
  color: #f53f3f;
  font-size: 12px;
}
.card-publish-advanced {
  margin-top: 34px;
  padding-top: 24px;
  border-top: 2px dotted #e5e6eb;
}
.card-publish-advanced-fields {
  padding-top: 17px;
}
.card-publish-advanced-fields .card-publish-row {
  margin-bottom: 20px;
}
.card-publish-options {
  display: flex;
  align-items: center;
  gap: 22px;
  min-height: 32px;
  flex-wrap: wrap;
}
.card-publish-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 24px;
  min-height: 72px;
  padding: 14px;
}
@keyframes publish-progress-spin {
  to {
    transform: rotate(360deg);
  }
}
@media (max-width: 800px) {
  .card-publish-row {
    grid-template-columns: 1fr;
    gap: 7px;
  }
  .card-publish-label {
    padding: 0;
    text-align: left;
  }
  .card-publish-prices {
    grid-template-columns: 1fr;
    gap: 8px;
  }
}
.category-page {
  min-height: 370px;
  padding: 20px;
}
.category-search-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 15px 0 30px;
}
.category-thumbnail-field > span {
  display: block;
  margin-bottom: 7px;
}
.category-thumbnail-field small {
  display: block;
  margin-top: 6px;
  color: #86909c;
}
.thumbnail-category-file {
  display: none;
}
.thumbnail-category-name {
  display: flex;
  align-items: center;
  gap: 8px;
}
.thumbnail-category-name img {
  width: 40px;
  height: 40px;
  object-fit: contain;
}
.orders-page {
  min-height: 370px;
  padding: 20px;
}
.goods-type-count {
  font-weight: 500;
}
.orders-tab-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #e7ecf4;
}
.orders-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 22px;
  padding: 16px 0;
}
.orders-date-filter {
  display: flex;
  align-items: center;
  gap: 14px;
  white-space: nowrap;
}
.orders-trade-no {
  white-space: nowrap;
}
.orders-goods-cell {
  min-width: 240px;
  white-space: normal;
  overflow-wrap: anywhere;
}
.orders-quantity {
  color: #86909c;
  margin-bottom: 3px;
}
.orders-status-cell {
  width: 130px;
}
.orders-delivered-cell {
  width: 80px;
}
.orders-time-cell {
  width: 240px;
  color: #86909c;
}
.orders-time-label {
  display: inline-block;
  margin-right: 8px;
  color: #165dff;
}
.orders-time-label.paid {
  color: #ff9a2e;
}
.orders-actions-cell {
  width: 110px;
}
@media (max-width: 600px) {
  .orders-date-filter {
    width: 100%;
  }
}
.light-tag {
  display: inline-block;
  background: #ebf4ff;
  color: #2461ed;
  padding: 3px 6px;
  margin-bottom: 6px;
}
.order-detail-list {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 15px;
}
.order-detail-list dt {
  color: #8e9aab;
}
.order-detail-list dd {
  margin: 0;
}
.shop-settings-page {
  display: grid;
  gap: 16px;
}
.shop-settings-body {
  min-height: 500px;
  padding: 24px 20px 34px;
}
.shop-settings-form {
  max-width: 780px;
}
.shop-settings-form .settings-field {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin: 18px 0;
}
.shop-settings-form .settings-field > span {
  width: 135px;
  flex: none;
  text-align: right;
  padding-top: 9px;
}
.shop-settings-form .settings-field b {
  color: #e34747;
}
.shop-contact-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  width: 583px;
  max-width: 100%;
}
.shop-contact-fields small {
  grid-column: 1 / -1;
  font-size: 12px;
  color: #8f9bae;
}
.shop-settings-form .shop-custom-label {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
}
.shop-settings-form .shop-custom-label svg {
  color: #165dff;
}
@media (max-width: 700px) {
  .shop-contact-fields {
    grid-template-columns: 1fr;
  }
}
.shop-custom-links {
  width: 583px;
}
.shop-custom-link {
  display: flex;
  gap: 6px;
  margin-bottom: 6px;
}
.shop-settings-form .settings-actions {
  padding-left: 151px;
}
.style-settings {
  margin: 25px 0 0 132px;
  font-size: 13px;
}
.style-settings-row {
  display: flex;
  align-items: center;
  min-height: 24px;
  margin-bottom: 34px;
}
.style-settings-row > span {
  width: 86px;
  flex: none;
}
.style-background-box {
  display: flex;
  align-items: flex-start;
  width: 407px;
  max-width: 100%;
  min-height: 92px;
  margin: 2px 0 20px 86px;
  padding: 16px 26px;
  border: 1px solid #e5e6eb;
  gap: 16px;
}
.style-background-box b {
  color: #f53f3f;
}
.style-background-input {
  display: flex;
  min-width: 0;
  flex: 1;
  height: 34px;
  background: #f2f3f5;
}
.style-background-file {
  display: none;
}
@media (max-width: 700px) {
  .style-settings {
    margin-left: 0;
  }
  .style-background-box {
    display: none;
  }
}
.shop-settings-body-closed {
  min-height: 160px;
}
.shop-settings-body-other {
  min-height: 440px;
}
.closed-settings {
  margin-left: 146px;
  font-size: 13px;
}
.closed-settings-line {
  display: flex;
  align-items: center;
  min-height: 18px;
}
.closed-settings-line > span {
  width: 73px;
  flex: none;
}
.closed-settings p {
  margin: 8px 0 0 73px;
  color: #8a97a9;
  font-size: 12px;
}
.closed-reason-backdrop {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: grid;
  place-items: center;
  padding: 16px;
  background: #0008;
}
.closed-reason-dialog {
  width: 360px;
  max-width: 100%;
  overflow: hidden;
  border-radius: 8px;
  background: #fff;
}
.closed-reason-header {
  position: relative;
  display: grid;
  place-items: center;
  height: 57px;
}
.closed-reason-header h2 {
  margin: 0;
  font-size: 16px;
  font-weight: 400;
}
.closed-reason-body {
  position: relative;
  padding: 15px 20px 44px;
}
.closed-reason-body > span {
  position: absolute;
  right: 30px;
  bottom: 54px;
  color: #86909c;
  font-size: 12px;
}
.closed-reason-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  padding: 16px 20px;
  border-top: 1px solid #e5e6eb;
}
.other-settings {
  margin-left: 77px;
  font-size: 13px;
}
.other-settings-row {
  display: grid;
  grid-template-columns: 122px max-content;
  column-gap: 16px;
  min-height: 53px;
}
.other-settings-row.has-help {
  min-height: 74px;
}
.other-settings-row > span {
  padding-top: 8px;
  text-align: right;
}
.other-settings-choices {
  display: inline-flex;
  width: max-content;
  height: 31px;
  padding: 3px;
  background: #f2f3f5;
}
.other-settings-row small {
  grid-column: 2;
  color: #8a97a9;
  font-size: 12px;
}
@media (max-width: 700px) {
  .closed-settings,
  .other-settings {
    margin-left: 0;
  }
  .other-settings-row {
    grid-template-columns: 105px max-content;
    column-gap: 8px;
  }
}
.shop-links-list {
  padding: 0 16px 0 10px;
}
.shop-links-item {
  display: grid;
  grid-template-columns: 113px minmax(0, 1fr);
  align-items: start;
  font-size: 14px;
}
.shop-links-label {
  padding: 17px 0;
  color: #17233b;
  text-align: center;
}
.shop-links-content {
  min-width: 0;
  border-bottom: 1px solid #e5e8ef;
}
.shop-links-address {
  min-height: 56px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.shop-links-actions {
  flex: none;
  display: flex;
  align-items: center;
  gap: 16px;
}
.shop-links-qr {
  min-height: 203px;
  padding: 34px 0 17px;
}
.shop-links-qr img {
  display: block;
  width: 150px;
  height: 150px;
}
.shop-address-form {
  display: grid;
  gap: 12px;
  font-size: 14px;
}
.shop-address-form > p {
  margin: 0;
  color: #86909c;
  font-size: 12px;
}
.shop-address-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 10px;
}
@media (max-width: 700px) {
  .shop-links-list {
    padding: 0;
  }
  .shop-links-item {
    grid-template-columns: 82px minmax(0, 1fr);
  }
  .shop-links-address {
    flex-wrap: wrap;
    padding: 12px 0;
  }
  .shop-links-actions {
    width: 100%;
    justify-content: flex-start;
  }
}
.placeholder-page {
  min-height: 500px;
  padding: 24px;
}
.placeholder-content {
  display: grid;
  justify-items: center;
  gap: 12px;
  color: #69778b;
  padding: 120px 0;
  text-align: center;
}
.placeholder-content strong {
  font-size: 18px;
  color: #2b3a54;
}
.shop-closed {
  text-align: center;
  padding: 100px 0;
  color: #66758b;
}
.shop-closed-icon {
  display: grid;
  place-items: center;
  width: 45px;
  height: 45px;
  margin: 0 auto 14px;
  border-radius: 50%;
  background: #e9f2ff;
  color: #165dff;
  font-size: 20px;
  font-weight: 700;
}
.shop-closed p {
  margin: 0;
}
.user-settings-page {
  min-height: 500px;
  padding: 24px;
}
.user-info-card {
  display: flex;
  align-items: center;
  gap: 20px;
  background: #f8faff;
  padding: 16px 20px;
  margin-bottom: 28px;
}
.user-info-card span {
  color: #8d98a9;
}
.user-settings-page h2 {
  font-size: var(--heading-section-size);
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
.user-password-form {
  display: grid;
  gap: 16px;
  max-width: 520px;
}

@media (max-width: 1100px) {
  .dashboard-grid {
    grid-template-columns: 1fr;
  }
  .dashboard-right {
    grid-template-columns: repeat(2, 1fr);
  }
  .dashboard-left {
    min-height: 500px;
  }
}
@media (max-width: 760px) {
  .login-page {
    display: block;
  }
  .login-form-side {
    min-height: 100vh;
    padding: 55px 16px;
  }
  .login-center {
    width: min(402px, 100%);
  }
  .login-feature-side {
    display: none;
  }
  .merchant-header {
    height: 60px;
    padding: 15px;
  }
  .merchant-body {
    padding: 0 10px 10px;
  }
  .merchant-sidebar {
    position: fixed;
    top: 60px;
    bottom: 0;
    left: -280px;
    z-index: 10;
    border-radius: 0;
    box-shadow: 3px 0 15px #0002;
    transition: left 0.2s;
  }
  .merchant-sidebar.expanded {
    width: 248px;
  }
  .merchant-main-wrap {
    width: 100%;
  }
  .dashboard-right {
    grid-template-columns: 1fr;
  }
  .metric-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .buyer-goods-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .buyer-controls {
    flex-direction: column;
    align-items: stretch;
  }
  .good-detail {
    grid-template-columns: 1fr;
  }
  .good-detail-image {
    height: 260px;
  }
  .buyer-powered {
    display: none;
  }
}
@media (max-width: 470px) {
  .buyer-goods-grid {
    grid-template-columns: 1fr;
  }
  .lookup-card form {
    flex-direction: column;
  }
  .settings-actions {
    padding: 0;
  }
  .header-name {
    display: none;
  }
}

/* 参照商家端与买家端的统一尺寸 */
:root {
  font-family: Arial, "Microsoft YaHei", sans-serif;
  color: #18243a;
  background: #f8f9fc;
}
.merchant-shell {
  background: #f8f9fc;
}
.merchant-header {
  background: #f1f5fc;
  transition: background-color 0.12s linear;
}
@media (min-width: 761px) {
  .merchant-header:hover {
    background: #fff;
  }
}
.merchant-header:focus-within {
  background: #fff;
}
.account-popover {
  min-width: 124px;
  top: calc(100% - 1px);
  left: 50%;
  right: auto;
  transform: translateX(-50%);
}
.sub-nav .sub-heading {
  color: #202938;
  font-weight: 700;
}
.surface-card {
  border-radius: 8px;
}
.dashboard-left {
  min-height: 780px;
}
.summary-strip {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: space-around;
  height: 103px;
  border-radius: 12px;
  background: #3977f3;
  margin-bottom: 24px;
}
.summary-decoration {
  position: absolute;
  z-index: 1;
  height: auto;
  object-fit: contain;
  pointer-events: none;
}
.summary-decoration-left {
  top: 0;
  left: 0;
  width: 192px;
}
.summary-decoration-right {
  right: 0;
  bottom: 0;
  width: 120px;
}
.metric {
  height: 98px;
  border-radius: 10px;
  padding: 17px 18px;
  gap: 3px;
}
.metric strong {
  font-size: 20px;
  font-weight: 500;
  color: #15243a;
}
.metric small {
  color: #66758d;
}
.transaction-card {
  padding-top: 42px;
}
.transaction-chart {
  height: 290px;
  padding: 8px 4px 0;
}
.transaction-chart svg {
  display: block;
  width: 100%;
  height: 255px;
  overflow: visible;
}
.chart-grid line {
  stroke: #dde6f2;
  stroke-width: 1;
  stroke-dasharray: 3 2;
}
.chart-dates {
  display: flex;
  justify-content: space-between;
  padding: 0 8px 0 25px;
  color: #65758b;
  font-size: 11px;
}
.buyer-page {
  display: flex;
  flex-direction: column;
  background:
    radial-gradient(ellipse 38% 26% at 5% 45%, #e7f7ffad, transparent 80%),
    radial-gradient(ellipse 35% 30% at 95% 36%, #e7f4ffb8, transparent 82%),
    radial-gradient(ellipse 50% 17% at 52% 73%, #eff7ff9c, transparent 85%),
    #fafbfc;
}
.buyer-header {
  flex: 0 0 60px;
  background: #fff;
  border-bottom: 0;
  box-shadow: 0 2px 7px #1d26330d;
}
.buyer-header-nav {
  display: flex;
  align-items: center;
  gap: 27px;
  font-size: 14px;
  color: #354052;
}
.buyer-main {
  flex: 1;
  width: min(1140px, calc(100% - 40px));
  margin: 0 auto;
}
.buyer-footer {
  min-height: 68px;
  background: #fff;
  text-align: left;
  padding: 20px max(24px, calc((100vw - 1140px) / 2));
}
.buyer-shop-page {
  min-height: 100dvh;
}
.buyer-shop-page > .buyer-footer {
  flex: 0 0 auto;
  min-height: 48px;
  padding-top: 10px;
  padding-bottom: 10px;
}
.shop-profile {
  background: transparent;
  border-radius: 0;
  padding: 17px 20px 15px;
  margin: 0;
  min-height: 98px;
  gap: 24px;
}
.shop-avatar {
  width: 60px;
  height: 60px;
  background: #fff;
  color: #1d5eff;
  border: 0;
  font-size: 26px;
}
.shop-name-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 9px;
}
@property --shop-gradient-left {
  syntax: "<color>";
  inherits: false;
  initial-value: #823bea;
}
@property --shop-gradient-right {
  syntax: "<color>";
  inherits: false;
  initial-value: #d52c74;
}
@keyframes shop-name-gradient {
  0%,
  100% {
    --shop-gradient-left: #823bea;
    --shop-gradient-right: #d52c74;
  }
  18% {
    --shop-gradient-left: #2bd7ed;
    --shop-gradient-right: #3666cc;
  }
  36% {
    --shop-gradient-left: #39de70;
    --shop-gradient-right: #35d5cb;
  }
  55% {
    --shop-gradient-left: #b8ed35;
    --shop-gradient-right: #50d747;
  }
  73% {
    --shop-gradient-left: #e8ae31;
    --shop-gradient-right: #f0e33a;
  }
  91% {
    --shop-gradient-left: #d74735;
    --shop-gradient-right: #e99a35;
  }
}
.shop-profile-actions {
  display: flex;
  gap: 12px;
  align-items: center;
}
.shop-announcement {
  padding: 6px 20px 23px;
  min-height: 76px;
  font-size: 13px;
}
.shop-announcement strong {
  font-size: 14px;
}
.shop-announcement p {
  margin: 8px 0 0;
  color: #293649;
  white-space: pre-line;
}
.shop-content {
  background: #fff;
  border-radius: 8px;
  padding: 18px 24px 24px;
  min-height: 0;
  box-shadow: 0 14px 40px #21365812;
}
.buyer-shop-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.buyer-controls {
  display: block;
  padding: 20px 0 25px;
  margin: 0;
  border-bottom: 1px solid #f1f2f4;
}
.buyer-categories {
  gap: 10px;
  width: 100%;
  min-width: 0;
  flex-wrap: wrap;
  overflow: visible;
}
.buyer-select-title {
  margin: 22px 0;
  font-size: 13px;
  font-weight: 400;
  color: #8c96a7;
}
.buyer-goods-grid {
  grid-template-columns: repeat(4, 216px);
  gap: 13px;
}
.buyer-good-content {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 12px 14px;
}
.buyer-good-content h2 {
  font-size: 13px;
  line-height: 20px;
  font-weight: 400;
  margin: 0;
  color: #18304d;
}
.buyer-good-bottom {
  color: #0d60ff;
  align-items: center;
}
.buyer-good-bottom strong {
  font-size: 16px;
}
.buyer-good-bottom small {
  color: #1a60df;
  background: #edf4ff;
  padding: 3px 6px;
}
.buyer-empty {
  padding: 12px 0 60px;
}
.buyer-shop-end {
  border-top: 1px solid #f1f2f4;
  height: 1px;
}
.purchase-mask {
  position: fixed;
  inset: 0;
  background: #1b2231a6;
  z-index: 110;
  display: grid;
  place-items: center;
}
.purchase-dialog {
  width: min(520px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  border-radius: 15px;
  background: white;
  display: flex;
  flex-direction: column;
  box-shadow: 0 16px 55px #1117;
  overflow: hidden;
}
.purchase-dialog.expanded {
  width: min(960px, calc(100vw - 32px));
  height: min(90vh, 850px);
}
.closed-reason-dialog,
.w-e-modal {
  transform-origin: center;
  animation:
    dialog-scale-in 0.3s cubic-bezier(0.18, 0.89, 0.32, 1.15),
    dialog-fade-in 0.2s ease-out;
}
@keyframes dialog-scale-in {
  from {
    transform: scale(0.5);
  }
  to {
    transform: scale(1);
  }
}
@keyframes dialog-fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.purchase-dialog-header {
  position: relative;
  text-align: center;
  font-size: 17px;
  padding: 14px 48px;
}
.purchase-dialog-body {
  padding: 13px 35px;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
}
.purchase-dialog-body h2 {
  font-size: 17px;
  min-height: 40px;
  border-bottom: 1px solid #eef0f4;
  margin: 0;
}
.purchase-dialog-body h2 span {
  float: right;
  color: #93a3b9;
  font-size: 14px;
}
.purchase-description {
  margin: 12px 0 0;
  color: #4e5969;
  font-size: 13px;
}
.purchase-description-content {
  margin: 0;
  padding: 10px 0;
}
.purchase-description p:last-child {
  margin-bottom: 0;
}
.purchase-tags {
  margin-top: 16px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  color: #20c167;
  font-size: 12px;
}
.purchase-tags > span:not(.marketing-badges) {
  display: inline-flex;
  align-items: center;
  box-sizing: border-box;
  height: 24px;
  line-height: 16px;
  white-space: nowrap;
  background: #e9fced;
  padding: 4px 8px;
}
.purchase-tags > span:not(.marketing-badges) + span:not(.marketing-badges) {
  background: #e9f3ff;
  color: #1167ff;
}
.purchase-tags > .marketing-badges {
  display: contents;
}
.purchase-contact {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 0;
  border-bottom: 1px solid #eef0f4;
  color: #61758b;
  font-size: 13px;
  white-space: nowrap;
}
.purchase-contact span::first-letter {
  color: #f44;
}
.purchase-total {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 0 22px;
}
.purchase-total strong {
  color: #1260ff;
  font-size: 21px;
}
.purchase-pay {
  display: flex;
  gap: 7px;
}
.purchase-pay img {
  width: 18px;
  height: 18px;
  object-fit: contain;
}
.purchase-dialog-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 16px;
  padding: 14px 35px 32px;
}
.order-lookup-page {
  background: #f3f5f8;
}
.order-lookup-page .buyer-main {
  width: min(1104px, calc(100% - 32px));
}
.lookup-card {
  position: relative;
  overflow: hidden;
  width: 100%;
  min-height: 840px;
  margin: 3px auto 0;
  padding: 0;
  border: 0;
  background: white;
  text-align: center;
}
.lookup-card::before {
  content: "";
  position: absolute;
  top: 66px;
  left: 5%;
  width: 90%;
  height: 390px;
  background: url("/app/assets/order-background-BFESm9xn.jpeg") center top / contain
    no-repeat;
  opacity: 0.2;
  pointer-events: none;
}
.lookup-content {
  position: relative;
  width: min(590px, calc(100% - 32px));
  margin: 0 auto;
  padding-top: 130px;
}
.lookup-card .lookup-subtitle {
  font-size: 14px;
  margin-bottom: 62px;
}
.lookup-card form {
  gap: 16px;
}
.lookup-advisory {
  text-align: left;
  margin-top: 18px;
  font-size: 12px;
  color: #65758d;
}
.lookup-advisory > p {
  font-size: 12px;
  line-height: 20px;
  min-height: 40px;
  margin: 0 0 16px;
}
.lookup-advisory > div {
  background: #fffaf0;
  border-radius: 8px;
  padding: 16px;
}
.lookup-advisory strong {
  color: #f58a00;
}
.lookup-advisory ol {
  line-height: 24px;
  margin: 8px 0;
  padding-left: 16px;
}
.lookup-advisory b {
  color: #e43e3e;
}
.lookup-results {
  margin-top: 20px;
  text-align: left;
}
.lookup-result {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  padding: 14px;
  border: 1px solid #e7edf5;
  margin-bottom: 8px;
}
.lookup-result small {
  color: #738198;
}
.public-info-page {
  min-height: 100vh;
  background: white;
  display: flex;
  flex-direction: column;
}
.public-info-main {
  width: min(788px, calc(100% - 40px));
  min-height: 535px;
  margin: 60px auto 0;
  flex: 1;
}
.public-faq-list {
  border: 1px solid #dfe5ee;
  border-radius: 8px;
  overflow: hidden;
}
.public-faq-list small {
  float: right;
  color: #7f96b3;
  font-size: 13px;
}
.public-faq-list p {
  clear: both;
  padding-top: 20px;
  color: #65758c;
  font-size: 14px;
  line-height: 1.8;
}
.public-prohibited {
  font-size: 14px;
  line-height: 1.8;
  color: #374761;
}
.public-prohibited h2 {
  font-size: 18px;
  margin-top: 30px;
}
.public-info-footer {
  background: #050505;
  color: white;
  min-height: 220px;
  padding: 64px 0;
}
.public-info-footer > div {
  width: min(1192px, calc(100% - 40px));
  margin: auto;
  display: flex;
  justify-content: space-between;
  gap: 20px;
}
.section-view {
  display: grid;
  gap: 16px;
}
.account-setting-list {
  margin: 25px 20px 5px;
}
.account-setting-list > div {
  display: flex;
  align-items: center;
  min-height: 71px;
  border-bottom: 1px solid #e6eaf1;
  gap: 16px;
}
.account-setting-list > div > span {
  width: 90px;
  text-align: right;
}
.account-setting-list strong {
  font-weight: 400;
}
.section-surface {
  padding: 20px;
  min-height: 275px;
}
.section-search {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 15px 0 25px;
}
.section-tabbar {
  height: 56px;
  padding: 0 26px;
  display: flex;
  gap: 32px;
}
.section-muted {
  color: #8491a4;
  font-size: 13px;
}
.coupon-type-list {
  display: flex;
  gap: 20px;
  margin: 25px 0;
}
.coupon-type-list strong {
  font-size: 17px;
}
.coupon-type-list small {
  color: #8795a8;
}
.coupon-type-list span {
  color: #1d5eff;
}
.info-strip {
  background: #e8f3ff;
  padding: 12px 16px;
  margin: 10px 0;
  color: #1e3e69;
}
.setting-row {
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 69px;
  margin: 0 20px;
  border-bottom: 1px solid #e6eaf1;
}
.setting-row > span {
  width: 100px;
  flex: 0 0 100px;
}
.setting-row .row-end {
  margin-left: auto;
}
.setting-row small {
  background: #f3f5f7;
  color: #8995a5;
  padding: 5px 9px;
}
@media (max-width: 800px) {
  .buyer-header-nav {
    gap: 10px;
  }
  .buyer-goods-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .buyer-main {
    width: calc(100% - 24px);
  }
}
@media (max-width: 500px) {
  .buyer-goods-grid {
    grid-template-columns: 1fr;
  }
  .buyer-shop-top {
    flex-wrap: wrap;
  }
  .shop-content {
    padding: 15px;
  }
}

/* 网站首页：以原站页面尺寸和区块结构重绘 */
.portal-home {
  background: #fff;
  overflow: visible;
}
.buyer-header-actions {
  display: flex;
  align-items: center;
  gap: 22px;
}
.portal-home .buyer-brand-symbol {
  color: #c39127;
  font-size: 26px;
}
.portal-home .buyer-footer {
  display: none;
}
.portal-hero {
  position: relative;
  height: 640px;
  overflow: hidden;
}
.portal-hero-background {
  position: absolute;
  z-index: 0;
  width: 2466px;
  height: 702px;
  max-width: none;
  left: 50%;
  top: -66px;
  transform: translateX(-50%);
  pointer-events: none;
}
.portal-hero-inner {
  position: relative;
  z-index: 1;
  width: min(1160px, calc(100% - 64px));
  height: 100%;
  margin: auto;
  display: grid;
  grid-template-columns: 54% 46%;
  align-items: center;
}
.portal-hero-copy {
  transform: translateY(-28px);
  max-width: 500px;
}
.portal-hero-copy > p {
  color: #8492a6;
  font-size: 16px;
  line-height: 24px;
  max-width: 500px;
  margin: 0 0 39px;
}
.portal-hero-actions {
  display: flex;
  align-items: center;
  gap: 25px;
}
.portal-hero-art {
  position: relative;
  width: 600px;
  height: 560px;
  margin-left: -10px;
}
.portal-hero-art img {
  position: absolute;
  height: auto;
  object-fit: contain;
}
.portal-order-chart {
  width: 270px;
  left: 92px;
  top: 8px;
}
.portal-my-shop {
  width: 235px;
  left: 350px;
  top: 50px;
}
.portal-product-list {
  width: 455px;
  left: 350px;
  top: 195px;
}
.portal-account-card {
  width: 355px;
  left: 5px;
  top: 244px;
}
.portal-buyer-card {
  width: 260px;
  left: 90px;
  top: 415px;
}
/* 原首页的五张卡片分别从四周弹入，持续 0.8 秒。 */
.portal-order-chart {
  animation: portal-cross-a 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) both;
}
.portal-my-shop {
  animation: portal-cross-b 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) both;
}
.portal-product-list {
  animation: portal-cross-c 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) both;
}
.portal-buyer-card {
  animation: portal-cross-d 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) both;
}
.portal-account-card {
  animation: portal-cross-e 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) both;
}
@keyframes portal-cross-a {
  from {
    top: -42px;
    left: 42px;
    opacity: 0;
  }
  to {
    top: 8px;
    left: 92px;
    opacity: 1;
  }
}
@keyframes portal-cross-b {
  from {
    top: -39px;
    left: 400px;
    opacity: 0;
  }
  to {
    top: 50px;
    left: 350px;
    opacity: 1;
  }
}
@keyframes portal-cross-c {
  from {
    top: 245px;
    left: 400px;
    opacity: 0;
  }
  to {
    top: 195px;
    left: 350px;
    opacity: 1;
  }
}
@keyframes portal-cross-d {
  from {
    top: 465px;
    left: 40px;
    opacity: 0;
  }
  to {
    top: 415px;
    left: 90px;
    opacity: 1;
  }
}
@keyframes portal-cross-e {
  from {
    top: 244px;
    left: -45px;
    opacity: 0;
  }
  to {
    top: 244px;
    left: 5px;
    opacity: 1;
  }
}
.portal-section {
  width: min(1190px, calc(100% - 72px));
  margin: auto;
}
.portal-section-title {
  text-align: center;
}
.portal-section-title h2 {
  font-size: 32px;
  line-height: 1.4;
  color: #111;
  font-weight: 500;
  margin: 0 0 14px;
}
.portal-section-title p {
  color: #878787;
  font-size: 18px;
  margin: 0;
}
.portal-industry {
  padding-top: 120px;
}
.portal-industry-panel {
  height: 420px;
  margin-top: 65px;
  display: grid;
  grid-template-columns: 235px minmax(0, 1fr) 280px;
  align-items: stretch;
  background: #f8faff;
  border-radius: 14px;
  overflow: hidden;
}
.portal-industry-examples {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 38px;
  padding: 68px 35px 35px 42px;
}
.portal-industry-examples article > div {
  display: flex;
  align-items: center;
  gap: 12px;
}
.portal-industry-examples article small {
  background: #dce8ff;
  color: #3268c7;
  border-radius: 20px;
  padding: 4px 10px;
  white-space: nowrap;
}
.portal-industry-examples article h3 {
  font-size: 18px;
  font-weight: 400;
  margin: 0;
}
.portal-industry-examples article p {
  margin: 8px 0 0 60px;
  font-size: 13px;
  line-height: 1.75;
  color: #666;
  max-width: 470px;
}
.portal-industry-photo {
  align-self: center;
  width: 240px;
  height: 340px;
  object-fit: cover;
  border-radius: 7px;
}
.portal-why {
  padding-top: 82px;
}
.portal-feature-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
  margin-top: 68px;
}
.portal-feature-grid article {
  height: 312px;
  padding: 28px 28px 22px;
  border-radius: 16px;
  background: linear-gradient(#f7faff, #fff 42%);
  box-shadow: 0 9px 25px #1d58be13;
}
.portal-feature-grid article:nth-child(2) {
  background: linear-gradient(#f0fbfb, #fff 42%);
}
.portal-feature-grid article:nth-child(3) {
  background: linear-gradient(#fff8f4, #fff 42%);
}
.portal-feature-grid article:nth-child(4) {
  background: linear-gradient(#f9f7ff, #fff 42%);
}
.portal-feature-grid h3 {
  font-size: 17px;
  margin: 0 0 35px;
  white-space: nowrap;
}
.portal-feature-grid h3 span {
  color: #2868e9;
  margin-right: 9px;
}
.portal-feature-grid h4 {
  font-size: 14px;
  font-weight: 500;
  margin: 0 0 10px;
}
.portal-feature-grid h4::before {
  content: "○";
  color: #166afa;
  font-weight: 700;
  margin-right: 8px;
}
.portal-feature-grid h4:nth-of-type(2)::before {
  color: #4fd8db;
}
.portal-feature-grid p {
  color: #999;
  font-size: 12px;
  line-height: 1.7;
  margin: 0 0 22px 17px;
}
.portal-steps {
  padding-top: 76px;
}
.portal-step-grid {
  width: min(985px, 100%);
  margin: 68px auto 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.portal-step-grid article {
  height: 170px;
  padding: 27px 16px;
  border-radius: 16px;
  background: linear-gradient(145deg, #e9efff, #f7f9ff);
}
.portal-step-grid article:nth-child(2) {
  background: linear-gradient(145deg, #eafaf5, #f7fbfa);
}
.portal-step-grid article:nth-child(3) {
  background: linear-gradient(145deg, #fff8ee, #fbfaf8);
}
.portal-step-grid h3 {
  color: #596477;
  font-size: 16px;
  margin: 0 0 15px 9px;
}
.portal-step-grid article > div {
  min-height: 66px;
  display: flex;
  align-items: center;
  gap: 12px;
  background: white;
  border-radius: 9px;
  padding: 10px 15px;
  font-weight: 600;
  font-size: 13px;
}
.portal-step-grid article > div span {
  color: #3cb5f1;
  font-size: 24px;
}
.portal-step-grid article:nth-child(2) > div span {
  color: #a975ef;
}
.portal-step-grid article:nth-child(3) > div span {
  color: #faab62;
}
.portal-news {
  padding-top: 191px;
  padding-bottom: 73px;
}
.portal-news-grid {
  width: min(985px, 100%);
  margin: 60px auto 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}
.portal-news-grid article {
  min-height: 254px;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 10px 25px #245ec914;
  overflow: hidden;
}
.portal-news-grid header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 25px 20px 10px;
}
.portal-news-grid header h3 {
  border-left: 4px solid #2b79f6;
  padding-left: 5px;
  font-size: 16px;
  margin: 0;
}
@media (min-width: 761px) {
  .portal-news-grid article:hover {
    box-shadow: 0 14px 30px #245ec924;
  }
}
.portal-news-empty {
  padding: 40px 16px;
  text-align: center;
  color: #8b97a9;
}
@media (min-width: 761px) and (max-width: 1100px) {
  .portal-news-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.news-admin-page {
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
}
.news-admin-list {
  padding: 25px 30px;
}
.news-admin-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
}
.news-admin-list > p {
  margin: 0 0 20px;
  color: #86909c;
  font-size: 13px;
}
.news-editor-help {
  margin: 0;
  color: #86909c;
  font-size: 13px;
}
.news-editor-form .news-field-label {
  color: #4e5969;
}
.news-editor-form .news-field-label b {
  color: #d44747;
}
.news-admin-item-actions {
  display: flex;
  gap: 12px;
  align-items: center;
}
.news-admin-items article {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 0;
  border-top: 1px solid #eef0f3;
}
.news-admin-items article > div:first-child {
  min-width: 0;
}
.news-admin-items h2 {
  margin: 0;
  font-size: var(--heading-section-size);
  font-weight: var(--heading-weight);
  display: block;
  color: #17233b;
  line-height: 1.5;
}
.news-admin-items small {
  display: block;
  margin-top: 7px;
  color: #86909c;
}
.news-admin-items p {
  margin: 8px 0 0;
  color: #677487;
  font-size: 13px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.news-admin-item-actions {
  flex: none;
}
.news-article-page {
  min-height: 100vh;
  background: #fff;
}
.news-article-content {
  width: min(820px, calc(100% - 36px));
  margin: 0 auto;
  padding: 52px 0 100px;
}
.news-article-date {
  color: #86909c;
  font-size: 13px;
  padding-bottom: 24px;
  border-bottom: 1px solid #eef0f3;
}
.news-article-body {
  padding-top: 20px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: #364153;
  line-height: 1.9;
  font-size: 16px;
}
.complaint-main {
  width: min(780px, calc(100% - 36px));
  margin: 50px auto 100px;
  flex: 1;
}
.complaint-intro {
  margin: 14px 0 32px;
  text-align: center;
  color: #7a889b;
  font-size: 14px;
}
.complaint-tabs {
  display: flex;
  gap: 30px;
  border-bottom: 1px solid #e5e9ef;
}
.complaint-panel {
  margin-top: 20px;
  padding: 30px;
  border: 1px solid #eef0f4;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 7px 20px #245ec90c;
}
.complaint-panel form {
  display: grid;
  gap: 20px;
}
.complaint-success {
  padding: 24px;
  background: #f2fbf6;
  color: #265a3c;
}
.complaint-success strong {
  display: block;
  margin-bottom: 10px;
  font-size: 18px;
}
.complaint-success p {
  line-height: 1.7;
}
.complaint-result {
  margin-top: 28px;
  padding: 22px;
  background: #f7f9fc;
  border-radius: 4px;
  overflow-wrap: anywhere;
}
.complaint-result h2 {
  margin: 0 0 18px;
  font-size: 18px;
}
.complaint-result h2 small {
  margin-left: 12px;
  color: #2461ed;
  font-size: 13px;
}
.complaint-result p {
  margin: 10px 0;
  color: #4f5d70;
  line-height: 1.6;
  white-space: pre-wrap;
}
.complaint-admin-detail {
  display: grid;
  gap: 14px;
  min-width: min(440px, 70vw);
}
.complaint-admin-detail p {
  margin: 0;
  line-height: 1.6;
  overflow-wrap: anywhere;
}
@media (max-width: 650px) {
  .complaint-main {
    margin-top: 32px;
  }
  .complaint-panel {
    padding: 18px;
  }
}
@media (max-width: 650px) {
  .news-admin-list {
    padding: 20px 16px;
  }
  .news-admin-items article {
    display: block;
  }
  .news-admin-item-actions {
    flex-wrap: wrap;
    margin-top: 14px;
  }
}
.portal-footer {
  background: #050505;
  color: #bbb;
  padding: 65px max(36px, calc((100% - 1190px) / 2)) 25px;
}
.portal-footer-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 25px;
}
.portal-footer-grid h3 {
  color: #fff;
  font-size: 18px;
  font-weight: 400;
  margin: 0 0 30px;
}
.portal-footer-grid p {
  display: block;
  font-size: 13px;
  margin: 0 0 18px;
  color: #999;
}
.portal-footer-bottom {
  border-top: 1px solid #252525;
  padding: 28px 15px 0;
  font-size: 12px;
}
@media (max-width: 900px) {
  .portal-hero-inner {
    grid-template-columns: 1fr 1fr;
  }
  .portal-hero-art {
    transform: scale(0.75);
    transform-origin: left center;
  }
  .portal-industry-panel {
    grid-template-columns: 175px minmax(0, 1fr) 190px;
  }
  .portal-industry-photo {
    width: 165px;
    height: 300px;
  }
  .portal-feature-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 650px) {
  .buyer-header-inner {
    width: calc(100% - 30px);
  }
  .portal-hero {
    height: auto;
    min-height: 620px;
  }
  .portal-hero-inner {
    width: calc(100% - 36px);
    display: block;
    padding-top: 85px;
  }
  .portal-hero-copy > p {
    font-size: 14px;
  }
  .portal-hero-art {
    transform: scale(0.55);
    transform-origin: top left;
    margin-top: 20px;
    height: 305px;
  }
  .portal-section {
    width: calc(100% - 30px);
  }
  .portal-industry {
    padding-top: 70px;
  }
  .portal-industry-panel {
    height: auto;
    margin-top: 40px;
    display: block;
  }
  .portal-industry-examples {
    padding: 28px 22px;
  }
  .portal-industry-examples article p {
    margin-left: 0;
  }
  .portal-industry-photo {
    display: none;
  }
  .portal-feature-grid,
  .portal-step-grid,
  .portal-news-grid {
    grid-template-columns: 1fr;
  }
  .portal-feature-grid article {
    height: auto;
  }
  .portal-news {
    padding-top: 90px;
  }
  .portal-section-title h2 {
    font-size: 25px;
  }
  .portal-section-title p {
    font-size: 14px;
  }
  .portal-footer-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* 自有品牌：页头图标和浏览器标签图标分别在店铺设置中配置。 */
.site-brand-logo {
  display: block;
  height: 50px;
  width: auto;
  object-fit: contain;
}
.image-settings-row {
  display: grid;
  grid-template-columns: 120px 190px 130px;
  gap: 18px;
  width: max-content;
  max-width: calc(100% - 151px);
  margin: 0 0 22px 151px;
}
.shop-settings-form .image-settings-row .image-settings-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 9px;
  min-width: 0;
  margin: 18px 0 0;
}
.shop-settings-form .image-settings-item > span {
  width: auto;
  padding-top: 0;
  text-align: left;
  white-space: nowrap;
}
.image-upload-card-wide {
  width: 170px;
}

/* 统一操作提示的位置与原站顶部居中提示框一致。 */
.login-toast {
  display: none;
}
@media (max-width: 600px) {
  .image-settings-row {
    display: flex;
    gap: 18px;
    max-width: 100%;
    margin-left: 0;
    overflow-x: auto;
    padding-bottom: 8px;
  }
  .shop-settings-form .image-settings-row .image-settings-item {
    flex: 0 0 190px;
  }
}

/* 买家店铺与独立商品页 */
.shop-custom-link {
  align-items: center;
  width: max-content;
  max-width: 100%;
  gap: 5px;
}
.shop-settings-form .shop-link-icon-file {
  display: none;
}
@font-face {
  font-family: URWGeometricCondW01-Heavy;
  src: url("/app/assets/urw-geometric-heavy-DKuWbazM.ttf") format("truetype");
  font-display: swap;
}
.shop-profile-actions {
  gap: 8px;
}
.shop-action-wrap {
  position: relative;
  display: inline-flex;
}
.shop-action-popover {
  position: absolute;
  z-index: 25;
  top: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
  min-width: 124px;
  padding: 9px 12px;
  border: 1px solid #eef0f3;
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 5px 15px #1e2d491c;
  white-space: nowrap;
}
.shop-share-popover {
  min-width: 148px;
}
.buyer-category-image {
  flex: none;
  width: 42px;
  height: 42px;
  object-fit: cover;
  border-radius: 5px;
  background: #fff;
}
.buyer-goods-grid {
  grid-template-columns: repeat(4, 218px);
  gap: 12px;
}
.buyer-select-title {
  margin-bottom: 19px;
}
.buyer-good-content {
  height: 104px;
  padding: 12px 14px;
}
.buyer-good-content h2 {
  color: #4e5969;
  font-size: 12.5px;
  font-weight: 500;
}
.buyer-good-bottom {
  margin-left: 2px;
}
.buyer-good-prices {
  display: flex;
  align-items: baseline;
  gap: 8px;
  white-space: nowrap;
}
.buyer-good-bottom strong {
  color: #165dff;
  font-family: URWGeometricCondW01-Heavy, sans-serif;
  font-size: 18px;
  line-height: 22px;
}
.buyer-good-prices del {
  color: #9ba6b6;
  font-size: 12px;
  line-height: 16px;
}
.buyer-good-bottom small {
  padding: 2px 8px;
  border-radius: 4px;
  background: #f0f7ff;
  color: #2275ff;
  font-size: 10px;
}
.buyer-goods-grid.is-text-only {
  grid-template-columns: repeat(4, 216px);
  gap: 13px;
}
.resource-shop .buyer-goods-grid.is-resource {
  grid-template-columns: repeat(auto-fill, 210px);
}
.buyer-goods-grid.is-resource .buyer-good-image {
  height: 208px;
}
.resource-shop .buyer-controls {
  border-bottom: 0;
}
.buyer-goods-grid.is-resource .buyer-good-content {
  height: 110px;
}
.resource-category-tag {
  align-self: flex-start;
  display: inline-block;
  width: fit-content;
  padding: 2px 7px;
  background: #f5f7fa;
  color: #86909c;
  font-size: 11px;
  line-height: 16px;
}
.buyer-goods-grid.is-resource .buyer-good-bottom strong {
  color: #ff4d4f;
}
.buyer-goods-grid.is-text-only .buyer-good-content {
  height: 100%;
}
.buyer-goods-grid.with-card-marketing .buyer-good-content {
  height: 104px;
}
.buyer-goods-grid.with-card-marketing.is-text-only .buyer-good-content {
  height: 100%;
}
.buyer-goods-grid.is-resource .buyer-good-prices {
  flex-wrap: wrap;
  gap: 4px 8px;
  white-space: normal;
}
.purchase-coupon-row {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 64px;
  border-bottom: 1px solid #eef0f4;
}

.standalone-good-page {
  min-height: 100vh;
  padding: 18px 20px 96px;
  background: #f8f9fb;
  color: #252b37;
}
.standalone-good-layout {
  display: grid;
  grid-template-columns: 200px minmax(0, 780px);
  align-items: start;
  gap: 16px;
  width: min(1120px, 100%);
  margin: 0 auto;
}
.standalone-good-sidebar {
  padding-top: 96px;
}
.standalone-store-card {
  position: relative;
  min-height: 279px;
  padding: 34px 18px 17px;
  border: 1px solid #eceef2;
  border-radius: 12px;
  background: #fff;
  text-align: center;
}
.standalone-store-avatar {
  position: absolute;
  top: -25px;
  left: calc(50% - 25px);
  width: 50px;
  height: 50px;
  object-fit: contain;
  border: 1px solid #eceef2;
  border-radius: 50%;
  background: #fff;
  padding: 5px;
}
.standalone-qr {
  display: block;
  width: 132px;
  height: 132px;
  margin: 18px auto 6px;
  image-rendering: pixelated;
}
.standalone-store-card p {
  margin: 5px 0 0;
  color: #646b76;
  font-size: 12px;
  line-height: 23px;
}
.standalone-good-card {
  min-height: 630px;
  padding: 24px 24px 38px;
  border-radius: 17px;
  background: #fff;
}
.standalone-good-card .standalone-good-title {
  width: max-content;
  max-width: 100%;
}
.standalone-good-hero {
  display: flex;
  align-items: flex-start;
  gap: 24px;
}
.standalone-good-image {
  flex: none;
  width: 180px;
  height: 180px;
  border: 1px solid #e9edf3;
  border-radius: 9px;
  overflow: hidden;
  background: #fff;
}
.standalone-good-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.standalone-good-hero-info {
  min-width: 0;
}
.standalone-good-price {
  display: flex;
  align-items: baseline;
  gap: 12px;
  color: #f43f48;
  font-size: 30px;
  font-weight: 700;
  line-height: 1;
}
.standalone-good-reference-price {
  color: #9ba6b6;
  font-size: 14px;
  font-weight: 400;
  line-height: 18px;
}
.standalone-good-price small {
  font-size: 15px;
  margin-right: 2px;
}
.standalone-tags {
  margin-top: 11px;
}
.standalone-seller {
  display: flex;
  align-items: center;
  gap: 13px;
  height: 78px;
  margin-top: 16px;
  padding: 12px 20px;
  border-radius: 9px;
  background: #f7f8fa;
}
.standalone-seller > img {
  width: 44px;
  height: 44px;
  object-fit: contain;
}
.standalone-seller-info {
  min-width: 0;
}
.standalone-seller-name-row {
  display: flex;
  align-items: center;
  gap: 3px;
}
.standalone-seller-contact {
  position: relative;
}
.standalone-seller-contact-popover {
  position: absolute;
  z-index: 12;
  top: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
  min-width: 120px;
  padding: 13px 16px;
  border: 1px solid #e9edf3;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 7px 24px #25334c1c;
}
.standalone-seller-contact-popover img {
  width: 16px;
  height: 16px;
  object-fit: contain;
}
.standalone-seller p {
  margin: 5px 0 0;
  color: #8c96a4;
  font-size: 12px;
}
.standalone-description {
  margin-top: 20px;
  padding-top: 17px;
  border-top: 1px solid #e6e9ef;
  font-size: 13px;
}
.standalone-description strong {
  color: #66778f;
  font-weight: 400;
}
.standalone-description-heading {
  display: flex;
  align-items: center;
  gap: 5px;
}
.standalone-description-heading svg {
  color: #6296f8;
}
.standalone-description p {
  min-height: 52px;
  margin: 14px 0 6px;
  white-space: pre-line;
  color: #66778f;
}
.standalone-price-statement {
  margin: 8px 0 12px;
  padding: 19px 34px;
  border-top: 1px solid #e5e6eb;
  border-radius: 2px;
  background: #f5f6f8;
}
.standalone-price-statement p {
  min-height: 0;
  margin: 0 0 12px;
  color: #86909c;
  font-size: 12px;
  line-height: 1.5;
  white-space: normal;
}
.standalone-price-statement p:last-child {
  margin-bottom: 0;
}
.standalone-coupon-row {
  min-height: 56px;
}
.standalone-contact {
  justify-content: flex-start;
  height: 65px;
  padding: 13px 0;
}
.standalone-pay {
  margin-top: 16px;
}
.standalone-purchase-bar {
  position: fixed;
  z-index: 10;
  bottom: 0;
  left: 0;
  right: 0;
  height: 62px;
  border-top: 1px solid #eceef2;
  background: #fff;
}
.standalone-purchase-bar > div {
  display: flex;
  align-items: center;
  width: min(780px, calc(100% - 32px));
  height: 100%;
  margin: 0 auto;
  gap: 24px;
}
.standalone-purchase-bar strong {
  margin-left: 72px;
  margin-right: auto;
  color: #1762ff;
  font-size: 22px;
}
@media (max-width: 800px) {
  .buyer-goods-grid,
  .buyer-goods-grid.is-text-only {
    grid-template-columns: repeat(2, minmax(0, 218px));
  }
  .standalone-good-layout {
    grid-template-columns: 1fr;
  }
  .standalone-good-sidebar {
    order: 2;
    max-width: 240px;
    padding-top: 30px;
    margin: 0 auto;
  }
  .standalone-good-card {
    order: 1;
    min-height: 0;
  }
}
@media (max-width: 500px) {
  .shop-custom-link {
    width: 100%;
    flex-wrap: wrap;
  }
  .buyer-goods-grid,
  .buyer-goods-grid.is-text-only {
    grid-template-columns: 1fr;
  }
  .standalone-good-page {
    padding: 12px 12px 90px;
  }
  .standalone-good-card {
    padding: 20px 16px;
  }
  .standalone-good-hero {
    flex-direction: column;
    gap: 16px;
  }
  .standalone-good-image {
    width: min(180px, 100%);
  }
  .standalone-purchase-bar > div {
    gap: 10px;
  }
  .standalone-purchase-bar strong {
    margin-left: 0;
  }
}
/* 知识商品发布与阅读 */
.knowledge-publish-page .card-publish-control,
.knowledge-publish-page .card-publish-prices {
  max-width: 695px;
}
.knowledge-segments {
  display: inline-flex;
  width: max-content;
  padding: 3px;
  background: #f2f3f5;
  border-radius: 2px;
}
.knowledge-chapter-list {
  margin: 0 0 24px 116px;
  text-align: center;
}
.knowledge-chapter-empty {
  min-height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  color: #a4aab6;
  font-size: 13px;
}
.knowledge-chapter-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border-bottom: 1px solid #eef0f4;
  text-align: left;
}
.knowledge-chapter-row strong {
  flex: 1;
  font-weight: 400;
  overflow-wrap: anywhere;
}
.knowledge-chapter-row small {
  color: #86909c;
}
.knowledge-chapter-form {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
}
.knowledge-chapter-form > small {
  color: #86909c;
}
.knowledge-media-fields {
  width: 356px;
  max-width: 100%;
}
.knowledge-media-input {
  display: none;
}
.knowledge-media-dropzone {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 22px;
  width: 100%;
  height: 166px;
  padding: 16px;
  border: 1px dashed #e5e6eb;
  border-radius: 0;
  background: #f7f8fa;
  color: #4e5969;
  font-size: 14px;
  cursor: pointer;
}
@media (min-width: 761px) {
  .knowledge-media-dropzone:hover {
    border-color: #165dff;
    background: #f2f3f5;
  }
}
.knowledge-media-dropzone.is-dragging {
  border-color: #165dff;
  background: #f2f3f5;
}
.knowledge-media-dropzone:disabled {
  cursor: default;
}
.knowledge-media-plus {
  color: #86909c;
  font-size: 22px;
  line-height: 24px;
}
.knowledge-media-progress {
  color: #165dff;
  font-size: 22px;
}
.knowledge-media-dropzone progress {
  width: 80%;
  height: 4px;
  accent-color: #165dff;
}
.knowledge-media-filename {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.knowledge-media-dropzone small {
  color: #86909c;
  font-size: 12px;
}
.knowledge-media-duration {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  color: #4e5969;
  font-size: 14px;
  white-space: nowrap;
}
:is(.knowledge-shop, .resource-shop) .buyer-controls {
  padding: 20px 0 16px;
  border: 0;
}
:is(.knowledge-shop, .resource-shop) .buyer-category-image {
  width: 15px;
  height: 15px;
  background: transparent;
  border-radius: 0;
}
.buyer-knowledge-cover {
  display: block;
  width: 160px;
  height: 110px;
  object-fit: contain;
  object-position: left center;
  margin-bottom: 16px;
}
.buyer-knowledge-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #86909c;
  font-size: 12px;
  flex-wrap: wrap;
}
.buyer-knowledge-price {
  margin-right: auto;
  color: #f43f48;
  font-family: URWGeometricCondW01-Heavy, sans-serif;
  font-size: 18px;
  line-height: 22px;
}
.payment-settings-form {
  max-width: 820px;
  padding-top: 24px;
}
.payment-setting-row {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  margin-bottom: 22px;
}
.payment-setting-row > span {
  flex: 0 0 110px;
  text-align: right;
  padding-top: 8px;
}
.payment-certificate-input {
  flex: 1;
  min-width: 0;
  width: 100%;
}
.payment-setting-row .radio-options {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  padding-top: 7px;
}
.payment-channel-table-wrap {
  width: 100%;
  overflow-x: auto;
  margin-top: 22px;
}
.payment-channel-name {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
}
.payment-channel-name img {
  width: 20px;
  height: 20px;
  object-fit: contain;
}
.payment-mode-tags {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 7px;
}
.payment-account-status {
  color: #909399;
}
.payment-account-status.configured {
  color: #52a66b;
}
.payment-config-dialog .payment-settings-form {
  max-width: none;
  padding-top: 8px;
}
.payment-config-dialog .payment-setting-row {
  flex-direction: column;
  gap: 10px;
  margin-bottom: 20px;
}
.payment-config-dialog .payment-setting-row > span {
  flex-basis: auto;
  padding: 0;
  text-align: left;
  color: #606266;
}
.payment-config-dialog .radio-options {
  padding: 0;
  gap: 16px;
}
.payment-config-dialog .payment-certificate-input {
  display: flex;
}
.payment-certificate-upload {
  position: relative;
  padding: 8px 14px;
  background: #f5f7fa;
  border: 1px solid #dcdfe6;
  border-left: 0;
  color: #909399;
  cursor: pointer;
  white-space: nowrap;
}
@media (min-width: 761px) {
  .payment-certificate-upload:hover {
    color: #409eff;
  }
}
.payment-config-dialog .payment-setting-row > small,
.payment-config-dialog .section-muted {
  color: #909399;
  font-size: 12px;
  line-height: 1.6;
}
.payment-order-main {
  max-width: 820px;
}
.buyer-order-detail-main {
  max-width: 1104px;
  padding-top: 16px;
  padding-bottom: 60px;
}
.buyer-page:has(.buyer-order-detail-main),
.after-sales-page {
  background: #f5f6f8;
}
.buyer-order-details,
.after-sales-main {
  background: white;
  border-radius: 8px;
  color: #4e5969;
}
.buyer-order-details > header,
.after-sales-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  color: #1d2129;
}
.buyer-order-details-body {
  padding: 30px 32px 32px;
}
.buyer-order-details h2 {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--heading-section-size);
  font-weight: var(--heading-weight);
  margin: 0 0 20px;
  line-height: 1.5;
}
.buyer-order-details h2 svg {
  color: #3370ff;
}
.buyer-order-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 48px;
  margin: 0 0 68px;
  font-size: 14px;
}
.buyer-order-info-grid > div {
  display: flex;
  gap: 8px;
  min-width: 0;
}
.buyer-order-info-grid dt {
  flex-shrink: 0;
  color: #86909c;
}
.buyer-order-info-grid dd {
  margin: 0;
  overflow-wrap: anywhere;
}
.buyer-order-status-tag {
  padding: 3px 8px;
  background: #f2f3f5;
  font-size: 12px;
}
.buyer-order-status-tag.paid {
  background: #e8ffea;
  color: #00b42a;
}
.buyer-order-delivery-title {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: baseline;
}
.buyer-order-delivery-title > div {
  display: flex;
  gap: 28px;
}
.buyer-delivered-cards {
  background: #f7f7f7;
  border-radius: 8px;
  margin-bottom: 12px;
}
.buyer-delivered-card {
  padding: 12px 16px;
}
.buyer-delivered-card > div {
  display: flex;
  justify-content: space-between;
}
.buyer-delivered-card strong {
  font-size: 13px;
}
.buyer-delivered-card pre {
  font: inherit;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  margin: 14px 0 0;
  user-select: text;
}
.buyer-order-instructions {
  margin-top: 44px;
  min-height: 140px;
}
.buyer-order-contact {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  padding: 20px 16px;
  background: #f7f7f7;
  border-radius: 8px;
  margin-bottom: 12px;
}
.buyer-order-contact > span {
  color: #86909c;
}
.buyer-order-contact strong {
  font-weight: 400;
  color: #3370ff;
  overflow-wrap: anywhere;
}
.after-sales-main {
  width: calc(100% - 32px);
  max-width: 1104px;
  margin: 24px auto 60px;
  min-height: 680px;
}
.after-sales-form {
  width: 632px;
  max-width: 100%;
  padding: 28px 0 30px 34px;
}
.after-sales-row {
  display: grid;
  grid-template-columns: 108px minmax(0, 475px);
  gap: 16px;
  margin-bottom: 20px;
  align-items: start;
}
.after-sales-row > span:first-child {
  padding-top: 8px;
  text-align: right;
  color: #4e5969;
}
.after-sales-row small {
  display: block;
  margin-top: 5px;
  color: #86909c;
  font-size: 12px;
  line-height: 1.6;
}
.after-sales-description {
  position: relative;
}
.after-sales-description small {
  position: absolute;
  right: 12px;
  bottom: 5px;
}
.complaint-images {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.complaint-image-preview {
  position: relative;
  width: 80px;
  height: 80px;
  background: #f2f3f5;
  border: 1px dashed #e2e6ec;
}
.complaint-image-preview img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.complaint-evidence {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.complaint-evidence img {
  max-width: 100%;
  max-height: 280px;
  object-fit: contain;
  border: 1px solid #edf0f5;
}
.after-sales-success,
.after-sales-query-result {
  margin: 28px 40px;
  line-height: 1.8;
  overflow-wrap: anywhere;
}
.after-sales-query-result h2 {
  font-size: 16px;
}
@media (max-width: 640px) {
  .buyer-order-details-body {
    padding: 20px 16px;
  }
  .buyer-order-info-grid {
    grid-template-columns: 1fr;
    gap: 14px;
    margin-bottom: 36px;
  }
  .buyer-order-delivery-title {
    flex-direction: column;
    margin-bottom: 20px;
  }
  .buyer-order-delivery-title h2 {
    margin-bottom: 0;
  }
  .after-sales-main {
    margin: 16px;
  }
  .after-sales-form {
    padding: 16px;
    width: 100%;
  }
  .after-sales-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .after-sales-row > span:first-child {
    text-align: left;
    padding: 0;
  }
}
.payment-order-card {
  padding: 28px;
  margin: 30px 0;
}
.payment-order-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-block: 1px solid #f0f2f5;
  margin: 24px 0;
  padding: 18px 0;
}
.payment-order-summary h2 {
  font-size: var(--heading-section-size);
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
.payment-order-summary > strong {
  color: #f43f48;
  font-size: 26px;
}
.payment-order-status {
  color: #165dff;
  font-weight: 600;
}
.payment-order-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin: 20px 0;
}
.payment-order-card .purchase-pay {
  flex-wrap: wrap;
}
.payment-qr {
  text-align: center;
  padding: 20px;
}
.payment-qr img {
  width: 240px;
  max-width: 100%;
}
.payment-delivery {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  background: #f6f7f9;
  padding: 16px;
  border-radius: 6px;
  font: inherit;
  user-select: text;
}
.payment-unlock {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  flex-wrap: wrap;
  margin: 24px 0;
}
.payment-usage {
  margin: 22px 0;
}
.buyer-card-selection {
  padding: 12px 0;
}
.buyer-card-selection > div {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  max-height: 180px;
  overflow-y: auto;
}
@media (max-width: 600px) {
  .payment-setting-row {
    flex-direction: column;
    gap: 8px;
  }
  .payment-setting-row > span {
    flex-basis: auto;
    text-align: left;
  }
  .payment-order-card {
    padding: 20px;
  }
}
.buyer-knowledge-price del {
  color: #9ba6b6;
  font-size: 12px;
  font-weight: 400;
  margin-left: 5px;
}
.buyer-knowledge-meta small {
  padding: 3px 8px;
  background: #f5f6f8;
  border: 1px solid #f0f0f0;
  border-radius: 2px;
}
.buyer-knowledge-meta img {
  width: 22px;
  height: 22px;
  object-fit: contain;
}
:is(.knowledge-shop, .resource-shop) .buyer-shop-end {
  border: 0;
}
.knowledge-reader {
  margin-top: 24px;
  font-size: 14px;
  color: #4e5969;
}
.knowledge-description {
  width: 100%;
}
.knowledge-paid-section {
  display: flow-root;
  scroll-margin-top: 20px;
}
.knowledge-paid-label {
  display: inline-block;
  margin-top: 4px;
  background: #f0f7ff;
  color: #2275ff;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
}
.knowledge-content-summary {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 12px;
  padding: 12px;
  border: 1px solid #f2f3f5;
  background: #f7f8fa;
  border-radius: 8px;
  color: #4e5969;
  line-height: 22px;
}
.knowledge-summary-text-icon {
  font-family: Georgia, serif;
  text-decoration: underline;
  font-size: 13px;
}
.knowledge-article .rich-product-content {
  display: flow-root;
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: #333;
}
.knowledge-article .rich-product-content p,
.knowledge-article .rich-product-content li {
  line-height: 1.5;
}
.knowledge-article .rich-product-content p {
  margin: 15px 0;
}
.standalone-good-card .knowledge-article .rich-product-content h2 {
  font-size: 1.5em;
}
.standalone-good-card .knowledge-article .rich-product-content h3 {
  font-size: 1.17em;
}
.knowledge-course {
  margin-top: 24px;
  font-size: 14px;
}
.knowledge-course-statistics {
  display: inline-flex;
  margin-top: 16px;
  padding: 10px;
  background: #f7f9fa;
  border-radius: 8px;
}
.knowledge-course-statistics > div {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 88px;
  font-size: 12px;
  line-height: 1.5715;
}
.knowledge-course-statistics strong {
  color: #1d2129;
  font-weight: 600;
}
.knowledge-course-statistics strong.primary {
  color: #165dff;
}
.knowledge-course-statistics span {
  color: #86909c;
  margin-top: 2px;
}
.knowledge-course-purchased {
  margin-top: 16px;
}
.knowledge-course-purchased > span {
  display: inline-flex;
  padding: 0 8px;
  color: #00b42a;
  background: #e8ffea;
  font-size: 12px;
  line-height: 22px;
  border: 1px solid transparent;
  border-radius: 2px;
}
.knowledge-course-directory,
.knowledge-course-intro {
  scroll-margin-top: 20px;
}
.knowledge-course-icon {
  flex-shrink: 0;
  margin: 4px 8px 0 0;
}
.knowledge-course-center {
  flex: 1;
  min-width: 0;
}
.knowledge-course-name {
  display: block;
  color: #4e5969;
  font-weight: 500;
  overflow-wrap: anywhere;
}
.knowledge-course-meta {
  display: block;
  margin-top: 8px;
  color: #86909c;
  font-size: 12px;
}
.knowledge-course-action {
  display: flex;
  align-items: center;
  padding-left: 12px;
  flex-shrink: 0;
}
.knowledge-course-lock {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #f7f8fa;
  color: #c9cdd4;
}
.knowledge-course-lock.unlocked {
  color: #4e5969;
  background: #f2f3f5;
}
.knowledge-course-preview {
  display: inline-flex;
  align-items: center;
  height: 24px;
  padding: 0 12px;
  border-radius: 12px;
  color: #00b42a;
  background: #e8ffea;
  font-size: 12px;
}
.knowledge-course-intro-label {
  display: flex;
  align-items: center;
  padding: 16px 0;
}
.knowledge-course-intro-label > span {
  margin-top: 4px;
  padding: 4px 8px;
  color: #2275ff;
  font-size: 12px;
  line-height: 1.5715;
  background: #f0f7ff;
  border-radius: 4px;
}
.knowledge-course-intro {
  width: 100%;
}
.knowledge-reading-dialog {
  border-radius: 8px;
}
.knowledge-reading-container {
  position: relative;
  padding: 16px;
  background: #fafafa;
  border-radius: 0 0 16px 16px;
}
.knowledge-chapter-content {
  padding: 8px;
  border-radius: 4px;
  box-shadow:
    0 10px 30px #0000001a,
    inset 0 0 20px #fff;
  background: #fff;
}
.knowledge-reading-audio {
  padding: 35px;
  background: #eef5fa;
}
.knowledge-chapter-content video,
.knowledge-chapter-content audio {
  display: block;
  width: 100%;
  max-height: 480px;
}
.knowledge-purchase-dialog {
  border-radius: 15px;
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  overflow: hidden;
}
.knowledge-purchase-dialog h2 {
  font-size: 17px;
}
@media (max-width: 650px) {
  .knowledge-chapter-list {
    margin-left: 0;
  }
  .knowledge-chapter-row {
    flex-wrap: wrap;
  }
  .knowledge-chapter-row small {
    width: 100%;
  }
  .buyer-knowledge-meta {
    gap: 8px;
  }
  .knowledge-course-statistics {
    display: flex;
    width: 100%;
    padding: 12px 0;
    justify-content: space-around;
  }
  .knowledge-course-statistics > div {
    width: auto;
    font-size: 11px;
  }
  .knowledge-course-statistics span {
    margin-top: 4px;
    color: #9b9b9f;
  }
  .knowledge-course-name {
    color: #111;
    font-size: 13px;
    font-weight: 700;
  }
  .knowledge-course-meta {
    margin-top: 4px;
    color: #9b9b9f;
  }
  .knowledge-course-icon {
    width: 14px;
    height: 14px;
    margin: 4px 6px 0 0;
  }
  .knowledge-course-action {
    padding: 4px;
  }
  .knowledge-course-lock {
    width: 24px;
    height: 24px;
    color: #4e5969;
  }
  .knowledge-course-preview {
    width: 50px;
    padding: 0;
    justify-content: center;
    color: #2275ff;
    background: #e5ebf7;
    font-size: 11px;
    font-weight: 700;
  }
  .knowledge-reading-audio {
    padding: 20px 8px;
  }
}
.sales-page {
  display: grid;
  gap: 16px;
}
.sales-tabs {
  display: flex;
  align-items: stretch;
  gap: 32px;
  min-height: 56px;
  padding: 0 26px;
}
.sales-panel {
  min-height: 592px;
  padding: 20px;
}
.sales-heading {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 32px;
}
.sales-heading small {
  padding: 3px 7px;
  background: #f1f2f5;
  color: #667487;
  font-size: 11px;
}
.sales-loading {
  padding: 70px 0;
  color: #86909c;
  text-align: center;
}
.sales-periods {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.sales-periods {
  margin: 13px 0 14px 26px;
}
.sales-metrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 20px;
  padding: 0 26px;
}
.sales-metric strong {
  display: block;
  margin-bottom: 13px;
  font-size: 13px;
  font-weight: 600;
  color: #111827;
}
.sales-metric > div {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #111827;
  font-size: 27px;
  line-height: 1;
}
.sales-metric-icon {
  display: inline-grid;
  place-items: center;
  width: 31px;
  height: 31px;
  border-radius: 5px;
}
.sales-metric-icon.green {
  color: #10c65c;
  background: #dcf8e7;
}
.sales-metric-icon.cyan {
  color: #10c7cf;
  background: #ddfaf8;
}
.sales-metric-icon.blue {
  color: #287dff;
  background: #e6f0ff;
}
.sales-metric-icon.orange {
  color: #ff831c;
  background: #fff0dd;
}
.sales-metric-icon.purple {
  color: #9646ff;
  background: #f0e6ff;
}
.sales-chart-scroll {
  width: 100%;
  overflow-x: auto;
}
.sales-chart {
  display: block;
  width: 100%;
  min-width: 750px;
  height: 320px;
}
.sales-chart text {
  fill: #677487;
  font-size: 11px;
}
.sales-report-scroll {
  width: 100%;
  overflow-x: auto;
  margin-top: 20px;
}
@media (max-width: 900px) {
  .sales-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    row-gap: 20px;
  }
}
@media (max-width: 600px) {
  .sales-panel {
    padding: 16px;
  }
  .sales-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 0 6px;
  }
  .sales-periods {
    margin-left: 0;
  }
  .sales-metric > div {
    font-size: 23px;
  }
  .sales-heading small {
    display: none;
  }
}
.email-notice-page {
  min-height: 685px;
  padding: 20px;
}
.email-notice-content {
  margin: 8px 0 0 80px;
}
.email-notice-form {
  display: grid;
  justify-items: start;
  gap: 8px;
  width: 360px;
  max-width: 100%;
}
.email-notice-bound {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 1px 0 4px;
}
.email-notice-bound span {
  padding: 5px 9px;
  background: #e6fbeb;
  color: #12bd51;
  font-size: 12px;
}
.email-notice-options {
  margin-top: 28px;
}
.email-notice-option {
  margin: 0 0 24px;
  color: #38475c;
  font-size: 13px;
}
.email-notice-option > div {
  display: flex;
  align-items: center;
  gap: 14px;
}
.email-notice-option > div > span {
  min-width: 56px;
}
.email-notice-option p {
  margin: 8px 0 0 72px;
  color: #8999b3;
  font-size: 12px;
}
@media (max-width: 700px) {
  .email-notice-page {
    min-height: 0;
    padding: 16px;
  }
  .email-notice-content {
    margin-left: 0;
  }
}

.cards-add-page {
  gap: 16px;
  color: #1d2638;
  font-size: 13px;
}
.cards-add-breadcrumb {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 58px;
  padding: 0 20px;
}
.cards-add-breadcrumb span {
  color: #c9cdd4;
}
.cards-add-panel {
  padding: 20px 20px 24px;
}
.cards-add-main {
  padding: 0 0 25px;
}
.cards-add-warning {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 40px;
  margin-bottom: 17px;
  padding: 8px 16px;
  background: #fff7e8;
  color: #1d2638;
  line-height: 1.5;
}
.cards-add-warning span {
  display: inline-grid;
  place-items: center;
  flex: none;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #ff8b00;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
}
.cards-add-label {
  display: block;
  margin: 0 0 10px;
}
.cards-product-select {
  margin-bottom: 20px;
}
.cards-add-options {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  min-height: 51px;
}
.cards-add-submit {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 54px;
}
.cards-helper h2 {
  margin: 0;
  padding: 0 16px 12px;
  border-bottom: 1px solid #e5e8ef;
  font-size: var(--heading-section-size);
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
.cards-helper-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 16px;
}
.cards-tool-form {
  display: grid;
  gap: 18px;
}
.cards-tool-type-row {
  display: grid;
  grid-template-columns: 85px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  color: #4e5969;
  text-align: right;
}
.cards-tool-types {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  text-align: left;
}
@media (max-width: 650px) {
  .cards-tool-type-row {
    grid-template-columns: 75px minmax(0, 1fr);
    gap: 9px;
  }
  .cards-tool-types {
    gap: 10px;
  }
  .cards-add-panel {
    padding: 16px 12px;
  }
  .cards-add-warning {
    align-items: flex-start;
  }
  .cards-add-warning span {
    margin-top: 2px;
  }
  .cards-helper h2 {
    padding-left: 0;
  }
  .cards-helper-buttons {
    padding: 14px 0;
  }
}
.buyer-contact-qq-icon {
  width: 16px;
  height: 16px;
  object-fit: contain;
}
.payment-account-hint {
  background: #fff8e6;
  color: #faad14;
  padding: 12px 16px;
  margin: 0 0 20px;
}
.payment-account-actions {
  text-align: right;
  white-space: nowrap;
}
.payment-config-error {
  color: #ed4014;
  background: #fff2f0;
  padding: 10px;
}
.payment-test-amount {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 20px 16px 32px;
}
.payment-test-links {
  display: flex;
  gap: 12px;
}
.payment-test-qr {
  border-top: 1px solid #ebeef5;
  margin-top: 12px;
  padding-top: 14px;
}
.payment-test-qr img {
  display: block;
  width: min(280px, 100%);
  margin: 32px auto;
}

.cashier-page {
  background: #f5f5f5;
  min-height: 100vh;
}
.cashier-page .payment-cashier-main {
  width: calc(100% - 32px);
  max-width: 1140px;
  margin: 30px auto 60px;
  padding: 0;
}
.cashier-page .wechat-cashier {
  width: 100%;
  max-width: none;
}
.cashier-page .wechat-cashier-header {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 64px;
  padding: 0 15px;
  color: #4371ff;
}
.cashier-page .wechat-cashier-header > span {
  background: #4371ff;
  color: white;
  font-size: 14px;
  width: 26px;
  height: 23px;
  border-radius: 5px;
  display: grid;
  place-items: center;
  position: relative;
}
.cashier-page .wechat-cashier-header > span::after {
  content: "";
  position: absolute;
  width: 12px;
  height: 3px;
  background: #4371ff;
  bottom: -5px;
  border-radius: 2px;
}
.cashier-page .wechat-cashier-card {
  border-radius: 14px;
  background: white;
  padding: 40px 15px 50px;
  box-shadow: none;
  min-height: 640px;
  text-align: center;
}
.cashier-page .wechat-cashier-tip {
  margin: 0 0 32px;
  font-size: 18px;
  line-height: 26px;
  color: #515a6e;
  font-weight: 600;
}
.cashier-page .wechat-cashier-tip strong {
  color: #426aff;
}
.cashier-page .wechat-cashier-order {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 32px;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto;
  padding: 12px 14px;
  background: #fafafa;
  color: #909399;
  font-size: 14px;
  border-radius: 5px;
  flex-wrap: wrap;
  overflow-wrap: anywhere;
}
.cashier-page .wechat-cashier-goods {
  font-size: 12px;
  margin: 22px 0 20px;
  color: #909399;
}
.cashier-page .wechat-cashier-goods span {
  margin-left: 22px;
}
.cashier-page .wechat-cashier-divider {
  height: 1px;
  background: #f1f2f4;
  margin: 0 0 27px;
}
.cashier-page .wechat-cashier-method {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  margin: 0 0 10px;
  color: #515a6e;
}
.cashier-page .wechat-cashier-method img {
  width: 23px;
  height: 23px;
}
.cashier-page .wechat-cashier-qr {
  width: 208px;
  height: 208px;
  border: 5px solid #f8f8f8;
  border-radius: 5px;
  padding: 4px;
  margin: 0 auto;
  background: white;
}
.cashier-page .wechat-cashier-qr img {
  width: 190px;
  height: 190px;
  display: block;
}
.cashier-page .wechat-cashier-amount {
  color: #426aff;
  font-size: 28px;
  font-weight: 600;
  line-height: 40px;
  margin: 26px 0 32px;
}
.cashier-page .wechat-cashier-amount span {
  font-size: 18px;
}
.cashier-page .wechat-cashier-status {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: #909399;
  font-size: 14px;
  margin: 0;
}
.cashier-page .wechat-cashier-status i {
  width: 20px;
  height: 20px;
  border: 3px solid #e5e5e5;
  border-left-color: transparent;
  border-radius: 50%;
  animation: wechat-cashier-spin 1s linear infinite;
}
@media (max-width: 640px) {
  .cashier-page .payment-cashier-main {
    margin-top: 8px;
  }
  .cashier-page .wechat-cashier-card {
    padding-top: 28px;
  }
  .cashier-page .wechat-cashier-tip {
    font-size: 15px;
  }
  .cashier-page .wechat-cashier-order {
    gap: 8px;
    font-size: 12px;
  }
}
.cashier-page .wechat-cashier-order {
  line-height: 18px;
}
.cashier-page .wechat-cashier-status {
  line-height: 26px;
}
.wechat-cashier-actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
}
.wechat-cashier-error {
  color: #d43f3f;
  margin: 16px 0 0;
}
@keyframes wechat-cashier-spin {
  to {
    transform: rotate(360deg);
  }
}
/* Interface hierarchy. Product descriptions and article typography keep their own scale. */
:root {
  --heading-page-size: 18px;
  --heading-section-size: 16px;
  --heading-small-size: 14px;
  --heading-dialog-size: 18px;
  --heading-weight: 600;
  --heading-color: #1d2129;
}

.order-detail-content :is(h3, h4) {
  color: var(--heading-color);
}

.detail-delivery h4 {
  font-size: var(--heading-small-size);
  font-weight: var(--heading-weight);
  line-height: 1.5;
}

.goods-type-count {
  font-size: 13px;
  font-weight: 400;
}

.merchant-sidebar .sub-nav h2 {
  font-size: var(--heading-page-size);
  font-weight: var(--heading-weight);
  line-height: 1.5;
  color: var(--heading-color);
}

.merchant-sidebar .sub-heading {
  font-size: 13px;
  font-weight: var(--heading-weight);
  color: #4e5969;
}

/* Titles inside compact headers do not add a second row of spacing. */

/* Route-scoped, including dialogs teleported to body. Buyer controls keep their own styles. */
html.merchant-interface .email-binding-step {
  margin: 0 0 6px;
  color: #86909c;
  font-size: 13px;
}
@media (min-width: 769px) {
  html.merchant-workspace,
  html.merchant-workspace body,
  html.merchant-workspace #app {
    height: 100%;
    overflow: hidden;
  }
  html.merchant-workspace .merchant-shell {
    height: 100%;
    min-height: 0;
  }
  html.merchant-workspace .merchant-body {
    overflow: hidden;
  }
  html.merchant-workspace .merchant-main-wrap {
    min-height: 0;
    overflow: auto;
  }
  html.merchant-workspace .merchant-sidebar {
    overflow-y: auto;
  }
}
html.merchant-interface .email-binding-dialog-form {
  width: 100%;
  gap: 10px;
}
html.merchant-interface .email-binding-actions {
  margin-top: 12px;
}
html.merchant-interface .email-binding-dialog-form .email-binding-actions {
  width: 100%;
  padding-top: 18px;
  border-top: 1px solid #edf0f5;
}
html.merchant-interface .payment-test-amount {
  justify-content: center;
  padding: 12px 0 18px;
}
html.merchant-interface .payment-test-create .radio-options {
  justify-content: center;
}
html.merchant-interface .payment-test-link-label {
  display: block;
  font-size: 13px;
  font-weight: 500;
}
html.merchant-interface .payment-test-links {
  justify-content: flex-end;
}
html.merchant-interface .payment-test-qr {
  text-align: center;
  margin-top: 22px;
  padding-top: 20px;
}
html.merchant-interface .payment-test-qr p {
  margin-bottom: 12px;
  color: #4e5969;
}
html.merchant-interface .payment-test-qr img {
  width: min(216px, 100%);
  margin: 0 auto;
}
html.merchant-interface .dashboard-left {
  min-height: 0;
}
html.merchant-interface .merchant-shell {
  display: flex;
  flex-direction: column;
}
html.merchant-interface .merchant-header {
  flex: 0 0 80px;
}
html.merchant-interface .merchant-body {
  flex: 1;
  min-height: 0;
}
html.merchant-interface :is(.card-publish-actions, .category-search-row) {
  gap: 12px;
}
.marketing-panel {
  padding: 24px 20px 20px;
}
.marketing-back {
  padding: 20px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.marketing-back > span {
  color: #c9cdd4;
}
.marketing-search {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  margin: 16px 0 24px;
}
.marketing-table-scroll {
  overflow-x: auto;
}
.marketing-subline {
  display: block;
  color: #86909c;
  margin-top: 6px;
}
.marketing-dates {
  color: #86909c;
  line-height: 1.7;
  white-space: nowrap;
}
.marketing-status {
  white-space: nowrap;
}
.marketing-status::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  background: #c9cdd4;
  border-radius: 50%;
  margin-right: 4px;
}
.marketing-status.active::before {
  background: #00b42a;
}
.marketing-actions {
  text-align: right;
  min-width: 120px;
}
.marketing-empty {
  padding: 32px;
  text-align: center;
  color: #86909c;
}
.marketing-form {
  max-width: 1120px;
}
.marketing-form h2 {
  margin: 2px 0 20px;
  font-weight: 500;
  font-size: 14px;
}
.marketing-form h2:not(:first-child) {
  margin-top: 40px;
}
.marketing-form-row {
  display: grid;
  grid-template-columns: 100px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
  margin: 20px 0;
}
.marketing-form-row > span {
  text-align: right;
  line-height: 32px;
  color: #4e5969;
}
.marketing-form-row small {
  display: block;
  color: #86909c;
  font-size: 12px;
  line-height: 1.6;
  margin-top: 4px;
}
.marketing-radio-row {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
  min-height: 32px;
}
.marketing-tier {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
  min-height: 32px;
}
.marketing-selected {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 32px;
}
.marketing-submit {
  text-align: center;
  margin: 24px 0 0;
}
.marketing-create-area {
  background: linear-gradient(#f3f6ff, white);
  border-radius: 8px;
  padding: 24px;
  min-height: 230px;
}
.marketing-coupon-types {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  max-width: 1100px;
}
.marketing-coupon-types article {
  background: white;
  border: 1px solid #e5e6eb;
  padding: 18px 16px;
  border-radius: 8px;
}
.marketing-coupon-types h3 {
  font-size: 16px;
  font-weight: 500;
  margin: 0;
}
.marketing-coupon-types h3 small {
  font-size: 12px;
  background: #f2f3f5;
  color: #86909c;
  padding: 2px 5px;
}
.marketing-coupon-types p {
  color: #86909c;
  font-size: 12px;
}
.marketing-coupon-types footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 28px;
  gap: 8px;
}
.marketing-bubble {
  font-size: 12px;
  color: #165dff;
  background: #f5f8ff;
  padding: 6px 8px;
  border-radius: 20px;
}
.marketing-bubble.warm {
  color: #f53f3f;
  background: #fff5f5;
}
.marketing-picker-scroll {
  overflow: auto;
  max-height: min(55vh, 650px);
}
.marketing-picker .selected {
  background: #f7f8fa;
}
.marketing-picker .marketing-search {
  gap: 10px;
}
.marketing-codes code {
  user-select: all;
}
.marketing-code-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 20px;
}
.marketing-code-table-scroll {
  overflow: auto;
  max-height: 50vh;
}
.marketing-code-state,
.marketing-code-repeat {
  display: inline-block;
  padding: 2px 8px;
  background: #f2f3f5;
  color: #86909c;
  font-size: 12px;
  line-height: 16px;
}
.marketing-code-state.used {
  color: #f53f3f;
  background: #ffece8;
}
.marketing-code-state.available {
  color: #00b42a;
  background: #e8ffea;
}
.marketing-code-time {
  font-size: 12px;
  color: #86909c;
}
.marketing-code-actions {
  text-align: right;
}
.marketing-code-repeat.enabled {
  color: #165dff;
  background: #e8f3ff;
}
.marketing-code-readonly {
  background: #f2f3f5;
  color: #86909c;
  padding: 9px 12px;
  user-select: all;
}
.marketing-code-editor-note {
  color: #86909c;
  font-size: 12px;
  line-height: 1.8;
}
.marketing-code-editor-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 24px;
}
@media (max-width: 760px) {
  .marketing-form-row {
    grid-template-columns: 80px minmax(0, 1fr);
    gap: 10px;
  }
  .marketing-coupon-types {
    grid-template-columns: 1fr;
  }
  .marketing-radio-row {
    gap: 8px;
  }
  .marketing-panel {
    padding: 20px 12px;
  }
}
.plugin-page {
  background: #fff;
  color: var(--fk-text);
  min-width: 0;
}
.plugin-heading-actions,
.plugin-title-row,
.plugin-title-copy,
.plugin-filter-row,
.plugin-sort-row,
.plugin-card-heading,
.plugin-card-footer,
.plugin-card-tags,
.plugin-card-actions {
  display: flex;
  align-items: center;
}
.plugin-title-row,
.plugin-filter-row,
.plugin-sort-row,
.plugin-card-footer {
  justify-content: space-between;
}
.plugin-title-row {
  gap: 20px;
  padding: 22px 24px;
  border-bottom: 1px solid var(--fk-border);
}
.plugin-title-copy {
  gap: 12px;
  min-width: 0;
}
.plugin-heading-actions {
  gap: 12px;
  flex-shrink: 0;
}
.plugin-muted {
  color: var(--fk-muted);
  line-height: 1.7;
}
.plugin-page {
  padding: 0 24px 24px;
}
.plugin-title-row {
  padding: 22px 0;
}
.plugin-title-copy > span {
  color: var(--fk-muted);
  font-size: 12px;
}
.plugin-filter-row {
  gap: 18px;
  padding: 20px 0 0;
}
.plugin-search {
  display: flex;
  gap: 8px;
  width: 292px;
  flex-shrink: 0;
  margin-left: auto;
}
.plugin-sort-row {
  gap: 18px;
  margin: 12px 0 20px;
  border-bottom: 1px solid var(--fk-border);
}
.plugin-status-select {
  width: 128px;
  padding-bottom: 8px;
}
.plugin-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
.plugin-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 18px 16px 12px;
  border: 1px solid var(--fk-border);
  border-radius: var(--fk-radius);
  background: #fff;
  transition:
    border-color 0.16s,
    box-shadow 0.16s;
}
@media (min-width: 761px) {
  .plugin-card:hover {
    border-color: #d3deed;
    box-shadow: 0 4px 14px #243c6210;
  }
}
.plugin-card.is-revoked {
  background: #f2f3f5;
}
.plugin-card.is-revoked .plugin-card-main {
  visibility: hidden;
}
.plugin-revoked-message {
  position: absolute;
  inset: 16px 12px 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #6b778b;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.6;
}
.plugin-card-main {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  flex: 1;
  min-width: 0;
}
.plugin-logo {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  border-radius: var(--fk-radius);
  background: #e8f3ff;
  color: var(--fk-primary);
  font-size: 22px;
  font-weight: 500;
}
.plugin-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: inherit;
}
.plugin-card-copy {
  min-width: 0;
  flex: 1;
}
.plugin-card-heading {
  gap: 8px;
  justify-content: space-between;
  min-width: 0;
}
.plugin-card-copy h2 {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  font-size: 14px;
  font-weight: 600;
  line-height: 24px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.plugin-description {
  display: -webkit-box;
  overflow: hidden;
  margin: 6px 0;
  min-height: 36px;
  color: #4e5969;
  font-size: 12px;
  line-height: 18px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.plugin-card-error {
  margin: 10px 0 0;
  color: var(--fk-danger);
  font-size: 12px;
  overflow-wrap: anywhere;
}
.plugin-card-footer {
  gap: 8px;
  min-height: 30px;
  padding-top: 10px;
  margin-top: 16px;
  border-top: 1px solid #f2f3f5;
  flex-wrap: wrap;
}
.plugin-card-tags {
  min-width: 0;
  gap: 7px;
}
.plugin-card-meta {
  margin: 8px 0 0;
  color: var(--fk-muted);
  font-size: 12px;
  line-height: 1.5;
}
.plugin-card-actions {
  gap: 8px;
  flex-shrink: 0;
  margin-left: auto;
}
.plugin-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 320px;
  color: var(--fk-muted);
  text-align: center;
}
.plugin-empty-symbol {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  background: var(--fk-hover-bg);
  color: #c9cdd4;
  border-radius: var(--fk-radius);
}
.plugin-empty h2 {
  margin: 16px 0 6px;
  color: #4e5969;
  font-size: 14px;
  font-weight: 500;
}
.plugin-empty p {
  margin: 0 0 10px;
  font-size: 12px;
}
@media (max-width: 1200px) {
  .plugin-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .plugin-filter-row {
    flex-wrap: wrap;
  }
}
@media (max-width: 700px) {
  .plugin-page {
    padding: 0 16px 20px;
  }
  .plugin-grid {
    grid-template-columns: 1fr;
  }
  .plugin-title-row {
    padding: 20px 0;
    flex-wrap: wrap;
    gap: 14px;
  }
  .plugin-search {
    width: 100%;
  }
  .plugin-sort-row {
    flex-wrap: wrap;
    gap: 8px;
  }
}

.plugin-balance {
  font-size: 13px;
  color: var(--fk-muted);
  white-space: nowrap;
}
.plugin-balance strong {
  color: var(--fk-primary);
  font-variant-numeric: tabular-nums;
}
.plugin-price {
  color: var(--fk-primary);
  font-size: 16px;
  font-variant-numeric: tabular-nums;
}
.plugin-detail-meta {
  display: flex;
  align-items: center;
  gap: 14px;
}
.plugin-detail-text {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  line-height: 1.8;
}
.plugin-screenshots {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 20px 0;
}
.plugin-screenshots img {
  display: block;
  width: 100%;
  border: 1px solid var(--fk-border);
  border-radius: var(--fk-radius);
}
.plugin-purchase-summary {
  padding: 8px 16px;
  background: #f7f9fc;
  border-radius: var(--fk-radius);
}
.plugin-modal-actions {
  display: flex;
  justify-content: center;
  margin-top: 16px;
}
.plugin-purchase-summary p {
  display: flex;
  justify-content: space-between;
  gap: 20px;
}
/* foundation controls */
.fk-popup-enter-active,
.fk-popup-leave-active {
  transition:
    opacity 0.16s ease,
    transform 0.16s ease;
}
.fk-popup-enter-from,
.fk-popup-leave-to {
  opacity: 0;
  transform: translateY(4px);
}
@media (prefers-reduced-motion: reduce) {
  .fk-popup-enter-active,
  .fk-popup-leave-active {
    transition: none;
  }
}
button,
input,
textarea,
select {
  font: inherit;
}
button {
  cursor: pointer;
}
input[type="checkbox"],
input[type="radio"] {
  appearance: none;
  display: inline-grid;
  place-items: center;
  flex: none;
  width: 15px;
  height: 15px;
  margin: 0;
  padding: 0;
  border: 2px solid #dfe3e9;
  background: #fff;
  vertical-align: middle;
  cursor: pointer;
  transition:
    border-color 0.15s,
    background-color 0.15s,
    box-shadow 0.15s;
}
input[type="checkbox"] {
  border-radius: 2px;
}
input[type="radio"] {
  border-radius: 50%;
}
@media (min-width: 761px) {
  input[type="checkbox"]:hover:not(:disabled),
  input[type="radio"]:hover:not(:disabled),
  label:hover > input[type="checkbox"]:not(:disabled),
  label:hover > input[type="radio"]:not(:disabled) {
    box-shadow: 0 0 0 5px #f2f3f5;
  }
}
input[type="checkbox"]:checked {
  border-color: var(--fk-primary);
  background: var(--fk-primary);
}
input[type="checkbox"]:checked::after {
  content: "✓";
  color: #fff;
  font-size: 11px;
  line-height: 1;
}
input[type="radio"]:checked {
  border: 4px solid var(--fk-primary);
}
input[type="checkbox"]:focus-visible,
input[type="radio"]:focus-visible {
  outline: 2px solid var(--fk-primary);
  outline-offset: 3px;
}
input[type="checkbox"]:disabled,
input[type="radio"]:disabled {
  opacity: 0.5;
  cursor: default;
}
@media (min-width: 761px) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not(
      [type="hidden"]
    ):not(:is(.search-select input, .fk-input-group input)):hover:not(
      :focus
    ):not(:disabled),
  textarea:hover:not(:focus):not(:disabled) {
    background-color: #e5e6eb;
  }
}
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not(
    [type="hidden"]
  ):not(:is(.search-select input, .fk-input-group input)):focus,
textarea:focus {
  border-color: var(--fk-primary);
  background-color: #fff;
  outline: none;
}
.fk-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
  white-space: nowrap;
}
.fk-table th {
  background: #f6f8fc;
  font-weight: 400;
  color: #5d6b83;
  height: 44px;
}
.fk-table th,
.fk-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #edf0f5;
}
.fk-table td {
  height: 66px;
}
.search-select {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  min-width: 0;
  height: 32px;
  border: 1px solid transparent;
  border-radius: 2px;
  background: #f2f3f5;
  transition:
    background-color 0.15s,
    border-color 0.15s;
}
@media (min-width: 761px) {
  .search-select:hover:not(.is-open):not(.is-disabled) {
    background: #e5e6eb;
  }
}
.search-select.is-open {
  border-color: var(--fk-primary);
  background: #fff;
}
.search-select input::placeholder {
  color: #86909c;
}
.search-select > button {
  display: grid;
  place-items: center;
  width: 34px;
  height: 100%;
  flex: none;
  padding: 0;
  border: 0;
  background: transparent;
  color: #68778d;
  cursor: pointer;
}
.search-select.is-disabled {
  opacity: 0.6;
}
.toggle-switch {
  position: relative;
  width: 28px;
  height: 16px;
  border: 0;
  border-radius: 10px;
  background: #cbd4e3;
  padding: 0;
  vertical-align: middle;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    box-shadow 0.15s ease;
}
@media (min-width: 761px) {
  .toggle-switch:hover:not(:disabled) {
    background: #aabbd6;
    box-shadow: 0 0 0 4px #e8f1ff;
  }
}
.toggle-switch:focus-visible {
  background: #aabbd6;
  box-shadow: 0 0 0 4px #e8f1ff;
}
@media (min-width: 761px) {
  .toggle-switch.on:hover:not(:disabled) {
    background: #4b7fff;
  }
}
.toggle-switch.on:focus-visible {
  background: #4b7fff;
}
.toggle-switch:focus-visible {
  outline: 2px solid var(--fk-primary);
  outline-offset: 3px;
}
.toggle-switch:disabled {
  cursor: not-allowed;
}
.toggle-switch.on {
  background: var(--fk-primary);
}
.toggle-switch span {
  display: block;
  position: absolute;
  top: 2px;
  left: 2px;
  width: 12px;
  height: 12px;
  background: white;
  border-radius: 50%;
  transition: left 0.15s;
}
.toggle-switch.on span {
  left: 14px;
}
[appearance~="tabs-line"] {
  display: flex;
  align-items: center;
  gap: 40px;
  height: 55px;
  border-bottom: 1px solid #eef1f6;
  color: #657186;
}
[appearance~="tabs-line"] > span {
  height: 100%;
  padding: 18px 0 0;
  white-space: nowrap;
}
[appearance~="tabs-line"] > span.active {
  border-bottom: 2px solid var(--fk-primary);
  color: var(--fk-primary);
}
[appearance~="tabs-line"] > a,
[appearance~="tabs-line"] > button {
  height: 100%;
  padding: 18px 0 0;
  border: 0;
  background: none;
  color: #657186;
  white-space: nowrap;
}
[appearance~="tabs-line"] > a.active,
[appearance~="tabs-line"] > button.active {
  color: var(--fk-primary);
  border-bottom: 2px solid var(--fk-primary);
}
.search-select input {
  flex: 1;
  width: 100%;
  min-width: 0;
  height: 100%;
  margin: 0;
  padding: 0 12px;
  border: 0;
  outline: 0;
  background: transparent;
  box-shadow: none;
  color: #1d2d46;
}
@media (min-width: 761px) {
  .search-select input:hover {
    border: 0;
    outline: 0;
    background: transparent;
  }
}
.search-select input:focus {
  border: 0;
  outline: 0;
  background: transparent;
}
@media (min-width: 761px) {
  .search-select input:hover {
    height: 100%;
    border: 0;
    background: transparent;
  }
}
.search-select input,
.search-select input:focus {
  height: 100%;
  border: 0;
  background: transparent;
}
.fk-form-item:not(.fk-form-item-custom) {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
  margin-bottom: 20px;
}
.fk-form-item:not(.fk-form-item-custom) > label {
  text-align: right;
  line-height: var(--fk-control-height);
}
.fk-form-item-content {
  min-width: 0;
}
.fk-form-item-content > .fk-control {
  width: 100%;
}
.fk-field-error {
  margin: 5px 0 0;
  font-size: 12px;
  color: var(--fk-danger);
}
.fk-field-help {
  display: block;
  margin-top: 5px;
  color: var(--fk-muted);
}
@media (min-width: 761px) {
  :where(.fk-table tbody tr:hover) {
    background: var(--fk-hover-bg);
  }
}
@media (max-width: 600px) {
  .fk-form-item:not(.fk-form-item-custom) {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .fk-form-item:not(.fk-form-item-custom) > label {
    text-align: left;
  }
}
.button-spinner {
  display: inline-block;
  width: 13px;
  height: 13px;
  border: 2px solid #fff7;
  border-top-color: white;
  border-radius: 50%;
  animation: button-spin 0.7s linear infinite;
}
.empty-state {
  color: #a1acbb;
  text-align: center;
  padding: 36px 0;
}
.modal-backdrop {
  position: fixed;
  inset: 0;
  background: #0007;
  z-index: 20;
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow-y: auto;
  padding: 16px;
}
.floating-window-layer {
  position: fixed;
  inset: 0;
  z-index: 20;
  pointer-events: none;
}
.floating-window-layer > [role="dialog"] {
  position: absolute;
  margin: 0;
  pointer-events: auto;
}
.modal-panel {
  background: white;
  border-radius: 7px;
  width: 100%;
  flex: none;
  margin-block: auto;
  box-shadow: 0 14px 45px #0003;
}
.modal-header {
  height: 56px;
  border-bottom: 1px solid #edf0f6;
  padding: 0 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.modal-header h2 {
  margin: 0;
  font-size: var(--heading-dialog-size);
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
.modal-body {
  padding: 20px;
}
.modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  border-top: 1px solid #eef1f6;
  padding-top: 16px;
}
.delete-popover {
  position: fixed;
  z-index: 30;
  width: 206px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  padding: 17px 16px 12px;
  box-shadow: 0 4px 16px #0002;
}
.delete-popover::after {
  content: "";
  position: absolute;
  bottom: -6px;
  width: 10px;
  height: 10px;
  background: white;
  border-right: 1px solid #e5e7eb;
  border-bottom: 1px solid #e5e7eb;
  transform: rotate(45deg);
}
.delete-popover p {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0 0 13px;
  white-space: nowrap;
  font-size: 13px;
}
.delete-warning {
  display: inline-grid;
  place-items: center;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #ff8800;
  color: white;
  font-weight: 700;
  font-size: 11px;
}
.delete-buttons {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
}
.delete-buttons button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  height: 24px;
  min-height: 24px;
  border: 0;
  border-radius: 2px;
  padding: 0 8px;
  font-size: 12px;
  font-weight: 400;
  line-height: 20px;
  white-space: nowrap;
  background: #f2f3f5;
  color: #4e5969;
}
@media (min-width: 761px) {
  .delete-buttons button:first-child:hover:not(:disabled) {
    background: #e5e6eb;
  }
}
.delete-buttons button:last-child {
  background: var(--fk-primary);
  color: white;
}
@media (min-width: 761px) {
  .delete-buttons button:last-child:hover:not(:disabled) {
    background: var(--fk-primary-hover);
  }
}
.delete-buttons button:focus-visible {
  outline: 2px solid var(--fk-primary);
  outline-offset: 2px;
}
.delete-buttons button:disabled {
  opacity: 0.6;
  cursor: wait;
}
.search-select-options {
  position: fixed;
  z-index: 50;
  overflow-y: auto;
  padding: 4px 0;
  border: 1px solid #e5e6eb;
  border-radius: 3px;
  background: #fff;
  box-shadow: 0 5px 14px #0002;
}
.search-select-options > button {
  display: block;
  width: 100%;
  min-height: 36px;
  padding: 8px 12px;
  border: 0;
  background: transparent;
  color: #263855;
  text-align: left;
  cursor: pointer;
}
@media (min-width: 761px) {
  .search-select-options > button:hover {
    background: #f2f3f5;
  }
}
.search-select-options > button.active {
  background: #f2f3f5;
}
.search-select-options > button[aria-selected="true"] {
  color: var(--fk-primary);
}
.search-select-options > button.is-multiple {
  display: flex;
  align-items: center;
  gap: 10px;
}
.search-select-options > button.is-multiple input {
  pointer-events: none;
}
.search-select-options > button:disabled {
  color: var(--fk-muted);
  cursor: default;
}
.search-select-empty {
  padding: 10px 12px;
  color: #86909c;
}
.modal-backdrop:has(.confirmation-dialog) {
  z-index: 2200;
}
.modal-backdrop.confirmation-backdrop {
  z-index: 2200;
}
.operation-toast {
  position: fixed;
  z-index: 2000;
  top: 48px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 42px;
  padding: 8px 17px;
  background: #fff;
  border: 1px solid #e5e6eb;
  border-radius: 2px;
  box-shadow: 0 3px 11px #1b2b441f;
  color: #252b37;
  font-size: 14px;
  white-space: nowrap;
}
.operation-toast-icon {
  display: grid;
  place-items: center;
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #00b42a;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}
.operation-toast.error .operation-toast-icon {
  background: #f53f3f;
}
.operation-toast-enter-active,
.operation-toast-leave-active {
  transition:
    opacity 0.15s ease,
    transform 0.15s ease;
}
.operation-toast-enter-from,
.operation-toast-leave-to {
  opacity: 0;
  transform: translate(-50%, -8px);
}
/* main controls */
a {
  color: inherit;
  text-decoration: none;
}
h1 {
  margin-top: 0;
}
[appearance~="inline-notice"] {
  color: #d44444;
  margin: 12px 0;
}
[appearance~="login-logo"] {
  position: absolute;
  left: 35px;
  top: 18px;
  display: flex;
  align-items: center;
  gap: 7px;
  color: #1e5ce8;
  font-weight: 700;
}
.login-heading h1 {
  font-size: 21px;
  line-height: 30px;
  color: #101828;
  margin: 0;
  font-weight: 700;
}
[appearance~="login-tabs"] {
  border-bottom: 1px solid #dfe4ed;
  color: #1e61f2;
  margin-bottom: 16px;
  height: 30px;
}
[appearance~="login-tabs"] .selected {
  display: inline-block;
  height: 30px;
  border-bottom: 2px solid var(--fk-primary);
}
[appearance~="login-input-wrap"] input {
  background: none;
  border: 0;
  outline: none;
  min-width: 0;
  width: 100%;
  color: #1d2939;
}
[appearance~="login-input-wrap"] input::placeholder {
  color: #8b97aa;
}
[appearance~="login-submit"] {
  width: 100%;
  height: 33px;
  padding: 0;
  border-radius: 0;
  margin-top: 1px;
}
[appearance~="login-submit"]:active {
  transform: translateY(1px);
}
.login-extra button {
  border: 0;
  padding: 0;
  background: none;
  color: #2161e8;
  font-size: 12px;
}
@media (min-width: 761px) {
  .login-extra button:hover {
    text-decoration: underline;
  }
}
.login-carousel-arrows button {
  background: #ffffff40;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  line-height: 21px;
  border: 0;
  color: white;
  font-size: 22px;
  padding: 0;
}
.login-carousel-dots button {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #8eaff0;
  border: 0;
  padding: 0;
}
.login-carousel-dots button.active {
  background: white;
}
[appearance~="merchant-header-brand"] {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #1e5ce8;
  font-size: 17px;
}
[appearance~="merchant-header-brand"] span {
  font-size: 23px;
  font-weight: 700;
}
[appearance~="header-user-button"] {
  padding: 4px 7px;
  border-radius: 3px;
}
@media (min-width: 761px) {
  [appearance~="header-user-button"]:hover {
    background: #f0f3f8;
  }
}
[appearance~="header-user-button"].open {
  background: #f0f3f8;
}
.account-popover a,
.account-popover button {
  white-space: nowrap;
  font-size: 13px;
}
[appearance~="header-user-button"],
[appearance~="header-update-action"] {
  display: flex;
  align-items: center;
  gap: 5px;
  border: 0;
  background: none;
  color: #3a4556;
  padding: 0;
}
.header-popover a,
.header-popover button {
  display: block;
  width: 100%;
  padding: 9px 16px;
  border: 0;
  background: white;
  color: #3e4d62;
  text-align: left;
}
@media (min-width: 761px) {
  .header-popover a:hover,
  .header-popover button:hover {
    background: #f2f3f5;
  }
}
[appearance~="header-update-action"] {
  display: flex;
  align-items: center;
  gap: 5px;
}
.dashboard-greeting h1 {
  font-size: var(--heading-page-size);
  font-weight: var(--heading-weight);
  margin: 0 0 13px;
  line-height: 1.5;
}
[appearance~="summary-item"] {
  text-align: center;
  height: 100%;
  justify-content: center;
  transition: background-color 0.2s ease-out;
}
@media (min-width: 761px) {
  [appearance~="summary-item"]:hover {
    background-color: #2f6eeb;
  }
}
[appearance~="summary-item"]:focus-visible {
  outline: 2px solid #fff;
  outline-offset: -4px;
  background-color: #2f6eeb;
}
[appearance~="summary-item"] > span {
  opacity: 0.6;
  transition: opacity 0.2s ease-out;
}
@media (min-width: 761px) {
  [appearance~="summary-item"]:hover span {
    opacity: 1;
  }
}
.section-heading a {
  color: var(--fk-primary);
}
[appearance~="dashboard-reminder-link"] {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 10px 4px;
  border-bottom: 1px solid #f2f3f5;
  border-radius: 4px;
}
@media (min-width: 761px) {
  [appearance~="dashboard-reminder-link"]:hover,
  [appearance~="dashboard-notice-link"]:hover {
    background: #f2f6ff;
    color: var(--fk-primary);
  }
}
[appearance~="dashboard-notice-link"] > span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
[appearance~="dashboard-notice-link"] {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 4px;
  border-radius: 4px;
  color: #4e5969;
  font-size: 13px;
}
[appearance~="dashboard-notice-link"] > span {
  flex: 1;
  min-width: 0;
}
[appearance~="dashboard-notice-link"] small {
  flex: none;
  font-size: 11px;
  color: #86909c;
}
.shortcut-grid a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: #4e5969;
  cursor: pointer;
}
@media (min-width: 761px) {
  .shortcut-grid a:hover {
    color: #1d5eff;
  }
}
@media (min-width: 761px) {
  .shortcut-grid a:hover svg {
    background: #eaf3ff;
    color: #1d5eff;
  }
}
.page-title-row h1 {
  font-size: var(--heading-page-size);
  font-weight: var(--heading-weight);
  margin: 0 0 4px;
  line-height: 1.5;
}
.goods-type-row [appearance~="tabs-line"] {
  border: 0;
  gap: 32px;
}
.goods-tools a {
  color: #69768b;
  padding: 5px 11px;
  font-size: 12px;
}
.goods-status-row button {
  border: 0;
  background: none;
  padding: 0;
  color: #445168;
}
.goods-status-row button.active {
  color: #1b5ef0;
  border-bottom: 2px solid #1b5ef0;
}
.goods-filter-row label {
  white-space: nowrap;
}
.goods-filter-row [appearance~="search-field"] input {
  background: none;
  min-width: 0;
  width: 100%;
}
.goods-page .fk-table th {
  background: white;
  color: #1f2d43;
}
.goods-page .fk-table th,
.goods-page .fk-table td {
  height: 48px;
}
[appearance~="search-field"] input {
  border: 0;
  outline: none;
  min-width: 220px;
}
.edit-form label {
  display: grid;
  gap: 7px;
}
.edit-form label span {
  color: #d44747;
}
.edit-form input,
.edit-form textarea,
.settings-form input,
.settings-form textarea {
  width: 100%;
  border: 1px solid #dce2eb;
  border-radius: 3px;
  padding: 9px 11px;
  outline-color: #2a65ee;
  background: white;
}
.settings-form label {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
}
.settings-form label > span {
  text-align: right;
  color: #5e697c;
}
[appearance~="buyer-brand"] {
  display: flex;
  align-items: center;
  gap: 9px;
}
[appearance~="buyer-brand"] strong {
  font-weight: 500;
}
[appearance~="buyer-order-link"] {
  background: var(--fk-primary);
  color: white;
  border-radius: 20px;
  padding: 7px 18px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.shop-profile h1 {
  margin: 0 0 6px;
}
[appearance~="buyer-tabs"] {
  display: flex;
  gap: 30px;
  border-bottom: 1px solid #e8edf6;
}
[appearance~="buyer-tabs"] button,
.buyer-categories button {
  border: 0;
  background: none;
  color: #607089;
  padding: 13px 4px;
}
[appearance~="buyer-tabs"] button.active {
  border-bottom: 2px solid var(--fk-primary);
}
[appearance~="buyer-search"] input {
  border: 0;
  outline: none;
  padding: 0 8px;
}
[appearance~="buyer-search"] button {
  height: 100%;
  border: 0;
}
[appearance~="buyer-good-card"] {
  overflow: hidden;
}
.good-detail-main h1 {
  font-size: 24px;
}
.quantity-stepper {
  display: flex;
  align-items: center;
  border: 1px solid #dfe5ee;
}
.quantity-stepper button {
  border: 0;
  background: #f7f9fc;
  width: 35px;
  height: 32px;
}
.quantity-stepper span {
  padding: 0 18px;
}
.search-select-options.recharge-select-options:not(
    .search-select-mobile-options
  ) {
  z-index: 2201;
}
@media (min-width: 761px) {
  .purchase-dialog .quantity-stepper input {
    box-sizing: border-box;
    width: 52px;
    height: 32px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: #fff;
    color: inherit;
    font: inherit;
    text-align: center;
  }
  .purchase-dialog .quantity-stepper input:focus {
    outline: 1px solid #2461ff;
    outline-offset: -1px;
  }
}
.lookup-card input {
  flex: 1;
  min-width: 0;
}
.goods-page .goods-table th,
.goods-page .goods-table td {
  padding: 10px 12px;
}
.goods-page .goods-table tbody td {
  height: 78px;
}
@media (min-width: 761px) {
  .goods-table tbody tr:hover {
    background: #f7f8fa;
  }
}
[appearance~="goods-product-name"] {
  border: 0;
  padding: 0;
  background: none;
  color: #3e4d62;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  max-width: 100%;
  text-align: left;
  white-space: normal;
}
@media (min-width: 761px) {
  [appearance~="goods-product-name"]:hover {
    color: var(--fk-primary);
  }
}
@media (min-width: 761px) {
  .goods-tools a:hover {
    background: #f1f2f5;
  }
}
.goods-tools a {
  background: transparent;
  border-radius: 2px;
}
.share-link-dialog .modal-header {
  height: 52px;
  justify-content: center;
  border: 0;
  position: relative;
}
.share-link-dialog .modal-header h2 {
  font-size: var(--heading-dialog-size);
  color: #1d2129;
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
.share-link-dialog .modal-header button {
  position: absolute;
  right: 18px;
  top: 16px;
}
.share-link-dialog .modal-body {
  padding: 12px 36px 45px;
}
.share-link-address a {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.share-link-address button {
  border: 0;
  background: none;
  color: #4e5969;
  padding: 4px;
  flex: none;
}
@media (min-width: 761px) {
  .share-link-address button:hover {
    background: #f1f2f5;
  }
}
.share-link-address [appearance~="share-link-reset"] {
  color: var(--fk-primary);
  margin-left: 12px;
}
.share-link-invalid a {
  color: var(--fk-primary);
}
.create-page h1,
.category-page h1,
.orders-page h1,
.shop-settings-body h1,
.placeholder-page h1 {
  font-size: var(--heading-page-size);
  font-weight: var(--heading-weight);
  margin: 0 0 25px;
  line-height: 1.5;
}
[appearance~="product-type-card"] {
  min-height: 76px;
  display: flex;
  align-items: center;
  gap: 13px;
  background: #f9f9fb;
  padding: 15px;
  border-radius: 4px;
}
@media (min-width: 761px) {
  [appearance~="product-type-card"]:hover {
    box-shadow: 0 0 0 1px var(--fk-primary) inset;
    background: #f4f8ff;
  }
}
[appearance~="product-type-card"] svg {
  color: #ffa62e;
  flex: none;
}
[appearance~="product-type-card"]:nth-child(3) svg {
  color: #8797ff;
}
[appearance~="product-type-card"]:nth-child(4) svg {
  color: #8b79ee;
}
[appearance~="product-type-card"] strong,
[appearance~="product-type-card"] small {
  display: block;
}
[appearance~="product-type-card"] small {
  color: #8d98a8;
  font-size: 12px;
  margin-top: 4px;
}
.create-breadcrumb a {
  color: var(--fk-primary);
}
.goods-create-form label {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin: 17px 0;
}
.goods-create-form label > span {
  width: 105px;
  flex: none;
  text-align: right;
  padding-top: 9px;
}
.goods-create-form label b {
  color: #d54e4e;
}
.goods-create-form input,
.goods-create-form textarea {
  flex: 1;
  min-width: 0;
  padding: 9px 12px;
  border: 1px solid #dce3ee;
  outline-color: var(--fk-primary);
}
[appearance~="form-side-link"] {
  padding-top: 9px;
  color: var(--fk-primary);
}
@media (min-width: 761px) {
  .card-publish-back a:hover {
    color: var(--fk-primary);
  }
}
.card-publish-panel h1 {
  margin: 0 0 18px;
  font-size: var(--heading-page-size);
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
.card-publish-row > label {
  padding-top: 7px;
  text-align: right;
  color: #4e5969;
}
.card-publish-row label b {
  color: #e54d42;
}
.card-publish-row > input {
  width: min(100%, 933px);
}
.card-publish-row
  input:not([type="radio"]):not([type="file"]):not(:is(.search-select input)) {
  width: 100%;
  height: 32px;
  padding: 5px 12px;
  border: 1px solid transparent;
  border-radius: 2px;
  outline: none;
  background: #f2f3f5;
  transition:
    background-color 0.15s,
    border-color 0.15s;
}
@media (min-width: 761px) {
  .card-publish-row
    input:not([type="radio"]):not([type="file"]):not(
      :is(.search-select input)
    ):hover:not(:focus) {
    background: #e5e6eb;
  }
}
.card-publish-row
  input:not([type="radio"]):not([type="file"]):not(
    :is(.search-select input)
  ):focus {
  border-color: var(--fk-primary);
  background: white;
}
.card-publish-control > a {
  display: inline-block;
  margin-top: 7px;
  color: var(--fk-primary);
}
.card-publish-prices > label {
  padding-top: 7px;
  color: #4e5969;
}
.card-publish-cover {
  display: block;
}
.card-publish-cover-tile {
  position: relative;
  width: 95px;
  height: 95px;
  border: 1px dashed #c9cdd4;
  background: #f2f3f5;
  overflow: hidden;
}
.card-publish-cover-tile > button {
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: #86909c;
  font-size: 25px;
}
@media (min-width: 761px) {
  .card-publish-cover-tile > button:hover {
    background: #e5e6eb;
  }
}
.card-publish-cover-tile > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.card-publish-cover-actions {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  background: #0008;
  opacity: 0;
  transition: opacity 0.15s;
}
@media (min-width: 761px) {
  .card-publish-cover-tile:hover .card-publish-cover-actions {
    opacity: 1;
  }
}
.card-publish-cover-tile:focus-within .card-publish-cover-actions {
  opacity: 1;
}
.card-publish-cover-actions button {
  border: 0;
  background: transparent;
  color: #fff;
  padding: 3px;
}
@media (min-width: 761px) {
  .card-publish-cover-actions button:hover {
    color: #c7d9ff;
  }
}
.card-publish-cover input[type="file"] {
  display: none;
}
.rich-text-editor .w-e-toolbar button {
  font-family: inherit;
}
.rich-editor-status button {
  border: 0;
  background: transparent;
  color: var(--fk-primary);
  cursor: pointer;
  margin-left: 12px;
}
.rich-link-form label {
  display: grid;
  gap: 8px;
  color: #4e5969;
}
.rich-link-form input {
  width: 100%;
  height: 36px;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: 2px;
  background: #f2f3f5;
  outline: none;
}
.rich-link-form .modal-actions {
  margin-top: 5px;
}
.rich-product-content table {
  border-collapse: collapse;
  max-width: 100%;
}
.rich-product-content th,
.rich-product-content td {
  border: 1px solid #ddd;
  padding: 6px 10px;
  min-width: 36px;
}
.rich-product-content th {
  background: #f5f6f7;
  font-weight: bold;
}
.rich-product-content [data-w-e-type="todo"] input {
  pointer-events: none;
}
.rich-product-content a {
  color: var(--fk-primary);
  text-decoration: underline;
  text-underline-offset: 2px;
}
@media (min-width: 761px) {
  .rich-product-content a:hover {
    color: #0d42c2;
  }
}
.card-publish-advanced > button {
  border: 0;
  background: transparent;
  padding: 8px 14px;
}
@media (min-width: 761px) {
  .card-publish-advanced > button:hover {
    background: #f2f3f5;
  }
}
.card-publish-advanced > button span {
  color: #86909c;
  margin-right: 5px;
}
.card-publish-options label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  cursor: pointer;
}
.goods-filter-row .search-select,
.select-inline .search-select {
  width: 200px;
  flex: none;
}
.goods-create-form .search-select {
  flex: 1;
}
.select-inline .search-select {
  display: inline-flex;
  margin-left: 8px;
  vertical-align: middle;
}
.card-publish-actions [appearance~="inline-notice"] {
  margin: 0;
}
@media (max-width: 800px) {
  .card-publish-row > label {
    padding: 0;
    text-align: left;
  }
  .card-publish-prices > label {
    padding-top: 5px;
  }
}
.category-page h1 {
  margin-bottom: 16px;
}
.category-page [appearance~="tabs-line"] {
  gap: 30px;
}
.category-search-row input {
  width: 200px;
  height: 29px;
  border: 1px solid transparent;
  border-radius: 2px;
  background: #f2f3f5;
  padding: 5px 12px;
  transition:
    background-color 0.15s,
    border-color 0.15s;
}
@media (min-width: 761px) {
  .category-search-row input:hover:not(:focus) {
    background: #e5e6eb;
  }
}
.category-search-row input:focus {
  outline: none;
  border-color: var(--fk-primary);
  background: #fff;
}
.category-editor-dialog .edit-form input {
  border-color: transparent;
  background: #f2f3f5;
  transition:
    background-color 0.15s,
    border-color 0.15s;
}
.category-editor-dialog .edit-form label {
  display: block;
}
.category-editor-dialog .edit-form label .required-mark {
  margin-right: 4px;
}
.category-editor-dialog .edit-form label input {
  display: block;
  margin-top: 7px;
}
.category-editor-dialog .edit-form label small {
  display: block;
  margin-top: 7px;
}
@media (min-width: 761px) {
  .category-editor-dialog .edit-form input:hover:not(:focus) {
    background: #e5e6eb;
  }
}
.category-editor-dialog .edit-form input:focus {
  outline: none;
  border-color: var(--fk-primary);
  background: #fff;
}
.category-editor-dialog button:focus-visible,
.category-page button:focus-visible {
  outline: 2px solid var(--fk-primary);
  outline-offset: 2px;
}
.thumbnail-category-thumbnail {
  position: relative;
  width: 80px;
  height: 80px;
  border: 1px dashed #c9cdd4;
  border-radius: 2px;
  background: #f2f3f5;
  overflow: hidden;
}
.thumbnail-category-thumbnail > button {
  width: 100%;
  height: 100%;
  border: 0;
  background: transparent;
  color: #86909c;
  font-size: 23px;
  cursor: pointer;
}
@media (min-width: 761px) {
  .thumbnail-category-thumbnail > button:hover {
    background: #e5e6eb;
  }
}
.thumbnail-category-thumbnail img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.thumbnail-category-thumbnail-actions {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  gap: 8px;
  align-items: center;
  background: #0007;
  opacity: 0;
  transition: opacity 0.15s;
}
@media (min-width: 761px) {
  .thumbnail-category-thumbnail:hover .thumbnail-category-thumbnail-actions {
    opacity: 1;
  }
}
.thumbnail-category-thumbnail:focus-within
  .thumbnail-category-thumbnail-actions {
  opacity: 1;
}
.thumbnail-category-thumbnail-actions button {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #ffffff66;
  color: white;
  cursor: pointer;
}
@media (min-width: 761px) {
  .thumbnail-category-thumbnail-actions button:hover {
    background: #ffffff99;
  }
}
[appearance~="category-batch-delete"] {
  height: 29px;
  padding: 4px 12px;
  border: 0;
  border-radius: 1px;
  background: #f5aaa4;
  color: #fff;
}
@media (min-width: 761px) {
  [appearance~="category-batch-delete"]:hover {
    background: #eb847d;
  }
}
[appearance~="category-table"] th {
  background: white;
  color: #19273c;
}
[appearance~="category-table"] {
  min-width: 900px;
  table-layout: fixed;
}
[appearance~="category-table"] th:last-child {
  text-align: right;
}
[appearance~="category-table"] .table-actions {
  justify-content: flex-end;
  gap: 0;
  white-space: nowrap;
}
[appearance~="category-table"] td {
  height: 57px;
}
[appearance~="category-table"] .category-check-column {
  padding-right: 4px;
  text-align: center;
}
@media (min-width: 761px) {
  [appearance~="category-table"] tbody tr:hover {
    background: #f7f8fa;
  }
}
[appearance~="category-table"] .toggle-switch {
  transition: box-shadow 0.15s;
}
@media (min-width: 761px) {
  [appearance~="category-table"] .toggle-switch:hover {
    box-shadow: 0 0 0 4px #f1f2f5;
  }
}
.orders-page h1 {
  margin-bottom: 10px;
}
[appearance~="orders-info-banner"] {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 18px;
  background: #e8f3ff;
  color: #4e5969;
  font-size: 13px;
}
[appearance~="orders-info-banner"] > span {
  display: inline-grid;
  place-items: center;
  flex: none;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--fk-primary);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
}
.orders-tab-row [appearance~="tabs-line"] {
  border: 0;
  gap: 30px;
}
.orders-filters label {
  white-space: nowrap;
}
.orders-filters input[type="date"] {
  width: 145px;
}
[appearance~="orders-table"] th {
  background: white;
}
[appearance~="orders-table"] {
  min-width: 1000px;
  color: #4e5969;
  font-size: 13px;
}
[appearance~="orders-table"] td {
  height: 82px;
  line-height: 22px;
}
@media (min-width: 761px) {
  [appearance~="orders-table"] tbody tr:hover {
    background: #f7f8fa;
  }
}
[appearance~="orders-table"] tbody tr.selected {
  background: #f7f8fa;
}
[appearance~="orders-table"] .orders-checkbox-cell {
  width: 32px;
}
[appearance~="orders-table"] .orders-number-cell {
  width: 280px;
  min-width: 280px;
}
[appearance~="orders-table"] .orders-amount-cell {
  width: 120px;
  text-align: center;
}
[appearance~="orders-table"] .light-tag {
  padding: 0 8px;
  margin-bottom: 3px;
  line-height: 20px;
  font-size: 12px;
}
[appearance~="orders-table"] .status-pill {
  padding: 2px 8px;
  border-radius: 0;
  white-space: nowrap;
}
[appearance~="orders-table"] .status-pill.pending {
  background: #fff7e8;
  color: #ff7d00;
}
[appearance~="orders-table"] .status-pill.refunded {
  background: #fff1f0;
  color: #f53f3f;
}
[appearance~="shop-tab-bar"] button {
  border: 0;
  border-bottom: 2px solid transparent;
  background: none;
  color: #4f5d74;
  padding: 0;
  font-size: 16px;
}
[appearance~="shop-tab-bar"] button.active {
  color: var(--fk-primary);
  border-bottom-color: var(--fk-primary);
}
.shop-settings-form label {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin: 18px 0;
}
.shop-settings-form label > span {
  width: 135px;
  flex: none;
  text-align: right;
  padding-top: 9px;
}
.shop-settings-form label b {
  color: #e34747;
}
.shop-settings-form input,
.shop-settings-form textarea,
.shop-link-row input {
  border: 0;
  background: #f1f2f5;
  padding: 9px 14px;
  min-height: 34px;
  outline-color: var(--fk-primary);
  transition:
    background-color 0.1s linear,
    box-shadow 0.1s linear;
}
@media (min-width: 761px) {
  .shop-settings-form input:hover:not(:focus):not(:disabled),
  .shop-settings-form textarea:hover:not(:focus):not(:disabled),
  .shop-link-row input:hover:not(:focus):not(:disabled) {
    background: #e5e6eb;
  }
}
.shop-settings-form input:focus,
.shop-settings-form textarea:focus,
.shop-link-row input:focus {
  outline: none;
  background: #fff;
  box-shadow: inset 0 0 0 1px var(--fk-primary);
}
.shop-settings-form label > input,
.shop-settings-form label > textarea {
  width: 583px;
  max-width: 100%;
}
.shop-contact-fields input {
  flex: 1;
  min-width: 0;
}
.shop-custom-link input {
  flex: 1;
  min-width: 0;
}
.style-background-box > label {
  flex: none;
  padding-top: 9px;
  white-space: nowrap;
}
.style-background-input > input:not([type="file"]) {
  width: 0;
  min-width: 0;
  flex: 1;
  padding: 8px 12px;
  border: 0;
  outline: none;
  background: transparent;
}
@media (min-width: 761px) {
  .style-background-input > input:not([type="file"]):hover {
    background: #e5e6eb;
  }
}
.style-background-input > input:not([type="file"]):focus {
  background: #fff;
  box-shadow: inset 0 0 0 1px var(--fk-primary);
}
.style-background-input > button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  flex: none;
  width: 110px;
  height: 34px;
  border-radius: 0;
  padding: 0 8px;
  font-size: 12px;
}
[appearance~="style-save-button"] {
  margin-left: 86px;
}
@media (max-width: 700px) {
  [appearance~="style-save-button"] {
    margin-left: 0;
  }
}
.closed-settings-line .toggle-switch {
  background: #c9cdd4;
}
.closed-settings-line .toggle-switch.on {
  background: var(--fk-primary);
}
[appearance~="closed-reason-link"] {
  margin-left: 20px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--fk-primary);
  font-size: 13px;
}
@media (min-width: 761px) {
  [appearance~="closed-reason-link"]:hover {
    color: #003dc3;
  }
}
.closed-reason-header button {
  position: absolute;
  right: 18px;
  top: 15px;
  border: 0;
  background: none;
  font-size: 20px;
  line-height: 1;
}
.closed-reason-body textarea {
  width: 100%;
  height: 54px;
  padding: 10px 12px 18px;
  resize: vertical;
  border: 0;
  border-radius: 2px;
  outline: none;
  background: #f2f3f5;
  font: inherit;
  font-size: 13px;
}
.closed-reason-body textarea:focus {
  box-shadow: inset 0 0 0 1px var(--fk-primary);
}
.other-settings-choices button {
  min-width: 54px;
  padding: 0 10px;
  border: 0;
  background: transparent;
  color: #4e5969;
  font-size: 13px;
}
.other-settings-choices button.active {
  background: #fff;
  color: var(--fk-primary);
}
@media (min-width: 761px) {
  .other-settings-choices button:hover:not(.active) {
    background: #e5e6eb;
  }
}
[appearance~="other-settings-save"] {
  margin-left: 138px;
}
@media (max-width: 700px) {
  [appearance~="other-settings-save"] {
    margin-left: 113px;
  }
}
.shop-links-address > a {
  overflow-wrap: anywhere;
  padding: 4px 5px;
  margin-left: -5px;
}
.shop-links-address a {
  color: var(--fk-primary);
  text-decoration: none;
  border-radius: 2px;
  transition: background-color 0.1s linear;
}
@media (min-width: 761px) {
  .shop-links-address a:hover {
    background: #f1f2f5;
  }
}
.shop-address-form > label {
  color: #4e5969;
}
[appearance~="shop-address-input"] {
  display: flex;
  align-items: center;
  min-width: 0;
  min-height: 38px;
  border: 1px solid transparent;
  border-radius: 3px;
  background: #f1f2f5;
  transition:
    background-color 0.1s linear,
    border-color 0.1s linear;
  --fk-group-focus-shadow: none;
}
@media (min-width: 761px) {
  [appearance~="shop-address-input"]:hover:not(:focus-within) {
    background: var(--fk-field-hover);
  }
}
[appearance~="shop-address-input"] > span {
  flex: none;
  padding-left: 11px;
  color: var(--fk-muted);
  white-space: nowrap;
}
@media (min-width: 761px) {
  [appearance~="shop-address-input"] > .fk-control:hover {
    min-width: 0;
    flex: 1;
    border: 0;
    outline: 0;
    padding: 9px 11px 9px 2px;
    background: transparent;
    color: #1d2638;
    font: inherit;
  }
}
[appearance~="shop-address-input"] > .fk-control,
[appearance~="shop-address-input"] > .fk-control:focus {
  min-width: 0;
  flex: 1;
  border: 0;
  outline: 0;
  padding: 9px 11px 9px 2px;
  background: transparent;
  color: #1d2638;
  font: inherit;
}
.shop-closed h1 {
  margin: 0 0 3px;
  color: #23334e;
}
.user-settings-page h1 {
  font-size: var(--heading-page-size);
  font-weight: var(--heading-weight);
  margin: 0 0 20px;
  line-height: 1.5;
}
.user-info-card a {
  margin-left: auto;
  color: var(--fk-primary);
}
.user-password-form label {
  display: grid;
  grid-template-columns: 100px 1fr;
  align-items: center;
  gap: 12px;
}
.user-password-form input {
  border: 1px solid #dce3ee;
  padding: 9px 12px;
}
.user-password-form button {
  justify-self: end;
}
@media (max-width: 470px) {
  .settings-form label {
    grid-template-columns: 1fr;
    gap: 5px;
  }
  .settings-form label > span {
    text-align: left;
  }
}
[appearance~="merchant-home-link"] {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 12px;
  margin-left: -12px;
  border-radius: 2px;
  color: #4e5969;
}
@media (min-width: 761px) {
  [appearance~="merchant-home-link"]:hover {
    background: #f1f2f5;
    color: #4e5969;
  }
}
[appearance~="header-update-action"] {
  min-height: 30px;
  white-space: nowrap;
  flex-shrink: 0;
  padding: 0 9px;
  margin: 0 -9px;
  border-radius: 2px;
}
@media (min-width: 761px) {
  [appearance~="header-update-action"]:hover {
    background: #f1f2f5;
    color: #3a4556;
  }
}
@media (max-width: 640px) {
  [appearance~="merchant-home-link"] {
    display: none;
  }
}
[appearance~="header-user-button"].open svg:last-child {
  transform: rotate(180deg);
}
.account-popover a,
.account-popover button {
  display: flex;
  align-items: center;
  gap: 9px;
}
[appearance~="summary-item"] {
  position: relative;
  z-index: 2;
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}
[appearance~="summary-item"] strong {
  color: white;
  font-size: 25px;
  font-weight: 400;
  line-height: 1;
}
[appearance~="summary-item"] > span {
  color: #fff;
  font-size: 14px;
}
.buyer-header-nav > a:not([appearance~="buyer-brand"]) {
  position: relative;
  display: inline-flex;
  align-items: center;
  height: 34px;
  padding: 0 12px;
  border-radius: 2px;
  transition:
    background-color 0.12s ease,
    color 0.12s ease;
}
@media (min-width: 761px) {
  .buyer-header-nav > a:not([appearance~="buyer-brand"]):hover {
    background: #f2f3f5;
  }
}
.buyer-header-nav > a:not([appearance~="buyer-brand"]).router-link-active {
  color: #1d5eff;
  background: #f2f3f5;
}
.buyer-header-nav
  > a:not([appearance~="buyer-brand"]).router-link-active::after {
  content: "";
  position: absolute;
  height: 3px;
  background: #1d5eff;
  left: 12px;
  right: 12px;
  bottom: -3px;
}
.buyer-header-nav [appearance~="buyer-brand"] {
  margin-right: 82px;
}
[appearance~="buyer-brand"] strong {
  font-size: 15px;
}
.buyer-footer a {
  border: 1px solid #dce2e9;
  background: #fff;
  border-radius: 3px;
  color: #30435b;
  display: inline-block;
  padding: 5px 8px;
}
@media (min-width: 761px) {
  .buyer-footer a:hover {
    background: #f2f3f5;
  }
}
.shop-profile h1 {
  font-size: 18px;
  color: #1460ff;
  margin-bottom: 9px;
}
.shop-name-line h1,
[appearance~="standalone-seller-name"] {
  margin: 0;
  background: linear-gradient(
    90deg,
    var(--shop-gradient-left),
    var(--shop-gradient-right)
  );
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: shop-name-gradient 22s linear infinite;
}
[appearance~="shop-status-badge"] {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  height: 21px;
  padding: 1px 5px;
  border-radius: 2px;
  font-size: 12px;
  line-height: 18px;
  white-space: nowrap;
}
[appearance~="shop-status-badge"].certified {
  background: #fff9eb;
  color: #f8b900;
}
[appearance~="shop-status-badge"].deposit {
  background: #ecfff0;
  color: #00b42a;
}
.shop-profile-actions a,
.shop-profile-actions button {
  border: 0;
  background: #eff6ff;
  color: #1d5eff;
  border-radius: 3px;
  padding: 3px 10px;
  font-size: 12px;
}
[appearance~="buyer-tabs"] {
  border: 0;
}
[appearance~="buyer-tabs"] button {
  padding: 4px 0;
  font-size: 16px;
  color: #8997a8;
  border: 0;
}
[appearance~="buyer-tabs"] button.active {
  color: #1a2636;
  border: 0;
  font-weight: 700;
}
[appearance~="buyer-search"] input {
  width: 100%;
  min-width: 0;
  background: transparent;
  font-size: 13px;
}
[appearance~="buyer-search"] button {
  color: #66778c;
  background: none;
  padding: 0 10px;
}
.buyer-categories button {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 4px;
  flex: 0 1 154px;
  min-width: 0;
  height: 68px;
  padding: 10px 18px;
  background: #f6f8fd;
  color: #567090;
  border-radius: 9px;
  font-size: 13px;
  text-align: left;
}
.buyer-categories button.active {
  background: linear-gradient(120deg, #338aff, #3168ed);
  color: white;
  box-shadow: 0 5px 12px #326ff044;
  position: relative;
  overflow: hidden;
}
.buyer-categories button.active::after {
  content: "✓";
  position: absolute;
  right: -5px;
  bottom: -20px;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: #ffffff4f;
  color: #ffffff92;
  font-size: 39px;
  font-weight: 800;
  line-height: 42px;
  text-align: center;
}
.buyer-categories button small {
  font-size: 12px;
  color: inherit;
  opacity: 0.85;
}
[appearance~="buyer-good-card"] {
  padding: 0;
  text-align: left;
}
@media (min-width: 761px) {
  [appearance~="buyer-good-card"]:hover {
    border-color: #2c6bff;
    transform: translateY(-1px);
  }
}
.delete-popover {
  transform-origin: center;
  animation:
    dialog-scale-in 0.3s cubic-bezier(0.18, 0.89, 0.32, 1.15),
    dialog-fade-in 0.2s ease-out;
}
.confirmation-dialog .modal-body p {
  margin: 0;
  line-height: 1.8;
}
@media (prefers-reduced-motion: reduce) {
  .delete-popover {
    transition: none;
    animation: none;
  }
}
.purchase-dialog-header button {
  position: absolute;
  top: 12px;
  right: 20px;
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  font-size: 22px;
  color: #293346;
}
@media (min-width: 761px) {
  .purchase-dialog-header button:hover {
    background: #f2f3f5;
    color: var(--fk-primary);
  }
}
.purchase-dialog-header [appearance~="purchase-dialog-expand"] {
  right: 54px;
  font-size: 17px;
}
.purchase-dialog-header [appearance~="purchase-dialog-close"] {
  top: 14px;
  right: 22px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  font-size: 18px;
}
@media (min-width: 761px) {
  .purchase-dialog-header [appearance~="purchase-dialog-close"]:hover {
    color: #293346;
  }
}
.purchase-contact input {
  flex: 1;
  min-width: 0;
  height: 32px;
  padding: 0 12px;
  background: #f2f3f5;
  outline-color: #b5caff;
}
.purchase-pay button {
  border: 2px solid #f2f3f5;
  background: #f8f8f8;
  border-radius: 3px;
  padding: 12px 23px;
  color: #3d4c60;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.purchase-pay button.active {
  border-color: #2461ff;
  color: #2461ff;
  background: white;
}
[appearance~="purchase-notice"] {
  margin-top: 10px;
  color: #d43f3f;
  font-size: 13px;
}
.purchase-dialog-footer button:first-child {
  padding: 8px 16px;
  border-radius: 4px;
  background: transparent;
  border: 0;
  color: #1460ff;
}
@media (min-width: 761px) {
  .purchase-dialog-footer button:first-child:hover {
    background: #f2f3f5;
  }
}
.lookup-card h1 {
  font-size: 28px;
  font-weight: 400;
  margin-bottom: 34px;
  color: #202635;
}
.lookup-card input {
  height: 36px;
  border: 1px solid #cbd2dc;
  padding: 8px 12px;
  background: white;
}
.public-info-main > h1 {
  text-align: center;
  font-size: 38px;
  font-weight: 700;
  margin: 0 0 30px;
  color: #111c2d;
}
.public-faq-list button {
  display: block;
  width: 100%;
  min-height: 84px;
  padding: 24px;
  border: 0;
  border-bottom: 1px solid #dfe5ee;
  text-align: left;
  background: white;
  font-size: 16px;
}
.public-faq-list button:last-child {
  border: 0;
}
@media (min-width: 761px) {
  .public-faq-list button:hover {
    background: #f2f3f5;
  }
}
.public-info-footer a {
  color: #aaa;
}
.account-setting-list button {
  margin-left: auto;
}
.user-settings-page h1 {
  font-size: var(--heading-page-size);
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
.section-surface h1 {
  font-size: var(--heading-page-size);
  font-weight: var(--heading-weight);
  margin: 0 0 20px;
  line-height: 1.5;
}
.section-surface [appearance~="tabs-line"] {
  gap: 32px;
}
.section-search input {
  width: 200px;
  height: 32px;
  border: 0;
  background: #f2f3f5;
  padding: 0 12px;
}
.section-surface .fk-table th {
  background: white;
}
.section-tabbar button {
  background: none;
  border: 0;
  color: #546174;
  padding: 0;
}
.section-tabbar button.active {
  color: #1d5eff;
  border-bottom: 3px solid #1d5eff;
}
.coupon-type-list button {
  width: 260px;
  min-height: 130px;
  border: 1px solid #e7edf6;
  background: #fbfcff;
  padding: 18px;
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
@media (max-width: 800px) {
  .buyer-header-nav > a:not([appearance~="buyer-brand"]) {
    display: none;
  }
}
@media (max-width: 500px) {
  .buyer-categories button {
    flex-basis: 135px;
  }
}
.portal-home [appearance~="buyer-brand"] strong {
  color: #9a6f19;
  font-weight: 600;
}
.portal-hero-copy h1 {
  color: #12141a;
  font-size: 32px;
  line-height: 48px;
  font-weight: 700;
  margin: 0 0 20px;
}
.portal-hero-copy h1 span {
  color: #1765f2;
}
[appearance~="portal-primary-button"] {
  display: inline-grid;
  place-items: center;
  width: 160px;
  height: 48px;
  border-radius: 24px;
  background: #1966ff;
  color: white;
  box-shadow: 0 5px 10px #1966f53d;
  font-size: 16px;
}
[appearance~="portal-industry-tabs"] {
  background: linear-gradient(105deg, #f7faff, #edf3ff);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 18px;
  padding: 40px 40px;
}
[appearance~="portal-industry-tabs"] button {
  flex: 0 0 50px;
  border: 0;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 8px 22px #2d64aa0d;
  text-align: left;
  padding: 0 18px;
  color: #6a6e76;
  font-size: 14px;
  white-space: nowrap;
}
@media (min-width: 761px) {
  [appearance~="portal-industry-tabs"] button:hover:not(.active) {
    background: #f2f3f5;
  }
}
[appearance~="portal-industry-tabs"] button.active {
  background: #e5edff;
  color: #202633;
  border-radius: 12px 0 0 12px;
}
[appearance~="portal-industry-tabs"] button span {
  color: #4765dd;
  margin-right: 7px;
  font-size: 19px;
  vertical-align: -1px;
}
.portal-news-grid header a {
  color: #1c61d3;
  font-size: 12px;
}
.portal-news-grid article > a {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  min-height: 94px;
  padding: 16px 22px;
  border-bottom: 1px solid #edf0f5;
  color: #343b47;
  font-size: 13px;
  line-height: 1.55;
}
.portal-news-grid article > a:last-child {
  border-bottom: 0;
}
@media (min-width: 761px) {
  .portal-news-grid article > a:hover {
    background: #f8faff;
    color: var(--fk-primary);
  }
}
[appearance~="portal-news-entry"] > div {
  min-width: 0;
}
[appearance~="portal-news-entry"] h4 {
  margin: 0;
  font-size: 13px;
  font-weight: 400;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  overflow-wrap: anywhere;
}
[appearance~="portal-news-entry"] time {
  display: block;
  margin-top: 10px;
  color: #898d96;
  font-size: 13px;
}
.news-admin-list h1 {
  margin: 0 0 10px;
  font-size: var(--heading-page-size);
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
.news-admin-header h1 {
  margin: 0;
}
.news-editor-form input:not([type="checkbox"]),
.news-editor-form textarea {
  min-height: 34px;
  padding: 9px 14px;
  border: 0;
  border-radius: 3px;
  background: #f1f2f5;
  color: #1d2638;
  font: inherit;
  font-size: 14px;
  resize: vertical;
  transition:
    background-color 0.1s linear,
    box-shadow 0.1s linear;
}
@media (min-width: 761px) {
  .news-editor-form
    input:not([type="checkbox"]):hover:not(:focus):not(:disabled),
  .news-editor-form textarea:hover:not(:focus):not(:disabled) {
    background: #e5e6eb;
  }
}
.news-editor-form input:not([type="checkbox"]):focus,
.news-editor-form textarea:focus {
  outline: none;
  background: #fff;
  box-shadow: inset 0 0 0 1px var(--fk-primary);
}
.news-editor-form .news-admin-publish input[type="checkbox"] {
  width: 15px;
  height: 15px;
  padding: 0;
  border: 2px solid #dfe3e9;
}
.news-editor-form .news-admin-publish input[type="checkbox"]:checked {
  border-color: var(--fk-primary);
}
[appearance~="news-back-link"] {
  color: var(--fk-primary);
  font-size: 14px;
}
.news-article-content h1 {
  margin: 30px 0 10px;
  font-size: 30px;
}
.complaint-main h1 {
  margin: 0;
  text-align: center;
  color: #111c2d;
  font-size: 36px;
}
.complaint-tabs button {
  padding: 12px 4px;
  border: 0;
  border-bottom: 3px solid transparent;
  background: transparent;
  color: #56657b;
  cursor: pointer;
}
.complaint-tabs button.active {
  color: var(--fk-primary);
  border-bottom-color: var(--fk-primary);
}
.complaint-panel form label,
.complaint-admin-detail label {
  display: grid;
  gap: 8px;
  color: #4f5d70;
  font-size: 14px;
}
.complaint-panel input,
.complaint-panel textarea,
.complaint-admin-detail textarea {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #e5e6eb;
  border-radius: 3px;
  background: #f2f3f5;
  color: #1d2638;
  font: inherit;
  resize: vertical;
  transition:
    background-color 0.1s linear,
    box-shadow 0.1s linear;
}
@media (min-width: 761px) {
  .complaint-panel input:hover:not(:focus),
  .complaint-panel textarea:hover:not(:focus) {
    background: #e5e6eb;
  }
}
.complaint-panel input:focus,
.complaint-panel textarea:focus {
  outline: none;
  background: #fff;
  box-shadow: inset 0 0 0 1px var(--fk-primary);
}
.complaint-panel form > button {
  justify-self: start;
  min-width: 118px;
}
.complaint-success button + button {
  margin-left: 10px;
}
@media (max-width: 650px) {
  .complaint-main h1 {
    font-size: 28px;
  }
}
@media (max-width: 650px) {
  .news-article-content h1 {
    font-size: 24px;
  }
}
.portal-footer-grid a {
  display: block;
  font-size: 13px;
  margin: 0 0 18px;
  color: #999;
}
@media (min-width: 761px) {
  .portal-footer-grid a:hover {
    color: #fff;
  }
}
@media (max-width: 900px) {
  .buyer-header-nav [appearance~="buyer-brand"] {
    margin-right: 8px;
  }
  [appearance~="portal-industry-tabs"] {
    padding: 20px;
  }
}
@media (max-width: 650px) {
  .portal-hero-copy h1 {
    font-size: 28px;
  }
  [appearance~="portal-industry-tabs"] {
    flex-direction: row;
    overflow-x: auto;
    justify-content: flex-start;
  }
  [appearance~="portal-industry-tabs"] button {
    flex: 0 0 125px;
  }
}
[appearance~="buyer-brand"] .site-brand-logo {
  width: 114px;
}
[appearance~="merchant-header-brand"] .site-brand-logo {
  width: 114px;
}
[appearance~="login-logo"] .site-brand-logo {
  width: 150px;
}
.image-upload-mask button {
  display: grid;
  place-items: center;
  width: 23px;
  height: 23px;
  padding: 0;
  color: #fff;
  background: transparent;
  border: 0;
  cursor: pointer;
}
@media (min-width: 761px) {
  .image-upload-mask button:hover {
    color: #d9e7ff;
  }
}
[appearance~="image-upload-add"] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border: 0;
  background: #f2f3f5;
  color: #86909c;
  cursor: pointer;
}
@media (min-width: 761px) {
  [appearance~="image-upload-add"]:hover {
    background: #e5e6eb;
    color: #4e5969;
  }
}
[appearance~="image-upload-add"]:focus-visible {
  background: #e5e6eb;
  color: #4e5969;
}
.image-upload-lightbox > button {
  position: absolute;
  top: 24px;
  right: 24px;
  padding: 4px;
  color: #fff;
  background: transparent;
  border: 0;
  cursor: pointer;
}

[appearance~="knowledge-chapter-error"] {
  margin: 12px 0 0;
  color: #f53f3f;
  font-size: 13px;
}
[appearance~="inline-notice"] {
  display: none;
}
@media (max-width: 600px) {
  .buyer-header-nav [appearance~="buyer-brand"] {
    margin-right: 0;
  }
  [appearance~="buyer-brand"] .site-brand-logo {
    width: 88px;
  }
}
[appearance~="shop-link-icon-clear"] {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  width: 32px;
  height: 34px;
  padding: 0;
  border: 0;
  border-radius: 3px;
  background: #0009;
  color: #fff;
  opacity: 0;
  pointer-events: none;
  cursor: pointer;
  transition: opacity 0.12s ease;
}
@media (min-width: 761px) {
  .shop-link-icon-control:hover [appearance~="shop-link-icon-clear"] {
    opacity: 1;
    pointer-events: auto;
  }
}
.shop-link-icon-control:focus-within [appearance~="shop-link-icon-clear"] {
  opacity: 1;
  pointer-events: auto;
}
.shop-custom-link [appearance~="shop-link-name-input"] {
  flex: 0 0 120px;
  width: 120px;
}
.shop-custom-link [appearance~="shop-link-url-input"] {
  flex: 0 0 200px;
  width: 200px;
}
.shop-profile-actions [appearance~="shop-custom-action-link"] {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 5px;
  border-radius: 3px;
  background: transparent;
  color: var(--fk-primary);
  white-space: nowrap;
}
@media (min-width: 761px) {
  .shop-profile-actions [appearance~="shop-custom-action-link"]:hover {
    background: #e5e6eb;
  }
}
.shop-profile-actions [appearance~="shop-custom-action-link"]:focus-visible {
  background: #e5e6eb;
}
[appearance~="shop-custom-action-link"] img {
  width: 14px;
  height: 14px;
  object-fit: contain;
}
[appearance~="shop-custom-action-link"] span {
  font-size: 13px;
  line-height: 1;
}
.shop-profile-actions .shop-action-wrap > button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  height: 25px;
  padding: 2px 10px;
  border-radius: 3px;
  font-size: 12px;
  line-height: 18px;
  cursor: pointer;
}
.shop-profile-actions .shop-action-wrap > [appearance~="shop-contact-button"] {
  border: 1px dashed #a4edac;
  background: #effff0;
  color: #00b42a;
}
@media (min-width: 761px) {
  .shop-profile-actions
    .shop-action-wrap
    > [appearance~="shop-contact-button"]:hover {
    background: #bdf4c6;
    border-color: #a0eaa9;
  }
}
.shop-profile-actions
  .shop-action-wrap
  > [appearance~="shop-contact-button"][aria-expanded="true"] {
  background: #bdf4c6;
  border-color: #a0eaa9;
}
.shop-profile-actions .shop-action-wrap > [appearance~="shop-share-button"] {
  border: 1px dashed #e6e9ee;
  background: #f7f8fa;
  color: #4e5969;
}
@media (min-width: 761px) {
  .shop-profile-actions
    .shop-action-wrap
    > [appearance~="shop-share-button"]:hover {
    border-color: #d8dce3;
    background: #e5e6eb;
  }
}
.shop-profile-actions
  .shop-action-wrap
  > [appearance~="shop-share-button"][aria-expanded="true"] {
  border-color: #d8dce3;
  background: #e5e6eb;
}
.shop-profile-actions .shop-action-popover a,
.shop-profile-actions .shop-action-popover button {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 30px;
  padding: 2px 6px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: #3e4652;
  font-size: 13px;
  text-align: left;
  cursor: pointer;
}
@media (min-width: 761px) {
  .shop-profile-actions .shop-action-popover a:hover,
  .shop-profile-actions .shop-action-popover button:hover {
    background: #f5f6f8;
  }
}
.shop-profile-actions .shop-action-popover a span {
  font-size: 13px;
}
.buyer-categories button:not([appearance~="buyer-all-categories"]) {
  flex: 0 0 153px;
  height: 67px;
  gap: 7px;
  padding: 10px 19px;
  border: 1px solid #f0f0f0;
  border-radius: 10px;
  background: #f8f8f8;
  font-size: 12px;
}
.buyer-categories button.active:not([appearance~="buyer-all-categories"]) {
  border-color: #3580fb;
  background: linear-gradient(-45deg, #3369ff, #3798f7);
  box-shadow: 0 7px 10px #3690f83b;
}
.buyer-categories
  button.active:not([appearance~="buyer-all-categories"])::after {
  content: "";
  right: -2px;
  bottom: -18px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #83abff;
}
.buyer-categories
  button.active:not([appearance~="buyer-all-categories"])::before {
  content: "";
  position: absolute;
  z-index: 1;
  right: 6px;
  bottom: 4px;
  width: 25px;
  height: 13px;
  border-left: 7px solid #c2d5ff;
  border-bottom: 7px solid #c2d5ff;
  transform: rotate(-45deg);
}
.buyer-categories button.has-image {
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  padding: 8px;
}
.buyer-categories button.has-image span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.buyer-categories button span small {
  display: block;
  margin-top: 5px;
  white-space: nowrap;
}
.buyer-categories button:not(.active) span small {
  color: #999;
}
[appearance~="buyer-good-card"] {
  height: 318px;
  border: 2px solid #f1f4fb;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 4px 10px #00000008;
  transition: box-shadow 0.3s ease;
}
[appearance~="buyer-good-card"] .buyer-good-image {
  height: 214px;
  background: #fff;
}
[appearance~="buyer-good-card"] .buyer-good-image img {
  object-fit: contain;
}
@media (min-width: 761px) {
  [appearance~="buyer-good-card"]:hover {
    border-color: #f1f4fb;
    box-shadow: 0 1px 15px #0000001a;
    transform: none;
  }
}
[appearance~="buyer-good-card"]:focus-visible {
  border-color: #f1f4fb;
  box-shadow: 0 1px 15px #0000001a;
  transform: none;
}
.buyer-goods-grid.is-resource [appearance~="buyer-good-card"] {
  width: 210px;
  height: 320px;
  border-width: 1px;
}
.buyer-goods-grid.is-text-only [appearance~="buyer-good-card"] {
  height: 111px;
}
.buyer-goods-grid.with-card-marketing [appearance~="buyer-good-card"] {
  height: 318px;
}
.buyer-goods-grid.with-card-marketing.is-text-only
  [appearance~="buyer-good-card"] {
  height: 111px;
}
[appearance~="buyer-good-card"].has-marketing .buyer-good-bottom {
  flex-direction: row;
  align-items: center;
  gap: 6px;
}
.buyer-good-bottom.has-offers {
  flex-wrap: wrap;
  gap: 4px;
}
.buyer-good-offers {
  display: flex;
  flex: 1 0 auto;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  width: max-content;
  max-width: 100%;
  min-width: 0;
}
.buyer-good-offers .marketing-badges {
  display: contents;
}
.buyer-good-offers > small {
  flex: none;
  margin-left: auto;
  white-space: nowrap;
}
@media (min-width: 761px) {
  .buyer-goods-grid.with-card-marketing [appearance~="buyer-good-card"] {
    height: auto;
    min-height: 318px;
  }
  .buyer-goods-grid.with-card-marketing.is-text-only
    [appearance~="buyer-good-card"] {
    height: auto;
    min-height: 111px;
  }
  .buyer-goods-grid.with-card-marketing .buyer-good-content,
  .buyer-goods-grid.with-card-marketing.is-text-only .buyer-good-content {
    height: auto;
    min-height: 104px;
    gap: 16px;
  }
  [appearance~="buyer-good-card"].has-marketing .buyer-good-bottom {
    flex-wrap: wrap;
    gap: 4px;
  }
  [appearance~="buyer-good-card"].has-marketing .buyer-good-prices {
    flex: none;
    max-width: 100%;
    flex-wrap: wrap;
  }
  [appearance~="buyer-good-card"].has-marketing .buyer-good-offers > small {
    flex: none;
    white-space: nowrap;
    padding: 2px 4px;
  }
  [appearance~="buyer-good-card"].has-marketing .marketing-badges {
    display: contents;
  }
  [appearance~="buyer-good-card"].has-marketing .marketing-badges > span {
    flex: none;
    max-width: 100%;
    padding: 2px 4px;
    height: auto;
    min-height: 20px;
    font-size: 12px;
    line-height: 16px;
    white-space: normal;
    overflow-wrap: anywhere;
  }
}
[appearance~="purchase-coupon-input"] {
  width: 182px;
  height: 32px;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: 2px;
  background: #f2f3f5;
  outline: none;
  font-size: 13px;
}
[appearance~="purchase-coupon-input"]::placeholder,
.purchase-contact input::placeholder {
  color: #86909c;
}
@media (min-width: 761px) {
  [appearance~="purchase-coupon-input"]:hover,
  .purchase-contact input:hover {
    background: #e5e6eb;
  }
}
[appearance~="purchase-coupon-input"]:focus,
.purchase-contact input:focus {
  background: #fff;
  border-color: var(--fk-primary);
  outline: none;
}
.purchase-contact input {
  border: 1px solid transparent;
  border-radius: 2px;
  transition:
    background-color 0.1s ease,
    border-color 0.1s ease;
}
[appearance~="standalone-home-link"] {
  display: block;
  height: 29px;
  padding: 5px;
  border-radius: 4px;
  background: #fff7e8;
  color: #f49a16;
  font-size: 12px;
}
@media (min-width: 761px) {
  [appearance~="standalone-home-link"]:hover {
    background: #ffefd0;
  }
}
[appearance~="standalone-share"] {
  width: 100%;
  height: 37px;
  margin-top: 8px;
  border: 1px solid #eceef2;
  border-radius: 9px;
  background: #fff;
  color: #f68a1a;
  font-size: 12px;
}
@media (min-width: 761px) {
  [appearance~="standalone-share"]:hover {
    background: #fff8ee;
  }
}
.standalone-good-card h1 {
  margin: 0 0 13px;
  color: #20232b;
  font-size: 24px;
  line-height: 1.35;
  font-weight: 700;
}
.standalone-seller a {
  color: #ffb000;
  font-size: 14px;
}
[appearance~="standalone-seller-name"] {
  display: inline-block;
  font-weight: 600;
}
[appearance~="standalone-seller-contact-button"] {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  width: 76px;
  height: 25px;
  padding: 0 9px;
  border: 0;
  border-radius: 3px;
  background: transparent;
  color: #2463ff;
  cursor: pointer;
}
@media (min-width: 761px) {
  [appearance~="standalone-seller-contact-button"]:hover {
    background: #edf0f4;
  }
}
[appearance~="standalone-seller-contact-button"][aria-expanded="true"] {
  background: #edf0f4;
}
.standalone-seller-contact-popover a {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #515866;
  white-space: nowrap;
}
[appearance~="standalone-price-toggle"] {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 8px;
  padding: 4px 0;
  border: 0;
  background: transparent;
  color: #9aa5b2;
  font-size: 12px;
  cursor: pointer;
}
[appearance~="standalone-price-toggle"] > span {
  font-size: 16px;
  line-height: 10px;
}
.standalone-description.is-empty [appearance~="standalone-price-toggle"] {
  margin-top: 67px;
}
.standalone-contact input {
  flex: 0 1 287px;
}
.standalone-pay button {
  min-width: 130px;
  padding: 10px 17px;
}
.standalone-purchase-bar .quantity-stepper {
  border: 0;
  gap: 0;
}
.standalone-purchase-bar .quantity-stepper button,
.standalone-purchase-bar .quantity-stepper span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  background: #f5f6f8;
  color: #667186;
  font-size: 18px;
  line-height: 1;
}
.standalone-purchase-bar .quantity-stepper button {
  width: 36px;
  cursor: pointer;
}
@media (min-width: 761px) {
  .standalone-purchase-bar .quantity-stepper button:hover:not(:disabled) {
    background: #e2e5eb;
    color: #4c5669;
  }
}
.standalone-purchase-bar .quantity-stepper button:disabled {
  color: #c9ced6;
  cursor: not-allowed;
}
.standalone-purchase-bar .quantity-stepper input {
  box-sizing: border-box;
  width: 50px;
  height: 36px;
  padding: 0;
  border: 1px solid #e9ebef;
  border-block: 0;
  border-radius: 0;
  background: #f1f2f5;
  color: #555b66;
  font: inherit;
  font-size: 15px;
  text-align: center;
  outline: none;
}
@media (min-width: 761px) {
  .standalone-purchase-bar .quantity-stepper input:hover:not(:focus) {
    background: #e2e5eb;
  }
}
.standalone-purchase-bar .quantity-stepper input:focus {
  border: 1px solid #2461ff;
  background: #fff;
}
[appearance~="buyer-purchase-button"] {
  height: 33px;
  padding: 0 16px;
  border-radius: 8px;
  background: #2461ff;
  border-color: #2461ff;
}
@media (min-width: 761px) {
  [appearance~="buyer-purchase-button"]:hover {
    background: #164ddf;
    border-color: #164ddf;
  }
}
@media (max-width: 500px) {
  .shop-custom-link [appearance~="shop-link-url-input"] {
    flex: 1 1 160px;
  }
  .standalone-good-card h1 {
    font-size: 20px;
  }
  .standalone-contact input {
    flex: 1;
  }
}
.knowledge-publish-page .card-publish-row > input {
  max-width: 695px;
}
.knowledge-segments button {
  border: 0;
  background: transparent;
  color: #4e5969;
  padding: 6px 12px;
  font-size: 13px;
}
.knowledge-segments button.active {
  background: #fff;
  color: var(--fk-primary);
}
@media (min-width: 761px) {
  .knowledge-segments button:hover:not(.active) {
    background: #e5e6eb;
  }
}
[appearance~="knowledge-add-chapter"] {
  margin-top: 16px;
  border-radius: 18px;
  padding: 5px 16px;
}
.knowledge-chapter-dialog .modal-header {
  justify-content: center;
  position: relative;
  padding: 18px 48px;
}
.knowledge-chapter-dialog .modal-body {
  padding: 20px;
}
.knowledge-chapter-dialog .modal-footer {
  padding: 16px 20px;
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  border-top: 1px solid #e5e6eb;
}
.knowledge-chapter-form > label {
  color: #4e5969;
  margin-top: 10px;
}
.knowledge-chapter-form > input {
  width: 100%;
  height: 32px;
  border: 1px solid transparent;
  padding: 0 12px;
  background: #f2f3f5;
}
.knowledge-media-duration input {
  flex: 1;
  width: 0;
  min-width: 0;
  height: 32px;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: 0;
  background: #f2f3f5;
  color: #4e5969;
  outline: none;
}
@media (min-width: 761px) {
  .knowledge-media-duration input:hover {
    background: #e5e6eb;
  }
}
.knowledge-media-duration input:focus {
  border-color: var(--fk-primary);
  background: white;
}
[appearance~="knowledge-media-cancel"] {
  margin-top: 8px;
}
:is(.knowledge-shop, .resource-shop) .buyer-categories button {
  flex: 0 0 auto;
  width: auto;
  min-width: 60px;
  height: 28px;
  padding: 4px 14px;
  border: 1px solid #f0f0f0;
  border-radius: 3px;
  background: #f8f8f8;
  color: #86909c;
  box-shadow: none;
  font-size: 13px;
  flex-direction: row;
  align-items: center;
  gap: 5px;
}
:is(.knowledge-shop, .resource-shop) .buyer-categories button.active {
  color: white;
  background: var(--fk-primary);
  border-color: var(--fk-primary);
  box-shadow: none;
}
:is(.knowledge-shop, .resource-shop) .buyer-categories button::after,
:is(.knowledge-shop, .resource-shop) .buyer-categories button::before,
:is(.knowledge-shop, .resource-shop) .buyer-categories button small {
  display: none;
}
[appearance~="buyer-knowledge-item"] {
  display: block;
  text-align: left;
  width: 100%;
  padding: 20px 0;
  border: 0;
  border-bottom: 1px solid #f1f2f4;
  background: white;
  color: #4e5969;
}
[appearance~="buyer-knowledge-item"] h2 {
  font-size: 16px;
  margin: 0 0 16px;
  font-weight: 600;
}
.payment-setting-row > label {
  flex: 0 0 110px;
  text-align: right;
  padding-top: 8px;
}
.payment-setting-row > input,
.payment-setting-row > textarea,
.payment-setting-row > select {
  flex: 1;
  min-width: 0;
  padding: 8px 12px;
  border: 1px solid #e5e6eb;
  background: #f2f3f5;
  color: #4e5969;
  font: inherit;
}
.payment-certificate-input input {
  max-width: 100%;
  font: inherit;
}
[appearance~="payment-channel-table"] {
  width: 100%;
  min-width: 850px;
  border-collapse: collapse;
  color: #606266;
  font-size: 13px;
}
[appearance~="payment-channel-table"] th,
[appearance~="payment-channel-table"] td {
  border: 1px solid #e9edf5;
  padding: 13px 16px;
  text-align: center;
  font-weight: 400;
}
[appearance~="payment-channel-table"] th {
  background: #f5f7fa;
  white-space: nowrap;
}
[appearance~="payment-channel-table"] td:nth-child(2),
[appearance~="payment-channel-table"] th:nth-child(2),
[appearance~="payment-channel-table"] td:nth-child(3),
[appearance~="payment-channel-table"] th:nth-child(3) {
  text-align: left;
}
[appearance~="payment-channel-table"] .table-actions {
  justify-content: center;
  white-space: nowrap;
}
[appearance~="payment-channel-table"] tbody tr {
  transition: background-color 0.15s;
}
@media (min-width: 761px) {
  [appearance~="payment-channel-table"] tbody tr:hover {
    background: #f5f5f5;
  }
}
[appearance~="payment-channel-table"] .toggle-switch:focus-visible {
  outline: 2px solid #409eff;
  outline-offset: 3px;
}
[appearance~="payment-channel-table"] .toggle-switch {
  cursor: pointer;
  transition:
    background-color 0.15s,
    box-shadow 0.15s;
}
@media (min-width: 761px) {
  [appearance~="payment-channel-table"] .toggle-switch:hover {
    box-shadow: 0 0 0 4px #e8f1ff;
    background: #aabbd6;
  }
}
@media (min-width: 761px) {
  [appearance~="payment-channel-table"] .toggle-switch.on:hover {
    background: #4b7fff;
  }
}
[appearance~="payment-channel-table"] button:disabled {
  cursor: wait;
  opacity: 0.6;
}
.payment-mode-tags > button {
  padding: 3px 7px;
  border: 1px solid #e0e4eb;
  background: #f7f8fa;
  border-radius: 2px;
  color: #909399;
  font: inherit;
  font-size: 12px;
  white-space: nowrap;
  cursor: pointer;
  transition:
    color 0.15s,
    border-color 0.15s,
    background-color 0.15s;
}
.payment-mode-tags > button.selected {
  border-color: #d5e8ff;
  background: #ecf5ff;
  color: #409eff;
}
@media (min-width: 761px) {
  .payment-mode-tags > button:hover {
    border-color: #409eff;
    background: #e0eeff;
    color: var(--fk-primary);
  }
}
.payment-config-dialog .modal-header h2 {
  font-size: var(--heading-dialog-size);
  font-weight: var(--heading-weight);
  color: #606266;
  line-height: 1.5;
}
.payment-config-dialog .modal-header {
  border: 0;
}
.payment-config-dialog .modal-body {
  padding-top: 6px;
}
.payment-config-dialog .payment-setting-row > label {
  flex-basis: auto;
  padding: 0;
  text-align: left;
  color: #606266;
}
.payment-config-dialog .payment-setting-row > input,
.payment-config-dialog .payment-setting-row > textarea {
  width: 100%;
  background: white;
  border-color: #dcdfe6;
  border-radius: 2px;
  resize: vertical;
}
.payment-config-dialog .payment-setting-row > textarea {
  min-height: 58px;
  max-height: 150px;
}
.payment-certificate-input > input[readonly] {
  min-width: 0;
  flex: 1;
  padding: 8px 10px;
  border: 1px solid #dcdfe6;
  background: white;
  color: #606266;
  outline: none;
}
.payment-certificate-upload input {
  position: absolute;
  inset: 0;
  width: 100%;
  opacity: 0;
  cursor: pointer;
}
.payment-config-dialog .modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  padding: 16px 20px;
  background: white;
  border-top: 1px solid #edf0f6;
}
.buyer-order-details > header a,
.after-sales-header > a {
  color: #1d2129;
  font-size: 25px;
  line-height: 1;
}
.buyer-order-details h1,
.after-sales-header h1 {
  margin: 0;
  font-size: var(--heading-page-size);
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
.buyer-order-contact button {
  margin-left: auto;
}
[appearance~="buyer-order-after-sales"] {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 8px 14px;
  border-radius: 8px;
  color: #3370ff;
  background: #f2f3f5;
}
@media (min-width: 761px) {
  [appearance~="buyer-order-after-sales"]:hover {
    background: #e8f1ff;
  }
}
.after-sales-header > button {
  margin-left: auto;
  font-size: 12px;
}
.after-sales-row > label:first-child {
  padding-top: 8px;
  text-align: right;
  color: #4e5969;
}
.after-sales-row input:not([type="file"]):not(.search-select input),
.after-sales-row textarea {
  width: 100%;
  border: 1px solid transparent;
  background: #f2f3f5;
  padding: 7px 12px;
  min-height: 32px;
  color: #4e5969;
  font: inherit;
  outline: none;
  border-radius: 1px;
}
.after-sales-row input:not([type="file"]):not(.search-select input):focus,
.after-sales-row textarea:focus {
  border-color: #3370ff;
  background: white;
}
.after-sales-row .search-select {
  width: 100%;
}
.after-sales-row .search-select > button {
  background: transparent;
}
.after-sales-description textarea {
  display: block;
  min-height: 54px;
  resize: vertical;
  padding-bottom: 22px;
}
[appearance~="complaint-image-add"] {
  position: relative;
  width: 80px;
  height: 80px;
  background: #f2f3f5;
  border: 1px dashed #e2e6ec;
}
[appearance~="complaint-image-add"] {
  display: grid;
  place-items: center;
  font-size: 22px;
  color: #86909c;
  cursor: pointer;
}
@media (min-width: 761px) {
  [appearance~="complaint-image-add"]:hover {
    border-color: #3370ff;
    color: #3370ff;
  }
}
[appearance~="complaint-image-add"] input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}
.complaint-image-preview button {
  position: absolute;
  top: 0;
  right: 0;
  border: 0;
  background: #0008;
  color: white;
  cursor: pointer;
}
@media (max-width: 640px) {
  .after-sales-row > label:first-child {
    text-align: left;
    padding: 0;
  }
}
.payment-order-card h1 {
  font-size: var(--heading-page-size);
  margin: 0 0 14px;
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
.payment-order-card [appearance~="inline-notice"] {
  display: block;
}
.payment-unlock label {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.payment-unlock input {
  padding: 8px 12px;
  border: 1px solid #e5e6eb;
}
.buyer-card-selection label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
@media (max-width: 600px) {
  .payment-setting-row > label {
    flex-basis: auto;
    text-align: left;
  }
  .payment-setting-row > input,
  .payment-setting-row > textarea,
  .payment-setting-row > select {
    width: 100%;
  }
}
[appearance~="knowledge-read-more"] {
  display: block;
  width: 100%;
  margin: 6px 0 0;
  padding: 0;
  border: 0;
  background: none;
  color: #86909c;
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
}
[appearance~="knowledge-read-more"] span {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  vertical-align: middle;
  color: var(--fk-primary);
  margin: 0 2px;
}
[appearance~="knowledge-paid-notice"] {
  display: flex;
  align-items: center;
  padding: 16px 0;
}
.standalone-good-card
  .knowledge-article
  .rich-product-content
  :is(h1, h2, h3, h4, h5, h6) {
  margin: 20px 0;
  line-height: 1.5;
  font-weight: 700;
  color: #333;
}
.standalone-good-card .knowledge-article .rich-product-content h1 {
  font-size: 2em;
}
.knowledge-article [appearance~="standalone-price-toggle"] {
  margin-top: 16px;
}
[appearance~="knowledge-course-tabs"] {
  position: relative;
  display: flex;
  height: 36px;
  border-bottom: 1px solid #f2f3f5;
  gap: 28px;
}
[appearance~="knowledge-course-tabs"] button {
  padding: 0 0 9px;
  border: 0;
  background: none;
  color: #4e5969;
  font: inherit;
  line-height: 24px;
}
[appearance~="knowledge-course-tabs"] button.active {
  color: #3370ff;
  font-weight: 700;
  border-bottom: 3px solid #3370ff;
}
[appearance~="knowledge-course-row"] {
  display: flex;
  width: 100%;
  padding: 16px 0;
  border: 0;
  border-bottom: 1px solid #f1f1f1;
  background: transparent;
  color: #4e5969;
  text-align: left;
  font: inherit;
  line-height: 1.5715;
}
@media (min-width: 761px) {
  [appearance~="knowledge-course-row"]:hover .knowledge-course-preview {
    background: #aff0b5;
  }
}
@media (min-width: 761px) {
  [appearance~="knowledge-course-row"]:hover .knowledge-course-lock.unlocked {
    background: #e5e6eb;
  }
}
.knowledge-reading-dialog .modal-header {
  position: relative;
  justify-content: center;
  min-height: 48px;
  padding: 16px 48px;
}
.knowledge-reading-dialog .modal-header h2 {
  font-size: var(--heading-dialog-size);
  font-weight: var(--heading-weight);
  overflow-wrap: anywhere;
  text-align: center;
  line-height: 1.5;
}
.knowledge-reading-dialog .modal-body {
  padding: 0;
}
[appearance~="knowledge-download"] {
  color: var(--fk-primary);
  text-decoration: underline;
}
.knowledge-purchase-dialog .modal-header,
.knowledge-purchase-dialog .modal-footer {
  flex-shrink: 0;
}
.knowledge-purchase-dialog .modal-body {
  min-height: 0;
  overflow-y: auto;
}
.knowledge-purchase-dialog .modal-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 16px;
  padding: 0 20px 20px;
}
@media (max-width: 650px) {
  [appearance~="knowledge-course-tabs"] {
    display: none;
  }
}
.sales-tabs button {
  border: 0;
  border-bottom: 2px solid transparent;
  padding: 0;
  background: transparent;
  color: #4f5d74;
  font: inherit;
  font-size: 16px;
  cursor: pointer;
}
.sales-tabs button.active {
  color: var(--fk-primary);
  border-bottom-color: var(--fk-primary);
}
.sales-heading h1 {
  margin: 0;
  font-size: var(--heading-page-size);
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
[appearance~="sales-export"] {
  margin-left: auto;
  border: 0;
  border-radius: 2px;
  padding: 7px 16px;
  background: transparent;
  color: var(--fk-primary);
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}
@media (min-width: 761px) {
  [appearance~="sales-export"]:hover:not(:disabled) {
    background: #f1f2f5;
  }
}
[appearance~="sales-export"]:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
[appearance~="sales-chart-tabs"] {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
[appearance~="sales-chart-tabs"] {
  margin: 22px 0 12px 26px;
}
.sales-periods button,
[appearance~="sales-chart-tabs"] button {
  border: 0;
  border-radius: 18px;
  padding: 5px 15px;
  background: transparent;
  color: #4f5d74;
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}
@media (min-width: 761px) {
  .sales-periods button:hover,
  [appearance~="sales-chart-tabs"] button:hover {
    background: #f2f3f5;
  }
}
.sales-periods button.active,
[appearance~="sales-chart-tabs"] button.active {
  background: #f2f3f5;
  color: var(--fk-primary);
}
[appearance~="sales-report-table"] {
  width: 100%;
  min-width: 800px;
  border-collapse: collapse;
  table-layout: fixed;
  text-align: left;
}
[appearance~="sales-report-table"] th,
[appearance~="sales-report-table"] td {
  height: 47px;
  padding: 0 14px;
  border-bottom: 1px solid #e5e8ef;
  font-size: 13px;
}
[appearance~="sales-report-table"] th {
  color: #4e5969;
  font-weight: 500;
}
[appearance~="sales-report-table"] td {
  color: #677487;
}
@media (min-width: 761px) {
  [appearance~="sales-report-table"] tbody tr:hover {
    background: #f6f7f9;
  }
}
[appearance~="sales-report-table"] .sales-report-empty {
  height: 130px;
  text-align: center;
  color: #9ba6b6;
}
@media (max-width: 600px) {
  [appearance~="sales-chart-tabs"] {
    margin-left: 0;
  }
}
.email-notice-page h1 {
  margin: 0 0 20px;
  font-size: var(--heading-page-size);
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
[appearance~="email-notice-banner"] {
  position: relative;
  height: 220px;
  overflow: hidden;
  border-radius: 5px;
}
[appearance~="email-notice-banner"] > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
[appearance~="email-notice-banner"] > div {
  position: absolute;
  top: 60px;
  left: 80px;
  max-width: 500px;
}
[appearance~="email-notice-banner"] h2 {
  margin: 0 0 7px;
  color: #43566e;
  font-size: 30px;
  font-weight: 700;
}
[appearance~="email-notice-banner"] p {
  margin: 0;
  color: #7a8ca9;
  font-size: 14px;
  line-height: 1.5;
}
.email-notice-form > input {
  width: 360px;
  max-width: 100%;
  height: 33px;
  border: 0;
  border-radius: 2px;
  background: #f1f2f5;
  color: #1d2638;
  font: inherit;
  font-size: 13px;
  transition:
    background-color 0.1s linear,
    box-shadow 0.1s linear;
}
.email-notice-form > input {
  padding: 0 12px;
}
@media (min-width: 761px) {
  .email-notice-form > input:hover:not(:focus) {
    background: #e5e6eb;
  }
}
.email-notice-form > input:focus {
  outline: 0;
  background: #fff;
  box-shadow: inset 0 0 0 1px var(--fk-primary);
}
[appearance~="email-code-field"] input {
  flex: 1;
  min-width: 0;
  height: 100%;
  padding: 0 12px;
  border: 0;
  outline: 0;
  background: transparent;
  color: #1d2638;
  font: inherit;
  font-size: 13px;
}
.email-notice-form input::placeholder {
  color: #98a4b6;
}
[appearance~="email-code-field"] button {
  flex: none;
  height: 24px;
  margin-right: 12px;
  border: 0;
  border-radius: 2px;
  background: transparent;
  padding: 0 10px;
  color: var(--fk-primary);
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}
@media (min-width: 761px) {
  [appearance~="email-code-field"]:hover:not(:focus-within) button {
    background: #f1f2f5;
  }
}
[appearance~="email-code-field"]:focus-within button {
  background: #e5e6eb;
}
[appearance~="email-code-field"] button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
[appearance~="email-bind-button"] {
  min-height: 32px;
  padding: 0 16px;
  margin-top: 0;
  border-radius: 2px;
}
.email-notice-bound button {
  border: 0;
  padding: 5px 12px;
  background: #f1f2f5;
  color: #526076;
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}
@media (min-width: 761px) {
  .email-notice-bound button:hover {
    background: #e5e6eb;
  }
}
[appearance~="email-notice-switch"] {
  position: relative;
  display: block;
  width: 28px;
  height: 16px;
  border: 0;
  border-radius: 12px;
  padding: 0;
  background: #c9cdd4;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    box-shadow 0.15s ease;
}
@media (min-width: 761px) {
  [appearance~="email-notice-switch"]:hover:not(:disabled) {
    background: #aabbd6;
    box-shadow: 0 0 0 4px #e8f1ff;
  }
}
[appearance~="email-notice-switch"]:focus-visible {
  background: #aabbd6;
  box-shadow: 0 0 0 4px #e8f1ff;
}
@media (min-width: 761px) {
  [appearance~="email-notice-switch"].on:hover:not(:disabled) {
    background: #4b7fff;
  }
}
[appearance~="email-notice-switch"].on:focus-visible {
  background: #4b7fff;
}
[appearance~="email-notice-switch"]:focus-visible {
  outline: 2px solid var(--fk-primary);
  outline-offset: 3px;
}
[appearance~="email-notice-switch"].on {
  background: var(--fk-primary);
}
[appearance~="email-notice-switch"]:disabled {
  cursor: not-allowed;
}
[appearance~="email-notice-switch"] > span {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #fff;
  transition: left 0.15s ease;
}
[appearance~="email-notice-switch"].on > span {
  left: 14px;
}
@media (max-width: 700px) {
  [appearance~="email-notice-banner"] {
    height: 180px;
  }
  [appearance~="email-notice-banner"] > div {
    top: 38px;
    left: 20px;
    max-width: 75%;
  }
  [appearance~="email-notice-banner"] h2 {
    font-size: 21px;
  }
  [appearance~="email-notice-banner"] p {
    font-size: 12px;
  }
}
@media (min-width: 761px) {
  .cards-add-breadcrumb a:hover {
    color: var(--fk-primary);
  }
}
.cards-add-breadcrumb h1 {
  margin: 0;
}
[appearance~="cards-add-textarea"] {
  display: block;
  width: 100%;
  min-height: 300px;
  padding: 8px 12px;
  border: 1px solid transparent;
  border-radius: 2px;
  outline: none;
  background: #f1f2f5;
  color: #1d2638;
  line-height: 1.55;
  resize: vertical;
}
[appearance~="cards-add-textarea"]::placeholder {
  color: #8190aa;
  opacity: 1;
}
@media (min-width: 761px) {
  [appearance~="cards-add-textarea"]:hover:not(:focus) {
    background: #e5e6eb;
  }
}
[appearance~="cards-add-textarea"]:focus {
  border-color: var(--fk-primary);
  background: #fff;
}
.cards-add-options label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  cursor: pointer;
}
[appearance~="cards-txt-import"] {
  margin-left: auto;
}
[appearance~="cards-tool-button"] {
  min-height: 25px;
  padding: 3px 12px;
  border: 0;
  border-radius: 2px;
  background: #f1f2f5;
  color: #4e5969;
  font-size: 12px;
}
@media (min-width: 761px) {
  [appearance~="cards-tool-button"]:hover {
    background: #e5e6eb;
  }
}
[appearance~="cards-tool-button"]:focus-visible {
  outline: 1px solid var(--fk-primary);
}
.cards-helper-dialog .modal-header {
  position: relative;
  justify-content: center;
  height: 48px;
  border-bottom: 0;
}
.cards-helper-dialog .modal-header h2 {
  font-size: var(--heading-section-size);
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
.cards-helper-dialog .modal-body {
  padding: 22px 20px 0;
}
.cards-tool-form > label {
  display: grid;
  grid-template-columns: 85px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  color: #4e5969;
  text-align: right;
}
.cards-tool-form > label > input {
  width: 100%;
  height: 34px;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: 2px;
  outline: none;
  background: #f2f3f5;
  color: #1d2638;
  transition:
    background-color 0.15s,
    border-color 0.15s;
}
@media (min-width: 761px) {
  .cards-tool-form > label > input:hover:not(:focus) {
    background: #e5e6eb;
  }
}
.cards-tool-form > label > input:focus {
  border-color: var(--fk-primary);
  background: #fff;
}
.cards-tool-types label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #1d2638;
  white-space: nowrap;
  cursor: pointer;
}
.cards-tool-form .modal-actions {
  margin: 26px -20px 0;
  padding: 16px 20px;
  border-top: 1px solid #e5e6eb;
}
@media (max-width: 650px) {
  .cards-tool-form > label {
    grid-template-columns: 75px minmax(0, 1fr);
    gap: 9px;
  }
  [appearance~="cards-add-textarea"] {
    min-height: 300px;
  }
}
[appearance~="payment-account-add"] {
  border: 1px solid #b3d8ff;
  color: #1890ff;
  background: #ecf5ff;
  padding: 4px 10px;
  margin-bottom: 16px;
  cursor: pointer;
}
[appearance~="payment-account-table"] {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
  color: #606266;
}
[appearance~="payment-account-table"] th {
  background: #f5f7fa;
  font-weight: 400;
}
[appearance~="payment-account-table"] th,
[appearance~="payment-account-table"] td {
  padding: 12px;
  border-bottom: 1px solid #ebeef5;
}
[appearance~="payment-account-table"] th:last-child {
  text-align: right;
}
[appearance~="payment-account-table"] th:first-child {
  width: 58%;
}
@media (min-width: 761px) {
  [appearance~="payment-account-table"] tr:hover td {
    background: #f5f5f5;
  }
}
[appearance~="payment-account-table"] .toggle-switch {
  vertical-align: middle;
}
.payment-test-dialog .modal-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  padding: 16px 20px;
  border-top: 1px solid #edf0f6;
}
[appearance~="payment-test-stepper"] {
  display: flex;
  border: 1px solid #dcdfe6;
  height: 32px;
}
[appearance~="payment-test-stepper"] button {
  width: 32px;
  border: 0;
  background: #f5f7fa;
  color: #606266;
  cursor: pointer;
}
@media (min-width: 761px) {
  [appearance~="payment-test-stepper"] button:hover:not(:disabled) {
    color: #1890ff;
  }
}
[appearance~="payment-test-stepper"] button:disabled {
  color: #c0c4cc;
  cursor: not-allowed;
}
[appearance~="payment-test-stepper"] input {
  width: 84px;
  height: 30px;
  border: 0;
  border-left: 1px solid #dcdfe6;
  border-right: 1px solid #dcdfe6;
  border-radius: 0;
  text-align: center;
  background: white;
  appearance: textfield;
}
[appearance~="payment-test-stepper"] input::-webkit-inner-spin-button {
  appearance: none;
}
.payment-test-dialog textarea {
  width: 100%;
  margin: 8px 0 16px;
  border: 1px solid #dcdfe6;
  padding: 8px;
  background: white;
}
@media (max-width: 640px) {
  [appearance~="payment-account-table"] th:first-child {
    width: auto;
  }
  [appearance~="payment-account-table"] th,
  [appearance~="payment-account-table"] td {
    padding: 8px 4px;
  }
}
.cashier-page .wechat-cashier-header h1 {
  font-size: 18px;
  font-weight: 600;
  margin: 0;
}
[appearance~="cashier-order-query"] {
  margin-left: auto;
  padding: 10px 24px;
  color: white;
  background: linear-gradient(#517eff, #2c5cff);
  border-radius: 22px;
  box-shadow: 0 3px 5px #426aff33;
  font-size: 13px;
}
@media (min-width: 761px) {
  [appearance~="cashier-order-query"]:hover {
    filter: brightness(1.05);
  }
}
.cashier-page .wechat-cashier-order button {
  border: 0;
  background: transparent;
  color: #3370ff;
  font-size: 12px;
  cursor: pointer;
  padding: 2px 6px;
  border-radius: 5px;
}
@media (min-width: 761px) {
  .cashier-page .wechat-cashier-order button:hover {
    background: #f1f2f4;
  }
}

.cashier-page .wechat-cashier-header h1 {
  color: #4371ff;
}

/* typography controls */

.merchant-main h1:not(:where(.rich-product-content *, .w-e-text-container *)) {
  font-size: var(--heading-page-size);
  font-weight: var(--heading-weight);
  line-height: 1.5;
  color: var(--heading-color);
}

.modal-header h2 {
  color: var(--heading-color);
}

.merchant-main
  h2:not(
    :where(
      .rich-product-content *,
      .w-e-text-container *,
      [appearance~="email-notice-banner"] *
    )
  ) {
  font-size: var(--heading-section-size);
  font-weight: var(--heading-weight);
  line-height: 1.5;
}

.merchant-main
  :is(
    [appearance~="tabs-line"],
    [appearance~="shop-tab-bar"],
    .goods-status-row,
    [appearance~="login-log-tabs"]
  )
  > :is(a, button) {
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
}

.merchant-main
  :is(
    .goods-type-row [appearance~="tabs-line"],
    [appearance~="shop-tab-bar"],
    .category-page > [appearance~="tabs-line"]
  )
  > :is(a, button) {
  font-size: 15px;
  font-weight: 500;
}

.merchant-main
  :is(
    [appearance~="tabs-line"],
    [appearance~="shop-tab-bar"],
    .goods-status-row,
    [appearance~="login-log-tabs"]
  )
  > .active,
.merchant-main
  :is(
    .goods-type-row [appearance~="tabs-line"],
    [appearance~="shop-tab-bar"],
    .category-page > [appearance~="tabs-line"]
  )
  > .active {
  font-weight: var(--heading-weight);
}

.merchant-main .section-surface > h1:has(+ .section-muted) {
  margin-bottom: 8px;
}
.merchant-main :is(.news-admin-header, .complaint-heading) > h1 {
  margin: 0;
}
/* merchant-controls controls */
html.merchant-interface .merchant-detail-modal .modal-header {
  position: relative;
  justify-content: center;
  border-bottom: 0;
  height: 64px;
  padding: 22px 44px 10px;
}
html.merchant-interface .merchant-detail-modal .modal-header .fk-action-icon {
  position: absolute;
  top: 50%;
  right: 16px;
  transform: translateY(-50%);
}
html.merchant-interface .merchant-detail-modal .modal-body {
  padding: 20px 28px 28px;
}
html.merchant-interface .account-verification-dialog .modal-body {
  padding: 12px 24px 20px;
}
html.merchant-interface .email-binding-dialog-form > input {
  width: 100%;
  height: 36px;
}
@media (min-width: 761px) {
  html.merchant-interface body [appearance~="email-code-field"] input:hover {
    background: transparent;
    border: 0;
    outline: 0;
    box-shadow: none;
    height: 100%;
  }
}
html.merchant-interface body [appearance~="email-code-field"] input,
html.merchant-interface body [appearance~="email-code-field"] input:focus {
  background: transparent;
  border: 0;
  outline: 0;
  box-shadow: none;
  height: 100%;
}
html.merchant-interface [appearance~="email-code-field"] button {
  margin: 0 5px 0 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  height: 26px;
}
html.merchant-interface [appearance~="email-code-field"]:focus-within button {
  background: #eef4ff;
}
@media (min-width: 761px) {
  html.merchant-interface
    [appearance~="email-code-field"]
    button:hover:not(:disabled) {
    background: #e0ebff;
  }
}
html.merchant-interface .payment-test-dialog textarea {
  margin: 10px 0 12px;
  padding: 10px 12px;
  border-color: #e5e6eb;
  border-radius: 4px;
  resize: none;
  color: #4e5969;
  font-size: 12px;
  line-height: 18px;
}
html.merchant-interface [appearance~="product-type-card"] {
  transition:
    background-color 0.16s ease,
    box-shadow 0.16s ease,
    transform 0.16s ease;
}
@media (min-width: 761px) {
  html.merchant-interface [appearance~="product-type-card"]:hover {
    background: #edf3ff;
    box-shadow: 0 4px 14px #165dff12;
    transform: translateY(-2px);
  }
}
html.merchant-interface [appearance~="product-type-card"]:focus-visible {
  background: #edf3ff;
  box-shadow: 0 4px 14px #165dff12;
  transform: translateY(-2px);
}
@media (min-width: 761px) {
  html.merchant-interface
    [appearance~="product-type-card"]:hover
    .type-chevron {
    color: var(--fk-primary);
  }
}
@media (max-width: 600px) {
  html.merchant-interface .merchant-detail-modal .modal-body {
    padding: 16px 18px 22px;
  }
}
html.merchant-interface
  :is(
    .modal-panel .modal-footer,
    .modal-actions,
    .closed-reason-actions,
    .shop-address-actions,
    .goods-create-actions
  ) {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
}
html.merchant-interface .modal-panel .modal-footer {
  padding: 16px 20px;
  border-top: 1px solid #edf0f5;
}
html.merchant-interface .blacklist-confirmation .modal-body {
  padding-bottom: 20px;
}
html.merchant-interface
  :is(
    .modal-panel .modal-footer,
    .modal-actions,
    .closed-reason-actions,
    .shop-address-actions,
    .goods-create-actions
  )
  > :is(button, a):not(.fk-action-text) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 68px;
  height: 32px;
  min-height: 32px;
  padding: 5px 16px;
  border-radius: 4px;
  font-size: 13px;
  font-weight: 400;
  line-height: 20px;
  white-space: nowrap;
}
/* marketing controls */
.marketing-panel h1 {
  margin: 0 0 24px;
  font-size: 16px;
  font-weight: 600;
}
.marketing-back button {
  border: 0;
  background: none;
  color: #4e5969;
  padding: 0;
}
[appearance~="marketing-tip"] {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #e8f3ff;
  padding: 12px 16px;
  font-size: 13px;
  line-height: 1.7;
  color: #4e5969;
  margin: 0 0 16px;
  border-radius: 2px;
}
[appearance~="marketing-tip"] svg {
  color: var(--fk-primary);
  flex-shrink: 0;
}
[appearance~="marketing-tip"].warning {
  background: #fff7e8;
}
.marketing-search input {
  width: 200px;
  height: 32px;
}
.marketing-page input:not([type="checkbox"]):not([type="radio"]),
.marketing-picker .marketing-search input {
  box-sizing: border-box;
  border: 1px solid transparent;
  border-radius: 2px;
  background: #f2f3f5;
  color: #4e5969;
  font: inherit;
  padding: 5px 12px;
  outline: none;
}
.marketing-page input:not([type="checkbox"]):not([type="radio"]):focus,
.marketing-picker .marketing-search input:focus {
  border-color: var(--fk-primary);
  background: #fff;
}
.marketing-search button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 32px;
}
[appearance~="marketing-table"] {
  min-width: 750px;
}
[appearance~="marketing-table"] td {
  padding: 18px 16px;
}
[appearance~="marketing-type-tag"] {
  display: inline-block;
  padding: 2px 8px;
  font-size: 12px;
  line-height: 16px;
  background: #e8f3ff;
  color: var(--fk-primary);
  margin-top: 6px;
}
[appearance~="marketing-type-tag"].article {
  background: #fff3e8;
  color: #ff7d00;
}
[appearance~="marketing-type-tag"].resource {
  background: #fffbe6;
  color: #d99b00;
}
.marketing-actions [appearance~="codes-link"] {
  display: block;
  margin: 10px 0 0 auto;
}
[appearance~="marketing-error"] {
  color: #f53f3f;
  padding: 12px;
  background: #fff2f2;
}
.marketing-form [appearance~="form-tip"] {
  margin-left: 116px;
  margin-bottom: 20px;
}
.marketing-form-row > label {
  text-align: right;
  line-height: 32px;
  color: #4e5969;
}
[appearance~="marketing-input-suffix"] input {
  min-width: 0;
  flex: 1;
  width: 100%;
  height: 32px;
  border: 0;
  background: transparent;
}
.marketing-radio-row label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.marketing-radio-row label span {
  background: #f2f3f5;
  padding: 3px 8px;
  font-size: 12px;
}
.marketing-tier input {
  width: 100px;
  height: 32px;
}
[appearance~="marketing-pill"] {
  border: 0;
  background: #f2f3f5;
  color: #4e5969;
  border-radius: 16px;
  padding: 6px 16px;
}
[appearance~="marketing-pill"]:disabled {
  opacity: 0.4;
}
.marketing-category-field .search-select > button svg {
  transition: transform 0.15s;
}
.marketing-category-field .search-select.is-open > button svg {
  transform: rotate(180deg);
}
.marketing-category-options > button {
  padding-left: 16px;
  color: #4e5969;
}
.marketing-picker .modal-body {
  padding: 20px;
}
.marketing-picker .fk-table td {
  padding: 16px;
}
.marketing-picker .fk-table td:first-child {
  width: 40px;
}
.marketing-picker .fk-table td:last-child {
  white-space: nowrap;
}
.delete-popover.marketing-delete-popover {
  width: 146px;
  padding: 17px 16px 15px;
}
.delete-popover.marketing-code-delete-popover {
  width: 214px;
}
.delete-popover.marketing-delete-popover::after {
  left: var(--delete-arrow-left);
  right: auto;
}
.delete-popover.marketing-delete-popover.is-below::after {
  top: -6px;
  bottom: auto;
  transform: rotate(225deg);
}
.delete-popover.marketing-delete-popover p {
  margin-bottom: 16px;
}
[appearance~="marketing-code-search"] label {
  color: #4e5969;
  flex: none;
  font-size: 13px;
}
.marketing-codes [appearance~="marketing-code-search"] input {
  min-width: 0;
  flex: 1;
  width: 100%;
  border: 0;
  background: transparent;
  padding: 0 12px;
  height: 100%;
  outline: none;
  box-shadow: none;
}
.marketing-code-toolbar > button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 32px;
  white-space: nowrap;
}
html.merchant-interface .marketing-codes.modal-panel .modal-body {
  padding: 8px 20px 20px;
}
[appearance~="marketing-code-table"] {
  min-width: 710px;
}
[appearance~="marketing-code-table"] th,
[appearance~="marketing-code-table"] td {
  padding: 14px 16px;
  white-space: nowrap;
}
.marketing-codes .modal-header h2,
.marketing-code-editor .modal-header h2 {
  font-size: 16px;
  font-weight: 400;
}
.marketing-codes [appearance~="marketing-code-table"] th {
  background: #fff;
  color: #1d2129;
  font-weight: 400;
  height: 40px;
}
.marketing-codes [appearance~="marketing-code-table"] td {
  height: 48px;
  padding-top: 12px;
  padding-bottom: 12px;
}
[appearance~="marketing-code-table"] tbody tr:nth-child(odd) {
  background: #f7f8fa;
}
[appearance~="marketing-code-table"] code {
  font: inherit;
  font-size: 12px;
}
[appearance~="marketing-code-table"] th:last-child {
  text-align: right;
}
@media (max-width: 760px) {
  .marketing-form [appearance~="form-tip"] {
    margin-left: 0;
  }
  .marketing-tier input {
    width: 75px;
  }
}
/* controls controls */
.delete-popover::after {
  left: var(--delete-arrow-left, auto);
  right: auto;
}
.delete-popover.is-below::after {
  top: -6px;
  bottom: auto;
  transform: rotate(225deg);
}
.modal-panel:focus {
  outline: none;
}
.fk-spinner {
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-right: 6px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: fk-spin 0.7s linear infinite;
}
@keyframes fk-spin {
  to {
    transform: rotate(360deg);
  }
}
:where(.fk-toolbar) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}
/* Shared outlined controls: the hover rule applies to every caller. */
.fk-button.fk-button-round {
  border-radius: 20px;
}
.fk-button:disabled {
  cursor: not-allowed;
}
.fk-tag-info {
  color: var(--fk-primary);
  background: #e8f3ff;
}
.fk-tag-success {
  color: #00b42a;
  background: #e8ffea;
}
.fk-tag-warning {
  color: #ff7d00;
  background: #fff7e8;
}
.fk-tag-error {
  color: #f53f3f;
  background: #ffece8;
}
.fk-tag[class*="fk-tag-"] {
  display: inline-block;
  padding: 2px 8px;
  font-size: 12px;
}
.fk-alert[class*="fk-alert-"] {
  padding: 12px 16px;
}
.fk-alert-info {
  background: #e8f3ff;
  color: var(--fk-primary);
}
.fk-alert-error {
  background: #ffece8;
  color: #f53f3f;
}
/* Composite control appearances */

[appearance~="data-code-field"] {
  display: flex;
  border: 1px solid transparent;
  background: #f2f3f5;
  height: 36px;
  border-radius: 2px;
  --fk-group-focus-shadow: none;
}
[appearance~="login-input-wrap"] {
  height: 37px;
  background: #f5f7fa;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 13px;
  color: #637187;
  margin-bottom: 19px;
  transition:
    background-color 0.1s linear,
    box-shadow 0.1s linear;
}
@media (min-width: 761px) {
  [appearance~="login-input-wrap"]:hover:not(:focus-within) {
    background: #e5e6eb;
  }
}
.merchant-main {
  min-width: 0;
}
.goods-filter-row [appearance~="search-field"] {
  border: 0;
  --fk-group-focus-shadow: inset 0 0 0 1px var(--fk-primary);
  background: #f5f7fa;
  width: 200px;
  height: 28px;
}
.goods-page .empty-state {
  padding: 20px 0 10px;
}
.goods-page .empty-state svg {
  width: 65px;
  height: 64px;
}
[appearance~="search-field"] {
  background: white;
  border: 1px solid #dce2ec;
  --fk-group-focus-shadow: none;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 10px;
  height: 34px;
  color: #8694a9;
  transition:
    background-color 0.15s,
    border-color 0.15s;
}
@media (min-width: 761px) {
  [appearance~="search-field"]:hover:not(:focus-within) {
    background: #e5e6eb;
  }
}
.empty-title {
  margin-top: 8px;
}
.empty-detail {
  font-size: 12px;
  margin-top: 5px;
}
[appearance~="buyer-search"] {
  display: flex;
  align-items: center;
  padding-left: 9px;
  color: #8a98aa;
}
.card-publish-editor-row .rich-text-editor {
  min-width: 0;
}
.rich-text-editor {
  border: 1px solid #f2f3f5;
  background: white;
  min-width: 0;
  --w-e-toolbar-color: #595959;
  --w-e-toolbar-border-color: #e5e6eb;
  --w-e-textarea-border-color: #e5e6eb;
}
.rich-editor-toolbar {
  border-bottom: 1px solid #f2f3f5;
}
.rich-editor-body {
  height: 198px;
  font-size: 14px;
}
.rich-text-editor .w-e-text-placeholder {
  color: #c9cdd4;
  font-style: italic;
}
.rich-text-editor .w-e-bar {
  background: white;
}
.rich-text-editor.w-e-full-screen-container {
  z-index: 5000;
}
.rich-editor-status,
.rich-editor-error {
  padding: 8px 12px;
  margin: 0;
  font-size: 13px;
}
.rich-editor-status {
  color: var(--fk-primary);
  background: #f2f7ff;
}
.rich-editor-error {
  color: #f53f3f;
}
.publish-success-backdrop {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: grid;
  place-items: center;
  background: #0008;
}
.publish-progress-backdrop {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 9px;
  background: #fff8;
  color: var(--fk-primary);
  font-size: 13px;
}
.publish-progress-spinner {
  width: 19px;
  height: 19px;
  border: 2px solid #165dff35;
  border-top-color: var(--fk-primary);
  border-radius: 50%;
  animation: publish-progress-spin 0.7s linear infinite;
}
.publish-success-panel {
  width: min(400px, calc(100vw - 32px));
  padding: 28px 32px 32px;
  border-radius: 8px;
  background: #fff;
  text-align: center;
}
.publish-success-panel h2 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 0;
  font-size: 16px;
  line-height: 24px;
  color: #1d2129;
  font-weight: 400;
}
.publish-success-panel h2 span {
  display: inline-grid;
  place-items: center;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #00b42a;
  color: #fff;
  font-size: 10px;
  line-height: 14px;
  font-weight: 500;
}
.publish-success-panel p {
  margin: 24px 0 32px;
  color: #1d2129;
  font-size: 13px;
  line-height: 22px;
  font-weight: 400;
  text-align: left;
}
@media (max-width: 800px) {
  .rich-text-editor .rich-editor-body {
    height: 180px;
  }
}
@media (max-width: 600px) {
  .orders-date-filter .date-range {
    flex: 1;
    width: 0;
    min-width: 230px;
  }
}
[appearance~="buyer-search"] {
  width: 220px;
  height: 32px;
  background: #f2f3f5;
  border: 0;
  padding: 0;
  transition:
    background-color 0.1s linear,
    box-shadow 0.1s linear;
}
@media (min-width: 761px) {
  [appearance~="buyer-search"]:hover:not(:focus-within) {
    background: #e5e6eb;
  }
}
.section-surface .empty-state {
  padding: 22px 0 25px;
}
.section-surface .empty-state svg {
  width: 55px;
  height: 44px;
}
@media (max-width: 500px) {
  [appearance~="buyer-search"] {
    width: 100%;
  }
}
.image-upload-card {
  position: relative;
  width: 80px;
  height: 80px;
  overflow: hidden;
  background: #f7f8fa;
  border: 1px solid #e5e6eb;
  border-radius: 2px;
}
.image-upload-card > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.image-upload-mask {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: #0008;
  opacity: 0;
  transition: opacity 0.1s ease;
}
@media (min-width: 761px) {
  .image-upload-card:hover .image-upload-mask {
    opacity: 1;
  }
}
.image-upload-card:focus-within .image-upload-mask {
  opacity: 1;
}
.image-upload-card.empty {
  border-style: dashed;
  border-color: #c9cdd4;
  background: #f2f3f5;
}
.image-upload-card .image-upload-file {
  display: none;
}
.image-upload-lightbox {
  position: fixed;
  inset: 0;
  z-index: 2100;
  display: grid;
  place-items: center;
  background: #000b;
}
.image-upload-lightbox img {
  max-width: min(70vw, 600px);
  max-height: 75vh;
  object-fit: contain;
}
@media (max-width: 600px) {
  .operation-toast {
    top: 20px;
    max-width: calc(100vw - 32px);
    white-space: normal;
  }
}
.shop-link-icon-control {
  position: relative;
  flex: 0 0 32px;
  width: 32px;
  height: 34px;
}
.shop-link-icon-button {
  display: grid;
  place-items: center;
  width: 32px;
  height: 34px;
  padding: 0;
  border: 1px solid #c9cdd4;
  border-radius: 3px;
  background: #f7f8fa;
  color: #86909c;
  cursor: pointer;
}
@media (min-width: 761px) {
  .shop-link-icon-button:hover {
    background: #e5e6eb;
    color: #4e5969;
  }
}
.shop-link-icon-button:focus-visible {
  background: #e5e6eb;
  color: #4e5969;
}
.shop-link-icon-button img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.knowledge-chapter-form .rich-text-editor {
  width: 100%;
}
[appearance~="email-code-field"] {
  width: 360px;
  max-width: 100%;
  height: 33px;
  border: 0;
  border-radius: 2px;
  background: #f1f2f5;
  color: #1d2638;
  font: inherit;
  font-size: 13px;
  transition:
    background-color 0.1s linear,
    box-shadow 0.1s linear;
}
@media (min-width: 761px) {
  [appearance~="email-code-field"]:hover:not(:focus-within) {
    background: #e5e6eb;
  }
}
[appearance~="email-code-field"] {
  display: flex;
  align-items: center;
}

.required-mark {
  color: #ff4d4f;
  font-style: normal;
  font-weight: 400;
}
[appearance~="marketing-input-suffix"] {
  display: flex;
  align-items: center;
  min-width: 0;
  background: #f2f3f5;
}
[appearance~="marketing-input-suffix"] > span {
  color: #86909c;
  padding: 0 12px;
  font-size: 13px;
  white-space: nowrap;
}
.marketing-form .date-range {
  width: 100%;
}
@media (min-width: 761px) {
  .marketing-form .date-range {
    width: 420px;
  }
}
.merchant-main .marketing-create-area h2 {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--fk-primary);
  font-size: 17px;
  margin: 0 0 20px;
}
[appearance~="marketing-code-search"] {
  display: flex;
  flex: 1;
  min-width: 230px;
  align-items: center;
  background: #f2f3f5;
  padding-left: 12px;
  height: 32px;
  margin-right: 8px;
  border: 1px solid transparent;
  border-radius: 2px;
  transition:
    background-color 0.15s,
    border-color 0.15s;
  --fk-group-focus-shadow: none;
}
@media (min-width: 761px) {
  [appearance~="marketing-code-search"]:hover:not(:focus-within) {
    background: #e5e6eb;
  }
}
html.merchant-interface
  .email-binding-dialog-form
  [appearance~="email-code-field"] {
  width: 100%;
  height: 36px;
}
html.merchant-interface [appearance~="email-code-field"] {
  position: relative;
  overflow: hidden;
  border: 1px solid transparent;
  box-shadow: none;
  --fk-group-focus-shadow: none;
}

.merchant-main
  :is(h2, h3):not(:where(.rich-product-content *, .w-e-text-container *)) {
  color: var(--heading-color);
}

.merchant-main h3:not(:where(.rich-product-content *, .w-e-text-container *)) {
  font-size: var(--heading-small-size);
  font-weight: var(--heading-weight);
  line-height: 1.5;
}

.merchant-main :is(.page-title-row p, .section-muted, .news-editor-help) {
  font-size: 13px;
  font-weight: 400;
  line-height: 1.6;
  color: #86909c;
}

.merchant-main .news-admin-items h2 {
  margin: 0;
}
.complaint-compose input {
  flex: 1;
  min-width: 0;
  background: #f2f3f5;
  border: 0;
  height: 32px;
  padding: 0 12px;
}
.complaint-compose button {
  white-space: nowrap;
  min-height: 32px;
  padding: 5px 16px;
}
.complaint-compose [appearance~="image-reply"] {
  padding: 5px 8px;
}
[appearance~="new-messages"] {
  position: absolute;
  bottom: 80px;
  left: 50%;
  transform: translateX(-50%);
  background: #e8f4ff;
  color: var(--fk-primary);
  border: 1px solid #bedaff;
  border-radius: 18px;
  padding: 7px 14px;
  cursor: pointer;
}
@media (max-width: 700px) {
  .complaint-compose input {
    flex-basis: 100%;
  }
}
[appearance~="pending-badge"] {
  cursor: grab;
  touch-action: none;
  user-select: none;
}
.is-dragging [appearance~="pending-badge"] {
  cursor: grabbing;
}
[appearance~="pending-badge"] {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 22px 24px;
  border: 0;
  border-radius: 9px;
  background: white;
  color: inherit;
  box-shadow: 0 12px 32px #165dff26;
  font-weight: 600;
  animation: pending-arrival 0.3s ease-out;
}
@media (min-width: 761px) {
  [appearance~="pending-badge"]:hover {
    background: #f2f3f5;
  }
}
[appearance~="pending-badge"] svg {
  color: #ff9b38;
}
.pending-panel header button {
  color: var(--fk-primary);
  font-size: 21px;
  width: 24px;
  height: 24px;
}
.pending-row a {
  margin-left: auto;
  color: var(--fk-primary);
  white-space: nowrap;
  padding: 4px;
}
@media (min-width: 761px) {
  .pending-row a:hover {
    background: #f2f3f5;
  }
}
@media (prefers-reduced-motion: reduce) {
  [appearance~="pending-badge"] {
    animation: none;
  }
}
@media (max-width: 600px) {
  [appearance~="pending-badge"] {
    padding: 16px;
  }
}
.human-captcha-dialog .modal-header {
  height: 52px;
  min-height: 52px;
  justify-content: center;
  border-bottom: 0;
  position: relative;
  padding: 14px 20px;
}
.human-captcha-dialog .modal-header h2 {
  font-size: var(--heading-dialog-size);
  font-weight: var(--heading-weight);
  color: #1d2129;
  line-height: 1.5;
}
.human-captcha-dialog .modal-header .fk-action-icon {
  position: absolute;
  right: 12px;
  top: 12px;
  color: #1d2129;
}
.human-captcha-dialog .modal-body {
  padding: 20px 20px 24px;
}
[appearance~="human-captcha-picture"] {
  display: block;
  width: 250px;
  max-width: 100%;
  height: 78px;
  margin: 0 auto 24px;
  padding: 0;
  border: 0;
  background: #f4fbfc;
  overflow: hidden;
}
[appearance~="human-captcha-picture"] img {
  display: block;
  width: 100%;
  height: 78px;
  object-fit: contain;
}
[appearance~="human-captcha-input"] {
  width: 100%;
  height: 32px;
  border: 1px solid transparent;
  border-radius: 2px;
  background: #f2f3f5;
  padding: 6px 12px;
  color: #4e5969;
  outline: 0;
}
[appearance~="human-captcha-input"]::placeholder {
  color: #86909c;
}
.human-captcha-dialog .modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  padding: 16px 20px;
  border-top: 1px solid #e5e6eb;
}
.human-captcha-dialog .modal-footer button {
  height: 32px;
  min-height: 32px;
  padding: 5px 16px;
  border-radius: 2px;
  border: 0;
}
.order-detail-dialog .modal-header,
.order-reissue-dialog .modal-header {
  justify-content: center;
  border-bottom: 0;
  position: relative;
}
.order-detail-dialog .modal-header h2,
.order-reissue-dialog .modal-header h2 {
  font-size: var(--heading-dialog-size);
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
.order-detail-dialog .modal-header .fk-action-icon,
.order-reissue-dialog .modal-header .fk-action-icon {
  position: absolute;
  right: 14px;
}
.order-detail-dialog .modal-body {
  padding: 32px 36px 36px;
}
[appearance~="detail-grid"] {
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid #e5e6eb;
  border-radius: 3px;
  width: 100%;
  table-layout: fixed;
  font-size: 14px;
  overflow: hidden;
}
[appearance~="detail-grid"] th,
[appearance~="detail-grid"] td {
  padding: 7px 18px;
  font-weight: 400;
  text-align: left;
  border-right: 1px solid #e5e6eb;
  border-bottom: 1px solid #e5e6eb;
  overflow-wrap: anywhere;
}
[appearance~="detail-grid"] th {
  background: #f7f8fa;
  color: #86909c;
  width: 138px;
}
[appearance~="detail-grid"] td:last-child {
  border-right: 0;
}
[appearance~="detail-grid"] tr:last-child > * {
  border-bottom: 0;
}
[appearance~="detail-order-grid"] th {
  width: 19%;
}
[appearance~="detail-order-grid"] td {
  width: 31%;
}
.order-reissue-dialog .modal-body {
  padding: 32px 20px 44px;
}
.reissue-quantity input {
  flex: 1;
  min-width: 0;
  height: 32px;
  border: 0;
  background: #f2f3f5;
  padding: 6px 12px;
}
.order-reissue-dialog .modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  padding: 16px 20px;
  border-top: 1px solid #e5e6eb;
}
@media (max-width: 600px) {
  .order-detail-dialog .modal-body {
    padding: 20px 14px;
  }
  [appearance~="detail-grid"] th,
  [appearance~="detail-grid"] td {
    padding: 7px;
  }
  [appearance~="detail-grid"] th {
    width: 100px;
  }
  [appearance~="detail-order-grid"] th {
    width: 23%;
  }
  [appearance~="detail-order-grid"] td {
    width: 27%;
  }
}
.ledger-wallet .search-select {
  width: 180px;
}
.ledger-wallet input {
  height: 29px;
  background: #f2f3f5;
  border: 0;
}
[appearance~="ledger-table"] {
  min-width: 800px;
}
[appearance~="ledger-table"] th {
  background: white;
  font-weight: 400;
}
[appearance~="ledger-table"] td {
  height: 55px;
  color: #86909c;
}
[appearance~="ledger-table"] th:first-child {
  width: 25%;
}
[appearance~="ledger-table"] th:nth-child(2) {
  width: 46%;
}
[appearance~="ledger-table"] th:nth-child(3) {
  width: 14%;
}
@media (min-width: 761px) {
  [appearance~="ledger-table"] tbody tr:hover {
    background: #f7f8fa;
  }
}
[appearance~="ledger-wallet-tag"] {
  font-size: 12px;
  background: #e8f3ff;
  color: var(--fk-primary);
  padding: 2px 8px;
}
[appearance~="ledger-wallet-tag"].wechat {
  background: #e8ffea;
  color: #00b42a;
}
[appearance~="ledger-wallet-tag"].epay {
  background: #f5e8ff;
  color: #9954e6;
}
[appearance~="ledger-wallet-tag"].codepay {
  background: #e8f3ff;
  color: var(--fk-primary);
}
[appearance~="ledger-wallet-tag"].other {
  background: #f2f3f5;
  color: #86909c;
}
.resource-order-note a {
  color: var(--fk-primary);
}
[appearance~="resource-disclaimer-toggle"] {
  padding: 0;
  border: 0;
  background: none;
  color: #86909c;
  margin: 26px 0 12px;
  font-size: 12px;
}
[appearance~="transaction-day-target"] {
  position: absolute;
  top: 0;
  bottom: 0;
  border: 0;
  background: transparent;
  cursor: crosshair;
  padding: 0;
}
[appearance~="transaction-day-target"]:focus-visible {
  outline: 1px dashed var(--fk-primary);
  outline-offset: 2px;
}
.complaints-list h1 {
  font-size: var(--heading-page-size);
  margin: 0 0 10px;
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
[appearance~="complaints-table"] {
  min-width: 1060px;
  margin-top: 22px;
}
[appearance~="complaints-table"] th {
  font-weight: 400;
  background: white;
}
[appearance~="complaints-table"] td {
  height: 82px;
  color: #86909c;
  line-height: 1.9;
}
[appearance~="complaints-table"] th:first-child {
  width: 190px;
}
[appearance~="complaints-table"] th:nth-child(2) {
  width: 45%;
}
[appearance~="complaints-table"] th:nth-child(3) {
  width: 140px;
}
[appearance~="complaints-table"] th:nth-child(4) {
  width: 100px;
}
[appearance~="complaints-table"] th:nth-child(5) {
  width: 245px;
}
[appearance~="complaints-table"] th:last-child {
  width: 115px;
}
[appearance~="complaint-history-link"] {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}
[appearance~="complaint-tag"] {
  display: inline-block;
  line-height: 20px;
  padding: 0 8px;
  font-size: 12px;
}
.complaint-heading > h1 {
  margin: 0;
  border-left: 1px solid #e5e6eb;
  padding-left: 10px;
}
[appearance~="finish-complaint"] {
  margin-left: 0;
}
[appearance~="refresh-complaint"] {
  margin-left: auto;
}
.complaint-summary label {
  color: #86909c;
  font-size: 12px;
}
.evidence-thumbs button {
  padding: 0;
  border: 0;
  background: white;
  border-radius: 12px;
  cursor: pointer;
}
.complaint-refund-form label {
  display: flex;
  gap: 12px;
  align-items: center;
}
.complaint-refund-form input:not([type="checkbox"]) {
  flex: 1;
  min-width: 0;
  height: 34px;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: 2px;
  background: #f2f3f5;
  color: #1d2638;
  transition:
    background-color 0.15s,
    border-color 0.15s;
}
.complaint-refund-form .refund-confirm input {
  width: 14px;
  height: 14px;
  flex: none;
}
.buyer-summary-card header a {
  font-size: 24px;
  line-height: 20px;
}
.buyer-summary-card h1 {
  font-size: var(--heading-page-size);
  margin: 0;
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
[appearance~="buyer-summary-table"] {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  min-width: 650px;
  border: 1px solid #e5e6eb;
  border-radius: 3px;
  overflow: hidden;
}
[appearance~="buyer-summary-table"] th,
[appearance~="buyer-summary-table"] td {
  border-right: 1px solid #e5e6eb;
  border-bottom: 1px solid #e5e6eb;
  padding: 8px 20px;
  font-weight: 400;
  text-align: left;
  font-size: 14px;
  line-height: 16px;
}
[appearance~="buyer-summary-table"] th {
  background: #f7f8fa;
  color: #86909c;
  white-space: nowrap;
  width: 96px;
}
[appearance~="buyer-summary-table"] td {
  color: #4e5969;
  overflow-wrap: anywhere;
}
[appearance~="buyer-summary-table"] th:nth-child(3) {
  width: 124px;
}
[appearance~="buyer-summary-table"] tr:last-child > * {
  border-bottom: 0;
}
[appearance~="buyer-summary-table"] tr > *:last-child {
  border-right: 0;
}
.inventory-heading a {
  color: #86909c;
}
.inventory-heading .search-select {
  min-width: 220px;
}
[appearance~="inventory-tabs"] {
  display: inline-flex;
  padding: 3px;
  background: #f2f3f5;
  gap: 2px;
}
[appearance~="inventory-tabs"] button {
  border: 0;
  background: transparent;
  color: #4e5969;
  padding: 5px 10px;
  white-space: nowrap;
  cursor: pointer;
  font-size: 12px;
}
[appearance~="inventory-tabs"] button.active {
  background: white;
  color: var(--fk-primary);
}
.inventory-search label {
  font-size: 12px;
  white-space: nowrap;
}
.inventory-search input {
  width: 170px;
  min-height: 30px;
  border: 0;
  background: #f2f3f5;
  padding: 5px 10px;
}
.inventory-search button {
  min-height: 30px;
  padding: 5px 15px;
}
[appearance~="inventory-action"] {
  border: 0;
  background: #f2f3f5;
  color: #4e5969;
  padding: 6px 10px;
  font-size: 12px;
  min-height: 30px;
  cursor: pointer;
  white-space: nowrap;
}
@media (min-width: 761px) {
  [appearance~="inventory-action"]:hover {
    background: #e5e6eb;
  }
}
[appearance~="inventory-action"].danger {
  background: #fff1f0;
  color: #f53f3f;
}
[appearance~="inventory-action"].success {
  background: #e8ffea;
  color: #00b42a;
}
[appearance~="inventory-action"].warning {
  background: #fff7e8;
  color: #ff7d00;
}
[appearance~="inventory-action"]:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
[appearance~="inventory-import"] {
  min-height: 30px;
  padding: 5px 12px;
  font-size: 12px;
}
[appearance~="inventory-table"] {
  width: 100%;
}
[appearance~="inventory-table"] th,
[appearance~="inventory-table"] td {
  padding: 9px 12px;
}
[appearance~="inventory-table"] th:first-child,
[appearance~="inventory-table"] td:first-child {
  width: 38px;
}
[appearance~="inventory-table"] th:nth-child(3) {
  width: 180px;
}
[appearance~="inventory-table"] th:nth-child(4) {
  width: 130px;
}
[appearance~="inventory-table"] th:last-child {
  width: 80px;
}
[appearance~="inventory-table"] input[type="checkbox"] {
  accent-color: var(--fk-primary);
}
@media (max-width: 700px) {
  .inventory-heading .search-select {
    min-width: 180px;
  }
  .inventory-search input {
    min-width: 0;
    flex: 1;
  }
  [appearance~="inventory-table"] {
    min-width: 600px;
  }
}
.after-sales-description textarea {
  height: 54px;
}
[appearance~="room-error"] {
  margin: 0;
  padding: 4px 20px;
}
[appearance~="login-log-tabs"] {
  display: flex;
  gap: 28px;
  border-bottom: 1px solid #e5e6eb;
  margin-bottom: 18px;
}
[appearance~="login-log-tabs"] button {
  border: 0;
  background: transparent;
  padding: 14px 0;
  color: #86909c;
  cursor: pointer;
  border-bottom: 2px solid transparent;
}
[appearance~="login-log-tabs"] button.active {
  color: var(--fk-primary);
  border-bottom-color: var(--fk-primary);
}
.orders-filters label {
  display: flex;
  align-items: center;
  gap: 12px;
}
.orders-filters input {
  width: 165px;
  height: 30px;
  padding: 0 12px;
}
[appearance~="login-log-table"] {
  min-width: 1150px;
}
[appearance~="login-log-table"] th {
  background: white;
  font-weight: 400;
}
[appearance~="login-log-table"] td {
  height: 58px;
  color: #86909c;
  max-width: 220px;
  overflow-wrap: anywhere;
}
[appearance~="login-log-table"] tbody tr {
  transition: background-color 0.16s ease;
}
@media (min-width: 761px) {
  [appearance~="login-log-table"] tbody tr:hover {
    background: #f2f6fc;
  }
}
@media (min-width: 761px) {
  [appearance~="login-log-table"] tbody tr:hover td {
    color: #4e5969;
  }
}
.lookup-history button {
  max-width: 100%;
  padding: 4px 8px;
  border: 1px solid #e5e6eb;
  border-radius: 3px;
  background: #f2f3f5;
  color: #4e5969;
  overflow-wrap: anywhere;
}
@media (min-width: 761px) {
  .lookup-history button:hover {
    background: #e5e6eb;
  }
}
.lookup-history [appearance~="lookup-history-clear"] {
  border: 0;
  border-radius: 50%;
  padding: 0;
  width: 22px;
  height: 22px;
  font-size: 17px;
}
.lookup-advisory [appearance~="lookup-advisory-alert"] {
  margin: 0;
  color: #f53f3f;
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
}
@media (max-width: 600px) {
  .lookup-card h1 {
    font-size: 22px;
    line-height: 1.5;
    margin-bottom: 20px;
  }
  .lookup-card h1 span {
    display: block;
  }
}
.buyer-order-list h1 {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: var(--heading-page-size);
  margin: 0;
  font-weight: var(--heading-weight);
  line-height: 1.5;
}
.buyer-order-list [appearance~="tabs-line"] {
  border: 0;
  margin: 8px 0 16px;
  height: 40px;
  gap: 32px;
}
.buyer-order-list [appearance~="tabs-line"] > button {
  height: 40px;
  padding: 8px 0 0;
}
[appearance~="buyer-list-table"] {
  min-width: 850px;
  table-layout: fixed;
}
[appearance~="buyer-list-table"] th {
  height: 54px;
  background: #f2f3f5;
  font-weight: 400;
  border: 0;
}
[appearance~="buyer-list-table"] th:nth-child(1) {
  width: 21%;
}
[appearance~="buyer-list-table"] th:nth-child(2) {
  width: 18%;
}
[appearance~="buyer-list-table"] th:nth-child(3) {
  width: 11%;
}
[appearance~="buyer-list-table"] th:nth-child(4) {
  width: 10%;
}
[appearance~="buyer-list-table"] th:nth-child(5) {
  width: 20%;
  text-align: center;
}
[appearance~="buyer-list-table"] th:nth-child(6) {
  width: 20%;
  text-align: center;
}
[appearance~="buyer-list-table"] td {
  height: 82px;
  padding: 16px;
  color: #4e5969;
  overflow-wrap: anywhere;
  white-space: normal;
}
[appearance~="buyer-list-table"] td:nth-child(3),
[appearance~="buyer-list-table"] td:nth-child(4),
[appearance~="buyer-list-table"] td:nth-child(5) {
  text-align: center;
}
[appearance~="buyer-list-table"] th:nth-child(3),
[appearance~="buyer-list-table"] th:nth-child(4) {
  text-align: center;
}
[appearance~="buyer-list-table"] td small {
  display: block;
  color: #86909c;
  font-size: 12px;
  margin-top: 7px;
}
[appearance~="buyer-list-table"] strong {
  color: #f53f3f;
  font-size: 15px;
}
[appearance~="buyer-entitlement"] {
  display: inline-block;
  border: 1px solid var(--fk-primary);
  color: var(--fk-primary);
  border-radius: 15px;
  padding: 3px 12px;
  font-size: 12px;
  white-space: nowrap;
}
@media (min-width: 761px) {
  [appearance~="buyer-entitlement"]:hover {
    background: #f2f3f5;
  }
}
.verification-options label {
  display: flex;
  align-items: center;
  gap: 8px;
}
[appearance~="shop-tab-bar"] {
  height: 56px;
  display: flex;
  align-items: stretch;
  gap: 35px;
  padding: 0 26px;
}

/* Navigation, field labels and content feedback */

.major-link {
  position: relative;
  height: 44px;
  display: flex;
  align-items: center;
  gap: 9px;
  border-radius: 10px;
  padding: 0 16px;
  white-space: nowrap;
  color: #172340;
}
.major-link svg {
  color: #687794;
}
.major-link.active {
  background: linear-gradient(100deg, #e8f0ff, #f8faff);
  color: #165cf0;
}
.major-link.active svg {
  color: #165cf0;
}
@media (min-width: 761px) {
  .major-link:hover:not(.active) {
    color: #4784ff;
  }
}
.major-link:focus-visible:not(.active) {
  color: #4784ff;
}
@media (min-width: 761px) {
  .major-link:hover:not(.active) svg {
    color: #4784ff;
  }
}
.major-link:focus-visible:not(.active) svg {
  color: #4784ff;
}
.major-link,
.major-link svg,
.sub-link {
  transition:
    color 0.2s ease,
    background-color 0.2s ease;
}
.major-link.inactive {
  cursor: default;
}
.sub-link {
  display: block;
  padding: 12px;
  white-space: nowrap;
  color: #5c687b;
  border-radius: 5px;
}
.sub-link.active {
  color: #1a60ef;
  background: #f1f6ff;
}
@media (min-width: 761px) {
  .sub-link:hover:not(.active) {
    color: #4784ff;
  }
}
.sub-link:focus-visible:not(.active) {
  color: #4784ff;
}
.style-default-choice {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}
.sub-nav .sub-link {
  padding: 11px 12px;
  border-radius: 0;
  font-size: 12px;
}
.sub-nav .sub-link.active {
  background: transparent;
  position: relative;
  border-left: 0;
  color: #1d5eff;
}
.sub-nav .sub-link.active::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 7px;
  width: 2px;
  height: 11px;
  background: #1d5eff;
  transform: translateY(-50%);
}
@media (min-width: 761px) {
  .sub-nav .sub-link:hover {
    color: #1d5eff;
  }
}
.buyer-load-more {
  display: block;
  margin: 18px auto;
  text-align: center;
  padding: 0;
  border: 0;
  background: none;
  color: #8190a7;
  font-size: 13px;
  line-height: 18px;
  cursor: pointer;
}
.purchase-coupon {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #91a0b6;
  font-size: 13px;
  padding: 25px 0 19px;
  border-bottom: 1px solid #eef0f4;
}
.news-editor-form .news-admin-publish {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  cursor: pointer;
}
.complaint-error {
  margin: 0;
  color: #e34747;
  font-size: 13px;
}
.purchase-coupon-row .purchase-coupon {
  flex: 0 0 auto;
  padding: 0;
  border: 0;
  cursor: pointer;
}
.marketing-code-editor-label {
  display: block;
  color: #4e5969;
  margin-bottom: 8px;
}
.marketing-code-switch-row {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 24px 0 16px;
  color: #4e5969;
  cursor: pointer;
}
.marketing-code-switch-row > span:first-child {
  margin-right: auto;
}
html.merchant-interface .email-binding-label {
  font-size: 13px;
  color: #4e5969;
}

@media (min-width: 761px) {
  .marketing-form-row .marketing-select-goods.fk-button {
    min-height: 24px;
    height: 24px;
    padding: 0 12px;
    border-radius: 2px;
    font-size: 12px;
  }
  .marketing-form-row .marketing-add-rule.fk-button {
    min-height: 28px;
    height: 28px;
    padding: 0 15px;
    font-size: 12px;
  }
}

/* Control semantic states */
.after-sales-row .required::before {
  content: "*";
  color: #f53f3f;
  margin-right: 2px;
}
[appearance~="complaint-tag"].blue {
  color: #3491fa;
  background: #e8f4ff;
}

.support-buyer-dialog {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.support-buyer-dialog .modal-header {
  flex-shrink: 0;
}
.support-buyer-dialog .modal-body {
  flex: 1;
  min-height: 0;
  padding: 0;
}
.support-buyer-backdrop > .support-buyer-dialog[role="dialog"] {
  transform-origin: bottom right;
}
.support-buyer-backdrop {
  z-index: 100;
}
.support-launcher.fk-button {
  width: 60px;
  height: 60px;
  padding: 0;
  border: 0;
  background: transparent;
  border-radius: 20px;
  cursor: grab;
  box-shadow: 0 6px 20px #165dff30;
  display: flex;
  align-items: center;
  justify-content: center;
}
.support-launcher.fk-button:active {
  cursor: grabbing;
}
.support-launcher.fk-button:focus-visible {
  outline: 2px solid #165dff;
  outline-offset: 4px;
}
.support-launcher img {
  width: 100%;
  height: 100%;
  border-radius: 20px;
  pointer-events: none;
}
.support-launcher .fk-spinner {
  position: absolute;
  z-index: 1;
}
.support-unread {
  position: absolute;
  top: -5px;
  right: -5px;
  min-width: 20px;
  line-height: 20px;
  border-radius: 12px;
  background: #f53f3f;
  color: #fff;
  padding: 0 5px;
  font-size: 12px;
  box-shadow: 0 0 0 2px #fff;
  text-align: center;
}
@media (max-width: 600px) {
  .support-buyer-dialog {
    max-width: 100% !important;
  }
}

@media (max-width: 760px) {
  .search-select input {
    font-size: 16px;
  }
  .news-editor-form :is(input:not([type="checkbox"]), textarea) {
    font-size: 16px;
  }
  .news-editor-form .search-select input,
  .news-editor-form .search-select input:focus {
    min-height: 0;
    height: 100%;
    padding: 0 12px;
    background: transparent;
    box-shadow: none;
  }
}

.buyer-contact-links .fk-button[appearance="buyer-contact-entry"] {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  height: auto;
  min-width: 0;
  padding: 0;
  text-align: left;
  white-space: normal;
  color: #3e4652;
  font-size: 13px;
  line-height: 20px;
}

/* Shared action variants. Page styles may position a control, not redefine it. */
:is(.fk-button, .fk-link):is(
  .fk-action-primary,
  .fk-action-secondary,
  .fk-action-neutral,
  .fk-action-outline,
  .fk-action-danger
) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: var(--fk-button-min-width, 68px);
  height: var(--fk-button-height, 32px);
  padding: var(--fk-button-padding, 5px 16px);
  border-width: 1px;
  border-style: solid;
  border-radius: var(--fk-button-radius, 4px);
  font-size: var(--fk-button-font-size, 13px);
  font-weight: 400;
  line-height: 20px;
  white-space: nowrap;
  text-decoration: none;
  cursor: pointer;
  transition:
    background-color 0.15s,
    color 0.15s,
    border-color 0.15s;
}
:is(.fk-button, .fk-link).fk-action-primary {
  background: var(--fk-primary);
  border-color: var(--fk-primary);
  color: #fff;
}
@media (min-width: 761px) {
  :is(.fk-button, .fk-link).fk-action-primary:hover:not(:disabled):not(
      [aria-disabled="true"]
    ) {
    background: var(--fk-primary-hover);
    border-color: var(--fk-primary-hover);
  }
}
@media (min-width: 761px) {
  :is(.fk-button, .fk-link).fk-action-primary:active:not(:disabled) {
    background: var(--fk-primary-active);
  }
}
:is(.fk-button, .fk-link).fk-action-secondary {
  background: #fff;
  border-color: var(--fk-button-border, #d5deef);
  color: var(--fk-button-text, #4e5969);
}
@media (min-width: 761px) {
  :is(.fk-button, .fk-link).fk-action-secondary:hover:not(:disabled):not(
      [aria-disabled="true"]
    ) {
    background: var(--fk-button-neutral-hover, #f2f3f5);
  }
}
:is(.fk-button, .fk-link).fk-action-neutral {
  background: #f2f3f5;
  border-color: #f2f3f5;
  color: #4e5969;
}
@media (min-width: 761px) {
  :is(.fk-button, .fk-link).fk-action-neutral:hover:not(:disabled):not(
      [aria-disabled="true"]
    ) {
    background: var(--fk-field-hover);
    border-color: var(--fk-field-hover);
  }
}
:is(.fk-button, .fk-link).fk-action-outline {
  background: #fff;
  border-color: var(--fk-primary);
  color: var(--fk-primary);
}
@media (min-width: 761px) {
  :is(.fk-button, .fk-link).fk-action-outline:hover:not(:disabled) {
    background: var(--fk-button-outline-hover, #e8f3ff);
    border-color: var(--fk-primary-hover);
    color: var(--fk-primary-hover);
  }
}
:is(.fk-button, .fk-link).fk-action-outline:focus-visible {
  background: var(--fk-button-outline-hover, #e8f3ff);
  border-color: var(--fk-primary-hover);
  color: var(--fk-primary-hover);
}
:is(.fk-button, .fk-link).fk-action-danger {
  background: var(--fk-danger);
  border-color: var(--fk-danger);
  color: #fff;
}
@media (min-width: 761px) {
  :is(.fk-button, .fk-link).fk-action-danger:hover:not(:disabled) {
    filter: brightness(1.08);
  }
}
.fk-action-text {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  gap: 4px;
  min-width: 0;
  height: 24px;
  min-height: 24px;
  padding: 0 6px;
  border: 0;
  background: transparent;
  color: var(--fk-primary);
  border-radius: 2px;
  font-size: 12px;
  font-weight: 400;
  line-height: 20px;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 0.15s;
}
.fk-action-text.fk-tone-danger {
  color: var(--fk-danger);
}
.fk-action-text.fk-tone-success {
  color: var(--fk-success);
}
@media (min-width: 761px) {
  .fk-action-text:hover:not(:disabled):not([aria-disabled="true"]) {
    background: var(--fk-button-neutral-hover, #f2f3f5);
  }
}
@media (min-width: 761px) {
  .fk-action-text:active:not(:disabled):not([aria-disabled="true"]) {
    background: var(--fk-field-hover);
  }
}
.fk-action-text:disabled,
.fk-action-text[aria-disabled="true"] {
  color: #c9cdd4;
  background: transparent;
  cursor: not-allowed;
}
.fk-action-icon {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: inherit;
  cursor: pointer;
}
@media (min-width: 761px) {
  .fk-action-icon:hover:not(:disabled) {
    background: var(--fk-button-neutral-hover, #f2f3f5);
  }
}
.fk-button:disabled,
.fk-link[aria-disabled="true"] {
  cursor: not-allowed;
}
:is(
  .fk-action-primary,
  .fk-action-secondary,
  .fk-action-neutral,
  .fk-action-outline,
  .fk-action-danger
):disabled {
  opacity: 0.55;
}
.fk-button:focus-visible,
.fk-link:focus-visible {
  outline: 2px solid var(--fk-primary);
  outline-offset: 2px;
}
.fk-button.fk-button-round,
.fk-link.fk-button-round {
  --fk-button-radius: 20px;
}
.fk-button.fk-button-square,
.fk-link.fk-button-square {
  --fk-button-radius: 2px;
}
.fk-button.fk-button-soft,
.fk-link.fk-button-soft {
  --fk-button-radius: 8px;
}
.fk-button.fk-size-small,
.fk-link.fk-size-small {
  --fk-button-height: 24px;
  --fk-button-padding: 2px 11px;
  --fk-button-min-width: 0;
  --fk-button-font-size: 12px;
}
.fk-button.fk-size-large,
.fk-link.fk-size-large {
  --fk-button-height: 40px;
  --fk-button-padding: 8px 20px;
  --fk-button-font-size: 14px;
}

.fk-button[appearance~="setup"] {
  --fk-button-height: 44px;
  --fk-button-padding: 0 20px;
  --fk-button-font-size: 14px;
  --fk-button-radius: 7px;
}

:where(.fk-control-filled) {
  min-width: 0;
  height: var(--fk-control-height);
  padding: 5px 12px;
  border: 1px solid transparent;
  border-radius: var(--fk-radius);
  background: var(--fk-field-bg);
  color: var(--fk-text);
}
:where(textarea.fk-control-filled) {
  height: auto;
  min-height: 80px;
}
@media (min-width: 761px) {
  .fk-control-filled:hover:not(:disabled):not(:focus) {
    background: var(--fk-field-hover);
  }
}
.fk-control-filled:focus {
  outline: none;
  border-color: var(--fk-primary);
  background: #fff;
}
@media (min-width: 761px) {
  .fk-input-group > .fk-control-bare:hover {
    background-color: transparent;
  }
}
.fk-input-group > .fk-control-bare,
.fk-input-group > .fk-control-bare:focus {
  background-color: transparent;
}
.fk-input-group:focus-within,
.fk-input-group[appearance]:focus-within {
  background-color: #fff;
  border-color: var(--fk-primary);
  box-shadow: var(--fk-group-focus-shadow, inset 0 0 0 1px var(--fk-primary));
}
.fk-control.fk-invalid {
  border-color: var(--fk-danger);
}
.fk-size-small {
  --fk-control-height: 24px;
  font-size: 12px;
}
.fk-size-large {
  --fk-control-height: 40px;
}
.fk-control[appearance~="setup"] {
  width: 100%;
  display: block;
  margin-top: 6px;
  --fk-control-height: 42px;
  padding: 0 13px;
  border: 1px solid #e7ecf4;
  border-radius: 7px;
  background: #f7f9fc;
  color: var(--fk-text);
  font: inherit;
  font-size: 14px;
}
@media (min-width: 761px) {
  .fk-control[appearance~="setup"]:hover:not(:focus) {
    background: var(--fk-field-hover);
    border-color: #c9cdd4;
  }
}
.fk-control[appearance~="setup"]:focus {
  border-color: var(--fk-primary);
  background: #fff;
  outline: none;
}
.fk-pagination {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 16px;
  min-width: 0;
  font-size: 14px;
  color: #4e5969;
}
.fk-pagination-prefix {
  margin-right: auto;
  font-size: 12px;
  color: var(--fk-muted);
}
.fk-pagination-pages {
  display: flex;
  align-items: center;
  gap: 8px;
}
.fk-pagination .fk-pagination-button,
.fk-pagination .fk-pagination-ellipsis {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 32px;
  min-width: 32px;
  height: 32px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 2px;
  background: transparent;
  color: #4e5969;
  font: inherit;
  line-height: 1;
}
.fk-pagination .fk-pagination-button {
  cursor: pointer;
  transition:
    background-color 0.15s,
    color 0.15s;
}
@media (min-width: 761px) {
  .fk-pagination .fk-pagination-button:hover:not(:disabled):not(.active) {
    background: var(--fk-hover-bg);
  }
}
.fk-pagination .fk-pagination-button.active {
  color: var(--fk-primary);
  background: #e8f3ff;
}
.fk-pagination .fk-pagination-button:disabled {
  color: #c9cdd4;
  background: transparent;
  cursor: not-allowed;
  opacity: 1;
}
.fk-pagination .fk-pagination-button.active:disabled {
  background: #e8f3ff;
}
@media (max-width: 480px) {
  .fk-pagination-pages {
    gap: 4px;
  }
  .fk-pagination .fk-pagination-button,
  .fk-pagination .fk-pagination-ellipsis {
    width: 28px;
    min-width: 28px;
    height: 28px;
  }
}

@media (max-width: 760px) {
  .category-page:has(.mobile-category-page) > .fk-pagination {
    display: none;
  }
  .mobile-category-page > .fk-pagination {
    justify-content: flex-end;
    padding: 18px 14px;
  }
  .mobile-goods-page > .fk-pagination {
    justify-content: center;
    padding: 18px 14px;
  }
}

@media (max-width: 760px) {
  .mobile-orders-page > .fk-pagination,
  .mobile-complaints-page > .fk-pagination,
  .mobile-blacklist-page > .fk-pagination {
    justify-content: flex-end;
    padding: 16px 12px;
    flex-wrap: wrap;
  }
}

@media (max-width: 760px) {
  .mobile-marketing-list > .fk-pagination {
    justify-content: flex-end;
    padding: 14px 12px;
  }
  .marketing-codes .fk-pagination {
    justify-content: flex-end;
    margin-top: 18px;
    flex-wrap: wrap;
  }
}
@media (max-width: 760px) {
  .login-logs-page > .fk-pagination {
    margin-top: 20px;
    justify-content: flex-end;
  }
}
/* Reusable documentation and extension controls. */
[appearance~="plugin-categories"] {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
[appearance~="plugin-categories"] > button {
  padding: 8px 14px;
  border: 0;
  background: transparent;
  color: #617087;
  border-radius: var(--fk-radius);
  font-size: 13px;
  line-height: 18px;
  cursor: pointer;
}
@media (min-width: 761px) {
  [appearance~="plugin-categories"] > button:hover {
    background: #f7f8fa;
  }
}
[appearance~="plugin-categories"] > button.active {
  background: #e8f3ff;
  color: var(--fk-primary);
  font-weight: 600;
}
.plugin-title-row .fk-page-header {
  font-size: 18px;
  font-weight: 600;
  margin: 0;
}
.plugin-sort-row [appearance~="tabs-line"] {
  flex: 1;
  border: 0;
  margin: 0;
}
.plugin-card-heading .fk-tag {
  flex-shrink: 0;
  white-space: nowrap;
}
.fk-markdown {
  color: #4e5969;
  font-size: 14px;
  line-height: 1.8;
  overflow-wrap: anywhere;
}
.fk-markdown h3 {
  font-size: 16px;
  color: var(--fk-text);
  margin: 26px 0 12px;
}
.fk-markdown p {
  margin: 12px 0;
}
.fk-markdown > div:first-child > :first-child {
  margin-top: 0;
}
.fk-markdown ul,
.fk-markdown ol {
  padding-left: 22px;
}
.fk-markdown li {
  padding: 3px 0 3px 4px;
}
.fk-markdown li::marker {
  color: var(--fk-primary);
  font-weight: 600;
}
.fk-markdown strong {
  color: var(--fk-text);
  font-weight: 600;
}
.fk-markdown-code-block {
  margin: 20px 0;
  border: 1px solid var(--fk-border);
  border-radius: var(--fk-radius);
  overflow: hidden;
}
.fk-markdown-code-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 14px;
  background: #f2f3f5;
  border-bottom: 1px solid var(--fk-border);
  font-size: 12px;
  color: var(--fk-muted);
}
.fk-markdown-code-heading > span {
  text-transform: uppercase;
  font-family: Consolas, monospace;
}
.fk-markdown pre {
  margin: 0;
  padding: 18px;
  background: #f7f8fa;
  overflow: auto;
  white-space: pre;
  line-height: 1.8;
  font-size: 13px;
  tab-size: 4;
}
.fk-markdown code {
  font-family: Consolas, monospace;
  background: #f2f3f5;
  border-radius: var(--fk-radius);
  padding: 2px 5px;
  font-size: 0.93em;
}
.fk-markdown pre code {
  padding: 0;
  background: transparent;
  font-size: inherit;
  color: #1d3966;
}
.fk-markdown-table {
  overflow: auto;
  margin: 20px 0;
  border: 1px solid var(--fk-border);
  border-radius: var(--fk-radius);
}
.fk-markdown table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.fk-markdown th,
.fk-markdown td {
  border-bottom: 1px solid var(--fk-border);
  padding: 12px 16px;
  text-align: left;
  min-width: 100px;
  vertical-align: top;
}
.fk-markdown th {
  background: #f2f3f5;
  color: var(--fk-text);
  font-weight: 500;
  white-space: nowrap;
}
.fk-markdown tr:last-child td {
  border-bottom: 0;
}
@media (min-width: 761px) {
  .fk-markdown tbody tr:hover {
    background: #f7f8fa;
  }
}
.fk-markdown td code {
  overflow-wrap: normal;
}
.fk-markdown blockquote {
  margin: 20px 0;
  padding: 2px 16px;
  border-left: 3px solid var(--fk-primary);
  background: #e8f3ff;
}
.fk-markdown a {
  color: var(--fk-primary);
  text-decoration: underline;
}
.fk-markdown img {
  max-width: 100%;
  height: auto;
}
* {
  scrollbar-width: thin;
  scrollbar-color: #d0d7e2 transparent;
}

@supports selector(::-webkit-scrollbar) {
  * {
    scrollbar-width: auto;
    scrollbar-color: auto;
  }
  *::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }
  *::-webkit-scrollbar-track {
    background: transparent;
  }
  *::-webkit-scrollbar-thumb {
    background: #d0d7e2;
    border: 1px solid transparent;
    background-clip: padding-box;
    border-radius: 999px;
  }
  @media (min-width: 761px) {
    *::-webkit-scrollbar-thumb:hover {
      background-color: #b6c1d1;
    }
  }
  *::-webkit-scrollbar-button {
    display: none;
    width: 0;
    height: 0;
  }
}

/* Hide only the outer buyer-page scrollbar; nested lists retain shared scrollbars. */
html:has(.buyer-page),
html:has(.buyer-page) body {
  scrollbar-width: none;
}
html:has(.buyer-page)::-webkit-scrollbar,
html:has(.buyer-page) body::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

/* Hide an injected translation layer only while its content is empty. */
.fk-empty-translation-tooltip {
  display: none !important;
}
/* 移动端首页和登录主题，仅在移动断点下覆盖公共控件外观。 */

.mobile-home {
  display: none;
}
@media (max-width: 760px) {
  .mobile-home {
    display: block;
    color: #292929;
    background: #fff;
    min-height: 100svh;
  }
  .mobile-home-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 15px 20px 14px;
  }
  .mobile-home-header h1 {
    margin: 0 0 3px;
    font-size: 20px;
    line-height: 1.4;
    overflow-wrap: anywhere;
  }
  .mobile-home-header p {
    margin: 0;
    font-size: 13px;
    color: #aaa;
  }
  .mobile-home .mobile-login {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
    color: #333;
    font-size: 14px;
  }
  .mobile-home-actions {
    display: grid;
    grid-template-columns: 1.56fr 1fr;
    gap: 16px;
    padding: 0 16px;
  }
  .mobile-home .mobile-action {
    position: relative;
    display: block;
    min-width: 0;
    height: clamp(148px, 37vw, 225px);
    padding: 18px 16px;
    color: #fff;
    border-radius: 14px;
  }
  .mobile-home .mobile-action-order {
    background: linear-gradient(180deg, #2f8cfc, #0878ff);
  }
  .mobile-home .mobile-action-shop {
    background: linear-gradient(180deg, #ffa044, #ff623d);
  }
  .mobile-home .mobile-action h2 {
    margin: 0 0 3px;
    font-weight: 400;
    font-size: clamp(19px, 4.6vw, 30px);
    line-height: 1.35;
  }
  .mobile-home .mobile-action p {
    margin: 0;
    color: #ffffffe0;
    font-size: clamp(11px, 2.7vw, 17px);
    line-height: 1.5;
  }
  .mobile-home .mobile-action small {
    position: absolute;
    bottom: 25px;
    left: 16px;
    color: #b1dcff;
    font-size: 12px;
  }
  .mobile-home .mobile-action svg {
    position: absolute;
    right: 20px;
    bottom: 24px;
  }
  .mobile-home-shortcuts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding: 20px 14px 21px;
    gap: 4px;
  }
  .mobile-home-shortcuts > * {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-width: 0;
    padding: 0;
    border: 0;
    height: auto;
    color: #222;
    background: transparent;
    font-size: clamp(12px, 3.3vw, 19px);
    font-weight: 400;
    white-space: nowrap;
  }
  .mobile-home .shortcut-art {
    display: block;
    width: 35px;
    height: 35px;
  }
  .mobile-home-news {
    border-top: 9px solid #f8f8f8;
    padding: 23px 20px 0;
  }
  .mobile-home-news > h2 {
    font-size: 19px;
    margin: 0 0 4px;
  }
  .mobile-home .mobile-section-caption {
    font-size: 13px;
    color: #aaa;
    margin: 0 0 18px;
  }
  .mobile-home .mobile-news-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 7px;
  }
  .mobile-home .mobile-news-entry {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 38%;
    gap: 15px;
    min-height: 121px;
    padding: 21px 0;
    border-bottom: 1px solid #f4f4f4;
    color: #292929;
  }
  .mobile-home .mobile-news-entry:nth-child(-n + 3) {
    animation: mobile-news-slide-in 0.8s ease both;
  }
  .mobile-home .mobile-news-entry:nth-child(2) {
    animation-duration: 1.13333s;
  }
  .mobile-home .mobile-news-entry:nth-child(3) {
    animation-duration: 1.46667s;
  }
  @keyframes mobile-news-slide-in {
    from {
      transform: translateX(-100vw);
    }
    to {
      transform: translateX(0);
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .mobile-home .mobile-news-entry {
      animation: none;
    }
  }
  .mobile-home .mobile-news-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    justify-content: space-between;
    gap: 14px;
  }
  .mobile-home .mobile-news-copy h3 {
    font-size: 14px;
    line-height: 1.55;
    font-weight: 400;
    margin: 0;
    overflow-wrap: anywhere;
  }
  .mobile-home .mobile-news-copy time {
    font-size: 13px;
    color: #aaa;
  }
  .mobile-home .mobile-news-art {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 78px;
    padding: 10px 12px;
    overflow: hidden;
    border-radius: 6px;
    box-shadow: 0 3px 18px #17284904;
  }
  .mobile-home .mobile-news-art small {
    font-size: 8px;
    color: #bbb;
  }
  .mobile-home .mobile-news-art span {
    font-size: 12px;
    margin-top: 3px;
    color: #777;
    position: relative;
    z-index: 1;
  }
  .mobile-home .mobile-news-art i {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #3267fb;
    box-shadow: 6px 0 #d9e4ff;
    margin-top: 10px;
  }
  .mobile-home .news-art-1 i {
    background: #519bfa;
    box-shadow: 6px 0 #ddefff;
  }
  .mobile-home .news-art-2 i {
    background: #ff727b;
    box-shadow: 6px 0 #ffe0e4;
  }
  .mobile-home .mobile-news-art svg {
    position: absolute;
    right: -10px;
    bottom: -8px;
    width: 52px;
    height: 52px;
  }
  .mobile-home .mobile-news-more {
    width: 100%;
    padding: 22px 0;
    height: auto;
    border: 0;
    background: none;
    color: #bbb;
    font-size: 15px;
  }
  .mobile-home .mobile-news-empty {
    color: #aaa;
    padding: 30px 0;
    text-align: center;
  }
  .mobile-home-footer {
    border-top: 9px solid #f8f8f8;
    text-align: center;
    padding: 22px 15px;
    color: #bbb;
    font-size: 11px;
  }
  .mobile-home .feedback-link {
    margin: 16px 0 0;
  }
}

@media (max-width: 760px) {
  .login-page {
    background: linear-gradient(170deg, #e7f2ff 0, #f6f9ff 80px, #fff 155px);
  }
  .login-page .login-form-side {
    min-height: 100svh;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    padding: 0 5.5%;
  }
  .login-page .login-form-side::before {
    content: "";
    position: absolute;
    inset: 28px 0 auto 35%;
    height: 55px;
    border-radius: 50%;
    background: linear-gradient(100deg, transparent, #dfe7fa65 55%, #ffdfbf70);
    transform: skewY(9deg);
    pointer-events: none;
  }
  .login-page [appearance~="login-logo"] {
    position: relative;
    top: auto;
    left: auto;
    width: fit-content;
    margin: 30px 0 0;
  }
  .login-page .site-brand-logo {
    max-width: 185px;
    height: 39px;
  }
  .login-page .login-center {
    width: 100%;
    min-height: 0;
    margin: clamp(105px, 22svh, 200px) 0 0;
    padding: 0 8%;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    transform: none;
  }
  .login-page .login-heading {
    gap: 8px;
    margin-bottom: 40px;
    flex-wrap: wrap;
  }
  .login-page .login-heading h1 {
    font-size: clamp(19px, 4.6vw, 28px);
    line-height: 1.4;
    overflow-wrap: anywhere;
  }
  .login-page .login-heading span {
    padding: 4px 7px;
    font-size: 12px;
    flex-shrink: 0;
  }
  .login-page [appearance~="login-tabs"] {
    height: 34px;
    margin-bottom: 20px;
  }
  .login-page [appearance~="login-tabs"] .selected {
    height: 34px;
    font-size: 15px;
    border-bottom-width: 2px;
  }
  .login-page [appearance~="login-input-wrap"] {
    height: 44px;
    padding: 0 13px;
    gap: 12px;
    margin-bottom: 24px;
    background: #f3f4f5;
    border-radius: 0;
  }
  .login-page [appearance~="login-input-wrap"] input {
    font-size: 16px;
  }
  .login-page [appearance~="login-input-wrap"] input::placeholder {
    color: #a2a6ac;
  }
  .login-page [appearance~="login-submit"] {
    height: 41px;
    font-size: 16px;
    border-radius: 2px;
  }
  .login-page .login-extra {
    gap: 25px;
    margin-top: 24px;
  }
  .login-page .login-extra button {
    font-size: 14px;
  }
  .login-page .login-copyright {
    position: static;
    text-align: left;
    margin-top: auto;
    padding: 70px 0 20px;
    font-size: 12px;
    color: #777;
    line-height: 1.7;
  }
  .login-page .login-feature-side {
    display: none;
  }
}

/* The merchant reference layout is limited to phones. */
[appearance~="mobile-merchant-profile"],
.mobile-summary-label,
.mobile-metric-label,
.mobile-merchant-bottom,
.mobile-merchant-dashboard-tools {
  display: none;
}

@media (max-width: 760px) {
  html.merchant-interface .merchant-shell {
    min-height: 100dvh;
    background: linear-gradient(115deg, #d9eaf8 0%, #f2f0ff 65%, #f8f6ff 100%);
  }
  html.merchant-interface .merchant-header {
    position: relative;
    height: 68px;
    flex: 0 0 68px;
    padding: 14px;
    align-items: center;
    background: transparent;
  }
  .merchant-header-left {
    min-width: 0;
    flex: 1;
    gap: 0;
  }
  [appearance~="merchant-header-brand"],
  [appearance~="merchant-home-link"],
  .merchant-header .header-popup-wrap,
  .merchant-header .header-divider,
  .merchant-header .system-update-trigger {
    display: none;
  }
  [appearance~="mobile-merchant-profile"] {
    display: flex;
    max-width: 100%;
    align-items: center;
    gap: 8px;
    min-width: 0;
    color: #222c38;
  }
  [appearance~="mobile-merchant-profile"] img {
    width: 38px;
    height: 38px;
    object-fit: cover;
    border-radius: 50%;
    flex: none;
  }
  [appearance~="mobile-merchant-profile"] > span {
    min-width: 0;
    overflow: hidden;
  }
  [appearance~="mobile-merchant-profile"] strong {
    display: block;
    font-size: 14px;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 600;
  }
  [appearance~="mobile-merchant-profile"] small {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: #8f99a5;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .merchant-header .header-actions {
    display: none;
  }
  .mobile-home-screen .merchant-header .header-actions {
    display: flex;
    flex: none;
    gap: 12px;
    margin-left: 10px;
  }
  .mobile-home-screen .merchant-header .system-update-trigger,
  .mobile-home-screen .merchant-header .header-popup-wrap {
    display: inline-flex;
  }
  .mobile-home-screen .merchant-header [appearance~="header-update-action"],
  .mobile-home-screen .merchant-header [appearance~="header-user-button"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 32px;
    min-width: 32px;
    height: 32px;
    min-height: 32px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #ffffffb3;
    color: #4e5969;
  }
  .mobile-home-screen
    .merchant-header
    [appearance~="header-update-action"]
    > span:not(.fk-spinner) {
    display: none;
  }
  .mobile-home-screen
    .merchant-header
    [appearance~="header-user-button"].open
    > svg {
    transform: none;
  }
  .mobile-home-screen .merchant-header .account-popover {
    top: calc(100% + 8px);
    left: auto;
    right: 0;
    transform: none;
    min-width: 140px;
    z-index: 40;
  }
  html.merchant-interface .merchant-sidebar {
    display: none;
  }
  html.merchant-interface .merchant-body {
    min-height: 0;
    display: block;
    padding: 0 14px calc(70px + env(safe-area-inset-bottom));
  }
  .merchant-main-wrap {
    width: 100%;
    min-width: 0;
  }
  .merchant-main {
    min-width: 0;
    padding-top: 0;
  }
  .dashboard-grid {
    display: block;
    min-width: 0;
    max-width: 100%;
  }
  .dashboard-left {
    padding: 0;
    border-radius: 0;
    background: transparent;
    min-height: 0;
  }
  .dashboard-greeting,
  .dashboard-left > .dashboard-section > .section-heading {
    display: none;
  }
  .summary-strip {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    height: 78px;
    border-radius: 11px;
    margin-bottom: 10px;
    background: #3977f3;
  }
  [appearance~="summary-item"] {
    gap: 12px;
    padding: 12px 2px;
    min-width: 0;
  }
  [appearance~="summary-item"] strong {
    max-width: 100%;
    overflow-wrap: anywhere;
    font-size: 18px;
    line-height: 1.2;
  }
  [appearance~="summary-item"] > .desktop-summary-label {
    display: none;
  }
  [appearance~="summary-item"] > .mobile-summary-label {
    display: block;
    white-space: nowrap;
    font-size: 11px;
    color: #cee1ff;
  }
  .dashboard-left > .dashboard-section:not(.transaction-card) {
    padding: 0;
    background: transparent;
  }
  .metric-grid {
    gap: 7px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 10px;
  }
  .metric {
    height: auto;
    min-height: 74px;
    padding: 9px 10px;
    gap: 4px;
    border-radius: 12px;
    background: #ffffffba;
    border: 1px solid #ffffffb5;
  }
  .metric:nth-child(1) {
    order: 0;
  }
  .metric:nth-child(2) {
    order: 2;
  }
  .metric:nth-child(3) {
    order: 1;
  }
  .metric:nth-child(4) {
    display: none;
  }
  .metric > span {
    font-size: 12px;
    color: #7d858e;
  }
  .desktop-metric-label {
    display: none;
  }
  .mobile-metric-label {
    display: inline;
  }
  .metric strong {
    font-size: 16px;
    line-height: 1.1;
    font-weight: 500;
    color: #1e252e;
    overflow-wrap: anywhere;
  }
  .metric small {
    color: #535e6b;
    font-size: 11px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .mobile-merchant-dashboard-tools {
    display: grid;
    flex: 1;
    grid-template-rows: repeat(4, minmax(min-content, 1fr));
    gap: 6px;
  }
  .mobile-merchant-tool-section {
    margin-bottom: 0;
    padding: 8px 10px;
    background: #fffffff5;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
  }
  .mobile-merchant-tool-section h2 {
    margin: 0 0 6px;
    font-size: 13px;
    font-weight: 500;
    color: #3e4855;
  }
  .mobile-merchant-tool-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 19px 4px;
    flex: 1;
  }
  .mobile-merchant-tool-grid.three-columns {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  [appearance~="mobile-merchant-tool"] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 0;
    color: #586371;
    font-size: 12px;
    line-height: 1.5;
    text-align: center;
    justify-content: center;
  }
  .mobile-merchant-tool-icon {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    color: #3785f9;
  }
  .fk-color-icon {
    display: block;
    object-fit: contain;
  }
  .dashboard-left .transaction-card,
  .dashboard-right {
    display: none;
  }
  .mobile-merchant-bottom {
    position: fixed;
    inset: auto 0 0;
    z-index: 8;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 6px 14px max(6px, env(safe-area-inset-bottom));
    background: #fff;
    border-top: 1px solid #eff2f7;
  }
  [appearance~="mobile-merchant-tab"] {
    min-height: 44px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 0;
    color: #939da8;
    font-size: 11px;
    line-height: 1.3;
  }
  [appearance~="mobile-merchant-tab"].selected {
    color: #3785ef;
  }
  [appearance~="mobile-merchant-profile"]:focus-visible,
  [appearance~="mobile-merchant-tool"]:focus-visible,
  [appearance~="mobile-merchant-tab"]:focus-visible {
    outline: 2px solid #1676ff;
    outline-offset: 3px;
  }
  @media (max-width: 350px) {
    [appearance~="mobile-merchant-profile"] strong {
      max-width: 100%;
      font-size: 13px;
    }
    .metric {
      padding: 9px 7px;
    }
    .metric small {
      font-size: 10px;
    }
    [appearance~="mobile-merchant-tool"] {
      font-size: 11px;
      gap: 4px;
      justify-content: center;
    }
    [appearance~="summary-item"] > .mobile-summary-label {
      font-size: 10px;
    }
  }
  html.merchant-interface .merchant-shell:has(.dashboard-grid) .merchant-body {
    padding-bottom: calc(62px + env(safe-area-inset-bottom));
  }
  @media (max-height: 700px) {
    html.merchant-interface
      .merchant-shell:has(.dashboard-grid)
      .merchant-header {
      height: 60px;
      flex-basis: 60px;
      padding-block: 10px;
    }
    .dashboard-grid .summary-strip {
      height: 68px;
      margin-bottom: 8px;
    }
    .dashboard-grid [appearance~="summary-item"] {
      gap: 8px;
      padding-block: 10px;
    }
    .dashboard-grid .metric-grid {
      margin-bottom: 8px;
    }
    .dashboard-grid .metric {
      min-height: 68px;
      padding-block: 7px;
    }
  }
  html.merchant-interface
    .merchant-shell:has(.dashboard-grid, .mobile-payment-providers),
  html.merchant-interface
    .merchant-shell:has(.dashboard-grid, .mobile-payment-providers)
    :is(.merchant-body, .merchant-main-wrap, .merchant-main) {
    display: flex;
    flex-direction: column;
  }
  html.merchant-interface
    .merchant-shell:has(.dashboard-grid, .mobile-payment-providers)
    :is(.merchant-body, .merchant-main-wrap, .merchant-main) {
    flex: 1;
  }
  .dashboard-grid,
  .dashboard-left {
    display: flex;
    flex-direction: column;
    flex: 1;
  }
  .dashboard-left > :is(.summary-strip, .dashboard-section) {
    flex: none;
  }
  @media (max-height: 700px) {
    .mobile-merchant-tool-section {
      padding: 6px 10px;
    }
    .mobile-merchant-tool-section h2 {
      margin-bottom: 4px;
    }
  }
}

.mobile-shop-navigation,
.mobile-page-header,
.mobile-finance-overview,
.mobile-payment-providers,
.mobile-sales-chart {
  display: none;
}

[appearance~="email-notice-banner"] > .email-notice-mobile-art {
  display: none;
}

.mobile-plugin-category {
  display: none;
}

@media (max-width: 760px) {
  .category-page:has(.mobile-category-page) {
    padding: 0;
    border-radius: 0;
  }
  .category-page:has(.mobile-category-page)
    > :is(h1, .fk-tabs, .category-search-row, .table-scroll, .empty-state) {
    display: none;
  }
  .mobile-category-bar {
    grid-template-columns: 32px 1fr 32px;
  }
  .mobile-category-toolbar {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0 14px;
    border-bottom: 1px solid #e5e6eb;
  }
  .mobile-category-toolbar > .fk-tabs {
    display: flex;
    gap: 18px;
    margin-right: auto;
  }
  .mobile-category-toolbar [data-fk-tab] {
    display: flex;
    align-items: center;
    height: 44px;
    border-bottom: 2px solid transparent;
    color: #4e5969;
    font-size: 14px;
  }
  .mobile-category-toolbar [data-fk-tab].active {
    color: var(--fk-primary);
    border-bottom-color: var(--fk-primary);
    font-weight: 600;
  }
  .mobile-category-toolbar > button.fk-button {
    padding-inline: 10px;
    flex: none;
  }
  .mobile-category-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 18px 14px;
    border-bottom: 1px solid #f0f1f3;
  }
  .mobile-category-item > img {
    width: 44px;
    height: 44px;
    border-radius: 5px;
    object-fit: cover;
    flex: none;
  }
  .mobile-category-info {
    display: grid;
    flex: 1;
    min-width: 0;
    gap: 8px;
    justify-items: start;
  }
  .mobile-category-info strong {
    font-size: 15px;
    font-weight: 500;
    color: #4e5969;
    overflow-wrap: anywhere;
  }
  .mobile-category-info button.fk-button {
    padding: 0;
    color: #86909c;
    font-size: 13px;
  }
  .mobile-category-controls {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 12px;
    flex: none;
  }
  html.merchant-interface
    .merchant-shell:has(.mobile-goods-page, .mobile-category-page) {
    background: #fff;
  }
  html.merchant-interface
    .merchant-shell:has(.mobile-goods-page, .mobile-category-page)
    .merchant-header {
    display: none;
  }
  html.merchant-interface
    .merchant-shell:has(.mobile-goods-page, .mobile-category-page)
    .merchant-body {
    padding: 0 0 calc(62px + env(safe-area-inset-bottom));
  }
  .goods-page {
    display: block;
  }
  .goods-page > .goods-type-row,
  .goods-page > .goods-desktop-list {
    display: none;
  }
  .mobile-goods-bar {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-bottom: 1px solid #f3f4f6;
    color: #4e5969;
  }
  .mobile-goods-bar h1 {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
    font-size: 17px;
    text-align: center;
    color: #1d2129;
  }
  .mobile-goods-publish.fk-button {
    grid-column: 3;
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
  }
  .mobile-goods-publish > span {
    display: flex;
    border-left: 1px solid #dce5ff;
    padding-left: 6px;
    margin-left: 6px;
  }
  .mobile-goods-back svg {
    transform: rotate(180deg);
  }
  @media (max-width: 360px) {
    .mobile-goods-bar > .fk-button.mobile-goods-publish.mobile-toolbar-create {
      font-size: 11px;
      gap: 0;
      padding-inline: 8px;
    }
    .mobile-goods-publish > span {
      padding-left: 4px;
      margin-left: 4px;
    }
  }
  .mobile-goods-types {
    display: flex;
    justify-content: space-around;
    padding: 9px 14px;
    gap: 8px;
    border-bottom: 6px solid #f8f9fb;
  }
  .mobile-goods-types > a.fk-link {
    padding: 7px 14px;
    border-radius: 24px;
    font-size: 14px;
    color: #4e5969;
  }
  .mobile-goods-types > a.active {
    color: var(--fk-primary);
    font-weight: 600;
    background: #f2f3f5;
  }
  .mobile-goods-filters {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 14px;
    border-bottom: 1px solid #e5e6eb;
  }
  .mobile-goods-filters .fk-tabs {
    display: flex;
    gap: 24px;
  }
  .mobile-goods-filters [data-fk-tab] {
    min-height: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    background: transparent;
    color: #4e5969;
    font-size: 14px;
  }
  .mobile-goods-filters [data-fk-tab].active {
    color: var(--fk-primary);
    border-bottom-color: var(--fk-primary);
    font-weight: 600;
  }
  .mobile-goods-item {
    padding: 16px 14px 14px;
    border-bottom: 1px solid #f0f1f3;
  }
  .mobile-goods-item-top {
    display: flex;
    align-items: flex-start;
    gap: 10px;
  }
  .mobile-goods-image {
    width: 44px;
    height: 44px;
    border-radius: 6px;
    object-fit: cover;
    flex: none;
  }
  .mobile-goods-details {
    min-width: 0;
    flex: 1;
  }
  .mobile-goods-name {
    display: flex;
    gap: 6px;
    align-items: flex-start;
  }
  .mobile-goods-name > .fk-tag {
    flex: none;
    font-size: 11px;
    margin-top: 2px;
  }
  .mobile-goods-name > button.fk-button {
    display: block;
    min-width: 0;
    padding: 0;
    height: auto;
    min-height: 24px;
    text-align: left;
    white-space: normal;
    overflow-wrap: anywhere;
    color: #4e5969;
    font-size: 14px;
    line-height: 1.6;
  }
  .mobile-goods-name svg {
    display: inline;
    vertical-align: middle;
  }
  .mobile-goods-price {
    color: #ff9d32;
    font-size: 14px;
    margin: 8px 0 0;
  }
  .mobile-goods-status {
    display: flex;
    gap: 6px;
    align-items: center;
    flex: none;
    font-size: 11px;
  }
  .mobile-goods-status > span::before {
    content: "";
    display: inline-block;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #00c853;
    margin-right: 4px;
  }
  .mobile-goods-status > span.off::before {
    background: #86909c;
  }
  .mobile-goods-status button.fk-button {
    padding: 0;
    height: 24px;
    min-height: 24px;
    font-size: 12px;
  }
  .mobile-goods-item-bottom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 16px;
  }
  .mobile-goods-stock {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-right: auto;
    font-size: 13px;
  }
  .mobile-goods-stock a.fk-link {
    padding: 0;
  }
  .mobile-goods-actions {
    display: flex;
    gap: 7px;
    margin-left: auto;
  }
  .mobile-goods-actions button.fk-button,
  .mobile-category-toolbar > button.fk-button {
    height: 28px;
    min-height: 28px;
    border: 0;
    border-radius: 24px;
    padding: 0 12px;
    font-size: 13px;
    background: #f2f3f5;
    color: #4e5969;
  }
  .mobile-goods-low-stock {
    padding: 8px 14px;
    color: #86909c;
    font-size: 12px;
  }
  .mobile-goods-sheet-backdrop.modal-backdrop {
    padding: 0;
    justify-content: flex-end;
  }
  .mobile-goods-sheet-backdrop.fk-dialog-reveal > [role="dialog"],
  .mobile-goods-sheet-backdrop.fk-dialog-enter-active > [role="dialog"] {
    animation: mobile-sheet-slide-in 0.3s ease both;
  }
  .mobile-goods-sheet-backdrop.fk-dialog-enter-active,
  .mobile-goods-sheet-backdrop.fk-dialog-leave-active {
    transition: opacity 0.3s ease;
  }
  .mobile-goods-sheet-backdrop.fk-dialog-leave-active > [role="dialog"] {
    animation: none;
    transition: transform 0.3s ease;
  }
  .mobile-goods-sheet-backdrop.fk-dialog-enter-from > [role="dialog"],
  .mobile-goods-sheet-backdrop.fk-dialog-leave-to > [role="dialog"] {
    transform: translateY(100%);
  }
  @keyframes mobile-sheet-slide-in {
    from {
      transform: translateY(100%);
    }
    to {
      transform: translateY(0);
    }
  }
  .mobile-goods-sheet.modal-panel {
    width: 100%;
    margin: auto 0 0;
    border-radius: 14px 14px 0 0;
    max-height: calc(100dvh - 16px);
    overflow-y: auto;
    padding-bottom: env(safe-area-inset-bottom);
  }
  .mobile-goods-sheet .modal-header {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #fff;
    justify-content: center;
    border-bottom: 0;
  }
  .mobile-goods-sheet .modal-header h2 {
    margin: 0;
  }
  .mobile-goods-sheet .modal-header > button {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 24px;
    color: #4e5969;
  }
  .mobile-goods-publish-types {
    display: grid;
    gap: 10px;
  }
  .mobile-goods-publish-types > a {
    padding: 15px;
    color: #4e5969;
  }
  .mobile-goods-publish-types > a > span {
    flex: 1;
  }
  .mobile-goods-publish-types strong {
    font-size: 15px;
    font-weight: 500;
  }
  .mobile-goods-search-form {
    display: grid;
    gap: 12px;
  }
  .mobile-more-sheet.modal-panel {
    min-height: max(180px, 26dvh);
  }
  .mobile-more-sheet .modal-header {
    height: 48px;
  }
  .mobile-more-sheet .modal-body {
    padding: 0 14px 16px;
  }
  .mobile-goods-more-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
  }
  .mobile-goods-more-actions > button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 0;
    border: 0;
    border-radius: 24px;
    background: #f2f3f5;
    color: #4e5969;
    height: 30px;
    padding: 0 8px;
    font-size: 14px;
  }
  .mobile-goods-search-form input {
    width: 100%;
    font-size: 16px;
  }
  .mobile-goods-search-form .search-select {
    width: 100%;
  }
  .mobile-goods-extra-links {
    display: flex;
    gap: 20px;
  }
  .mobile-goods-more-actions > p {
    overflow-wrap: anywhere;
    margin: 0 0 4px;
  }
  .create-page .product-type-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .create-page .product-type-grid > a {
    width: 100%;
    min-width: 0;
  }
  .create-page .product-type-grid > a > span:not(.type-chevron) {
    flex: 1;
    min-width: 0;
  }
  .create-page .product-type-grid strong,
  .create-page .product-type-grid small {
    white-space: normal;
    word-break: normal;
  }
}

@media (max-width: 760px) {
  .plugin-page .plugin-filter-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    padding-block: 16px;
  }
  .plugin-page [appearance~="plugin-categories"] {
    display: none;
  }
  .mobile-plugin-category {
    display: block;
    min-width: 0;
  }
  .mobile-plugin-category .search-select {
    width: 100%;
  }
  .plugin-page .plugin-search {
    min-width: 0;
    width: 100%;
    margin: 0;
    gap: 6px;
  }
  .plugin-page .plugin-search input {
    min-width: 0;
    width: 100%;
    flex: 1;
    font-size: 16px;
  }
  .plugin-page .plugin-search button {
    flex: none;
    padding-inline: 8px;
    font-size: 12px;
  }
  .plugin-market-page .plugin-search {
    grid-column: 2;
  }
}

@media (max-width: 760px) {
  html.merchant-interface .email-notice-page {
    min-height: 0;
    padding: 20px;
  }
  .email-notice-page > h1 {
    display: none;
  }
  .email-notice-page [appearance~="email-notice-banner"] {
    height: auto;
    min-height: 180px;
    border-radius: 0;
    padding: 74px 8px 12px;
  }
  .email-notice-page [appearance~="email-notice-banner"] > img {
    display: none;
  }
  .email-notice-page
    [appearance~="email-notice-banner"]
    > .email-notice-mobile-art {
    display: block;
    position: absolute;
    inset: 0 0 auto;
    height: auto;
    width: 100%;
    object-fit: contain;
  }
  .email-notice-page [appearance~="email-notice-banner"] > div {
    position: relative;
    top: auto;
    left: auto;
    max-width: none;
  }
  .email-notice-page [appearance~="email-notice-banner"] h2 {
    font-size: 20px;
    line-height: 1.5;
    color: #4e5969;
  }
  .email-notice-page [appearance~="email-notice-banner"] p {
    font-size: 13px;
    line-height: 1.7;
    color: #86909c;
  }
  .email-notice-page .email-notice-content {
    margin: 8px 8px 10px;
  }
  .email-notice-page .email-notice-form {
    width: 100%;
    gap: 12px;
  }
  .email-notice-page .email-binding-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
  }
  html.merchant-interface .email-notice-page .email-notice-form input {
    width: 100%;
    min-width: 0;
    height: 38px;
    font-size: 16px;
  }
  .email-notice-page [appearance~="email-code-field"] {
    width: 100%;
    height: 38px;
  }
  .email-notice-page [appearance~="email-code-field"] button {
    margin-right: 4px;
    padding-inline: 8px;
    font-size: 12px;
  }
  .email-notice-page .email-binding-actions,
  .email-notice-page [appearance~="email-bind-button"] {
    width: 100%;
  }
  .email-notice-page [appearance~="email-bind-button"] {
    min-height: 38px;
    margin-top: 4px;
    font-size: 15px;
  }
  .email-notice-page .email-notice-bound {
    flex-wrap: wrap;
  }
  .email-notice-page .email-notice-bound > p {
    flex-basis: 100%;
    margin: 4px 0;
    color: #86909c;
    overflow-wrap: anywhere;
  }
  .email-notice-page .email-notice-option > p {
    margin-left: 0;
    overflow-wrap: anywhere;
  }
}

@media (max-width: 760px) {
  html.merchant-interface body {
    min-width: 0;
  }
  .mobile-shop-screen .merchant-header,
  .mobile-finance-screen .merchant-header,
  .mobile-settings-screen .merchant-header {
    display: none;
  }
  .mobile-shop-navigation {
    display: block;
    padding: 18px 0 12px;
  }
  .mobile-shop-navigation h2,
  .mobile-finance-overview h2 {
    margin: 0 0 20px;
    color: #153e83;
    font-size: 21px;
    font-weight: 750;
  }
  .mobile-shop-navigation h2 span,
  .mobile-finance-overview h2 span {
    margin-left: 3px;
    padding: 3px 7px;
    border-radius: 7px;
    background: #4980f7;
    color: #fff;
  }
  .mobile-shop-navigation nav {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 4px;
    width: 100%;
    min-width: 0;
    padding: 0 0 10px;
  }

  [appearance~="mobile-shop-nav"] {
    display: flex;
    width: 56px;
    max-width: 100%;
    height: 56px;
    justify-self: center;
    min-width: 0;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    padding: 5px 2px;
    border-radius: 9px;
    font-size: 12px;
    line-height: 16px;
    color: #90959c;
    white-space: nowrap;
  }
  [appearance~="mobile-shop-nav"].selected {
    background: #fff;
    color: #616a77;
    font-weight: 600;
  }
  [appearance~="mobile-shop-nav"]:focus-visible {
    outline: 2px solid #1676ff;
    outline-offset: -2px;
  }
  .shop-settings-page {
    min-width: 0;
    gap: 0;
    padding: 10px;
    border-radius: 15px;
    background: #fff;
  }
  [appearance~="shop-tab-bar"] {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    height: auto;
    min-height: 43px;
    padding: 0;
    gap: 2px;
    margin-bottom: 14px;
    box-shadow: none;
  }
  html.merchant-interface
    .shop-settings-page
    [appearance~="shop-tab-bar"]
    > button {
    min-width: 0;
    width: min(100%, 76px);
    height: 30px;
    min-height: 30px;
    justify-self: center;
    font-size: 12px;
    padding: 4px 2px;
    border: 0;
    border-radius: 20px;
  }
  [appearance~="shop-tab-bar"] button.active {
    background: #f2f3f5;
    color: #165dff;
  }
  .shop-settings-body {
    min-width: 0;
    min-height: 0;
    padding: 17px 13px 24px;
    border: 1px solid #f5f5f6;
    border-radius: 12px;
    box-shadow: 0 0 10px #e9ecf340;
  }
  .shop-settings-body:has(.shop-settings-form) > h1 {
    display: none;
  }
  .shop-settings-form {
    width: 100%;
    max-width: none;
  }
  .shop-settings-form label,
  .shop-settings-form .settings-field {
    display: flex;
    flex-direction: column;
    gap: 9px;
    margin: 20px 0;
  }
  .shop-settings-form label > span,
  .shop-settings-form .settings-field > span {
    width: auto;
    padding: 0;
    text-align: left;
    font-size: 13px;
  }
  .shop-settings-form label > input,
  .shop-settings-form label > textarea {
    width: 100%;
    min-width: 0;
  }
  .shop-settings-form input,
  .shop-settings-form textarea {
    padding: 9px 10px;
    min-height: 34px;
    font-size: 13px;
  }
  .shop-settings-form .image-settings-row {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    width: 100%;
    max-width: 100%;
    margin: 0 0 10px;
    gap: 16px;
    overflow-x: auto;
    padding: 0 0 8px;
  }
  .shop-settings-form .image-settings-row .image-settings-item {
    margin: 0;
    flex: 0 0 auto;
    gap: 8px;
  }
  .shop-settings-form .image-settings-item > span {
    font-size: 11px;
  }
  .shop-settings-form .image-upload-card {
    width: 65px;
    height: 65px;
  }
  .shop-settings-form .image-upload-card-wide {
    width: 105px;
  }
  .shop-contact-fields {
    width: 100%;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 5px;
  }
  .shop-contact-fields input {
    width: 100%;
    padding: 8px 6px;
    font-size: 11px;
  }
  .shop-contact-fields small {
    font-size: 11px;
    line-height: 1.6;
  }
  .shop-custom-links {
    width: 100%;
    min-width: 0;
  }
  .shop-settings-form .shop-custom-label {
    justify-content: flex-start;
  }
  .shop-custom-link {
    width: 100%;
    max-width: 100%;
    gap: 4px;
  }
  .shop-custom-link [appearance~="shop-link-name-input"] {
    flex: 1;
    width: 0;
    min-width: 0;
  }
  .shop-custom-link [appearance~="shop-link-url-input"] {
    flex: 1.5;
    width: 0;
    min-width: 0;
  }
  .shop-custom-link button {
    flex: none;
    padding: 6px 4px;
    font-size: 12px;
  }
  .shop-custom-link .image-picker {
    flex: none;
  }
  .shop-settings-form .settings-actions {
    display: flex;
    justify-content: center;
    padding: 8px 0 0;
  }
  .shop-settings-form .settings-actions button {
    min-width: 55px;
  }
  .style-settings,
  .closed-settings,
  .other-settings {
    margin-left: 0;
  }
  .other-settings-row {
    grid-template-columns: minmax(105px, 1fr) auto;
    gap: 8px;
  }
  .other-settings-row > span {
    text-align: left;
  }
  .other-settings-row small {
    grid-column: 1 / -1;
  }
  .shop-links-list {
    padding: 0;
  }
  .shop-links-item {
    grid-template-columns: 72px minmax(0, 1fr);
    font-size: 13px;
    padding: 12px 0;
    border-bottom: 1px solid #f0f2f5;
  }
  .shop-links-item:last-child {
    border-bottom: 0;
  }
  .shop-links-label {
    padding: 5px 0;
    text-align: left;
    color: #2068ca;
  }
  .shop-links-address {
    min-height: 0;
    padding: 4px 0 16px;
    flex-direction: column;
    align-items: flex-end;
    gap: 14px;
  }
  .shop-links-address a {
    max-width: 100%;
    overflow-wrap: anywhere;
    text-align: right;
  }
  .shop-links-content {
    border: 0;
  }
  .shop-links-actions {
    justify-content: flex-end;
    gap: 8px;
  }
  .shop-links-actions button {
    padding: 6px 9px;
    background: #f2f3f5;
    color: #5d6470;
    font-size: 12px;
  }
  .shop-links-qr {
    min-height: 0;
    padding: 0;
    display: flex;
    justify-content: flex-end;
  }
  .shop-links-label:has(+ .shop-links-qr) {
    color: #d78a22;
  }
  .mobile-page-header {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
    height: 54px;
    background: #fff;
    margin-bottom: 12px;
  }
  .mobile-page-header strong {
    font-size: 18px;
    color: #20232a;
  }
  [appearance~="mobile-page-back"] {
    position: absolute;
    left: 14px;
    display: flex;
    align-items: center;
    padding: 8px 0;
    color: #303944;
  }
  [appearance~="mobile-page-back"] svg {
    transform: rotate(180deg);
  }
  html.merchant-interface .mobile-settings-screen {
    background: #f8f9fb;
  }
  .merchant-settings-home {
    display: grid;
    gap: 25px;
    padding-top: 4px;
  }
  .merchant-settings-menu {
    border-radius: 13px;
    overflow: hidden;
    background: #fff;
  }
  [appearance~="mobile-settings-row"] {
    display: flex;
    width: 100%;
    align-items: center;
    gap: 14px;
    padding: 23px 18px;
    color: #56616d;
    font-size: 16px;
    font-weight: 600;
    text-align: left;
    border: 0;
    background: #fff;
  }
  [appearance~="mobile-settings-row"] span {
    flex: 1;
  }
  .user-settings-page {
    padding: 15px;
    border-radius: 12px;
  }
  .user-settings-page > h1 {
    display: none;
  }
  .account-setting-list {
    margin: 0;
  }
  .account-setting-list > div {
    gap: 9px;
    flex-wrap: wrap;
  }
  .account-setting-list > div > span {
    width: 70px;
    text-align: left;
  }
  .account-setting-list small {
    max-width: calc(100% - 80px);
    overflow-wrap: anywhere;
  }
  .mobile-settings-screen .login-logs-page {
    padding: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  .mobile-settings-screen:has(.login-logs-page) {
    background: #f8f9fb;
  }
  .mobile-login-log-list {
    display: grid;
    gap: 8px;
  }
  .mobile-login-log-card {
    min-width: 0;
    padding: 12px 11px;
    border: 1px solid #edf0f4;
    border-radius: 8px;
    background: #fff;
    color: #5c6675;
    font-size: 12px;
    line-height: 1.6;
  }
  .mobile-login-log-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 4px 10px;
    overflow-wrap: anywhere;
  }
  .mobile-login-log-location {
    margin: 8px 0 0;
    padding: 4px 7px;
    border-radius: 4px;
    background: #f6f7f9;
    color: #86909c;
    overflow-wrap: anywhere;
  }
  .mobile-login-log-card > .login-result {
    margin-top: 8px;
    white-space: normal;
  }
  .account-password-dialog .user-password-form {
    width: 100%;
    min-width: 0;
  }
  .account-password-dialog .user-password-form > label {
    grid-template-columns: minmax(0, 1fr);
    min-width: 0;
    gap: 6px;
  }
  .account-password-dialog .user-password-form input,
  .account-password-dialog [appearance~="email-code-field"] {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }
  .account-password-dialog .section-muted {
    overflow-wrap: anywhere;
  }
  .account-password-dialog [appearance~="email-code-field"] input {
    width: 0;
  }
  .account-password-dialog [appearance~="email-code-field"] button {
    margin-right: 4px;
    padding: 0 6px;
  }
  .login-logs-page .orders-date-filter {
    gap: 8px;
  }
  .login-logs-page .orders-date-filter .date-range {
    min-width: 0;
  }
  html.merchant-interface .mobile-finance-screen {
    background: linear-gradient(#8ab3f9, #d5e3fd 300px, #f8f9fc 650px);
  }
  .mobile-finance-overview {
    display: block;
    padding-top: 18px;
    margin-bottom: 14px;
  }
  .mobile-finance-screen .payment-settings {
    padding: 0;
    min-height: 0;
    background: transparent;
    box-shadow: none;
  }
  .mobile-finance-screen .payment-settings > h1,
  .mobile-finance-screen .payment-channel-table-wrap {
    display: none;
  }
  .mobile-finance-screen .payment-settings > .section-muted {
    display: none;
  }
  .mobile-payment-providers {
    display: grid;
    gap: 10px;
    flex: 1;
    grid-template-rows: repeat(4, minmax(min-content, 1fr));
  }
  .mobile-payment-provider {
    background: #fff;
    border: 1px solid #ecf0f6;
    border-radius: 14px;
    padding: 12px 15px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .mobile-payment-provider header {
    display: flex;
    gap: 10px;
    align-items: center;
  }
  .mobile-payment-provider header img {
    width: 24px;
    height: 24px;
    object-fit: contain;
  }
  .mobile-payment-provider h3 {
    flex: 1;
    margin: 0;
    font-size: 16px;
    font-weight: 500;
    color: #4c596b;
  }
  .mobile-payment-provider p {
    margin: 10px 0;
    font-size: 13px;
    color: #758197;
  }
  .mobile-payment-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
  }
  .mobile-payment-actions :is(button, a) {
    font-size: 13px;
  }
  .mobile-finance-screen .ledger-page {
    padding: 16px 12px;
    border-radius: 13px;
  }
  .mobile-finance-screen .ledger-page .orders-filters {
    flex-wrap: wrap;
    gap: 10px;
  }
  .sales-page {
    gap: 0;
    background: #fff;
    border-radius: 15px;
    padding: 12px;
  }
  .sales-tabs {
    height: auto;
    min-height: 42px;
    padding: 0;
    gap: 10px;
    box-shadow: none;
  }
  .sales-tabs button {
    padding: 8px 14px;
    font-size: 14px;
    border: 0;
    border-radius: 24px;
  }
  .sales-tabs button.active {
    color: #165dff;
    background: #f2f3f5;
  }
  .sales-panel {
    min-height: 0;
    padding: 12px 0 25px;
    box-shadow: none;
  }
  .sales-heading {
    display: none;
  }
  .sales-panel:has(.sales-report-scroll) .sales-heading {
    display: flex;
  }
  .sales-panel:has(.sales-report-scroll) .sales-heading h1 {
    display: none;
  }
  .sales-periods {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0;
    margin: 8px 0 18px;
  }
  .sales-periods button {
    padding: 6px 2px;
    font-size: 12px;
    white-space: nowrap;
  }
  .sales-metrics {
    padding: 0;
    gap: 6px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .sales-metric strong {
    font-size: 11px;
    white-space: nowrap;
    margin-bottom: 10px;
  }
  .sales-metric > div {
    gap: 4px;
    font-size: 14px;
    flex-wrap: wrap;
    overflow-wrap: anywhere;
  }
  .sales-metric-icon {
    width: 21px;
    height: 21px;
  }
  .sales-metric-icon svg {
    width: 13px;
    height: 13px;
  }
  [appearance~="sales-chart-tabs"] {
    margin: 20px 0 12px;
    gap: 6px;
  }
  [appearance~="sales-chart-tabs"] button {
    font-size: 13px;
    padding: 7px 13px;
  }
  .sales-chart-scroll {
    display: none;
  }
  .mobile-sales-chart {
    display: block;
    width: 100%;
    height: auto;
    margin: 14px 0;
  }
  .mobile-sales-chart text {
    fill: #76818f;
    font-size: 11px;
  }
  .mobile-finance-overview {
    flex: none;
  }
  .mobile-finance-screen:has(.mobile-payment-providers) .payment-settings {
    display: flex;
    flex-direction: column;
    flex: 1;
  }
  @media (max-height: 700px) {
    .mobile-payment-provider {
      padding-block: 10px;
    }
  }
}

.mobile-sales-report {
  display: none;
}
@media (max-width: 760px) {
  .sales-panel:has(.mobile-sales-report) .sales-report-scroll {
    display: none;
  }
  .sales-panel:has(.mobile-sales-report) .sales-heading {
    gap: 12px;
    flex-wrap: wrap;
    padding-block: 4px 16px;
    margin: 0;
  }
  .sales-panel:has(.mobile-sales-report) .sales-heading small {
    display: block;
    min-width: 0;
    font-size: 11px;
  }
  .mobile-sales-report {
    display: grid;
    gap: 10px;
  }
  .mobile-sales-report-day {
    min-width: 0;
    padding: 12px;
    border: 1px solid #edf0f5;
    border-radius: 8px;
  }
  .mobile-sales-report-day h2 {
    margin: 0 0 8px;
    font-size: 12px;
    font-weight: 400;
    color: #677487;
  }
  .mobile-sales-report-day dl {
    margin: 0;
    padding: 10px;
    background: #f6f7f9;
    color: #86909c;
    font-size: 12px;
    line-height: 1.7;
  }
  .mobile-sales-report-day dl > div {
    display: flex;
    flex-wrap: wrap;
  }
  .mobile-sales-report-day dd {
    margin: 0;
    overflow-wrap: anywhere;
  }
}

@media (max-width: 760px) {
  html.merchant-interface .mobile-finance-screen .merchant-body {
    padding-bottom: calc(62px + env(safe-area-inset-bottom));
  }
}

@media (max-width: 760px) {
  html.merchant-interface [appearance~="mobile-shop-nav"].selected {
    background: #e9eef8;
  }
  .mobile-extension-screen .merchant-header,
  .mobile-record-screen .merchant-header {
    display: none;
  }
  .mobile-page-header strong {
    max-width: calc(100% - 100px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .mobile-extension-screen .plugin-page > .plugin-page-header h1,
  .mobile-extension-screen .create-page > h1,
  .mobile-extension-screen .guide-page > h1 {
    display: none;
  }
  .plugin-page:not(.plugin-market-page) .plugin-filter-row {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  }
  .plugin-page:not(.plugin-market-page) .plugin-search {
    display: contents;
  }
  .plugin-page:not(.plugin-market-page) .plugin-search input {
    width: 100%;
  }
  .plugin-page:not(.plugin-market-page) .plugin-search button {
    min-width: 46px;
  }
  .mobile-payment-actions :is(button, a) {
    height: 32px;
  }
  .mobile-payment-actions :is(button:nth-child(2), a) {
    border: 1px solid var(--fk-primary);
    color: var(--fk-primary);
    background: transparent;
  }
  .mobile-plugin-app-entry.fk-button {
    position: relative;
    height: auto;
    min-width: 0;
    border: 0;
    background: transparent;
    font-weight: 400;
    color: inherit;
    line-height: inherit;
  }
  .mobile-plugin-app-entry .notification-count {
    position: absolute;
    top: 0;
    right: 12px;
  }
  .mobile-applications-sheet.modal-panel {
    min-height: 250px;
    max-height: min(75dvh, 620px);
  }
  .mobile-applications-sheet .modal-body {
    padding: 16px;
    overflow-y: auto;
  }
  .mobile-applications-search {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 10px;
    margin-bottom: 20px;
  }
  .mobile-applications-search .search-select {
    width: 100%;
    min-width: 0;
  }
  .mobile-applications-search input {
    width: 100%;
    min-width: 0;
  }
  .mobile-applications-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px 8px;
  }
  .mobile-applications-grid a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 9px;
    color: #4e5969;
    font-size: 12px;
    text-align: center;
    overflow-wrap: anywhere;
  }
  .mobile-application-icon {
    display: grid;
    place-items: center;
    position: relative;
    width: 46px;
    height: 46px;
    border-radius: 12px;
    background: #e8f3ff;
    color: var(--fk-primary);
  }
  .mobile-application-icon .notification-count {
    position: absolute;
    top: -4px;
    right: -5px;
  }
  .mobile-applications-manage {
    display: block;
    margin-top: 26px;
    text-align: center;
    font-size: 13px;
  }
  html.merchant-interface .mobile-orders-surface,
  html.merchant-interface .complaints-list:has(.mobile-complaints-page) {
    margin: 0 -14px;
    padding: 0;
    border-radius: 0;
    background: #f8fafc;
  }
  .mobile-record-screen .merchant-main {
    padding-top: 0;
  }
  .mobile-orders-page,
  .mobile-blacklist-page,
  .mobile-complaints-page {
    min-width: 0;
    background: #f8fafc;
  }
  .mobile-record-screen .mobile-goods-bar {
    min-height: 46px;
    background: #fff;
  }
  .mobile-orders-toolbar,
  .mobile-complaints-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 12px;
    background: #fff;
    border-bottom: 1px solid #e5e6eb;
    min-width: 0;
  }
  .mobile-orders-toolbar > .fk-tabs,
  .mobile-complaints-toolbar > .fk-tabs {
    flex: 1;
    min-width: 0;
    overflow-x: auto;
    flex-wrap: nowrap;
    margin: 0;
    gap: 14px;
    scrollbar-width: none;
  }
  .mobile-orders-toolbar .fk-tabs button,
  .mobile-complaints-toolbar .fk-tabs button {
    flex: none;
    min-width: 0;
    padding: 12px 0;
    font-size: 12px;
    white-space: nowrap;
  }
  .mobile-orders-toolbar-actions {
    display: flex;
    flex: none;
    gap: 8px;
    align-items: center;
  }
  .mobile-orders-toolbar-actions .fk-button {
    min-width: 0;
    padding: 4px 0;
    font-size: 11px;
  }
  .mobile-orders-selection {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    font-size: 12px;
    background: #fff;
  }
  .mobile-orders-selection .fk-button {
    height: 25px;
    min-width: 0;
    padding: 0 8px;
    font-size: 11px;
    color: var(--fk-primary);
    border-color: #b5d8ff;
  }
  .mobile-record-list {
    display: grid;
    gap: 10px;
    padding: 12px;
  }
  .mobile-record-card {
    min-width: 0;
    border: 1px solid #edf0f5;
    border-radius: 8px;
    background: #fff;
    overflow: hidden;
  }
  .mobile-record-card-heading {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    background: linear-gradient(90deg, #f5faff, #fff);
    border-bottom: 1px solid #f3f4f6;
    font-size: 12px;
  }
  .mobile-record-card-heading > span:not(.fk-tag) {
    flex: 1;
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .mobile-record-card-heading > .fk-tag {
    flex: none;
    font-size: 11px;
  }
  .mobile-order-product {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 14px 12px;
    font-size: 12px;
  }
  .mobile-order-product .fk-tag {
    flex: none;
    font-size: 11px;
  }
  .mobile-order-product > span:last-child {
    min-width: 0;
    overflow-wrap: anywhere;
    line-height: 1.6;
  }
  .mobile-record-card-footer {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0 12px 10px;
  }
  .mobile-record-card-footer strong {
    flex: none;
    color: #ff9829;
    font-size: 13px;
  }
  .mobile-record-card-footer small {
    min-width: 0;
    color: #a3aab4;
    font-size: 10px;
  }
  .mobile-record-card-footer .fk-button {
    margin-left: auto;
    flex: none;
    min-width: 0;
    padding: 0;
    font-size: 11px;
  }
  .mobile-order-delivered {
    padding: 0 12px 10px;
    font-size: 12px;
    color: #86909c;
  }
  .mobile-record-search {
    display: grid;
    gap: 16px;
  }
  .mobile-record-search input {
    width: 100%;
    min-width: 0;
  }
  .mobile-blacklist-page {
    background: #f2f3f5;
  }
  .mobile-blacklist-search {
    display: flex;
    align-items: center;
    padding: 14px 20px;
    gap: 8px;
  }
  .mobile-blacklist-search input {
    flex: 1;
    min-width: 0;
    border: 0;
    background: transparent;
  }
  .mobile-blacklist-search .fk-button {
    flex: none;
  }
  .mobile-blacklist-card {
    padding: 16px 12px;
  }
  .mobile-blacklist-heading {
    display: flex;
    align-items: center;
    gap: 7px;
  }
  .mobile-blacklist-heading > strong {
    flex: 1;
    min-width: 0;
    overflow-wrap: anywhere;
    font-size: 15px;
    font-weight: 400;
  }
  .mobile-blacklist-heading > .fk-tag {
    flex: none;
    font-size: 11px;
  }
  .mobile-blacklist-heading .fk-button {
    min-width: 0;
    color: #f53f3f;
    padding: 0;
  }
  .mobile-blacklist-card > p {
    margin: 14px 0 0;
    font-size: 12px;
    color: #86909c;
    overflow-wrap: anywhere;
  }
  .mobile-complaint-reason {
    margin: 0 12px 10px;
    padding: 8px;
    background: #f6f7f9;
    font-size: 13px;
    color: #86909c;
    overflow-wrap: anywhere;
  }
  .mobile-complaint-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 0 12px 12px;
  }
  .mobile-complaint-footer p {
    margin: 0;
    color: #a3aab4;
    font-size: 11px;
    line-height: 1.6;
  }
  .mobile-complaint-footer .fk-button {
    flex: none;
    min-width: 0;
    padding: 0;
    font-size: 13px;
  }
  .order-detail-dialog.modal-panel {
    width: calc(100% - 24px);
    max-height: calc(100dvh - 32px);
  }
  .order-detail-dialog .modal-body {
    overflow-y: auto;
    padding: 18px 14px;
  }
  .order-detail-dialog .mobile-order-detail-grid th {
    width: 35%;
  }
  .order-detail-dialog .mobile-order-detail-grid td {
    width: 65%;
  }
  .order-detail-dialog .mobile-order-detail-grid th,
  .order-detail-dialog .mobile-order-detail-grid td {
    padding: 8px;
    font-size: 12px;
  }
  .order-detail-dialog .detail-delivery pre {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
  }
  .order-detail-dialog .detail-delivery pre .fk-button {
    flex: none;
    min-width: 24px;
    width: 24px;
    height: 24px;
    padding: 0;
  }
}

@media (max-width: 760px) {
  .mobile-orders-select-all {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 0;
  }
  .mobile-unshipped-orders {
    min-height: calc(100dvh - 116px);
  }
  .mobile-unshipped-orders .mobile-orders-toolbar {
    min-height: 44px;
    justify-content: space-between;
  }
  .mobile-unshipped-tab {
    align-self: stretch;
    display: flex;
    align-items: center;
    border-bottom: 2px solid var(--fk-primary);
    color: var(--fk-primary);
    font-size: 13px;
  }
  .mobile-unshipped-orders .mobile-orders-toolbar-actions .fk-button {
    width: 32px;
    height: 32px;
    padding: 0;
  }
  .mobile-unshipped-notice {
    padding: 12px 12px 0;
  }
  .mobile-unshipped-notice .fk-alert {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    padding: 10px;
    border-radius: 7px;
    border: 1px solid #e3edff;
    background: #eef5ff;
    color: #5282c7;
    font-size: 12px;
    line-height: 1.6;
  }
  .mobile-unshipped-notice .fk-alert > svg {
    flex: none;
    margin-top: 1px;
  }
  .mobile-unshipped-orders .empty-state {
    padding: 42px 12px;
  }
}

@media (max-width: 760px) {
  .mobile-orders-toolbar > .fk-tabs,
  .mobile-complaints-toolbar > .fk-tabs {
    display: flex;
    height: 44px;
    border: 0;
  }
  .order-detail-dialog.modal-panel {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    width: 100%;
  }
  .order-detail-dialog .modal-header {
    flex: none;
  }
  .order-detail-dialog .modal-body {
    min-height: 0;
    flex: 1;
  }
  .order-detail-dialog [appearance~="detail-grid"] th,
  .order-detail-dialog [appearance~="detail-grid"] td {
    height: auto;
    white-space: normal;
    padding: 7px 8px;
    line-height: 1.5;
    font-size: 12px;
  }
  .order-detail-dialog .order-detail-content section + section {
    margin-top: 18px;
  }
}

@media (max-width: 760px) {
  .mobile-marketing-page {
    margin: 0 -14px;
  }
  .mobile-marketing-page .marketing-panel {
    padding: 0;
    border-radius: 0;
    background: #f8fafc;
  }
  .mobile-marketing-page .mobile-marketing-bar {
    background: #fff;
    min-height: 48px;
  }
  .mobile-marketing-header-actions {
    grid-column: 3;
    display: flex;
    align-items: center;
    gap: 6px;
  }
  :is(
      .mobile-marketing-header-actions,
      .mobile-category-toolbar,
      .mobile-goods-bar
    )
    > .fk-button.mobile-toolbar-create,
  :is(.mobile-marketing-header-actions, .mobile-category-toolbar)
    > .fk-button.mobile-toolbar-search {
    min-width: 0;
    height: 32px;
    min-height: 32px;
    border: 0;
    border-radius: 16px;
    background: #edf2ff;
    padding: 0 10px;
    gap: 3px;
    font-size: 12px;
    color: var(--fk-primary);
  }
  :is(.mobile-marketing-header-actions, .mobile-category-toolbar)
    > .fk-button.mobile-toolbar-search {
    flex: none;
    width: 32px;
    padding: 0;
    background: #f2f3f5;
    color: #4e5969;
  }
  .news-admin-page {
    gap: 0;
    padding: 8px;
    border-radius: 12px;
    background: #fff;
  }
  .news-admin-page > .news-admin-tabs {
    margin: 0;
    border-radius: 0;
    box-shadow: none;
  }
  .news-admin-page > .news-admin-list {
    margin: 8px 0 0;
    border: 1px solid #f0f1f3;
    border-radius: 10px;
    box-shadow: none;
  }
  .mobile-marketing-list-tip {
    margin: 12px 12px 0;
  }
  .mobile-marketing-card {
    padding: 12px;
  }
  .mobile-marketing-card-heading {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    font-size: 12px;
  }
  .mobile-marketing-card-heading > .fk-tag {
    flex: none;
    font-size: 11px;
    padding-inline: 7px;
  }
  .mobile-marketing-card-heading > span:not(.fk-tag) {
    flex: 1;
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .mobile-marketing-card-heading > small {
    flex: none;
    font-size: 12px;
  }
  .mobile-marketing-card-heading .marketing-status {
    text-align: right;
  }
  .mobile-marketing-card-heading .fk-button {
    min-width: 0;
    padding: 0 5px;
    font-size: 12px;
  }
  .mobile-marketing-scope {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 8px 0 14px;
    padding: 7px;
    background: #f6f7f9;
    color: #86909c;
    font-size: 12px;
  }
  .mobile-marketing-scope > .fk-tag {
    flex: none;
    font-size: 11px;
  }
  .mobile-marketing-scope > span:last-child {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .mobile-marketing-card-footer {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 4px;
  }
  .mobile-marketing-card-footer p {
    font-size: 11px;
    color: #a3aab4;
    margin: 0;
    line-height: 1.7;
  }
  .mobile-marketing-card-actions {
    flex: none;
    display: grid;
    justify-items: end;
    gap: 4px;
  }
  .mobile-marketing-card-actions > div {
    display: flex;
    gap: 4px;
  }
  .mobile-marketing-card-actions .fk-button,
  .mobile-coupon-code-card footer .fk-button {
    min-width: 0;
    height: 26px;
    border: 0;
    padding: 0 12px;
    background: #f2f3f5;
    color: #4e5969;
    font-size: 12px;
  }
  .mobile-coupon-type-sheet .modal-header {
    background: #f4f6ff;
  }
  .mobile-coupon-type-sheet .modal-header h2 {
    color: var(--fk-primary);
    font-size: 15px;
  }
  .mobile-coupon-type-sheet .modal-body {
    padding: 16px 20px 24px;
  }
  .mobile-coupon-type-sheet .marketing-coupon-types {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .mobile-coupon-type-sheet .marketing-coupon-types article {
    padding: 18px 14px;
  }
  .mobile-marketing-form-page .marketing-panel {
    background: #fff;
    padding: 18px;
    border-radius: 10px;
  }
  .mobile-marketing-form-page .marketing-back {
    border-radius: 0;
    padding: 14px 18px;
    min-height: 48px;
  }
  .mobile-marketing-form-page .marketing-form > h2 {
    display: none;
  }
  .mobile-marketing-form-page .marketing-form .form-tip {
    margin: 0 0 20px;
  }
  .mobile-marketing-form-page .marketing-form-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    margin: 22px 0;
  }
  .mobile-marketing-form-page .marketing-form-row > span,
  .mobile-marketing-form-page .marketing-form-row > label {
    text-align: left;
    width: auto;
    line-height: 1.5;
    font-size: 14px;
  }
  .mobile-marketing-form-page [appearance~="marketing-input-suffix"],
  .mobile-marketing-form-page .marketing-category-field,
  .mobile-marketing-form-page .marketing-category-field .search-select {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }
  .mobile-marketing-form-page .marketing-radio-row {
    gap: 8px;
  }
  .mobile-marketing-form-page .marketing-radio-row label {
    font-size: 12px;
  }
  .mobile-marketing-form-page .marketing-tier {
    flex-wrap: nowrap;
    gap: 4px;
  }
  .mobile-marketing-form-page .marketing-tier input {
    flex: 1;
    width: 0;
    min-width: 0;
    padding-inline: 7px;
  }
  .mobile-marketing-form-page .marketing-tier span {
    flex: none;
    font-size: 12px;
  }
  .mobile-marketing-form-page .marketing-tier .fk-button {
    min-width: 0;
    padding-inline: 8px;
    font-size: 12px;
  }
  .mobile-marketing-form-page .marketing-selected {
    min-width: 0;
    flex-wrap: wrap;
  }
  .mobile-marketing-date {
    margin: 22px 0;
  }
  .mobile-marketing-date label {
    display: block;
    font-size: 14px;
    margin-bottom: 8px;
  }
  .mobile-marketing-date input {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    height: 34px;
    font-size: 14px;
  }
  .mobile-marketing-form-page .marketing-submit {
    margin: 20px 0 8px;
  }
  html.merchant-interface .marketing-codes.modal-panel,
  html.merchant-interface .marketing-code-editor.modal-panel {
    width: 100%;
    max-height: calc(100dvh - 32px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
  html.merchant-interface .marketing-codes .modal-body,
  html.merchant-interface .marketing-code-editor .modal-body {
    min-height: 0;
    overflow-y: auto;
    padding: 18px;
  }
  .marketing-codes .marketing-code-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 7px;
    margin: 0 0 12px;
  }
  .marketing-codes
    .marketing-code-toolbar
    [appearance~="marketing-code-search"] {
    width: 100%;
    grid-column: 1;
  }
  .marketing-codes [appearance~="marketing-code-search"] label {
    display: none;
  }
  .marketing-codes .marketing-code-toolbar > .fk-button {
    font-size: 11px;
    min-width: 0;
    padding: 0 6px;
  }
  .marketing-codes .marketing-code-toolbar > .fk-button:last-child {
    grid-column: 1 / -1;
    width: 100%;
    background: #f2f3f5;
    color: #4e5969;
    border: 0;
  }
  .mobile-coupon-code-list {
    display: grid;
    gap: 12px;
  }
  .mobile-coupon-code-card {
    padding: 12px 0;
    border-bottom: 1px solid #edf0f5;
  }
  .mobile-coupon-code-card > div {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
  }
  .mobile-coupon-code-card > div > span:first-child {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .mobile-coupon-code-card > div .fk-tag {
    margin-left: auto;
    flex: none;
    font-size: 11px;
  }
  .mobile-coupon-code-card > div .fk-button {
    width: 22px;
    height: 22px;
    min-width: 0;
    padding: 0;
    flex: none;
  }
  .mobile-coupon-code-card footer {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 6px;
    margin-top: 14px;
  }
  .mobile-coupon-code-card footer > div {
    display: flex;
    gap: 5px;
    flex: none;
  }
  .mobile-coupon-code-card footer p {
    font-size: 12px;
    color: #86909c;
    margin: 0;
  }
  .mobile-coupon-code-card small {
    display: block;
    margin-top: 4px;
  }
  .marketing-code-editor .marketing-code-switch-row {
    flex-wrap: wrap;
    margin-top: 20px;
    gap: 10px;
  }
  .marketing-code-editor .marketing-code-switch-row > span:first-child {
    flex-basis: 100%;
  }
  .marketing-code-editor .marketing-code-readonly {
    margin-top: 8px;
  }
  .marketing-code-editor .marketing-code-editor-actions {
    border-top: 1px solid #edf0f5;
    padding-top: 18px;
  }
}

@media (max-width: 360px) {
  .mobile-marketing-header-actions .fk-button:first-child {
    width: 32px;
    padding: 0;
  }
  .mobile-marketing-header-actions .fk-button:first-child span {
    display: none;
  }
}

@media (max-width: 760px) {
  html.merchant-interface .mobile-record-screen {
    background: #f8fafc;
  }
  .mobile-extension-screen .plugin-title-copy h1 {
    display: none;
  }
  .mobile-extension-screen .create-page > h1:first-child {
    display: none;
  }
}

@media (max-width: 760px) {
  .mobile-applications-sheet.modal-panel {
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
  .mobile-applications-sheet .modal-header {
    flex: none;
  }
  .mobile-applications-sheet .modal-body {
    flex: 1;
    min-height: 0;
  }
}

@media (max-width: 760px) {
  html.merchant-interface .plugin-applications-surface {
    padding: 20px 14px;
    background: #fff;
    min-height: calc(100dvh - 134px);
    border-radius: 12px;
  }
  .mobile-applications-page .mobile-application-icon {
    width: 48px;
    height: 48px;
    background: #f5f7fb;
    overflow: visible;
  }
  .mobile-application-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: inherit;
  }
  html.merchant-interface :is(.mobile-support-surface, .mobile-map-surface) {
    padding: 0;
    margin: 0 -14px;
    border-radius: 0;
  }
  html.merchant-interface
    .merchant-shell:has(.mobile-support-surface, .mobile-map-surface)
    .merchant-body {
    padding-bottom: 0;
  }
  html.merchant-interface .mobile-map-surface {
    padding: 12px;
    margin: 0;
    border-radius: 12px;
  }
}

.news-category-tabs {
  --fk-button-neutral-hover: transparent;
  --fk-field-hover: transparent;
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  margin: 20px 0;
  padding: 0;
  border: 0;
  border-bottom: 1px solid #e5e8ef;
}
.news-admin-items article:first-child {
  border-top: 0;
}
.news-category-tabs [data-fk-tab] {
  min-height: 40px;
  padding: 10px 0;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #4e5969;
  font: inherit;
  font-size: 14px;
  line-height: 1.5;
  cursor: pointer;
  white-space: nowrap;
  transition:
    color 0.15s ease,
    border-color 0.15s ease;
}
@media (min-width: 761px) {
  .news-category-tabs [data-fk-tab]:hover {
    background: transparent;
    color: var(--fk-primary);
  }
}
.news-category-tabs [data-fk-tab]:focus-visible {
  outline: 2px solid #90baff;
  outline-offset: 2px;
}
.news-category-tabs [data-fk-tab][aria-pressed="true"] {
  color: var(--fk-primary);
  background: transparent;
  border-bottom-color: var(--fk-primary);
}
.news-list-entry {
  display: block;
  padding: 22px 0;
  border-bottom: 1px solid #edf0f5;
  overflow-wrap: anywhere;
}
.news-list-entry h2 {
  margin: 0;
  font-size: 18px;
  color: #17233b;
}
@media (min-width: 761px) {
  .news-list-entry:hover h2 {
    color: var(--fk-primary);
  }
}
.news-list-entry p {
  color: #677487;
  line-height: 1.7;
}
.news-list-entry time,
.news-category-empty {
  color: #86909c;
  font-size: 13px;
}
.news-list-entry time {
  display: block;
  margin-top: 12px;
}
.news-list-pages {
  margin-top: 24px;
}
@media (max-width: 760px) {
  .news-category-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    border: 0;
  }
  .news-category-tabs [data-fk-tab],
  .merchant-main
    :is(.shop-settings-page, .news-admin-page)
    [appearance~="shop-tab-bar"]
    > button {
    box-sizing: border-box;
    min-height: 36px;
    height: 36px;
    min-width: 0;
    padding: 8px 0;
    border: 0;
    border-radius: 24px;
    background: transparent;
    color: #535963;
    font-size: clamp(12px, 3.4vw, 14px);
    font-weight: 400;
    line-height: 20px;
    transition: none;
    animation: none;
  }
  .merchant-main
    :is(.shop-settings-page, .news-admin-page)
    [appearance~="shop-tab-bar"] {
    box-sizing: border-box;
    width: 100%;
    min-height: 48px;
    padding: 6px 4px;
    align-items: center;
  }
  .news-admin-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 4px;
    height: auto;
    box-shadow: none;
  }
  .news-category-tabs [data-fk-tab][aria-pressed="true"],
  .merchant-main
    :is(.shop-settings-page, .news-admin-page)
    [appearance~="shop-tab-bar"]
    > button.active {
    background: #f2f3f5;
    color: #3564d4;
    font-weight: 500;
  }
  .news-admin-items small {
    line-height: 1.7;
  }
  .news-admin-list {
    min-width: 0;
    padding: 20px 16px;
  }
  .news-admin-header {
    gap: 8px;
    flex-wrap: wrap;
  }
  .news-admin-items article {
    display: block;
    min-width: 0;
  }
  .news-admin-items article > div:first-child {
    max-width: 100%;
  }
  .news-admin-items :is(h2, p, small) {
    overflow-wrap: anywhere;
  }
  .news-admin-items p {
    white-space: normal;
    text-overflow: clip;
    line-height: 1.7;
  }
  .news-admin-item-actions {
    flex-wrap: wrap;
    margin-top: 14px;
  }
}
/* 买家端原版移动布局；桌面仍使用现有店铺和商品控件。 */
.buyer-shop-introduction {
  display: contents;
}

@media (min-width: 761px) {
  .purchase-dialog .purchase-description {
    min-height: 80px;
    max-height: 220px;
    max-height: min(220px, 35vh);
    max-height: min(220px, 35dvh);
    overflow-y: auto;
    overscroll-behavior-y: contain;
    scrollbar-width: thin;
  }
}

@media (max-width: 760px) {
  .order-lookup-page {
    background: #fff;
  }
  .mobile-lookup-header {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 10px 44px;
    border-bottom: 1px solid #f2f2f2;
    background: #fff;
  }
  .mobile-lookup-header > a {
    position: absolute;
    left: 20px;
    color: #222;
  }
  .mobile-lookup-header > a > svg {
    transform: rotate(180deg);
  }
  .mobile-lookup-header h1 {
    margin: 0;
    color: #111;
    font-size: 18px;
    font-weight: 600;
  }
  .order-lookup-page .buyer-main {
    width: 100%;
    margin: 0;
  }
  .order-lookup-page .lookup-card {
    min-height: calc(100dvh - 48px);
    margin: 0;
    border-radius: 0;
  }
  .order-lookup-page .lookup-card::before {
    inset: 0;
    width: 100%;
    height: 600px;
    background-position: left top;
    background-size: auto 100%;
    filter: none;
    opacity: 1;
  }
  .order-lookup-page .lookup-content {
    width: calc(100% - 48px);
    padding-top: 124px;
  }
  .order-lookup-page .lookup-card h1 {
    display: block;
    margin: 0;
    color: #111;
    font-size: clamp(16px, 4.8vw, 20px);
    font-weight: 600;
    line-height: 1.5;
  }
  .order-lookup-page .lookup-card h1 span {
    display: inline;
  }
  .order-lookup-page .lookup-card .lookup-subtitle {
    margin: 24px 0 60px;
    color: #999;
    font-size: 13px;
    line-height: 1.6;
  }
  .order-lookup-page .lookup-card form {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0;
    width: 90%;
    margin: 0 auto;
    padding: 3px;
    border: 1px solid #eee;
    border-radius: 8px;
    background: #fff;
  }
  .order-lookup-page .lookup-card form input {
    flex: 1;
    min-width: 0;
    width: 0;
    height: 35px;
    padding: 0 8px;
    border: 0;
    background: transparent;
    font-size: 14px;
  }
  .order-lookup-page .lookup-card form button {
    flex: 0 0 74px;
    width: 74px;
    max-width: 74px;
    height: 35px;
    min-width: 0;
    padding: 0 14px;
    border: 0;
    border-radius: 22px;
    background: linear-gradient(110deg, #2469ff, #229aff);
    font-size: 14px;
  }
  .order-lookup-page .lookup-advisory > p {
    margin: 16px 0;
    color: #999;
    font-size: 13px;
    line-height: 1.65;
  }
  .mobile-order-restoring {
    min-height: calc(100dvh - 48px);
    display: grid;
    place-items: center;
    color: #8c96a7;
    background: #f3f3f3;
    font-size: 14px;
  }
  .buyer-footer {
    display: none;
  }
  .buyer-page:has(.mobile-card-order) {
    background: #f3f3f3;
  }
  .buyer-page .buyer-order-detail-main:has(.mobile-card-order) {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 0 24px;
  }
  .buyer-order-details.mobile-card-order {
    background: transparent;
    border-radius: 0;
    color: #222;
  }
  .mobile-card-order > header {
    position: relative;
    justify-content: center;
    min-height: 48px;
    padding: 10px 44px;
    background: #fff;
  }
  .mobile-card-order > header > a {
    position: absolute;
    left: 18px;
    font-size: 26px;
  }
  .mobile-card-order > header h1 {
    font-size: 18px;
    font-weight: 600;
  }
  .mobile-card-order-body {
    display: grid;
    gap: 18px;
    padding: 18px;
  }
  .mobile-card-order-section {
    container-type: inline-size;
    padding: 14px 12px;
    border-radius: 8px;
    background: #fff;
    min-width: 0;
  }
  .mobile-card-order-section h2 {
    gap: 6px;
    margin: 0 0 14px;
    font-size: 16px;
    font-weight: 600;
    color: #171717;
  }
  .mobile-card-order-section h2 > svg {
    flex: none;
    color: #fff;
    background: #287aff;
    padding: 2px;
    width: 18px;
    height: 18px;
    border-radius: 3px;
  }
  .mobile-card-order-info {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
  }
  .mobile-card-order-info > div {
    display: grid;
    grid-template-columns: 86px minmax(0, 1fr);
    gap: 4px;
    padding: 6px 0;
    border-bottom: 1px solid #f5f5f5;
  }
  .mobile-card-order-info > div:last-child {
    border-bottom: 0;
    padding-bottom: 4px;
  }
  .mobile-card-order-info dt {
    color: #989fa6;
  }
  .mobile-card-order-info dd {
    margin: 0;
    overflow-wrap: anywhere;
  }
  .mobile-card-order-paid {
    border: 0;
    border-radius: 2px;
    background: #00c66c;
    color: #fff;
    font-size: 13px;
    padding: 3px 6px;
  }
  .mobile-card-order-delivery-heading {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
  }
  .mobile-card-order-delivery-heading h2 {
    flex: 1;
    min-width: 0;
    align-items: center;
    margin: 0;
    line-height: 1.5;
    white-space: nowrap;
  }
  .mobile-card-order-actions {
    display: flex;
    flex: none;
    gap: 8px;
    margin-left: auto;
  }
  .mobile-card-order-export.fk-button {
    flex: none;
    padding: 0 8px;
    height: 30px;
    border: 1px solid #287aff;
    border-radius: 5px;
    background: #fff;
    color: #287aff;
    font-size: 14px;
    font-weight: 600;
  }
  @container (max-width: 360px) {
    .mobile-card-order-delivery-heading h2 {
      font-size: 14px;
    }
    .mobile-card-order-export.fk-button {
      min-width: 0;
      padding: 0;
      border: 0;
      background: transparent;
      font-size: 13px;
    }
  }
  @container (max-width: 290px) {
    .mobile-card-order-delivery-heading,
    .mobile-card-order-actions {
      gap: 5px;
    }
    .mobile-card-order-delivery-heading h2 {
      font-size: 12px;
      gap: 4px;
    }
    .mobile-card-order-export.fk-button {
      font-size: 11px;
    }
  }
  .mobile-card-order .buyer-delivered-card {
    padding: 12px;
    font-size: 14px;
  }
  .mobile-card-order .buyer-delivered-card > div {
    align-items: center;
  }
  .mobile-card-order .buyer-delivered-card pre {
    margin-top: 8px;
  }
  .mobile-card-order .buyer-delivered-card button,
  .mobile-card-order .buyer-order-contact button {
    font-size: 14px;
  }
  .mobile-card-order-instructions {
    min-height: 100px;
  }
  .mobile-card-order .buyer-order-contact {
    gap: 7px;
    padding: 14px 12px;
    font-size: 14px;
  }
  .mobile-card-order .buyer-order-contact > img {
    width: 16px;
    height: 16px;
    object-fit: contain;
  }
  .mobile-card-order .buyer-order-contact > strong {
    color: #287aff;
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .mobile-card-order .buyer-order-contact > button {
    margin-left: auto;
  }
  .mobile-card-order [appearance~="buyer-order-after-sales"] {
    width: 100%;
    min-height: 34px;
    justify-content: center;
    margin: 8px 0 0;
    border: 1px solid #dce7fc;
    border-radius: 4px;
    background: #f7f7f7;
    color: #287aff;
    font-size: 16px;
    font-weight: 600;
  }
  .mobile-shop-custom-links {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 7px 0 0;
  }
  .mobile-shop-custom-links [appearance~="shop-custom-action-link"] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    height: 28px;
    border: 0;
    border-radius: 9px;
    background: #fff;
    color: #4385e7;
    font-size: 12px;
  }
  .mobile-shop-custom-links img {
    width: 16px;
    height: 16px;
    object-fit: contain;
  }
  .support-buyer-fullscreen-backdrop.modal-backdrop {
    padding: 0;
    z-index: 2100;
    background: #fff;
  }
  .support-buyer-fullscreen.support-buyer-dialog {
    position: fixed;
    max-width: none !important;
    max-height: none;
    border-radius: 0;
    margin: 0;
    background: #fff;
  }
  .support-buyer-mobile-heading {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr) 32px;
    align-items: center;
    gap: 10px;
    height: 52px;
    padding: 0 14px;
    flex: none;
    border-bottom: 1px solid #edf0f5;
    text-align: center;
  }
  .support-buyer-mobile-heading svg {
    transform: rotate(180deg);
  }
  .support-buyer-mobile-heading strong {
    font-size: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .support-buyer-mobile-body {
    flex: 1;
    min-height: 0;
    overflow: hidden;
  }
}
@media (max-width: 760px) {
  .buyer-shop-page {
    background: #fff;
  }
  .buyer-shop-page > .buyer-main {
    width: 100%;
    margin: 0;
  }
  .mobile-buyer-toolbar {
    position: sticky;
    top: 0;
    z-index: 30;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 48px;
    padding: 8px 16px;
    background: #fff;
    box-shadow: 0 1px 5px #26334b0a;
  }
  .mobile-buyer-toolbar .mobile-buyer-shop-name {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
    margin-right: auto;
    font-size: 13px;
    color: #252b37;
  }
  .mobile-buyer-shop-name img {
    width: 24px;
    height: 24px;
    object-fit: contain;
    border-radius: 50%;
  }
  .mobile-buyer-toolbar .mobile-buyer-order {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex: none;
    padding: 6px 9px;
    border-radius: 22px;
    background: #f6f7f9;
    color: #252b37;
    font-size: 12px;
    white-space: nowrap;
  }
  .buyer-shop-introduction {
    position: relative;
    display: block;
    padding: 18px 18px 64px;
    background: linear-gradient(110deg, #3da2ed, #3267fa 72%, #528bff);
    color: #fff;
  }
  .buyer-shop-introduction .shop-profile {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 0;
    min-height: 60px;
  }
  .mobile-shop-toolbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    margin: -12px 0 12px;
  }
  .mobile-shop-toolbar > .fk-button,
  .mobile-shop-toolbar > .mobile-shop-order {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    height: 34px;
    padding: 0 11px;
    border: 0;
    border-radius: 22px;
    background: #244aa933;
    color: #fff;
    font-size: 13px;
    white-space: nowrap;
  }
  .mobile-shop-toolbar > .fk-button {
    width: 34px;
    padding: 0;
    border-radius: 50%;
  }
  .buyer-shop-introduction .shop-avatar {
    width: 52px;
    height: 52px;
    flex: none;
    border-radius: 50%;
    overflow: hidden;
  }
  .buyer-shop-introduction .shop-profile-text {
    min-width: 0;
  }
  .buyer-shop-introduction .shop-name-line {
    margin: 0;
    gap: 5px;
  }
  .buyer-shop-introduction [appearance~="shop-status-badge"] {
    border-radius: 6px;
  }
  .buyer-shop-introduction .shop-name-line h1 {
    margin: 0;
    font-size: 20px;
    line-height: 1.4;
    color: #fff;
    background: none;
    -webkit-text-fill-color: #fff;
    animation: none;
    overflow-wrap: anywhere;
  }
  .buyer-shop-introduction .mobile-shop-count {
    margin: 7px 0 0;
    color: #d0e7ff;
    font-size: 12px;
  }
  .buyer-shop-introduction .shop-announcement {
    padding: 14px 0 0;
    min-height: 0;
  }
  .buyer-shop-introduction .shop-announcement strong {
    display: none;
  }
  .buyer-shop-introduction .shop-announcement p {
    margin: 0;
    color: #dcecff;
    line-height: 1.75;
    white-space: pre-line;
    overflow-wrap: anywhere;
  }
  .buyer-shop-introduction .shop-profile-actions {
    position: absolute;
    right: 18px;
    bottom: 18px;
    gap: 6px;
    flex-wrap: wrap;
    max-width: calc(100% - 36px);
    justify-content: flex-end;
  }
  .buyer-shop-introduction .shop-profile-actions .shop-action-wrap > button,
  .buyer-shop-introduction
    .shop-profile-actions
    [appearance~="shop-custom-action-link"] {
    height: 30px;
    padding: 5px 12px;
    border: 0;
    border-radius: 22px;
    background: #fff;
    color: #4385e7;
    font-size: 12px;
  }
  .buyer-shop-introduction .shop-profile-actions .shop-action-popover {
    left: auto;
    right: 0;
    transform: none;
  }
  .buyer-shop-page .shop-content {
    padding: 18px;
    border-radius: 0;
    box-shadow: none;
  }
  .buyer-shop-page .buyer-shop-top {
    gap: 0;
  }
  .buyer-shop-page [appearance~="buyer-tabs"] {
    display: flex;
    gap: 24px;
    width: 100%;
    padding: 0;
    border: 0;
  }
  .buyer-shop-page [appearance~="buyer-tabs"] > button {
    padding: 0 7px 10px;
    color: #666;
    background: none;
    border: 0;
    border-radius: 0;
    font-size: 16px;
    min-width: 0;
  }
  .buyer-shop-page [appearance~="buyer-tabs"] > button.active {
    position: relative;
    color: #3479ee;
    font-weight: 600;
  }
  .buyer-shop-page [appearance~="buyer-tabs"] > button.active::after {
    content: "";
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 0;
    height: 3px;
    border-radius: 4px;
    background: #3479ee;
  }
  .buyer-shop-page .buyer-controls {
    padding: 16px 0 0;
    border: 0;
  }
  .buyer-shop-page .buyer-categories {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
  .buyer-shop-page .buyer-categories > button,
  .buyer-shop-page
    .buyer-categories
    > button:not([appearance~="buyer-all-categories"]) {
    width: 100%;
    height: auto;
    min-height: 72px;
    padding: 12px;
    border: 0;
    font-size: 14px;
    color: #555;
    border-radius: 6px;
    white-space: normal;
  }
  .buyer-shop-page .buyer-categories > button.active {
    color: #fff;
  }
  .buyer-shop-page .buyer-categories > button span {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .buyer-shop-page .buyer-categories > button small {
    font-size: 12px;
    margin-top: 9px;
  }
  .buyer-shop-page .buyer-category-image {
    width: 22px;
    height: 22px;
  }
  .buyer-shop-page .buyer-categories > button.mobile-card-category {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }
  .buyer-shop-page .buyer-categories .mobile-card-category-title {
    display: flex;
    align-items: center;
    gap: 6px;
    overflow: visible;
    text-overflow: clip;
    text-align: left;
  }
  .buyer-shop-page .buyer-categories .mobile-card-category-count {
    display: block;
    text-align: left;
    margin: 9px 0 0;
  }
  .buyer-shop-page .knowledge-shop .buyer-categories,
  .buyer-shop-page .resource-shop .buyer-categories {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .buyer-shop-page .knowledge-shop .buyer-categories > button,
  .buyer-shop-page .resource-shop .buyer-categories > button {
    flex: 0 1 auto;
    width: auto;
    min-height: 36px;
    padding: 8px 14px;
    background: #f5f6fb;
    color: #000;
  }
  .buyer-shop-page .knowledge-shop .buyer-categories > button.active,
  .buyer-shop-page .resource-shop .buyer-categories > button.active {
    color: #000;
    box-shadow: none;
  }
  .buyer-shop-page .knowledge-shop .buyer-categories > button::after,
  .buyer-shop-page .knowledge-shop .buyer-categories > button::before,
  .buyer-shop-page .resource-shop .buyer-categories > button::after,
  .buyer-shop-page .resource-shop .buyer-categories > button::before,
  .buyer-shop-page .knowledge-shop .buyer-categories small,
  .buyer-shop-page .resource-shop .buyer-categories small {
    display: none;
  }
  .buyer-shop-page .buyer-select-title {
    margin: 24px 0 16px;
    font-size: 16px;
    font-weight: 600;
    color: #555;
  }
  .buyer-shop-page .buyer-goods-grid,
  .buyer-shop-page .buyer-goods-grid.is-text-only,
  .buyer-shop-page .resource-shop .buyer-goods-grid.is-resource,
  .buyer-shop-page .buyer-knowledge-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
  .buyer-shop-page .buyer-knowledge-list,
  .buyer-shop-page .resource-shop .buyer-goods-grid {
    margin-top: 16px;
  }
  .buyer-shop-page [appearance~="buyer-good-card"],
  .buyer-shop-page
    .buyer-goods-grid.is-resource
    [appearance~="buyer-good-card"],
  .buyer-shop-page [appearance~="buyer-knowledge-item"] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    width: 100%;
    min-width: 0;
    height: auto;
    padding: 0;
    border: 1px solid #f0f1f3;
    border-radius: 7px;
    background: #fff;
    overflow: hidden;
    box-shadow: 0 3px 8px #00000006;
    white-space: normal;
    text-align: left;
  }
  .buyer-shop-page .buyer-good-image,
  .buyer-shop-page [appearance~="buyer-good-card"] .buyer-good-image,
  .buyer-shop-page .buyer-goods-grid.is-resource .buyer-good-image,
  .buyer-shop-page .buyer-knowledge-cover {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1;
    margin: 0;
    object-fit: contain;
  }
  .buyer-shop-page .buyer-good-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }
  .buyer-shop-page .buyer-good-content,
  .buyer-shop-page .buyer-goods-grid.is-resource .buyer-good-content,
  .buyer-shop-page .mobile-content-good-copy {
    flex: 1;
    height: auto;
    min-height: 82px;
    padding: 11px;
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .buyer-shop-page
    .buyer-goods-grid.is-text-only
    [appearance~="buyer-good-card"] {
    height: auto;
    min-height: 116px;
  }
  .buyer-shop-page .buyer-goods-grid.is-text-only .buyer-good-content {
    min-height: 116px;
  }
  .buyer-shop-page .buyer-good-content h2,
  .buyer-shop-page .mobile-content-good-copy h2 {
    font-size: 14px;
    line-height: 1.5;
    color: #444;
    margin: 0;
    font-weight: 600;
    overflow-wrap: anywhere;
  }
  .buyer-shop-page .buyer-good-bottom {
    margin: auto 0 0;
    gap: 6px;
    flex-wrap: wrap;
  }
  .buyer-shop-page
    [appearance~="buyer-good-card"].has-marketing
    .buyer-good-bottom {
    flex-direction: row;
    align-items: center;
    gap: 5px;
  }
  .buyer-shop-page
    .buyer-goods-grid.with-card-marketing
    [appearance~="buyer-good-card"],
  .buyer-shop-page
    .buyer-goods-grid.with-card-marketing.is-text-only
    [appearance~="buyer-good-card"] {
    height: auto;
  }
  .buyer-shop-page .buyer-goods-grid.with-card-marketing .buyer-good-content {
    height: auto;
  }
  .buyer-shop-page
    [appearance~="buyer-good-card"].has-marketing
    .marketing-badges {
    display: contents;
  }
  .buyer-shop-page [appearance~="buyer-good-card"] .marketing-badges > span {
    font-size: 11px;
    padding: 2px 4px;
    border-radius: 3px;
  }
  .buyer-shop-page .buyer-good-bottom > small {
    margin-left: auto;
  }
  .buyer-shop-page .mobile-content-good-price-row .buyer-knowledge-price {
    margin-right: 0;
  }
  .buyer-shop-page .mobile-content-good-price-row,
  .buyer-shop-page .buyer-goods-grid.is-resource .buyer-good-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: auto;
  }
  .buyer-shop-page .mobile-content-good-price-row .buyer-knowledge-price,
  .buyer-shop-page .buyer-goods-grid.is-resource .buyer-good-prices {
    margin-left: auto;
  }
  .buyer-shop-page .buyer-good-bottom strong,
  .buyer-shop-page .buyer-knowledge-price {
    font-family: inherit;
    font-size: 16px;
    line-height: 1.4;
    color: #ff743a;
    font-weight: 600;
  }
  .buyer-shop-page .buyer-good-prices {
    min-width: 0;
    flex-wrap: wrap;
    gap: 4px;
  }
  .buyer-shop-page .buyer-good-bottom small {
    font-size: 11px;
    white-space: nowrap;
    padding: 2px 5px;
    border-radius: 2px;
  }
  .buyer-shop-page .buyer-good-bottom small.is-sold-out {
    color: #d97a43;
    background: #fff0e8;
  }
  .buyer-shop-page .buyer-good-bottom small.is-low-stock {
    color: #e39832;
    background: #fff7eb;
  }
  .buyer-shop-page .buyer-knowledge-price del {
    font-size: 11px;
    color: #aaa;
    margin-left: 5px;
  }
  .buyer-shop-page .mobile-content-good-meta {
    display: flex;
    justify-content: space-between;
    gap: 6px;
    color: #aaa;
    font-size: 11px;
    line-height: 1.5;
  }
  .mobile-content-good-meta > span {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .mobile-content-good-meta time {
    flex: none;
  }
  .buyer-shop-page .buyer-load-more {
    display: block;
    text-align: center;
    width: 100%;
    margin: 24px 0 4px;
    background: transparent;
    color: #aaa;
    font-size: 14px;
  }
  .buyer-shop-page .buyer-shop-end {
    display: none;
  }
  .purchase-mask {
    align-items: end;
    justify-items: stretch;
    background: #0009;
  }
  .purchase-mask .purchase-dialog {
    width: 100%;
    max-width: none;
    max-height: 88vh;
    max-height: 88dvh;
    border-radius: 18px 18px 0 0;
    box-shadow: none;
  }
  .purchase-dialog .purchase-dialog-header {
    padding: 22px 52px 6px 18px;
    text-align: left;
    font-size: 16px;
    line-height: 1.5;
    overflow-wrap: anywhere;
  }
  .purchase-dialog .purchase-dialog-header button {
    top: 20px;
    right: 12px;
  }
  .purchase-dialog
    .purchase-dialog-header
    [appearance~="purchase-dialog-expand"] {
    right: 18px;
    font-size: 24px;
  }
  .purchase-dialog [appearance~="purchase-dialog-close"] {
    display: none;
  }
  .purchase-dialog .purchase-dialog-body {
    display: flex;
    flex-direction: column;
    padding: 0 18px 16px;
  }
  .purchase-dialog .purchase-dialog-body > h2 {
    display: none;
  }
  .purchase-dialog .purchase-tags {
    order: -1;
    margin: 8px 0 12px;
  }
  .purchase-dialog .purchase-tags > span {
    border-radius: 4px;
  }
  .purchase-dialog .purchase-description {
    flex: none;
    height: auto;
    min-height: 80px;
    max-height: 220px;
    max-height: min(220px, 35vh);
    max-height: min(220px, 35dvh);
    overflow-y: auto;
    overscroll-behavior-y: contain;
    margin: 0;
    font-size: 14px;
    line-height: 1.8;
    scrollbar-width: thin;
  }
  .purchase-dialog .purchase-description-content {
    padding: 0 0 16px;
  }
  .purchase-dialog .purchase-coupon-row {
    min-height: 50px;
    border-top: 1px solid #f3f4f6;
    border-bottom: 0;
    flex-wrap: wrap;
  }
  .purchase-dialog .purchase-contact,
  .standalone-good-page .standalone-contact {
    display: flex;
    gap: 6px;
    height: auto;
    min-height: 34px;
    padding: 0;
    border: 1px solid #f0f1f3;
    border-radius: 4px;
  }
  .purchase-dialog .purchase-contact > span,
  .standalone-good-page .standalone-contact > span {
    padding-left: 9px;
    flex: none;
    font-size: 12px;
  }
  .purchase-dialog .purchase-contact input,
  .standalone-good-page .standalone-contact input {
    font-size: 12px;
    height: 34px;
    padding: 0 6px;
    background: #fff;
    min-width: 0;
  }
  .mobile-purchase-contact-hint {
    margin: 4px 0 14px;
    font-size: 11px;
    line-height: 1.5;
    color: #999;
  }
  .purchase-dialog .mobile-purchase-contact-hint {
    display: none;
  }
  .purchase-dialog .purchase-contact > span {
    font-size: 14px;
    font-weight: 600;
  }
  .purchase-dialog .purchase-contact input {
    font-size: 14px;
  }
  .purchase-dialog .purchase-pay {
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 24px;
    margin-bottom: 8px;
  }
  .purchase-dialog .purchase-pay button,
  .standalone-good-page .purchase-pay button {
    position: relative;
    height: 44px;
    padding: 7px 13px;
    font-size: 14px;
    border-width: 1px;
    border-radius: 4px;
  }
  .purchase-dialog .purchase-pay button {
    min-width: 108px;
    gap: 8px;
    font-size: 16px;
    padding: 7px 14px;
  }
  .purchase-dialog .purchase-pay button img {
    width: 24px;
    height: 24px;
    border-radius: 50%;
  }
  .purchase-dialog .purchase-pay button.active::after,
  .standalone-good-page .purchase-pay button.active::after {
    content: "✓";
    position: absolute;
    bottom: 0;
    right: 0;
    font-size: 10px;
    color: #fff;
    background: #3479ee;
    padding: 0 2px;
    border-top-left-radius: 7px;
  }
  .purchase-dialog .purchase-pay button.active,
  .standalone-good-page .purchase-pay button.active {
    border-width: 2px;
  }
  .purchase-dialog .purchase-dialog-footer {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    padding: 12px 18px calc(12px + env(safe-area-inset-bottom));
    border-top: 1px solid #f1f2f4;
  }
  .mobile-purchase-price {
    margin-right: auto;
    min-width: 0;
    color: #ff743a;
    font-size: 17px;
  }
  .purchase-dialog
    .purchase-dialog-footer
    [appearance~="buyer-purchase-button"],
  .standalone-purchase-bar [appearance~="buyer-purchase-button"] {
    flex: none;
    height: 36px;
    border-radius: 22px;
    padding: 0 17px;
    background: linear-gradient(110deg, #3273ff, #209bff);
    border: 0;
    color: #fff;
  }
  .purchase-dialog .quantity-stepper,
  .standalone-purchase-bar .quantity-stepper {
    gap: 8px;
    border: 0;
    background: transparent;
    box-shadow: none;
  }
  .purchase-dialog .quantity-stepper button,
  .standalone-purchase-bar .quantity-stepper button {
    padding: 0;
    min-width: 30px;
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 50%;
    background: #f7f8fa;
    font-size: 25px;
    color: #555;
  }
  .purchase-dialog .quantity-stepper input,
  .standalone-purchase-bar .quantity-stepper input {
    width: 42px;
    height: 30px;
    background: #f2f3f5;
    text-align: center;
    padding: 0;
    border: 0;
    border-radius: 3px;
    font-size: 15px;
    box-shadow: none;
  }
  .purchase-mask.fk-dialog-reveal > .purchase-dialog,
  .purchase-mask.fk-dialog-enter-active > .purchase-dialog,
  .knowledge-purchase-dialog.fk-dialog-enter-active,
  .fk-dialog-reveal > .knowledge-purchase-dialog,
  .fk-dialog-enter-active > .knowledge-purchase-dialog,
  .fk-dialog-reveal > .mobile-buyer-search-sheet,
  .fk-dialog-enter-active > .mobile-buyer-search-sheet {
    animation: mobile-buyer-slide-up 0.3s ease-out;
    transform-origin: bottom;
  }
  .purchase-mask.fk-dialog-enter-from > .purchase-dialog,
  .purchase-mask.fk-dialog-leave-to > .purchase-dialog,
  .fk-dialog-enter-from > .knowledge-purchase-dialog,
  .fk-dialog-leave-to > .knowledge-purchase-dialog,
  .fk-dialog-enter-from > .mobile-buyer-search-sheet,
  .fk-dialog-leave-to > .mobile-buyer-search-sheet {
    transform: translateY(100%);
  }
  @keyframes mobile-buyer-slide-up {
    from {
      transform: translateY(100%);
    }
    to {
      transform: translateY(0);
    }
  }
  .modal-backdrop:has(> .knowledge-purchase-dialog),
  .modal-backdrop:has(> .mobile-buyer-search-sheet) {
    align-items: flex-end;
    padding: 0;
  }
  .knowledge-purchase-dialog,
  .mobile-buyer-search-sheet {
    width: 100%;
    max-width: none !important;
    max-height: 88vh;
    max-height: 88dvh;
    border-radius: 18px 18px 0 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
  .knowledge-purchase-dialog .modal-body {
    min-height: 0;
    overflow-y: auto;
  }
  .mobile-buyer-search-sheet .modal-body {
    padding: 18px 20px 30px;
  }
  .mobile-buyer-search-sheet [appearance~="buyer-search"] {
    display: flex;
    width: 100%;
  }
  .mobile-buyer-search-sheet input {
    min-width: 0;
    flex: 1;
  }
  .standalone-good-page {
    padding: 0 14px calc(90px + env(safe-area-inset-bottom));
    background: #f7f8fa;
  }
  .standalone-good-page .mobile-good-toolbar {
    margin: 0 -14px 14px;
    padding: 9px 14px;
    justify-content: space-between;
  }
  .mobile-buyer-toolbar .mobile-buyer-back {
    color: #252b37;
    display: inline-flex;
    flex: none;
  }
  .mobile-buyer-back svg {
    transform: rotate(180deg);
  }
  .mobile-good-toolbar p {
    flex: 1;
    min-width: 0;
    margin: 0;
    padding: 6px 12px;
    border-radius: 24px;
    background: #dedfe1;
    color: #fff;
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .standalone-good-page .standalone-good-layout {
    display: block;
    width: 100%;
  }
  .standalone-good-page .standalone-good-sidebar {
    display: none;
  }
  .standalone-good-page .standalone-good-card {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-height: 0;
    padding: 20px 14px;
    border-radius: 10px;
  }
  .standalone-good-page .standalone-good-hero,
  .standalone-good-page .standalone-good-hero-info {
    display: contents;
  }
  .standalone-good-page .standalone-good-card > * {
    order: 5;
  }
  .standalone-good-page .standalone-good-title {
    order: 0;
    font-size: 20px;
    line-height: 1.45;
    margin: 0 0 14px;
    overflow-wrap: anywhere;
  }
  .standalone-good-page .standalone-tags {
    order: 1;
    margin: 0 0 16px;
    flex-wrap: wrap;
    font-size: 12px;
  }
  .standalone-good-page .standalone-good-price {
    display: none;
  }
  .standalone-good-page .standalone-seller {
    order: 2;
    height: auto;
    min-height: 55px;
    background: #fff;
    padding: 0;
    margin: 4px 0 22px;
    gap: 12px;
  }
  .standalone-good-page .standalone-seller > img {
    width: 42px;
    height: 42px;
    border-radius: 50%;
  }
  .standalone-good-page [appearance~="standalone-seller-name"] {
    font-size: 15px;
    color: #252b37;
    -webkit-text-fill-color: #252b37;
    background: none;
    animation: none;
  }
  .standalone-good-page [appearance~="standalone-seller-contact-button"] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 0 4px;
    width: auto;
    height: 28px;
    font-size: 12px;
  }
  .standalone-good-page .standalone-seller p {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .standalone-good-page .standalone-good-image {
    order: 3;
    flex: none;
    width: 100%;
    height: auto;
    aspect-ratio: 1;
    border: 0;
    border-radius: 0;
    margin: 0 0 20px;
  }
  .standalone-good-page .standalone-description {
    margin-top: 0;
    padding-top: 18px;
    font-size: 14px;
    line-height: 1.8;
  }
  .standalone-good-page .rich-product-content {
    overflow-wrap: anywhere;
    max-width: 100%;
  }
  .standalone-good-page .rich-product-content img,
  .purchase-dialog .rich-product-content img {
    max-width: 100%;
    height: auto;
  }
  .standalone-good-page .standalone-description-heading {
    display: none;
  }
  .standalone-good-page .standalone-coupon-row {
    min-height: 46px;
    margin-top: 16px;
    border-bottom: 0;
    flex-wrap: wrap;
  }
  .standalone-good-page .standalone-pay {
    margin-top: 16px;
    flex-wrap: wrap;
    gap: 9px;
  }
  .standalone-good-page .knowledge-reader,
  .standalone-good-page .resource-reader {
    margin-top: 0;
    padding-top: 20px;
    border-top: 1px solid #f2f3f5;
  }
  .standalone-good-page .knowledge-content-summary,
  .standalone-good-page .resource-download-box {
    margin: 12px 0 0;
    padding: 16px;
    font-size: 14px;
    border: 1px dashed #e8eaef;
    background: #fff;
  }
  .standalone-good-page .resource-download-label {
    font-size: 14px;
    margin: 12px 0 0;
  }
  .standalone-good-page .resource-locked {
    font-size: 14px;
  }
  .standalone-purchase-bar {
    height: auto;
    min-height: 60px;
    padding-bottom: env(safe-area-inset-bottom);
  }
  .standalone-purchase-bar > div {
    min-height: 60px;
    width: calc(100% - 32px);
    gap: 8px;
  }
  .standalone-purchase-bar strong {
    margin-left: 0;
    margin-right: auto;
    color: #ff743a;
    font-size: 19px;
  }
  @media (prefers-reduced-motion: reduce) {
    .purchase-mask.fk-dialog-reveal > .purchase-dialog,
    .purchase-mask.fk-dialog-enter-active > .purchase-dialog,
    .fk-dialog-reveal > .knowledge-purchase-dialog,
    .fk-dialog-enter-active > .knowledge-purchase-dialog,
    .fk-dialog-reveal > .mobile-buyer-search-sheet,
    .fk-dialog-enter-active > .mobile-buyer-search-sheet {
      animation: none;
    }
  }
}
/* Recharge fields share the host controls, colors and spacing. */
.recharge-publish-page .card-publish-row.fk-form-item {
  grid-template-columns: 100px minmax(0, 1fr);
}
.recharge-field-row.fk-form-item {
  display: grid;
  grid-template-columns: 100px minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  padding: 12px 0;
  margin: 0;
  border-bottom: 1px solid #eef0f4;
}
.recharge-field-row > label {
  padding-top: 7px;
  color: #61758b;
  font-size: 13px;
  overflow-wrap: anywhere;
}
.recharge-account-row.fk-form-item {
  border-bottom: 0;
}
.recharge-field-row .fk-form-item-content,
.recharge-publish-page .fk-form-item-content {
  min-width: 0;
}
.recharge-publish-page .fk-form-item-content {
  width: min(100%, 933px);
}
.recharge-field-row .fk-form-item-content > button {
  margin-top: 8px;
}
.purchase-dialog .recharge-field-row.fk-form-item {
  grid-template-columns: 62px minmax(0, 1fr);
}
.purchase-dialog .recharge-field-row > label {
  text-align: left;
}
.recharge-account-query {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.recharge-account-query .fk-input {
  flex: 1;
  width: 0;
  min-width: 0;
}
.recharge-account-query .fk-button {
  flex: none;
}
.recharge-linked-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.recharge-linked-row .recharge-field-row.fk-form-item {
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  border-bottom: 0;
}
.recharge-linked-row .recharge-field-row > label {
  padding-top: 0;
}
.recharge-purchase-details {
  display: grid;
  gap: 16px;
}
.recharge-purchase-details.has-target-options {
  gap: 8px;
}
.has-target-options .recharge-field-row.fk-form-item {
  padding: 8px 0;
}
.has-target-options .recharge-field-row > label {
  padding-top: 0;
  align-self: center;
  line-height: 20px;
}
@media (min-width: 761px) {
  .recharge-purchase-details .recharge-contact-row.fk-form-item,
  .recharge-purchase-details.has-target-options
    .recharge-contact-row.fk-form-item {
    padding-bottom: 20px;
  }
}
.recharge-progress .detail-section-title {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}
.buyer-recharge-heading {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}
.buyer-recharge-heading h2 {
  margin: 0;
}
.buyer-recharge-actions {
  margin-left: auto;
  flex: none;
}
.buyer-recharge-target {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  min-width: 0;
}
.buyer-recharge-target dt {
  white-space: nowrap;
}
.recharge-history {
  border-top: 1px solid #e5e6eb;
  padding-top: 12px;
  color: #86909c;
  font-size: 13px;
}
.buyer-order-contact.buyer-recharge-block {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 12px;
  margin: 0 0 36px;
}
.buyer-recharge-result-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 120px), 1fr));
  line-height: 1.5;
  gap: 12px 24px;
  margin: 0;
  min-width: 0;
}
.buyer-recharge-result-row dt {
  color: #86909c;
}
.buyer-recharge-result-row dd {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}
.buyer-order-contact.buyer-recharge-block.is-inline {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 120px), 1fr));
}
.buyer-recharge-block > h3 {
  grid-column: 1 / -1;
}
.recharge-history summary {
  cursor: pointer;
  color: #4e5969;
}
@media (max-width: 800px) {
  .recharge-publish-page .card-publish-row.fk-form-item {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 600px) {
  .recharge-field-row.fk-form-item {
    grid-template-columns: 80px minmax(0, 1fr);
    gap: 8px;
  }
}
@media (max-width: 760px) {
  .buyer-order-contact.buyer-recharge-block {
    margin-bottom: 0;
  }
  .recharge-purchase-details,
  .recharge-purchase-details.has-target-options {
    gap: 0;
    padding-bottom: 20px;
    border-bottom: 1px solid #eef0f4;
  }
  .purchase-dialog .recharge-purchase-details > .purchase-coupon-row {
    min-height: 50px;
  }
  .recharge-purchase-details .recharge-field-row.fk-form-item {
    height: auto;
    min-height: 34px;
    align-items: center;
    padding: 0;
    border: 0;
  }
  .recharge-purchase-details .recharge-field-row > label {
    padding-top: 0;
    text-align: left;
  }
  .recharge-purchase-details > .recharge-field-row,
  .recharge-purchase-fields > div + div {
    margin-top: 8px;
  }
  .recharge-purchase-details.has-target-options
    .recharge-field-row.fk-form-item {
    min-height: 32px;
    padding: 0;
  }
  .has-target-options > .recharge-field-row,
  .has-target-options .recharge-purchase-fields > div + div {
    margin-top: 6px;
  }
  .recharge-purchase-details
    .recharge-linked-row
    .recharge-field-row.fk-form-item {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }
}
