.performance-settings{grid-column:1/-1;min-width:0;padding:20px;border:1px solid #b99cce;border-bottom:4px solid #30213e;border-radius:18px;background:linear-gradient(120deg,#4b395f,#2a213b);color:#eee3f5}
.performance-settings header{display:flex;justify-content:space-between;align-items:center;gap:16px}.performance-settings h3,.performance-settings h4{margin:0;color:#fff0c6}.performance-settings h4{font-size:15px}.performance-settings p{line-height:1.4;color:#d6c6e3}.performance-seal{font-size:38px;color:#f4db9a;padding:0 10px}
.performance-presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:16px 0}.performance-presets button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:64px;border:1px solid #b19ac5;border-bottom:4px solid #30233f;border-radius:12px;background:linear-gradient(#755685,#463156);color:#fff0d8;cursor:pointer}.performance-presets strong{font-size:18px}.performance-presets small{font-size:12px}.performance-presets button[aria-pressed=true]{background:linear-gradient(#fde6a9,#eace7e);color:#35291d;border-color:#fdeec3;border-bottom-color:#8e7e53}
.performance-resolution{display:grid;gap:3px;padding:12px 14px;border-radius:12px;background:#17132670}.performance-resolution>span{display:flex;justify-content:space-between;gap:10px;font-weight:bold}.performance-resolution output{color:#fde4a0}.performance-resolution input{width:100%;height:32px;accent-color:#f2d993;margin:0}.performance-resolution small{color:#d5c6e0;font-size:12px}
.performance-frame-limit{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:12px;padding:10px 14px;border-radius:12px;background:#17132655}.performance-frame-limit small{display:block;margin-top:4px;font-size:12px;color:#d5c6e0}.performance-frame-limit select{flex-shrink:0;min-height:40px;padding:6px 12px;border:1px solid #b99cce;border-radius:9px;background:#382b4c;color:#fff0d8;font:inherit}.performance-frame-limit select:focus-visible{outline:3px solid #ffe398;outline-offset:2px}
.performance-options{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}.performance-options section{display:flex;gap:12px;justify-content:space-between;align-items:center;min-width:0;padding:12px 14px;background:#17132655;border-radius:12px}.performance-options p{font-size:12px;margin:4px 0 0}.performance-options button{min-width:60px;flex-shrink:0}.performance-settings footer{margin-top:12px}.performance-settings footer p{font-size:12px;margin:0}.performance-settings footer small{display:block;margin-top:7px;font-size:12px;color:#f3e1ae}
#hex-performance-meter{position:fixed;z-index:180;bottom:8px;left:50%;transform:translateX(-50%);padding:5px 9px;border:1px solid #baa2ce66;border-radius:7px;background:#181326d9;color:#fdedc1;font:11px/1.2 ui-monospace,Consolas,monospace;white-space:nowrap;pointer-events:none}#hex-performance-meter[hidden]{display:none}
body.hex-screen-ui #hub-dialog[data-tab=settings] #hub-content .performance-presets button{min-height:64px!important}.performance-settings button:focus-visible{outline:3px solid #ffe398;outline-offset:2px}
@media(max-height:500px){.performance-settings{padding:12px}.performance-presets{margin:10px 0;gap:8px}.performance-presets strong{font-size:16px}.performance-presets small{font-size:11px}.performance-seal{font-size:28px}.performance-options{gap:8px;margin-top:8px}.performance-options section{padding:8px 10px}.performance-settings footer{margin-top:8px}.performance-resolution{padding:8px 10px}body.hex-screen-ui #hub-dialog[data-tab=settings] #hub-content .performance-presets button{min-height:52px!important}}
@media(max-width:500px){.performance-options{grid-template-columns:1fr}.performance-presets small{font-size:10px}.performance-seal{display:none}}

.performance-settings>header{position:static;inset:auto;min-height:0;height:auto;width:auto;padding:0;margin:0;border:0;background:none;box-shadow:none}
@media(max-height:500px){.performance-settings{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px}.performance-settings>header{display:none}.performance-presets{grid-column:1/-1;margin:0}.performance-frame-limit{margin:0;padding:8px;gap:8px}.performance-frame-limit small{font-size:11px}.performance-frame-limit select{max-width:135px;padding:4px}.performance-options{grid-column:1/-1;margin:0}.performance-settings footer{grid-column:1/-1;margin:0}.performance-settings footer p{display:none}.performance-settings footer small{margin:0}.performance-resolution{padding:8px}.performance-options section{padding:6px 8px}.performance-settings h4{font-size:13px}body.hex-screen-ui #hub-dialog[data-tab=settings] .performance-options p{font-size:11px!important;margin:2px 0!important}body.hex-screen-ui #hub-dialog[data-tab=settings] #hub-content .performance-presets button{min-height:44px!important}}

@media(min-height:501px){.performance-settings{padding:14px}.performance-presets{margin:12px 0}body.hex-screen-ui #hub-dialog[data-tab=settings] #hub-content .performance-presets button{min-height:56px!important}}

@media(max-height:500px){.performance-settings{gap:6px;padding:6px}.performance-settings footer{display:none}body.hex-screen-ui #hub-dialog[data-tab=settings] #hub-content .performance-resolution input[type=range]{height:28px!important}}

/* Settings reorganization (Oct 6): resolution and FPS limit share a row, Menu animations sits with the other
   animation choices, and the stutter report is one compact row. */
.performance-settings{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;align-items:stretch}
.performance-settings>header,.performance-presets,.performance-options,.performance-settings>pre,.performance-settings>footer{grid-column:1/-1}
.performance-presets,.performance-frame-limit,.performance-options,.performance-settings footer{margin:0}
.performance-settings>header p{margin:4px 0 0}
.performance-choice{display:flex;gap:6px;flex-shrink:0}
.performance-choice button{min-width:64px}
body.hex-screen-ui #hub-dialog[data-tab=settings] #hub-content .performance-choice button{min-width:64px;padding:8px 12px!important}
.performance-settings footer small{margin:0}
@media(max-width:700px){.performance-settings{grid-template-columns:minmax(0,1fr)}}
.performance-options .performance-animation-level{grid-column:1/-1}
.performance-animation-level>div:first-child{flex:1;min-width:0}
.performance-options .performance-report{grid-column:1/-1}