@use "sass:color";:root{--color-primary-white: hsl(104, 72%, 91%);--color-primary-lightest: hsl(104, 72%, 80%);--color-primary-lighter: hsl(104, 72%, 69%);--color-primary-light: hsl(104, 72%, 58%);--color-primary: hsl(104, 72%, 49%);--color-primary-dark: hsl(104, 72%, 33%);--color-primary-darker: hsl(104, 72%, 23%);--color-primary-darkest: hsl(104, 72%, 11%);--color-primary-black: hsl(104, 72%, 5%);--color-secondary-white: hsl(18, 89%, 91%);--color-secondary-lightest: hsl(18, 89%, 80%);--color-secondary-lighter: hsl(18, 89%, 69%);--color-secondary-light: hsl(18, 89%, 58%);--color-secondary: hsl(18, 89%, 48%);--color-secondary-dark: hsl(18, 89%, 36%);--color-secondary-darker: hsl(18, 89%, 23%);--color-secondary-darkest: hsl(18, 89%, 11%);--color-secondary-black: hsl(18, 89%, 5%);--color-accent-white: hsl(300, 80%, 91%);--color-accent-lightest: hsl(300, 80%, 80%);--color-accent-lighter: hsl(300, 80%, 69%);--color-accent-light: hsl(300, 80%, 58%);--color-accent: hsl(300, 80%, 51%);--color-accent-dark: hsl(300, 80%, 36%);--color-accent-darker: hsl(300, 80%, 23%);--color-accent-darkest: hsl(300, 80%, 11%);--color-accent-black: hsl(300, 80%, 5%);--color-success: hsl(130, 100%, 35%);--color-warning: hsl(60, 100%, 50%);--color-error: hsl(0, 100%, 35%);--color-error-light: hsl(0, 100%, 70%);--color-black: hsl(0, 0%, 0%);--color-white: hsl(0, 0%, 100%);--color-disabled:hsl(0, 0%, 60%);--color-disabled-dark:hsl(0, 0%, 40%);--sheen-dark: rgba(0, 0, 0, 60%);--sheen-light: rgba(100, 100, 100, 15%);--color-degree-first: hsl(0, 100%, 50%);--color-degree-second: hsl(38, 100%, 50%);--color-degree-third: hsl(55, 100%, 45%);--color-degree-fourth: hsl(120, 100%, 30%);--color-degree-fifth: hsl(200, 100%, 40%);--color-degree-sixth: hsl(265, 100%, 55%);--color-degree-seventh: hsl(310, 100%, 50%);--color-degree-first-dark: hsl(0, 100%, 20%);--color-degree-second-dark: hsl(38, 100%, 28%);--color-degree-third-dark: hsl(55, 100%, 35%);--color-degree-fourth-dark: hsl(120, 100%, 22%);--color-degree-fifth-dark: hsl(200, 100%, 24%);--color-degree-sixth-dark: hsl(265, 100%, 25%);--color-degree-seventh-dark: hsl(310, 100%, 25%);--color-degree-first-light: hsl(0, 100%, 78%);--color-degree-second-light: hsl(38, 100%, 60%);--color-degree-third-light: hsl(55, 100%, 65%);--color-degree-fourth-light: hsl(120, 100%, 70%);--color-degree-fifth-light: hsl(200, 100%, 75%);--color-degree-sixth-light: hsl(265, 100%, 78%);--color-degree-seventh-light: hsl(310, 100%, 78%);--color-practice--by-heart: var(--color-accent-darkest);--color-practice--green: #006100;--color-practice--yellow: #687400;--color-practice--orange: #7e3d00;--color-practice--red: #700000}:root{--default-font-family: 'Droid Sans Mono', 'Consolas', 'Courier New', Courier, monospace}@use "sass:color";:root{--color-primary-white: hsl(104, 72%, 91%);--color-primary-lightest: hsl(104, 72%, 80%);--color-primary-lighter: hsl(104, 72%, 69%);--color-primary-light: hsl(104, 72%, 58%);--color-primary: hsl(104, 72%, 49%);--color-primary-dark: hsl(104, 72%, 33%);--color-primary-darker: hsl(104, 72%, 23%);--color-primary-darkest: hsl(104, 72%, 11%);--color-primary-black: hsl(104, 72%, 5%);--color-secondary-white: hsl(18, 89%, 91%);--color-secondary-lightest: hsl(18, 89%, 80%);--color-secondary-lighter: hsl(18, 89%, 69%);--color-secondary-light: hsl(18, 89%, 58%);--color-secondary: hsl(18, 89%, 48%);--color-secondary-dark: hsl(18, 89%, 36%);--color-secondary-darker: hsl(18, 89%, 23%);--color-secondary-darkest: hsl(18, 89%, 11%);--color-secondary-black: hsl(18, 89%, 5%);--color-accent-white: hsl(300, 80%, 91%);--color-accent-lightest: hsl(300, 80%, 80%);--color-accent-lighter: hsl(300, 80%, 69%);--color-accent-light: hsl(300, 80%, 58%);--color-accent: hsl(300, 80%, 51%);--color-accent-dark: hsl(300, 80%, 36%);--color-accent-darker: hsl(300, 80%, 23%);--color-accent-darkest: hsl(300, 80%, 11%);--color-accent-black: hsl(300, 80%, 5%);--color-success: hsl(130, 100%, 35%);--color-warning: hsl(60, 100%, 50%);--color-error: hsl(0, 100%, 35%);--color-error-light: hsl(0, 100%, 70%);--color-black: hsl(0, 0%, 0%);--color-white: hsl(0, 0%, 100%);--color-disabled:hsl(0, 0%, 60%);--color-disabled-dark:hsl(0, 0%, 40%);--sheen-dark: rgba(0, 0, 0, 60%);--sheen-light: rgba(100, 100, 100, 15%);--color-degree-first: hsl(0, 100%, 50%);--color-degree-second: hsl(38, 100%, 50%);--color-degree-third: hsl(55, 100%, 45%);--color-degree-fourth: hsl(120, 100%, 30%);--color-degree-fifth: hsl(200, 100%, 40%);--color-degree-sixth: hsl(265, 100%, 55%);--color-degree-seventh: hsl(310, 100%, 50%);--color-degree-first-dark: hsl(0, 100%, 20%);--color-degree-second-dark: hsl(38, 100%, 28%);--color-degree-third-dark: hsl(55, 100%, 35%);--color-degree-fourth-dark: hsl(120, 100%, 22%);--color-degree-fifth-dark: hsl(200, 100%, 24%);--color-degree-sixth-dark: hsl(265, 100%, 25%);--color-degree-seventh-dark: hsl(310, 100%, 25%);--color-degree-first-light: hsl(0, 100%, 78%);--color-degree-second-light: hsl(38, 100%, 60%);--color-degree-third-light: hsl(55, 100%, 65%);--color-degree-fourth-light: hsl(120, 100%, 70%);--color-degree-fifth-light: hsl(200, 100%, 75%);--color-degree-sixth-light: hsl(265, 100%, 78%);--color-degree-seventh-light: hsl(310, 100%, 78%);--color-practice--by-heart: var(--color-accent-darkest);--color-practice--green: #006100;--color-practice--yellow: #687400;--color-practice--orange: #7e3d00;--color-practice--red: #700000}:root{--default-font-family: 'Droid Sans Mono', 'Consolas', 'Courier New', Courier, monospace}@use "../application" as *;body{background-color:var(--color-primary-black);color:var(--color-primary-white);margin:auto;display:flex;flex-direction:column;min-height:100vh}*{box-sizing:border-box;font-family:var(--default-font-family)}a{color:var(--color-accent-lightest)}a:hover{color:var(--color-white)}a,a:active,a:hover{transition:0.25s}h1,h2,h3,h4,h5,h6{color:var(--color-secondary-lightest)}h2,h3,h4,h5,h6{margin:0}main{display:flex;flex-direction:column;padding:16px 12px;align-items:center;flex:1}main>h1{margin:20px}main>h2{margin:16px}@media (min-width: 768px){main{max-width:1720px;padding:16px;margin:auto}}fieldset{padding:16px 12px;margin:16px 0}@media (min-width: 768px){fieldset{padding:16px;margin:16px}}legend{font-size:1.125rem;padding:0 16px;color:var(--color-secondary-lightest)}label{font-size:1.125rem;color:var(--color-secondary-white)}label[title]{cursor:help}label[title]::after{content:"?";vertical-align:super;color:var(--color-accent-lightest);font-size:0.75rem;margin:0 4px}details[open]{border-bottom:1px solid var(--color-primary-lightest)}details,details[open]{margin:16px;text-align:center}details>summary{position:relative;display:inline-block;cursor:pointer;font-size:1.25rem;background:var(--color-primary-darkest);padding:12px;padding-left:32px;margin:8px;border:1px ridge var(--color-primary-light);border-radius:12px;max-width:fit-content}details>summary::before{content:'';border-width:8px;border-style:solid;border-color:transparent transparent transparent var(--color-primary-lightest);position:absolute;top:1rem;left:12px;transform:rotate(0);transform-origin:.2rem 50%;transition:0.25s transform ease}details>summary:hover{border-color:var(--color-primary-white)}details>summary:active{background:var(--color-primary-black)}details>summary,details>summary:hover,details>summary:active{transition:all 0.25s ease-in-out}details[open]>summary::before{transform:rotate(90deg)}details p{text-align:justify;animation:fadeIn 0.25s;line-height:1.5rem}hr{width:80%;color:var(--color-primary-darker)}section{display:flex;flex-direction:column;justify-content:center;align-items:stretch;margin:4px}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@use "./globals" as *;.hidden{display:none !important}.contrast-text{color:var(--color-accent-light)}.text-secondary{color:var(--color-secondary-lightest)}.bg-secondary{background:var(--color-secondary-darkest)}.text-accent{color:var(--color-accent-lightest)}.bg-accent{background:var(--color-accent-darkest)}.row{display:flex;justify-content:space-between;align-items:center}.column{display:flex;flex-direction:column;align-items:center;justify-items:center}.empty-list-text{font-style:italic}.inline-separator{color:var(--color-primary-dark);font-size:1.25rem}.mobile-label{color:var(--color-secondary-lightest)}@media (min-width: 768px){.mobile-label{display:none}}@use "../globals/globals" as *;@use "sass:color";.app-logo{display:flex;flex-direction:column;justify-content:flex-start}.app-logo a:hover{background:var(--color-primary-black)}.app-logo a:active{background:var(--color-primary-darker)}.app-logo__text{margin:0;padding:16px;text-decoration:none}.app-logo__text>span:nth-child(1){color:var(--color-secondary-light)}.app-logo__text>span:nth-child(2){color:var(--color-accent-light)}.app-logo__text>span:nth-child(3){color:var(--color-primary-light)}@use "../globals/globals" as *;.button,input[type="submit"]{display:inline-block;cursor:pointer;padding:12px;margin:2px;border-width:2px;border-style:outset;transition-duration:0.25s;text-align:center;font-size:1.2rem;text-decoration:none}.button{background-color:var(--color-primary-darkest);border-color:var(--color-primary-white);color:var(--color-primary-white)}.button--secondary{background-color:var(--color-secondary-darkest);border-color:var(--color-secondary-white);color:var(--color-secondary-white)}.button--accent{background-color:var(--color-accent-darkest);border-color:var(--color-accent-white);color:var(--color-accent-white)}.button--alert{background-color:var(--color-error);border-color:var(--color-white);color:var(--color-white)}.button--alert:hover{background-color:var(--color-white);border-color:var(--color-error);color:var(--color-error)}.button--alert:active{background-color:var(--color-error-light)}.button--square,input.button--square[type="submit"]{display:inline-flex;padding:0;width:32px;height:32px;flex-direction:column;justify-content:center;align-items:center;font-size:1.5rem}.clickable{cursor:pointer;border-color:transparent;border-width:1px;border-style:outset;transition-duration:0.25s}.clickable--disabled{border-color:var(--color-disabled);background-color:var(--color-disabled-dark);color:var(--color-disabled);pointer-events:none}.clickable:hover,.button:hover{border-style:outset;border-color:var(--color-primary-light);background:var(--color-primary);color:var(--color-primary-black)}.clickable:active,.button:active{background:var(--color-primary-darkest)}input[type="submit"]{border-color:var(--color-accent-white);background:var(--color-accent-darkest);color:var(--color-accent-white)}input[type="submit"]:hover{background:var(--color-accent);color:var(--color-accent-black)}input[type="submit"]:active{background:var(--color-accent-darker)}.back-to-top{width:48px;height:48px;position:fixed;font-size:3rem;bottom:72px;right:48px}@use "../globals/globals" as *;.ctas{display:flex;flex-direction:column;gap:16px;margin:20px}@media (min-width: 768px){.ctas{align-items:flex-start}}.cta{display:flex;flex-direction:column;gap:8px;padding-bottom:24px;border-bottom:var(--color-primary-lightest) 1px solid}.cta a{font-size:1.5rem}@media (min-width: 768px){.cta{display:initial;line-height:1.5em;border-bottom:none}.cta .description::before{content:" — "}}@use "../globals/globals" as *;.filter{display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:4px 16px;height:3em;border:var(--color-primary-darkest) 1px solid}.filter,.filter__label{cursor:pointer}.filter:hover{background:rgba(0,0,0,0.2);border-color:var(--color-primary-dark)}.filter.active{border-color:var(--color-accent-lightest);background:rgba(0,0,0,0.1)}.filter.active__label{color:var(--color-accent-lightest)}.filter,.filter:hover,.filter:active{transition:0.25s}.flashes .flash{font-size:1.125rem;padding:12px;border-style:double;border-width:2px;border-radius:8px}.flashes .flash--notice{background:var(--color-primary-white);color:var(--color-primary-black);border-color:var(--color-primary)}.flashes .flash--alert{border-color:var(--color-error);background:var(--color-error-light);color:var(--color-error)}@media (min-width: 768px){.flashes .flash{padding:20px}}@use "../globals/globals" as *;footer{display:grid;border-top:2px ridge var(--color-primary-dark);width:100%;padding:12px 48px;background:var(--sheen-dark);justify-content:space-between;align-items:center}@media (min-width: 768px){footer{grid-template-columns:repeat(3, 1fr)}footer>*:nth-child(1){justify-self:start}footer>*:nth-child(2){justify-self:center}footer>*:nth-child(3){justify-self:end}}footer nav a{padding:16px 32px;text-decoration:none}footer nav a:hover{background:var(--color-primary-black)}footer nav a:active{background:var(--color-primary-darkest);color:var(--color-accent-white)}@media (min-width: 768px){footer nav a{padding:12px}}footer .tech-stack{color:var(--color-primary-white);font-size:0.75rem}footer .tech-stack>*{display:flex;flex-direction:column;justify-content:center;align-items:start;gap:4px}footer .tech-stack .rails-icon svg{fill:#D30001}footer .tech-stack .rails-icon svg:hover{fill:var(--color-white)}footer .tech-stack .rails-icon svg:active{fill:var(--color-primary)}footer .tech-stack .rails-icon svg,footer .tech-stack .rails-icon svg:hover,footer .tech-stack .rails-icon svg:active{transition:0.25s}@use "../globals/globals" as *;form{margin:auto;display:flex;flex-direction:column;align-items:stretch;gap:12px}form .form-fields{display:flex;flex-direction:column;row-gap:16px;align-items:stretch}@media (min-width: 768px){form .form-fields{display:grid;margin:20px;padding:20px;grid-template-columns:repeat(2, 1fr);align-items:center}}form .actions{display:flex;flex-direction:column}form .actions *{display:flex;flex:1;justify-content:center;align-items:center}@media (min-width: 768px){form .actions{flex-direction:row;grid-column:1 / -1}}form select{text-align:center}form .field{display:flex;flex-direction:column;justify-content:space-between;gap:8px}form .field input{text-align:center}form .field textarea{resize:none}form .checkbox-field{display:flex;flex-direction:row;justify-content:space-between}form .checkbox-field label{width:initial;margin-right:initial}@media (min-width: 768px){form .checkbox-field label{display:inline-block;width:calc(min(40vw, $size-xxxl * 6));text-align:left;margin-right:32px;border-bottom:1px solid var(--color-primary-lightest)}}form .field label,form .checkbox-field label{text-align:center;font-weight:bold}@media (min-width: 768px){form .field,form .checkbox-field{align-items:stretch;margin:16px}}form .field.error,form .field-with-errors{color:var(--color-error-light)}form .field.error label::before,form .field-with-errors label::before{content:"❌";margin-right:4px}form .field.error input,form .field-with-errors input{background:var(--color-error-light);color:var(--color-error);box-shadow:0 0 4px 4px var(--color-error);border:solid 1px var(--color-error)}form .field-with-errors input{width:100%}header{display:flex;flex-direction:column;justify-content:stretch;align-items:center;width:100%;background:light-dark(var(--sheen-dark), var(--color-primary-lighter));border-bottom:2px ridge var(--color-primary-dark)}header a{text-decoration:none}header nav{display:flex;flex-direction:column;align-items:center;text-align:center;width:100%}header nav.user-links{flex-direction:row;align-items:center;justify-content:center}header nav.user-links a{padding:16px}header .default-links,header .premium-links{border-top:1px ridge var(--color-primary-darker)}header .default-links a,header .premium-links a{width:100%;padding:8px 0}header .default-links a:hover,header .premium-links a:hover{background:var(--color-primary-black)}header .default-links a:active,header .premium-links a:active{background:var(--color-primary-darkest);color:var(--color-accent-white)}header .default-links a,header .default-links a:hover,header .default-links a:active,header .premium-links a,header .premium-links a:hover,header .premium-links a:active{transition:0.25s}@media (min-width: 768px){header{display:grid;grid-template-columns:1fr 1fr}header nav{flex-direction:row;justify-content:space-between;align-items:center;gap:16px}header nav.user-links{justify-content:flex-end}header nav.user-links a:last-child{padding-right:32px}header .default-links,header .premium-links{grid-column:1 / -1}header .default-links a,header .premium-links a{padding:12px 0}}@use "../globals/globals" as *;.inline-form{display:flex;flex-direction:row;width:100%;justify-content:space-between;align-items:center}.inline-form select{font-size:0.875rem}@use "../globals/globals" as *;input[type="text"],input[type="number"],input[type="email"],input[type="password"],input[type="search"],input[type="tel"],input[type="time"],select{background:var(--color-primary-lightest);color:var(--color-primary-darkest);padding:8px;font-size:1.25rem}select{max-width:95vw}input[type="checkbox"]{transform:scale(2);margin:0 24px}@use "../globals/globals" as *;.content nav{display:flex;justify-content:center;align-items:center;gap:16px;padding:2px}@media (min-width: 768px){.content nav{flex-direction:row;gap:16px;padding:4px}}@use "../globals/globals" as *;.notice{display:flex;flex-direction:column;justify-content:space-around;align-items:center;border-color:var(--color-white);border-style:solid;border-width:1px;padding:16px;margin:16px;line-height:1.5lh}.notice.warning{border-color:var(--color-warning)}.notice.warning>p:first-child::before{content:"!";margin-right:16px;margin-bottom:16px;font-size:2rem;background-color:var(--color-warning);color:var(--color-primary-black);border-radius:100% 0 0 100%}.notice.error{border-color:var(--color-error)}.notice p{text-align:justify}@media (min-width: 768px){.notice{padding:20px 24px;margin:24px}}@use "../globals/globals" as *;.paginator{margin:12px}.paginator__current{color:var(--color-secondary-lightest)}body.publication .content{display:flex;flex-direction:column;gap:20px;background:var(--color-accent-black);padding:12px 192px}body.publication .content .line{display:flex;flex-direction:row;text-align:left;align-items:center;margin:16px 0}body.publication .content .line:nth-child(2n){flex-direction:row-reverse}body.publication .content p{flex-grow:2;margin:16px}body.publication .content img{flex-grow:1;margin:16px;max-width:50%;box-shadow:0 0 20px 16px var(--color-primary-black)}body.publication .content hr{color:var(--color-accent-darker)}@use "../globals/globals" as *;.sequencer{grid-template-columns:[start] 1fr 1fr [end]}.sequencer .sequencer-buttons{display:flex}.sequencer .sequencer-buttons a{margin:8px}.sequencer.table .sequencer-row{padding:4px 16px}@media (min-width: 768px){.progressions-sequencer{grid-template-columns:[start] 1fr 3fr 1fr 2fr [end]}.setlists-sequencer{grid-template-columns:[start] 3fr 2fr 2fr [end]}}@use "../globals/globals" as *;.artists.table{grid-template-columns:[start] 2fr 3fr [end]}.artists.table .table-row{grid-column-start:start;grid-column-end:end}@media (min-width: 768px){.artists.table .table-row{width:100%;grid-column-start:initial;grid-column-end:initial}}.artists.table.table{grid-template-columns:1fr}.artists.table.table .table-row>:last-child{justify-self:center}@use "../application" as *;.stats-calendar{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:12px}@media (min-width: 768px){.stats-calendar{padding:12px 0;border:2px var(--color-primary-darker) solid}}.stats-calendar search{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:12px;width:100%;font-size:1.125rem;padding:0 12px 12px;border-bottom:var(--color-primary-darkest) 1px solid}.stats-calendar search a{text-decoration:none;font-size:1.25rem;color:var(--color-secondary-lightest)}.stats-calendar search a:hover{color:var(--color-white)}.stats-calendar .yearly-calendar{display:grid;grid-template-columns:1fr;gap:12px}@media (min-width: 768px){.stats-calendar .yearly-calendar{grid-template-columns:repeat(2, 1fr);gap:16px}}@media (min-width: 1024px){.stats-calendar .yearly-calendar{grid-template-columns:repeat(3, 1fr);gap:20px}}@media (min-width: 1440px){.stats-calendar .yearly-calendar{grid-template-columns:repeat(4, 1fr)}}.stats-calendar .weekly-calendar,.stats-calendar .monthly-calendar{display:grid;grid-template-columns:repeat(7, 1fr);padding:0 12px;align-content:start}.stats-calendar .monthly-calendar .month{grid-column:1 / 8;justify-self:center;font-size:24px}.stats-calendar .weekly-calendar{gap:20px}.stats-calendar .calendar-header-day{justify-self:center;font-size:1.125rem}.stats-calendar .calendar__date{display:grid;grid-template-areas:"date ." ". stats";grid-template-rows:1fr auto;grid-template-columns:1fr auto;width:56px;height:80px;font-size:1rem;padding:4px;border:var(--color-primary-darkest) 1px ridge}.stats-calendar .calendar__date .calendar__date__day-of-month{font-weight:bold;grid-area:date}.stats-calendar .calendar__date .calendar__date__stats{display:grid;grid-template-columns:1fr;gap:4px;grid-area:stats}.stats-calendar .calendar__date .calendar__date__stats .stats__plays{color:var(--color-secondary-lighter)}.stats-calendar .calendar__date .calendar__date__stats .stats__adds{color:var(--color-accent-lighter)}.stats-calendar .calendar__date__day-of-month.off-month{color:var(--color-disabled)}@use "../globals/globals" as *;.chords-helper{margin-top:16px}.chords-helper__title{font-size:1.25rem}.chords-helper .chords{display:grid;grid-template-columns:repeat(1, 1fr);text-align:left;border-width:2px;border-style:solid;border-color:var(--color-primary);padding:4px;margin-top:16px}.chords-helper .chords .chord{display:flex;justify-content:space-between;align-items:center;padding:12px;border-width:1px;border-color:var(--color-primary);border-style:solid}.chords-helper .chords .chord:hover{background-color:var(--color-primary-darker);border-color:var(--color-white);color:var(--color-white);transform:0.25s}.chords-helper .chords .chord.highlighted{background-color:var(--color-primary-darker);border-color:var(--color-primary-lighter)}.chords-helper .chords .chord .cypher{font-size:1.125rem;font-weight:bold}.chords-helper .chords .chord .cypher::after{content:"→"}@media (min-width: 768px){.chords-helper .chords{grid-template-columns:repeat(5, 1fr)}}@media (min-width: 1440px){.chords-helper .chords{grid-template-columns:repeat(8, 1fr)}}@use "../globals/globals" as *;.chords-table{grid-template-columns:[start] 1fr 1fr [end];grid-template-rows:1fr 1fr}.chords-table .table-row>*:nth-child(3){justify-self:flex-start}@media (min-width: 768px){.chords-table{grid-template-columns:[start] 2fr 1fr 1fr 1fr [end];grid-template-rows:initial}}@use "../globals/globals" as *;.contact-us{text-align:center}@use "../globals/globals" as *;.definitions{align-items:flex-start;gap:8px}.definition{display:flex;flex-direction:row;align-items:baseline;gap:16px}dfn{font-size:1.125rem;color:var(--color-secondary-white)}dfn::after{content:"→";padding-left:16px}@use "../globals/globals" as *;.fretted-instrument{text-align:center;padding:20px}.fretted-instrument .fretboard{display:flex;flex-direction:row;border-style:none}@media (min-width: 768px){.fretted-instrument .fretboard{flex-direction:column}}.fretted-instrument .fretboard .fretboard-header,.fretted-instrument .fretboard .string{display:flex;flex-direction:column}@media (min-width: 768px){.fretted-instrument .fretboard .fretboard-header,.fretted-instrument .fretboard .string{flex-direction:row}}.fretted-instrument .fretboard .fret{color:var(--color-primary-dark);border:var(--color-primary-white) 2px solid;padding:0.10rem;display:flex;justify-content:center;align-items:center;margin-left:-1px;margin-top:-1px;width:32px;height:64px}@media (min-width: 768px){.fretted-instrument .fretboard .fret{width:64px;height:32px}}.fretted-instrument .fretboard .fret--outside{border-color:transparent}.fretted-instrument .fretboard .fret--included{background:var(--color-accent-darker);color:var(--color-white)}.fretted-instrument .fretboard .fret:hover{background:var(--color-secondary);border-color:var(--color-secondary-lightest);box-shadow:2px 2px 2px var(--color-secondary-lighter)}.fretted-instrument .fretboard .fret--degree-1{background:var(--color-degree-first-dark)}.fretted-instrument .fretboard .fret--degree-2{background:var(--color-degree-second-dark)}.fretted-instrument .fretboard .fret--degree-3{background:var(--color-degree-third-dark)}.fretted-instrument .fretboard .fret--degree-4{background:var(--color-degree-fourth-dark)}.fretted-instrument .fretboard .fret--degree-5{background:var(--color-degree-fifth-dark)}.fretted-instrument .fretboard .fret--degree-6{background:var(--color-degree-sixth-dark)}.fretted-instrument .fretboard .fret--degree-7{background:var(--color-degree-seventh-dark)}.fretted-instrument .fretboard .fret--invisible{border-color:transparent;background:transparent}@use "../globals/globals" as *;.instruction{color:var(--color-accent-white);font-style:italic}@use "../globals/globals" as *;.legend{display:flex;flex-direction:column;align-items:center;gap:12px}.legend__colors{display:grid;grid-template-columns:1fr auto;gap:8px}.legend__item{display:grid;grid-template-columns:subgrid;grid-column:1 / -1}.legend__item .description{text-align:left}.legend__sample{width:16px;height:16px;border:var(--color-primary-white) 1px solid}.legend__sample--purple{background-color:var(--color-practice--by-heart)}.legend__sample--green{background-color:var(--color-practice--green)}.legend__sample--yellow{background-color:var(--color-practice--yellow)}.legend__sample--orange{background-color:var(--color-practice--orange)}.legend__sample--red{background-color:var(--color-practice--red)}.legend__sample--degree-1{background:var(--color-degree-first-dark)}.legend__sample--degree-2{background:var(--color-degree-second-dark)}.legend__sample--degree-3{background:var(--color-degree-third-dark)}.legend__sample--degree-4{background:var(--color-degree-fourth-dark)}.legend__sample--degree-5{background:var(--color-degree-fifth-dark)}.legend__sample--degree-6{background:var(--color-degree-sixth-dark)}.legend__sample--degree-7{background:var(--color-degree-seventh-dark)}@use "../globals/globals" as *;.piano{display:flex;flex-direction:row;gap:0}.piano .piano-key{width:20px;height:80px;background:var(--color-white);border:var(--color-primary-dark) 1px solid}.piano .piano-key--sharp{position:relative;background:var(--color-black);width:16px;margin-right:-16px;height:55px;z-index:1;left:-8px}.piano .piano-key--degree-1{background:var(--color-degree-first-dark)}.piano .piano-key--degree-2{background:var(--color-degree-second-dark)}.piano .piano-key--degree-3{background:var(--color-degree-third-dark)}.piano .piano-key--degree-4{background:var(--color-degree-fourth-dark)}.piano .piano-key--degree-5{background:var(--color-degree-fifth-dark)}.piano .piano-key--degree-6{background:var(--color-degree-sixth-dark)}.piano .piano-key--degree-7{background:var(--color-degree-seventh-dark)}@use "../globals/globals" as *;.current-progressions{display:grid;grid-template-columns:1fr;justify-items:stretch}.current-progressions .progression{border:4px var(--color-primary-light) double;background:radial-gradient(var(--sheen-dark), transparent)}@media (min-width: 768px){.current-progressions{grid-template-columns:1fr 1fr}}.new-progressions .progression{background:var(--sheen-light);border:2px var(--color-secondary-white) dashed}.current-progressions form,.new-progressions form{display:flex;flex-direction:column;align-items:stretch}.progression-template-picker form{display:flex;flex-direction:column;align-items:center}@media (min-width: 768px){.no-song-progression{grid-column:1 / 3}}@use "../globals/globals" as *;.progression-template-form{display:flex;flex-direction:column;align-items:stretch;gap:12px}.progression-template-form input.field--progression-cypher{text-align:left}.template-cypher-print{align-self:center;font-size:1.5rem;color:var(--color-secondary-lightest);letter-spacing:2px}.current-progression-templates .progression-template{border:4px var(--color-primary-light) double;background:radial-gradient(var(--sheen-dark), transparent)}.new-progression-templates .progression-template{background:var(--sheen-light);border:2px var(--color-secondary-white) dashed}@use "../globals/globals" as *;.scales-table{grid-template-columns:[start] 1fr 1fr [end]}@use "../globals/globals" as *;.setlists{grid-template-columns:[start] 3fr 1fr 1fr 1fr [end]}@use "../globals/globals" as *;.view-song{display:flex;flex-direction:column}.view-song .title{display:flex;flex-direction:row;justify-content:center;color:var(--color-secondary-lightest);margin:16px 0}.view-song .support-artists{display:flex;flex-direction:column;align-items:center;gap:8px}.view-song .artist-links{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:12px;margin-bottom:16px}.view-song .song-info{padding:16px;border:1px var(--color-primary-dark) solid}.view-song .song-info>*{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.view-song .song-info label{font-size:1rem}@media (min-width: 768px){.view-song .song-info{margin:24px}}.view-song .nav-links{display:grid;grid-template-columns:repeat(2, 1fr);justify-self:center;align-self:center;gap:0;margin:12px}.view-song .nav-links a.button--square{padding:24px}@media (min-width: 1024px){.view-song .nav-links a.button--square{padding:16px}}.view-song .admin-actions{display:flex;flex-direction:column;gap:12px;justify-content:center;align-items:center}@media (min-width: 768px){.view-song .admin-actions{flex-direction:row;grid-column:1 / -1;gap:24px}}.view-song .admin-actions *,.view-song .nav-links *{margin:0}.view-song .helpers{display:flex;flex-direction:column;justify-content:space-between;align-items:stretch;gap:20px}@media (min-width: 768px){.view-song .helpers{grid-column:1 / -1}}.view-song .show-song{display:initial;padding:16px;text-align:left;margin-top:20px}.view-song .show-song .progression-tag{color:var(--color-secondary-white);margin:4px 12px;font-style:italic}@media (min-width: 768px){.view-song .show-song{grid-column:1 / -1;columns:2}}@media (min-width: 1440px){.view-song .show-song{columns:3}}.view-song .song-options{display:flex;gap:8px;flex-direction:column}.view-song .song-options .field label{max-width:fit-content}.view-song .song-options .field .key-shift,.view-song .song-options .field .select-capo{width:fit-content;padding:4px 16px}@media (min-width: 768px){.view-song .song-options{display:flex;flex-direction:row;gap:12px;align-items:center}}.view-song .degree-1{color:var(--color-degree-first-light)}.view-song .degree-2{color:var(--color-degree-second-light)}.view-song .degree-3{color:var(--color-degree-third-light)}.view-song .degree-4{color:var(--color-degree-fourth-light)}.view-song .degree-5{color:var(--color-degree-fifth-light)}.view-song .degree-6{color:var(--color-degree-sixth-light)}.view-song .degree-7{color:var(--color-degree-seventh-light)}.view-song .instruments{display:flex;flex-direction:column;align-items:center}.view-song .instruments form{display:flex;flex-direction:column;align-items:center;gap:8px}@media (min-width: 768px){.view-song .instruments form{flex-direction:row;gap:16px}}@media (min-width: 1024px){.view-song .instruments .instrument-helper{display:flex;flex-direction:row;align-items:center;justify-content:space-around;gap:16px}}@media (min-width: 768px){.view-song .instruments .instrument-helper .instrument-view{transform:initial}}@media (min-width: 1440px){.view-song .instruments .instrument-helper .instrument-view{margin:24px}}.view-song .play-actions{display:grid;grid-template-columns:[start] 3fr 1fr [end];align-items:center;justify-items:center;background:var(--color-black);padding:16px;border-color:var(--color-primary-light);border-width:1px;border-style:solid}.view-song .play-actions>*{display:grid;grid-template-columns:subgrid;grid-column-start:start;grid-column-end:end;justify-content:space-between;align-items:center;gap:16px}.view-song .play-actions>* a{justify-self:flex-end}.view-song .tips ul{text-align:justify}@media (min-width: 768px){.view-song .tips{grid-column:1 / -1}}@media (min-width: 768px){.view-song{display:grid;grid-template-columns:1fr 3fr 3fr;column-gap:16px;row-gap:4px}.view-song .title,.view-song .support-artists{grid-column:1 / -1}}@media (min-width: 1440px){.view-song .helpers .chords{grid-template-columns:repeat(8, 1fr)}}@use "../globals/globals" as *;.song-shifter{display:flex;justify-content:center;gap:24px;padding:16px;margin:16px;align-items:center}.song-shifter a{text-decoration:none;font-size:2rem}@use "../globals/globals" as *;.song-list{display:grid;font-size:1.125rem;grid-template-columns:repeat(4, 1fr)}@media (min-width: 768px){.song-list{grid-template-columns:1fr 7fr 5fr 1fr 1fr 1fr 2fr 2fr}}.song-list .song{display:grid;grid-template-columns:subgrid;grid-column:1 / -1;grid-template-areas:"favorite   title       title       title" "artist     artist      artist      artist" "key        key         capo        capo" "plays      plays       last_play   last_play" "actions    actions     actions     actions";border:1px var(--color-primary-dark) solid;padding:16px 12px}.song-list .song:nth-child(n - 1){margin-bottom:-1px}.song-list .song .song__favorite{grid-area:favorite}.song-list .song .song__title{grid-area:title}.song-list .song .song__title a{color:var(--color-primary-lightest);font-size:1.25rem}.song-list .song .song__title a:hover{color:var(--color-white)}.song-list .song .song__title a:active{color:var(--color-primary-lighter)}.song-list .song .song__artist{grid-area:artist;font-style:italic}.song-list .song .song__artist a{text-decoration:none}.song-list .song .song__key{grid-area:key}.song-list .song .song__capo{grid-area:capo}.song-list .song .song__plays{grid-area:plays}.song-list .song .song__last-play{grid-area:last_play}.song-list .song .song__actions{display:flex;grid-area:actions;justify-content:center;align-items:center;width:100%}@media (min-width: 768px){.song-list .song .song__key,.song-list .song .song__capo,.song-list .song .song__plays{justify-self:center}}.song-list .song:hover{background:var(--color-primary-darkest)}.song-list .song,.song-list .song:hover{transition-duration:0.25s}.song-list .song,.song-list .song-list-header{column-gap:12px;row-gap:8px;justify-items:left;align-items:center}@media (min-width: 768px){.song-list .song,.song-list .song-list-header{grid-template-areas:initial;grid-template-columns:subgrid}.song-list .song>.song__favorite,.song-list .song>.song__title,.song-list .song>.song__artist,.song-list .song>.song__key,.song-list .song>.song__capo,.song-list .song>.song__plays,.song-list .song>.song__last-play,.song-list .song>.song__actions,.song-list .song-list-header>.song__favorite,.song-list .song-list-header>.song__title,.song-list .song-list-header>.song__artist,.song-list .song-list-header>.song__key,.song-list .song-list-header>.song__capo,.song-list .song-list-header>.song__plays,.song-list .song-list-header>.song__last-play,.song-list .song-list-header>.song__actions{grid-area:initial}}.song-list .song-list-header{display:none;justify-items:center}@media (min-width: 768px){.song-list .song-list-header{display:grid;grid-column:1 / -1}}.song-list .song-list-header>*{padding:12px;text-align:center}@media (min-width: 768px){.song-list .song-list-header>*{padding:12px 16px}}.song-list .song-row--by-heart{background-color:var(--color-practice--by-heart)}.song-list .song-row--green{background-color:var(--color-practice--green)}.song-list .song-row--yellow{background-color:var(--color-practice--yellow)}.song-list .song-row--orange{background-color:var(--color-practice--orange)}.song-list .song-row--red{background-color:var(--color-practice--red)}.song-list-options{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}.song-list-options .sorters{display:grid;grid-template-columns:repeat(2, 1fr);gap:16px}.song-list-options .filters,.song-list-options .filters form{display:flex;flex-direction:column;align-items:stretch;width:100%}.song-list-options .filters input[type=submit],.song-list-options .filters form input[type=submit]{width:100%;align-self:center}.song-list-options .filters .filter-controls,.song-list-options .filters form .filter-controls{display:flex;flex-direction:row}.song-list-options .filters select,.song-list-options .filters form select{max-width:40vw}@media (min-width: 768px){.song-list-options .filters select,.song-list-options .filters form select{max-width:95vw}}@media (min-width: 768px){.song-list-options{display:grid;grid-template-columns:repeat(4, 1fr);grid-template-areas:"sort       sort        sort        sort" "filter     filter      filter      filter" "search     search      clear       clear";row-gap:16px;column-gap:8px}.song-list-options .sorters{grid-area:sort;display:grid;grid-template-columns:subgrid;justify-content:space-around;align-items:center;row-gap:8px}.song-list-options .sorters .label{grid-column:1 / -1}.song-list-options .sorters a{justify-self:center}.song-list-options .filters{grid-area:filter;display:grid;grid-template-columns:subgrid}.song-list-options .filters .label{margin-bottom:8px}.song-list-options .filters form{display:grid;grid-template-columns:subgrid;grid-column:1 / -1;row-gap:8px}.song-list-options .filters form .filter--key,.song-list-options .filters form .filter--capo{grid-column:span 2}.song-list-options .filters form .filter--artist{grid-column:1 / -1}.song-list-options .filters form input[type=submit]{grid-column:3 / -1}.song-list-options .search{grid-area:search}.song-list-options .search .song-search{display:flex;flex-direction:row;width:100%}.song-list-options .search .song-search input[type=text]{width:100%}.song-list-options .clear{grid-area:clear}}@media (min-width: 768px){.showcase--anon .song-list .song__artist{grid-column:span 4;justify-self:end}.showcase--hide-key .song-list .song__artist{grid-column:span 3}}@use "../globals/globals" as *;.star-toggle{display:flex;flex-direction:column;justify-content:center;position:relative;user-select:none}.star-toggle input{position:absolute;opacity:0;cursor:pointer;transform:initial;margin:0}.star-toggle svg{transition:all 0.25s}.star-toggle svg,.star-toggle input{height:32px;width:32px}.star-toggle:hover{transform:scale(1.1)}.star-toggle input:checked~svg{fill:var(--color-white)}@use "../globals/globals" as *;.stats{display:flex;flex-direction:column;gap:16px}.stats .data{color:var(--color-secondary-lightest)}.daily-average,.heart-stats{display:flex;flex-direction:column;gap:12px}.daily-average div:nth-child(n+2){padding-left:48px}@use "../globals/globals" as *;.subscription-features{display:grid;grid-template-columns:2fr repeat(3, 1fr);margin:16px;font-size:0.875rem}@media (min-width: 768px){.subscription-features{font-size:1rem}}.subscription-features .feature{display:grid;grid-template-columns:subgrid;grid-column:1 / -1;justify-items:stretch;text-align:center;align-items:stretch}.subscription-features .feature__access{font-size:1.5rem}.subscription-features .feature>*{border:1px var(--color-primary-dark) solid;padding:4px}.subscription-features .feature__name{display:flex;align-items:center;text-align:left;padding-left:16px;background:var(--color-primary-darkest)}.subscription-features .feature--header{background:var(--color-primary-darkest);color:var(--color-secondary-white);font-weight:bold}.subscription-features .feature--header>*{padding:12px}@use "../globals/globals" as *;.table{display:grid}.table .table-header{display:none;justify-items:center;align-items:center;font-size:1.125rem;font-weight:bold;color:var(--color-secondary-lightest)}@media (min-width: 768px){.table .table-header{display:grid}}.table .table-header>*{padding:16px}.table .table-row,.table .table-header{display:grid;grid-template-columns:subgrid;grid-column-start:start;grid-column-end:end;align-items:center;padding:4px;justify-items:center}.table .table-row>*:first-child{justify-self:left}.table .table-row>*:last-child{justify-self:right}.table .table-row>*{padding:4px;margin:4px 16px}.table .table-row:nth-child(2n){background:var(--color-primary-darkest)}.table .row-actions{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.table-title{text-align:center}@use "../globals/globals" as *;.toggle-switch{display:flex;align-items:center}.toggle-switch .toggle{position:relative;display:inline-block;width:48px;height:24px}.toggle-switch .toggle input{display:none}.toggle-switch .toggle input:checked+.slider{background-color:var(--color-primary-dark)}.toggle-switch .toggle input:checked+.slider::before{transform:translateX(20px);background-color:var(--color-primary-lightest)}.toggle-switch .toggle .slider{position:absolute;cursor:pointer;background-color:var(--color-primary-darker);border-radius:24px;width:100%;height:100%;transition:background-color 0.25s}.toggle-switch .toggle .slider::before{content:"";position:absolute;height:20px;width:20px;left:4px;bottom:2px;background-color:var(--color-primary-white);border-radius:50%;transition:0.25s}