.tool-deinen{--paper:#fffdfa;--ink:#102238;--muted:#66717c;--line:#ddd6ca;--gold:#d6952b;--gold-ink:#8a5d17;--soft:#f3eee5;--blueSoft:#dfe9f0;--pulse:#f0cf88;--right:#dfe9f0}.tool-deinen .card{background:var(--paper);border:1px solid var(--line);border-radius:24px;padding:18px;box-shadow:0 18px 60px #1c273112}.tool-deinen .kicker{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:9px}.tool-deinen .section{margin-top:22px}.tool-deinen .meterRow,.tool-deinen .optionRow,.tool-deinen .actions{display:flex;gap:8px;flex-wrap:wrap}.tool-deinen button{border:0;border-radius:999px;padding:11px 16px;font:inherit;font-weight:760;cursor:pointer;background:var(--ink);color:#fff}.tool-deinen button.secondary{background:var(--soft);color:var(--ink)}.tool-deinen button.pill{background:#fff;color:var(--ink);border:1px solid var(--line)}.tool-deinen button.pill.active,.tool-deinen button.secondary.active{background:var(--ink);color:#fff;border-color:var(--ink)}.tool-deinen .keyboardHint,.tool-deinen .optionHint,.tool-deinen .tip,.tool-deinen .status{color:var(--muted);font-size:14px;line-height:1.45}.tool-deinen .keyboardWrap{padding:14px 10px 10px;background:#efebe3;border:1px solid var(--line);border-radius:16px;overflow:hidden}.tool-deinen .keyboardStage{position:relative;width:100%;height:220px;overflow:hidden}.tool-deinen .keyboard{position:absolute;top:0;left:0;height:220px;-webkit-user-select:none;user-select:none;transform-origin:top left}.tool-deinen .whiteKey{position:absolute;top:0;width:60px;height:210px;background:#fff;border:1px solid #9c968d;border-radius:0 0 7px 7px;display:flex;align-items:flex-end;justify-content:center;padding:0 0 12px;font-size:14px;font-weight:800;color:var(--ink);transition:background .12s,transform .12s,box-shadow .12s;z-index:1}.tool-deinen .whiteKey.rootChoice{cursor:pointer}.tool-deinen .whiteKey.rootChoice:hover{background:#fffaf0}.tool-deinen .whiteKey.visualOnly{color:#aaa49b}.tool-deinen .whiteKey.leftFlash{background:#f3dfb3;transform:translateY(2px)}.tool-deinen .whiteKey.rightFlash{background:var(--right);transform:translateY(2px)}.tool-deinen .blackKey{position:absolute;top:0;width:36px;height:128px;background:#1f2430;border:1px solid #0c0f14;border-radius:0 0 5px 5px;z-index:4;pointer-events:none}.tool-deinen .keyboardDivider{position:absolute;top:0;bottom:10px;width:2px;background:#bb8c4238;z-index:5;pointer-events:none}.tool-deinen .rightControlRow{display:flex;justify-content:flex-end;align-items:center;margin:12px 0 8px}.tool-deinen .rightControlRow[hidden]{display:none!important}.tool-deinen .rightControlRow .pill{white-space:nowrap}.tool-deinen .handStudio{margin-top:8px;display:grid;grid-template-columns:1fr;gap:12px;align-items:stretch}.tool-deinen .handStudio.dual{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-deinen .handCard{background:#fff;border:1px solid var(--line);border-radius:18px;padding:12px;height:100%;display:grid;grid-template-rows:auto 190px auto auto auto;align-content:start}.tool-deinen .handCard[hidden]{display:none!important}.tool-deinen .handHeader{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}.tool-deinen .handLabel{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:800}.tool-deinen .handWrap{display:flex;justify-content:center;align-items:center;min-height:190px}.tool-deinen .handCard .handHelp{margin-top:auto;padding-top:8px}.tool-deinen .rightStep2{margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}.tool-deinen .rightStepLabel{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:800;margin-bottom:7px}.tool-deinen .rightStep2 button{width:100%;border-radius:16px}.tool-deinen .handSvg{width:100%;max-width:255px;max-height:185px;height:100%;display:block}.tool-deinen .handAsset{--hand-fill:#f2e6d5;--hand-outline:#c5b9a9;--number-color:#152337;--accent-color:#f4d391}.tool-deinen .handAsset .hand-fill{fill:var(--hand-fill,#f2e6d5)}.tool-deinen .handAsset .hand-outline{stroke:var(--hand-outline,#c5b9a9)}.tool-deinen .handAsset .finger-number{fill:var(--number-color,#152337)}.tool-deinen .handAsset .accent{fill:var(--accent-color,#f4d391)}.tool-deinen .handAsset .fingerHotspot{opacity:0;transform-box:fill-box;transform-origin:center;pointer-events:none}.tool-deinen .handAsset .fingerHotspot circle{fill:var(--accent-color,#f4d391)}.tool-deinen .handAsset .fingerHotspot.active{opacity:1;animation:assetPulse .72s ease-in-out infinite}@keyframes assetPulse{0%,to{transform:scale(.9);opacity:.22}50%{transform:scale(1.1);opacity:.62}}.tool-deinen .handTitle{font-size:18px;font-weight:900;line-height:1.15;margin:0 0 6px}.tool-deinen .handSequence{font-size:18px;font-weight:850;letter-spacing:.02em;margin:0 0 6px}.tool-deinen .handHelp{color:var(--muted);font-size:14px;line-height:1.45;margin:0}.tool-deinen .hand-part{transition:transform .16s,opacity .16s,filter .16s,fill .16s}.tool-deinen .hand-base{fill:#e6ddcf;stroke:#cabca9;stroke-width:1.4}.tool-deinen .hand-base.subtle{opacity:.76}.tool-deinen .hand-number{fill:var(--ink);font-size:12px;font-weight:900}.tool-deinen .hand-number.emph{font-size:13px}.tool-deinen .hand-part.active .hand-base{fill:var(--pulse);filter:drop-shadow(0 0 4px rgba(187,140,66,.45))}.tool-deinen .hand-part.active{animation:pulseFinger .72s ease-in-out infinite}@keyframes pulseFinger{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-3px) scale(1.03)}}.tool-deinen .measureGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px}.tool-deinen .measure{min-height:94px;border:1px solid var(--line);background:#fff;border-radius:14px;padding:10px;cursor:pointer;transition:border-color .12s,box-shadow .12s,transform .12s}.tool-deinen .measure.activeSlot{border-color:var(--gold);box-shadow:0 0 0 3px #d6952b24}.tool-deinen .measure.playing{background:#faf0dc;transform:translateY(-2px)}.tool-deinen .measure.empty{color:#a8a097}.tool-deinen .measureNum{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:800}.tool-deinen .measureRoot{margin-top:6px;font-size:22px;font-weight:900}.tool-deinen .measurePattern{margin-top:2px;font-size:13px;color:var(--muted)}.tool-deinen .measureRight{margin-top:2px;font-size:12px;color:var(--gold-ink);font-weight:800}.tool-deinen .actions{margin-top:14px}.tool-deinen .tryIt{margin-top:18px;border-top:1px solid var(--line);padding-top:14px}.tool-deinen .tryIt strong{display:block;margin-bottom:4px}.tool-deinen .tryIt p{margin:0;color:var(--muted);font-size:14px;line-height:1.45}.tool-deinen .status{margin-top:12px;min-height:22px}@media (max-width:860px){.tool-deinen .measureGrid{grid-template-columns:repeat(2,1fr)}}@media (max-width:640px){.tool-deinen .card{padding:14px}.tool-deinen .keyboardWrap{margin-left:-9px;margin-right:-9px;padding-left:6px;padding-right:6px;border-radius:14px}.tool-deinen .keyboardHint,.tool-deinen .optionHint,.tool-deinen .tip,.tool-deinen .status{font-size:13px}.tool-deinen .handStudio.dual{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-deinen .handCard{padding:10px}.tool-deinen .handWrap{min-height:160px}.tool-deinen .handSvg{max-width:180px}.tool-deinen .handTitle,.tool-deinen .handSequence{font-size:16px}.tool-deinen .measure{min-height:90px}}
