/* ============ 星聚同城 · 全局样式 ============ */
:root{
  --bg:#0d0e1f;
  --text:#f2f3ff;
  --muted:rgba(242,243,255,.62);
  --line:rgba(255,255,255,.09);
  --accent:#7c5cff;
  --accent2:#ff5c8a;
  --radius:20px;
  --shadow:0 8px 32px rgba(0,0,0,.28);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  color:var(--text);
  min-height:100vh;
  background:
    radial-gradient(1200px 800px at 85% -10%, rgba(124,92,255,.28), transparent 60%),
    radial-gradient(1000px 700px at -10% 30%, rgba(255,92,138,.16), transparent 55%),
    radial-gradient(900px 620px at 50% 110%, rgba(77,201,255,.12), transparent 60%),
    linear-gradient(160deg,#0d0e1f 0%,#141531 45%,#1d1433 100%);
  background-attachment:fixed;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
button{font-family:inherit;}
::selection{background:rgba(124,92,255,.55);}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #a78bfa;outline-offset:2px;}
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:99px;}
::-webkit-scrollbar-track{background:transparent;}

.container{max-width:1120px;margin:0 auto;padding:0 20px;}
.container.narrow{max-width:760px;}
.glass{
  background:rgba(255,255,255,.055);
  border:1px solid var(--line);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}

/* ---------- 顶部导航 ---------- */
.header-inner{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:12px 20px;margin-top:16px;border-radius:20px;
  background:rgba(15,16,36,.55);
  border:1px solid var(--line);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:18px;letter-spacing:.5px;white-space:nowrap;}
.logo-mark{
  display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:11px;
  background:linear-gradient(135deg,#7c5cff,#ff5c8a);
  box-shadow:0 4px 14px rgba(124,92,255,.5);
  font-size:17px;
}
.nav{display:flex;gap:6px;}
.nav a{padding:8px 16px;border-radius:12px;font-size:14px;font-weight:600;color:var(--muted);transition:.2s;}
.nav a:hover{color:#fff;background:rgba(255,255,255,.06);}
.nav a.active{color:#fff;background:rgba(255,255,255,.09);}

/* ---------- 首页 Hero ---------- */
.hero{padding:60px 0 26px;text-align:center;}
.hero-kicker{font-size:13px;letter-spacing:6px;color:var(--muted);margin-bottom:18px;}
.hero h1{font-size:clamp(34px,6vw,58px);font-weight:900;line-height:1.25;letter-spacing:1px;}
.gradient-text{
  background:linear-gradient(120deg,#a78bfa,#ff5c8a,#ffb25c);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-sub{margin-top:20px;color:var(--muted);font-size:16px;}
.hero-actions{margin-top:30px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
.hero-stats{margin:42px auto 0;max-width:620px;display:flex;justify-content:space-around;padding:22px 20px;border-radius:20px;flex-wrap:wrap;gap:14px;}
.hero-stats strong{
  display:block;font-size:28px;font-weight:900;
  background:linear-gradient(120deg,#a78bfa,#ff5c8a);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-stats span{font-size:13px;color:var(--muted);}

/* ---------- 按钮 ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 24px;border-radius:14px;font-size:15px;font-weight:700;
  border:none;cursor:pointer;color:#fff;text-align:center;white-space:nowrap;
  background:linear-gradient(135deg,#7c5cff,#ff5c8a);
  box-shadow:0 6px 22px rgba(124,92,255,.35);
  transition:transform .2s,box-shadow .2s,filter .2s;
}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(255,92,138,.4);}
.btn:active{transform:translateY(0) scale(.98);}
.btn.ghost{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);box-shadow:none;color:var(--text);}
.btn.ghost:hover{background:rgba(255,255,255,.12);box-shadow:none;}
.btn.small{padding:8px 14px;font-size:13px;border-radius:11px;}
.btn.block{width:100%;padding:15px;}
.btn.danger{background:linear-gradient(135deg,#ff5c8a,#ff4d5a);box-shadow:0 6px 22px rgba(255,92,138,.35);}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none;}

/* ---------- 筛选 ---------- */
.filters{padding:20px;border-radius:20px;margin-top:10px;display:flex;flex-direction:column;gap:14px;}
.chip-row{display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap;}
.chip-row-label{font-size:13px;font-weight:700;color:var(--muted);padding-top:8px;min-width:34px;}
.chip-list{display:flex;flex-wrap:wrap;gap:8px;}
.chip{
  padding:7px 15px;border-radius:999px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);
  color:rgba(255,255,255,.78);font-size:13px;cursor:pointer;transition:.2s;font-weight:500;
}
.chip:hover{background:rgba(255,255,255,.12);color:#fff;}
.chip.active{background:linear-gradient(135deg,#7c5cff,#ff5c8a);color:#fff;border-color:transparent;box-shadow:0 4px 16px rgba(124,92,255,.4);}

/* ---------- 列表区 ---------- */
.section-head{display:flex;align-items:baseline;justify-content:space-between;margin:40px 0 16px;}
.section-head h2{font-size:22px;font-weight:800;}
.section-head span{font-size:13px;color:var(--muted);}
.grid-activities{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;margin-bottom:40px;}
.activity-card{overflow:hidden;cursor:pointer;transition:transform .25s,box-shadow .25s,border-color .25s;animation:rise .5s both;}
.activity-card:hover{transform:translateY(-6px);box-shadow:0 16px 40px rgba(0,0,0,.42);border-color:rgba(255,255,255,.18);}
@keyframes rise{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
.card-cover{height:150px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.cover-emoji{font-size:54px;filter:drop-shadow(0 6px 16px rgba(0,0,0,.3));transition:transform .3s;}
.activity-card:hover .cover-emoji{transform:scale(1.12) rotate(-6deg);}
.badge{
  position:absolute;top:12px;left:12px;padding:4px 12px;border-radius:999px;
  background:rgba(8,9,20,.5);backdrop-filter:blur(8px);
  font-size:12px;font-weight:700;
}
.card-body{padding:16px 18px 18px;}
.card-title{font-size:17px;font-weight:800;margin-bottom:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.meta-line{font-size:13px;color:var(--muted);margin-top:4px;}
.card-foot{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin-top:14px;padding-top:12px;border-top:1px dashed rgba(255,255,255,.12);font-size:12px;
}
.people{color:#ffb25c;font-weight:700;white-space:nowrap;}
.org{color:var(--muted);max-width:55%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* ---------- 空状态 ---------- */
.empty{padding:60px 20px;text-align:center;color:var(--muted);margin-bottom:40px;}
.empty-emoji{font-size:48px;margin-bottom:10px;}
.empty p{margin-bottom:16px;}

/* ---------- 详情页 ---------- */
.back-link{margin:22px 0 16px;}
.detail-hero{padding:28px 30px;border-radius:24px;position:relative;overflow:hidden;}
.detail-hero h1{font-size:clamp(26px,4vw,36px);font-weight:900;margin:14px 0 18px;}
.hero-badge{display:inline-flex;gap:6px;align-items:center;padding:5px 13px;border-radius:999px;font-size:13px;font-weight:700;}
.hero-chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px;}
.chip-line{
  display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border-radius:12px;
  background:rgba(255,255,255,.07);font-size:13px;color:rgba(255,255,255,.85);
}
.progress{height:8px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden;}
.progress-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,#7c5cff,#ff5c8a);transition:width .6s ease;}
.progress-text{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);margin-bottom:8px;}
.progress-text b{color:#ffb25c;}
.detail-grid{display:grid;grid-template-columns:1fr 340px;gap:20px;margin:20px 0 60px;align-items:start;}
.right{position:sticky;top:96px;}
.panel{padding:22px;border-radius:20px;}
.panel + .panel{margin-top:18px;}
.panel-title{font-size:17px;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.panel-title .dot{width:8px;height:8px;border-radius:99px;background:linear-gradient(135deg,#7c5cff,#ff5c8a);flex:none;}
.desc-text{color:rgba(255,255,255,.82);font-size:14.5px;white-space:pre-wrap;}
.org-row{display:flex;gap:14px;align-items:center;}
.org-avatar{
  width:52px;height:52px;border-radius:16px;flex:none;
  background:linear-gradient(135deg,#7c5cff,#ff5c8a);
  display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:800;
}
.org-info b{font-size:15px;}
.org-info p{font-size:13px;color:var(--muted);margin-top:2px;}

/* ---------- 留言 ---------- */
.msg-list{display:flex;flex-direction:column;gap:12px;max-height:340px;overflow:auto;padding-right:4px;}
.msg-item{background:rgba(255,255,255,.05);padding:12px 14px;border-radius:14px;}
.msg-item .msg-head{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-bottom:4px;gap:10px;}
.msg-item .msg-head b{color:rgba(255,255,255,.85);}
.msg-item p{font-size:14px;word-break:break-word;}
.msg-input-row{display:flex;gap:10px;margin-top:14px;}
.msg-input-row input{
  flex:1;background:rgba(255,255,255,.07);border:1px solid var(--line);border-radius:12px;
  padding:11px 14px;color:#fff;font-size:14px;outline:none;min-width:0;
}
.msg-input-row input:focus{border-color:#7c5cff;}

/* ---------- 电子凭证 ---------- */
.ticket{
  border-radius:20px;overflow:hidden;text-align:center;padding:20px;
  background:linear-gradient(160deg,rgba(124,92,255,.2),rgba(255,92,138,.16));
  border:1px solid rgba(255,255,255,.14);position:relative;
}
.ticket::before,.ticket::after{
  content:'';position:absolute;width:14px;height:14px;border-radius:50%;background:#141531;top:46%;
}
.ticket::before{left:-8px;}
.ticket::after{right:-8px;}
.ticket-top{display:flex;justify-content:space-between;font-size:12px;color:rgba(255,255,255,.7);}
.ticket-code{
  font-size:26px;font-weight:900;letter-spacing:3px;margin:16px 0 6px;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
.ticket-meta{font-size:12px;color:var(--muted);}
.dashed{width:100%;border-top:2px dashed rgba(255,255,255,.18);margin:16px 0;}

/* ---------- 表单 ---------- */
.page-head{padding:40px 0 24px;text-align:center;}
.page-head h1{font-size:clamp(26px,4vw,38px);font-weight:900;}
.page-head p{margin-top:10px;color:var(--muted);font-size:15px;}
.form-card{padding:28px;border-radius:24px;margin-bottom:60px;}
.form-row{display:grid;gap:16px;}
.form-row.two{grid-template-columns:1fr 1fr;}
.form-group label{display:block;font-size:13px;font-weight:700;color:rgba(255,255,255,.75);margin-bottom:8px;}
.form-group input,.form-group select,.form-group textarea{
  width:100%;background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:13px;
  padding:12px 14px;color:#fff;font-size:14.5px;outline:none;font-family:inherit;
  transition:border-color .2s,box-shadow .2s;
}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:#7c5cff;box-shadow:0 0 0 3px rgba(124,92,255,.18);}
.form-group input::placeholder,.form-group textarea::placeholder{color:rgba(255,255,255,.32);}
select option{background:#1a1b3a;color:#fff;}
.form-card .btn{margin-top:22px;}
.form-row + .form-row{margin-top:16px;}

/* ---------- 弹窗 ---------- */
.modal-mask{
  position:fixed;inset:0;background:rgba(5,6,15,.68);backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;z-index:100;
  opacity:0;pointer-events:none;transition:opacity .25s;padding:20px;
}
.modal-mask.open{opacity:1;pointer-events:auto;}
.modal{
  width:min(460px,100%);max-height:88vh;overflow:auto;padding:24px;border-radius:22px;
  transform:translateY(14px) scale(.98);transition:transform .25s;
}
.modal-mask.open .modal{transform:none;}
.modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;}
.modal-head h3{font-size:18px;font-weight:800;}
.modal-close{
  width:34px;height:34px;border-radius:11px;flex:none;
  background:rgba(255,255,255,.08);border:1px solid var(--line);color:#fff;font-size:18px;cursor:pointer;transition:.2s;
}
.modal-close:hover{background:rgba(255,255,255,.15);}
.modal-body.center{text-align:center;}
.modal-actions{display:flex;gap:10px;margin-top:18px;justify-content:center;flex-wrap:wrap;}
.modal-input,.modal-textarea{
  width:100%;background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:13px;
  padding:12px 14px;color:#fff;font-size:14.5px;outline:none;font-family:inherit;
}
.modal-input:focus,.modal-textarea:focus{border-color:#7c5cff;}
.modal-textarea{min-height:110px;resize:vertical;}
#posterHolder canvas{width:100%;max-width:300px;border-radius:18px;box-shadow:0 14px 40px rgba(0,0,0,.5);}

/* ---------- 提示 ---------- */
.toast{
  position:fixed;left:50%;bottom:34px;transform:translate(-50%,20px);
  background:rgba(20,21,52,.95);border:1px solid rgba(255,255,255,.16);color:#fff;
  padding:12px 22px;border-radius:14px;font-size:14px;font-weight:600;
  opacity:0;pointer-events:none;transition:.3s;z-index:200;
  box-shadow:0 10px 30px rgba(0,0,0,.4);max-width:88vw;text-align:center;
}
.toast.show{opacity:1;transform:translate(-50%,0);}
.toast.err{border-color:#ff5c8a;}

/* ---------- 个人中心 ---------- */
.profile-head{display:flex;align-items:center;gap:18px;padding:26px;border-radius:24px;margin-top:8px;flex-wrap:wrap;}
.avatar{
  width:64px;height:64px;border-radius:20px;flex:none;
  background:linear-gradient(135deg,#7c5cff,#ff5c8a);
  display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:900;
  box-shadow:0 8px 24px rgba(124,92,255,.4);
}
.profile-head h2{font-size:20px;font-weight:900;}
.profile-head p{font-size:13px;color:var(--muted);margin-top:2px;}
.profile-head .btn{margin-left:auto;}
.tabs{display:flex;gap:6px;padding:8px;border-radius:18px;margin:18px 0;}
.tab{
  flex:1;padding:10px 6px;border-radius:12px;background:transparent;border:none;
  color:var(--muted);font-size:14px;font-weight:700;cursor:pointer;transition:.2s;white-space:nowrap;
}
.tab:hover{color:#fff;}
.tab.active{background:linear-gradient(135deg,#7c5cff,#ff5c8a);color:#fff;box-shadow:0 4px 16px rgba(124,92,255,.35);}
.badge-count{margin-left:4px;font-size:12px;background:rgba(255,255,255,.25);padding:1px 7px;border-radius:99px;}

.list-item{
  display:flex;align-items:center;gap:14px;padding:16px;border-radius:16px;
  background:rgba(255,255,255,.05);border:1px solid var(--line);
  margin-bottom:12px;flex-wrap:wrap;
}
.list-item .li-cover{
  width:48px;height:48px;border-radius:14px;flex:none;
  display:flex;align-items:center;justify-content:center;font-size:22px;
}
.list-item .li-main{flex:1;min-width:180px;}
.list-item h4{font-size:15px;font-weight:800;}
.list-item p{font-size:12.5px;color:var(--muted);margin-top:3px;}
.list-item .chip-line{padding:5px 10px;font-size:12px;}
.msg-bubble{background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:16px;padding:14px 16px;margin-bottom:10px;}
.msg-bubble .mb-head{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-bottom:6px;gap:10px;}
.msg-bubble p{font-size:14px;word-break:break-word;}

/* ---------- 页脚 ---------- */
.site-footer{padding:36px 0 44px;text-align:center;color:var(--muted);font-size:13px;border-top:1px solid rgba(255,255,255,.06);margin-top:30px;}
.site-footer .dim{margin-top:6px;opacity:.7;}

/* ---------- 响应式 ---------- */
@media (max-width:820px){
  .detail-grid{grid-template-columns:1fr;}
  .right{position:static;}
  .form-row.two{grid-template-columns:1fr;}
  .nav a{padding:7px 11px;font-size:13px;}
  .hero{padding-top:44px;}
  .hero-stats{justify-content:center;gap:18px;}
  .header-inner{flex-wrap:wrap;gap:10px;}
  .profile-head .btn{margin-left:0;}
  .tabs{overflow-x:auto;}
  .tab{min-width:88px;}
}