.explorer-forms{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.explorer-forms .choice{font-size:17px;line-height:1.15}.explorer-forms .form-caption{display:block;margin-top:4px;font-size:10px;font-weight:500;letter-spacing:.3px;color:var(--muted)}.explorer-forms .choice.selected .form-caption{color:#d5ceff}
.explorer-forms{overflow:visible}.explorer-forms .shape-choice{position:relative;min-width:0}.explorer-forms .choice{min-width:0;width:100%}
.shape-help-wrap{position:absolute;display:block;pointer-events:none;right:4px;top:3px;z-index:4}
.shape-help{pointer-events:auto;position:relative;z-index:2;width:21px;height:21px;padding:0;border:1px solid #8d86b4;border-radius:50%;background:#24233e;color:#e5e0ff;font-size:12px;line-height:18px;cursor:help}
.shape-tip{display:none;pointer-events:none;position:absolute;z-index:30;top:26px;right:0;width:min(310px,78vw);padding:13px 15px;background:#25243a;border:1px solid #8078ae;border-radius:10px;box-shadow:0 12px 35px #0008;color:#f5f2ff;font-size:12px;line-height:1.5;text-align:left}
.shape-diagram{display:block;width:100%;max-width:240px;height:auto;margin:8px auto 12px}.shape-tip strong,.shape-tip span,.shape-tip em{display:block;margin-bottom:6px}.shape-tip em{color:#d7c9ff;margin-bottom:0}
.shape-help-wrap:hover .shape-tip,.shape-help-wrap:focus-within .shape-tip,.shape-help-wrap.open .shape-tip{display:block}
.fretcell.explorer-root .dot{background:#e9b55e;color:#26190f}.fretcell.explorer-shape .dot{background:#5be0a6;color:#12241e}.fretcell.explorer-anchor .dot{outline:3px solid #fff3c8;outline-offset:2px}.fretcell.explorer-muted{opacity:.65}.fretcell.explorer-root .dot,.fretcell.explorer-shape .dot{width:32px;height:32px}
/* Acoustic-inspired neck, with traditional pearl inlays between strings. */
.board{background:linear-gradient(90deg,rgba(16,8,5,.23),transparent 28%,rgba(255,210,135,.06) 53%,rgba(14,6,4,.22)),repeating-linear-gradient(0deg,rgba(255,211,151,.025) 0px,rgba(34,12,8,.065) 3px,transparent 8px,rgba(0,0,0,.055) 15px),linear-gradient(180deg,#513023,#613b2b 48%,#42251d);box-shadow:inset 0 2px 9px #1b0f0c,inset 0 -2px 8px #1b0f0c;border:1px solid #76503a}
.fretcell{border-right:3px ridge #b4a8a0;border-bottom:0;overflow:visible}
.fretcell::before{height:2px;background:linear-gradient(#d8c8a6,#8d8a83);box-shadow:0 1px 1px #2b1b14}
.fretcell.open{border-right:5px solid #e5cba3}
.fretcell.inlay::after{content:"";position:absolute;z-index:1;pointer-events:none;left:50%;bottom:-7px;transform:translateX(-50%);width:12px;height:12px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff8e7,#d7c8a8 70%,#ae9b7e);box-shadow:0 1px 3px #26150e, inset 0 0 2px #fff}
.fretcell .dot{z-index:3}
.fretcell.picked .dot{background:#e9b55e;color:#25190f}
.fretcell.hit .dot{background:var(--good)}
.fretcell.solution .dot{background:#30271d}

/* Chordwise · Conservatory edition */
:root{color-scheme:light;--bg:#e8ddc5;--card:#f8f0df;--muted:#776a56;--line:#c8b798;--accent:#70452d;--good:#326d52;--bad:#a5473c}
body{background:radial-gradient(ellipse at 50% -12%,#fff6dc 0%,#e8ddc5 49%,#cdbb9b 100%);color:#30291f;font-family:Georgia,'Times New Roman',serif}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.22;background-image:repeating-linear-gradient(0deg,transparent 0 3px,#806c4d08 4px 5px),repeating-linear-gradient(90deg,transparent 0 5px,#5d452508 6px 7px)}
.app{position:relative}
header{padding:4px 6px 18px;border-bottom:2px solid #98734c;margin-bottom:24px}
.logo{font-family:Georgia,'Times New Roman',serif;font-size:31px;font-weight:700;letter-spacing:-1.2px;color:#47301e}
.logo span{color:#693c28}
.badge{font-size:12px;letter-spacing:1.4px;text-transform:uppercase;color:#806c4e;font-family:Georgia,serif}
.panel{background:linear-gradient(155deg,#fff9e9,#f5ebd6 70%,#f0e4cb);border:1px solid #bba784;border-radius:6px;box-shadow:0 16px 35px #58452b21,0 3px 0 #b9a381, inset 0 0 0 5px #f7eedc,inset 0 0 0 6px #d8c7a8}
h1,.question{font-family:Georgia,'Times New Roman',serif;font-weight:700;letter-spacing:-.9px;color:#39271c}
h1{font-size:clamp(30px,5vw,43px)}
p,.hint,.footer{color:#756851}
.field label{color:#4e3825;font-weight:700}
.eyebrow{color:#956b36;font-family:Georgia,serif;letter-spacing:2px}
select,input{background:#fffaf0;color:#352b1f;border:1px solid #b9a583;border-radius:4px;box-shadow:inset 0 1px 3px #68513213}
select:focus,input:focus{border-color:#9a703d;outline:2px solid #c5a16b66}
.choice{background:linear-gradient(#fff9eb,#f1e5ce);border:1px solid #c9b595;color:#493724;border-radius:5px;font-weight:700;box-shadow:0 2px 0 #c5b292}
.choice:hover{background:#f5e5c6;border-color:#a17c4e}
.choice.selected{background:linear-gradient(#6f4935,#523323);border-color:#5b3826;color:#fff5de;box-shadow:0 2px 0 #3f291d}
.activity small,.explorer-forms .form-caption{color:#806f55}
.activity .selected small,.explorer-forms .choice.selected .form-caption{color:#ead6b6}
.primary{background:linear-gradient(#855b3e,#63402b);color:#fff6e5;border:1px solid #54331f;border-radius:5px;box-shadow:0 3px 0 #3f291b}
.secondary{background:#f8efdd;border:1px solid #baa584;color:#62432c;border-radius:4px}
.secondary:hover{background:#ecdfc4}
.stats,.note-status,.subheading{color:#74634e}
.stats strong{color:#513a28}
.feedback{border-radius:4px;border:1px solid #c5b393}
.feedback.correct{background:#e0ecda;color:#30563c;border-color:#a6c2a0}
.feedback.wrong{background:#f2ddd6;color:#833f35;border-color:#d6aa9e}
.feedback.revealed{background:#eee4d2;color:#604b36}
.explanation,.map{color:#65533f}
.kbd{border-color:#baa786}
.board{border:3px solid #6e472e;box-shadow:0 5px 14px #35211242,inset 0 2px 9px #1b0f0c}
.string-name,.fret-label{color:#f4e5c8;text-shadow:0 1px 2px #25130e}
.fretcell.picked .dot,.fretcell.explorer-root .dot{background:#e6bd6b;color:#352415}
.fretcell.hit .dot,.fretcell.explorer-shape .dot{background:#c5dfb4;color:#29432c}
.fretcell.miss .dot{background:#e8a79c;color:#54241e}
.fretcell.solution .dot{outline-color:#d1e8bd;color:#f2f6d9}
.shape-help{background:#f6ebd5;color:#6c4a31;border-color:#ad936e}
.shape-tip{background:#f9f0dd;color:#493523;border-color:#b69a70;box-shadow:0 12px 28px #33251538}
.shape-tip em{color:#875d32}
.shape-diagram{border:1px solid #9d835e;border-radius:4px}
.fret-actions{padding-top:5px}
::selection{background:#d7bd8e;color:#3a2819}
@media(max-width:620px){header{align-items:flex-start;gap:8px}.logo{font-size:27px}.badge{font-size:10px;max-width:135px;text-align:right}}


/* Conservatory account controls */
.header-account{display:flex;flex-direction:column;align-items:flex-end;gap:7px}
.account-controls{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:9px}
.account-name{font-size:12px;color:#765a3f;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.account-controls .secondary{font-size:12px;padding:7px 11px}
.auth-status{font-size:11px;color:#9d4e35;max-width:260px;text-align:right}
.auth-status:empty{display:none}
@media(max-width:620px){.header-account{align-items:flex-end}.account-controls{flex-direction:column;align-items:flex-end;gap:6px}.account-name{max-width:150px}}