:root{
--paper:#f7f0e2;--paper2:#efe2cb;--ink:#39261d;--muted:#766758;--gold:#b68a3f;
--green:#2f6750;--red:#9a4739;--line:#dfd0b6;--white:#fffaf1;--shadow:0 20px 60px rgba(55,36,26,.12)
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:"Songti TC","Noto Serif TC","PingFang TC","Microsoft JhengHei",serif;background:
linear-gradient(rgba(247,240,226,.94),rgba(247,240,226,.96)),
radial-gradient(circle at 10% 20%,#fff 0,transparent 25%),#f7f0e2}
button,input,textarea,select{font:inherit}.wrap{width:min(1160px,calc(100% - 30px));margin:auto}
.topbar{height:74px;position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:24px;padding:8px max(16px,calc((100vw - 1220px)/2));background:rgba(247,240,226,.9);backdrop-filter:blur(16px);border-bottom:1px solid rgba(182,138,63,.2)}
.text-logo{display:flex;align-items:center;gap:10px;border:0;background:transparent;color:var(--ink);cursor:pointer}.seal{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:#f4d99f;font-size:23px}.logo-copy{text-align:left}.logo-copy b{display:block;font-size:27px;letter-spacing:.13em}.logo-copy small{display:block;font-size:10px;color:var(--muted);letter-spacing:.06em}
.desktop-nav{display:flex;gap:3px;flex:1;justify-content:center}.desktop-nav button{border:0;background:transparent;color:var(--ink);padding:10px 7px;cursor:pointer}.desktop-nav button:hover{color:var(--green)}
.top-actions{display:flex;align-items:center;gap:8px}.db-chip{font-size:11px;padding:6px 9px;border-radius:99px;background:#e8dfd0;color:var(--muted)}.db-chip.ok{background:#e1efe5;color:var(--green)}.db-chip.bad{background:#f6e1dc;color:var(--red)}
.line-btn{border:0;background:var(--green);color:white;border-radius:999px;padding:11px 15px;cursor:pointer}.menu-btn{width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:#fff9;cursor:pointer}
.mobile-menu{position:fixed;z-index:60;right:12px;top:79px;width:220px;padding:10px;border:1px solid var(--line);border-radius:18px;background:var(--paper);box-shadow:var(--shadow)}.mobile-menu button{width:100%;border:0;background:transparent;text-align:left;padding:12px;border-radius:11px}.mobile-menu button:hover{background:var(--paper2)}
.page{display:none;min-height:70vh}.page.active{display:block}
.hero{height:min(700px,76vh);min-height:550px;position:relative;overflow:hidden}.hero-bg,.subhero img,.tea-hero img{width:100%;height:100%;object-fit:cover}.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(24,15,9,.62),rgba(20,12,8,.10) 58%,rgba(20,12,8,.20))}
.hero-copy{position:absolute;left:max(24px,calc((100vw - 1160px)/2));top:50%;transform:translateY(-50%);width:min(590px,75vw);color:white;text-shadow:0 2px 18px rgba(0,0,0,.35)}
.eyebrow,.kicker{font-size:12px;letter-spacing:.18em;color:var(--gold)}.hero .eyebrow,.subhero .eyebrow,.tea-hero .eyebrow,.admin-hero .eyebrow{color:#f3dcae}.hero h1{font-size:clamp(62px,9vw,118px);margin:.08em 0;letter-spacing:.11em}.lead{font-size:clamp(20px,2.3vw,31px);margin:0}.hero-copy p{line-height:1.8;font-size:17px}.hero-actions{display:flex;gap:10px;margin-top:22px}.primary,.ghost,.light{border-radius:999px;padding:12px 20px;cursor:pointer}.primary{border:0;background:var(--gold);color:white}.ghost{background:transparent;border:1px solid currentColor;color:inherit}.light{border:0;background:white;color:var(--ink)}
.vertical-copy{position:absolute;right:max(24px,calc((100vw - 1160px)/2));top:18%;writing-mode:vertical-rl;display:flex;gap:10px;color:white;letter-spacing:.18em}
.quick-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-top:-50px;position:relative;z-index:5}.quick-grid button{padding:24px 10px;border:1px solid var(--line);border-radius:22px;background:rgba(255,251,242,.94);box-shadow:var(--shadow);color:var(--ink);cursor:pointer}.quick-grid span,.quick-grid b,.quick-grid small{display:block}.quick-grid span{font-size:32px}.quick-grid b{font-size:17px;margin:9px 0 4px}.quick-grid small{color:var(--muted);font-size:11px}
.two-col,.committee-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:18px;margin-top:28px}.photo-card,.paper-card,.quote-card{border:1px solid rgba(223,208,182,.8);border-radius:24px;overflow:hidden;background:rgba(255,251,243,.91);box-shadow:var(--shadow)}.paper-card{padding:24px}.photo-card{position:relative;min-height:350px}.photo-card img{position:absolute;width:100%;height:100%;object-fit:cover}.photo-card>div{position:absolute;inset:auto 0 0;padding:28px;color:white;background:linear-gradient(transparent,rgba(0,0,0,.75))}.photo-card h2{font-size:30px;margin:.2em 0}.paper-card h2{font-size:28px;margin:.25em 0 .7em}.wash{background:linear-gradient(rgba(255,251,243,.88),rgba(255,251,243,.94)),url("assets/temple-sunset.webp") center/cover}.muted{color:var(--muted)}
.news-list{display:grid}.news{display:grid;grid-template-columns:90px 75px 1fr;gap:8px;padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}.tag{padding:4px 8px;background:var(--paper2);border-radius:99px;color:var(--gold);text-align:center;font-size:11px}.text-link{border:0;background:transparent;color:var(--gold);padding:10px 0;cursor:pointer}.stack{display:grid;gap:8px}.stack>div{padding:12px 0;border-bottom:1px dashed var(--line)}.stack b,.stack small{display:block}.stack small{color:var(--muted);margin-top:4px}
.subhero{height:350px;position:relative;overflow:hidden}.subhero>div,.tea-hero>div{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding-left:max(24px,calc((100vw - 1160px)/2));color:white;background:linear-gradient(90deg,rgba(28,17,10,.68),rgba(28,17,10,.04))}.subhero h1,.tea-hero h1{font-size:clamp(44px,6.2vw,76px);margin:.15em 0}.subhero p,.tea-hero p{max-width:670px;line-height:1.7}
.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:28px 0}.service-card{border:1px solid var(--line);border-radius:20px;background:#fffaf1;padding:18px}.service-card h3{margin:4px 0 8px}.service-card p{font-size:13px;color:var(--muted);min-height:36px}.privacy{font-size:11px;padding:6px 9px;background:var(--paper2);border-radius:99px;color:var(--muted)}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:14px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-grid label{display:grid;gap:6px}.form-grid .full{grid-column:1/-1}input,textarea,select{width:100%;border:1px solid var(--line);border-radius:13px;background:#fffdf8;color:var(--ink);padding:12px}.consent{display:flex;gap:8px;margin:14px 0;color:var(--muted);font-size:13px}.consent input{width:auto}.form-status{margin-left:10px}
.event-grid,.course-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:28px 0}.event-card,.course-card{border:1px solid var(--line);border-radius:21px;background:#fffaf1;box-shadow:var(--shadow);overflow:hidden}.event-card img{width:100%;height:190px;object-fit:cover}.event-card>div,.course-card{padding:18px}.event-card h3,.course-card h3{margin:8px 0}.event-meta{display:flex;gap:10px;color:var(--muted);font-size:12px;flex-wrap:wrap}.notify-card{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:36px}
.media-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:28px auto 40px}.media-grid article{overflow:hidden;border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}.media-grid img{width:100%;height:240px;object-fit:cover}.media-grid div{padding:15px}.media-grid span,.media-grid b{display:block}.media-grid span{font-size:11px;color:var(--gold)}.media-grid b{margin-top:5px}
.tea-hero{height:560px;position:relative;overflow:hidden}.tea-hero h1{font-size:clamp(56px,8vw,96px)}.timeline{display:grid}.timeline div{display:grid;grid-template-columns:85px 1fr;padding:12px 0;border-bottom:1px solid var(--line)}.quote-card{min-height:360px;padding:40px;display:grid;place-items:center;background:linear-gradient(rgba(35,49,37,.55),rgba(35,49,37,.55)),url("assets/temple-sunset.webp") center/cover;color:white}.quote-card p{font-size:29px;line-height:1.8;text-align:center}
.fee-big{display:flex;justify-content:space-between;align-items:end;padding:18px;border-radius:17px;background:var(--paper2);margin:14px 0}.fee-big b{font-size:34px;color:var(--red)}.fee-plans{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.fee-plan{text-align:center;border:1px solid var(--line);border-radius:12px;padding:10px}.fee-plan b,.fee-plan small{display:block}.progress-item{padding:12px 0;border-bottom:1px solid var(--line)}.bar{height:10px;background:#e8decf;border-radius:99px;overflow:hidden;margin-top:8px}.bar span{display:block;height:100%;background:var(--green)}
.member-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;margin-top:28px}.avatar{width:76px;height:76px;border-radius:50%;display:grid;place-items:center;background:var(--paper2);font-size:30px}
.admin-hero{padding:48px max(20px,calc((100vw - 1160px)/2));background:#30271f;color:white;display:flex;justify-content:space-between;align-items:end}.admin-hero h1{font-size:44px;margin:.15em 0}.role-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}.role-grid div{border:1px solid var(--line);border-radius:14px;padding:14px}.role-grid b,.role-grid small{display:block}.role-grid small{color:var(--muted);margin-top:7px;line-height:1.5}.admin-modules{margin:18px auto 38px}.admin-modules>div{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.admin-modules button{padding:12px;border:1px solid var(--line);border-radius:12px;background:white}
footer{margin-top:36px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px max(20px,calc((100vw - 1160px)/2));background:#ecdfc9;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}footer div{display:grid}footer b{font-size:23px;color:var(--ink)}footer button{border:0;background:transparent;color:var(--gold);cursor:pointer}
.bottom-nav{display:none}.toast{position:fixed;z-index:100;bottom:28px;left:50%;transform:translateX(-50%);background:#2e261f;color:white;border-radius:999px;padding:12px 18px;box-shadow:var(--shadow)}
dialog{border:0;background:transparent}.dialog-card{width:min(460px,calc(100vw - 30px));padding:24px;background:var(--paper);border-radius:22px;box-shadow:var(--shadow)}
.fog{position:fixed;z-index:-1;border-radius:50%;filter:blur(30px);opacity:.45;background:white}.fog1{width:520px;height:150px;left:-100px;top:420px}.fog2{width:620px;height:170px;right:-160px;top:900px}
@media(max-width:1050px){.desktop-nav{display:none}.quick-grid{grid-template-columns:repeat(3,1fr)}.service-grid{grid-template-columns:repeat(2,1fr)}.role-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){
body{padding-bottom:70px}.topbar{height:66px;padding:7px 10px}.logo-copy b{font-size:21px}.seal{width:38px;height:38px}.db-chip{display:none}.line-btn{font-size:12px;padding:9px 11px}
.hero{height:570px;min-height:570px}.hero-copy{left:20px;right:20px;width:auto}.hero h1{font-size:62px}.hero-copy p{font-size:15px}.vertical-copy{display:none}
.quick-grid{grid-template-columns:repeat(2,1fr);margin-top:-28px;gap:8px}.quick-grid button{padding:17px 8px;border-radius:17px}.quick-grid span{font-size:27px}.quick-grid b{font-size:15px}
.two-col,.committee-grid{grid-template-columns:1fr}.subhero{height:300px}.subhero>div,.tea-hero>div{padding:22px}.subhero h1{font-size:43px}.service-grid{grid-template-columns:1fr 1fr;gap:8px}.service-card{padding:14px}.event-grid,.course-grid,.media-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.tea-hero{height:430px}.notify-card{display:grid}.fee-plans{grid-template-columns:repeat(2,1fr)}.member-card{grid-template-columns:auto 1fr}.member-card .line-btn{grid-column:1/-1}.role-grid{grid-template-columns:1fr 1fr}.admin-modules>div{grid-template-columns:1fr 1fr}.admin-hero{padding:32px 18px}.admin-hero h1{font-size:38px}
footer{display:grid}.bottom-nav{display:grid;position:fixed;z-index:45;left:0;right:0;bottom:0;grid-template-columns:repeat(4,1fr);height:66px;background:rgba(247,240,226,.96);backdrop-filter:blur(14px);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}.bottom-nav button{border:0;background:transparent;color:var(--ink);font-size:11px}.bottom-nav span{display:block;font-size:19px}
}

/* V4 LINE ↔ Supabase member authentication */
.role-badges{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.role-badge{display:inline-flex;align-items:center;padding:5px 9px;border-radius:999px;background:var(--paper2);border:1px solid var(--line);font-size:11px;color:var(--ink)}
.role-badge.admin{background:#efe1bf;color:#6f4b13;border-color:#d9b66c}
.member-actions{display:flex;gap:8px;align-items:center}
.ghost.dark{color:var(--ink);border-color:var(--line);background:transparent}
.dialog-card label{display:grid;gap:6px;margin:12px 0;color:var(--ink)}
.dialog-card label small{font-weight:normal}
.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}
.form-error{min-height:1.4em;color:var(--red);font-size:13px}
.busy{opacity:.65;pointer-events:none}
@media(max-width:720px){
  .member-actions{grid-column:1/-1;width:100%}
  .member-actions button{flex:1}
  .dialog-actions{display:grid;grid-template-columns:1fr 1fr}
}

.version-badge{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  margin-bottom:12px;
  border:1px solid rgba(255,255,255,.55);
  border-radius:999px;
  background:rgba(44,34,25,.34);
  backdrop-filter:blur(8px);
  color:#fff;
  font-size:12px;
  letter-spacing:.08em;
  text-shadow:none;
}
@media(max-width:720px){
  .version-badge{font-size:11px;padding:5px 9px;margin-bottom:10px}
}

.version-top{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:46px;
  padding:5px 8px;
  border-radius:999px;
  background:#3a281f;
  color:#f4d99f;
  font:700 11px/1 -apple-system,BlinkMacSystemFont,"PingFang TC",sans-serif;
  letter-spacing:.04em;
}
.cache-reset-link{
  display:block;
  margin:7px 10px 5px;
  padding:10px 12px;
  border-top:1px solid var(--line);
  color:var(--muted);
  text-decoration:none;
  font-size:12px;
}
@media(max-width:720px){
  .version-top{min-width:42px;padding:5px 7px;font-size:10px}
  .topbar{gap:7px}
  .logo-copy small{max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}

/* V5.4: avoid blank LIFF screen even during SDK/auth initialization */
main{min-height:calc(100vh - 140px)}
.page[data-page="home"].active{display:block}

/* V5.5 法會活動 CRUD */
.event-admin-panel{margin-top:28px;margin-bottom:18px}
.admin-event-list{display:grid;gap:10px;margin-top:16px}
.admin-event-row{
  display:grid;
  grid-template-columns:minmax(0,1.6fr) minmax(120px,.8fr) minmax(130px,.9fr) auto;
  gap:12px;
  align-items:center;
  padding:14px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fffdf8;
}
.admin-event-row .event-main{min-width:0}
.admin-event-row .event-main b{display:block;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.admin-event-row .event-main small{display:block;color:var(--muted);margin-top:5px}
.admin-event-row .event-state{font-size:12px}
.admin-event-actions{display:flex;gap:7px;justify-content:flex-end}
.admin-event-actions button{
  border:1px solid var(--line);
  background:white;
  color:var(--ink);
  border-radius:999px;
  padding:8px 12px;
  cursor:pointer;
}
.admin-event-actions .danger{color:var(--red);border-color:#dfb2a8}
.status-pill{display:inline-flex;padding:5px 8px;border-radius:999px;background:var(--paper2);font-size:11px}
.status-pill.published{background:#e1efe5;color:var(--green)}
.status-pill.cancelled{background:#f6e1dc;color:var(--red)}
.status-pill.draft{background:#eee8de;color:var(--muted)}
.status-pill.completed{background:#e7e2d5;color:#5c5244}
.event-dialog-card{width:min(720px,calc(100vw - 28px));max-height:88vh;overflow:auto}
.icon-close{width:38px;height:38px;border:1px solid var(--line);border-radius:50%;background:white;font-size:25px;cursor:pointer}
.toggle-row{display:flex;gap:20px;flex-wrap:wrap;margin-top:14px}
.toggle-row label{display:flex;align-items:center;gap:8px;margin:0}
.toggle-row input{width:auto}
@media(max-width:720px){
  .event-admin-panel .section-head{align-items:flex-start}
  .admin-event-row{grid-template-columns:1fr}
  .admin-event-actions{justify-content:flex-start}
}