/* LCD controls, including the browser's native top-layer option menus. */
:root select {
  appearance:none;width:100%;min-width:0;min-height:42px;
  padding:10px 38px 10px 12px;border:1px solid #29497f;border-radius:2px;
  background:#6d96d8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23152a5c' d='M0 0h2v2h2v2h2V2h2V0h2v2H8v2H6v2H4V4H2V2H0z'/%3E%3C/svg%3E") no-repeat right 13px center;
  box-shadow:inset 0 1px #bddfff66,inset 0 -2px #26447933;
  color:var(--ink);font:400 12px/1.4 var(--font-ui);cursor:pointer;
  transition:background-color 120ms,border-color 120ms,box-shadow 120ms;
}
:root select:hover {background-color:#80a5e1;border-color:#193568}
:root select:focus-visible {outline:2px solid #d1eeff;outline-offset:2px;border-color:#183168}
:root select:disabled {opacity:.5;cursor:default}
:root select option {background:#233e77;color:#d2eaff;font:400 12px/1.4 var(--font-ui)}
@supports (appearance:base-select) {
  :root select,:root select::picker(select) {appearance:base-select}
  :root select {background-image:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding-inline:12px}
  :root select::picker-icon {
    content:'';width:10px;height:6px;flex:none;margin-left:auto;background:currentColor;
    clip-path:polygon(0 0,20% 0,20% 33%,40% 33%,40% 66%,60% 66%,60% 33%,80% 33%,80% 0,100% 0,100% 33%,80% 33%,80% 66%,60% 66%,60% 100%,40% 100%,40% 66%,20% 66%,20% 33%,0 33%);
  }
  :root select:open {background:#253f80;color:#d2eeff;border-color:#abcff1;box-shadow:inset 0 1px #8db9e84d}
  :root select:open::picker-icon {rotate:180deg}
  :root select::picker(select) {
    background:repeating-linear-gradient(0deg,#b2dcff09 0 1px,transparent 1px 3px),linear-gradient(#29477f,#1d356b);
    color:#d2eaff;border:1px solid #a0c7ec;border-radius:2px;
    box-shadow:0 0 0 2px #2c3546,0 10px 24px #09132c66;
    padding:5px;margin-block:6px;max-block-size:min(320px,60dvh);max-inline-size:calc(100vw - 32px);
    overflow:auto;scrollbar-width:thin;scrollbar-color:#9cbee5 #223d73;
    font:400 12px/1.4 var(--font-ui);
  }
  :root select option {
    display:flex;align-items:center;gap:12px;min-height:40px;padding:10px 12px;
    background:transparent;color:#d2eaff;border:0;border-radius:1px;cursor:pointer;
    text-shadow:0 0 4px #b8e4ff30;white-space:normal;
  }
  :root select option+option {border-top:1px solid #b4d7fc19}
  :root select option:hover,:root select option:focus {background:#668fce;color:#0e2250;outline:1px solid #b8deff66;outline-offset:-1px;text-shadow:none}
  :root select option:checked {background:#b9dcee;color:#102552;box-shadow:inset 3px 0 #edfbff;text-shadow:none}
  :root select option::checkmark {content:'';width:6px;height:6px;background:currentColor;flex:none}
}
/* Expandable panels use the same small stepped arrow instead of OS markers. */
:root details>summary {
  display:flex;align-items:center;gap:10px;min-height:38px;padding:9px 11px;
  list-style:none;border:1px solid #294d8b70;border-radius:2px;
  background:#9bc2ed22;text-decoration:none;
}
details>summary::-webkit-details-marker {display:none}
:root details>summary:hover {background:#b0d1f13b}
:root details>summary::after,:root details.recap-section>summary::after {
  content:'';width:8px;height:6px;flex:none;margin-left:auto;background:currentColor;
  clip-path:polygon(0 0,25% 0,25% 33%,50% 33%,50% 66%,75% 33%,75% 0,100% 0,100% 33%,75% 66%,50% 100%,25% 66%,0 33%);
}
:root details[open]>summary::after {rotate:180deg}
:root details[open]>summary {background:#a5ccef38}
.gym-form {grid-template-columns:80px minmax(0,1fr)}
.muscle-picker {grid-column:1/-1;min-width:0;margin:0;padding:0;border:0}
.muscle-picker legend {font:400 11px var(--font-ui);margin-bottom:9px}
.muscle-choices {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.muscle-choices label {position:relative;display:block;margin:0;cursor:pointer;min-width:0}
.muscle-choices input {position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.muscle-choices span {display:flex;align-items:center;justify-content:center;min-height:42px;padding:7px 5px;border:1px solid #2c4e8c;border-radius:2px;background:#9bc2ed30;color:var(--ink);font:400 11px/1.4 var(--font-ui);box-shadow:inset 0 1px #bedcff4d}
.muscle-choices label:hover span {background:#add0f15c}
.muscle-choices :checked+span {background:#253f80;color:#d2edff;border-color:#b3d7f1;box-shadow:inset 0 -3px #b3dfff,inset 0 1px #91b8e34d;text-shadow:0 0 4px #b5e4ff3b}
.muscle-choices :focus-visible+span {outline:2px solid #d1eeff;outline-offset:2px}
.gym-form #log-sets {width:100%;align-self:end;min-height:42px}
.gym-form #gym-sets {border-radius:2px}
.gym-group-heading .no-target {font:400 10px var(--font-ui)}
@media(max-width:600px) {
  .muscle-choices {grid-template-columns:repeat(3,minmax(0,1fr))}
  .gym-form .primary-button {grid-column:auto}
}