.mft .kb{--bw:calc(100% / var(--nw) * .58);position:relative;display:flex;gap:2px;height:120px}
.mft .kb .kw{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:8px;padding:0 0 12px;border:0;border-radius:3px 3px 10px 10px;background:#E9E5DE;font:inherit;color:#8A867F;transition:background .3s ease}
.mft .kb .kw:first-child{border-top-left-radius:10px}
.mft .kb .kw:nth-last-child(1 of .kw){border-top-right-radius:10px}
.mft .kb .kb-b{position:absolute;top:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;width:var(--bw);height:60%;padding:0 0 10px;border:0;border-radius:0 0 8px 8px;background:#1C1C1C;box-sizing:border-box;font:inherit;color:#8A867F;transition:background .3s ease}
.mft .kb .kd{display:block;width:6px;height:6px;border-radius:50%;background:#A8A39B}
.mft .kb .kb-b .kd{background:#6B6862}
.mft .kb .kw.hit,.mft .kb .kb-b.hit{background:var(--c)}
.mft .kb .kw.hit .kd,.mft .kb .kb-b.hit .kd{background:rgba(20,20,20,.55)}
.mft .gn-o{display:inline-flex;align-items:center;gap:6px;height:auto;padding:0;border:0;background:none;color:#A39F98;font:inherit;font-size:15px;line-height:20px;cursor:pointer;white-space:nowrap}
.mft .gn-o:hover{color:#E6E2DA}
.mft .ti-h{display:flex;align-items:baseline;justify-content:space-between;margin:0 4px 20px}
.mft .ti-h h2{margin:0;font-size:32px;line-height:38px;font-weight:400;color:#E6E2DA;letter-spacing:-.01em}
.mft .ti-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.mft .ti-card{display:flex;flex-direction:column;padding:12px;border-radius:32px;background:#1E1E1E;color:inherit;text-decoration:none;transition:background .2s ease}
.mft a.ti-card:hover{background:#232323}
.mft .ti-pv{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;height:200px;border-radius:20px;background:#262626;overflow:hidden;text-decoration:none}
.mft .ti-tx{padding:14px 12px 6px}
.pg .mft .ti-n{margin:0;font-size:20px;line-height:26px;color:#E6E2DA}
.pg .mft .ti-l{margin:4px 0 0;font-size:15px;line-height:21px;color:#8A867F}
.pg .mft .mv-num{margin:0;font-size:64px;line-height:64px;letter-spacing:-.03em;color:#E6E2DA;display:flex;align-items:baseline;gap:8px}
.mft .mv-num span{font-size:15px;letter-spacing:0;color:#6B6862}
.mft .mv-num em{font-style:normal;color:#6B6862}
.mft .mv-num b{font-weight:400;font-size:28px;color:#6B6862}
.pg .mft .mv-key{font-size:48px;line-height:52px}
.mft .mv-key .mv-b{font-size:28px;margin-left:12px}
.mft .mv-sharps{letter-spacing:.06em}
.pg .mft .mv-s{margin:0;font-size:14px;color:#8A867F}
.mft .mv-beats{display:flex;gap:6px}
.mft .mv-beats i{width:40px;height:26px;border-radius:8px;background:#303030}
.mft .mv-beats i.on{background:var(--c)}
.mft .mv-row{display:flex;align-items:center;gap:20px}
.mft .mv-tap{display:grid;place-items:center;width:96px;height:96px;border-radius:20px;background:var(--c);color:#141414;font-size:18px}
.mft .mv-pads{display:grid;grid-template-columns:repeat(4,30px);gap:6px}
.mft .mv-pads i{height:30px;border-radius:8px;background:#303030}
.mft .mv-pads i.hit{background:#3A3A3A}
.mft .mv-chips,.mft .mv-gp{display:flex;gap:6px}
.mft .mv-chips span,.mft .mv-gp span{display:grid;place-items:center;min-width:44px;height:40px;padding:0 10px;border-radius:12px;background:#303030;color:#E6E2DA;font-size:16px}
.mft .mv-chips span.on{background:var(--c);color:#141414}
.mft .mv-gp span{min-width:56px;height:56px;font-size:14px}
.pg .mft .mv-arrow{margin:-4px 0;font-size:16px;color:#6B6862}
.mft .mv-kb{width:200px}
.mft .mv-kb .kb{height:76px}
.mft .mv-kb .kb em{display:none}
.mft .mv-circle{position:relative;width:150px;height:150px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(230,226,218,.08)}
.mft .mv-circle span{position:absolute;transform:translate(-50%,-50%);font-size:13px;color:#8A867F}
.mft .mv-circle span.on{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#E6E2DA;color:#141414}
.mft .mv-phone{width:84px;height:150px;border-radius:16px;box-shadow:inset 0 0 0 2px #4A4743;display:grid;place-items:center}
.mft .mv-phone i{width:60px;height:96px;border-radius:6px;border:1.5px dashed #35BD82}
.mft .mv-tag{display:flex;gap:14px;align-items:center}
.mft .mv-tag .cov{width:72px;height:72px;border-radius:12px;background:linear-gradient(135deg,#F2592E,#8C4FE0)}
.mft .mv-tag b{display:block;font-weight:400;font-size:16px;color:#E6E2DA}
.mft .mv-tag i{display:block;font-style:normal;font-size:13px;color:#8A867F;margin-top:2px}
@media (max-width:900px){.mft .ti-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.mft .ti-grid{grid-template-columns:1fr;gap:12px}.mft .ti-h h2{font-size:26px;line-height:31px}.mft .ti-card{border-radius:28px;padding:10px}.mft .ti-pv{border-radius:18px;height:170px}}
.mft .ti-h .gn-o{text-decoration:none;font-size:15px}
.mft .ti-card:focus-visible,.mft .ti-pv:focus-visible,.mft .gn-o:focus-visible{outline:2px solid #E6E2DA;outline-offset:3px}
@media (prefers-reduced-motion: reduce){.mft .ti-card{transition:none}}
.mft{padding:24px 72px 160px;box-sizing:border-box}
.pg .mft .ti-h{align-items:center;margin:0 0 20px}
@media (max-width:600px){.mft{padding:8px 16px 120px}}