.extended-controls {display:flex;gap:10px;flex-wrap:wrap;}
.extended-live {margin:16px 0;overflow-wrap:anywhere;}
.extended-live p {margin:5px 0;}
#liveValue {font-size:19px;}
#metrics div {flex:1 1 160px;min-width:0;}
.extended-records {list-style:none;margin:0 0 20px;}
.extended-records li {padding:10px 0;border-bottom:1px solid #e0e3e5;overflow-wrap:anywhere;}
.extended-records small {display:block;color:#555e65;}
.extended-records li.unconfirmed {border-left:3px solid #bb761a;padding-left:10px;}
#recordHeading {margin-top:24px;font-size:20px;}
.modifier-board {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:16px 0;}
.modifier-board .mac-key {min-height:70px;padding:9px 3px 20px;}
.modifier-board .mac-key span {white-space:pre-line;}
[data-mode="numpad"] #keyboardSurface {max-width:370px;margin:18px auto;}
[data-mode="numpad"] #keyboard {min-width:0;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(5,58px);gap:7px;}
[data-mode="numpad"] .mac-key {margin:0;}
[data-mode="numpad"] .mac-scroll-hint {display:none;}
@media(max-width:640px){#metrics div{flex-basis:44%;}.modifier-board{grid-template-columns:repeat(2,minmax(0,1fr));}.mac-page-header h1{font-size:24px;}}


[data-mode="repeat"] #keyboard,[data-mode="modifier"] #keyboard{grid-template-columns:repeat(97,minmax(0,1fr));min-width:1100px;}
[data-mode="repeat"] .mac-key,[data-mode="modifier"] .mac-key{font-size:12px;}
