/* TWANG's studio showcase and Explore page share the game's midnight-salon palette. */
.twang-showcase{background:radial-gradient(circle at 78% 26%,#533044 0,#2b172c 38%,#190f24 100%);color:#fff6e8;border-top:1px solid #aa8245;border-bottom:1px solid #5a4264}
.twang-showcase h2{font:800 clamp(4rem,7vw,6rem)/.9 var(--studio-display);letter-spacing:.045em}
.twang-showcase h2 span,.twang-page h1 span,.twang-page h2 span{color:#f4c97c}
.twang-showcase .game-status{color:#f4d7a5;border-color:#836e66;background:#34263d;border-radius:999px}
.twang-showcase .game-summary{color:#e4d8d5}
.twang-button,.twang-cta{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;min-height:57px;padding:13px 22px;border-radius:999px;background:#edbe68;color:#211327;font:800 1.0625rem/1.2 var(--studio-font);box-shadow:0 6px 18px #08071066;transition:transform .16s ease-out,background .16s ease-out,box-shadow .16s ease-out}
.twang-button:hover,.twang-cta:hover{background:#ffdaa0;transform:translateY(-2px);box-shadow:0 10px 24px #08071080}
.twang-button span,.twang-cta span{font-size:1.5rem;line-height:1}
.twang-showcase .more-link{color:#fff5e7}
.shelf-tile[href="#twang"] .shelf-kind{font-size:.75rem;letter-spacing:.025em;text-transform:none}
.twang-art>a,.twang-hero-art>a{display:block;position:relative;border:1px solid #b28b53;overflow:hidden;border-radius:16px}
.twang-art img,.twang-hero-art img{width:100%;height:auto;aspect-ratio:16/9;object-fit:contain}
.twang-art figcaption{color:#dac5af}
.twang-showcase a:focus-visible,.twang-page a:focus-visible,.twang-page button:focus-visible{outline:3px solid #f4c97c;outline-offset:5px}
.twang-page{background:#120e1e;color:#fff7ec;font:400 1.0625rem/1.6 var(--studio-font);color-scheme:dark}
.twang-page ::selection,.twang-showcase ::selection{background:#edbe68;color:#211327}
.twang-page{scrollbar-color:#b98d58 #170f26}
.twang-page :where(h1,h2,h3){text-wrap:balance}
.twang-page :where(h1,h2,h3,p,figure){margin:0}
.twang-nav{display:flex;justify-content:space-between;align-items:center;gap:22px;min-height:84px;padding:12px 5%;border-bottom:1px solid #5d465a;background:#170f26}
.twang-nav .brand,.twang-footer .brand{color:#fff7ec}
.twang-nav .brand span,.twang-footer .brand span{color:#f4c97c}
.twang-page .brand span{letter-spacing:.05em}
.twang-nav nav{display:flex;align-items:center;gap:30px;font-weight:700}
.twang-nav nav a{display:inline-flex;align-items:center;min-height:44px}
.twang-nav-play{border:1px solid #d5aa6c;border-radius:999px;padding:5px 17px;color:#f4c97c}
.twang-nav-play span{margin-left:12px}
.twang-hero{position:relative;overflow:hidden;background:radial-gradient(circle at 74% 42%,#673746 0,#352038 36%,#190f24 78%)}
.twang-hero::before,.twang-final::before{content:"";pointer-events:none;position:absolute;inset:0;background:radial-gradient(circle at 15% 20%,#f4c97c12 0,transparent 28%)}
.twang-hero-inner{position:relative;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr);align-items:center;gap:5%;padding-block:76px 85px}
.twang-hero h1{font:900 clamp(5rem,8vw,6rem)/.87 var(--studio-display);letter-spacing:.045em;margin:14px 0 23px;text-shadow:0 7px 35px #06040b70}
.twang-tagline{font:700 clamp(1.9rem,3vw,3rem)/1.06 var(--studio-display);letter-spacing:-.015em}
.twang-tagline em{font-style:normal;color:#f4c97c}
.twang-lead{max-width:39ch;margin-top:24px;color:#e6d9d9;font-size:1.12rem}
.twang-hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px 25px;margin-top:30px}
.twang-text-link{display:inline-flex;align-items:center;min-height:44px;color:#f5ce89;font-weight:700;text-decoration:underline;text-underline-offset:5px}
.twang-fine{margin-top:22px;color:#d6c3ca;font-size:.9rem}
.twang-hero-art{min-width:0}
.twang-hero-art figcaption{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px 20px;margin-top:12px;color:#d9c4c3;font-size:.82rem}
.twang-facts{display:flex;flex-wrap:wrap;justify-content:center;gap:0;border-top:1px solid #574156;border-bottom:1px solid #574156;background:#24182f}
.twang-facts span{display:flex;align-items:baseline;gap:8px;padding:22px 40px;color:#e9d9ce;font-size:.95rem;border-right:1px solid #574156}
.twang-facts span:last-child{border-right:0}
.twang-facts b{color:#f4c97c;font:800 2rem/1 var(--studio-display)}
.twang-instrument-section{padding-block:80px 25px}
.twang-instrument-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:34px}
.twang-instrument-card{--instrument-tone:#f4c97c;display:grid;grid-template-columns:128px minmax(0,1fr);align-items:center;gap:20px;padding:24px;border:1px solid #685068;border-top:2px solid var(--instrument-tone);border-radius:14px;background:linear-gradient(140deg,#34233d,#21162d)}
.twang-instrument-card img{display:block;width:128px;height:144px;object-fit:contain;filter:drop-shadow(0 7px 12px #0b071a66)}
.twang-instrument-card h3{font:700 1.8rem/1.1 var(--studio-display);color:#fff7ec}
.twang-instrument-card .twang-instrument-role{margin-top:7px;color:var(--instrument-tone);font-size:.88rem;font-weight:700}
.twang-instrument-card p:last-child{margin-top:12px;color:#e3d5df;font-size:1rem;line-height:1.55}
.twang-instrument-violin{--instrument-tone:#a8eceb}
.twang-instrument-cello{--instrument-tone:#e6b1e4}
.twang-instrument-guitar{--instrument-tone:#a9e7c5}
.twang-instrument-section .twang-instrument-note{max-width:70ch;margin-top:25px;color:#d9cbd3;font-size:.94rem}
.twang-instrument-section>.twang-text-link{margin-top:10px}
.twang-stage-art>a{display:block;border-radius:16px}
.twang-how{padding-block:94px 105px}
.twang-section-head{max-width:780px}
.twang-page h2{font:800 clamp(2.9rem,5.2vw,5rem)/.98 var(--studio-display);letter-spacing:-.015em;margin-top:13px}
.twang-section-head>p:last-child{max-width:54ch;margin-top:23px;color:#dfd0d7}
.twang-steps{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding:0;margin:38px 0 0}
.twang-steps li{min-width:0;padding:24px 25px 28px;border-top:1px solid #6a5061}
.twang-step-number{color:#e4b26f;font-size:.83rem;font-weight:800;letter-spacing:.05em}
.twang-steps h3{margin-top:22px;font:700 1.8rem/1 var(--studio-display)}
.twang-steps p{margin-top:12px;color:#d9cbd3;font-size:.97rem}
.twang-stage-section{background:linear-gradient(145deg,#3b2441,#21132b);border-block:1px solid #685068}
.twang-stage-inner{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.72fr);gap:10%;align-items:center;padding-block:70px}
.twang-stage-copy p:not(.twang-kicker){max-width:49ch;margin-top:24px;color:#e3d5d6}
.twang-stage-copy h3{margin-top:30px;font:700 1.8rem/1.1 var(--studio-display);color:#f4c97c}
.twang-stage-copy h3+p{margin-top:10px}
.twang-stage-copy .twang-text-link{margin-top:21px}
.twang-stage-art{max-width:380px;justify-self:center}
.twang-stage-art img{width:100%;height:auto;aspect-ratio:390/664;object-fit:contain;border:1px solid #b98d58;border-radius:16px}
.twang-stage-art figcaption{margin-top:13px;color:#d1c0c3;font-size:.84rem;text-align:center}
.twang-final{position:relative;overflow:hidden;text-align:center;padding:85px 5% 95px;background:radial-gradient(circle at 50% 35%,#54314d,#21152b 72%)}
.twang-final .content-width{position:relative}
.twang-final h2{margin-top:13px}
.twang-final p:not(.twang-kicker){margin:22px auto 29px;max-width:46ch;color:#e7d8db}
.twang-final .twang-sound-note{font-size:.94rem;color:#d6c3ca}
.twang-footer{background:#100c1a;border-top:1px solid #554057;padding:28px 0}
.twang-footer .content-width{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.twang-footer a:last-child{color:#f4cf91;font-weight:700;text-decoration:underline;text-underline-offset:5px}
.twang-legal{padding:8px 5% 25px;background:#100c1a;color:#d4c5cf;text-align:center;font-size:.8rem;line-height:1.8}
.twang-legal a{display:inline-flex;align-items:center;min-height:44px;padding:0 8px;text-decoration:underline;text-underline-offset:4px}
@media(max-width:900px){.twang-hero-inner{grid-template-columns:1fr;gap:35px;padding-block:50px 60px}.twang-hero-copy{max-width:650px}.twang-hero h1{font-size:clamp(5rem,16vw,6rem)}.twang-stage-inner{gap:6%}}
@media(max-width:700px){.twang-steps{grid-template-columns:1fr}.twang-steps li{padding:22px 23px}.twang-stage-inner{grid-template-columns:1fr;gap:38px}.twang-stage-art{width:min(80%,350px)}.twang-how{padding-block:68px 72px}.twang-facts span{width:50%;justify-content:center;border-bottom:1px solid #574156;padding:17px 10px}.twang-facts span:nth-child(2){border-right:0}.twang-facts span:nth-child(n+3){border-bottom:0}}
@media(max-width:1000px){.twang-instrument-card{grid-template-columns:88px minmax(0,1fr);gap:14px;padding:20px}.twang-instrument-card img{width:88px;height:120px}}
@media(max-width:700px){.twang-instrument-section{padding-top:56px}.twang-instrument-grid{grid-template-columns:1fr;gap:14px}.twang-instrument-card{grid-template-columns:96px minmax(0,1fr)}.twang-instrument-card img{width:96px;height:136px}}
@media(max-width:430px){.twang-nav{min-height:76px}.twang-nav .brand{font-size:1.5rem}.twang-nav nav{gap:9px;font-size:.85rem}.twang-nav-play{padding:4px 10px}.twang-nav-play span{margin-left:4px}.twang-hero-inner{padding-block:42px 52px}.twang-hero h1{font-size:5rem}.twang-tagline{font-size:2rem}.twang-lead{font-size:1.02rem}.twang-showcase h2{font-size:4.3rem}.twang-facts span{font-size:.83rem}.twang-facts b{font-size:1.7rem}.twang-final{padding-block:65px 70px}}
@media(prefers-reduced-motion:reduce){.twang-button,.twang-cta{transition:none}}