/* Local design concept — isolated from the production index. */
:root{color-scheme:dark;--paper:#091217;--ink:#eef0e9;--muted:#8d9ca0;--line:#ffffff16;--accent:#e6b681;--white:#101c23}
body.local-concept{min-height:100vh;background:radial-gradient(circle at 78% 5%,#214252 0,transparent 34rem),linear-gradient(150deg,#091217 0%,#0c171d 48%,#101d22 100%);color:var(--ink)}
.local-concept:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.12;background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(to bottom,#000,transparent 70%)}
.local-concept header,.local-concept main{max-width:1540px;padding-left:clamp(24px,5vw,78px);padding-right:clamp(24px,5vw,78px)}
.local-concept header{height:82px;border-color:#ffffff12;background:#091217b8;backdrop-filter:blur(18px);position:sticky;top:0;z-index:9}
.local-concept .brand b{border-color:#ffffff24;font-size:25px}.local-concept .brand span{font-weight:700}.local-concept .brand small{color:#71858c}
.local-concept .header-links a{border:1px solid #ffffff18;border-radius:999px;padding:7px 13px;text-decoration:none}.local-concept .header-links a:hover{border-color:var(--accent);color:var(--accent)}
.local-concept .theme-toggle{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:7px 12px;border:1px solid #ffffff18;border-radius:999px;background:#ffffff08;color:var(--ink);font:inherit;font-size:12px;cursor:pointer;transition:background .2s ease,border-color .2s ease,transform .2s ease}.local-concept .theme-toggle:hover{border-color:var(--accent);transform:translateY(-1px)}.local-concept .theme-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.local-concept .theme-icon{font-size:15px;line-height:1}.local-concept .theme-label{font-weight:700;letter-spacing:.04em}
.local-concept main{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(340px,.65fr);gap:0 24px}
.local-concept .intro{min-height:400px;padding:78px 5vw 58px 0;display:flex;flex-direction:column;justify-content:center;border-bottom:1px solid var(--line)}
.local-concept .intro .eyebrow{color:var(--accent)}
.local-concept h1{font-size:clamp(58px,7.5vw,118px);line-height:.92;letter-spacing:-5px;margin:26px 0 34px;max-width:900px}
.local-concept h1 span{display:block;font-size:clamp(22px,2vw,34px);letter-spacing:.35em;margin:24px 0 0 6px;color:#aebcc0}
.local-concept .intro>p:last-child{max-width:480px;font-size:17px;color:#a6b5b8}
.local-concept .quiz-banner{grid-column:2;grid-row:1;align-self:center;margin:32px 0;padding:26px;border:1px solid #ffffff18;border-radius:22px;background:linear-gradient(145deg,#162832e8,#101b22e8);box-shadow:0 26px 80px #0006;display:block}
.local-concept .quiz-banner-copy h2{font-size:28px;margin:8px 0}.local-concept .quiz-banner-side{display:block}.local-concept .quiz-banner-modes{grid-template-columns:1fr;margin:18px 0}.local-concept .quiz-banner-modes li{padding:9px 0}.local-concept .quiz-play{display:flex;justify-content:center;width:100%;padding:12px;border-radius:999px;background:var(--accent);color:#142028;font-weight:800;text-decoration:none}
.local-concept .home-board{margin-top:22px;padding-top:20px}.local-concept .lb3{grid-template-columns:1fr}.local-concept .lb3-col:not(:first-child){display:none}.local-concept .lb3-list li:nth-child(n+4){display:none}
.local-concept .tabs{grid-column:1/-1;position:sticky;top:82px;z-index:8;margin:0;padding:0 2px;background:#0b161bea;backdrop-filter:blur(18px);gap:10px;border-color:#ffffff18}
.local-concept .tabs button{padding:20px 22px 17px;color:#83969b;font-size:14px;text-align:left}.local-concept .tabs button.active{color:var(--ink);border-color:var(--accent)}
.local-concept .tabs small{font-size:9px}.local-concept #library{grid-column:1/-1;padding-top:28px}
.local-concept .section-title{align-items:end}.local-concept .section-title h2{font-size:42px;margin:8px 0}.local-concept .section-title h2 span{color:var(--accent)}
.local-concept #stats{padding:6px 11px;border:1px solid var(--line);border-radius:999px;color:#a7b6b8}
.local-concept .tools{display:grid;grid-template-columns:minmax(280px,1fr) 220px 180px auto;padding:12px;border:1px solid var(--line);border-radius:16px;background:#101d23c7;box-shadow:0 18px 60px #0003}
.local-concept .tools input,.local-concept .tools select{border-color:#ffffff14;background:#0b151a;color:var(--ink);border-radius:10px}.local-concept .tools button{border-radius:10px}
.local-concept .listening-tools{padding:2px 4px 18px;border-bottom:1px solid var(--line)}.local-concept .listening-tools button,.local-concept .quiz-button{border-radius:999px;background:#15262e;color:var(--ink);border:1px solid #ffffff18}.local-concept .listening-tools button[aria-pressed=true]{background:var(--accent);color:#142028}
.local-concept #status{margin:16px 4px;color:#cfa77b}
.local-concept .grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
.local-concept .card{background:#101c22;border-color:#ffffff12;border-radius:14px;box-shadow:0 8px 30px #0001;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.local-concept .card:hover{transform:translateY(-7px);border-color:#e6b68155;box-shadow:0 20px 48px #0006}.local-concept .cover{background:#15262e}.local-concept .cover img{filter:saturate(.84) contrast(1.04)}.local-concept .card:hover .cover img{filter:saturate(1) contrast(1.04);transform:scale(1.045)}
.local-concept .card-body{padding:16px}.local-concept .card h3{font-size:20px}.local-concept .english{color:#d9dedb}.local-concept .thai-reading{color:var(--accent)}.local-concept .translation{border-color:#ffffff12;color:#b7c2c1}.local-concept .release{color:#788d92}
.local-concept .card-links a{background:#192a32;border:1px solid #ffffff0d;border-radius:999px;padding:4px 9px}.local-concept .detail-button,.local-concept .lyrics-button{color:#d9b88f}
.local-concept details{grid-column:1/-1;border-color:var(--line)}.local-concept footer{grid-column:1/-1}
.local-concept .player{left:18px;right:18px;bottom:16px;border:1px solid #ffffff17;border-radius:18px;padding:12px 18px;background:#101d23f2;box-shadow:0 24px 80px #0009;backdrop-filter:blur(22px)}
.local-concept #now-playing img{border-radius:10px}.local-concept .full-song-button{border-radius:999px;border-color:#e6b68155;color:var(--accent)}
.local-concept .service-status{left:18px}.local-concept dialog{background:#0d1920;border-color:#ffffff20;color:var(--ink)}
html[data-theme="light"]{color-scheme:light;--paper:#f2efe7;--ink:#17262b;--muted:#6c7a7d;--line:#17262b1c;--accent:#a96132;--white:#fffdf8}
html[data-theme="light"] body.local-concept{background:radial-gradient(circle at 78% 4%,#c8dce0 0,transparent 35rem),linear-gradient(150deg,#f6f2e9 0%,#ebe8df 52%,#dfe8e7 100%);color:var(--ink)}
html[data-theme="light"] .local-concept:before{opacity:.07;background-image:linear-gradient(#17313a 1px,transparent 1px),linear-gradient(90deg,#17313a 1px,transparent 1px)}
html[data-theme="light"] .local-concept header{background:#f4f1e9d9;border-color:#17262b14;box-shadow:0 8px 35px #36525a0d}
html[data-theme="light"] .local-concept .brand b{border-color:#17262b26}html[data-theme="light"] .local-concept .brand small{color:#6e7c7f}
html[data-theme="light"] .local-concept .header-links a,html[data-theme="light"] .local-concept .theme-toggle{background:#fff9;border-color:#17262b1c;color:var(--ink)}
html[data-theme="light"] .local-concept h1 span,html[data-theme="light"] .local-concept .intro>p:last-child{color:#5e7175}
html[data-theme="light"] .local-concept .quiz-banner{background:linear-gradient(145deg,#fffdf9ed,#e6efefed);border-color:#17313a1a;box-shadow:0 26px 70px #36525a1f}
html[data-theme="light"] .local-concept .quiz-play{color:#fff9f2;background:#a96132}
html[data-theme="light"] .local-concept .tabs{background:#f1eee6eb;border-color:#17262b17}
html[data-theme="light"] .local-concept .tools{background:#fffdf8d9;box-shadow:0 18px 48px #36525a12}
html[data-theme="light"] .local-concept .tools input,html[data-theme="light"] .local-concept .tools select{background:#fff;color:var(--ink);border-color:#17262b1c}
html[data-theme="light"] .local-concept .listening-tools button,html[data-theme="light"] .local-concept .quiz-button{background:#f9f6ef;color:var(--ink);border-color:#17262b1c}
html[data-theme="light"] .local-concept .listening-tools button[aria-pressed=true]{background:#a96132;color:#fff}
html[data-theme="light"] .local-concept .card{background:#fffdf9;border-color:#17313a17;box-shadow:0 10px 30px #36525a12}
html[data-theme="light"] .local-concept .card:hover{border-color:#a961325e;box-shadow:0 20px 46px #36525a27}
html[data-theme="light"] .local-concept .cover{background:#dfe8e7}html[data-theme="light"] .local-concept .english{color:#33494e}html[data-theme="light"] .local-concept .thai-reading{color:#9a542d}html[data-theme="light"] .local-concept .translation{border-color:#17262b14;color:#53676a}html[data-theme="light"] .local-concept .release{color:#738184}
html[data-theme="light"] .local-concept .card-links a{background:#eef2ef;border-color:#17262b0d}html[data-theme="light"] .local-concept .detail-button,html[data-theme="light"] .local-concept .lyrics-button{color:#8f4e2a}
html[data-theme="light"] .local-concept .player{background:#fffdf8f2;border-color:#17313a1c;box-shadow:0 24px 70px #29474f35}
html[data-theme="light"] .local-concept .full-song-button{border-color:#a9613255;color:#8f4e2a}
html[data-theme="light"] .local-concept .player,html[data-theme="light"] .local-concept .player-heading button{color:#17262b}
html[data-theme="light"] .local-concept #now-playing strong{color:#17262b}html[data-theme="light"] .local-concept #now-playing small{color:#657579}
html[data-theme="light"] .local-concept .full-song-button{background:#a96132;border-color:#a96132;color:#fffaf3}
html[data-theme="light"] .local-concept .transport button{background:#d99962;border-color:#d99962;color:#17262b}html[data-theme="light"] .local-concept .transport span{color:#657579}
html[data-theme="light"] .local-concept .volume-control{background:#edf0eb;border-color:#17262b20}html[data-theme="light"] .local-concept .volume-control output{color:#33494e}
html[data-theme="light"] .local-concept dialog{background:#fbfaf5;border-color:#17313a20;color:var(--ink)}
@media(max-width:1180px){.local-concept .grid{grid-template-columns:repeat(4,minmax(0,1fr))}.local-concept main{grid-template-columns:1fr}.local-concept .intro{grid-column:1;min-height:330px}.local-concept .quiz-banner{grid-column:1;grid-row:auto;margin:0 0 28px}.local-concept .quiz-banner-side{display:grid;grid-template-columns:1fr auto;gap:16px}.local-concept .quiz-banner-modes{grid-template-columns:repeat(3,1fr)}.local-concept .quiz-play{width:auto;align-items:center;padding-inline:28px}.local-concept .home-board{display:none}}
@media(max-width:850px){.local-concept .grid{grid-template-columns:repeat(2,minmax(0,1fr))}.local-concept .tools{grid-template-columns:1fr 1fr}.local-concept .tools input{grid-column:1/-1}.local-concept .intro{padding-top:48px}.local-concept h1{letter-spacing:-3px}.local-concept .quiz-banner-side{display:block}}
@media(max-width:560px){.local-concept header,.local-concept main{padding-left:16px;padding-right:16px}.local-concept header{height:68px}.local-concept .header-links a{display:none}.local-concept .theme-toggle{padding:7px 10px}.local-concept .theme-label{display:none}.local-concept .intro{min-height:300px;padding-right:0}.local-concept h1{font-size:54px}.local-concept .quiz-banner{padding:20px}.local-concept .quiz-banner-modes{grid-template-columns:1fr}.local-concept .tabs{top:68px;overflow-x:auto}.local-concept .tabs button{padding:15px 14px;white-space:nowrap}.local-concept .grid{grid-template-columns:1fr}.local-concept .tools{grid-template-columns:1fr}.local-concept .tools input{grid-column:auto}.local-concept .player{left:8px;right:8px;bottom:8px;border-radius:14px}.local-concept .service-status{left:6px}}