.workspace-toolbar{display:flex;align-items:center;gap:10px!important;flex-wrap:wrap;min-width:0;max-width:100%;font-size:calc(13px + var(--ui-font-increase, 2px))}
.layout-controls{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.layout-controls label{display:flex;align-items:center;gap:7px}.layout-controls select{padding:6px;max-width:230px;border:1px solid #b6c5ba;border-radius:4px;background:white;color:inherit}.layout-working{font-size:calc(11px + var(--ui-font-increase, 2px));color:#637567;max-width:230px;overflow-wrap:anywhere}
.panel-picker{position:relative}.panel-picker summary{list-style:none;cursor:pointer;padding:7px 12px;background:#225e50;color:white;border-radius:5px;user-select:none;white-space:nowrap}.panel-picker summary::-webkit-details-marker{display:none}.panel-picker summary:focus-visible{outline:2px solid #2476c8;outline-offset:2px}
.panel-picker-popup{position:absolute;right:0;top:calc(100% + 9px);z-index:1000;width:min(640px,calc(100vw - 32px));max-height:70vh;overflow:auto;background:white;border:1px solid #bccfc2;border-radius:9px;box-shadow:0 8px 30px #16372830;padding:15px}
.panel-search-label{display:flex;flex-direction:column;gap:5px;color:#586e60;font-size:calc(12px + var(--ui-font-increase, 2px))}.panel-search-label input{padding:8px 10px;border:1px solid #c3d2c8;border-radius:5px;width:100%}
.panel-picker-groups{display:block;column-count:2;column-gap:18px;margin-top:12px}.panel-picker-groups>section{display:inline-block;width:100%;break-inside:avoid;margin:0 0 20px;vertical-align:top}.panel-picker-groups h3{font-size:calc(11px + var(--ui-font-increase, 2px));text-transform:uppercase;letter-spacing:.6px;color:#60796a;margin:0 0 5px}.panel-picker-groups button{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;border:0!important;background:white;text-align:left;padding:8px!important;font-size:calc(13px + var(--ui-font-increase, 2px))!important}.panel-picker-groups button:hover{background:#edf4ef}.panel-picker-groups small{font-size:calc(10px + var(--ui-font-increase, 2px));color:#668071}.panel-picker-groups [hidden]{display:none!important}
.layout-dialog{border:1px solid #c1d2c7;border-radius:10px;box-shadow:0 16px 70px #162f3c50;padding:24px;width:min(450px,calc(100vw - 30px));color:#263b30}.layout-dialog::backdrop{background:#122f3c66}.layout-dialog h2{font-size:20px;margin:0 0 10px}.layout-dialog-note{font-size:calc(13px + var(--ui-font-increase, 2px));line-height:1.6;color:#5d7365}.layout-name-label{display:flex;flex-direction:column;gap:6px;font-size:calc(13px + var(--ui-font-increase, 2px))}.layout-name-label[hidden]{display:none}.layout-name-label input{padding:8px;border:1px solid #b2c7b9;border-radius:4px}.layout-dialog-error{font-size:calc(12px + var(--ui-font-increase, 2px));color:#a12732;min-height:18px}.layout-dialog-actions{display:flex;justify-content:flex-end;gap:8px}.layout-dialog [type=submit]{background:#225e50;color:white;border-color:#225e50}
@media(max-width:1000px){.workspace-toolbar{margin-left:0!important;flex-basis:100%}.panel-picker-popup{left:0;right:auto}}@media(max-width:480px){.panel-picker-groups{column-count:1}.layout-controls select{max-width:160px}.layout-working{max-width:100%}}

.workspace-settings{display:inline-flex;align-items:center;justify-content:center;padding:5px!important;flex:none}

/* Match the homepage banner while keeping replay controls legible. */
.app-header{position:relative;z-index:20;min-height:60px;padding:10px 16px;gap:12px 16px;background:#104e3f;color:#eef6f1;border-bottom:1px solid #0b3d31}
.app-header .replay-brand{flex:0 0 auto;line-height:0;margin:0}
.replay-brand a{display:block;border-radius:3px}
.replay-brand img{display:block;width:168px;height:auto}
.app-header #category-form{flex-wrap:wrap;min-width:0;gap:8px}
.app-header #category-id,.app-header .layout-controls select{background:#f7faf7;color:#193d30;border-color:#b6cfc2;min-height:32px}
.app-header button{background:#f7faf7;color:#193d30;border-color:#b6cfc2;min-height:32px}
.app-header button:hover:not(:disabled){background:#e4f0e8;border-color:#d1e6d9}
.app-header button:disabled{opacity:.6}
.app-header #category-name{color:#dcece3}
.app-header .layout-working{color:#d0e4d8}
.app-header .panel-picker summary{background:#256956;border:1px solid #6b9b88;padding:7px 12px}
.app-header .panel-picker summary:hover{background:#307b66}
.app-header .panel-picker-popup{color:#203327}
.app-header nav>a{display:inline-flex;align-items:center;min-height:32px;padding:5px 8px;border-radius:4px;color:#f1f8f3;font-size:calc(12px + var(--ui-font-increase, 2px));text-decoration:none;white-space:nowrap}
.app-header nav>a:hover{background:#ffffff18;text-decoration:underline}
.app-header :is(button,select,input,a,summary):focus-visible{outline:2px solid #ffbd78;outline-offset:3px}
@media(max-width:1000px){.app-header .workspace-toolbar{padding-top:8px;border-top:1px solid #ffffff24;width:100%}}
@media(max-width:650px){.app-header{padding:9px 12px;gap:10px}.replay-brand img{width:140px}.app-header #category-form{flex:1}.app-header #category-id{width:140px}.app-header #category-form label{font-size:calc(11px + var(--ui-font-increase, 2px))}}

.layout-menu{position:relative}.layout-menu>summary{list-style:none;display:flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid #6b9b88;border-radius:4px;background:#256956;color:white;font-size:24px;line-height:1;cursor:pointer;user-select:none}.layout-menu>summary::-webkit-details-marker{display:none}.layout-menu>summary:hover{background:#307b66}.layout-menu-popup{position:absolute;right:0;top:calc(100% + 7px);z-index:1000;min-width:175px;padding:6px;background:#fff;border:1px solid #bccfc2;border-radius:6px;box-shadow:0 8px 24px #16372830}.app-header .layout-menu-popup button{display:block;width:100%;padding:9px 12px;border:0;border-radius:3px;background:#fff;text-align:left;white-space:nowrap}.app-header .layout-menu-popup button:disabled{opacity:1;color:#87958d;cursor:not-allowed}

#course-summary{color:#eef6f1;font-size:calc(13px + var(--ui-font-increase, 2px));white-space:nowrap;font-variant-numeric:tabular-nums}

.app-header #upload-my-track{color:#fff;text-decoration:none;white-space:nowrap}
.app-header #upload-my-track:hover{text-decoration:underline}
