.dotted-settings{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:24px 0}
.dotted-settings label{display:flex;align-items:center;gap:12px}
.dotted-variants{display:flex;gap:6px;flex-wrap:wrap}
.dotted-variants button{min-height:46px;padding:10px 16px;border:1px solid #879797;border-radius:10px;background:#fff;color:var(--ink);font:inherit;font-weight:650}
.dotted-variants [aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}
.dotted-app .dotted-answers{grid-template-columns:repeat(3,minmax(0,1fr))}
.dotted-comparison{margin:24px 0;padding:20px;background:#f1f4ed;border:1px solid var(--line);border-radius:16px;text-align:left}
.dotted-comparison h3{margin:0 0 18px;font-size:1.05rem}.dotted-comparison p{line-height:1.65}
.dotted-bar-label{display:flex;justify-content:space-between;gap:12px;font-size:1rem;margin:16px 0 8px}
.dotted-bar-track{display:flex;height:28px;background:#fff;border:1px solid #879797;border-radius:4px;overflow:hidden}
.dotted-bar-base{background:#bcd852;border-right:1px solid #647472}.dotted-bar-extra{background:#a7b7ef;border-right:1px solid #647472}
.dotted-formula{font-weight:650;margin-top:18px}.dotted-comparison [data-detail]{color:var(--muted)}
.dotted-app .dotted-playing{color:#3647b6}.dotted-app [data-feedback]{line-height:1.7}
@media(max-width:680px){.dotted-settings{align-items:stretch}.dotted-settings label,.dotted-variants{width:100%}.dotted-settings select{flex:1;min-width:0}.dotted-variants button{flex:1}.dotted-app .dotted-answers{grid-template-columns:repeat(2,minmax(0,1fr))}.dotted-comparison{padding:16px}.dotted-bar-label{flex-wrap:wrap;gap:4px}}