.ss-app{max-width:920px}
.ss-title-image{display:block;max-width:90px;max-height:72px;object-fit:contain}.ss-hero{background-size:cover;background-position:center}.ss-chord-picker{margin:0 0 30px;padding:22px;border:1px solid #d2cbc1;background:#fff}.ss-chord-picker legend{padding:0 8px;font:600 15px var(--ss-heading-font);color:var(--ink)}.ss-chord-picker>p{margin:0 0 13px;font-size:14px}.ss-chord-options{display:flex;flex-wrap:wrap;gap:9px}.ss-chord-options label{cursor:pointer}.ss-chord-options input{position:absolute;opacity:0}.ss-chord-options span{display:grid;place-items:center;min-width:47px;height:43px;padding:0 11px;border:1px solid #d2cbc1;background:var(--sand);font:600 15px var(--ss-heading-font);transition:.15s}.ss-chord-options input:checked+span{border-color:var(--safari);background:var(--safari);color:#fff;box-shadow:0 4px 10px rgba(156,87,48,.2)}.ss-card{padding-left:38px}.ss-type-icon{position:static;float:left;margin:0 22px 12px 0}.ss-instruction h3{margin:0 0 7px;color:var(--safari);font:600 13px var(--ss-heading-font);letter-spacing:.1em;text-transform:uppercase}.ss-instruction>p{margin:0;color:var(--ink);font-size:18px}.ss-example{clear:both;margin:24px 0 20px;padding:16px 18px;border-left:4px solid var(--gold);background:#f8f4ee}.ss-example strong{display:block;margin-bottom:4px;color:var(--ink);font:600 12px var(--ss-heading-font);letter-spacing:.08em;text-transform:uppercase}.ss-diagrams{display:flex;gap:13px;overflow-x:auto;padding:6px 2px 17px}.ss-chord{flex:0 0 112px;margin:0;padding:10px;border:1px solid #ded6cc;background:#fff;text-align:center}.ss-chord figcaption{font:600 19px var(--ss-heading-font);color:var(--ink)}.ss-chord svg{display:block;width:86px;height:115px;margin:auto;color:var(--safari-dark)}.ss-recorder{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:26px 0 0;padding:15px 18px;border:1px solid #d2cbc1;background:#fff}.ss-recorder>div{margin-right:auto}.ss-recorder strong,.ss-recorder small{display:block}.ss-recorder strong{color:var(--ink);font-family:var(--ss-heading-font)}.ss-recorder small{color:#777}.ss-record{padding:9px 14px;border:1px solid #a84637;background:#fff;color:#a84637;cursor:pointer}.ss-recorder.is-recording .ss-record{background:#a84637;color:#fff}.ss-record-time{min-width:43px;font-variant-numeric:tabular-nums}.ss-recorder audio{width:100%;height:38px}.ss-download{color:var(--safari-dark);font-weight:600}@media(max-width:600px){.ss-title-image{max-width:65px}.ss-chord-picker{padding:16px}.ss-card{padding:25px 20px}.ss-type-icon{width:48px;height:48px}.ss-instruction>p{font-size:16px}.ss-recorder>div{width:100%}}