{"id":5515,"date":"2026-11-04T18:53:59","date_gmt":"2026-11-04T17:53:59","guid":{"rendered":"https:\/\/deskaudio.eu\/?post_type=da_nastroj&#038;p=5515"},"modified":"2026-11-10T20:12:29","modified_gmt":"2026-11-10T19:12:29","slug":"podklady","status":"publish","type":"da_nastroj","link":"https:\/\/deskaudio.eu\/cs\/kytara\/nastroje\/podklady\/","title":{"rendered":"Gener\u00e1tor podklad\u016f"},"content":{"rendered":"<div class=\"da-lekcia da-nastroj\" data-lekcia=\"nastroj-podklady\">\n<div style=\"width: 100%; background: #141311; color: #EDEAE4; font-family: 'Instrument Sans', 'Helvetica Neue', Arial, sans-serif;\"><main style=\"max-width: 1240px; margin: 0 auto; padding: 40px 24px 64px; display: flex; flex-direction: column; gap: 28px;\"><\/p>\n<nav aria-label=\"N\u00e1stroje\" style=\"display: flex; flex-wrap: wrap; gap: 6px; align-items: center;\"><span style=\"font-size: 13px; font-weight: 600; color: #A8A29A; margin-right: 6px;\">N\u00e1stroje:<\/span><a href=\"https:\/\/deskaudio.eu\/cs\/kytara\/nastroje\/hmatnik\/\" style=\"display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border-radius: 999px; font-size: 14px; font-weight: 600; text-decoration: none; color: #EDEAE4; border: 1px solid #3A3733;\">Hmatn\u00edk<\/a><a href=\"https:\/\/deskaudio.eu\/cs\/kytara\/nastroje\/akordy\/\" style=\"display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border-radius: 999px; font-size: 14px; font-weight: 600; text-decoration: none; color: #EDEAE4; border: 1px solid #3A3733;\">Akordy<\/a><a href=\"https:\/\/deskaudio.eu\/cs\/kytara\/nastroje\/kvintovy-kruh\/\" style=\"display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border-radius: 999px; font-size: 14px; font-weight: 600; text-decoration: none; color: #EDEAE4; border: 1px solid #3A3733;\">Kvintov\u00fd kruh<\/a><a href=\"https:\/\/deskaudio.eu\/cs\/kytara\/nastroje\/transpozice\/\" style=\"display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border-radius: 999px; font-size: 14px; font-weight: 600; text-decoration: none; color: #EDEAE4; border: 1px solid #3A3733;\">Transpozice<\/a><a href=\"https:\/\/deskaudio.eu\/cs\/kytara\/nastroje\/rytmy\/\" style=\"display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border-radius: 999px; font-size: 14px; font-weight: 600; text-decoration: none; color: #EDEAE4; border: 1px solid #3A3733;\">Rytmy<\/a><a href=\"https:\/\/deskaudio.eu\/cs\/kytara\/nastroje\/podklady\/\" aria-current=\"page\" style=\"display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border-radius: 999px; font-size: 14px; font-weight: 600; text-decoration: none; background: #EDEAE4; color: #141311; border: 1px solid #EDEAE4;\">Podklady<\/a><a href=\"https:\/\/deskaudio.eu\/cs\/kytara\/nastroje\/trener-sluchu\/\" style=\"display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border-radius: 999px; font-size: 14px; font-weight: 600; text-decoration: none; color: #EDEAE4; border: 1px solid #3A3733;\">Tren\u00e9r sluchu<\/a><\/nav>\n<div style=\"display: flex; flex-direction: column; gap: 10px; max-width: 46em;\">\n      <span style=\"font-size: 13px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: #F2804A;\">N\u00e1stroj<\/span><\/p>\n<h1 style=\"margin: 0; font-family: 'Syne', sans-serif; font-weight: 800; font-size: clamp(34px, 4vw, 48px); line-height: 1.05; letter-spacing: -0.02em;\">Gener\u00e1tor podklad\u016f<\/h1>\n<p style=\"margin: 0; font-size: 17px; line-height: 1.55; color: #C9C3BA;\">Vyber t\u00f3ninu, postup a styl. Bic\u00ed, basa a kytara budou hr\u00e1t dokola a ty si nad t\u00edm zkou\u0161\u00ed\u0161 s\u00f3lo. Hmatn\u00edk dole ukazuje stupnici a t\u00f3ny akordu, kter\u00fd pr\u00e1v\u011b zn\u00ed.<\/p>\n<\/p><\/div>\n<section aria-labelledby=\"set-h\" style=\"display: flex; flex-direction: column; gap: 18px; padding: 24px; border-radius: 20px; background: #1D1B19; border: 1px solid #3A3733;\">\n<h2 id=\"set-h\" style=\"margin: 0; font-family: 'Syne', sans-serif; font-weight: 700; font-size: 24px;\">1. T\u00f3nina a postup<\/h2>\n<div style=\"display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center;\">\n        <span style=\"font-size: 13px; font-weight: 600; color: #A8A29A; width: 72px;\">T\u00f3nina<\/span><\/p>\n<div role=\"group\" aria-label=\"Z\u00e1kladn\u00ed t\u00f3n t\u00f3niny\" style=\"display: flex; flex-wrap: wrap; gap: 6px;\">\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">C<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">C#<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">D<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">Eb<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">E<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">F<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">F#<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">G<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">Ab<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"true\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #F2804A; background: #F2804A; color: #141311;\">A<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">Bb<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">B<\/button>\n        <\/div>\n<div role=\"group\" aria-label=\"Dur, nebo moll\" style=\"display: flex; border: 1px solid #8C867D; border-radius: 999px; overflow: hidden;\">\n          <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; padding: 0 16px; border: 0; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; background: transparent; color: #EDEAE4;\">Dur<\/button><br \/>\n          <button type=\"button\" aria-pressed=\"true\" style=\"min-height: 40px; padding: 0 16px; border: 0; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; background: #EDEAE4; color: #141311;\">Moll<\/button>\n        <\/div>\n<\/p><\/div>\n<div style=\"display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 10px;\">\n          <button type=\"button\" aria-pressed=\"true\" style=\"display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 14px 16px; border-radius: 14px; cursor: pointer; font: inherit; text-align: left; background: #2A2420; border: 2px solid #F2804A;\"><br \/>\n            <span style=\"font-size: 13px; font-weight: 700; color: #A8A29A;\">i \u2013 VI \u2013 III \u2013 VII<\/span><br \/>\n            <span style=\"font-family: Syne, sans-serif; font-size: 20px; font-weight: 800; color: #EDEAE4; line-height: 1.2;\">Am \u2013 F \u2013 C \u2013 G<\/span><br \/>\n            <span style=\"font-size: 13px; line-height: 1.45; color: #A8A29A;\">Mollov\u00e1 podoba \u201e\u010dty\u0159 akord\u016f\u201c, typick\u00e1 pro pop a rock.<\/span><br \/>\n          <\/button><br \/>\n          <button type=\"button\" aria-pressed=\"false\" style=\"display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 14px 16px; border-radius: 14px; cursor: pointer; font: inherit; text-align: left; background: #26231F; border: 1px solid #3A3733;\"><br \/>\n            <span style=\"font-size: 13px; font-weight: 700; color: #A8A29A;\">i \u2013 VII \u2013 VI \u2013 V<\/span><br \/>\n            <span style=\"font-family: Syne, sans-serif; font-size: 20px; font-weight: 800; color: #EDEAE4; line-height: 1.2;\">Am \u2013 G \u2013 F \u2013 E<\/span><br \/>\n            <span style=\"font-size: 13px; line-height: 1.45; color: #A8A29A;\">Andalusk\u00e1 kadence. Na V zn\u00ed zv\u00fd\u0161en\u00fd 7. stupe\u0148 (lekce 27).<\/span><br \/>\n          <\/button><br \/>\n          <button type=\"button\" aria-pressed=\"false\" style=\"display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 14px 16px; border-radius: 14px; cursor: pointer; font: inherit; text-align: left; background: #26231F; border: 1px solid #3A3733;\"><br \/>\n            <span style=\"font-size: 13px; font-weight: 700; color: #A8A29A;\">i7 \u2013 IV7<\/span><br \/>\n            <span style=\"font-family: Syne, sans-serif; font-size: 20px; font-weight: 800; color: #EDEAE4; line-height: 1.2;\">Am7 \u2013 D7<\/span><br \/>\n            <span style=\"font-size: 13px; line-height: 1.45; color: #A8A29A;\">D\u00f3rsk\u00fd groove: durov\u00fd akord na IV dod\u00e1v\u00e1 mollu sv\u011btlo (lekce 15).<\/span><br \/>\n          <\/button><br \/>\n          <button type=\"button\" aria-pressed=\"false\" style=\"display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 14px 16px; border-radius: 14px; cursor: pointer; font: inherit; text-align: left; background: #26231F; border: 1px solid #3A3733;\"><br \/>\n            <span style=\"font-size: 13px; font-weight: 700; color: #A8A29A;\">i \u2013 VII \u2013 VI \u2013 VII<\/span><br \/>\n            <span style=\"font-family: Syne, sans-serif; font-size: 20px; font-weight: 800; color: #EDEAE4; line-height: 1.2;\">Am \u2013 G \u2013 F \u2013 G<\/span><br \/>\n            <span style=\"font-size: 13px; line-height: 1.45; color: #A8A29A;\">Epick\u00fd rockov\u00fd sled v mollu.<\/span><br \/>\n          <\/button><br \/>\n          <button type=\"button\" aria-pressed=\"false\" style=\"display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 14px 16px; border-radius: 14px; cursor: pointer; font: inherit; text-align: left; background: #26231F; border: 1px solid #3A3733;\"><br \/>\n            <span style=\"font-size: 13px; font-weight: 700; color: #A8A29A;\">Mollov\u00e9 blues<\/span><br \/>\n            <span style=\"font-family: Syne, sans-serif; font-size: 20px; font-weight: 800; color: #EDEAE4; line-height: 1.2;\">Am7 \u00b7 Dm7 \u00b7 F7 \u00b7 E7<\/span><br \/>\n            <span style=\"font-size: 13px; line-height: 1.45; color: #A8A29A;\">i7 a iv7, na konci bVI7 \u2013 V7. Temn\u011bj\u0161\u00ed bratr 12taktov\u00e9ho blues.<\/span><br \/>\n          <\/button><br \/>\n          <button type=\"button\" aria-pressed=\"false\" style=\"display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 14px 16px; border-radius: 14px; cursor: pointer; font: inherit; text-align: left; background: #26231F; border: 1px solid #3A3733;\"><br \/>\n            <span style=\"font-size: 13px; font-weight: 700; color: #A8A29A;\">Vlastn\u00ed<\/span><br \/>\n            <span style=\"font-family: Syne, sans-serif; font-size: 20px; font-weight: 800; color: #EDEAE4; line-height: 1.2;\">Poskl\u00e1dej si s\u00e1m<\/span><br \/>\n            <span style=\"font-size: 13px; line-height: 1.45; color: #A8A29A;\">Vyber akordy t\u00f3niny a vlastn\u00ed po\u0159ad\u00ed (lekce 28).<\/span><br \/>\n          <\/button>\n      <\/div>\n<\/section>\n<section aria-labelledby=\"play-h\" style=\"display: flex; flex-direction: column; gap: 18px; padding: 24px; border-radius: 20px; background: #1D1B19; border: 1px solid #3A3733;\">\n<h2 id=\"play-h\" style=\"margin: 0; font-family: 'Syne', sans-serif; font-weight: 700; font-size: 24px;\">2. Styl a p\u0159ehr\u00e1v\u00e1n\u00ed<\/h2>\n<div style=\"display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center;\">\n        <span style=\"font-size: 13px; font-weight: 600; color: #A8A29A; width: 72px;\">Styl<\/span><\/p>\n<div role=\"group\" aria-label=\"Styl podkladu\" style=\"display: flex; flex-wrap: wrap; gap: 6px;\">\n            <button type=\"button\" aria-pressed=\"true\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #F2804A; background: #F2804A; color: #141311;\">Pop<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">Rock<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">Balada<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">Shuffle<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">Funk<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">Reggae<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">Folk<\/button>\n        <\/div>\n<\/p><\/div>\n<p style=\"margin: 0; font-size: 15px; line-height: 1.55; color: #A8A29A;\">Rovn\u00e9 osminy, kytara hraje popov\u00fd vzorec \u2193 \u00b7 \u2193\u2191 \u00b7 \u2191\u2193\u2191 a basa t\u00e1hne z\u00e1kladn\u00ed t\u00f3n akordu.<\/p>\n<div style=\"display: flex; flex-wrap: wrap; gap: 16px 28px; align-items: center;\">\n        <button type=\"button\" style=\"display: inline-flex; align-items: center; gap: 10px; min-height: 52px; padding: 0 22px 0 10px; border-radius: 999px; border: 0; background: #F2804A; color: #141311; font: inherit; font-weight: 800; font-size: 17px; cursor: pointer;\"><br \/>\n          <span style=\"width: 34px; height: 34px; border-radius: 50%; background: #141311; color: #F2804A; display: grid; place-items: center;\"><br \/>\n            <svg aria-hidden=\"true\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M7 4v16l13-8z\"><\/path><\/svg><br \/>\n          <\/span><br \/>\n          Hr\u00e1t podklad<br \/>\n        <\/button><\/p>\n<div style=\"display: flex; flex-wrap: wrap; gap: 10px; align-items: center;\">\n          <button type=\"button\" aria-label=\"O 5 BPM pomaleji\" style=\"min-width: 44px; min-height: 44px; border-radius: 999px; border: 1px solid #8C867D; background: transparent; color: #EDEAE4; font: inherit; font-weight: 700; cursor: pointer;\">\u22125<\/button><br \/>\n          <label style=\"display: flex; flex-direction: column; gap: 4px; min-width: 220px;\"><br \/>\n            <span style=\"font-size: 13px; color: #A8A29A; font-weight: 600;\">Tempo <strong style=\"font-family: 'Syne', sans-serif; font-size: 22px; color: #EDEAE4;\">90<\/strong> BPM<\/span><br \/>\n            <input type=\"range\" min=\"50\" max=\"160\" step=\"1\" value=\"90\" aria-label=\"Tempo v \u00faderech za minutu\" style=\"width: 100%; accent-color: #F2804A;\"\/><br \/>\n          <\/label><br \/>\n          <button type=\"button\" aria-label=\"O 5 BPM rychleji\" style=\"min-width: 44px; min-height: 44px; border-radius: 999px; border: 1px solid #8C867D; background: transparent; color: #EDEAE4; font: inherit; font-weight: 700; cursor: pointer;\">+5<\/button>\n        <\/div>\n<\/p><\/div>\n<div style=\"display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center;\">\n        <span style=\"font-size: 13px; font-weight: 600; color: #A8A29A; width: 72px;\">Hraje<\/span><\/p>\n<div style=\"display: flex; flex-wrap: wrap; gap: 6px;\">\n            <button type=\"button\" aria-pressed=\"true\" style=\"min-height: 40px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #EDEAE4; background: #EDEAE4; color: #141311;\">Bic\u00ed<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"true\" style=\"min-height: 40px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #EDEAE4; background: #EDEAE4; color: #141311;\">Basa<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"true\" style=\"min-height: 40px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #EDEAE4; background: #EDEAE4; color: #141311;\">Kytara<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">Metronom<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">2 takty na akord<\/button>\n        <\/div>\n<\/p><\/div>\n<div style=\"display: flex; flex-direction: column; gap: 14px; padding: 18px; border-radius: 16px; background: #2A2420;\">\n<div aria-live=\"polite\" style=\"display: flex; flex-wrap: wrap; gap: 8px 22px; align-items: baseline;\">\n          <span style=\"font-size: 13px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: #A8A29A;\">Te\u010f<\/span><br \/>\n          <span style=\"font-family: 'Syne', sans-serif; font-weight: 800; font-size: 44px; line-height: 1; color: #FFD166;\">Am<\/span><br \/>\n          <span style=\"font-size: 16px; font-weight: 700; color: #A8A29A;\">i v A moll<\/span><br \/>\n          <span style=\"font-size: 16px; color: #C9C3BA;\">d\u00e1l: F<\/span><br \/>\n          <span style=\"display: flex; gap: 6px; margin-left: auto; align-items: center;\" aria-hidden=\"true\"><br \/>\n            <span style=\"width: 14px; height: 14px; border-radius: 50%; background: #3A3733;\"><\/span><span style=\"width: 14px; height: 14px; border-radius: 50%; background: #3A3733;\"><\/span><span style=\"width: 14px; height: 14px; border-radius: 50%; background: #3A3733;\"><\/span><span style=\"width: 14px; height: 14px; border-radius: 50%; background: #3A3733;\"><\/span><br \/>\n          <\/span>\n        <\/div>\n<div role=\"group\" aria-label=\"Takty postupu\" style=\"display: flex; flex-wrap: wrap; gap: 6px;\">\n            <button type=\"button\" aria-label=\"Takt 1: Am\" style=\"display: flex; flex-direction: column; align-items: center; gap: 1px; min-width: 64px; min-height: 52px; padding: 6px 10px; border-radius: 12px; cursor: pointer; font: inherit; border: 1px solid #F2804A; background: #F2804A; color: #141311;\"><span style=\"font-size: 11px; font-weight: 700; opacity: 0.8;\">i<\/span><span style=\"font-family: Syne, sans-serif; font-weight: 800; font-size: 17px;\">Am<\/span><\/button><br \/>\n            <button type=\"button\" aria-label=\"Takt 2: F\" style=\"display: flex; flex-direction: column; align-items: center; gap: 1px; min-width: 64px; min-height: 52px; padding: 6px 10px; border-radius: 12px; cursor: pointer; font: inherit; border: 1px solid #3A3733; background: #1D1B19; color: #EDEAE4;\"><span style=\"font-size: 11px; font-weight: 700; opacity: 0.8;\">VI<\/span><span style=\"font-family: Syne, sans-serif; font-weight: 800; font-size: 17px;\">F<\/span><\/button><br \/>\n            <button type=\"button\" aria-label=\"Takt 3: C\" style=\"display: flex; flex-direction: column; align-items: center; gap: 1px; min-width: 64px; min-height: 52px; padding: 6px 10px; border-radius: 12px; cursor: pointer; font: inherit; border: 1px solid #3A3733; background: #1D1B19; color: #EDEAE4;\"><span style=\"font-size: 11px; font-weight: 700; opacity: 0.8;\">III<\/span><span style=\"font-family: Syne, sans-serif; font-weight: 800; font-size: 17px;\">C<\/span><\/button><br \/>\n            <button type=\"button\" aria-label=\"Takt 4: G\" style=\"display: flex; flex-direction: column; align-items: center; gap: 1px; min-width: 64px; min-height: 52px; padding: 6px 10px; border-radius: 12px; cursor: pointer; font: inherit; border: 1px solid #3A3733; background: #1D1B19; color: #EDEAE4;\"><span style=\"font-size: 11px; font-weight: 700; opacity: 0.8;\">VII<\/span><span style=\"font-family: Syne, sans-serif; font-weight: 800; font-size: 17px;\">G<\/span><\/button>\n        <\/div>\n<p>        <span style=\"font-size: 14px; color: #C9C3BA;\">Spus\u0165 podklad, nejd\u0159\u00edv zazn\u00ed jeden takt odpo\u010d\u00edt\u00e1v\u00e1n\u00ed. Dokud nehraje, klikni na akord v postupu a uvid\u00ed\u0161 jeho t\u00f3ny.<\/span>\n      <\/div>\n<\/section>\n<section aria-labelledby=\"imp-h\" style=\"display: flex; flex-direction: column; gap: 16px; padding: 24px; border-radius: 20px; background: #1D1B19; border: 1px solid #3A3733;\">\n<h2 id=\"imp-h\" style=\"margin: 0; font-family: 'Syne', sans-serif; font-weight: 700; font-size: 24px;\">3. Na \u010dem improvizovat<\/h2>\n<div style=\"display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center;\">\n        <span style=\"font-size: 13px; font-weight: 600; color: #A8A29A; width: 72px;\">Stupnice<\/span><\/p>\n<div role=\"group\" aria-label=\"Stupnice na improvizaci\" style=\"display: flex; flex-wrap: wrap; gap: 6px;\">\n            <button type=\"button\" aria-pressed=\"true\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #F2804A; background: #F2804A; color: #141311;\">Mollov\u00e1 pentatonika \u2605<\/button><br \/>\n            <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; min-width: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; border: 1px solid #3A3733; background: transparent; color: #EDEAE4;\">Mollov\u00e1 stupnice<\/button>\n        <\/div>\n<div role=\"group\" aria-label=\"Popisky v te\u010dk\u00e1ch\" style=\"display: flex; border: 1px solid #8C867D; border-radius: 999px; overflow: hidden;\">\n          <button type=\"button\" aria-pressed=\"true\" style=\"min-height: 40px; padding: 0 16px; border: 0; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; background: #EDEAE4; color: #141311;\">T\u00f3ny<\/button><br \/>\n          <button type=\"button\" aria-pressed=\"false\" style=\"min-height: 40px; padding: 0 16px; border: 0; cursor: pointer; font: inherit; font-size: 14px; font-weight: 600; background: transparent; color: #EDEAE4;\">Stupn\u011b<\/button>\n        <\/div>\n<\/p><\/div>\n<div style=\"display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: baseline;\">\n        <span style=\"font-family: 'Syne', sans-serif; font-weight: 700; font-size: 20px;\">A mollov\u00e1 pentatonika<\/span><br \/>\n        <span style=\"font-size: 15px; color: #C9C3BA;\">A \u2013 C \u2013 D \u2013 E \u2013 G<\/span><br \/>\n        <span style=\"font-size: 14px; color: #A8A29A; font-family: ui-monospace, Menlo, Consolas, monospace;\">R  b3  4  5  b7<\/span>\n      <\/div>\n<div style=\"overflow-x: auto; border-radius: 16px; background: #2A2420; padding: 22px 18px 12px;\">\n<div role=\"img\" aria-label=\"Hmatn\u00edk: A mollov\u00e1 pentatonika, zv\u00fdrazn\u011bn\u00e9 t\u00f3ny akordu Am (A, C, E)\" style=\"min-width: 980px; display: flex; flex-direction: column;\">\n<div style=\"display: grid; grid-template-columns: 34px 46px repeat(15, minmax(0, 1fr)); height: 44px; align-items: center;\">\n              <span style=\"font-weight: 700; font-size: 14px; color: #A8A29A; text-align: center;\">e<\/span><\/p>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 6px solid #EDEAE4;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.00px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #EDEAE4; color: #141311;\">E<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.00px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.00px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.00px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #4A4640; color: #EDEAE4;\">G<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.00px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.00px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #E2601E; color: #FFFFFF;\">A<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.00px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.00px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.00px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #2F7BD8; color: #FFFFFF;\">C<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.00px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.00px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #4A4640; color: #EDEAE4;\">D<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.00px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.00px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #EDEAE4; color: #141311;\">E<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.00px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.00px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.00px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #4A4640; color: #EDEAE4;\">G<\/span>\n                <\/div>\n<\/p><\/div>\n<div style=\"display: grid; grid-template-columns: 34px 46px repeat(15, minmax(0, 1fr)); height: 44px; align-items: center;\">\n              <span style=\"font-weight: 700; font-size: 14px; color: #A8A29A; text-align: center;\">B<\/span><\/p>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 6px solid #EDEAE4;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.45px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.45px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #2F7BD8; color: #FFFFFF;\">C<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.45px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.45px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #4A4640; color: #EDEAE4;\">D<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.45px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.45px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #EDEAE4; color: #141311;\">E<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.45px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.45px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.45px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #4A4640; color: #EDEAE4;\">G<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.45px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.45px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #E2601E; color: #FFFFFF;\">A<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.45px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.45px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.45px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #2F7BD8; color: #FFFFFF;\">C<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.45px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.45px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #4A4640; color: #EDEAE4;\">D<\/span>\n                <\/div>\n<\/p><\/div>\n<div style=\"display: grid; grid-template-columns: 34px 46px repeat(15, minmax(0, 1fr)); height: 44px; align-items: center;\">\n              <span style=\"font-weight: 700; font-size: 14px; color: #A8A29A; text-align: center;\">G<\/span><\/p>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 6px solid #EDEAE4;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.90px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #4A4640; color: #EDEAE4;\">G<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.90px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.90px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #E2601E; color: #FFFFFF;\">A<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.90px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.90px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.90px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #2F7BD8; color: #FFFFFF;\">C<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.90px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.90px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #4A4640; color: #EDEAE4;\">D<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.90px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.90px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #EDEAE4; color: #141311;\">E<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.90px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.90px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.90px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #4A4640; color: #EDEAE4;\">G<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.90px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.90px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #E2601E; color: #FFFFFF;\">A<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 1.90px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<\/p><\/div>\n<div style=\"display: grid; grid-template-columns: 34px 46px repeat(15, minmax(0, 1fr)); height: 44px; align-items: center;\">\n              <span style=\"font-weight: 700; font-size: 14px; color: #A8A29A; text-align: center;\">D<\/span><\/p>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 6px solid #EDEAE4;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.35px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #4A4640; color: #EDEAE4;\">D<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.35px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.35px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #EDEAE4; color: #141311;\">E<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.35px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.35px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.35px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #4A4640; color: #EDEAE4;\">G<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.35px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.35px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #E2601E; color: #FFFFFF;\">A<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.35px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.35px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.35px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #2F7BD8; color: #FFFFFF;\">C<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.35px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.35px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #4A4640; color: #EDEAE4;\">D<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.35px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.35px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #EDEAE4; color: #141311;\">E<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.35px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<\/p><\/div>\n<div style=\"display: grid; grid-template-columns: 34px 46px repeat(15, minmax(0, 1fr)); height: 44px; align-items: center;\">\n              <span style=\"font-weight: 700; font-size: 14px; color: #A8A29A; text-align: center;\">A<\/span><\/p>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 6px solid #EDEAE4;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.80px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #E2601E; color: #FFFFFF;\">A<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.80px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.80px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.80px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #2F7BD8; color: #FFFFFF;\">C<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.80px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.80px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #4A4640; color: #EDEAE4;\">D<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.80px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.80px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #EDEAE4; color: #141311;\">E<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.80px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.80px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.80px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #4A4640; color: #EDEAE4;\">G<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.80px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.80px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #E2601E; color: #FFFFFF;\">A<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.80px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.80px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 2.80px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #2F7BD8; color: #FFFFFF;\">C<\/span>\n                <\/div>\n<\/p><\/div>\n<div style=\"display: grid; grid-template-columns: 34px 46px repeat(15, minmax(0, 1fr)); height: 44px; align-items: center;\">\n              <span style=\"font-weight: 700; font-size: 14px; color: #A8A29A; text-align: center;\">E<\/span><\/p>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 6px solid #EDEAE4;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 3.25px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #EDEAE4; color: #141311;\">E<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 3.25px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 3.25px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 3.25px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #4A4640; color: #EDEAE4;\">G<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 3.25px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 3.25px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #E2601E; color: #FFFFFF;\">A<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 3.25px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 3.25px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 3.25px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #2F7BD8; color: #FFFFFF;\">C<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 3.25px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 3.25px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #4A4640; color: #EDEAE4;\">D<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 3.25px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 3.25px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #EDEAE4; color: #141311;\">E<\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 3.25px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 3.25px; background: #C9B9A6; transform: translateY(-50%);\"><\/span>\n                <\/div>\n<div style=\"position: relative; height: 100%; display: grid; place-items: center; border-right: 2px solid #8C867D;\">\n                  <span style=\"position: absolute; left: 0; right: 0; top: 50%; height: 3.25px; background: #C9B9A6; transform: translateY(-50%);\"><\/span><br \/>\n                    <span style=\"position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: #4A4640; color: #EDEAE4;\">G<\/span>\n                <\/div>\n<\/p><\/div>\n<div style=\"display: grid; grid-template-columns: 34px 46px repeat(15, minmax(0, 1fr)); height: 34px; align-items: center; font-size: 13px; color: #A8A29A; font-variant-numeric: tabular-nums;\">\n            <span><\/span><br \/>\n              <span style=\"text-align: center;\">0<\/span><br \/>\n              <span style=\"text-align: center;\">1<\/span><br \/>\n              <span style=\"text-align: center;\">2<\/span><br \/>\n              <span style=\"text-align: center; color: #EDEAE4; font-weight: 700;\">3 \u2022<\/span><br \/>\n              <span style=\"text-align: center;\">4<\/span><br \/>\n              <span style=\"text-align: center; color: #EDEAE4; font-weight: 700;\">5 \u2022<\/span><br \/>\n              <span style=\"text-align: center;\">6<\/span><br \/>\n              <span style=\"text-align: center; color: #EDEAE4; font-weight: 700;\">7 \u2022<\/span><br \/>\n              <span style=\"text-align: center;\">8<\/span><br \/>\n              <span style=\"text-align: center; color: #EDEAE4; font-weight: 700;\">9 \u2022<\/span><br \/>\n              <span style=\"text-align: center;\">10<\/span><br \/>\n              <span style=\"text-align: center;\">11<\/span><br \/>\n              <span style=\"text-align: center; color: #EDEAE4; font-weight: 700;\">12 \u2022\u2022<\/span><br \/>\n              <span style=\"text-align: center;\">13<\/span><br \/>\n              <span style=\"text-align: center;\">14<\/span><br \/>\n              <span style=\"text-align: center; color: #EDEAE4; font-weight: 700;\">15 \u2022<\/span>\n          <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div style=\"display: flex; flex-wrap: wrap; gap: 10px 22px; font-size: 14px; color: #C9C3BA;\">\n        <span style=\"display: flex; gap: 8px; align-items: center;\"><span style=\"width: 18px; height: 18px; border-radius: 50%; background: #E2601E;\"><\/span>z\u00e1kladn\u00ed t\u00f3n akordu<\/span><br \/>\n        <span style=\"display: flex; gap: 8px; align-items: center;\"><span style=\"width: 18px; height: 18px; border-radius: 50%; background: #2F7BD8;\"><\/span>tercie akordu<\/span><br \/>\n        <span style=\"display: flex; gap: 8px; align-items: center;\"><span style=\"width: 18px; height: 18px; border-radius: 50%; background: #EDEAE4;\"><\/span>kvinta akordu<\/span><br \/>\n        <span style=\"display: flex; gap: 8px; align-items: center;\"><span style=\"width: 18px; height: 18px; border-radius: 50%; background: #3E9A6B;\"><\/span>septima akordu<\/span><br \/>\n        <span style=\"display: flex; gap: 8px; align-items: center;\"><span style=\"width: 18px; height: 18px; border-radius: 50%; background: #4A4640;\"><\/span>dal\u0161\u00ed t\u00f3ny stupnice<\/span><br \/>\n        <span style=\"display: flex; gap: 8px; align-items: center;\"><span style=\"width: 18px; height: 18px; border-radius: 50%; background: #4A4640; box-shadow: inset 0 0 0 2px #E2601E;\"><\/span>t\u00f3nika stupnice<\/span><br \/>\n        <span style=\"display: flex; gap: 8px; align-items: center;\"><span style=\"width: 18px; height: 18px; border-radius: 50%; background: #2F7BD8; outline: 2px dashed #FFD166; outline-offset: 1px;\"><\/span>t\u00f3n akordu mimo stupnici<\/span>\n      <\/div>\n<p style=\"margin: 0; font-size: 15px; line-height: 1.6; color: #C9C3BA; padding: 14px 16px; border-radius: 12px; border: 1px solid #3A3733;\"><strong style=\"color: #EDEAE4;\">Tip:<\/strong> Mollov\u00e1 pentatonika je prvn\u00ed stupnice v\u011bt\u0161iny kytarist\u016f. Je bezpe\u010dn\u00e1 nad mollem i nad blues (lekce 11). Hv\u011bzdi\u010dka \u2605 ozna\u010duje stupnici, kter\u00e1 na tento postup sed\u00ed nejl\u00e9pe.<\/p>\n<\/section>\n<section aria-labelledby=\"how-h\" style=\"display: flex; flex-direction: column; gap: 12px;\">\n<h2 id=\"how-h\" style=\"margin: 0; font-family: 'Syne', sans-serif; font-weight: 700; font-size: 24px;\">Jak improvizovat nad podkladem<\/h2>\n<ol style=\"margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px;\">\n<li style=\"display: flex; flex-direction: column; gap: 6px; padding: 16px; border-radius: 14px; background: #1D1B19; border: 1px solid #3A3733;\"><strong style=\"font-size: 16px;\">Za\u010dni s m\u00e1lo t\u00f3ny<\/strong><span style=\"font-size: 15px; line-height: 1.55; color: #C9C3BA;\">Vyber si t\u0159i t\u00f3ny stupnice bl\u00edzko sebe a hraj s nimi jen rytmus. Z m\u00e1la t\u00f3n\u016f vznikne melodie sn\u00e1z ne\u017e z cel\u00e9 stupnice.<\/span><\/li>\n<li style=\"display: flex; flex-direction: column; gap: 6px; padding: 16px; border-radius: 14px; background: #1D1B19; border: 1px solid #3A3733;\"><strong style=\"font-size: 16px;\">P\u0159ist\u00e1vej na t\u00f3nech akordu<\/strong><span style=\"font-size: 15px; line-height: 1.55; color: #C9C3BA;\">Kdy\u017e se m\u011bn\u00ed akord, skon\u010di fr\u00e1zi na barevn\u00e9m t\u00f3nu. Z\u00e1kladn\u00ed t\u00f3n a tercie zn\u00ed nejpevn\u011bji, \u0161ed\u00e9 t\u00f3ny jsou cesta mezi nimi.<\/span><\/li>\n<li style=\"display: flex; flex-direction: column; gap: 6px; padding: 16px; border-radius: 14px; background: #1D1B19; border: 1px solid #3A3733;\"><strong style=\"font-size: 16px;\">Nech m\u00edsto<\/strong><span style=\"font-size: 15px; line-height: 1.55; color: #C9C3BA;\">Hraj kr\u00e1tk\u00e9 fr\u00e1ze a mezi nimi pauzy, jako kdy\u017e vypr\u00e1v\u00ed\u0161. Pauza je sou\u010d\u00e1st s\u00f3la, ne chyba.<\/span><\/li>\n<li style=\"display: flex; flex-direction: column; gap: 6px; padding: 16px; border-radius: 14px; background: #1D1B19; border: 1px solid #3A3733;\"><strong style=\"font-size: 16px;\">Opakuj a obm\u011b\u0148uj<\/strong><span style=\"font-size: 15px; line-height: 1.55; color: #C9C3BA;\">Zahraj kr\u00e1tk\u00fd motiv, zopakuj ho a potom zm\u011b\u0148 jeden t\u00f3n nebo rytmus. Poslucha\u010d tak sly\u0161\u00ed p\u0159\u00edb\u011bh, ne n\u00e1hodn\u00e9 t\u00f3ny.<\/span><\/li>\n<\/ol>\n<\/section>\n<div style=\"display: flex; flex-wrap: wrap; gap: 12px; justify-content: space-between; align-items: center; padding: 20px 22px; border-radius: 12px; border: 1px solid #3A3733;\">\n<div data-da-odkazy style=\"display: flex; flex-direction: column; gap: 6px; flex: 1 1 420px; min-width: 0;\">\n<p style=\"margin: 0; font-size: 15px; line-height: 1.55; color: #C9C3BA;\">Pentatoniky a blues vysv\u011btluj\u00ed <a href=\"https:\/\/deskaudio.eu\/cs\/kurz-kytary\/lekce-11-mollova-pentatonika-a-blues\/\" style=\"color: #EDEAE4; font-weight: 700;\">lekce 11<\/a> a <a href=\"https:\/\/deskaudio.eu\/cs\/kurz-kytary\/lekce-12-durova-pentatonika\/\" style=\"color: #EDEAE4; font-weight: 700;\">lekce 12<\/a>, m\u00f3dy <a href=\"https:\/\/deskaudio.eu\/cs\/kurz-kytary\/lekce-15-mody-na-kytare\/\" style=\"color: #EDEAE4; font-weight: 700;\">lekce 15<\/a>, akordy v t\u00f3nin\u011b <a href=\"https:\/\/deskaudio.eu\/cs\/kurz-kytary\/lekce-26-akordy-v-tonine-a-rimska-cisla\/\" style=\"color: #EDEAE4; font-weight: 700;\">lekce 26<\/a> a vlastn\u00ed postupy <a href=\"https:\/\/deskaudio.eu\/cs\/kurz-kytary\/lekce-28-jak-slozit-vlastni-akordovy-postup\/\" style=\"color: #EDEAE4; font-weight: 700;\">lekce 28<\/a>.<\/p>\n<p style=\"margin: 0; font-size: 15px; line-height: 1.55; color: #C9C3BA;\">V\u00edc k t\u00e9matu: <a href=\"https:\/\/deskaudio.eu\/cs\/kytara\/pentatonika\/\" style=\"color: #EDEAE4; font-weight: 700;\">Pentatonika<\/a> a <a href=\"https:\/\/deskaudio.eu\/cs\/kytara\/akordove-postupy\/\" style=\"color: #EDEAE4; font-weight: 700;\">Akordov\u00e9 postupy<\/a>. Prvn\u00ed t\u0159i lekce kurzu jsou zdarma.<\/p>\n<\/p><\/div>\n<p>      <a href=\"https:\/\/deskaudio.eu\/cs\/kurz-kytary\/\" style=\"display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border-radius: 7px; border: 1px solid #8C867D; color: #EDEAE4; font-weight: 600; text-decoration: none;\">P\u0159ej\u00edt na kurz<\/a>\n    <\/div>\n<p>  <\/main><\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Vyber t\u00f3ninu, postup a styl. Bic\u00ed, basa a kytara budou hr\u00e1t dokola a ty si nad t\u00edm zkou\u0161\u00ed\u0161 s\u00f3lo. Hmatn\u00edk dole ukazuje stupnici a t\u00f3ny akordu, kter\u00fd pr\u00e1v\u011b zn\u00ed.<\/p>\n","protected":false},"featured_media":0,"menu_order":6,"template":"","meta":{"_acf_changed":false,"_da_nastroj":"podklady","_glsr_average":0,"_glsr_ranking":0,"_glsr_reviews":0},"class_list":["post-5515","da_nastroj","type-da_nastroj","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/deskaudio.eu\/cs\/wp-json\/wp\/v2\/da_nastroj\/5515","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/deskaudio.eu\/cs\/wp-json\/wp\/v2\/da_nastroj"}],"about":[{"href":"https:\/\/deskaudio.eu\/cs\/wp-json\/wp\/v2\/types\/da_nastroj"}],"wp:attachment":[{"href":"https:\/\/deskaudio.eu\/cs\/wp-json\/wp\/v2\/media?parent=5515"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}