.color-dot-select{ position:relative; flex-shrink:0; display:inline-flex; }
.color-dot-trigger{
  width:12px; height:12px; border-radius:50%; border:none; padding:0; cursor:pointer;
  background:var(--dot-color); box-shadow:0 0 0 2px transparent; outline:none;
}
.color-dot-trigger:hover{ box-shadow:0 0 0 2px var(--md-neutral-background-2-rest); }
.color-dot-select.open .color-dot-trigger, .color-dot-trigger:focus-visible{
  outline:2px solid var(--ui-accent); outline-offset:3px;
}
.color-dot-menu{
  display:none; position:absolute; z-index:30; top:calc(100% + 6px); left:0; gap:6px; padding:8px;
  background:var(--md-color-grey-white); border:1px solid var(--ui-border); border-radius:10px; box-shadow:var(--shadow-soft);
}
.color-dot-select.open .color-dot-menu{ display:flex; }
.color-dot-option{
  width:18px; height:18px; border-radius:50%; border:2px solid transparent; padding:0; cursor:pointer; background:var(--dot-color); outline:none;
}
.color-dot-option:hover, .color-dot-option.active, .color-dot-option:focus-visible{ outline:2px solid var(--ui-accent); outline-offset:2px; }
.color-dot-select.is-mixed .color-dot-trigger{
  background:conic-gradient(var(--md-color-blue-500) 0 25%, var(--md-color-pink-500) 0 50%, var(--md-color-orange-500) 0 75%, var(--md-color-teal-500) 0);
}
.focus-visual-seg-thumb{ width:14px; height:14px; object-fit:contain; display:block; }
.prop-field > span .color-dot-select, .prop-field > span .ml-color-picker{ pointer-events:auto; }
.prop-field > span > .color-dot-select{ margin-right:6px; vertical-align:middle; }
.team-select-dot{ width:10px; height:10px; border-radius:50%; flex-shrink:0; background:var(--dot-color); }
.team-select-dot-empty{ background:var(--md-neutral-stroke-1-rest); }
.team-select-trigger{ width:100%; justify-content:flex-start; gap:8px; padding:9px; box-sizing:border-box; }
.team-select-trigger-label{ flex:1; min-width:0; text-align:left; font-size:var(--text-base); color:var(--ui-text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.team-select .icon-select-menu{ width:100%; min-width:0; box-sizing:border-box; }
.team-select .icon-select-option{ gap:8px; }

.date-field{ position:relative; display:inline-flex; align-items:center; gap:4px; flex-shrink:0; }
.date-field input{ cursor:pointer; }
.date-field-menu{
  display:none; flex-direction:column; position:absolute; z-index:30; top:calc(100% + 4px); left:0; width:220px; box-sizing:border-box; overflow-y:auto;
  background:var(--md-color-grey-white); border:1px solid var(--ui-border); border-radius:10px; box-shadow:var(--shadow-soft); padding:10px; gap:8px;
}
.date-field.open .date-field-menu{ display:flex; }
.date-field.flip-up .date-field-menu{ top:auto; bottom:calc(100% + 4px); }
.date-field.flip-left .date-field-menu{ left:auto; right:0; }
.date-field-menu-header{ display:flex; align-items:center; justify-content:space-between; }
.date-field-menu-title{ font-family:var(--font-sans); font-size:var(--text-md); font-weight:var(--font-weight-semibold); color:var(--ui-text); }
.date-field-nav{ width:20px; height:20px; border:none; background:none; color:var(--ui-muted); cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:var(--text-xs); border-radius:6px; }
.date-field-nav:hover{ background:var(--md-neutral-background-2-rest); color:var(--ui-text); }
.date-field-weekdays{ display:grid; grid-template-columns:repeat(7,1fr); font-family:var(--font-sans); font-size:var(--text-xs); color:var(--ui-muted); text-align:center; }
.date-field-days{ display:grid; grid-template-columns:repeat(7,1fr); gap:2px; }
.date-field-day{
  width:100%; aspect-ratio:1; border:none; background:none; border-radius:6px; cursor:pointer;
  font-family:var(--font-sans); font-size:var(--text-md); color:var(--ui-text);
}
.date-field-day:hover{ background:var(--md-neutral-background-2-rest); }
.date-field-day.is-today{ color:var(--ui-accent); font-weight:var(--font-weight-semibold); }
.date-field-day.selected{ background:var(--ui-accent); color:var(--md-color-grey-white); }
.date-field-day-empty{ cursor:default; pointer-events:none; }
.date-field-day:disabled{ opacity:.3; cursor:default; }
.date-field-day-range-start, .date-field-day-in-range{ background:rgba(0,64,222,0.1); }
.date-field-day-range-start{ font-weight:var(--font-weight-semibold); color:var(--ui-accent); }

.time-field{ position:relative; display:inline-flex; align-items:center; flex-shrink:0; }
.time-field input{ cursor:pointer; }
.time-field-menu{
  display:none; position:absolute; z-index:30; top:calc(100% + 4px); left:0; width:132px; box-sizing:border-box;
  background:var(--md-color-grey-white); border:1px solid var(--ui-border); border-radius:10px; box-shadow:var(--shadow-soft); padding:4px; gap:4px;
}
.time-field.open .time-field-menu{ display:flex; }
.time-field.flip-up .time-field-menu{ top:auto; bottom:calc(100% + 4px); }
.time-field.flip-left .time-field-menu{ left:auto; right:0; }
.time-field-col{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; max-height:224px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:none; }
.time-field-col::-webkit-scrollbar{ display:none; }
.time-field-col + .time-field-col{ border-left:1px solid var(--ui-border); padding-left:4px; }
.time-field-option{
  flex-shrink:0; border:none; background:none; border-radius:6px; padding:6px 0; text-align:center; cursor:pointer;
  font-family:var(--font-sans); font-size:var(--text-md); color:var(--ui-text); font-variant-numeric:tabular-nums;
}
.time-field-option:hover{ background:var(--md-neutral-background-2-rest); }
.time-field-option.selected{ background:var(--ui-accent); color:var(--md-color-grey-white); }