@charset "utf-8";
/* ============================================
 * shared.css - PC/Mobile 公共样式
 * 提取 PC.css 和 mobile.css 中的重复代码
 * Phase 1 创建，Phase 4 填充
 * 2026-07-29
 * ============================================ */

/* === 布局工具类 === */
.l-clearfix::after {
  content: "";
  display: table;
  clear: both;
}

.l-hidden {
  display: none !important;
}

.l-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* === 文本工具类 === */
.u-text-left { text-align: left; }
.u-text-center { text-align: center; }
.u-text-right { text-align: right; }
.u-text-nowrap { white-space: nowrap; }
.u-text-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* === 浮动工具类 === */
.u-float-left { float: left; }
.u-float-right { float: right; }
.u-clear-both { clear: both; }

/* === 显示工具类 === */
.u-block { display: block; }
.u-inline { display: inline; }
.u-inline-block { display: inline-block; }
.u-flex { display: flex; }
.u-grid { display: grid; }

/* === 通用容器 === */
.l-container {
  width: var(--container-width, 1200px);
  margin-left: auto;
  margin-right: auto;
}

/* === 辅助状态 === */
.is-hidden { display: none; }
.is-invisible { visibility: hidden; }
.is-disabled { opacity: 0.5; pointer-events: none; }

/* === 通用过渡 === */
.u-transition {
  transition: all var(--transition);
}

/* === 占位 === */
/* Phase 2-3 将提取 PC.css/mobile.css 的公共规则填充至此 */


/* === Phase 2: Extracted from inline styles === */

.u-pattern-2 {
  margin-top:20px
  }

.u-pattern-3 {
  font-size:21px
  }

.u-pattern-4 {
  background-color:#666
  }

.u-pattern-6 {
  font-weight:bold;
  color:#f98d8d
  }

.u-pattern-8 {
  font-weight:bold;
  color:#d538b6eb
  }

.u-pattern-10 {
  width: 120px;
  display: contents
  }

.u-pattern-11 {
  z-index: 1000;
  
  top:1px
  }

.u-pattern-12 {
  padding:5px;
  background-color:#ddd;
  border-radius: var(--radius-lg)
  }

.u-pattern-13 {
  border:none;
  padding:0px
  }

.u-clearfix {
  clear:both
  }

.u-pattern-15 {
  margin-top:0px
  }

.u-pattern-17 {
  background-color: #eb6060
  }

.u-pattern-18 {
  color:red
  }

.u-pattern-19 {
  height:380px
  }

.u-pattern-20 {
  background-color: #28b09e;
  font-size:21px
  }

.u-pattern-21 {
  margin:0px
  }

.u-hidden {
  display: none
  }

.u-pattern-23 {
  font-size: 51px
  }

.u-pattern-24 {
  width:50px;
  text-align: center
  }

.u-pattern-25 {
  width:100%
  }

.u-pattern-26 {
  margin-left: 700px
  }

.u-pattern-27 {
  max-width: 300px;
  border:1px solid #ddd
  }

.u-pattern-28 {
  display:none
  }

.u-pattern-29 {
  width: 1420px
  }

.u-pattern-30 {
  cursor: pointer
  }

.u-pattern-31 {
  border:0;
  margin-top:15px;
  cursor:pointer
  }

.u-pattern-32 {
  text-align: center;
  
  font-size: 10px
  }

.u-pattern-34 {
  height:400px
  }

.u-pattern-35 {
  color:#ff9800;
  font-weight:bold
  }

.u-pattern-37 {
  border: none
  }

.u-pattern-38 {
  width:160px
  }


/* === Phase 3: Mobile inline style extraction === */

.u-m-pattern-1 {
  background-color:#666;
  padding:0px
  }

.u-m-pattern-3 {
  position:relative
  }

.u-m-pattern-4 {
  margin-bottom:-3px
  }

.u-m-pattern-5 {
  width:50%;
  text-align: center;
  float:left
  }

.u-m-pattern-6 {
  width:50px;
  text-align: center
  }

.u-m-pattern-7 {
  margin-top: 0px
  }

.u-m-pattern-10 {
  font-size:16px
  }

.u-m-pattern-11 {
  margin-top: 50px
  }

.u-m-pattern-12 {
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh
  }

.u-m-pattern-13 {
  width:80%;
  background:#FF4040
  }

.u-m-pattern-14 {
  width:80%;
  background:#0e7ee0
  }

.u-m-pattern-16 {
  width: 100%;
  height: 50px;
  line-height: 50px;
  background-color: #e38d2c;
  color: #fff;
  font-size: 17px;
  text-align: center;
  margin-top: 30px
  }

.u-m-pattern-17 {
  width:100%;
  font-size:12px;
  padding:5px;
  background-color:#ff4040;
  color:#fff;
  border:1px solid #ddd
  }

.u-m-pattern-19 {
  color:red
  }

.u-m-pattern-20 {
  margin-top:20px
  }

.u-m-pattern-21 {
  height: 1.5rem
  }

.u-m-pattern-22 {
  z-index: 1000
  }

.u-m-pattern-23 {
  max-width: 260px;
  border:1px solid #ddd
  }

.u-m-pattern-25 {
  width:100%
  }

.u-m-pattern-26 {
  text-align: right
  }

.u-m-pattern-27 {
  display: none
  }
