:root{
  --bg:#faf7f2; --bg-alt:#f2ece2; --surface:#ffffff;
  --ink:#1d1a16; --ink-2:#4a443c; --muted:#7a7166; --line:#e4dccf;
  --brand:#a8742a; --brand-ink:#7d5419; --brand-soft:#f3e6cf;
  --line-green:#06c755;
  --dark:#16130f; --dark-2:#221d17; --on-dark:#f4eee4; --on-dark-muted:#b8ad9d; --gold:#d4a45a;
  --radius:14px; --shadow:0 10px 30px -14px rgba(40,28,10,.2);
  --serif:"Noto Serif TC",serif; --sans:"Noto Sans TC",system-ui,-apple-system,"PingFang TC","Microsoft JhengHei",sans-serif;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#14110d; --bg-alt:#1b1712; --surface:#211c16;
    --ink:#f1ebe1; --ink-2:#d2c8b8; --muted:#a3988a; --line:#352d24;
    --brand:#d4a45a; --brand-ink:#e6bc78; --brand-soft:#2e2518;
  }
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.85 var(--sans);letter-spacing:.02em;padding-bottom:76px}
@media(min-width:960px){body{padding-bottom:0}}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:1160px;margin:0 auto;padding:0 16px}
@media(min-width:720px){.wrap{padding:0 28px}}
h1,h2,h3{font-family:var(--serif);line-height:1.35;letter-spacing:.03em;margin:0}
.eyebrow{font:700 12px/1 var(--sans);letter-spacing:.25em;text-transform:uppercase;color:var(--brand);margin:0}
.section{padding:84px 0}
.section.alt{background:var(--bg-alt)}
.section.dark{background:var(--dark);color:var(--on-dark)}
.section-head{max-width:760px;margin-bottom:44px}
.section-head h2{font-size:clamp(26px,4vw,38px);margin-top:12px}
.section-head p{color:var(--ink-2);margin:14px 0 0}
.dark .section-head p{color:var(--on-dark-muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 24px;border-radius:999px;font-weight:700;text-decoration:none;transition:transform .15s,filter .15s;border:0;white-space:nowrap}
.btn:hover{transform:translateY(-1px);filter:brightness(1.07)}
.btn-line{background:var(--line-green);color:#fff}
.btn-primary{background:var(--brand);color:#fff}
.btn-ghost{border:1px solid rgba(244,238,228,.5);color:var(--on-dark)}
.btn svg{width:20px;height:20px}

.preview{background:#b3261e;color:#fff;text-align:center;font-size:13px;padding:6px 16px}

/* header */
header.site{position:sticky;top:0;z-index:50;background:rgba(22,19,15,.94);backdrop-filter:saturate(1.4) blur(10px);color:var(--on-dark)}
.nav{display:flex;align-items:center;justify-content:space-between;height:64px;gap:16px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font:700 17px var(--serif);white-space:nowrap}
.logo svg{width:30px;height:30px;flex:none}
.nav .btn{padding:9px 18px;font-size:14px}

/* hero */
.hero{background:radial-gradient(1100px 560px at 90% -10%,#3a2c18 0%,transparent 60%),linear-gradient(180deg,var(--dark),var(--dark-2));color:var(--on-dark);position:relative;overflow:hidden}
.hero .wrap{display:grid;gap:40px;padding-top:64px;padding-bottom:76px}
@media(min-width:960px){.hero .wrap{grid-template-columns:1.25fr .85fr;align-items:center;padding-top:88px;padding-bottom:100px}}
.badge{display:inline-flex;gap:8px;align-items:center;background:rgba(212,164,90,.14);border:1px solid rgba(212,164,90,.4);color:var(--gold);border-radius:999px;padding:6px 14px;font-size:13px;font-weight:500;line-height:1.5}
.hero h1{font-size:clamp(28px,4.1vw,48px);font-weight:900;margin:22px 0 20px}
.hero h1 em{font-style:normal;color:var(--gold)}
.hero .lead{font-size:clamp(16px,1.8vw,18px);color:var(--on-dark-muted);max-width:36em;margin:0}
.hero .cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.hero figure{margin:0;position:relative}
.hero figure img{border-radius:20px;aspect-ratio:1/1;object-fit:cover;width:100%;box-shadow:0 30px 60px -30px #000;border:1px solid #3a3025}
.hero figcaption{position:absolute;left:16px;right:16px;bottom:16px;background:rgba(22,19,15,.82);backdrop-filter:blur(6px);border-radius:12px;padding:12px 16px;font-size:14px;color:var(--on-dark-muted)}
.hero figcaption strong{display:block;color:var(--on-dark);font:700 18px var(--serif)}

/* stats */
.stats{background:var(--dark-2);color:var(--on-dark);border-top:1px solid #2e271e}
.stats ul{list-style:none;margin:0 auto;padding-top:32px;padding-bottom:32px;display:grid;grid-template-columns:repeat(2,1fr);gap:24px 16px}
@media(min-width:860px){.stats ul{grid-template-columns:repeat(4,1fr)}}
.stats b{display:block;font:900 clamp(26px,4vw,40px)/1.15 var(--serif);color:var(--gold)}
.stats span{font-size:14px;color:var(--on-dark-muted)}

/* artist strip */
.artists-strip{background:var(--dark);color:var(--on-dark-muted);padding:22px 0;border-top:1px solid #2e271e;font-size:15px}
.artists-strip .wrap{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;justify-content:center}
.artists-strip strong{color:var(--gold);font-weight:700;margin-right:6px}

/* generic grid & cards */
.grid{display:grid;gap:18px}
@media(min-width:640px){.grid.c2,.grid.c3,.grid.c4{grid-template-columns:repeat(2,1fr)}}
@media(min-width:960px){.grid.c3{grid-template-columns:repeat(3,1fr)}.grid.c4{grid-template-columns:repeat(4,1fr)}}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}
.card h3{font-size:20px;margin:14px 0 8px}
.card p{margin:0;color:var(--ink-2);font-size:15px}
.icon{width:44px;height:44px;border-radius:12px;background:var(--brand-soft);color:var(--brand-ink);display:grid;place-items:center}
.icon svg{width:24px;height:24px}
.feat{display:flex;gap:16px;padding:22px 0;border-bottom:1px solid var(--line)}
.feat h3{font-size:18px;margin:0 0 4px}
.feat p{margin:0;color:var(--ink-2);font-size:15px}
.feat .icon{flex:none}
.feat-grid{display:grid;column-gap:40px}
@media(min-width:860px){.feat-grid{grid-template-columns:1fr 1fr}}
.pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.pill{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 14px;font-size:14px;color:var(--ink-2)}

/* live class */
.split{display:grid;gap:36px;align-items:center}
@media(min-width:960px){.split{grid-template-columns:1fr 1fr}}
.split img{border-radius:18px;width:100%;object-fit:cover;box-shadow:var(--shadow)}
.checks{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:10px}
.checks li{padding-left:30px;position:relative;color:var(--ink-2)}
.checks li::before{content:"";position:absolute;left:0;top:7px;width:18px;height:18px;border-radius:50%;background:var(--brand-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a8742a' stroke-width='3'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/12px no-repeat}
.plan{display:grid;gap:14px;margin-top:22px}
@media(min-width:560px){.plan{grid-template-columns:1fr 1fr}}
.plan div{border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:16px 18px}
.plan b{font-family:var(--serif);font-size:17px;display:block;margin-bottom:4px}
.plan span{font-size:14px;color:var(--ink-2)}

/* tool */
.tool{background:linear-gradient(120deg,#1c1813,#2b2116);color:var(--on-dark);border-radius:22px;padding:36px 26px;display:grid;gap:22px;align-items:center;border:1px solid #3a3025}
@media(min-width:860px){.tool{grid-template-columns:1.5fr auto;padding:46px}}
.tool h2{font-size:clamp(22px,3vw,30px);margin:10px 0}
.tool p{color:var(--on-dark-muted);margin:0}
.tool .chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.tool .chips span{font-size:13px;border:1px solid #4a3d2c;border-radius:999px;padding:4px 12px;color:var(--gold)}

/* resume */
.resume{display:grid;gap:40px}
@media(min-width:1000px){.resume{grid-template-columns:320px 1fr}}
.resume aside img{border-radius:18px;width:100%;aspect-ratio:3/4;object-fit:cover;box-shadow:var(--shadow)}
.resume aside .note{margin-top:18px;background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--brand);border-radius:10px;padding:16px 18px;font-size:15px}
@media(min-width:1000px){.resume aside{position:sticky;top:90px;align-self:start}}
.cv{display:grid;gap:34px}
.cv h3{font-size:20px;display:flex;align-items:center;gap:10px;margin-bottom:10px}
.cv h3::before{content:"";width:18px;height:2px;background:var(--brand)}
.cv p{margin:0 0 8px;color:var(--ink-2)}
.cv ul{margin:0;padding:0;list-style:none}
.cv li{position:relative;padding:10px 0 10px 22px;border-bottom:1px dashed var(--line);color:var(--ink-2)}
.cv li::before{content:"";position:absolute;left:4px;top:21px;width:7px;height:7px;border-radius:50%;background:var(--brand)}
.cv li strong{color:var(--ink)}
.highlight{background:linear-gradient(120deg,var(--brand-soft),transparent);border:1px solid var(--line);border-radius:12px;padding:16px 18px;font-weight:700;color:var(--ink)}
.awards{display:grid;gap:12px}
@media(min-width:640px){.awards{grid-template-columns:1fr 1fr}}
.award{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:16px 18px}
.award small{display:block;color:var(--brand-ink);font-weight:700;font-size:13px;letter-spacing:.08em}
.award b{font-family:var(--serif);font-size:16px}
.award ul{margin:6px 0 0}
.award li{border:0;padding:3px 0 3px 18px;font-size:15px}
.award li::before{top:13px;width:6px;height:6px}
.tagcloud{display:flex;flex-wrap:wrap;gap:8px}
.tagcloud span{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:5px 12px;font-size:14px}
.tagcloud span i{font-style:normal;color:var(--muted);font-size:12px;margin-left:4px}

/* gallery */
.gallery{display:grid;gap:14px;grid-template-columns:repeat(2,1fr)}
@media(min-width:860px){.gallery{grid-template-columns:repeat(4,1fr)}}
.gallery figure{margin:0;background:#0f0d0a;border-radius:12px;overflow:hidden;position:relative}
.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .4s}
.gallery figure:hover img{transform:scale(1.04)}
.gallery figcaption{font-size:13px;color:var(--on-dark-muted);padding:10px 12px;line-height:1.5}
.gallery .wide{grid-column:span 2}
.gallery .wide img{aspect-ratio:8/3}

/* compare */
.compare{width:100%;border-collapse:separate;border-spacing:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);font-size:15px}
.compare th,.compare td{padding:16px 18px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.compare thead th{background:var(--dark);color:var(--on-dark);font-family:var(--serif);font-size:16px}
.compare thead th.us{color:var(--gold)}
.compare tbody th{font-family:var(--serif);width:150px;color:var(--ink);background:var(--bg-alt)}
.compare td{color:var(--ink-2)}
.compare td.us{color:var(--ink)}
.compare tr:last-child>*{border-bottom:0}
@media(max-width:760px){
  .compare thead{display:none}
  .compare,.compare tbody,.compare tr,.compare th,.compare td{display:block;width:100%}
  .compare tr{border-bottom:1px solid var(--line)}
  .compare tbody th{border-bottom:0}
  .compare td{border-bottom:0;padding-top:4px}
  .compare td::before{display:block;font-weight:700;font-size:13px;margin-bottom:2px}
  .compare td.us::before{content:"盧家宏吉他教室";color:var(--brand-ink)}
  .compare td.them::before{content:"一般音樂教室";color:var(--muted)}
}

/* path */
.path{list-style:none;padding:0;margin:0;display:grid;gap:14px;counter-reset:s}
@media(min-width:860px){.path{grid-template-columns:repeat(3,1fr)}}
.path li{counter-increment:s;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px 22px 22px 70px;position:relative}
.path li::before{content:counter(s,decimal-leading-zero);position:absolute;left:20px;top:18px;font:900 26px var(--serif);color:var(--brand)}
.path b{display:block;font-family:var(--serif);font-size:17px;margin-bottom:4px}
.path span{font-size:15px;color:var(--ink-2)}

/* philosophy */
.phil{display:grid;gap:18px}
@media(min-width:860px){.phil{grid-template-columns:repeat(3,1fr)}}
.phil .card h3{margin-top:0}
.phil ul{margin:8px 0 0;padding-left:18px;color:var(--ink-2);font-size:15px}
.phil li{margin-bottom:6px}
.pullquote{font:700 clamp(22px,3vw,30px)/1.5 var(--serif);text-align:center;max-width:760px;margin:0 auto 40px}
.pullquote em{font-style:normal;color:var(--brand)}

/* testimonials */
.quotes{display:grid;gap:18px}
@media(min-width:960px){.quotes{grid-template-columns:1fr 1fr}}
.quote-card{background:var(--dark-2);border:1px solid #3a3025;border-radius:var(--radius);padding:28px;color:var(--on-dark-muted);font-size:15px}
.quote-card::before{content:"“";display:block;font:900 56px/0.8 var(--serif);color:var(--gold);margin-bottom:8px}
.quote-card p{margin:0 0 12px}
.quote-card footer{background:none;padding:0;color:var(--gold);font-size:14px}
.outcomes{list-style:none;padding:0;margin:36px 0 0;display:grid;gap:12px}
@media(min-width:860px){.outcomes{grid-template-columns:1fr 1fr}}
.outcomes li{border:1px solid #3a3025;border-radius:12px;padding:14px 18px;color:var(--on-dark)}

/* books */
.books{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
@media(min-width:640px){.books{grid-template-columns:repeat(4,1fr)}}
@media(min-width:1000px){.books{grid-template-columns:repeat(8,1fr)}}
.books img{border-radius:6px;aspect-ratio:212/300;object-fit:cover;width:100%;box-shadow:0 12px 20px -12px rgba(0,0,0,.5)}

/* faq */
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:18px 22px;margin-bottom:12px}
.faq summary{cursor:pointer;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--brand);font-size:22px;line-height:1}
.faq details[open] summary::after{content:"−"}
.faq details p,.faq details ul{margin:12px 0 0;color:var(--ink-2)}

/* contact */
.contact-box{display:grid;gap:24px;background:linear-gradient(135deg,var(--dark),#2b2116);color:var(--on-dark);border-radius:24px;padding:36px 26px}
@media(min-width:960px){.contact-box{grid-template-columns:1.2fr 1fr;padding:52px;align-items:center}}
.contact-box h2{font-size:clamp(26px,3.6vw,36px);margin:10px 0 12px}
.contact-box p{color:var(--on-dark-muted);margin:0}
.contact-box dl{margin:0;display:grid;gap:16px}
.contact-box dt{font-size:13px;letter-spacing:.15em;color:var(--on-dark-muted)}
.contact-box dd{margin:2px 0 0;font-size:18px;font-weight:500}
.contact-box dd a{text-decoration:none;border-bottom:1px solid var(--gold)}
.contact-box .cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}

footer.site{background:var(--dark);color:var(--on-dark-muted);font-size:14px;padding:48px 0 36px}
footer.site h4{color:var(--on-dark);margin:0 0 12px;font:700 15px var(--sans)}
footer.site ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
footer.site a{text-decoration:none}
footer.site a:hover{color:var(--on-dark)}
footer.site .copy{border-top:1px solid #2e271e;margin-top:36px;padding-top:20px}

.m-cta{position:fixed;left:12px;right:12px;bottom:12px;z-index:60;display:flex;gap:8px}
.m-cta .btn{flex:1;box-shadow:0 10px 24px -8px rgba(0,0,0,.5)}
@media(min-width:960px){.m-cta{display:none}}

/* ===== 多頁共用:選單(下拉+手機漢堡) ===== */
.nav{position:relative}
.nav .menu{display:none;list-style:none;margin:0;padding:0}
.nav .menu a{text-decoration:none;color:var(--on-dark-muted);display:block}
.nav .menu a:hover,.nav .menu .active>a{color:var(--on-dark)}
.caret{font-size:10px;margin-left:4px;opacity:.7}
.navtoggle{position:absolute;opacity:0;pointer-events:none}
.burger{display:flex;flex-direction:column;gap:5px;cursor:pointer;padding:10px;margin-left:auto}
.burger span{width:22px;height:2px;background:var(--on-dark);border-radius:2px}
.nav-cta{display:none}
.navtoggle:checked~.menu{display:block;position:absolute;top:64px;left:0;right:0;background:#16130f;padding:8px 20px 90px;max-height:calc(100vh - 100px);overflow:auto;border-bottom:1px solid #2e271e}
.navtoggle:checked~.menu>li>a{padding:12px 0;font-size:16px;border-bottom:1px solid #2a231b}
.navtoggle:checked~.menu .sub{list-style:none;padding:0 0 6px 14px;margin:0}
.navtoggle:checked~.menu .sub a{padding:7px 0;font-size:14px}
@media(min-width:1080px){
  .burger{display:none}
  .nav-cta{display:inline-flex}
  .nav .menu{display:flex;gap:4px;font-size:15px;align-items:center}
  .nav .menu>li{position:relative}
  .nav .menu>li>a{padding:21px 12px}
  .nav .menu>.active>a{box-shadow:inset 0 -2px 0 var(--gold)}
  .nav .menu .sub{display:none;position:absolute;top:100%;left:0;min-width:200px;list-style:none;margin:0;padding:8px;background:#1d1813;border:1px solid #3a3025;border-radius:12px;box-shadow:0 20px 40px -12px rgba(0,0,0,.6)}
  .nav .menu .sub a{padding:9px 12px;border-radius:8px;font-size:14px}
  .nav .menu .sub a:hover{background:#2b2319}
  .nav .menu>li:hover>.sub,.nav .menu>li:focus-within>.sub{display:block}
}

/* ===== 分頁頁首 ===== */
.page-hero{background:radial-gradient(900px 400px at 85% -20%,#3a2c18 0%,transparent 60%),linear-gradient(180deg,var(--dark),var(--dark-2));color:var(--on-dark);padding:56px 0 60px}
.crumbs{font-size:13px;color:var(--on-dark-muted);margin:0 0 18px}
.crumbs a{text-decoration:none;color:var(--on-dark-muted)}
.crumbs a:hover{color:var(--gold)}
.crumbs span{margin:0 8px;opacity:.5}
.page-hero h1{font-size:clamp(28px,4.4vw,46px);font-weight:900;margin:10px 0 14px}
.page-hero p.lead{color:var(--on-dark-muted);max-width:44em;margin:0;font-size:17px}
.page-hero .cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.subnav{background:var(--dark-2);border-top:1px solid #2e271e;position:sticky;top:64px;z-index:40}
.subnav .wrap{display:flex;gap:6px;overflow-x:auto;padding-top:10px;padding-bottom:10px;scrollbar-width:none}
.subnav a{flex:none;text-decoration:none;color:var(--on-dark-muted);font-size:14px;padding:6px 14px;border-radius:999px;border:1px solid #3a3025}
.subnav a:hover{color:var(--on-dark);border-color:var(--gold)}

/* ===== 頁尾 CTA 帶 ===== */
.cta-band{background:linear-gradient(120deg,#2b2116,#16130f);color:var(--on-dark);padding:56px 0;border-top:1px solid #3a3025}
.cta-band .wrap{display:grid;gap:22px;align-items:center}
@media(min-width:900px){.cta-band .wrap{grid-template-columns:1fr auto}}
.cta-band h2{font-size:clamp(24px,3.2vw,32px);margin:0 0 6px}
.cta-band p{color:var(--on-dark-muted);margin:0}
.cta-band-btns{display:flex;flex-wrap:wrap;gap:12px}
footer.site .cols{display:grid;gap:28px;grid-template-columns:1fr}
@media(min-width:860px){footer.site .cols{grid-template-columns:1.4fr 1fr 1fr 1fr 1fr}}
.social{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}
.social a{border:1px solid #3a3025;border-radius:999px;padding:4px 12px;font-size:13px}

/* ===== 最新消息條 ===== */
.news-bar{background:var(--brand-soft);border-bottom:1px solid var(--line)}
.news-bar .wrap{display:flex;gap:14px;align-items:center;padding-top:12px;padding-bottom:12px;font-size:15px;flex-wrap:wrap}
.news-bar b{background:var(--brand);color:#fff;border-radius:6px;padding:2px 10px;font-size:13px}
.news-bar a{color:var(--brand-ink);font-weight:700}

/* ===== 媒體報導 ===== */
.press{display:grid;gap:14px}
@media(min-width:860px){.press{grid-template-columns:repeat(3,1fr)}}
.press a{display:block;text-decoration:none;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:18px 20px;transition:border-color .15s}
.press a:hover{border-color:var(--brand)}
.press small{color:var(--brand-ink);font-weight:700;letter-spacing:.06em;font-size:12px}
.press b{display:block;font-family:var(--serif);font-size:16px;margin-top:4px;line-height:1.5}

/* ===== 時間軸 ===== */
.tl{list-style:none;margin:0;padding:0;position:relative}
.tl::before{content:"";position:absolute;left:78px;top:6px;bottom:6px;width:2px;background:var(--line)}
.tl li{display:grid;grid-template-columns:64px 1fr;gap:30px;padding:0 0 26px;position:relative}
.tl li::before{content:"";position:absolute;left:72px;top:8px;width:14px;height:14px;border-radius:50%;background:var(--bg);border:3px solid var(--brand)}
.tl time{font:900 18px/1.4 var(--serif);color:var(--brand-ink);text-align:right}
.tl h3{font-size:18px;margin:0 0 4px}
.tl p{margin:0;color:var(--ink-2);font-size:15px}
.alt .tl li::before{background:var(--bg-alt)}

/* ===== 影片牆 ===== */
.vgrid{display:grid;gap:18px}
@media(min-width:640px){.vgrid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.vgrid{grid-template-columns:repeat(3,1fr)}}
.vcard{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:var(--shadow);text-decoration:none;display:block}
.vthumb{aspect-ratio:16/9;background:linear-gradient(135deg,#2b2116,#5a4630);position:relative;display:grid;place-items:center}
.vthumb::after{content:"";width:58px;height:58px;border-radius:50%;background:rgba(0,0,0,.55) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M8 5v14l11-7z'/%3E%3C/svg%3E") center/26px no-repeat}
.vcard .vbody{padding:14px 16px}
.vcard b{font-family:var(--serif);font-size:16px;display:block}
.vcard span{font-size:13px;color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px}
.chips a{text-decoration:none;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 16px;font-size:14px;color:var(--ink-2)}
.chips a.on{background:var(--dark);color:var(--on-dark);border-color:var(--dark)}

/* ===== 工具卡 ===== */
.tools{display:grid;gap:18px}
@media(min-width:760px){.tools{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1080px){.tools{grid-template-columns:repeat(3,1fr)}}
.tool-card{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:28px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:10px}
.tool-card .big{width:56px;height:56px;border-radius:16px;background:linear-gradient(135deg,var(--dark),#3a2c18);color:var(--gold);display:grid;place-items:center}
.tool-card .big svg{width:28px;height:28px}
.tool-card h3{font-size:20px;margin:6px 0 0}
.tool-card p{margin:0;color:var(--ink-2);font-size:15px;flex:1}
.tool-card .btn{align-self:flex-start;margin-top:8px}

/* ===== 教材列表 ===== */
.shelf{display:grid;gap:22px;grid-template-columns:repeat(2,1fr)}
@media(min-width:760px){.shelf{grid-template-columns:repeat(4,1fr)}}
.book img,.book .cover{border-radius:6px;aspect-ratio:212/300;width:100%;object-fit:cover;box-shadow:0 14px 22px -12px rgba(0,0,0,.5);background:linear-gradient(160deg,#3a2c18,#1a1611)}
.book b{display:block;font-family:var(--serif);font-size:16px;margin-top:12px;line-height:1.45}
.book span{font-size:13px;color:var(--muted)}
.svc{display:grid;gap:18px}
@media(min-width:860px){.svc{grid-template-columns:repeat(2,1fr)}}
.book .cover{display:flex;flex-direction:column;justify-content:space-between;padding:18px 16px;border:1px solid #4a3d2c;position:relative;overflow:hidden}
.book .cover::before{content:"";position:absolute;inset:auto -30% -30% auto;width:90%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(212,164,90,.35)}
.book .cover em{font:900 clamp(18px,2.2vw,24px)/1.35 var(--serif);font-style:normal;color:#f4eee4;position:relative}
.book .cover small{color:var(--gold);font-size:12px;letter-spacing:.15em;position:relative}

.navtoggle:checked~.menu .active>a{color:var(--gold)}
.posters{display:grid;gap:14px;grid-template-columns:repeat(3,1fr)}
.posters img{width:100%;border-radius:10px;aspect-ratio:724/1024;object-fit:cover;box-shadow:0 20px 40px -20px #000}
@media(max-width:640px){.posters{grid-template-columns:1fr 1fr}.posters img:last-child{display:none}}
a.pill{text-decoration:none}a.pill:hover{border-color:var(--brand);color:var(--brand-ink)}
details.fold{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 20px;margin-bottom:10px}
details.fold summary{cursor:pointer;font-weight:700;font-family:var(--serif);font-size:17px;list-style:none;display:flex;justify-content:space-between}
details.fold summary::-webkit-details-marker{display:none}
details.fold summary::after{content:"+";color:var(--brand);font-size:22px;line-height:1}
details.fold[open] summary::after{content:"−"}
details.fold .cv{margin-top:8px}
.dark .vcard{background:#221d17;border-color:#3a3025}.dark .vcard b{color:var(--on-dark)}
.biz{display:grid;gap:18px}
@media(min-width:760px){.biz{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1080px){.biz{grid-template-columns:repeat(4,1fr)}}
.biz a{display:flex;flex-direction:column;gap:8px;text-decoration:none;background:#221d17;border:1px solid #3a3025;border-radius:16px;padding:26px;color:var(--on-dark);transition:border-color .15s,transform .15s}
.biz a:hover{border-color:var(--gold);transform:translateY(-2px)}
.biz small{color:var(--gold);font-weight:700;letter-spacing:.12em;font-size:12px}
.biz b{font-family:var(--serif);font-size:20px}
.biz span{color:var(--on-dark-muted);font-size:15px}
.biz em{font-style:normal;color:var(--gold);font-weight:700;margin-top:auto}

/* ===== 手機與各尺寸螢幕保護(防止內容撐出畫面、字太小) ===== */
.hero .wrap>*,.split>*,.grid>*,.vgrid>*,.teacher>*,.resume>*,.contact-box>*,.cta-band .wrap>*{min-width:0}
.badge{display:inline-block;white-space:normal}
h1,h2,h3,p,li,dd,summary,figcaption,.vbody b{overflow-wrap:anywhere}
img,iframe,video{max-width:100%}
@media(max-width:640px){
  body{font-size:16px}
  .section{padding:60px 0}
  .section-head{margin-bottom:30px}
  .eyebrow{font-size:13px;letter-spacing:.18em}
  .card{padding:22px}
  .hero .wrap{padding-top:44px;padding-bottom:56px}
  .hero .cta .btn,.page-hero .cta .btn,.cta-band-btns .btn{flex:1 1 100%}
  .stats span,.crumbs,.gallery figcaption,.vcard span,.tag,.pill{font-size:14px}
  .compare{font-size:15px}
  .tl::before{left:58px}
  .tl li{grid-template-columns:48px 1fr;gap:34px}
  .tl li::before{left:52px}
  .tl time{font-size:16px}
  .books,.shelf{gap:12px}
  .posters{gap:10px}
  .quote-card{padding:22px}
  .biz a{padding:22px}
}
@media(max-width:360px){
  .wrap{padding:0 12px}
  .hero h1{font-size:26px}
  .page-hero h1{font-size:26px}
  .logo{font-size:15px}
  .m-cta .btn{padding:12px 10px;font-size:15px}
}
/* 最小字級 13px */
.eyebrow{font-size:13px}
.biz small,.press small,.award small,.book .cover small{font-size:13px}
.tagcloud span i{font-size:13px}

/* ===== 第二批元件 ===== */
.btn-sm{padding:9px 16px;font-size:14px}
.btn-ghost-d{border:1px solid var(--line);color:var(--ink);background:var(--surface)}
.gigs{display:grid;gap:18px}
.gig{display:grid;grid-template-columns:96px 1fr;gap:22px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:var(--shadow)}
.gig-date{background:var(--dark);color:var(--on-dark);border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:14px 6px;align-self:start}
.gig-date b{font:900 28px/1 var(--serif);color:var(--gold)}
.gig-date span{font-size:13px;color:var(--on-dark-muted);margin-top:6px}
.gig h3{font-size:21px;margin:0}
.gig-time{color:var(--brand-ink);font-weight:700;margin:4px 0 8px}
.gig p{color:var(--ink-2);margin:0 0 8px}
@media(max-width:560px){.gig{grid-template-columns:1fr}.gig-date{flex-direction:row;gap:10px;justify-content:flex-start;padding:10px 14px}}
.scores{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.score{background:#221d17;border:1px solid #3a3025;border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
.score-thumb{aspect-ratio:16/9;background:#2b2116 center/cover;display:flex;align-items:flex-end;text-decoration:none}
.score-thumb span{background:rgba(0,0,0,.65);color:#fff;font-size:13px;padding:4px 10px;margin:10px;border-radius:999px}
.score-body{padding:14px 16px 18px;display:flex;flex-direction:column;gap:6px;flex:1}
.score-body h3{margin:0;font-size:19px;color:var(--on-dark)}
.score-body p{margin:0;color:var(--on-dark-muted);font-size:14px;flex:1}
.score-body .btn{align-self:flex-start;margin-top:6px}
.score-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}.score-btns .btn{margin-top:0}
.btn-tab{background:transparent;color:var(--gold);border:1px solid rgba(212,164,90,.55)}.btn-tab:hover{background:rgba(212,164,90,.12);color:#f0c880}
.badge-s{align-self:flex-start;font-size:13px;font-weight:700;border-radius:6px;padding:2px 8px;background:#3a3025;color:var(--on-dark-muted)}
.badge-s.on{background:var(--gold);color:#16130f}
.bookgrid{display:grid;gap:18px}
@media(min-width:760px){.bookgrid{grid-template-columns:repeat(2,1fr)}}
.bookcard{display:grid;grid-template-columns:120px 1fr;gap:18px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow)}
.bookcard>img,.bookcard>.cover{width:120px;aspect-ratio:212/300;object-fit:cover;border-radius:6px;box-shadow:0 12px 20px -12px rgba(0,0,0,.5)}
.bookcard>.cover{display:flex;flex-direction:column;justify-content:space-between;padding:12px;background:linear-gradient(160deg,#3a2c18,#1a1611)}
.bookcard>.cover em{font:900 16px/1.35 var(--serif);font-style:normal;color:#f4eee4}
.bookcard>.cover small{color:var(--gold);font-size:13px}
.bookcard h3{margin:0 0 2px;font-size:18px}
.bookcard small{color:var(--brand-ink);font-weight:700;font-size:13px}
.bookcard p{margin:8px 0 0;color:var(--ink-2);font-size:15px}
.bk-btns{display:flex;flex-wrap:wrap;gap:8px}
.price{font:900 22px var(--serif)!important;color:var(--brand-ink)!important}
@media(max-width:420px){.bookcard{grid-template-columns:90px 1fr;gap:14px;padding:14px}.bookcard>img,.bookcard>.cover{width:90px}}
.post{max-width:820px;margin:48px auto 0;padding-top:36px;border-top:1px solid var(--line)}
.post h2{font-size:clamp(22px,3vw,28px);margin-bottom:14px}
.post p{color:var(--ink-2)}
.bio p{color:var(--ink-2);margin:12px 0 0}
.bio-h{display:flex;justify-content:space-between;align-items:center;gap:12px}
.gallery.dl figcaption a{color:var(--gold)}
/* LINE 浮動按鈕(桌機) */
.line-fab{position:fixed;right:22px;bottom:22px;z-index:70;display:none;align-items:center;gap:8px;background:#0a8a40;color:#fff;text-decoration:none;font-weight:700;border-radius:999px;padding:12px 18px;box-shadow:0 12px 28px -8px rgba(0,0,0,.45)}
.line-fab svg{width:22px;height:22px}
@media(min-width:960px){.line-fab{display:inline-flex}}
/* 影片彈出播放 */
.yt-lb{position:fixed;inset:0;z-index:100;background:rgba(10,8,6,.95);display:none;align-items:center;justify-content:center;padding:16px}
.yt-lb.on{display:flex}
.yt-box{position:relative;width:min(1100px,100%)}
.yt-box .yt-x{position:absolute;right:0;top:-44px;background:none;border:0;color:#fff;font-size:26px;cursor:pointer;padding:4px 10px}
.yt-frame{position:relative;aspect-ratio:16/9;background:#000;border-radius:12px;overflow:hidden}
.yt-frame iframe{width:100%;height:100%;border:0;display:block}
/* 微博手機版播放頁:影片下方有一條「打開微博看高清」,把 iframe 加高 54px 裁掉;電腦版再加寬 17px 裁掉捲軸 */
.yt-frame iframe.wbf{position:absolute;left:0;top:0;height:calc(100% + 54px);max-width:none}
@media (hover:hover) and (pointer:fine){.yt-frame iframe.wbf{width:calc(100% + 17px)}}
.yt-share{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:12px 0 0}
.yt-lb .yt-share .btn{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.35);box-shadow:none}
.watch-cta{color:inherit;background:none;padding:0;margin-top:20px}
.yt-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 16px;margin:12px 0 0;padding:14px 16px;background:#1d1812;border-radius:12px;color:#fff;font-size:15px;text-align:center}
/* 播放清單目錄 */
.pl{margin-top:44px}
.pl-h{display:flex;justify-content:space-between;align-items:end;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.pl-h h2{font-size:clamp(22px,3vw,28px);margin:0}
.pl-h span{color:var(--muted);font-size:14px}
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,260px);gap:14px;overflow-x:auto;padding-bottom:10px;scroll-snap-type:x mandatory}
.rail>*{scroll-snap-align:start}
@media(max-width:640px){.rail{grid-auto-columns:72%}}
.split .path{grid-template-columns:1fr}.split .path li{padding:16px 18px 16px 62px}.split .path li::before{top:14px;font-size:22px}
/* 無障礙:對比度 */
:root{--line-green:#0a8a40}
.btn-line{background:#0a8a40}
.line-fab{background:#0a8a40}
.news-bar b{background:var(--brand-ink)}
footer.site .fh{color:var(--on-dark);margin:0 0 12px;font:700 15px var(--sans)}
/* 無障礙:文字對比 ≥ 4.5 */
:root{--brand:#94651f;--muted:#6b6358}
.btn-line,.line-fab{background:#087a39}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--brand:#d4a45a;--muted:#a3988a}}
.section.dark,.page-hero,.hero,.stats,.cta-band,.quote-card,.score,.biz,.tool{--muted:#b8ad9d}
.section.dark .eyebrow,.page-hero .eyebrow,.hero .eyebrow,.tool .eyebrow{color:var(--gold)}
.section.alt .eyebrow{color:var(--brand-ink)}

/* ===== 美感打磨 ===== */
.page-hero{position:relative;overflow:hidden}
.page-hero::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.07;
  background:repeating-linear-gradient(100deg,transparent 0 38px,#d4a45a 38px 39px);mask-image:linear-gradient(90deg,transparent,#000 60%)}
.page-hero .wrap{position:relative}
.section-head h2{position:relative}
.section-head .eyebrow::before{content:"";display:inline-block;width:22px;height:2px;background:currentColor;vertical-align:middle;margin-right:10px;opacity:.7}
.card,.vcard,.bookcard,.score,.gig,.award{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
@media(hover:hover){.card:hover,.bookcard:hover,.gig:hover{transform:translateY(-3px);box-shadow:0 18px 40px -18px rgba(40,28,10,.35)}
  .vcard:hover,.score:hover{transform:translateY(-3px)}
  .vcard:hover .vthumb::after{transform:scale(1.08);background-color:rgba(8,122,57,.9)}}
.vthumb::after{transition:transform .2s ease,background-color .2s ease}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}*{scroll-behavior:auto!important}}
::selection{background:#d4a45a;color:#16130f}

/* ===== 線上吉他教材 ===== */
.lesson-grid{display:grid;gap:32px}
@media(min-width:1000px){.lesson-grid{grid-template-columns:260px minmax(0,1fr)}}
.course-toc details{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px 16px}
@media(min-width:1000px){.course-toc{position:sticky;top:84px;align-self:start;max-height:calc(100vh - 100px);overflow:auto}}
.course-toc summary{font-weight:700;cursor:pointer}
.course-toc ol{margin:4px 0 10px;padding-left:20px;font-size:14px}
.course-toc li{margin:5px 0}
.course-toc a{text-decoration:none;color:var(--ink-2)}
.course-toc a:hover,.course-toc .cur a{color:var(--brand-ink);font-weight:700}
.toc-lv{margin:12px 0 2px;font-size:13px;font-weight:700;color:var(--brand-ink);letter-spacing:.1em}
.lesson{max-width:760px;font-size:17px;line-height:1.95}
.lesson h2{font-size:clamp(22px,3vw,28px);margin:44px 0 14px;scroll-margin-top:90px}
.lesson p{color:var(--ink-2)}
.lesson-meta{display:flex;flex-wrap:wrap;gap:12px;align-items:center;font-size:14px;color:var(--muted);margin-bottom:10px}
.lv{display:inline-block;font-size:13px;font-weight:700;border-radius:999px;padding:3px 12px;color:#fff;background:#3f7d58}
.lv-1{background:#8a5d1a}.lv-2{background:#7a2e2e}
.lead-in{font-size:18px;color:var(--ink)!important}
.ontoc-box{background:var(--bg-alt);border-radius:12px;padding:14px 18px;margin:20px 0;font-size:15px}
.ontoc{margin:6px 0 0;padding-left:20px}.ontoc a{color:var(--brand-ink)}
.ls{padding-left:22px;color:var(--ink-2)}.ls li{margin:6px 0}
.chords{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}
.chord{width:104px;height:auto;background:var(--surface);border:1px solid var(--line);border-radius:10px}
.chord .cn{font:700 15px var(--sans);fill:var(--ink)}
.chord .st{stroke:var(--muted);stroke-width:1.2}
.chord .nut{fill:var(--ink)}
.chord .dot{fill:var(--brand-ink)}
.chord .op{fill:none;stroke:var(--ink);stroke-width:1.5}
.chord .mk,.chord .fr{font:12px var(--sans);fill:var(--ink-2)}
.tabfig{margin:16px 0}
.tab{background:#16130f;color:#f4eee4;border-radius:10px;padding:16px;overflow-x:auto;font:15px/1.45 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;margin:0}
.tabfig figcaption{font-size:13px;color:var(--muted);margin-top:6px}
.strum{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;background:var(--bg-alt);border-radius:12px;padding:14px 18px;margin:14px 0}
.strum-seq{font:700 26px/1.2 var(--serif);letter-spacing:.2em;color:var(--brand-ink)}
.strum span:not(.strum-seq){font-size:14px;color:var(--ink-2)}
.tipbox{border-left:4px solid var(--brand);background:var(--brand-soft);border-radius:0 10px 10px 0;padding:12px 16px;margin:16px 0;color:var(--ink)}
.tbl{overflow-x:auto;margin:16px 0}
.tbl table{border-collapse:collapse;width:100%;font-size:15px;background:var(--surface)}
.tbl th,.tbl td{border:1px solid var(--line);padding:9px 12px;text-align:left}
.tbl th{background:var(--bg-alt)}
.summary{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px 22px;margin:32px 0}
.summary ul{margin:8px 0 0;padding-left:20px;color:var(--ink-2)}
.lesson .faq details{margin-bottom:10px}
.promo{display:grid;gap:14px;align-items:center;border-radius:16px;padding:20px 22px;margin:32px 0;background:linear-gradient(120deg,#1c1813,#2b2116);color:var(--on-dark);border:1px solid #3a3025}
@media(min-width:760px){.promo{grid-template-columns:1fr auto}}
.promo small{color:var(--gold);font-weight:700;letter-spacing:.08em;font-size:13px}
.promo b{display:block;font-family:var(--serif);font-size:20px;margin:4px 0 6px}
.promo p{margin:0;color:#d8cebf!important;font-size:15px}
.promo-btns{display:flex;flex-wrap:wrap;gap:8px}
.promo .btn-ghost-d{background:transparent;color:var(--on-dark);border-color:#5a4a36}
.promo-tool{background:linear-gradient(120deg,#12241a,#1c3a28);border-color:#2f5a40}
.promo-concert{background:linear-gradient(120deg,#2a1414,#3a1d1d);border-color:#5a2e2e}
.author{display:grid;grid-template-columns:88px 1fr;gap:16px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px;margin:32px 0}
.author img{width:88px;height:88px;border-radius:50%;object-fit:cover}
.author small{color:var(--brand-ink);font-weight:700;font-size:13px}
.author b{display:block;font-family:var(--serif);font-size:18px;margin:2px 0 6px}
.author p{margin:0 0 8px;font-size:15px}
.pn{display:grid;gap:12px;margin-top:28px}
@media(min-width:640px){.pn{grid-template-columns:1fr 1fr}}
.pn a{display:block;text-decoration:none;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.pn a:hover{border-color:var(--brand)}
.pn .nx{text-align:right}
.pn small{color:var(--muted);font-size:13px}.pn b{display:block;font-family:var(--serif);font-size:16px;line-height:1.5}
.lvblock{margin:48px 0}
.lvhead h2{font-size:clamp(24px,3.4vw,32px);margin:8px 0 6px}
.lvhead p{color:var(--ink-2);margin:0 0 16px}
.lessonlist{list-style:none;padding:0;margin:0;display:grid;gap:10px}
@media(min-width:860px){.lessonlist{grid-template-columns:1fr 1fr}}
.lessonlist a{display:flex;gap:14px;align-items:flex-start;text-decoration:none;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 16px;height:100%}
.lessonlist a:hover{border-color:var(--brand)}
.lessonlist .no{font:900 22px var(--serif);color:var(--brand-ink);min-width:34px}
.lessonlist b{display:block;font-size:16px}
.lessonlist small{display:block;color:var(--muted);font-size:14px;margin-top:2px}
.svc-card{position:relative}
.svc-no{position:absolute;top:16px;right:18px;font:900 22px var(--serif);color:var(--line)}
#donate{border-color:var(--brand);scroll-margin-top:90px}
.donate-line{font-size:15px;text-align:center;margin:10px 0}
.donate-line a{color:var(--brand-ink);font-weight:700}
#pay{scroll-margin-top:90px}
/* 樂器行 */
.pcard{display:flex;flex-direction:column}
.pc-ic{font-size:30px;line-height:1}
.pcard h3{margin:10px 0 6px}
.pcard .ls{font-size:15px;margin:10px 0 14px}
.accgrid{display:grid;gap:12px}
@media(min-width:760px){.accgrid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1080px){.accgrid{grid-template-columns:repeat(3,1fr)}}
.acc{display:grid;grid-template-columns:40px 1fr auto;gap:12px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.acc>span{font-size:26px;text-align:center}
.acc b{display:block}.acc small{color:var(--muted);font-size:14px}

/* ===== 藝術感:質感、光澤、音孔意象 ===== */
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:200;opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.hero{background:
  linear-gradient(100deg,rgba(22,19,15,.97) 0%,rgba(22,19,15,.9) 45%,rgba(22,19,15,.55) 100%),
  url("https://i0.wp.com/www.guitarlu.net/wp-content/uploads/2020/07/193a2cf58678b8841d300603r.jpg?fit=1024%2C678&ssl=1") center/cover no-repeat,#16130f}
.hero h1 em,.page-hero h1 span[style*="gold"]{background:linear-gradient(100deg,#f3d9a4 0%,#d4a45a 45%,#a8742a 100%);-webkit-background-clip:text;background-clip:text;color:transparent!important}
.hero h1{letter-spacing:.04em;text-shadow:0 2px 30px rgba(0,0,0,.35)}
.section.dark,.cta-band,.stats{position:relative;overflow:hidden}
.section.dark::before,.cta-band::before{content:"";position:absolute;width:560px;height:560px;right:-180px;top:-180px;border-radius:50%;pointer-events:none;
  background:repeating-radial-gradient(circle,transparent 0 22px,rgba(212,164,90,.08) 22px 23px);mask-image:radial-gradient(circle,#000 30%,transparent 70%)}
.section.dark>.wrap,.cta-band>.wrap{position:relative}
.section-head h2{font-weight:900;letter-spacing:.05em}
.section-head h2::after{content:"";display:block;width:56px;height:3px;margin-top:14px;border-radius:2px;background:linear-gradient(90deg,#d4a45a,transparent)}
.section-head[style*="text-align:center"] h2::after{margin-left:auto;margin-right:auto}
.page-hero h1{letter-spacing:.04em}
.card{border-radius:16px}
.btn{letter-spacing:.04em}
.btn-primary{background:linear-gradient(135deg,#a8742a,#7d5419)}
.btn-primary:hover{filter:brightness(1.1)}
.hero figure img{box-shadow:0 40px 80px -30px #000,0 0 0 1px rgba(212,164,90,.25)}
.stats b{background:linear-gradient(100deg,#f3d9a4,#d4a45a);-webkit-background-clip:text;background-clip:text;color:transparent}
.packs{display:grid;gap:18px}
@media(min-width:760px){.packs{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1180px){.packs{grid-template-columns:repeat(4,1fr)}}
.pack{display:flex;flex-direction:column;gap:6px;background:linear-gradient(170deg,#221d17,#16130f);color:var(--on-dark);border:1px solid #3a3025;border-radius:18px;padding:26px}
.pack small{color:var(--gold);font-weight:700;letter-spacing:.14em;font-size:13px;text-transform:uppercase}
.pack h3{font-size:22px;margin:2px 0 4px}
.pack p{color:#d8cebf;margin:0 0 6px;font-size:15px}
.pack .checks li{color:#d8cebf;font-size:15px}
.pack .btn{margin-top:auto;align-self:flex-start}
.pack:nth-child(2){border-color:var(--gold);box-shadow:0 20px 40px -20px rgba(212,164,90,.4)}
@media(min-width:1180px){.wplans{grid-template-columns:repeat(3,1fr)}}
.lesson-grid>*{min-width:0}.lesson pre,.lesson .tbl{max-width:100%}
@media(min-width:1180px){.packs:not(.wplans){grid-template-columns:repeat(3,1fr)}}
.mock{width:100%;height:auto;border-radius:18px;box-shadow:0 40px 80px -30px rgba(0,0,0,.6)}
.cmp2 td,.cmp2 th{text-align:center}.cmp2 td:first-child{text-align:left;font-weight:700}
.cmp2 .hl{background:var(--brand-soft);color:var(--brand-ink);font-weight:700}
.nav .menu>li.hot>a{color:#16130f!important;background:linear-gradient(135deg,#f3d9a4,#d4a45a);border-radius:999px;padding:7px 14px!important;margin:0 6px;box-shadow:none!important;font-weight:700}
.nav .menu>li.hot>a em{font-style:normal;font-size:11px;background:#087a39;color:#fff;border-radius:6px;padding:1px 6px;margin-left:6px;vertical-align:1px}
.navtoggle:checked~.menu>li.hot>a{color:var(--gold)!important;background:none;padding:12px 0!important;margin:0}
.hero-app{display:inline-flex;gap:10px;align-items:center;margin-top:22px;color:var(--on-dark);text-decoration:none;font-size:15px;border:1px solid rgba(212,164,90,.45);border-radius:999px;padding:8px 16px 8px 8px;background:rgba(212,164,90,.08)}
.hero-app span{background:#087a39;color:#fff;font-weight:700;font-size:13px;border-radius:999px;padding:3px 10px}
.hero-app:hover{border-color:var(--gold)}
@media(min-width:1080px) and (max-width:1279px){.nav .menu>li>a{padding:21px 8px;font-size:14px}.logo{font-size:15px}}
.cardt{font:700 20px var(--serif);margin:0 0 8px;color:var(--ink)}

/* ---- 演奏會海報與合照 ---- */
.gig-feature{display:grid;gap:28px;align-items:start}
.gig-feature>*{min-width:0}
@media(min-width:900px){.gig-feature{grid-template-columns:minmax(260px,380px) 1fr}}
.poster-fig{margin:0}
.poster-fig img,.posters.p4 img{display:block;width:100%;height:auto;aspect-ratio:1415/2000;border-radius:12px;background:#231d16;box-shadow:0 24px 48px -24px rgba(0,0,0,.55);cursor:zoom-in}
.poster-fig figcaption{margin-top:10px;font-size:14px;color:var(--muted);text-align:center}
.posters.p4{grid-template-columns:repeat(4,1fr)}
@media(max-width:760px){.posters.p4{grid-template-columns:1fr 1fr}.posters.p4 img:last-child{display:block}}
.crowd{display:grid;gap:12px;grid-template-columns:repeat(4,1fr)}
.crowd img{width:100%;height:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px}
.crowd img:first-child{grid-column:span 2;grid-row:span 2}
@media(max-width:760px){.crowd{grid-template-columns:1fr 1fr;gap:8px}}
.poster-zoom{position:fixed;inset:0;z-index:999;background:rgba(10,8,6,.92);display:flex;align-items:center;justify-content:center;padding:16px;cursor:zoom-out}
.poster-zoom img{max-width:100%;max-height:100%;border-radius:8px;box-shadow:0 30px 80px #000}

/* ---- LOGO 頭像(盧老師主視覺照) ---- */
.logo-img{width:36px;height:36px;border-radius:50%;object-fit:cover;border:2px solid var(--gold);flex:none}

/* ---- 照片統一調色:微提亮、偏暖、柔和對比(不含海報、書封、商品圖) ---- */
main img:not([data-poster]):not(.bookcard img):not(.posters img):not(.cover img):not([src*="ytimg"]):not([src$=".png"]):not([src*=".png?"]),
.logo-img{filter:brightness(1.04) contrast(.96) saturate(1.06) sepia(.06)}

/* ---- 演出紀事:縮圖卡 ---- */
.reels{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.reel{display:flex;flex-direction:column;background:var(--card,#fff);border:1px solid var(--line,#e8e0d4);border-radius:14px;overflow:hidden;text-decoration:none;color:inherit;transition:transform .2s,box-shadow .2s}
.reel:hover{transform:translateY(-3px);box-shadow:0 18px 36px -22px rgba(0,0,0,.45)}
.reel-img{display:block;aspect-ratio:16/9;background:#2a221a center/cover no-repeat}
.reel-body{display:flex;flex-direction:column;gap:4px;padding:14px 16px 16px}
.reel-body time{font:700 14px var(--serif);color:var(--brand);letter-spacing:.05em}
.reel-body b{font-size:17px;line-height:1.45}
.reel-body small{font-size:15px;color:var(--muted)}
.reel-body em{font-style:normal;font-size:14px;font-weight:700;color:var(--brand);margin-top:6px}
@media(max-width:560px){.reels{grid-template-columns:1fr 1fr;gap:10px}.reel-body{padding:10px 12px 12px}.reel-body b{font-size:15px}.reel-body small{font-size:13.5px}.reel-body em{font-size:13px}}
@media(max-width:899px){.poster-fig{max-width:340px;margin:0 auto}}
.yt-chip{display:inline-flex;align-items:center;gap:4px;margin:2px 0 2px 6px;padding:2px 10px;border-radius:999px;background:#c4302b;color:#fff!important;font-size:13px;font-weight:700;text-decoration:none;white-space:nowrap;vertical-align:1px}
.yt-chip:hover{background:#a52520}
.crowd>a{display:block;border-radius:10px;overflow:hidden}
.crowd>a:first-child{grid-column:span 2;grid-row:span 2}
.crowd>a img{border-radius:0}
.crowd img:first-child{grid-column:auto;grid-row:auto}
.posters>a{display:block}
.sub-h{margin:34px 0 14px;font:700 20px var(--serif)}
.mini-tl{list-style:none;padding:0;margin:22px 0 0;display:flex;flex-wrap:wrap;gap:10px}
.mini-tl li{background:var(--card,#fff);border:1px solid var(--line,#e8e0d4);border-radius:999px;padding:6px 14px;font-size:15px}
.mini-tl b{color:var(--brand);margin-right:6px}
.posters>a img{display:block!important;width:100%;aspect-ratio:724/1024;object-fit:cover;border-radius:10px}
.vthumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.vthumb::after{position:absolute;inset:0;margin:auto;z-index:1}
.vshare{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}
.vcard .vshare span{font-size:12.5px;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:3px 10px;cursor:pointer;line-height:1.5}
.vcard .vshare span:hover{color:var(--brand);border-color:var(--brand)}
.dark .vcard .vshare span{border-color:#4a3d2e}
.vfilter button{font:inherit;cursor:pointer;border:1px solid var(--line,#e0d6c6);background:var(--card,#fff);color:inherit;border-radius:999px;padding:8px 14px;font-size:15px;white-space:nowrap}
.vfilter button.on{background:var(--brand);border-color:var(--brand);color:#fff}

.reel{display:flex;flex-direction:column}
.reel-img{cursor:zoom-in}
.reel-play{display:inline-block;margin-top:8px;font-size:14px;font-weight:700;color:var(--brand);text-decoration:none}
.reel-play:hover{text-decoration:underline}
.fbwrap{display:grid;gap:22px;justify-content:center;grid-template-columns:repeat(auto-fit,minmax(280px,500px))}
.fbbox{background:var(--card,#fff);border:1px solid var(--line,#e8e0d4);border-radius:14px;overflow:hidden;min-height:200px}
.fbbox iframe{display:block;width:100%;max-width:500px}
.fbnote{margin-top:14px;font-size:14px;color:var(--muted);text-align:center}
.mapbox{border-radius:16px;overflow:hidden;border:1px solid var(--line,#e8e0d4)}.mapbox iframe{display:block;width:100%;height:380px;border:0}@media(max-width:560px){.mapbox iframe{height:300px}}
.vtools{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:16px}
.vtools input{flex:1 1 260px;font:inherit;font-size:16px;padding:11px 16px;border-radius:999px;border:1px solid var(--line,#e0d6c6);background:var(--card,#fff);color:inherit}
.vtools span{font-size:14px;color:var(--muted)}
.vlib:not(.ready) .vcard:nth-child(n+25){display:none}
.press2{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.presscard{display:flex;flex-direction:column;gap:8px;padding:18px 20px;border-radius:14px;background:var(--card,#fff);border:1px solid var(--line,#e8e0d4);text-decoration:none;color:inherit;transition:transform .2s,box-shadow .2s}
.presscard:hover{transform:translateY(-2px);box-shadow:0 16px 32px -22px rgba(0,0,0,.4)}
.presscard small{font-size:13.5px;color:var(--brand);font-weight:700}
.presscard b{font-size:17px;line-height:1.5}
.presscard em{font-style:normal;font-size:14px;color:var(--muted);margin-top:auto}

/* ---- 手機選單:手風琴式(點大項右邊 ▾ 展開子項,一次開一個) ---- */
@media(max-width:1079px){
  .navtoggle:checked~.menu .sub{display:none}
  .navtoggle:checked~.menu li.open>.sub{display:block}
  .navtoggle:checked~.menu .has-sub>a{display:flex;align-items:center;justify-content:space-between}
  .navtoggle:checked~.menu .caret{display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:40px;margin:-10px -10px -10px 8px;font-size:18px;color:var(--gold);transition:transform .2s}
  .navtoggle:checked~.menu li.open .caret{transform:rotate(180deg)}
  .navtoggle:checked~.menu .sub a{padding:10px 0;font-size:15px;display:block}
}
.totop{position:fixed;right:16px;bottom:92px;z-index:60;width:44px;height:44px;border-radius:50%;border:1px solid #3a3025;background:rgba(22,19,15,.88);color:#f3e6cf;font-size:18px;display:none;align-items:center;justify-content:center;cursor:pointer}
.totop.on{display:flex}
@media(min-width:960px){.totop{bottom:96px;right:24px}}
@media(max-width:1079px){
  .navtoggle:checked~.menu>li.hot>a{justify-content:flex-start;gap:8px;border:0!important;border-bottom:1px solid #2a231b!important;border-radius:0!important;box-shadow:none!important}
  .navtoggle:checked~.menu>li.hot>a .caret{margin-left:auto}
}
@media(max-width:760px){
  .vfilter{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:4px;margin-right:-16px;padding-right:16px}
  .vfilter::-webkit-scrollbar{display:none}
  .vfilter button{flex:none}
}
@media(max-width:560px){
  .vlib{grid-template-columns:1fr 1fr;gap:10px}
  .vlib .vbody{padding:8px 10px 10px}
  .vlib .vbody b{font-size:14px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .vlib .vbody span{font-size:12.5px}
}

/* ---- 頂端免費工具列(每頁) ---- */
.toolbar{background:#221c15;border-bottom:1px solid #3a3025}
.toolbar .wrap{display:flex;align-items:center;gap:6px;overflow-x:auto;scrollbar-width:none;padding-top:6px;padding-bottom:6px}
.toolbar .wrap::-webkit-scrollbar{display:none}
.toolbar span{flex:none;font-size:13px;color:var(--gold);font-weight:700;margin-right:6px;letter-spacing:.05em}
.toolbar a{flex:none;font-size:14px;color:#efe3cd;text-decoration:none;padding:6px 12px;border-radius:999px;border:1px solid #3d3326;white-space:nowrap}
.toolbar a:hover{border-color:var(--gold);color:#fff}
/* ---- 工具頁 ---- */
.toolnav{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.toolnav a{padding:9px 16px;border-radius:999px;border:1px solid var(--line,#e0d6c6);background:var(--card,#fff);text-decoration:none;color:inherit;font-size:15px}
.toolnav a:hover{border-color:var(--brand)}
.tuner-embed{border-radius:18px;overflow:hidden;background:#0d0b09;border:1px solid #3a3025;box-shadow:0 30px 60px -30px rgba(0,0,0,.6)}
.tuner-embed iframe{display:block;width:100%;height:min(78vh,640px);border:0}
.tuner-tip{margin-top:14px;font-size:16px}
kbd{display:inline-block;min-width:1.8em;padding:2px 8px;border-radius:6px;border:1px solid var(--line,#d8ccb8);border-bottom-width:2px;background:var(--card,#fff);font:600 14px/1.5 ui-monospace,Menlo,Consolas,monospace;text-align:center}
.credit .vbody span{color:var(--brand);font-weight:700;font-size:14px}

/* ---- 工具列改細:純文字、無外框 ---- */
.toolbar{background:#1b1612;border-bottom:1px solid #2c241b}
.toolbar .wrap{gap:0;padding-top:0;padding-bottom:0;min-height:36px}
.toolbar span{font-size:12.5px;margin-right:12px;opacity:.9}
.toolbar a{border:0;border-radius:0;padding:8px 0;font-size:13.5px;color:#cdbfa6}
.toolbar a+a::before{content:"·";margin:0 12px;color:#5c4f3d}
.toolbar a:hover{color:var(--gold)}
@media(min-width:1080px){.toolbar .wrap{justify-content:flex-end}}
/* ---- 首頁主視覺:照片不要過高,左右對齊 ---- */
@media(min-width:960px){
  .hero .wrap{grid-template-columns:1.3fr .8fr;padding-top:64px;padding-bottom:80px}
  .hero figure{max-width:470px;justify-self:end;width:100%}
  .hero figure img{aspect-ratio:4/5}
}
@media(min-width:960px){.hero figure{max-width:460px}.hero figure img{aspect-ratio:1/1}}
.hero-app span{white-space:nowrap;flex:none}

/* ---- 選單整理:第一項改金色文字,電腦版不顯示第二排工具列 ---- */
@media(min-width:1080px){
  .nav .menu>li.hot>a{background:none!important;color:var(--gold)!important;padding:21px 12px!important;margin:0;border-radius:0;font-weight:700}
  .nav .menu>li.hot>a:hover{color:#f3d9a4!important}
  .toolbar{display:none}
}
.reel-fb{display:flex!important;align-items:center;justify-content:center;background:radial-gradient(circle at 30% 30%,#3b2f1f,#14100c)!important;cursor:pointer}
.reel-fb span{color:#f3d9a4;font-weight:700;font-size:16px;border:1px solid #6b5436;border-radius:999px;padding:8px 16px}
/* ---- 出版年表 ---- */
.pubs{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.pubs li{display:grid;grid-template-columns:96px 1fr;gap:16px;padding:16px 18px;border-radius:14px;background:var(--card,#fff);border:1px solid var(--line,#e8e0d4)}
.pubs time{font:700 16px var(--serif);color:var(--brand)}
.pubs b{display:block;font-size:17px;line-height:1.5}
.pubs span{display:block;font-size:15px;color:var(--muted);margin-top:2px}
.shops{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 0}
.shop{font-size:14px;font-weight:700;text-decoration:none;padding:6px 12px;border-radius:999px;border:1px solid var(--line,#d8ccb8);color:inherit}
.shop.bk{background:var(--brand);border-color:var(--brand);color:#fff}
.shop:hover{border-color:var(--brand)}
@media(max-width:560px){.pubs li{grid-template-columns:1fr;gap:4px}}
.brand-role{color:var(--brand);font-weight:700;font-size:15px;margin:-4px 0 8px}
.vthumb-b{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#2a2018,#4a3622);aspect-ratio:16/9}
.vthumb-b span{color:#f3d9a4;font-weight:700;border:1px solid #6b5436;border-radius:999px;padding:6px 14px}
.feature small{color:var(--brand);font-weight:700;font-size:13.5px}
.feature h3{margin:6px 0 10px;font-size:19px}
.feature blockquote{margin:12px 0;padding:10px 14px;border-left:3px solid var(--gold);background:rgba(212,164,90,.08);font-family:var(--serif);font-size:16px;line-height:1.7}
.radio{list-style:none;padding:0;margin:0;display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.radio li{padding:10px 14px;border-radius:12px;background:var(--card,#fff);border:1px solid var(--line,#e8e0d4);font-size:15px}
.radio time{display:inline-block;min-width:3.4em;font-weight:700;color:var(--brand)}
@media(max-width:560px){.radio{grid-template-columns:1fr}}
/* ---- 首頁重點資歷 ---- */
.creds{background:linear-gradient(180deg,#16130f,#1d1813);border-top:1px solid #2c241b;border-bottom:1px solid #2c241b}
.creds .wrap{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));padding-top:20px;padding-bottom:20px}
.cred{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:14px;border:1px solid #3a3025;text-decoration:none;color:#d9ccb5;font-size:14.5px;line-height:1.55;transition:border-color .2s}
.cred:hover{border-color:var(--gold)}
.cred i{font-style:normal;font-size:22px;line-height:1.2}
.cred b{display:block;color:#f3e6cf;font-size:16px}
.cred.win{border-color:var(--gold);background:linear-gradient(135deg,rgba(212,164,90,.18),rgba(212,164,90,.04))}
.cred.win b{color:var(--gold)}
.award li.won{color:var(--gold);font-weight:700}
@media(max-width:560px){.creds .wrap{grid-template-columns:1fr 1fr;gap:8px}.cred{padding:10px;font-size:13px;gap:8px}.cred b{font-size:14.5px}.cred i{font-size:18px}.cred.win{grid-column:1/-1}}
.award li.won{color:var(--brand)}
.section.dark .award li.won,.dark .award li.won{color:var(--gold)}
.award.hero-award{grid-column:1/-1;border:2px solid var(--gold);background:linear-gradient(135deg,rgba(212,164,90,.16),rgba(255,255,255,.6));padding:26px 28px}
.award.hero-award b{font-size:clamp(22px,2.6vw,30px);color:var(--brand);line-height:1.35;display:block;margin:6px 0 10px}
.award.hero-award p{font-size:16.5px;line-height:1.8;margin:0 0 12px}
.award.hero-award.singer{border-color:#b7892f}
.ml-chip{display:inline-flex;align-items:center;margin:2px 0 2px 6px;padding:2px 10px;border-radius:999px;border:1px solid var(--line,#d8ccb8);font-size:12.5px;font-weight:700;text-decoration:none;color:var(--brand);white-space:nowrap;vertical-align:1px}
.ml-chip+.ml-chip{margin-left:4px}
.ml-chip:hover{border-color:var(--brand)}
.ph-chip{display:inline-flex;align-items:center;gap:4px;margin:2px 0 2px 6px;padding:2px 10px;border-radius:999px;background:var(--brand);color:#fff!important;font-size:13px;font-weight:700;text-decoration:none;white-space:nowrap;vertical-align:1px}
/* ---- 重要演出:每段附影片縮圖 ---- */
.hl-row{display:flex;gap:10px;margin-top:12px;overflow-x:auto;scrollbar-width:thin;padding-bottom:4px}
.hl-v{flex:none;width:168px;text-decoration:none;color:inherit}
.hl-t{position:relative;display:block;aspect-ratio:16/9;border-radius:10px;background:#2a2018 center/cover no-repeat;overflow:hidden}
.hl-t i{position:absolute;inset:auto auto 8px 8px;font-style:normal;background:rgba(0,0,0,.65);color:#fff;border-radius:999px;padding:2px 9px;font-size:12.5px}
.hl-b{display:flex;align-items:center;justify-content:center;color:#f3d9a4;font-weight:700;background:linear-gradient(135deg,#2a2018,#4a3622)}
.hl-v small{display:block;font-size:13px;line-height:1.45;margin-top:6px;color:var(--muted)}
.hl-v:hover .hl-t{outline:2px solid var(--gold)}
@media(max-width:560px){.hl-v{width:140px}}
.menu .sub .sub-group{font-size:12px;letter-spacing:.08em;color:var(--gold);font-weight:700;padding:10px 12px 4px;opacity:.85;pointer-events:none}
.menu .sub .sub-group:first-child{padding-top:4px}
@media(max-width:1079px){.navtoggle:checked~.menu .sub .sub-group{padding:12px 0 2px;font-size:12.5px}}
.tel-fab{position:fixed;right:22px;bottom:84px;z-index:70;display:none;align-items:center;gap:8px;background:#1d1813;color:#f3e6cf;text-decoration:none;font-weight:700;font-size:14px;border:1px solid #3a3025;border-radius:999px;padding:10px 16px;box-shadow:0 12px 28px -8px rgba(0,0,0,.45)}
.tel-fab svg{width:18px;height:18px;color:var(--gold)}
.tel-fab:hover{border-color:var(--gold)}
@media(min-width:960px){.tel-fab{display:inline-flex}.totop{bottom:140px}}
.tl li,.tl li>div,.hl-row{min-width:0}.tl.hl li>div{overflow:hidden}
/* 電話鈕改為圓形圖示,滑過才顯示號碼 */
.tel-fab{width:48px;height:48px;padding:0;justify-content:center;gap:0;right:30px;bottom:88px}
.tel-fab span{position:absolute;right:58px;white-space:nowrap;background:#1d1813;border:1px solid #3a3025;border-radius:999px;padding:6px 12px;font-size:14px;opacity:0;pointer-events:none;transform:translateX(6px);transition:.2s}
.tel-fab:hover span,.tel-fab:focus-visible span{opacity:1;transform:none}
.tel-fab svg{width:20px;height:20px}
/* 手機底部按鈕:變薄;往下讀時收起,往上滑或到頂/到底時出現 */
@media(max-width:959px){
  .m-cta{bottom:10px;left:14px;right:14px;gap:8px;transition:transform .28s ease,opacity .28s ease}
  .m-cta .btn{min-height:46px;padding:9px 10px;font-size:14.5px}
  .m-cta.hide{transform:translateY(90px);opacity:0;pointer-events:none}
}
/* 首頁:過期海報縮成歷屆場次縮圖 */
.past{margin-top:30px;padding-top:20px;border-top:1px solid #3a3025}
.past-h{font-size:14px;letter-spacing:.08em;color:var(--gold);margin:0 0 12px;font-weight:700}
.past-row{display:flex;gap:12px;flex-wrap:wrap}
.past-p{position:relative;display:block;width:96px}
.past-p img{width:96px;aspect-ratio:724/1024;object-fit:cover;border-radius:8px;filter:saturate(.6) brightness(.85)!important;transition:filter .2s}
.past-p:hover img{filter:none!important}
.past-p span{position:absolute;left:6px;top:6px;font-size:11.5px;font-weight:700;background:rgba(0,0,0,.7);color:#e9dcc4;border-radius:6px;padding:1px 6px}
.posters a.ended{position:relative}
.posters a.ended span{position:absolute;left:10px;top:10px;font-size:13px;font-weight:700;background:rgba(0,0,0,.72);color:#f0e4cd;border-radius:8px;padding:3px 10px}
.posters a.ended img{filter:saturate(.75)!important}
.crowd4{display:grid;gap:10px;grid-template-columns:repeat(4,1fr)}
.crowd4 a{display:block;border-radius:10px;overflow:hidden}
.crowd4 img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;transition:transform .3s}
.crowd4 a:hover img{transform:scale(1.04)}
@media(max-width:760px){.crowd4{grid-template-columns:1fr 1fr;gap:8px}}
.past-p{width:120px}
.past-p img{width:120px}
.past-p span{left:auto;right:6px;top:auto;bottom:34px;font-size:11px}
.past-p small{display:block;margin-top:6px;font-size:12.5px;line-height:1.4;color:#cdbfa6;text-align:center}
@media(max-width:560px){.past-row{gap:10px}.past-p,.past-p img{width:calc((100vw - 52px)/3)}}
.past-p img{filter:saturate(.9) brightness(.97)!important}.posters a.ended img{filter:saturate(.92)!important}
@media(min-width:1080px){.creds .wrap{grid-template-columns:repeat(4,1fr)}}
.contrib .c-ic{font-size:28px;line-height:1}
.contrib h3{margin:10px 0 8px;font-size:18px}
.contrib p{font-size:15.5px;line-height:1.75;margin:0}
.contrib-link{text-align:center;margin:14px auto 0;font-size:15.5px}.contrib-link a{color:var(--gold,#c9a14a);font-weight:600;text-decoration:none}.contrib-link a:hover{text-decoration:underline}
/* news-bar: 演奏會公告加強 */
.news-bar{background:linear-gradient(90deg,#2a1d10,#4a3016 55%,#2a1d10);border-bottom:2px solid var(--gold)}
.news-bar .wrap{gap:16px;padding-top:16px;padding-bottom:16px;font-size:17px;color:var(--on-dark);justify-content:center}
.news-bar b{background:var(--gold)!important;color:#1d1a16;font-size:16px;padding:6px 14px;border-radius:999px;letter-spacing:.04em;animation:nbPulse 2.4s ease-in-out infinite}
.news-bar strong{color:var(--gold);font-size:19px;margin-right:4px}
.news-bar em{font-style:normal;color:var(--on-dark-muted)}
.news-bar a{background:var(--gold);color:#1d1a16!important;padding:9px 18px;border-radius:999px;text-decoration:none;font-size:16px;white-space:nowrap;box-shadow:0 4px 14px -4px rgba(212,164,90,.6)}
.news-bar a:hover{background:#e6b86c}
@keyframes nbPulse{0%,100%{box-shadow:0 0 0 0 rgba(212,164,90,.55)}50%{box-shadow:0 0 0 8px rgba(212,164,90,0)}}
@media (max-width:640px){.news-bar .wrap{font-size:15.5px;gap:10px;text-align:center}.news-bar strong{font-size:17px}.news-bar em{display:block}}
@media (prefers-reduced-motion:reduce){.news-bar b{animation:none}}
/* ---- 下拉選單 v2：圖示＋說明，分組選單兩欄 ---- */
.menu .sub .si{flex:none;width:24px;text-align:center;font-size:17px;line-height:1.35}
.menu .sub .st{display:flex;flex-direction:column;min-width:0}
.menu .sub .st b{font-weight:500;color:var(--on-dark);font-size:15px;line-height:1.4}
.menu .sub .st small{font-size:12.5px;color:var(--on-dark-muted);line-height:1.45;margin-top:2px}
.menu .sub-col ul{list-style:none;margin:0;padding:0}
.menu .sub .sub-group{margin:0;border-bottom:1px solid #3a3025;opacity:1}
@media(min-width:1080px){
  .nav .menu .sub{min-width:290px;padding:10px}
  .nav .menu .sub a{display:flex;gap:10px;align-items:flex-start;padding:9px 12px}
  .nav .menu .sub a:hover .st b{color:var(--gold)}
  .nav .menu .sub.mega{min-width:600px;grid-template-columns:1fr 1fr;gap:0 10px}
  .nav .menu>li:hover>.sub.mega,.nav .menu>li:focus-within>.sub.mega{display:grid}
  .nav .menu .sub-col .sub-group{padding:6px 12px 8px;margin:0 0 6px}
  .nav .menu>li:nth-last-child(-n+2)>.sub{left:auto;right:0}
}
@media(max-width:1079px){
  .navtoggle:checked~.menu .sub a{display:flex;gap:10px;align-items:center;padding:10px 0}
  .navtoggle:checked~.menu .sub .st small{display:none}
  .navtoggle:checked~.menu .sub .si{font-size:15px}
  .navtoggle:checked~.menu .sub-col .sub-group{padding:12px 0 6px;margin-bottom:2px}
}
/* 讀譜器實際畫面 */
.appshot{margin:8px 0 0;border-radius:16px;overflow:hidden;background:#1d1a16;box-shadow:0 24px 50px -20px rgba(40,28,10,.45);border:1px solid #2e271e;aspect-ratio:1400/678}
.appshot img{display:block;width:100%;height:auto;cursor:zoom-in}
.appshot-cap{font-size:14px;color:var(--muted);text-align:center;margin:10px 0 0}
.appshot-checks{display:flex;flex-wrap:wrap;gap:8px 28px;justify-content:center;margin-top:18px}

.bili-guard{position:absolute;left:0;right:0;top:0;height:22%;min-height:56px;z-index:2}
.yt-nets{flex-basis:100%;display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.yt-nets button{font:inherit;font-size:13px;padding:4px 12px;border-radius:999px;cursor:pointer;background:transparent;color:inherit;border:1px solid var(--line)}
.yt-lb .yt-nets button{color:#fff;border-color:rgba(255,255,255,.3)}
.yt-nets button:hover{border-color:var(--brand);color:var(--brand)}
#watch .yt-share .btn{background:transparent;color:inherit;border:1px solid var(--line);box-shadow:none}
.watch-news{margin:0 0 16px;padding:12px 16px;border-radius:12px;background:var(--surface);border:1px solid var(--brand);font-weight:700}.watch-news a{color:inherit;text-decoration:none}
.yt-box .yt-back{position:absolute;left:0;top:-46px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:999px;padding:6px 14px;font:inherit;font-size:15px;cursor:pointer}
.pubs li.pub{grid-template-columns:120px 1fr;align-items:start}
.pub-cover{margin:0}.pub-cover img{width:120px;height:auto;display:block;border-radius:6px;box-shadow:0 4px 14px rgba(0,0,0,.15);background:#f3ede3}
.pub-cover figcaption{font-size:12px;color:var(--muted);margin-top:4px;text-align:center}
.pub-none{width:120px;aspect-ratio:3/4;border-radius:6px;border:1px dashed var(--line,#d8cdbd);display:grid;place-items:center;text-align:center;font-size:13px;color:var(--muted)}
.pubs li.pub time{display:block;font-size:14px}
@media(max-width:560px){.pubs li.pub{grid-template-columns:96px 1fr;gap:12px}.pub-cover img,.pub-none{width:96px}}
.pub-note{font-size:13px;color:var(--muted)}
.pub-tile{width:120px;aspect-ratio:3/4;border-radius:6px;background:linear-gradient(160deg,#3a2c1d,#6b4f2e);color:#f6ead3;display:flex;flex-direction:column;justify-content:space-between;padding:12px 10px;box-shadow:0 4px 14px rgba(0,0,0,.15)}
.pub-tile b{font-family:var(--serif);font-size:14px;line-height:1.4}.pub-tile small{font-size:11px;letter-spacing:.1em;opacity:.8}
@media(max-width:560px){.pub-tile{width:96px}}

/* 站內音樂播放器與報導閱讀視窗(partials.js) */
.yt-lb.lb-music .yt-frame,.yt-lb.lb-read .yt-frame{aspect-ratio:auto;background:#fffdf9;color:#2a241d}
.yt-lb.lb-music .yt-box{width:min(680px,100%)}
.mu{padding:18px 18px 12px}.mu b{display:block;font-size:17px;margin:0 0 12px;line-height:1.5}
.mu iframe{width:100%;height:190px;border:0;border-radius:10px;display:block}
.yt-lb.lb-read .yt-box{width:min(960px,100%)}
.yt-lb.lb-read .yt-frame{max-height:calc(100vh - 230px);max-height:calc(100dvh - 230px);overflow:auto;-webkit-overflow-scrolling:touch}
.rd{padding:22px 22px 18px}.rd small{color:var(--brand);font-weight:700;font-size:14px}
.rd h3{margin:6px 0 10px;font-size:clamp(19px,3vw,24px);line-height:1.45}.rd p{margin:0 0 12px;line-height:1.8}
.rd iframe{width:100%;height:70vh;height:70dvh;border:1px solid #e8e0d4;border-radius:10px;display:block;background:#fff}
.rd-note{font-size:14px;color:#7a6f62}
button.ml-chip,a.ml-chip{cursor:pointer}
.rd iframe[src*="facebook.com/plugins"]{max-width:500px;margin:0 auto;height:75vh;height:75dvh}
/* 返回／關閉鈕固定在畫面角落:大螢幕影片撐滿時也看得到 */
.yt-box .yt-back{position:fixed;left:14px;top:14px;z-index:102;background:rgba(20,16,12,.85)}
.yt-box .yt-x{position:fixed;right:14px;top:10px;z-index:102}
.yt-lb{overflow-y:auto}
.yt-credit{margin:10px 0 0;text-align:center;color:#f3d9a4;font-weight:700;font-size:16px;letter-spacing:.05em}

/* 影片小視窗:先在右下角播放,不蓋住頁面文字;按「⤢ 放大」才變大 */
.yt-mbar{display:none}
.yt-lb.lb-mini{inset:auto 22px 22px auto;width:min(420px,calc(100vw - 16px));background:none;padding:0;display:block;overflow:visible}
.yt-lb.lb-mini .yt-box{width:100%;background:#16130f;border:1px solid #3a3025;border-radius:12px;overflow:hidden;box-shadow:0 18px 40px -10px rgba(0,0,0,.6)}
.yt-lb.lb-mini .yt-mbar{display:flex;align-items:center;gap:6px;padding:6px 6px 6px 12px;color:#f3e6cf}
.yt-mbar .yt-mt{flex:1;min-width:0;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:move}
.yt-lb.lb-mini .yt-mbar{touch-action:none;user-select:none;-webkit-user-select:none}
.yt-mbar button{flex:none;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25);color:#fff;border-radius:999px;padding:4px 12px;font:inherit;font-size:14px;line-height:1.6;cursor:pointer}
.yt-mbar button:hover{border-color:var(--gold)}
.yt-mbar .yt-mx{padding:4px 10px}
.yt-lb.lb-mini .yt-frame{border-radius:0}
.yt-lb.lb-mini .yt-back,.yt-lb.lb-mini .yt-x,.yt-lb.lb-mini .yt-share,.yt-lb.lb-mini .yt-cta,.yt-lb.lb-mini .yt-credit{display:none}
body.vmini .line-fab,body.vmini .tel-fab,body.vmini .totop{display:none!important}
@media(max-width:959px){.yt-lb.lb-mini{right:8px;bottom:84px;width:min(320px,76vw)}.yt-mbar .yt-mt{font-size:13px}.yt-mbar button{padding:3px 10px;font-size:13px}}
/* 老師 09-26:小視窗=正常橫向影片+一行字幕(摘要・段落只在「⤢ 放大」後顯示,原本塞進小視窗會撐成一整條、深色字又疊在深色底上看不見);
   四角四邊可拖曳調大小;電腦版可「⧉」跳出成獨立視窗 */
.yt-lb.lb-mini .yt-box{color:#f3e6cf}
.yt-lb.lb-mini .tx{margin:0}
.yt-lb.lb-mini .tx-bar,.yt-lb.lb-mini .tx-hl{display:none!important}
.yt-lb.lb-mini .tx-cap{border-radius:0;margin:0;padding:6px 12px;min-height:0}
.yt-lb .lb-rz{display:none}
.yt-lb.lb-mini .lb-rz{display:block;position:absolute;z-index:6;touch-action:none}
.lb-rz[data-d=n]{top:0;left:14px;right:14px;height:6px;cursor:ns-resize}
.lb-rz[data-d=s]{bottom:0;left:14px;right:14px;height:6px;cursor:ns-resize}
.lb-rz[data-d=w]{left:0;top:14px;bottom:14px;width:6px;cursor:ew-resize}
.lb-rz[data-d=e]{right:0;top:14px;bottom:14px;width:6px;cursor:ew-resize}
.lb-rz[data-d=nw]{left:0;top:0;width:14px;height:14px;cursor:nwse-resize}
.lb-rz[data-d=se]{right:0;bottom:0;width:14px;height:14px;cursor:nwse-resize}
.lb-rz[data-d=ne]{right:0;top:0;width:14px;height:14px;cursor:nesw-resize}
.lb-rz[data-d=sw]{left:0;bottom:0;width:14px;height:14px;cursor:nesw-resize}
.yt-lb.lb-rzing iframe{pointer-events:none}
.yt-mbar .yt-pop{display:none}
@media(hover:hover) and (pointer:fine){.yt-lb.lb-mini .yt-mbar .yt-pop{display:inline-block}}

/* 上課區域地圖(location.html,Leaflet) */
#areamap{height:460px;width:100%;border-radius:18px;z-index:0}
@media (max-width:640px){#areamap{height:380px}}
.map-legend{display:flex;flex-wrap:wrap;gap:8px 18px;margin:12px 0 0;font-size:14px;color:var(--muted)}
.map-legend span{display:inline-flex;align-items:center;gap:6px}
.lg{display:inline-block;width:14px;height:14px;border-radius:50%}
.lg-area{background:rgba(200,145,63,.35);border:2px solid #9a6b2f}.lg-mrt{background:#1f6fb2}.lg-bus{background:#fff;border:2px solid #2b7a4b}.lg-yb{background:#f4c20d}
.transit{margin-top:18px}.transit h3{margin-top:0}
.bus-list{list-style:none;padding:0;margin:0 0 8px;font-size:14.5px;line-height:1.6}.bus-list li{padding:4px 0;border-bottom:1px dashed var(--line,#e8e0d4)}.bus-list b{display:block}
.mk{background:none;border:0}
.mk-mrt{position:relative;width:24px;height:24px;margin:-12px 0 0 -12px}
.mk-mrt b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#1f6fb2;color:#fff;font-size:13px;box-shadow:0 1px 4px rgba(0,0,0,.35)}
.mk-mrt span{position:absolute;left:30px;top:1px;white-space:nowrap;background:#fff;padding:2px 8px;border-radius:999px;font-size:13px;font-weight:700;box-shadow:0 1px 4px rgba(0,0,0,.25)}
.mk-bus,.mk-yb{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#fff;font-size:14px;box-shadow:0 1px 4px rgba(0,0,0,.35);margin:-13px 0 0 -13px;cursor:pointer}
.mk-bus{border:2px solid #2b7a4b}.mk-yb{background:#f4c20d}
.area-tip{background:rgba(255,253,249,.92);border:1px solid #9a6b2f;color:#5a3d17;font-weight:700;text-align:center;font-size:13px}
.mk-mrt.mk-left span{left:auto;right:30px}
.tmns{columns:3 300px;column-gap:18px}.tmn{break-inside:avoid;margin:0 0 18px}.tmn h3{margin:0 0 8px;font-size:17px}.tmn p{margin:0 0 8px;line-height:1.8}
.tmn summary{list-style:none;cursor:pointer}.tmn summary::-webkit-details-marker{display:none}.tmn-more{color:var(--brand);font-weight:700;font-size:14px}.tmn details[open] summary{display:none}
.tmn-by{color:var(--muted);font-size:13px;text-align:right;margin-top:6px}
.yb-list{columns:2;column-gap:14px;font-size:14px}.yb-list li{break-inside:avoid}
.yb-h{margin:0 0 4px;font-weight:700;font-size:14px}.yb-more{margin:6px 0 8px}.yb-more summary{cursor:pointer;font-weight:700;font-size:14px;color:var(--brand);padding:4px 0}
.mk-yb{width:22px;height:22px;font-size:12px;margin:-11px 0 0 -11px}
/* FB 影片卡:沒有縮圖,用曲名當封面 */
.vthumb-f{display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:center;background:linear-gradient(135deg,#231a12,#3f2d1b 60%,#5a4026);aspect-ratio:16/9;padding:10px;text-align:center}
.vthumb-f em{font-style:normal;font:700 19px/1.3 var(--serif);color:#f6e7c8;max-width:92%;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.vthumb-f span{color:#f3d9a4;font-size:12.5px;font-weight:700;border:1px solid #6b5436;border-radius:999px;padding:4px 12px}
.vthumb-f{justify-content:flex-end;padding-bottom:16px}
.vthumb-f em{font-size:17px;background:rgba(0,0,0,.35);padding:3px 12px;border-radius:8px}
/* FB 影片縮圖 */
.vthumb-f{position:relative;overflow:hidden}
.vthumb-f img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vthumb-f em{position:relative;z-index:1}
/* 教室照片區 */
.phgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.phgrid figure{margin:0;position:relative;background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}
.phgrid img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;cursor:zoom-in;background:var(--bg-alt)}
.phgrid figcaption{font-size:13.5px;line-height:1.55;color:var(--ink-2);padding:10px 12px}
.ph-doc img{object-fit:contain;background:#f4efe6}
.ph-poster{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
.ph-poster img{aspect-ratio:3/4}
.ph-poster .ended{position:absolute;top:10px;left:10px;background:rgba(29,26,22,.82);color:#f3e6cf;font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px}
.ph-one{grid-template-columns:minmax(0,760px);justify-content:center}
.ph-one img{aspect-ratio:auto;object-fit:contain;max-height:720px;background:#1d1a16}
/* 影片牆:一排 4～5 支,卡片精簡,少捲動 */
.vgrid{grid-template-columns:1fr 1fr;gap:12px}
@media(min-width:860px){.vgrid{grid-template-columns:repeat(4,1fr);gap:14px}}
@media(min-width:1000px){.vgrid{grid-template-columns:repeat(5,1fr)}}
.vgrid .vcard .vbody{padding:9px 11px 11px}
.vgrid .vcard b{font-size:14px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vgrid .vcard .vbody>span{font-size:12px}
.vgrid .vshare{gap:4px;margin-top:7px}
.vgrid .vcard .vshare span{font-size:11px;padding:1px 7px}
.vgrid .vthumb::after{transform:scale(.8)}
.vgrid .vthumb-f em{font-size:13px;padding:2px 8px}
.vgrid .vthumb-f{padding-bottom:8px}
.vshare em{font-style:normal}
.vgrid .vshare{flex-wrap:nowrap}
.vgrid .vshare em{display:none}
.vgrid .vcard .vshare span{padding:2px 10px;font-size:12px}
/* 大視窗:影片上方留空間,整支影片一定完整出現在畫面內(不被切到) */
.yt-lb:not(.lb-mini){align-items:flex-start;padding:64px 16px 24px}
.yt-lb:not(.lb-mini) .yt-box{margin:auto;width:min(1100px,100%,calc((100vh - 230px) * 16 / 9));width:min(1100px,100%,calc((100dvh - 230px) * 16 / 9));min-width:min(480px,100%)}
.yt-lb.lb-music .yt-box{width:min(680px,100%)}
.yt-lb.lb-read .yt-box{width:min(960px,100%)}
.plcard .vthumb{position:relative}
.plcard .pl-badge{position:absolute;right:8px;bottom:8px;font-style:normal;font-size:12px;font-weight:700;color:#fff;background:rgba(0,0,0,.72);padding:3px 9px;border-radius:6px;z-index:1}
/* YouTube 式主題列:每列 5 支,左右滑動/按箭頭 */
.pl{margin-top:34px}
.pl-h h3{font:700 clamp(19px,2.4vw,23px)/1.35 var(--serif);margin:0 0 2px}
@media(min-width:900px){.rail{grid-auto-columns:calc((100% - 56px) / 5)}}
@media(min-width:641px) and (max-width:899px){.rail{grid-auto-columns:calc((100% - 28px) / 3)}}
@media(max-width:640px){.rail{grid-auto-columns:44%;gap:10px}}
.rail{scrollbar-width:thin}
.rail .vcard .vbody{padding:9px 11px 11px}
.rail .vcard b{font-size:14px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rail .vcard .vbody>span{font-size:12px}
.rail .vshare{flex-wrap:nowrap;gap:4px;margin-top:7px}.rail .vshare em{display:none}.rail .vcard .vshare span{padding:2px 10px;font-size:12px}
.pl-more{display:grid;place-items:center;color:var(--gold);font-weight:700;background:linear-gradient(135deg,#2a2018,#4a3622)}
.rail-wrap{position:relative}
.rail-btn{position:absolute;top:calc(50% - 40px);z-index:2;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.95);box-shadow:var(--shadow);font-size:20px;line-height:1;cursor:pointer;color:var(--ink)}
.rail-btn.l{left:-14px}.rail-btn.r{right:-14px}
@media(max-width:899px){.rail-btn{display:none}}
/* 照 YouTube:標題旁「全部播放」、列與列之間細線、一列 6 支 */
.pl{border-top:1px solid var(--line);padding-top:22px;margin-top:22px}
.pl-h{justify-content:flex-start;align-items:center;gap:18px;margin-bottom:12px}
.pl-h>div{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.pl-h .btn{border:0;background:none;padding:4px 6px;font-weight:700;color:var(--ink);box-shadow:none}
.pl-h .btn:hover{color:var(--brand)}
@media(min-width:1100px){.rail{grid-auto-columns:calc((100% - 70px) / 6)}}
.rail-btn.r{right:-18px}.rail-btn.l{left:-18px}

.nw{white-space:nowrap}

/* 手機閱讀舒適:內文最小 15px(老師 2026-09-26:字不要太小) */
@media (max-width:640px){
  .tagcloud span,figcaption,.cred span,.chips span,.award small,.pills .pill,.past-p span,.past-p small,.gig-date span,
  .quote-card footer,.past-h,p.copy,p.copy a,li>a,li>span,a>small,.social a,.hero-app span,.wrap>a{font-size:15px!important}
  .vbody b{font-size:15px!important}
  .vbody span,.vshare span{font-size:14px!important}
}
.vthumb.vradio span{font-size:46px;filter:drop-shadow(0 2px 6px rgba(0,0,0,.4))}

/* 主視覺照片:改用半身原圖(看得到整把吉他),橫向 3:2,不要大頭特寫(老師 2026-09-26:太近、太大有壓迫感) */
/* 老師 09-27:右邊白牆切掉,人和吉他左右比較平均(保留左邊,裁掉右側約 11%;11/10 切太多) */
.hero figure img{aspect-ratio:4/3!important;height:auto;object-position:0% 50%}
@media(max-width:959px){
  .hero figure{max-width:560px;margin:8px auto 0}
  .hero figcaption{padding:8px 12px;left:10px;right:10px;bottom:10px}
  .hero figcaption strong{font-size:16px}
}
@media(min-width:960px){
  .hero .wrap{grid-template-columns:1.15fr 1fr;align-items:center}
  .hero figure{max-width:600px}
}
/* ---- 照片紀錄 ---- */
.fp-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(min-width:860px){.fp-grid{grid-template-columns:repeat(4,1fr)}}
@media(min-width:1000px){.fp-grid{grid-template-columns:repeat(5,1fr)}}
.fp-grid figure{margin:0;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.fp-grid img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--bg-alt);cursor:zoom-in}
.fp-grid figcaption{font-size:12.5px;line-height:1.5;color:var(--ink-2);padding:7px 9px 9px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.fp-wrap:not(.all) .fp-grid figure:nth-child(n+16){display:none}
#artist-photos .fp-wrap:not(.all) .fp-grid figure:nth-child(n+11){display:none}
.fp-more{margin-top:14px}
.fp-sec .section-head h2 small{font:500 15px var(--sans);color:var(--muted)}
.fp-top{padding-bottom:0}
.fp-search{display:flex;align-items:center;gap:8px;margin-top:14px;border:1px solid var(--line);border-radius:999px;background:#fff;padding:8px 16px;max-width:560px}
.fp-search input{border:0;outline:0;font:inherit;font-size:16px;width:100%;background:none}
.fp-zoom{position:fixed;inset:0;z-index:200;background:rgba(10,8,6,.93);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;cursor:zoom-out}
.fp-zoom img{max-width:100%;max-height:calc(100vh - 110px);object-fit:contain;border-radius:8px}
.fp-zoom p{color:#f3e6cf;margin:12px 0 0;text-align:center;max-width:760px;font-size:15px}
.fp-mosaic{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media(min-width:860px){.fp-mosaic{grid-template-columns:repeat(5,1fr)}}
.fp-mosaic figure{margin:0;position:relative;border-radius:12px;overflow:hidden;background:#1d1a16}
.fp-mosaic img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;cursor:zoom-in}
.fp-mosaic figcaption{position:absolute;left:0;right:0;bottom:0;padding:18px 9px 7px;font-size:12px;line-height:1.4;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.78));display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tl-ph{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 4px}
.tl-ph img{width:74px;height:56px;object-fit:cover;border-radius:6px;background:var(--bg-alt);cursor:zoom-in}
.tl-ph:not(.all) img.x{display:none}
.tl-ph .fp-more{margin:0;width:56px;height:56px;border-radius:6px;border:1px solid var(--line);background:#fff;font-weight:700;cursor:pointer;color:var(--brand-ink)}
/* ---- 學生影片全集 ---- */
.sv-bar{position:sticky;top:64px;z-index:20;background:rgba(250,247,242,.97);backdrop-filter:blur(6px);padding:10px 0 8px;margin:-10px 0 10px;border-bottom:1px solid var(--line)}
.sv-f,.sv-yrs{display:flex;gap:8px;align-items:center;overflow-x:auto;scrollbar-width:none;white-space:nowrap}
.sv-f::-webkit-scrollbar,.sv-yrs::-webkit-scrollbar{display:none}
.sv-f button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 14px;font:inherit;font-size:14px;cursor:pointer;color:var(--ink-2)}
.sv-f button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.sv-s{display:flex;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;border-radius:999px;padding:5px 12px;min-width:200px}
.sv-s input{border:0;outline:0;font:inherit;font-size:15px;width:100%;background:none}
.sv-count{font-size:13px;color:var(--muted)}
.sv-yrs{margin-top:8px}
.sv-yrs a{font-size:14px;font-weight:700;color:var(--brand-ink);text-decoration:none;padding:3px 10px;border-radius:8px;background:var(--brand-soft)}
.sv-y h2{font:700 22px var(--serif);margin:26px 0 12px}.sv-y h2 small{font:500 14px var(--sans);color:var(--muted);margin-left:10px}
.sv-more{display:block;margin:24px auto 0}.sv-none{padding:40px 0;text-align:center;color:var(--muted)}
@media(max-width:1079px){.sv-bar{top:56px}}
.yr-jump{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:14px;color:var(--muted)}
.yr-jump a{font-weight:700;color:var(--brand-ink);text-decoration:none;padding:3px 10px;border-radius:8px;background:var(--brand-soft)}
@media(min-width:1000px){.vgrid-6{grid-template-columns:repeat(6,1fr)}}
/* ---- 全站搜尋 ---- */
.nav-search{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);color:var(--on-dark);border-radius:999px;padding:7px 12px;font:inherit;font-size:14px;cursor:pointer;margin-left:10px}
.nav-search:hover{background:rgba(255,255,255,.16)}
.menu .m-only{display:none}
@media(max-width:1079px){.nav>.nav-search{display:none}.navtoggle:checked~.menu>li.m-only{display:block}.navtoggle:checked~.menu>li.m-only>a{color:var(--gold)}}
@media(min-width:1080px){.nav-search{order:2}.nav .nav-cta{order:3}}
.ss-lock,.ss-lock body{overflow:hidden}
.ss-ov{position:fixed;inset:0;z-index:90;background:rgba(10,8,6,.72);display:none;padding:70px 16px 16px}
.ss-ov.on{display:block}
.ss-box{max-width:860px;margin:0 auto;background:var(--bg);border-radius:16px;box-shadow:0 30px 70px -20px rgba(0,0,0,.6);display:flex;flex-direction:column;max-height:calc(100vh - 100px);max-height:calc(100dvh - 100px);overflow:hidden}
.ss-bar{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line);background:#fff}
.ss-bar input{flex:1;border:0;outline:0;font:inherit;font-size:17px;background:none;min-width:0}
.ss-x{border:0;background:none;font-size:20px;cursor:pointer;color:var(--muted)}
.ss-res{overflow-y:auto;padding:6px 16px 18px;-webkit-overflow-scrolling:touch}
.ss-tip{color:var(--muted);padding:18px 2px;margin:0}
.ss-g h3{font:700 17px var(--serif);margin:16px 0 8px}.ss-g h3 small{font:500 13px var(--sans);color:var(--muted);margin-left:8px}
.ss-list{display:grid;gap:6px}
.ss-it{display:flex;gap:12px;align-items:center;text-decoration:none;color:var(--ink);padding:6px;border-radius:10px}
.ss-it:hover{background:var(--brand-soft)}
.ss-th{flex:none;width:96px;height:54px;border-radius:7px;overflow:hidden;background:var(--bg-alt)}
.ss-th img{width:100%;height:100%;object-fit:cover;display:block}
.ss-ic{display:grid;place-items:center}.ss-t .ss-ic::before{content:"🗓"}.ss-g .ss-ic::before{content:"📄"}.ss-v .ss-ic::before{content:"▶"}.ss-p .ss-ic::before{content:"📷"}
.ss-lt .ss-th,.ss-lg .ss-th{width:40px;height:40px}
.ss-tx{min-width:0}.ss-tx b{display:block;font-size:15px;font-weight:600;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ss-tx small{display:block;font-size:12.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ss-all{margin:8px 0 0;border:1px solid var(--line);background:#fff;border-radius:999px;padding:5px 14px;font:inherit;font-size:13.5px;cursor:pointer}
.hl-flash{background:#fde9b8;transition:background 1s}
.ss-bar input::-webkit-search-cancel-button{display:none}

/* 手機:上方「免費工具」列拿掉(常誤觸、佔空間),改放頁尾「免費工具」欄(老師 2026-09-26) */
@media(max-width:959px){.toolbar{display:none}}
/* ---- 橫向滑動列統一樣式 ---- */
.rail-h{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:-4px 0 10px;font-size:13.5px;color:var(--muted)}
.see-all{font-weight:700;color:var(--brand-ink);text-decoration:none;white-space:nowrap;font-size:15px}
.see-all:hover{color:var(--brand)}
.fp-rail figure{margin:0;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.fp-rail img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--bg-alt);cursor:zoom-in}
.fp-rail figcaption{font-size:12.5px;line-height:1.5;color:var(--ink-2);padding:7px 9px 9px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fp-sec{padding-top:34px;padding-bottom:10px}
.fp-cats a.on{background:var(--ink);color:#fff}
.fp-hits{color:var(--muted);margin:18px 0 10px}
#fp-res .fp-grid figure{display:block}
.lib-bar .vfilter{margin:0}.lib-bar .vtools{margin-top:8px}

/* 照片橫向列:每張卡片維持自己的高度,不要被最高那張撐成一整排白色空白(老師 2026-09-26 回報:往右拉到一半下面出現白色空間) */
.fp-rail{align-items:start}
.fp-rail>*{align-self:start}
.radio .yt-chip{margin-left:4px}.cc-tag{display:inline-block;font-size:11px;font-weight:700;border:1px solid var(--line);border-radius:4px;padding:0 4px;color:var(--muted);vertical-align:1px}
/* 有同步字幕的影片:資訊列小標籤(不擋畫面) */
.cc-tag{display:inline-block;margin-left:6px;padding:0 6px;border-radius:5px;background:#2b2319;color:#f3e6cf!important;font:700 11px/1.7 var(--sans)!important;letter-spacing:.02em;vertical-align:2px;white-space:nowrap}
.vcard .vbody b .cc-tag,.vcard .vbody .cc-tag{float:none}
.dark .cc-tag{background:#d6b26e;color:#1f1913!important}
.pod-ep .cc-tag{margin:0 6px 0 0}
/* 浮動小視窗:只留一條小字幕,摘要/段落/開關按鈕放大後才出現(避免撐破版面) */
.yt-lb.lb-mini .tx{margin:0}
.yt-lb.lb-mini .tx-bar,.yt-lb.lb-mini .tx-hl{display:none!important}
/* 老師 09-26:「字幕太小,放大兩倍」→ 後來又說「視窗小字大、放大後字反而變小,很怪,智慧調整比例」
   → 小視窗、放大、全螢幕一律照「影片寬度」等比例:約 4.2% 寬 + 10px 底數(420px≈28px、930px≈49px、1228px≈62px),最小 26px、最大 72px。
   cqw = .yt-box(就是影片的寬度)的 %,所以視窗怎麼拉、放大縮小都同一個比例。 */
.yt-lb .yt-box{container-type:inline-size}
.yt-lb .tx-cap{font-size:clamp(26px,calc(4.2cqw + 10px),72px)!important;line-height:1.4}
.yt-lb.lb-mini .tx-cap{font-weight:600;min-height:0;padding:6px 10px;border-radius:0}
.yt-lb.lb-mini .tx-cap:empty{display:none}
.yt-lb.lb-mini .yt-box{max-height:calc(100vh - 40px);max-width:calc(100vw - 16px)}
@media(max-width:959px){.yt-mbar .yt-fs{font-size:0;padding:3px 9px}.yt-mbar .yt-fs::before{content:"⛶";font-size:14px}}

/* 浮動小視窗也要有分享列(老師 2026-09-26:分享到各平台的鈕不見了)——一列、可左右滑 */
.yt-lb.lb-mini .yt-share{display:flex!important;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;gap:6px;margin:0;padding:6px 8px 8px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.yt-lb.lb-mini .yt-share::-webkit-scrollbar{display:none}
.yt-lb.lb-mini .yt-share .yt-nets{display:contents}
.yt-lb.lb-mini .yt-share button,.yt-lb.lb-mini .yt-share .btn{flex:none;white-space:nowrap;padding:4px 11px;font-size:13px;min-height:0;border-radius:999px;background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.3)}
/* 從跳出視窗「回到原本的網頁」回來:那支影片／那一集亮框幾秒 */
.lu-hit{outline:3px solid #d6b26e;outline-offset:3px;border-radius:12px;transition:outline-color .3s}
/* 廣播收聽區(老師 09-27):分享列同影片;▴ 收起 → 整個播放器縮成一行(播放鈕＋標題＋進度＋時間) */
.pod-share{justify-content:flex-start;margin:0}
.pod-share .btn{background:rgba(255,255,255,.08);color:#faf6ee;border:1px solid rgba(255,255,255,.3);box-shadow:none}
.pod-share .yt-nets{justify-content:flex-start}
.pod-share .yt-nets button{color:#faf6ee;border-color:rgba(255,255,255,.3)}
.pod-list>li{scroll-margin-top:90px}
.pod-box.pod-min{padding:10px 14px}
.pod-box.pod-min .yt-frame{height:auto!important;padding:0!important;background:none!important;gap:0!important}
.pod-box.pod-min .tx,.pod-box.pod-min .tx-bar,.pod-box.pod-min .pod-cover,.pod-box.pod-min .pod-sum,.pod-box.pod-min .pod-share,.pod-box.pod-min .tx-cap,.pod-box.pod-min .pod-now small,.pod-box.pod-min [data-a=back],.pod-box.pod-min [data-a=fwd],.pod-box.pod-min [data-a=rate]{display:none!important}
.pod-box.pod-min .pod-now{flex-direction:row!important;align-items:center}
.pod-box.pod-min .pod-now>div{display:flex;align-items:center;gap:12px}
.pod-box.pod-min .pod-now b{order:1;flex:1;min-width:0;margin:0;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pod-box.pod-min .pod-ctrl{display:contents}
.pod-box.pod-min .pod-play{order:0;width:40px;height:40px;font-size:17px;flex:none}
.pod-box.pod-min .pod-bar{order:2;flex:none;width:160px;min-width:0}
.pod-box.pod-min .pod-time{order:3;white-space:nowrap}
.pod-box.pod-min .pod-ctrl button:not(.pod-play){order:4;flex:none;white-space:nowrap}
.pod-box.pod-min .pod-msg{order:5;margin:0;white-space:nowrap}
@media(max-width:640px){.pod-box.pod-min .pod-bar,.pod-box.pod-min .pod-time{display:none}.pod-box.pod-min .pod-now b{font-size:15px}}
/* 影片播放頁／分享頁(watch.html、w-*.html)(老師 09-27:朋友用筆電打開分享連結「看不到影片」——影片被大標題與演奏會橫幅擠到螢幕外):
   一打開就看到整支影片:標題區縮小、影片排第一、高度配合螢幕,演奏會橫幅與報名鈕移到影片下面 */
body:has(#watch) .page-hero{padding:14px 0 10px}
body:has(#watch) .page-hero .crumbs,body:has(#watch) .page-hero .eyebrow{display:none}
body:has(#watch) .page-hero h1{font-size:clamp(20px,2.6vw,30px);margin:0;line-height:1.3}
body:has(#watch) .page-hero .lead{margin:2px 0 0;font-size:14px}
body:has(#watch) main>.section{padding-top:14px}
body:has(#watch) main>.section>.wrap{display:flex;flex-direction:column}
body:has(#watch) main>.section>.wrap>*{order:1}
body:has(#watch) main>.section>.wrap>#watch{order:0}
body:has(#watch) .watch-news{margin-top:18px}
#watch .yt-frame{max-width:calc((100vh - 190px) * 16 / 9);max-width:calc((100dvh - 190px) * 16 / 9);min-width:min(100%,320px);margin:0 auto}
/* B站影片在手機上的備用連結(B站擋外嵌播放時用) */
.bili-alt{margin:8px 0 0;font-size:14px;text-align:center;color:var(--muted,#6b6257)}
.bili-alt a{color:var(--brand,#b07a2a);font-weight:700;text-decoration:underline}
.yt-lb .bili-alt{color:#e9dfcf}.yt-lb .bili-alt a{color:#d6b26e}
.yt-lb.lb-mini .bili-alt{margin:0;padding:4px 8px;font-size:13px;background:#000}
/* 吉他影片目錄(library.html)手機(老師 09-27):一打開直接是影片區(標題縮一行,不先秀「加 LINE 洽談」那一大塊);
   上方只有一行「目前選的分類・搜尋字」＋「🔍 搜尋・分類」,按了才展開面板選分類/搜尋 */
.vq-btn,.vq-sum{display:none}
@media(max-width:760px){
  body:has(.lib-bar) .page-hero{padding:10px 0 8px}
  body:has(.lib-bar) .page-hero :is(.crumbs,.eyebrow,.lead,.cta){display:none}
  body:has(.lib-bar) .page-hero h1{font-size:18px;margin:0;line-height:1.4}
  body:has(.lib-bar) .page-hero+.section{padding-top:6px}
  body:has(.lib-bar) .page-hero+.section>.wrap>.section-head{display:none}
  .lib-bar{padding:6px 0;margin-top:0}
  .lib-bar .vfilter,.lib-bar .vtools input,.lib-bar #vcount{display:none}
  .lib-bar .vtools{margin:0!important;display:flex;align-items:center;gap:8px;flex-wrap:nowrap}
  .lib-bar .vq-sum{display:block;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:15px;font-weight:700;color:var(--ink,#2a241d)}
  .lib-bar .vq-btn{display:block;flex:none;border:1px solid var(--ink);background:var(--ink);color:var(--bg);border-radius:999px;padding:8px 16px;font:inherit;font-size:15px;font-weight:700;cursor:pointer;white-space:nowrap}
  .lib-bar.sq-open{display:flex;flex-direction:column;gap:10px;max-height:calc(100vh - 80px);overflow-y:auto;padding-bottom:10px}
  .lib-bar.sq-open .vtools{order:0;flex-wrap:wrap}
  .lib-bar.sq-open .vq-sum{display:none}
  .lib-bar.sq-open .vtools input{display:block;order:0;flex:1;min-width:0;padding:9px 14px;font-size:16px}
  .lib-bar.sq-open .vq-btn{order:1}
  .lib-bar.sq-open #vcount{display:block;order:2;flex-basis:100%;font-size:13px}
  .lib-bar.sq-open .vfilter{display:flex;order:1;flex-wrap:wrap;gap:8px;margin:0}
  .lib-bar.sq-open .vfilter button{white-space:nowrap}
}
/* 手機橫屏看影片自動滿版(老師 09-27);按「⤡ 縮小」(lb-nofs)或轉回直的就恢復 */
.lb-fsx{display:none}
@media (orientation:landscape) and (pointer:coarse) and (max-height:620px){
  .yt-lb.on:not(.lb-music):not(.lb-read):not(.lb-nofs){position:fixed!important;inset:0!important;left:0!important;top:0!important;width:100vw!important;height:100vh!important;height:100dvh!important;max-width:none!important;padding:0!important;margin:0!important;background:#000!important;display:block!important;overflow:hidden!important;z-index:9999}
  .yt-lb.on:not(.lb-music):not(.lb-read):not(.lb-nofs) .yt-box{position:absolute;inset:0;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;margin:0;padding:0;border:0!important;border-radius:0!important;background:#000!important;box-shadow:none!important}
  .yt-lb.on:not(.lb-music):not(.lb-read):not(.lb-nofs) .yt-frame{position:absolute!important;inset:0;width:100%!important;height:100%!important;max-width:none!important;aspect-ratio:auto!important;border-radius:0!important;margin:0!important}
  .yt-lb.on:not(.lb-music):not(.lb-read):not(.lb-nofs) :is(.yt-mbar,.yt-back,.yt-x,.yt-credit,.yt-share,.yt-cta,.lb-rz,.tx,.bili-alt){display:none!important}
  .yt-lb.on:not(.lb-music):not(.lb-read):not(.lb-nofs) .lb-fsx{display:block;position:absolute;top:10px;left:10px;z-index:5;background:rgba(20,16,12,.7);color:#f3e6cf;border:1px solid rgba(255,255,255,.3);border-radius:999px;padding:6px 12px;font-size:14px;opacity:.75}
}

/* 手機按 ⛶ 的滿版(lb-fs,老師 09-27:全螢幕要能退回小視窗):跟橫屏滿版同一套,不限方向;左上角「⤡ 縮小」退出 */
  .yt-lb.on.lb-fs:not(.lb-music):not(.lb-read){position:fixed!important;inset:0!important;left:0!important;top:0!important;width:100vw!important;height:100vh!important;height:100dvh!important;max-width:none!important;padding:0!important;margin:0!important;background:#000!important;display:block!important;overflow:hidden!important;z-index:9999}
  .yt-lb.on.lb-fs:not(.lb-music):not(.lb-read) .yt-box{position:absolute;inset:0;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;margin:0;padding:0;border:0!important;border-radius:0!important;background:#000!important;box-shadow:none!important}
  .yt-lb.on.lb-fs:not(.lb-music):not(.lb-read) .yt-frame{position:absolute!important;inset:0;width:100%!important;height:100%!important;max-width:none!important;aspect-ratio:auto!important;border-radius:0!important;margin:0!important}
  .yt-lb.on.lb-fs:not(.lb-music):not(.lb-read) :is(.yt-mbar,.yt-back,.yt-x,.yt-credit,.yt-share,.yt-cta,.lb-rz,.tx,.bili-alt){display:none!important}
  .yt-lb.on.lb-fs:not(.lb-music):not(.lb-read) .lb-fsx{display:block;position:absolute;top:10px;left:10px;z-index:5;background:rgba(20,16,12,.7);color:#f3e6cf;border:1px solid rgba(255,255,255,.3);border-radius:999px;padding:6px 12px;font-size:14px;opacity:.75}
/* 深色模式(手機設成深色)(老師 09-27:「🔍 搜尋・分類」「根本就像白色的紐」、分類鈕以為是空格):
   --card 從來沒定義 → 11 處一律白底,配上深色模式的淺色字就看不見;黏在上方的篩選列底色也寫死淺色。深色模式改用深色底 */
:root{--card:#fff}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){--card:var(--surface)}
  :root:not([data-theme="light"]) .sv-bar{background:rgba(20,17,13,.97)}
}
/* 廣播跳出後網頁只留一行(老師 09-27) */
.pod-outmsg{display:none}.pod-box.pod-out>:not(.pod-outmsg){display:none!important}.pod-box.pod-out .pod-outmsg{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:16px;color:#d6b26e}.pod-outmsg button{background:#d6b26e;color:#1f1913;border:0;border-radius:999px;padding:8px 16px;font-size:15px;cursor:pointer}

/* 首頁主視覺:照片說明「盧家宏 老師」移到照片下方,不要蓋住吉他(老師 2026-09-27) */
.hero figure figcaption{position:static;left:auto;right:auto;bottom:auto;margin:12px 2px 0;padding:0;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:0}
/* 手機小視窗(老師 09-27):「－」「＋」調大小、拖標題列(⠿)移動;「← 返回」跟 ✕ 重複所以拿掉;「⤢ 放大」也拿掉(直的要維持小視窗) */
.yt-sz{display:none}
@media (pointer:coarse){
  .yt-lb.lb-mini .yt-mbar .yt-sz{display:inline-block;padding:2px 11px;font-size:17px;line-height:1.35}
  .yt-lb.lb-mini .yt-mbar :is(.yt-mback,.yt-big){display:none}
  .yt-lb.lb-mini .yt-mbar .yt-mt::before{content:"⠿ ";opacity:.7}
}
/* 小視窗分享只留一顆「↗ 分享」,按了才展開複製連結、嵌入碼、LINE、FB… */
.yt-lb.lb-mini .yt-share:not(.sh-open)>:not([data-act=share]){display:none!important}
.yt-lb.lb-mini .yt-share.sh-open{flex-wrap:wrap}