/* ═══════════════════════════════════════════════════════════
   我们的客厅 · 共居社区小程序原型
   设计基调：暖色系（陶土 / 米色 / 橄榄绿）· 社区感 · 生活方式导向
   ═══════════════════════════════════════════════════════════ */

:root{
  /* —— 主色 —— */
  --terracotta:      #C4653F;
  --terracotta-dk:   #A44E2C;
  --terracotta-soft: #E08A62;
  --terracotta-tint: #FBEDE5;

  --olive:      #55663F;
  --olive-dk:   #38452A;
  --olive-soft: #7E9061;
  --olive-tint: #EDF0E3;

  --gold:      #D9A441;
  --gold-tint: #FBF2DF;

  --rose:      #B05E6B;
  --rose-tint: #FAEEEF;

  --teal:      #3E5C55;
  --teal-tint: #EAF0EE;

  /* —— 中性 —— */
  --cream:  #FAF6EF;
  --sand:   #F2E9DC;
  --sand-2: #E9DCC9;
  --line:   #E4D8C6;
  --line-2: #D6C6AE;
  --ink:    #241F1B;
  --ink-2:  #4A4038;
  --muted:  #8A7C6D;
  --muted-2:#A99B8B;
  --white:  #FFFFFF;

  /* —— 语义 —— */
  --ok:    #4F7A4A;
  --ok-t:  #EAF2E7;
  --warn:  #C08A22;
  --warn-t:#FBF1DC;
  --danger:#B4463C;
  --danger-t:#FAEBE9;
  --info:  #4A6E85;
  --info-t:#EAF1F5;

  /* —— 字体 —— */
  --font-display:"Songti SC","STSong","Noto Serif SC",Georgia,"Times New Roman","SimSun",serif;
  --font-body:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Segoe UI",Roboto,"Helvetica Neue",sans-serif;
  --font-num:"SF Mono","JetBrains Mono","DejaVu Sans Mono",Consolas,monospace;

  /* —— 尺寸 —— */
  --r-sm:8px; --r-md:12px; --r-lg:18px; --r-xl:24px; --r-full:999px;

  --sh-1:0 1px 2px rgba(60,42,28,.06), 0 2px 8px rgba(60,42,28,.05);
  --sh-2:0 2px 6px rgba(60,42,28,.07), 0 10px 26px rgba(60,42,28,.08);
  --sh-3:0 12px 40px rgba(60,42,28,.14), 0 3px 10px rgba(60,42,28,.07);
}

*,*::before,*::after{box-sizing:border-box;}
html,body{height:100%;}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:
    radial-gradient(1200px 620px at 12% -8%, #FBF0E2 0%, transparent 62%),
    radial-gradient(900px 520px at 92% 4%, #F0F1E4 0%, transparent 58%),
    linear-gradient(180deg,#FBF7F0 0%, #F5EFE5 58%, #F2EBE0 100%);
  background-attachment:fixed;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;padding:0;}
input,textarea,select{font-family:inherit;font-size:inherit;color:inherit;}
h1,h2,h3,h4,p,ul,ol{margin:0;padding:0;}
ul,ol{list-style:none;}
svg{display:block;width:1em;height:1em;flex:0 0 auto;}
[hidden]{display:none !important;}

/* 行内图标尺寸（未显式指定大小时随字号缩放） */
.i18{width:17px;height:17px;}
.i13{width:13px;height:13px;}
.i11{width:11px;height:11px;}
.statusbar-icons svg{width:auto;height:11px;}
.nav-back svg{width:20px;height:20px;}

/* ═══════════ 顶部控制条 ═══════════ */
.topbar{
  position:sticky; top:0; z-index:60;
  display:flex; align-items:center; gap:28px;
  padding:14px 30px;
  background:rgba(251,247,240,.82);
  backdrop-filter:blur(18px) saturate(1.4);
  -webkit-backdrop-filter:blur(18px) saturate(1.4);
  border-bottom:1px solid rgba(212,196,172,.55);
}
.brand{display:flex; align-items:center; gap:12px; flex:0 0 auto;}
.brand-mark{
  width:40px;height:40px;border-radius:13px;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--terracotta) 0%, var(--terracotta-dk) 100%);
  color:#FDF3EC; box-shadow:0 6px 16px rgba(164,78,44,.32);
}
.brand-mark svg{width:22px;height:22px;}
.brand-mark--sm{width:30px;height:30px;border-radius:10px;}
.brand-mark--sm svg{width:17px;height:17px;}
.brand-text b{display:block;font-size:16.5px;letter-spacing:.4px;font-weight:700;}
.brand-text i{display:block;font-style:normal;font-size:11.5px;color:var(--muted);letter-spacing:.3px;margin-top:1px;}

.role-switch{
  display:flex; gap:4px; padding:4px;
  background:rgba(233,220,201,.5);
  border:1px solid rgba(212,196,172,.6);
  border-radius:var(--r-full);
}
.role-btn{
  padding:9px 22px; border-radius:var(--r-full);
  font-size:13.5px; font-weight:600; color:var(--ink-2);
  letter-spacing:.2px; transition:all .22s cubic-bezier(.4,0,.2,1);
  white-space:nowrap;
}
.role-btn:hover{color:var(--terracotta-dk);}
.role-btn.is-active{
  background:var(--white); color:var(--terracotta-dk);
  box-shadow:0 2px 8px rgba(60,42,28,.1);
}
.topbar-tools{margin-left:auto;display:flex;align-items:center;gap:16px;}

.switch{display:flex;align-items:center;gap:9px;cursor:pointer;user-select:none;}
.switch input{position:absolute;opacity:0;width:0;height:0;}
.switch-track{
  width:38px;height:22px;border-radius:var(--r-full);
  background:var(--sand-2); position:relative; transition:background .2s;
  flex:0 0 auto;
}
.switch-thumb{
  position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;
  background:var(--white); box-shadow:0 1px 3px rgba(0,0,0,.18);
  transition:transform .22s cubic-bezier(.4,0,.2,1);
}
.switch input:checked + .switch-track{background:var(--olive);}
.switch input:checked + .switch-track .switch-thumb{transform:translateX(16px);}
.switch-label{font-size:12.5px;color:var(--ink-2);font-weight:600;white-space:nowrap;}

/* ═══════════ 舞台 ═══════════ */
.stage{padding:26px 30px 60px;}
.view{display:none;}
.view.is-active{display:block;}

/* ─────── 用户端 ─────── */
.view-user.is-active{
  display:grid; grid-template-columns:minmax(220px,1fr) auto minmax(200px,1fr);
  gap:44px; align-items:center; max-width:1360px; margin:0 auto;
}
.stage-side{max-width:330px;}
.stage-side--right{justify-self:end;width:100%;}
.side-kicker{
  font-size:11px;letter-spacing:2.4px;text-transform:uppercase;
  color:var(--terracotta); font-weight:700; margin-bottom:12px;
}
.side-title{
  font-family:var(--font-display); font-size:40px; line-height:1.22;
  letter-spacing:.5px; color:var(--ink); margin-bottom:16px;
}
.side-desc{font-size:14px;line-height:1.85;color:var(--muted);}
.side-list{margin-top:28px;display:flex;flex-direction:column;gap:2px;}
.side-list li{
  display:flex;gap:12px;align-items:flex-start;
  font-size:13px;line-height:1.6;color:var(--ink-2);
  padding:11px 0; border-bottom:1px dashed rgba(212,196,172,.7);
}
.side-list li span{
  font-family:var(--font-num);font-size:10.5px;font-weight:700;
  color:var(--terracotta); padding-top:2.5px; flex:0 0 auto;
}

/* 手机 */
.phone-wrap{display:flex;flex-direction:column;align-items:center;gap:14px;}
.phone{
  width:414px; height:868px; padding:12px;
  border-radius:56px;
  background:linear-gradient(160deg,#2C2723 0%,#171412 46%,#332C26 100%);
  box-shadow:
    0 40px 90px -20px rgba(52,36,24,.44),
    0 12px 30px rgba(52,36,24,.16),
    inset 0 1px 1px rgba(255,255,255,.16);
  position:relative; flex:0 0 auto;
}
.phone::before,.phone::after{
  content:"";position:absolute;left:-2px;width:3px;border-radius:3px;background:#4A4038;
}
.phone::before{top:170px;height:34px;}
.phone::after{top:216px;height:62px;}
.phone-screen{
  width:100%;height:100%;border-radius:45px;overflow:hidden;
  background:var(--cream); position:relative;
  display:flex; flex-direction:column;
}
.phone-caption{font-size:11.5px;color:var(--muted-2);letter-spacing:.6px;}

.statusbar{
  height:46px;flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;
  padding:0 26px 0 32px; font-size:13.5px; font-weight:600; letter-spacing:.2px;
  position:relative; z-index:5; color:var(--ink);
}
.statusbar-icons{display:flex;align-items:center;gap:5px;}

.navbar{
  flex:0 0 auto;height:46px;display:grid;
  grid-template-columns:44px 1fr 44px;align-items:center;
  padding:0 8px; position:relative; z-index:20;
}
.nav-title{
  font-size:16.5px;font-weight:700;text-align:center;letter-spacing:.4px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.nav-back{
  width:36px;height:36px;border-radius:var(--r-full);display:grid;place-items:center;
  color:var(--ink-2); transition:background .18s;
}
.nav-back:hover{background:rgba(36,31,27,.06);}
.nav-extra{display:flex;justify-content:flex-end;align-items:center;}

.screen{
  flex:1 1 auto;overflow-y:auto;overflow-x:hidden;
  padding:0 0 20px; scroll-behavior:smooth;
  scrollbar-width:none;
}
.screen::-webkit-scrollbar{width:0;height:0;}
.screen.is-flush{padding-top:0;}

/* 小程序 Tab 栏 */
.tabbar{
  flex:0 0 auto;height:64px;display:grid;grid-template-columns:repeat(4,1fr);
  background:rgba(252,249,244,.94);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border-top:1px solid rgba(212,196,172,.6);
  padding-bottom:6px; position:relative; z-index:20;
}
.tab{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3.5px;
  color:var(--muted-2); font-size:10.5px; font-weight:600; letter-spacing:.3px;
  transition:color .18s; position:relative;
}
.tab svg{width:23px;height:23px;transition:transform .22s cubic-bezier(.34,1.56,.64,1);}
.tab.is-active{color:var(--terracotta);}
.tab.is-active svg{transform:translateY(-1.5px) scale(1.04);}
.tab:active svg{transform:scale(.9);}

/* ═══════════ 需求编号叠加 ═══════════ */
.spec-badge{
  display:none;
  font-family:var(--font-num); font-size:9.5px; font-weight:700; letter-spacing:.4px;
  color:var(--terracotta); background:var(--terracotta-tint);
  border:1px solid rgba(196,101,63,.35);
  padding:2px 6px; border-radius:5px; margin-left:8px;
  vertical-align:middle; white-space:nowrap; line-height:1.4;
}
body.spec-on .spec-badge{display:inline-block;}

.speclist{
  background:rgba(255,255,255,.66); border:1px solid rgba(212,196,172,.7);
  border-radius:var(--r-lg); padding:20px 20px 8px; backdrop-filter:blur(10px);
}
.speclist-title{
  font-size:11px;letter-spacing:2.2px;text-transform:uppercase;
  color:var(--olive); font-weight:700; margin-bottom:14px;
}
.speclist-body{max-height:520px;overflow-y:auto;padding-right:6px;}
.speclist-body::-webkit-scrollbar{width:4px;}
.speclist-body::-webkit-scrollbar-thumb{background:var(--sand-2);border-radius:4px;}
.sp-row{
  display:flex;align-items:center;gap:10px;padding:8px 0;
  border-bottom:1px dashed rgba(212,196,172,.6);font-size:12.5px;
}
.sp-row:last-child{border-bottom:0;}
.sp-row code{
  font-family:var(--font-num);font-size:10px;font-weight:700;
  color:var(--muted); background:var(--sand); padding:3px 6px;border-radius:5px;
  flex:0 0 auto; letter-spacing:.2px;
}
.sp-row .sp-label{color:var(--ink-2);flex:1;line-height:1.45;min-width:0;}
.sp-dot{width:7px;height:7px;border-radius:50%;flex:0 0 auto;}
.sp-dot.is-on{background:var(--ok);box-shadow:0 0 0 3px var(--ok-t);}
.sp-dot.is-off{background:var(--line-2);box-shadow:0 0 0 3px var(--sand);}
.sp-group{
  font-size:11px;font-weight:700;color:var(--terracotta);letter-spacing:.8px;
  padding:14px 0 4px;
}

/* ═══════════ 通用组件 ═══════════ */
.pad{padding:0 20px;}
.mt-8{margin-top:8px;} .mt-12{margin-top:12px;} .mt-16{margin-top:16px;}
.mt-20{margin-top:20px;} .mt-24{margin-top:24px;} .mt-28{margin-top:28px;}

.sec-head{
  display:flex;align-items:flex-end;justify-content:space-between;
  margin:26px 0 13px; gap:12px;
}
.sec-head h2{
  font-family:var(--font-display); font-size:21px; letter-spacing:.6px;
  font-weight:400; color:var(--ink); display:flex; align-items:center;
}
.sec-head p{font-size:11.5px;color:var(--muted-2);letter-spacing:.3px;margin-top:3px;}
.sec-more{
  font-size:12px;color:var(--terracotta);font-weight:600;
  display:flex;align-items:center;gap:3px;flex:0 0 auto;padding-bottom:2px;
}
.sec-more svg{width:13px;height:13px;}

/* 按钮 */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  height:44px;padding:0 22px;border-radius:var(--r-full);
  font-size:14.5px;font-weight:600;letter-spacing:.3px;
  transition:transform .14s, box-shadow .2s, background .2s, opacity .2s;
  white-space:nowrap;
}
.btn:active{transform:scale(.975);}
.btn--primary{background:var(--terracotta);color:#fff;box-shadow:0 6px 18px rgba(196,101,63,.32);}
.btn--primary:hover{background:var(--terracotta-dk);}
.btn--dark{background:var(--ink);color:var(--cream);}
.btn--dark:hover{background:#000;}
.btn--olive{background:var(--olive);color:#fff;box-shadow:0 6px 18px rgba(85,102,63,.28);}
.btn--olive:hover{background:var(--olive-dk);}
.btn--ghost{background:var(--white);color:var(--ink-2);border:1px solid var(--line);}
.btn--ghost:hover{border-color:var(--line-2);background:var(--cream);}
.btn--danger{background:var(--danger-t);color:var(--danger);border:1px solid rgba(180,70,60,.24);}
.btn--danger:hover{background:#F6DEDA;}
.btn--sm{height:34px;padding:0 15px;font-size:12.5px;}
.btn--xs{height:29px;padding:0 12px;font-size:11.5px;gap:4px;border-radius:var(--r-sm);}
.btn--block{width:100%;}
.btn[disabled],.btn.is-disabled{opacity:.42;pointer-events:none;}

/* 标签 */
.pill{
  display:inline-flex;align-items:center;gap:4px;
  height:22px;padding:0 9px;border-radius:var(--r-full);
  font-size:10.5px;font-weight:700;letter-spacing:.4px;
}
.pill--terra{background:var(--terracotta-tint);color:var(--terracotta-dk);}
.pill--olive{background:var(--olive-tint);color:var(--olive-dk);}
.pill--gold{background:var(--gold-tint);color:#8E6414;}
.pill--rose{background:var(--rose-tint);color:var(--rose);}
.pill--teal{background:var(--teal-tint);color:var(--teal);}
.pill--sand{background:var(--sand);color:var(--muted);}
.pill--ok{background:var(--ok-t);color:var(--ok);}
.pill--warn{background:var(--warn-t);color:var(--warn);}
.pill--danger{background:var(--danger-t);color:var(--danger);}
.pill--info{background:var(--info-t);color:var(--info);}
.pill--solid{background:var(--ink);color:var(--cream);}

/* 卡片 */
.card{
  background:var(--white);border:1px solid var(--line);
  border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-1);
}
.card-pad{padding:16px;}

/* 图片 / 场景图 */
.scene{
  display:block;width:100%;height:100%;object-fit:cover;
  background:var(--sand);
}
.scene-box{position:relative;overflow:hidden;background:var(--sand);}
.scene-box::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 42%,rgba(36,31,27,.5) 100%);
  pointer-events:none;
}
.scene-box--flat::after{display:none;}

/* 空状态 */
.empty{
  text-align:center;padding:52px 24px;color:var(--muted-2);
}
.empty svg{width:52px;height:52px;margin:0 auto 14px;color:var(--line-2);}
.empty p{font-size:13.5px;line-height:1.7;}

/* ═══════════ 首页 ═══════════ */
.hero{position:relative;height:290px;margin:0 0 0;overflow:hidden;}
.hero-scene{position:absolute;inset:0;}
.hero-scene img{width:100%;height:100%;object-fit:cover;}
.hero-veil{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(30,24,18,.05) 0%,rgba(30,24,18,.28) 46%,rgba(30,24,18,.78) 100%);
}
.hero-inner{
  position:absolute;left:0;right:0;bottom:0;padding:0 22px 24px;color:#FDF8F2;
}
.hero-tag{
  display:inline-flex;align-items:center;gap:6px;
  font-size:10.5px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;
  padding:5px 11px;border-radius:var(--r-full);
  background:rgba(253,248,242,.18);border:1px solid rgba(253,248,242,.36);
  backdrop-filter:blur(8px);margin-bottom:12px;
}
.hero-title{
  font-family:var(--font-display);font-size:31px;line-height:1.28;
  letter-spacing:.8px;text-shadow:0 2px 16px rgba(20,14,8,.4);
}
.hero-sub{font-size:12.5px;opacity:.86;margin-top:9px;letter-spacing:.4px;line-height:1.6;}

/* 社区数据条（信任建立） */
.stats{
  display:grid;grid-template-columns:repeat(3,1fr);
  margin:-26px 20px 0; position:relative; z-index:3;
  background:var(--white);border:1px solid var(--line);
  border-radius:var(--r-lg);box-shadow:var(--sh-2);overflow:hidden;
}
.stat{padding:15px 8px;text-align:center;position:relative;}
.stat + .stat::before{
  content:"";position:absolute;left:0;top:22%;height:56%;width:1px;background:var(--line);
}
.stat b{
  display:block;font-family:var(--font-display);font-size:25px;line-height:1;
  color:var(--terracotta);letter-spacing:.5px;
}
.stat b em{font-style:normal;font-size:12.5px;margin-left:2px;color:var(--terracotta-soft);}
.stat span{display:block;font-size:11px;color:var(--muted);margin-top:7px;letter-spacing:.5px;}

/* CTA 双入口 */
.cta-duo{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-top:16px;}
.cta-card{
  position:relative;height:112px;border-radius:var(--r-md);overflow:hidden;
  padding:16px;display:flex;flex-direction:column;justify-content:space-between;
  color:#FDF8F2;text-align:left;transition:transform .18s;
}
.cta-card:active{transform:scale(.975);}
.cta-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.cta-card::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(150deg,rgba(30,24,18,.34),rgba(30,24,18,.74));
}
.cta-card > *{position:relative;z-index:2;}
.cta-card b{font-family:var(--font-display);font-size:17px;letter-spacing:.8px;font-weight:400;}
.cta-card span{font-size:10.5px;opacity:.82;letter-spacing:.4px;line-height:1.5;}
.cta-card i{
  align-self:flex-start;font-style:normal;font-size:10.5px;font-weight:700;
  padding:4px 9px;border-radius:var(--r-full);
  background:rgba(253,248,242,.2);border:1px solid rgba(253,248,242,.34);
}

/* 横向滚动 */
.hscroll{
  display:flex;gap:12px;overflow-x:auto;padding:2px 20px 6px;
  scroll-snap-type:x mandatory;scrollbar-width:none;
}
.hscroll::-webkit-scrollbar{display:none;}
.hscroll > *{scroll-snap-align:start;flex:0 0 auto;}

/* 活动卡（横滑） */
.act-card{
  width:228px;background:var(--white);border:1px solid var(--line);
  border-radius:var(--r-md);overflow:hidden;box-shadow:var(--sh-1);
  text-align:left;transition:transform .18s, box-shadow .22s;
}
.act-card:hover{transform:translateY(-2px);box-shadow:var(--sh-2);}
.act-card:active{transform:scale(.98);}
.act-card .scene-box{height:120px;}
.act-card-body{padding:12px 13px 14px;}
.act-card-body h3{
  font-size:14.5px;font-weight:700;line-height:1.4;letter-spacing:.2px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  min-height:40px;
}
.act-meta{display:flex;flex-direction:column;gap:5px;margin-top:10px;}
.meta-row{
  display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--muted);
}
.meta-row svg{width:13px;height:13px;flex:0 0 auto;color:var(--muted-2);}
.meta-row b{color:var(--ink-2);font-weight:600;}

/* 房间卡（横滑 / 列表通用） */
.room-card{
  width:246px;background:var(--white);border:1px solid var(--line);
  border-radius:var(--r-md);overflow:hidden;box-shadow:var(--sh-1);
  text-align:left;transition:transform .18s, box-shadow .22s;
}
.room-card:hover{transform:translateY(-2px);box-shadow:var(--sh-2);}
.room-card:active{transform:scale(.98);}
.room-card .scene-box{height:150px;}
.room-card-body{padding:13px 14px 15px;}
.room-name{
  font-size:15px;font-weight:700;letter-spacing:.3px;
  display:flex;align-items:center;gap:7px;
}
.room-name .spec-badge{margin-left:auto;}
.room-sub{font-size:11.5px;color:var(--muted);margin-top:6px;letter-spacing:.2px;}
.room-foot{
  display:flex;align-items:baseline;justify-content:space-between;
  margin-top:12px;padding-top:11px;border-top:1px dashed var(--line);
}
.price{
  font-family:var(--font-display);font-size:20px;color:var(--terracotta);letter-spacing:.3px;
}
.price em{font-style:normal;font-size:11px;color:var(--muted);margin-left:2px;font-family:var(--font-body);}
.avail{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--ok);font-weight:600;}
.avail i{
  width:7px;height:7px;border-radius:50%;background:var(--ok);
  box-shadow:0 0 0 0 rgba(79,122,74,.5);animation:pulse 2s infinite;
}
.avail.is-off{color:var(--muted-2);}
.avail.is-off i{background:var(--line-2);animation:none;}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(79,122,74,.42);}
  70%{box-shadow:0 0 0 7px rgba(79,122,74,0);}
  100%{box-shadow:0 0 0 0 rgba(79,122,74,0);}
}

/* 活动回顾 */
.review-row{display:grid;grid-template-columns:1fr 1fr;gap:11px;}
.review-card{
  position:relative;height:126px;border-radius:var(--r-md);overflow:hidden;
  text-align:left;transition:transform .18s;
}
.review-card:active{transform:scale(.98);}
.review-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.review-card::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 34%,rgba(30,24,18,.8));
}
.review-info{position:absolute;left:0;right:0;bottom:0;padding:12px;color:#FDF8F2;z-index:2;}
.review-info b{display:block;font-size:13.5px;line-height:1.4;letter-spacing:.3px;}
.review-info span{
  display:flex;align-items:center;gap:4px;font-size:10.5px;opacity:.8;margin-top:5px;
}
.review-info svg{width:12px;height:12px;}

/* ═══════════ 筛选器 ═══════════ */
.filterbar{
  position:sticky;top:0;z-index:15;
  background:rgba(250,246,239,.94);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);
  padding:12px 20px 11px;
}
.chip-row{
  display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px;
}
.chip-row::-webkit-scrollbar{display:none;}
.chip{
  flex:0 0 auto;height:30px;padding:0 14px;border-radius:var(--r-full);
  font-size:12.5px;font-weight:600;color:var(--ink-2);letter-spacing:.2px;
  background:var(--white);border:1px solid var(--line);
  display:inline-flex;align-items:center;gap:5px;
  transition:all .18s;
}
.chip:hover{border-color:var(--line-2);}
.chip.is-active{
  background:var(--ink);border-color:var(--ink);color:var(--cream);
}
.chip.is-active svg{color:var(--cream);}
.chip svg{width:12px;height:12px;color:var(--muted);}
.chip .chev{width:9px;height:9px;}

.filter-summary{
  display:flex;align-items:center;justify-content:space-between;
  margin-top:10px;font-size:11.5px;color:var(--muted);letter-spacing:.2px;
}
.filter-summary b{color:var(--terracotta);font-weight:700;}

/* 活动列表行 */
.act-row{
  display:flex;gap:13px;padding:14px 0;
  border-bottom:1px solid rgba(228,216,198,.7);
  text-align:left;width:100%;transition:opacity .18s;
}
.act-row:active{opacity:.62;}
.act-row .scene-box{
  width:98px;height:98px;border-radius:var(--r-md);flex:0 0 auto;
}
.act-row .scene-box::after{display:none;}
.act-row-body{flex:1;min-width:0;display:flex;flex-direction:column;}
.act-row-body h3{
  font-size:15px;font-weight:700;line-height:1.4;letter-spacing:.2px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.act-row-tags{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap;}
.act-row-foot{
  margin-top:auto;padding-top:9px;display:flex;align-items:center;justify-content:space-between;
  gap:8px;
}
.seats{font-size:11.5px;color:var(--muted);display:flex;align-items:center;gap:5px;}
.seats b{color:var(--terracotta);font-family:var(--font-num);font-weight:700;}
.seats.is-full b{color:var(--danger);}
.mini-bar{
  width:52px;height:4px;border-radius:3px;background:var(--sand-2);overflow:hidden;
}
.mini-bar i{display:block;height:100%;background:var(--terracotta);border-radius:3px;}

/* ═══════════ 详情页 ═══════════ */
.gallery{position:relative;height:260px;background:var(--sand);}
.gallery-track{display:flex;height:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;}
.gallery-track::-webkit-scrollbar{display:none;}
.gallery-track > *{flex:0 0 100%;scroll-snap-align:center;}
.gallery-track img{width:100%;height:100%;object-fit:cover;}
.gallery-dots{
  position:absolute;bottom:14px;left:0;right:0;
  display:flex;justify-content:center;gap:6px;
}
.gdot{width:6px;height:6px;border-radius:50%;background:rgba(253,248,242,.5);transition:all .22s;}
.gdot.is-on{background:#FDF8F2;width:18px;border-radius:3px;}
.gallery-count{
  position:absolute;top:14px;right:16px;
  font-family:var(--font-num);font-size:11px;font-weight:700;
  padding:4px 9px;border-radius:var(--r-full);
  background:rgba(30,24,18,.5);color:#FDF8F2;backdrop-filter:blur(6px);
  letter-spacing:.5px;
}
.play-badge{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:58px;height:58px;border-radius:50%;display:grid;place-items:center;
  background:rgba(253,248,242,.9);color:var(--ink);
  box-shadow:0 6px 22px rgba(20,14,8,.3);
}
.play-badge svg{width:22px;height:22px;margin-left:3px;}

.detail-body{padding:20px;}
.detail-title{
  font-family:var(--font-display);font-size:26px;line-height:1.34;
  letter-spacing:.6px;color:var(--ink);
}
.detail-title-row{display:flex;align-items:flex-start;gap:10px;}
.detail-title-row .detail-title{flex:1;}
.share-btns{display:flex;gap:4px;flex:0 0 auto;padding-top:5px;}
.icon-btn{
  width:34px;height:34px;border-radius:var(--r-full);display:grid;place-items:center;
  color:var(--muted);transition:all .18s;
}
.icon-btn:hover{background:var(--sand);color:var(--terracotta);}
.icon-btn.is-on{color:var(--terracotta);}
.icon-btn svg{width:19px;height:19px;}

.detail-lead{
  font-size:13.5px;line-height:1.85;color:var(--ink-2);margin-top:14px;
}

.info-grid{
  display:grid;gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;margin-top:18px;
}
.info-row{
  display:flex;gap:14px;padding:13px 15px;background:var(--white);align-items:flex-start;
}
.info-row > svg{width:17px;height:17px;color:var(--terracotta);flex:0 0 auto;margin-top:2px;}
.info-row-k{font-size:12px;color:var(--muted);width:56px;flex:0 0 auto;letter-spacing:.3px;}
.info-row-v{font-size:13.5px;color:var(--ink);flex:1;line-height:1.6;font-weight:500;}
.info-row-v small{display:block;font-size:11.5px;color:var(--muted);font-weight:400;margin-top:3px;}

.blk-title{
  font-size:14.5px;font-weight:700;letter-spacing:.4px;
  display:flex;align-items:center;gap:8px;margin-bottom:13px;
}
.blk-title::before{
  content:"";width:3px;height:15px;border-radius:2px;background:var(--terracotta);
}
.blk-title .spec-badge{margin-left:0;}

/* 设施 */
.facility-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;}
.facility{
  display:flex;flex-direction:column;align-items:center;gap:7px;
  padding:13px 4px;background:var(--sand);border-radius:var(--r-sm);
  font-size:10.5px;color:var(--ink-2);letter-spacing:.2px;text-align:center;
}
.facility svg{width:20px;height:20px;color:var(--olive);}

/* 房间住户评价 */
.rating-hero{
  display:flex;align-items:center;gap:16px;padding:16px;
  background:var(--gold-tint);border-radius:var(--r-md);
}
.rating-score{
  font-family:var(--font-display);font-size:38px;line-height:1;color:#8E6414;flex:0 0 auto;
}
.rating-meta{flex:1;}
.stars{display:flex;gap:2px;margin-bottom:5px;}
.stars svg{width:13px;height:13px;} /* 颜色由每颗星的包裹层决定，见 stars() */
.rating-meta p{font-size:11.5px;color:#8E6414;opacity:.85;line-height:1.5;}
.review-item{padding:14px 0;border-bottom:1px dashed var(--line);}
.review-item:last-child{border-bottom:0;padding-bottom:0;}
.review-head{display:flex;align-items:center;gap:9px;margin-bottom:9px;}
.review-head b{font-size:13px;font-weight:700;}
/* 同样用专属类，避免命中头像与星级 */
.review-head .rv-date{font-size:10.5px;color:var(--muted-2);margin-left:auto;font-family:var(--font-num);}
.review-item p{font-size:12.5px;line-height:1.75;color:var(--ink-2);}

/* 底部固定 CTA */
.sticky-cta{
  position:absolute;left:0;right:0;bottom:64px;z-index:30;
  padding:12px 18px calc(12px + env(safe-area-inset-bottom));
  background:rgba(252,249,244,.94);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border-top:1px solid rgba(212,196,172,.7);
  display:flex;align-items:center;gap:13px;
  box-shadow:0 -6px 24px rgba(60,42,28,.07);
  transform:translateY(120%);transition:transform .3s cubic-bezier(.4,0,.2,1);
}
.sticky-cta.is-show{transform:translateY(0);}
/* 非 Tab 页隐藏底部导航时，CTA 贴到屏幕底部 */
.phone-screen.no-tabbar .tabbar{display:none;}
.phone-screen.no-tabbar .sticky-cta{bottom:0;}
.sticky-cta-info{flex:1;min-width:0;}
.sticky-cta-info .price{font-size:23px;}
.sticky-cta-info span{display:block;font-size:11px;color:var(--muted);margin-top:2px;}
.sticky-cta .btn{flex:0 0 auto;min-width:132px;}

/* 评论区 */
.comment{display:flex;gap:11px;padding:14px 0;border-bottom:1px dashed var(--line);}
.comment:last-child{border-bottom:0;}
.comment-body{flex:1;min-width:0;}
.comment-body .ch{display:flex;align-items:center;gap:8px;margin-bottom:6px;}
.comment-body .ch b{font-size:12.5px;font-weight:700;}
.comment-body .ch span{font-size:10.5px;color:var(--muted-2);margin-left:auto;font-family:var(--font-num);}
.comment-body p{font-size:12.5px;line-height:1.7;color:var(--ink-2);}
.comment-actions{display:flex;gap:14px;margin-top:9px;}
.comment-actions button{
  display:flex;align-items:center;gap:4px;font-size:11px;color:var(--muted-2);
  transition:color .18s;
}
.comment-actions button:hover{color:var(--terracotta);}
.comment-actions button.is-on{color:var(--terracotta);}
.comment-actions svg{width:13px;height:13px;}

.comment-input{
  display:flex;gap:9px;align-items:center;margin-top:14px;
}
.comment-input input{
  flex:1;height:38px;border-radius:var(--r-full);border:1px solid var(--line);
  background:var(--white);padding:0 15px;font-size:13px;outline:none;
  transition:border-color .18s;
}
.comment-input input:focus{border-color:var(--terracotta-soft);}

/* 头像 */
.avatar{
  width:42px;height:42px;border-radius:var(--r-full);flex:0 0 auto;
  display:grid;place-items:center;font-size:14px;font-weight:700;color:#fff;
  background:linear-gradient(145deg,var(--terracotta-soft),var(--terracotta-dk));
  letter-spacing:.5px;overflow:hidden;
}
.avatar--sm{width:30px;height:30px;font-size:11px;}
.avatar--xs{width:26px;height:26px;font-size:10px;}
.avatar--olive{background:linear-gradient(145deg,var(--olive-soft),var(--olive-dk));}
.avatar--gold{background:linear-gradient(145deg,#E3BC69,#B4832A);}
.avatar--teal{background:linear-gradient(145deg,#5C8078,#2E463F);}
.avatar--rose{background:linear-gradient(145deg,#C9808B,#8E4550);}
.avatar--muted{background:linear-gradient(145deg,#B6A896,#8A7C6D);}

/* ═══════════ 表单 ═══════════ */
.field{margin-bottom:16px;}
.field-label{
  display:flex;align-items:center;gap:6px;
  font-size:12.5px;font-weight:700;color:var(--ink-2);
  margin-bottom:8px;letter-spacing:.3px;
}
.field-label .req{color:var(--terracotta);}
.field-label small{margin-left:auto;font-size:10.5px;color:var(--muted-2);font-weight:400;}
.input,.textarea,.select{
  width:100%;border:1px solid var(--line);border-radius:var(--r-md);
  background:var(--white);padding:12px 14px;font-size:13.5px;outline:none;
  transition:border-color .18s, box-shadow .18s; color:var(--ink);
}
.input:focus,.textarea:focus,.select:focus{
  border-color:var(--terracotta-soft);box-shadow:0 0 0 3px rgba(196,101,63,.1);
}
.textarea{min-height:92px;resize:vertical;line-height:1.7;}
.select{
  appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A7C6D' stroke-width='2' stroke-linecap='round'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat:no-repeat;background-position:right 12px center;background-size:15px;
  padding-right:36px;
}
.input::placeholder,.textarea::placeholder{color:var(--muted-2);}

.upload-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;}
.upload-tile{
  aspect-ratio:1;border-radius:var(--r-md);border:1.5px dashed var(--line-2);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  color:var(--muted-2);font-size:10.5px;background:var(--sand);
  transition:all .18s;
}
.upload-tile:hover{border-color:var(--terracotta-soft);color:var(--terracotta);background:var(--terracotta-tint);}
.upload-tile svg{width:21px;height:21px;}
.upload-tile--filled{
  border-style:solid;border-color:var(--line);overflow:hidden;position:relative;padding:0;
  background:var(--sand);
}
.upload-tile--filled img{width:100%;height:100%;object-fit:cover;}
.upload-tile--filled .rm{
  position:absolute;top:5px;right:5px;width:19px;height:19px;border-radius:50%;
  background:rgba(30,24,18,.62);color:#fff;display:grid;place-items:center;
}
.upload-tile--filled .rm svg{width:11px;height:11px;}

/* 选择组 */
.opt-row{display:flex;gap:8px;flex-wrap:wrap;}
.opt{
  height:34px;padding:0 15px;border-radius:var(--r-full);
  font-size:12.5px;font-weight:600;color:var(--ink-2);
  border:1px solid var(--line);background:var(--white);transition:all .18s;
}
.opt:hover{border-color:var(--line-2);}
.opt.is-on{background:var(--terracotta-tint);border-color:var(--terracotta-soft);color:var(--terracotta-dk);}

/* ═══════════ 预约流程 ═══════════ */
.steps{
  display:flex;align-items:center;gap:0;padding:18px 22px 20px;
}
.step{display:flex;align-items:center;gap:8px;flex:0 0 auto;}
.step-num{
  width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
  font-family:var(--font-num);font-size:11.5px;font-weight:700;
  background:var(--sand);color:var(--muted-2);flex:0 0 auto;transition:all .25s;
}
.step-label{font-size:11.5px;color:var(--muted-2);font-weight:600;white-space:nowrap;}
.step.is-on .step-num{background:var(--terracotta);color:#fff;box-shadow:0 3px 10px rgba(196,101,63,.34);}
.step.is-on .step-label{color:var(--terracotta-dk);font-weight:700;}
.step.is-done .step-num{background:var(--olive);color:#fff;}
.step.is-done .step-label{color:var(--olive-dk);}
.step-line{flex:1;height:1.5px;background:var(--line);margin:0 8px;min-width:14px;}
.step-line.is-done{background:var(--olive);}

/* 日期选择 */
.date-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;}
.date-cell{
  aspect-ratio:.82;border-radius:var(--r-sm);border:1px solid var(--line);
  background:var(--white);display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:1px;transition:all .16s;
}
.date-cell b{font-family:var(--font-num);font-size:14px;font-weight:700;color:var(--ink);}
.date-cell span{font-size:9px;color:var(--muted-2);}
.date-cell:hover{border-color:var(--line-2);}
.date-cell.is-on{background:var(--terracotta);border-color:var(--terracotta);}
.date-cell.is-on b,.date-cell.is-on span{color:#fff;}
.date-cell:disabled{opacity:.32;pointer-events:none;text-decoration:line-through;}

.slot-row{display:flex;gap:8px;flex-wrap:wrap;}
.slot{
  height:36px;padding:0 17px;border-radius:var(--r-sm);
  font-size:12.5px;font-family:var(--font-num);font-weight:600;color:var(--ink-2);
  border:1px solid var(--line);background:var(--white);transition:all .16s;
}
.slot:hover{border-color:var(--line-2);}
.slot.is-on{background:var(--ink);border-color:var(--ink);color:var(--cream);}
.slot:disabled{opacity:.34;pointer-events:none;text-decoration:line-through;}

/* 费用明细 */
.bill{
  background:var(--sand);border-radius:var(--r-md);padding:15px 16px;
}
.bill-row{
  display:flex;align-items:center;justify-content:space-between;
  font-size:12.5px;color:var(--ink-2);padding:6px 0;
}
.bill-row span:last-child{font-family:var(--font-num);font-weight:600;}
.bill-row--total{
  border-top:1px dashed var(--line-2);margin-top:7px;padding-top:12px;
  font-size:13.5px;font-weight:700;color:var(--ink);
}
.bill-row--total span:last-child{
  font-family:var(--font-display);font-size:21px;color:var(--terracotta);
}

/* 支付 */
.pay-amount{text-align:center;padding:26px 0 22px;}
.pay-amount small{font-size:12px;color:var(--muted);letter-spacing:.5px;}
.pay-amount b{
  display:block;font-family:var(--font-display);font-size:46px;line-height:1;
  color:var(--ink);margin-top:12px;letter-spacing:1px;
}
.pay-amount b i{font-style:normal;font-size:22px;margin-right:3px;color:var(--muted);}
.pay-methods{display:flex;flex-direction:column;gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;}
.pay-method{
  display:flex;align-items:center;gap:12px;padding:15px;background:var(--white);
  width:100%;text-align:left;transition:background .16s;
}
.pay-method:hover{background:var(--cream);}
.pay-method-ic{
  width:32px;height:32px;border-radius:9px;display:grid;place-items:center;flex:0 0 auto;
  background:var(--ok-t);color:var(--ok);
}
.pay-method-ic svg{width:18px;height:18px;}
.pay-method b{display:block;font-size:13.5px;font-weight:600;}
.pay-method small{display:block;font-size:11px;color:var(--muted);margin-top:2px;}
.radio{
  width:19px;height:19px;border-radius:50%;border:1.5px solid var(--line-2);
  margin-left:auto;flex:0 0 auto;display:grid;place-items:center;transition:all .18s;
}
.pay-method.is-on .radio{border-color:var(--terracotta);background:var(--terracotta);}
.pay-method.is-on .radio::after{
  content:"";width:6px;height:6px;border-radius:50%;background:#fff;
}

/* 核销码 */
.ticket{
  background:var(--white);border-radius:var(--r-lg);overflow:hidden;
  border:1px solid var(--line);box-shadow:var(--sh-2);
}
.ticket-top{
  padding:24px 22px;text-align:center;
  background:linear-gradient(160deg,var(--terracotta) 0%,var(--terracotta-dk) 100%);
  color:#FDF3EC;
}
.ticket-top small{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;opacity:.82;}
.ticket-code{
  font-family:var(--font-num);font-size:29px;font-weight:700;letter-spacing:5px;
  margin-top:13px;word-break:break-all;
}
.ticket-qr{
  padding:22px;display:flex;flex-direction:column;align-items:center;
  background:var(--white);position:relative;
}
.ticket-qr::before{
  content:"";position:absolute;top:-8px;left:0;right:0;height:16px;
  background:radial-gradient(circle at 8px 8px, transparent 7px, var(--white) 7.5px) repeat-x;
  background-size:16px 16px;
}
.ticket-qr canvas{border-radius:var(--r-sm);}
.ticket-qr p{font-size:11.5px;color:var(--muted);margin-top:13px;letter-spacing:.4px;}
.ticket-info{padding:0 22px 22px;}

/* ═══════════ 我的 ═══════════ */
.profile-head{
  padding:22px 20px 26px;
  background:linear-gradient(160deg,#FBF0E2 0%,#F3E9DA 100%);
  border-bottom:1px solid var(--line);
  position:relative;overflow:hidden;
}
.profile-head::after{
  content:"";position:absolute;right:-44px;top:-54px;width:168px;height:168px;
  border-radius:50%;background:rgba(196,101,63,.08);
}
.profile-id{display:flex;align-items:center;gap:14px;position:relative;z-index:2;}
.profile-id .avatar{width:58px;height:58px;font-size:20px;box-shadow:var(--sh-2);}
.profile-name{flex:1;min-width:0;}
.profile-name b{font-size:18px;font-weight:700;letter-spacing:.4px;display:flex;align-items:center;gap:7px;}
.profile-name p{font-size:12px;color:var(--muted);margin-top:5px;letter-spacing:.2px;}
.role-tag{
  display:inline-flex;align-items:center;gap:4px;
  font-size:10px;font-weight:700;padding:3px 8px;border-radius:var(--r-full);
  background:var(--olive);color:#fff;letter-spacing:.4px;
}
.role-tag svg{width:11px;height:11px;}

.profile-stats{
  display:flex;gap:0;margin-top:20px;position:relative;z-index:2;
  background:rgba(255,255,255,.7);border-radius:var(--r-md);
  border:1px solid rgba(228,216,198,.9);overflow:hidden;
}
.pstat{flex:1;text-align:center;padding:13px 6px;position:relative;}
.pstat + .pstat::before{
  content:"";position:absolute;left:0;top:24%;height:52%;width:1px;background:var(--line);
}
.pstat b{display:block;font-family:var(--font-display);font-size:19px;color:var(--ink);}
.pstat span{display:block;font-size:10.5px;color:var(--muted);margin-top:5px;letter-spacing:.3px;}

.menu-card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  overflow:hidden;box-shadow:var(--sh-1);
}
.menu-item{
  display:flex;align-items:center;gap:13px;padding:15px 16px;width:100%;
  text-align:left;transition:background .16s;position:relative;
}
.menu-item + .menu-item::before{
  content:"";position:absolute;left:47px;right:0;top:0;height:1px;background:var(--line);
}
.menu-item:hover{background:var(--cream);}
.menu-ic{
  width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:0 0 auto;
}
.menu-ic svg{width:18px;height:18px;}
.menu-ic--terra{background:var(--terracotta-tint);color:var(--terracotta);}
.menu-ic--olive{background:var(--olive-tint);color:var(--olive);}
.menu-ic--gold{background:var(--gold-tint);color:#A87718;}
.menu-ic--teal{background:var(--teal-tint);color:var(--teal);}
.menu-ic--rose{background:var(--rose-tint);color:var(--rose);}
.menu-body{flex:1;min-width:0;}
.menu-body b{display:block;font-size:14px;font-weight:600;letter-spacing:.2px;}
.menu-body small{display:block;font-size:11px;color:var(--muted-2);margin-top:3px;}
.menu-item .chev{width:15px;height:15px;color:var(--line-2);flex:0 0 auto;}
.menu-count{
  font-family:var(--font-num);font-size:11px;font-weight:700;
  background:var(--terracotta);color:#fff;border-radius:var(--r-full);
  min-width:18px;height:18px;padding:0 5px;display:grid;place-items:center;
}

/* ═══════════ 订单 ═══════════ */
.order-card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  overflow:hidden;box-shadow:var(--sh-1);margin-bottom:13px;
}
.order-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:13px 16px;border-bottom:1px solid var(--line);gap:10px;
}
.order-no{
  font-family:var(--font-num);font-size:11px;color:var(--muted-2);letter-spacing:.3px;
}
.order-body{display:flex;gap:13px;padding:15px 16px;}
.order-body .scene-box{
  width:82px;height:82px;border-radius:var(--r-md);flex:0 0 auto;
}
.order-body .scene-box::after{display:none;}
.order-info{flex:1;min-width:0;}
.order-info h3{font-size:14.5px;font-weight:700;line-height:1.4;letter-spacing:.2px;}
.order-info .meta-row{margin-top:6px;}
.order-foot{
  padding:12px 16px;border-top:1px dashed var(--line);
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:rgba(250,246,239,.5);
}
.order-total{font-size:11.5px;color:var(--muted);}
.order-total b{
  font-family:var(--font-display);font-size:19px;color:var(--terracotta);
  margin-left:5px;letter-spacing:.3px;
}
.order-actions{display:flex;gap:8px;flex:0 0 auto;}

/* 订单 Tab */
.seg{
  display:flex;gap:2px;padding:4px;background:var(--sand);border-radius:var(--r-full);
  margin:0 20px 16px;
}
.seg-btn{
  flex:1;height:32px;border-radius:var(--r-full);font-size:12.5px;font-weight:600;
  color:var(--muted);transition:all .2s;white-space:nowrap;
}
.seg-btn.is-active{background:var(--white);color:var(--ink);box-shadow:0 1px 4px rgba(60,42,28,.1);}

/* ═══════════ 合同 ═══════════ */
.contract-doc{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);
  padding:24px 20px;font-size:12.5px;line-height:2;color:var(--ink-2);
}
.contract-doc h3{
  font-family:var(--font-display);font-size:18px;text-align:center;
  letter-spacing:2px;margin-bottom:6px;color:var(--ink);
}
.contract-doc .doc-sub{
  text-align:center;font-size:11px;color:var(--muted-2);
  padding-bottom:16px;margin-bottom:16px;border-bottom:1px solid var(--line);
  letter-spacing:.5px;
}
.contract-doc h4{
  font-size:13px;font-weight:700;color:var(--ink);margin:16px 0 7px;
}
.contract-doc p{margin-bottom:7px;text-align:justify;}
.contract-doc .doc-sign{
  display:flex;gap:30px;margin-top:26px;padding-top:18px;border-top:1px dashed var(--line);
}
.sign-box{flex:1;}
.sign-box small{font-size:10.5px;color:var(--muted-2);display:block;margin-bottom:7px;}
.sign-name{
  font-family:var(--font-display);font-size:19px;color:var(--terracotta);
  letter-spacing:2px;padding-bottom:5px;border-bottom:1px solid var(--line-2);
}
.sign-stamp{
  display:inline-flex;align-items:center;justify-content:center;
  width:78px;height:78px;border-radius:50%;border:2px solid rgba(180,70,60,.5);
  color:rgba(180,70,60,.72);font-size:11px;font-weight:700;letter-spacing:1px;
  transform:rotate(-11deg);text-align:center;line-height:1.3;padding:6px;
  font-family:var(--font-display);
}

/* ═══════════ 管理端 ═══════════ */
.browser{
  max-width:1420px;margin:0 auto;background:var(--white);
  border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-3);
  border:1px solid rgba(212,196,172,.7);
  height:calc(100vh - 148px);min-height:620px;
  display:flex;flex-direction:column;
}
.browser-bar{
  flex:0 0 auto;height:48px;display:flex;align-items:center;gap:8px;
  padding:0 16px;background:#F3EDE3;border-bottom:1px solid var(--line);
}
.dot{width:11px;height:11px;border-radius:50%;flex:0 0 auto;}
.dot-r{background:#E0685B;} .dot-y{background:#E3B04B;} .dot-g{background:#63B063;}
.browser-url{
  flex:1;max-width:440px;margin:0 auto;height:30px;border-radius:var(--r-sm);
  background:var(--white);border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;gap:6px;
  font-size:12px;color:var(--ink-2);letter-spacing:.2px;
}
.browser-url-sub{color:var(--muted-2);font-size:11px;}
.browser-actions{display:flex;align-items:center;gap:10px;}
.admin-me{
  display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--ink-2);
}

.admin-shell{flex:1;display:flex;min-height:0;}
.admin-side{
  width:196px;flex:0 0 auto;background:var(--cream);border-right:1px solid var(--line);
  display:flex;flex-direction:column;padding:16px 12px;
}
.admin-brand{
  display:flex;align-items:center;gap:9px;padding:0 6px 18px;
  font-size:14px;font-weight:700;letter-spacing:.4px;
}
.admin-nav{display:flex;flex-direction:column;gap:2px;flex:1;}
.anav{
  display:flex;align-items:center;gap:10px;height:38px;padding:0 11px;
  border-radius:var(--r-sm);font-size:13px;font-weight:600;color:var(--ink-2);
  transition:all .16s;text-align:left;position:relative;
}
.anav svg{width:17px;height:17px;flex:0 0 auto;color:var(--muted);transition:color .16s;}
.anav:hover{background:rgba(233,220,201,.6);}
.anav.is-active{background:var(--terracotta);color:#fff;box-shadow:0 4px 12px rgba(196,101,63,.26);}
.anav.is-active svg{color:#fff;}
.anav span{flex:1;}
.anav-badge{
  font-family:var(--font-num);font-size:10px;font-weight:700;font-style:normal;
  background:var(--danger);color:#fff;border-radius:var(--r-full);
  min-width:17px;height:17px;padding:0 5px;display:grid;place-items:center;
}
.anav.is-active .anav-badge{background:rgba(255,255,255,.28);}
.admin-side-foot{padding:10px 6px 0;border-top:1px solid var(--line);}
.admin-side-foot p{font-size:10.5px;color:var(--muted-2);line-height:1.6;}

.admin-main{flex:1;min-width:0;display:flex;flex-direction:column;background:#FCFAF6;}
.admin-head{
  flex:0 0 auto;padding:20px 26px 16px;border-bottom:1px solid var(--line);
  background:var(--white);
}
.admin-head h2{font-size:19px;font-weight:700;letter-spacing:.4px;}
.admin-head p{font-size:12px;color:var(--muted);margin-top:5px;}
.admin-body{flex:1;overflow-y:auto;padding:22px 26px 40px;}
.admin-body::-webkit-scrollbar{width:8px;}
.admin-body::-webkit-scrollbar-thumb{background:var(--sand-2);border-radius:8px;border:2px solid #FCFAF6;}

/* KPI */
.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.kpi{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);
  padding:17px 18px;box-shadow:var(--sh-1);position:relative;overflow:hidden;
}
/* 右上角装饰圆，避开底部的趋势标签 */
.kpi::after{
  content:"";position:absolute;right:-32px;top:-36px;width:96px;height:96px;
  border-radius:50%;background:var(--terracotta-tint);opacity:.55;
}
.kpi-ic{
  width:32px;height:32px;border-radius:9px;display:grid;place-items:center;
  margin-bottom:13px;position:relative;z-index:2;
}
.kpi-ic svg{width:17px;height:17px;}
.kpi b{
  display:block;font-family:var(--font-display);font-size:30px;line-height:1;
  letter-spacing:.5px;position:relative;z-index:2;
}
.kpi b em{font-style:normal;font-size:13px;margin-left:2px;color:var(--muted);font-family:var(--font-body);}
/* 用专属类而非 `.kpi span`，否则会连带命中 .kpi-trend 把徽标撑成整行 */
.kpi-label{display:block;font-size:11.5px;color:var(--muted);margin-top:8px;position:relative;z-index:2;}
.kpi-trend{
  display:inline-flex;align-items:center;gap:3px;font-size:10.5px;font-weight:700;
  margin-top:9px;padding:2px 7px;border-radius:var(--r-full);position:relative;z-index:2;
}
.kpi-trend.up{background:var(--ok-t);color:var(--ok);}
.kpi-trend.down{background:var(--danger-t);color:var(--danger);}
.kpi-trend svg{width:11px;height:11px;}

/* 管理端面板 / 表格 */
.panel{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);
  box-shadow:var(--sh-1);overflow:hidden;margin-top:18px;
}
.panel-head{
  display:flex;align-items:center;gap:12px;padding:15px 18px;
  border-bottom:1px solid var(--line);flex-wrap:wrap;
}
.panel-head h3{font-size:14.5px;font-weight:700;letter-spacing:.3px;}
.panel-head .spacer{flex:1;}
.panel-head-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}

.tool-input{
  height:34px;border-radius:var(--r-sm);border:1px solid var(--line);
  background:var(--white);padding:0 12px;font-size:12.5px;outline:none;min-width:190px;
  transition:border-color .18s;
}
.tool-input:focus{border-color:var(--terracotta-soft);}
.tool-select{
  height:34px;border-radius:var(--r-sm);border:1px solid var(--line);
  background:var(--white);padding:0 30px 0 11px;font-size:12.5px;outline:none;
  appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A7C6D' stroke-width='2' stroke-linecap='round'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat:no-repeat;background-position:right 9px center;background-size:13px;
}

.tabs-inline{display:flex;gap:2px;padding:3px;background:var(--sand);border-radius:var(--r-sm);}
.ti-btn{
  height:28px;padding:0 13px;border-radius:6px;font-size:12px;font-weight:600;
  color:var(--muted);transition:all .18s;white-space:nowrap;
  display:inline-flex;align-items:center;gap:6px;
}
.ti-btn.is-active{background:var(--white);color:var(--ink);box-shadow:0 1px 3px rgba(60,42,28,.1);}
.ti-btn i{
  font-style:normal;font-family:var(--font-num);font-size:10px;font-weight:700;
  background:var(--sand-2);color:var(--muted);border-radius:var(--r-full);
  min-width:16px;height:16px;padding:0 4px;display:grid;place-items:center;
}
.ti-btn.is-active i{background:var(--terracotta);color:#fff;}

.table{width:100%;border-collapse:collapse;}
.table th{
  text-align:left;font-size:11px;font-weight:700;color:var(--muted);
  letter-spacing:.6px;text-transform:uppercase;
  padding:11px 18px;background:var(--cream);border-bottom:1px solid var(--line);
  white-space:nowrap;
}
.table td{
  padding:14px 18px;border-bottom:1px solid var(--line);
  font-size:13px;color:var(--ink-2);vertical-align:middle;
}
.table tbody tr:last-child td{border-bottom:0;}
.table tbody tr{transition:background .14s;}
.table tbody tr:hover{background:var(--cream);}
.table .num{font-family:var(--font-num);font-size:12px;color:var(--muted);letter-spacing:.2px;}
.table .strong{font-weight:700;color:var(--ink);}
.cell-with-pic{display:flex;align-items:center;gap:12px;}
.cell-with-pic .scene-box{
  width:48px;height:48px;border-radius:var(--r-sm);flex:0 0 auto;
}
.cell-with-pic .scene-box::after{display:none;}
.cell-with-pic b{display:block;font-size:13.5px;font-weight:700;color:var(--ink);line-height:1.4;}
.cell-with-pic small{display:block;font-size:11px;color:var(--muted-2);margin-top:3px;}
.cell-user{display:flex;align-items:center;gap:10px;}
.row-actions{display:flex;gap:6px;flex-wrap:wrap;}

/* 审核卡 */
.review-card-admin{
  border:1px solid var(--line);border-radius:var(--r-md);background:var(--white);
  overflow:hidden;margin-bottom:13px;box-shadow:var(--sh-1);
  transition:box-shadow .2s;
}
.review-card-admin:hover{box-shadow:var(--sh-2);}
.rca-main{display:flex;gap:16px;padding:16px 18px;}
.rca-pic{
  width:120px;height:92px;border-radius:var(--r-sm);overflow:hidden;flex:0 0 auto;
  background:var(--sand);position:relative;
}
.rca-pic img{width:100%;height:100%;object-fit:cover;}
.rca-body{flex:1;min-width:0;}
.rca-body h4{
  font-size:15px;font-weight:700;letter-spacing:.2px;
  display:flex;align-items:center;gap:9px;flex-wrap:wrap;
}
.rca-desc{
  font-size:12.5px;line-height:1.7;color:var(--muted);margin-top:9px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.rca-meta{display:flex;gap:18px;flex-wrap:wrap;margin-top:11px;}
.rca-meta div{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--muted);}
.rca-meta svg{width:13px;height:13px;color:var(--muted-2);}
.rca-foot{
  padding:12px 18px;border-top:1px solid var(--line);background:rgba(250,246,239,.6);
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.rca-foot .spacer{flex:1;}
.reject-note{
  font-size:12px;color:var(--danger);background:var(--danger-t);
  border-radius:var(--r-sm);padding:9px 12px;margin:0 18px 14px;line-height:1.6;
  border:1px solid rgba(180,70,60,.16);
}

/* 核销台 */
.checkin-panel{
  background:linear-gradient(150deg,var(--ink) 0%,#3A322B 100%);
  border-radius:var(--r-md);padding:26px;color:var(--cream);margin-bottom:18px;
  display:flex;gap:26px;align-items:center;
}
.checkin-icon{
  width:66px;height:66px;border-radius:18px;flex:0 0 auto;display:grid;place-items:center;
  background:rgba(253,248,242,.1);border:1px solid rgba(253,248,242,.18);
}
.checkin-icon svg{width:32px;height:32px;color:var(--gold);}
.checkin-copy{flex:1;}
.checkin-copy h3{font-family:var(--font-display);font-size:21px;letter-spacing:.8px;margin-bottom:8px;}
.checkin-copy p{font-size:12.5px;opacity:.72;line-height:1.7;}
.checkin-form{display:flex;gap:9px;flex:0 0 auto;}
.checkin-input{
  height:44px;width:230px;border-radius:var(--r-sm);
  border:1px solid rgba(253,248,242,.24);background:rgba(253,248,242,.09);
  padding:0 15px;font-family:var(--font-num);font-size:16px;letter-spacing:3px;
  color:var(--cream);outline:none;text-transform:uppercase;transition:all .18s;
}
.checkin-input::placeholder{color:rgba(253,248,242,.34);letter-spacing:1px;font-size:13px;}
.checkin-input:focus{border-color:var(--gold);background:rgba(253,248,242,.14);}

/* 管理端空/成功 */
.verify-result{
  border-radius:var(--r-md);padding:16px 18px;margin-bottom:16px;
  display:flex;align-items:center;gap:13px;
}
.verify-result.ok{background:var(--ok-t);border:1px solid rgba(79,122,74,.24);}
.verify-result.err{background:var(--danger-t);border:1px solid rgba(180,70,60,.22);}
.verify-result svg{width:22px;height:22px;flex:0 0 auto;}
.verify-result.ok svg{color:var(--ok);}
.verify-result.err svg{color:var(--danger);}
.verify-result b{display:block;font-size:13.5px;margin-bottom:3px;}
.verify-result p{font-size:12px;color:var(--muted);line-height:1.55;}

/* 迷你统计条 */
.chart-box{padding:20px 18px 16px;}
.bar-chart{display:flex;align-items:flex-end;gap:10px;height:158px;}
.bar-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;height:100%;}
.bar-stack{
  flex:1;width:100%;display:flex;align-items:flex-end;justify-content:center;
  gap:3px;position:relative;
}
.bar{
  width:13px;border-radius:4px 4px 0 0;transition:height .5s cubic-bezier(.4,0,.2,1);
  min-height:3px;
}
.bar--a{background:var(--terracotta);}
.bar--b{background:var(--olive-soft);}
.bar-col span{font-size:10.5px;color:var(--muted-2);font-family:var(--font-num);}
.legend{display:flex;gap:18px;padding:0 18px 18px;}
.legend div{display:flex;align-items:center;gap:7px;font-size:11.5px;color:var(--muted);}
.legend i{width:10px;height:10px;border-radius:3px;}

/* ═══════════ Toast / Sheet ═══════════ */
.toast-wrap{
  position:fixed;left:50%;bottom:44px;transform:translateX(-50%);
  z-index:200;display:flex;flex-direction:column;gap:9px;align-items:center;
  pointer-events:none;
}
.toast{
  display:flex;align-items:center;gap:9px;
  padding:12px 20px;border-radius:var(--r-full);
  background:rgba(28,23,19,.94);color:#FCF8F2;font-size:13.5px;font-weight:600;
  letter-spacing:.3px;box-shadow:0 10px 30px rgba(20,14,8,.3);
  backdrop-filter:blur(12px);
  animation:toastIn .3s cubic-bezier(.34,1.4,.64,1);
  max-width:min(440px,90vw);
}
.toast svg{width:16px;height:16px;flex:0 0 auto;}
.toast--ok svg{color:#8FD08A;}
.toast--err svg{color:#F09A90;}
.toast.is-out{animation:toastOut .26s ease forwards;}
@keyframes toastIn{
  from{opacity:0;transform:translateY(14px) scale(.94);}
  to{opacity:1;transform:translateY(0) scale(1);}
}
@keyframes toastOut{
  to{opacity:0;transform:translateY(-8px) scale(.96);}
}

.sheet-mask{
  position:fixed;inset:0;z-index:180;
  background:rgba(30,24,18,.44);backdrop-filter:blur(3px);
  display:flex;align-items:flex-end;justify-content:center;
  padding:0;animation:fadeIn .22s ease;
}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
.sheet{
  width:100%;max-width:520px;background:var(--cream);
  border-radius:var(--r-xl) var(--r-xl) 0 0;
  box-shadow:0 -14px 50px rgba(20,14,8,.24);
  display:flex;flex-direction:column;max-height:86vh;
  animation:sheetUp .3s cubic-bezier(.34,1.2,.64,1);
}
@keyframes sheetUp{from{transform:translateY(30px);opacity:.6;}to{transform:translateY(0);opacity:1;}}
.sheet-grab{
  width:38px;height:4px;border-radius:3px;background:var(--line-2);
  margin:10px auto 0;flex:0 0 auto;
}
.sheet-head{
  display:flex;align-items:center;gap:12px;padding:14px 20px 12px;flex:0 0 auto;
  border-bottom:1px solid var(--line);
}
.sheet-head h3{flex:1;font-size:16px;font-weight:700;letter-spacing:.3px;}
.sheet-close{
  width:30px;height:30px;border-radius:var(--r-full);display:grid;place-items:center;
  color:var(--muted);transition:background .16s;
}
.sheet-close:hover{background:var(--sand);}
.sheet-body{flex:1;overflow-y:auto;padding:18px 20px;}
.sheet-body::-webkit-scrollbar{width:6px;}
.sheet-body::-webkit-scrollbar-thumb{background:var(--sand-2);border-radius:6px;}
.sheet-foot{
  flex:0 0 auto;padding:13px 20px calc(16px + env(safe-area-inset-bottom));
  border-top:1px solid var(--line);display:flex;gap:10px;
  background:rgba(252,249,244,.8);
}
.sheet-foot:empty{display:none;}
.sheet-foot .btn{flex:1;}

/* ═══════════ 响应式 ═══════════ */
@media (max-width:1240px){
  .view-user.is-active{grid-template-columns:1fr auto;gap:30px;}
  .stage-side--right{display:none;}
}
@media (max-width:940px){
  .view-user.is-active{grid-template-columns:1fr;}
  .stage-side--left{display:none;}
  .phone-wrap{justify-self:center;}
  .kpi-grid{grid-template-columns:repeat(2,1fr);}
  .admin-side{width:64px;padding:14px 8px;}
  .admin-brand b,.anav span,.admin-side-foot{display:none;}
  .anav{justify-content:center;padding:0;}
  .anav-badge{position:absolute;top:4px;right:6px;}
}
@media (max-width:700px){
  .topbar{padding:12px 16px;gap:14px;flex-wrap:wrap;}
  .stage{padding:18px 14px 40px;}
  .brand-text i{display:none;}
  .role-btn{padding:8px 14px;font-size:12.5px;}
  .checkin-panel{flex-direction:column;align-items:stretch;}
  .checkin-form{flex-direction:column;}
  .checkin-input{width:100%;}
}