.page-shell{max-width:1200px} main{padding:16px 0 8px} h1{font-size:clamp(30px,4vw,44px)}.intro{max-width:850px}.keyboard-section{margin-top:12px}.guide-hint{font-size:14px;color:var(--text-muted)}.keyboard-scroll{overflow-x:auto;padding:4px}.keyboard-scroll .workspace{min-width:620px;padding-bottom:105px;margin:14px 0 0;overflow:visible}.keyboard-scroll .keyboard{max-width:900px}.guide-key.home-key{opacity:1}.guide-key:focus-visible{outline:2px solid var(--accent);outline-offset:2px}#finger-instruction{line-height:1.5;margin:8px 0}.practice-tips{margin:28px 0}.practice-tips h2{font-size:18px}.practice-tips ul{padding-left:20px;line-height:1.8;color:var(--text-muted)}@media(max-width:650px){.page-header{flex-wrap:wrap}}

[hidden]{display:none!important}
.mini-practice{padding:12px 18px;border:1px solid var(--border);border-radius:16px;background:var(--panel);margin-top:10px}
.practice-heading{display:flex;justify-content:space-between;gap:12px;font-size:14px}
#practice-pattern{display:flex;justify-content:center;gap:clamp(10px,3vw,32px);padding:12px 0;font-size:clamp(22px,3vw,34px);font-weight:600}
#practice-pattern span{border-bottom:3px solid transparent;padding-bottom:6px}
#practice-pattern .current{border-color:var(--accent);color:var(--text)}
#practice-pattern .complete{color:var(--accent)}
#practice-progress{width:100%;height:8px;accent-color:var(--accent)}
.practice-error{font-weight:600}

.page-shell{padding-top:18px;padding-bottom:8px}.page-header{min-height:42px;padding-bottom:12px}.page-header .page-action{padding:9px 14px;font-size:14px}.eyebrow{margin:8px 0}h1{margin:10px 0}.intro{margin:10px 0;line-height:1.5}.guide-hint{margin:8px 0}#finger-instruction:empty{display:none}footer{padding:12px 0}

.guide-header-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.guide-header-actions .icon-btn{font:inherit;font-size:14px}
