.app{display:block}.builder{max-width:1250px;margin:auto;padding:40px clamp(16px,4vw,48px)}.heading{margin-bottom:32px}.heading h1{font-size:clamp(36px,5vw,60px);line-height:1.08;letter-spacing:-.05em;margin:12px 0 20px}.heading h1 span{color:var(--cyan)}p{line-height:1.65}.heading>p:last-child,.muted,.board-heading p{color:var(--muted)}.panel{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:26px;margin-bottom:22px}h2{font-size:22px;letter-spacing:-.025em;margin:8px 0 20px}.section-title,.board-heading,.actions{display:flex;align-items:center;justify-content:space-between;gap:16px}.controls{display:grid;grid-template-columns:repeat(3,1fr) auto;gap:14px;align-items:end}label{display:grid;gap:8px;color:var(--muted);font-size:12px}select,button{font:inherit;min-height:44px;border-radius:8px;padding:10px 14px;border:1px solid var(--line)}select{background:#151a23;color:var(--text);width:100%}button{background:var(--cyan);color:#08151b;font-weight:650;cursor:pointer}.secondary{background:#1a202a;color:var(--text)}button:hover{filter:brightness(1.15)}button:focus-visible,select:focus-visible,.board-scroll:focus-visible,a:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}.recipe{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:26px}.ingredient{background:#ffffff03;border:1px solid var(--line);border-top:3px solid var(--tone);padding:20px;border-radius:10px;display:grid;gap:8px}.ingredient strong{font-size:32px;color:var(--tone)}.ingredient small{color:var(--muted)}.explanation{min-height:52px}.board-heading{margin:22px 0 16px}.board-heading p{font-size:12px}.board-scroll{overflow-x:auto;padding:4px}.board{display:grid;grid-template-columns:42px repeat(13,minmax(50px,1fr));min-width:790px}.fret-label{text-align:center;font-size:11px;color:var(--muted);padding:10px 0}.string-name{display:grid;place-items:center;font-size:12px;color:var(--muted)}.fret{position:relative;border:0;border-right:1px solid #606675;border-radius:0;padding:0;height:48px;background:linear-gradient(transparent 49%,#626775 50%,transparent 53%);display:grid;place-items:center}.fret.open{border-right:4px solid #a4aab6}.fret span{z-index:1;border-radius:50%;width:33px;height:33px;display:grid;place-items:center;font-size:11px;color:#080a0e;background:var(--tone)}.fret.empty span{background:#141922;color:#818b9b;width:23px;height:23px;font-size:10px}.fret:disabled{cursor:default;opacity:1}.columns{display:grid;grid-template-columns:1fr 1fr;gap:22px}.answers{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.answers button{background:#19212c;color:var(--text)}.answers button:disabled{opacity:.4;cursor:default}.progress{display:flex;gap:8px;margin:20px 0}.progress span{flex:1;padding:12px 6px;text-align:center;border:1px solid var(--line);border-radius:8px;color:var(--muted)}.progress .found{border-color:var(--cyan);color:var(--cyan)}#feedback{min-height:54px;color:var(--cyan)}.lessons{list-style:none;padding:0;display:grid;gap:20px}.lessons li{display:grid;gap:6px}.lessons span{font-size:14px;line-height:1.6;color:var(--muted)}.root-color{color:var(--cyan)}.third-color{color:var(--violet)}.fifth-color{color:#fbbf24}footer{display:flex;gap:24px;flex-wrap:wrap}footer a{color:var(--cyan);font-size:13px}#audio-status{font-size:12px;color:var(--muted)}@media(max-width:800px){.columns{grid-template-columns:1fr}.controls{grid-template-columns:1fr 1fr}.section-title{align-items:start}.section-title button{white-space:nowrap}}@media(max-width:480px){.panel{padding:16px}.section-title,.board-heading{align-items:start;flex-direction:column}.recipe{gap:6px}.ingredient{padding:12px 8px;font-size:12px}.ingredient strong{font-size:26px}.actions{flex-wrap:wrap}}