/* 电脑端：放宽画布、增大字号与间距（手机样式不变） */

@media (min-width: 481px) {
  :root {
    --page-max: 580px;
    --portal-max: 580px;
  }
}

@media (min-width: 768px) {
  :root {
    --page-max: 820px;
    --portal-max: 820px;
    --radius: 18px;
    --radius-sm: 14px;
  }

  body {
    font-size: 16px;
    padding: 32px 24px 56px;
  }

  body.shuoming-page {
    padding: 0 20px 32px;
  }

  .app-viewport {
    border-radius: 24px;
  }

  .page {
    padding: 22px 20px 44px;
  }

  .hero {
    gap: 18px;
    padding: 12px 8px 24px;
  }

  .hero__avatar {
    width: 88px;
    height: 88px;
    border-radius: 18px;
  }

  .hero__badge {
    font-size: 13px;
    padding: 5px 12px;
    margin-bottom: 8px;
  }

  .hero__title {
    font-size: 20px;
  }

  .hero__sub {
    font-size: 15px;
  }

  .hero__wx {
    font-size: 14px;
  }

  .quick {
    padding: 22px 20px 16px;
  }

  .quick__link {
    font-size: 17px;
  }

  .quick__poster {
    font-size: 16px;
    padding: 10px 24px;
  }

  .quick__clock {
    font-size: 14px;
    margin-bottom: 14px;
  }

  .quick__kf {
    padding: 14px 20px;
    font-size: 16px;
  }

  .quick__kf-icon {
    width: 38px;
    height: 38px;
    font-size: 18px;
  }

  .tabs {
    padding: 14px 12px;
    gap: 8px;
  }

  .tab-btn {
    max-width: 96px;
  }

  .tab-btn__icon {
    width: 62px;
    height: 62px;
  }

  .tab-btn__label {
    font-size: 13px;
  }

  .perm-bar {
    font-size: 16px;
    padding: 12px 18px;
  }

  .cmd-panel {
    padding: 12px 14px 18px;
    margin: 0 14px;
  }

  .cmd-head__col {
    font-size: 14px;
    padding: 10px 8px;
  }

  .cmd-key {
    font-size: 15px;
    padding: 14px 10px;
  }

  .cmd-desc {
    font-size: 15px;
    padding: 14px 16px;
  }

  .cmd-key__badge {
    width: 36px;
    height: 36px;
    font-size: 18px;
  }

  .tips-line {
    font-size: 14px;
    padding: 10px 12px;
  }

  .site-footer {
    padding: 20px;
  }

  .site-footer p {
    font-size: 13px;
  }

  body.home.blog > .site-footer p {
    font-size: 12px;
  }

  .portal-back {
    padding: 14px 24px !important;
  }

  .portal-back a,
  .portal-back span {
    font-size: 16px !important;
  }

  .welcome-box {
    max-width: min(440px, calc(var(--page-max) - 48px));
    padding: 32px 28px;
  }

  .welcome-box h2 {
    font-size: 20px;
  }

  .welcome-box p {
    font-size: 15px;
  }

  .site-modal-box {
    max-width: min(500px, calc(var(--page-max) - 32px));
  }

  .site-modal-head h3 {
    font-size: 18px;
  }

  .site-modal-tip,
  .site-modal-wxid {
    font-size: 15px;
  }

  /* 首页门户 */
  .portal-top {
    padding: 18px 20px 0;
  }

  .portal-hero {
    padding: 16px 18px 20px;
    gap: 18px;
    border-radius: 20px;
  }

  .portal-hero__avatar {
    width: 88px;
    height: 88px;
  }

  .portal-hero__badge {
    font-size: 13px;
    padding: 5px 12px;
  }

  .portal-hero__title {
    font-size: 22px;
  }

  .portal-hero__sub {
    font-size: 15px;
  }

  .portal-nav {
    margin: 14px 0 18px;
    padding: 6px;
    border-radius: 16px;
  }

  .portal-nav__item {
    min-width: 88px;
    padding: 12px 18px;
    font-size: 16px;
    border-radius: 12px;
  }

  .portal-main {
    padding: 0 20px 32px;
  }

  .portal-main .m-newslist li {
    padding: 20px !important;
    margin-bottom: 16px;
    border-radius: 16px;
  }

  .portal-main .m-newslist .intro-box .tit {
    font-size: 18px;
  }

  /* 宝宝指令内容区 */
  .baobao-body .list.with-divider.compact {
    padding: 0 18px 18px;
    gap: 12px;
  }

  .baobao-body .item > .title {
    font-size: 15px;
    padding: 14px 10px;
  }

  .baobao-body .item-super .label.primary {
    font-size: 14px;
    padding: 5px 14px;
  }

  .baobao-body .item-super .item-desc {
    font-size: 15px;
    padding: 14px 12px;
  }

  .baobao-body .item-super > .label.blue.rounded {
    font-size: 14px;
    padding: 5px 16px;
  }

  .baobao-body .label {
    font-size: 12px;
    padding: 3px 10px;
  }

  .baobao-body .baobao-notes {
    font-size: 14px;
    padding: 16px;
    margin: 0 18px 18px;
  }

  /* 使用说明 */
  html.shuoming-page {
    font-size: 13px;
  }

  body.shuoming-page {
    max-width: var(--portal-max);
    margin: 0 auto;
    padding: 0 20px 32px;
    box-shadow: 0 0 0 1px rgba(255, 107, 157, 0.12), 0 24px 64px rgba(255, 107, 157, 0.15);
    border-radius: 0 0 24px 24px;
    background: #fff;
  }

  body.shuoming-page .imgBox img {
    height: 320px;
    padding-top: 20px;
  }
}

@media (min-width: 1200px) {
  :root {
    --page-max: 980px;
    --portal-max: 980px;
  }

  body {
    font-size: 17px;
    padding: 40px 32px 64px;
  }

  body.shuoming-page {
    padding: 0 24px 40px;
  }

  .hero__avatar {
    width: 96px;
    height: 96px;
  }

  .hero__title {
    font-size: 22px;
  }

  .hero__sub {
    font-size: 16px;
  }

  .quick__kf {
    font-size: 17px;
    padding: 16px 24px;
  }

  .tab-btn__icon {
    width: 68px;
    height: 68px;
  }

  .tab-btn__label {
    font-size: 14px;
  }

  .perm-bar {
    font-size: 17px;
  }

  .cmd-head__col {
    font-size: 15px;
  }

  .cmd-key,
  .cmd-desc {
    font-size: 16px;
  }

  .portal-hero__avatar {
    width: 96px;
    height: 96px;
  }

  .portal-hero__title {
    font-size: 24px;
  }

  .portal-nav__item {
    font-size: 17px;
    padding: 14px 22px;
  }

  html.shuoming-page {
    font-size: 14px;
  }

  body.shuoming-page .imgBox img {
    height: 380px;
  }
}