/* Amy Guitar Studio: aubergine, cream, copper and an archtop jazz guitar. */
:root,html[data-theme=dark]{
 --bg:#211923;--surface:#2d2230;--surface2:#3a2d3b;--line:#584557;--line-2:#745b68;
 --text:#f7f2e9;--text2:#e2d5d3;--muted:#c4b2b7;--dim:#bba6ad;--accent:#edaa7d;--accent-soft:#493037;
 --panel-2:#291d2c;--accent-ink:#251b29;--green:#442d3c;--on-green:#f7f2e9;
 --card-edge:#68505f;--card-rule:#58414f;--card-fill:#302331;--card-glow:#e6bca81c;--card-low:#251b29;
 --well:#241b27;--well-line:#584151;--brass:#edb184;--brass-light:#efcf9f;--inset:inset 0 1px 0 #f8e5d01a;
 --fret-nut:#d9beb2;--fret-line:#725965;--fret-label:#cbb5bc;--fret-board:#291d2c;--fret-dot:#edb184;--fret-dot-ink:#251b29;
 --wave-line:#604859;--wave-past:#edb184;--wave-next:#b18a9d;--wave-head:#f7e0c6;
 --sans:'Noto Sans TC','Noto Sans JP','Yu Gothic','Hiragino Kaku Gothic ProN','Microsoft JhengHei',system-ui,sans-serif;
}
html[data-theme=light]{
 --bg:#f7f2e9;--surface:#fdfaf5;--surface2:#eee3d9;--line:#dcd2c6;--line-2:#c6b4a9;
 --text:#251b29;--text2:#4e3b47;--muted:#6b5761;--dim:#74616b;--accent:#a34f2f;--accent-soft:#f4dfcd;
 --panel-2:#f0e5da;--card-edge:#d4bfae;--card-rule:#e3d3c5;--card-fill:#fdfaf5;--card-glow:#ffffffc9;--card-low:#f6eee4;
 --well:#f0e7de;--well-line:#ddc9b8;--brass:#9c5535;--brass-light:#dfb687;--inset:inset 0 1px 0 #ffffffe0;
 --fret-nut:#795c56;--fret-line:#bfa696;--fret-label:#705962;--fret-board:#f1e8dd;--fret-dot:#573141;--fret-dot-ink:#fffaf2;
 --wave-line:#d9c5b7;--wave-past:#a45934;--wave-next:#b99d95;--wave-head:#503041;
}
body.refined{background:var(--bg)}
body.refined::before{background-image:url('jazz-hollow-body.webp');background-position:center top;filter:none}
body.refined::after{background:linear-gradient(90deg,#f7f2e9f5 0%,#f7f2e9e8 35%,#f7f2e952 75%,#f7f2e91a),linear-gradient(0deg,#f7f2e9e6,transparent 65%)}
html[data-theme=dark] body.refined::before{filter:brightness(.88) saturate(.85)}
html[data-theme=dark] body.refined::after,html[data-theme=dark] body.refined.lobby-app::after{background:linear-gradient(90deg,#211923d9 0%,#211923b3 38%,#21192312 76%),linear-gradient(0deg,#211923e6,transparent 75%)}
.refined .studio-nav{background:#fdfaf5e6;border-color:#d4bfae88}
html[data-theme=dark] .refined .studio-nav{background:#251b29d9;border-color:#ba8d7555}
.refined .studio-brand{font:italic 24px/1.1 Georgia,'Times New Roman',serif;letter-spacing:-.6px;gap:11px}
.studio-brand>span:last-child:after{content:'TAIPEI · CHORD PRACTICE';font:8px/1.5 var(--sans);letter-spacing:1.7px;margin-top:5px}
.hero>div{max-width:820px}.hero h1{font-size:clamp(40px,4.6vw,66px);line-height:1.25;white-space:normal;letter-spacing:-.03em;text-shadow:none}
.hero p{font-size:14px;letter-spacing:.4px}.hero-foot{font-size:12px}
html[data-theme=dark] .hero h1{text-shadow:0 2px 18px #21192380}
.refined :is(.studio-button.primary,.btn.primary),html[data-theme=light] .refined .studio-button.primary{background:linear-gradient(135deg,#9c533d,#693448);border-color:#aa6b56;color:#fff9f0}
html[data-theme=dark] .refined :is(.studio-button.primary,.btn.primary){background:linear-gradient(135deg,#f0bd90,#df9365);border-color:#efbb8e;color:#251b29}
body.refined .mode-card.featured{--card-edge:#9d7065;--card-rule:#865b60;--card-fill:#694151;--card-glow:#efbd8c21;--card-low:#392735;--well:#382633;--well-line:#875e64;--brass:#f0c397;--brass-light:#f5d2a7;--ink:#fcf4e7;--muted:#e7cfd0;--gold:#f0c397}
body.refined .featured .round-arrow{color:#3b2634;background:linear-gradient(135deg,#f4d5b0,#ddaa79);border-color:#ecc392}
body.refined .featured .card-index>span:first-child{color:var(--brass)}
.refined.practice-app .hero-practice,html[data-theme=light] .refined.practice-app .hero-practice{background:radial-gradient(ellipse at 0% 0%,#efbd8c21,transparent 78%),linear-gradient(140deg,#694151,#392735);border-color:#9d7065;color:#fcf4e7}
.refined.practice-app .hero-practice .tx>span,html[data-theme=light] .refined.practice-app .hero-practice .tx>span{color:#e7cfd0}
.refined.practice-app .hero-practice .hero-kicker,.refined.practice-app .hero-practice .hero-cta,html[data-theme=light] .refined.practice-app .hero-practice .hero-kicker,html[data-theme=light] .refined.practice-app .hero-practice .hero-cta{color:#f0c397}
.refined.practice-app .mic-action{background:linear-gradient(135deg,#9c533d,#693448)!important;color:#fff9f0!important;border-color:#aa6b56!important}
html[data-theme=dark] .refined.practice-app .mic-action{background:linear-gradient(135deg,#f0bd90,#df9365)!important;color:#251b29!important;border-color:#efbb8e!important}
.refined.song-app .play-btn{background:linear-gradient(135deg,#9c533d,#693448);border-color:#aa6b56;color:#fff9f0}
html[data-theme=dark] .refined.song-app .play-btn{background:linear-gradient(135deg,#f0bd90,#df9365);color:#251b29}
.refined .studio-links>a{white-space:normal;text-align:center;line-height:1.4}
.refined :is(button,.card-link,.timing-heading){overflow-wrap:break-word}
html:lang(en) .refined .studio-links{gap:22px}
html:lang(en) .section-top{gap:16px;flex-wrap:wrap}
html:lang(en) .refined .fret-actions .studio-button{min-width:0}
html:lang(en) .refined .timing-heading{flex-wrap:wrap}
@media(min-width:701px) and (max-width:1000px){.refined .studio-nav{flex-wrap:wrap;gap:14px;padding-top:19px}.refined .studio-links{flex-basis:100%;justify-content:space-between;min-height:50px}.refined .studio-links>a{min-height:50px}.refined .studio-brand{font-size:24px}}
@media(min-width:1100px),(min-width:768px) and (min-height:600px) and (orientation:landscape){
 body.refined:not(.lobby-app)::before{filter:blur(30px)}
 body.refined:not(.lobby-app)::after{background:#f7f2e9c4}
 html[data-theme=dark] body.refined:not(.lobby-app)::before{filter:brightness(.75) saturate(.8) blur(30px)}
 html[data-theme=dark] body.refined:not(.lobby-app)::after{background:#211923b3}
}
@media(max-width:760px){.refined .studio-brand{font-size:24px;letter-spacing:-.6px}.refined .studio-links{gap:5px!important}.refined .studio-links>a{font-size:11px;flex:1;padding:0 3px}.refined .studio-theme-toggle{flex-shrink:0}}
@media(max-width:700px){
 body.refined::before{background-size:auto 100vh;background-position:64% top}
 body.refined::after{background:linear-gradient(90deg,#f7f2e9eb,#f7f2e966),linear-gradient(0deg,#f7f2e9f2,transparent 85%)}
 html[data-theme=dark] body.refined::before{filter:brightness(.8) saturate(.85)}
 html[data-theme=dark] body.refined::after,html[data-theme=dark] body.refined.lobby-app::after{background:linear-gradient(90deg,#211923e6,#2119234d),linear-gradient(0deg,#211923f2,transparent 85%)}
 .hero{min-height:255px;padding-top:16px}.hero h1{font-size:clamp(34px,9.5vw,48px);max-width:300px;white-space:normal}.hero p{font-size:12px;max-width:270px}.hero-foot{font-size:10px;max-width:270px;line-height:1.8}
 .section-top{align-items:start;gap:14px}.section-top>span{max-width:115px;text-align:right;line-height:1.8}
 .refined .fret-exercise .target-copy{grid-template-columns:70px minmax(0,1fr)}
 .refined .fret-actions{gap:7px}.refined .fret-actions .studio-button{padding-inline:9px;line-height:1.5}
 html:lang(en) .refined .fret-segment button{font-size:11px;white-space:normal;padding-inline:7px}
 .refined .timing-heading{gap:10px}.refined .timing-stat>span{font-size:10px}.refined .timing-stat>b{font-size:20px}
}